body {
    margin: 0;
    font-family: Arial, sans-serif;
    overflow-x: hidden;
    /* Prevent horizontal overflow */
}

.b-red{
    border: red 1px solid;
}

.b-blue{
    border: blue 1px solid;
}

.b-green{
    border: green 1px solid;
}


@font-face {
    font-family: 'Cordon';
    src: url(/assets/fonts/fonnts.com-Cordon.otf);
}

.whatsapp-float {
    position: fixed;
    bottom: 100px;
    right: 40px;
    z-index: 1000;
}

.whatsapp-logo {
    width: 50px;
    height: 50px;
    border-radius: 15%;
    transition: transform 0.3s ease;
}

.whatsapp-logo:hover {
    transform: scale(1.1);
}




.slider-container {
    width: 100%;

    overflow: hidden;
    position: relative;
    margin: 0 auto;
    margin-bottom: 80px;
}

.slider {
    opacity: 0;
    display: flex;
    width: calc(100% * 8);
    /* Adjust width based on the number of duplicated images */
    animation: sliderSlideInRight 2s ease-out forwards 7s, slide 20s linear infinite 10s;
    /* sliderSlideInRight starts after 10s, slide starts after 12s (10s delay + 2s for the first animation) */
}

.slider img {
    width: 100%;
    height: 150px;
    /* Each image takes 100% of the container */
    flex-shrink: 0;
}

@keyframes sliderSlideInRight {
    0% {
        transform: translateX(100vw);
        /* Start from the right */
        opacity: 0;
    }

    100% {
        transform: translateX(0);
        /* End at its original position */
        opacity: 1;
    }
}

@keyframes slide {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
        /* Slide by 50% of the slider's width */
    }
}

@media (max-width: 1068px) {

    .slider img {
    width: 100%;
    height: 100px;
}
}

@media (max-width: 868px) {

    .slider-container {
    width: 100%;

    overflow: hidden;
    position: relative;
    margin: 0 auto;
    margin-bottom: 40px;
     margin-top: 20px;
}

    .slider img {
    width: 100%;
    height: 70px;
}
}

@media (max-width: 668px) {

    .slider-container {
    width: 100%;

    overflow: hidden;
    position: relative;
    margin: 0 auto;
    margin-bottom: 20px;
     margin-top: 20px;
}

    .slider img {
    width: 100%;
    height: 40px;
}
}

/* .honey-bee {
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: 10000000;
    pointer-events: none;
    transition: transform 0.1s ease-out;
} */


/* about us */

/* agerloy font family */
@font-face {
    font-family: Agreloy;
    src: url(../fonts/Agreloy.otf);
}





/* footer */
.footer-section {
    background-color: #61860F;
    color: white;
    padding: 20px 20px;
}

.footer-logo {
    width: 304px;
    height: 183px;
}

.footer-divider {
    border: 0;
    width: 90%;
    margin: auto;
    height: 1px;
    background: white;
}

.footer-content{
    padding: 3% 7% 0% 7%;

}

.footer-heading {
    font-family: 'CORDON', sans-serif;
    font-size: 20px;
    margin-bottom: 15px;
}

.footer-item {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    font-family: Poppins, sans-serif;
    font-size: 16px;
}

.footer-item i {
    margin-right: 10px;
}

.footer-link {
    color: white;
    text-decoration: none;
}

.footer-link:hover {
    text-decoration: underline;
}

.newsletter-btn {
    background-color: #FFB72B;
    color: black;
    font-family: 'CORDON', sans-serif;
}

.newsletter-btn:hover {
    background-color: #e6a617;
}

.newsletter-note {
    font-size: 14px;
}

/* Responsive styles handled by Bootstrap grid */





/* contact-us page  */

.contact-us-page .contact-heading-page {
    color: #61860F;
    font-family: Agreloy;
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
    line-height: 0px;
    text-align: center;
}

.contact-us-page .contact-para {
    color:  #FE0203;
    text-align: center;
    font-family: CORDON;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
}

.contact-us-page .contact-image-wrapper {

    position: relative;
    width: auto;
    height: 647px;
    flex-shrink: 0;
    left: -18px;
    margin: 0;
    /* Remove any margin */
    padding: 0;
    /* Remove any padding */
    overflow: hidden;
    /* Ensure the image does not overflow the container */
}

@media (max-width: 800px) {
    .contact-us-page .contact-image-wrapper {

        position: relative;
        width: auto;
        height: 647px;
        flex-shrink: 0;
        left: 0px;
        margin: 0;
        /* Remove any margin */
        padding: 0;
        /* Remove any padding */
        overflow: hidden;
        /* Ensure the image does not overflow the container */
    }

}


.contact-us-page .contact-section {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    margin: 0;
    /* Ensure no margin on the sides */
}

.contact-us-page .contact-details-container {
    display: flex;
    justify-content: space-around;
    align-items: left;
    text-align: center;
    width: 95%;
    margin: auto;
    max-width: 900px;
    padding: 60px 40px;
    border: 2px solid #F0C000;
    /* Border color */
    border-radius: 80px;
    background-color: #fff;
}

