/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Mar 14 2025 | 13:37:38 */
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(180px); /* Start with a small offset from below */
  }
  100% {
    opacity: 1;
    transform: translateY(0); /* End at the original position */
  }
}
/* Define the fade-in-left keyframes */
@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translateX(200px); /* Start 100px to the left */
	
  }
  to {
    opacity: 1;
    transform: translateX(0); /* End at its original position */
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-200px); /* Start 100px to the left */
  }
  to {
    opacity: 1;
    transform: translateX(0); /* End at its original position */
  }
}
/* Fade-in from bottom animation */
@keyframes fadeInBottom {
  from {
    opacity: 0;
    transform: translateY(100px); /* Start 100px below its original position */
  }
  to {
    opacity: 1;
    transform: translateY(0); /* End at its original position */
  }
}

/* Define the fade-in-top keyframes */
@keyframes fadeInTop {
  from {
    opacity: 0;
    transform: translateY(-100px); /* Start 100px from the top */
  }
  to {
    opacity: 1;
    transform: translateY(0); /* End at its original position */
  }
}

/* Apply the fade-in-left animation */
.fade-in-right {
  opacity: 0; /* Start with opacity set to 0 */
  animation: fadeInRight 2s ease-in-out forwards; /* Animate over 1.5 seconds */
}
.fade-in-right-01 {
  opacity: 0; /* Hidden by default */
  transition: opacity 1.5s ease, transform 1.5s ease;
}
.fade-in-right-02 {
  opacity: 0; /* Hidden by default */
  transition: opacity 1.5s ease, transform 1.5s ease;
}
.fade-in-right-03 {
  opacity: 0; /* Hidden by default */
  transition: opacity 1.5s ease, transform 1.5s ease;
}
.fade-in-right-04 {
  opacity: 0; /* Hidden by default */
  transition: opacity 1.5s ease, transform 1.5s ease;
}
.fade-in-left {
  opacity: 0; /* Hidden by default */
  transition: opacity 0.5s ease, transform 0.5s ease;
	
}

/* Apply the fade-in-top animation */
.fade-in-top {
  opacity: 0; /* Start with opacity set to 0 */
  animation: fadeInTop 1s ease-in-out forwards; /* Animate over 1.5 seconds */
}

/* Initially hidden element */
.fade-in-bottom {
  opacity: 0; /* Hidden by default */
  transition: opacity 1s ease, transform 1s ease;
}

/* Apply the animation when the element is visible */
.fade-in-bottom.visible {
  animation: fadeInBottom 1s ease-in-out forwards; /* Animate when scrolled into view */
}
.fade-in-right-01.visible {
  animation: fadeInRight 1s ease-in-out forwards; /* Animate over 1.5 seconds */
}
.fade-in-right-02.visible {
  animation: fadeInRight 2s ease-in-out forwards; /* Animate over 1.5 seconds */
}
.fade-in-right-03.visible {
  animation: fadeInRight 3s ease-in-out forwards; /* Animate over 1.5 seconds */
}
.fade-in-right-04.visible {
  animation: fadeInRight 4s ease-in-out forwards; /* Animate over 1.5 seconds */
}
.fade-in-left.visible {
  animation: fadeInLeft 1s ease-in-out forwards; /* Animate over 1.5 seconds */
}

.fadein__up {
  opacity: 0; /* Start hidden */
  animation: fadeInUp 1.5s ease-out forwards; /* Apply the animation */
}