/* 
/// ~~~~ TABLE OF CONTENTS ~~~~ ///

I. Color Scheme

II. Redefined 
	A. Main
	B. Headers

III. The A Team (Link Definitions)

IV. Formatting Divs
	A. Primary
	B. Secondary
	C. Tertiary

V. Main Navigation

VI. Sub Navigations

VII. Misc. Formatting DIVs

VIII. Forms

IX. Etc

*/



/* I. Color Scheme */

.phl_green {color: #034f50;} /* main text link color; color at bottom of gradient behind "you can help!" on homepage */
.phl_lt_green {color: #057172;} /* color at top of gradient behind "You can help!" on homepage */
.phl_teal {color: #007071;} /* color in logo */
.phl_lt_blue {color: #c1e4e4;} /* color at bottom of gradient on "why is PHL here?" on homepage */
.phl_tan {color: #d8d7b8;} /* color at bottom of gradient behind main nav */
.phl_lt_tan {color: #e3e2c7;} /* color at top of gradient in row4 */
.phl_grey {color: #9d9fa2;} /* Used on byline on news */

/* II. Redefined */

	/* A. Main */
	body {font-size: 62.5%; font-family: Arial, Helvetica, sans-serif; margin: 0; padding: 0;}

	p {font-size: 1.2em; line-height: 1.8em;}
	
/*	li {font-size: 1.2em;} */

	img, div {behavior: url(iepngfix.htc)}

	/* B. Headers */
	h1 {margin: 0; padding: 0; font-size: 2.2em;}
	h2 {margin: 0; padding: 0; font-size: 2em;}

/* III. The A Team */

a:link {color: #034f50; text-decoration: underline;}
	a:visited {color: #034f50; text-decoration: underline;}
	a:hover {color: #034f50; text-decoration: none;}
	
/* IV. Formatting DIVs */

	/* A. Primary */
	
	.row1 {position: relative; width: 100%; height: 173px; z-index: 1;
			background-color: #ffffff; float: left; clear: both; text-align: center;}

	.row2 {position: relative; width: 100%; height: 52px; z-index: 1;
			background: #d8d7b8 url(images/backgrounds/nav.gif); float: left; clear: both; text-align: center;}
		
	.row3_home {position: relative; width: 100%; height: 399px; z-index: 1;
			background: #10797d url(images/backgrounds/bg_row3-bm.jpg) center; float: left; clear: both; text-align: center;} 
	
	.row3_about {position: relative; width: 100%; height: 60px; z-index: 1;
			background: #10797d url(images/backgrounds/bg_row3-bm.jpg) center;
			float: left; clear: both; text-align: center;}
	
	.row3_news {position: relative; width: 100%; height: 139px; z-index: 1;
			background: #10797d url(images/backgrounds/bg_row3-bm.jpg) center;
			float: left; clear: both; text-align: center; padding: 10px 0 10px 0;}

	.row4 {position: relative; width: 100%; height: auto; z-index: 1;
			background: #ffffff url(images/backgrounds/row4.gif) top repeat-x; float: left; clear: both; text-align: center;}
		
	.row5 {position: relative; width: 100%; height: 25px; z-index: 1;
			background: #8dc0c1 url(images/backgrounds/footer.gif) repeat-x;
			float: left; clear: both; color: #ffffff; text-align: center;}

	/* B. Secondary (main content divs) */
		
	.header {position: relative; width: 980px; height: 173px; z-index: 2; margin: 0 auto;}

	.nav {position: relative; width: 980px; height: 52px; z-index: 2; margin: 0 auto;}
			
	.header_left {position: relative; width: 222px; height: 173px; z-index: 3; float: left;}
	
	.header_right {position: relative; width: 758px; height: 173px; z-index: 3; float: left;}

	.row3_home_content {position: relative; width: 980px; height: 400px; z-index: 2; margin: 0 auto;}
	
	.row3_about_content {position: relative; width: 980px; height: 60px; z-index: 2; margin: 0 auto;}
	
	.row3_news_content {position: relative; width: 940px; height: 99px; z-index: 2; margin: 0 auto;
						padding: 20px; color: #fff; overflow: hidden;
						background: url(images/backgrounds/newsfeat.png) no-repeat center;}
						
						.row3_news_content h1 {margin-bottom: 10px;}
						.row3_news_content a:link {font-weight: bold; color: #bddfd5; text-decoration: underline;}
						.row3_news_content a:visited {font-weight: bold; color: #bddfd5; text-decoration: underline;}
						.row3_news_content a:hover {font-weight: bold; color: #ddefea; text-decoration: none;}
	
	.row3_giving_content {position: relative; width: 940px; height: 99px; z-index: 2; margin: 0 auto;
						padding: 20px 40px 20px 40px; color: #fff;
						background: url(images/backgrounds/newsfeat.png) no-repeat center;}
						
						.row3_giving_content p {margin-bottom: 15px;}
	
	.main_content {position: relative; width: 980px; height: auto; z-index: 2; background-color: #fff;
					margin: 0 auto; min-height: 600px;}
	
	.footer {position: relative; width: 980px; height: 25px; z-index: 2; margin: 0 auto; color: #bce3e3; clear:both;}
		.footer a:link {color: #bce3e3; text-decoration: none;}
		.footer a:visited {color: #bce3e3; text-decoration: none;}
		.footer a:hover {color: #bce3e3; text-decoration: underline;}

	/* C. Tertiary Formatting DIVs */

	.row3_home_content_left {position: relative; width: 580px; height: 380px; float: left; z-index: 3;
		margin: 10px 10px 10px 0;}
	.row3_home_content_right {position: relative; width: 390px; height: 380px; float: left; z-index: 3;}
	
		.row3_home_content_right_top {position: relative; float: left; width: 370px; height: 215px;
										z-index: 4; margin-top: 10px; padding: 15px 10px 0 10px;
										background-image: url(images/backgrounds/whysphl.png);}
			.row3_home_content_right_top p {font-size: 1.4em; line-height: 1.3em;}
			
		.row3_home_content_right_btm {position: relative; float: left; clear:both; width: 370px; height: 125px; z-index: 4;
									 margin-top:10px; background-image:url(images/backgrounds/youcanhelp.png);
									 padding: 15px 10px 0 10px;}
			.row3_home_content_right_btm p {font-size: 1.4em; line-height: 1.3em; color: #fff;} 
									
		.nav_main {position: relative; width: 758px; height: 52px; left: 222px; z-index: 3;}
		
		.main_content_left {position: relative; float: left; width: 550px; height: auto; z-index: 3;
							padding: 18px 10px 0 20px; margin-right: 10px;}
							
							.main_content_left h1 {color: #034f50; clear: both;}
							
				.main_content_left p {margin-top: 20px;}
		
		.main_content_right {position: relative; width: 380px; height: auto; float: left; z-index: 3; padding-top: 10px;}
		
		 .main_content_right h1 {color: #034f50;}
		 	
				
		.before_after_container {position: relative; width: 380px; height: 126px; float: left; z-index: 4; margin-top: 10px;}
			.before_after_under {position: absolute; width: 380px; height: 126px; z-index: 5; top: 0; left: 0;}
			.before_after_over {position: absolute; width: 380px; height: 126px; z-index: 6; top: 0; left: 0;
								background-image: url(images/backgrounds/before-after-gall.png);}
								
		.header_right_quote {position: relative; float: left; width: 505px; height: 128px; margin: 18px 0 0 12px;                           z-index: 4; background-image: url(images/backgrounds/quotes.png); padding: 20px 60px 0 60px;
							font-size: 1.6em; color: #007071; line-height: 1.4em;}
		
		.footer_left {position: relative; width: 550px; height: 23px; float: left;  z-index: 3; padding-top: 2px;}
		.footer_right {position: relative; width: 345px; height: 23px; float: left; z-index: 3; padding: 2px 0 0 35px;}
		
		.press_media {position: relative; width: 380px; height: auto; float: left; z-index: 4; margin: 15px 0;}
			.press_media ul {list-style: none; margin: 0; padding: 0;}
			.press_media ul li {font-size: 1.2em; line-height: 1.8em; margin: 0 0 5px 0; padding:0;}
		
		.newsfeature {position: relative; width: auto; z-index: 4;}
		
			.newsfeature img {border: 1px solid #043939;}
			

/* V. Main Navigation */
	
		.menu {float: left;  border-left: 1px solid #e6e6e0;}

		.menu ul {margin: 0; padding: 0; list-style: none;}

		.menu li {display: block; float: left; height: 34px; padding: 18px 20px 0 20px;
				border-left: 1px solid #f5f5ed; border-right: 1px solid #e6e6e0;}
				
				.menu li:hover {background-image: url(images/backgrounds/nav_selected.gif);}

		.menu a {
			display: block;
			text-decoration: none;
			text-transform: uppercase;
			font: normal 1.8em Arial, Helvetica, sans-serif;
			color: #057374;
			}

		.menu a:hover {
			display: block;
			text-decoration: none;
			text-transform: uppercase;
			font: normal 1.8em Arial, Helvetica, sans-serif;
			color: #057374;
			}

		.current_page_item {
			background-image: url(images/backgrounds/nav_selected.gif);
			}

/* VI. Sub Navigations */

#nav_wrap {
	background-image:url(images/backgrounds/nav_arrow.png);
	background-position: 10px 14px;
	background-repeat:no-repeat;
	height:60px;
	margin:0 25px 0 -10px;
	display:block;
	text-align:left;
}

#nav {
	height: 60px;
	width: 100%;
	display:block;
	text-align:left;
	}
	
	#nav ul  {list-style-type: none; height:auto; margin:0 0 0 10px; padding:0;
				position:relative; width:100%; display:block;}
				
	#nav ul li {cursor:pointer; display: block; float: left; font: 1.8em Arial, Helvetica, sans-serif;}
	#nav ul li.selected {cursor:pointer; display: block; float: left; font: 1.8em Arial, Helvetica, sans-serif;
						color: #96956d; background: url(images/backgrounds/subnav-select.png) no-repeat 0 11px;}

	#nav ul li a {
				color:#fff;
				float:left;
				padding:0 0 13px 0px;
				text-decoration:none;
				}
	
	#nav ul li.selected a {
				color:#96956d;
				float:left;
				padding:0 0 13px 0px;
				text-decoration:none;
				font-weight: bold;
				}
	
	#nav ul li a span {
						cursor:pointer;
						float:left;
						padding:20px 30px 13px 15px;
						}

#nav2 {
	height: 60px;
	width: 100%;
	display:block;
	text-align:left;
	}
	
	#nav2 ul  {list-style-type: none; height:auto; margin:0 0 0 10px; padding:0;
				position:relative; width:100%; display:block;}
				
	#nav2 ul li {cursor:pointer; display: block; float: left; font: 1.8em Arial, Helvetica, sans-serif;}
	#nav2 ul li.selected {cursor:pointer; display: block; float: left; font: 1.8em Arial, Helvetica, sans-serif;
						color: #96956d; background: url(images/backgrounds/subnav-select.png) no-repeat 0 11px;}

	#nav2 ul li a {
				color:#fff;
				float:left;
				padding:0 0 13px 0px;
				text-decoration:none;
				}
	
	#nav2 ul li.selected a {
				color:#96956d;
				float:left;
				padding:0 0 13px 0px;
				text-decoration:none;
				font-weight: bold;
				}
	
	#nav2 ul li a span {
						cursor:pointer;
						float:left;
						padding:20px 30px 13px 15px;
						}

/* VII. Misc. Formatting DIVs */

.logo {position: absolute; width: 194px; height: 199px; z-index: 4; top: -176px; left: 0;}

.learnmore {position: absolute; width: 150px; height: 41px; z-index: 5; right: 0; bottom: 0;
			background: url(images/backgrounds/bg_btn_shad.png) 8px top no-repeat; padding: 19px 0 0 28px;}
		
.misc_floater {position: relative; width: auto; height: auto; float: left; z-index: 4;}

/* Photo Containers */
	
		/* Main Content - Partial */

			.photo-container {position: relative; float: right; width: 298px; height: auto;
			padding-bottom: 15px; z-index: 4; background: url(images/backgrounds/img-shadow.png) no-repeat bottom;
			margin: 0 0 16px 10px;}
				
			.photo-container .photo {position: relative; width: 296px; border: 1px solid #ccc; z-index: 5;}
					
			.photo-container .photo img {border: 10px solid #fff;}
					
			.photo-caption {position: absolute; left: 1px; bottom: -20px; width: 298px; height: 20px; z-index: 4; 
					font-style: italic; color: #9d9fa2;}
		
		/* Main Content - Full */

			.photo-container-full {position: relative; float: right; width: 548px; height: auto;
			padding-bottom: 15px; z-index: 4; background: url(images/backgrounds/img-shadow-full.png) no-repeat bottom;
			margin: 0 0 16px 10px;}
				
			.photo-container-full .photo {width: 546px; border: 1px solid #ccc;}
			
			.photo-container-full .photo img {border: 10px solid #fff;}
					
			.photo-container-full .photo-caption {width: 548px;}
				
		/* Main Content - Right Rail */

			.photo-container-right {position: relative; float: right; width: 380px; height: auto;
			padding-bottom: 15px; z-index: 4; background: url(images/backgrounds/img-shadow-right.png) no-repeat bottom;
			margin: 0 0 16px 0px;}
				
			.photo-container-right .photo {position: relative; width: 378px; border: 1px solid #ccc; z-index: 5;}
					
			.photo-container-right .photo img {border: 10px solid #fff;}
					
			.photo-container-right .photo-caption {width: 381px;}
	
	.btn-feature_left {position: absolute; left: 0; top: 41px; width: 32px; height: 64px; z-index: 3;}
	.btn-feature_right {position: absolute; right: 0; top: 41px; width: 32px; height: 64px; z-index: 3;}
	
	.news_tease {position: relative; width: auto; height: 180px; clear:both; border-bottom: 1px dotted #007071;
					padding: 0 0 5px 0; margin: 0 0 10px 0;}
			.news_tease h1 {margin-bottom: 10px;}
	
	.contributors {position: relative; width: 358px; height: auto; z-index: 3; background-color: #d6eaea;
					border: 1px dotted #007071; padding: 10px; margin: 10px 0 10px 0; clear:both;}
					
	.contact_left {position: relative; float: left; width:230px; height: auto; margin-right: 15px; z-index: 4;}
	.contact_right {position: relative; float: left; width: 265px; height: auto; margin-bottom: 15px;
					border-left: 1px dotted #007071; padding-left: 15px; z-index: 4;}
					
					.contact_left p, .contact_right p {margin-top: 0px; margin-bottom: 15px;}
					
	.alert {position: relative; float: left; width: 510px; padding: 10px; z-index:4;}
	
	.alert h2 {float: left; padding: 0; margin: 0 15px 0 0; font-size: 1.7em; color: #007071;}
	.alert p {float:left; margin-top: 0px;}
	
	#oops {border: 1px dotted #e6db55; background-color: #fffbcc;}
	#confirm {border: 1px dotted #007071; background-color: #d6eaea;}
	

/* VIII. Forms */

.txtfld01 {width: 520px; height: 30px; font-size: 16px;}
.txtarea01 {width: 520px; height: 160px; font-size: 16px;}
.formlabel {clear:both;}
.formlabel td {font-weight: bold; color: #007071;}
				
/* IX. Etc */

.small {font-size: 1.1em;}
.smaller {font-size: 1em;}

.whatsdate {font-size: 1.8em; color: #034f50;}

.byline {position: relative; float:left; z-index:4; color: #9d9fa2; margin-bottom:10px;clear: both;font-size: 1.2em;}
.dateline {position: relative; float: left; z-index: 4; color: #9d9fa2; font-weight: bold; font-style: italic;
		clear:both; font-size: 1.2em; width: 100%;}
.news_tease_blurb {position:relative; width: 100%; float: left; z-index: 4; clear: both;}

.required {
	color: #CC0000;
	font-weight: bold;
	font-style: italic;
}

.float_right {float: right; margin-left: 10px;}

.clearboth {position: relative; float: left; height: 10px; clear:both;}

.imgbrdr {border: 2px solid #007071;}
.1-2em {font-size: 1.2em;}