.kt-video { position: relative; width: 100%; max-width: 900px; height: 0; padding: 0 0 56.25% 0; margin: 2rem 0; overflow: hidden; background: #000; } .kt-video .kt-video__btn { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; cursor: pointer; display: block; } .kt-video .kt-video__thumb { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: none; margin: 0; object-fit: cover; display: block; } .kt-video .kt-video__play { position: absolute; top: 50%; left: 50%; width: 72px; height: 72px; margin: -36px 0 0 -36px; border-radius: 50%; background: rgba(0, 58, 104, .9); transition: background .2s, transform .2s; } .kt-video .kt-video__play::after { content: ""; position: absolute; top: 50%; left: 50%; margin: -12px 0 0 -7px; border-style: solid; border-width: 12px 0 12px 20px; border-color: transparent transparent transparent #fff; } .kt-video .kt-video__btn:hover .kt-video__play, .kt-video .kt-video__btn:focus-visible .kt-video__play { background: rgb(0, 58, 104); transform: scale(1.08); } .kt-video .kt-video__btn:focus-visible { outline: 3px solid #fff; outline-offset: -6px; } .kt-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }