/*
 * Skin for jPlayer Plugin (jQuery JavaScript Library)
 * http://www.happyworm.com/jquery/jplayer
 *
 * Skin Customise
2014.09.11	704 -> 768,  406 -> 432
 */

div.jp-video {
	font-size:1.25em;
	font-family:Verdana, Arial, sans-serif;
	line-height:1.6;
	color:#666;
	width:768px;
	overflow:hidden;
	background:transparent url("/sampleplayer/img/background.png?1427712102") no-repeat 0 0;
	background-color:#000;
	}
div.jp-video-270p {
	width:480px;
}
div.jp-video-360p {
	width:640px;
}
div.jp-video-432p {
	width:768px;
/*	height:432px;  */
}
div.jp-interface {
	position:relative;
	width:768px; height:64px;
}
div.jp-video div.jp-type-single div.jp-interface {
	height:64px;
}
div.jp-video div.jp-type-playlist div.jp-interface {
	height:64px;
}
div.jp-interface ul.jp-controls {
	list-style-type:none;
	padding:0; margin:0;
}
div.jp-interface ul.jp-controls li {
	display:inline;
}
div.jp-interface ul.jp-controls a {
	position:absolute;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
}
a.jp-play,
a.jp-pause {
	width:30px; height:30px;
	z-index:1;
}
div.jp-video a.jp-play,
div.jp-video a.jp-pause {
	top:26px; left:10px;
}
a.jp-play {
	top:1px; left:0px;
	background:url("/sampleplayer/img/btn-spr.png") 0 0 no-repeat;
}
a.jp-play:hover {
	opacity:0.8;
}
a.jp-pause {
	top:1px; left:0px;
	background:url("/sampleplayer/img/btn-spr.png") -78px 0 no-repeat;
	display:none;
}
a.jp-pause:hover {
	opacity:0.8;
}
div.jp-progress {
	position:absolute;
	overflow:hidden;
}
div.jp-video div.jp-progress {
	top:6px; left:73px;
	width:685px; height:12px;
}
div.jp-seek-bar {
	width:0px; height:100%;
	cursor:pointer;
}
div.jp-play-bar {
	background:url("/sampleplayer/img/progress.png") 0 0 repeat-x ;
	width:0px;
	height:100%;
}
div.jp-seeking-bg {
	background:url("/sampleplayer/img/progress-seek.png") 0 0 repeat-x ;
}
a.jp-mute,
a.jp-unmute {
	width:24px; height:24px;
	top:30px; right:137px;
}
a.jp-mute {
	background:url("/sampleplayer/img/btn-spr.png") -54px 0 no-repeat;
}
a.jp-unmute {
	background:url("/sampleplayer/img/btn-spr.png") -30px 0 no-repeat;
	display:none;
}

a.jp-mute:hover,
a.jp-unmute:hover{
	opacity:0.8;
}

div.jp-volume-bar {
	position:absolute;
	overflow:hidden;
	width:80px; height:12px;
	cursor:pointer;
}
div.jp-video div.jp-volume-bar {
	top:36px;
}
div.jp-type-single div.jp-volume-bar {
	right:48px;
}
div.jp-volume-bar-value {
	background:url("/sampleplayer/img/vol-progress.png") 0 0 repeat-x ;
	width:0px; height:12px;
}
div.jp-current-time{
	position:absolute;
	color:#eee;
	font-style:oblique;
	top:2px;
	width:5em;
	font-size:13px;
	text-align:right;
}

div.jp-duration {
	position:absolute;
	color:#eee;
	font-style:oblique;
	font-size:14px;
	top:31px;
	right: 194px;
	width:5em;
	text-align:right;
}




div.jp-playlist {
	width:100%;
	border-top:none;
	overflow:hidden; /* add */
	margin:0; padding:0;
}
div.jp-playlist ul {
	list-style-type:none;
	margin:0; padding:0;
	font-size:.72em;
}
div.jp-playlist li {
	list-style-type:none;
	margin:0; padding:0;
}
div.jp-video div.jp-video-play {
	background:transparent url("/sampleplayer/img/btn-nowloading.png") no-repeat center;
	position:absolute;
	cursor:pointer;
	z-index:2;
}
div.jp-video-play {
	top:-432px;

	width:768px; height:432px;
}
div.jp-jplayer {
	width:768px; height:432px;
	z-index:1;
	overflow:hidden;
}
.jp-jplayer video{
	display:block;
}
.jp-gui{
	position:relative;



}
.jp-video-play-icon{
	visibility: hidden;
}









#video_player img{
	width:auto !important;
	height:auto !important;
	max-height:100%;
	max-width:100%;
	display:block;
	margin:0 auto;
}


