#applicationTimeline {
	position: absolute;
	top: 10px;
	width: 100%;
	background: url(../images/timelineSprites.png) repeat-x 0 -388px;
	height: 84px;
}
#timelineStart {
	position: absolute;
	top: 2px;
	left: 0;
	background: url(../images/timelineSprites.png) no-repeat 0 -313px;
	overflow: hidden;
	height: 78px;
	width: 7px;
}
#timelineEnd {
	position: absolute;
	top: 2px;
	right: -6px;
	background: url(../images/timelineSprites.png) no-repeat 0 -313px;
	overflow: hidden;
	height: 78px;
	width: 7px;
}
#timelineStatus {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 34px;
	line-height: 34px;
	color: #333;
	font-size: 16px;
	font-weight: bold;
	white-space: nowrap;
}
#timelineStatusTarget {
	color: #336699;
	margin-left: 1.5em;
	text-transform: capitalize;
}

#timelineStatusTarget.individual {
	color: #99cc66;
}

#timelineStatus span.everyones {
	color: #019898
}
#timelineStatus span.you {
	color: #006666
}
#timelineStatus span.subscriptions {
	color: #336699
}
#timelineOptions {
	position: absolute;
	overflow: hidden;
	height: 43px;
	line-height: 43px;
	top: 35px;
	left: 0;
	width: 100%;
	font-size: 16px;
	color: #999;
	font-weight: normal;
	white-space: nowrap;
	text-align: center;
}
#timelineOptions .center {
	width: 600px;
	margin: 0 auto;
}
#timelineOptions a {
	float: left;
	display: block;
	height: 43px;
	line-height: 43px;
	padding: 0;
	margin: 0 5px;
	background: url(../images/timelineSprites.png) no-repeat 0 -475px;
	color: #fff;
}
#timelineOptions span {
	float: left;
	display: block;
	margin: 0 5px;	
	cursor: pointer;
}
#timelineGoTo {
	margin-right: 0px !important;
}
#timelineOptions a span {
	padding: 0 5px;
	margin: 0;
}
#timelineOptions a:hover,
#timelineOptions a.on {
	color: #66ccff;
}
#timelineOptions a.on span {
	background: url(../images/timelineSprites.png) no-repeat center -512px;
}
#timelineWrapper {
	position: absolute;
	height: 0;
	top: 34px;
	left: 0;
	width: 100%;
	overflow: hidden;
}
/* target IE7 only to correct a heinous dimensioning bug */
*:first-child+html #timelineWrapper {
	height: 1px; /* if this element is given 0 height, you can't do dimension calculations on it in IE7 */
	filter: alpha(opacity=0);
}

#timeline {
	position: absolute;
	clear: right;
	bottom: 0;
	left: 0;
	width: 100%;
}
#timelineGoBack {
	z-index: 40;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 43px;
	width: 53px;
	background: url(../images/timelineSprites.png) no-repeat 0 top;
	text-align: center;
	font-size: 10px;
	line-height: 13px;
	color: #999999;
	text-decoration: none;
	font-weight: bold;
	text-transform: uppercase;
	overflow: hidden;
}
#timelineGoBack:hover {
	color: #fff;
}
#timelineGoBack span {
	margin-top: 26px;
	display: block;
}
#timelineStatusDate span {
	color: #666666;
	font-size: 11px;
}
#dateUnits {
	height: 43px;
	width: 63px;
	top: 0;
	right: 0;
	background: url(../images/timelineSprites.png) no-repeat 0 -234px;
	position: absolute;
	z-index: 30;
	overflow: hidden;
}
#dateUnits ul {
}
#dateUnits ul li {
	text-align: center;
	line-height: 13px;
}
#dateUnits ul a {
	font-size: 10px;
	line-height: 13px;
	color: #999999;
	text-decoration: none;
	font-weight: bold;
	text-transform: uppercase;
}
#dateUnits ul a.on,
#dateUnits ul a:hover {
	color: #fff;
}


				
#timeline {
	z-index: 20;
	background: url("../images/timelineSpritesWide.png") repeat-x 0 -25px;
	height: 43px;
}

#timeline .past, #timeline .present {
	position: absolute;
	font: 7px/7px arial black;
	top: 0;
	color: black;
	display: none;
	}
	
	#timeline a { color: #b3b3b3; text-decoration: none;}

#calendar {
	width: 100%;
	margin: 0 ;
	padding: 0;
	top: 18px;
	left: 0;
	text-align: center;
	overflow: hidden;
	position: absolute;
	height: 32px;
	cursor: default;
	background: #e6e6e6;	
}
	
	#calendar ul {
		position: absolute;
		overflow: hidden;
		width: 60000px;
		height: 25px;
		line-height: 10px !important;
		white-space: nowrap;
		list-style: none;
		margin: 0 ;
		padding: 0;
	}

	#calendar li {
		display: block;
		float: left;
		margin: 0;
		padding: 7px 0px;
		font: 11px/10px arial black;
		color: #222;
		}
			#calendar li.dateItem {
				width: 30px;
				padding: 8px 0px;
				background: url("../images/timelineSprites.png") 0 -157px;
				color: #fff;
				font-size: 9px;
			}

			#calendar li.alt { background: white; color: #0b415c; }
	#calendar li.selected {
			background: url('../images/timelineSprites.png') no-repeat 0 -134px; }
		.yearweek {
			width: 102px;
			background: url('../images/timelineSprites.png') no-repeat 0 -184px;
			}
		.yearmonth {
			width: 153px;
			background: url('../images/timelineSpritesWide.png') no-repeat;
			}	

		#calendar li span {
			font: 9px/9px "lucida grande", tahoma, sans-serif;
			color: #808080;
			margin-left: 2px;
			}
			
			#calendar li.weekend span  { color: #1577a8;}

		/*.day #calendar li {*/
		.weekday {
			background: url('../images/timelineSprites.png') no-repeat 0 -84px;
			width: 51px;
			}

			/*#calendar li.weekend {*/
			li.weekend {
				background: url("../images/timelineSprites.png") no-repeat 0 -109px;
				color: #0b415c;
			}


#timeslider {
	position: absolute;
	z-index: 21;
	top: 0;
	height: 23px;
	font: 11px/11px arial black;	
	color: #fff;
	text-align: center;
	overflow: hidden;
	}
		
	#timeslider .back {
		width: 20px;		
		background: url("../images/timelineSprites.png") no-repeat 0 -43px;		
		}		
	
	#timeslider .left {
		width: 20px;		
		background: url("../images/timelineSprites.png") no-repeat -19px -43px;
		cursor: w-resize;
		}
		
	#timeslider a.center {
		background:  url("../images/timelineSprites.png") repeat-x 0 -64px;
		color: #fff;
		display: block;
		float: left;
		height: 20px;
		line-height: 18px;
		text-indent: 0;
		cursor: move;
		overflow: auto;
		}	
		/* need odd size so it can be centered on resize */
		.day #timeslider a.center { width: 46px; }
		.week #timeslider a.center { width: 96px; }
		.month #timeslider a.center { width: 148px; }
		
	#timeslider .right {
		width: 20px;
		background: url("../images/timelineSprites.png") no-repeat -37px -43px;	
		cursor: e-resize;
		}	
	
	#timeslider .forward {
		width: 20px;
		background: url("../images/timelineSprites.png") no-repeat -56px -43px;				
		}

	#timeslider a {
		display: block;
		float: left;
		position: relative;
		text-decoration: none;
		text-indent: -9999px;
		overflow: hidden;
		height: 21px;
		width: 15px;
		}



