@import "mixins/common.less";
@body  : #c5c8c6;
@link  : #81a2be;
@em    : #b5bd68;
@del   : black;
@postBG: #282a2e;
@border: 1px solid #282a2e;
@bold  : #c5c8c6;
@admin : #f00000;
@mod   : #9775ff;
@red   : @admin;
@blue  : #57e8ed;

a {
    color: #81a2be;
}

a.embed {
    background-color: #2f343e;
    color           : #5f89ac;
    font-style      : italic;
    font-family     : serif;
    font-size       : 14px;
    border          : double 3px;
}

.banner-modal hr {
    border-top: 1px solid #81a2be;
}

body {
    background-color: #2f2f2f;
    font-family     : Arial, Helvetica, sans-serif;
    font-size       : 9pt;
}

b {
    color: #c5c8c6;
    font : italic 14px serif;
}

.modal,
article,
aside {
    background-color: #2f343e;
}

article,
aside {
    padding      : 4px 10px;
    margin       : 5px;
    box-shadow   : 1px 2px 4px rgba(0, 0, 0, 0.24);
    border-radius: 7px 7px 7px 0;
    border       : none;
}

.open-mixin() {
    background-color: #fa9cfd;
    border-color    : #bc5dc5;
    color           : #000;

    &>header,
    &>figcaption {

        a,
        b:not(.admin):not(.sage) {
            color: #222;
        }
    }

    &>.post-container>blockquote,
    &>.backlinks {

        &>em>a,
        &>a {
            color: #222;
        }

        &>em {
            color: #656d28;
        }
    }
}

article.open:not(.no-border) {
    .open-mixin;
}

#main {
    &:not(.custom-BG) section>article.open:not(.no-border) {
        .open-mixin;
    }

    &.custom-BG section>article.open {
        .open-mixin;
    }
}

article.preview.open {
    .open-mixin;
}

#banner,
.modal,
.popup-menu,
.preview,
.post-form {
    box-shadow: 0px -1px 7px 0px rgba(0, 0, 0, 0.5);
}

#banner {
    background: rgb(66, 55, 86);
}

#main:not(.custom-BG) section>article.no-border {
    padding-left : 1em;
    padding-right: 1em;
    border       : none;
    background   : none;
    box-shadow   : none;
    margin       : auto;
}

.admin {
    color: #f00000;
}

.moderator {
    color: #81a2be;
}

.popup-menu {
    border: 1px solid #282a2e;
}

audio::-webkit-media-controls-current-time-display,
audio::-webkit-media-controls-time-remaining-display {
    color: #81a2be;
}

blockquote a:hover {
    color: #81a2be;
}

a:hover,
blockquote a {
    color: #5f89ac;
}

.popup-menu,
article.highlight,
article:target {
    background-color: #1d1d21;
    border-color    : #111;
}

.preview {
    border-color: none;
}

.preview:not(.open) {
    background-color: #1d1d21;
}

h1 {
    font          : bolder 30px serif;
    letter-spacing: 1px;
}

h2 {
    font-family: Tahoma;
}

h3 {
    color: #ce52c9;
}

hr {
    border-top: 1px solid #282a2e;
}

.popup-menu {
    // Need extra override for open posts
    color: @body;

    li:hover {
        background-color: #136;
    }
}

.omit {
    color: #c1b8b8;
}

a.tab-sel {
    color: #add8e6;
}

#catalog article {
    width           : 160px;
    max-height      : 320px;
    display         : inline-block;
    text-align      : center;
    word-wrap       : break-word;
    overflow        : hidden;
    vertical-align  : top;
    background-color: #3c314a;
    border          : none;
    padding         : .6em;
    margin          : .15em;
}
