/* Accessibility:hide screen reader texts (and prefer "top" for RTL languages).
Reference:http://blog.rrwd.nl/2015/04/04/the-screen-reader-text-class-why-and-how/ */
.mejs__offscreen { 
	clip:rect(1px, 1px, 1px, 1px); /* IE8-IE11 - no support for clip-path */
	clip-path:polygon(0px 0px, 0px 0px, 0px 0px, 0px 0px);
	position:absolute !important;
	height:1px;
	width:1px;
	overflow:hidden;
}

.mejs__container { 
	position:relative;
	//background:#8d8e8d;
	background:#000000;
	font-family:"Helvetica", Arial, serif;
	text-align:left;
	vertical-align:top;
	text-indent:0;
	box-sizing:border-box;
}

.mejs__container * { 
	box-sizing:border-box;
}

/* Hide native play button from iOS to favor plugin button */
.mejs__container video::-webkit-media-controls-start-playback-button { 
	display:none !important;
	-webkit-appearance:none;
}

.mejs__fill-container,
.mejs__fill-container .mejs__container { 
	width:100%;
	height:100%;
}

.mejs__fill-container { 
	overflow:hidden;
	position:relative;
	margin:0 auto;
	background:transparent;
}

.mejs__container:focus { 
	outline:none;
}

.mejs__iframe-overlay { 
	position:absolute;
	width:100%;
	height:100%;
}

.mejs__embed,
.mejs__embed body { 
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	background:#000;
	overflow:hidden;
}

.mejs__fullscreen { 
	overflow:hidden !important;
}

.mejs__container-fullscreen { 
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	overflow:hidden;
	z-index:1000;
}

.mejs__container-fullscreen .mejs__mediaelement,
.mejs__container-fullscreen video { 
	width:100% !important;
	height:100% !important;
}

.mejs__clear { 
	clear:both;
}

/* Start:LAYERS */
.mejs__background { 
	position:absolute;
	top:0;
	left:0;
}

.mejs__mediaelement { 
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:0;
}

.mejs__poster { 
	position:absolute;
	top:0;
	left:0;
	background-size:contain;
	background-position:50% 50%;
	background-repeat:no-repeat;
	z-index:1;
}

:root .mejs__poster-img { 
	display:none;
}

.mejs__poster-img { 
	border:0;
	padding:0;
}

.mejs__overlay { 
	position:absolute;
	top:0;
	left:0;
	z-index:1;
}
.mejs__layer { 
	z-index:1;
}

.mejs__overlay-play { 
	cursor:pointer;
}

.mejs__overlay-button { 
	position:absolute;
	top:50%;
	left:50%;
	width:80px;
	height:80px;
	margin:-56px 0 0 -40px;
	background:url(../img/mejs-controls.svg) no-repeat;
	background-position:0 -39px;
	overflow:hidden;
	z-index:1;
}

.mejs__overlay:hover > .mejs__overlay-button { 
	background-position:-80px -39px;
}

.mejs__overlay-loading { 
	position:absolute;
	top:50%;
	left:50%;
	width:80px;
	height:80px;
	margin:-56px 0 0 -40px;
}

.mejs__overlay-loading-bg-img { 
	display:block;
	width:80px;
	height:80px;
	//background:transparent url(../img/mejs-controls.svg) -160px -40px no-repeat;
	background-image:url(../img/v4a-spinner.svg);
	background-repeat:no-repeat;
	background-size:cover;
	-webkit-animation:mejs-loading-spinner 1s linear infinite;
	-moz-animation:mejs-loading-spinner 1s linear infinite;
	animation:mejs-loading-spinner 1s linear infinite;
	z-index:1;
}

@-moz-keyframes mejs-loading-spinner { 
	100% { 
		-moz-transform:rotate(360deg);
	}
}

@-webkit-keyframes mejs-loading-spinner { 
	100% { 
		-webkit-transform:rotate(360deg);
	}
}

@keyframes mejs-loading-spinner { 
	100% { 
		-webkit-transform:rotate(360deg);
		transform:rotate(360deg);
	}
}

/* End:LAYERS */

/* Start:CONTROL BAR */
.mejs__controls { 
	position:absolute;
	list-style-type:none;
	margin:0;
	padding:0 10px;
	bottom:0;
	left:0;
	height:40px;
	width:100%;
	z-index:1;
}

.mejs__controls:not([style*="display:none"]) { 
	background:rgba(0, 0, 0, 0.6);
	//background:rgba(255, 0, 0, 0.7);
	//background:linear-gradient(rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.35));
}

