.image-cover {
    width: 100%;
    padding: 0px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    flex-wrap: wrap;

    /* vertically center elements */
    align-items: center;
    /* horizontally center elements */
    justify-content: center;

    /* make text white */
    color: white;
}

.hero {
    height: 80vh;
}

.image-cover {
    height: 50vh;
}

.hero1-text {
    position: absolute;
    top: 50px;
    right: 15%;
    width: 65%;
    align-self: flex-start;
    text-align: center;
}

.divider {
    background: white;
    color: black;
    height: 32%;
    flex-wrap: wrap;
    align-content: center;
    padding: 40px;
}

.divider h1 {
    line-height: .7;
}

.divider h3, .divider h4 {
    width: 100%;
    text-align: center;
}

.about-me {
    height: 100vh;
}

.btn-container {
    display: flex;
    justify-content: space-evenly;
}

/* homepage testimonial is a unique style from the ones on the testimonials page */
.testimonial {
    background: var(--accent-overlay);
    color: white;
    padding: 20px;
    width: 100%;
    box-sizing: border-box;
}

@media screen and (max-width: 1200px) {
    .hero1-text {
        top: 80px;
        right: 7%;
        width: 70%;
        text-align: right;
    }

    .btn-container {
        display: flex;
        justify-content: space-between;
        width: 100%;
        flex-wrap: wrap;
        gap: 10px;
    }

    .btn-container .secondary-btn {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 700px) {
    .text-container h4 {
        text-align: center;
        width: 100%;
    }

    .hero, .image-cover {
        height: 65vh;
        justify-content: space-around;
    }

    .divider h1 .text-highlight {
        line-height: 1;
    }

    .divider h1 .smaller-h1 {
        line-height: 0;
    }
}