:root{--carousel-width: 1545px;--carousel-img-width: 100px;--carousel-img-large-width: 165px;--carousel-img-margin: 35px;--carousel-duration: 25s}@keyframes scroll{0%,to{transform:translate(35px)}99.999999%{transform:translate(calc(var(--carousel-width) * -1))}}.carousel-client{-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,0) 1%,rgba(0,0,0,1) 11%,rgba(0,0,0,1) 89%,rgba(0,0,0,0) 99%);mask-image:linear-gradient(90deg,#0000 1%,#000 15% 85%,#0000 99%);width:calc(2 * var(--no-of-slides));.carousel__wrapper{animation:var(--carousel-duration) linear 0s infinite normal forwards scroll;width:calc(var(--carousel-width) * 2);filter:grayscale(1) brightness(1.2);transition:filter .25s ease-in-out;&:hover{filter:grayscale(0) brightness(1);transition:filter .4s ease-in-out}}.carousel__slide{width:var(--carousel-width);img{width:100%}}}.ctn{--width: 300px;width:var(--width);height:var(--width);margin:0 auto}.ctn .ctn-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10}.ctn .animated-icn{position:absolute;left:calc(50% - 12px);top:calc(50% - 12px);z-index:8;display:block;width:24px;height:24px;animation-duration:5s;animation-delay:.2s;animation-timing-function:cubic-bezier(.32,0,.67,0);animation-direction:normal;animation-fill-mode:forwards;animation-iteration-count:infinite}.ctn .animated-icn:nth-child(1){animation-delay:0s;animation-duration:4s}.ctn .animated-icn:nth-child(4){animation-delay:.5s;animation-duration:5.5s}.ctn .animated-icn:nth-child(7){animation-delay:0s;animation-duration:6s}.ctn .animated-icn:nth-child(9){animation-delay:2.5s;animation-duration:3s}.ctn .animated-icn:nth-child(12){animation-delay:.8s;animation-duration:3.5s}.ctn .animated-icn:nth-child(13){animation-delay:3s;animation-duration:4s}.ctn .animated-icn:nth-child(1){animation-name:radial-move-1}.ctn .animated-icn:nth-child(2){animation-name:radial-move-2}.ctn .animated-icn:nth-child(3){animation-name:radial-move-3}.ctn .animated-icn:nth-child(4){animation-name:radial-move-4}.ctn .animated-icn:nth-child(5){animation-name:radial-move-5}.ctn .animated-icn:nth-child(6){animation-name:radial-move-6}.ctn .animated-icn:nth-child(7){animation-name:radial-move-7}.ctn .animated-icn:nth-child(8){animation-name:radial-move-8}.ctn .animated-icn:nth-child(9){animation-name:radial-move-9}.ctn .animated-icn:nth-child(10){animation-name:radial-move-10}.ctn .animated-icn:nth-child(11){animation-name:radial-move-11}.ctn .animated-icn:nth-child(12){animation-name:radial-move-12}.ctn .animated-icn:nth-child(13){animation-name:radial-move-13}.ctn .animated-icn:nth-child(14){animation-name:radial-move-14}.ctn .animated-icn:nth-child(15){animation-name:radial-move-15}.ctn .animated-icn:nth-child(16){animation-name:radial-move-16}.ctn .animated-icn:nth-child(17){animation-name:radial-move-17}@keyframes radial-move-1{0%{transform:translate(-100px,65px) rotate(16deg);opacity:0;color:#0000008a}to{opacity:1;transform:translate(0) rotate(0);color:#00385cb3}}@keyframes radial-move-2{0%{transform:translate(250px,100px);opacity:0;color:#0000008a}to{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-3{0%{transform:translate(-100px,-130px);opacity:0;color:#0000008a}to{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-4{0%{transform:translate(-200px,-400px) rotate(-16deg);opacity:0;color:#0000008a}70%{opacity:1;transform:translate(0) rotate(0);color:color-mix(in srgb,var(--color-selected) 60%,white)}}@keyframes radial-move-5{0%{transform:translate(-250px,8px);opacity:0;color:#0000008a}65%{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-6{0%{transform:translate(-40px,-120px);opacity:0;color:#0000008a}90%{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-6{0%{transform:translate(-40px,-180px);opacity:0;color:#0000008a}50%{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-7{0%{opacity:0;color:#0000008a}40%{transform:translate(60px,120px) rotate(-16deg)}to{opacity:1;transform:translate(0) rotate(0);color:color-mix(in srgb,var(--color-selected) 60%,white)}}@keyframes radial-move-7{0%{transform:translate(250px,-120px);opacity:0;color:#0000008a}to{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-8{0%{transform:translateY(250px);opacity:0;color:#0000008a}to{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-9{0%{transform:translate(90px,-110px);opacity:0;color:#0000008a}70%{opacity:1;transform:translate(0);color:color-mix(in srgb,var(--color-selected) 60%,white)}}@keyframes radial-move-10{0%{transform:translate(-120px,210px);opacity:0;color:#0000008a}60%{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-11{0%{transform:translate(100px,-135px) rotate(16deg);opacity:0;color:#0000008a}80%{opacity:1;transform:translate(0) rotate(0);color:color-mix(in srgb,var(--color-selected) 60%,white)}}@keyframes radial-move-12{0%{transform:translate(180px,210px);opacity:0;color:#0000008a}90%{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-13{0%{transform:translate(320px,10px);opacity:0;color:#0000008a}76%{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-14{0%{transform:translate(-220px,220px);opacity:0;color:#0000008a}90%{opacity:1;transform:translate(0);color:#00385cb3}}@keyframes radial-move-15{0%{transform:translate(360px,-22px) rotate(10deg);opacity:0;color:#0000008a}50%{opacity:1;transform:translate(0) rotate(0);color:#00385cb3}}@keyframes radial-move-16{0%{transform:translate(360px,-168px) rotate(20deg);opacity:0;color:#0000008a}67%{opacity:1;transform:translate(0) rotate(0);color:#00385cb3}}.counter{font-size:3rem;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;&:after{content:"";position:absolute;left:0;top:12px;width:60px;height:60px;background-color:#ff0;z-index:-1;border-radius:100px}}
