@font-face
{
    font-family: "Open Sans";
    src:    local("Open Sans"),
            url("/assets/open-sans/font.woff2"),
            url("/assets/open-sans/font.woff"),
            url("/assets/open-sans/font.ttf");
}
@font-face
{
    font-family: "Open Sans";
    font-weight: bold;
    src:    local("Open Sans"),
            url("/assets/open-sans/font-bold.woff2"),
            url("/assets/open-sans/font-bold.woff"),
            url("/assets/open-sans/font-bold.ttf");
}
@font-face
{
    font-family: "Open Sans";
    font-style: italic;
    src:    local("Open Sans"),
            url("/assets/open-sans/font-italic.woff2"),
            url("/assets/open-sans/font-italic.woff"),
            url("/assets/open-sans/font-italic.ttf");
}
@font-face
{
    font-family: "Open Sans";
    font-weight: bold;
    font-style: italic;
    src:    local("Open Sans"),
            url("/assets/open-sans/font-bold-italic.woff2"),
            url("/assets/open-sans/font-bold-italic.woff"),
            url("/assets/open-sans/font-bold-italic.ttf");
}

body
{
    font: normal 14px "Open Sans", sans-serif;
    padding: 0em;
    margin: 0em;
}

/*
    Skip to main content (accessibility)
*/

#skip-to-content
{
    position: absolute;
    top: -10em;
    text-align: center;
    padding: 0.4em;
    font-size: 1.5em;
    background: red;
    color: #fff;
}

#skip-to-content:focus,
#skip-to-content:active,
#skip-to-content:hover
{
    top: 0;
}

@media all
{
    body
    {
        min-width: 900px;
    }
    .wrapper
    {
        background: #fff;
    }
}

@media screen
{
    body
    {
        background: #131418;
        margin: 1em;
    }
    .options
    {
        margin: 0.5em 0.5em 1.25em 0.5em;
        text-align: center;
        font-size: 1.1em;
    }
    .options a
    {
        padding: 0.25em;
        color: #fff;
    }
    .options a:hover, .options a:focus
    {
        color: #c4e2f9;
    }
    .wrapper
    {
        width: 8.27in;
        margin: 1em auto 3em auto;
        padding: 2em;
    }
}

@media print
{
    .options
    {
        display: none;
    }
    .wrapper
    {
        width: 100%;
        margin: 0em;
    }
}
h1
{
    margin: 0em;
    padding: 0em;
    text-align: center;
    color: #333;
    font-size: 2em;
    font-weight: normal;
}
a
{
    color: #3e4fb1;
}

.contact
{
    display: flex;
    border-bottom: solid 2px #ccc;
    padding: 1em 0;
    margin: 0 0 1rem;
    font-weight: bold;
    font-size: 0.8rem;
}

.contact .item
{
    flex-grow: 1;
    text-align: center;
    vertical-align: middle;
}
.contact .item:nth-child(1)
{
    text-align: left;
}
.contact .item:last-child
{
    text-align: right;
}


.section
{
    margin: 1em;
    display: flex;
}
.section .header
{
    flex: 0 0 9rem;
}
.section .content
{
    flex-grow: 1;
}
.wrapper .section.first
{
    margin-top: 0.25em;
}
.section .header h2
{
    margin: 0em;
    padding: 0em 0.5em 0em 0em;
    color: #3e4fb1;
    font-size: 1rem;
    text-transform: uppercase;
}
.section .content .item
{
    clear: both;
    margin-bottom: 0.5em;
}
.section .content .item:last-child
{
    margin-bottom: 0em;
}
.section .content .item .time
{
    float: right;
    color: #666;
    text-align: right;
    padding: 0 0 0.5rem 0.5rem;
}
.section .content .item .text
{
    text-align: justify;
}