section.introduction {
    position: relative;
    padding: 15% 5%;

    font-size: 100%;

    background-color: #fafafa;
}

section.introduction header {
    margin-bottom: 5%;
}

section.introduction header h1 {
    font-family: cholla-wide, sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: 4rem;

    color: transparent;
    background-image: linear-gradient(#360021, #003d53);
    background-clip: text;
    -webkit-background-clip: text;
}

section.introduction h2 {
    margin-bottom: 1rem;
    font-weight: 300;
    font-size: 1.8rem;
    line-height: 1.5rem;

    color: #555555;
}

section.introduction p {
    margin-bottom: 1rem;
    font-weight: 300;
    font-size: 1.5rem;
    line-height: 1.5rem;

    color: #0a1c41;
}


section.introduction a {
    text-decoration: none;

    color: #000000;
}

section.introduction footer {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px #e8e8e8 dotted;
}

section.introduction a.lozenge {
    display: inline-block;
    padding: 1.5rem 3rem;
    border-radius: 10px;
    border-style: double;
    border-width: 5px;
    border-color: rgba(0, 0, 0, 0.1);
    text-align: center;

    color: #777777;
    background-color: #f7f7f7;

    transition: 200ms;
    transition-timing-function: ease-in-out;
}

section.introduction a.lozenge:hover {
    border-color: #bdff05;
    background-color: #ffffff;
}

section.introduction a.lozenge:active {
    border-color: #bdff05;
    background-color: #d1d1d1;
}




@media only screen and (max-width: 768px) {

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