/* CSS Document */
/*
TABLE OF CONTENTS
  
  Colors
  HTML Elements
  Page Structure
  Navigation
  Headings
  Content Area
  Footer
  Forms
  Clear and Float */

/* ---------- @ Colors -----------




/* ---------- @ HTML Elements -----------*/

* {
	margin: 0;
	padding: 0;
} 

html {
	height:100%;
}

body {
	margin:0;
	font:14px/1.5 futura, calibri,'helvetica neue', 'lucida grande', 'lucida sans unicode', arial, sans-serif;
	color:#333; 
	background:#fff;
	height:101%;
	margin:0;
	text-align:center; /*for IE<=6, centers wrapper div*/
}

h2, h3, h4, h5, h6 {
	margin:0 0 .75em;
}


p + h2, p + h3, p + h4, p + h5, p + h6 {
	margin-top:1.25em;
	}

a 	{
	color:#b1772c;
	text-decoration:none;
	padding-bottom:1px;
	border-bottom:1px dotted;
	font-weight:bold;
	}

a:hover 
	{
	color:#f8981d;
	} 
	
a.external {
	padding-right:12px;
	background:url(images/ext-link.gif) right center no-repeat;
}

p {
	color:#333;
	margin:0 0 1.2em;
	}

*:focus {
	outline: none
}

img {
	border:none;
	}

sup {
	font-size:70%; 
	baseline-shift:60%;
	}

ul {
	margin:1em;
	}
	
ul li {
	margin:.75em 1em;
	list-style:disc;
	line-height:1.1em;
	}
	
ol li {
	margin:.5em 1em .5em 2em;
	list-style:decimal;
	line-height:1.1em;
	}

/* ---------- @ Page Structure -----------*/		
#wrapper {
	position:relative;
	min-height:100%;
	margin:0 auto;
	padding:0;
	width:960px;
	text-align:left;
	background:url(images/gear.gif) right bottom no-repeat;
	}
	
/*Min-height hack for IE6 only*/ * html #wrapper { height:100%; }
	
#masthead {
	position:relative;	
	text-indent:-9999px;
	font-size:1%;
	}
	
#masthead h1 {
	background:url(images/masthead.gif) 70px bottom no-repeat;
	height:170px;
	width:960px;
	margin:0;
	}	

/* ---------- @ Navigation -----------*/
#side_nav {
	margin:0;
	padding:0;
	position:absolute;
	right:720px;
	top:245px;
	text-transform:uppercase;
	letter-spacing:.1em;
	font-size:1.1em;
	}
	
#side_nav li {
	list-style:none;
	margin:0 0 1em;
	padding:0 0 0 8px;
	color:#666;
	}
	
#side_nav a {
	color:#999;
	text-decoration:none;
	font-weight:normal;
	border:none;
	padding:none;
	}
	
#side_nav a:hover {
	color:#f8981d;
	}
	
#abou #nav_abou,
#cont #nav_cont,
#work #nav_work,
#team #nav_team {
	background:url(images/current_nav.gif) left center no-repeat;
	padding:0 0 0 8px;
	}
	
#top_nav {
	position:relative;
	margin:0 0 30px 262px;
	padding:0;
	height:27px;
	width:261px;
	background:url(images/top_nav.gif) 0 -54px no-repeat;
	}
	
#top_nav li {
	list-style:none;
	margin:0;
	padding:0;
	text-indent:-9999px;
	}

#top_nav a {
	position:absolute;
	top:0;
	display:block;
	height:27px;
	text-indent:-9999px;
	background:url(images/top_nav.gif) no-repeat;
	padding:0;
	border:none;
	}
	
#nav_clie a {
	width:153px;
	left:0;
	background-position:0 0;
	}
	
#nav_dono a {
	width:90px;
	left:171px;
	background-position:-171px 0;
	}

#nav_clie a:hover {
	background-position:0 -27px;
	}
	
#nav_dono a:hover {
	background-position:-171px -27px;
	}

/* ---------- @ Headings -----------*/

h1, h2, h3 {
	color:#f8981d;
	text-align:center;
	margin-top:0;
}

h1 {
	font-size:2.2em;
	}

h2 {
	font-size:2em;
	}
	
h3 {
	font-size:1.5em;
	text-align:left;
	}
	
