@keyframes fadeInLeft {
  0% {
      opacity: 0;
      transform: translateX(-420px);
  }
  
  100% {
      opacity: 1;
      transform: translateX();
  }
}

/* Initial styling */
.fadeInLeft {
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  transform: translateX(0px); /* Hidden off-screen initially */
  animation-duration: 3s;
}

/* Trigger the animation when the element is in view */
.fadeInLeft.in-view {
  animation-name: fadeInLeft;
  

}