.right-align {
  text-align: right;
}

.hero {
  background-image: url("https://unicri.it/sites/default/files/styles/hero_image/public/2020-07/%40%20%D0%9B%D0%B5%D1%87%D0%B5%D0%BD%D0%B8%D0%B5%20%D0%9D%D0%B0%D1%80%D0%BA%D0%BE%D0%BC%D0%B0%D0%BD%D0%B8%D0%B8%20stop-2785450_1280.jpg%20DRUGS.jpg?h=cf01a717&itok=RPByiH1R"); /* Placeholder for hero image */
  background-size: cover;
  color: white;
  padding: 10vh 0;
  text-align: center;
}
.section {
  padding: 60px 0;
}
.feature-box {
  padding: 20px;
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  margin: 10px;
  transition: transform 0.3s;
}

.feature-box:hover {
  transform: scale(1.05);
}

.feature-box h3 {
  margin: 10px 0;
}

.hero-carousel .carousel-item {
  height: 70vh; /* Adjusts the height of the carousel */
  background-size: cover;
  background-position: center;
}
.carousel-caption {
  background-color: rgba(0, 0, 0, 0.5);
  padding: 20px;
}

#loadingOverlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  flex-direction: column; /* Stack elements vertically */
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-30px); /* Start slightly left */
  }
  to {
    opacity: 1;
    transform: translateX(0); /* End at original position */
  }
}

.fade-in-left {
  opacity: 0; /* Hidden initially */
  transition: opacity 0.3s ease-out;
}

.fade-in-left.visible {
  animation: fadeInLeft 0.8s ease-out; /* Apply animation when visible */
  opacity: 1; /* Make it visible */
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translateX(300000px); /* Start slightly left */
  }
  to {
    opacity: 1;
    transform: translateX(0); /* End at original position */
  }
}

.fade-in-right {
  opacity: 0; /* Hidden initially */
  transition: opacity 0.3s ease-out;
}

.fade-in-right.visible {
  animation: fadeInLeft 0.8s ease-out; /* Apply animation when visible */
  opacity: 1; /* Make it visible */
}