/*
COLOURS:

Blue text: 00b2cd
Grey Text: c8c8c8
Dark Grey: #333333

OVERRIDES FOR PARENT CONTAINERS TO MAKE THE SITE WIDER
*/

img {
	border-width: 0;
}

#pagewidth{width:992px;}
.newslettersignup{left:616px !important;}
.TempHeaderBar{background-color:#000000;width:100%;} /*THIS IS THE BL TOP HEADER BAR TO THE SITE*/
#header table{width:940px;}
#outer{border-width:0px 0px 0px 198px;}

/*TIMELINE CSS*/

#timelineContainer{float:left;width:792px;background-color:#000000;padding-bottom:20px;position:relative;z-index:1;}

#timelineContainer #TimeLineNav{position:absolute;z-index:100;top:0;left:0px;width:100%;height:44px;background-image:url(images/navStates.png);background-repeat:repeat-x; }
#timelineContainer #TimeLineNav ul{float:left;list-style:none;margin:0px;padding:0px;height:44px;position:relative;}
#timelineContainer #TimeLineNav ul li.Home{width:100px;}
#timelineContainer #TimeLineNav ul li.Home span{margin:13px 32px 15px 32px;}
#timelineContainer #TimeLineNav ul li.Support{width:103px;}
#timelineContainer #TimeLineNav ul li.Support span{margin:13px 20px 15px 29px;}
#timelineContainer #TimeLineNav ul li.Teachers{width:100px;}
#timelineContainer #TimeLineNav ul li.Teachers span{margin:13px 20px 15px 25px;}


#timelineContainer #TimeLineNav ul li.Flash{}
#timelineContainer #TimeLineNav ul li.Browse{width:240px}

#timelineContainer #TimeLineNav ul li{float:left;height:100%;list-style:none;font-family:arial;border-right:1px solid #cccccc;border-left:1px solid #555555;position:relative;}
#timelineContainer #TimeLineNav ul li.Blue{background-color:#229fcf;}
#timelineContainer #TimeLineNav ul li a{color:#ffffff;font-size:13px;width:100%;height:100%;float:left;cursor:pointer;text-decoration:none;}
#timelineContainer #TimeLineNav ul li a span{float:left;}
#timelineContainer #TimeLineNav ul li.HasIcon a span{margin:13px 0px 13px 41px;}
#timelineContainer #TimeLineNav ul li.Browse a span{margin:13px 0px 13px 90px;}
#timelineContainer #TimeLineNav ul li a .Icon{float:left;margin:10px 41px 13px 5px;width:22px;height:21px;background-image:url(images/arrowIcon.png);background-repeat:no-repeat;background-position:0px;}
#timelineContainer #TimeLineNav ul li a .Icon.Arrow{float:left;margin:13px 70px 13px 5px;width:17px;height:17px;background-image:url(images/navIcon.png);background-repeat:no-repeat;background-position:0px;}
#timelineContainer #TimeLineNav ul li.Last a span{margin-right:41px;}
#timelineContainer #TimeLineNav ul li.Last{border-right:0px}
#timelineContainer #TimeLineNav ul li:hover a{}
#timelineContainer #TimeLineNav ul li:hover a span{}

#timelineContainer #TimeLineNav .HasSubnav {position:relative;z-index:100;display:block;}
#timelineContainer #TimeLineNav .HasSubnav ul{display:none;position:absolute;left:0px;top:44px;z-index:100;width:100%;float:none;}
#timelineContainer #TimeLineNav .HasSubnav:hover ul{display:block;z-index:100;position:absolute;}
#timelineContainer #TimeLineNav .HasSubnav:hover ul li{z-index:100;float:left;position:relative;width:100%;height:auto;background-color:#3E3B34;clear:left;border:0px;border-bottom:1px solid #cccccc;}
#timelineContainer #TimeLineNav .HasSubnav:hover ul li a{float:left;width:100%;text-decoration:none;color:#ffffff;font-size:12px;}
#timelineContainer #TimeLineNav .HasSubnav:hover ul li a span{float:left;padding:5px 0px 5px 15px !important;margin:0px;}
#timelineContainer #TimeLineNav .HasSubnav:hover ul li a span.Arrow{float:right;padding:5px 15px 5px 5px !important;}
#timelineContainer #TimeLineNav #SubNav li:hover{background-color:#229fcf;}

.ContentOffset{float:left;width:100%;height:44px;}
/*SCROLLERS*/


#timelineContainer #TimeLineHeaderScroller{position:absolute;top:44px;width:100%;height:270px;border-bottom:1px solid #cccccc;position:relative;}
#timelineContainer #TimeLineHeaderScroller #ScrollerMask{position:absolute;display:block;overflow:hidden;width:100%;height:270px;}
#timelineContainer #TimeLineHeaderScroller #ScrollerGrad{position:absolute;z-index:0;left:0px;top:0px;height:270px;width:525px;}
#timelineContainer #TimeLineHeaderScroller #FrontPanel{position:absolute;left:0px;top:0px;height:270px;width:792px;z-index:2;margin:0px;padding:0px;list-style:none;}
#timelineContainer #TimeLineHeaderScroller .caption{
	position: absolute;
	top: 25px;
	left: 73px;
	width: 600px;
	text-align: center;
	padding: 10px 10px 18px;
	color: #fff;	
}

