.translate-up {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 1.5s ease, transform 2s ease;
}
.translate-up.visible {
  opacity: 1;
  transform: translateY(0);
}

.translate-left {
  opacity: 0;
  transform: translateX(-20vw);
  transition: opacity 1.5s ease, transform 1s ease;
}
.translate-left.visible {
  opacity: 1;
  transform: translateX(0);
}

.translate-right {
  opacity: 0;
  transform: translateX(20vw);
  transition: opacity 1.5s ease, transform 1s ease;
}
.translate-right.visible {
  opacity: 1;
  transform: translateX(0);
}