/* Style Sheet for Basic Animations */

/* ----- ANIMATIONS ----- */
.powerup {
  animation: powerup 2s ease;
}
@keyframes powerup {
  0% {
    transform: scaleX(0) scaleY(0);
    opacity: 0;
  }
  25% {
    transform: scaleX(1) scaleY(0.2);
    opacity: 0.5;
  }
  100% {
    transform: scaleX(1) scaleY(1);
    opacity: 1;
  }
}
.powerdown {
  animation: powerdown 2s ease;
}
@keyframes powerdown {
  0% {
    transform: scaleX(1) scaleY(1);
    opacity: 1;
  }
  75% {
    transform: scaleX(1) scaleY(0.2);
    opacity: 0.5;
  }
  100% {
    transform: scaleX(0) scaleY(0);
    opacity: 0;
  }
}
.appear {
  animation: appearY 2s ease;
}
.appear-fast {
  animation: appearY 0.5s ease;
}
.appear-x {
  animation: appearX 2s ease;
}
.appear-x-fast {
  animation: appearX 0.5s ease;
}
.appear-y {
  animation: appearY 2s ease;
}
.appear-y-fast {
  animation: appearY 0.5s ease;
}
@keyframes appearX {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(1);
  }
}
@keyframes appearY {
  0% {
    transform: scaleY(0);
  }
  100% {
    transform: scaleY(1);
  }
}
.appear-xy {
  animation: appearXY 2s ease;
}
.appear-xy-fast {
  animation: appearXY 0.5s ease;
}
@keyframes appearXY {
  0% {
    transform: scaleX(0) scaleY(0);
  }
  100% {
    transform: scaleX(1) scaleY(1);
  }
}
.pulsate {
  animation: pulse 1s infinite;
}
@keyframes pulse {
  0% {
    transform: scale(0.95);
  }
  70% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.95);
  }
}
.ticker {
  width: 100%;
  animation: ticker 15s infinite linear;
}
@keyframes ticker {
  0% {
    transform: translate3d(100%, 0, 0);
  }
  100% {
    transform: translate3d(-200%, 0, 0);
  }
}
.fade-in-1 {
  animation: fade-in 1s ease-in;
}
.fade-in-2 {
  animation: fade-in 2s ease-in;
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}