.scene{border:1px solid #ccc;position:relative;width:210px;height:140px;margin:80px auto;perspective:1000px}.carousel{width:100%;height:100%;position:absolute;transform:translateZ(-288px);transform-style:preserve-3d;transition:transform 1s}.carousel__cell{position:absolute;width:190px;height:120px;left:10px;top:10px;border:2px solid black;line-height:116px;font-size:80px;font-weight:700;color:white;text-align:center;transition:transform 1s,opacity 1s}.carousel__cell:nth-child(9n+1){background:hsla(0,100%,50%,.8)}.carousel__cell:nth-child(9n+2){background:hsla(40,100%,50%,.8)}.carousel__cell:nth-child(9n+3){background:hsla(80,100%,50%,.8)}.carousel__cell:nth-child(9n+4){background:hsla(120,100%,50%,.8)}.carousel__cell:nth-child(9n+5){background:hsla(160,100%,50%,.8)}.carousel__cell:nth-child(9n+6){background:hsla(200,100%,50%,.8)}.carousel__cell:nth-child(9n+7){background:hsla(240,100%,50%,.8)}.carousel__cell:nth-child(9n+8){background:hsla(280,100%,50%,.8)}.carousel__cell:nth-child(9n+0){background:hsla(320,100%,50%,.8)}.carousel__cell:first-child{transform:rotateY(0deg) translateZ(288px)}.carousel__cell:nth-child(2){transform:rotateY(40deg) translateZ(288px)}.carousel__cell:nth-child(3){transform:rotateY(80deg) translateZ(288px)}.carousel__cell:nth-child(4){transform:rotateY(120deg) translateZ(288px)}.carousel__cell:nth-child(5){transform:rotateY(160deg) translateZ(288px)}.carousel__cell:nth-child(6){transform:rotateY(200deg) translateZ(288px)}.carousel__cell:nth-child(7){transform:rotateY(240deg) translateZ(288px)}.carousel__cell:nth-child(8){transform:rotateY(280deg) translateZ(288px)}.carousel__cell:nth-child(9){transform:rotateY(320deg) translateZ(288px)}.carousel-options{text-align:center;position:relative;z-index:2;background:hsla(0,0%,100%,.8)}.carousel-container-x{width:100%;display:flex;flex-wrap:nowrap;overflow:hidden;grid-gap:20px;align-items:center}.carousel-container-x>div{transition:all 1s}.carousel-container-y{height:100%;display:flex;flex-direction:column;flex-wrap:nowrap;overflow:hidden;grid-gap:20px}.carousel-container-y>div{transition:all 1s}.carousel-item{height:200px;width:300px;min-width:300px;min-height:200px;border-radius:10px;transition:all .3s}.carousel-item:nth-child(9n+1){background:hsla(0,100%,50%,.8)}.carousel-item:nth-child(9n+2){background:hsla(40,100%,50%,.8)}.carousel-item:nth-child(9n+3){background:hsla(80,100%,50%,.8)}.carousel-item:nth-child(9n+4){background:hsla(120,100%,50%,.8)}.carousel-item:nth-child(9n+5){background:hsla(160,100%,50%,.8)}.carousel-item:nth-child(9n+6){background:hsla(200,100%,50%,.8)}.carousel-item:nth-child(9n+7){background:hsla(240,100%,50%,.8)}.carousel-item:nth-child(9n+8){background:hsla(280,100%,50%,.8)}.carousel-item:nth-child(9n+0){background:hsla(320,100%,50%,.8)}
/*# sourceMappingURL=d22ee1a3b8b4d234.css.map*/