@keyframes cheer {
    0% {
        transform: scaleY(1) translate(0px, 0px);
    }

    10% {
        transform: scaleY(0.9) translate(0px, 20px);
    }

    50% {
        transform: scaleY(1.05) translate(0px, -70px);
    }

    95% {
        transform: scaleY(0.95) translate(0px, 10px);
    }
   
    100% {
        transform: scaleY(1) translate(0px, 0px);
    }
}

.cheer {
    animation-name: cheer;
    animation-duration: 1s;
}

@keyframes wave {
    0% {
        transform: rotate(0deg) translate(0px, 0px);
    }

    25% {
        transform: rotate(-10deg) translate(-20px, 0px);
    }

    75% {
        transform: rotate(10deg) translate(20px, 0px);
    }
   
    100% {
        transform: scaleY(0deg) translate(0px, 0px);
    }
}

.wave {
    animation-name: wave;
    animation-duration: 2s;
    animation-iteration-count: infinite
}



@keyframes grow-flicker {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

.grow-flicker {
    animation-name: grow-flicker;
    animation-duration: 1s;
    animation-iteration-count: infinite
}


@keyframes updown-flicker {
    0% {
        transform: translate(0px, 0px);
    }

    50% {
        transform: translate(0px, -20px);
    }

    100% {
        transform: translate(0px, 0px);
    }
}

.updown-flicker {
    animation-name: updown-flicker;
    animation-duration: 1s;
    animation-iteration-count: infinite
}


@keyframes hand-click {
    0% {
        transform: rotate(-33.05deg) translate(60px, 40px);
    }
    50% {
        transform: rotate(-27.05deg) translate(60px, 40px);
    }
    100% {
        transform: rotate(-33.05deg) translate(60px, 40px);
    }
}

.hand-click {
    animation-name: hand-click;
    transform-origin: 100% 100%;
    animation-duration: 1s;
    animation-iteration-count: infinite
}


@keyframes cheer {
    0% {
        transform: scaleY(1) translate(0px, 0px);
    }

    10% {
        transform: scaleY(0.9) translate(0px, 20px);
    }

    50% {
        transform: scaleY(1.05) translate(0px, -70px);
    }

    95% {
        transform: scaleY(0.95) translate(0px, 10px);
    }
   
    100% {
        transform: scaleY(1) translate(0px, 0px);
    }
}

.cheer {
    animation-name: cheer;
    animation-duration: 1s;
}



@keyframes geohand {
    0% {
        transform: rotate(-33.05deg) translate(60px, 40px);
    }
    50% {
        transform: rotate(-27.05deg) translate(60px, 40px);
    }
    100% {
        transform: rotate(-33.05deg) translate(60px, 40px);
    }
}

.geohand {
    animation-name: geohand;
    transform-origin: 100% 100%;
    animation-duration: 1s;
    animation-iteration-count: infinite
}

@media only screen and (max-width: 1440px) {
    @keyframes geohand {
        0% {
            transform: rotate(-33.05deg) translate(4.167vw, 2.778vw);
        }
        50% {
            transform: rotate(-27.05deg) translate(4.167vw, 2.778vw);
        }
        100% {
            transform: rotate(-33.05deg) translate(4.167vw, 2.778vw);
        }
    }
}

@keyframes shake {
    10%, 90% {
      transform: translate3d(-1px, 0, 0);
    }
    
    20%, 80% {
      transform: translate3d(2px, 0, 0);
    }
  
    30%, 50%, 70% {
      transform: translate3d(-4px, 0, 0);
    }
  
    40%, 60% {
      transform: translate3d(4px, 0, 0);
    }
}

.shake {
    animation: shake 0.5s cubic-bezier(.36,.07,.19,.97) both;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
    animation-iteration-count: infinite
}

.fast-shake {
    animation: shake 0.25s cubic-bezier(.36,.07,.19,.97) both;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
    animation-iteration-count: infinite
}

@keyframes unlock-glow {
    0% {
        transform: rotate(0deg) scale(1);
    }

    50% {
        transform: rotate(181deg) scale(0.75);
    }

    100% {
        transform: rotate(360deg) scale(1);
    }
}

.unlock-glow {
    animation-name: unlock-glow;
    animation-duration: 3s;
    animation-iteration-count: infinite
}   