@font-face {
        font-family: RubikMonoOne-Regular;
        src: url(RubikMonoOne-Regular.ttf)}

:root {
    --faktor: 0.06vw;
    --translatez: calc(var(--faktor)*269.67);  
}

.scene {
            font-family: RubikMonoOne-Regular, monospace;
            border: none;
            position: absolute;
            width: calc(var(--faktor)*210);
            height: calc(var(--faktor)*140);
            margin: calc(var(--faktor)*80) auto;
            perspective: calc(var(--faktor)*1000);
            transform: scale(0.7);
        }
        
        .carousel {
            color: blue;
            width: 100%;
            height: 100%;
            position: absolute;
            transform-style: preserve-3d;
            animation-name: rotierung;
            animation-iteration-count: infinite;
            animation-duration: 4s;
            animation-timing-function: linear;
        }
        
        .carousel__cell {
            position: absolute;
            width: calc(var(--faktor)*90);
            height: calc(var(--faktor)*120);
            left: calc(var(--faktor)*10);
            top: calc(var(--faktor)*10);
            line-height: calc(var(--faktor)*116);
            font-size: calc(var(--faktor)*53);
            font-weight:normal;
            color: white;
            text-align: center;
            transition: transform 1s, opacity 1s;
            backface-visibility: visible;
            background-color: rgba(24,38,28,0.5)
        }
        
        .carousel__cell:nth-child(1) {
            transform: rotateY( 0deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(2) {
            transform: rotateY( 18.94deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(3) {
            transform: rotateY( 37.89deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(4) {
            transform: rotateY(56.84deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(5) {
            transform: rotateY(75.79deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(6) {
            transform: rotateY(94.74deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(7) {
            transform: rotateY(113.68deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(8) {
            transform: rotateY(132.63deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(9) {
            transform: rotateY(151.58deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(10) {
            transform: rotateY(170.53deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(11) {
            transform: rotateY(189.47deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(12) {
            transform: rotateY(208.42deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(13) {
            transform: rotateY(227.36deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(14) {
            transform: rotateY(246.32deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(15) {
            transform: rotateY(265.26deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(16) {
            transform: rotateY(284.21deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(17) {
            transform: rotateY(303.16deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(18) {
            transform: rotateY(322.1deg) translateZ(var(--translatez));
        }
        
        .carousel__cell:nth-child(19) {
            transform: rotateY(341.05deg) translateZ(var(--translatez));
        }
        
        .carousel-options {
            text-align: center;
            position: relative;
            z-index: 2;
        }
        
        @keyframes rotierung {
            from {transform: rotateX( 5deg) translateZ(calc(-1*var(--translatez))) rotateY( 360deg) translateX(calc(var(--faktor)*45))}
            to {transform: rotateX( 5deg) translateZ(calc(-1*var(--translatez))) rotateY( 0deg) translateX(calc(var(--faktor)*45))}
        }