.video {
	position: relative;
	display: flex;
	padding-bottom: 58%;
	background-position: center;
	background-size: cover;
	border-radius: 8px;
	transition: all 0.2s ease-in-out;
}

.video::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: rgba(31, 59, 73, 0.2);
	border-radius: inherit;
	transition: all 0.2s ease-in-out;
}

.video:hover {
	box-shadow: 0px 34px 40px rgba(38, 69, 85, 0.06);
}

.video:hover::before {
	background: rgba(31, 59, 73, 0.1);
}

.video-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 3.75rem;
	transform: translate(-50%, -50%) scale(1);
	color: #fff;
	transition: all 0.2s ease-in-out;
}

.video-frame {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border: none;
}

.video-16by9 {
	padding-bottom: 56.25%;
}

.video-4by3 {
	padding-bottom: 75%;
}

* + .video {
	margin-top: 1.59375rem;
}

@media (min-width: 992px) {
	* + .video {
		margin-top: 2.23125rem;
	}
}

@media (min-width: 1600px) {
	* + .video {
		margin-top: 3.1875rem;
	}
}