.mejs__button,
.mejs__time,
.mejs__time-rail { 
	float:left;
	margin:0;
	width:32px;
	height:40px;
	font-size:10px;
	line-height:10px;
}

.mejs__button > button { 
	cursor:pointer;
	display:block;
	font-size:0;
	line-height:0;
	text-decoration:none;
	margin:10px 6px;
	padding:0;
	position:absolute;
	height:20px;
	width:20px;
	border:0;
	background:transparent url(../img/mejs-controls.svg);
	overflow:hidden;
}

/* :focus for accessibility */
.mejs__button > button:focus { 
	outline:dotted 1px #999;
}

.mejs__container-keyboard-inactive a,
.mejs__container-keyboard-inactive a:focus,
.mejs__container-keyboard-inactive button,
.mejs__container-keyboard-inactive button:focus,
.mejs__container-keyboard-inactive [role=slider],
.mejs__container-keyboard-inactive [role=slider]:focus { 
	outline:0;
}

/* End:CONTROL BAR */

/* Start:Time (Current / Duration) */
.mejs__time { 
	color:#fff;
	display:block;
	height:24px;
	width:auto;
	font-weight:bold;
	font-size:11px;
	padding:16px 6px 0 6px;
	overflow:hidden;
	text-align:center;
	box-sizing:content-box;
}

/* End:Time (Current / Duration) */

/* Start:Play/Pause/Stop */
.mejs__play > button { 
	background-position:0 0;
}

.mejs__pause > button { 
	background-position:-20px 0;
}

.mejs__replay > button { 
	background-position:-280px 0;
}

/* End:Play/Pause/Stop */

/* Start:Progress Bar */
.mejs__time-rail { 
	direction:ltr;
	width:200px;
	padding-top:10px;
	height:40px;
	position:relative;
	margin:0 10px;
}

.mejs__time-total,
.mejs__time-buffering,
.mejs__time-loaded,
.mejs__time-current,
.mejs__time-handle,
.mejs__time-float,
.mejs__time-float-current,
.mejs__time-float-corner,
.mejs__time-marker { 
	cursor:pointer;
	display:block;
	position:absolute;
	height:10px;
	border-radius:2px;
}

.mejs__time-total { 
	margin:5px 0 0 0;
	background:rgba(255, 255, 255, 0.3);
	width:100%;
}

.mejs__time-buffering { 
	width:100%;
	background:linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
	background-size:15px 15px;
	animation:buffering-stripes 2s linear infinite;
}

@keyframes buffering-stripes { 
	from { 
		background-position:0 0;
	}
	to { 
		background-position:30px 0;
	}
}

.mejs__time-loaded { 
	background:rgba(255, 255, 255, .3);
	width:0;
}

.mejs__time-current { 
	background:rgba(255, 255, 255, 0.9);
	width:0;
}

.mejs__time-handle { 
	display:none;
	position:absolute;
	margin:0;
	width:10px;
	background:#fff;
	border-radius:5px;
	cursor:pointer;
	border:solid 2px #333;
	top:-2px;
	text-align:center;
}

.mejs__time-float { 
	position:absolute;
	display:none;
	background:#eee;
	width:36px;
	height:17px;
	border:solid 1px #333;
	top:-26px;
	margin-left:-18px;
	text-align:center;
	color:#111;
}

.mejs__time-float-current { 
	margin:2px;
	width:30px;
	display:block;
	text-align:center;
	left:0;
}

.mejs__time-float-corner { 
	position:absolute;
	display:block;
	width:0;
	height:0;
	line-height:0;
	border:solid 5px #eee;
	border-color:#eee transparent transparent transparent;
	border-radius:0;
	top:15px;
	left:13px;
}

.mejs__long-video .mejs__time-float { 
	width:64px;
	margin-left:-23px;
}

.mejs__long-video .mejs__time-float-current { 
	width:60px;
}

.mejs__long-video .mejs__time-float-corner { 
	left:18px;
}

.mejs__broadcast { 
	color:#fff;
	position:absolute;
	width:100%;
	height:10px;
	top:15px;
}

/* End:Progress Bar */

/* Start:Fullscreen */
.mejs__fullscreen-button > button { 
	background-position:-80px 0;
}

.mejs__unfullscreen > button { 
	background-position:-100px 0;
}

/* End:Fullscreen */

/* Start:Mute/Volume */
.mejs__mute > button { 
	background-position:-60px 0;
}

.mejs__unmute > button { 
	background-position:-40px 0;
}

.mejs__volume-button { 
	position:relative;
}

