.animated {
  animation-duration: 1s;
  animation-fill-mode: both; }

.pulsate {
  animation: pulsate 1s ease-out;
  animation-iteration-count: infinite; }

.pulsate-slow {
  animation: pulsate 2s ease-out;
  animation-iteration-count: infinite; }

.explode-bang {
  opacity: 0.0;
  animation: explode-bang 2s ease-out;
  animation-iteration-count: infinite; }

.explode-cloud {
  opacity: 0.0;
  animation: explode-cloud 2s ease-out;
  animation-iteration-count: infinite; }

.explode-bomb {
  animation: explode-bomb 2s ease-out;
  animation-iteration-count: infinite; }

@keyframes spin {
  100% {
    transform: rotate(360deg); } }

.spin-animation {
  animation: spin 1s linear infinite; }

@keyframes flipInX {
  0% {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0; }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in; }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1; }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg); }
  100% {
    transform: perspective(400px); } }

.flipInX {
  backface-visibility: visible !important;
  animation-name: flipInX; }

@keyframes flipOutX {
  0% {
    transform: perspective(400px); }
  30% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1; }
  100% {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0; } }

.flipOutX {
  animation-name: flipOutX;
  backface-visibility: visible !important; }

@keyframes zoomin {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3); }
  50% {
    opacity: 1; } }

.zoomin {
  animation-name: zoomin; }

@keyframes bounce {
  from, 20%, 53%, 80%, 100% {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translate3d(0, 0, 0); }
  40%, 43% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -30px, 0); }
  70% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -15px, 0); }
  90% {
    transform: translate3d(0, -4px, 0); } }

.bounce {
  animation-name: bounce;
  transform-origin: center bottom; }

@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3); }
  20% {
    transform: scale3d(1.1, 1.1, 1.1); }
  40% {
    transform: scale3d(0.9, 0.9, 0.9); }
  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03); }
  80% {
    transform: scale3d(0.97, 0.97, 0.97); }
  to {
    opacity: 1;
    transform: scale3d(1, 1, 1); } }

.bounceIn {
  animation-name: bounceIn; }
