@charset "UTF-8"; 
  @-webkit-keyframes bounce {
    from, 20%, 53%, 80%, 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);
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);   }
      40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);   }
        70% {
          -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
          animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
          -webkit-transform: translate3d(0, -15px, 0);
          transform: translate3d(0, -15px, 0);   }
          90% {
            -webkit-transform: translate3d(0, -4px, 0);
            transform: translate3d(0, -4px, 0);   }
}

  @keyframes bounce {
    from, 20%, 53%, 80%, 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);
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);   }
      40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);   }
        70% {
          -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
          animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
          -webkit-transform: translate3d(0, -15px, 0);
          transform: translate3d(0, -15px, 0);   }
          90% {
            -webkit-transform: translate3d(0, -4px, 0);
            transform: translate3d(0, -4px, 0);   }
}

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

    @-webkit-keyframes flash {
      from, 50%, to {
        opacity: 1;   }
        25%, 75% {
          opacity: 0;   }
}

  @keyframes flash {
    from, 50%, to {
      opacity: 1;   }
      25%, 75% {
        opacity: 0;   }
}

  .flash {
    -webkit-animation-name: flash;
    animation-name: flash; }

    @-webkit-keyframes pulse {
      from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);   }
        50% {
          -webkit-transform: scale3d(1.05, 1.05, 1.05);
          transform: scale3d(1.05, 1.05, 1.05);   }
          to {
            -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);   }
}

  @keyframes pulse {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);   }
      50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);   }
        to {
          -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);   }
}

  .pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse; }

    @-webkit-keyframes rubberBand {
      from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);   }
        30% {
          -webkit-transform: scale3d(1.25, 0.75, 1);
          transform: scale3d(1.25, 0.75, 1);   }
          40% {
            -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);   }
            50% {
              -webkit-transform: scale3d(1.15, 0.85, 1);
              transform: scale3d(1.15, 0.85, 1);   }
              65% {
                -webkit-transform: scale3d(0.95, 1.05, 1);
                transform: scale3d(0.95, 1.05, 1);   }
                75% {
                  -webkit-transform: scale3d(1.05, 0.95, 1);
                  transform: scale3d(1.05, 0.95, 1);   }
                  to {
                    -webkit-transform: scale3d(1, 1, 1);
                    transform: scale3d(1, 1, 1);   }
}

  @keyframes rubberBand {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);   }
      30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);   }
        40% {
          -webkit-transform: scale3d(0.75, 1.25, 1);
          transform: scale3d(0.75, 1.25, 1);   }
          50% {
            -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);   }
            65% {
              -webkit-transform: scale3d(0.95, 1.05, 1);
              transform: scale3d(0.95, 1.05, 1);   }
              75% {
                -webkit-transform: scale3d(1.05, 0.95, 1);
                transform: scale3d(1.05, 0.95, 1);   }
                to {
                  -webkit-transform: scale3d(1, 1, 1);
                  transform: scale3d(1, 1, 1);   }
}

  .rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand; }

    @-webkit-keyframes shake {
      from, to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
        10%, 30%, 50%, 70%, 90% {
          -webkit-transform: translate3d(-10px, 0, 0);
          transform: translate3d(-10px, 0, 0);   }
          20%, 40%, 60%, 80% {
            -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);   }
}

  @keyframes shake {
    from, to {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);   }
      10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);   }
        20%, 40%, 60%, 80% {
          -webkit-transform: translate3d(10px, 0, 0);
          transform: translate3d(10px, 0, 0);   }
}

  .shake {
    -webkit-animation-name: shake;
    animation-name: shake; }

    @-webkit-keyframes headShake {
      0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);   }
        6.5% {
          -webkit-transform: translateX(-6px) rotateY(-9deg);
          transform: translateX(-6px) rotateY(-9deg);   }
          18.5% {
            -webkit-transform: translateX(5px) rotateY(7deg);
            transform: translateX(5px) rotateY(7deg);   }
            31.5% {
              -webkit-transform: translateX(-3px) rotateY(-5deg);
              transform: translateX(-3px) rotateY(-5deg);   }
              43.5% {
                -webkit-transform: translateX(2px) rotateY(3deg);
                transform: translateX(2px) rotateY(3deg);   }
                50% {
                  -webkit-transform: translateX(0);
                  transform: translateX(0);   }
}

  @keyframes headShake {
    0% {
      -webkit-transform: translateX(0);
      transform: translateX(0);   }
      6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg);   }
        18.5% {
          -webkit-transform: translateX(5px) rotateY(7deg);
          transform: translateX(5px) rotateY(7deg);   }
          31.5% {
            -webkit-transform: translateX(-3px) rotateY(-5deg);
            transform: translateX(-3px) rotateY(-5deg);   }
            43.5% {
              -webkit-transform: translateX(2px) rotateY(3deg);
              transform: translateX(2px) rotateY(3deg);   }
              50% {
                -webkit-transform: translateX(0);
                transform: translateX(0);   }
}

  .headShake {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-name: headShake;
    animation-name: headShake; }

    @-webkit-keyframes swing {
      20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg);   }
        40% {
          -webkit-transform: rotate3d(0, 0, 1, -10deg);
          transform: rotate3d(0, 0, 1, -10deg);   }
          60% {
            -webkit-transform: rotate3d(0, 0, 1, 5deg);
            transform: rotate3d(0, 0, 1, 5deg);   }
            80% {
              -webkit-transform: rotate3d(0, 0, 1, -5deg);
              transform: rotate3d(0, 0, 1, -5deg);   }
              to {
                -webkit-transform: rotate3d(0, 0, 1, 0deg);
                transform: rotate3d(0, 0, 1, 0deg);   }
}

  @keyframes swing {
    20% {
      -webkit-transform: rotate3d(0, 0, 1, 15deg);
      transform: rotate3d(0, 0, 1, 15deg);   }
      40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg);   }
        60% {
          -webkit-transform: rotate3d(0, 0, 1, 5deg);
          transform: rotate3d(0, 0, 1, 5deg);   }
          80% {
            -webkit-transform: rotate3d(0, 0, 1, -5deg);
            transform: rotate3d(0, 0, 1, -5deg);   }
            to {
              -webkit-transform: rotate3d(0, 0, 1, 0deg);
              transform: rotate3d(0, 0, 1, 0deg);   }
}

  .swing {
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing; }

    @-webkit-keyframes tada {
      from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);   }
        10%, 20% {
          -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
          transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);   }
          30%, 50%, 70%, 90% {
            -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);   }
            40%, 60%, 80% {
              -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
              transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);   }
              to {
                -webkit-transform: scale3d(1, 1, 1);
                transform: scale3d(1, 1, 1);   }
}

  @keyframes tada {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);   }
      10%, 20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);   }
        30%, 50%, 70%, 90% {
          -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
          transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);   }
          40%, 60%, 80% {
            -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);   }
            to {
              -webkit-transform: scale3d(1, 1, 1);
              transform: scale3d(1, 1, 1);   }
}

  .tada {
    -webkit-animation-name: tada;
    animation-name: tada; }

    @-webkit-keyframes wobble {
      from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
        15% {
          -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
          transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);   }
          30% {
            -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
            transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);   }
            45% {
              -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
              transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);   }
              60% {
                -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
                transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);   }
                75% {
                  -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
                  transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);   }
                  to {
                    -webkit-transform: translate3d(0, 0, 0);
                    transform: translate3d(0, 0, 0);   }
}

  @keyframes wobble {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);   }
      15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);   }
        30% {
          -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
          transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);   }
          45% {
            -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
            transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);   }
            60% {
              -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
              transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);   }
              75% {
                -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
                transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);   }
                to {
                  -webkit-transform: translate3d(0, 0, 0);
                  transform: translate3d(0, 0, 0);   }
}

  .wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble; }

    @-webkit-keyframes jello {
      from, 11.1%, to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
        22.2% {
          -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
          transform: skewX(-12.5deg) skewY(-12.5deg);   }
          33.3% {
            -webkit-transform: skewX(6.25deg) skewY(6.25deg);
            transform: skewX(6.25deg) skewY(6.25deg);   }
            44.4% {
              -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
              transform: skewX(-3.125deg) skewY(-3.125deg);   }
              55.5% {
                -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
                transform: skewX(1.5625deg) skewY(1.5625deg);   }
                66.6% {
                  -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
                  transform: skewX(-0.78125deg) skewY(-0.78125deg);   }
                  77.7% {
                    -webkit-transform: skewX(0.39062deg) skewY(0.39062deg);
                    transform: skewX(0.39062deg) skewY(0.39062deg);   }
                    88.8% {
                      -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
                      transform: skewX(-0.19531deg) skewY(-0.19531deg);   }
}

  @keyframes jello {
    from, 11.1%, to {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);   }
      22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg);   }
        33.3% {
          -webkit-transform: skewX(6.25deg) skewY(6.25deg);
          transform: skewX(6.25deg) skewY(6.25deg);   }
          44.4% {
            -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
            transform: skewX(-3.125deg) skewY(-3.125deg);   }
            55.5% {
              -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
              transform: skewX(1.5625deg) skewY(1.5625deg);   }
              66.6% {
                -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
                transform: skewX(-0.78125deg) skewY(-0.78125deg);   }
                77.7% {
                  -webkit-transform: skewX(0.39062deg) skewY(0.39062deg);
                  transform: skewX(0.39062deg) skewY(0.39062deg);   }
                  88.8% {
                    -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
                    transform: skewX(-0.19531deg) skewY(-0.19531deg);   }
}

  .jello {
    -webkit-animation-name: jello;
    animation-name: jello;
    -webkit-transform-origin: center;
    transform-origin: center; }

    @-webkit-keyframes heartBeat {
      0% {
        -webkit-transform: scale(1);
        transform: scale(1);   }
        14% {
          -webkit-transform: scale(1.3);
          transform: scale(1.3);   }
          28% {
            -webkit-transform: scale(1);
            transform: scale(1);   }
            42% {
              -webkit-transform: scale(1.3);
              transform: scale(1.3);   }
              70% {
                -webkit-transform: scale(1);
                transform: scale(1);   }
}

  @keyframes heartBeat {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1);   }
      14% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3);   }
        28% {
          -webkit-transform: scale(1);
          transform: scale(1);   }
          42% {
            -webkit-transform: scale(1.3);
            transform: scale(1.3);   }
            70% {
              -webkit-transform: scale(1);
              transform: scale(1);   }
}

  .heartBeat {
    -webkit-animation-name: heartBeat;
    animation-name: heartBeat;
    -webkit-animation-duration: 1.3s;
    animation-duration: 1.3s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out; }

    @-webkit-keyframes bounceIn {
      from, 20%, 40%, 60%, 80%, 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: scale3d(0.3, 0.3, 0.3);
          transform: scale3d(0.3, 0.3, 0.3);   }
          20% {
            -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);   }
            40% {
              -webkit-transform: scale3d(0.9, 0.9, 0.9);
              transform: scale3d(0.9, 0.9, 0.9);   }
              60% {
                opacity: 1;
                -webkit-transform: scale3d(1.03, 1.03, 1.03);
                transform: scale3d(1.03, 1.03, 1.03);   }
                80% {
                  -webkit-transform: scale3d(0.97, 0.97, 0.97);
                  transform: scale3d(0.97, 0.97, 0.97);   }
                  to {
                    opacity: 1;
                    -webkit-transform: scale3d(1, 1, 1);
                    transform: scale3d(1, 1, 1);   }
}

  @keyframes bounceIn {
    from, 20%, 40%, 60%, 80%, 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: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);   }
        20% {
          -webkit-transform: scale3d(1.1, 1.1, 1.1);
          transform: scale3d(1.1, 1.1, 1.1);   }
          40% {
            -webkit-transform: scale3d(0.9, 0.9, 0.9);
            transform: scale3d(0.9, 0.9, 0.9);   }
            60% {
              opacity: 1;
              -webkit-transform: scale3d(1.03, 1.03, 1.03);
              transform: scale3d(1.03, 1.03, 1.03);   }
              80% {
                -webkit-transform: scale3d(0.97, 0.97, 0.97);
                transform: scale3d(0.97, 0.97, 0.97);   }
                to {
                  opacity: 1;
                  -webkit-transform: scale3d(1, 1, 1);
                  transform: scale3d(1, 1, 1);   }
}

  .bounceIn {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn; }

    @-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 bounceInLeft {
      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(-3000px, 0, 0);
          transform: translate3d(-3000px, 0, 0);   }
          60% {
            opacity: 1;
            -webkit-transform: translate3d(25px, 0, 0);
            transform: translate3d(25px, 0, 0);   }
            75% {
              -webkit-transform: translate3d(-10px, 0, 0);
              transform: translate3d(-10px, 0, 0);   }
              90% {
                -webkit-transform: translate3d(5px, 0, 0);
                transform: translate3d(5px, 0, 0);   }
                to {
                  -webkit-transform: translate3d(0, 0, 0);
                  transform: translate3d(0, 0, 0);   }
}

  @keyframes bounceInLeft {
    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(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0);   }
        60% {
          opacity: 1;
          -webkit-transform: translate3d(25px, 0, 0);
          transform: translate3d(25px, 0, 0);   }
          75% {
            -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);   }
            90% {
              -webkit-transform: translate3d(5px, 0, 0);
              transform: translate3d(5px, 0, 0);   }
              to {
                -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);   }
}

  .bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft; }

    @-webkit-keyframes bounceInRight {
      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);   }
        from {
          opacity: 0;
          -webkit-transform: translate3d(3000px, 0, 0);
          transform: translate3d(3000px, 0, 0);   }
          60% {
            opacity: 1;
            -webkit-transform: translate3d(-25px, 0, 0);
            transform: translate3d(-25px, 0, 0);   }
            75% {
              -webkit-transform: translate3d(10px, 0, 0);
              transform: translate3d(10px, 0, 0);   }
              90% {
                -webkit-transform: translate3d(-5px, 0, 0);
                transform: translate3d(-5px, 0, 0);   }
                to {
                  -webkit-transform: translate3d(0, 0, 0);
                  transform: translate3d(0, 0, 0);   }
}

  @keyframes bounceInRight {
    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);   }
      from {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0);   }
        60% {
          opacity: 1;
          -webkit-transform: translate3d(-25px, 0, 0);
          transform: translate3d(-25px, 0, 0);   }
          75% {
            -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);   }
            90% {
              -webkit-transform: translate3d(-5px, 0, 0);
              transform: translate3d(-5px, 0, 0);   }
              to {
                -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);   }
}

  .bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight; }

    @-webkit-keyframes bounceInUp {
      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);   }
        from {
          opacity: 0;
          -webkit-transform: translate3d(0, 3000px, 0);
          transform: translate3d(0, 3000px, 0);   }
          60% {
            opacity: 1;
            -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 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 bounceInUp {
    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);   }
      from {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0);   }
        60% {
          opacity: 1;
          -webkit-transform: translate3d(0, -20px, 0);
          transform: translate3d(0, -20px, 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);   }
}

  .bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp; }

    @-webkit-keyframes bounceOut {
      20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);   }
        50%, 55% {
          opacity: 1;
          -webkit-transform: scale3d(1.1, 1.1, 1.1);
          transform: scale3d(1.1, 1.1, 1.1);   }
          to {
            opacity: 0;
            -webkit-transform: scale3d(0.3, 0.3, 0.3);
            transform: scale3d(0.3, 0.3, 0.3);   }
}

  @keyframes bounceOut {
    20% {
      -webkit-transform: scale3d(0.9, 0.9, 0.9);
      transform: scale3d(0.9, 0.9, 0.9);   }
      50%, 55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);   }
        to {
          opacity: 0;
          -webkit-transform: scale3d(0.3, 0.3, 0.3);
          transform: scale3d(0.3, 0.3, 0.3);   }
}

  .bounceOut {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut; }

    @-webkit-keyframes bounceOutDown {
      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 bounceOutDown {
    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);   }
}

  .bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown; }

    @-webkit-keyframes bounceOutLeft {
      20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(-2000px, 0, 0);
          transform: translate3d(-2000px, 0, 0);   }
}

  @keyframes bounceOutLeft {
    20% {
      opacity: 1;
      -webkit-transform: translate3d(20px, 0, 0);
      transform: translate3d(20px, 0, 0);   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);   }
}

  .bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft; }

    @-webkit-keyframes bounceOutRight {
      20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0);   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(2000px, 0, 0);
          transform: translate3d(2000px, 0, 0);   }
}

  @keyframes bounceOutRight {
    20% {
      opacity: 1;
      -webkit-transform: translate3d(-20px, 0, 0);
      transform: translate3d(-20px, 0, 0);   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);   }
}

  .bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight; }

    @-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 fadeIn {
      from {
        opacity: 0;   }
        to {
          opacity: 1;   }
}

  @keyframes fadeIn {
    from {
      opacity: 0;   }
      to {
        opacity: 1;   }
}

  .fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn; }

    @-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 fadeInDownBig {
      from {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);   }
        to {
          opacity: 1;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);   }
}

  @keyframes fadeInDownBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -2000px, 0);
      transform: translate3d(0, -2000px, 0);   }
      to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
}

  .fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig; }

    @-webkit-keyframes fadeInLeft {
      from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);   }
        to {
          opacity: 1;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);   }
}

  @keyframes fadeInLeft {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);   }
      to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
}

  .fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft; }

    @-webkit-keyframes fadeInLeftBig {
      from {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);   }
        to {
          opacity: 1;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);   }
}

  @keyframes fadeInLeftBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-2000px, 0, 0);
      transform: translate3d(-2000px, 0, 0);   }
      to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
}

  .fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig; }

    @-webkit-keyframes fadeInRight {
      from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);   }
        to {
          opacity: 1;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);   }
}

  @keyframes fadeInRight {
    from {
      opacity: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);   }
      to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
}

  .fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight; }

    @-webkit-keyframes fadeInRightBig {
      from {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);   }
        to {
          opacity: 1;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);   }
}

  @keyframes fadeInRightBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(2000px, 0, 0);
      transform: translate3d(2000px, 0, 0);   }
      to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
}

  .fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig; }

    @-webkit-keyframes fadeInUp {
      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 fadeInUp {
    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);   }
}

  .fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp; }

    @-webkit-keyframes fadeInUpBig {
      from {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);   }
        to {
          opacity: 1;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);   }
}

  @keyframes fadeInUpBig {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, 2000px, 0);
      transform: translate3d(0, 2000px, 0);   }
      to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
}

  .fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig; }

    @-webkit-keyframes fadeOut {
      from {
        opacity: 1;   }
        to {
          opacity: 0;   }
}

  @keyframes fadeOut {
    from {
      opacity: 1;   }
      to {
        opacity: 0;   }
}

  .fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut; }

    @-webkit-keyframes fadeOutDown {
      from {
        opacity: 1;   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(0, 100%, 0);
          transform: translate3d(0, 100%, 0);   }
}

  @keyframes fadeOutDown {
    from {
      opacity: 1;   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);   }
}

  .fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown; }

    @-webkit-keyframes fadeOutDownBig {
      from {
        opacity: 1;   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(0, 2000px, 0);
          transform: translate3d(0, 2000px, 0);   }
}

  @keyframes fadeOutDownBig {
    from {
      opacity: 1;   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);   }
}

  .fadeOutDownBig {
    -webkit-animation-name: fadeOutDownBig;
    animation-name: fadeOutDownBig; }

    @-webkit-keyframes fadeOutLeft {
      from {
        opacity: 1;   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(-100%, 0, 0);
          transform: translate3d(-100%, 0, 0);   }
}

  @keyframes fadeOutLeft {
    from {
      opacity: 1;   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);   }
}

  .fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft; }

    @-webkit-keyframes fadeOutLeftBig {
      from {
        opacity: 1;   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(-2000px, 0, 0);
          transform: translate3d(-2000px, 0, 0);   }
}

  @keyframes fadeOutLeftBig {
    from {
      opacity: 1;   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);   }
}

  .fadeOutLeftBig {
    -webkit-animation-name: fadeOutLeftBig;
    animation-name: fadeOutLeftBig; }

    @-webkit-keyframes fadeOutRight {
      from {
        opacity: 1;   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(100%, 0, 0);
          transform: translate3d(100%, 0, 0);   }
}

  @keyframes fadeOutRight {
    from {
      opacity: 1;   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);   }
}

  .fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight; }

    @-webkit-keyframes fadeOutRightBig {
      from {
        opacity: 1;   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(2000px, 0, 0);
          transform: translate3d(2000px, 0, 0);   }
}

  @keyframes fadeOutRightBig {
    from {
      opacity: 1;   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);   }
}

  .fadeOutRightBig {
    -webkit-animation-name: fadeOutRightBig;
    animation-name: fadeOutRightBig; }

    @-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 fadeOutUpBig {
      from {
        opacity: 1;   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(0, -2000px, 0);
          transform: translate3d(0, -2000px, 0);   }
}

  @keyframes fadeOutUpBig {
    from {
      opacity: 1;   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);   }
}

  .fadeOutUpBig {
    -webkit-animation-name: fadeOutUpBig;
    animation-name: fadeOutUpBig; }

    @-webkit-keyframes flip {
      from {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1,
                0, -360deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1,
                0, -360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;   }
        40% {
          -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0,
                    1, 0, -190deg);
          transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0,
                    1, 0, -190deg);
          -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;   }
          50% {
            -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0,
                        1, 0, -170deg);
            transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0,
                        1, 0, -170deg);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;   }
            80% {
              -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0,
                            1, 0, 0deg);
              transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0,
                            1, 0, 0deg);
              -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;   }
              to {
                -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1,
                                0, 0deg);
                transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1,
                                0, 0deg);
                -webkit-animation-timing-function: ease-in;
                animation-timing-function: ease-in;   }
}

  @keyframes flip {
    from {
      -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1,
            0, -360deg);
      transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1,
            0, -360deg);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out;   }
      40% {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0,
                1, 0, -190deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0,
                1, 0, -190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;   }
        50% {
          -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0,
                    1, 0, -170deg);
          transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0,
                    1, 0, -170deg);
          -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;   }
          80% {
            -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0,
                        1, 0, 0deg);
            transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0,
                        1, 0, 0deg);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;   }
            to {
              -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1,
                            0, 0deg);
              transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1,
                            0, 0deg);
              -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;   }
}

  .animated.flip {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-animation-name: flip;
    animation-name: flip; }

    @-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 flipInY {
      from {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;   }
        40% {
          -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
          transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
          -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;   }
          60% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            opacity: 1;   }
            80% {
              -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
              transform: perspective(400px) rotate3d(0, 1, 0, -5deg);   }
              to {
                -webkit-transform: perspective(400px);
                transform: perspective(400px);   }
}

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

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

    @-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 flipOutY {
      from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);   }
        30% {
          -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
          transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
          opacity: 1;   }
          to {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            opacity: 0;   }
}

  @keyframes flipOutY {
    from {
      -webkit-transform: perspective(400px);
      transform: perspective(400px);   }
      30% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1;   }
        to {
          -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
          transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
          opacity: 0;   }
}

  .flipOutY {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipOutY;
    animation-name: flipOutY; }

    @-webkit-keyframes lightSpeedIn {
      from {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;   }
        60% {
          -webkit-transform: skewX(20deg);
          transform: skewX(20deg);
          opacity: 1;   }
          80% {
            -webkit-transform: skewX(-5deg);
            transform: skewX(-5deg);   }
            to {
              -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);   }
}

  @keyframes lightSpeedIn {
    from {
      -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
      transform: translate3d(100%, 0, 0) skewX(-30deg);
      opacity: 0;   }
      60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1;   }
        80% {
          -webkit-transform: skewX(-5deg);
          transform: skewX(-5deg);   }
          to {
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);   }
}

  .lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out; }

    @-webkit-keyframes lightSpeedOut {
      from {
        opacity: 1;   }
        to {
          -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
          transform: translate3d(100%, 0, 0) skewX(30deg);
          opacity: 0;   }
}

  @keyframes lightSpeedOut {
    from {
      opacity: 1;   }
      to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0;   }
}

  .lightSpeedOut {
    -webkit-animation-name: lightSpeedOut;
    animation-name: lightSpeedOut;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }

    @-webkit-keyframes rotateIn {
      from {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, -200deg);
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0;   }
        to {
          -webkit-transform-origin: center;
          transform-origin: center;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
          opacity: 1;   }
}

  @keyframes rotateIn {
    from {
      -webkit-transform-origin: center;
      transform-origin: center;
      -webkit-transform: rotate3d(0, 0, 1, -200deg);
      transform: rotate3d(0, 0, 1, -200deg);
      opacity: 0;   }
      to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;   }
}

  .rotateIn {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn; }

    @-webkit-keyframes rotateInDownLeft {
      from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;   }
        to {
          -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
          opacity: 1;   }
}

  @keyframes rotateInDownLeft {
    from {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate3d(0, 0, 1, -45deg);
      transform: rotate3d(0, 0, 1, -45deg);
      opacity: 0;   }
      to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;   }
}

  .rotateInDownLeft {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft; }

    @-webkit-keyframes rotateInDownRight {
      from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;   }
        to {
          -webkit-transform-origin: right bottom;
          transform-origin: right bottom;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
          opacity: 1;   }
}

  @keyframes rotateInDownRight {
    from {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate3d(0, 0, 1, 45deg);
      transform: rotate3d(0, 0, 1, 45deg);
      opacity: 0;   }
      to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;   }
}

  .rotateInDownRight {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight; }

    @-webkit-keyframes rotateInUpLeft {
      from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;   }
        to {
          -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
          opacity: 1;   }
}

  @keyframes rotateInUpLeft {
    from {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate3d(0, 0, 1, 45deg);
      transform: rotate3d(0, 0, 1, 45deg);
      opacity: 0;   }
      to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;   }
}

  .rotateInUpLeft {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft; }

    @-webkit-keyframes rotateInUpRight {
      from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -90deg);
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0;   }
        to {
          -webkit-transform-origin: right bottom;
          transform-origin: right bottom;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
          opacity: 1;   }
}

  @keyframes rotateInUpRight {
    from {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate3d(0, 0, 1, -90deg);
      transform: rotate3d(0, 0, 1, -90deg);
      opacity: 0;   }
      to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;   }
}

  .rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight; }

    @-webkit-keyframes rotateOut {
      from {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1;   }
        to {
          -webkit-transform-origin: center;
          transform-origin: center;
          -webkit-transform: rotate3d(0, 0, 1, 200deg);
          transform: rotate3d(0, 0, 1, 200deg);
          opacity: 0;   }
}

  @keyframes rotateOut {
    from {
      -webkit-transform-origin: center;
      transform-origin: center;
      opacity: 1;   }
      to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, 200deg);
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0;   }
}

  .rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut; }

    @-webkit-keyframes rotateOutDownLeft {
      from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;   }
        to {
          -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          -webkit-transform: rotate3d(0, 0, 1, 45deg);
          transform: rotate3d(0, 0, 1, 45deg);
          opacity: 0;   }
}

  @keyframes rotateOutDownLeft {
    from {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      opacity: 1;   }
      to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;   }
}

  .rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft; }

    @-webkit-keyframes rotateOutDownRight {
      from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;   }
        to {
          -webkit-transform-origin: right bottom;
          transform-origin: right bottom;
          -webkit-transform: rotate3d(0, 0, 1, -45deg);
          transform: rotate3d(0, 0, 1, -45deg);
          opacity: 0;   }
}

  @keyframes rotateOutDownRight {
    from {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      opacity: 1;   }
      to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;   }
}

  .rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight; }

    @-webkit-keyframes rotateOutUpLeft {
      from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;   }
        to {
          -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          -webkit-transform: rotate3d(0, 0, 1, -45deg);
          transform: rotate3d(0, 0, 1, -45deg);
          opacity: 0;   }
}

  @keyframes rotateOutUpLeft {
    from {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      opacity: 1;   }
      to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;   }
}

  .rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft; }

    @-webkit-keyframes rotateOutUpRight {
      from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;   }
        to {
          -webkit-transform-origin: right bottom;
          transform-origin: right bottom;
          -webkit-transform: rotate3d(0, 0, 1, 90deg);
          transform: rotate3d(0, 0, 1, 90deg);
          opacity: 0;   }
}

  @keyframes rotateOutUpRight {
    from {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      opacity: 1;   }
      to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 90deg);
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0;   }
}

  .rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight; }

    @-webkit-keyframes hinge {
      0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;   }
        20%, 60% {
          -webkit-transform: rotate3d(0, 0, 1, 80deg);
          transform: rotate3d(0, 0, 1, 80deg);
          -webkit-transform-origin: top left;
          transform-origin: top left;
          -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;   }
          40%, 80% {
            -webkit-transform: rotate3d(0, 0, 1, 60deg);
            transform: rotate3d(0, 0, 1, 60deg);
            -webkit-transform-origin: top left;
            transform-origin: top left;
            -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
            opacity: 1;   }
            to {
              -webkit-transform: translate3d(0, 700px, 0);
              transform: translate3d(0, 700px, 0);
              opacity: 0;   }
}

  @keyframes hinge {
    0% {
      -webkit-transform-origin: top left;
      transform-origin: top left;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out;   }
      20%, 60% {
        -webkit-transform: rotate3d(0, 0, 1, 80deg);
        transform: rotate3d(0, 0, 1, 80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;   }
        40%, 80% {
          -webkit-transform: rotate3d(0, 0, 1, 60deg);
          transform: rotate3d(0, 0, 1, 60deg);
          -webkit-transform-origin: top left;
          transform-origin: top left;
          -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
          opacity: 1;   }
          to {
            -webkit-transform: translate3d(0, 700px, 0);
            transform: translate3d(0, 700px, 0);
            opacity: 0;   }
}

  .hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-name: hinge;
    animation-name: hinge; }

    @-webkit-keyframes jackInTheBox {
      from {
        opacity: 0;
        -webkit-transform: scale(0.1) rotate(30deg);
        transform: scale(0.1) rotate(30deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;   }
        50% {
          -webkit-transform: rotate(-10deg);
          transform: rotate(-10deg);   }
          70% {
            -webkit-transform: rotate(3deg);
            transform: rotate(3deg);   }
            to {
              opacity: 1;
              -webkit-transform: scale(1);
              transform: scale(1);   }
}

  @keyframes jackInTheBox {
    from {
      opacity: 0;
      -webkit-transform: scale(0.1) rotate(30deg);
      transform: scale(0.1) rotate(30deg);
      -webkit-transform-origin: center bottom;
      transform-origin: center bottom;   }
      50% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);   }
        70% {
          -webkit-transform: rotate(3deg);
          transform: rotate(3deg);   }
          to {
            opacity: 1;
            -webkit-transform: scale(1);
            transform: scale(1);   }
}

  .jackInTheBox {
    -webkit-animation-name: jackInTheBox;
    animation-name: jackInTheBox; }

    @-webkit-keyframes rollIn {
      from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);   }
        to {
          opacity: 1;
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);   }
}

  @keyframes rollIn {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
      transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);   }
      to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
}

  .rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn; }

    @-webkit-keyframes rollOut {
      from {
        opacity: 1;   }
        to {
          opacity: 0;
          -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
          transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);   }
}

  @keyframes rollOut {
    from {
      opacity: 1;   }
      to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);   }
}

  .rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut; }

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

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

  .zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn; }

    @-webkit-keyframes zoomInDown {
      from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
        60% {
          opacity: 1;
          -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
          transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
          -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
          animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  @keyframes zoomInDown {
    from {
      opacity: 0;
      -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
      -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
      60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  .zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown; }

    @-webkit-keyframes zoomInLeft {
      from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
        60% {
          opacity: 1;
          -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
          transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
          -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
          animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  @keyframes zoomInLeft {
    from {
      opacity: 0;
      -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
      transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
      -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
      60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  .zoomInLeft {
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft; }

    @-webkit-keyframes zoomInRight {
      from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
        60% {
          opacity: 1;
          -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
          transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
          -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
          animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  @keyframes zoomInRight {
    from {
      opacity: 0;
      -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
      transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
      -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
      60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  .zoomInRight {
    -webkit-animation-name: zoomInRight;
    animation-name: zoomInRight; }

    @-webkit-keyframes zoomInUp {
      from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
        60% {
          opacity: 1;
          -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
          transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
          -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
          animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  @keyframes zoomInUp {
    from {
      opacity: 0;
      -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
      -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
      60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  .zoomInUp {
    -webkit-animation-name: zoomInUp;
    animation-name: zoomInUp; }

    @-webkit-keyframes zoomOut {
      from {
        opacity: 1;   }
        50% {
          opacity: 0;
          -webkit-transform: scale3d(0.3, 0.3, 0.3);
          transform: scale3d(0.3, 0.3, 0.3);   }
          to {
            opacity: 0;   }
}

  @keyframes zoomOut {
    from {
      opacity: 1;   }
      50% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);   }
        to {
          opacity: 0;   }
}

  .zoomOut {
    -webkit-animation-name: zoomOut;
    animation-name: zoomOut; }

    @-webkit-keyframes zoomOutDown {
      40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
        to {
          opacity: 0;
          -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
          transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
          -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
          -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
          animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  @keyframes zoomOutDown {
    40% {
      opacity: 1;
      -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
      -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
      to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  .zoomOutDown {
    -webkit-animation-name: zoomOutDown;
    animation-name: zoomOutDown; }

    @-webkit-keyframes zoomOutLeft {
      40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);   }
        to {
          opacity: 0;
          -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
          transform: scale(0.1) translate3d(-2000px, 0, 0);
          -webkit-transform-origin: left center;
          transform-origin: left center;   }
}

  @keyframes zoomOutLeft {
    40% {
      opacity: 1;
      -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
      transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);   }
      to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
        transform: scale(0.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center;   }
}

  .zoomOutLeft {
    -webkit-animation-name: zoomOutLeft;
    animation-name: zoomOutLeft; }

    @-webkit-keyframes zoomOutRight {
      40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);   }
        to {
          opacity: 0;
          -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
          transform: scale(0.1) translate3d(2000px, 0, 0);
          -webkit-transform-origin: right center;
          transform-origin: right center;   }
}

  @keyframes zoomOutRight {
    40% {
      opacity: 1;
      -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
      transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);   }
      to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
        transform: scale(0.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center;   }
}

  .zoomOutRight {
    -webkit-animation-name: zoomOutRight;
    animation-name: zoomOutRight; }

    @-webkit-keyframes zoomOutUp {
      40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
        to {
          opacity: 0;
          -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
          transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
          -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
          -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
          animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  @keyframes zoomOutUp {
    40% {
      opacity: 1;
      -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
      transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
      -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);   }
      to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);   }
}

  .zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp; }

    @-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 slideInLeft {
      from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;   }
        to {
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);   }
}

  @keyframes slideInLeft {
    from {
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
      visibility: visible;   }
      to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
}

  .slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft; }

    @-webkit-keyframes slideInRight {
      from {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible;   }
        to {
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);   }
}

  @keyframes slideInRight {
    from {
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
      visibility: visible;   }
      to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
}

  .slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight; }

    @-webkit-keyframes slideInUp {
      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 slideInUp {
    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);   }
}

  .slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp; }

    @-webkit-keyframes slideOutDown {
      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 slideOutDown {
    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);   }
}

  .slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown; }

    @-webkit-keyframes slideOutLeft {
      from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
        to {
          visibility: hidden;
          -webkit-transform: translate3d(-100%, 0, 0);
          transform: translate3d(-100%, 0, 0);   }
}

  @keyframes slideOutLeft {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);   }
      to {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);   }
}

  .slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft; }

    @-webkit-keyframes slideOutRight {
      from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);   }
        to {
          visibility: hidden;
          -webkit-transform: translate3d(100%, 0, 0);
          transform: translate3d(100%, 0, 0);   }
}

  @keyframes slideOutRight {
    from {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);   }
      to {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);   }
}

  .slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight; }

    @-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; }

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

      .animated.infinite {
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite; }

        .animated.delay-1s {
          -webkit-animation-delay: 1s;
          animation-delay: 1s; }

          .animated.delay-2s {
            -webkit-animation-delay: 2s;
            animation-delay: 2s; }

            .animated.delay-3s {
              -webkit-animation-delay: 3s;
              animation-delay: 3s; }

              .animated.delay-4s {
                -webkit-animation-delay: 4s;
                animation-delay: 4s; }

                .animated.delay-5s {
                  -webkit-animation-delay: 5s;
                  animation-delay: 5s; }

                  .animated.delay-100ms {
                    -webkit-animation-delay: 0.1s;
                    animation-delay: 0.1s; }

                    .animated.delay-200ms {
                      -webkit-animation-delay: 0.2s;
                      animation-delay: 0.2s; }

                      .animated.delay-300ms {
                        -webkit-animation-delay: 0.3s;
                        animation-delay: 0.3s; }

                        .animated.delay-400ms {
                          -webkit-animation-delay: 0.4s;
                          animation-delay: 0.4s; }

                          .animated.delay-500ms {
                            -webkit-animation-delay: 0.5s;
                            animation-delay: 0.5s; }

                            .animated.fast {
                              -webkit-animation-duration: 800ms;
                              animation-duration: 800ms; }

                              .animated.faster {
                                -webkit-animation-duration: 500ms;
                                animation-duration: 500ms; }

                                .animated.slow {
                                  -webkit-animation-duration: 2s;
                                  animation-duration: 2s; }

                                  .animated.slower {
                                    -webkit-animation-duration: 3s;
                                    animation-duration: 3s; }

                                    @media (print), (prefers-reduced-motion: reduce) {
                                      .animated {
                                        -webkit-animation-duration: 1ms !important;
                                        animation-duration: 1ms !important;
                                        -webkit-transition-duration: 1ms !important;
                                        transition-duration: 1ms !important;
                                        -webkit-animation-iteration-count: 1 !important;
                                        animation-iteration-count: 1 !important;   }
}

  @-webkit-keyframes filter-hue-rotate {
    0% {
      -webkit-filter: hue-rotate(0deg);   }
      50% {
        -webkit-filter: hue-rotate(100deg);   }
        100% {
          -webkit-filter: hue-rotate(0deg);   }
}

  @keyframes filter-hue-rotate {
    0% {
      filter: hue-rotate(0deg);   }
      50% {
        filter: hue-rotate(100deg);   }
        100% {
          filter: hue-rotate(0deg);   }
}

  .filterHueRotate {
    -webkit-animation-name: filter-hue-rotate;
    animation-name: filter-hue-rotate; }

