@import url('https://fonts.googleapis.com/css?family=Oswald');
/*
    @import url('https://fonts.googleapis.com/css?family=Inter');
    @import url('https://fonts.googleapis.com/css?family=Archivo+Narrow');
    @import url('https://fonts.googleapis.com/css?family=Roboto+Condensed');
*/

    html {
        font-family: sans-serif;
        line-height: 120%;
        margin: 0;
        padding: 0;
    }
    body {
        font-family: 'Oswald', sans-serif;
/*
        font-family: 'Archivo Narrow', sans-serif;
        font-family: 'Roboto Condensed', sans-serif;
        font-family: 'Inter', sans-serif;
        font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
 */
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        padding: 2em 1em 0 1em;
        margin: 0;
    }
    h1, h2, h3, h4, h5, h6 {
        font-variant: small-caps;
        padding-top: 1.1em;
    }
    h1 {
        text-transform: uppercase;
    }
    h2 {
        color: #000;
        color: rgba(0, 0, 0, 0.9);
        text-transform: uppercase;
    }
    h3 {
        color: #000;
        color: rgba(0, 0, 0, 0.8);
    }
    h4 {
        color: #000;
        color: rgba(0, 0, 0, 0.7);
    }
    h5 {
        color: #000;
        color: rgba(0, 0, 0, 0.6);
    }
    ul {
        list-style-type: '– ';
    }
    li {
        padding-top: 0.2em;
    }
    a {
        text-decoration: none;
    }
    div.container {
        width: 80%;
        margin: 0 auto;
    }
    div.tiles {
        display: flex;
        flex-wrap: wrap;
    }
    div.tiles div.tile {
        display: flex; 
        float: left; 
        max-width: 80%;
        min-width: 500px;
        width: 500px;
        padding: 2em 1em;
    }


    header {
        margin: 0;
        padding: 0 2em;
    }
    header img {
        margin: 0;
        padding: 0;
    }
    div.navbar {
        font-size: 120%;
        border-top: 1px solid #A0A0A0;
        border-bottom: 1px solid #A0A0A0;
        padding: 0 2em;
        min-width: 30%;
        width: 30%;
    }
    div.navbar a {
        display: inline;
        line-height: 120%;
        margin: 0;
        padding: 0.5em 3em;
        text-transform: uppercase;
    }
    div.navbar a:after {
        content: " | ";
    }
    div.navbar a:last-child:after {
        content: "";
    }

    div.banner {
        margin: 2em 0;
        width: 100%;
        max-width: 100%;
    }

    footer {
        background-color: #641968; 
        color: #c9bcbc;
        text-align: center;
        width: 120%;
        margin: 6em -5em 0 -5em;
    }

    footer a {
        color: #c9bcbc;
    }