.video-player{--video-duration-position:var(--size-008);--video-player-radius:var(--radius-100);width:100%}.video-player__frame,.video-player__preview{aspect-ratio:16/9;background:var(--system-white-100);border-radius:var(--video-player-radius);display:block;overflow:hidden;position:relative;width:100%}.video-player__frame:focus-visible,.video-player__preview:focus-visible{outline:var(--stroke-250) solid var(--focus-outline-color,--festool-green-200);outline-offset:var(--stroke-200)}.video-player__frame--hidden{height:0;opacity:0;overflow:hidden;pointer-events:none;position:absolute;width:0}.video-player__preview-img{height:100%;inset:0;-o-object-fit:cover;object-fit:cover;position:absolute;width:100%}.video-player__play{display:grid;inset:0;place-items:center;position:absolute}.video-player__iframe{height:100%;inset:0;position:absolute;width:100%}.video-player__duration{bottom:var(--video-duration-position);display:grid;position:absolute;right:var(--video-duration-position)}.video-player--size-050{--video-duration-position:var(--size-008)}.video-player--size-100{--video-duration-position:var(--size-016)}.video-player--size-200,.video-player--size-300{--video-duration-position:var(--size-024)}@media only screen and (min-width:768px){.v200-video-player--size-050{--video-duration-position:var(--size-008)}.v200-video-player--size-100{--video-duration-position:var(--size-016)}.v200-video-player--size-200,.v200-video-player--size-300{--video-duration-position:var(--size-024)}}@media only screen and (min-width:992px){.v300-video-player--size-050{--video-duration-position:var(--size-008)}.v300-video-player--size-100{--video-duration-position:var(--size-016)}.v300-video-player--size-200,.v300-video-player--size-300{--video-duration-position:var(--size-024)}}@media only screen and (min-width:1280px){.v400-video-player--size-050{--video-duration-position:var(--size-008)}.v400-video-player--size-100{--video-duration-position:var(--size-016)}.v400-video-player--size-200,.v400-video-player--size-300{--video-duration-position:var(--size-024)}}@media only screen and (min-width:1920px){.v500-video-player--size-050{--video-duration-position:var(--size-008)}.v500-video-player--size-100{--video-duration-position:var(--size-016)}.v500-video-player--size-200,.v500-video-player--size-300{--video-duration-position:var(--size-024)}}