body {
	background-color: #88cee4;
	font-size: 62.5%; /* 1.0em = 10px */
	color: #333333;
	font-family: Verdana, sans-serif;
	width: 600px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* The above margin properties can be written using shorthand... margin: 0 auto; */

div#wrapper {
	text-align: left;
	background-color: #e1e3cd;
	width: 650px;
}

/* The wrapper goes completely around the header, content, navbar and footer div's. It allows us to reset text-align to left. I've also used this wrapper to fill the entire background with my selected navbar bg color. */

/* The following is split into 4 sections.  Read through each, carefully, as many concepts are brought together for this layout. 

Remember inheritance, along the cascade, and descendent selectors. */

/* HEADER (start) */

div#header {
	background-color: #dc8a3b;
	padding: 20px;
	font-size: 18px;
	color: #e1e3cd;
	font-weight: bold;
}

div#header2 {
	background-color: #dc8a3b;
	padding: 0px;
	font-size: 18px;
	color: #e1e3cd;
	font-weight: bold;
	
}



/* HEADER (end) */

/* CONTENT (start) */

div#content {
	float: right;
	background-color: #ffffff;
	width: 450px;
	padding: 10px;
}

div#content h1 {
	margin: 0px;
}

div#content h1 span {
	font-size: 12px;
	
}

div#content h1 span a {
	color: #ca8d44;
	text-transform: none;
	text-decoration: none;}
	
	

div#content img.floatRight {
	float: right;
	padding: 5px;
	margin: 10px;
	border-style: dashed;
	border-width: 1px;
}

/* HEADER (end) */

/* NAVBAR (start) */

div#navBar {
	float: left;
	width: 180px;
}

div#navBar ul.nav {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

div#navBar ul.nav li a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	display: block;
	height: 20px;
	padding: 10px;
	padding-left: 20px;
	line-height: 20px;
	color: #de701e;
	text-decoration: none;
	letter-spacing: 3px;
}

div#navBar ul.nav li a:hover {
	background-color: #b4d9d7;
}

div#navBar ul.nav2 {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

div#navBar ul.nav2 li a {
	display: block;
	height: 40px;
	padding: 10px;
	padding-left: 20px;
	line-height: 20px;
	color: #de701e;
	text-decoration: none;
	letter-spacing: 5px;
}

div#navBar ul.nav2 li a:hover {
	background-color: #b4d9d7;
}



/* NAVBAR (end) */

/* FONTS */
.header_copy_bold {
	color: #ffffff;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 24px;}
	
.copy {
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 20px;
	font-size: 13px;}
	
.copy10 {
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;}	

.copy_gray {
	color: #a5a487;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	}
	
.copy_blue {
	color: #4ab2d3;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;}	
	
.copy_bold14 {
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;}		
	
.copy_bold {
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;}	
		
.footer_gray {
	color: #666666;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;}	
	



/* IMAGE STYLES*/


img.picture1 {
	width: 150px;
	float: right;
	background-color: #ffffff;
	border-style: solid;
	border-color: #ccc;
	border-width: 1px;
	margin: 10px;

}

img.logo {
	
	float: right;
	padding: 0px;
	background-color: #ffffff;
	border: 0px;
	margin: 5px;

}	

img.header {
	
	float: left;
	padding: 0px;
	background-color: #ca8d44;
	border: 0px;
	margin: 0px;
	margin-bottom: 10px;
	margin-right: 10px;

}	
	
/* LINK STYLES */	

a.copy {
	color: #ca8d44;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	text-transform: none;}
	
	a.copy:hover {
	color: #ca8d44;
	text-decoration:underline;}

a.top {
	color: #ca8d44;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	text-decoration: none;
	text-transform: none;}
	
	a.copy:hover {
	color: #ca8d44;
	text-decoration:underline;}
	
	

/* HR */

.hr_solid{
	border:0px solid #FFFFFF;
	border-top:2px solid #c6c6c6;
	height:1px;
	background-color: #FFFFFF;
	position:relative;	left:3px;
	text-align: left;}
	
.hr_dashed{
	border:0px;
	border-top:1px dashed #666666;
	height:1px;
	background-color: #FFFFFF;
	position:relative;	left:3px;
	text-align: left;
	width:95%;}
	
	
/* YELLOW BARS */	

#yellow_bar_footer200 {
	background-color:#efd055;
	border:1px solid #efd055;
	margin:0px;
	height:2px;
	width:200px;}
	
#yellow_bar_footer250 {
	background-color:#efd055;
	border:1px solid #efd055;
	margin:0px;
	height:2px;
	width:250px;}	


/* FOOTER (start) */

a.footer {
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	
	text-decoration: none;
	text-transform: none;}
	
	a.footer:hover {
	color: #ffffff;
	text-decoration:underline;}


div#footer {
	background-color: #de701e;
	padding: 10px;
}

div#footer p {
	margin: 0px;
}

/* FOOTER (end) */

div.clearFloats {
	clear: both;
}
