@charset "UTF-8";

/* Animate Down
-------------------------------------------------- */

@keyframes animate-down {
  from, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    transform: translate3d(0, -10px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.animate-down {
  animation-name: animate-down;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}

/* Animate Up
-------------------------------------------------- */

@keyframes animate-up {
  from, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    transform: translate3d(0, 100px, 0);
  }

  to {
    transform: none;
  }
}

.animate-up {
  animation-name: animate-up;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}

/* Animate Right
-------------------------------------------------- */

@keyframes animate-right {
  from, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    transform: translate3d(100px, 0, 0);
  }

  to {
    transform: none;
  }
}

.animate-right {
  animation-name: animate-right;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}

/* Animate Left
-------------------------------------------------- */

@keyframes animate-left {
  from, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    transform: translate3d(-100px, 0, 0);
  }

  to {
    transform: none;
  }
}

.animate-left {
  animation-name: animate-left;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}

/* Animate Open
-------------------------------------------------- */

@keyframes animate-open {
  from, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    transform: scale3d(.3, .3, .3);
  }

  to {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}

.animate-open {
  animation-name: animate-open;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}

/* Animate Show
-------------------------------------------------- */

@keyframes animate-show {
  from, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.animate-show {
  animation-name: animate-show;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}

/* Animate Shake
-------------------------------------------------- */

@keyframes animate-shake {
  from, to {
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    transform: translate3d(10px, 0, 0);
  }
}

.animate-shake {
  animation-name: animate-shake;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}