#player, #video-ctrl, #player-overlay { display: none; }
#player-overlay {
	background:url(/images/player/grid_tv.png) no-repeat;
	width:955px;
	height:543px;
	position: absolute;
	border: solid 1px #c5c5c5;
}

#video-ctrl #close { 
	background: url(/images/player/close.png) no-repeat;
	width: 18px;
	height: 18px;
	text-indent:-999em;
	cursor:pointer;
	position: absolute;
	right: 18px;
	bottom: 11px;
}

.video-home.active { text-decoration: none; }
.video-tags.active { text-decoration: none; }
.video-calendar.active { text-decoration: none; }

#video-title { font-weight: normal; }
#loading { display: none; width:955px; height:543px; text-align: center; position: absolute; z-index: 999; }
	
#video-grid { background:url(/images/player/grid_tv.png) no-repeat; width:955px; height:543px; }
#video-grid .video-preview { height: 132px; width: 235px; float: left; margin: 3px 0 0 3px; z-index: 100; background: url(/images/video-transparent-bg.png); }
#player { width:955px; height:543px; background: url(/images/video-transparent-bg.png); }
	
#tags { width: 815px!important; height: 523px!important; padding: 15px 70px; }
#tags a { color: #cbcbcb; text-decoration: none; padding: 4px; white-space:nowrap;  }
#tags a:hover { background: #cbcbcb; color: #000; }
	
#calendar { height:453px; width:966px; padding-top: 80px; }
#calendar table { width: 320px; margin-left: 1px; margin-right: 1px; }
#calendar th { padding: 20px 0; font-size: 110%; }
#calendar td div.selected { width: 100%; height: 41px; background: url(/images/calendar-cell-bg-selected.jpg) no-repeat; }
#calendar td div.selected a { color: #fff; text-decoration: none; display: block; height: 32px; padding-top: 9px; }
#calendar .day { width: 47px; height: 41px; text-align: center; vertical-align: middle; color: #2f3a3f; background: url(/images/calendar-cell-bg.png) no-repeat; }
#calendar .day-name { background: url(/images/calendar-cell-bg.png) no-repeat bottom left; text-align: center; color: #777d80; text-transform: lowercase; }
	
.jcarousel-prev, .jcarousel-next { width: 35px; height: 236px; cursor: pointer; position: absolute; top: 0; }
.jcarousel-prev { left: -35px; top: 70px; background: url(/images/video-calendar-month-prev.png) no-repeat 50% 50%; }
.jcarousel-next { right: -35px; top: 70px; background: url(/images/video-calendar-month-next.png) no-repeat 50% 50%; }
.jcarousel-prev-disabled, .jcarousel-next-disabled { background: none; cursor: auto; }
.jcarousel-container { position:relative; }
.jcarousel-clip { margin:0; overflow:hidden; position:relative; }
.jcarousel-list { overflow:hidden; position:relative; }
.jcarousel-list li, .jcarousel-item { float:left; width: 322px; list-style-image:none; list-style-position:outside; list-style-type:none; }
	
#tags-container { margin-top: 20px; }
	
ul.tags li { float: left; list-style-type: none; padding: 0 3px 0 0; margin: 0; font-style: italic; }
ul.tags { padding: 2px 0 0 0; margin: 0 40px 0 0; }
ul.tags a { color: #808080; }
	
#calendar-year { width: 100px; text-align: center; margin: 0 auto; font-size: 2em; position: relative; }
#calendar-year-next { background: url(/images/video-calendar-month-next.png) no-repeat; width: 8px; height: 25px; position: absolute; right: 0; top: 10px; }
#calendar-year-prev { background: url(/images/video-calendar-month-prev.png) no-repeat; width: 8px; height: 25px; position: absolute; left: 0; top: 10px; }
    
.blur { color: #808080!important; }

/* root element should be positioned relatively so that 
	child elements can be positioned absolutely */
div.controls { 
	position:relative;
	height:56px;
	margin: -70px 15px 0 15px;
	background: url(/images/player/controls-bg.png);
}

/* when play button toggles between play/pause class 
	we move it's background image */
div.controls a.play, div.controls a.pause { 
	position:absolute;
	width: 16px;
	height:20px;
	left: 50%;
	top: 25px;
	text-indent:-999em;
	margin-left: -8px;
	cursor:pointer;
	overflow:hidden;
	background:url(/images/player/play.png) center top no-repeat;
}

div.controls a.pause { 
	background:url(/images/player/stop.png) center top no-repeat;
}

/* the track or "scrubber"  */
div.controls div.track { 
	position:absolute;
	height:10px;
	left:23px;
	top: 15px;
	background: url(/images/player/track.png) no-repeat;
	text-align:left;
	cursor:pointer;
	width:886px;	
}

/* the draggable playhead */
div.controls div.playhead { 
	position:absolute;	
	height:3px;
	width:3px;
	top: 1px;
	background:url(/images/player/dot.png) no-repeat;
	cursor:pointer;
}

/* buffer and controls are automatically resized, their initial width should be 0 */
div.controls div.progress, div.controls div.buffer {	
	//background-color: url(/images/player/track.png) no-repeat;
	height:10px;
	width:1px;
	top:0;
	margin: 0;
	position:absolute;
	font-size:0px;	

	/* this is the way to fine tune buffer and progress max width */
	max-width:886px;
}

div.controls div.buffer {
	background: url(/images/player/track-buffer.png) no-repeat;
}

/* som proprietary styling for progress bar under mozilla */
div.controls div.progress {
	background: url(/images/player/track-red.png) no-repeat;
}

/* hide time and controls in Apple look */
div.controls div.time {
	display:none;
}

div.controls a.mute {
	position:absolute;
	background:url(/images/player/unmute.png) center top no-repeat;
	height: 11px;
	width: 11px;
	text-indent:-999em;
	left: 22px;
	top: 28px;
	cursor:pointer;
}

div.controls a.unmute {
	position:absolute;
	left: 22px;
	top: 28px;
	text-indent:-999em;
	background:url(/images/player/mute.png) center top no-repeat;
	height: 11px;
	width: 11px;
	cursor:pointer;
}
/*
#player_api {
	background: url(/images/player/grid_tv.png);
}*/