a#hpvideo {
	width: 100%;
	display: inline-block;
	position: relative;
	padding-top: calc((100% / 16) * 9);
	overflow: hidden;
}

a#hpvideo.threebytwo {
	padding-top: calc((100% / 3) * 2);	
}

a#hpvideo.onebyone {
	padding-top: 100%;	
}

a#hpvideo video {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
}

a#hpvideo.threebytwo video {
	/*width: calc(((((100% / 3) * 2) - ((100% / 16) * 9)) * 2) + 100%);*/
	width: 100%;
}

a#hpvideo.onebyone video {
	width: calc(((100% - ((100% / 16) * 9)) * 2) + 100%);
}

.hpvideo_caption {
	line-height: 1.1;
	font-size: .75rem;
	font-family: Franklin,arial,sans-serif;
	color: #666;
	margin: 5px 0 8px 0;
	display: block;
	text-align: left;
}

a#hpvideo.hide_caption + .hpvideo_caption {
	display: none;
}

a#hpvideo .hpvideo_overlay {
	display: none;
	position: absolute;
	background-color: #000;
	bottom: 0;
	left: 0;
	margin: 20px;
	padding: 12px 16px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	color: #EEE;
	font-size: 16px;
	line-height: 20px;
	background-color: rgba(0,0,0,0.6);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-weight: 800;
	text-align: left;
}

a#hpvideo.show_overlay .hpvideo_overlay {
	display: inline-block;
}

a#hpvideo.show_overlay .hpvideo_overlay:hover {
	background-color: rgba(0,0,0,1.0);
	cursor: pointer;
}

a#hpvideo.show_overlay .hpvideo_overlay a:hover {
	color: #FFF;
	text-decoration: none;
}

/*@media only screen and (max-width: 768px) {
	a#hpvideo.show_overlay .hpvideo_overlay, .hpvideo_caption {
		display: none;
	}
}*/