
.video-container, .wistia {
	position: relative;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: var(--lfShadow);
}

.video-container .image-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background-size: cover !important;
	display: grid;
	place-content: center;
}

.video-container .image-overlay .play-button, .wistia .play-button {
	clip-path: polygon(40% 0, 90% 50%, 40% 100%, 25% 85%, 60% 50%, 25% 15%);
	width: 50px;
	height: 50px;
	background: #fff;
	z-index: 1;
}

.video-container .image-overlay .play-button.error {
	clip-path: polygon(20% 0%, 0% 20%, 30% 50%, 0% 80%, 20% 100%, 50% 70%, 80% 100%, 100% 80%, 70% 50%, 100% 20%, 80% 0%, 50% 30%) !important;
}

.video-container .image-overlay .play-button:hover {
	cursor: pointer;
}

.wistia {
	background-color: #000;
	margin-bottom: 30px;
	position: relative;
	padding-top: 56.25%;
	cursor: pointer;
}

.wistia img {
	width: 100%;
	top: 0;
	/* Change this for different ratio than 16:9 */
	left: 0;
}

.wistia .play-button:before {
	content: "";
	border-style: solid;
	border-width: 15px 0 15px 26px;
	border-color: transparent transparent transparent #fff;
}

.wistia img, .wistia .play-button {
	cursor: pointer;
}

.wistia img, .wistia iframe, .wistia .play-button, .wistia .play-button:before {
	position: absolute;
}

.wistia .play-button, .wistia .play-button:before {
	top: 50%;
	left: 50%;
	transform: translate3d(-50%, -50%, 0);
}

.wistia iframe {
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
}
