div.timeline
{
	margin:0 auto 0 140px;
	background-image:url(timeline.png);
	background-repeat:no-repeat;
	width:27px;
	height:24px;
	position:relative;
	display:block;
}
div.tl_start_act { background-position:0 0; }
div.tl_start_end { background-position:0 -144px; }
div.tl_start_sleep { background-position:0 -192px; }
div.tl_active_3 { background-position:0 -24px; }
div.tl_active_2 { background-position:0 -48px; }
div.tl_active_1 { background-position:0 -72px; }
div.tl_active_0 { background-position:0 -96px; }
div.tl_asleep { background-position:0 -216px; }
div.tl_end_now { background-position:0 -120px; }
div.tl_end_sleep { background-position:0 -240px; }
div.tl_fall_asleep { background-position:0 -168px; }

div.timeline div.activity
{
	position:absolute;
	left:30px;
	top:0;
	padding:4px 0;
	height:24px;
	width:100px;
	/*line-height:24px;*/
	opacity:.35;
}
div.timeline:hover
{
	z-index:20;
}
div.timeline:hover div.activity
{
	height:auto;
	opacity:1;
	-webkit-transition: opacity .4s ease-in-out;
	-moz-transition: opacity .4s ease-in-out;
	-o-transition: opacity .4s ease-in-out;
	transition: opacity .4s ease-in-out;
}
div.timeline div.activity div.container
{
	position:absolute;
	left:100px;
	top:-30px;
	width:500px;
	display:none;
}
div.timeline:hover div.activity div.container
{
	display:block;
}

div.timeline div.signpost
{
	position:absolute;
	right:30px;
	top:0;
	width:140px;
	height:24px;
	line-height:24px;
	text-align:right;
}