*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}html,body{margin:0;padding:0;height:100%}body{font-family:Arial,Helvetica,sans-serif;min-height:100%;overflow:hidden;display:flex;justify-content:center;align-items:flex-start}@keyframes preloader{0%{transform:translate(-50%,-50%) rotate(0);opacity:1}75%{transform:translate(-50%,-50%) rotate(540deg);opacity:1}90%{transform:translate(-50%,-50%) rotate(648deg);opacity:0}to{transform:translate(-50%,-50%) rotate(720deg);opacity:0}}@keyframes scene{0%{filter:grayscale(1) brightness(10);transform:scale(0);opacity:0}5%{filter:grayscale(1) brightness(10);transform:scale(.05,.004);opacity:1}50%{filter:grayscale(1) brightness(10);transform:scaleY(.004);opacity:1}to{filter:grayscale(0) brightness(1);transform:scale(1);opacity:1}}@keyframes switcher-wrapper{0%{opacity:0}90%{opacity:0}to{opacity:1}}@keyframes switcher{0%{transform:translate(0);opacity:1}35%{transform:translate(0);opacity:1}36%{opacity:.2}37%{transform:translate(-1%);opacity:1}38%{opacity:.2}39%{transform:translate(-1%,-1%);opacity:1}40%{opacity:.2}41%{transform:translate(1%,1%);opacity:1}42%{opacity:.2}43%{transform:translateY(1%);opacity:1}44%{opacity:.2}45%{transform:translate(0);opacity:1}to{transform:translate(0);opacity:1}}@keyframes switcher-hover{0%{background-image:var(--buttons)}10%{background-image:var(--buttons)}12%{background-image:var(--buttons-default)}14%{background-image:var(--buttons)}16%{background-image:var(--buttons-default)}18%{background-image:var(--buttons)}20%{background-image:var(--buttons-default)}22%{background-image:var(--buttons)}45%{background-image:var(--buttons)}48%{background-image:var(--buttons-default)}51%{background-image:var(--buttons)}54%{background-image:var(--buttons-default)}57%{background-image:var(--buttons)}to{background-image:var(--buttons)}}@keyframes switcher-active{0%{background-image:var(--buttons)}50%{background-image:var(--buttons-default)}to{background-image:var(--buttons)}}@keyframes btn{0%{transform:scale(1);opacity:1}20%{transform:scale(1);opacity:1}30%{transform:scale(.98);opacity:.8}40%{transform:scale(1);opacity:1}to{transform:scale(1);opacity:1}}@keyframes btn-hover{0%{opacity:1}10%{opacity:1}12%{opacity:.8}14%{opacity:1}16%{opacity:.8}18%{opacity:1}20%{opacity:.8}22%{opacity:1}45%{opacity:1}48%{opacity:.8}51%{opacity:1}54%{opacity:.8}57%{opacity:1}to{opacity:1}}@keyframes btn-active{0%{opacity:1}50%{opacity:.8}to{opacity:1}}@keyframes bubble-static{0%{opacity:var(--bubble-fade-opacity);transform:scale(var(--bubble-scale-down))}20%{opacity:1;transform:scale(1)}95%{opacity:1;transform:scale(1)}to{opacity:var(--bubble-fade-opacity);transform:scale(var(--bubble-scale-down))}}@keyframes bubble-rotate{0%{opacity:var(--bubble-fade-opacity);transform:scale(var(--bubble-scale-down)) rotate(calc(45deg * var(--bubble-speed) * 0 + var(--bubble-angle-init)))}20%{opacity:1;transform:scale(1) rotate(calc(45deg * var(--bubble-speed) * 1.6 + var(--bubble-angle-init)))}95%{opacity:1;transform:scale(1) rotate(calc(45deg * var(--bubble-speed) * 7.6 + var(--bubble-angle-init)))}to{opacity:var(--bubble-fade-opacity);transform:scale(var(--bubble-scale-down)) rotate(calc(45deg * var(--bubble-speed) * 8 + var(--bubble-angle-init)))}}@keyframes play{0%{transform:scaleX(0) translate(-50%);opacity:0}to{transform:scaleX(1) translate(0);opacity:1}}body{background-color:#000;display:flex;align-items:center;justify-content:center;flex-direction:column}.wrapper{position:relative;aspect-ratio:2/1;overflow:hidden;display:flex;align-items:center;justify-content:center}.wrapper_outer{width:99%}.wrapper_inner{height:99%}.container{--preloader-duration: 1.2s;--switch-duration: .8s;position:relative;aspect-ratio:2/1;overflow:hidden;width:100%;border-radius:16px}.container:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(ellipse at center,#303030,#080808);z-index:-1}.preloader{position:absolute;top:50%;left:50%;width:2%;aspect-ratio:1/1;transform:translate(-50%,-50%) rotate(0);border-radius:50%;border:.2vw solid rgba(255,255,255,.2666666667);border-top:.2vw solid rgba(255,255,255,.5333333333);animation:preloader linear var(--preloader-duration) forwards;z-index:-1}input#scene-switcher{position:absolute;opacity:0;height:0;width:0;z-index:-1000}input#scene-switcher:not(:checked)~.scene-switcher{display:block}input#scene-switcher:not(:checked)~#scene_1{animation:scene var(--switch-duration) var(--preloader-duration) forwards}input#scene-switcher:not(:checked)~#scene_2{display:none}input#scene-switcher:checked~.scene-switcher{display:none}input#scene-switcher:checked~#scene_1{display:none}input#scene-switcher:checked~#scene_2{animation:scene var(--switch-duration) forwards}.scene-switcher{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;opacity:0;animation:switcher-wrapper ease-in-out calc(var(--switch-duration) - .1s) var(--preloader-duration) forwards}.switcher{position:absolute;right:11%;bottom:10%;aspect-ratio:149/38;width:40%;display:flex;animation:switcher steps(1) 4s infinite}.switcher:hover{animation:none}.switcher__bg{--buttons-default: url('switcher.png');top:0;right:0;bottom:0;left:0;width:100%;height:100%;position:absolute;z-index:-1;background-image:var(--buttons);background-position:center;background-size:contain;background-repeat:no-repeat}.switcher__bg_default{--buttons: url('switcher.png');display:block}.switcher__bg_left{--buttons: url('switcher-accept.png');display:none}.switcher__bg_right{--buttons: url('switcher-show.png');display:none}.switcher__side{cursor:pointer;position:relative;width:50%;height:70%}.switcher__side:hover~.switcher__bg{animation:switcher-hover steps(1) 3s infinite}.switcher__side:hover~.switcher__bg_default{display:none}.switcher__side:active~.switcher__bg{animation:switcher-active steps(1) .1s infinite}.switcher__side_left{align-self:flex-end}.switcher__side_left:hover~.switcher__bg_left{display:block}.switcher__side_right{align-self:flex-start}.switcher__side_right:hover~.switcher__bg_right{display:block}.scene{opacity:0;position:relative;width:100%;height:100%}.scene video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;-o-object-fit:contain;object-fit:contain;z-index:-1}.logo{--logo-width: 12%;position:absolute;top:5%;left:3%;width:var(--logo-width);aspect-ratio:233/90;background-image:url('logo.png');background-position:center;background-size:contain;background-repeat:no-repeat}.btn{cursor:pointer;position:absolute;right:5%;bottom:19%;aspect-ratio:375/133;width:20%;background-image:url('QMlIbjiq6E1UQAAAABJRU5ErkJggg==');background-position:center;background-size:contain;background-repeat:no-repeat;animation:btn ease-in-out 1s infinite}.btn:hover{animation:btn-hover steps(1) 3s infinite;transform:scale(1.01)}.btn:active{animation:btn-active steps(1) .1s infinite;transform:scale(1)}.item{cursor:pointer;position:absolute;width:4%;aspect-ratio:78/79}.item:hover .card{transform:translate(-25%,25%) scale(1.5)}.item:hover .card .play{display:block}.item .bubble{--bubble-animation-name: bubble-rotate;--bubble-animation-duration: 2s;--bubble-speed: 1;--bubble-scale-down: .3;--bubble-fade-opacity: .7;--bubble-angle-init: 90deg;position:absolute;top:0;right:0;bottom:0;left:0;background-image:url('bubble.png');background-position:center;background-size:contain;background-repeat:no-repeat;animation:var(--bubble-animation-name) var(--bubble-animation-duration) linear infinite}.item .card{position:absolute;width:244%;aspect-ratio:95/71;right:55%;top:55%;background-position:center;background-size:contain;background-repeat:no-repeat;transition:transform ease-out .2s}.item .card .play{display:none;position:absolute;width:85%;aspect-ratio:209/57;top:100%;left:0%;background-image:url('VztpCX0F8sRb4bsU8R0AAAAASUVORK5CYII=');background-position:center;background-size:contain;background-repeat:no-repeat;animation:play ease-out .2s}.item~.text{display:none;position:absolute;top:20%;left:62%;background-position:left top;background-size:contain;background-repeat:no-repeat}.item:nth-of-type(1){top:28%;left:48.5%}.item:nth-of-type(1) .bubble{animation-delay:calc(var(--bubble-animation-duration) * 0)}.item:nth-of-type(1) .card{background-image:url('card1.png')}.item:nth-of-type(1):hover~.text{display:block;width:32.4%;aspect-ratio:622/25;background-image:url('v4QfAR+ih8IMPvgXLK9Z+8MG3YO3bqr8CfwFuLFEWeZzn1wAAAABJRU5ErkJggg==')}.item:nth-of-type(2){top:49.5%;left:58.5%}.item:nth-of-type(2) .bubble{animation-delay:calc(var(--bubble-animation-duration) * .22)}.item:nth-of-type(2) .card{background-image:url('card2.png')}.item:nth-of-type(2):hover~.text{display:block;width:32.656%;aspect-ratio:627/23;background-image:url('ddkgCl9tXCgAAAABJRU5ErkJggg==')}.item:nth-of-type(3){top:24%;left:75.5%}.item:nth-of-type(3) .bubble{animation-delay:calc(var(--bubble-animation-duration) * .44)}.item:nth-of-type(3) .card{background-image:url('card3.png')}.item:nth-of-type(3):hover~.text{display:block;width:32%;aspect-ratio:612/22.5;background-image:url('uutwzf9XLaWP7uZvXbP071t2X+AXmsU5e6Tn0tAAAAAElFTkSuQmCC')}.item:nth-of-type(4){top:33%;left:91.5%}.item:nth-of-type(4) .bubble{animation-delay:calc(var(--bubble-animation-duration) * .66)}.item:nth-of-type(4) .card{background-image:url('card4.png')}.item:nth-of-type(4):hover~.text{display:block;width:22.7%;aspect-ratio:436/22;background-image:url('XBXwRKboF0I+7bCehImaAAAAAElFTkSuQmCC')}