#lottie-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}
.modal-content{
    border:none !important;
}
.ff-message-success{
font-size:1.6rem !important;
}
.fluentform .ff-el-is-error .text-danger {
    font-size: 1.6rem !important;
}
.donate{
    border: .2rem solid #E6E6E6;
    background-color: white;
    border-radius: 2rem;
    padding: 1.8rem;
    transition: .3s all;
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    text-align: center !important;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    align-items:center;
    justify-content: center;
    max-width: 9.3rem;
    cursor: pointer;
}

.donate-img-hover{
    display: none;
}
.donate:hover .donate-img-hover{
    display: block;
}
.donate:hover .donate-img{
    display: none;
}
.donate h4{
    color: #014DD4;
    transition: .3s all;
}
.donate:hover h4{
color: white;
writing-mode: sideways-lr;
}
.donate:hover{
background: #014DD4;
border: .2rem solid #014DD4;
gap: 2.6rem;
width: inherit;
}
#donateModal .modal-dialog{
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    margin: 0;

}
#donateModal .modal-content{
    background: transparent;
}
#donateModal .modal-body{
    background: white;
    margin-top: 1rem;
    border-radius: 1.5rem;
}
ul{
    padding-left: 0 !important;
    padding-right: 0 !important;
}
#lottie-animation svg{
    width: 50% !important;
    height: 50% !important;
}
/* About Modal Styling */
#about .modal-content {
    background: #000000;

}

#about #mission {
    background: #DBEFE1;
    border-radius: 2rem;
}

#about .rect {
    width: 100%;
    background: black;
}

#about .mini-rect-bottom {
    display: flex;
    justify-content: end;
}
#about #values{
    background: #E2E9FF;
    border-radius: 2rem;
}
#about .value-card{
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
    margin-bottom: 2rem;
}
#about #core-values{
    margin-top: -3rem;
}

#about .modal-body{
    display: flex;
    justify-content: start;
    flex-direction: column;
    width: 100%;
}
#about .value-card img{
    width: clamp(3rem, 3vw, 3vw);
}

/* End of About Modal Styling */

/* Contact Modal Styling */
#contact .modal-content {
    background: #000000;

}
#contact .modal-body{
    display: flex;
    justify-content: start;
    flex-direction: column;
    width: 100%;
}
#contact .contact-section{
    background: #F8F7F0;
    border-radius: 2rem;
}
#contact .rect {
    width: 100%;
    background: black;
}
.btn-close{
    padding: 1rem;
    border-radius: 2rem;
    opacity: 1;
}
/* #contact .collaborate{
    background: black;
} */
/* #contact .collaborate-content{
    background: linear-gradient(45deg,#CDD4F5,#FFFFFF );
} */
#contact .partnership{
    gap: 1.5rem;
    flex-wrap: wrap;
    display: flex;
}
#contact .collaborate-content{
    border-radius: 2rem;
}
#contact .side{
    display: flex;
    height: 100%;
    justify-content: space-between;
    flex-direction: column;
    align-items: start;

}
.rtl #contact .side{
    align-items: start;
}
#contact .contact-footer{
    background: linear-gradient(20deg, #DAE0F8, #FFFFFF);
    border-radius: 2rem;

}
#contact .contact-footer-inner{
    display: flex;
    gap: 2rem;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
#contact .contact-info{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3rem;
}
#contact .divider{
    width: .2rem;
    background: #707070 ;
    opacity: .3;
    height: 3rem;
}
#contact .socials{
    display: flex;
    gap: 3rem;
    align-items: center;
}
/* End of Contact Modal Styling */
.green {
    color: #51B770;
}

.blue {
    color: #537AFF;
}
.white{
    color: white;
}
.black{
color: #323230;
}
.post, .page {
    margin: 0 0 0;
}
.hero-header{
    background: #51B770;
    padding: 1.5rem 3rem;
    border-radius: 1.5rem;
    color: white;
    display: inline-block;
}
.o-50{
    opacity: .5;
}
.nav-wrapper{
    position: fixed !important;
    top: 0;
    width: 100%;
    z-index: 1000;
    background: rgba(255, 255, 255, 0.4);
}
nav.navbar {
    backdrop-filter: blur(30px) brightness(115%);
    background: rgba(255, 255, 255, 0.04); /* 0% opacity */

}
nav.navbar .navbar-nav h5{
    color: #323230;
}
.nav-wrapper nav .custom-logo{
    width: 20rem;
}
nav.navbar .navbar-nav{
    gap: 2rem 6rem;
    margin-inline-start: auto;
    align-items: center;
}
nav.navbar .navbar-nav select, nav.navbar .navbar-nav option{
    font-size: clamp(1.8rem, 0.9375vw, 0.9375vw); /*18px*/;
    background: transparent !important;
    border: none !important;
    outline: none !important;

}
nav.navbar .navbar-nav option{
    padding: 1rem;
}
footer{
    background: #323230;
}
footer .links{
    display: flex;
    height: 100%;
    align-items: center;
    gap: clamp(3.2rem, 3.64vw, 3.64vw);
    justify-content: end;


}
footer .links a{
    text-decoration: none;
    display: block;
}
footer .footer-circle{
    width: 1rem;
    min-width: 1rem;
    height: 1rem;
    background-color: white;
    border-radius: 50%;
    opacity: 50%;
}
footer .copyright{
    display: flex;
    gap: clamp(2rem, 1.7vw, 1.7vw);
    align-items: center;

}
footer .copyright a{
    text-decoration: none;
}
footer .row:last-child{
    border-top: .1rem solid rgba(255, 255, 255 ,.3);
}
footer .social{
    display: flex;
    align-items: center;
    gap: clamp(2rem, 1.7vw, 1.7vw);
    justify-content: end;

}
.mobile-only{
    display: none !important;
}
.desktop-only{
    display: block !important;
}
@media screen and (max-width:992px){


    .donate h4{
        color: #014DD4;
        transition: .3s all;
    }
    .donate:hover h4{
    color: #014DD4;
    writing-mode: horizontal-tb;
    }
    .donate:hover{
    background: white;
    border: .2rem solid #E6E6E6;
    gap: 1.4rem;
    width: inherit;
    }
    nav.navbar .navbar-nav{
        margin: 2rem 0;
    }
    .mobile-only{
        display: block !important;
    }
    .desktop-only{
        display: none !important;
    }
    footer .social,  footer .links{
        padding-top: 1rem;
        justify-content: start;
        padding-bottom: 1rem;
    } 
 
    footer .copyright{
        flex-direction: column;
        align-items: start;
        gap: 1rem;

    }
    .footer-circle{
        display: none;
    }
    /* Modal Styling */

    #about #mission{
        padding: 2.5rem;
    }
    #about .mission-text, #about .vision-text{
        padding: 0 !important;
    }
    #about .mission-text{
        padding-bottom: 5rem !important;
    }
    #about .text.px-5.pb-7{
        padding: 0 !important;
        padding-bottom: 3rem !important;
    }
    #about #core-values{
    margin-top: 4rem;
}
.btn-close{
    padding: 0.6rem;
    border-radius: 2rem;
    opacity: 1;
}
#about .value-card{

    margin-bottom: 4rem;
}
.modal-fullscreen .modal-body{
    overflow-y: initial;
}
.modal-fullscreen .modal-content{
    height: unset;
    min-height: 100vh;
}
#mv{
    margin-top: 4rem;
}
#contact .modal-body{
    margin-top: 4rem;
}

#contact .side{
padding: 2.5rem 0;
}
#contact .side h3.p-5{
padding: 0 !important;
}
}