#videobox { 
	overflow:hidden; 
	width:100%; 
	clear:both; 
	background:#000 /*url(images/bg2.png) repeat 0 0*/;
	color: #fff;
	padding:15px 0 0;
	margin-top:20px;
}

#previews {
	width: 300px;
	height: 255px;
	float: left;
	padding: 0;
	margin: 1px 10px 10px 15px;
	border: 0;
	overflow-y:auto;
	overflow-x:hidden;
}

#previews img {
	margin: 3px;
	padding:0;
	float: left;
	border:0px;
	width: 65px;
}
#previews a {
	margin: 0px;
	padding:0;
	float: left;
}

#videobox .descr_section {
	width: 160px;
	min-height: 231px;
	padding: 5px;
	margin: 0;
	float: left;
	background:#202020 /*url(images/videoplayer/bg_text.png) repeat 0 0*/;
}

#videobox .descr_section  .title{
	font-weight:normal;
	min-height:25px;
	padding: 5px 0 10px 0;
	margin: 0;
	clear:both;
	float:none;
}

#videobox .descr_section  .title h2{
	font-size:1.3em;
	padding:0;
	margin:0;
	text-transform:capitilize;
}

#videobox .descr_section  .text{
	padding: 0px;
	margin: 0;
	clear:both;
	float:none;
	width:100%;
	height:142px;
	overflow:hidden;
	overflow-y:auto;
}

#videobox .descr_section  a{
	text-decoration: none;
	color: #0099ff
}

#videobox .descr_section  a:hover{
	text-decoration: underline;
	color: #0099ff
}

#videobox .rate{
	clear: both;
	height: auto;
	width:100%;
	height:50px;
	text-align: left;
	position:relative;
}
#videobox .rate h2{
	color: #0099ff;
	font-size:100%;
	text-transform:uppercase;
	margin:0;
	padding: 2px 0;
}
#videobox .rate .stars{
	float: none;
	clear:both;
	margin:0;
	padding: 2px 0;
}
#videobox .rate .stars a {
	height:32px;
	width:32px;
	padding:0;
	margin:2px 0px;
	display:block; 
	float:left;
}


#videobox .player{
	width: auto;
	height: auto;
	float:left;
	margin:0 auto;
	padding:0px 15px;
} 

/* star rating code - use lists because its more semantic */
/* the default rating is placed as a background image in the ul */
/* use the background position according to the table above to display the required images*/
.rating{
	width:160px;
	height:32px;
	margin:0;
	padding:0;
	list-style:none;
	clear:both;
	position:relative;
	background: url(images/stars/star-matrix.png) no-repeat 0 0;
}
/* add these classes to the ul to effect the change to the correct number of stars */
.star_0 {background-position:0 0}
.star_1 {background-position:0 -32px}
.star_2 {background-position:0 -64px}
.star_3 {background-position:0 -96px}
.star_4 {background-position:0 -128px}
.star_5 {background-position:0 -160px}
ul.rating li {
	cursor: pointer;
 /*ie5 mac doesn't like it if the list is floated\*/
	float:left;
	/* end hide*/
	text-indent:-999em;
}
ul.rating li a {
	position:absolute;
	left:0;
	top:0;
	width:32px;
	height:32px;
	text-decoration:none;
	z-index: 200;
}
ul.rating li.one a {left:0}
ul.rating li.two a {left:32px;}
ul.rating li.three a {left:64px;}
ul.rating li.four a {left:96px;}
ul.rating li.five a {left:128px;}
ul.rating li a:hover {
	z-index:2;
	width:160px;
	height:32px;
	overflow:hidden;
	left:0;	
	background: url(images/stars/star-matrix.png) no-repeat 0 0
}
ul.rating li.one a:hover {background-position:0 -192px;}
ul.rating li.two a:hover {background-position:0 -224px;}
ul.rating li.three a:hover {background-position:0 -256px}
ul.rating li.four a:hover {background-position:0 -288px}
ul.rating li.five a:hover {background-position:0 -320px}
/* end rating code */
h3{margin:0 0 2px 0;font-size:110%}
h3.subHeader{
	padding-left:19px;
}
