Overlay description using Banner Slideshow

Site URL: https://seahorse-emu-gb44.squarespace.com/config/pages

Hi Guys!

Just want to ask if you have a fix regarding overlay description text on a banner slideshow? what i want to do is overlap the background of a title so that the description will be shown.

Bring the Port Richmond to front, I tried using z-index but it's not working

This is my code
 

.list-section-title {
    position: absolute !important;
    top: 0;
    bottom: 60px !important;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1 !important; 
    pointer-events: none;
    text-shadow: 2px 2px 2px black !important;
  font-size: clamp(1.5rem, 2vw, 4rem) !important;
   background: rgba(234, 234, 238, 0.6) !important;
    width: 550px !important;
    height: 300px !important;
    margin-top: 8% !important;
    overflow-wrap: normal !important;
  }

  .list-item-content__description {
    text-shadow: 2px 2px 2px black !important;
    font-family: "LibreBaskerville"; /* Change to a different font family */
    font-weight: 400; /* Regular font weight */
    margin-top: 0 !important;
    color: #1470AF;
    z-index: 9999999 !important;
  }
  
  .slide-content.list-item-card-background {
    background: transparent !important;
    z-index: 9999999 !important;
    margin-top: 12% !important;
    position: fixed !important;
  }

Hello @Fishtown_Dev, can you share a password to access your website? Now it is set to private. Thanks.

8 hours ago, Spark-Plugin said:

Hello @Fishtown_Dev, can you share a password to access your website? Now it is set to private. Thanks.

Hi @Spark-Plugin, the password would be 7I2]}W7FnH9A

Currently I see this. Now you want to add a description button under text?