#timeline {
	float: left;
    width: 100%;
    height: 800px;
    overflow: hidden;
    margin: 40px auto;
    position: relative;
	background: url("../images/dot.gif") 3px top repeat-y;
}
#dates {
    width: 20%;
    float: left;
    height: 800px;
    overflow: hidden;
	padding-bottom: 30px;
}
#dates li {
    width: 100px;
    height: 100px;
    font-size: 24px;
    list-style: none;
    line-height: 100px;
    padding-left: 10px;
    background: url("../images/biggerdot.png") left center no-repeat;
}
#dates li::before {	
    left: 0;
    content: "";
    position: absolute;
    font-family: "FontAwesome";
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
}
#dates a {
	color: #f0893f;
    padding-bottom: 10px;
}
#dates .selected {
    font-size: 38px;
}
#issues {
    width: 80%;
    float: left;
    height: 800px;
    overflow: hidden;
}
#issues li {
    height: 800px;
    list-style: none;
    text-align: center;
}
#issues li::before {	
    left: 0;
    content: "";
    position: absolute;
    font-family: "FontAwesome";
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
}
#issues li.selected img {
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    -o-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}
#issues li img {
    margin: 10px auto;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE 8 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF); /* IE 6 & 7 */
    zoom: 1;
    -webkit-transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    -ms-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out;
    -webkit-transform: scale(0.7, 0.7);
    -moz-transform: scale(0.7, 0.7);
    -o-transform: scale(0.7, 0.7);
    -ms-transform: scale(0.7, 0.7);
    transform: scale(0.7, 0.7);
}
#issues li h1 {
    color: #f0893f;
	font-size: 4em;
	padding: 3% 0;
    text-shadow: #000 1px 1px 2px;
}
#next, #prev {
    right: 15%;
    width: 40px;
    height: 40px;
	font-size: 70px;
    position: absolute;
    background-repeat: no-repeat;
    text-indent: -9999px;
    overflow: hidden;
}
#next {
	background: url("../images/arrow-up.png") 0 0;
	background-size: 100%;
}
#prev {
	right: 5%;
	background: url("../images/arrow-down.png") 0 0;
	background-size: 100%;
}
#next:hover, #prev:hover {
    background-position: 0 0;
}
#next.disabled, #prev.disabled {
    opacity: 0.2;
}