.video {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
	background-color: #000000;
    overflow: hidden;
}

.video__link {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.video__media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}
img.video__media {
    position: absolute;
    top: -16.75%;
    left: 0;
    width: 100%;
    height: 133.5%;
    border: none;
}

.video__button {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 1;
	display: none;
	padding: 0;
	width: 68px;
	height: 48px;
	border: none;
	background-color: transparent;
	transform: translate(-50%, -50%);
	cursor: pointer;
}

.video__button-shape {
	fill: #212121;
	fill-opacity: 0.8;
}

.video__button-icon {
	fill: #ffffff;
}

.video__button:focus {
	outline: none;
}

.video:hover .video__button-shape,
.video__button:focus .video__button-shape {
	fill: #ff0000;
	fill-opacity: 1;
}
.video__button:hover .video__media{
	opacity:0.8;
}
/* Enabled */

.video--enabled {
	cursor: pointer;
}

.video--enabled .video__button {
	display: block;
}