.ebinboard,
.new {
    display: none !important;
}

body {
    background: var(--background-color);
    color: var(--text-color);
    margin: 0;
}

a {
    text-decoration: underline;
}

#sidebar {
    font-size: 12px;
    padding: 8px;
    background-color: var(--sidebar-background-color);
    width: 200px;
    top: 0;
    font-family: sans-serif;
}

#sidebar h1,
#sidebar h2 {
    background: var(--news-background-color);
    color: var(--sidebar-color);
}

.topnav {
    display: flex;
    justify-content: space-between;
}

.postarea {
    display: flex;
    justify-content: center;
    clear: both;
}

.postarea.qr-floating {
    justify-content: start;
}

.postarea.qr-floating #postform {
    border: 1px solid var(--border-color);
    border-left: none;
    border-top: none;
    background: var(--post-background-color);
    margin: 10px;
}

#reply-indicator {
    justify-content: space-between;
    font-weight: bold;
    background: var(--postblock-background-color);
    border: 1px solid var(--postblock-border-color);
    padding: 0 4px;
}

#reply-indicator-close {
    text-decoration: none;
}

.postarea.qr-floating #postform .postblock, 
.postarea.qr-floating #postform .rules {
    display: none;
}

.postarea.qr-floating #postform *::placeholder {
    color: var(--text-color) !important
}

.postarea.qr-floating table.extra {
    width: 100%;
}

.postarea.qr-floating table.extra input[type="password"],
.postarea.qr-floating #postform input[type="text"] {
    width: 100%;
    box-sizing: border-box;
}

.postarea.qr-floating #postform input[name="embed"], 
.postarea.qr-floating #postform input[name="subject"] {
    width: calc(80% - 4px);
}

.postarea.qr-floating #postform select[name="embedtype"],
.postarea.qr-floating #postform input[type="submit"] {
    width: 20%;
}

.postarea.qr-floating #postform input[type="submit"] {
    padding: 0px 6px;
}

.postarea.qr-floating #postform .dropzone {
    max-width: 100%;
}

.postarea.qr-floating #postform tr,
.postarea.qr-floating #postform td {
    display: block;
    padding: 0px;
}

.postarea.qr-floating summary {
    padding-left: 4px;
}

.dropzone {
    border: 1px solid var(--input-border)
}

.postarea select[name="board"] {
    max-width: 325px;
    width: 100%;
}

.rules {
    font-size: 10px;
}

.postcontainer {
    display: flex;
}

.sidearrows {
    color: var(--border-color);
    margin: 0 2px;
}

.post {
    display: table;
    background: var(--post-background-color);
    margin: 2px 0;
    padding: 2px;
    border-right: 1px solid var(--post-border-color);
    border-bottom: 1px solid var(--post-border-color);
}

.reply-preview .op {
    background: var(--background-color);
    padding: 4px;
    clear: both;
}

.reply-preview .op .clear {
    display: block;
    clear: both;
}

.filesize {
    max-width: unset !important;
    display: block;
}

.fileinfo .classic.left {
    margin-right: -4px;
}

.fileinfo .classic.right {
    margin-left: -4px;
}

.file-nav {
    float: left;
    padding: 0 4px;
    font-size: 0.9em;
}

.file-nav a {
    font-size: 0.8em;
}

.file-expanded.audio-expanded {
    width: fit-content;
}

.posterid {
    text-decoration: none;
    margin-right: -4px;
}

#notificationsContainer {
    font: var(--board-font)
}

#notificationsContainer .last button,
.quickbuttons .button,
.quickbuttons button {
    background: #133b5e;
    color: #fff;
    border: none;
}

#notificationsContainer .last button {
    height: 16px;
    width: 16px;
    font-size: .0em;
}

#notificationsContainer .last button[onclick="return toggleNotifications();"] {
    background-image: url(/static/img/quickbuttons/notifications_hide.gif);
}

#notificationsContainer #desktopNotifications {
    background-image: url(/static/img/quickbuttons/notifications.gif);
}

.quickbuttons .hide {
    background-image: url(/static/img/quickbuttons/hide.gif);
}

.quickbuttons .watch {
    background-image: url(/static/img/quickbuttons/watchthread.gif);
}

.quickbuttons .expand {
    background-image: url(/static/img/quickbuttons/expand.gif);
}

.quickbuttons .quickreply {
    background-image: url(/static/img/quickbuttons/quickreply.gif);
}

.quickbuttons .dropdown-toggle.icon {
    background: transparent;
    color: var(--text-color)
}

.quickbuttons .dropdown-toggle.icon.active,
.quickbuttons .dropdown-toggle.icon:hover {
    color: var(--link-hover-color);
    filter: none;
}

.quickbuttons .quickreply::before,
.quickbuttons .expand::before,
.quickbuttons .watch::before,
.quickbuttons .hide::before {
    display: none !important;
}

#notificationsContainer .last button:hover,
.quickbuttons .button:hover,
.quickbuttons button:hover {
    opacity: 0.8;
}

#notificationsContainer .last button.active,
#notificationsContainer .last button:active,
.quickbuttons .button:active,
.quickbuttons button:active,
.quickbuttons button.active {
    filter: invert(100%);
}

.quickbuttons {
    align-items: center;
}

.admin_tag {
    color: purple;
}

.mod_tag,
.supermod_tag {
    color: red;
}

