/* Write your css codes here  */
.top-donate {
    position: absolute;
    z-index: 100;
    text-align: right;
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    right: 12px;
    background: #00acf0;
    padding: 5px 8px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.language-select {
    font-size: 12px;
}
a {
    display: inline;
    color: hsl(var(--primary));
}
a:hover {
    color: hsl(var(--secondary));
}
p {
    color: #666666;
}
.text--light {
    color: #fff!important;
}
.bdg-panel {
    background: #e7ffeb!important;
}
.cst-radius-05 {
    border-radius: .5rem!important;
}
.underline {
    text-decoration: underline;
}
.header .main-menu>li {
    display: inline-block;
}
.header {
    background: #fff;
}
.header-top {
    z-index: 999999;
}
.header.menu-fixed .header__bottom {
    background: #fff;
    border-bottom: 1px solid #582a75;
}
.header__bottom {
    border: none;
}
.header .site-logo img {
    max-height:6.125rem;
}
.header-btn {
    padding: 2.3rem 1.875rem;
}
#main_nav {
    margin-top: 4%;
}

/* Mega Menu Styling */
.navbar .dropdown-menu { border: none; border-radius: 0; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }

@media all and (min-width: 992px) {
    .navbar .has-megamenu { position: static; }
    .navbar .megamenu { 
        left: 0; right: 0; width: 100%; margin-top: 0; 
        padding: 30px; background: #fff; 
        border-top: 3px solid var(--zmbf-blue);
    }
    /* Hover Trigger */
    .nav-item.dropdown:hover .dropdown-menu { display: block; }
}

.nav-link { font-weight: 600; color: var(--zmbf-dark) !important; padding: 1rem !important; }
.nav-link:hover { color: var(--zmbf-blue) !important; }

.megamenu-title { 
    color: var(--zmbf-blue); 
    font-weight: bold; 
    margin-bottom: 15px; 
    font-size: 0.9rem;
    letter-spacing: 1px;
}

.megamenu-list { list-style: none; padding: 0; }
.megamenu-list li a { 
    text-decoration: none; 
    color: #555; 
    display: block; 
    padding: 5px 0; 
    transition: 0.3s; 
}
.megamenu-list li a:hover { color: var(--zmbf-green); padding-left: 5px; }

.featured-card {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 15px;
    border-left: 4px solid var(--zmbf-green);
}

.btn-zmbf { background-color: var(--zmbf-green); color: white; font-weight: 600; border-radius: 50px; }
.btn-zmbf:hover { background-color: #358d41; color: white; }
/* Styling for the Menu Image */
.menu-image-container img {
    width: 100%;
    height: 150px; /* Fixed height for consistency */
    object-fit: cover; /* Ensures the photo isn't stretched */
    border-bottom: 3px solid var(--zmbf-green); /* Subtle brand touch */
}

.image-caption {
    line-height: 1.2;
    font-size: 0.8rem;
}

/* Ensure the mega menu has enough room for the image */
@media all and (min-width: 992px) {
    .navbar .megamenu {
        padding: 40px; 
    }
}

.hero {
    padding:110px 0 0;
}
.hero::before {
    opacity: 0;
    background: #fff;
}
.hero__title {
    font-size: 3rem;
}
.hero__title-shed {
    color: #3fa64f;
    font-style: italic;
}
.header .main-menu>li a {
    color: inherit;
}
@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1140px;
    }
}
@media (min-width: 1061px) {
    div#navbarSupportedContent {
        position: absolute;
        /* right: 62px; */
        bottom: 25px;
        width: 100%;
        /* background: red; */
        /* top: 20px;
        /* right: 10px; */
        /* padding-right: 51px; */
    }
}
.caption-list li .caption, .cmn-btn, .cmn-btn-2:hover, [data-label]::before, .form-control:focus, .form--control:focus, .select, .header-btn, .about-thumb2 .video-btn, .campaign-item__tag, .campaign-item .bottom .single-amount .caption, .progressbar .label, .campaign-slider .slick-arrow, .overview-item .amount, .overview-item .caption, .volunteer-slider .slick-arrow, .testimonial-slider::after, .social-links li a:hover, .campaign-details-content .custom--nav-tabs .nav-item .nav-link.active, .d-widget__icon, .section-top-title, .preloader__circle i, .read-more-btn, .header .site-logo.site-title, .header .main-menu>li a.active, .header .main-menu>li .sub-menu li a:hover, .header-btn:hover, .inline-menu li a:hover, .footer-widget__menu li a:hover, .footer-widget__contact-list li .icon, .hero__top-title {
    color: #ffffff;
}
.cmn-btn,
.cmn-btn-2  {
    border-radius: 5px;
    box-shadow: none;
}
.about-thumb img {
    border-radius: 16px;
}
.about-thumb2 img,
.campaign-item img,
.volunteer-item .thumb,
.horizontal-cta-card__media img,
.stat-wrap img {
    border-radius: 5px;
}
.campaign-item {
    display: flex;
    padding: 16px 16px 24px 16px;
    flex-direction: column;
    gap: 24px;
    border-radius: 0;
    background: #ffffff;
    box-shadow: none;
    overflow: hidden;
    border: 1px solid transparent;
    transition: all 0.3s ease-in;
}
.main-banner {
    overflow: hidden;
    /*background-image: url(/assets/presets/default/images/bg.jpg);*/
    background: #00acf0 url(/assets/presets/default/images/pattern1.jpg);
    position: relative;
    padding: 80px 0;
}
.hero.container--ext .main-banner {
    background: #1A334FF2;
}
.bkg-transparent {
    background: transparent!important;
}
.mission-hero {
    background: #e7ffeb;
}
.container-fluid {
    width: 90%;
}
.container--ext {
    
}
.banner-container-outer {
    position: relative;
    width: 70%;
    margin: 0 auto;
}
.hero.container--ext .banner-container {
    height: 60vh;
    margin-top: 60px;
    position: relative;
}
.mission-hero .hero__title {
    font-size: 3rem;
    font-weight: normal;
    color: #00acf0;
    line-height: 65px;
}
.banner-container {
    height: 45vh;
}
.vdo-wrapper {
    position: relative;
    flex: 1;
}
.vdo-wrapper::before {
    content: "";
    display: block;
    width: 270px;
    height: 270px;
    position: absolute;
    top: -10px;
    right: -13px;
    background: url(/assets/presets/default/images/element-top.png) no-repeat;
}