#timelineContainer #TimeLineHeaderScroller .caption p {
	float: left;
	color: #fff;
	display: inline;
	width: 300px;
	margin: 0;	
	text-align: left;
}
#timelineContainer #TimeLineHeaderScroller .caption p.big {
	font-size: 42px;
	margin-bottom: 10px;
	/*text-transform: uppercase;*/
	font-weight: bold;
	text-shadow: 0 0 25px #ffffff;
	width: 100%;	
}
#timelineContainer #TimeLineHeaderScroller .caption p.small {
}

#timelineContainer #TimeLineHeaderScroller a.Button {
	float: left;
	text-align: left;
	margin-top: 20px;
	color: #fff;
	text-decoration: none;
	padding: 5px 10px;
	z-index: 1000;
	position: absolute;
	bottom: 30px;
	left: 80px;
	clear: both;
}

#timelineContainer #TimeLineHeaderScroller #BackPanel{position:absolute;left:0px;top:0px;height:270px;width:792px;z-index:1;margin:0px;padding:0px;list-style:none;background-color:#000000;}
#timelineContainer #TimeLineHeaderScroller #Scroller{position:absolute;left:0px;top:0px;height:270px;z-index:1;margin:0px;padding:0px;list-style:none;}
#timelineContainer #TimeLineHeaderScroller #Scroller li{float:left;width:792px;height:270px;}
#timelineContainer #TimeLineHeaderScroller #ViewTimeLineButton{position:absolute;left:252px;top:190px;z-index:3;}
#timelineContainer #TimeLineHeaderScroller #ViewTimeLineButton a{float:left;width:100%;height:100%;text-decoration:none;}
#timelineContainer #TimeLineHeaderScroller #ViewTimeLineButton a span{color:#ffffff;padding:17px 0px 15px 45px;float:left;text-transform:uppercase;}
#timelineContainer #TimeLineHeaderScroller #ViewTimeLineButton a .Icon{float:left;margin:0px 0px 0px 5px;padding:15px 45px 15px 0px;width:21px;height:21px;background-image:url(images/arrowIcon.png);background-repeat:no-repeat;background-position:0px;}
#timelineContainer #TimeLineHeaderScroller #PagingButtons{position:absolute;left:368px;top:255px;list-style:none;padding:0px;margin:0px;z-index:5;}
#timelineContainer #TimeLineHeaderScroller #PagingButtons a{float:left;cursor:pointer;width:10px;height:10px;margin:0px 5px 0px 0px;display:inline;background-repeat:no-repeat;background-image:url(images/pagingDots.png); text-indent: -9999px;}
#timelineContainer #TimeLineHeaderScroller #PagingButtons a.activeSlide{background-position:-10px 0px;}

