﻿/* This stylesheet is exclusively for the plugin. Incase you would like to make some changes, would recommend you import this in your stylesheet and then make the changes as per your liking. */
.videoPlayerOverlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1200;
	background-color: rgba(0, 0, 0, 0.5);
	transition-property: all;
	-moz-transition-property: all;
	-webkit-transition-property: all;
	-o-transition-property: all;
	-ms-transition-property: all;
	transition-duration: 0.25s;
	-webkit-transition-duration: 0.25s;
	-ms-transition-duration: 0.25s;
	-moz-transition-duration: 0.25s;
	-o-transition-duration: 0.25s;
	transition-timing-function: linear;
	-webkit-transition-timing-function: linear;
	-o-transition-timing-function: linear;
	-ms-transition-timing-function: linear;
	-moz-transition-timing-function: linear;
}
.videoPlayerOverlay .closeIcon {
	position: absolute;
	right: 15px;
	top: 15px;
	width: 3rem;
	z-index: 200;
	font-weight: bold;
	border-radius: 50%;
	border: 0;
	background: #fff;
	width: 30px;
	height: 30px;
	transition-property: transform;
	-moz-transition-property: transform;
	-webkit-transition-property: transform;
	-o-transition-property: transform;
	-ms-transition-property: transform;
	transition-duration: 0.25s;
	-webkit-transition-duration: 0.25s;
	-ms-transition-duration: 0.25s;
	-moz-transition-duration: 0.25s;
	-o-transition-duration: 0.25s;
	transition-timing-function: ease-in-out;
	-webkit-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	-ms-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
}
.videoPlayerOverlay iframe, .videoPlayerOverlay video {
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	text-align: center;
}
.videoPlayerOverlay iframe {
	max-width: 853px;
	max-height: 480px;
}
.videoPlayerOverlay video {
	max-height: 100vh;
	width: 100%;
}
.videoPlayerOverlay.hiddenTransform {
	opacity: 0;
	visibility: hidden;
	transform: translateY(50px);
	-webkit-transform: translateY(50px);
}
@media only screen and (max-width: 767px) {
 .videoPlayerOverlay iframe {
    width: 100%;
 }
 .videoPlayerOverlay video {
	min-height: 250px;
 }
}
