@font-face {
    font-family: 'hoefler';
    src: url('fonts/hoefler_text-webfont.woff2') format('woff2'),
         url('fonts/hoefler_text-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'hoefler';
    src: url('fonts/hoefler_text_black-webfont.woff2') format('woff2'),
         url('fonts/hoefler_text_black-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'hoefler';
    src: url('fonts/hoefler_text_black_italic-webfont.woff2') format('woff2'),
         url('fonts/hoefler_text_black_italic-webfont.woff') format('woff');
    font-weight: bold;
    font-style: italic;

}

@font-face {
    font-family: 'hoefler';
    src: url('fonts/hoefler_text_italic-webfont.woff2') format('woff2'),
         url('fonts/hoefler_text_italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}

html {
    box-shadow: inset 0 0 300px rgba(0, 0, 0, 0.75);
    min-height: 100%;
}

body {
    --bgcolor1: #271b2f;
    --bgcolor2: #24132e;
    background: conic-gradient(var(--bgcolor1) 0 90deg, var(--bgcolor2) 0 180deg, var(--bgcolor1) 0 270deg, var(--bgcolor2) 0) fixed;
    background-size: 50px 50px;
    font-family: hoefler, serif;
    font-size: 16px;
    margin: 0;
    margin-bottom: 8px;
    text-align: justify;
}

#pillar {
    background: #ffffe1;
    padding-bottom: 45px;
    -webkit-box-shadow: inset 20px #eed28f, 0 0 10px rgba(0, 0, 0, 1);
    box-shadow: inset 0 0 20px #eed28f, 0 0 20px rgba(0, 0, 0, 1);
}

.y, .m, .d {
    /*font-variant-numeric: tabular-nums;*/
    display: inline-block;
    text-align: center;
    color: black;
    width: 17px;
}

.m i, .d i {
    display: none;
}

/* other colors: DBADA2 B53C67 apparently */

.datelist {
    text-align: left;
}

.daterow {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

.daterow a {
    flex-shrink: 9999;
    display: inline-block;
}

.daterow .minorlink {
    flex-shrink: 9999;
    display: inline-block;
}

.minorlink a {
    display: inline;
    font-variant: normal;
    color: #c36000;
    font-weight: normal;
    text-transform: none;
}

.date {
    flex-basis: auto;
    width: 77px;
    display: inline-block;
    color: #cdc45e;
}

.daterow .date {
    margin-right: 15px;
    text-align: right;
}

.date::before {
    content: "[";
}

.y::before {
    content: "’";
    color: #cdc45e;
}

.m::after {
    content: "/";
    color: #cdc45e;
}

.y {
    margin-right: 5px;
}

.m {
    min-width: 20px;
    text-align: right;
}

.d {
    text-align: left;
}

.date::after {
    content: "] ";
}

.descrow {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    vertical-align: top;
}

.nodate {
    flex-basis: auto;
    width: 77px;
    margin-right: 15px;
    display: inline-block;
}

.nodate img {
    border: 1px solid #cdc45e;
    margin-top: 5px;
    box-shadow: 1px 1px 3px #cdc45e;
}

.gamelisting:hover .nodate img {
    margin-left: -2px;
    margin-top: 3px;
    margin-bottom: 2px;
    margin-right: 2px;
    box-shadow: 3px 3px 3px #cdc45e;
}

.gamelisting {
    padding-top: 10px;
    cursor: default;
    padding-bottom: 15px;
    text-transform: lowercase;
    color: #8f7b4a;
}

.gamelisting a {
    cursor: pointer;
}

.gamelisting:hover {
    border-radius: 10px;
    /*background-color: #eed28f;*/
    margin-left: -30px;
    padding-left: 30px;
    margin-right: -30px;
    padding-right: 30px;
    box-shadow: inset 0 0 5px rgba(205, 196, 94, 0.5);
}

.minordaterow {
    padding-top: 8px;
}

.descrow .desc {
    display: inline-block;
    flex-shrink: 9999;
}

tt {
    font-family: Monaco, monospace;
    font-size: 0.9em;
    letter-spacing: 8px;
    color: #ffffe1;
}

.blogtype {
    font-family: hoefler, serif;
    font-size: 16px;
}

h1 {
    font-weight: bold;
    font-size: inherit;
    color: #783b00;
    text-transform: lowercase;
    text-align: center;
    /*font-family: Monaco, monospace;*/
}

h2 {
    display: inline-block;
    font-weight: bold;
    font-size: inherit;
    padding-top: 1em;
    padding-bottom: 0;
    margin-bottom: 0;
    text-transform: lowercase;
    /*font-family: Monaco, monospace;*/
}

h3 {
    display: block;
    font-weight: bold;
    font-size: inherit;
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: -0.5em;
    color: #783b00;
    /*font-family: Monaco, monospace;*/
}

a {
    color: inherit;
    text-decoration: underline;
    font-weight: bold;
    text-underline-offset: 2px;
    font-variant: small-caps;
    text-transform: lowercase;
}

.xcolor a {
    color: inherit;
}

a .linkcolor {
    color: inherit;
    text-decoration: underline;
}

h2 a {
    text-decoration: none;
    color: inherit;
    font-variant: normal;
    text-transform: none;
}

h2 a:hover {
    text-decoration: underline;
    position: relative;
}

h2 a:hover::before {
    content: "\2693";
    display: inline-block;
    margin-left: 10px;
    font-size: 1.25em;
    float: right;

    position: absolute;
    bottom: -0.1em;
    right: -20px;
}

#cas {
    text-align: center;
    margin: auto;
    max-width: 540px;
}

hr {
    border-top: 1px solid black;
    border-bottom: none;
}

img {
    max-width: 100%;
}

#stuff {
    margin: auto;
    max-width: 480px;
}

.plate1 {
    color: red;
}

.game {
    color: red;
}

.internal {
    color: #783b00;
}

.post {
    color: #895B9A;
}

.dream {
    color: #009503;
    white-space: nowrap;
}

.lite {
    font-weight: normal;
}

.scriptonly {
    display: none;
}

@media (min-width: 600px) {
    #pillar {
        padding-top: 20px;
        padding-bottom: 20px;
        margin-top: 20px;
        max-width: 600px;
        margin: 20px auto auto auto;
        border-radius: 30px;
    }

    .game, .post {
        white-space: nowrap;
    }
}

@media (max-width: 599px) {
    #pillar {
        padding-top: 30px;
        padding-left: 20px;
        padding-right: 20px;
        margin: 0;
        max-width: 100%;
    }

    .mobilecutoff {
        font-size: 0px;
    }

    .mobilecutoff::before {
        font-size: 16px;
        content: "...";
    }

    .y, .m, .d {
        font-size: 13px;
    }
}

.centered {
    text-align: center;
}

.ai {
    color: rgb(0, 0, 0, 0.01);
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1px;
    cursor: default;
}
