* { box-sizing: border-box; }
*:focus { outline: none !important; }

hr { background: #80757D; border: 0; height: 2px;}

a:link, a:visited { color: #efa309; text-decoration: none; /*cursor: text;*/ cursor: pointer; }
a:hover, a:active { /*color: #FC62D3;*/ text-decoration: underline; }

.tbl { display: table; width: 100%; height: 100%; table-layout: fixed; }
.tr { display: table-row; }
.td { display: table-cell; vertical-align: middle; border: 0px solid #f0f; }


#main { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

#topframe { height: 36px; cursor: default; background: #4b3c44; white-space: nowrap; }
    /*.tabbtn { height: 36px; border: 0; cursor: pointer; }*/

    .tabbtn { /*height: 36px;*/ border: 0; cursor: pointer;/* padding: 8px 8px;*/ }
    .tabbtn.selbtn { background: #2a1e27; }
#middleframe { height: auto; }
    #mainframe { width: auto; vertical-align: top; position: relative; }
        #chatframe, #userframe, #settingframe, #filesframe, #emojiframe {
            position: fixed;
            top: 36px; right: 0; bottom: 36px; left: 0;
            overflow-y: auto;
        }
            #chatlog, #userlist, #settings, #files, #emojis {
                width: 100%; height: auto;
                overflow-y: hidden; padding: 8px 4px;
                word-wrap: break-word;
                vertical-align: top;
                
            }
            #userframe, #settingframe, #filesframe, #emojiframe { display: none; }
                .pm { cursor: pointer; }
                .user:hover, .pm:hover, .url:hover { text-decoration: underline; }
                .url { color: #FCBF62; }
                .lag { font-style: italic; color: #80757D; }
                /*.url { color: #7F7F7F !important; }*/
            #chatlog > span, #userlist > span { display: block; }
#bottomframe { height: 36px; background: #4b3c44; }
	#inputframe { width: auto; }
		#txtinput { width: 100%; height: 36px; }
	/*#emojiframe { width: 36px; }*/
	#submitframe { width: 75px; }
        #btnsubmit { width: 100%; height: 100%; height: 36px; }

#adminfeatures { display: none; }

input, select { background: #4b3c44; color: #dccbbe; padding: 0px 8px; border: 0; height: 36px; }
input[type="button"] { cursor: pointer; height: 36px; }

.listbox {
    display: inline-block; min-width: 300px; min-height: 36px;
    background: #4b3c44;
    list-style: none;
    margin: 0; padding: 8px;
}
/*ul > li > a { display: block; width: 100%; white-space: nowrap; }

#menu, #link {
    display: inline-block; min-width: 200px;
    background: #4b3c44;
    list-style: none;
    margin: 0; padding: 8px;
    z-index: 9;
    position: absolute;
    display: none;
}*/
ul > li > a { display: block; width: 100%; white-space: nowrap; padding: 0 8px; }

#menu, #link {
    display: inline-block; /*min-width: 200px;*/
    background: #4b3c44;
    list-style: none;
    margin: 0; padding: 8px 0px;
    border: 1px solid #80757D;
    border-radius: 2px;
    z-index: 9;
    position: absolute;
    display: none;
    overflow: auto;
    max-height: 100%;
    text-shadow: none !important;
}
#menuUser, #mUI0, #mUI1, #mUI5, #mUI9, #mUI13, #mUI16, #mUI19, #mLI10 { padding: 0 8px; }



#link { width: 200px; }
#link > li {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.menu {
    display: inline-block; cursor: default; position: relative;
    color: #DCCBBE; background: transparent; text-shadow: none !important;
}
.menu span { display: inline-block; padding: 8px; }
.menu ul {
    display: flex; flex-flow: wrap; list-style: none; margin: 0; padding: 0;
    visibility: hidden; opacity: 0; position: absolute; right: 0;
    z-index: 10; background: #17181A; text-align: left;
    /*transition: .2s ease;*/
    border: 1px solid #80757D; border-radius: 2px;
}
.menu ul li { white-space: nowrap; width: 100%; display: inline-block; }
.menu:hover ul { visibility: visible; opacity: 1; }

.menu a:link, .menu a:visited { display: inline-block; width: 100%; color: #DCCBBE; padding: 8px; }
.menu a:hover, .menu a:active { color: #DCCBBE; text-decoration: none; }

#link { width: 200px; }
#link > li {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.red { color: #FC6271; }
.green { color: #80FC62; }
.yellow { color: #FCBF62; }
.grey { color: #a28d8a !important; display: inline-block; }


.dark { color: #80757D; }
.light { color: #2a1e27; background: #FCBF62; padding: 2px; border-radius: 2px; }

#bar { display: inline-block; width: 100%; height: 36px; background: transparent; color: #2a1e27; white-space: nowrap; }
#progress { display: inline-block; width: 0%; height: 100%; line-height: 36px; background: #80FC62; transition: width .2s ease; }
#filestat { display: none; }
#filelist { white-space: nowrap; }
#filsel {
    display: block; text-align: center;
    width: 100%; height: auto;
    background: #4b3c44;
    cursor: pointer;
}

/*#emojis {
    position: fixed; bottom: 36px; right: 0;
    width: 235px; height: 150px; background: #4b3c44;
    padding: 12px; display: none; font-size: 10pt !important;
}*/
/*#emojis > a > img {
    padding: 0 2px;
}*/

.msgs { table-layout: auto; height: auto; line-height: 115%; }
.msgs, .msgs > .tr { width: 100%; }
.msgs > .tr > .td:nth-child(1) {
    width: auto; white-space: nowrap;
    vertical-align: top; padding-right: 2px;
}
.msgs > .tr > .td:nth-child(2) { 
    width: 100%; height: auto;
    overflow-y: hidden; padding: 0;
    word-wrap: break-word;
    vertical-align: top;
}

/*.msgs > .tr > .td > span > a > img { vertical-align: text-top; }*/
/*#chatlog > span > span > a > div { vertical-align: text-top; }*/
#chatlog > span > span > a > div { vertical-align: text-bottom; }
#chatlog > span > span:nth-child(1), #chatlog > span > .pm, #chatlog > span > .to, #chatlog > span > .user { vertical-align: top; }
/*.user { font-weight: bold; }
#chatlog > span > span:nth-child(2) { font-weight: bold; }*/

#newmsg {
    position: fixed; top: 36px; left: 0; width: 100%; height: auto;
    background: #1A161A; padding: 12px 8px; /*line-height: 100%;*/ z-index: 1;
    opacity: 0; visibility: hidden; transition: opacity .2s ease;
    white-space: nowrap; overflow: hidden; cursor: default;
}

.br { height: 8px; }
.fcpick { height: 22px !important; }
.padl { padding-left: 18px; display: block; }
#faq { display: none; }
b { text-decoration: underline; }