html {
    overflow-y: scroll;
    
    /*crisp art*/
    image-rendering: -moz-crisp-edges;
    image-rendering: -o-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    -ms-interpolation-mode: nearest-neighbor;

    -webkit-font-smoothing: antialiased;  
    -moz-osx-font-smoothing: grayscale;
    font-smooth: none;
}

body {
    margin: 0%;

    color: black;
    font-size: medium;
    
    background-color: rgb(24, 42, 47);
    background-image: url("/img/bg/shit-carpet-bg.png");
    background-attachment: fixed;
}

/* Links are dark red and small-caps bold. Highlight on hover. */
a {
    color: firebrick;
    font-variant: small-caps;
    font-weight: bold;    
}
a:hover {
    color: #e25555;
}

/* Anything H1 is small-caps bold unless overwritten */
h1 {
    font-variant: small-caps;
    font-weight: bold;
}

/** Header Bar **/
div.header-bar {
    margin: auto;
    margin-top: 1em;
    margin-bottom: 1em;
    padding-left: .5em;
    padding-right: .5em;
    padding-top: .0em;
    padding-bottom: .0em;
    height:fit-content;
    width:max-content;

    color: black;
    font-size: x-large;
    text-align: center;
    
    border-image: url("/img/9box/table-9box-light-gray.png") 35 fill / 35px / 0px 0px repeat;
}
@media(max-width: 850px) {
    div.header-bar {
        width: min-content;
    }
}
div.header-bar img{
    vertical-align: middle;
}
div.header-bar a{
    color: black;
}

span.header-bar-side-icons {
    white-space: nowrap;
}

/* Container for content and sidebar.  */
.main-container {
    display: flex; 
    margin: 5%;
    margin-top: 1em;
}

/* Link Buttons */
.button-list {
    text-indent: 0px;
}
.link-button {
    min-width: 88px;
    min-height: 31px;
    text-indent: 0px;
}
@media(min-resolution:120dpi) {
    .link-button {
        transform-origin: top left;
        transform: scale(1.6);
        margin-right: 58px;
        margin-bottom: 20px;
        text-indent: 0px;
    }
}
/* @media(min-resolution:120dpi) {
    .link-button {
        min-width: 176px;
        min-height: 62px;
    }
} */

@font-face {
    font-family: "Trebuchet MS";
    src: 
        url("/trebuc.ttf");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/** Main Content Area **/
.intro {    
    width: 70%;
    height: fit-content;
    padding: .7em;
    float:left;

    border-radius: 5px;
    border: 4px solid darkgoldenrod;

    color: rgb(42, 42, 42);
    
    border-image: url("/img/9box/table-9box-drab-yellow.png") 35 fill / 35px repeat;
    vertical-align: text-top;
    font-size: larger;
    text-indent: 10px;
    text-align: left;
    
    /*font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;*/
    font-family: "Trebuchet MS", 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

/** Sidebar **/

/* Container for sidebar */
.sidebar-container {
    width: 255px; /*30% of 850px cutoff*/
    vertical-align: top;
}
@media(max-width: 850px) {
    .sidebar-container {
        margin-right: 1%;
        width: 30%;
    }
}

/* General sidebar header */
div.sidebar-header {
    padding: .6em;
    width: 100%;
    display:block;    

    color: black;
    font-variant: small-caps;
    font-weight: bold;
    /*font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;*/
    font-family: "Trebuchet MS", 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    text-align: center;
    font-size: larger;
}
div.sidebar-header a {
    display: block;
    width: 100%;
    height: 100%;

    text-decoration-line: none;
}

/* General sidebar entry */
div.sidebar-entry {
    padding: .6em;
    width: 90%;
    height:max-content;
    display:block;
    
    color: rgb(42, 42, 42);
    font-size: larger;
    text-align: center;
    /*font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;*/
    font-family: "Trebuchet MS", 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    
    border-image-width: auto;
}
@media(max-width: 850px) {
    div.sidebar-entry {
        font-size: medium;
    }
}
div.sidebar-entry a {
    display: block;
    width: 100%;
    height: 100%;

    text-decoration-line: none;
}


/* Posts sidebar header */
div.sidebar-posts-header {    
    border-image: url("/img/9box/table-9box-light-seafoam.png") 35 fill / 35px repeat;
    user-select: none;
}
div.sidebar-posts-header:hover {    
    border-image: url("/img/9box/table-9box-lighter-seafoam.png") 35 fill / 35px repeat;
    user-select: none;
}


/* Game Sidebar List */
div.sidebar-game-header {    
    border-image: url("/img/9box/table-9box-lighter-blue.png") 35 fill / 35px repeat;
    user-select: none;
}

/* Game list container (show/hide)*/
.game-list-control {
    margin-left: 10%;
    display: none;
    width: 90%;
}
#game-toggle:checked ~ .game-list-control {
    display:inline-block;
}
.game-toggle-checkmark {
    display: none;
}

/* Game entry */
div.sidebar-game-entry {
    border-image: url("/img/9box/table-9box-light-blue.png") 35 fill / 35px repeat;
}
div.sidebar-game-entry:hover {
    border-image: url("/img/9box/table-9box-lighter-blue.png") 35 fill / 35px repeat;
}


/* Doom Sidebar List */
div.sidebar-doom-header {    
    border-image: url("/img/9box/table-9box-lighter-gray.png") 35 fill / 35px repeat;
    user-select: none;
}

/* Doom list container (show/hide)*/
.doom-list-control {
    margin-left: 7.5%;
    display: none;
    width: fit-content;
}
#doom-toggle:checked ~ .doom-list-control {
    display:inline-block;
}
.doom-toggle-checkmark {
    display: none;
}

/* Doom entry */
div.sidebar-doom-entry {
    border-image: url("/img/9box/table-9box-light-gray.png") 35 fill / 35px repeat;
}
div.sidebar-doom-entry:hover {
    border-image: url("/img/9box/table-9box-lighter-gray.png") 35 fill / 35px repeat;
}


/* Links sidebar header */
div.links-header {    
    border-image: url("/img/9box/table-9box-drab-yellow.png") 35 fill / 35px repeat;
    user-select: none;
}
div.links-header:hover {    
    border-image: url("/img/9box/table-9box-drab-yellow.png") 35 fill / 35px repeat;
    user-select: none;
}


/** Webring **/
div.webring {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left:10px;
    padding-right:10px;
    width: 100%;
    
    color: rgb(139, 0, 0);
    text-align: center;
    /*font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;*/
    font-family: monospace, "Trebuchet MS", 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;

    border-image: url("/img/9box/table-9box-light-red.png") 35 fill / 35px repeat;
}

/** Bottom Crawl **/
div.bottom-crawl {
    vertical-align: text-bottom;
    text-align: center;
    font-variant: small-caps;
    width: 100%;
    bottom: 0%;
    position: fixed;
    font-size: larger;
    color: gray;
    background-color: rgb(28, 48, 49);
}

/*** POSTS ***/

/** Post Header **/
div.post-header {
    font-weight: bold;
    font-variant: small-caps;
    text-decoration: underline;
}