/* mobile first */

body {
    color: #cccccc;
    background-color: #333333;
}
a:link {
    color: #9999ff;
}
a:visited {
    color: #9999ff;
}
a:hover {
    color: #ccccff;
}
a:active {
    color: #ffff00;
    background-color: #999999;
}
.main {
    margin: 20px 10px;
}
.bottom-link {
    position: relative;
    margin: 1em;
    height: 1.5em;
}
.bottom-link .prev {
    position: absolute;
    left: 0;
    width: -moz-fit-content;
    width: fit-content;
}
.bottom-link .next {
    position: absolute;
    right: 0;
    width: -moz-fit-content;
    width: fit-content;
}
/*.bottom-link .next {
    display: flex;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: 0;
    justify-content: flex-end;
}*/
h1 {
    font-size: 1.3em;
}
h2 {
    font-size: 1.2em;
}
h3 {
    font-size: 1.1em;
}
blockquote {
    margin: 0;
    padding: 0 1.0em;
    border-left: 2px #999999 solid;
}

@media screen and (min-width: 481px) {
    /* Tablet */
}
@media screen and (min-width: 960px) {
    /* PC */
    .main {
        margin-left: auto;
        margin-right: auto;
        width: 700px;
    }
}