#timelineContainer #TimeLineHeaderScroller2{top:45px;width:100%;height:190px;border-bottom:1px solid #cccccc;position:relative;}
#timelineContainer #TimeLineHeaderScroller2 #ScrollerMask2{float:left;width:100%;height:100%;position:absolute;overflow:hidden;display:block;}
#timelineContainer #TimeLineHeaderScroller2 #ScrollerGrad2{position:absolute;left:0px;top:0px;height:190px;width:100%;background-image:url(images/ScrollerGrad.png);background-repeat:repeat-x;}
#timelineContainer #TimeLineHeaderScroller2 #InnerMask {position:absolute;left:55px;top:30px;height:160px;width:672px;overflow:hidden;}
#timelineContainer #TimeLineHeaderScroller2 #Scroller2{position:absolute;left:294px;top:0px;height:100px;padding:30px 0px;list-style:none;margin:0px;}
#timelineContainer #TimeLineHeaderScroller2 #Scroller2 a img{text-decoration:none;border:0px;position:relative;display:block;}

#timelineContainer #TimeLineHeaderScroller2 #Scroller2 a div {
	position: absolute;
	top: 50px;
	left: 0;
	height: 33px;
	width: 100%;
	background: url(images/transparency.png) transparent;
}

	#timelineContainer #TimeLineHeaderScroller2 #Scroller2 .On a div {
		-webkit-border-bottom-right-radius: 10px;
		-webkit-border-bottom-left-radius: 10px;
		-moz-border-radius-bottomright: 10px;
		-moz-border-radius-bottomleft: 10px;
		border-bottom-right-radius: 10px;
		border-bottom-left-radius: 10px;
	}

#timelineContainer #TimeLineHeaderScroller2 #Scroller2 a div p {
	padding: 0 2px;
	margin: 2px 0 0 0;
	text-align: center;
	width: 78px;
	font-size: 11px;
	text-decoration: none;
}

#timelineContainer #TimeLineHeaderScroller2 #Scroller2 li{float:left;width:83px;height:83px;margin:0px 15px 0px 0px;padding:0px; position:relative;border:0px;text-decoration:none;}
#timelineContainer #TimeLineHeaderScroller2 #Scroller2 li span{position:absolute;left:0px;bottom:-20px;color:#ffffff;width:100%;text-align:center;font-size:15px;font-weight:bold;opacity:.5;}
#timelineContainer #TimeLineHeaderScroller2 #Scroller2 li.On span{opacity:1;}
#timelineContainer #TimeLineHeaderScroller2 #Scroller2 li.On img{
	-moz-box-shadow: #fff 0 0 10px;
	-webkit-box-shadow: #fff 0 0 10px;
	box-shadow: #fff 0 0 10px;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	}
#timelineContainer #TimeLineHeaderScroller2 #Scroller2 li a {text-decoration:none;}

#ScrollLeft{position:absolute;left:15px;top:75px;width:auto;z-index:2;cursor:pointer;}
#ScrollRight{position:absolute;right:15px;top:75px;width:auto;z-index:2;cursor:pointer;}
#ScrollLeft span{padding:8px;float:left;color:#ffffff;}
#ScrollRight span{padding:8px;float:left;color:#ffffff;}

#ScrollHomeLeft{position:absolute;left:0px;top:0px;width:30px;z-index:10;cursor:pointer;background-color:#000000;opacity:.5;height:270px;background-image:url(images/HomeLeftScroll.png);background-repeat:no-repeat;background-position:5px 120px}
#ScrollHomeRight{position:absolute;right:0px;top:0px;width:30px;z-index:10;cursor:pointer;background-color:#000000;opacity:.5;height:270px;background-image:url(images/HomeRightScroll.png);background-repeat:no-repeat;background-position:10px 120px}

#timelineContainer p{color:#ffffff;font-size:12px;font-family:arial;float:left;margin:20px 65px 0px 65px;width:670px;}
#timelineContainer p a{color:#ffffff;text-decoration:underline;}
#timelineContainer p a:hover{text-decoration:none;}
#timelineContainer h1{color:#ffffff;font-size:22px;font-family:arial;float:left;margin:40px 65px 0px 65px;font-weight:bold;}
#timelineContainer h2{color:#ffffff;font-size:16px;font-family:arial;float:left;margin:20px 65px 0px 65px;font-weight:bold;}
#timelineContainer strong{font-weight:bold;}

