.container2{position:relative;display:flex;flex-direction:row;margin-left:20%;width:auto;height:100vh}.container3{position:absolute;display:flex;align-items:row;flex-direction:row;margin-left:80%;width:auto;height:100vh}.snake .dot{width:20px;height:20px;background:var(--color-1);border-radius:50%;margin:5px 0}.snake .dot:nth-child(1){width:10px;height:10px;background:var(--color-3) !important}.snake .dot:nth-child(odd){background:var(--color-2)}.dot-1{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:0.1s;animation-delay:0.1s}.dot-2{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:0.2s;animation-delay:0.2s}.dot-3{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:0.3s;animation-delay:0.3s}.dot-4{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:0.4s;animation-delay:0.4s}.dot-5{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:0.5s;animation-delay:0.5s}.dot-6{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:0.6s;animation-delay:0.6s}.dot-7{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:0.7s;animation-delay:0.7s}.dot-8{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:0.8s;animation-delay:0.8s}.dot-9{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:0.9s;animation-delay:0.9s}.dot-10{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1s;animation-delay:1s}.dot-11{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1.1s;animation-delay:1.1s}.dot-12{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1.2s;animation-delay:1.2s}.dot-13{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1.3s;animation-delay:1.3s}.dot-14{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1.4s;animation-delay:1.4s}.dot-15{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1.5s;animation-delay:1.5s}.dot-16{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1.6s;animation-delay:1.6s}.dot-17{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1.7s;animation-delay:1.7s}.dot-18{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1.8s;animation-delay:1.8s}.dot-19{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:1.9s;animation-delay:1.9s}.dot-20{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2s;animation-delay:2s}.dot-21{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2.1s;animation-delay:2.1s}.dot-22{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2.2s;animation-delay:2.2s}.dot-23{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2.3s;animation-delay:2.3s}.dot-24{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2.4s;animation-delay:2.4s}.dot-25{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2.5s;animation-delay:2.5s}.dot-26{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2.6s;animation-delay:2.6s}.dot-27{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2.7s;animation-delay:2.7s}.dot-28{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2.8s;animation-delay:2.8s}.dot-29{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:2.9s;animation-delay:2.9s}.dot-30{-webkit-animation:dot 1.5s infinite;animation:dot 1.5s infinite;-webkit-animation-delay:3s;animation-delay:3s}@-webkit-keyframes dot{0%,100%{transform:translateX(0)}50%{transform:translateX(-15px)}}@keyframes dot{0%,100%{transform:translateX(0)}50%{transform:translateX(-15px)}}.holder{transform-style:preserve-3d;transform:rotateX(-35deg)}.cylinder{position:relative;margin-right:30%;height:50vw;width:100vw;transform-style:preserve-3d;-webkit-animation:spin 7s infinite linear;animation:spin 7s infinite linear}.face{position:absolute;background-color:var(--color-3);opacity:.7;height:100%;width:2vw;top:50%;left:50%;transform:rotateY(calc(7.2deg * var(--index))) translateZ(calc(15.9154943092vw - -6px))}.face:nth-child(1){background:var(--color-3)}@-webkit-keyframes spin{to{transform:rotateY(-360deg)}}@keyframes spin{to{transform:rotateY(-360deg)}}