/* Default Show-In Animation
========================================================================== */

.anime-default-show-in {
  opacity: 0;
  transform: translateY(2.25em) skewY(5deg);
  filter: blur(1rem);
  transition: opacity .7s cubic-bezier(.215,.61,.355,1), transform .7s cubic-bezier(.215,.61,.355,1), filter .7s cubic-bezier(.215,.61,.355,1);
}

.state--intersection .anime-default-show-in {
  opacity: 1;
  transform: none;
  transition-delay: .6s;
  filter: blur(0);
}



/* Simple Show-In Animation
========================================================================== */

.anime-simple-show-in {
  opacity: 0;
  transform: translateY(2.25em) skewY(5deg);
  filter: blur(1rem);
  transition: opacity .7s cubic-bezier(.215,.61,.355,1), transform .7s cubic-bezier(.215,.61,.355,1), filter .7s cubic-bezier(.215,.61,.355,1);
}

.state--intersection .anime-simple-show-in {
  opacity: 1;
  transform: none;
  transition-delay: .6s;
  filter: blur(0);
}

@media (min-width: 768px) {
  .anime-simple-show-in {
    transform: translateY(2.75em) skewY(5deg);
  }
}

@media (min-width: 1280px) {
  .anime-simple-show-in {
    transform: translateY(3.75em) skewY(5deg);
  }
}

@media (min-width: 1600px) {
  .anime-simple-show-in {
    transform: translateY(4.25em) skewY(5deg);
  }
}

@media (min-width: 2300px) {
  .anime-simple-show-in {
    transform: translateY(5.25em) skewY(5deg);
  }
}



/* Heading Show-In Animation
========================================================================== */

.anime-heading-show-in .letter {
  line-height: 1em;
}