

.slide-in-fwd-center {
  -webkit-animation: slide-in-fwd-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) forwards;
          animation: slide-in-fwd-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) forwards;
}
.slide-in-fwd-centerX {
  -webkit-animation: slide-in-fwd-centerX 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) forwards;
          animation: slide-in-fwd-centerX 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) forwards;
}
.slide-out-fwd-center {
  -webkit-animation: slide-out-fwd-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) forwards;
          animation: slide-out-fwd-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) forwards;
}

@-webkit-keyframes slide-in-fwd-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes slide-in-fwd-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}

@-webkit-keyframes slide-out-fwd-center {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0;
  }
}
@keyframes slide-out-fwd-center {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 0;
  }
}

@-webkit-keyframes slide-in-fwd-centerX {
  0% {
    -webkit-transform: scale(0) translateX(-50%) rotate(0);
            transform: scale(0) translateX(-50%) rotate(0);
    opacity: 0;
    transform-origin: left;
  } 
  50% {
    -webkit-transform: scale(1) translateX(-50%) rotate(0);
            transform: scale(1) translateX(-50%) rotate(0);
    opacity: 1;
    transform-origin: left;
  }
  51% {
    -webkit-transform: scale(1) translateX(-50%) rotate(0);
            transform: scale(1) translateX(-50%) rotate(0);
    opacity: 1;
    transform-origin: center;
  }
  100% {
    -webkit-transform: scale(1) translateX(-50%) rotate(-15deg);
            transform: scale(1) translateX(-50%) rotate(-15deg);
    opacity: 1;
    transform-origin: center;
  }
}
@keyframes slide-in-fwd-centerX {
  0% {
    -webkit-transform: scale(0) translateX(-50%) rotate(0);
            transform: scale(0) translateX(-50%) rotate(0);
    opacity: 0;
    transform-origin: left;
  } 
  50% {
    -webkit-transform: scale(1) translateX(-50%) rotate(0);
            transform: scale(1) translateX(-50%) rotate(0);
    opacity: 1;
    transform-origin: left;
  }
  51% {
    -webkit-transform: scale(1) translateX(-50%) rotate(0);
            transform: scale(1) translateX(-50%) rotate(0);
    opacity: 1;
    transform-origin: center;
  }
  100% {
    -webkit-transform: scale(1) translateX(-50%) rotate(-15deg);
            transform: scale(1) translateX(-50%) rotate(-15deg);
    opacity: 1;
    transform-origin: center;
  }
}



@keyframes slidr {
  0% { transform: translateY(50%) rotate(0deg); }
  10% { transform: translateY(50%) rotate(10deg); }
  20% { transform: translateY(50%) rotate(20deg); }
  30% { transform: translateY(50%) rotate(30deg); }
  40% { transform: translateY(50%) rotate(40deg); }
  50% { transform: translateY(50%) rotate(50deg); }
  60% { transform: translateY(50%) rotate(40deg); }
  70% { transform: translateY(50%) rotate(30deg); }
  80% { transform: translateY(50%) rotate(20deg); }
  90% { transform: translateY(50%) rotate(10deg); }
  100% { transform: translateY(50%) rotate(0deg); }
}

@-webkit-keyframes slidr {
  0% { transform: translateY(50%) rotate(0deg); }
  10% { transform: translateY(50%) rotate(10deg); }
  20% { transform: translateY(50%) rotate(20deg); }
  30% { transform: translateY(50%) rotate(30deg); }
  40% { transform: translateY(50%) rotate(40deg); }
  50% { transform: translateY(50%) rotate(50deg); }
  60% { transform: translateY(50%) rotate(40deg); }
  70% { transform: translateY(50%) rotate(30deg); }
  80% { transform: translateY(50%) rotate(20deg); }
  90% { transform: translateY(50%) rotate(10deg); }
  100% { transform: translateY(50%) rotate(0deg); }
}


@keyframes slidr2 {
  0% { transform: translateY(50%) rotate(180deg); margin-top: -42%; }
  10% { transform: translateY(50%) rotate(190deg); margin-top: -42%; }
  20% { transform: translateY(50%) rotate(200deg); margin-top: -42%; }
  50% { transform: translateY(50%) rotate(210deg); margin-top: -41%; }
  80% { transform: translateY(50%) rotate(200deg); margin-top: -42%; }
  90% { transform: translateY(50%) rotate(190deg); margin-top: -42%; }
  100% { transform: translateY(50%) rotate(180deg); margin-top: -42%; }
}

@-webkit-keyframes slidr2 {
  0% { transform: translateY(50%) rotate(180deg); margin-top: -42%; }
  10% { transform: translateY(50%) rotate(190deg); margin-top: -42%; }
  20% { transform: translateY(50%) rotate(200deg); margin-top: -42%; }
  50% { transform: translateY(50%) rotate(210deg); margin-top: -41%; }
  80% { transform: translateY(50%) rotate(200deg); margin-top: -42%; }
  90% { transform: translateY(50%) rotate(190deg); margin-top: -42%; }
  100% { transform: translateY(50%) rotate(180deg); margin-top: -42%; }
}