// .animated and .animated.hinge classes for external use
.animated {
  @include animation(1s ease both);
}

.animated.hinge {
  @include animation(2s ease both);
}

// Animations list
$animations: flash, shake, bounce, tada, swing, wobble, pulse, flip, flipInX, flipOutX, flipInY, flipOutY, fadeIn,
  fadeInUp, fadeInDown, fadeInLeft, fadeInRight, fadeInUpBig, fadeInDownBig, fadeInLeftBig, fadeInRightBig, fadeOut,
  fadeOutUp, fadeOutDown, fadeOutLeft, fadeOutRight, fadeOutUpBig, fadeOutDownBig, fadeOutLeftBig, fadeOutRightBig,
  bounceIn, bounceInDown, bounceInUp, bounceInLeft, bounceInRight, bounceOut, bounceOutDown, bounceOutUp, bounceOutLeft,
  bounceOutRight, rotateIn, rotateInDownLeft, rotateInDownRight, rotateInUpLeft, rotateInUpRight, rotateOut,
  rotateOutDownLeft, rotateOutDownRight, rotateOutUpLeft, rotateOutUpRight, hinge, rollIn, rollOut;

// Animations that require backface-visibility
$backface: flip, flipInX, flipOutX, flipInY, flipOutY;

// Creation of the different classes
@each $anim in $animations {
  .#{$anim} {
    @if index($backface, $anim) {
      @include backface-visibility(visible);
    }
    @if $anim == 'swing' {
      @include transform-origin(top, center);
    }
    @include animation-name($anim);
  }
}