/* containers */
.px-video-img-captions-container * {
	box-sizing: border-box;
	position: absolute;
}

video {
		top:0;
}


.px-video-controls {
	position: absolute;
	width:100%;
}

/* progress indicator */

.px-timetip-container {
	position: absolute;
	top:25px;
	width: 125px;
	left:110px;
}

.px-video-progress {
	position:absolute;
	width: 100%;
	height: 6px;
	top:0px;
}

.px-video-progress-fullscreen {
	position:absolute;
	width: 100%;
	height: 12px;
	top:15px;
}

.px-video-progress[value] {
	/* Reset the default appearance */
	-webkit-appearance: none;
	border: none;
}
.px-video-progress[value]::-webkit-progress-bar {
	background-color: #C9C5AF;
}
.px-video-progress[value]::-webkit-progress-value {
	background-color: #565447;
}

/* time */
.px-video-time {
	    float: right;
    margin-top: 4px;
    font-size: 15px;
    margin-right: 20px;
}

/* caption area */
.px-video-captions {
	position: absolute;
	bottom: 3%;
    left: 0;
    width: 100%;
    padding: .3em;
    text-align: center;
}

.px-video-captions span {
	    background-color: rgba(0,0,0,0.7);
    color: #fff;
    font-size: 0.95em;
    /* margin-left: auto; */
    /* margin-right: auto; */
    position: relative;
    padding-top : 0.2em;
	padding-bottom : 0.2em;
	padding-left: 0.4em;
    padding-right: 0.4em;
}



/* buttons */
.px-video-controls_boutons {
	position: relative;
	display: inline-block;
	width: 24px;
	height: 20px;
	/*overflow: hidden;*/ /* non, car empêche la visibilité du outline */
	background: no-repeat url('../images/common/videoPlayer_sprite.svg');
	background-size: 100% 1900%;
}


/* restart button */
/*.px-video-controls button.px-video-restart {
	background-position: -6px -333px;
	margin-left: 0;
}
.px-video-controls button.px-video-restart:hover,
.px-video-controls button.px-video-restart:focus {
	background-position: -6px -297px;
}*/

/* rewind button */
/*.px-video-controls button.px-video-rewind {
	background-position: -6px -189px;
}
.px-video-controls button.px-video-rewind:hover,
.px-video-controls button.px-video-rewind:focus {
	background-position: -6px -153px;
}*/

/* play button */
.playVideo_btn {
	left:110px;
	top:0;
	background-position: 0px 0px;
}
.playVideo_btn_hover {
	background-position: 0px -20px;
}

/* pause button */
.pauseVideo_btn {
	left:110px;
	top:0;
	background-position: 0px -80px;
}
.pauseVideo_btn_hover {
	background-position: 0px -100px;
}

/* stop button */
.stopVideo_btn {
	left:130px;
	top:0;
	background-position: 0px -40px;
}
.stopVideo_btn_hover {
	background-position: 0px -60px;
}

/* forward button */
/*.px-video-controls button.px-video-forward {
	background-position: -6px -261px;
}
.px-video-controls button.px-video-forward:hover,
.px-video-controls button.px-video-forward:focus {
	background-position: -6px -225px;
}*/

/* fullscreen button */
.fullScreen_btn {
	left:150px;
	top:0;
	background-position: 0px -260px;
}
.fullScreen_btn_hover {
	background-position: 0px -280px;
}

.fullScreen_btn_min {
	background-position: 0px -300px;
}
.fullScreen_btn_min_hover {
	background-position: 0px -320px;
}

/* transcription button */
.transcVideo_btn {
	left:340px;
	top:0;
	background-position: 0px -340px;
}
.transcVideo_btn_hover {
	background-position: 0px -360px;
}

/* captions button */
.captionsVideo_btn {
	left:260px;
	top:0;
	background-position: 0px -200px;
}
.captionsVideo_btn_hover {
	background-position: 0px -220px;
}

.captionsVideo_btn_active {
	background-position: 0px -240px;
}

/* mute button */
.muteVideo_btn {
	left:80px;
	top:0;
	background-position: 0px -120px;
}
.muteVideo_btn_hover {
	background-position: 0px -140px;
}
.muteVideo_btn_active {
	background-position: 0px -160px;
}
.muteVideo_btn_active_hover {
	background-position: 0px -180px;
}

/* volume range input */
.px-video-controls input[type='range'] {
	position: absolute;
	-webkit-appearance: none;
	height: 4px;
	width: 100px;
	background-color: #A3D7D8;
	outline:none;
	
}

.px-video-controls input[type='range']:focus::-webkit-slider-thumb {
	outline: 1px #000 dotted;
	outline-offset: 3px;
}
.px-video-controls input[type='range']::-moz-range-track {
	-moz-appearance: none;
	height: 4px;
	background-color: #A3D7D8;
	border: none;
}
.px-video-controls input[type='range']::-webkit-slider-thumb {
	-webkit-appearance: none !important;
	height: 14px;
	width: 8px;
	background-color: #0091A0;
}
.px-video-controls input[type='range']::-moz-range-thumb {
	height: 16px;
	width: 10px;
	background-color: #0091A0;
}


/* fixing display for IE10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.px-video-controls input[type='range'] {
		/*position: relative;*/
		padding: 0;
		height: 8px;
		top: 0px;
	}
	.px-video-time {
		/*margin-top: 4px;*/
	}
	.px-video-captions {
		padding: 8px;
		min-height: 36px;
	}
}

.px-volume {
	position: relative;
    display: inline-block;
    left: 115px;
    top: 6px;
    height: 20px;
}

.video_fullscreen {
	left:0 !important;
	top:0 !important;
}

.px-video-container_fullscreen {
	position: fixed;
	width:100%;
	height:100%;
	top: 0 !important;
	bottom: 0;
	left: 0 !important;
	right: 0;
	background-color: #EAE7D1;
	cursor-visibility: auto-hide;
	-webkit-cursor-visibility: auto-hide;
}

/* Fullscreen styles */

/* style applied through js */
.px-video-controls.js-fullscreen-controls {
	    position: absolute;
    bottom: 0;
    height: 30px;
    padding: 5px;
    width: 100%;
    z-index: 940;
	left:0;
	top:auto;

}


.px-video-captions.js-fullscreen-captions {
	min-height: 3em;
    font-size: 2em;
    line-height: 1.5em;
}

.px-timetip-container-fullscreen {
	position: absolute;
	width: 100%;
	top:13px;
	left:0px;
}



.px-timetip {
	padding: 5px 10px;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 14px;
	background: rgba(0,0,0,0.83);
	border-radius: 3px;
	color: #fff;
	width: auto;
}
.px-timetip:after {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(43, 43, 43, 0);
	border-top-color: #2b2b2b;
	border-width: 10px;
	margin-left: -10px;
}