@-webkit-keyframes spinAround {
    from {
      -webkit-transform: rotate(0deg)
    }
    to {
      -webkit-transform: rotate(360deg);
    }
  }
  @-moz-keyframes spinAround {
    from {
      -moz-transform: rotate(0deg)
    }
    to {
      -moz-transform: rotate(360deg);
    }
  }
  @keyframes spinAround {
    from {
      transform: rotate(0deg)
    }
    to {
      transform: rotate(360deg);
    }
  }
  
  
  @-webkit-keyframes mover {
      0% { transform: translateY(0); }
      100% { transform: translateY(-10px); }
  }
  @keyframes mover {
      0% { transform: translateY(0); }
      100% { transform: translateY(-10px); }
  }
  
  @-webkit-keyframes mover2 {
      0% { transform: translate(0); }
      100% { transform: translate(-10px, -10px); }
  }
  @keyframes mover2 {
      0% { transform: translate(0); }
      100% { transform: translate(-10px, -10px); }
  }
  @keyframes rotation {
      from {
        transform: rotate(0deg);
      }
      to {
        transform: rotate(359deg);
      }
  }
  
  
  @-webkit-keyframes mover3 {
      0% { transform: translate(50px,0); }
      100% { transform: translate(-50px, 0); }
  }
  @keyframes mover3 {
      0% { transform: translate(50px,0); }
      100% { transform: translate(-50px, 0); }
  }
  
  
  /*-----------SPINNER---------------------*/
  @-moz-keyframes spinner {
      0% {
          transform: rotate(0);
      }
      100% {
          transform: rotate(360deg);
      }
  }
  
  @-webkit-keyframes spinner {
      0% {
          transform: rotate(0);
      }
      100% {
          transform: rotate(360deg);
      }
  }
  
  @-o-keyframes spinner {
      0% {
          transform: rotate(0);
      }
      100% {
          transform: rotate(360deg);
      }
  }
  
  @keyframes spinner {
      0% {
          transform: rotate(0);
      }
      100% {
          transform: rotate(360deg);
      }
  }
  
  @-moz-keyframes header-drop {
      0% {
          -webkit-transform: translateY(-92px);
          -moz-transform: translateY(-92px);
          -ms-transform: translateY(-92px);
          -o-transform: translateY(-92px);
          transform: translateY(-92px);
      }
      100% {
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          -o-transform: translateY(0);
          transform: translateY(0);
      }
  }
  
  @-webkit-keyframes header-drop {
      0% {
          -webkit-transform: translateY(-92px);
          -moz-transform: translateY(-92px);
          -ms-transform: translateY(-92px);
          -o-transform: translateY(-92px);
          transform: translateY(-92px);
      }
      100% {
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          -o-transform: translateY(0);
          transform: translateY(0);
      }
  }
  
  @-o-keyframes header-drop {
      0% {
          -webkit-transform: translateY(-92px);
          -moz-transform: translateY(-92px);
          -ms-transform: translateY(-92px);
          -o-transform: translateY(-92px);
          transform: translateY(-92px);
      }
      100% {
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          -o-transform: translateY(0);
          transform: translateY(0);
      }
  }
  
  @keyframes header-drop {
      0% {
          -webkit-transform: translateY(-92px);
          -moz-transform: translateY(-92px);
          -ms-transform: translateY(-92px);
          -o-transform: translateY(-92px);
          transform: translateY(-92px);
      }
      100% {
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          -o-transform: translateY(0);
          transform: translateY(0);
      }
  }
  

  @-moz-keyframes header-drop-out {
      0% {
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          -o-transform: translateY(0);
          transform: translateY(0);
      }
      100% {
          -webkit-transform: translateY(-92px);
          -moz-transform: translateY(-92px);
          -ms-transform: translateY(-92px);
          -o-transform: translateY(-92px);
          transform: translateY(-92px);
      }
  }
  
  @-webkit-keyframes header-drop-out {
      0% {
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          -o-transform: translateY(0);
          transform: translateY(0);
      }
      100% {
          -webkit-transform: translateY(-92px);
          -moz-transform: translateY(-92px);
          -ms-transform: translateY(-92px);
          -o-transform: translateY(-92px);
          transform: translateY(-92px);
      }
  }
  
  @-o-keyframes header-drop-out {
      0% {
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          -o-transform: translateY(0);
          transform: translateY(0);
      }
      100% {
  
          -webkit-transform: translateY(-92px);
          -moz-transform: translateY(-92px);
          -ms-transform: translateY(-92px);
          -o-transform: translateY(-92px);
          transform: translateY(-92px);
      }
  }
  
  @keyframes header-drop-out {
      0% {
          -webkit-transform: translateY(0);
          -moz-transform: translateY(0);
          -ms-transform: translateY(0);
          -o-transform: translateY(0);
          transform: translateY(0);
      }
      100% {
          -webkit-transform: translateY(-92px);
          -moz-transform: translateY(-92px);
          -ms-transform: translateY(-92px);
          -o-transform: translateY(-92px);
          transform: translateY(-92px);
      }
  }
  
  @-webkit-keyframes toRightFromLeft {
      49% {
          -webkit-transform: translate(100%);
      }
      50% {
          opacity: 0;
          -webkit-transform: translate(-100%);
      }
      51% {
          opacity: 1;
      }
  }
  @-moz-keyframes toRightFromLeft {
      49% {
          -moz-transform: translate(100%);
      }
      50% {
          opacity: 0;
          -moz-transform: translate(-100%);
      }
      51% {
          opacity: 1;
      }
  }
  @keyframes toRightFromLeft {
      49% {
          transform: translate(100%);
      }
      50% {
          opacity: 0;
          transform: translate(-100%);
      }
      51% {
          opacity: 1;
      }
  }
  
  /* Wobble Horizontal */
  
  @-webkit-keyframes hvr-wobble-horizontal {
    16.65% {
      -webkit-transform: translateX(8px);
      transform: translateX(8px);
    }
  
    33.3% {
      -webkit-transform: translateX(-6px);
      transform: translateX(-6px);
    }
  
    49.95% {
      -webkit-transform: translateX(4px);
      transform: translateX(4px);
    }
  
    66.6% {
      -webkit-transform: translateX(-2px);
      transform: translateX(-2px);
    }
  
    83.25% {
      -webkit-transform: translateX(1px);
      transform: translateX(1px);
    }
  
    100% {
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }
  
  @keyframes hvr-wobble-horizontal {
    16.65% {
      -webkit-transform: translateX(8px);
      transform: translateX(8px);
    }
  
    33.3% {
      -webkit-transform: translateX(-6px);
      transform: translateX(-6px);
    }
  
    49.95% {
      -webkit-transform: translateX(4px);
      transform: translateX(4px);
    }
  
    66.6% {
      -webkit-transform: translateX(-2px);
      transform: translateX(-2px);
    }
  
    83.25% {
      -webkit-transform: translateX(1px);
      transform: translateX(1px);
    }
  
    100% {
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }
  
  @keyframes anim-dash {
      0% {
          stroke-dashoffset: 1680;
      }
      100% {
          stroke-dashoffset: 0;
      }
  }
  
  @-webkit-keyframes anim-dash {
      0% {
          stroke-dashoffset: 1680;
      }
      100% {
          stroke-dashoffset: 0;
      }
  }
  
  /* Inner elements animations */
  
  @-webkit-keyframes anim-elem-1 {
      0% { opacity: 0; }
      100% { opacity: 1; }
  }
  
  @keyframes anim-elem-1 {
      0% { opacity: 0; }
      100% { opacity: 1; }
  }
  /* FadeInDown for Search Popup*/
  @-webkit-keyframes fadeInDown {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  @keyframes fadeInDown {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  .animate {
      -webkit-animation-duration: .5s;
      -moz-animation-duration: .5s;
      -o-animation-duration: .5s;
      animation-duration: .5s;
      -webkit-animation-fill-mode: both;
      -moz-animation-fill-mode: both;
      -o-animation-fill-mode: both;
      animation-fill-mode: both;
      will-change: transform, opacity
  }
  
  @-webkit-keyframes slideInDown {
    from {
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
      visibility: visible;
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes slideInDown {
    from {
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
      visibility: visible;
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  .slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
  }
  
  
  @-webkit-keyframes slideOutUp {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    to {
      visibility: hidden;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  }
  
  @keyframes slideOutUp {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  
    to {
      visibility: hidden;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  }
  
  .slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp;
  }
  
  @-webkit-keyframes fadeInDown {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes fadeInDown {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  .fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
  }
  
  @-webkit-keyframes fadeOutUp {
    from {
      opacity: 1;
    }
  
    to {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  }
  
  @keyframes fadeOutUp {
    from {
      opacity: 1;
    }
  
    to {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
    }
  }
  
  .fadeOutUp {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp;
  }
  
  @-webkit-keyframes swingInX {
      0% {
          -webkit-transform: perspective(400px) rotateX(-90deg)
      }
      100% {
          -webkit-transform: perspective(400px) rotateX(0deg)
      }
  }
  
  @-moz-keyframes swingInX {
      0% {
          -moz-transform: perspective(400px) rotateX(-90deg)
      }
      100% {
          -moz-transform: perspective(400px) rotateX(0deg)
      }
  }
  
  @-o-keyframes swingInX {
      0% {
          -o-transform: perspective(400px) rotateX(-90deg)
      }
      100% {
          -o-transform: perspective(400px) rotateX(0deg)
      }
  }
  
  @keyframes swingInX {
      0% {
          transform: perspective(400px) rotateX(-90deg)
      }
      100% {
          transform: perspective(400px) rotateX(0deg)
      }
  }
  
  .animate.swingInX {
      -webkit-transform-origin: top;
      -moz-transform-origin: top;
      -ie-transform-origin: top;
      -o-transform-origin: top;
      transform-origin: top;
      -webkit-backface-visibility: visible !important;
      -webkit-animation-name: swingInX;
      -moz-backface-visibility: visible !important;
      -moz-animation-name: swingInX;
      -o-backface-visibility: visible !important;
      -o-animation-name: swingInX;
      backface-visibility: visible !important;
      animation-name: swingInX
  }
  
  @-webkit-keyframes swingOutX {
      0% {
          -webkit-transform: perspective(400px) rotateX(0deg)
      }
      100% {
          -webkit-transform: perspective(400px) rotateX(-90deg)
      }
  }
  
  @-moz-keyframes swingOutX {
      0% {
          -moz-transform: perspective(400px) rotateX(0deg)
      }
      100% {
          -moz-transform: perspective(400px) rotateX(-90deg)
      }
  }
  
  @-o-keyframes swingOutX {
      0% {
          -o-transform: perspective(400px) rotateX(0deg)
      }
      100% {
          -o-transform: perspective(400px) rotateX(-90deg)
      }
  }
  
  @keyframes swingOutX {
      0% {
          transform: perspective(400px) rotateX(0deg)
      }
      100% {
          transform: perspective(400px) rotateX(-90deg)
      }
  }
  
  .animate.swingOutX {
      -webkit-transform-origin: top;
      -webkit-animation-name: swingOutX;
      -webkit-backface-visibility: visible !important;
      -moz-animation-name: swingOutX;
      -moz-backface-visibility: visible !important;
      -o-animation-name: swingOutX;
      -o-backface-visibility: visible !important;
      animation-name: swingOutX;
      backface-visibility: visible !important
  }
  
  @-webkit-keyframes flipInX {
    from {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
      transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in;
      opacity: 0;
    }
  
    40% {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
      transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in;
    }
  
    60% {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
      transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
      opacity: 1;
    }
  
    80% {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
      transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    }
  
    to {
      -webkit-transform: perspective(400px);
      transform: perspective(400px);
    }
  }
  
  @keyframes flipInX {
    from {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
      transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in;
      opacity: 0;
    }
  
    40% {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
      transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in;
    }
  
    60% {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
      transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
      opacity: 1;
    }
  
    80% {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
      transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    }
  
    to {
      -webkit-transform: perspective(400px);
      transform: perspective(400px);
    }
  }
  
  .flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX;
  }
  
  @-webkit-keyframes flipOutX {
    from {
      -webkit-transform: perspective(400px);
      transform: perspective(400px);
    }
  
    30% {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
      transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
      opacity: 1;
    }
  
    to {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
      transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
      opacity: 0;
    }
  }
  
  @keyframes flipOutX {
    from {
      -webkit-transform: perspective(400px);
      transform: perspective(400px);
    }
  
    30% {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
      transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
      opacity: 1;
    }
  
    to {
      -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
      transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
      opacity: 0;
    }
  }
  
  .flipOutX {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: flipOutX;
    animation-name: flipOutX;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
  }
  
  @-webkit-keyframes bounceInDown {
    from,
    60%,
    75%,
    90%,
    to {
      -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
  
    0% {
      opacity: 0;
      -webkit-transform: translate3d(0, -3000px, 0);
      transform: translate3d(0, -3000px, 0);
    }
  
    60% {
      opacity: 1;
      -webkit-transform: translate3d(0, 25px, 0);
      transform: translate3d(0, 25px, 0);
    }
  
    75% {
      -webkit-transform: translate3d(0, -10px, 0);
      transform: translate3d(0, -10px, 0);
    }
  
    90% {
      -webkit-transform: translate3d(0, 5px, 0);
      transform: translate3d(0, 5px, 0);
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  @keyframes bounceInDown {
    from,
    60%,
    75%,
    90%,
    to {
      -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
  
    0% {
      opacity: 0;
      -webkit-transform: translate3d(0, -3000px, 0);
      transform: translate3d(0, -3000px, 0);
    }
  
    60% {
      opacity: 1;
      -webkit-transform: translate3d(0, 25px, 0);
      transform: translate3d(0, 25px, 0);
    }
  
    75% {
      -webkit-transform: translate3d(0, -10px, 0);
      transform: translate3d(0, -10px, 0);
    }
  
    90% {
      -webkit-transform: translate3d(0, 5px, 0);
      transform: translate3d(0, 5px, 0);
    }
  
    to {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
  }
  
  .bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown;
  }
  
  @-webkit-keyframes bounceOutUp {
    20% {
      -webkit-transform: translate3d(0, -10px, 0);
      transform: translate3d(0, -10px, 0);
    }
  
    40%,
    45% {
      opacity: 1;
      -webkit-transform: translate3d(0, 20px, 0);
      transform: translate3d(0, 20px, 0);
    }
  
    to {
      opacity: 0;
      -webkit-transform: translate3d(0, -2000px, 0);
      transform: translate3d(0, -2000px, 0);
    }
  }
  
  @keyframes bounceOutUp {
    20% {
      -webkit-transform: translate3d(0, -10px, 0);
      transform: translate3d(0, -10px, 0);
    }
  
    40%,
    45% {
      opacity: 1;
      -webkit-transform: translate3d(0, 20px, 0);
      transform: translate3d(0, 20px, 0);
    }
  
    to {
      opacity: 0;
      -webkit-transform: translate3d(0, -2000px, 0);
      transform: translate3d(0, -2000px, 0);
    }
  }
  
  .bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp;
  }
  
  @-webkit-keyframes pulse-left-right {
    0% {-webkit-transform: translate(0px,0); opacity: 0; }
    50% {-webkit-transform: translate(20px,0); opacity: 1; }
    100% {-webkit-transform: translate(0px,0); opacity: 0; }
  }
  
  @-moz-keyframes pulse-left-right {
    0% {-moz-transform: translate(0px,0); opacity: 0; }
    50% {-moz-transform: translate(20px,0); opacity: 1; }
    100% {-moz-transform: translate(0px,0); opacity: 0; }
  }
  
  @keyframes pulse-left-right {
    0% {-moz-transform:translate(0px,0); -ms-transform: translate(0px,0); -webkit-transform: translate(0px,0); transform: translate(0px,0); opacity: 0; }
    50% {-moz-transform:translate(20px,0); -ms-transform: translate(20px,0); -webkit-transform: translate(20px,0); transform: translate(20px,0); opacity: 1; }
    100% {-moz-transform:translate(0px,0); -ms-transform: translate(0px,0); -webkit-transform: translate(0px,0); transform: translate(0px,0); opacity: 0; }
  }
  
  /* Buzz Out */
  @-webkit-keyframes hvr-buzz-out {
    10% {
      -webkit-transform: translateX(3px) rotate(2deg);
      transform: translateX(3px) rotate(2deg);
    }
  
    20% {
      -webkit-transform: translateX(-3px) rotate(-2deg);
      transform: translateX(-3px) rotate(-2deg);
    }
  
    30% {
      -webkit-transform: translateX(3px) rotate(2deg);
      transform: translateX(3px) rotate(2deg);
    }
  
    40% {
      -webkit-transform: translateX(-3px) rotate(-2deg);
      transform: translateX(-3px) rotate(-2deg);
    }
  
    50% {
      -webkit-transform: translateX(2px) rotate(1deg);
      transform: translateX(2px) rotate(1deg);
    }
  
    60% {
      -webkit-transform: translateX(-2px) rotate(-1deg);
      transform: translateX(-2px) rotate(-1deg);
    }
  
    70% {
      -webkit-transform: translateX(2px) rotate(1deg);
      transform: translateX(2px) rotate(1deg);
    }
  
    80% {
      -webkit-transform: translateX(-2px) rotate(-1deg);
      transform: translateX(-2px) rotate(-1deg);
    }
  
    90% {
      -webkit-transform: translateX(1px) rotate(0);
      transform: translateX(1px) rotate(0);
    }
  
    100% {
      -webkit-transform: translateX(-1px) rotate(0);
      transform: translateX(-1px) rotate(0);
    }
  }
  
  @keyframes hvr-buzz-out {
    10% {
      -webkit-transform: translateX(3px) rotate(2deg);
      transform: translateX(3px) rotate(2deg);
    }
  
    20% {
      -webkit-transform: translateX(-3px) rotate(-2deg);
      transform: translateX(-3px) rotate(-2deg);
    }
  
    30% {
      -webkit-transform: translateX(3px) rotate(2deg);
      transform: translateX(3px) rotate(2deg);
    }
  
    40% {
      -webkit-transform: translateX(-3px) rotate(-2deg);
      transform: translateX(-3px) rotate(-2deg);
    }
  
    50% {
      -webkit-transform: translateX(2px) rotate(1deg);
      transform: translateX(2px) rotate(1deg);
    }
  
    60% {
      -webkit-transform: translateX(-2px) rotate(-1deg);
      transform: translateX(-2px) rotate(-1deg);
    }
  
    70% {
      -webkit-transform: translateX(2px) rotate(1deg);
      transform: translateX(2px) rotate(1deg);
    }
  
    80% {
      -webkit-transform: translateX(-2px) rotate(-1deg);
      transform: translateX(-2px) rotate(-1deg);
    }
  
    90% {
      -webkit-transform: translateX(1px) rotate(0);
      transform: translateX(1px) rotate(0);
    }
  
    100% {
      -webkit-transform: translateX(-1px) rotate(0);
      transform: translateX(-1px) rotate(0);
    }
  }
  
  
  @-webkit-keyframes toRightFromLeft {
      49% {
          -webkit-transform: translate(30%);
      }
      50% {
          opacity: 0;
          -webkit-transform: translate(-30%);
      }
      51% {
          opacity: 1;
      }
  }
  @-moz-keyframes toRightFromLeft {
      49% {
          -moz-transform: translate(30%);
      }
      50% {
          opacity: 0;
          -moz-transform: translate(-30%);
      }
      51% {
          opacity: 1;
      }
  }
  @keyframes toRightFromLeft {
      49% {
          transform: translate(30%);
      }
      50% {
          opacity: 0;
          transform: translate(-30%);
      }
      51% {
          opacity: 1;
      }
  }
  @-webkit-keyframes toLeftFromRight {
      49% {
          -webkit-transform: translate(-30%);
      }
      50% {
          opacity: 0;
          -webkit-transform: translate(30%);
      }
      51% {
          opacity: 1;
      }
  }
  @-moz-keyframes toLeftFromRight {
      49% {
          -moz-transform: translate(-30%);
      }
      50% {
          opacity: 0;
          -moz-transform: translate(30%);
      }
      51% {
          opacity: 1;
      }
  }
  @keyframes toLeftFromRight {
      49% {
          transform: translate(-30%);
      }
      50% {
          opacity: 0;
          transform: translate(30%);
      }
      51% {
          opacity: 1;
      }
  }
  @-webkit-keyframes moveFromLeft {
      from {
          -webkit-transform: translateX(-100%);
          opacity: 0;
      }
      to {
          -webkit-transform: translateX(0%);
          opacity: 1;
      }
  }
  @-moz-keyframes moveFromLeft {
      from {
          -moz-transform: translateX(-100%);
          opacity: 0;
      }
      to {
          -moz-transform: translateX(0%);
          opacity: 1;
      }
  }
  @-ms-keyframes moveFromLeft {
      from {
          -ms-transform: translateX(-100%);
          opacity: 0;
      }
      to {
          -ms-transform: translateX(0%);
          opacity: 1;
      }
  }
  
  @keyframes shadow-pulse {
       0% {
            box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
       }
       100% {
            box-shadow: 0 0 0 20px rgba(0, 0, 0, 0);
       }
  }
  
  @keyframes shadow-pulse-white {
       0% {
            box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.7);
       }
       100% {
            box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
       }
  }