@charset "utf-8";
/* CSS Document */

.playerLayout
{
	width:961px;
	height:541px;
	background:#CCC;
}
/******************* Control buttons of movie player *************************/
.playerBottom
{
	top:441px;
	width:929px;
	height:112px;
	background:url(../images/player_playerbg.png) center no-repeat;
	position:absolute;
	margin:0px 21px 11px 21px;
	
	
}

.playerButtonLayout
{
	margin:-5px 15px 15px 15px;
	width:907px;
	height:100px;
	position:absolute;
}
/************** CSS for Button layout   *******************/
#buttonLayout
{
	width:907px;
	height:39px;
	top:70px;
	position:absolute;
}

#buttonLayout ul
{
	margin:0px;
	padding:0px;	
}
#buttonLayout ul li
{
	display:inline;
	height:34px;
	float:left;
	list-style:none;
}
/******************** CSS of each control button ****************/
.stopButton
{
	width:130px;
	height:39px;
	background:url(../images/player_btn/btn_nor_side_left.png) left no-repeat, url(../images/player_btn/btn_nor_center.png) center repeat-x , url(../images/player_btn/btn_nor_line_left.png) right no-repeat;
	float:left;
}

.stopButtonHover
{
	background-image:url(../images/player_btn/btn_focus_side_left.png), url(../images/player_btn/btn_focus_center.png), url(../images/player_btn/btn_focus_line_left.png);
	background-position:left, center, right;
	background-repeat:no-repeat, repeat-x, no-repeat;
}

.playButton
{
	float:left;
	width:130px;
	height:39px;
	background: url(../images/player_btn/btn_nor_line_right.png) left no-repeat,url(../images/player_btn/btn_nor_center.png) center repeat-x;
	float:left;
}

.playButtonHover
{
	background:url(../images/player_btn/btn_focus_line_right.png) left no-repeat,url(../images/player_btn/btn_focus_center.png) center repeat-x;
}
.forwardButton
{
	width:130px;
	height:39px;
	background: url(../images/player_btn/btn_nor_line_right.png) left no-repeat,url(../images/player_btn/btn_nor_center.png) center repeat-x;
float:left;
}

.forwardButtonHover
{
	background: url(../images/player_btn/btn_focus_line_right.png) left no-repeat,url(../images/player_btn/btn_focus_center.png) center repeat-x;
}
.rewindButton
{
	width:130px;
	height:39px;
	background: url(../images/player_btn/btn_nor_line_right.png) left no-repeat,url(../images/player_btn/btn_nor_center.png) center repeat-x;
	float:left;
}

.rewindButtonHover
{
	background: url(../images/player_btn/btn_focus_line_right.png) left no-repeat,url(../images/player_btn/btn_focus_center.png) center repeat-x;
}
/*.viewButton
{
	width:151px;
	height:39px;
	background: url(../images/player_btn/btn_nor_line_right.png) left no-repeat,url(../images/player_btn/btn_nor_center.png) center repeat-x;
	float:left;
	color:rgb(173,173,173);
	
}

.viewButtonHover
{
		background: url(../images/player_btn/btn_focus_line_right.png) left no-repeat,url(../images/player_btn/btn_focus_center.png) center repeat-x;
		color:rgb(250,250,250);
}
*/
.optionButton
{
	width:130px;
	height:39px;
	background: url(../images/player_btn/btn_nor_line_right.png) left no-repeat,url(../images/player_btn/btn_nor_center.png) center repeat-x, url(../images/player_btn/btn_nor_side_right.png) right no-repeat;

	float:left;
	color:rgb(173,173,173);
}
.optionButtonHover
{
	background: url(../images/player_btn/btn_focus_line_right.png) left no-repeat,url(../images/player_btn/btn_focus_center.png) center repeat-x, url(../images/player_btn/btn_focus_side_right.png) right no-repeat;
	color:rgb(250,250,250);
}

.prevButton
{
	width:130px;
	height:39px;
	background: url(../images/player_btn/btn_nor_line_right.png) left no-repeat,url(../images/player_btn/btn_nor_center.png) center repeat-x;
	float:left;
	text-align:center;
}

