.anim-circle{border-radius:50%;background-color:#ce0e2d;width:100%;height:0;padding-bottom:100%;position:relative;overflow:hidden}.anim-circle.blue{background-color:#31add6}.anim-circle .title-area{position:absolute;left:50%;top:23%;text-align:center;text-transform:uppercase;color:#fff;transform:translate(-50%,-50%)}.anim-circle .animation{width:60%;height:0;padding-bottom:50%;position:absolute;transform:translate(-50%);left:50%;top:37%;overflow:hidden;text-align:center;transition:left .3s linear}.anim-circle .abs-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.anim-circle .pic-switch{position:absolute;top:0;left:0;width:100%;height:100%}.anim-circle .pic-switch.big img{width:112%}.anim-circle .pic-switch img{display:block;width:90%;max-height:110%;opacity:0;transition:opacity .3s linear}.anim-circle .pic-switch img.sml{width:70%}.anim-circle .pic-switch.notrans img{transition:none}@keyframes rotateme{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes showme{0%{opacity:0}20%{opacity:100%}80%{opacity:100%}to{opacity:0}}.canim-caption{margin-top:20px}.canim-caption ul{padding-left:16px}.anim-circle{transform:scale(.98);transition:transform .1s linear}.anim-circle:hover{transform:scale(1.08)}.vertical-scroll-holder{position:absolute;display:flex;flex-direction:column;overflow:hidden;width:100%;height:0;padding-bottom:100%}.vertical-scroll-holder .spos{position:absolute;left:0;width:100%}.vertical-scroll-holder .spos>img{width:100%}.film-sprockets{width:78%}.film-bg{width:82%}.film-frames{width:80%}.rotator{position:absolute;top:28%;left:23%;transform-origin:center;width:50%}.rotator.animating{animation:rotateme 3s infinite linear}.watch{width:96%}.animation .vert-fill-hider{width:0;height:100%;position:absolute;bottom:0;left:0;transition:width .5s ease-in-out;overflow:hidden}.animation.hid{display:none}.animation.slid{left:-50%}.animation .vert-fill-hider.up{width:100%}.animation .car-fill-hider{width:100%;height:0;position:absolute;bottom:0;left:0;transition:height .5s ease-in-out;overflow:hidden}.animation .car-fill-hider.up{height:100%}.animation .vert-fill-hider img{height:100%;position:absolute;bottom:0;left:0}.animation .car-fill-hider img{position:absolute;bottom:0;left:0}.animation .comp{position:absolute;transition:top .3s ease;width:80%;left:50%;transform:translate(-50%)}.animation .comp.top{top:30%;z-index:3}.animation .comp.top.up{top:-2%}.animation .comp.middle{top:40%;z-index:2}.animation .comp.middle.up{top:20%}.animation .comp.bottom{top:50%;z-index:1}.animation .comp.bottom.up{top:40%}.d-cp{width:80%}.d-button{position:absolute;width:16%;top:12%;left:16%}.d-button.play{top:20%;left:40%;width:25%;transition:opacity .3s linear;opacity:0}.d-button.play.show{opacity:1}.d-button.thumb{width:10%;top:63%;transition:left 1s ease}.d-button.thumb.end{left:70%}.d-button.bottom{top:66%}.m-cp{width:80%}.m-button{position:absolute;width:16%;top:12%;left:16%;transition:left 1s ease}.m-button.middle{top:38%}.m-button.bottom{top:66%}.animation .set-des{width:100%}.animation .the-sun{position:absolute;top:40%;left:-20%;width:20%;transform-origin:400% 400%}.animation .the-sun.anim{animation:rotatesun 3s linear}@keyframes rotatesun{0%{transform:rotate(0)}to{transform:rotate(180deg)}}.anim-com{min-height:100vh;margin-bottom:150px}.anim-com .deliv{width:50%;padding-left:25%;padding-right:25%;position:relative;z-index:10}.anim-com .deliv .abs-flash{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(1);z-index:-1;opacity:.5;transition:all .1s ease}.anim-com .deliv:hover .abs-flash{opacity:1;transform:translate(-50%,-50%) scale(1.1)}.anim-com h1{max-width:800px;margin-bottom:80px}.charcoal .anim-com h1 a{color:var(--brown)}.roundel-row{display:flex}.roundel-text{margin-top:16px;opacity:.6;transition:opacity .2s ease;text-align:center}.roundel-text.sel{opacity:1}.anim-com h1 a:hover{color:var(--hilite-color)}.anim-com .anim-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;column-gap:30px;row-gap:30px;margin:30px 0}.anim-com .anim-grid.duo{grid-template-columns:1fr 1fr}.anim-com .plusor-grid{display:grid;grid-template-columns:1fr 30px 1fr;align-items:center;max-width:560px;margin:30px 0;column-gap:30px}.anim-com .anim-grid-two{display:grid;grid-template-columns:2fr 2fr 2fr;column-gap:30px}.choice-row{display:flex;justify-content:flex-start}.flash-surround{position:absolute;top:45%;left:50%;width:280px;transform:translate(-50%,-50%);opacity:.6}.num-heading{display:flex;align-items:center;font-size:26px;line-height:26px;margin-top:100px}#simplebox,#complebox{scroll-margin-top:100px}.num-heading .num{font-size:56px;line-height:56px;margin-right:10px}.verdy{font-family:Verdana,Geneva,Tahoma,sans-serif}.roundel{border-radius:50%;background-color:var(--hilite-color);padding-bottom:100%;height:0;position:relative;font-size:18px;opacity:.6;cursor:pointer;transition:all .2s ease}.roundel.sel{opacity:1}.roundel:hover{opacity:1;transform:scale(1.1)}.roundel>div{position:absolute;width:80%;height:auto;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;text-transform:uppercase}.anim-chunk{margin-top:20px}.anim-chunk-title{font-size:21px;text-align:center;color:#aaa}.anim-com .flash{position:relative;margin:30px 0}.anim-com .flash.gridspan{grid-column:span 2;margin:0}.anim-chunk .abs-holder{position:absolute;width:80%;height:0;padding-bottom:100%;top:-30%}.abs-flash{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%}.anim-com .choice-area{position:relative}.how-much{width:500px;position:absolute;right:0;top:0}.how-much-title{font-size:21px}.anim-com .explainer{margin-top:10px;max-width:500px;color:#ccc}@media screen and (max-width: 1200px){.how-much{width:400px}}@media screen and (max-width: 1100px){.anim-com .anim-grid{grid-template-columns:1fr 1fr 1fr 1fr}.anim-com .anim-grid-two{grid-template-columns:2fr;row-gap:60px;column-gap:60px;max-width:500px}.how-much{position:static;border:1px solid #444;padding:10px;max-width:600px;width:auto}.anim-com .flash.gridspan{margin-top:50px;margin-bottom:100px}}@media screen and (max-width: 768px){.anim-com .anim-grid{grid-template-columns:1fr 1fr 1fr}}@media screen and (max-width: 640px){.anim-com .anim-grid{grid-template-columns:1fr 1fr}.roundel{font-size:16px}}@media screen and (max-width: 400px){.anim-com{margin:0 20px}.anim-com .anim-grid{grid-template-columns:1fr}.roundel{font-size:14px}.anim-com .anim-grid.duo{grid-template-columns:1fr}.anim-com .plusor-grid{column-gap:10px}.anim-com .flash.gridspan{grid-column:span 1}.anim-com .deliv{width:100%;padding:0}}
