$lightspeed-animations: true !default;


@if $lightspeed-animations {

  @keyframes lightSpeedIn {
    0% { transform: translateX(100%) skewX(-30deg); opacity: 0; }
    60% { transform: translateX(-20%) skewX(30deg); opacity: 1; }
    80% { transform: translateX(0%) skewX(-15deg); opacity: 1; }
    100% { transform: translateX(0%) skewX(0deg); opacity: 1; }
  }

  .lightSpeedIn {
    animation-name: lightSpeedIn;
    animation-timing-function: ease-out;
  }

  .animated.lightSpeedIn {
    animation-duration: 0.5s;
  }

  @keyframes lightSpeedOut {
    0% { transform: translateX(0%) skewX(0deg); opacity: 1; }
    100% { transform: translateX(100%) skewX(-30deg); opacity: 0; }
  }

  .lightSpeedOut {
    animation-name: lightSpeedOut;
    animation-timing-function: ease-in;
  }

  .animated.lightSpeedOut {
    animation-duration: 0.25s;
  }
}