/* @import url("UtitbestChatInterface.css"); */

*{
    padding: 0;
    box-sizing: border-box;
    margin: 0;
}
@media only screen and (max-width:1000px) {
    .videoplayer{
        width: 90%;
    }
    .Videotimer_com{
        right: 44% !important;
        bottom: 7% !important;
    }
}

@media only screen and (max-width:950px) {
    aside{
        width: 6%;
    }
    main{
        width: 94%;
    }
    main .user{
        width: 40%;
    }
    main .chat_area{
        width: 60%;
    }
    .preview{
        right: -2em;
    }
    .flowsa{
        max-width: 95%;
    }
    .inputing .selmm{
        width: 95%;
    }
}
@media only screen and (max-width:900px){
    aside{
        width: 7%;
    }
    main{
        width: 93%;
    }
    .preview{
        right: -4em;
    } 
}
@media only screen and (max-width:850px){
    .followby :is(div.frocalliconsmore){
        display: none;
    }
    .currentchatterinfor {
        width: 100%;
    }
}
@media only screen and (max-width:750px){
    main{
        width: 90%;
    }
    aside{
        width: 10%;
        background-color: #eee;
    }
    main .chat_area{
        width: 55%;
    }
    main .user{
        width: 45%;
    }
    .inputing1 i{
        font-size: 1.2em;
    }
}
@media only screen and (max-width:730px){
    main .user{
        width: 100%;
    }
    main .chat_area{
        display: none;
    }
    .individualchat{
        z-index:15 ;
    }
    .tamesam{
        bottom:0 !important;
        position: unset !important;
    }
    .currentchatterinfor{
        margin-bottom: 1em;
    }
    .signs{
        display: none !important;
    }
}
@media only screen and (max-width:570px){
    aside{
       position: absolute;
       left: -100em;
       top: 0;
       display: flex;
       z-index: 10;
       transition: 0.2s linear;
       width: 52px;
    }
    .user .navbar {
        justify-content: space-around;
    }
    .navbar :is(.newsmargin) {
        margin-right: 5px;
        width: 80%;
    }
    .ToPopChampange{
        display: flex;
        margin: 0 5px;
    }
    main{
        width: 100%;
    }
    .chattername{
        width: 60%;
    }
}

@media only screen and (max-width:470px){
    .navbar :is(.newsmargin){
        width: 74%;
    } 
    .secondusers .individualchat{
        height: 62px;
    }
    .steeze1{
        left: 1%;
    }
    .settingsPopup{
        width: 100%;
        height: 100%;
        bottom: 0;
    }
    
    .Profile_i {
        padding: 0;
        width: 93%;
        justify-content: center;
    }
    .settingsPopup1 .contnet2{
        justify-content: center;
    }
    .Chat{
        padding-top:47% ;
    }
    .vid_voce {
        padding-top: 45%;
    }
    .Customize p{
        top: 2.1em;
    }
    
    .namecoms .informs{
        margin-top:2em !important;
    }
    .preview{
        width: 100%;
        bottom: 13%;
        right: -2em;
    }
}
@media only screen and (max-width:400px){
    .towrapImage{
        height: 300px;
        width: 255px;
    }
    .videoman{
        font-size: 34px;
    }
    .videoMessageTag{
        height: 300px;
        width: 255px;
    }
    .listOfcontents p{
        display: none;
    }
    .settingsPopup1 .contnet1 .listOfcontents{
        padding: 1em 0;
    }
    .settingsPopup1 .contnet1{
        width: 15%;
        padding: .2em;
    }
    .settingsPopup1 .contnet2{
        width: 85%;
    } 
}
@media only screen and (max-width:360px){
    .towrapImage {
        height: 270px;
        width: 220px;
    }
    .videoMessageTag{
        height: 270px;
        width: 250px;
    }
    .inputing{
        width: 75% !important;
    }
    .inputing .selmm button{
        padding: 9px 5px !important;
        margin: 0 !important;
    }
    .inputing .selmm .emojisicons {
        width: 13%;
    }
}
@media only screen and (max-width:330px){
    .audiomessageTag{
        width: 240px;
    } 
}