body{
	position:relative;
}

/*//////////////////              DECADE COLORS         //////////////////*/
#decade_4{color:#2F3340}
#decade_5{color:#294A7E}
#decade_6{color:#277684}
#decade_7{color:#DB5C27}
#decade_8{color:#CE0000}
#decade_9{color:#780F18}
#decade_0{color:#2F3340}
#decade_1{color:#294A7E}
/*//////////////////          END DECADE  COLORS         //////////////////*/

#timelineContainer{
	position:relative;
	height:567px;
	width:594px;
}

a#print{
	height:17px;
	width:80px;
	background:url('../img/print.png');
	display:block;
	position:absolute;
	top:0;
	right:0;
	z-index:10;
/*	margin-top:-30px; */
}
/*//////////////////              TIMELINE CARDS         //////////////////*/
#cardWrapper a img{
	border:none;
}
#cardWrapper{
	width:539px;
	height:567px;
	position:relative;
	float:left;
	background:url('../img/cardWrapper_bg.png') top left no-repeat;
}
#card_container{
	width:500px;
	height:567px;
	padding:0px;
	position:relative;
	margin:1px auto;
}

#card_container div.card{
	margin-left:auto;
	margin-right:auto;
	height: 378px;
	color:#FFF;
	font-family:arial, sans-serif;
	position:absolute;
	cursor:pointer;
	overflow:hidden;
}

#cardWrapper #card_container div.front_card{
	cursor:default;
}

#card_container div h2{
	margin:.2em 0 0;
	font-size: 1em;
	padding-left: 1.5em;
	padding-top: 0;
	position:relative;
	font-weight:500;
	height:25px;
	text-transform:uppercase;
}
#card_container div h2 span.year{
	position:absolute;
	right:1.5em;
}

#card_container div.behindVisible{}

#card_container div.front_card{
}

div.card div.cardContent{
	font-weight:300;
	font-size:13px;
	font-family:"times new roman", serif;
	position:relative;
	background-color:#FFF;
	height:332px;
	width:478px;
	margin:1px auto;
	color:black;
	padding:10px 10px 5px;
}
#card_container div.card div.verticalLayout img{
	float:left;
	height:310px;
	width:270px;
	margin-top:8px;
	margin-left:10px;
	margin-right:5px;
}
#card_container div.card div.verticalLayout p{
	padding-top:0px;
	margin-top:8px;
}
#card_container div.card div.horizontalLayout img{
	width:440px;
	height:215px;
	margin:5px auto;
	display:block;
}
#card_container div.card div.horizontalLayout .swfWrapper{
	width:440px;
	height:240px;
	position:relative;
	margin:5px auto;
}
#card_container div.card div.horizontalLayout .swfWrapper object{
	display:block;
	margin:0 auto;
}
#card_container div.card div.horizontalLayout p{
	width:440px;
	margin:10px auto;
	height:100px;
	overflow:hidden;
}

 #coverUpDiv{
	position:absolute;
	top:0;
	left:0;
	z-index:999;
	background:url('../img/1x1.png');
	cursor:none;
}
#card_container div.card div.horizontalLayout p.text-only{
	margin-top:100px;
}
/*//////////////////          END TIMELINE CARDS         //////////////////*/

/*//////////////////              TIMELINE UL            //////////////////*/
#nothing{}/*remove and stylesheet breaks. Don't know why*/
ul#TLnav{
	float:left;
	height:567px;
	width:35px;
	font-family:arial, sans-serif;
	list-style-type:none;
	margin:0;		/*to start*/
	padding:5px 5px 0;		/*to start*/
	z-index:100;
}
ul#TLnav li.decade{
	font-size:12px;
	text-align:right;
	margin:0;		/*to start*/
	padding:2px 0;		/*to start*/
	cursor:default;
}
ul#TLnav li.decade ul{
	list-style-type:none;
	position:relative;
	margin:0;		/*to start*/
	padding:0;		/*to start*/
	zoom:1;
	cursor:pointer;
}
ul#TLnav li.decade ul li span.year{
	font-size:10px;
	text-align:right;
	margin-bottom:1px;
}
ul#TLnav li.decade ul li{
	padding-right:9px;
	padding-top:0px;
	height:14px;
	position:relative;
	zoom:1;
}
ul#TLnav li.decade ul li span.title{
	visibility:hidden;
	position:absolute;
	text-transform:uppercase;
}
/*don't think I'm gonna use this rule*/
ul#TLnav li.decade ul li.inactive{
	color:#b5b5b5;
}
/*//////////////////          END TIMELINE UL            //////////////////*/