
body {
    background-color: #1d2836;
    font-family: Inter, Arial, Helvetica, sans-serif;
    font-size: 16pt;
    margin: 0;
    padding: 0;
}

h1 {
    margin-top: 0;
    font-size: 1.66em;
}

h2 {
    font-size: 1.25em;
}

p {
    line-height: 1.5em;
}

a {
    color: #006591;
    font-weight: bold;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.heading-small {
    color: #795a15;
    font-size: .8em;
    margin-bottom: 0.5rem;
    margin-top: 0;
}

.tagline {
    font-size: 1.5em;
    font-weight: bold;
    margin: 0;
}

.dl-link {
    background: url("img/arrow-down.svg") no-repeat right center;
    padding-right: 1.5rem;
}
.ext-link {
    background: url("img/ext.svg") no-repeat right center;
    padding-right: 1.5rem;
    padding-left: 1.5rem;
}

.title-link {
    color: #795a15;
    font-size: 0.8em;
}

.button {
    background-color: #076f9b;
    border-radius: 0.5rem;
    color: #fff;
    display: inline-block;
    font-weight: bold;
    font-size: 0.85em;
    padding: 0.75rem 1.5rem;
    text-decoration: none;
    min-width: 12em;
}

.button:hover {
    background-color: #2e769f;
}

.button:active {
    background-color: #076f9b;
    transform: scale(0.98);    
}

.content :first-child {
    margin-top: 0;
}

.content :last-child {
    margin-bottom: 0;
}

header {
    background: url("img/logo-white.svg") no-repeat center center;
    background-size: 10rem;
    color: #fff;
    padding: 3rem 0;
    text-align: center;
}

    header a {
        display: inline-block;
    }

    .header-logo {
        visibility: hidden;
    }

main {
    background-color: #e8e8e8;
}

    main p {
        color: #475467;
    }

    main .heading-small {
        color: #795a15;
    }
    

    main .tagline {
        color: #000;
    }
    

    section {
        display: block;
        padding: 3rem 1rem 0 1rem;
    }

    main .content {
        margin: auto;
        max-width: 57em;
    }


    .section-registration {
        background-color: #1d2836;
        color: #fff;
        text-align: center;
    }

        .section-registration .content {
            max-width: 35em;
        }

        .section-registration h1 {
            font-size: 4.5rem;
        }

        .section-registration p {
            color: #fff;
        }

        .section-registration .button-container {
            display: inline-block;
            padding: 2rem 0;
            margin: 0em .5em 1.5em .5em;
            text-align: center;
        }
    
    .section-instructional {
        background: linear-gradient(
            to bottom,
            #1d2836 0%,
            #1d2836 50%,
            #e8e8e8 50%,
            #e8e8e8 100%
        );
        text-align: center;
    }

    .section-instructional .video {
        background-color: #151c25;
        width: 100%;
    }

    .section-resources {
        background-color: #e8e8e8;
        padding-bottom: 6rem;
    }

        .section-resources p {
            max-width: 40em;
        }

    .boxes {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
        margin-top: 3rem;
    }

        .box {
            background-color: #fff;
            background-position: 1.5rem 1.5rem;
            background-repeat: no-repeat;
            display: inline-block;
            flex: 1 1 0;
            flex-wrap: wrap;
            font-size: 0.8em;
            min-width: 10em;
            padding: 5rem 1.5rem 1.5rem 1.5rem;
        }

        .box:first-of-type {
            margin-left: 0;
        }

        .box:last-of-type {
            margin-right: 0;
        }

        .box-intro {
            background-image: url("img/icon-presentation.svg");
        }

        .box-manual {
            background-image: url("img/icon-wrench.svg");
        }

        .box-stats {
            background-image: url("img/icon-graph.svg");
        }

            .box :first-child {
                margin-top: 0;
            }

            .box :last-child {
                margin-bottom: 0;
            }

footer {
    color: #fff;
    padding: 4em 0;
    text-align: center;
}

    footer a {
        color: #1fa6e0;
    }

    footer .heading-small {
        color: #edb436;
    }

    footer .tagline {
        color: #fff;
        font-size: 2.25em;
    }

    footer p {
        color: #adbbce;
    }

    footer .content {
        margin: auto;
        max-width: 35em;
    }

    footer .email {
        margin-top: 6rem;
    }
    
    footer .email a {
        background: url("img/icon-mail.svg") no-repeat center top;
        display: inline-block;
        padding-top: 4rem;
    }

@media (max-width: 40rem) {
    section {
        padding: 1rem;
    }

    .section-registration {
        text-align: left !important;
    }

    .section-registration h1 {
        font-size: 2rem;
    }

    .section-registration .button-container {
        text-align: center;
    }

    .section-resources {
        padding-bottom: 3rem;
    }

    footer {
        padding: 2rem 1rem;
    }

    footer .tagline {
        font-size: 2rem;
    }

    footer .email {
        margin-top: 4rem;
    }
}