.ImageFrame{float:left;margin:20px 65px 20px 65px;position:relative;width:640px;height:480px;}
.ImageFrame img{position:absolute;left:0px;top:0px;width:640px;}
.ImageFrame .ImageTitle{position:absolute;left:0px;bottom:0px;background-color:#000000;opacity:.8;width:100%;}
.ImageFrame .ImageTitle span{float:left;text-align:center;width:100%;padding:10px 0px;color:#ffffff;}

#timelineContainer table{float:left;margin:20px 65px 20px 65px;color:#ffffff;width:640px;}
#timelineContainer table tr{}
#timelineContainer table tr th{background-color:#333333;border:2px solid black;padding:5px;}
#timelineContainer table tr td{background-color:#888888;border:2px solid black;padding:5px;}

#timelineContainer ul.ContentList{float:left;list-style:none;margin:20px 65px 0px 85px;padding:0px;width:100%;}
#timelineContainer ul.ContentList li{float:left;clear:left;color:#ffffff;background-image:url(images/bullet.png);background-repeat:no-repeat;background-position:0px 8px;padding:0px 0px 10px 10px;width:640px;}
#timelineContainer ul.ContentList li a{color:#ffffff;text-decoration:underline;}
#timelineContainer ul.ContentList li a:hover{text-decoration:none;}

#timelineContainer ul.PanelList{float:left;width:752px;margin:20px 20px 0px 20px;padding:0px;list-style:none;}
#timelineContainer ul.PanelList li{float:left;width:365px;margin:0px 20px 40px 0px;display:inline;position:relative;}
#timelineContainer ul.PanelList li.Title{width:100%;margin:0px 0px 10px 0px;padding:0px 0px 10px 0px;}
#timelineContainer ul.PanelList li.Title h1 {float:left;width:100%;border-bottom:2px dotted #999999;margin:0px;}
#timelineContainer ul.PanelList li.Title h1 a{color:#ffffff;text-decoration:none;font-size:20px;font-family:arial;height:100%;background-color:#000000;}

#timelineContainer ul.PanelList li.Last{margin-right:0px;}
.Video iframe{float:left;margin:0px 0px 0px 18px;display:inline-block; width:400px; height:225px; clear: both;}
#timelineContainer ul.PanelList li .ImagePanel{position:absolute;left:15px;top:-5px;width:128px;height:128px;}
#timelineContainer ul.PanelList li .ImagePanel .ImageCover{position:absolute;z-index:2;width:100%;height:100%;background-image:url(images/tileOverlay.png);}
#timelineContainer ul.PanelList li .ImagePanel .ImageThumb{position:absolute;z-index:1;width:100%;height:100%;}
#timelineContainer ul.PanelList li .ImagePanel .ImageThumb img {width:128px;height:128px;border: 0;}
#timelineContainer ul.PanelList li .ImagePanel .ImageThumb a {width:128px;height:128px; display: block;}
#timelineContainer ul.PanelList li .GreyContainer{float:left;height:118px;width:100%;background-color:#343434;border-radius: 13px;}
#timelineContainer ul.PanelList li .GreyContainer h1{float:left;margin:10px 20px 0px 150px;color:#ffffff;font-weight:bold;font-size:15px;width:205px;}
#timelineContainer ul.PanelList li .GreyContainer h1 a {color: #fff;}

#timelineContainer ul.PanelList li .GreyContainer .Content{float:left;width:205px;margin:5px 0px 0px 150px;display:inline;border-top:1px solid #cccccc;color:#ffffff;font-size:12px;padding:5px 0px 0px 0px;}
#timelineContainer ul.PanelList li .GreyContainer .GreyPanelButton{position:absolute;right:10px;bottom:10px;border-radius: 10px;}
#timelineContainer ul.PanelList li .GreyContainer .GreyPanelButton a{color:#ffffff;float:left;width:100%;height:100%;text-decoration:none;cursor: pointer;}
#timelineContainer ul.PanelList li .GreyContainer .GreyPanelButton a span,
#timelineContainer #TimeLineHeaderScroller .caption a span {float:left;padding:4px 0px 4px 10px;width:145px;}
#timelineContainer ul.PanelList li .GreyContainer .GreyPanelButton a span.Arrow,
#timelineContainer #TimeLineHeaderScroller .caption a span.Arrow {float:right;padding:0px 10px 2px 5px;width:10px;}

#timelineContainer .YearQuickLinks{float:left;clear:left;margin:5px 0px 30px 65px;padding:0px;display:inline;list-style:none;width:690px;}
#timelineContainer .YearQuickLinks li{float:left;margin:0px 30px 0px 0px;padding:0px;color:#cccccc;font-weight:bold;}
#timelineContainer .YearQuickLinks li a{color:#cccccc;text-decoration:none;font-size:14px;font-family:arial;text-decoration:underline;font-weight:normal;}

/*VIEW PAGE*/
#timelineContainer #TitleBox{float:left;margin:30px 65px 0px 65px;display:inline;color:#ffffff;width:670px;position:relative;}
#timelineContainer #TitleBox span.Arrow{float:left;color:#ffffff;margin-top: 6px;}
#timelineContainer #TitleBox a{float:left;margin:2px 0px 0px 5px;color:#ffffff;text-decoration:none;font-size:13px;}
#timelineContainer #TitleBox .Title{float:left;font-size:18px;font-family:arial;clear:left;margin:10px 0px 0px 0px;}
#timelineContainer #TitleBox .RefCode{float:left;font-size:18px;font-family:arial;clear:left;margin:10px 0px 0px 0px;}
#timelineContainer #TitleBox #ViewInFlash{position:absolute;width:300px;right:0px;bottom:0px;background-image:url(images/ButtonGradient.png);background-repeat:repeat-x;border-radius: 10px;border:2px solid #2dcbfb;-moz-box-shadow: #000000 1px 1px 4px;-webkit-box-shadow: #000000 1px 1px 4px;box-shadow: #000000 1px 1px 4px;}
#timelineContainer #TitleBox #ViewInFlash a{float:left;width:100%;height:100%;}
#timelineContainer #TitleBox #ViewInFlash a span{float:left;width:250px;}
#timelineContainer #TitleBox #ViewInFlash a span.TM{margin:2px 0px 0px 0px;}
#timelineContainer #TitleBox #ViewInFlash a span.ArrowIcon{float:right;padding:0px 10px 2px 5px;background-image:url(images/arrowIcon.png);width:26px;height:20px;background-repeat:no-repeat; background-position: center center;}
#timelineContainer #TitleBox #ViewInFlash.Button a span.arrow {float: right; margin-right: 25px; padding-bottom: 5px; margin-top: 2px; width: auto;}
*+ html #timelineContainer #TitleBox #ViewInFlash.Button a span.arrow {float: right; margin-right: 25px; padding-bottom: 5px; margin-top: 5px; width: auto;}

#timelineContainer #LeftColumn{float:left;margin:40px 0px 0px 65px;display:inline; width:130px;}
#timelineContainer #LeftColumn .LargeThumbnail{float:left;width:128px;height:128px;overflow:hidden;position:relative;}
#timelineContainer #LeftColumn .LargeThumbnail .Frame{background-image:url(images/tileOverlay.png);position:absolute;left:0px;top:0px;z-index:2;width:128px;height:128px;}
#timelineContainer #LeftColumn .LargeThumbnail .Frame a{float:left;width:100%;height:100%;text-decoration:none;}
#timelineContainer #LeftColumn .LargeThumbnail img{position:absolute;left:0px;top:0px;z-index:1;width:128px;height:128px;border:0px;}
#timelineContainer #LeftColumn p{float:left;clear:left;color:#ffffff;font-size:11px;margin:15px 0px 5px 0px;width:auto;}
#timelineContainer #LeftColumn ul{float:left;clear:left;margin:0px 0px 0px 0px;padding:0px;list-style:none;width:130px;}
#timelineContainer #LeftColumn ul li{float:left;width:25px;height:25px;background-repeat:no-repeat;margin:0px 3px 0px 0px;background-image:url(images/SocialIcons.png);}
#timelineContainer #LeftColumn ul li.Twitter{background-position:0px 0px;}
#timelineContainer #LeftColumn ul li.Facebook{background-position:-29px 0px;}

#timelineContainer #RightColumn{float:right;margin:40px 65px 0px 0px;display:inline;width:480px;}
#timelineContainer #RightColumn #ViewList{float:left;width:100%;margin:0px;padding:0px;list-style:none;}
#timelineContainer #RightColumn #ViewList li{float:left;border:1px solid #555555;margin:0px 0px 30px 0px;width:478px;}
#timelineContainer #RightColumn #ViewList li .Padding{float:left;padding:12px 20px;width:438px;}
#timelineContainer #RightColumn #ViewList li .Icon{float:left;background-repeat:no-repeat;background-image:url(images/panelIconsBlack.png);}
#timelineContainer #RightColumn #ViewList li.Intro .Icon{background-position:-80px 0px;width:20px;height:20px;}
#timelineContainer #RightColumn #ViewList li.Image .Icon{background-position:0px 0px;width:20px;height:20px;}
#timelineContainer #RightColumn #ViewList li.Video .Icon{background-position:-22px 0px;width:20px;height:20px;}
#timelineContainer #RightColumn #ViewList li.Audio .Icon{background-position:-42px 0px;width:20px;height:20px;}
.Audio audio{float:left;clear:left;margin:0x 0px 0px 50px;display:inline;}
#timelineContainer #RightColumn #ViewList li.Audio p{padding:10px 0px 0px 0px;}
#timelineContainer #RightColumn #ViewList li.Audio p a{color:#ffffff;text-decoration:underline;}
#timelineContainer #RightColumn #ViewList li.Transcript .Icon{background-position:-61px 0px;width:20px;height:20px;}

#ViewFullImage{float:right;margin:0px 0px 5px 0px}
#ViewFullImage a{color:#ffffff;text-decoration:none;font-size:11px;}
#timelineContainer #RightColumn #ImageZoomer .smooth_zoom_preloader { float: left;}
#timelineContainer #RightColumn #ImageZoomer { width: 438px; height: 384px; display: inline-block; }

#FindOutMore{float:left;clear:both;text-align:right;margin:0px 0px 10px 0px;color:#cccccc;text-transform:uppercase;width:100%;}
#FindOutMore a{text-decoration:underline;font-size:14px;color:#cccccc;}

#CenturyFlipBar{clear:both;width:670px;border-top:2px dotted #aaaaaa;border-bottom:2px dotted #aaaaaa;padding:8px 0px 8px 0px;margin:8px 65px 8px 65px;}
#CenturyFlipBar .Links{width:100%;text-align:center;}
#CenturyFlipBar .Links a{text-decoration:none;color:#ffffff;padding:0px 10px;font-size:14px;}

#ExploreMore{float:left;clear:both;width:670px;margin:8px 65px 8px 65px;}
#ExploreMore h2{margin-left:0px;}
#ExploreMore .YearQuickLinks{margin-left:0px;}

#timelineContainer #RightColumn #ViewList h3 {color: #fff;}
#timelineContainer #RightColumn #ViewList li h3{float:left;color:#ffffff;font-size:16px;font-weight:bold;color:arial;margin:0px 0px 0px 5px;}
#timelineContainer #RightColumn #ViewList li .ClearTitle{float:left;width:100%;height:20px;clear:left;}
#timelineContainer #RightColumn #ViewList li p{color:#cccccc;font-size:12px;font-family:arial;padding:0px 0px 10px 0px;float:left;margin:0px;clear:left;width:100%;}
#timelineContainer #RightColumn #ViewList li p a{color:#cccccc;text-decoration:none;}

#timelineContainer .Button{background-image:url(images/ButtonGradient.png);background-repeat:repeat-x;border-radius: 10px;border:2px solid #2dcbfa;-moz-box-shadow: #000000 1px 1px 4px;-webkit-box-shadow: #000000 1px 1px 4px;box-shadow: #000000 1px 1px 4px;background-position:0px 50%;}
#timelineContainer .Button:hover{-moz-box-shadow: #ffffff 1px 1px 10px;-webkit-box-shadow: #ffffff 1px 1px 10px;box-shadow: #ffffff 1px 1px 10px;}

.gzoomwrap{width:100%;}