.vdo-wrapper::after {
    content: "";
    display: block;
    width: 270px;
    height: 270px;
    position: absolute;
    bottom: -12px;
    left: -9px;
    background: url(/assets/presets/default/images/element-bottom.png) no-repeat;
}
.hero .hero-img-slider {
    z-index: 1;
}
.section-title {
    font-size: 2rem;
}
.horizontal-cta-card__title {
    min-height: 0;
    font-weight: 900;
    letter-spacing: normal;
    line-height: 1.2;
    text-transform: inherit;
    font-feature-settings: "ss04";
    color: initial;
}
.horizontal-cta-card__description {
    font-size: .875rem;
    line-height: 1.6;
}
.horizontal-cta-card__content {
    padding: 0 10px 0 15px;
}
.campaign-section-layer {
    background-color: #e7ffeb;
    height: 625px;
    background-image: url(src/images/donate/donate-bg.jpg);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 790px 490px;
}
.campaign-section-layer::before {
    opacity: 0;
}
.home-val.index-1 {
    background: hsl(var(--primary));
}
.home-val.index-2 {
    background: hsl(var(--secondary));
}
.home-val.index-3 {
    background: #402962;
}
.donate-amounts .home-val {
    width: 52px;
    height: 52px;
    display: inline-block;
    margin-right: 20px;
    float: left;
    position: absolute;
    margin-top: 0;
    border-radius: 50px;
    color: #fff;
    text-align: center;
    padding: 7px 0 0 0;
    font-size: 21px;
}
.donate-amounts h4 {
    margin-top: 30px;
    margin-left: 70px;
    width: 340px;
    margin-bottom: 25px;
    font-size: 1rem;
}
.form-inline {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
}
.donate-form-wrap .donate-form {
    width: auto;
}
.donate-form-wrap .form--control {
    width: 100%;
    height: 40px;
    line-height: 1.5;
    padding: 1px 0.375rem 1px 1.825rem;
}
.form-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px;
}
.currency-indicator.home {
    top: 1px;
    font-size: 22px;
}
.currency-indicator {
    position: absolute;
    top: 5px;
    left: 15px;
    z-index: 20;
    font-size: 1.5rem;
    color: #495057;
}
#home-donation-value {
    text-align: center;
    font-size: 19px;
}
@media (min-width: 576px) {
    .form-inline .form-group, .form-inline .wpcf7 .wpcf7-form p, .wpcf7 .wpcf7-form .form-inline p {
        display: flex;
        flex: 0 0 auto;
        flex-flow: row wrap;
        align-items: center;
        margin-bottom: 0;
    }
}
.btn-dark-yellow {
    background: #f3bc2b;
    background: linear-gradient(to bottom, #f3bc2b 43%, #d1980b 78%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3bc2b', endColorstr='#d1980b',GradientType=0 );
    padding: 5px 15px 10px 15px;
    border-radius: 8px;
    color: #ffffff;
    text-transform: uppercase;
    text-align: center;
    font-weight: 700;
}
.home-donation-value {
    text-align: center;
    font-size: 19px;
}
.donate-form-wrap .btn {
    width: auto;
    height: auto;

}
.post-item__thumb {
    height: 200px;
    position: relative;
}
.cat-base {
    position: absolute;
    bottom: 0;
    left: 0;
    margin-top: -27px;
    padding-left: 10px;
    color: #fff;
    border-bottom: 27px solid hsl(var(--primary));
    border-left: 0;
    border-right: 18px solid transparent;
    height: 0;
    width: 60%;
}
.overview-area .right {
    width: 100%;
    background: transparent;
}
.about-thumb2 {
    position: relative;
    width: auto;
    height: auto;
}
footer .social-links li a {
    i {
        color: #fff!important;
    }
}
