body {
    background-color: black;
    background-image: url("/image/bg/sky1abig.png"), url("/image/bg/sky1bbig.png");
    background-size: 25vw;

    font-family: "Courier New", Courier, monospace; /* web safe fonts (super cringe!!! ew!!!!!!!!!) */
    color: white;
    
    animation-name: bgscroll;
    animation-duration: 20s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: infinite;
}


h1 {
    font-family: "dpquake", Garamond;
}

h2, h3, h4, h5, h6 {
    font-family: "quake1";
}

.title {
    font-size: 5em;
}

#subtitle a:link, #subtitle a:visited, #subtitle a:active, #subtitle a:hover {
   color: white;
   text-decoration: none;
}
.marginauto {
    margin: auto;
}

.mainbox {
    width: 80vw;
    padding: 1em;
    font-size: 1.5em;
}

.goldbox {
    border-width: 5px;
    border-style: groove;
    border-color:goldenrod;

    background-color:#752f13;
    background-image: url("/image/bg/ceiling5big.png");
    background-size: 10vw;
}

.infobox {
    min-height: 10em;
    padding: 1em;
    margin-top:1em;
    margin-bottom:1em;

    background-color:#240e05;
    background-image: url("/image/bg/wood3_1.png");
}

div.nav {
    border-width: 0px;
    width: 80vw;
    font-family: "quake1";
    margin: auto;
    
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

div.navlink {
    min-width: 400px;
    width: 25%;
    height: 1em;
    margin: 0;
    padding: 0.5em;

    font-family: "quake1";
    font-size: 1.25em;
    text-decoration: none;
    

    vertical-align: center;
    flex-grow: 1;
}

.navlink a:link, .navlinks a:visited, .navlinks a:active, .navlinks a:hover {
    color: white;
    text-decoration: none;
 }


a {
    color:white;
}


.center {
    text-align: center;
}


img.icon {  /* intended to be used within text */
    max-height:1em;
    display: inline;
}
img.small {
    height:4em;
}
img.medium {
    height:8em;
}
img.big {
    height:12em;
}

@keyframes bgscroll {
    0% {background-position: 0 0, 0 0;} /* wow this was a pain in the ass to figure out */
    100% {background-position: 100vw 100vw, 50vw 50vw;}
  }

@font-face {
    font-family: 'dpquake';
    src: url('../font/dpquake.woff2') format('woff2'),
         url('../font/dpquake.woff') format('woff');
    font-weight: normal;
    font-style: normal;
  }

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

}

/* roblox 2, 10/9/22. this validates to css3. */