@media (max-width: 44em) {

    .open-nav {
        display: block;
    }

    .nav-menu {
        display: none;
    }


}

@media (max-width: 56.25em) {

    .about-container {
        flex-direction: column;
    }

    .about-textBox {
        order: 1;
    }
    .about-imgBox {
        order: 2;
    }

    .quad-container,
    .strip-container {
        grid-template-columns: 1fr 1fr;
    }

    .footer-container {
        grid-template-columns: 1fr;
        gap: 3.6rem;
    }


}


@media (max-width: 37.5em) {

    .hero-container {
        margin-top: 3.6rem;
    }

    .hero-header {
        font-size: 3.6rem;
    }

    .about-img,
    .list-img {
        width: 30rem;
    }

    .about-imgBox::after {
        right: 0.6rem
    }

    .list-imgBox::after {
        left: 0.6rem;
    }

    .quad-container,
    .strip-container {
        grid-template-columns: 1fr;
    }

    .strip-header,
    .strip-text {
        text-align: center;
    }

    .cta-container {
        grid-template-columns: 1fr;
        border-left: none;
    }

    .footer-logo {
        width: 10rem;
    }

}