/* Some legacy stuff that still needs a new place. */

html {
    color: #333;
    font-family: var(--ff-humanist);
}
body {
    background: #aaa;
    margin: 0;
}

header {
    background: #ddd;
    border-bottom: 2px solid #d8d8d8;
    padding: 1em;
}

header .logo {
    max-width: min(20em, 100%);
}

header > .slogan {
    font-size: 1.333em;
    font-style: italic;
    margin-left: 1em;
}

/* Main menu. */
nav.main {
    float: right;
}
nav.main > ul {
    display: inline;
    padding-left: 0;
}
nav.main > ul > li {
    display: inline-block;
}

main {
    background: #eee;
    border-bottom: 2px solid #ccc;
    box-shadow: inset 0 47px 10px -50px black;
    min-height: 5em;
    padding: .5em;
}
main > section {
    margin: 0 auto;
    max-width: 70em;
}

footer {
    margin: 0 auto;
    max-width: 70em;
    padding: .5em;
}

/* Individual UI elements. */

article {
    font-family: var(--ff-transitional);
    margin: 0 auto;
    max-width: 70em;
}

article img {
    background: #e7e7e7;
    border: 1px solid #ccc;
    border-radius: .5em;
    float: right;
    max-width: min(40em, 50%);
    padding: .5em;
}
article:after {
    clear: both;
    content: "";
    display: table;
}