.video{line-height:0;display:grid;align-items:center;justify-items:center;grid-template-rows:1fr;grid-template-columns:1fr;overflow:hidden;position:relative}.video>*{grid-column:1;grid-row:1}.video>*{position:relative;z-index:3}.video>video{width:100%;height:auto;z-index:1;object-fit:cover;object-position:center}.video>video:focus{outline:none}.video.fullscreen video{width:100vw;height:100vh}.video.has-play:not(.played) video{pointer-events:none}.video>.video-controls{position:absolute;bottom:0;left:0;width:100%;pointer-events:none;z-index:2;transform:translateY(calc(100% - .3125em));-o-transform:translateY(calc(100% - .3125em));-ms-transform:translateY(calc(100% - .3125em));-moz-transform:translateY(calc(100% - .3125em));-webkit-transform:translateY(calc(100% - .3125em));transition:all 0.5s cubic-bezier(0.76,0,0.24,1);-o-transition:all 0.5s cubic-bezier(0.76,0,0.24,1);-moz-transition:all 0.5s cubic-bezier(0.76,0,0.24,1);-webkit-transition:all 0.5s cubic-bezier(0.76,0,0.24,1);padding:0 0 0.5em;background-color:rgba(51,51,51,0.4);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);font-size:16px;display:grid;grid-gap:0.3125em 0.5em;align-items:center;justify-items:center;grid-template-columns:0.1875em repeat(3,auto) 1fr repeat(5,auto) 0.1875em;grid-template-areas:"progress progress progress progress progress progress progress progress progress progress progress" ". play volume time . cc quality pip branding full ."}.video>.video-controls>*{display:block;width:100%;line-height:0;font-size:1em;color:#fff}.video>.video-controls *{-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.video>.video-controls svg{height:1.5em;width:auto;fill:currentColor}.video>.video-controls .youtube svg{height:1em}.video>.video-controls .seek{grid-area:progress}.video>.video-controls .play-controls{grid-area:play}.video>.video-controls .volume-controls{grid-area:volume}.video>.video-controls .time{grid-area:time}.video>.video-controls .cc-controls{grid-area:cc}.video>.video-controls .quality-controls{grid-area:quality}.video>.video-controls .pip-controls{grid-area:pip}.video>.video-controls .branding{grid-area:branding}.video>.video-controls .fullscreen-controls{grid-area:full}.video>.video-controls .cc-controls,.video>.video-controls .quality-controls,.video>.video-controls .pip-controls,.video>.video-controls .branding,.video>.video-controls .fullscreen-controls{margin:0 0.25em}.video>.video-controls .pip-controls{margin-right:0}.video>.video-controls .seek,.video>.video-controls .play-controls,.video>.video-controls .volume-controls,.video>.video-controls .quality-controls,.video>.video-controls .fullscreen-controls,.video>.video-controls .qualities>div{display:grid}.video>.video-controls .seek>*,.video>.video-controls .play-controls>*,.video>.video-controls .volume-controls>*,.video>.video-controls .quality-controls>*,.video>.video-controls .fullscreen-controls>*,.video>.video-controls .qualities>div>*{grid-row:1;grid-column:1}.video>.video-controls .seek>*{margin:0;height:0.3125em;appearance:none;-moz-appearance:none;-webkit-appearance:none;opacity:0.75;width:100%}.video>.video-controls .seek>*::-webkit-progress-bar{background:transparent}.video>.video-controls .seek>*.buffer{opacity:0.25}.video>.video-controls .seek>*.buffer::-moz-progress-bar{background-color:#f7f7f7;transition:all 0.5s cubic-bezier(0.76,0,0.24,1);-o-transition:all 0.5s cubic-bezier(0.76,0,0.24,1);-moz-transition:all 0.5s cubic-bezier(0.76,0,0.24,1);-webkit-transition:all 0.5s cubic-bezier(0.76,0,0.24,1)}.video>.video-controls .seek>*.buffer::-webkit-progress-value{background-color:#f7f7f7;transition:all 0.5s cubic-bezier(0.76,0,0.24,1);-o-transition:all 0.5s cubic-bezier(0.76,0,0.24,1);-moz-transition:all 0.5s cubic-bezier(0.76,0,0.24,1);-webkit-transition:all 0.5s cubic-bezier(0.76,0,0.24,1)}.video>.video-controls .seek>*.progress::-moz-progress-bar{background-color:#338ffc;transition:all 0.25s cubic-bezier(0.76,0,0.24,1);-o-transition:all 0.25s cubic-bezier(0.76,0,0.24,1);-moz-transition:all 0.25s cubic-bezier(0.76,0,0.24,1);-webkit-transition:all 0.25s cubic-bezier(0.76,0,0.24,1)}.video>.video-controls .seek>*.progress::-webkit-progress-value{background-color:#338ffc;transition:all 0.25s cubic-bezier(0.76,0,0.24,1);-o-transition:all 0.25s cubic-bezier(0.76,0,0.24,1);-moz-transition:all 0.25s cubic-bezier(0.76,0,0.24,1);-webkit-transition:all 0.25s cubic-bezier(0.76,0,0.24,1)}.video>.video-controls .seek>*.seek-to{opacity:0.5}.video>.video-controls .seek>*.seek-to::-moz-progress-bar{background-color:#338ffc}.video>.video-controls .seek>*.seek-to::-webkit-progress-value{background-color:#338ffc}.video>.video-controls .seek .seek-input{opacity:0;cursor:pointer}.video>.video-controls .volume-controls{position:relative}.video>.video-controls .volume-controls .volume-input{height:3.5em;width:1em;cursor:pointer;margin:0;writing-mode:bt-lr;-webkit-appearance:slider-vertical;position:absolute;left:50%;bottom:100%;transform:translateY(0) translateX(-50%);-o-transform:translateY(0) translateX(-50%);-ms-transform:translateY(0) translateX(-50%);-moz-transform:translateY(0) translateX(-50%);-webkit-transform:translateY(0) translateX(-50%);opacity:0;pointer-events:none;clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%);-webkit-clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%);transition:all 0.3s cubic-bezier(0.76,0,0.24,1);-o-transition:all 0.3s cubic-bezier(0.76,0,0.24,1);-moz-transition:all 0.3s cubic-bezier(0.76,0,0.24,1);-webkit-transition:all 0.3s cubic-bezier(0.76,0,0.24,1)}.video>.video-controls .volume-controls:hover .volume-input{opacity:1;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);-webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 100%);pointer-events:auto}.video>.video-controls .quality-controls{position:relative}.video>.video-controls .quality-controls .qualities{position:absolute;bottom:calc(100% - -1em);left:50%;transform:translateX(-50%);-o-transform:translateX(-50%);-ms-transform:translateX(-50%);-moz-transform:translateX(-50%);-webkit-transform:translateX(-50%);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);transition:all 0.3s cubic-bezier(0.76,0,0.24,1);-o-transition:all 0.3s cubic-bezier(0.76,0,0.24,1);-moz-transition:all 0.3s cubic-bezier(0.76,0,0.24,1);-webkit-transition:all 0.3s cubic-bezier(0.76,0,0.24,1)}.video>.video-controls .quality-controls .qualities div{align-items:center;justify-items:center;font-family:Helvetica,Arial;font-size:1em;font-weight:300}.video>.video-controls .quality-controls .qualities input{appearance:none;-moz-appearance:none;-webkit-appearance:none;margin:0;padding:0;font-size:0.7em;width:8em;height:2.75em;cursor:pointer;background-color:rgba(51,51,51,0.8);transition:all 0.25s cubic-bezier(0.76,0,0.24,1);-o-transition:all 0.25s cubic-bezier(0.76,0,0.24,1);-moz-transition:all 0.25s cubic-bezier(0.76,0,0.24,1);-webkit-transition:all 0.25s cubic-bezier(0.76,0,0.24,1)}.video>.video-controls .quality-controls .qualities input:checked{background-color:#338ffc;pointer-events:none}.video>.video-controls .quality-controls .qualities input:hover{background-color:rgba(85,85,85,0.8)}.video>.video-controls .quality-controls .qualities input:focus{outline:none}.video>.video-controls .quality-controls .qualities label{pointer-events:none}.video>.video-controls .quality-controls .qualities.hide{opacity:0;pointer-events:none}.video:not(.has-play):hover .video-controls,.video.has-play.played:hover .video-controls,.video:not(.has-play) .video-controls:hover,.video.has-play.played .video-controls:hover{transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);-moz-transform:translateY(0);-webkit-transform:translateY(0);pointer-events:auto}.video .video-icon{transition:all 0.3s cubic-bezier(0.76,0,0.24,1);-o-transition:all 0.3s cubic-bezier(0.76,0,0.24,1);-moz-transition:all 0.3s cubic-bezier(0.76,0,0.24,1);-webkit-transition:all 0.3s cubic-bezier(0.76,0,0.24,1);cursor:pointer}.video .video-icon.hide{opacity:0;pointer-events:none}.video .play{cursor:pointer}.video .play.default,.video .play.with-sound{position:absolute;z-index:5;height:auto;width:18%;top:50%;left:50%;transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);display:block;clip-path:polygon(0 0,100% 50%,0 100%);-webkit-clip-path:polygon(0 0,100% 50%,0 100%);transition:opacity 0.25s cubic-bezier(0.76,0,0.24,1);-o-transition:opacity 0.25s cubic-bezier(0.76,0,0.24,1);-moz-transition:opacity 0.25s cubic-bezier(0.76,0,0.24,1);-webkit-transition:opacity 0.25s cubic-bezier(0.76,0,0.24,1);opacity:1;pointer-events:auto;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.video.played .play.with-sound,.video.played .play.default{opacity:0;pointer-events:none}