.video-el{height:100%;opacity:0;position:relative;width:100%}.video-el video{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.video-el .indicator>*{transition:stroke-dashoffset .1s linear}.video-el svg{--tw-translate-x:-50%;--tw-translate-y:-50%;cursor:pointer;height:50%;left:50%;max-width:16rem;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-duration:.2s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);width:50%;z-index:1}.video-el svg .pause-icon,.video-el svg .play-icon{fill:none;stroke:#fff;stroke-width:3px}.video-el svg .animated-circle{stroke:#c8b41d;stroke-width:4px}.video-el svg .static-circle{stroke:#edebe4;stroke-width:1px;opacity:.5}.video-el:hover svg{opacity:1}