/* CSS Document Home */

*{ padding: 0; margin: 0; }

/************/
/*** MAIN ***/
/************/

body {
	background-color: #4E5F73;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%; color:#333333;
	margin: 0; padding: 0;
	text-align: center;
	}

#container {
	width: 820px;
	margin: 0 auto; padding: 0;
	background-color: #FFFFFF;
	text-align: left;
	}
	
#content {
	width: 800px;
	margin: 0 auto; padding: 0;
	background-color: #FFFFFF;
	}
	
/*************/
/*** FONTS ***/
/*************/

h1 { 
	font-family:"Goudy Oldstyle Std", Times, serif; font-size: 1.8em; 
	letter-spacing: 1px; padding: 10px 0px 10px 10px;  
	}
	
h2 { 
	font-family:"Goudy Oldstyle Std", Times, serif; font-size: 1.6em; 
	letter-spacing: 1px; padding: 10px 0px 10px 10px;}

h3 { }

p { font-size: 1.4em; text-align: left; padding: 0px 20px 10px 10px; line-height: 1.2; }

p.lead { font-size: 1.4em; text-align: left; padding: 10px 20px 10px 10px; line-height: 1.2; }

.dropcap {
	float:left; color:#333333; font-size:2em; 
	padding: 0 2px 0 0; font-family:"Goudy Oldstyle Std", Times, serif; 
	}

ul { margin: 0; padding: 0 }

li { font-size: 1.4em; text-align: left; list-style-type: none; padding: 0px 10px 10px 20px; line-height: 1.2; }

a:link { color: #901E34; text-decoration: none }
a:visited { color: #901E34; text-decoration: none }
a:active { color: #901E34; text-decoration: underline }
a:hover { color: #901E34; text-decoration: underline }

/*************/
/*** LOGOS ***/
/*************/

#nav_wrap {
width: 100%;
background: url(../images/bg_wpsu_nav.png) repeat-y center;
}

#logo_wpsu {
	center top;
	margin: 0 auto; padding: 0; width: 820px; 
	}

#logo_thewar {
	position: relative; width: 820px; height: 115px; background-color: #4E5F73;
	margin: 0 0 0 0; padding: 0;	
	}

#warphotos {
	width: 353px; position: absolute; left: 460px; top: 10px; z-index: 1;
	}

/******************/
/*** NAVIGATION ***/
/******************/

/*** top navigation **/

ul#nav_top {
	background-color: #e6ecf3; border-bottom: 1px solid #FFFFFF;
	margin: 0; height: 30px; line-height: 30px;
	}

ul#nav_top li { 
	font-size: 1em; color: #105185; text-align: left;
	display: inline; float: left; list-style-type: none; height: 30px !important; line-height: 30px; 
	padding: 0 16px 0 16px; 	
	border-right: 1px solid #d0dce8 
	} 

ul#nav_top li.logo { display: inline; list-style-type: none; line-height: 30px; padding: 0; border-right: 0 } 
ul#nav_top li.search { float: right; border-right: 0 }
ul#nav_top li.about { border-right: 0 }
.search_dropdown { width: 110px; color: #105185; font-size: 1em }

ul#nav_top li a:link { color: #105185; text-decoration: none }
ul#nav_top li a:visited { color: #105185; text-decoration: none }
ul#nav_top li a:active { color: #105185; text-decoration: underline; background-color: #e6ecf3}
ul#nav_top li a:hover { color: #105185; text-decoration: underline; background-color: #e6ecf3}

/*** sidebar navigation for homepage ***/

#nav_sidebar {
	border: 1px solid #CCCCCC;
	}
	
h1.sidebar_share {
	background-image: url(../images/flag1.jpg); background-repeat: no-repeat; font-size: 1.8em; padding-left: 10px;
	}

h1.sidebar_doc {
	background-image: url(../images/flag2.jpg); background-repeat: no-repeat; font-size: 1.8em; padding-left: 10px;
	}

h1.sidebar_discuss {
	background-image: url(../images/flag3.jpg); background-repeat: no-repeat; font-size: 1.8em; padding-left: 10px;
	}

ul.star { margin-left: 28px; }
li.star { list-style-image: url(../images/star.png); vertical-align: top; padding: 0px 10px 10px 0; }

/*** bottom navigation for second level pages***/

h1.bottom_share {
	background-image: url(../images/flag1.jpg); background-repeat: no-repeat; font-size: 1.8em; padding-left: 10px;
	}

h1.bottom_doc {
	background-image: url(../images/flag2.jpg); background-repeat: no-repeat; font-size: 1.8em; padding-left: 10px;
	}

h1.bottom_discuss {
	background-image: url(../images/flag3.jpg); background-repeat: no-repeat; font-size: 1.8em; padding-left: 10px;
	}

/******/
/*DIVS*/
/******/

/*** left ***/

#left {
	width: 440px; float: left;
	margin: 0 0 40px 0;
	}
	
#text {
	width: 440px; background-color: #E5E5E5; margin-top: 10px;
	}
	
#flash {
	position: relative; width: 440px; 
	margin: 35px 0 0 0;
	}
	
/*** right ***/	
	
#right {
	float: right; width: 300px; 
	}
	
#sidebar {
	margin: 200px 0 40px 0;
	}
	
/*** columns ***/	

#columns { width: 800px; clear:both; }

#column1 { float: left; width: 264px; margin: 10px 0 20px 0; border: 1px solid #CCCCCC; border-right: none; }

#column2 { float: left; width: 264px; margin: 10px 0 20px 0; border: 1px solid #CCCCCC; border-right: none; }

#column3 { float: left; width: 264px; margin: 10px 0 20px 0; border: 1px solid #CCCCCC; }
	
/*** bottom ***/

#bottom {
	width: 800px; height: 200px; background-image: url(../images/footer_thewar.jpg);
	margin: 20px 0 0 0; clear:both;
	}

h1.thewar { padding-top: 60px; margin: 0 0 0 50px; width: 225px; }

p.thewar { margin: 0 0 0 50px; width: 225px; }

/*******/
/*MEDIA*/
/*******/

#video { text-align: center}
p.caption { font-size: 1em; text-align: center; margin-top: 5px }

#audio { padding: 10px 0 10px 0; clear: both; border-bottom: 1px solid #CCCCCC; }
#audio_text { margin-left: 100px; }
#audio_embed { padding: 0 0 10px 10px; }

img.thumb { float: left; padding: 10px 10px 0 0; margin-bottom: 0; }

/********/
/*FOOTER*/
/********/

#footer { margin: 20px 0 0 0; padding: 20px 0px 20px 60px; background-color: #CCCCCC;}
#footer p { clear: both; font-size: 1.1em; text-align: center;}

/*************/
/*STORY SHARE*/
/*************/

#content_storyshare {
	font-size: 100%; line-height: 100%; font-family:Arial, Helvetica, sans-serif;
	}
	
#text_storyshare {
	padding: 20px 10px 10px 10px; font-size: 1.2em; line-height: 1.2em;
	}