body {
	width: 100%;
	padding-left: 3em;
  	background-color: #F00;
  	color: #FFF;
	font-size: 62.5%;/*sets scalable font to 10 as base 100percent would be 16px hard to multiply percent for IE*/
  	background-image: url(images/graphica/chars3.gif);
 	background-repeat: no-repeat;
 	
}  
h1 {
	font: 2.5em Verdana, sans-serif; color:#F93; background-color: inherit; 
	margin-top: 1em; text-align: center;
}
h2 {
	font: 2em Verdana, sans-serif; color:#F93; background-color: inherit;
	margin: 2em 0 0 1em; text-align: center;
}
h3 {
	font: 1.5em Verdana, sans-serif; color:#960; background-color: inherit;
	margin: 2em 0 0 1em;  line-height: .2em;
}
img {
	border:none;
}
img.floatleft { 
    float: left; 
    margin: 4px; 
}
img.floatright { 
    float: right; 
    margin: 4px; 
}
ul, li {
	font: 1.2em sans-serif; color:#000; background-color: inherit;
}
ul {
list-style:none;
}
li {
line-height: 1em;
}
a {
font: 1em Verdana, sans-serif; color:#000; background-color: inherit;
}
a.here{ 
	font-weight: bold;
}
a:link {color: #00F; background-color: inherit;}     
a:visited {color: #FFF; background-color: inherit;} 
a:hover {color: #FF6; background-color: inherit;}   
a:active {color: #00F; background-color: inherit;}   
blockquote {
	font: italic 1.5em Verdana, sans-serif; 
	color:#000; background-color: inherit;
}
.clear {
	clear: both;
}
/** div to set margins on the contents **/
.wrapper {    
	width:80%;
}  
/** set left and right boxes**/
.left {
	color:#FFF;
	background-color: transparent;
	width:25%;
	float: left; /*float the left box all the way left*/
  	margin: 0;
}
.nav {
	position: relative;/*spacing around the background image*/
	top: 380px;
	width: 115px;
	background-color: transparent; color: inherit;
	text-align: right;  
}
.nav li { text-align: right; font: 1.2em sans-serif;
}
a {
	font-size: .9em;  line-height: 1.4; text-align: right;
}
.right {
	width:75%;/*this may be a problem with IE*/
	float:right;
	position: relative; /*makes the right contents float over the left*/
}

.main {
	width:100%;	
	float: left;
	background: #FFF; 
	color: inherit;
	overflow: hidden; /*this for IE, doesnt like the negative margin on the nav links*/
	padding-bottom:2em;
}
p{
	text-align: left; 
	font: 1.5em Verdana, sans-serif; 
	margin: 1em 1em 0 1em;
	color:#000; background-color: inherit;
}
p + p { /*p following the first p that isn't indented*/	
	text-indent: 1.5em;
	margin-top: 0 
} 
p.indent {
	text-indent: 1.5em; margin-top: 0;
  }
p.info { /*last paragraph with contact info and a bottom margin*/
	margin: 2em 1em 2em 1em;
}
.main a{ font-size: 1em;}
.main a:hover { color: #C90; background-color: inherit;} 
.main a:visited { color: #969; background-color: inherit;}
.photo {
    margin-right: auto;
    width: auto;    
    padding-bottom: 0.5em;
    text-align: center;
  }
p {    
    font: italic 1.2em Verdana, sans sans-serif;
    text-align: center;
    margin-top: .2em;
  }
img.scaled {
    width: 100%;
  }
ul, li {
	font: 1.3em sans-serif; color:#000; background-color: inherit;
}
.footer {
	clear:both;
	background-color: #F00;
  	color: #000;
  	width:100%;	
  	padding-top: 0.5em;
  	padding-bottom: 0.5em;
}
.footer p{ /*have to say footer or it changes size in main*/
	font: 1.2em Verdana,sans-serif;
	text-align: center; 
}
.footer a {
font: 1em sans-serif;
}