/*
===================================================
	tv.kobalt.nl
	Developed by Semantico
	info@semantico.nl - www.semantico.nl
===================================================
*/

div.playlist-container { position:relative; padding:20px 0 20px 0;  } 

div.playlist {
	position:relative;
	height:280px !important;
	overflow:hidden;
	padding:0 20px 20px 20px;
}

div.playlist div.clips {	
	position:absolute;
	height:20000em;
}

div.playlist, div.clips {
	width:260px;
}

div.clips a {
	display:block;
	overflow:hidden;
	background: #353535 url(/media/themes/style-1/bg-playlist-clip.gif) repeat-x top;
	height:100px;
	width:260px;
	margin-bottom:1px;
	font-size:1em;
	text-decoration:none;
	color:#fff;
}
div.clips a img { float:left; margin-right:5px; }
div.clips a strong { display:block; margin:5px 0 5px 0; }

div.clips a.first {
	border-top-width:1px;
}

div.clips a.playing, div.clips a.paused, div.clips a.progress {
	background:url(/media/light.png) no-repeat 0px -69px;
	padding-right:60px;
	border:0;
}
	
div.clips a.progress {
	opacity:0.6;		
}

div.clips a.paused {
	background-position:0 0;	
}

div.clips a span {
	display:block;		
	font-size:11px;
	color:#666;
}

div.clips a em {
	font-style:normal;
}	

div.clips a:hover {
	background-color:#f9f9fa;		
}

div.clips a.playing:hover, div.clips a.paused:hover, div.clips a.progress:hover {
	background-color:transparent !important;		 
}

/*{{{ go buttons */

a.go {
	display:block;
	width:40px;
	height:20px;
	margin:0 0 0 130px;
	cursor:pointer;
}

a.go:hover, a.go.down:hover {
	
}

a.go.up {
	position:absolute;
	top:-20px;
	background:url(/media/themes/style-1/arw-up.png);
}

a.go.down {
	position:absolute;
	bottom:-20px;
	background:  url(/media/themes/style-1/arw-down.png);
}

a.go.disabled {
	visibility:hidden;		
}

/*********** navigator ***********/
div.navi {
position:absolute;
top:-30px;
margin-left:20px;
width:260px;
height:20px;
text-align:right;
}

/* items inside navigator */
div.navi a {
width:8px;
height:8px;
margin:0 3px 0 3px;
display:inline-block;
background:url(/media/navigator.png) 0 0 no-repeat;
cursor:pointer;
overflow:hidden;
}

/* mouseover state */
div.navi a:hover {
background-position:0 -8px;
}
/* active state (current page state) */
div.navi a.active {
background-position:0 -16px;
} 






/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */