.hero-img {
  border-radius: 10px !important;
}

/* Setion onr the hero image =========================*/

/* carousel */
/* .section1 {
  height: 800px;
} */
.c-item {
  height: 700px;
}

.c-img {
  height: 100%;
  object-fit: cover;
  /* filter: brightness(0.6); */
}

/* =============================== */
.image-container {
  position: relative;
  width: 100%;
  /* Full width */
  padding-top: 56.25%;
  /* Aspect ratio: 16:9 */
  overflow: hidden;
  /* Hide anything outside the container */
}

.image-container img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* This will cover the area, possibly cropping the image */
}

.text-overlay {
  position: absolute;
  bottom: 0;
  /* Adjust as needed, could be 'top: 0' for top alignment */
  left: 0;
  width: 100%;
  /* Ensure it spans the width of the image */
  background-color: rgba(0, 0, 0, 0.6);
  /* Semi-transparent dark background */
  color: white;
  /* Text color */
  text-align: center;
  /* Center the text */
  padding: 10px;
  /* Adjust as needed */
}

/* =============================== */

.carousel-item {
  border-radius: 10px !important;
  height: 700px;
  background-size: cover;
  background-position: center;
  position: relative;
}

.carousel-caption {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
}

/* ================================= */

/* Sayings tap start */
/* ================================= */

.my_tap:hover {
  background-color: #fff !important;
}

/* Sayings tap start */

/* video start*/
/* Video wrapper to control the aspect ratio */
.video-container {
  position: relative;
  
  padding-bottom: 56.25%;
  /* 16:9 aspect ratio (height = width * 9 / 16) */
  overflow: hidden;
}

/* Responsive video */
.video-container video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Crop the video to fit the container */
  border-radius: 13px;
}

/* Custom play/pause button */
.play-pause-btn {
  position: absolute;
  bottom: 10px;
  left: 10px;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  border: none;
  padding: 10px;
  cursor: pointer;
  font-size: 16px;
  border-radius: 5px;
}

.play-pause-btn svg {
  width: 20px;
  height: 20px;
  fill: white;
}

/* video end*/

/* brain storming section bg  */
.barin-storming-background1 {
  width: 100%;
  height: 500px; /* You can adjust this height as needed */
  background-size: cover; /* Ensures the image covers the entire div */
  background-position: center; /* Centers the image */
}

.barin-storming-background {
width: 100%;
/* background: linear-gradient(to right, #ece8f8, #eae4f4, #e8e0f0, #e5dceb, #e3d7e7);  */
/* Custom gradient */
}




/* brain storming section bg  */