.background-image {
    background-image: url('../images/banner.jpeg');
    background-repeat: no-repeat;
    background-size: cover;
}



.marquee-container {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    height: 40px;
}

.marquee {
    display: inline-block;
    white-space: nowrap;
    animation: scroll 30s linear infinite;
    /* Slower scroll */
    font-size: 20px;
}




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

    100% {
        transform: translateX(-50%);
    }
}




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

    100% {
        transform: translateX(-50%);
    }
}

.animate-marquee {
    display: inline-flex;
    animation: marquee 15s linear infinite;
}