:root {
    --primary-color: #339747;
    --secondary-color: #e64023;
    --primary-color-rgb: 51, 151, 71;
}

header,
footer {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)) !important;
}


.section-heading {
    background: linear-gradient(to right, var(--primary-color), var(--secondary-color), var(--primary-color));
    background-size: 200% auto !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    animation: textGradient 3s linear infinite !important;
}

@keyframes textGradient {
    to {
        background-position: 200% center;
    }
}

/* White overrides for header and footer logos */
header #logo img,
footer img {
    filter: brightness(0) invert(1) !important;
}

/* Footer headings and icons to be white */
footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6 {
    background: none !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    animation: none !important;
}

footer i,
footer .id-color,
footer .social-icons a i {
    color: #ffffff !important;
}

.custom-marquee {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    padding: 10px 0;
    background: linear-gradient(to right,
            var(--primary-color),
            var(--secondary-color),
            var(--primary-color));
    position: relative;
}

.marquee-content {
    display: inline-block;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    padding-left: 100%;
    animation: marqueeMove 18s linear infinite;
}

/* Animation */
@keyframes marqueeMove {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

/* Mobile & Tablet Slow Speed */
@media (max-width: 991px) {
    .marquee-content {
        animation-duration: 28s;
        font-size: 14px;
    }
}

@media(max-width:767px) {
    .custom-marquee {
        padding: 5px 0;
    }


}