.admin_tag::before,
.mod_tag::before,
.supermod_tag::before {
    content: "## "
}

.admin_tag::after,
.mod_tag::after,
.supermod_tag::after {
    content: "## "
}

.you_tag::before,
.op-tag::before {
    content: "("
}

.you_tag::after,
.op-tag::after {
    content: ")"
}

.op-tag {
    color: var(--postername-color);
}

.file-expand {
    float: left;
    margin: 4px 20px;
}

.threadview .bottom-nav,
.top-nav,
.bottom {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.threadview .bottom {
    display: block
}

.bottom .right.classic {
    display: flex;
    align-items: center;
    gap: 4px;    
}

.pagelink {
    background: var(--post-background-color);
    border-right: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
}

.thread img.catalog-thumb {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
}

.catalog-post {
    border-radius: 2px;
}


body.home {
    font-size: 12px;
    margin: auto;
    font-family: sans-serif;
    background: var(--background-color);
    color: var(--frontpage-text-color);
    width: calc(90% - 216px);
    padding: 8px;
    padding-left: 224px;
}

.home .logo {
    font-family: Verdana, Tahoma, sans-serif;
    font-weight: 700;
}

h2.home {
    margin-top: 0;
    font-size: 12px;
    padding: 1px 5px;
    background: var(--news-background-color);
    color: var(--sidebar-color);
}

#sidebar h2 .nocolor,
h2.home .nocolor {
    color: var(--sidebar-color);
}

h2.home#boards {
    margin-bottom: 0;
}

.newslink a {
    text-decoration: none;
}

.content {
    word-wrap: break-word;
}


.tab {
    display: block;
    padding: 3px 10px 2px;
    border: 1px solid var(--tab-border-color);
    border-left: 0;
    border-color: var(--tab-border-color) !important;
    background: var(--tab-background-color);
}

.tab-active {
    border-bottom: 0;
    padding-top: 5px;
    padding-bottom: 3px;
    border-left: 1px solid;
    background: var(--news-background-color);
    color: var(--sidebar-color);
    border-color: var(--tab-border-color);
}

.tab-center {
    border-left: 1px solid;
    border-right: 0;
}

.tab-first {
    border-left: 1px solid;
    border-right: 0;
}

.tab-active.tab-first {
    border-right: 1px solid var(--tab-border-color);
}

.filelink a {
    word-wrap: break-word;
}

.new.mobilenav .notif-count {
    margin-left: 4px;
}

@media (max-width: 700px) {
    .thread .omittedposts,
    .thread-replies {
        clear: both;
    }

    .filetitle {
        text-wrap: wrap;
        overflow: hidden;
        display: block;
        white-space: pre-wrap;
    }
}

@media (max-width: 600px) {    
    .file-expand {
        float: unset;
        width: fit-content;
        margin: 4px auto;
    }

    .op .filetitle.classic,
    .reply.classic,
    .sidearrows {
        display: none;
    }

    .post {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    .thread-header.new {
        display: block !important;
        font-size: 1.2em;
        background: var(--new-header-bg);
        padding: 2px 4px;
    }

    #postform input[type="text"] {
        max-width: 220px;
    }

    #postform select[name="board"] {
        width: 100%;
    }

    #postform #dropzone,
    #postform textarea {
        max-width: 260px;
    }

    #postform input[name="embed"],
    #postform input[name="subject"] {
        max-width: 175px;
    }

    .postarea.qr-floating #postform #dropzone,
    .postarea.qr-floating #postform textarea,
    .postarea.qr-floating #postform input[type="text"] {
        max-width: 100%;
    }

    .postarea.qr-floating,
    #postarea,
    #postform table.extra,
    #postform table.postform {
        margin: auto;
    }

    #postform summary {
        text-align: center;
    }

    .bottom,
    .top-nav,
    .bottom-nav {
        flex-direction: column;
    }

    .top-nav .right.classic {
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px solid var(--border-color);        
    }

    .bottom-nav .right.classic {
        flex-direction: column;
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px solid var(--border-color);
    }
    
    .backlinks.classic {
        display: none;
    }

    .backlinks.postinfo.new {
        display: block !important;
        border-top: 1px solid var(--border-color)
    }

    .op .backlinks.postinfo.new {
        border-top: 0px;
    }

    .reportform,
    .deleteform {
        display: block;
        width: 100%;
    }

    table.userdelete {
        margin: auto
    }

    .op .quickbuttons {
        width: 100%;
        border-bottom: 1px solid var(--border-color);
        padding-bottom: 10px
    }

    .quickbuttons button.icon {
        height: 20px;
        width: 20px;
        background-repeat: no-repeat;
        background-position: center;;
    }
    
    .filesize {
        font-size: 0.8em;
        text-align: center;
    }
    
    .postinfo .classic {
        display: none;
    }

    #postarea {
        display: none;
    }
    
    #postarea.visible {
        display: flex;
        margin-bottom: 10px;
    }
    
    .top-nav .new {
        display: block !important;
        order: -1;
        width: 100%;
        text-align: center;
        border-bottom: 1px solid var(--border-color);
        padding-bottom: 10px;
        margin-bottom: 10px;
        font-weight: bold;
    }
    
    .top-nav .new .left {
        display: none !important;
    }
    
    .classic.top {
        display: none
    }
}