body {
    background: #FFC url(Graphics/paper.jpg) repeat center center;
    text-align: center;
    margin: 0;
    padding: 0;
    width: 100%;
    display: block;
}

a {
    text-decoration: none;
    color: black;
    padding: 0 1px;
    text-shadow: 0 0 1px #000, 0 1px 2px green, 1px 0 1px darkgreen;
}

div {
    margin: 0 auto;
}

.alternativetext, .dialog1, .dialog2, .dialog3, .dialog4 {
    text-align: center;
    font-style: normal;
}

.alternativetext {
    color: #004513;
    font-family: Quicksand, serif;
    font-size: 1.1vw;
    font-weight: 200;
    transform: scale(1, 0.618);
}

.dialog1, h2 {
    color: #4a3726;
    font-family: "Monotype Corsiva", serif;
    font-size: 1.5vw;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 133%;
    text-align: left;
    vertical-align: top;
}

.dialog2 {
    color: #283B1D;
    font-family: "Book Antiqua", Arial, serif;
    font-size: 1.5vw;
    font-weight: 100;
    line-height: 133%;
    text-align: left;
    text-shadow: 0 0 1px #fff, 1px 1px 1px #FDF;
    vertical-align: top;
}

.dialog3, .dialog4 {
    font-size: 1.22em;
    font-weight: 800;
    line-height: 43px;
    text-shadow: 0 0 1px #000, 0 0 2px #043307, 0 0 3px #0400B7;
}

.dialog3 { color: #ff8989; }
.dialog4 { color: #8989ff; font-family: sans-serif; font-weight: 400; text-align: left; }

.ghosttext {
color : black;
font-size : calc(12px + 1vw);
text-align : center;
font-family : "Curlz MT", Luminari, "Book Antiqua", "Gills Sans", Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, Meiryo;
font-weight : 800;
padding-left : 16px;
padding-right : 16px;
text-shadow : 0 0 1px #7fad7c, 0 1px 3px #fff, 1px 0 6px #825174, 3px 0 10px #3E9175;
}


h1 {font-family: 'Uncial Antiqua', Zapfino, Avenir;}

h2, h3, h4, h5, h6 {
    text-align: center;
}

h2 {font-size: 180%;
    font-weight: 800;
    letter-spacing: 2px;
    text-shadow: 1px 1px 0 white, 2px 2px 0 blue, 3px 6px 3px white;
    margin: 10px;
}

h3 {
    color: #8C6B09;
    font-family: "Curlz MT", script;
    font-size: calc(18px + 2vw);
    font-weight: 200;
    line-height: 90%;
}

li {
float : left;
padding : 5px;
}
li a:hover:not(.active) {
background-color : #111;
}

.maintext {
color : black;
font-size : calc(13px + 1vw);
text-align : center;
font-family : "Curlz MT", Luminari, "Book Antiqua", "Gills Sans", Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, Meiryo;
font-weight : 800;
padding-left : 16px;
padding-right : 16px;
text-shadow : 0 0 1px #FDF, 0 1px 3px #000, 1px 0 6px #BFA371, 0 0 9px #000, 2px 2px 12px #719357;
}

ul {
list-style-type : none;
z-index : 999;
background-color : #98B76B;
margin : 0;
padding : 0;
overflow : hidden;
position : fixed;
top : 0;
width : 100%;
}

.fade {
    opacity: 1;
    transition: opacity 0.25s ease-in-out;
}

.fade:hover {
    opacity: 0.5;
}

.hvr-bounce-in:hover, .hvr-grow:hover, .hvr-grow-shadow:hover {
    transform: scale(1.2);
}

.hvr-grow-shadow:hover {
    box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
}

/* Responsive Design */
@media screen and (max-width: 600px) {
    #content {
        width: auto;
        float: none;
        margin: 20px 0;
    }

    .mainimage {
        max-width: 50%;
        height: auto;
        margin-bottom: 1px;
    }

    h2, h3, h4 {
        font-size: 1.5em;
    }
}