.mejs__volume-button > .mejs__volume-slider { 
	display:none;
	height:115px;
	width:25px;
	background:rgba(50, 50, 50, 0.7);
	border-radius:0;
	top:-115px;
	left:5px;
	z-index:1;
	position:absolute;
	margin:0;
}

.mejs__volume-button:hover { 
	border-radius:0 0 4px 4px;
}

.mejs__volume-total { 
	position:absolute;
	left:11px;
	top:8px;
	width:2px;
	height:100px;
	background:rgba(255, 255, 255, 0.5);
	margin:0;
}

.mejs__volume-current { 
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	height:100%;
	background:rgba(255, 255, 255, 0.9);
	margin:0;
}

.mejs__volume-handle { 
	position:absolute;
	left:0;
	bottom:100%;
	width:16px;
	height:6px;
	margin:0 0 -3px -7px;
	background:rgba(255, 255, 255, 0.9);
	cursor:ns-resize;
	border-radius:1px;
}

.mejs__horizontal-volume-slider { 
	height:36px;
	width:56px;
	position:relative;
	display:block;
	float:left;
	vertical-align:middle;
}

.mejs__horizontal-volume-total { 
	position:absolute;
	left:0;
	top:16px;
	width:50px;
	height:8px;
	margin:0;
	padding:0;
	font-size:1px;
	border-radius:2px;
	background:rgba(50, 50, 50, 0.8);
}

.mejs__horizontal-volume-current { 
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	font-size:1px;
	border-radius:2px;
	background:rgba(255, 255, 255, 0.8);
}

.mejs__horizontal-volume-handle { 
	display:none;
}

/* End:Mute/Volume */

/* Start:Track (Captions and Chapters) */
.mejs__captions-button, .mejs__chapters-button { 
	position:relative;
}

.mejs__captions-button > button { 
	background-position:-140px 0;
}

.mejs__chapters-button > button { 
	background-position:-302px 0;
}

.mejs__captions-button > .mejs__captions-selector, .mejs__chapters-button > .mejs__chapters-selector { 
	visibility:hidden;
	position:absolute;
	bottom:40px;
	right:-51px;
	width:85px;
	background:rgba(50, 50, 50, 0.7);
	border:solid 1px transparent;
	padding:0;
	overflow:hidden;
	border-radius:0;
}

.mejs__chapters-button > .mejs__chapters-selector { 
	width:110px;
}

.mejs__captions-button > .mejs__captions-selector, .mejs__chapters-button > .mejs__chapters-selector { 
	visibility:visible;
}

.mejs__captions-selector-list, .mejs__chapters-selector-list { 
	margin:0;
	padding:0;
	display:block;
	list-style-type:none !important;
	overflow:hidden;
}

.mejs__captions-selector-list-item, .mejs__chapters-selector-list-item { 
	margin:0 0 6px 0;
	padding:0 10px;
	list-style-type:none !important;
	display:block;
	color:#fff;
	overflow:hidden;
	cursor:pointer;
}

.mejs__captions-selector-list-item:hover, .mejs__chapters-selector-list-item:hover { 
	background-color:rgb(200, 200, 200) !important;
	background-color:rgba(255, 255, 255, 0.4) !important;
}

.mejs__captions-selector-input, .mejs__chapters-selector-input { 
	clear:both;
	float:left;
	margin:3px 3px 0 5px;
	position:absolute;
	left:-1000px;
}

.mejs__captions-selector-label, .mejs__chapters-selector-label { 
	width:55px;
	float:left;
	padding:4px 0 0 0;
	line-height:15px;
	font-size:10px;
	cursor:pointer;
}

.mejs__captions-selected, .mejs__chapters-selected { 
	color:rgba(33, 248, 248, 1);
}

.mejs__captions-translations { 
	font-size:10px;
	margin:0 0 5px 0;
}

.mejs__captions-layer { 
	position:absolute;
	bottom:0;
	left:0;
	text-align:center;
	line-height:20px;
	font-size:16px;
	color:#fff;
}

.mejs__captions-layer a { 
	color:#fff;
	text-decoration:underline;
}

.mejs__captions-layer[lang=ar] { 
	font-size:20px;
	font-weight:normal;
}

.mejs__captions-position { 
	position:absolute;
	width:100%;
	bottom:15px;
	left:0;
}

.mejs__captions-position-hover { 
	bottom:35px;
}

.mejs__captions-text, .mejs__captions-text * { 
	padding:0;
	background:rgba(20, 20, 20, 0.5);
	white-space:pre-wrap;
	box-shadow:5px 0 0 rgba(20, 20, 20, 0.5), -5px 0 0 rgba(20, 20, 20, 0.5);
}

/* End:Track (Captions and Chapters) */