/* root element should be positioned relatively so that 
	child elements can be positioned absolutely */
#videoframe {	
		}
#musicPlayer {
	display:block;
	width:330px;
	height:60px;
	}
div.listen-controls {
	position:relative;
	height:60px;
	background:url(/images/pages/music/musicplayertrack.png) no-repeat 30px 0px;
	/* black background with a gradient */
	width:300px;
}

/* play/pause button */
div.listen-controls a.play, div.listen-controls a.pause { 
	position:absolute;
	width: 38px;
	height: 30px;
	left: 0px;
	display:block;
	text-indent:-9999em;
	background:url(/images/pages/music/musicplayercontrols.png) no-repeat 0px 0px;
	cursor:pointer;
}

div.listen-controls a.play:hover {
	background:url(/images/pages/music/musicplayercontrols.png) no-repeat 0px 0px;
}

/* pause state */
div.listen-controls a.pause { 
	background-position: 0px -30px;
}

div.listen-controls a.pause:hover {
	background-position: 0px -30px;
}


/* next button */
div.listen-controls a.next {
	}
div.listen-controls a.next:hover {
	}
	
/* previous button */
div.listen-controls a.prev {
	}
div.listen-controls a.prev:hover {
	}

/* the timeline (or "scrubber")  */
div.listen-controls div.track {  
	left:38px;
	position:absolute;
	cursor:pointer;
	width:220px;
	height:30px;
	
	top: 0px;
}

/* the draggable playhead */
div.listen-controls div.playhead {
	position:absolute;
	cursor:pointer; 
	background: transparent url(/images/pages/music/dot.png) center center no-repeat;
	width:9px;
	height:30px;
	left: 0px;
	margin: 0 0 0 18px;
}

/* buffer- and progress bars. upon runtime the width of these elements grows */
div.listen-controls div.progress, div.listen-controls div.buffer {	
}

div.listen-controls div.buffer {

}

/* time display */
div.listen-controls div.time {
	/*position:absolute;		
	width:129px;
	left:300px;
	padding:12px 0;
	text-align:center;
	border:1px solid #999;
	border-width:0 1px;
	
	font-family:futura,"Lucida Grande","bitstream vera sans","trebuchet ms",verdana,arial;	
	font-size:16px;
	color:#999; */
	visibility:hidden;
}

/* total duration in time display */
/*div.listen-controls div.time strong {
	font-weight:normal;
	color:#666;
}*/

/* mute / unmute buttons */
div.listen-controls a.mute, div.listen-controls a.unmute {
	visibility:hidden;
}

div.listen-controls a.mute:hover {

}

/* unmute state */
div.listen-controls a.unmute {

}

div.listen-controls a.unmute:hover {

}