.reveal {
  opacity: 0;
  transition-property: opacity, transform;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.visible {
  opacity: 1;
  transform: translate(0, 0) !important;
}

/* Direction variants */
.up {
  transform: translateY(40px);
}

.down {
  transform: translateY(-40px);
}

.left {
  transform: translateX(40px);
}

.right {
  transform: translateX(-40px);
}

.fade {
  transform: translateY(0);
}