.homePage_topBanner {
  margin: 7vh 0 0 0;
  height: 100vh;
  background: url("../Images/HomePageLanding.webp") center center/cover no-repeat;
  overflow: hidden;
  display: flex;
  justify-content: start;
  align-items: center;
}
.homePage_topBanner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(
    0,
    0,
    0,
    0.3
  ); /* Adjust the alpha value for the desired transparency */
  z-index: 3; /* Place the overlay above the background image */
}
.homePage_marbel_topBanner {
  margin: 7vh 0 0 0;
  height: 100vh;
  background: url("../Images/Header/marbel-banner.jpg") center center/cover no-repeat;
  overflow: hidden;
  display: flex;
  justify-content: start;
  align-items: center;
}
.homePage_marbel_topBanner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(
    0,
    0,
    0,
    0.3
  ); /* Adjust the alpha value for the desired transparency */
  z-index: 3; /* Place the overlay above the background image */
}
.homePage_topBanner .card {
  width: 60%;
  min-height: 7vh;
  margin: 0 0 0 3vw;
  background: transparent;
  border: none;
  z-index: 10;
  /* background-color: rgba(0, 255, 255, 0.158); */
}

.homePage_topBanner .card .title {
    font-size: x-large;
    margin-top: 10%;
  color: rgba(255, 255, 255, 0.767);
  z-index: 10;
}
.homePage_topBanner .card .header b {
  font-size: 3.9rem;
  color: #ffffff;
  line-height: 111%;
  font-weight: 900;
  word-spacing: 10%;
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
.homePage_topBanner .card .details p {
  margin-top: 10px;
  font-size: large;
  color: white;
  font-weight: 500;
  margin-top: 3%;
  word-spacing: 0px;
  line-height: normal;
}

@media (max-width: 996px) {
  /* .homePage_topBanner {
    margin: -30vh 0 0 0;
  } */
  .homePage_topBanner .card .header b {
    font-size: 3.3rem;
    color: white;
    line-height: 90%;
    font-weight: 900;
  }
  .homePage_topBanner .card .details p {
    margin-top: 10px;
    font-size: small;
    color: white;
  }
}
@media (max-width: 850px) {
  .homePage_topBanner .card {
    width: 80%;
  }
  .homePage_topBanner .card .title {
    font-size: large;
    color: rgba(255, 255, 255, 0.767);
  }
  .homePage_topBanner .card .header b {
    font-size: 3rem;
    color: white;
    line-height: 90%;
    font-weight: 900;
  }
  .homePage_topBanner .card .details p {
    margin-top: 10px;
    font-size: small;
    color: white;
  }
}
@media (max-width: 750px) {
  .homePage_topBanner {
    justify-content: center;
  }
  .homePage_topBanner .card .title {
    font-size: large;
    color: rgba(255, 255, 255, 0.767);
  }
  .homePage_topBanner .card .header b {
    font-size: 3rem;
    color: white;
    line-height: 90%;
    font-weight: 900;
  }
  .homePage_topBanner .card .details p {
    margin-top: 10px;
    font-size: small;
    color: white;
  }
}
@media (max-width: 750px) {
  .homePage_topBanner .card .header b {
    font-size: 2.7rem;
    color: white;
    line-height: 90%;
    font-weight: 900;
  }
}
@media (max-width: 500px) {
  .homePage_topBanner .card .header b {
    font-size: 2.3rem;
    color: white;
    line-height: 90%;
    font-weight: 900;
  }
  .homePage_topBanner .card .details p {
    font-size: x-small;
  }
}