body {
    background-color: #02121D;
    color: #FFFFFF;
    font-family: serif;
}
main {
    max-width: 1000px;
    margin: auto;
    font-size: 110%;
    line-height: 1.4;
}

h1 {
    font-size: 300%;
    color: #90D0F0;
}
h2 {
    font-size: 150%;
    color: #FFFFFF;
}
h3 {
    font-size: 130%;
    color: #90D0F0;
    margin-bottom: -10px;
}
h4 {
    font-size: 120%;
    color: #FFFFFF;
    margin-bottom: -5px;
}

blockquote {
    font-size: 120%;
}

menu, ul {
    padding-inline-start: 15px;
}

img {
    max-width: 100%;
}
.chart {
    border: 1px solid #303030;
    border-radius: 7px;
}

a {
    color: #00A0C0;
}
a:hover {
    color: #28C8F8;
}
a:visited {
    color: #C0A0D8;
}
a:visited:hover {
    color: #E8C8FF;
}

.spoiler {
    display: block;
    margin-bottom: -25px;
    color: #02121D;
}
.spoiler:hover {
    color: #FFFFFF;
}

nav {
    max-width: 1200px;
    margin: auto;
    height: 40px;
    overflow-x: auto;
    overflow-y: hidden;
}
.menu {
    min-width: 450px;
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.menuitemright {
    float: right;
}
.menuitemleft {
    float: left;
}
.menuitem {
    display: block;
    text-decoration: none;
    padding: 12px 12px;
    font-family: monospace;
    font-size: 120%;
    color: #FFFFFF;
}
.menuitem:hover {
    background-color: #010D14;
    color: #FFFFFF;
}
.menuitem:visited {
    background-color: #010D14;
    color: #FFFFFF;
}
.menuitem:visited:hover {
    background-color: #010D14;
    color: #FFFFFF;
}

footer {
    text-align: center;
    font-size: 80%;
    color: #AAAAAA;
}
.footer {
    color: #AAAAAA;
}
.footer:hover {
    color: #AAAAAA
}
.footer:visited {
    color: #AAAAAA;
}
.footer:visited:hover {
    color: #AAAAAA;
}