/* Featured Motion – front end */

.fvt-thumb {
	position: relative;
	display: block;
}

.fvt-layer {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.25s ease;
}

.fvt-playing > .fvt-layer {
	opacity: 1;
}

.fvt-layer video,
.fvt-layer img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	object-fit: cover;
}

.fvt-layer iframe {
	position: absolute;
	max-width: none;
	border: 0;
}

.fvt-fallback {
	display: block;
	width: 100%;
	height: auto;
}

.fvt-fallback-blank {
	aspect-ratio: 16 / 9;
	background: #000;
}

.fvt-player {
	margin: 0 0 1.5em;
}

.fvt-player .wp-video {
	max-width: 100%;
}

/* Fitted into a theme's fixed-ratio image box (see fitPlayers() in frontend.js). */
.fvt-player.fvt-fill {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	aspect-ratio: auto;
}

.fvt-player.fvt-fill .wp-video,
.fvt-player.fvt-fill .mejs-container,
.fvt-player.fvt-fill video {
	width: 100% !important;
	height: 100% !important;
}

.fvt-player.fvt-fill video {
	object-fit: contain;
	background: #000;
}

.fvt-embed {
	position: relative;
	aspect-ratio: 16 / 9;
}

.fvt-embed iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

@media (prefers-reduced-motion: reduce) {
	.fvt-layer {
		transition: none;
	}
}
