/* MARK: Body */

body {
    width: 100%;
    margin: 0 auto;
    padding-top: 2em;
    min-height: 100vh;
    
    font-family: 'Verdana', 'Arial', 'Helvetica', sans-serif;
    font-size: 10pt;
    
    background-color: #0737c8;
    color: #FFEEFF;
    
    background:
    /* Checkerboard */
    linear-gradient(45deg,
    rgba(255,255,255,.025) 25%,
    transparent 25%,
    transparent 75%,
    rgba(255,255,255,.025) 75%),
    linear-gradient(45deg,
    rgba(255,255,255,.025) 25%,
    transparent 25%,
    transparent 75%,
    rgba(255,255,255,.025) 75%),
    /* Blue gradient */
    linear-gradient(to bottom,
    hsl(225, 100%, 25%) 0%,
    hsl(205, 100%, 50%) 100%) no-repeat;
    background-size:
    64px 64px,
    64px 64px,
    100vw 100vh;
    background-position:
    0 0,
    32px 32px,
    0 0;
    background-attachment: fixed;
}

a {
    color: hsl(45, 100%, 50%);
    text-decoration: none;
}

img {
    max-width: 100%;
    max-height: 500px;
}

table {
    font-size: 1em;
}

tr {
    height: 2em;
}

li {
    line-height: 1.5em;
    margin-bottom: 1em;
}

/* MARK: Links */

/* MARK: Sections */

header, footer {
    padding: 1em 0;
}

header {
    display: flex;
    flex-direction: row;
    margin-left: 2em;
}

header #logo {
    display: flex;
    flex-direction: row;
    align-items: center;
}

header #logotype {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

header h1, header h2 {
    background-color: transparent;
    color: hsl(45, 100%, 50%);
    text-shadow: 0 5px 20px black;
    font-family: 'Impact', 'Arial Black', sans-serif;
    font-size: 64px;
    padding: 0;
    margin: 0;
}

header h2 {
    font-family: 'Palatino', 'Times', 'Times New Roman', serif;
    font-size: 32px;
}

header img {
    height: 150px;
    width: 150px;
    margin: 0 2em;
}

footer {
    text-align: center;
}

nav {
    background-color: #002142;
    min-width: 240px;
    max-width: 240px;
    border-radius: 24px 0 0 24px;
}

#latest-posts {
    border-radius: 0 24px 24px 0;
}

.link-title {
    display: flex;
    flex-direction: column;
}

.link-title span:first-of-type {
    font-weight: bold;
}

.link-title span:last-of-type a, #logotype {
    text-decoration: none;
}

/* Main */

#main {
    display: flex;
    flex-direction: row;
    background: #01295A;
    border: 16px solid hsl(225, 50%, 15%);
    border-radius: 24px;    
    margin: 0 2em;
}

#main p {
    line-height: 1.5em;
}

main {
    display: flex;
    flex-direction: column;
    padding: 0 3em;
}