:root {
    --color: #417FC6;
    --colorSecondary: #969696;
    --colorHighlight: #ECD96B;
    --colorBackground: #F8F8F8;
    --colorWarning: #D44B6B;
    --font: 1em Arial, sanserif;
    --img-border: solid 0.175em;
}

* {
    margin: 0 .5em;
    padding: 0;
    box-sizing: border-box;
    color: var(--color);
    background: var(--colorBackground);
    font: var(--font);
}

body {
}

a {
    margin: 0;
    background: transparent;
    color: inherit;
    font: var(--font);
    text-decoration: none;
}

header {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
    margin: 0;
    display: block;
}

headerimg img {
    margin: 0;
    width: 100%;
    border-top: var(--img-border);
    border-bottom: var(--img-border);
    border-color: var(--color);
}

nav {
    margin: 0;
    width: 100%;
    display: inline-block;
}

    nav ul {
        display: inline-block;
        margin: 0.25em 0;
        float: left;
        list-style-type: none;
        overflow: hidden;
    }

    nav li {
        margin: 0;
        height: 100%;
        display: block;
        float: left;
        text-align: center;
        padding: 0.5em;
    }

        nav li:hover {
            background: var(--colorSecondary);
            color: var(--colorBackground);
        }

navimg img {
    margin: 0.5em 0;
    height: 1.5em;
    display: block;
}

main {
    position: static;
    margin: auto 0.5em;
}

footer {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    bottom: 0;
    width: 100%;
    border-top: var(--img-border);
    border-color: var(--color);
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.h1 {
    font-size: 2.5em;
    font-weight: bold;
}

.h2 {
    font-size: 2em;
    font-weight: bold;
}

.h3 {
    font-size: 1.5em;
    font-weight: bold;
}

.mt-0 {
    margin-top: 0;
}

.mt-1 {
    margin-top: 0.25em;
}

.mt-2 {
    margin-top: 0.5em;
}

.mt-3 {
    margin-top: 0.75em;
}

.mt-4 {
    margin-top: 1em;
}

.mt-5 {
    margin-top: 1.25em;
}

.mt-6 {
    margin-top: 1.5em;
}

.mt-7 {
    margin-top: 1.75em;
}

.mt-8 {
    margin-top: 2em;
}

.mt-9 {
    margin-top: 2.5em;
}

.ml-0 {
    margin-left: 0;
}

.ml-1 {
    margin-left: 0.25em;
}

.ml-2 {
    margin-left: 0.5em;
}

.ml-3 {
    margin-left: 0.75em;
}

.ml-4 {
    margin-left: 1em;
}

.ml-5 {
    margin-left: 1.25em;
}

.ml-6 {
    margin-left: 1.5em;
}

.ml-7 {
    margin-left: 1.75em;
}

.ml-8 {
    margin-left: 2em;
}

.ml-9 {
    margin-left: 2.5em;
}

.mr-0 {
    margin-right: 0;
}

.mr-1 {
    margin-right: 0.25em;
}

.mr-2 {
    margin-right: 0.5em;
}

.mr-3 {
    margin-right: 0.75em;
}

.mr-4 {
    margin-right: 1em;
}

.mr-5 {
    margin-right: 1.25em;
}

.mr-6 {
    margin-right: 1.5em;
}

.mr-7 {
    margin-right: 1.75em;
}

.mr-8 {
    margin-right: 2em;
}

.mr-9 {
    margin-right: 2.5em;
}

.mr-0 {
    margin-bottom: 0;
}

.mb-1 {
    margin-bottom: 0.25em;
}

.mb-2 {
    margin-bottom: 0.5em;
}

.mb-3 {
    margin-bottom: 0.75em;
}

.mb-4 {
    margin-bottom: 1em;
}

.mb-5 {
    margin-bottom: 1.25em;
}

.mb-6 {
    margin-bottom: 1.5em;
}

.mb-7 {
    margin-bottom: 1.75em;
}

.mb-8 {
    margin-bottom: 2em;
}

.mb-9 {
    margin-bottom: 2.5em;
}