html {
  background-color: #F7EB5B;
  position: relative;
  top: 0;
  bottom: 0; }

  html, body {
    width: 100%;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important; }

    body {
      position: relative;
      overflow: hidden;
      touch-action: none;
      top: 0;
      bottom: 0; }

      input:focus {
        outline-offset: 0; }

        body:fullscreen {
          background-color: #F7EB5B; }

          body:-webkit-full-screen {
            background-color: #F7EB5B; }

            body:-moz-full-screen {
              background-color: #F7EB5B; }

              .dark-color {
                color: #384649; }

                .middle-color {
                  color: #759aab; }

                  .light-color {
                    color: #F7EB5B; }

                    .pink-color {
                      color: #FBD0C9; }

                      .red-color {
                        color: #ED1B2D; }

                        .green-color {
                          color: #26de81; }

                          .orange-color {
                            color: #fd9644; }

                            .other-yellow-color {
                              color: #fed330; }

                              canvas {
                                width: 100vw;
                                height: 100vh;
                                position: absolute;
                                top: 0;
                                left: 0;
                                z-index: 2; }

                                #canvas {
                                  z-index: 2; }

                                  h1 {
                                    position: absolute;
                                    font-size: 72px;
                                    left: 10px;
                                    bottom: -5px;
                                    color: white;
                                    text-decoration: underline;
                                    z-index: 3;
                                    margin-left: 15px; }

                                    audio {
                                      display: none; }

                                      .center-in-body {
                                        position: absolute;
                                        z-index: 1;
                                        left: 50%;
                                        top: 50%;
                                        -webkit-transform: translate(-50%, -50%);
                                        transform: translate(-50%, -50%); }

                                        .hidden {
                                          display: none !important; }

                                          .noselect, .no-select {
                                            -webkit-touch-callout: none;
                                            -webkit-user-select: none;
                                            -khtml-user-select: none;
                                            -moz-user-select: none;
                                            -ms-user-select: none;
                                            user-select: none;
                                            pointer-events: none;
                                            outline: none; }

                                            .footer-icon {
                                              min-width: 100px;
                                              display: flex;
                                              justify-content: center; }

                                              .stage {
                                                position: absolute;
                                                width: 100%;
                                                height: 100%; }

                                                .modal-panel {
                                                  background: #384649;
                                                  position: absolute;
                                                  width: 80vw;
                                                  min-height: 50vh;
                                                  max-height: 65vh;
                                                  left: 50%;
                                                  z-index: 1000;
                                                  padding: 15px;
                                                  max-width: 500px;
                                                  border-radius: 12px 0px 12px 12px;
                                                  font-family: VAG Round;
                                                  color: #F7EB5B; }
                                                  .modal-panel .modal-title {
                                                    background-color: #384649;
                                                    position: absolute;
                                                    width: 90%;
                                                    display: flex;
                                                    flex-direction: row;
                                                    justify-content: center;
                                                    font-family: VAG Round;
                                                    min-height: 5vh;
                                                    border-bottom-style: dotted; }
                                                    .modal-panel .modal-button-container {
                                                      display: flex;
                                                      flex-direction: column;
                                                      width: 100%;
                                                      justify-content: center;
                                                      align-items: center;
                                                      margin-bottom: 15px;
                                                      button: hover;
                                                      button-background: rgba(0, 0, 0, 0.5); }
                                                      .modal-panel .modal-button-container button {
                                                        position: relative;
                                                        cursor: pointer;
                                                        text-align: center;
                                                        outline: none;
                                                        z-index: 10;
                                                        -moz-border-radius: 12px;
                                                        -webkit-border-radius: 12px;
                                                        border-radius: 12px;
                                                        display: inline-block;
                                                        font-family: Arial;
                                                        font-weight: bold;
                                                        padding: 10px 29px;
                                                        text-decoration: none;
                                                        background: rgba(0, 0, 0, 0.2);
                                                        border-style: none;
                                                        margin: 2px 5px;
                                                        width: 95%; }
                                                  .modal-panel .modal-icon-title {
                                                    position: absolute;
                                                    top: 3px;
                                                    right: 50%;
                                                    transform: translateX(50%) translateY(-50%);
                                                    box-sizing: border-box;
                                                    background: none;
                                                    font-size: 12vmin;
                                                    text-align: center;
                                                    outline: none;
                                                    width: auto;
                                                    z-index: 10;
                                                    border: none;
                                                    display: inline-block;
                                                    cursor: pointer;
                                                    font-family: Arial;
                                                    font-weight: bold;
                                                    padding: 10px 29px;
                                                    text-decoration: none; }
                                                    .modal-panel .modal-icon-title .fa-circle, .modal-panel .modal-icon-title .fa-cog {
                                                      position: absolute;
                                                      top: 50%;
                                                      left: 50%;
                                                      transform: translateX(-50%) translateY(-50%); }
                                                      .modal-panel .modal-icon-title .fa-circle {
                                                        color: #384649;
                                                        z-index: 14;
                                                        font-size: 15vmin; }
                                                        .modal-panel .modal-icon-title .fa-cog {
                                                          color: #F7EB5B;
                                                          z-index: 15; }
                                                  .modal-panel .modal-container {
                                                    overflow-y: scroll;
                                                    max-height: 50vh;
                                                    min-height: 20vh;
                                                    margin-top: 7vh; }
                                                    .modal-panel .centered-input {
                                                      margin: 20px;
                                                      position: relative;
                                                      left: 50%;
                                                      transform: translateX(-50%); }
                                                      .modal-panel .modal-row {
                                                        display: flex;
                                                        flex-direction: row;
                                                        justify-content: space-between;
                                                        align-items: center;
                                                        min-height: 7.5vmin;
                                                        margin-bottom: 2vmin; }
                                                        .modal-panel .to-follow-primary {
                                                          background: rgba(0, 0, 0, 0.2);
                                                          padding: 8px;
                                                          border-radius: 12px;
                                                          cursor: pointer; }
                                                          .modal-panel .to-follow-primary:hover {
                                                            background: rgba(255, 255, 255, 0.1); }
                                                            .modal-panel .to-follow-important {
                                                              background: #759aab;
                                                              padding: 8px;
                                                              border-radius: 12px;
                                                              cursor: pointer; }
                                                              .modal-panel .to-follow-important:hover {
                                                                background: rgba(255, 255, 255, 0.1); }
                                                                .modal-panel .modal-right {
                                                                  margin-right: 10px; }
                                                                  .modal-panel .input-container, .modal-panel .input-settings-container {
                                                                    display: flex;
                                                                    flex-direction: row;
                                                                    width: 100%; }
                                                                    .modal-panel .input-container i, .modal-panel .input-settings-container i {
                                                                      padding: 10px;
                                                                      font-size: clamp(20px, 5vw, 28px); }
                                                  .modal-panel .input-container {
                                                    align-items: center;
                                                    justify-content: center; }
                                                    .modal-panel .input-settings-container {
                                                      align-items: flex-end;
                                                      justify-content: flex-end; }
                                                      .modal-panel input[type=text] {
                                                        border-radius: 5vh;
                                                        min-height: 30px;
                                                        border-style: none;
                                                        background: #759aab;
                                                        color: #F7EB5B;
                                                        font-family: VAG Round;
                                                        width: 90%;
                                                        padding-left: 15px;
                                                        padding-right: 10px;
                                                        padding-top: 5px;
                                                        padding-bottom: 5px;
                                                        text-overflow: ellipsis;
                                                        white-space: nowrap;
                                                        overflow: hidden;
                                                        outline: none;
                                                        min-width: 80%;
                                                        text-align: center; }
                                                        .modal-panel input[type=text]:focus {
                                                          outline-offset: 0;
                                                          min-height: 30px; }
                                                          .modal-panel input[type=text]:focus, .modal-panel input[type=text]:active {
                                                            text-overflow: unset; }
                                                            .modal-panel .close-btn {
                                                              position: absolute;
                                                              cursor: pointer;
                                                              top: 3px;
                                                              right: 1px;
                                                              transform: translateX(50%) translateY(-50%);
                                                              box-sizing: border-box;
                                                              background: none;
                                                              font-size: 9vmin;
                                                              text-align: center;
                                                              outline: none;
                                                              width: auto;
                                                              z-index: 10;
                                                              border: none;
                                                              display: inline-block;
                                                              cursor: pointer;
                                                              font-family: Arial;
                                                              font-weight: bold;
                                                              padding: 10px 29px;
                                                              text-decoration: none; }
                                                              .modal-panel .close-btn .fa-circle, .modal-panel .close-btn .fa-times-circle {
                                                                position: absolute;
                                                                top: 50%;
                                                                left: 50%;
                                                                transform: translateX(-50%) translateY(-50%); }
                                                                .modal-panel .close-btn .fa-circle {
                                                                  color: #384649;
                                                                  z-index: 14;
                                                                  font-size: 12vmin; }
                                                                  .modal-panel .close-btn .fa-times-circle {
                                                                    color: #759aab;
                                                                    z-index: 15; }
                                                  .modal-panel .switch {
                                                    -moz-user-select: none;
                                                    -webkit-user-select: none;
                                                    -ms-user-select: none;
                                                    position: relative;
                                                    display: inline-block;
                                                    width: 60px;
                                                    height: 34px; }
                                                    .modal-panel .switch input {
                                                      opacity: 0;
                                                      width: 0;
                                                      height: 0; }
                                                      .modal-panel .slider {
                                                        position: absolute;
                                                        cursor: pointer;
                                                        top: 0;
                                                        left: 0;
                                                        right: 0;
                                                        bottom: 0;
                                                        background-color: #ccc;
                                                        -webkit-transition: 0.4s;
                                                        transition: 0.4s; }
                                                        .modal-panel .slider:before {
                                                          position: absolute;
                                                          content: "";
                                                          height: 26px;
                                                          width: 26px;
                                                          left: 4px;
                                                          bottom: 4px;
                                                          background-color: white;
                                                          -webkit-transition: 0.4s;
                                                          transition: 0.4s; }
                                                          .modal-panel input:checked + .slider {
                                                            background-color: #2196F3; }
                                                            .modal-panel input:focus + .slider {
                                                              box-shadow: 0 0 1px #2196F3; }
                                                              .modal-panel input:checked + .slider:before {
                                                                -webkit-transform: translateX(26px);
                                                                -ms-transform: translateX(26px);
                                                                transform: translateX(26px); }
                                                                .modal-panel .slider.round {
                                                                  border-radius: 34px; }
                                                                  .modal-panel .slider.round:before {
                                                                    border-radius: 50%; }
                                                                    .modal-panel .follow-icon {
                                                                      font-size: clamp(26px, 8vw, 50px);
                                                                      cursor: pointer;
                                                                      position: relative;
                                                                      outline: none; }

@font-face {
  font-family: "Euclid";
  src: url("fonts/EuclidCircularA-Regular-WebXL.woff"); }

  @font-face {
    font-family: "Euclid";
    src: url("fonts/EuclidCircularA-Bold-WebXL.woff");
    font-weight: 700; }

    @font-face {
      font-family: "Euclid";
      src: url("fonts/EuclidCircularA-Light-WebXL.woff");
      font-style: 200; }

      @font-face {
        font-family: "Euclid";
        src: url("fonts/EuclidCircularA-Medium-WebXL.woff");
        font-weight: bold;
        font-style: italic, oblique; }

        @font-face {
          font-family: "VAG Round";
          src: url("fonts/vag_rounded.eot");
          src: url("fonts/vag_rounded.eot?#iefix") format("embedded-opentype"),
                    url("fonts/vag_rounded.woff2") format("woff2"),
                    url("fonts/vag_rounded.woff") format("woff"),
                    url("fonts/vag_rounded.ttf") format("truetype"),
                    url("fonts/vag_rounded.svg#VAG Rounded") format("svg"); }

footer {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  z-index: 80;
  height: 10vh;
  width: 100%;
  background: #384649;
  color: #F7EB5B;
  bottom: -5px;
  left: -13px;
  padding: 10px;
  outline: none;
  font-size: 2em; }
  footer .social-button-container {
    width: 100%;
    max-width: 97.23077rem !important;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap; }
    footer .footer-icon > a > i, footer #share-btn {
      color: #F7EB5B;
      width: 50px;
      height: 50px;
      display: flex;
      justify-content: center;
      align-items: center; }
      footer #share-btn-container {
        display: flex;
        align-items: center; }

footer > a:hover {
  color: blue; }

  footer > a:active {
    color: white; }

header {
  display: flex;
  justify-content: flex-end;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 3;
  width: 100%;
  color: white;
  outline: none;
  font-size: 24px; }
  header #svg-logo {
    width: 33%;
    max-width: 300px;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center; }
    header #version-number {
      color: #759aab;
      position: absolute;
      margin: 20px;
      top: 10;
      font-size: 15px;
      font-family: VAG Round;
      left: 0; }

@media only screen and (max-width: 320px) {
  header #svg-logo {
    width: 80%;   }
}

@media only screen and (max-width: 425px) {
  header #svg-logo {
    width: 50%;   }
}

h1.title {
  font-family: "Isle Black"; }

  #progress-bar-stage #progress-bar {
    position: absolute;
    z-index: 4; }
    #progress-bar-stage #progress-bar-container {
      height: 50%;
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center; }
      #progress-bar-stage #progress-bar-text {
        position: absolute;
        z-index: 3;
        font-family: Euclid, arial;
        min-width: 300px;
        width: 100%;
        height: 100%;
        font-weight: 700; }
        #progress-bar-stage .sp-container {
          position: relative;
          height: 65vh; }
          #progress-bar-stage .progress-bar-img-elem {
            position: absolute; }
            #progress-bar-stage #progress-bar-img-seringue {
              position: relative;
              height: 100%;
              z-index: 3; }
              #progress-bar-stage #progress-bar-img-piston {
                position: absolute;
                height: 100%;
                left: 0;
                top: -20vh;
                z-index: 1; }
                #progress-bar-stage #progress-bar-img-liquid-1,
                #progress-bar-stage #progress-bar-img-liquid-2 {
                  position: absolute;
                  height: 100%;
                  left: 0;
                  top: 0;
                  z-index: 2;
                  clip-path: polygon(0% 0, 100% 0%, 100% 32%, 0% 32%); }