.prevButtonHover
{
	background: url(../images/player_btn/btn_focus_line_right.png) left no-repeat,url(../images/player_btn/btn_focus_center.png) center repeat-x;
}

.nextButton
{
	width:125px;
	height:39px;
	background: url(../images/player_btn/btn_nor_line_right.png) left no-repeat,url(../images/player_btn/btn_nor_center.png) center repeat-x;
	float:left;
	text-align:center;
}

.nextButtonHover
{
	background: url(../images/player_btn/btn_focus_line_right.png) left no-repeat,url(../images/player_btn/btn_focus_center.png) center repeat-x;
}

img.center
{
	display:block;
	margin:6px auto 18px auto;
}

.imgTextCenter
{
	display:block;
	margin:11px 30px 18px 30px;
	
}
.textCenter
{
	margin-left:5px;
	text-align:left;
	
}
/************ CSS for progress bar ************/
.progressBallInitial
{
	bottom:120px;
	top:-3px;
	left:0px;
	width:54px;
	height:34px;
	background:url(../images/movie_progress_ball_n_afterimage.png) no-repeat;
	position:absolute; 
	
}
.progressBall
{
	top:18px;
	left:0px;
	width:13px;
	height:14px;
	background:url(../images/movie_progress_ball_n.png) no-repeat;
	position:absolute; 
	margin-left:0px;
}
.progressBallHover
{
	top:18px;
	left:0px;
	width:13px;
	height:14px;
	background:url(../images/movie_progress_ball_f.png) no-repeat;
	position:absolute;
}
#ballCoverage
{
	bottom:112px;
	top:-9px;
	left:0px;
	height:46px;
	width:803px;
}
.progressBarLayout
{
	width:907px;
	height:53px;
	margin-left:2px;
}
.progressBar
{
	height:33px;
	 margin-left:2px;
}
.progress
{
	height:9px;
	float:left;
	margin-top:25px;

}
.progressBg
{
	width:736px;
	background:url(../images/movie_progress_bar_bg.png) repeat-x;
}
.progressBuffer
{
	position:absolute;
	max-width:736px;
	background:url(../images/movie_progress_bar_buffer.png) repeat-x;
}
.progressBarStatus
{
	position:absolute;
	background:url(../images/movie_progress_bar.png) repeat-x;
}
.progressBarClick
{
	width:736px;
	height:23px;
	margin-top:12px;
	position:absolute;
}
/*******  CSS for running video information***********/
.runningTime
{
	width:158px;
  height:16px;
  margin-top:17px;
  margin-right: 10px;
  font-size:18px;
  color: rgb(203,0,32);
  float: right;
  text-align: right;
}
#remainingTime
{
	color:rgb(203,0,72);
}
#totalTime
{
	
  color: #EEEEEE;
}
.runningMovieInfo
{
	height:21px;
	width:892px;
	margin-right:20px;
	position:absolute;
	float:left;
	
}
.runningMovieName
{
  width:713px;
  height:21px;
	float:left;
	font-size:25px;
	color:rgb(225,225,225);
	text-align:left;

}
.runningMovieType
{
	width:164px;
	height:21px;
	float:right;
	font-size:15px;
	color:rgb(59,59,59);
	text-align:right;
	margin-right:20px;
}
/*******  CSS for Back & exit buttons***********/
.keyHelp
{
	left:863px;
	top:10px;
	right:14px;
	position:absolute;
	
	width:85px;
}
.exitKey
{
	width:42px;
	height:42px;
	background:url(../images/keyhelp/Keyhelp_Btn_Exit_N.png) no-repeat;
	float:right;
}
.exitKeyHover
{
	width:42px;
	height:42px;
	background:url(../images/keyhelp/Keyhelp_Btn_Exit_F.png) no-repeat;
	float:right;
}
.backKey
{
	width:42px;
	height:42px;
	background:url(../images/keyhelp/Keyhelp_Btn_Back_N.png) no-repeat;
	float:left;
}
.backKeyHover
{
	width:42px;
	height:42px;
	background:url(../images/keyhelp/Keyhelp_Btn_Back_F.png) no-repeat;
	float:left;
}