body
{
    color: black;
    background: #CCF;
}

h1.header
{
    color: #048;
    text-align: center;
}

h1.header img
{
    max-width: 100%;
}

a
{
    color: #008;
    font-weight: bold;
    text-decoration: underline;
}

a:visited
{
    color: #408;
}

a:hover
{
    color: #C08;
    font-weight: bold;
    text-decoration: none;
}

nav.header
{
    background: #5B0D87;
    border-style: hidden;
    border-radius: 12px;
    width: 94%;
    max-width: 64em;
    margin-left: auto;
    margin-right: auto;
    padding-left: 2%;
    padding-right: 2%;
    padding-top: 0px;
    padding-bottom: 0px;
    float: none;
    line-height: 300%;
    text-align: center;
    text-shadow: 2px 2px black;
}

nav.header ul
{
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 0px;
    padding-right: 0px;
}

nav.header li
{
    display: inline;
    list-style: none;
}

nav.header a, nav.header a:hover, nav.header a:visited
{
    color: white;
    font-weight: bold;
    text-decoration: none;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 8px;
    padding-bottom: 8px;
    border-style: hidden;
    border-radius: 8px;
    margin-left: 12px;
    margin-right: 12px;
}

nav.header li.current a, nav.header a:hover
{
    background: #04B;
    box-shadow: 3px 3px black;
}

main
{
    background: #DDF;
    width: 90%;
    max-width: 60em;
    margin-left: auto;
    margin-right: auto;
    padding-left: 2%;
    padding-right: 2%;
    padding-top: 4px;
    padding-bottom: 4px;
    overflow: auto;
}

.floating
{
    float: right;
    max-width: 40%;
    padding-left: 16px;
    padding-top: 16px;
    padding-bottom: 16px;
}

.gameslist
{
    width: 100%;
    margin-top: 12px;
    margin-bottom: 12px;
    padding-top: 4px;
    padding-bottom: 4px;
    overflow: auto;
    font-size: x-large;
    text-align: center;
}

.gameslist img
{
    display: block;
    float: left;
    width: 24%;
    margin-left: 0.5%;
    margin-right: 0.5%;
    margin-top: 0.5%;
    margin-bottom: 0.5%;
}

.footer
{
    width: 100%;
    margin-top: 32px;
    text-align: center;
}

details summary
{
    cursor: pointer;
}

details summary:hover
{
    text-decoration: underline;
}

details.faq summary
{
    color: #008;
    font-weight: bold;
    text-decoration: underline;
    cursor: pointer;
}

details.faq summary:hover
{
    color: #C08;
    font-weight: bold;
    text-decoration: none;
}

aside.footnotes ol
{
    font-size: smaller;
}
