#timeline {
	width:100%;
	max-width: 920px;
    height: 400px;
    overflow: hidden;
    margin: 30px auto 50px;
    position: relative;
	background:url(../images/timeline-dot.gif) 0 150px repeat-x;
}
#timeline-dates {
	height: 150px;
    overflow: hidden;
}

#timeline-dates li {
	list-style: none;
    float: left;
    width: 200px;
    height: 150px;
    text-align: center;
	position:relative;
}

#timeline-dates a {
	background-image:url(../images/tree.png);
	background-position:0 0;
	background-repeat:no-repeat;
	background-size:cover;
	position:absolute;
	width:66px;
	height:110px; 
	left:0; 
	right:0; 
	bottom:0;
	margin:0 auto;
	box-sizing:border-box;
	padding:57px 0 0;
	color:#000;
	font-weight:bold;
	
	transition:all .3s linear;
	-moz-transition:all .3s linear;
	-webkit-transition:all .3s linear;
}

#timeline-dates .selected {
	font-size:120%;
	padding:77px 0 0;
    height:150px;
	width:89px;
}
    
#timeline-issues {
	height: 400px;
    overflow: hidden;
} 
#timeline-issues > li {
	width:200px;
    height: 400px;
    list-style: none;
    float: left;
}

.timeline-summary{ padding:20px 0; color:#000; font-size:76%; text-align:center; margin:0 10px;  }
.timeline-summary h2{ font-size:140%; margin:0 0 10px; }
.timeline-summary p{ margin:0 0 8px; }
.timeline-summary ul{ margin:0 0 8px; }
.timeline-summary ul li{ list-style:circle outside;}

    
#grad_left,
#grad_right {
	width: 100px;
    height: 100%;
    position: absolute;
    top: 0;
}
#grad_left {
	left: 0;
    background: url('../images/grad_left.png') repeat-y;
}
#grad_right {
	right: 0;
    background: url('../images/grad_right.png') repeat-y;
}
    
#timeline-next,
#timeline-prev {
    position: absolute;
    font-size: 70px;
    top: 100px;
    -webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	height: 34px;
	width: 34px;
    text-indent: -9999px;
    overflow: hidden;
	
	height: 34px;
	width: 34px;
	border-radius: 50%;
	border: 2px solid #dfdfdf;
	overflow: hidden;
	color: transparent;
	text-indent: 100%;
	white-space: nowrap;
	transition: border-color 0.3s;
}

#timeline-next::after,
#timeline-prev::after {
    content: '';
    position: absolute;
    height: 16px;
    width: 16px;
    left: 50%;
    top: 50%;
    bottom: auto;
    right: auto;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url(../images/cd-arrow.svg) no-repeat 0 0;
}

#timeline-next:hover,
#timeline-prev:hover {
        
}

#timeline-next {
	right: 0;
}
#timeline-prev {
    left: 0;
	-webkit-transform: translateY(-50%) rotate(180deg);
	-moz-transform: translateY(-50%) rotate(180deg);
	-ms-transform: translateY(-50%) rotate(180deg);
	-o-transform: translateY(-50%) rotate(180deg);
	transform: translateY(-50%) rotate(180deg);
}

#timeline-next.disabled,
#timeline-prev.disabled {
	opacity: 0.2;
}