h4, h5, h6, h7 {
	font-family: 'times new roman', times, serif;
	font-style:italic;
	text-align:left;
	color:#95979a;
	}
	
h4 {
	font-size:1.4em;
	}

h5 {
	font-size:1.3em;
	}

h6 {
	font-size:1.2em;
	}

/* ---------- @ Content Div styles -----------*/
	
#content {
	margin:0 190px 0 262px;
	padding-bottom:100px;
	z-index:50;
	}

#home #content {
	padding-bottom:0;
	}

	
/* -------- @ Sidebar Div Styles -------------*/

#sidebar {

	}
	
/* -------- @ Content Area Styles ------------*/
.button {
	float:left;
	padding:.25em;
	cursor:pointer;
	background:#fbdcb5;
	border:1px dotted #f8981d;
	}
	
.button:hover {
	background-color:#f8981d;
	}
	
	
img.right {
	padding:5px;
	margin:0 0 1em 1em;
	}
		
img.left {
	padding:5px;
	margin:0 1em 1em 0;
	}

img.center {
	display:block;
	margin:1em auto;
	padding:5px;
	border:1px solid #fff;
	}

#images {
	margin:2em 0 0 80px;
	height:300px;
	width:780px;
	background:url(images/images.png) no-repeat;
	padding-bottom:60px;
	}
	
.staff {
	overflow:auto;
}

.staff li {
	float:left;
	background:url(images/bg-staff.gif) no-repeat;
	width:160px;
	height:160px;
	margin:0 40px 30px 0;
	padding:20px;
	text-align:center;
	overflow:hidden;
}

.staff li img {
	border:1px solid #d9d9d9;
	padding:1px;
}

.staffmember {
	margin:1em 0 .5em;
}

.stafflink {
	margin:0 0 .5em;
	font-size:.8em;
}

.stafflink a {
	font-weight:normal;
}

.role {
	margin:0;
	font:italic 12px 'Times New Roman', Times, serif;
	color:#95979A;
}

	
	
/*-------@Home content-------------*/


	
/*----------@Interior Pages----------------*/
		

	
/* ---------- @ Footer -----------*/	

#footer_wrapper {
	position:absolute;
	width:100%;
	bottom:0; left:0;
	margin:0;
	z-index:20;
	}
	
#footer_wrapper p {
	position:absolute;
	width:100%;
	text-align:center;
	bottom:0;
	}

/* ---------- @ Forms -----------*/

#contact {
	margin:30px 0;
	padding:1.5em 1.5em 2em;
	background:#e6e6e7;
	border:1px dotted #f8981d;
	}

.error { /* ul of form validation errors */
	color:#f8981d;
	}
	
.error li {
	margin-left:0;
	}
	
.error li:first-child {
	list-style:none;
	}

fieldset {
	margin:0;
	padding:0;
	border:none;
	}
	
fieldset ul {
	margin:0;
	padding:0;
	}	

fieldset li {
	list-style:none;
	padding:0 0 .75em;
	margin:0;
	clear:left;
	}

#contact input {
	display:block;
	border:1px solid #ccc;
	height:2em;
	width:150px;
	font:.9em/1.5 futura, calibri,'helvetica neue', 'lucida grande', 'lucida sans unicode', arial, sans-serif;
	}
	
label {
	display:block;
	margin-bottom:.1em;
	font-size:.9em;
	}

option {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	padding:.25em 0;
	}
	
#paypal-donate {
	margin:0 0 2em;
}
	
select {
	margin-bottom:.75em;
	}

#submit {
	clear:left;
	margin-bottom:0;
	}

#submit input {
	width:auto;
	padding:0 1em;
	cursor:pointer;
	}
	
#submit input:hover {
	background-color:#f8981d;
	}
	
#contact textarea {
	width:100%;
	border:1px solid #ccc;
	font:12px tahoma, arial, sans-serif;
	resize:none;
	}



/* ---------@ Clear and Float ----------- */

.clearleft { clear:left; }

.clearright { clear:right; }

.clearboth { 
	clear:both; 
	margin-top:5px;
	}
	
.center {	
	display:block;
	margin:0 auto 15px;
	text-align:center;
	}
	
.left {
	float:left;
	margin:0 1em 1em 0;
}

.right {
	float:right;
	margin:0 0 1em 1em;
}

