Banner hides behind pictures

Hi, i have an issue which I cant solve. I added a custom Banner with a timer, and also injected custom CSS code, however it seems that the code is not correct and the banner does not appear over the pictures on the website but behind the pictures.

To add the banner I pasted this html code as block in the upper section of the landing page:
 

<div class="fixed-bottom-banner">
    <p>Beeile Dich! Das Angebot endet in: <span id="countdown">00:00:00:00</span></p>
</div>
<script>
    const countDownDate = new Date("June 16, 2024 23:59:59").getTime();
    const countdown = document.getElementById("countdown");

    setInterval(() => {
        const now = new Date().getTime();
        const distance = countDownDate - now;
        const days = Math.floor(distance / (1000 * 60 * 60 * 24));
        const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        const seconds = Math.floor((distance % (1000 * 60)) / 1000);

        countdown.innerHTML = `${days}T ${String(hours).padStart(2, '0')}h ${String(minutes).padStart(2, '0')}m ${String(seconds).padStart(2, '0')}s`;

        if (distance < 0) {
            clearInterval();
            countdown.innerHTML = "EXPIRED";
        }
    }, 1000);
</script>

And this is the Custom CSS:
/* Custom CSS for Fixed Bottom Banner */
.fixed-bottom-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #333; /* Change to your desired background color */
    color: #fff; /* Change to your desired text color */
    padding: 20px;
    text-align: center;
    font-size: 18px;
    font-family: 'Poppins', sans-serif;
    z-index: 9999; /* Ensures the banner is on top of other elements */
    box-shadow: 0 -2px 5px rgba(0,0,0,0.2); /* Optional: adds a shadow for better visibility */
}
.fixed-bottom-banner p {
    margin: 0;
    font-size: 1rem;
}
#countdown {
    font-size: 1.5rem;
    font-weight: 600;
    color: #ff6347; /* Change to your desired countdown text color */
}

I would very much appreciate the help for this!! I want the banner to appear over the pictures and not stay behind it. Thank you!

Can you share link to page where you have problem? We can check easier

1 hour ago, tuanphan said:

Can you share link to page where you have problem? We can check easier

Limitiert!: Nur 65€ für 3 Tages-Tickets (Blind Date) — WiWi Meisterschaften (wiwi-meisterschaften.de) here it is @tuanphan

22 hours ago, Octavian9765 said:

Limitiert!: Nur 65€ für 3 Tages-Tickets (Blind Date) — WiWi Meisterschaften (wiwi-meisterschaften.de) here it is @tuanphan

Use this to Custom CSS box

section[data-section-id="6645c41746940b1c74151e3c"] {
    z-index: 999999 !important;
}

This worked perfectly, thank you very much!

Hello again! I have changed the page a bit and added a new form and now the form is overlaying on the banner. I tried to update everything again but it didnt work... What else can I do? Change the CSS Code? Thanks!

23 hours ago, Octavian9765 said:

Hello again! I have changed the page a bit and added a new form and now the form is overlaying on the banner. I tried to update everything again but it didnt work... What else can I do? Change the CSS Code? Thanks!

Don't remove any code. Use this to Custom CSS

.fe-block-yui_3_17_2_1_1716067236585_60352 {
    position: relative;
    z-index: 9999999;
}