/* zero off the defaults to get a clean starting point*/
html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, formfield {  
margin: 0; 
padding: 0; 
border: 0; 
}

body {
	background:  url(body_bg.jpg) repeat;
	font-size: 100.01%;/* fix for IE scaling error at small font sizes*/
	text-align: center;/* centers the wrapper in IE 5.x*/
	font-family:  "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #3d5a3e;

}

/***** Begin laying out the wrappers *****/

#wrapper {
	margin: 0 auto;/*centers the wrapper in compliant browsers*/
	width: 766px;
	text-align: justify;
	position: relative;/*set for the positioning of the nav*/
	background-image:  url(content_bg.jpg);/*shadow drop bg image*/
	background-repeat: repeat-y;
}

#outercontent {
	margin-left: 1px;
}


/***** Ends the wrappers *****/

/***** Begin laying out the headers *****/
#topbanner {
	background-image:  url(header_bg.jpg);/*Main machu picchu image*/
	background-position: 0 0;
	height: 140px;
	margin: 0 auto;
	width: 766px;
	background-repeat: no-repeat;
}

#topbanner .left {
	margin-left: 20px;
}


/***** Ends banners **************/

/******* Begins content layout ***********/

#content {
   margin-left: 230px;
	padding: 7px 0 10px 0;
	width: 510px;
}

#content h1, #content h2, #content h3, #nav h3, #content h4, #content h5 {
	color: #3d5a3e;
}

#content h1 {
	font-size: 150%;
}

#content h2 {
	font-size: 125%;
	margin-top:0.5em;
}

#content h3 {
	font-size: 110%;
}

#nav h3 {
	font-size: 100%;
}

#content h4 {
	font-size: 90%;
}
#content h5 {
	font-size: 75%;
}

#content p {
	font-size: 80%;
	padding: 5px 5px;
}

#content ul {
	list-style:none;
	font-size: 80%;	
}

#portfoliopage #content li,
#heropage #content li {
	margin: 1em 0 1em 1em;
	clear: both;
	border-top: 1em solid #90B991;
	padding: 1em 0em;
}

#content .imgright{
	float: right;
	border: 1px solid #3d5a3e;
	margin: 5px 0px 3px 10px;
}

#content .imgleft{
	float: left;
	border: 1px solid #3d5a3e;
	margin: 5px 10px 3px 0px;
}

#content .printheader, #content .handheldheader {
	display: none;/*hide the header for the print style sheet*/
}
/****** Ends the content layout ********/

/***** Nav layout ******/

#skip {
	position: absolute; 
	top: -500px;/*places the skip nav off screen*/
}

/* positions the navigation column*/
#nav {
	position: absolute;
	width: 180px;
	top: 140px;
	left: 23px;
	text-align:left;
	margin-top: 3em;
}

#nav h3 {
	color: #3d5a3e;
	font-size: 90%;
	padding-bottom: 5px;
	width: 179px;
	border-bottom: 1px solid #cee3cf;
}

#nav img {
	margin: 25px auto;
	border: 1px solid #3d5a3e;
}

#nav ul {
	list-style-type: none;
	padding-left: 2px;
	/*margin-left: 20px;*/
	
}


div#nav ul li {
	border-bottom: 1px solid #cee3cf;
	/*font-family: Arial, Helvetica, sans-serif;*/
	width: 179px;
	margin-bottom: -2px;
	margin-bottom:/**/ -5px;
	ma\rgin-bottom: -2px;
}

div#nav>ul li, #nav>h3 {
	border-bottom: 1px dotted #5c895e;/*IE doesn't do dotted well, set here for browsers other than IE pc*/
	margin-bottom: 0;
}

#nav li a {
	font-size: 100%;
	height: 1%;
	display: block;
	text-decoration: none;
	color: #3D5A3E;
	padding: 4px 0 4px 2px;
	margin: 0;
	background: url(nav_bg.jpg) no-repeat;
}

#nav li a:hover, #nav li a:focus {
	color: #3d5a3e;
	background: #e6f0e7 url(nav_hover_bg.jpg) no-repeat;
}

/***** Ends the navigation *****/

/***** footers *****/

#footer {
	/*height: 34px;*/
	background-image:  url(footer_bg.jpg);
	background-repeat: no-repeat; /*Main machu picchu image*/
	background-position: 0 0;
	padding-bottom: 20px;
}


#footer p {
	font-size: 70%;
	text-align: center;
	padding: 4px 23px 4px 0;
	color: #660000;
	border-top: 1px none #000;
	margin: 0 13px;
	
}


/***** Ends the footers ********/


/* copied form vienna*/

body#homepage li#home a, 
body#designpage li#design a, 
body#portfoliopage li#portfolio a, 
body#aboutpage li#about a,
body#aboutgcpage li#aboutgc a,
body#contactpage li#conact a,
body#heropage li#hero a {
	color: #3d5a3e; 
	font-weight: bold; 
	background: #90b991 url(nav_this_bg.jpg) right center no-repeat;
}


/*end of vienna*/



/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}


/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
}

.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: -9px;
	font-size: 55px;
}

.sIFR-hasFlash h3 {
	visibility: hidden;
	letter-spacing: -6px;
	font-size: 25px;
}

.sIFR-hasFlash h4 {
	visibility: hidden;
	letter-spacing: -5px;
	font-size: 21px;
}

.sIFR-hasFlash h5#pullquote {
	letter-spacing: -4px;
	visibility: hidden;
	font-size: 24px;
}