active_frontend 13.3.0 → 14.0.0

data/vendor/assets/stylesheets/_affix.scss

@@ -1,14 +0,0 @@
-/* Table of Contents
-==================================================
-# Affix */
-
-/* # Affix
-================================================== */
-.affix {
-  position: fixed;
-  z-index: 1030;
-}
-.affix-bottom {
-  position: absolute;
-  top: auto;
-}

data/vendor/assets/stylesheets/_alert.scss

@@ -1,114 +0,0 @@
-/* Table of Contents
-==================================================
-# Variables
-# Alert
-# Styles
-# Colors */
-
-/* # Variables
-================================================== */
-$onblack-colors: (
-  dark-haze: $color-dark-haze,
-  haze: $color-haze,
-  light-haze: $color-light-haze
-);
-$ongray-colors: (
-  white: $color-white
-);
-$onwhite-colors: (
-  dark-black: $color-dark-black,
-  black: $color-black,
-  light-black: $color-light-black,
-  dark-gray: $color-dark-gray,
-  gray: $color-gray,
-  light-gray: $color-light-gray,
-  lime: $color-lime,
-  green: $color-green,
-  teal: $color-teal,
-  blue: $color-blue,
-  indigo: $color-indigo,
-  purple: $color-purple,
-  pink: $color-pink,
-  red: $color-red,
-  orange: $color-orange,
-  yellow: $color-yellow,
-  alert: $color-red,
-  error: $color-red,
-  warning: $color-yellow,
-  success: $color-green
-);
-
-/* # Alert
-================================================== */
-.alert {
-  background: $color-gray;
-  border-bottom: 2px solid darken($color-gray, 5%);
-  box-sizing: border-box;
-  color: $color-white;
-  display: block;
-  font-size: 16px;
-  line-height: 20px;
-  margin: 0;
-  padding: 12px 20px 9px 20px;
-  width: 100%;
-}
-.alert > a {
-  border-bottom: 1px dotted $color-white;
-  color: $color-white;
-  font-style: italic;
-}
-.alert > i { font-size: 14px; }
-.alert > .alert-close {
-  border: 0;
-  float: right;
-  font-size: 18px;
-  line-height: 22px;
-}
-
-/* # Styles
-================================================== */
-.alert-bordered {
-  border: 2px solid darken($color-gray, 5%);
-  padding-bottom: 10px;
-  padding-top: 10px;
-}
-.alert-fixed {
-  left: 0;
-  position: fixed;
-  right: 0;
-  top: 0;
-  z-index: 1050;
-}
-
-/* # Colors
-================================================== */
-@each $name, $color in $onblack-colors {
-  .alert-#{$name} {
-    background: $color;
-    border-color: darken($color, 5%);
-    color: $color-black;
-  }
-  .alert-#{$name} > a {
-    border-bottom-color: $color-black;
-    color: $color-black;
-  }
-  .alert-#{$name} .alert-close { color: $color-black; }
-}
-@each $name, $color in $ongray-colors {
-  .alert-#{$name} {
-    background: $color;
-    border-color: darken($color, 5%);
-    color: $color-gray;
-  }
-  .alert-#{$name} > a {
-    border-bottom-color: $color-gray;
-    color: $color-gray;
-  }
-  .alert-#{$name} .alert-close { color: $color-gray; }
-}
-@each $name, $color in $onwhite-colors {
-  .alert-#{$name} {
-    background: $color;
-    border-color: darken($color, 5%);
-  }
-}

data/vendor/assets/stylesheets/_animation.scss

