/**
 * Animations
 */

.fromTopIn {
  transition: transform 1s ease, opacity 1s ease;

  transform: translate(0, 0);
  opacity: 1;
}

.fromTopOut {
  transition: transform 1s ease, opacity 1s ease;

  transform: translate(0, -50rem);
  opacity: 0;
}

.fromBottomIn {
  transition: transform 1s ease, opacity 1s ease;

  transform: translate(0, 0);
  opacity: 1;
}

.fromBottomOut {
  transition: transform 1s ease, opacity 1s ease;

  transform: translate(0, 50rem);
  opacity: 0;
}

.fromLeftIn {
  transition: transform 1s ease, opacity 1s ease;

  transform: translate(0, 0);
  opacity: 1;
}

.fromLeftOut {
  transition: transform 1s ease, opacity 1s ease;

  transform: translate(-50rem, 0);
  opacity: 0;
}

.fromRightIn {
  transition: transform 1s ease, opacity 1s ease;

  transform: translate(0, 0);
  opacity: 1;
}

.fromRightOut {
  transition: transform 1s ease, opacity 1s ease;

  transform: translate(50rem, 0);
  opacity: 0;
}

.scaleUpIn {
  transition: transform 1s ease, opacity 1s ease;

  transform: scale(1, 1);
  opacity: 1;
}

.scaleUpOut {
  transition: transform 1s ease, opacity 1s ease;

  transform: scale(1.3, 1.3);
  opacity: 0;
}

.scaleDownIn {
  transition: transform 1s ease, opacity 1s ease;

  transform: scale(1, 1);
  opacity: 1;
}

.scaleDownOut {
  transition: transform 1s ease, opacity 1s ease;

  transform: scale(0.7, 0.7);
  opacity: 0;
}