.contact-us-page .contact-detail {
    color: var(--text, #2A2D2B);
    font-family: Poppins, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    /* Adjusted line-height for better readability */
    display: flex;
    align-items: center;
    /* Aligns text and icon vertically */
    gap: 10px;
    /* Adds space between the icon and text */
    margin-bottom: 15px;
    /* Adds space between each contact detail */
}

.contact-us-page .contact-icon {
    width: 46px;
    flex-shrink: 0;
    margin-right: 5px;
    /* Adds some space to the right of the icon */
}


@media (max-width: 1070px) {
    .contact-us-page .contact-details-container {
        flex-direction: column;
        padding: 40px 60px;
        width: 300px;
        border-radius: 50px;
    }

    .contact-us-page .contact-detail {
        text-align: left;
        margin-bottom: 20px;
    }
}

@media (max-width: 768px) {
    .contact-us-page .contact-details-container {
        padding: 30px 40px;
        border-radius: 40px;
    }

    .contact-us-page .contact-detail {
        text-align: left;
    }
}

@media (max-width: 576px) {
    .contact-us-page .contact-image-wrapper {
        position: relative;
        left: 0px;
        width: 100%;
        max-width: 100%;
        /* Ensure the image takes the full width available */
        height: auto;
        /* Let the height adjust based on the content */
    }

    .contact-us-page .contact-details-container {
        padding: 20px 30px;
        border-radius: 30px;
    }

    .contact-us-page .contact-detail {
        text-align: left;
    }
}

@media (max-width: 400px) {
    .contact-us-page .contact-image-container {
        width: 623px;
        height: 647px;
        flex-shrink: 0;
    }

    .contact-us-page .contact-details-container {
        padding: 15px 20px;
        border-radius: 20px;
    }

    .contact-us-page .contact-detail {
        text-align: left;
    }
}

.contact-us-page .contact-section {
    margin-top: 80px;
}



/* about-us-page */


.about-us-page .background-leaf3 {
    top: -20%;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0.3; /* Slight transparency to blend with content */
    z-index: -1; /* Behind all other content */
    object-fit: cover; /* Ensure the image covers the viewport nicely */
    pointer-events: none; /* Prevent the image from interfering with other elements */
    overflow: hidden; /* Ensure no overflow occurs */
    position: absolute; /* Ensure the image stays fixed while scrolling */
}


@keyframes customFadeInDown {
            from {
                /* opacity: 0; */
                transform: translateY(-350px);
                /* Start 20px above its original position */
            }

            to {
                /* opacity: 1; */
                transform: translateY(0);
                /* End at its original position */
            }
        }

        .custom-fade-in-down {
            animation-name: customFadeInDown;
            animation-duration: 3s;
            animation-fill-mode: both;
            opacity: 1;
        }


@keyframes customFadeInUp {
            from {
                /* opacity: 0; */
                transform: translateY(250px);
                /* Start 20px above its original position */
            }

            to {
                /* opacity: 1; */
                transform: translateY(0);
                /* End at its original position */
            }
        }

        .custom-fade-in-up {
            animation-name: customFadeInUp;
            animation-duration: 3s;
            animation-fill-mode: both;
            opacity: 1;
        }


/* Prevent Body Overflow */
body {
    overflow-x: hidden;
    /* Prevent horizontal overflow */
    margin: 0;
    /* Remove any default margins */
}


/* Navbar CSS */
.navbar {
    position: relative;
    z-index: 1000;
    /* Ensure navbar is above all other content */
    animation: fadeInDown 1s ease-in-out;

    background-color: transparent;
    /* Transparent to show the leaf image */
}


.opacity-1{
    opacity: 1;
}

.opacity-0{
    opacity: 0;
}


.about-us-page .info-section {
    padding: 40px 10%;
    background-color: #FFFFFF;
    /* flex-wrap: wrap; */
    /* Allow boxes to wrap to the next line on smaller screens */
}

.about-us-page .info-box-1,
.about-us-page .info-box-2 {
    /* height: 440px; */
    padding: 0 15px 2% 15px;
    margin-bottom: 20px;
    /* Add some spacing between boxes */
}

.about-us-page .info-content-1,
.about-us-page .info-content-2 {
    background-color: #FFFFFF;
    border: 1px solid #F0F0F0;
    height: 100%;
    border-radius: 50px;
    border: 1px solid rgba(251, 196, 52, 1);
    /* Add some spacing between boxes */
    padding: 3% 15px 5% 15px;
}

.about-us-page .info-icon {

    margin-top: 14%;
    width: auto;
    /* height: 187px; */
}

.about-us-page .info-icon1 {

    margin-top: 4%;
    width: auto;
    /* height: 187px; */
}

.about-us-page .info-text {
    color: var(--text, #2A2D2B);
    text-align: center;
    font-family: CORDON;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    /* 150% */
    /* width: 508px; */
    margin: auto;
    margin-top: 70px;
}

.about-us-page .info-timing {
    color: #61860F;
    font-family: CORDON;
    font-size: 25px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

.about-us-page .timing-heading {
    color: var(--text, #2A2D2B);
    text-align: center;
    font-family: CORDON;
    font-size: 20px;
    line-height: 0px !important;
    font-style: normal;
    font-weight: 400;
    /* 150% */
}

.about-us-page .timing-list {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.about-us-page .timing-list li {
    margin-bottom: 5px;
    font-size: 18px;
    font-family: CORDON;
    font-weight: 400;
    position: relative;
    top: -3px;
    color: #2A2D2B;
}

.about-us-page .timing-list li span {
    color: rgba(97, 134, 15, 1);

    /* Green color for the timing */
}

.animate__animated.animate-slowly {
    animation-duration: 2s;
    /* Adjust the duration as needed */
}





/* Cherity-page */
