html,
body {
    display: block;
    margin: 0 auto;

    -webkit-font-smoothing: antialiased;

    font-family: sans-serif;
    font-size: 22px;
    line-height: 1.1em;

    text-align: center;
}

* {
    box-sizing: border-box;
}

.theme-starlight {
    color: #6cf;
    background-color: #1a1133;
    background-image: url("/assets/img/home/anim-twinkle.webp");

    background-attachment: fixed;
    background-size: 25%;
}

.theme-story {
    color: #111;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("/assets/img/home/tile-movingclouds.webp");
}

img {
    display: block;
    border: 0 none;
}

a {
    color: inherit;
}

hr {
    border-color: #6cf;
    color: #6cf;
}

p {
    width: 860px;
    text-align: justify;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Comic Sans", "Comic Sans MS", "Chalkboard", "ChalkboardSE-Regular", sans-serif;
}

h1 {
    padding-top: 1em;
    font-size: 1.35em;
}

h2 {
    font-size: 1.35em;
}

h2 {
    color: #e0e0e0;
    -webkit-text-stroke: 1px #e0e0e0;
    text-shadow: -3px -3px 0 #63f, 0 -3px 0 #63f, 3px -3px 0 #63f, 3px 0 0 #63f, 3px 3px 0 #63f, 0 3px 0 #63f,
        -3px 3px 0 #63f, -3px 0 0 #63f;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.15em;
    text-align: center;
}

ul {
    font-family: "Comic Sans", "Comic Sans MS", "Chalkboard", "ChalkboardSE-Regular", sans-serif;
    font-size: 1.1em;
}

li {
    display: inline-block;
    font-weight: bold;
}

li a:hover {
    color: white;
    cursor: pointer;
}

p {
    font-size: 1em;
    font-family: serif;
}

@media screen and (max-width: 980px) and (-webkit-min-device-pixel-ratio: 3) {
    p {
        font-size: 1.2em;
        line-height: 1.2em;
    }
}

p a:hover {
    color: #e0e0e0;
    text-shadow: -2px -2px 0 #63f, 0 -2px 0 #63f, 2px -2px 0 #63f, 2px 0 0 #63f, 2px 2px 0 #63f, 0 2px 0 #63f,
        -2px 2px 0 #63f, -2px 0 0 #63f;
}

p b {
    font-family: sans-serif;
    font-weight: bold;
    font-size: 0.9em;
    letter-spacing: 0.2em;
}

p em {
    font-style: normal;
    font-weight: bold;
    font-size: 0.92em;
    font-family: "Comic Sans", "Comic Sans MS", "Chalkboard", "ChalkboardSE-Regular", sans-serif;
}

p i {
    font-weight: bold;
    letter-spacing: 0.08em;
}

blockquote {
    width: 860px;
}

blockquote p {
    font-family: sans-serif;
    font-style: italic;
    font-weight: bold;
    font-size: 0.9em;
    line-height: 1.2em;
    text-align: center;
}

table {
    font-size: 1em;
    background-attachment: fixed;
    background-repeat: round;
    background-size: 100%;
}

table p {
    width: auto !important;
    font-family: monospace;
    font-size: 0.9em;
    line-height: 1.1em;
    text-align: justify;
    text-justify: auto;
}

table p b {
    font-size: 0.94em;
}

table p i {
    font-family: serif;
}

th {
    font-family: monospace;
    padding: 20px;
}

td {
    padding: 0.5em;
    font-family: monospace;
    background-repeat: repeat-y;
}

td b {
    font-family: sans-serif;
    font-size: 0.8em;
}

td a {
    display: inline-block;
}

td img {
    margin-bottom: 0.5em;
}

table.wtb td {
    font-size: 0.8em;
    line-height: 1.26em;
}

table.wtb td b {
    font-size: 1em;
}

@media screen and (max-width: 980px) and (-webkit-min-device-pixel-ratio: 3) {
    table.wtb td {
        font-size: 1.2em;
    }
}

table.feature td {
    padding-right: 1em;
    padding-left: 1em;
}

@media screen and (max-width: 980px) and (-webkit-min-device-pixel-ratio: 3) {
    table.feature td {
        font-size: 1.2em;
        height: 360px;
    }
}

table.roadmap {
    width: 720px;
    background-image: url("/assets/img/home/road.png");
    background-attachment: fixed;
    background-repeat: repeat-y;
    background-size: 100%;
    font-size: 0.76em;
    line-height: 1.2em;
}

table.roadmap b {
    font-size: 1em;
}

table.roadmap tr {
    height: 240px;
}

table.roadmap td {
    padding: 0;
    width: 240px;
}

@media screen and (max-width: 980px) and (-webkit-min-device-pixel-ratio: 3) {
    table.roadmap td {
        font-size: 1.4em;
        line-height: 1.2em;
    }
}

table.story {
    width: 760px;
}

table.story td {
    padding-bottom: 3em;
}

table.story p {
    text-align: justify;
    font-size: 1em;
    line-height: 1.3em;
    font-family: sans-serif;
}

table.story img {
    width: 100%;
}

.bgsize-200 {
    background-size: 200%;
}

.bgsize-50 {
    background-size: 50%;
}

.bgsize-25 {
    background-size: 25%;
}

.bgsize-20 {
    background-size: 20%;
}

.bgsize-10 {
    background-size: 10%;
}

@media screen and (max-width: 980px) and (-webkit-min-device-pixel-ratio: 3) {
    table.generations p {
        font-size: 1.4em;
        line-height: 1.2em;
    }
}

#getpoints {
    position: fixed;
    right: 0;
}

#genna:hover {
    content: url("/assets/img/home/genna-xray.webp");
}

.blink {
    animation: blink 0.75s linear infinite;
}

@keyframes blink {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    50.01% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}