#main-stage #life-bar-container {
  position: absolute;
  width: 10%;
  height: auto;
  max-width: 10vh;
  right: 5vw;
  top: 50%;
  transform: translateY(-50%); }
  #main-stage #life-bar-border {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 5;
    top: 4px; }
    #main-stage .life-bar-blood {
      position: absolute;
      left: 0;
      top: 0;
      z-index: 4;
      width: 100%;
      height: 100%;
      clip-path: polygon(0% 50%, 100% 50%, 100% 100%, 0% 100%); }
      #main-stage #score {
        position: absolute;
        z-index: 20;
        left: 0;
        top: 0;
        padding: 3vmin;
        font-family: VAG Round; }
        #main-stage .side-icon-container {
          position: absolute;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          font-size: 8vmin;
          color: #759aab;
          top: 0;
          right: 0;
          padding: 3vmin;
          outline: none;
          z-index: 10; }
          @media screen and (min-width: 1200px) {
            #main-stage .side-icon-container {
              font-size: 86px;   }
}
#main-stage .score-sentence {
  text-align: center;
  margin-bottom: 20px;
  color: #759aab; }
  #main-stage #rank-reached {
    text-align: center; }
    #main-stage .best-player-name {
      color: #26de81; }
      #main-stage .best-player-score {
        color: #ED1B2D; }
        #main-stage #modal-a-propos {
          text-align: center; }

