body {
    --bgcolor: rgb(239, 240, 255);
    --textcolor: black;
    --graytext: #222;
    --codebg: #f8f8f8;
    --btnbg: #eee;
    --btnfg: black;
    --link: blue;
}

.invert-on-bright {
    filter: invert();
}

pre, blockquote {
    background-color: var(--codebg);
    padding: .7em;
    border: 1px solid var(--textcolor);
    white-space-collapse: preserve;
}

blockquote p {
    margin: 0;
    padding: 0;
}

h1 {
    line-height: 110%;
}

/*
@media (prefers-color-scheme: dark) {
    body {
        --bgcolor: black;
        --textcolor: white;
        --graytext: #eee;
        --btnbg: #333;
        --codebg: #222;
        --btnfg: white;
        --link: #88f;
    }

    .invert-on-dark {
        filter: invert();
    }
}
*/

#nav-below a {
    display: block;
    margin-bottom: 10px;
}

body {
    margin-left: 1em;
    margin-right: 1em;
    background-color: var(--bgcolor);
}

main {
    background-color: var(--bgcolor);
}

@media only screen and (max-width: 500px) {
    #cat {
        display: none;
    }
    #bottomcat {
        display: inline-block;
        text-align: center;
        margin-top: 20px;
        width: 200px;
        height: 100px;
        background-repeat: no-repeat;
        background-position-y: top;
    }
    code {
        white-space: pre-wrap;
        font-size: 70%;
    }
    pre, blockquote {
        padding: 1em;
        margin: .5em;
    }
    pre {
        overflow-x: auto;
    }
}
@media only screen and (max-width: 700px) and (min-width: 500px) {
    #cat {
        margin-top: 2px;
        width: 120px !important;
    }
    #bottomcat {
        display: none;
    }
    code {
        white-space: pre-wrap;
    }
}

@media only screen and (min-width: 700px) {
    header, main {
    }
    header hr {
        display: none;
    }
    header {
        padding-top: .5em;
        margin-bottom: 1em;
    }
    h1 {
        margin-top: 0;
    }
    main {
        border: 1px solid var(--textcolor);
        padding: 1em;
    }
    #nav-below {
        clear: both;
    }
    #nav-below a {
        display: inline;
    }
    .prev {
        float: left;
    }
    .next {
        float: right;
    }
    body {
        background: white;
    }
    #bottomcat {
        display: none;
    }
}


body, td, p, header, main {
    font-family: "Ubuntu", sans-serif;
    line-height: 1.5em;
    font-size: 14pt;
    color: var(--textcolor);
}

a, a:visited {
    font-size: 14pt;
    color: var(--link);
}

.postedon {
    color: var(--graytext);
    font-style: italic;
    font-size: 10pt;
}
img {
    max-width: 90vw;
}



table {
    border-collapse: collapse;
    width: 100%;
}
th {
    text-align: left;
}
td,th {
    padding: .2em;
    border: 1px solid var(--textcolor);
}
#nav-below {
    text-align: center;
}


body.is-list .listitem {
    margin-bottom: 1em;
}

body.is-list h2 {
    margin: 0;
    padding: 0;
}

body.is-list .postedon {
    margin: 0;
}


#cat {
    width: 200px;
    height: 100px;
    background-repeat: no-repeat;
    position: absolute;
    right: 0;
    background-position-y: top;
}
.cat-mirror {
    right: 100px !important;
    transform: scale(-1, 1);
}
.cat1  { top: 10px; background-image: url('https://my-cdn.at/ePzvqMadmoIe4Ax7.cXW7NElnRnCeLm9awRs4UuIEp5'); background-size: 40%; }
.cat2  { top: 10px; background-image: url('https://my-cdn.at/vMzkcmSTajLD3IsZurErmKN9yXw0Yboom.IlvBp-0PC'); background-size: 40%; }
.cat3  { top: 10px; background-image: url('https://my-cdn.at/vSRt0cIqFhfxBn0AeAZ5atHVhXK2IZmx6Vt7u.RRoHf'); background-size: 30%; }
.cat4  { top: 10px; background-image: url('https://my-cdn.at/JZpBNcROyYnSSMvFuDAGLoiFxuGxd5JaL499JBsA0x6'); background-size: 20%; }
.cat5  { top: 19px; background-image: url('https://my-cdn.at/yuzo02ab6Iw.ShtK88lxcOHLdy9DTranY44RQWswww.'); background-size: 40%; }
.cat6  { top: 12px; background-image: url('https://my-cdn.at/MEuxc0Rj1x0f1xxuF2nWgS-svz5ai630WsUjYrG3gi4'); background-size: 25%; }
.cat7  { top:  1px; background-image: url('https://my-cdn.at/7IR53tubhVFVrUcgjaejBu6e9RK.L6DdibxGoFVmcDz'); background-size: 40%; }
.cat8  { top: 10px; background-image: url('https://my-cdn.at/IGUo2Hay7aXGl0AsunkdBGFXLCVZrEFCPPJd3wVZ8ZO'); background-size: 30%; }
.cat9  { top: 10px; background-image: url('https://my-cdn.at/0CYHLhQNUTw4CB0cxdRX0WwQro5MrKZjorsHct90cmW'); background-size: 29%; }
.cat10 { top:  5px; background-image: url('https://my-cdn.at/RGsy7q.XWzanYI5sTEi6KHLVfL.uOCxxrgYJQOH9wDe'); background-size: 23%; }
.cat11 { top: 10px; background-image: url('https://my-cdn.at/OTP8R.d-SyV1C.ciPf-MHtHRWClnSv0Da4MKydfIIPm'); background-size: 40%; }
.cat12 { top: 7px; background-image: url('https://my-cdn.at/Lgrgv9087qkuRAiOQYPb-ykuCyPNNJHKEOdwbU7.g6z'); background-size: 25%; }