:root{
    --primary: #707070;
    --secondary: #d41414;
}
.cover {
    position: absolute;
    top: 0;
    height: 100vh;
}

.contactContent {
    margin: auto;
    min-height: 83vh;
    margin-top: 10vh;
    position: relative;
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    width: 90%;
}

.contentBox {
    width: 100%;
    margin-top: 4vh;
    margin-bottom: 5vh;
}

.pageHeading {
    text-align: center;
    font-size: 3rem;
}


.infoText p, .infoText h1 {
    text-align: center;
}

.mail, .contactSocial {
    color: var(--secondary);
}

.mail:hover, .contactSocial:hover {
    color: var(--primary);
}

.contactSocial {
    font-size: 1.5rem;
}

.contactBtn {
    position: inherit;
}






@media screen and (max-width: 21.25em) {

    .mail {
        font-size: 1.2rem;
    }
    
    .contactSocial {
        font-size: 1rem;
    }

    .smallBreak {
        display: none;
    }
}



@media screen and (min-width: 21.25em) and (max-width: 43.75rem) {

    .mail {
        font-size: 1.5rem;
    }
    
    .contactSocial {
        font-size: 1.2rem;
    }

    .smallBreak {
        display: none;
    }
}