.toggleWidth {
    width: 0px!important;
}

#container {
    height: 100vh;
    display: flex;
    flex-wrap: wrap;
    flex-basis: 0;
}
#chatAndUserContainer{
    display: flex;
    width: 100%;
    height:calc(100% - 70px);

}
.open #chatContainer, #chatContainer {
    width: 100%;
    padding: 0px 5px !important;
    height:100%;
}
#usersContainer {
    width: 320px;
    display: block;
    position: relative;
    flex-shrink: 0;
}
#header {
    width: 100%;
    height:70px;
}
.open #footer, #footer {
    width: 100%;
    height:60px;
}

div.message img.userItem {
    height: 40px;
    max-width: 100%;
    max-height: 100%;
    margin-right: 5px;
}
#slide_block {
    margin-left: -30px;
    left: 0px;
}
#chatInputContainer {
    width: 100% !important;
}

@media (max-width:850px){
    #usersContainer {
        width: 0px;
    }
    .toggleWidth {
        width: 320px!important;
    }
}

@media (max-width:480px){
    #roomsContainer2 #tableRooms td, #roomsContainer2 #tableRooms th{
        font-size: 10px!important;
        line-height: 13px;
    }
    .emojionearea .emojionearea-editor:empty:before {
        font-size: 11px;
    }

    #usersContainer {
        width: 0px;
    }
    .toggleWidth {
        width: 300px!important;
    }
    #chatContainer.opacity0 {
        opacity: 0.1;
        transition-duration: 0.5s;
    }
    #chatContainer.opacity0 #tabs,     #chatContainer.opacity0 #footer {
        display: none!important;
    }
}