@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fade-in-lefty {
  0% {
    opacity: 0;
    transform-origin: left center;
    transform: translateX(-5%);
  }
  100% {
    opacity: 1;
    transform-origin: left center;
    transform: translateX(0);
  }
}

@keyframes fade-in-righty {
  0% {
    opacity: 0;
    transform-origin: right center;
    transform: translateX(5%);
  }
  100% {
    opacity: 1;
    transform-origin: right center;
    transform: translateX(0);
  }
}

@keyframes pointy-to-right {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(5px);
  }
  100% {
    transform: translateX(0);
  }
}