.announcement {
        font-size: 20px;
        text-align: center;
        margin-bottom: 10px;
        color: black;
        opacity: 1;
        transition: opacity 1s ease-out; /* Smooth fade-out effect */
    }

    .marquee-wrapper {
        overflow: hidden;
        white-space: nowrap;
        box-sizing: border-box;
    }

    .marquee {
        display: inline-block;
        animation: marqueeAnimation 26s linear infinite;
    }

    @keyframes marqueeAnimation {
        from { transform: translateX(100%); }
        to { transform: translateX(-100%); }
    }

    .js-marquee-wrapper {
        display: flex;
        flex-direction: row;
    }

    .js-marquee {
        display: inline-block;
        margin-right: 50px;
    }

    .js-marquee p {
        color: black;
        font-weight: medium;
    }