@media (min-width: 1400px) {
    #home-video {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
    .hero-wrapper {
        text-align: center;
        height: 80vh;
    }
}

@media (max-width: 1200px) {

    .illustrations img {
        width: 60%;
    }

    .donate-btns a, a.action-button {
        width: 140px;
    }

}

@media (max-width: 1000px) {
    .background-gradient {
        height: 300px;
    }
    a.emg-header, a.donate-header {
        font-size: 20px;
    }
    a.emg-header {
        margin-left: 10px;
    }
}
@media (max-width: 900px) {
.popup-body .donate-btns {
    width: 100%;
}

.popup-body .donate-btns a {
    width: 112px;
}


.container.hamburger-icon {
    display: block;
}
.menu-wrapper.desktop {
    display: none;
}

a.donate-header {
    text-align: center;
    margin: 30px  auto !important;
}

a.emg-header.mobile {
    margin-top: 30px;
    margin-left: 0;
}

}

@media (max-width: 820px) {

    .background-gradient {
        height: 350px;
    }

    .media-content {
        flex-direction: column;
    }

    article.priorities-section .inner {
        width: 90%;
        padding-bottom: 27%;
    }

    .background-container {
        width: 100%;
        position: relative;
        margin: 50px 0;
    }
    .background-gradient {
        max-height: 650px;
        max-width: 550px;
        margin: 0 auto;
    }
    .background-container img,
    .background-container video {
        right: 0;
        left: 0;
        bottom: 4%;
        width: 100%;
        height: 90%;
        left: 50%;
        margin-left: -50%;
        object-fit: contain;
    }
    .media-content div {
        max-width: 97%;
    }

    .media-content.img-only {
        flex-direction: column;
    }
    
    .media-content.img-only img {
        width: 104%;
        margin: 30px 0;
    }

    .donate-btns {
        flex-wrap: wrap;
        width: 79%;
    }
    
    .donate-btns a {
        margin: 15px 3px;
    }
    
    .donate-text-container {
        height: 600px;
    }
    
    .inner.donate {
        width: 70%;
        margin: 0 auto;
    }

    .blue-box {
        margin-left: -10%;
    }
    
    .red-box {
        margin-right: -10%;
    }

    a.action-button {
        padding: 0 10%;
    }

    h1.hero-text.animate.fade-in-from-bottom.animated {
        font-size: 60px;
        width: 95%;
    }

    article.donate-section.animate.fade-in-from-bottom.animated {
        text-align: center;
        display: flex;
        justify-content: center;
    }
    
    .home-popup-wrapper .home-popup-inner video {
        width: 90%;
    }
    

}

@media (max-width: 650px) {

    .allies {
        flex-direction: column;
        margin-top: 2%;
    }

    .allies a {
        width: 75%;
        margin: 25px auto;
    }
    /* .allies .ally {
        width: 75%;
        margin: 25px auto;
    } */

    .allies h3 {
        margin-top: 10px;
    }

    .background-gradient {
        height: 374px;
    }

    .donate-btns a, a.action-button {
        width: 135px;
    }

}

@media (max-width: 600px) {

    .home-popup-wrapper .home-popup-inner {
        width: 98%;
        max-width: 98%;
    }
    
    .home-popup-wrapper .home-popup-inner .close-btnn {
        right: 0;
        width: 20px;
    }
    
    .home-popup-wrapper .home-popup-inner .inner-right h2 {
        width: 89%;
    }

    a.action-button.animate.fade-in-from-bottom.animated {
        width: 32px;
        height: 64px;
        padding: 0 75px;
        clip-path: polygon(12% 0%, 100% 0%, 88% 100%, 0% 100%);
    }

    .container.hamburger-icon {
        top: 9%;
    }

    header.site-header {
        padding-top: 20px;
        padding-bottom: 15%;
    }
    
    img.nav-logo-img {
        width: 58%;
        min-width: 135px;
        padding: 0;
        margin: 0;
        width: 350px;
        max-width: 90%;
    }
    
    .hero-wrapper {
        padding-top: 20%;
    }

    .donate-btns {
        width: 84%;
    }
    
    .donate-btns a {
        width: 95px;
    }

    .inner.donate {
        width: 90%;
    }
    
    .blue-box {
        display: none;
    }
    
    .red-box {
        display: none;
    }
    
    .donate-text-container {
        transform: unset;
        width: 90%;
        margin: 0 auto;
        height: 630px;
    }

    p, li {
        font-size: 24px;
        line-height: 1.3;
    }
    .intro p {
        font-size: 28px;
        line-height: 1.3;
    }

    h1 {
        font-size: 46px;
        line-height: 1.5;
    }

    h3 {
        font-size: 32px;
        line-height: 1.3;
        margin: 0;
        margin-bottom: 5%;
    }

    .hero-wrapper {
        /* padding: 13%; */
    }
    .media-content {
        padding: 10% 0;
    }
    
    .inner.intro {
        padding: 5% 0;
    }

    header.site-header {
        padding-top: 20px;
        padding-bottom: 16%;
        background: linear-gradient(180deg, #FFF 63%, rgba(255, 255, 255, 0.00) 100%);
    }

    .background-line {
        display: none;
    }

    .right-illustration.animate.fade-in-from-bottom.animated img {
        width: 52%;
    }
    
    
}


@media (max-width: 538px) {
    .hero-wrapper {
        /* padding: 22% 1% 12% 1%; */
    }

    .donate-btns {
        width: 62%;
    }

    h1.hero-text.animate.fade-in-from-bottom.animated {
        font-size: 44px;
        width: 95%;
        line-height: 1.2;
    }
    .background-line {
        width: 48%;
        transform: rotate(186deg);
        position: absolute;
        z-index: -1;
        top: 0;
        bottom: 0;
        right: 0;
        left: 16%;
        background: linear-gradient(22deg, rgba(179,199,255,0.177188) 22%, rgba(203,217,255,1) 36%, rgba(204,218,255,1) 88%, rgba(213,224,255,1) 100%);
    }

    .popup-body .donate-btns {
        width: 69%;
    }


}

@media (max-width: 400px) {

    .background-gradient {
        height: 300px;
    }


    h2 {
        font-size: 40px;
        line-height: 1.3;
    }

    .donate-btns {
        width: 82%;
    }

    .donate-btns a {
        width: 94px;
    }
}

@media (max-width: 350px) {
    .popup-body .donate-btns {
        width: 100%;
    }
}