.title{color:#666}.slide-container{z-index:4;position:relative;width:100vw;height:300vh;overflow:clip;background:#000}.slide-container__inner{z-index:0;position:absolute;position:-webkit-sticky;position:sticky;top:0;left:0;width:100vw;height:100vh;overflow:hidden}.slide-container:first-child{background:#eee}.slide-container:nth-child(2){z-index:3;background:#000}.slide-container:nth-child(3){background:#ccc}.slide-container:nth-child(3) .slide-container__inner{-webkit-perspective:2000px;perspective:2000px}.slide{top:0;left:0;height:100vh;-webkit-transition:-webkit-transform .35s cubic-bezier(.33,1,.68,1);width:100vw;transition:-webkit-transform .35s cubic-bezier(.33,1,.68,1);transition:transform .35s cubic-bezier(.33,1,.68,1);transition:transform .35s cubic-bezier(.33,1,.68,1),-webkit-transform .35s cubic-bezier(.33,1,.68,1)}.slide,.slide__item{contain:layout;position:absolute;-webkit-transform-style:preserve-3d;z-index:0;transform-style:preserve-3d}.slide__item{top:25%;left:50%;overflow:hidden;pointer-events:none}.slide__inner{contain:layout;position:relative;width:100%;height:100%;overflow:hidden}.slide--card{-webkit-perspective:4000px;perspective:4000px}.slide--card:before{position:absolute;top:50%;right:20vw;content:"3D Cylinder SLIDER";color:#333;font-weight:700;font-size:4rem;line-height:2;-webkit-transform:translateZ(150px);z-index:100;transform:translateZ(150px)}.slide--card .slide__item{aspect-ratio:5/7;width:20vw;height:auto;margin-left:-10vw;cursor:pointer;pointer-events:auto}.slide--card .slide__item .count{z-index:100;position:absolute;top:0;left:0;color:#fff;font-size:5rem;line-height:1}.slide--card .slide__item img{-webkit-clip-path:inset(12px round 12px);height:100%;clip-path:inset(12px round 12px);-o-object-fit:cover;position:relative;overflow:hidden;object-fit:cover;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);-webkit-transition:-webkit-transform 1s cubic-bezier(.16,1,.3,1);z-index:0;width:20vw;transition:-webkit-transform 1s cubic-bezier(.16,1,.3,1);transition:transform 1s cubic-bezier(.16,1,.3,1);transition:transform 1s cubic-bezier(.16,1,.3,1),-webkit-transform 1s cubic-bezier(.16,1,.3,1)}.slide--card .slide__item:before{position:absolute;top:0;left:0;height:100%;border:4px solid #06f;border-radius:14px;content:"";opacity:0;-webkit-transform:scale(.8);visibility:hidden;z-index:2;width:100%;transform:scale(.8)}.slide--card .slide__item:first-child img{-webkit-transition-delay:.07s;transition-delay:.07s}.slide--card .slide__item:nth-child(2) img{-webkit-transition-delay:.14s;transition-delay:.14s}.slide--card .slide__item:nth-child(3) img{-webkit-transition-delay:.21s;transition-delay:.21s}.slide--card .slide__item:nth-child(4) img{-webkit-transition-delay:.28s;transition-delay:.28s}.slide--card .slide__item:nth-child(5) img{-webkit-transition-delay:.35s;transition-delay:.35s}.slide--card .slide__item:nth-child(6) img{-webkit-transition-delay:.42s;transition-delay:.42s}.slide--card .slide__item:nth-child(7) img{-webkit-transition-delay:.49s;transition-delay:.49s}.slide--card .slide__item:nth-child(8) img{-webkit-transition-delay:.56s;transition-delay:.56s}.slide--card .slide__item:nth-child(9) img{-webkit-transition-delay:.63s;transition-delay:.63s}.slide--card .slide__item:nth-child(10) img{-webkit-transition-delay:.7s;transition-delay:.7s}.slide--card .slide__item:hover:before{opacity:1;-webkit-transform:none;transform:none;-webkit-transition:opacity .15s linear,visibility .15s linear,-webkit-transform .8s cubic-bezier(0,.55,.45,1);visibility:visible;transition:opacity .15s linear,visibility .15s linear,-webkit-transform .8s cubic-bezier(0,.55,.45,1);transition:opacity .15s linear,visibility .15s linear,transform .8s cubic-bezier(0,.55,.45,1);transition:opacity .15s linear,visibility .15s linear,transform .8s cubic-bezier(0,.55,.45,1),-webkit-transform .8s cubic-bezier(0,.55,.45,1)}.slide.is-active .slide__item img{-webkit-transform:none;transform:none}.slide--effect{-webkit-perspective:1400px;perspective:1400px}.slide--effect:first-child{z-index:5}.slide--effect:first-child .slide__inner{width:70%}.slide--effect:nth-child(2){z-index:4}.slide--effect:nth-child(2) .slide__inner{width:80%}.slide--effect:nth-child(3){z-index:3}.slide--effect:nth-child(3) .slide__inner{width:90%}.slide--effect:nth-child(4){z-index:2}.slide--effect:nth-child(4) .slide__inner{width:100%}.slide--effect:nth-child(5){z-index:2}.slide--effect:nth-child(5) .slide__inner{width:100%;border-radius:unset;background:none;color:#fff;font-weight:700;font-size:1.2vw;text-transform:uppercase}.slide--effect:nth-child(5) .slide__inner:after{content:none}.slide--effect .slide__item{display:grid;aspect-ratio:1/1;height:auto;margin-left:-.5vw;overflow:visible;-webkit-perspective:1000px;top:50%;place-items:center;width:1vw;perspective:1000px}.slide--effect .slide__inner{display:grid;place-content:center;aspect-ratio:1/1;height:auto;-webkit-transform:none;transform:none;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transition:none!important;width:100%;transition:none!important}.slide--effect .slide__inner:after{z-index:0;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:100%;background:#fff;content:""}.slide--effect.is-show .slide__inner:after{-webkit-animation:blink-bg 2s ease-out infinite;animation:blink-bg 2s ease-out infinite}.slide--effect .i-1 .slide__inner:after{-webkit-animation-delay:25ms;animation-delay:25ms}.slide--effect .i-2 .slide__inner:after{-webkit-animation-delay:.05s;animation-delay:.05s}.slide--effect .i-3 .slide__inner:after{-webkit-animation-delay:75ms;animation-delay:75ms}.slide--effect .i-4 .slide__inner:after{-webkit-animation-delay:.1s;animation-delay:.1s}.slide--effect .i-5 .slide__inner:after{-webkit-animation-delay:.125s;animation-delay:.125s}.slide--effect .i-6 .slide__inner:after{-webkit-animation-delay:.15s;animation-delay:.15s}.slide--effect .i-7 .slide__inner:after{-webkit-animation-delay:.175s;animation-delay:.175s}.slide--effect .i-8 .slide__inner:after{-webkit-animation-delay:.2s;animation-delay:.2s}.slide--effect .i-9 .slide__inner:after{-webkit-animation-delay:.225s;animation-delay:.225s}.slide--effect .i-10 .slide__inner:after{-webkit-animation-delay:.25s;animation-delay:.25s}.slide--effect .i-11 .slide__inner:after{-webkit-animation-delay:.275s;animation-delay:.275s}.slide--effect .i-12 .slide__inner:after{-webkit-animation-delay:.3s;animation-delay:.3s}.slide--effect .i-13 .slide__inner:after{-webkit-animation-delay:.325s;animation-delay:.325s}.slide--effect .i-14 .slide__inner:after{-webkit-animation-delay:.35s;animation-delay:.35s}.slide--effect .i-15 .slide__inner:after{-webkit-animation-delay:.375s;animation-delay:.375s}.slide--effect .i-16 .slide__inner:after{-webkit-animation-delay:.4s;animation-delay:.4s}.slide--effect .i-17 .slide__inner:after{-webkit-animation-delay:.425s;animation-delay:.425s}.slide--effect .i-18 .slide__inner:after{-webkit-animation-delay:.45s;animation-delay:.45s}.slide--effect .i-19 .slide__inner:after{-webkit-animation-delay:.475s;animation-delay:.475s}.slide--effect .i-20 .slide__inner:after{-webkit-animation-delay:.5s;animation-delay:.5s}.slide--effect .i-21 .slide__inner:after{-webkit-animation-delay:.525s;animation-delay:.525s}.slide--effect .i-22 .slide__inner:after{-webkit-animation-delay:.55s;animation-delay:.55s}.slide--effect .i-23 .slide__inner:after{-webkit-animation-delay:.575s;animation-delay:.575s}.slide--effect .i-24 .slide__inner:after{-webkit-animation-delay:.6s;animation-delay:.6s}.slide--effect .i-25 .slide__inner:after{-webkit-animation-delay:.625s;animation-delay:.625s}.slide--effect .i-26 .slide__inner:after{-webkit-animation-delay:.65s;animation-delay:.65s}.slide--effect .i-27 .slide__inner:after{-webkit-animation-delay:.675s;animation-delay:.675s}.slide--effect .i-28 .slide__inner:after{-webkit-animation-delay:.7s;animation-delay:.7s}.slide--effect .i-29 .slide__inner:after{-webkit-animation-delay:.725s;animation-delay:.725s}.slide--effect .i-30 .slide__inner:after{-webkit-animation-delay:.75s;animation-delay:.75s}.slide--effect .i-31 .slide__inner:after{-webkit-animation-delay:.775s;animation-delay:.775s}.slide--effect .i-32 .slide__inner:after{-webkit-animation-delay:.8s;animation-delay:.8s}.slide--effect .i-33 .slide__inner:after{-webkit-animation-delay:.825s;animation-delay:.825s}.slide--effect .i-34 .slide__inner:after{-webkit-animation-delay:.85s;animation-delay:.85s}.slide--effect .i-35 .slide__inner:after{-webkit-animation-delay:.875s;animation-delay:.875s}.slide--effect .i-36 .slide__inner:after{-webkit-animation-delay:.9s;animation-delay:.9s}.slide--effect .i-37 .slide__inner:after{-webkit-animation-delay:.925s;animation-delay:.925s}.slide--effect .i-38 .slide__inner:after{-webkit-animation-delay:.95s;animation-delay:.95s}.slide--effect .i-39 .slide__inner:after{-webkit-animation-delay:.975s;animation-delay:.975s}.slide--effect .i-40 .slide__inner:after{-webkit-animation-delay:1s;animation-delay:1s}.slide--wall{border:1px solid #111;-webkit-perspective:6000px;perspective:6000px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:700;font-size:4rem;line-height:1;-webkit-transition:none;transition:none}.slide--wall:before{color:#111;-webkit-transform:translateZ(150px);transform:translateZ(150px);-webkit-transform-style:preserve-3d;z-index:10;transform-style:preserve-3d}.slide--wall:after,.slide--wall:before{position:absolute;right:12vw;bottom:12vw;content:"BACKGROUND"}.slide--wall:after{color:#ccc;-webkit-transform:translateZ(200px);transform:translateZ(200px);-webkit-transform-style:preserve-3d;z-index:100;transform-style:preserve-3d}.slide--wall .slide__item{z-index:0;top:0;left:50vw;width:5.02vw;height:100vh;margin-left:-2.5vw;overflow:visible}.slide--wall .slide__inner{z-index:0;width:inherit;height:inherit;background:#111}@-webkit-keyframes blink-bg{0%{background:#fff}10%{background:#000}30%{background:#000}31%{background:#ff1b1b}50%{background:#000}60%{background:#000}61%{background:#fff}}@keyframes blink-bg{0%{background:#fff}10%{background:#000}30%{background:#000}31%{background:#ff1b1b}50%{background:#000}60%{background:#000}61%{background:#fff}}@media(max-width:1023px){.slide-container{height:180svh}.slide-container:nth-child(2) .slide-container__inner{-webkit-transform:scale(1.8);transform:scale(1.8)}.slide-container:nth-child(3) .slide-container__inner{-webkit-transform:scale(.8);transform:scale(.8)}.slide{-webkit-transition:none!important;width:100vw;transition:none!important}.slide--card:before{top:50vh;font-size:1.5rem}.slide--card .slide__item{top:50%;width:20vw;margin-top:-25%;margin-left:-10vw}.slide--card .slide__item img{border-radius:8px;-webkit-clip-path:unset;width:20vw;overflow:hidden;clip-path:unset}.slide--effect:nth-child(5){z-index:2}.slide--effect:nth-child(5) .slide__inner{overflow:visible;font-size:1.8vw}.slide--wall{font-size:2rem}.slide--wall:before{z-index:10}.slide--wall:after,.slide--wall:before{position:absolute;right:12vw;bottom:45%}.slide--wall:after{z-index:100}}
