@keyframes hRotateLtr {
    from {
        transform: rotateY(0deg);
    }
    to {
        transform: rotateY(360deg);
    }
}

@keyframes hRotateLtrM3I7 {
    from {
        transform: rotateY(0deg);
    }
    30% {
        transform: rotateY(360deg);
    }
    to {
        transform: rotateY(360deg);
    }
}

@keyframes hRotateRtl {
    from {
        transform: rotateY(0deg);
    }
    to {
        transform: rotateY(-360deg);
    }
}

@keyframes hRotateRtlM3I7 {
    from {
        transform: rotateY(0deg);
    }
    30% {
        transform: rotateY(-360deg);
    }
    to {
        transform: rotateY(-360deg);
    }
}

@keyframes hRotateBacksideLtr {
    from {
        transform: rotateY(-180deg);
    }
    to {
        transform: rotateY(180deg);
    }
}

@keyframes hRotateBacksideLtrM3I7 {
    from {
        transform: rotateY(-180deg);
    }
    30% {
        transform: rotateY(180deg);
    }
    to {
        transform: rotateY(180deg);
    }
}

@keyframes hRotateBacksideRtl {
    from {
        transform: rotateY(180deg);
    }
    to {
        transform: rotateY(-180deg);
    }
}

@keyframes hRotateBacksideRtlM3I7 {
    from {
        transform: rotateY(180deg);
    }
    30% {
        transform: rotateY(-180deg);
    }
    to {
        transform: rotateY(-180deg);
    }
}

@keyframes rRotateFineClock {
    from {
        transform: rotateZ(0deg);
    }
    to {
        transform: rotateZ(360deg);
    }
}

@keyframes rRotateReverseClock {
    from {
        transform: rotateZ(0deg);
    }
    to {
        transform: rotateZ(-360deg);
    }
}

@keyframes dsRotateLtr {
    from {
        transform: rotate3d(1, -1, 0, 0deg);
    }
    to {
        transform: rotate3d(1, -1, 0, 360deg);
    }
}

@keyframes dzRotateLtr {
    from {
        transform: rotate3d(1, 1, 0, 0deg);
    }
    to {
        transform: rotate3d(1, 1, 0, 360deg);
    }
}

@keyframes twinkleDown {
    from {
        translate: 0 -30px;
        opacity: 0;
        filter: grayscale(1) brightness(2) drop-shadow(0px 0px 16px #0001) drop-shadow(0px 0px 16px #0001);
    }

    5% {
        translate: 0 -21px;
        opacity: 0.75;
        filter: grayscale(0.7) brightness(2) drop-shadow(0px 0px 6px #4441) drop-shadow(0px 0px 6px #4441);
    }

    10% {
        translate: 0 -12px;
        opacity: 1;
        filter: grayscale(0.4) brightness(1.3) drop-shadow(0px 0px 1px #8881) drop-shadow(0px 0px 1px #8881);
    }

    20% {
        translate: 0 -10px;
        filter: grayscale(0.05) brightness(1.1) drop-shadow(0px 0px 2px #FFF) drop-shadow(0px 0px 2px #FFF);
    }

    25% {
        translate: 0 -8px;
        filter: grayscale(0) brightness(1) drop-shadow(0px 0px 3px #FFF) drop-shadow(0px 0px 6px #FFF);
    }

    95% {
        translate: 0 9px;
        filter: drop-shadow(0px 0px 6px #FFF) drop-shadow(0px 0px 3px #FFF);
    }

    97% {
        translate: 0 10px;
        opacity: 0.75;
        filter: brightness(1.6) drop-shadow(0px 0px 2px #0001) drop-shadow(0px 0px 2px #0001);
    }

    to {
        translate: 0 10px;
        opacity: 0;
        filter: brightness(0.8) blur(1px) drop-shadow(0px 0px 0px #FFF) drop-shadow(0px 0px 0px #FFF);
    }
}


@keyframes shakeUpDown {
    from {
        translate: 0 0%;
    }
    25% {
        translate: 0 5%;
    }
    50% {
        translate: 0 0%;
    }
    75% {
        translate: 0 -5%;
    }
    to {
        translate: 0 0%;
    }
}

@keyframes tfShakeUpDown {
    from {
        transform: translateY(0%);
    }
    25% {
        transform: translateY(5%);
    }
    50% {
        transform: translateY(0%);
    }
    75% {
        transform: translateY(-5%);
    }
    to {
        transform: translateY(0%);
    }
}


@keyframes tiltDiagonalLRLL {
    from {
        rotate: 0deg;
    }
    12.5% {
        rotate: -30deg;
    }
    25% {
        rotate: 0deg;
    }
    37.5% {
        rotate: 30deg;
    }
    50% {
        rotate: 0deg;
    }
    62.5% {
        rotate: -30deg;
    }
    75% {
        rotate: -10deg;
    }
    87.5% {
        rotate: -30deg;
    }
    to {
        rotate: 0deg;
    }
}

@keyframes tfTiltDiagonalLRLL {
    from {
        transform: rotateZ(0deg);
    }
    12.5% {
        transform: rotateZ(-35deg);
    }
    25% {
        transform: rotateZ(0deg);
    }
    37.5% {
        transform: rotateZ(35deg);
    }
    50% {
        transform: rotateZ(0deg);
    }
    62.5% {
        transform: rotateZ(-35deg);
    }
    75% {
        transform: rotateZ(-10deg);
    }
    87.5% {
        transform: rotateZ(-35deg);
    }
    to {
        transform: rotateZ(0deg);
    }
}