.btn-thin {

}

.accordion-flush .accordion-button.collapsed {
    background-color: #303030 !important;
}

.clr-field {
    display:block !important;
}

#app {
    width: 100%;
    height: 100vh;
}

#chat .msg {
    padding: 4px 10px 4px 10px;
}

#chat .msg.odd {
    background-color: #00000033;
}

.offcanvas {
    background-color: rgb(80, 40, 40);
}

#memberlist {
    /*padding-top: 5px;*/
    /*background-color: rgb(80, 40, 40);*/
    /*position: fixed;*/
    /*height: 100%;*/
    /*right: 0;*/
    /*overflow: auto;*/
}

#memberlist ul {
    list-style: none;
    overflow: auto;
    padding-left: 1rem;
}

#roomselect p {
    margin-bottom: 5px;
}

#messagebox {
    background-color: black;
    position: fixed;
    bottom: 0;
    padding: 0 5px;
}

body, #messagebox, .navbar {
    transition: padding-right 0.3s ease-in-out;
}

.offcanvas {
    width: 220px !important;
}
body.offcanvas-open, body.offcanvas-open #messagebox, body.offcanvas-open .navbar {
    padding-right: 220px;
}

#messagebox .row {
    padding: 5px;
}
#messagebox .btn-primary {
    margin-right: 10px;
    margin-left:-10px;
}

#app .padding {
    margin-bottom: 64px;
}

/*@media (max-width: 768px) {*/
/*    #app .padding {*/
/*        margin-bottom: 160px;*/
/*    }*/
/*}*/
/*@media (max-width: 576px) {*/
/*    #app .padding {*/
/*        margin-bottom: 220px;*/
/*    }*/
/*}*/

.chat-action {
    cursor: pointer;
}

#chat .msg .time {
    font-weight: bold;
    font-family: 'Courier New', Courier, monospace;
    margin-right: 5px;
}

#chat .msg .author {
    font-weight: bold;
}

#chat .msg .author::after {
    content: ':';
    margin-right: 10px;
}

.author {
    cursor: pointer;
}

.actions .btn {
    margin: 5px;
}

@media (min-width:575.98px) {
    #profileModal .modal-dialog {
        max-width: 80%;
    }
    #settingsModal .modal-dialog {
        max-width: 50%;
    }
}