/* player and playlist go side by side */

div.playlist { background-color:#efefef; border:1px solid #ddd; width: 440px; height: 150px; margin: 0 auto 40px auto;}

/* player dimensions */
#player, #player img {
	display:block;				
	width:440px;
	height:330px;
	border:0px;
	background-color: #CAE0F3;
}

div.playlist p.time {
	padding-top:0px;
	color:#99CC00;
	margin-top:5px;
	font-weight: normal;
	font-size: 14px;
} 

.playlist_area{ margin-top: 20px !Important; margin: 13px auto 0 auto;  padding: 0; width: 415px; }

/* play button on top of splash image */
div.play {

}

div.play:hover {
	opacity:1.0;		
}


/* container for the scrollable items */
div.items {
	height:110px;	
	margin-left:20px;
	float:left;	
}

/* single item */
div.items a {
	border:4px solid #CCC;	
	display:block;
	float:left;
	margin-right:20px;
	width:140px;
	height:100px;
	background:url(img/item.gif) 0 0 no-repeat;
	background-color: #FFF;
	color:#ccc;
	text-decoration:none;
	text-align:center;
	cursor:pointer;
	font-size:12px;
}

div.items p{ margin: 10px 0 0 0; padding: 0; }

div.items a:hover { color:#999;	}

div.items a.active { background-position:-174px 0; color:#555; cursor:default; }


/* next / prev buttons */
a.prev, a.next { display:block; width:30px; height:30px; float:left; background-repeat:no-repeat; margin:35px 0 0 0; }

a.prev { background:url(../../img/button-left.gif); }

a.prev:hover { background:url(../../img/button-left-over.gif); }

a.next { background:url(../../img/button-right.gif); }

a.next:hover { background:url(../../img/button-right-over.gif); }


/* navigator */
div.navi { position:relative; top:165px; left:245px; margin-left:-50px; width:100px; height:0; }

/* items inside navigator */
div.navi span { width:8px; height:8px; float:left; background:url(../../img/dots.gif) 0 0 no-repeat; cursor:pointer; font-size: 4px; padding: 0 3px; }

div.navi span:hover { background-position:0 -8px; }

div.navi span.active { background-position:0 -16px; }