@charset "utf-8";
@import url('../css/listing.css');
/* CSS Document */

*{
	margin: 0;
	padding: 0;
}
html{ background: #d5d0c4 url(../imgs/html-bg.png) repeat-x top }
body{
	background: url(../imgs/body-bg.png) repeat-x bottom;
	font-family: Arial, Tahoma;
	font-size:100%; /* equal to 16px default */ 
	line-height:1.125em; /* 16 / 18 = 1.125 */
	text-align: center;
}

/*common style*/
h1,h2,h3,h4,h5,h6{ padding: 10px 0 10px 0; line-height: normal; }
ul,ol,blockquote{ padding-left: 45px; margin: 10px 0 10px 0; }
a img{ border: none; }
.clear{clear: both;}
.hide-text{text-indent: -9999px;}
.uppercase{ text-transform: uppercase }
.font-10{ font-size: 0.625em } /* 10 / 16 = 0.625 */
.font-12{ font-size: 0.75em }
.font-14{ font-size: 0.875em }
.font-bold{ font-weight: bold; color: #B8854E; }
.color-white{ color: #fff }
.margin-left-10{ margin-left: 10px }
.margin-right-15{ margin-right: 15px }
.margin-bottom-10{ margin-bottom: 10px }
.margin-bottom-5{ margin-bottom: 5px }
.padding-right-15{ padding-right: 15px }
.padding-left-25{ padding-left: 25px }
.border-1{ border-bottom: 1px solid #000 }
.font-italic{ font-style: italic; }
.float-left{ float: left; }
.float-right{ float: right; }
.text-center{ text-align: center; }
.title-font{ font-family: "Myriad Pro", Arial } 
.text-right{ text-align: right; }
.text-left{ text-align: left; }
.text-center{ text-align: center; }
img.float-left{ float: left; margin: 0px 10px 0px 0; border: 1px solid #767676;} 
img.float-right{ float: right; margin: 0px 0 0px 10px; border: 1px solid #767676;}
/*common style end*/  

#wrapper{ margin: 0 auto; width: 1024px; text-align:left }

ul#nav{ background: url(../imgs/logo-top.png) no-repeat top left; height: 47px; margin: 0; padding: 19px 0 0 300px; }
	ul#nav li{ float: left; list-style-type: none; text-align: center; }
	ul#nav li.active{ background: url(../imgs/nav-left-active.png) no-repeat top left }
	
	ul#nav li a{ 
		display: block; 
		color: #d5d0c3; 
		text-transform: uppercase; 
		text-decoration: none; 
		font-family: "Myriad Pro", Arial;
		font-weight: bold; 
		font-size: 16px;
		padding: 17px 10px 0 10px;
		height: 30px;
	}
	ul#nav li a:hover, ul#nav li a.active{ color: #fefefe } 
	ul#nav li a.active{ background: url(../imgs/nav-right-active.png) no-repeat top right; }
    
    a#home{ width: 50px; }
    a#project{ width: 109px; }
    a#gallery{ width: 73px; }
    a#news{ width: 48px; }
    a#participate{ width: 107px; }
    a#partners{ width: 85px; }
    a#contact{ width: 79px; }
	
div#doc-body{ 
	background: url(../imgs/logo-bottom.png) no-repeat top left; 
	/*min-height: 500px; height: auto!important; height: 500px;*/
	padding: 30px 0 28px 10px;
}
	div#left{ float: left; width: 360px; padding: 76px 20px 0 0; font-size: 0.875em }
		h1#left-title{ 
			font-size: 40px; font-weight: bold; 
			text-transform: uppercase; line-height: 40px; 
			padding: 0; margin-bottom: 10px 
		}
		a#learn-more{ color: #904102 }
		p#all-info{ font-size: 15px; text-transform: uppercase; font-weight: bolder; padding-top: 40px }
		p#follow-us{ margin-top: 40px; }
	
	div#right{ float: left; width: 615px; min-height: 500px; height: auto!important; height: 500px }
		div.photo-wrapper{ background: url(../imgs/photo-bg.png) no-repeat; height: 328px; padding: 17px 0 0 15px } 
        /*div.bg-black{ background-color: #000; text-align: center; padding: 17px 0 0 0 }*/
		
		ul#media-volunteer{ margin: 0; padding: 15px 0 0 0; font-size: 12px; }
			ul#media-volunteer li{ float: left; width: 290px; list-style-type: none }
			
			h2#latest-media, h2#volunteer{ line-height: 35px }
			h2#latest-media{ background: url(../imgs/title-latest-media.png) no-repeat; }
			h2#volunteer{ background: url(../imgs/title-volunteer.png) no-repeat; }
			
			ul#media{ margin: 0; padding: 0 }
				ul#media li{ list-style-type: none; margin-bottom: 10px}
					ul#media li img{ border: 2px solid #fff; margin-top: 5px; float: left; margin-right: 15px; }
					ul#media li p{ line-height: 16px }
						ul#media li p a{ font-size: 14px; font-weight: bold; color: #fff }
						
			li#volunteer{ /*background: url(../imgs/volunteer-bg.png) no-repeat top left;*/ padding: 0 0 0 15px }	
				li#volunteer p{ padding: 0 10px 0 10px }	
				
		div#doc-text{ padding: 15px 15px 0 15px }
	
div#footer{ background: url(../imgs/footer-bg.png) no-repeat top center; height: 167px; position: relative }
	div#footer p{ font-size: 12px; top: 55px; left: 170px; position: absolute; color: #d1ccbe; line-height: normal }
	div#footer h1 a{ display: block; width: 320px; height: 45px; top: 50px; right: 20px; position: absolute }
    a#brady{ display: block; width: 154px; height: 78px; top: 53px; left: 0px; position: absolute }

/*form validation*/            
div#form label.error, label.error { color:red; display:block; font-size:10px; }
div#result{ position: relative; }
