.jost-type {
  font-family: "Jost", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}



    /* force scrollbar */
    html { overflow-y: scroll;
      scroll-behavior: smooth;
     }

    body { font-family: sans-serif; }

    p {
      font-size: 16pt;
      font-family: work sans;
    }


    .card-title,
    .card-description {
      display: none;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background: rgba(0, 0, 0, 0.5);
      color: white;
      padding: 10px;
      border-radius: 5px;

      text-align: center;
      width: 80%;
    }

    .card-offer {
      border-color: black;
      border-radius: 2%;
      border-width: 2pt;
      
    }

    .grid-item:hover .card-title,
    .grid-item:hover .card-description {
      display: block;
    }

        .video-banner {
            position: relative;
            width: 100%;
            height: 80vh;
            overflow: hidden;
        }

        .video-banner video {
            position: absolute;
            top: 50%;
            left: 50%;
            min-width: 100%;
            min-height: 100%;
            width: auto;
            height: auto;
            z-index: -1;
            transform: translate(-50%, -50%);
        }



        .video-banner-content {
            position: relative;
            z-index: 2;
            color: white;
            text-align: center;
            top: 1%;
            
        }

.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative; /* This keeps the absolute position of the brand relative to the navbar */
    z-index: 999;
}

.navbar-brand {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0; /* Ensures it's at the top of the navbar */
}

.navbar-toggler {
    z-index: 1;
    margin-left: auto; /* Keep it aligned to the right */
}

.navbar-collapse {
    width: 100%; /* Ensure the collapse occupies full width */
}

.navbar-brand img {
    height: 40px;
}


 #myDiv {
  display: none;
 }