#high-score-stage {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center; }
  #high-score-stage #highscore-container {
    overflow-y: scroll;
    padding: 10px;
    background: #384649;
    border-radius: 12px;
    color: #759aab;
    font-family: VAG Round;
    height: 30vh;
    max-width: 600px;
    width: 90vw; }
    #high-score-stage table {
      text-align: center;
      width: 100%;
      table-layout: fixed; }
      #high-score-stage table tr, #high-score-stage table tbody,
      #high-score-stage table thead {
        width: 100%; }
        #high-score-stage table td {
          max-width: 0; }
          #high-score-stage table td.column-rank {
            width: 25%; }
            #high-score-stage table td.column-pseudo {
              width: 50%;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap; }
              #high-score-stage table td.column-score {
                width: 25%; }
                #high-score-stage table th, #high-score-stage table td {
                  padding: 0.4vmin 20px;
                  overflow: hidden; }
                  #high-score-stage table .color-1rank {
                    color: #26de81; }
                    #high-score-stage table .color-2rank {
                      color: #fed330; }
                      #high-score-stage table .color-3rank {
                        color: #fd9644; }
                        #high-score-stage table .color-other-rank {
                          color: #4b6584; }
  #high-score-stage #screen-title-container {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 80vw;
    height: 15vh; }
    #high-score-stage #screen-title-maggie-img {
      max-width: 300px;
      width: 60%;
      height: auto;
      position: absolute;
      z-index: 3;
      top: 6vh; }
      #high-score-stage #screen-title-maboul-img {
        max-width: 320px;
        width: 60%;
        height: auto;
        position: absolute;
        z-index: 5;
        top: 15vh; }
        #high-score-stage #screen-title-tete-maggie-img {
          max-width: 150px;
          width: 24%;
          height: auto;
          position: absolute;
          top: 7vh;
          left: -webkit-calc(50% + 25vmin);
          left: -moz-calc(50% + 25vmin);
          left: calc(50% + 25vmin);
          z-index: 6; }
          #high-score-stage #highscore-container::-webkit-scrollbar-track {
            border: none;
            padding: 4px 2px;
            background-color: #384649; }
            #high-score-stage #highscore-container::-webkit-scrollbar {
              width: 10px; }
              #high-score-stage #highscore-container::-webkit-scrollbar-thumb {
                border-radius: 10px;
                box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
                background-color: #F7EB5B;
                border: solid 2px #384649; }

.small-text {
  font-size: 20px;
  font-size: clamp(16px, 4vw, 22px); }

  .medium-text {
    font-size: 28px;
    font-size: clamp(16px, 6vw, 33px); }

    .big-text {
      font-size: 44px;
      font-size: clamp(26px, 8vw, 50px); }

.btn {
  text-align: center;
  outline: none;
  width: auto;
  z-index: 10;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
  -moz-border-radius: 18px;
  -webkit-border-radius: 18px;
  border-radius: 18px;
  display: inline-block;
  cursor: pointer;
  color: #26de81;
  font-family: Arial;
  font-weight: bold;
  padding: 10px 29px;
  text-decoration: none;
  background: #384649;
  animation: blink 0.25s linear 0.25s infinite alternate;
  position: absolute;
  bottom: 18vh;
  left: 50%;
  -moz-transform: translate(-50%, 0px);
  -webkit-transform: translate(-50%, 0px);
  -o-transform: translate(-50%, 0px);
  -ms-transform: translate(-50%, 0px);
  transform: translate(-50%, 0px); }

  .btn:hover {
    background-color: #759aab; }

    @keyframes blink {
      from {
        opacity: 0.75;   }
        to {
          opacity: 1;   }
}