:root{--bS:border-box;--p3d:preserve-3d;--tran:transform 1s,opacity 1s} @charset "UTF-8"; @font-face{font-family:'default';src:url(default.ttf) format('ttf'),url(default.woff2) format('woff2'),url(default.woff) format('woff');font-weight:normal;font-style:normal} html,body{background:rgba(0,0,0,1);width:100%;height:100%;margin:0 auto} .ringCon .img,#gauge,#gauge .fS,#gauge .fS ::after,.drgnSteam,.handle{-webkit-box-sizing:var(--bS);-moz-box-sizing:var(--bS);-ms-box-sizing:var(--bS);-o-box-sizing:var(--bS);box-sizing:var(--bS)} .plate,.plate::before,.plate::after{display:block} #nameSake,#window svg,.dHorse :nth-child(-n+24){overflow:visible} #can{overflow:hidden} #cantainer,#nameSake,#gauge,.plush{pointer-events:none} .ag-sparks,.ag-lightning,.ag-lightning::before,.ag-lightning::after,#cantainer,#can,#can::before,#can::after, #can div,#can > :nth-child(2)::after,.noshow,#electric2,.ringCon .img,.ring::before,#nameSake,#dreamHorse, .iiiD,.dHorse,.dHorse li,.dHorse ::before,.dHorse ::after,#cup1,#cup1::after,.drgnSteam,.drgn,.plate, .plate::before,.plate::after,.handle::after,#cup1 #end,#gauge,.run,.rerun{position:absolute} #window,.eH,.electric,.mid,.tiff,.handle{position:relative} .ag-lightning::before,.ag-lightning::after,#can::after,.ringCon .img,.plush{will-change:transform,opacity,animation} .ag-sparks,.ag-lightning::before,.ag-lightning::after,#can,#can::before,#can::after,.run,.rerun{background:var(--bK)} .ringCon,.ringCon > .img,.ring::before{background:var(--bk,none);background-size:var(--bks,cover);background-position:var(--bkp,center center);background-repeat:var(--bkr,no-repeat)} .plate,.plate::before,.plate::after{border-radius:50%} #cantainer,.ringCon .img,#dreamHorse,#window,.navB,.navB div,.iiiD,.dHorse,.dHorse li,.dHorse ::before, .dHorse ::after,#can,#can div{-webkit-perspective:var(--per);-moz-perspective:var(--per);-ms-perspective:var(--per);-o-perspective:var(--per);perspective:var(--per)} #dreamHorse,#window,.iiiD,.dHorse,.dHorse li,.dHorse ::before,.dHorse ::after{-webkit-perspective-origin:var(--pO);-moz-perspective-origin:var(--pO);-ms-perspective-origin:var(--pO);-o-perspective-origin:var(--pO);perspective-origin:var(--pO)} .ringCon .img,#nameSake,#dreamHorse,#window,.navB,.navB div,.iiiD,.dHorse,.dHorse li,.dHorse ::before, .dHorse ::after,#gauge,#can,#can div{-webkit-transform-style:var(--p3d);-moz-transform-style:var(--p3d);-ms-transform-style:var(--p3d);-o-transform-style:var(--p3d);transform-style:var(--p3d)} .ag-lightning::before,.ag-lightning::after,#nameSake,#window,.iiiD,.dHorse,.dHorse ::before,.dHorse ::after,#cup1, .tiff{--tO:0 0;-webkit-transform-origin:var(--tO);-moz-transform-origin:var(--tO);-ms-transform-origin:var(--tO);-o-transform-origin:var(--tO);transform-origin:var(--tO)} .ag-lightning::before,.ag-lightning::after,.ringCon .img,.ring::before,#nameSake,#dreamHorse,#window,.navB svg, .iiiD,.dHorse,.dHorse li,.dHorse ::before,.dHorse ::after,#window svg,#cup1,.tiff,.drgnSteam,.drgn,.plate, .handle::after,#gauge,#cantainer,#can,#can::before,#can::after,#can div,.eH,#electric svg,.noshow,.run, .rerun{-webkit-transform:var(--nLab);-moz-transform:var(--nLab);-ms-transform:var(--nLab);-o-transform:var(--nLab);transform:var(--nLab)} .ringCon .img,.ring::before,.dHorse :nth-child(n+1):nth-child(n+9),.dHorse ::before,.noshow,.drgn,#gauge,.plush, .run,.rerun{-webkit-transition:var(--tran);-moz-transition:var(--tran);-o-transition:var(--tran);transition:var(--tran)} .ring::before,.ag-lightning::before,.ag-lightning::after,#cantainer,#can,#can:hover,#can::after,#can:hover::after, #can > :nth-child(2)::after,#can:hover > :nth-child(2)::after,#nameSake,#window,.iiiD,.dHorse, .dHorse ::before,#cup1,.tiff,.drgnSteam,#gauge,.yellow,.blue,.plush{-webkit-animation:var(--anim);-moz-animation:var(--anim);-ms-animation:var(--anim);-o-animation:var(--anim);animation:var(--anim)} .drgnSteam,#gauge{-webkit-filter:var(--fil);-moz-filter:var(--fil);-ms-filter:var(--fil);-o-filter:var(--fil);filter:var(--fil)} .run,.rerun{-webkit-mask:var(--mask);-moz-mask:var(--mask);-ms-mask:var(--mask);-o-mask:var(--mask);mask:var(--mask)} #can::before,#can::after{-webkit-box-shadow:var(--bShad);-moz-box-shadow:var(--bShad);-ms-box-shadow:var(--bShad);-o-box-shadow:var(--bShad);box-shadow:var(--bShad)} /* ------------------------------------------- */ html,body{overflow:hidden} #track,.ringCon{pointer-events:none} .fS,.fS div,.fS ::after,#track,#track section,#track div,.ringCon,.ring,.ring .img{position:absolute} .ring .img{will-change:opacity} .ring .img{background:var(--bk,none);background-size:var(--bks,cover);background-position:var(--bkp,center center);background-repeat:var(--bkr,no-repeat)} .fS,.fS div,.fS ::after{-webkit-perspective:var(--per);-moz-perspective:var(--per);-ms-perspective:var(--per);-o-perspective:var(--per);perspective:var(--per)} #track div,.ring,.ring .img{-webkit-perspective:var(--per);-moz-perspective:var(--per);-ms-perspective:var(--per);-o-perspective:var(--per);perspective:var(--per)} .fS,.fS div,.fS ::after,#track,#track div,.ringCon,.ring,.ring .img{-webkit-transform-style:var(--p3d);-moz-transform-style:var(--p3d);-ms-transform-style:var(--p3d);-o-transform-style:var(--p3d);transform-style:var(--p3d)} #track section,.ringCon,.ringCon .img,.ring{--tO:0 0;-webkit-transform-origin:var(--tO);-moz-transform-origin:var(--tO);-ms-transform-origin:var(--tO);-o-transform-origin:var(--tO);transform-origin:var(--tO)} .fS,.fS ::after{-webkit-transform:var(--nLab);-moz-transform:var(--nLab);-ms-transform:var(--nLab);-o-transform:var(--nLab);transform:var(--nLab)} #track,#track section,.ringCon,.ring,.ring .img{-webkit-transform:var(--nLab);-moz-transform:var(--nLab);-ms-transform:var(--nLab);-o-transform:var(--nLab);transform:var(--nLab)} #track .fS :first-child,#track .fS :first-child::after,.dHorse :nth-child(-n+10)::before,.ringCon,.ring, .ring .img{-webkit-transition:var(--tran);-moz-transition:var(--tran);-o-transition:var(--tran);transition:var(--tran)} .fS,.fS :first-child,.fS ::after{--anim:none;-webkit-animation:var(--anim);-moz-animation:var(--anim);-ms-animation:var(--anim);-o-animation:var(--anim);animation:var(--anim)} #track section,.ringCon,.ring,.ring .img{-webkit-animation:var(--anim);-moz-animation:var(--anim);-ms-animation:var(--anim);-o-animation:var(--anim);animation:var(--anim)} /* #can{-webkit-clip-path:var(--cPath);-moz-clip-path:var(--cPath);-ms-clip-path:var(--cPath);-o-clip-path:var(--cPath);clip-path:var(--cPath)} */ .fS ::after{content:''} .ag-lightning::before,.ag-lightning::after,#can::before,#can::after,#can > :nth-child(2)::after,.ring::before,.dHorse ::before,.dHorse ::after, #cup1::after,.plate::before,.plate::after,.handle::after{content:''} .fS,#track div,.ringCon,.ringCon .img,.ring,#track div .img{--per:100vw} .fS{--x:0;--x1:0;--y:0;--y1:0;--z:0;--z1:0;--xr:30;--xr1:-55;--yr:0;--yr1:0;--zr:0;--zr1:0;--nLab:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1));--anim:fS 1.25s linear;left:calc(var(--l,0)*1vw);top:calc(var(--t,0)*1vw);z-index:-1;cursor:pointer} @-webkit-keyframes fS{0%{-webkit-transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}100%{-webkit-transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}}@-moz-keyframes fS{0%{-moz-transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}100%{-moz-transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}}@-ms-keyframes fS{0%{-ms-transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}100%{-ms-transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}}@-o-keyframes fS{0%{-o-transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}100%{-o-transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}}@keyframes fS{0%{transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}100%{transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}} .fS:hover{--x:0;--x1:0;--y:0;--y1:0;--z:0;--z1:0;--xr:30;--xr1:-55;--yr:-5;--yr1:0;--zr:0;--zr1:0;--nLab:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1));--anim:fSB .375s linear;left:calc(var(--l,0)*1vw);top:calc(var(--t,0)*1vw);z-index:1} @-webkit-keyframes fSB{0%{-webkit-transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}100%{-webkit-transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}}@-moz-keyframes fSB{0%{-moz-transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}100%{-moz-transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}}@-ms-keyframes fSB{0%{-ms-transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}100%{-ms-transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}}@-o-keyframes fSB{0%{-o-transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}100%{-o-transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}}@keyframes fSB{0%{transform:translate3d(calc(var(--x)*1vw),calc(var(--y)*1vw),calc(var(--z)*1vw))rotateX(calc(var(--xr)*1deg))rotateY(calc(var(--yr)*1deg))rotate(calc(var(--zr)*1deg))scale(var(--scX,1),var(--scY,1))}100%{transform:translate3d(calc((var(--x) + var(--x1))*1vw),calc((var(--y) + var(--y1))*1vw),calc((var(--z) + var(--z1))*1vw))rotateX(calc((var(--xr) + var(--xr1))*1deg))rotateY(calc((var(--yr) + var(--yr1))*1deg))rotate(calc((var(--zr) + var(--zr1))*1deg))scale(var(--scX,1),var(--scY,1))}} .fS div{width:50%;height:50%} .fS ::after{--nLab:translate3d(0,0,calc(var(--fW,0)*1vw));content:var(--pW);pointer-events:all;width:100%;height:100%;top:4vw;color:var(--colAft);font:4vw/.65 'default';white-space:pre;text-align:center;letter-spacing:-.17vw;text-shadow:.33vw 0 .5vw rgba(0,0,0,.13)} .fS :first-child::after{--op:0;--anim:op 1s forwards;color:#FAFAD2;text-shadow:none;-webkit-filter:blur(.0625vw);-moz-filter:blur(.0625vw);-ms-filter:blur(.0625vw);-o-filter:blur(.0625vw);filter:blur(.0625vw);opacity:var(--op)} .fS:hover :first-child,.fS:hover :first-child::after{--op:1;--anim:op2 1s forwards} .fS :nth-child(n+2){--fW:-.125}.fS :nth-child(n+3){--fW:-.25}.fS :nth-child(n+4){--fW:-.375}.fS :nth-child(n+5){--fW:-.5}.fS :nth-child(n+6){--fW:-.625}.fS :nth-child(n+7){--fW:-.75}.fS :nth-child(n+8){--fW:-.875}.fS :nth-child(n+9){--fW:-1}.fS :nth-child(n+10){--fW:-1.125}.fS :nth-child(n+11){--fW:-1.25}.fS :nth-child(n+12){--fW:-1.375}.fS :nth-child(n+13){--fW:-1.5}.fS :nth-child(n+14){--fW:-1.625}.fS :nth-child(n+15){--fW:-1.75}.fS :nth-child(n+16){--fW:-1.875}.fS :nth-child(n+17){--fW:-2}.fS :nth-child(n+18){--fW:-.2125}.fS :nth-child(n+19){--fW:-.225}.fS :nth-child(n+20){--fW:-.2375} /* .fancyWords:nth-child(n+11)::after,.fancyWords:nth-child(n+12)::after,.fancyWords:nth-child(n+13)::after{-webkit-text-stroke:var(--ts) var(--tsk);-moz-text-stroke:var(--ts) var(--tsk);-ms-text-stroke:var(--ts) var(--tsk);-o-text-stroke:var(--ts) var(--tsk);text-stroke:var(--ts) var(--tsk)} */ .fS :nth-child(n+11)::after,.fS :nth-child(n+12)::after{text-shadow:.5vw 0 .25vw brown,.415vw .415vw .2vw red,0 .5vw .25vw black} .fS :nth-child(n+13)::after{text-shadow:0 0 1.125vw rgba(200,255,255,.5)} .fS :last-child::after{-webkit-text-stroke:1.6vw rgba(0,0,0,.1);-moz-text-stroke:1.6vw rgba(0,0,0,.1);-ms-text-stroke:1.6vw rgba(0,0,0,.1);-o-text-stroke:1.6vw rgba(0,0,0,.1);text-stroke:1.6vw rgba(0,0,0,.1)} /* .fS:hover :nth-child(n+11)::after{text-shadow:.5vw 0 .75vw #0504aa,.415vw .415vw .625vw yellow,0 .5vw .75vw #0504aa} .fS:hover :nth-child(n+12)::after{text-shadow:0 0 1.125vw rgba(216,0,67,.95)} */ /* .dTime{--dTime:2.25s} .drip{--nLab:translate3d(25.5vw,14vw,0)scale(1,.625);display:grid;place-content:start center;top:0;left:0;bottom:0;right:0;margin:0;padding:0;width:auto;height:auto;z-index:1} .canv{--peR:20vw;--anim:fall var(--dTime) .25s ease-in 2;background:#000;top:11.5vw;left:27vw;padding:calc((var(--f)+1))*1vw);-webkit-filter:contrast(19);-moz-filter:contrast(19);-ms-filter:contrast(19);-o-filter:contrast(19);filter:contrast(19)} @-webkit-keyframes fall{0%{opacity:0;-webkit-transform:perspective(var(--peR))translate3d(0,-25vw,0)scale(.25)rotateX(0)}32%{opacity:.55;-webkit-transform:perspective(var(--peR))translate3d(0,0,0)scale(.35,.75)rotateX(0)}33%{opacity:.875;-webkit-transform:perspective(var(--peR))translate3d(0,0,0)scale(.85,.35)rotateX(0)}35%,100%{opacity:1;-webkit-transform:perspective(var(--peR))translate3d(0,0,0)scale(1)rotateX(80deg)}}@-moz-keyframes fall{0%{-moz-transform:perspective(var(--peR))translate3d(0,-25vw,0)scale(.25)rotateX(0)}32%{-moz-transform:perspective(var(--peR))translate3d(0,0,0)scale(.35,.75)rotateX(0)}33%{-moz-transform:perspective(var(--peR))translate3d(0,0,0)scale(.85,.35)rotateX(0)}35%,100%{-moz-transform:perspective(var(--peR))translate3d(0,0,0)scale(1)rotateX(80deg)}}@-ms-keyframes fall{0%{-ms-transform:perspective(var(--peR))translate3d(0,-25vw,0)scale(.25)rotateX(0)}32%{-ms-transform:perspective(var(--peR))translate3d(0,0,0)scale(.35,.75)rotateX(0)}33%{-ms-transform:perspective(var(--peR))translate3d(0,0,0)scale(.85,.35)rotateX(0)}35%,100%{-ms-transform:perspective(var(--peR))translate3d(0,0,0)scale(1)rotateX(80deg)}}@-o-keyframes fall{0%{-o-transform:perspective(var(--peR))translate3d(0,-25vw,0)scale(.25)rotateX(0)}32%{-o-transform:perspective(var(--peR))translate3d(0,0,0)scale(.35,.75)rotateX(0)}33%{-o-transform:perspective(var(--peR))translate3d(0,0,0)scale(.85,.35)rotateX(0)}35%,100%{-o-transform:perspective(var(--peR))translate3d(0,0,0)scale(1)rotateX(80deg)}}@keyframes fall{0%{transform:perspective(var(--peR))translate3d(0,-25vw,0)scale(.25)rotateX(0)}32%{transform:perspective(var(--peR))translate3d(0,0,0)scale(.35,.75)rotateX(0)}33%{transform:perspective(var(--peR))translate3d(0,0,0)scale(.85,.35)rotateX(0)}35%,100%{transform:perspective(var(--peR))translate3d(0,0,0)scale(1)rotateX(80deg)}} .drop{--nLab:rotate(calc((var(--k)*1turn/var(--n)) - 45deg))translate3d(calc(var(--f)*1vw),0,0)scale(0,calc(var(--s)*.5));--anim:wave var(--dTime) ease-in 2; background:#FFFDD0;top:0;left:0;margin:calc(var(--s)* -1vw);padding:calc(var(--s)*1vw);border-radius:50%;-webkit-filter:blur(.416vw);-moz-filter:blur(.416vw);-ms-filter:blur(.416vw);-o-filter:blur(.416vw);filter:blur(.416vw)} @-webkit-keyframes wave{0%,32%{border-radius:.25vw 25% 25% 75%;-webkit-transform:rotate(-45deg)translate3d(0,calc(var(--s)*1vw),0)scale(1)}35%{border-radius:50%;-webkit-transform:rotate(calc(var(--adrop) - 45deg))translate3d(0,0,0)scale(1)}}@-moz-keyframes wave{0%,32%{border-radius:.25vw 25% 25% 75%;-moz-transform:rotate(-45deg)translate3d(0,calc(var(--s)*1vw),0)scale(1)}35%{border-radius:50%;-moz-transform:rotate(calc(var(--adrop) - 45deg))translate3d(0,0,0)scale(1)}}@-ms-keyframes wave{0%,32%{border-radius:.25vw 25% 25% 75%;-ms-transform:rotate(-45deg)translate3d(0,calc(var(--s)*1vw),0)scale(1)}35%{border-radius:50%;-ms-transform:rotate(calc(var(--adrop) - 45deg))translate3d(0,0,0)scale(1)}}@-o-keyframes wave{0%,32%{border-radius:.25vw 25% 25% 75%;-o-transform:rotate(-45deg)translate3d(0,calc(var(--s)*1vw),0)scale(1)}35%{border-radius:50%;-o-transform:rotate(calc(var(--adrop) - 45deg))translate3d(0,0,0)scale(1)}}@keyframes wave{0%,32%{border-radius:.25vw 25% 25% 75%;transform:rotate(-45deg)translate3d(0,calc(var(--s)*1vw),0)scale(1)}35%{border-radius:50%;transform:rotate(calc(var(--adrop) - 45deg))translate3d(0,0,0)scale(1)}} */ #track{--nLab:translate3d(100vw,calc(var(--dup,25)*1vw),0);top:25vw;left:48vw} #track .fS :first-child,#track .fS :first-child::after{--anim:op3 1s calc(var(--aDel)*1s) backwards;--tran:opacity 1s calc(var(--aDel)*1s)} .mo{--left:-24vw} .re{--re:30} .unmin{--min:-1,1} .op{--op:1} .hid{--hid:hidden} .noP{--time:1500;--oP:0} .go{--rotY:0} .num{--num:1} .endX{--endX:1.75} .stay{--min:-1,1} .oP{--oP:1} .min{--min:1,1} .str{--sectr:3s} .flip{--xr:40;--yr:2.5;--zr:-182.5} .stayMore{--min:1,-1} /* --secop:cubic-bezier(1,-.1,1.125,.31);--trans:transform var(--sectr) var(--wait) cubic-bezier(0,1.54,1,.48),opacity 1.5s var(--secop); */ #track section{--nLab:translate3d(0,0,0)rotateY(0)rotate(0); --anim:sectr var(--sectr) var(--wait) cubic-bezier(.8,.75,0,.5) forwards; background-color:var(--color,none);left:var(--left,0);width:4vw;height:4vw;color:#000;font:6vw/.65 'default';opacity:0} @-webkit-keyframes sectr{100%{-webkit-transform:translate3d(calc(var(--varX,0)*var(--mo,1)*var(--om,1)*1vw),calc((var(--varY,0)*var(--re,1))*1vw),0)rotateY(calc(var(--rotY,0)*1deg))rotate(calc(var(--vaRZ)*1rad))scale(var(--min,2));opacity:1}}@-moz-keyframes sectr{100%{-moz-transform:translate3d(calc(var(--varX,0)*var(--mo,1)*var(--om,1)*1vw),calc((var(--varY,0)*var(--re,1))*1vw),0)rotateY(calc(var(--rotY,0)*1deg))rotate(calc(var(--vaRZ)*1rad))scale(var(--min,2));opacity:1}}@-ms-keyframes sectr{100%{-ms-transform:translate3d(calc(var(--varX,0)*var(--mo,1)*var(--om,1)*1vw),calc((var(--varY,0)*var(--re,1))*1vw),0)rotateY(calc(var(--rotY,0)*1deg))rotate(calc(var(--vaRZ)*1rad))scale(var(--min,2));opacity:1}}@-o-keyframes sectr{100%{-o-transform:translate3d(calc(var(--varX,0)*var(--mo,1)*var(--om,1)*1vw),calc((var(--varY,0)*var(--re,1))*1vw),0)rotateY(calc(var(--rotY,0)*1deg))rotate(calc(var(--vaRZ)*1rad))scale(var(--min,2));opacity:1}}@keyframes sectr{100%{transform:translate3d(calc(var(--varX,0)*var(--mo,1)*var(--om,1)*1vw),calc((var(--varY,0)*var(--re,1))*1vw),0)rotateY(calc(var(--rotY,0)*1deg))rotate(calc(var(--vaRZ)*1rad))scale(var(--min,2));opacity:1}} #track > :nth-child(n+16):nth-child(-n+21){--xr1:0;--yr1:-30} .tn0{--wait:1s}.tn1{--wait:1.4s}.tn2{--wait:1.8s}.tn3{--wait:2.2s}.tn4{--wait:2.6s}.tn5{--wait:3s}.tn6{--wait:3.4s}.tn7{--wait:3.8s}.tn8{--wait:4.2s}.tn9{--wait:4.4s}.tn10{--wait:4.8s}.tn11{--wait:5.2s}.tn12{--wait:5.6s}.tn13{--wait:6s}.tn14{--wait:6.4s}.tn15{--wait:6.8s}.tn16{--wait:7.2s}.tn17{--wait:7.6s}.tn18{--wait:8s}.tn19{--wait:8.4s}.tn20{--wait:8.8s}.tn21{--wait:9.2s} #track .tn0{--varY:-12.53756;--vaRZ:3.14}#track .tn1{--varX:3.85316;--varY:-11.9014;--vaRZ:3.454}#track .tn2{--varX:7.32833;--varY:-10.11;--vaRZ:3.768}#track .tn3{--varX:10.08916;--varY:-7.3384;--vaRZ:4.082}#track .tn4{--varX:11.86616;--varY:-3.8544;--vaRZ:4.396}#track .tn5{--varX:12.48616;--vaRZ:4.71}#track .tn6{--varX:11.86616;--varY:3.8544;--vaRZ:5.024}#track .tn7{--varX:10.08916;--varY:7.3384;--vaRZ:5.338}#track .tn8{--varX:7.32833;--varY:10.11;--vaRZ:5.652}#track .tn9{--varX:3.85316;--varY:11.9014;--vaRZ:5.966}#track .tn10{--varY:12.53756;--vaRZ:6.28}#track .tn11{--varY:12.53756;--vaRZ:3.14}#track .tn12{--varX:-3.85316;--varY:11.9014;--vaRZ:3.454}#track .tn13{--varX:-7.32833;--varY:10.11;--vaRZ:3.768}#track .tn14{--varX:-10.08916;--varY:7.3384;--vaRZ:4.082}#track .tn15{--varX:-11.86616;--varY:3.8544;--vaRZ:4.396}#track .tn16{--varX:-12.48616;--vaRZ:4.71}#track .tn17{--varX:-11.86616;--varY:-3.8544;--vaRZ:5.024}#track .tn18{--varX:-10.08916;--varY:-7.3384;--vaRZ:5.338}#track .tn19{--varX:-7.32833;--varY:-10.11;--vaRZ:5.652}#track .tn20{--varX:-3.85316;--varY:-11.9014;--vaRZ:5.966}#track .tn21{--varY:-12.53756;--vaRZ:6.28} .radRing{display:none} #track > :nth-child(n+7):nth-child(-n+14) a{--yr:0} #track > :nth-child(n+16):nth-child(-n+21) a{--scX:.875;--scY:.875} #track section a ::after{--colAft:#0c0c0c;font:6vw/.65 'default'} /* #track section a:not(:hover) :first-child::after{--anim:op2 1s forwards} */ .ringCon > .img,.ring::before{--nLab:translate3d(calc((var(--tX,0) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY,0) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3,1) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)));opacity:var(--op,0)} .ringCon,.ring{--nLab:translate3d(calc((var(--tX,0) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY,0) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3,1) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)));opacity:var(--op,0)} .ringCon{--tO:bottom center;--tX:-8;--tY:-16;--tZ:0;--xR:-4.75;--yR:-60;--zR:170;--sW:-15;--sW2:0;--s3k:-.75;--s3Y:1;--s3:.375;--op:1;--anim:ringCon 2s forwards; visibility:var(--hid,visible);top:-10vw;left:10vw;width:20vw;height:20vw;z-index:auto} @-webkit-keyframes ringCon{0%{-webkit-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{-webkit-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}}@-moz-keyframes ringCon{0%{-moz-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{-moz-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}}@-ms-keyframes ringCon{0%{-ms-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{-ms-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}}@-o-keyframes ringCon{0%{-o-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{-o-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}}@keyframes ringCon{0%{transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}} /* #track section .ringCon:hover{--anim:ringConB 2s forwards;z-index:-1} #track > :nth-child(n+7):nth-child(-n+10) .ringCon:hover{--tXa:0;--tYa:15;--tZa:5;--xRa:54.75;--yRa:0;--zRa:20;--sWa:5;--s3ka:.25} #track > :nth-child(n+16):nth-child(-n+19) .ringCon:hover{--tXa:0;--tYa:1;--tZa:5;--xRa:54.75;--yRa:0;--zRa:20;--sWa:5;--s3ka:.25} */ @-webkit-keyframes ringConB{0%{-webkit-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}100%{-webkit-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}}@-moz-keyframes ringConB{0%{-moz-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}100%{-moz-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}}@-ms-keyframes ringConB{0%{-ms-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}100%{-ms-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}}@-o-keyframes ringConB{0%{-o-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}100%{-o-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}}@keyframes ringConB{0%{transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}100%{transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}} @-webkit-keyframes ringConC{0%{-webkit-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}99.9%{-webkit-animation-play-state:paused}100%{-webkit-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}}@-moz-keyframes ringConC{0%{-moz-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}99.9%{-moz-animation-play-state:paused}100%{-moz-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}}@-ms-keyframes ringConC{0%{-ms-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}99.9%{-ms-animation-play-state:paused}100%{-ms-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}}@-o-keyframes ringConC{0%{-o-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}99.9%{-o-animation-play-state:paused}100%{-o-transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}}@keyframes ringConC{0%{transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}99.9%{animation-play-state:paused}100%{transform:translate3d(calc(var(--tX,0)*1vw),calc(var(--tY,0)*1vw),calc(var(--tZ,0)*1vw))rotateX(calc(var(--xR,0)*1deg))rotateY(calc(var(--yR,0)*1deg))rotate(calc(var(--zR,0)*1deg))skew(calc(var(--sW,0)*1deg),calc(var(--sW2,0)*1deg))scaleX(calc(var(--s3k,1)*var(--n3k,1)))scaleY(calc(var(--s3Y,1)*var(--n3Y,1)))scale(calc(var(--s3,1)*var(--n3,1)))}} /* @-webkit-keyframes ringConB{0%{-webkit-transform:translate3d(calc(var(--tX)*1vw),calc(var(--tY)*1vw),calc(var(--tZ)*1vw))rotateX(calc(var(--xR)*1deg))rotateY(calc(var(--yR)*1deg))rotate(calc(var(--zR)*1deg))skew(calc(var(--sW)*1deg),calc(var(--sW2)*1deg))scaleX(calc(var(--s3k)*var(--n3k,1)))scaleY(calc(var(--s3Y)*var(--n3Y,1)))scale(calc(var(--s3)*var(--n3,1)))} 100%{-webkit-transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}} @-moz-keyframes ringConB{0%{-moz-transform:translate3d(calc(var(--tX)*1vw),calc(var(--tY)*1vw),calc(var(--tZ)*1vw))rotateX(calc(var(--xR)*1deg))rotateY(calc(var(--yR)*1deg))rotate(calc(var(--zR)*1deg))skew(calc(var(--sW)*1deg),calc(var(--sW2)*1deg))scaleX(calc(var(--s3k)*var(--n3k,1)))scaleY(calc(var(--s3Y)*var(--n3Y,1)))scale(calc(var(--s3)*var(--n3,1)))} 100%{-moz-transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}} @-ms-keyframes ringConB{0%{-ms-transform:translate3d(calc(var(--tX)*1vw),calc(var(--tY)*1vw),calc(var(--tZ)*1vw))rotateX(calc(var(--xR)*1deg))rotateY(calc(var(--yR)*1deg))rotate(calc(var(--zR)*1deg))skew(calc(var(--sW)*1deg),calc(var(--sW2)*1deg))scaleX(calc(var(--s3k)*var(--n3k,1)))scaleY(calc(var(--s3Y)*var(--n3Y,1)))scale(calc(var(--s3)*var(--n3,1)))} 100%{-ms-transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}} @-o-keyframes ringConB{0%{-o-transform:translate3d(calc(var(--tX)*1vw),calc(var(--tY)*1vw),calc(var(--tZ)*1vw))rotateX(calc(var(--xR)*1deg))rotateY(calc(var(--yR)*1deg))rotate(calc(var(--zR)*1deg))skew(calc(var(--sW)*1deg),calc(var(--sW2)*1deg))scaleX(calc(var(--s3k)*var(--n3k,1)))scaleY(calc(var(--s3Y)*var(--n3Y,1)))scale(calc(var(--s3)*var(--n3,1)))} 100%{-o-transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}} @keyframes ringConB{0%{transform:translate3d(calc(var(--tX)*1vw),calc(var(--tY)*1vw),calc(var(--tZ)*1vw))rotateX(calc(var(--xR)*1deg))rotateY(calc(var(--yR)*1deg))rotate(calc(var(--zR)*1deg))skew(calc(var(--sW)*1deg),calc(var(--sW2)*1deg))scaleX(calc(var(--s3k)*var(--n3k,1)))scaleY(calc(var(--s3Y)*var(--n3Y,1)))scale(calc(var(--s3)*var(--n3,1)))} 100%{transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}} */ @-webkit-keyframes ringConD{0%{-webkit-transform:translate3d(calc((var(--tX) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}100%{-webkit-transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}}@-moz-keyframes ringConD{0%{-moz-transform:translate3d(calc((var(--tX) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}100%{-moz-transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}}@-ms-keyframes ringConD{0%{-ms-transform:translate3d(calc((var(--tX) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}100%{-ms-transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}}@-o-keyframes ringConD{0%{-o-transform:translate3d(calc((var(--tX) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}100%{-o-transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}}@keyframes ringConD{0%{transform:translate3d(calc((var(--tX) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}100%{transform:translate3d(calc((var(--tX) + var(--tXa,0))*1vw),calc((var(--tY) + var(--tYa,0))*1vw),calc((var(--tZ) + var(--tZa,0))*1vw))rotateX(calc((var(--xR) + var(--xRa,0))*1deg))rotateY(calc((var(--yR) + var(--yRa,0))*1deg))rotate(calc((var(--zR) + var(--zRa,0))*1deg))skew(calc((var(--sW) + var(--sWa,0))*1deg),calc((var(--sW2) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y) + var(--s3Ya,0))*var(--n3Y,1)))scaleZ(calc((var(--s3) + var(--s3a,0))*var(--n3,1)))}} @-webkit-keyframes ringConE{0%{-webkit-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{-webkit-transform:translate3d(calc((var(--tX,0) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY,0) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3,1) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}}@-moz-keyframes ringConE{0%{-moz-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{-moz-transform:translate3d(calc((var(--tX,0) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY,0) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3,1) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}}@-ms-keyframes ringConE{0%{-ms-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{-ms-transform:translate3d(calc((var(--tX,0) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY,0) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3,1) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}}@-o-keyframes ringConE{0%{-o-transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{-o-transform:translate3d(calc((var(--tX,0) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY,0) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3,1) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}}@keyframes ringConE{0%{transform:translate3d(calc((var(--tX,0) + var(--tXa,0))*1vw),calc((var(--tY,0) + var(--tYa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0))*var(--n3Y,1)))scale(calc((var(--s3,1) + var(--s3a,0))*var(--n3,1)))}100%{transform:translate3d(calc((var(--tX,0) + var(--tXa,0) + var(--tXaa,0))*1vw),calc((var(--tY,0) + var(--tYa,0) + var(--tYaa,0))*1vw),calc((var(--tZ,0) + var(--tZa,0) + var(--tZaa,0))*1vw))rotateX(calc((var(--xR,0) + var(--xRa,0) + var(--xRaa,0))*1deg))rotateY(calc((var(--yR,0) + var(--yRa,0) + var(--yRaa,0))*1deg))rotate(calc((var(--zR,0) + var(--zRa,0) + var(--zRaa,0))*1deg))skew(calc((var(--sW,0) + var(--sWa,0) + var(--sWaa,0))*1deg),calc((var(--sW2,0) + var(--sW2a,0) + var(--sW2aa,0))*1deg))scaleX(calc((var(--s3k,1) + var(--s3ka,0) + var(--s3kaa,0))*var(--n3k,1)))scaleY(calc((var(--s3Y,1) + var(--s3Ya,0) + var(--s3Yaa,0))*var(--n3Y,1)))scaleZ(calc((var(--s3,1) + var(--s3a,0) + var(--s3aa,0))*var(--n3,1)))}} @-webkit-keyframes ringConF{0%{-webkit-transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{-webkit-transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}}@-moz-keyframes ringConF{0%{-moz-transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{-moz-transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}}@-ms-keyframes ringConF{0%{-ms-transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{-ms-transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}}@-o-keyframes ringConF{0%{-o-transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{-o-transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}}@keyframes ringConF{0%{transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}} @-webkit-keyframes ringConG{0%{-webkit-transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{-webkit-transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}}@-moz-keyframes ringConG{0%{-moz-transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{-moz-transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}}@-ms-keyframes ringConG{0%{-ms-transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{-ms-transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}}@-o-keyframes ringConG{0%{-o-transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{-o-transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}}@keyframes ringConG{0%{transform:translate3d(calc(var(--riX)*1vw),calc(var(--riY)*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}100%{transform:translate3d(calc((var(--riX) + var(--riXa))*1vw),calc((var(--riY) + var(--riYa))*1vw),calc(var(--riZ)*1vw))rotateX(calc(var(--rtX)*1deg))rotateY(calc(var(--rtY)*1deg))rotateZ(calc(var(--rtZ)*1deg))skew(calc(var(--sKw)*1deg))scaleX(var(--scImg))scaleY(var(--scYmg))}} @-webkit-keyframes op{0%{opacity:1}100%{opacity:var(--op,0)}}@-moz-keyframes op{0%{opacity:1}100%{opacity:var(--op,0)}}@-ms-keyframes op{0%{opacity:1}100%{opacity:var(--op,0)}}@-o-keyframes op{0%{opacity:1}100%{opacity:var(--op,0)}}@keyframes op{0%{opacity:1}100%{opacity:var(--op,0)}} @-webkit-keyframes op2{0%{opacity:var(--op2,0)}100%{opacity:1}}@-moz-keyframes op2{0%{opacity:var(--op2,0)}100%{opacity:1}}@-ms-keyframes op2{0%{opacity:var(--op2,0)}100%{opacity:1}}@-o-keyframes op2{0%{opacity:var(--op2,0)}100%{opacity:1}}@keyframes op2{0%{opacity:var(--op2,0)}100%{opacity:1}} @-webkit-keyframes op3{0%{opacity:1}100%{opacity:0}}@-moz-keyframes op3{0%{opacity:1}100%{opacity:0}}@-ms-keyframes op3{0%{opacity:1}100%{opacity:0}}@-o-keyframes op3{0%{opacity:1}100%{opacity:0}}@keyframes op3{0%{opacity:1}100%{opacity:0}} @-webkit-keyframes op4{0%{opacity:0}100%{opacity:1}}@-moz-keyframes op4{0%{opacity:0}100%{opacity:1}}@-ms-keyframes op4{0%{opacity:0}100%{opacity:1}}@-o-keyframes op4{0%{opacity:0}100%{opacity:1}}@keyframes op4{0%{opacity:var(--op,0)}100%{opacity:1}} .ringCon > .img{--bk:url(R.png);--anim:ringCon 2s forwards,op 2s forwards;--tXa:0;--tYa:-15;--tZ:-5;--tZa:0;--xR:0;--xRa:0;--yR:100;--yRa:0;--zR:0;--zRa:0;--sW:0;--sWa:0;--sW2:0;--sW2a:0;--s3k:1;--s3ka:-1.75;--s3Y:-1;--s3Ya:2;--s3:1;--s3a:0;--op:0;border:none;width:6vw;height:6vw} .ringCon:nth-of-type(1) > .img{--tX:-3;--tXa:-243;--tY:-5;--tYa:55;--yRa:40;--zRa:-70} .ringCon:nth-of-type(2) > .img{--tX:-3;--tY:-28;--zR:-15;--sk3a:2} .ringCon:nth-of-type(3) > .img{--tX:45;--tY:-37;--zR:35;--sW:15;--sk3a:-.125;--sWa:12.5} .ringCon:nth-of-type(4) > .img{--tX:110;--tY:-52;--zR:50;--sW:10;--sk3a:-.125} .ringCon:nth-of-type(5) > .img{--tX:-38;--tY:12.5;--yRa:-130;--zRa:-107.5;--sW:15} .ringCon:nth-of-type(6) > .img{--tX:-41;--tY:31;--yRa:-130;--zRa:-92.5;--sW:15} .ringCon:nth-of-type(7) > .img{--tX:-24;--tY:47;--yRa:-130;--zRa:-75} .ringCon:nth-of-type(8) > .img{--tX:-7;--tY:61.5;--yRa:-130;--zRa:-62.5;--sW:15} /* .ringCon > img R.png */ #track section a:hover ~ .ringCon > .img{--anim:ringConB 2s forwards,op2 2s forwards;--op:1} #track section:nth-child(7) a:hover ~ .ringCon > .img{--tXa:-240;--tYa:62.5;--tZa:-5;--yRa:50;--zRa:109;--s3ka:2.5;--s3Ya:-1.3;--s3a:-.25} #track section:nth-child(8) a:hover ~ .ringCon > .img{--tXa:-220.5;--tYa:52.5;--tZa:-5;--yRa:50;--zRa:127;--s3ka:2.5;--s3Ya:-1.3;--s3a:-.25} #track section:nth-child(9) a:hover ~ .ringCon > .img{--tXa:-195;--tYa:38.75;--tZa:-5;--yRa:50;--zRa:147;--s3ka:2.5;--s3Ya:-1.375;--s3a:-.25} #track section:nth-child(10) a:hover ~ .ringCon > .img{--tXa:-155;--tYa:31.5;--tZa:-5;--yRa:50;--zRa:165;--s3ka:1.75;--s3Ya:-.75} #track section:nth-child(16) a:hover ~ .ringCon > .img{--tXa:-250;--tYa:72.5;--tZa:-5;--xRa:180;--yRa:120;--zRa:75;--sWa:10;--s3ka:.5;--s3Ya:.3;--s3a:1} #track section:nth-child(17) a:hover ~ .ringCon > .img{--tXa:-252;--tYa:87;--tZa:-5;--xRa:180;--yRa:120;--zRa:87.5;--s3ka:.5;--s3Ya:.4;--s3a:1.125} #track section:nth-child(18) a:hover ~ .ringCon > .img{--tXa:-242;--tYa:92;--tZa:-5;--xRa:180;--yRa:120;--zRa:100;--s3ka:2.5;--s3Ya:-.5;--s3a:-.125} #track section:nth-child(19) a:hover ~ .ringCon > .img{--tXa:-229;--tYa:96;--tZa:-5;--xRa:180;--yRa:120;--zRa:110;--sWa:-15;--s3ka:2.5;--s3Ya:-.5;--s3a:-.125} /* .ringCon:hover > img{--lft:5vw;--num:-15;opacity:1} */ .ring::before{top:-.5vw;left:-.5vw;opacity:var(--oP)} .ring{top:-.5vw;left:-.5vw;opacity:var(--oP)} /* opening fire display: --tX:-25;--tY:.25;--tZ:0;--xR:207.5;--yR:125;--zR:11;--sW:14;--s3k:1;--s3Y:.6;--s3Ya:1;--n3k:1;--n3Y:-1;--n3:.75;--s3:1.25;--s3a:1; */ .ring{--tran:transform 1.5s ease-in,opacity 1.5s ease-in;--tX:0;--tY:0;--tZ:0;--xR:0;--yR:0;--zR:0;--sW:0;--sW2:0;--s3k:.16;--s3Y:.135;--s3:.375;--anim:ringCon 2s forwards;width:100%;height:100%;z-index:-1} .ring::before{--op:0;--anim:ringCon 2s forwards,op 1s forwards; width:90%;height:90%;z-index:1;opacity:var(--op); box-shadow:inset .25vw 0 .125vw rgba(0,255,0,.625),inset -.25vw 0 .125vw rgba(0,255,0,.625),inset .375vw 0 1vw red,inset -.375vw 0 1vw red,inset .5vw 0 .375vw orange,inset -.5vw 0 .5vw orange,inset .75vw 0 1vw red,inset -.75vw 0 1vw red, 0 .25vw .125vw rgba(0,255,0,.625),0 -.25vw .125vw rgba(0,255,0,.625),0 .375vw 1vw red,0 -.375vw 1vw red,0 .5vw .375vw orange,0 -.5vw .5vw orange,0 .75vw 1vw red,0 -.75vw 1vw red} /* ;-webkit-filter:url(#wave);-moz-filter:url(#wave);-ms-filter:url(#wave);-o-filter:url(#wave);filter:url(#wave) */ /* #track > section a:not(:hover) ~ .ringCon .ring{} #track > section a:not(:hover) ~ .ringCon .ring::before{} */ #track > :nth-child(n+7):nth-child(-n+10) .ring{--tX:-20;--tY:5;--tZ:0;--xR:197.5;--yR:125;--zR:-5;--sW:35;--s3k:.625;--s3Y:.525;--tXa:-80;--tYa:23;--tZa:0;--xRa:0;--yRa:0;--zRa:-30;--sWa:-29;--s3Ya:.125;--s3a:.125;--s3:1;--op:1} #track > :nth-child(n+16):nth-child(-n+19) .ring{--tX:-20;--tY:4;--tZ:-8;--xR:207.5;--yR:125;--zR:30;--sW:40;--s3k:1.5;--s3Y:.2625;--tXa:5;--tYa:-2;--yRa:-30;--zRa:-65;--sWa:-45;--op:1} #track > :nth-child(7) .ring{--op:.125} #track > :nth-child(8) .ring{--op:.4} #track > :nth-child(9) .ring{--op:.7} #track > :nth-child(17) .ring{--op:.7} #track > :nth-child(18) .ring{--op:.4} #track > :nth-child(19) .ring{--op:.125} #track section a:hover ~ .ringCon .ring{--tYa:-11;--anim:ringConB 2s forwards;opacity:1} #track > :nth-child(n+7):nth-child(-n+10) a:hover ~ .ringCon .ring{--tXa:-20;--tYa:10;--zRa:10;--sWa:-55;--s3Ya:.125;--n3Y:-1;--s3a:.125} #track > :nth-child(n+16):nth-child(-n+19) a:hover ~ .ringCon .ring{--tXa:-5;--zRa:-30;--sWa:-25;--s3ka:.375;--s3Y:1} #track section .ring::before{--tX:0;--tY:0;--tZ:0;--xR:0;--yR:0;--zR:-2.5;--sW:0;--s3k:1;--s3Y:1;--s3:1} #track > :nth-child(7) .ring::before{--tXa:19;--tYa:-49;--tZa:-1;--yRa:-30;--zRa:-65;--s3ka:1.25;--s3Ya:-.625;--s3a:.25} #track > :nth-child(8) .ring::before{--tXa:15;--tYa:-35;--tZa:-4;--yRa:-30;--zRa:-52.5;--s3ka:1;--s3Ya:-.375} #track > :nth-child(9) .ring::before{--tXa:2;--tYa:-8;--yRa:-30;--zRa:-45;--s3ka:.5;--s3Ya:-.125} #track > :nth-child(10) .ring::before{--tXa:-3.5;--tYa:-1.5;--yRa:-30;--zRa:-32.5;--s3ka:.25;--s3Ya:.25} #track > :nth-child(16) .ring::before{--tXa:40;--tYa:-115;--tZa:-2;--yRa:-30;--zRa:-3;--s3ka:-.1;--s3Ya:12} #track > :nth-child(17) .ring::before{--tXa:41;--tYa:-143;--yRa:-10;--zRa:-4;--s3ka:-.125;--s3Ya:12.25} #track > :nth-child(18) .ring::before{--tXa:49;--tYa:-220;--yRa:-30;--zRa:22.5;--s3ka:-.125;--s3Ya:12.125} #track > :nth-child(19) .ring::before{--tXa:52;--tYa:-240;--yRa:-30;--zRa:-70;--s3ka:1.5;--s3Ya:3.25} /* opening fire display: landing fire display: --yR:105;--zR:-32;--sW:-10;--s3k:.95;--s3Y:.75;--s3:.725 .ringCon:hover .ring,.ringCon:hover .ring::before{--rTime:1s;--opT:1s} *//* #track > :nth-child(n+7):hover:nth-child(-n+10) a:hover ~ .ringCon .ring{--tXa:140;--tYa:-20;--zRa:-55;--sW:-15;--s3Ya:.625;--s3:.875;--anim:ringConB 1s forwards} #track > :nth-child(n+16):nth-child(-n+19) a:hover ~ .ringCon .ring{--tXa:-5;--tYa:-14.5;--zRa:-30;--s3Y:1;--anim:ringConB 1s forwards} */ #track section a:hover ~ .ringCon .ring::before{--op:1;--anim:ringConB 2s forwards,op2 1s forwards} /* .ring::before BOX-SHADOW */ #track > :nth-child(7) a:hover ~ .ringCon .ring::before{--tXa:-32;--tYa:64;--tZa:-30;--xRa:-20;--yRa:30;--zRa:20;--sWa:-27;--s3ka:.25;--s3Ya:1.3;--s3a:.75} #track > :nth-child(8) a:hover ~ .ringCon .ring::before{--tXa:-37;--tYa:52;--tZa:-9;--xRa:-30;--yRa:30;--zRa:8.5;--sWa:-10;--s3ka:1.125;--s3Ya:2.5} #track > :nth-child(9) a:hover ~ .ringCon .ring::before{--tXa:-34.75;--tYa:41.625;--xRa:-25;--yRa:30;--zRa:90;--sWa:12.5;--s3ka:-3.5;--s3Ya:1.5} #track > :nth-child(10) a:hover ~ .ringCon .ring::before{--tXa:-31;--tYa:35.375;--xRa:-15;--yRa:12.5;--zRa:-42.5;--sWa:-27;--s3ka:1.25;--s3Ya:.375} #track > :nth-child(16) a:hover ~ .ringCon .ring::before{--tXa:1;--tYa:-144.25;--tZa:0;--xRa:-15;--xRa:4;--yRa:20;--zRa:20;--sWa:20;--s3ka:-.125;--s3Ya:4.625} #track > :nth-child(17) a:hover ~ .ringCon .ring::before{--tXa:-1;--tYa:-143;--xRa:-15;--yRa:-5;--zRa:-3.5;--sWa:3;--s3ka:.125;--s3Ya:3} #track > :nth-child(18) a:hover ~ .ringCon .ring::before{--tXa:-1;--tYa:-154;--xRa:-5;--yRa:-30;--zRa:-20;--sWa:-10;--s3ka:.125;--s3Ya:4.125} #track > :nth-child(19) a:hover ~ .ringCon .ring::before{--tXa:.5;--tYa:-158;--xRa:-15;--yRa:-30;--zRa:-54;--sWa:-35;--s3ka:.25;--s3Ya:2} #track section .ring .img{--bk:url(barFiz.png);--bks:80% 100%;--nLab:translate3d(calc((var(--riX) + var(--riXa,0))*1vw),calc((var(--riY) + var(--riYa,0))*1vw),calc((var(--riZ) + var(--riZa,0))*1vw))rotateX(calc((var(--rtX) + var(--rtXa,0))*1deg))rotateY(calc((var(--rtY) + var(--rtYa,0))*1deg))rotateZ(calc((var(--rtZ) + var(--rtZa,0))*1deg))skew(calc((var(--sKw,0) + var(--sKwa,0))*1deg))scale(var(--scImg),var(--scYmg));--tran:transform 1s var(--rDel,0) ease-in,opacity 3s ease-out;width:87.5%;height:95%;pointer-events:none;opacity:var(--op,1)} #track > :nth-child(n+7):nth-child(-n+10) .ring .img{--riX:1.5;--riY:-1;--rDel:.125s;--riZ:5;--rtX:0;--rtY:0;--rtZ:17;--sKw:0;--scImg:1.25;--scYmg:1;--anim:op 1s forward} #track > :nth-child(7) .ring .img{--op:.125} #track > :nth-child(8) .ring .img{--op:.4} #track > :nth-child(9) .ring .img{--op:.7} #track > :nth-child(8) .ring .img{--rDel:.25s} #track > :nth-child(9) .ring .img{--rDel:.5s} #track > :nth-child(10) .ring .img{--rDel:.75s} #track > :nth-child(n+16):nth-child(-n+19) .ring .img{--riX:-1;--riY:-30;--rDel:.75s;--riZ:-15;--rtX:-20;--rtY:-30;--rtZ:20;--sKw:40;--scImg:2.75;--scYmg:2.625;--anim:op2 1s forward} #track > :nth-child(17) .ring .img{--op:.7} #track > :nth-child(18) .ring .img{--op:.4} #track > :nth-child(19) .ring .img{--op:.125} #track > :nth-child(17) .ring .img{--rDel:.75s} #track > :nth-child(17) .ring .img{--rDel:.875s} #track > :nth-child(18) .ring .img{--rDel:1s} #track > :nth-child(19) .ring .img{--rDel:1.125s} /* .ring img BARFIZ */ #track section a:hover ~ .ringCon .ring .img{--op:1} #track :nth-child(7) a:hover ~ .ringCon .ring .img{--riXa:2;--riYa:17;--riZa:-12.5;--rtYa:40;--rtZa:70;--scImg:1.375;--scYmg:1.25;--op:1} #track :nth-child(8) a:hover ~ .ringCon .ring .img{--riXa:-6.5;--riYa:15;--riZa:-16;--rtZa:10;--scImg:1.125;--scYmg:.875;--op:1} #track :nth-child(9) a:hover ~ .ringCon .ring .img{--riXa:-11;--riYa:9.5;--riZa:-10;--rtXa:40;--rtYa:-10;--rtZa:-10;--sKwa:-20;--scImg:1.125;--scYmg:.75;--op:1} #track :nth-child(10) a:hover ~ .ringCon .ring .img{--riXa:-28.25;--riYa:14;--rtXa:-20;--rtYa:-10;--rtZa:-50;--sKwa:-10;--scImg:1.75;--scYmg:.5;--op:1} #track :nth-child(16) a:hover ~ .ringCon .ring .img{--riXa:6;--riYa:-226;--rtZa:50;--scImg:4;--scYmg:.3;--op:1} #track :nth-child(17) a:hover ~ .ringCon .ring .img{--riXa:-2;--riYa:-240;--rtZa:40;--scImg:3.5;--scYmg:.375;--op:1} #track :nth-child(18) a:hover ~ .ringCon .ring .img{--riXa:-10;--riYa:-247;--rtZa:35;--scImg:3.5;--scYmg:.375;--op:1} #track :nth-child(19) a:hover ~ .ringCon .ring .img{--riXa:-15;--riYa:-235;--rtZa:23;--scImg:2.875;--scYmg:.5;--op:1} #period{width:100%;height:100vh} .ag-sparks{--nLab:translate3d(0,calc(var(--dup,0)*1vw),0);background-size:cover;top:-2vw;left:0;width:100%;height:100%} .ag-lightning{top:0;left:0;bottom:0;right:0} .ag-lightning::before,.ag-lightning::after{background-size:50% 62.5%;background-repeat:no-repeat;top:-3.5vw;left:0;width:50vw;height:100%;opacity:0} .ag-lightning::before{--bK:url(l-2b.png);--tO:0 0;--left:27.5;--anim:anfirst 14s 1s linear 5} .ag-lightning::after{--bK:url(l-1.png);--tO:0 0;--left:42.5;--anim:ansecond 15s linear 5} @-webkit-keyframes anfirst{0%,6.75%{-webkit-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1);opacity:0}6.8%,50%{-webkit-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(2);opacity:1}7.6%,51%,100%{opacity:0}7.7%{-webkit-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.5)}7.8%,49.9%{-webkit-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}}@-moz-keyframes anfirst{0%,6.75%{-moz-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1);opacity:0}6.8%,50%{-moz-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(2);opacity:1}7.6%,51%,100%{opacity:0}7.7%{-moz-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.5)}7.8%,49.9%{-moz-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}}@-ms-keyframes anfirst{0%,6.75%{-ms-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1);opacity:0}6.8%,50%{-ms-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(2);opacity:1}7.6%,51%,100%{opacity:0}7.7%{-ms-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.5)}7.8%,49.9%{-ms-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}}@-o-keyframes anfirst{0%,6.75%{-o-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1);opacity:0}6.8%,50%{-o-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(2);opacity:1}7.6%,51%,100%{opacity:0}7.7%{-o-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.5)}7.8%,49.9%{-o-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}}@keyframes anfirst{0%,6.75%{transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1);opacity:0}6.8%,50%{transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(2);opacity:1}7.6%,51%,100%{opacity:0}7.7%{transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.5)}7.8%,49.9%{transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}} @-webkit-keyframes ansecond{0%,1.5%,2.66%,3.4%,78%,100%{opacity:0}0%,7.8%,76.9%{-webkit-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}1.66%,3.2%,77%{opacity:1}1.66%,77%{-webkit-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.9)}}@-moz-keyframes ansecond{0%,1.5%,2.66%,3.4%,78%,100%{opacity:0}0%,7.8%,76.9%{-moz-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}1.66%,3.2%,77%{opacity:1}1.66%,77%{-moz-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.9)}}@-ms-keyframes ansecond{0%,1.5%,2.66%,3.4%,78%,100%{opacity:0}0%,7.8%,76.9%{-ms-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}1.66%,3.2%,77%{opacity:1}1.66%,77%{-ms-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.9)}}@-o-keyframes ansecond{0%,1.5%,2.66%,3.4%,78%,100%{opacity:0}0%,7.8%,76.9%{-o-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}1.66%,3.2%,77%{opacity:1}1.66%,77%{-o-transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.9)}}@keyframes ansecond{0%,1.5%,2.66%,3.4%,78%,100%{opacity:0}0%,7.8%,76.9%{transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(0)}1.66%,3.2%,77%{opacity:1}1.66%,77%{transform:translate3d(calc(var(--left)*1vw),0,0)scaleY(1.9)}} .nop{--oP:0} #cantainer{--per:200vw;--arrival:36.5;--nLab:translate3d(38vw,15vw,5vw)scale(.5,.75);--anim:arrival 3s 10s forwards;pointer-events:all;cursor:pointer;left:0;top:0;opacity:0} @-webkit-keyframes arrival{0%{-webkit-transform:var(--nLab);opacity:0}100%{-webkit-transform:translate3d(37.5vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}}@-moz-keyframes arrival{0%{-moz-transform:var(--nLab);opacity:0}100%{-moz-transform:translate3d(37.5vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}}@-ms-keyframes arrival{0%{-ms-transform:var(--nLab);opacity:0}100%{-ms-transform:translate3d(37.5vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}}@-o-keyframes arrival{0%{-o-transform:var(--nLab);opacity:0}100%{-o-transform:translate3d(37.5vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}}@keyframes arrival{0%{transform:var(--nLab);opacity:0}100%{transform:translate3d(37.5vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}} /* whatever{--anim:depart;--nLab:translate3d(41.25vw,-100vw,5vw)scale(.25,.375)} */ /* keyframes ' depart ' -->JS Inject ONLY<-- */ @-webkit-keyframes depart{0%{-webkit-transform:translate3d(41.25vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}100%{-webkit-transform:var(--nLab);opacity:0}}@-moz-keyframes depart{0%{-moz-transform:translate3d(41.25vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}100%{-moz-transform:var(--nLab);opacity:0}}@-ms-keyframes depart{0%{-ms-transform:translate3d(41.25vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}100%{-ms-transform:var(--nLab);opacity:0}}@-o-keyframes depart{0%{-o-transform:translate3d(41.25vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}100%{-o-transform:var(--nLab);opacity:0}}@keyframes depart{0%{transform:translate3d(41.25vw,calc(var(--arrival)*1vw),5vw)scale(1,1);opacity:1}100%{transform:var(--nLab);opacity:0}} #can{--nLab:translate3d(0,-20vw,5vw)rotateY(-35deg)scale(.75,1);--anim:bOff 1.5s forwards;cursor:pointer;width:24vw;height:10vw;margin:none;border:none;border-radius:50%;font:3.5vw system-ui,sans-serif;font-weight:bold;opacity:var(--oP,0)} @-webkit-keyframes bOff{100%{-webkit-transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}}@-moz-keyframes bOff{100%{-moz-transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}}@-ms-keyframes bOff{100%{-ms-transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}}@-o-keyframes bOff{100%{-o-transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}}@keyframes bOff{100%{transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}} #can:hover{--anim:bOn 1s forwards} @-webkit-keyframes bOn{0%{-webkit-transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}}@-moz-keyframes bOn{0%{-moz-transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}}@-ms-keyframes bOn{0%{-ms-transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}}@-o-keyframes bOn{0%{-o-transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}}@keyframes bOn{0%{transform:translate3d(0,-20vw,5vw)rotateY(45deg)scale(.75,1)}} #can::before,#can::after{top:0;left:0;width:20vw;height:6vw;border-radius:50%} #can::before{--bK:none;--nLab:translate3d(9%,25%,-1vw);--bShad:inset 0 0 2vw .25vw rgba(139,69,19,1),.25vw .125vw 3vw .25vw rgba(139,69,19,.75)} #can::after{--bK:linear-gradient(to bottom right,transparent 25%,#333 50%,#eee 75%,#333 85%);--nLab:translate3d(200%,200%,0);--anim:can 1.375s cubic-bezier(0,.49,.28,.28); --bShad:inset 0 0 .5vw .5vw rgba(0,0,255,.625),0 0 .5vw .5vw blue;z-index:-2} @-webkit-keyframes can{100%{-webkit-transform:translate3d(-125%,-125%,0)}}@-moz-keyframes can{100%{-moz-transform:translate3d(-125%,-125%,0)}}@-ms-keyframes can{100%{-ms-transform:translate3d(-125%,-125%,0)}}@-o-keyframes can{100%{-o-transform:translate3d(-125%,-125%,0)}}@keyframes can{100%{transform:translate3d(-125%,-125%,0)}} #can:hover::after{--nLab:translate3d(-125%,-125%,0);--anim:canB 1.5s cubic-bezier(0,.49,.28,.28)}/* cubic-bezier(.36,-.38,0,1.35) */ @-webkit-keyframes canB{100%{-webkit-transform:translate3d(200%,200%,0)}}@-moz-keyframes canB{100%{-moz-transform:translate3d(200%,200%,0)}}@-ms-keyframes canB{100%{-ms-transform:translate3d(200%,200%,0)}}@-o-keyframes canB{100%{-o-transform:translate3d(200%,200%,0)}}@keyframes canB{100%{transform:translate3d(200%,200%,0)}} #can div{width:18.5vw;height:5vw;cursor:pointer;opacity:1} #can .eH{--left:1vw;--wow:1.5;--nLab:translate3d(calc(var(--left)*1vw),-3vw,8.5vw)rotateY(0)scale(var(--wow),1);z-index:-1} #electric svg{top:3vw;left:0;width:calc(var(--wid,20)*1vw);fill:none} .electric{top:0;left:-1vw} .noshow{opacity:1} /*svg .blue:nth-of-type(1),.handle::after{-webkit-filter:blur(.0625vw);-moz-filter:blur(.0625vw);-ms-filter:blur(.0625vw);-o-filter:blur(.0625vw);filter:blur(.0625vw)}*/ .yellow,.blue{--anim:dash var(--ybT,4.5s) ease-in-out infinite alternate;width:85%;height:var(--height,90%);stroke-dashoffset:200;stroke-dasharray:500} .yellow{--ybT:3.5s} @-webkit-keyframes dash{0%{-webkit-transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:400}100%{-webkit-transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:-1600}}@-moz-keyframes dash{0%{-moz-transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:400}100%{-moz-transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:-1600}}@-ms-keyframes dash{0%{-ms-transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:400}100%{-ms-transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:-1600}}@-o-keyframes dash{0%{-o-transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:400}100%{-o-transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:-1600}}@keyframes dash{0%{transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:400}100%{transform:translate3d(calc(var(--left)*1vw),-6vw,1vw)scale(2,1);stroke-dashoffset:-1600}} #can > :nth-child(2),#can > :nth-child(2)::after{--nLab:translate3d(2vw,-3vw,1vw);pointer-events:all;color:white;z-index:1} #can > :nth-child(2)::after{--anim:op2 1s forwards;content:'ORDER UP';left:0;width:width:24vw;height:100%;z-index:2;opacity:1} #can:hover .eH ~ div{opacity:1} #can:hover .eH ~ div::after{--nLab:translate3d(2vw,-3vw,1vw);--anim:op2 1s forwards} #nameSake,#dreamHorse,#window,#window ul,.iiiD,#cup1,#cup1::after,.tiff,.drgnSteam,.plate,.plate::before,.plate::after,.handle,.handle::after,#gauge{top:0;left:0} #nameSake{--nLab:translate3d(56vw,-31vw,0)scale(.875);width:30vw;height:30vw} @-webkit-keyframes sake{99.9%{-webkit-transform:translate3d(60vw,-90vw,1vw)scale(0);pointer-events:none}100%{display:none}}@-moz-keyframes sake{99.9%{-moz-transform:translate3d(60vw,-90vw,1vw)scale(0);pointer-events:none}100%{display:none}}@-ms-keyframes sake{99.9%{-ms-transform:translate3d(60vw,-90vw,1vw)scale(0);pointer-events:none}100%{display:none}}@-o-keyframes sake{99.9%{-o-transform:translate3d(60vw,-90vw,1vw)scale(0);pointer-events:none}100%{display:none}}@keyframes sake{99.9%{transform:translate3d(60vw,-90vw,1vw)scale(0);pointer-events:none}100%{display:none}} /* ... DREAMHORSE ... .dH{--scdH:.75} .dHw{--dh:-20;--dH:30;--startX:-5;--endX:-1;--wop:1;--oP:1} */ #dreamHorse{--per:200vw;--nLab:translate3d(0,12.5vw,0)scale(.75);z-index:2} #window{--nLab:translate3d(-20vw,30vw,0)rotateX(0)rotateY(0)} #window ul{list-style:none outside none} .iiiD{--per:25vw;--tX:4.5;--tY:28;--anim:wings 4s 6s cubic-bezier(0,.55,.47,.9) both} .iiiD:nth-child(1){--nLab:translate3d(7vw,42vw,-5vw)rotateX(-30deg)rotateY(-158deg)rotate(70deg)scale(.375,.5);--wAT:12vw,81vw,-60vw;--rahX:-77;--rahY:-185;--rahZ:30} .iiiD:nth-child(2){--nLab:translate3d(6.25vw,48vw,-5vw)rotateX(5deg)rotateY(162deg)rotate(-100deg)scale(.3,.3);--wAT:5vw,88vw,-60vw;--rahX:-50;--rahY:195;--rahZ:-170} @-webkit-keyframes wings{50%{-webkit-transform:translate3d(var(--wAT))rotateX(calc(var(--rahX)*1deg))rotateY(calc(var(--rahY)*1deg))rotate(calc(var(--rahZ)*1deg))scale(.25,.25)}}@-moz-keyframes wings{50%{-moz-transform:translate3d(var(--wAT))rotateX(calc(var(--rahX)*1deg))rotateY(calc(var(--rahY)*1deg))rotate(calc(var(--rahZ)*1deg))scale(.25,.25)}}@-ms-keyframes wings{50%{-ms-transform:translate3d(var(--wAT))rotateX(calc(var(--rahX)*1deg))rotateY(calc(var(--rahY)*1deg))rotate(calc(var(--rahZ)*1deg))scale(.25,.25)}}@-o-keyframes wings{50%{-o-transform:translate3d(var(--wAT))rotateX(calc(var(--rahX)*1deg))rotateY(calc(var(--rahY)*1deg))rotate(calc(var(--rahZ)*1deg))scale(.25,.25)}}@keyframes wings{50%{transform:translate3d(var(--wAT))rotateX(calc(var(--rahX)*1deg))rotateY(calc(var(--rahY)*1deg))rotate(calc(var(--rahZ)*1deg))scale(.25,.25)}} .dHorse,.dHorse li{z-index:1} .dHorse{--anim:oA 4s 2.5s cubic-bezier(.18,1,.26,.53) forwards;opacity:0} .dHorse:nth-of-type(1){--aLab:translate3d(0,8.33vw,0)rotateY(180deg)rotateZ(-180deg)translateZ(8.33vw);--bLab:translate3d(0,8.33vw,0)rotateY(77deg)rotateZ(20deg)translateZ(8.33vw)} .dHorse:nth-of-type(2){--aLab:translate3d(0,8.33vw,0)rotateY(180deg)rotateZ(-180deg)translateZ(8.33vw);--bLab:translate3d(8.33vw,4.33vw,0)rotateY(60deg)rotateZ(25deg)translateZ(-8.33vw)} @-webkit-keyframes oA{0%{-webkit-transform:var(--aLab);opacity:0}90%{opacity:0}100%{-webkit-transform:var(--bLab);opacity:1}}@-moz-keyframes oA{0%{-moz-transform:var(--aLab);opacity:0}90%{opacity:0}100%{-moz-transform:var(--bLab);opacity:1}}@-ms-keyframes oA{0%{-ms-transform:var(--aLab);opacity:0}90%{opacity:0}100%{-ms-transform:var(--bLab);opacity:1}}@-o-keyframes oA{0%{-o-transform:var(--aLab);opacity:0}90%{opacity:0}100%{-o-transform:var(--bLab);opacity:1}}@keyframes oA{0%{transform:var(--aLab);opacity:0}90%{opacity:0}100%{transform:var(--bLab);opacity:1}} .dHorse :nth-child(-n+24){--nLab:translate3d(calc(var(--tX)*1vw),calc(var(--tY)*1vw),0)rotateY(calc(var(--w,0)*15deg))translateZ(calc(var(--tZ,.7)*14vw))scaleY(var(--scliY,.5))scale(var(--scli,-2)); --bK:to bottom,rgba(30,87,153,1) 0%,rgba(125,185,232,0) 100%;--zI:auto;background:-webkit-linear-gradient(var(--bK));background:-moz-linear-gradient(var(--bK));background:-ms-linear-gradient(var(--bK));background:-o-linear-gradient(var(--bK));background:linear-gradient(var(--bK));-ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e5799',endColorstr='#007db9e8',GradientType=0); width:calc(var(--tZ,.7)*1.925vw);height:auto;border-style:dotted none groove;border-top-color:rgba(255,103,0,1); border-bottom-color:#00b5fe;border-width:1vw 0 1vw 0;z-index:var(--zI)}/* #ff6700 */ .dHorse :nth-child(2){--w:1}.dHorse :nth-child(3){--w:2}.dHorse :nth-child(4){--w:3}.dHorse :nth-child(5){--w:4}.dHorse :nth-child(6){--w:5}.dHorse :nth-child(7){--w:6}.dHorse :nth-child(8){--w:7}.dHorse :nth-child(9){--w:8}.dHorse :nth-child(10){--w:9}.dHorse :nth-child(11){--w:10}.dHorse :nth-child(12){--w:11}.dHorse :nth-child(13){--w:12}.dHorse :nth-child(14){--w:13}.dHorse :nth-child(15){--w:14}.dHorse :nth-child(16){--w:15}.dHorse :nth-child(17){--w:16}.dHorse :nth-child(18){--w:17}.dHorse :nth-child(19){--w:18}.dHorse :nth-child(20){--w:19}.dHorse :nth-child(21){--w:20}.dHorse :nth-child(22){--w:21}.dHorse :nth-child(23){--w:22}.dHorse :nth-child(24){--w:23} .dHorse :nth-child(n+1):nth-child(n+9){--tran:transform .5s calc(var(--dHdel,0)*1s),opacity .5s calc(var(--dHdel)*1s);overflow:hidden;background-size:cover;opacity:0} .dHorse :nth-child(25),.dHorse :last-child{background:red;width:5vw;height:5vw;opacity:1}/* --fRot:none;--anim:wingshadow 3s 2.25s ease-in 2; */ .dHorse ::before,.dHorse ::after{--anim:none;width:100%;height:100%;border-style:double none dotted;border-width:4vw 0 1vw;border-color:rgba(255,103,0,.5);border-bottom-color:#00b5fe} .dHorse ::before{--tO:0 4.5vw;--nLab:translate3d(0,-15vw,calc(var(--dHb,-3)*1vw))rotateX(90deg)scale(calc(2*var(--un,1)),2);--tran:transform 1s calc(var(--dHdel,0)*1s) linear,opacity 2s calc(var(--dHdel)*1s) linear;background-size:cover;border-image:url(blank.png);box-shadow:0 0 .66vw .16vw rgba(255,103,0,.8);border-radius:10%;opacity:var(--op,.5)} .dHorse ::after{--tO:0 -4.5vw;--nLab:translate3d(0,0,-6vw)rotateX(0)} #cantainer:hover ~ #nameSake .dHorse :nth-child(-n+9)::before{--dHb:-2;--op:1} .dHorse :nth-child(8)::before{--un:-1;--zI:-1;background:url(51GrSL.gif) no-repeat 50% -75%,#000;background-size:cover;top:-6.5vw;width:.75vw;height:2vw;padding-top:var(--pTop,2.5vw);border-radius:50%;opacity:1} .dHorse:nth-of-type(2) :nth-child(8)::before{--zI:-3} .dHorse :nth-child(25)::before,.dHorse :nth-child(25)::after,.dHorse :last-child::before,.dHorse :last-child::after{display:none} /* @-webkit-keyframes wingshadow{50%{-webkit-filter:var(--fRot)}}@-moz-keyframes wingshadow{50%{-moz-filter:var(--fRot)}}@-ms-keyframes wingshadow{50%{-ms-filter:var(--fRot)}}@-o-keyframes wingshadow{50%{-o-filter:var(--fRot)}}@keyframes wingshadow{50%{filter:var(--fRot)}} */ #cup1{--endX:-5;--midX:35;--nLab:translate3d(-2vw,-25vw,1vw);--anim:cup1a 4.75s 2.5s forwards;width:20vw;height:10vw;background:linear-gradient(245deg,#ddd 0,gray .5%,white 100%),url(white.png);background-size:cover, cover;top:0;left:0;z-index:-1;border-radius:70% 70%;border-top-left-radius:70% 27.733%;border-top-right-radius:70% 27.733%;box-shadow:-.625vw 0 1.25vw #eee} @-webkit-keyframes cup1a{100%{-webkit-transform:translate3d(calc(var(--endX)*1vw),calc(var(--midX)*1vw),1vw)scale(1.375)}}@-moz-keyframes cup1a{100%{-moz-transform:translate3d(calc(var(--endX)*1vw),calc(var(--midX)*1vw),1vw)scale(1.375)}}@-ms-keyframes cup1a{100%{-ms-transform:translate3d(calc(var(--endX)*1vw),calc(var(--midX)*1vw),1vw)scale(1.375)}}@-o-keyframes cup1a{100%{-o-transform:translate3d(calc(var(--endX)*1vw),calc(var(--midX)*1vw),1vw)scale(1.375)}}@keyframes cup1a{100%{transform:translate3d(calc(var(--endX)*1vw),calc(var(--midX)*1vw),1vw)scale(1.375)}} /* ... CUP w/ DRAGON and PERCENT ... @-webkit-keyframes cup1b{0%{-webkit-transform:translate3d(calc(var(--endX,0)*1vw),26vw,15vw)}100%{-webkit-transform:translate3d(calc(var(--startX,0)*1vw),0,15vw)}}@-moz-keyframes cup1b{0%{-moz-transform:translate3d(calc(var(--endX,0)*1vw),26vw,15vw)}100%{-moz-transform:translate3d(calc(var(--startX,0)*1vw),0,15vw)}}@-ms-keyframes cup1b{0%{-ms-transform:translate3d(calc(var(--endX,0)*1vw),26vw,15vw)}100%{-ms-transform:translate3d(calc(var(--startX,0)*1vw),0,15vw)}}@-o-keyframes cup1b{0%{-o-transform:translate3d(calc(var(--endX,0)*1vw),26vw,15vw)}100%{-o-transform:translate3d(calc(var(--startX,0)*1vw),0,15vw)}}@keyframes cup1b{0%{transform:translate3d(calc(var(--endX,0)*1vw),26vw,15vw)}100%{transform:translate3d(calc(var(--startX,0)*1vw),0,15vw)}} */ #cup1::after{background:linear-gradient(-6deg,black 1%,rgba(126,89,39,1) 68%,rgba(237,152,60,1) 100%);width:17vw;height:2.45vw;top:.25vw;left:1vw;border:solid rgba(126,92,39,1);border-radius:65% 65% 57.5% 57.5%} .tiff{--nLab:translate3d(1.5vw,.45vw,.1vw)scaleY(.325);--anim:op2 3s 11s forwards;pointer-events:all;background:transparent;background-size:auto auto;width:16.75vw;height:7.5vw;border-radius:50%;opacity:0;z-index:auto} #cantainer:hover ~ #nameSake .drgnSteam{--op:.75} .drgnSteam{--nLab:translate3d(3vw,.075vw,1vw)rotateX(0)scale(1.25,1);--anim:op2 5s 7.5s cubic-bezier(.94,.80,.85,1) forwards;--fil:blur(.0625vw);width:100%;height:100%;opacity:0;z-index:1} .drgn{--nLab:translate3d(0,-.2vw,0)rotateX(75deg);--tran:opacity 3s;opacity:var(--op,1);fill:tan} .plate{--nLab:translate3d(-.5vw,15.5vw,-16vw)rotateX(-64deg)rotateY(.5deg)rotate(0)scale(1.5);background:#FFFAFA;width:100%;height:100%;z-index:-1;box-shadow:inset 0 .416vw .25vw 0 rgba(255,255,255,.5),inset 0 -.416vw .25vw 0 rgba(0,0,0,.78),inset .25vw 0 .16vw 0 rgba(0,0,0,.25),inset -.25vw 0 .16vw 0 rgba(0,0,0,.25),inset 0 .416vw 3.83vw 0 rgba(0,0,0,.4),0 -3.083vw 2.416vw 0 rgba(255,69,0,.75)} .plate::before{top:1vw;left:1.75vw;bottom:1vw;right:1.75vw;box-shadow:inset 0 0 .33vw .25vw white,inset 0 .66vw 1.33vw .33vw rgba(0,0,0,.25)} .plate::after{top:2.75vw;left:5.25vw;bottom:2.75vw;right:5vw;box-shadow:0 0 .33vw .25vw tan,inset 0 .66vw 1.33vw .33vw rgba(0,0,0,.3)} .handle{opacity:inherit} .handle::after{--nLab:translate3d(19vw,-5.25vw,-1vw)scaleX(-1)skew(10deg);width:1.225vw;height:1.5vw;border:solid #808080 1.4vw;border-top-left-radius:11vw 12.5vw;border-bottom-left-radius:25.416vw 25vw;border-top-right-radius:3.75vw .416vw;border-bottom-right-radius:3.75vw .416vw;box-shadow:-.416vw .833vw 1.66vw #444} #cup1 #end{--dShad:.5vw .5vw .25vw #794513;background:url(crest2.png) no-repeat;background-size:100% 52.5%;top:3.75vw;left:2.5vw;width:15vw;height:10vw;opacity:.75;-webkit-filter:drop-shadow(var(--dShad));-moz-filter:drop-shadow(var(--dShad));-ms-filter:drop-shadow(var(--dShad));-o-filter:drop-shadow(var(--dShad));filter:drop-shadow(var(--dShad))} #gauge{--nLab:translate3d(-10.75vw,38.25vw,5vw);--fil:grayscale(50%);--tran:filter 2s;width:100%;max-width:20vw;opacity:var(--op,1);z-index:1} #cantainer:hover ~ #nameSake #gauge{--fil:grayscale(0)} /* .gaugeA{--nLab:translate3d(0,0,0);background:none;background-size:100% 65%;background-repeat:no-repeat;width:10vw;height:10vw;-webkit-filter:blur(var(--blur));-moz-filter:blur(var(--blur));-ms-filter:blur(var(--blur));-o-filter:blur(var(--blur));filter:blur(var(--blur));z-index:1} --nLab:translate3d(calc(var(--gBb,4)*1vw),5vw,3vw)rotateX(-25deg)rotateY(0)rotate(0)scale(var(--gfSc,.25)); */ #gauge .fS{--left:-2.25vw;--top:-1.5;--left2:-.25vw;--oP:0;--op:0;--nLab:translate3d(var(--left),calc(var(--top)*1vw),-25vw)rotateX(5deg)rotateY(10deg)scale(var(--gfSc,1)); --bez:cubic-bezier(0,.84,0,1.08);--anim:oPost var(--time,1s) var(--bez) calc(var(--aDelay)*1s) var(--forks,forwards) var(--even,normal); width:5vw;height:5vw;left:0;top:30vw;font:4.5vw/.65 'default';opacity:0} #gauge .fS:nth-of-type(even){--even:reverse} #gauge .fS:last-child{--left:-2.5vw;--top:6;--time:.5s;--bez:linear;--oP:1;--op:0;--even:reverse} #gauge .last{--gfSc:1.25} #gauge .fS ::after{--nLab:translate3d(0,0,0);--bClip:url(51GrS.gif);line-height:1.3;background:var(--bClip);background-size:cover;background-position:55%;top:0;width:425%;height:150%;font-weight:900;color:transparent;opacity:var(--op,0);-webkit-background-clip:text;-moz-background-clip:text;-ms-background-clip:text;-o-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;-moz-text-fill-color:transparent;-ms-text-fill-color:transparent;-o-text-fill-color:transparent;text-fill-color:transparent} @-webkit-keyframes oPost{0%{opacity:var(--oP,0);-webkit-transform:translate3d(var(--left),calc((var(--top) - 7.5)*1vw),5vw)rotateX(5deg)rotateY(10deg)}65%{-webkit-transform:translate3d(var(--left),calc(var(--top)*1vw),5vw)rotate(0)scale(var(--gfSc,1));opacity:.75}100%{-webkit-transform:translate3d(calc(var(--left) + var(--left2)),calc(var(--top)*1vw),25vw)rotateX(5deg)rotateY(10deg)scale(var(--gfSc,1));opacity:var(--op)}}@-moz-keyframes oPost{0%{opacity:var(--oP,0);-moz-transform:translate3d(var(--left),calc((var(--top) - 7.5)*1vw),5vw)rotateX(5deg)rotateY(10deg)}65%{-moz-transform:translate3d(var(--left),calc(var(--top)*1vw),5vw)rotate(0)scale(var(--gfSc,1));opacity:.75}100%{-moz-transform:translate3d(calc(var(--left) + var(--left2)),calc(var(--top)*1vw),25vw)rotateX(5deg)rotateY(10deg)scale(var(--gfSc,1));opacity:var(--op)}}@-ms-keyframes oPost{0%{opacity:var(--oP,0);-ms-transform:translate3d(var(--left),calc((var(--top) - 7.5)*1vw),5vw)rotateX(5deg)rotateY(10deg)}65%{-ms-transform:translate3d(var(--left),calc(var(--top)*1vw),5vw)rotate(0)scale(var(--gfSc,1));opacity:.75}100%{-ms-transform:translate3d(calc(var(--left) + var(--left2)),calc(var(--top)*1vw),25vw)rotateX(5deg)rotateY(10deg)scale(var(--gfSc,1));opacity:var(--op)}}@-o-keyframes oPost{0%{opacity:var(--oP,0);-o-transform:translate3d(var(--left),calc((var(--top) - 7.5)*1vw),5vw)rotateX(5deg)rotateY(10deg)}65%{-o-transform:translate3d(var(--left),calc(var(--top)*1vw),5vw)rotate(0)scale(var(--gfSc,1));opacity:.75}100%{-o-transform:translate3d(calc(var(--left) + var(--left2)),calc(var(--top)*1vw),25vw)rotateX(5deg)rotateY(10deg)scale(var(--gfSc,1));opacity:var(--op)}}@keyframes oPost{0%{opacity:var(--oP,0);transform:translate3d(var(--left),calc((var(--top) - 7.5)*1vw),5vw)rotateX(5deg)rotateY(10deg)}65%{transform:translate3d(var(--left),calc(var(--top)*1vw),5vw)rotate(0)scale(var(--gfSc,1));opacity:.75}100%{transform:translate3d(calc(var(--left) + var(--left2)),calc(var(--top)*1vw),25vw)rotateX(5deg)rotateY(10deg)scale(var(--gfSc,1));opacity:var(--op)}} /* ... PLUSH DOORS ... */ .plush{--anim:myan 4s ease-out var(--dir);width:100vw;height:100vh;text-align:center;opacity:0} .run,.rerun{--bK:radial-gradient(hsl(45,100%,50%)4.5%,hsl(0,100%,18%)9%,hsla(0,100%,20%,0)9%)0 0,radial-gradient(hsl(45,100%,50%)5.125%,hsl(0,100%,18%)8%,hsla(0,100%,20%,0)5%)4.16vw 4.16vw,radial-gradient(hsla(0,100%,30%,.3)20%,hsla(0,100%,20%,0))4.16vw 0,radial-gradient(hsla(0,100%,30%,.3)20%,hsla(0,100%,20%,0))0 4.16vw,radial-gradient(hsla(0,100%,20%,1)35%,hsla(0,100%,20%,0)60%)4.16vw 0,radial-gradient(hsla(0,100%,20%,1)35%,hsla(0,100%,20%,0)60%)8.33vw 4.16vw,radial-gradient(hsla(0,100%,15%,.45),hsla(0,100%,20%,0))0 0,radial-gradient(hsla(0,100%,15%,.45),hsla(0,100%,20%,0))4.16vw 4.16vw,linear-gradient(45deg,hsla(0,100%,20%,0)49%,hsla(0,100%,0%,1)50%,hsla(0,100%,20%,0)70%)0 0,linear-gradient(-45deg,hsla(0,100%,20%,0)49%,hsla(0,100%,0%,1)50%,hsla(0,100%,20%,0)70%)0 0;--mask:radial-gradient(circle 37.5vw at var(--way) 25vw,transparent 90%,#fff 100%);--dir:forwards;background-color:#300;background-size:8.5875vw 8.5875vw;width:inherit;height:inherit} .run{--way:left;left:0} /* cubic-bezier(0,.9,.3,1)ease-in-out */ .rerun{--way:right;--one:-1;right:0} @-webkit-keyframes myan{0%{opacity:0;-webkit-transform:translate3d(calc(var(--one,1)*100%),0,0)}100%{opacity:1;-webkit-transform:translate3d(calc(var(--one,1)*50%),0,0)}}@-moz-keyframes myan{0%{opacity:0;-moz-transform:translate3d(calc(var(--one,1)*100%),0,0)}100%{opacity:1;-moz-transform:translate3d(calc(var(--one,1)*50%),0,0)}}@-ms-keyframes myan{0%{opacity:0;-ms-transform:translate3d(calc(var(--one,1)*100%),0,0)}100%{opacity:1;-ms-transform:translate3d(calc(var(--one,1)*50%),0,0)}}@-o-keyframes myan{0%{opacity:0;-o-transform:translate3d(calc(var(--one,1)*100%),0,0)}100%{opacity:1;-o-transform:translate3d(calc(var(--one,1)*50%),0,0)}}@keyframes myan{0%{opacity:0;transform:translate3d(calc(var(--one,1)*100%),0,0)}100%{opacity:1;transform:translate3d(calc(var(--one,1)*50%),0,0)}} /* keyframes ' mybn ' -->JS Inject ONLY<-- */ @-webkit-keyframes mybn{0%{opacity:1;-webkit-transform:translate3d(calc(var(--one,1)*50%),0,0)}100%{opacity:0;-webkit-transform:translate3d(calc(var(--one,1)*100%),0,0)}}@-moz-keyframes mybn{0%{opacity:1;-moz-transform:translate3d(calc(var(--one,1)*50%),0,0)}100%{opacity:0;-moz-transform:translate3d(calc(var(--one,1)*100%),0,0)}}@-ms-keyframes mybn{0%{opacity:1;-ms-transform:translate3d(calc(var(--one,1)*50%),0,0)}100%{opacity:0;-ms-transform:translate3d(calc(var(--one,1)*100%),0,0)}}@-o-keyframes mybn{0%{opacity:1;-o-transform:translate3d(calc(var(--one,1)*50%),0,0)}100%{opacity:0;-o-transform:translate3d(calc(var(--one,1)*100%),0,0)}}@keyframes mybn{0%{opacity:1;transform:translate3d(calc(var(--one,1)*50%),0,0)}100%{opacity:0;transform:translate3d(calc(var(--one,1)*100%),0,0)}} #cantainer:hover ~ #track .fS :first-child,#cantainer:hover ~ #track .fS :first-child::after{--anim:op4 1s calc(var(--aDel)*1s) forwards;opacity:1} #cantainer:hover ~ #track > :nth-child(n+7):nth-child(-n+10) .ring .img{--rtZ:22.5;--scYmg:.875} #cantainer:hover ~ #track > :nth-child(7) .ring .img{--riXa:4;--riYa:-2;--op:1} #cantainer:hover ~ #track > :nth-child(8) .ring .img{--riXa:7;--riYa:-5;--op:1} #cantainer:hover ~ #track > :nth-child(9) .ring .img{--riXa:10;--riYa:-9;--op:1} #cantainer:hover ~ #track > :nth-child(10) .ring .img{--riXa:3;--riYa:-18;--op:1} #cantainer:hover ~ #track > :nth-child(n+16):nth-child(-n+19) .ring .img{--rtZa:5;--scImg:2.625;--scYmg:1.75} #cantainer:hover ~ #track > :nth-child(16) .ring .img{--riXa:-2;--riYa:-50;--op:1} #cantainer:hover ~ #track > :nth-child(17) .ring .img{--riXa:28;--riYa:-25;--op:1} #cantainer:hover ~ #track > :nth-child(18) .ring .img{--riXa:34;--riYa:-48;--op:1} #cantainer:hover ~ #track > :nth-child(19) .ring .img{--riXa:30;--riYa:-66;--op:1} /* .tn0{--wait:3s} .tn1{--wait:3.3s} .tn2{--wait:3.6s} .tn3{--wait:3.9s} .tn4{--wait:4.2s} .tn5{--wait:4.5s} .tn6{--wait:4.8s} .tn7{--wait:5.1s} .tn8{--wait:5.4s} .tn9{--wait:5.7s} .tn10{--wait:6s} .tn11{--wait:6.3s} .tn12{--wait:6.6s} .tn13{--wait:6.9s} .tn14{--wait:7.2s} .tn15{--wait:7.5s} .tn16{--wait:7.8s} .tn17{--wait:8.1s} .tn18{--wait:8.4s} .tn19{--wait:8.7s} .tn20{--wait:9s} .tn21{--wait:9.3s} */ /* .tn0{--varY:-12.53756;--vaRZ:6.28} .tn1{--varX:-3.85316;--varY:-11.9014;--vaRZ:5.966} .tn2{--varX:-7.32833;--varY:-10.11;--vaRZ:5.652} .tn3{--varX:-10.08916;--varY:-7.3384;--vaRZ:5.338} .tn4{--varX:-11.86616;--varY:-3.8544;--vaRZ:5.024} .tn5{--varX:-12.48616;--vaRZ:4.71} .tn6{--varX:-11.86616;--varY:3.8544;--vaRZ:4.396} .tn7{--varX:-10.08916;--varY:7.3384;--vaRZ:4.082} .tn8{--varX:-7.32833;--varY:10.11;--vaRZ:3.768} .tn9{--varX:-3.85316;--varY:11.9014;--vaRZ:3.454} .tn10{--varY:12.53756;--vaRZ:3.14} .tn11{--varY:12.53756;--vaRZ:6.28} .tn12{--varX:3.85316;--varY:11.9014;--vaRZ:5.966} .tn13{--varX:7.32833;--varY:10.11;--vaRZ:5.652} .tn14{--varX:10.08916;--varY:7.3384;--vaRZ:5.338} .tn15{--varX:11.86616;--varY:3.8544;--vaRZ:5.024} .tn16{--varX:12.48616;--vaRZ:4.71} .tn17{--varX:11.86616;--varY:-3.8544;--vaRZ:4.396} .tn18{--varX:10.08916;--varY:-7.3384;--vaRZ:4.082} .tn19{--varX:7.32833;--varY:-10.11;--vaRZ:3.768} .tn20{--varX:3.85316;--varY:-11.9014;--vaRZ:3.454} .tn21{--varY:-12.53756;--vaRZ:3.14} */ /* .tn0,#track section.tn21{--varY:-12.53756;--vaRZ:6.28} .tn1,#track section.tn20{--varX:-3.85316;--varY:-11.9014;--vaRZ:5.966} .tn2,#track section.tn19{--varX:-7.32833;--varY:-10.11;--vaRZ:5.652} .tn3,#track section.tn18{--varX:-10.08916;--varY:-7.3384;--vaRZ:5.338} .tn4,#track section.tn17{--varX:-11.86616;--varY:-3.8544;--vaRZ:5.024} .tn5,#track section.tn16{--varX:-12.48616;--vaRZ:4.71} .tn6,#track section.tn15{--varX:-11.86616;--varY:3.8544;--vaRZ:4.396} .tn7,#track section.tn14{--varX:-10.08916;--varY:7.3384;--vaRZ:4.082} .tn8,#track section.tn13{--varX:-7.32833;--varY:10.11;--vaRZ:3.768} .tn9,#track section.tn12{--varX:-3.85316;--varY:11.9014;--vaRZ:3.454} .tn10,#track section.tn11{--varY:12.53756;--vaRZ:3.14} .tn11,#track section.tn10{--varY:12.53756;--vaRZ:6.28} .tn12,#track section.tn9{--varX:3.85316;--varY:11.9014;--vaRZ:5.966} .tn13,#track section.tn8{--varX:7.32833;--varY:10.11;--vaRZ:5.652} .tn14,#track section.tn7{--varX:10.08916;--varY:7.3384;--vaRZ:5.338} .tn15,#track section.tn6{--varX:11.86616;--varY:3.8544;--vaRZ:5.024} .tn16,#track section.tn5{--varX:12.48616;--vaRZ:4.71} .tn17,#track section.tn4{--varX:11.86616;--varY:-3.8544;--vaRZ:4.396} .tn18,#track section.tn3{--varX:10.08916;--varY:-7.3384;--vaRZ:4.082} .tn19,#track section.tn2{--varX:7.32833;--varY:-10.11;--vaRZ:3.768} .tn20,#track section.tn1{--varX:3.85316;--varY:-11.9014;--vaRZ:3.454} .tn21,#track section.tn0{--varY:-12.53756;--vaRZ:3.14} */