.custom-hr {
  width: 20% !important;
  height: 3px !important;
  background-color: #000 !important;
  border: none;
  margin-left: 0;
}
.bg-section {
  background-size: contain;
  background-position: center;
  background-attachment: fixed;
  position: relative;
}
.bg-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(
    255,
    255,
    255,
    0.8
  ); /* Adjust transparency with the alpha value */
  z-index: 1; /* Place it above the background */
}

.bg-section > * {
  position: relative;
  z-index: 2; /* Place content above the black overlay */
}

.text-gray {
  color: rgb(33, 37, 41) !important;
}

.bg-head {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}
/* .rel {
  
} */
.no-scrollbar {
  overflow: auto; /* Allows scrolling */
  scrollbar-width: none; /* Firefox */
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.card-icon {
  width: 90px;
  height: 90px;
  margin-top: -25px;
  padding: 10px;
}

.card {
  min-height: 200px !important;
}

.company-counts {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  position: relative;
}

.company-counts::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(
    0,
    0,
    0,
    0.5
  ); /* Adjust transparency with the alpha value */
  z-index: 1; /* Place it above the background */
}

.company-counts > * {
  position: relative;
  z-index: 2; /* Place content above the black overlay */
}
.company-works {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  position: relative; /* Make sure the element is positioned relative for the pseudo-element */
}

.company-works::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(
    0,
    0,
    0,
    0.5
  ); /* Adjust transparency with the alpha value */
  z-index: 1; /* Place it above the background */
}

.company-works > * {
  position: relative;
  z-index: 2; /* Place content above the black overlay */
}

.blend-div {
  background: linear-gradient(
      to right,
      rgba(255, 255, 255, 1) 50%,
      rgba(255, 255, 255, 0.5) 55%,
      rgba(255, 255, 255, 0) 45%
    ),
    url("/assets/companyCounts.jpeg") !important;

  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

.blend-div-lr {
  background: linear-gradient(
      to left,
      rgba(255, 255, 255, 1) 50%,
      rgba(255, 255, 255, 0.5) 55%,
      rgba(255, 255, 255, 0) 45%
    ),
    url("/assets/companyCounts.jpeg") !important;

  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

@media (min-width: 768px) {
  .bg-head {
    height: 80vh !important;
  }
  .surveyBar {
    height: 20vh !important;
  }
  .company-counts {
    height: 60vh !important;
  }
  .company-works {
    height: 60vh !important;
  }
  .simpleBar {
    height: 30vh !important;
  }

  .vh50 {
    height: 50vh !important;
  }
  .vh-80 {
    height: 80vh !important;
  }
}