@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700&display=swap');

:root {
  --primary-color: #1a2a4e;
  --secondary-color: #3658a3;
  --background-color: #ffffff;
  --light-background-color: #babfca;
  --dark-background-color: #1a2a4e;
  --national-red: #c00;
  --national-blue: #3658a3;
  --text-color: #222;
  --white-text-color: #fff;
}

body {
    font-family: 'Roboto', Helvetica, Arial, sans-serif;
    background: var(--dark-background-color);
    margin: 0;
    min-height: 100vh;
}

header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0px 80px;

    .logo {
        background-color: var(--national-red);
        text-align: center;
        padding: 20px 10px;
        height: 200px;
        width: 120px;

        img {
            width: 100%;
            height: auto;
        }
    }
}

main {
    width: 100%;
    padding-bottom: 2rem;
    background-color: var(--background-color);

    .logo {
        background-color: var(--national-red);
        text-align: center;
        padding: 20px 10px 100% 10px;
        height: auto;
        width: 100%;

        img {
            width: 100%;
            height: auto;
        }
    }

    section {
        border-left: var(--background-color) solid 4px;
        padding: 0.5rem 2.5rem;
        margin: 1rem 0;
        text-align: left;
        font-size: 1.2rem;
    }
    
    section.hero {
        font-size: 2.4rem;
    }

    section.box {
        border: 1px solid var(--light-background-color);
        border-radius: 8px;
        padding: 1rem;
        margin: 1rem 0;
    }

    section.disclaimer {
        border-color: var(--secondary-color);
        font-size: 1.2em;
    }

    .highlight-red {
        color: var(--national-red);
        font-weight: bold;
    }

    .highlight-blue {
        color: var(--national-blue);
        font-weight: bold;
    }
}

footer {
    width: 100%;
    margin: 0px auto;
    padding: 20px 0px;
    background-color: var(--dark-background-color);
    color: var(--white-text-color);

    p {
        margin: 0;
        padding: 0;
    }
}