/* 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; 
}

/*remove the elements we don't want to show to handheld devices*/
#content .printheader, #topbanner, #subheader, #screentitle, #nav img, #footer {
	display: none;
}

body, #wrapper {
font-family: Arial, Helvetica, sans-serif;
font-size: 100%;
background-image: none;
width: 240px; /* change to max-width when publishing to the web*/
}

#content {
	padding: 2px;
	border: 1px solid #666;
	margin-top: 5px;
}

#content h1, #content h2, #content h3, #nav h3, #content h4, #content h5 {
	color: #3d5a3e;
	padding-top: 6px;
	margin-bottom: 7px;
}

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

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

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

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

#content h4 {
	font-size: 80%;
}
#content h5 {
	font-size: 70%;
}

/*less room so make the font sze a little smaller*/
#content p {
	font-size: 75%;
	margin: 6px;
}

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

/* resize the content area image and change the float direction*/
#machu {
	width: 120px;
	height: 80px;
	float: left;
	margin: 4px 5px 1px 0;
	border: 1px solid #000;
}

 #nav ul li {
border: 1px solid #000;
list-style-type: none;
margin: 2px 0;
}

#content ul li {
border: 0;
list-style-type: none;
margin: 2px 0;
}

a, a:visited {
	background-color: #ECE7E7;
	display: block;
	padding: 2px;
	color: #30454B;
	text-decoration: none;
	font-size: 75%;
}

/*set an active pseudo class - better indication than hover on handheld devices*/
a:active, a:hover	 {
	background-color: #332B2B;
	color: #fff;
}

/*reset the skip div to static for use on screen with handheld devices*/
#skip {
	border: 1px solid #000;
	position: static;
}

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

#content .imgright, #content .imgleft{
	/*float: right;*/
	border: 1px solid #3d5a3e;
	margin: 3px 3px 3px 3px;
	
}




/* 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;
}