* {
	margin: 0;
	padding: 0;
}


a {
	color: #FFF;
	text-decoration: none;
}
	a:hover,
	a.selected {
		color: #000;
	}

	#timeline {
		width:1350px;
		height: 730px;
		overflow: hidden;
		margin: auto;
		font-family: "hlr_0", sans-serif;
		position: relative;
	}
		#dates {
			width:100px;
			height: auto;
			float: left;
		}
			#dates li {
				list-style: none;
				width: 100px;
				height: 45px;
				line-height:20px;
				font-size: 12pt;
				padding-left: 10px;
			}
				#dates a {
					line-height: 38px;
					color: #FFF;
				}
				
				#dates .selected {
					color:#F00;
			        font-size: 20pt;
					font-family: "HELVE27", sans-serif;
					font-style: normal;
					font-weight: 800;
				}
		
		#issues {
			width:1200px;
			height:730px;
			overflow:hidden;
			float: left;
		}	
			#issues li {
				width: 1200px;
				height: 730px;
				list-style: none;

			}
				#issues li img {
					width:100%;
					height:auto;
				}
				#issues li h1 {
					color: #ffcc00;
					font-size: 48px;
					text-align: center;
				}
				#issues li p {
					font-size: 14px;
					margin: 10px 20px;
					font-weight: normal;
					line-height: 22px;
				}
				
@media only screen and (max-width: 1400px){
	#issues li img { width:90%; height:auto; }
}
				
@media only screen and (max-width: 1300px){
	#dates { width:75px;}
	#dates li {font-size: 12pt; height: 35px;}
	#dates .selected { font-size: 16pt;}
	#issues li img { width:85%; height:auto; }
}
				
@media only screen and (max-width: 1200px){
	#dates { width:75px;}
	#dates li {font-size: 12pt; height: 35px;}
	#dates .selected { font-size: 16pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:75%; height:auto; }
}
				
@media only screen and (max-width: 1100px){
	#dates { width:75px;}
	#dates li {font-size: 12pt; height: 35px;}
	#dates .selected { font-size: 16pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:68%; height:auto; }
}
				
@media only screen and (max-width: 1000px){
	#dates { width:75px;}
	#dates li {font-size: 12pt; height: 35px;}
	#dates .selected { font-size: 16pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:68%; height:auto; }
	.timelines {font-size:52px;  margin-left:53px;}
}

@media only screen and (max-width: 950px){
	#dates { width:75px;}
	#dates li {font-size: 12pt; height: 30px;}
	#dates .selected { font-size: 16pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:65%; height:auto; }
	.timelines {font-size:42px;  margin-left:53px;}
}
				
@media only screen and (max-width: 900px){
	#dates { width:75px;}
	#dates li {font-size: 12pt; height: 30px;}
	#dates .selected { font-size: 16pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:60%; height:auto; }
	.timelines {font-size:32px;  margin-left:53px;}
}
					
@media only screen and (max-width: 850px){
	#timeline { margin-top:-25px;}
	#dates { margin-top:-13px; width:65px; background: none;}
	#dates li {font-size: 9pt; height: 25px;}
	#dates .selected { font-size: 13pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:50%; height:auto; }
	#timelines {}
	.timelines {font-size:22px; margin-top:5px; margin-left:53px;}
}
				
@media only screen and (max-width: 768px){
	#timeline { margin-top:-25px;}
	#dates { margin-top:-13px; width:65px; background: none;}
	#dates li {font-size: 9pt; height: 25px;}
	#dates .selected { font-size: 13pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:50%; height:auto; }
	#timelines {}
	.timelines {font-size:22px; margin-top:5px; margin-left:53px;}
}
			
@media only screen and (max-width: 680px){
	#timeline { margin-top:-25px;}
	#dates { margin-top:-13px; width:65px; background: none;}
	#dates li {font-size: 8pt; height: 20px; padding-left:5px;}
	#dates .selected { font-size: 10pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:43%; height:auto; }
	#timelines {}
	.timelines {font-size:22px; margin-top:5px; margin-left:53px;}
}
				
@media only screen and (max-width: 550px){
	#timeline { margin-top:-25px;}
	#dates { margin-top:-13px; width:45px; background: none;}
	#dates li {font-size: 6pt; height: 15px; padding-left: 5px;}
	#dates .selected { font-size: 10pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:30%; height:auto; }
	#timelines { margin-left:3%;}
	.timelines {font-size:18px; margin-top:5px; margin-left:26px;}
}

@media only screen and (max-width: 400px){
	#timeline { margin-top:-25px;}
	#dates { margin-top:-13px; width:45px; background: none;}
	#dates li {font-size: 4pt; height: 10px; padding-left: 5px;}
	#dates .selected { font-size: 6pt;}
	#issues { margin-left:-10px;}
	#issues li img { width:20%; height:auto; }
	#timelines { margin-left:3%;}
	.timelines {font-size:15px; margin-top:5px}
}

@media only screen and (max-width: 350px){
	#timeline { margin-top:-35px;}
	#dates { margin-top:-13px; width:45px; background: none;}
	#dates li {font-size: 4pt; height:10px; padding-left: 5px;}
	#dates .selected { font-size: 8pt;}
	#issues { margin-left:-15px;}
	#issues li img { width:20%; height:auto; }
	#timelines { margin-left:3%;}
	.timelines {font-size:11px; margin-top:5px}
}

@media only screen and (max-width: 250px){
	#timeline { margin-top:-35px;}
	#dates { margin-top:-13px; width:45px; background: none;}
	#dates li {font-size: 3pt; height:6px; padding-left: 5px;}
	#dates .selected { font-size: 6pt;}
	#issues { margin-left:-15px;}
	#issues li img { width:10%; height:auto; }
	#timelines { margin-left:3%;}
	.timelines {font-size:11px; margin-top:5px}
}