.game-container .time-is-up {
    display: inherit !important;
    transition: 333ms linear all;
}

.game-container .time-is-up.ng-hide {
    transform: translateY(100%);
    pointer-events: none;
}

.game-container .half-time {
    display: inherit !important;
    transition: 333ms linear all;
}

.game-container .half-time.ng-hide {
    transform: translateY(-100%);
    pointer-events: none;
}

.game-container .congrats {
    display: inherit !important;
    transition: 333ms linear all;
}

.game-container .congrats.ng-hide {
    transform: translateY(-100%);
    pointer-events: none;
}

.game-container .bonus-meter.bounce {
    transform-origin: bottom;
    animation-name: bounceWobble;
    animation-duration: .333s;
}

.game-container .bonus-meter-meter.bounce {
    transform-origin: 50% 350%;
    animation-name: bounceWobble;
    animation-duration: .333s;
}

.game-container .bonus-meter-meter .fill {
    transition: 333ms ease-in width;
}

.game-container .bonus-meter-particle {
    transform-origin: bottom;
    animation-name: shoot;
    animation-duration: .333s;
    animation-timing-function: linear;
}

.sparkle-star.anim {
    display: inherit;
    transform-origin: center;
    animation: sparkle 666ms linear 0s infinite reverse;
}

@keyframes sparkle {
    0% {
        -ms-transform: rotate(0deg) scale(0);
        -webkit-transform: rotate(0deg) scale(0);
        transform: rotate(0deg) scale(0);
        opacity: 0;
    }
    20% {
        opacity: 0;
        -ms-transform: rotate(72deg) scale(.0);
        -webkit-transform: rotate(72deg) scale(.0);
        transform: rotate(72deg) scale(.0);
    }
    50% {
        -ms-transform: rotate(180deg) scale(1.2);
        -webkit-transform: rotate(180deg) scale(1.2);
        transform: rotate(180deg) scale(1.2);
        opacity: 1;
    }
    80% {
        opacity: 0;
        -ms-transform: rotate(288deg) scale(.0);
        -webkit-transform: rotate(288deg) scale(.0);
        transform: rotate(288deg) scale(.0);
    }
    100% {
        -ms-transform: rotate(360deg) scale(0);
        -webkit-transform: rotate(360deg) scale(0);
        transform: rotate(360deg) scale(0);
        opacity: 0;
    }
}

@keyframes sparkle2 {
    0% {
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    20% {
        -ms-transform: rotate(72deg);
        -webkit-transform: rotate(72deg);
        transform: rotate(72deg);
    }
    50% {
        -ms-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
    80% {
        -ms-transform: rotate(288deg);
        -webkit-transform: rotate(288deg);
        transform: rotate(288deg);
    }
    100% {
        -ms-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes bounceWobble {
    0% {
        -ms-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    20% {
        -ms-transform: scale(1.2);
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }
    100% {
        -ms-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes shoot {
    0% {
        transform: scaleY(1) translateY(0);
        opacity: 0;
    }
    20% {
        transform: scaleY(1.5) translateY(-3.333vh);
        opacity: 0;
    }
    40% {
        opacity: 1;
    }
    60% {
        transform: scaleY(2.5) translateY(-6vh);
        opacity: 1;
    }
    70% {
        transform: scaleY(2.5) translateY(-7vh);
        opacity: 1;
    }
    80% {
        transform: scaleY(2.5) translateY(-8vh);
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}