@@ -1,1370 +0,0 @@
-/* Table of Contents
-==================================================
-# Keyframes
-# Animation
-# Names
-# Delays
-# Durations */
-
-/* # Keyframes
-================================================== */
-@-webkit-keyframes animation-bounce {
-  0%, 20%, 50%, 80%, 100% { @include transform(translateY(0)); }
-  40% { @include transform(translateY(-30px)); }
-  60% { @include transform(translateY(-15px)); }
-}
-@keyframes animation-bounce {
-  0%, 20%, 50%, 80%, 100% { @include transform(translateY(0)); }
-  40% { @include transform(translateY(-30px)); }
-  60% { @include transform(translateY(-15px)); }
-}
-@-webkit-keyframes animation-flash {
-  0%, 50%, 100% { opacity: 1; }
-  25%, 75% { opacity: 0; }
-}
-@keyframes animation-flash {
-  0%, 50%, 100% { opacity: 1; }
-  25%, 75% { opacity: 0; }
-}
-@-webkit-keyframes animation-pulse {
-  0% { @include transform(scale(1)); }
-  50% { @include transform(scale(1.1)); }
-  100% { @include transform(scale(1)); }
-}
-@keyframes animation-pulse {
-  0% { @include transform(scale(1)); }
-  50% { @include transform(scale(1.1)); }
-  100% { @include transform(scale(1)); }
-}
-@-webkit-keyframes animation-shake {
-  0%, 100% { @include transform(translateX(0)); }
-  10%, 30%, 50%, 70%, 90% { @include transform(translateX(-10px)); }
-  20%, 40%, 60%, 80% { @include transform(translateX(10px)); }
-}
-@keyframes animation-shake {
-  0%, 100% { @include transform(translateX(0)); }
-  10%, 30%, 50%, 70%, 90% { @include transform(translateX(-10px)); }
-  20%, 40%, 60%, 80% { @include transform(translateX(10px)); }
-}
-@-webkit-keyframes animation-swing {
-  20% { @include transform(rotate(15deg)); }
-  40% { @include transform(rotate(-10deg)); }
-  60% { @include transform(rotate(5deg)); }
-  80% { @include transform(rotate(-5deg)); }
-  100% { @include transform(rotate(0)); }
-}
-@keyframes animation-swing {
-  20% { @include transform(rotate(15deg)); }
-  40% { @include transform(rotate(-10deg)); }
-  60% { @include transform(rotate(5deg)); }
-  80% { @include transform(rotate(-5deg)); }
-  100% { @include transform(rotate(0)); }
-}
-@-webkit-keyframes animation-tada {
-  0% { @include transform(scale(1)); }
-  10%, 20% { @include transform(scale(0.9) rotate(-3deg)); }
-  30%, 50%, 70%, 90% { @include transform(scale(1.1) rotate(3deg)); }
-  40%, 60%, 80% { @include transform(scale(1.1) rotate(-3deg)); }
-  100% { @include transform(scale(1) rotate(0)); }
-}
-@keyframes animation-tada {
-  0% { @include transform(scale(1)); }
-  10%, 20% { @include transform(scale(0.9) rotate(-3deg)); }
-  30%, 50%, 70%, 90% { @include transform(scale(1.1) rotate(3deg)); }
-  40%, 60%, 80% { @include transform(scale(1.1) rotate(-3deg)); }
-  100% { @include transform(scale(1) rotate(0)); }
-}
-@-webkit-keyframes animation-wobble {
-  0% { @include transform(translateX(0)); }
-  15% { @include transform(translateX(-25%) rotate(-5deg)); }
-  30% { @include transform(translateX(20%) rotate(3deg)); }
-  45% { @include transform(translateX(-15%) rotate(-3deg)); }
-  60% { @include transform(translateX(10%) rotate(2deg)); }
-  75% { @include transform(translateX(-5%) rotate(-1deg)); }
-  100% { @include transform(translateX(0)); }
-}
-@keyframes animation-wobble {
-  0% { @include transform(translateX(0)); }
-  15% { @include transform(translateX(-25%) rotate(-5deg)); }
-  30% { @include transform(translateX(20%) rotate(3deg)); }
-  45% { @include transform(translateX(-15%) rotate(-3deg)); }
-  60% { @include transform(translateX(10%) rotate(2deg)); }
-  75% { @include transform(translateX(-5%) rotate(-1deg)); }
-  100% { @include transform(translateX(0)); }
-}
-@-webkit-keyframes animation-bounce-in {
-  0% {
-    opacity: 0;
-    @include transform(scale(0.3));
-  }
-  50% {
-    opacity: 1;
-    @include transform(scale(1.05));
-  }
-  70% { @include transform(scale(0.9)); }
-  100% { @include transform(scale(1)); }
-}
-@keyframes animation-bounce-in {
-  0% {
-    opacity: 0;
-    @include transform(scale(0.3));
-  }
-  50% {
-    opacity: 1;
-    @include transform(scale(1.05));
-  }
-  70% { @include transform(scale(0.9)); }
-  100% { @include transform(scale(1)); }
-}
-@-webkit-keyframes animation-bounce-in-down {
-  0% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateY(30px));
-  }
-  80% { @include transform(translateY(-10px)); }
-  100% { @include transform(translateY(0)); }
-}
-@keyframes animation-bounce-in-down {
-  0% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateY(30px));
-  }
-  80% { @include transform(translateY(-10px)); }
-  100% { @include transform(translateY(0)); }
-}
-@-webkit-keyframes animation-bounce-in-left {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateX(30px));
-  }
-  80% { @include transform(translateX(-10px)); }
-  100% { @include transform(translateX(0)); }
-}
-@keyframes animation-bounce-in-left {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateX(30px));
-  }
-  80% { @include transform(translateX(-10px)); }
-  100% { @include transform(translateX(0)); }
-}
-@-webkit-keyframes animation-bounce-in-right {
-  0% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateX(-30px));
-  }
-  80% { @include transform(translateX(10px)); }
-  100% { @include transform(translateX(0)); }
-}
-@keyframes animation-bounce-in-right {
-  0% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateX(-30px));
-  }
-  80% { @include transform(translateX(10px)); }
-  100% { @include transform(translateX(0)); }
-}
-@-webkit-keyframes animation-bounce-in-up {
-  0% {
-    opacity: 0;
-    @include transform(translateY(2000px));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateY(-30px));
-  }
-  80% { @include transform(translateY(10px)); }
-  100% { @include transform(translateY(0)); }
-}
-@keyframes animation-bounce-in-up {
-  0% {
-    opacity: 0;
-    @include transform(translateY(2000px));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateY(-30px));
-  }
-  80% { @include transform(translateY(10px)); }
-  100% { @include transform(translateY(0)); }
-}
-@-webkit-keyframes animation-bounce-out {
-  0% { @include transform(scale(1)); }
-  25% { @include transform(scale(0.95)); }
-  50% {
-    opacity: 1;
-    @include transform(scale(1.1));
-  }
-  100% {
-    opacity: 0;
-    @include transform(scale(0.3));
-  }
-}
-@keyframes animation-bounce-out {
-  0% { @include transform(scale(1)); }
-  25% { @include transform(scale(0.95)); }
-  50% {
-    opacity: 1;
-    @include transform(scale(1.1));
-  }
-  100% {
-    opacity: 0;
-    @include transform(scale(0.3));
-  }
-}
-@-webkit-keyframes animation-bounce-out-down {
-  0% { @include transform(translateY(0)); }
-  20% {
-    opacity: 1;
-    @include transform(translateY(-20px));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(2000px));
-  }
-}
-@keyframes animation-bounce-out-down {
-  0% { @include transform(translateY(0)); }
-  20% {
-    opacity: 1;
-    @include transform(translateY(-20px));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(2000px));
-  }
-}
-@-webkit-keyframes animation-bounce-out-left {
-  0% { @include transform(translateX(0)); }
-  20% {
-    opacity: 1;
-    @include transform(translateX(20px));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-}
-@keyframes animation-bounce-out-left {
-  0% { @include transform(translateX(0)); }
-  20% {
-    opacity: 1;
-    @include transform(translateX(20px));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-}
-@-webkit-keyframes animation-bounce-out-right {
-  0% { @include transform(translateX(0)); }
-  20% {
-    opacity: 1;
-    @include transform(translateX(-20px));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-}
-@keyframes animation-bounce-out-right {
-  0% { @include transform(translateX(0)); }
-  20% {
-    opacity: 1;
-    @include transform(translateX(-20px));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-}
-@-webkit-keyframes animation-bounce-out-up {
-  0% { @include transform(translateY(0)); }
-  20% {
-    opacity: 1;
-    @include transform(translateY(20px));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-}
-@keyframes animation-bounce-out-up {
-  0% { @include transform(translateY(0)); }
-  20% {
-    opacity: 1;
-    @include transform(translateY(20px));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-}
-@-webkit-keyframes animation-fade-in {
-  0% { opacity: 0; }
-  100% { opacity: 1; }
-}
-@keyframes animation-fade-in {
-  0% { opacity: 0; }
-  100% { opacity: 1; }
-}
-@-webkit-keyframes animation-fade-in-down {
-  0% {
-    opacity: 0;
-    @include transform(translateY(-20px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-}
-@keyframes animation-fade-in-down {
-  0% {
-    opacity: 0;
-    @include transform(translateY(-20px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-}
-@-webkit-keyframes animation-fade-in-down-big {
-  0% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-}
-@keyframes animation-fade-in-down-big {
-  0% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-}
-@-webkit-keyframes animation-fade-in-left {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-20px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-}
-@keyframes animation-fade-in-left {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-20px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-}
-@-webkit-keyframes animation-fade-in-left-big {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-}
-@keyframes animation-fade-in-left-big {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-}
-@-webkit-keyframes animation-fade-in-right {
-  0% {
-    opacity: 0;
-    @include transform(translateX(20px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-}
-@keyframes animation-fade-in-right {
-  0% {
-    opacity: 0;
-    @include transform(translateX(20px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-}
-@-webkit-keyframes animation-fade-in-right-big {
-  0% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-}
-@keyframes animation-fade-in-right-big {
-  0% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-}
-@-webkit-keyframes animation-fade-in-up {
-  0% {
-    opacity: 0;
-    @include transform(translateY(20px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-}
-@keyframes animation-fade-in-up {
-  0% {
-    opacity: 0;
-    @include transform(translateY(20px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-}
-@-webkit-keyframes animation-fade-in-up-big {
-  0% {
-    opacity: 0;
-    @include transform(translateY(2000px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-}
-@keyframes animation-fade-in-up-big {
-  0% {
-    opacity: 0;
-    @include transform(translateY(2000px));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-}
-@-webkit-keyframes animation-fade-out {
-  0%   { opacity: 1; }
-  100% { opacity: 0; }
-}
-@keyframes animation-fade-out {
-  0%   { opacity: 1; }
-  100% { opacity: 0; }
-}
-@-webkit-keyframes animation-fade-out-down {
-  0% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(20px));
-  }
-}
-@keyframes animation-fade-out-down {
-  0% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(20px));
-  }
-}
-@-webkit-keyframes animation-fade-out-down-big {
-  0% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(2000px));
-  }
-}
-@keyframes animation-fade-out-down-big {
-  0% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(2000px));
-  }
-}
-@-webkit-keyframes animation-fade-out-left {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(-20px));
-  }
-}
-@keyframes animation-fade-out-left {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(-20px));
-  }
-}
-@-webkit-keyframes animation-fade-out-left-big {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-}
-@keyframes animation-fade-out-left-big {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-}
-@-webkit-keyframes animation-fade-out-right {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(20px));
-  }
-}
-@keyframes animation-fade-out-right {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(20px));
-  }
-}
-@-webkit-keyframes animation-fade-out-right-big {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-}
-@keyframes animation-fade-out-right-big {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-}
-@-webkit-keyframes animation-fade-out-up {
-  0% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(-20px));
-  }
-}
-@keyframes animation-fade-out-up {
-  0% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(-20px));
-  }
-}
-@-webkit-keyframes animation-fade-out-up-big {
-  0% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-}
-@keyframes animation-fade-out-up-big {
-  0% {
-    opacity: 1;
-    @include transform(translateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-}
-@-webkit-keyframes animation-flip {
-  0% {
-    @include animation-timing-function(ease-out);
-    @include transform(perspective(400px) translateZ(0) rotateY(0) scale(1));
-  }
-  40% {
-    @include animation-timing-function(ease-out);
-    @include transform(perspective(400px) translateZ(150px) rotateY(170deg) scale(1));
-  }
-  50% {
-    @include animation-timing-function(ease-in);
-    @include transform(perspective(400px) translateZ(150px) rotateY(190deg) scale(1));
-  }
-  80% {
-    @include animation-timing-function(ease-in);
-    @include transform(perspective(400px) translateZ(0) rotateY(360deg) scale(0.95));
-  }
-  100% {
-    @include animation-timing-function(ease-in);
-    @include transform(perspective(400px) translateZ(0) rotateY(360deg) scale(1));
-  }
-}
-@keyframes animation-flip {
-  0% {
-    @include animation-timing-function(ease-out);
-    @include transform(perspective(400px) translateZ(0) rotateY(0) scale(1));
-  }
-  40% {
-    @include animation-timing-function(ease-out);
-    @include transform(perspective(400px) translateZ(150px) rotateY(170deg) scale(1));
-  }
-  50% {
-    @include animation-timing-function(ease-in);
-    @include transform(perspective(400px) translateZ(150px) rotateY(190deg) scale(1));
-  }
-  80% {
-    @include animation-timing-function(ease-in);
-    @include transform(perspective(400px) translateZ(0) rotateY(360deg) scale(0.95));
-  }
-  100% {
-    @include animation-timing-function(ease-in);
-    @include transform(perspective(400px) translateZ(0) rotateY(360deg) scale(1));
-  }
-}
-@-webkit-keyframes animation-flip-in-x {
-  0% {
-    opacity: 0;
-    @include transform(perspective(400px) rotateX(90deg));
-  }
-  40% { @include transform(perspective(400px) rotateX(-10deg)); }
-  70% { @include transform(perspective(400px) rotateX(10deg)); }
-  100% {
-    opacity: 1;
-    @include transform(perspective(400px) rotateX(0));
-  }
-}
-@keyframes animation-flip-in-x {
-  0% {
-    opacity: 0;
-    @include transform(perspective(400px) rotateX(90deg));
-  }
-  40% { @include transform(perspective(400px) rotateX(-10deg)); }
-  70% { @include transform(perspective(400px) rotateX(10deg)); }
-  100% {
-    opacity: 1;
-    @include transform(perspective(400px) rotateX(0));
-  }
-}
-@-webkit-keyframes animation-flip-in-y {
-  0% {
-    opacity: 0;
-    @include transform(perspective(400px) rotateY(90deg));
-  }
-  40% { @include transform(perspective(400px) rotateY(-10deg)); }
-  70% { @include transform(perspective(400px) rotateY(10deg)); }
-  100% {
-    opacity: 1;
-    @include transform(perspective(400px) rotateY(0));
-  }
-}
-@keyframes animation-flip-in-y {
-  0% {
-    opacity: 0;
-    @include transform(perspective(400px) rotateY(90deg));
-  }
-  40% { @include transform(perspective(400px) rotateY(-10deg)); }
-  70% { @include transform(perspective(400px) rotateY(10deg)); }
-  100% {
-    opacity: 1;
-    @include transform(perspective(400px) rotateY(0));
-  }
-}
-@-webkit-keyframes animation-flip-out-x {
-  0% {
-    opacity: 1;
-    @include transform(perspective(400px) rotateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(perspective(400px) rotateX(90deg));
-  }
-}
-@keyframes animation-flip-out-x {
-  0% {
-    opacity: 1;
-    @include transform(perspective(400px) rotateX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(perspective(400px) rotateX(90deg));
-  }
-}
-@-webkit-keyframes animation-flip-out-y {
-  0% {
-    opacity: 1;
-    @include transform(perspective(400px) rotateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(perspective(400px) rotateY(90deg));
-  }
-}
-@keyframes animation-flip-out-y {
-  0% {
-    opacity: 1;
-    @include transform(perspective(400px) rotateY(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(perspective(400px) rotateY(90deg));
-  }
-}
-@-webkit-keyframes animation-light-speed-in {
-  0% {
-    opacity: 0;
-    @include transform(translateX(100%) skewX(-30deg));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateX(-20%) skewX(30deg));
-  }
-  80% {
-    opacity: 1;
-    @include transform(translateX(0) skewX(-15deg));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0) skewX(0));
-  }
-}
-@keyframes animation-light-speed-in {
-  0% {
-    opacity: 0;
-    @include transform(translateX(100%) skewX(-30deg));
-  }
-  60% {
-    opacity: 1;
-    @include transform(translateX(-20%) skewX(30deg));
-  }
-  80% {
-    opacity: 1;
-    @include transform(translateX(0) skewX(-15deg));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0) skewX(0));
-  }
-}
-@-webkit-keyframes animation-light-speed-out {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0) skewX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(100%) skewX(-30deg));
-  }
-}
-@keyframes animation-light-speed-out {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0) skewX(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(100%) skewX(-30deg));
-  }
-}
-@-webkit-keyframes animation-rotate-in {
-  0% {
-    opacity: 0;
-    @include transform(rotate(-200deg));
-    @include transform-origin(center center);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(center center);
-  }
-}
-@keyframes animation-rotate-in {
-  0% {
-    opacity: 0;
-    @include transform(rotate(-200deg));
-    @include transform-origin(center center);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(center center);
-  }
-}
-@-webkit-keyframes animation-rotate-in-down-left {
-  0% {
-    opacity: 0;
-    @include transform(rotate(-90deg));
-    @include transform-origin(left bottom);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(left bottom);
-  }
-}
-@keyframes animation-rotate-in-down-left {
-  0% {
-    opacity: 0;
-    @include transform(rotate(-90deg));
-    @include transform-origin(left bottom);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(left bottom);
-  }
-}
-@-webkit-keyframes animation-rotate-in-down-right {
-  0% {
-    opacity: 0;
-    @include transform(rotate(90deg));
-    @include transform-origin(right bottom);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(right bottom);
-  }
-}
-@keyframes animation-rotate-in-down-right {
-  0% {
-    opacity: 0;
-    @include transform(rotate(90deg));
-    @include transform-origin(right bottom);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(right bottom);
-  }
-}
-@-webkit-keyframes animation-rotate-in-up-left {
-  0% {
-    opacity: 0;
-    @include transform(rotate(90deg));
-    @include transform-origin(left bottom);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(left bottom);
-  }
-}
-@keyframes animation-rotate-in-up-left {
-  0% {
-    opacity: 0;
-    @include transform(rotate(90deg));
-    @include transform-origin(left bottom);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(left bottom);
-  }
-}
-@-webkit-keyframes animation-rotate-in-up-right {
-  0% {
-    opacity: 0;
-    @include transform(rotate(-90deg));
-    @include transform-origin(right bottom);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(right bottom);
-  }
-}
-@keyframes animation-rotate-in-up-right {
-  0% {
-    opacity: 0;
-    @include transform(rotate(-90deg));
-    @include transform-origin(right bottom);
-  }
-  100% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(right bottom);
-  }
-}
-@-webkit-keyframes animation-rotate-out {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(center center);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(200deg));
-    @include transform-origin(center center);
-  }
-}
-@keyframes animation-rotate-out {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(center center);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(200deg));
-    @include transform-origin(center center);
-  }
-}
-@-webkit-keyframes animation-rotate-out-down-left {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(left bottom);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(90deg));
-    @include transform-origin(left bottom);
-  }
-}
-@keyframes animation-rotate-out-down-left {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(left bottom);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(90deg));
-    @include transform-origin(left bottom);
-  }
-}
-@-webkit-keyframes animation-rotate-out-down-right {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(right bottom);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(-90deg));
-    @include transform-origin(right bottom);
-  }
-}
-@keyframes animation-rotate-out-down-right {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(right bottom);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(-90deg));
-    @include transform-origin(right bottom);
-  }
-}
-@-webkit-keyframes animation-rotate-out-up-left {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(left bottom);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(-90deg));
-    @include transform-origin(left bottom);
-  }
-}
-@keyframes animation-rotate-out-up-left {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(left bottom);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(-90deg));
-    @include transform-origin(left bottom);
-  }
-}
-@-webkit-keyframes animation-rotate-out-up-right {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(right bottom);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(90deg));
-    @include transform-origin(right bottom);
-  }
-}
-@keyframes animation-rotate-out-up-right {
-  0% {
-    opacity: 1;
-    @include transform(rotate(0));
-    @include transform-origin(right bottom);
-  }
-  100% {
-    opacity: 0;
-    @include transform(rotate(90deg));
-    @include transform-origin(right bottom);
-  }
-}
-@-webkit-keyframes animation-slide-in-down {
-  0% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-  100% { @include transform(translateY(0)); }
-}
-@keyframes animation-slide-in-down {
-  0% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-  100% { @include transform(translateY(0)); }
-}
-@-webkit-keyframes animation-slide-in-left {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-  100% { @include transform(translateX(0)); }
-}
-@keyframes animation-slide-in-left {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-  100% { @include transform(translateX(0)); }
-}
-@-webkit-keyframes animation-slide-in-right {
-  0% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-  100% { @include transform(translateX(0)); }
-}
-@keyframes animation-slide-in-right {
-  0% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-  100% { @include transform(translateX(0)); }
-}
-@-webkit-keyframes animation-slide-out-left {
-  0% { @include transform(translateX(0)); }
-  100% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-}
-@keyframes animation-slide-out-left {
-  0% { @include transform(translateX(0)); }
-  100% {
-    opacity: 0;
-    @include transform(translateX(-2000px));
-  }
-}
-@-webkit-keyframes animation-slide-out-right {
-  0% { @include transform(translateX(0)); }
-  100% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-}
-@keyframes animation-slide-out-right {
-  0% { @include transform(translateX(0)); }
-  100% {
-    opacity: 0;
-    @include transform(translateX(2000px));
-  }
-}
-@-webkit-keyframes animation-slide-out-up {
-  0% { @include transform(translateY(0)); }
-  100% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-}
-@keyframes animation-slide-out-up {
-  0% { @include transform(translateY(0)); }
-  100% {
-    opacity: 0;
-    @include transform(translateY(-2000px));
-  }
-}
-@-webkit-keyframes animation-hinge {
-  0% {
-    @include transform(rotate(0));
-    @include transform-origin(top left);
-  }
-  20%, 60% {
-    @include transform(rotate(80deg));
-    @include transform-origin(top left);
-  }
-  40% {
-    @include transform(rotate(60deg));
-    @include transform-origin(top left);
-  }
-  80% {
-    opacity: 1;
-    @include transform(rotate(60deg) translateY(0));
-    @include transform-origin(top left);
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(700px));
-  }
-}
-@keyframes animation-hinge {
-  0% {
-    @include transform(rotate(0));
-    @include transform-origin(top left);
-  }
-  20%, 60% {
-    @include transform(rotate(80deg));
-    @include transform-origin(top left);
-  }
-  40% {
-    @include transform(rotate(60deg));
-    @include transform-origin(top left);
-  }
-  80% {
-    opacity: 1;
-    @include transform(rotate(60deg) translateY(0));
-    @include transform-origin(top left);
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateY(700px));
-  }
-}
-@-webkit-keyframes animation-roll-in {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-100%) rotate(-120deg));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0) rotate(0));
-  }
-}
-@keyframes animation-roll-in {
-  0% {
-    opacity: 0;
-    @include transform(translateX(-100%) rotate(-120deg));
-  }
-  100% {
-    opacity: 1;
-    @include transform(translateX(0) rotate(0));
-  }
-}
-@-webkit-keyframes animation-roll-out {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0) rotate(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(100%) rotate(120deg));
-  }
-}
-@keyframes animation-roll-out {
-  0% {
-    opacity: 1;
-    @include transform(translateX(0) rotate(0));
-  }
-  100% {
-    opacity: 0;
-    @include transform(translateX(100%) rotate(120deg));
-  }
-}
-
-/* # Animation
-================================================== */
-.animation {
-  @include animation-duration(1s);
-  @include animation-fill-mode(both);
-  position: relative;
-}
-
-/* # Names
-================================================== */
-.animation-bounce { @include animation-name(animation-bounce); }
-.animation-flash { @include animation-name(animation-flash); }
-.animation-pulse { @include animation-name(animation-pulse); }
-.animation-shake { @include animation-name(animation-shake); }
-.animation-swing {
-  @include animation-name(animation-swing);
-  @include transform-origin(top center);
-}
-.animation-tada { @include animation-name(animation-tada); }
-.animation-wobble { @include animation-name(animation-wobble); }
-.animation-bounce-in { @include animation-name(animation-bounce-in); }
-.animation-bounce-in-down { @include animation-name(animation-bounce-in-down); }
-.animation-bounce-in-left { @include animation-name(animation-bounce-in-left); }
-.animation-bounce-in-right { @include animation-name(animation-bounce-in-right); }
-.animation-bounce-in-up { @include animation-name(animation-bounce-in-up); }
-.animation-bounce-out { @include animation-name(animation-bounce-out); }
-.animation-bounce-out-down { @include animation-name(animation-bounce-out-down); }
-.animation-bounce-out-left { @include animation-name(animation-bounce-out-left); }
-.animation-bounce-out-right { @include animation-name(animation-bounce-out-right); }
-.animation-bounce-out-up { @include animation-name(animation-bounce-out-up); }
-.animation-fade-in { @include animation-name(animation-fade-in); }
-.animation-fade-in-down { @include animation-name(animation-fade-in-down); }
-.animation-fade-in-down-big { @include animation-name(animation-fade-in-down-big); }
-.animation-fade-in-left { @include animation-name(animation-fade-in-left); }
-.animation-fade-in-left-big { @include animation-name(animation-fade-in-left); }
-.animation-fade-in-right { @include animation-name(animation-fade-in-right); }
-.animation-fade-in-right-big { @include animation-name(animation-fade-in-right-big); }
-.animation-fade-in-up { @include animation-name(animation-fade-in-up); }
-.animation-fade-in-up-big { @include animation-name(animation-fade-in-up-big); }
-.animation-fade-out { @include animation-name(animation-fade-out); }
-.animation-fade-out-down { @include animation-name(animation-fade-out-down); }
-.animation-fade-out-down-big { @include animation-name(animation-fade-out-down-big); }
-.animation-fade-out-left { @include animation-name(animation-fade-out-left); }
-.animation-fade-out-left-big { @include animation-name(animation-fade-out-left-big); }
-.animation-fade-out-right { @include animation-name(animation-fade-out-right); }
-.animation-fade-out-right-big { @include animation-name(animation-fade-out-right-big); }
-.animation-fade-out-up { @include animation-name(animation-fade-out-up); }
-.animation-fade-out-up-big { @include animation-name(animation-fade-out-up-big); }
-.animation-flip { @include animation-name(animation-flip); }
-.animation-flip-in-x { @include animation-name(animation-flip-in-x); }
-.animation-flip-in-y { @include animation-name(animation-flip-in-y); }
-.animation-flip-out-x { @include animation-name(animation-flip-out-x); }
-.animation-flip-out-y { @include animation-name(animation-flip-out-y); }
-.animation-flip,
-.animation-flip-in-x,
-.animation-flip-in-y,
-.animation-flip-out-x,
-.animation-flip-out-y { @include backface-visibility(visible); }
-.animation-light-speed-in {
-  @include animation-name(animation-light-speed-in);
-  @include animation-timing-function(ease-out);
-}
-.animation-light-speed-out {
-  @include animation-name(animation-light-speed-out);
-  @include animation-timing-function(ease-in);
-}
-.animation-rotate-in { @include animation-name(animation-rotate-in); }
-.animation-rotate-in-down-left { @include animation-name(animation-rotate-in-down-left); }
-.animation-rotate-in-down-right { @include animation-name(animation-rotate-in-down-right); }
-.animation-rotate-in-up-left { @include animation-name(animation-rotate-in-up-left); }
-.animation-rotate-in-up-right { @include animation-name(animation-rotate-in-up-right); }
-.animation-rotate-out { @include animation-name(animation-rotate-out); }
-.animation-rotate-out-down-left { @include animation-name(animation-rotate-out-down-left); }
-.animation-rotate-out-down-right { @include animation-name(animation-rotate-out-down-right); }
-.animation-rotate-out-up-left { @include animation-name(animation-rotate-out-up-left); }
-.animation-rotate-out-up-right { @include animation-name(animation-rotate-out-up-right); }
-.animation-slide-in-down { @include animation-name(animation-slide-in-down); }
-.animation-slide-in-left { @include animation-name(animation-slide-in-left); }
-.animation-slide-in-right { @include animation-name(animation-slide-in-right); }
-.animation-slide-out-left { @include animation-name(animation-slide-out-left); }
-.animation-slide-out-right { @include animation-name(animation-slide-out-right); }
-.animation-slide-out-up { @include animation-name(animation-slide-out-up); }
-.animation-hinge {
-  @include animation-duration(2s);
-  @include animation-name(animation-hinge);
-  @include animation-timing-function(ease-in-out);
-}
-.animation-roll-in { @include animation-name(animation-roll-in); }
-.animation-roll-out { @include animation-name(animation-roll-out); }
-
-/* # Delays
-================================================== */
-.animation.animation-delay-shortest { @include animation-delay(0.25s); }
-.animation.animation-delay-shorter { @include animation-delay(0.5s); }
-.animation.animation-delay-short { @include animation-delay(0.75s); }
-.animation.animation-delay-default { @include animation-delay(1s); }
-.animation.animation-delay-long { @include animation-delay(1.25s); }
-.animation.animation-delay-longer { @include animation-delay(1.5s); }
-.animation.animation-delay-longest { @include animation-delay(1.75s); }
-
-/* # Durations
-================================================== */
-.animation.animation-duration-fastest { @include animation-duration(0.25s); }
-.animation.animation-duration-faster { @include animation-duration(0.5s); }
-.animation.animation-duration-fast { @include animation-duration(0.75s); }
-.animation.animation-duration-default { @include animation-duration(1s); }
-.animation.animation-duration-slow { @include animation-duration(1.25s); }
-.animation.animation-duration-slower { @include animation-duration(1.5s); }
-.animation.animation-duration-slowest { @include animation-duration(1.75s); }