	#timeline {
		position: relative;
		width: 800px;
		height: 550px;
		overflow: hidden;
		margin: 40px auto;
		padding-left: 0;
		background: url('/local/templates/virs/img/timeline/line.gif') 12px top repeat-y;
	}
		#dates {
			padding: 0;
			width: 205px;
			height: 550px;
			overflow: hidden;
			float: left;

			padding-left: 5px;
			margin: 40px 0;
		}
			#dates li {
				list-style: none;
				width: 200px;
				height: 100px;
				line-height: 100px;
				font-size: 24px;
				margin: 0;
			}
				#dates a {
					position: relative;

					-moz-outline: none;
					outline: none;
					ie-dummy: expression(this.hideFocus=true);

					padding: 0 0 0 30px;
					line-height: 38px;
					color: #000;
					font-size: 14pt;
					font-family: 'proxima_nova_rgregular';
					text-decoration: none;

					-webkit-transition: font-size 0.5s;
					-moz-transition: font-size 0.5s;
					-o-transition: font-size 0.5s;
					-ms-transition: font-size 0.5s;
					transition: font-size 0.5s;
/*
					background-image: url('../img/timeline/dot.gif');
 					background-repeat: no-repeat;
					background-position: 0 50%;
*/
				}
				#dates .selected {
					color: #000;
					font-size: 27pt;
					font-family: 'proxima_nova_ltlight';
/*
					background-position: -400px 50%;
*/
				}
				#dates a:before {
					position: absolute;
					display: block;
					left: 0;
					top: 50%;
					margin-top: -7px;

					width: 13px;
					height: 13px;

					border: 1px solid #ababab;
					background-color: #fff;
					border-radius: 7px;
					content: "";

					padding: 0;

					transition: transform 0.3s ease;
					-webkit-transition: -webkit-transform 0.3s ease 0s;
				}
				#dates a:hover:before {
					transform: scale(1.15);
					-webkit-transform: scale(1.15);
				}
				#dates .selected:after {
					position: absolute;
					display: block;
					left: 3px;
					top: 50%;
					margin-top: -4px;

					width: 9px;
					height: 9px;
					border-radius: 5px;

					background-color: #a3222e;
					content: "";

					padding: 0;
				}
		
		#issues {
			padding: 0;
			width: 490px;
			height: 550px;
			overflow: hidden;
			float: left;
		}	
			#issues li {
				width: 490px;
				height: 550px;
				list-style: none;
				margin: 0;
			}
				#issues li.selected img {
				}
				#issues li img {
/*
					float: left;
					margin: 10px 30px 10px 50px;
*/
				}
				#issues li h2 {
					color: #000;
					font-size: 23px;
					letter-spacing: 0.035em;
					font-family: 'proxima_nova_rgregular';
				}
				#issues li p {
					font-size: 12pt;
					font-weight: normal;
					line-height: 1.5em;
				}

		#grad_top,
		#grad_bottom {
			left: 0;
			width: 20px;
			height: 100px;
			position: absolute;
		}
			#grad_top {
				top: 0;
				background: url('/local/templates/virs/img/timeline/grad_top.png') repeat-x 0 0;
			}
			#grad_bottom {
				bottom: 0;
				background: url('/local/templates/virs/img/timeline/grad_bottom.png') repeat-x 0 100%;
			}

		#next,
		#prev {
			position: absolute;
			left: 0;
			font-size: 0;
			width: 28px;
			height: 22px;
		}
			#next:hover,
			#prev:hover {
				background-position:  0 0;
			}
			#next {
				bottom: 0;
			}
			#prev {
				top: 0;
			}
				#next.disabled,
				#prev.disabled {
					opacity: 0.2;
				}

#prev i,
#next i {
	display: block;
	margin-top: 10px;
	width: 25px;
	height: 15px;
	text-align: center;

	transition: 0.3s ease;
	-webkit-transition: 0.3s ease 0s;
}



#next i:after,
#next i:before,
#prev i:after,
#prev i:before {
	/* position: absolute;	top: 50%; */
	display: block;

	width: 60%;
	height: 1.5px;

	background-color: #a3222e;
	content: "";

	padding: 0;

	transition: transform 0.3s ease, margin 0.3s ease;
	-webkit-transition: -webkit-transform 0.3s ease 0s, margin 0.3s ease 0s;
}

#prev i:before {
	transform: translateY(0px) rotate(-43deg);
	-webkit-transform: translateY(0px) rotate(-43deg);
}
#prev:hover i:before {
	transform: translateY(0px) rotate(-52deg);
	-webkit-transform: translateY(0px) rotate(-52deg);
}

#prev i:after {
	margin-top: -2px;
	margin-left: 10px;
	transform: translateY(0px) rotate(43deg);
	-webkit-transform: translateY(0px) rotate(43deg);
}
#prev:hover i:after {
	margin-left: 9px;
	transform: translateY(0px) rotate(52deg);
	-webkit-transform: translateY(0px) rotate(52deg);
}

#next i:before {
	transform: translateY(0px) rotate(43deg);
	-webkit-transform: translateY(0px) rotate(43deg);
}
#next:hover i:before {
	transform: translateY(0px) rotate(52deg);
	-webkit-transform: translateY(0px) rotate(52deg);
}

#next i:after {
	margin-top: -2px;
	margin-left: 10px;
	transform: translateY(0px) rotate(-43deg);
	-webkit-transform: translateY(0px) rotate(-43deg);
}
#next:hover i:after {
	margin-left: 9px;
	transform: translateY(0px) rotate(-52deg);
	-webkit-transform: translateY(0px) rotate(-52deg);
}