/* 20150331 Add newbtns
----------------------------------------------*/

/* rewind fast-foward
---------------------------*/
.rew10sec{
	position:absolute;
	top:28px;
	left:56px;
	width:64px;
	height:24px;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	z-index:1;
	background:url("/sampleplayer/img/rew10.png") 0 0 no-repeat;
	cursor:pointer;
}
.ff30sec{
	position:absolute;
	top:28px;
	left:136px;
	width:64px;
	height:24px;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	z-index:1;
	background:url("/sampleplayer/img/ff30.png") 0 0 no-repeat;
	cursor:pointer;
}
.rew10sec:hover,
.ff30sec:hover,
.key-help:hover{
	opacity:0.8;
}

.key-help{
	position:absolute;
	top:30px;
	right:164px;
	width:24px;
	height:24px;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	z-index:1;
	background:url("/sampleplayer/img/btn-spr.png") -168px 0 no-repeat;
	cursor:pointer;
}



/* fullscreen
---------------------------*/


ul.jp-toggles li div {
	display:block;
	width:30px;
	height:30px;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	position:absolute;
	top:26px;
	right:10px;
	cursor:pointer;
}


.btn-full-screen {
	background:url("/sampleplayer/img/btn-spr.png") -108px 0 no-repeat;
}

.btn-full-screen:hover {
	opacity:0.8;
}

.btn-restore-screen {
	background:url("/sampleplayer/img/btn-spr.png") -138px 0 no-repeat;
}

.btn-restore-screen:hover {
	opacity:0.8;
}



/* quality
---------------------------*/
.btn-quality-change div{
	position:absolute;
	top:28px;
	left:216px;
	width:192px;
	height:24px;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	z-index:1;
	cursor:pointer;
}

.btn-quality-change div:hover{
	opacity:0.8;
}
.btn-quality-change .btn-nml{
	background:url("/sampleplayer/img/btn-qch-nml.png") 0 0 no-repeat;
}
.btn-quality-change .btn-high{
	background:url("/sampleplayer/img/btn-qch-high.png") 0 0 no-repeat;
}
.now-quality{
	width:304px;
	height:40px;
	margin:0 auto 20px;
}
#inline-content{
	padding:30px 0;
}


.sampleplayer,
.sampleplayer #inline-content{
	padding:0 !important;
	margin:0 auto !important;
}




/* jp-video-full
------------------------------------------------*/


.jp-video-full{
	width:100% !important;
	min-width:640px;
}

.jp-video-full .jp-interface{
	width:100% !important;
	background-color: #111;
	box-shadow: 0 -16px 32px #333 inset !important;
	position:absolute;
	bottom:0;
}

ul.jp-toggles li div.btn-full-screen{
}

ul.jp-toggles li div.btn-restore-screen{
	display:none;
}
.jp-video-full ul.jp-toggles li div.btn-restore-screen{
	display:block !important;
}
.jp-video-full ul.jp-toggles li div.btn-full-screen{
	display:none;
}

.jp-video-full .btn-quality-change{
	display:none;
}

.jp-video-full div.jp-progress {
	width:90% !important;
	background-color:#333;
}
@media (min-width:1440px){
.jp-video-full div.jp-progress {
	width:95% !important;
	}
}


.jp-video-full div.jp-volume-bar {
	background-color:#333;
}

.jp-video-full div.jp-play-bar {
	background-size: 100% 100%;
}
.jp-video-full div.jp-seeking-bg {
	background-size: 100% 100%;
}



.jp-video-full{
	background-image:none !important;
}

.jp-video-full .jp-type-single{
	height:100%;
}

/* IE10 under hack
---------------------------*/

.jp-video-full video{
	position:fixed\9;
	top:0\9;
	left:0\9;
}
.jp-video-full video,
.jp-video-full object{
	position:fixed\9;
	top:0\9;
	left:0\9;
}
.jp-video-full .jp-interface{
	position:fixed\9;
	bottom:0\9;
	left:0\9;
}

/* chrome hack
---------------------------*/


@media screen and (-webkit-min-device-pixel-ratio:0) {
	.jp-video-full video{
		position:fixed;
		top:0;
		left:0;
	}
	.jp-video-full video,
	.jp-video-full object{
		position:fixed;
		top:0;
		left:0;
	}
	.jp-video-full .jp-interface{
		position:fixed;
		bottom:0;
		left:0;
	}
}



.sampleplayer div.jp-video div.jp-video-play {
	background:transparent url("/sampleplayer/img/btn-playerstart.png") no-repeat center;
}
.sampleplayer div.jp-video div.jp-video-play:hover{
	background:transparent url("/sampleplayer/img/btn-playerstart_on.png") no-repeat center;
}