body {
    margin: 0;
    padding: 0;
    /* overflow-x: hidden; */
    text-align: center;
}

header {
    margin: 0px;
    text-align: center;
}

header > img {
    height: 10vh;
    max-height: 10vh;
    min-height: 5vh;
    margin: 1em;
}

nav {
    margin: 0;
    padding: 0;
    text-align: center;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

nav ul {
    list-style-type: none;
    margin: 0;
    overflow: hidden;
}

nav li {
    display: inline-block;
    padding: .75em 1.5em;
    margin-left: 0;
    margin-right: 0;
    border-right: 1px solid;
}

nav li:last-child {
    border-right: none;
}

nav a {
    text-decoration: none;
    text-align: center;
    text-decoration: none;
}

nav.subnav {
    border-top: 1px solid;
    border-bottom: 1px solid;
}

nav.subnav li {
    border-right: 1px solid;
}

main {
    border-top: 1px solid;
    border-bottom: 1px solid;
}

main > section {
    text-align: left;
    display: block;
    margin: 0;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

main > section:first-of-type > article {
    min-height: 40vh;
}

main > section > article {
    border-radius: .5em;
    border: 3px solid;
    margin: auto;
}

main > section > article h1 {
    border-radius: .3em;
    margin: 0;
    padding: .75em;
}

main > section.left {
    padding-right: 60vw;
}

main > section.right {
    padding-left: 60vw;
}

main > section.bg-ship {
    background-image: url(../images/screenshots/lobby-ship.png);
    background-repeat: no-repeat;
    background-size: cover;
    height: 60vh;
}

main > section.bg-ship > article {
    min-height: 30vh;
}

main > section.bg-ship > article > div {
    max-height: 55vh;
    overflow: auto;
}

section {
    padding: 1em;
    
}

section.two-column > article {
    display: inline-block;
    vertical-align: top;
}

section.two-column > article:first-of-type {
    max-width: 48%;
    margin-right: 1em;
}

section.two-column > article:last-of-type {
    max-width: 48%;
}

article img {
    padding: 1em;
}

td {
    vertical-align: top;
}

td.header {
    font-weight: bold;
}

b {
    font-weight: bold;
}

.small {
    font-size: smaller;
}

aside {
    display: block;
    width: 40vw;
    margin: 1em;
    border-radius: .5em;
    border: 2px solid;
    text-align: left;
    float: right;
}

aside h1 {
    margin: 0;
    border-radius: .3em;
    border: 2px solid;
}

aside.left {
    float: left;
    clear: left;
}

aside.right {
    float: right;
    clear: right;
}

aside.right {
    clear: both;
}

p {
    margin: 1em;
}

table {
    margin: 1em;
}

table td {
    padding: .5em;
}

footer {
    display: block;
    margin: 0;
    padding: 1em;
    text-align: center;
    height: max(5vh, 25px);
}

h1 {
    margin: .25em;
    padding: .5em;
}

h2 {
    margin: .25em;
    padding: .5em;
}

h3 {
    margin: .25em;
    padding: .5em;
}

p {
    margin: 1em;
}

@media screen and (min-width: 1200px) {
    main > section {
        padding-right: 20vw;
        padding-left: 20vw;
    }

    main > section.left {
        padding-right: 60vw;
        padding-left: 20vw;
    }
    
    main > section.left > article {
        width: 20vw;
    }
    
    main > section.right {
        padding-right: auto;
        padding-left: 53vw;
    }
    
    main > section.right > article {
        width: 20vw;
    }

    aside {
        width: 20vw;
    }
}