html,body {
    width: 100%; height: 100%; margin: 0; padding: 0; overflow: auto;
    font-family: "Droid Sans", "Liberation Sans", "DejaVu Sans", "Segoe UI", Sans;
    font-size: 12pt; font-weight: normal;
    background: #54296b; color: #FFF;
}
* { box-sizing: border-box; }
*:focus { outline: none !important; }

a:link, a:visited { color: #e9ff2f; text-decoration: none; }
a:hover, a:active { color: #38edff; }

.tbl { display: table; width: 100%; /*height: 100%;*/ table-layout: fixed; max-width: 100%; }
.tr { display: table-row; }
.td { display: table-cell; vertical-align: top; }

.tbl .stbl { height: 100%; }

hr {
    height: 4px;
    border: 0;
    background: #3fff00;
}

input {
   -webkit-appearance: none;
   -moz-appearance: none;
}

input[type="button"], input[type="submit"] {
    padding: 12px 18px;
    cursor: pointer;
    border-radius: 10px;
    border: 2px solid #1ed6bc;
    color: #FFF;
    background: #1877c7;
}
input[type="button"]:hover, input[type="submit"]:hover {
    border: 2px solid #3fd651;
    background: #a511d6;
}

input[type="text"], input[type="password"], textarea {
    font-size: 10pt;
    padding: 4px;
    border: none;
    border-bottom: 1px solid #FFF;
    color: #FFF;
    background: transparent;
}
textarea {
    min-height: 100px;
    width: 100%;
    resize: vertical;
    border: 1px solid #f0f;
}

input[type="file"] { width: 100%; height: 100%; background: #F8117E; }
#filsel {
    display: table-cell; text-align: center;
    background: #F8117E; cursor: pointer;
    width: 100%; height: 100%; vertical-align: middle;
    border: 1px solid #f0f;
}

#bar {
    width: 100%;
    padding: 4px;
    position: relative;
}
#bar #progress {
    width: 0%; height: 100%;
    white-space: nowrap;
    background: #41d8a7;
    position: absolute; top: 0; left: 0;
}
#bar #status {
    width: 100%;
    padding: 4px;
    /*position: absolute; top: 0; left: 0;*/
    visibility: hidden;
}
#bar #status_front {
    /*color: #111;*/
    width: 100%;
    padding: 4px;
    position: absolute; top: 0; left: 0;
}

/*.sidebar { width: 200px; min-width: 100px; }*/

/*
#wrap { width: 100%; height: 100%; display: flex; position: absolute; z-index: 9; }
#wrap #box { padding: 128px; background: #111113; margin: auto; display: inline-block; position: relative; }*/

.obox {
    height: 100%;
    padding: 24px;
}
.box {
    background: #F8117E;
    color: #FFF;
    border-radius: 10px;
    box-shadow: 0 0 21px 21px #7851b7;
    border: 3px solid #3fd651;
    height: 100%;
}
.box .pad18 {
    padding: 18px;
    overflow: auto;
    width: 100%;
    word-break: break-word;
}

#thumb {
    display: none; position: fixed; pointer-events: none;
    width: 200px; height: 200px;
    background: #f00;
}
.icon {
    max-width: 21px;
    max-height: 21px;
}

#filetable {
    text-align: left;
}
#filetable .tr {
    border-bottom: 1px solid #FFF;
    border-radius: 2px;
}
#filetable .td {
    white-space: nowrap;
    vertical-align: middle;
}
#filetable .sname, #filetable .stime {
    overflow: hidden;
    text-overflow: ellipsis;
}
#filetable .tr:hover:not(.nohover) {
    background: #8028b7;
    cursor: pointer;
}
#filetable .selected {
    background: #28b74d;
}

#preview_name {
    color: #29f939;
    font-weight: bold;
}
#preview_buttons {
    display: none;
}
#preview_stats {
    display: none;
}
#preview_mime {
    color: #ffbcf1;
}
#preview_size {
    color: #ffd881;
}
#preview_time {
    color: #7a00ff;
    font-weight: bold;
}
#preview {
    color: #ffabff;
}
#shareopen {
    display: none;
}
#sharelink {
    color: #ffc800;
}
#rename_box {
    width: 100%;
}