@keyframes hand-left {
    from {
        transform: translateY(0) translateX(0) rotate(0);
    } to {
        transform: translateY(5px) translateX(-3px) rotate(3deg);
    }
}

@keyframes hand-right {
    from {
        transform: translateY(0) translateX(0) rotate(0);
    } to {
        transform: translateY(5px) translateX(3px) rotate(-3deg)
    }
}

@keyframes zeus-eyes {
    from {
        opacity: 0;
    } to {
        opacity: 1;
    }
}

@keyframes title {
    from {
        transform: translateY(1.5625rem);
        opacity: 0;
    } to {
        opacity: 100;
        transform: translateY(0);
    }
}

html {
    font-size: .83333333vw;
}

@media (max-aspect-ratio: 71/1) and (orientation:landscape) {
    html {
        font-size:.58vw
    }
}

@media (max-aspect-ratio: 142/55) and (orientation:landscape) {
    html {
        font-size:.63vw
    }
}

@media (max-aspect-ratio: 71/30) and (orientation:landscape) {
    html {
        font-size:.7vw
    }
}

@media (max-aspect-ratio: 142/65) and (orientation:landscape) {
    html {
        font-size:.83333333vw
    }
}

@media (max-aspect-ratio: 71/35) and (orientation:landscape) {
    html {
        font-size:.8333333vw
    }
}

@media (max-aspect-ratio: 142/75) and (orientation:landscape) {
    html {
        font-size:.85vw
    }
}

@media (max-aspect-ratio: 71/40) and (orientation:landscape) {
    html {
        font-size:.9vw
    }
}

@media (max-aspect-ratio: 142/85) and (orientation:landscape) {
    html {
        font-size:.96vw
    }
}

@media (max-aspect-ratio: 71/45) and (orientation:landscape) {
    html {
        font-size:1vw
    }
}

@media (max-aspect-ratio: 142/95) and (orientation:landscape) {
    html {
        font-size:1.07vw
    }
}

@media (max-aspect-ratio: 71/50) and (orientation:landscape) {
    html {
        font-size:1.14vw
    }
}

@media (max-aspect-ratio: 142/115) and (orientation:landscape) {
    html {
        font-size:1.2vw
    }
}

@media (max-aspect-ratio: 142/125) and (orientation:landscape) {
    html {
        font-size:1.28vw
    }
}

@media (max-aspect-ratio: 71/65) and (orientation:landscape) {
    html {
        font-size:1.36vw
    }
}

@media (max-aspect-ratio: 142/135) and (orientation:landscape) {
    html {
        font-size:1.44vw
    }
}

@media (max-width: 1024px) and (orientation:portrait) {
    html {
        font-size:1.6vw
    }
}

@media (max-aspect-ratio: 320/321) and (orientation:portrait) {
    html {
        font-size:1vw
    }
}

@media (max-aspect-ratio: 32/33) and (orientation:portrait) {
    html {
        font-size:1.1vw
    }
}

@media (max-aspect-ratio: 32/35) and (orientation:portrait) {
    html {
        font-size:1.18vw
    }
}

@media (max-aspect-ratio: 32/37) and (orientation:portrait) {
    html {
        font-size:1.2vw
    }
}

@media (max-aspect-ratio: 32/39) and (orientation:portrait) {
    html {
        font-size:1.24vw
    }
}

@media (max-aspect-ratio: 32/41) and (orientation:portrait) {
    html {
        font-size:1.28vw
    }
}

@media (max-aspect-ratio: 32/43) and (orientation:portrait) {
    html {
        font-size:1.34vw
    }
}

@media (max-aspect-ratio: 32/45) and (orientation:portrait) {
    html {
        font-size:1.42vw
    }
}

@media (max-aspect-ratio: 32/47) and (orientation:portrait) {
    html {
        font-size:1.5vw
    }
}

@media (max-aspect-ratio: 32/49) and (orientation:portrait) {
    html {
        font-size:1.58vw
    }
}

@media (max-aspect-ratio: 16/25) and (orientation:portrait) {
    html {
        font-size:1.6vw
    }
}

@media (max-aspect-ratio: 8/13) and (orientation:portrait) {
    html {
        font-size:1.66vw
    }
}

@media (max-aspect-ratio: 16/27) and (orientation:portrait) {
    html {
        font-size:1.72vw
    }
}

@media (max-aspect-ratio: 4/7) and (orientation:portrait) {
    html {
        font-size:1.77vw
    }
}

@media (max-aspect-ratio: 16/29) and (orientation:portrait) {
    html {
        font-size:1.82vw
    }
}

@media (max-aspect-ratio: 8/15) and (orientation:portrait) {
    html {
        font-size:1.88vw
    }
}

@media (max-aspect-ratio: 16/31) and (orientation:portrait) {
    html {
        font-size:1.95vw
    }
}

@media (max-aspect-ratio: 1/2) and (orientation:portrait) {
    html {
        font-size:2vw
    }
}

@media (max-aspect-ratio: 16/33) and (orientation:portrait) {
    html {
        font-size:2.07vw
    }
}

@media (max-aspect-ratio: 8/17) and (orientation:portrait) {
    html {
        font-size:2.12vw
    }
}

@media (max-aspect-ratio: 16/35) and (orientation:portrait) {
    html {
        font-size:2.13vw
    }
}

@keyframes wheel {
    from {
        transform: rotate(0turn);
    } to {
        transform: rotate(-1turn);
    }
}

@keyframes btn {
    0% {
        transform: scale(1);
        filter: saturate(1)
    }
    25% {
        transform: scale(1.05);
        filter: saturate(1.8)
    }
}

@keyframes d {
    0% {
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    80% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1.2) translateX(8.75rem) translateY(-12.5rem) skewX(-20deg);
        -moz-transform: scale(1.2) translateX(8.75rem) translateY(-12.5rem) skewX(-20deg);
        transform: scale(1.2) translateX(8.75rem) translateY(-12.5rem) skewX(-20deg);
    }
}

@keyframes e {
    0% {
        opacity: 0;
    }
    
    10% {
        opacity: 1;
    }
    80% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1.2) translateX(-8.75rem) translateY(-12.5rem) skewY(10deg);
        -moz-transform: scale(1.2) translateX(-8.75rem) translateY(-12.5rem) skewY(10deg);
        transform: scale(1.2) translateX(-8.75rem) translateY(-12.5rem) skewY(10deg);
    }
}

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

[x-cloak] {
    display: none!important;
}



.title {
    font-size: 4.5rem;
    min-height: 7.25rem;
} 

@media (min-width: 1044px){
    .wheel-container {
        height: 50%;
        width: 75%;
    }
}

@media (max-width: 1043px) and (min-width: 0px) {
    .wheel-container {
        height: 50%;
        width: 940px;
    }
}


@media (max-height: 660px) and (max-width: 1024px) {
    body {
        overflow: auto!important;
    }
    body > div {
        height: auto!important;
    }
    .wheel-container {
        height: 72%!important;
    }
    .overlayed {
        height: 100vh!important;
    }
}

@media (max-width: 1024px) {
    .smoke {
        display: none;
    }
}