
:root {
    --white-color: #fff;  
    --black-color: #222;
    --yellow-color: #ffe116;
    --green-color: #009246;
    --red-color: #ce2b37;
}

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    color: var(--black-color);
}

body {
    color: var(--black-color);
}


.nav-link {
    color: var(--black-color);
}

.btn:hover {
    color: var(--black-color);
    background-color: var(--yellow-color);
    border-color: var(--yellow-color);
}


.sticky-navbar.sticky .navbar-brand {
    padding-top: 3px;
    padding-bottom: 3px;
}

.hero-6 .hero-inner-text h2,
.hero-6 .hero-inner-text p {
    text-shadow: 1px 1px 5px var(--black-color);
    color: var(--white-color);
}

.btn-white {
    --bs-btn-color: var(--black-color);
    --bs-btn-hover-color: var(--black-color);
}

.greenBg {
    background: var(--green-color) !important;
}

.check-circle-icon svg {
    stroke: var(--red-color);
}

.progress-wrapper {
    background-color: var(--yellow-color);
}

.volunteer-wrapper {
    --bg-parallax-image: none */
}

.volunteer-wrapper::before {
    background: rgba(0,0,0, 0.5);
}

.blog-date-wrapper.blog-date-wrapper-position {
    top: calc(-1.2 * var(--bs-blog-date-wrapper-position));
    left: var(
    --bs-blog-date-wrapper-position);
}

.date .lead, .month p {
    font-size: 1rem;
}

.card-title, .post-list {
    color: var(--black-color);
}

.news-link a {
    color: var(--black-color);
}

.footer-separator {
    border-bottom: 1px solid var(--white-color);
}

footer .copyright p, footer .copyright a {
    color: var(--white-color)
}

.banner-heading {
    color: var(--white-color);
    text-shadow: 1px 1px 5px var(--black-color);
}

.form-control {
    padding: 0px 5px;
    border-color: rgba(0,0,0, 0.1);
    line-height: 2.5rem;
}

.contact-form-wrapper h2 {
    font-size: 1.5rem;
}

.contactTitle {
    font-size: 2.5rem;
}

.section-contact .contact-lists h5 a {
    font-size: 1.2rem;
}

.socialContact a {
    background-color: var(--red-color);
}

.banner-1::before {
    background: none;
}

.hero-6 .hero-wrapper {
    --bg-parallax-opacity: 0.7;
}

.contact-form .col-md-6, 
.contact-form .col-12 {
    margin-top: 1rem;
}

.breadcrumb span {
    color: var(--white-color);
}

.breadcrumb a {
    color: var(--white-color);
    text-decoration: none;
    transition: all 500ms ease;
}

.breadcrumb a:hover {
    color: var(--red-color);
}

.breadcrumb .breadcrumb_last {
    color: #fff;
}

.historical-image {
    filter: none;
}

.historical-year-wrapper .historical-year {
    color: #fff;
}

.widget-programs {
    padding: 30px;
    border-radius: 10px;
    background-color: #f9f9f9;
}

h5.campaign-info {
    border-bottom: var(--bs-border-width) var(--bs-border-style) rgba(73,80,87, 0.3);
}

.widget-programs li a {
    color: var(--black-color);
}

.arrow-icon svg {
    stroke: #222;
}

.arrow-icon:hover svg {
    stroke: #fff;
}

.politixySwiper-button-next, .politixySwiper-button-prev {
    --bs-politixySwiper-button-border-color: #222;
    border: 1px solid #222;
}

.politixySwiper-button-next:hover, .politixySwiper-button-prev:hover {
    --bs-politixySwiper-button-border-color: var(--bs-primary);
    border: 1px solid var(--bs-primary);
}

.heading-color-style-1 {
    color: #222;
}

.body-color-style-1 {
    color: #b5b5b5;
}

.portfolio-image-style-4 img {
    height: auto;
}

.testimonial-image-wrapper img {
    max-height: 360px;
}

.testimonial-contents {
    top: 0px;
}

.hero-5 .hero-inner-text, .hero-6 .hero-inner-text {
    max-width: 950px;
}

.hero-wrapper .hero-inner-text {
    padding: 290px 0;
}



@media screen and (max-width: 767px) {
    .hero-inner-text {
        padding-bottom: 1.5rem !important;
    }

    .testimonialSwiper-buttons {
        bottom: 8px;
    }
}

@media screen and (max-width: 991px) {
    .navbar .logo img {
        max-height: 80px;
    }

    .heroSwiper .swiper-pagination-bullets.swiper-pagination-horizontal {
        bottom: -5px;
    }

    .volunteer-wrapper.parallax, .section-banner.parallax  {
        background-position: right;
    }

    .hero-wrapper .hero-inner-text h2 {
        min-height: 145px;
    }

    .hero-wrapper .hero-inner-text {
        padding-top: 150px;
        margin-bottom: 50px;
    }
}

@media screen and (min-width: 992px) {
    .testimonialSwiper-buttons {
        left: 580px;
        bottom: 36px;
    }

    .historical-info {
        min-width: 600px;
    }
}

@media screen and (min-width: 1621px) {
    .hero-heading {
        font-size: 60px;
    }
}