/* root element should be positioned relatively so that
	child elements can be positioned absolutely */
div.hulu {
	position:relative;
	height:33px;

	/* black background with a gradient */
	background:#000 url(/custom/dilbert/hulu.png) repeat-x 0 -9px;
	width:360px;
}

/* play/pause button */
div.hulu a.play, div.hulu a.pause {
	position:absolute;
	width: 36px;
	height: 35px;
	display:block;
	text-indent:-9999em;
	background:url(/custom/dilbert/hulu.png) no-repeat 10px -66px;
	cursor:pointer;
	/* border-right:1px solid #000; */
}

div.hulu a.play:hover {
	background-position:10px -110px;
}

/* pause state */
div.hulu a.pause {
	background-position:11px -153px;
}

div.hulu a.pause:hover {
	background-position:11px -197px;
}




/* play/pause button */
div.hulu div.previous {
	position:absolute;
    left: 37px;
	width: 21px;
	height: 35px;
	display:block;
	text-indent:-9999em;
	background: url(/custom/dilbert/hulu.png) no-repeat 0 -493px;
	cursor:pointer;
}

div.hulu div.previous:hover {
	background-position:0 -537px;
}


/* play/pause button */
div.hulu div.next {
	position:absolute;
    left: 58px;
	width: 31px;
	height: 35px;
	display:block;
	text-indent:-9999em;
	background: url(/custom/dilbert/hulu.png) no-repeat 0 -410px;
	cursor:pointer;
}

div.hulu div.next:hover {
	background-position:0 -454px;
}







/* the timeline (or "scrubber")  */
div.hulu div.track {
	left:94px;
	position:absolute;
	cursor:pointer;
	width:118px;
	/* border-left:1px solid #999; */
	height:10px;
	top: 5px;
}

/* the draggable playhead */
div.hulu div.playhead {
	position:absolute;
	cursor:pointer;
	background-color:#000;
	opacity:0.3;
	filter: alpha(opacity=30);
	width:3px;
	height:10px;
	top: 5px;
	/* border-right:1px solid #444; */
}

/* buffer- and progress bars. upon runtime the width of these elements grows */
div.hulu div.progress, div.hulu div.buffer {
	position:absolute;
	background-color:#000;
	filter: alpha(opacity=10);
	opacity:0.1;
	width:0px;
	height:10px;
	top: 5px;
}

div.hulu div.buffer {
	background-color:#fff;
	opacity:0.1;
	filter: alpha(opacity=10);
}

/* time display */
div.hulu div.time {
	position:absolute;
	width:64px;
	left:255px;
	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:12px;
	color:#fff;
}

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

/* time display */
div.hulu div.rate {
	position:absolute;
	width:84px;
	left:263px;
	padding:7px 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:12px;
	color:#fff;
}

/* mute / unmute buttons */
div.hulu a.mute, div.hulu a.unmute {
	position:absolute;
	left:215px;
	width:40px;
	height:30px;
	text-align:center;
	padding:8px 0;
	cursor:pointer;
	text-indent:-9999em;
	background:url(/custom/dilbert/hulu.png) no-repeat 5px -328px;
}

div.hulu a.mute:hover {
	background-position:5px -372px;
}

/* unmute state */
div.hulu a.unmute {
	background-position:5px -240px;
}

div.hulu a.unmute:hover {
	background-position:5px -284px;
}