/* CSS Document */

/* FONT COLORS */

span.cap,
.homeheader h3,
.storybody .introtext,
.related font.highlight,
.storybody h2.pullquote,
.storybody p.pullquote,
.storybody h2.pullquoteinline,
.storybody p.bio,
.credits,
#slideshow .captionright,
#map .imagetitle,
#slideshow .imagetitle
{ color: #132861; }

/* BACKGROUND COLORS */
	/* select a dark color that looks good with white text */
h1 .bg,
.homebody .right .sidebar .header,
.boxsingle,
.homewatchvideo .boxsolid,
.homewatchvideo .box, 
.homewatchvideo .boxnomargin,
.storyhome,
.storybody .right .related .header,
.storybody .rightfifty .related .header,
.storybody .right .related li.highlight,
.storybody .rightfifty .related li.highlight,
.watchvideo .boxsolid,
.watchvideo .box,
.intro,
.interactivebutton,
.promovideo { 
	background-color: #132861; }
	/* select light color that looks good with black text */

/* BORDER COLORS */

.storybody .topright .image img,
.promoleftimage,
.promorightimage,
#slideshow .image img
 { 
	border: 1px solid #132861; }
	
#nav li {
	border-left: 2px solid #132861; }

.resourcesimage { width: 200px; }
.resourcesimageleft img,
.resourcesimageright img,
.resourcesimage img { 	
	border: 2px solid #132861; }

#slideshow table.thumbnails { 
	border-top: 1px solid #132861; 
	border-left: 1px solid #132861; }

#slideshow table.thumbnails td {
	border-bottom: 1px solid #132861; 
	border-right: 1px solid #132861; }


/* LINK COLORS */

a:link, 
a:visited { color: #132861; text-decoration: none; }
a:active, 
a:hover { color: #da2d1c; text-decoration: none; }

.datelistings a:link, 
.datelistings a:visited { color: #fff; text-decoration: none; }
.datelistings a:active, 
.datelistings a:hover { color: #da2d1c; text-decoration: none; }

.storyairson a:link, 
.storyairson a:visited { color: #fff; text-decoration: none; }
.storyairson a:active, 
.storyairson a:hover { color: #132861; text-decoration: none; }

.homeheader h3 a:link, 
.homeheader h3 a:visited { color: #ffffff; text-decoration: none; }
.homeheader h3 a:active, 
.homeheader h3 a:hover { color: #da2d1c; text-decoration: none; }

.homebody .right .sidebar a:link, 
.homebody .right .sidebar a:visited { color: #132861; }
.homebody .right .sidebar a:active, 
.homebody .right .sidebar a:hover { color: #da2d1c; }

.homebody .right .sidebar .header a:link, 
.homebody .right .sidebar .header a:visited { color: #FFF; }
.homebody .right .sidebar .header a:active, 
.homebody .right .sidebar .header a:hover { color: #CCC; }

	/* navigation indicator - set id in body tag for each page */
#nav li a:hover { color: #132861; }

#one #nav li a.one, 
#two #nav li a.two,
#three #nav li a.three,
#four #nav li a.four,
#five #nav li a.five,
#six #nav li a.six,
#seven #nav li a.seven, 
#eight #nav li a.eight,
#nine #nav li a.nine, 
#ten #nav li a.ten
{ color: #831b11; }


/* IMAGES */

/* homepage main image */
.homeheader  { 
background-image:url(../images/homepage_main.jpg); 
background-repeat:no-repeat; }


/* to put main image just in right td 
.homeheader td.left { 
background-image:url(../images/homepage_main.jpg); 
background-repeat:no-repeat; } */

/* for fullpage background image 
#storyhome { 
background-image:url(../images/homepage_main.jpg);
background-repeat: no-repeat; } */

/* end colors */

body, div, p, th, td, li, ul, dd {
 font-size: 100%; 
 font-family: Arial, Helvetica, sans-serif;  }

body { 
	background-color:#000; 
	color:#333; 
	margin: 0px; 
	padding: 0px; }

/* page types */

#storyhome { 
	width: 780px;  
	background-color:#FFF; 
	text-align: left; }

#template { 
	width: 780px;  
	background-color:#FFF; 
	text-align: left; }

/* generic properties */

h1, h2, h3, h4, h5 { 
    font-family:"Trebuchet MS", Georgia, "Times New Roman", Times, serif; }
h1 { font-size: 1.5em; }
h2 { font-size: 1em; }
h3 { font-size: .8em; }

h1 span.bg { 
	/* margin-left: 24px; */
	padding: 0px 5px; 
	color: #fff; }

img { border: none; }

span.cap { 
	font-family:"Trebuchet MS", Georgia, "Times New Roman", Times, serif; 
	font-size: 1.5em; 
	font-weight: bold; }

p { font-size: .8em; }

p.help { font-size: .7em; }

div.imgcaption { float: right; 
margin-left: 24px; padding: 0px;}
div.imgcaption p { text-align:center;
margin: 0px; padding: 0px; font-size: .75em;  }

a.continue { font-variant: small-caps; font-weight: bold; }
a.continuewhite { font-variant: small-caps; font-weight: bold; color: #FFF;}

.clear { float:none; clear:both; margin: 0px; padding: 0px; }

	/* don't change this color */
.flwred { color: #D22805; }

/* home body */

.homebody { background-color: #000; }
.homebody .left { float: left; width: 250px; }
.homebody .right { float: right; width: 510px; }

.homebody .right .sidebar { width: 510px; 
	color: #ccc; 
	padding-bottom: 10px; margin-top: 10px; }

.homebody .right td { vertical-align: top; }

.homebody .right .sidebar .header { 
    color: #fff; 
	font-size: .9em;
	padding: 7px 0px 7px 15px; 
	margin-bottom: 1px; }
	
.homebody .right .sidebar .sidebarbody { 
    background-color: #c4c9d7; 
	padding: 10px 0px; 
	color: #333;}

/* holly hack */
* html .homebody .right .sidebar .sidebarbody { height: 0.01%; }

.homebody .right .sidebar p {
	margin: 5px 15px 5px 15px;
	font-size: 0.8em; }

.homebody .right .sidebar h3 {
	padding: 15px 15px 5px 15px;
	margin: 0px;
	font-size: 0.8em; }
	
.homebody .right .sidebartwo { width: 510px; 
    background-color: #DDD; 
	color: #333; 
	padding-bottom: 10px; margin-top: 10px; }

.homebody .right .sidebartwo p {
	margin: 5px 15px 5px 15px;
	font-size: 0.8em; }
	
.homebody .right .sidebartwo h3 {
	padding: 15px 15px 0px 15px;
	margin: 0px;
	font-size: 0.8em; }
		
.homebody .left .sidebar { margin-top: 10px;
    width: 230px; 
    background-color: #eee; 
	color: #333333; 
	padding-bottom: 10px; }

.homebody .left .sidebar p {
	margin: 2px 15px;
	font-size: 0.7em; }

.sidebarimg img { margin: 5px 10px 0 15px;}

.boxsingle { display: block; 
	padding: 3px 8px 3px 8px;
	position: relative;
	margin-top: 80px; 
	margin-left: -115px;
	width: auto; 
	font-size: .7em; 
    font-variant: small-caps;
    font-weight: bold;
    text-align: right; 
	color: #fff; 
	float: left; } 

/* home header */

.homeheader {
background-color: #000; }

.homeheader td { vertical-align: bottom; }

.hometitle { 
    margin-left: 0px; 
    margin-top: 26px; 
	margin-bottom: 10px; 
	margin-right: 10px;
	float: left; 
	clear: none; }

	
.hometitle h1 { 
font-size: 3em;
margin: 0px 0px 0px 10px; 
padding: 0px; 
line-height: 40px;
color: #ffffff; }
	
	.hometitle h2 { 
font-size: 2em;
margin: 0px 0px 0px 10px; 
padding: 0px; 
line-height: 40px; 
color: #ffffff; }

.homeheader h3 { 
font-size:1.75em; 
margin: 0px 0px 0px 10px; 
padding: 0px; 
 }

.homeintro { 
  	width: 100%; height: auto; 
	margin-top: -6px; margin-left: 0px; 
	/* background-color: #DDD; */
	background-repeat: no-repeat; }

.homeintro p { 
	font-size: .9em; 
	color: #fff; 
	padding: 10px 12px 10px 10px; 
	margin: 0px;  
	filter: alpha(opacity=100);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    -moz-opacity: 1.0; opacity:1.0; }
		
.datelistings { 
	font-size: .7em;  
	padding: 2px 0px; 
	background-color: #132861;
	text-align: right; 
	color: #ddd;
	width: 100%;}

.homewatchvideo { 
	float: left;  }
		
.homewatchvideo .boxsolid img,
.homewatchvideo .box img { margin-right: 5px; }
	
.homewatchvideo .boxsolid { display: block; 
	padding: 3px 0px 3px 0px;
	margin: 1px 0px; 
	width: 170px; font-size: 1em; 
	font-family:"Trebuchet MS", Georgia, "Times New Roman", Times, serif;
    font-weight: bold;
    text-align: right; 
	color: #fff; }

.homewatchvideo .box, .homewatchvideo .boxnomargin { 
    display: block; 
	padding: 3px 0px 3px 0px;
	width: 170px; font-size: .7em; 
	font-family:"Trebuchet MS", Georgia, "Times New Roman", Times, serif;
    font-weight: bold;
    text-align: right; 
	color: #fff; 
	filter: alpha(opacity=60);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
    -moz-opacity: 0.60; opacity:0.6; }
 
.homewatchvideo .box { 	margin: 1px 0px; }
.homewatchvideo .boxnomargin { margin: 1px 0px 0px 0px; }
.homewatchvideo a:link, 
.homewatchvideo a:visited { 
	display: block; 
	color: #fff; 
	text-decoration: none; }
.homewatchvideo a:active, 
.homewatchvideo a:hover { 
	display: block; 
	color: #fff; 
	text-decoration: none; 
	background-color:transparent; }
.homewatchvideo a:hover div.box,
.homewatchvideo a:hover div.boxnomargin { 
	filter: alpha(opacity=100);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    -moz-opacity: 1.00; opacity:1; }	

/* template header */

.header { margin: 0px; padding: 0px; }
.storyheader { margin: 0px; padding: 0px;
	background-image:url(../images/storyheader.jpg);
	background-repeat: no-repeat; 
	background-color: #333; }

.storyhome { 
	position: relative; 
	float: left; 
	margin-top: -15px; 
	position: relative; 
	left: 15px; 
	font-variant: small-caps; 
	font-size: .7em; 
	padding: 3px 8px 3px 8px }
	
.storyhome a:link, 
.storyhome a:visited { color: #fff; text-decoration: none; }
.storyhome a:active, 
.storyhome a:hover { color: #ccc; text-decoration: none; }

.storyairson { position: relative; float: right; margin-top: -20px;
font-variant: small-caps; 
font-size: .7em; color: #ccc; margin-right: 10px;}

/* template story body */

.storybody .left { float: left; width: 455px; }
.storybody .interviewleft { float: left; width: 730px; }
.storybody .right { float: right; width: 325px; }

.storybody p { margin: 15px 24px 15px 24px;  }

.storybody p.pullquote, .left p.pullquote {
	padding-left: 20px;
	text-align: left;
	font-size: 18px;
	line-height: 22px;
}

.storybody .photo400 {width: 400px; background-color:#CCCCCC; padding:10px 10px 10px 0px; float: left; margin: 0 20px 10px 0; }
.storybody .photo400  p {margin: 0px; padding-left: 10px; padding-top: 5px; font-size: 12px; color: #666;}


.storybody .topleft { width: 200px; color: #FFF; float: left; }

.storybody .topright { float:right; width: 564px; }
.storybody .topright .image { margin-left: 24px;
 	font-size: .7em; font-style: italic; }

.storybody .left { float: left; width: 500px; }
.storybody .left p { margin: 15px 0px 15px 24px;  }

.storybody .right { float: right; width: 210px; }
.storybody .right p { 
   margin: 0px 15px; }

.storybody h2 { margin: 15px 24px 15px 24px; }

.storybody h3 { margin: 15px 24px 15px 24px; }

.storybody h1 { margin: 0px 0px 15px 24px; }

.storybody .introtext { 
	font-style: italic; 
	line-height: .85em; }
	
.storybody .introtext p { 
	margin: 10px 24px;  }

a.backtotop { margin: 15px 24px 15px 24px; font-size: .8em; }

.storybody .right .related { 
    background-color: #EEE; 
	color: #333333; 
	padding-bottom: 20px;   
	width: 210px; 
	float: right; }

.related font.highlight {
	font-style: italic; }
 
.storybody .rightfifty .related { 
    width: 390px; 
	background-color: #EEE; 
	color: #333333; 
	padding-bottom: 20px;}

.storybody .right .related .header,
.storybody .rightfifty .related .header { 
    color: #FFFFFF; 
    font-variant: small-caps; 
	font-size: .7em;
	padding: 3px 0px 3px 15px;
	margin-bottom: 10px; }

.storybody .right .related p,
.storybody .rightfifty .related p {
	margin: 0px 15px;
	padding: 5px 0px; 
	font-size: 0.7em;}

.storybody .related .active img,
.storybody .related .on img { 
    border: 1px solid #000; 
	margin-bottom: 20px; 
	padding: 0px; }
	
.storybody .right .related ul, .storybody .rightfifty .related ul { 
	margin: 5px; padding-left: 15px; }
	
.storybody .right .related li, .storybody .rightfifty .related li {
	list-style-position: inside; 
	list-style-type: square; 
	font-size: .8em; }
	
.storybody .right .related li.highlight,
.storybody .rightfifty .related li.highlight {
    font-weight: bold;  }

div.active { filter: alpha(opacity=60);
 filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
 -moz-opacity: 0.60; opacity:0.6; }
 
div.active:hover { filter: alpha(opacity=100);
 filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
 -moz-opacity: 1.0; opacity:1.0; }
 
img.interview {  margin: 0px 5px 0px 0px; }
.active img.interview {  margin: 0px 5px 0px 0px; }
	
.storybody h2.pullquote {
	margin: 0px 24px 24px 24px;
	text-align: right;
	line-height: 30px;
}

.storybody h2.pullquoteinline {
	margin: 24px 24px 24px 520px; 
	width: 200px; 
	position: absolute;
	text-align: right;
	line-height: 25px; }

.inlineimg {
	margin: 24px 0px 24px 550px; 
	width: 200px; 
	position: absolute;
	text-align: right;
	color: #333;
	font-size: .7em;
	text-align: left; }
	

.storybody p.bio {
    font-weight: bold; 
	font-style: italic;
	text-align: left;
	line-height: 16px;
	margin: 24px; }

.storybody .voicesleft { 
	float: left; 
	width: 350px; 
	padding: 0px; 
	margin: 0px 0px 0px 24px; }
	
.storybody .voicesright { 
	float: right; 
	width: 350px; 
	margin: 0px; 
	margin: 0px 24px 0px 0px;  }
	
.storybody .leftfifty { 
	float: left; 
	width: 420px; 
	margin: 0px; 
	padding: 0px; }
	
.storybody .rightfifty { 
	float: right; 
	width: 325px; 
	margin: 0px; 
	padding: 0px;  }

.inlinesidebar {
	margin: 0px; 
	padding: 5px 0px;  
	width: 350px; 
	color: #333; }

.inlinesidebar p {
	font-size: .75em;
	line-height: normal;
	font-weight: normal; }

#nav { 
   /* width: 780px; */
   margin-top: 0px; padding: 0px; 
   left: 0px; position: relative; 
   margin-bottom: 3px;  
   margin-left: 0px;
   height: 42px;}
   
#nav li a.one { 
	border-left: 2px solid #fff; 
	padding-left: 20px; }

#nav li {
	width: auto;
	float: left;
	font-size:11px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: left;
	vertical-align: middle;
	margin: 0px; 
    float: left; 
    color: #999;
    padding: 5px 20px; }
	
#nav a { text-decoration: none; 
   color: #000000; }

#nav ul {
	margin: 0px 0px 0px 0px; 
	padding: 10px 0px 0px 0px; 
	list-style-type: none; 
    width: 780px; }

#nav li.borderoff { border: none; } 

#nav li a {
	width: auto;
	font-size:11px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: left;
	vertical-align: middle;
    float: left; }

#nav li a:hover {
	width: auto;
	font-weight: bold;
	text-align: left;
	vertical-align: middle;
	float: left; }

/* story specific */

.watchvideo { 
    position:relative; 
	float: left; 
	left: 24px;  }
	
.watchvideo .boxsolid { display: block; 
	padding: 3px 8px 3px 8px;
	margin: 1px; 
	width: 170px; font-size: 1em; 
    font-family:"Trebuchet MS", Georgia, "Times New Roman", Times, serif;
    text-align: right; 
	color: #fff; }

.watchvideo .box { display: block; 
	padding: 3px 8px 3px 8px;
	margin: 1px; 
	width: 170px; font-size: .7em; 
    font-family:"Trebuchet MS", Georgia, "Times New Roman", Times, serif;
    text-align: right; 
	color: #fff; 
	filter: alpha(opacity=60);
 	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
 	-moz-opacity: 0.60; opacity:0.6;}

.watchvideo a:link, 
.watchvideo a:visited { 
	display: block; 
	color: #fff; 
	text-decoration: none; }
.watchvideo a:active, 
.watchvideo a:hover { 
	display: block; 
	color: #fff; 
	text-decoration: none; 
	background-color:transparent; }
.watchvideo a:hover div.box { 
	filter: alpha(opacity=100);
 	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
	 -moz-opacity: 1.00; opacity:1; }

/* react */

#reactcontainer { 
	background-color: #eee; 
	margin: 25px; 
	padding: 15px; }

#reactcontainer p { font-size: .75em;  }

#reactcontainer td p { 
	font-size: .75em; 
	margin: 0px; 
	padding: 0px;  }

#reactcontainer td {
	vertical-align: top;  
	margin: 0px; 
	padding: 5px;}

#reactcontainer table { 
	border: 1px solid #000; 
	padding: 10px; }

#reactcontainer p.share { 
	font-size: .9em;
	font-weight: bold; 
	margin: 0px 0px 15px 0px; 
	padding: 0px;  }

p.introparagraph { font-size: 100%; }

/* resources */

.resourcesblock { 
	display:block; 
   	width: 100%; }
.resourcesnav { 
	font-size: .8em; 
	padding: 5px; 
	border: 1px solid #fff; 
	float: left; 
	margin: 0px 15px; }
	
.resourcesright { float: right; }

.resourcesleft { float: left; }

.resourcesblock h3 { 
	font-size: .75em; 
	color: #333; 
	margin: 15px 0px 7px 15px; 
	padding: 0px; }
	
.resourcesimageleft .txt,
.resourcesimageright .txt,
.resourcesimage txt
{ margin: 0px; padding: 0px; 
font-size: .7em; width: 200px; 
height: auto; }

.resourcesimageleft { 
	float: left; 
	margin: 0px 15px; }

.resourcesimageright { 
	float: right; 
	margin: 0px 15px; }

.resourcesright, .resourcesleft, .resources { 
    background-color: #eee; 
	color: #333; 
	padding-bottom: 20px;
	}
	
.resourcesright, .resourcesleft { 
	width: 510px; }

.resourcesright .header, 
.resourcesleft .header, 
.resources .header { 
    background-color: #CCC; 
    color: #333; font-weight: bold;
    font-variant: small-caps; 
	font-size: .7em;
	padding: 3px 0px 2px 15px;
	margin-bottom: 10px; }

.resourcesright p, .resourcesleft p, .resources p {
	margin: 0px 15px;
	padding: 5px 0px;
	font-size: 0.8em; }


/* red intro paragraph */

.intro { color: #fff; width: 100%;  }
.intro p { padding: 10px 0px; }

.interactivebutton {
	display: block; 
	padding: 3px 8px 3px 8px;
	margin: 7px 7px 0px 12px; 
	width: auto; font-size: .7em; 
    font-variant: small-caps;
    font-weight: bold;
    text-align: right; 
	color: #fff; 
	float: left; }
	
/* promo page specific */
.subhead { width: 400px; font-size: .9em; 
font-weight: bold; margin-left: 23px; margin-top: 30px; 
border-bottom: 1px solid #ccc; font-variant: small-caps; }

.promovideo {  
	padding: 15px 0px 5px 0px; }

.right .promovideo p { color: #ccc; 
font-size: .75em; padding: 10px 0px; }

.promoleftimage { margin: 0px 15px 5px 25px; }
.promorightimage { margin: 5px;  }

.promovideo a:link, 
.promovideo a:visited { 
	color: #fff; 
	text-decoration: none; 
	font-weight: bold; }

.promovideo a:active, 
.promovideo a:hover { 
	color: #fff; 
	text-decoration: none; }

.promovideo .previewbutton { 
	border: 1px solid #FFF; 
	margin-left: 15px;
	margin-bottom: 10px; 
	font-size: .75em; 
	padding: 2px 3px 2px 5px; 
	width:145px;  }

/* timeline */

#timeline { 
	width: 730px; 
	height: auto; 
	background-color: #fff; 
	position: relative; 
	margin: 20px 24px; }

/* Footer */

#footer {
clear: both;
padding-bottom: 10px;
color: #666666;
background-color: black;
text-align: center;
}

#footer p {
margin: 0px;
padding-top: 10px;
padding-bottom: 0px;
font-size: 11px;
}


#footer a:link, #footer a:visited {
color: #ccc;
text-decoration: underline;
}

#footer a:hover, #footer a:active {
color: #999;
text-decoration: underline;
}