backOutLeft.css

TLDR

This CSS file defines animation keyframes and a CSS class for the "backOutLeft" animation.

Classes

backOutLeft

The "backOutLeft" class applies the "backOutLeft" animation to an element.

Animation Keyframes

backOutLeft

The "backOutLeft" animation keyframes define the following transformations and changes in opacity:

• 0%: The element is at its original scale of 1 and opacity of 1.
• 20%: The element is scaled down to 0.7 of its original size and its opacity is reduced to 0.7.
• 100%: The element is translated to the left by 2000px, scaled down to 0.7 of its original size, and its opacity remains at 0.7.

@keyframes backOutLeft {
  0% {
    transform: scale(1);
    opacity: 1;
  }

  20% {
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
}

.backOutLeft {
  animation-name: backOutLeft;
}