/***** html tag styles *****/

/* format all the body text: font, size, & color || set a tiled background image */
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	background: url(../images/bg.jpg);
}
				   
/* format the sizes of the heading */
h1 {
	font-size: 20px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-style: normal;
	line-height: 110%;
	font-weight: bolder;
	color: #000099;
}

h2 {
	font-size: 18px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 110%;
	font-weight: bold;
	color: #666666;
}

h3 {
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 110%;
	font-weight: normal;
	color: #000099;
	text-align: center;
}

h4 {
	font-size: 14px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 110%;
	font-weight: bold;
	color: #666666;
}				   

/* style links within the body copy of the page */
a {
	color: #663366; 
	font-weight: bold;
	text-decoration: none;
}

a:hover {
	color: #6600CC;
	font-style: italic;
}

 
/***** IDs for layout *****/
#container {
	width: 800px;
	background-color: #ffffff;
	border: 1px solid #000099;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}

/* div containing the header logo image & top navigation */			
#header {
	width: 800px;
}

/* div for the main content on the page (copy/images/etc) */
#content {
	width: 760px;
	text-align: left;
	padding: 10px 20px;
}

		  
#bodycopy {
	width: 480px;
	background-color: #FFFFFF;
	margin-top: 15px;
	padding: 10px;
	float: left;
	border-top-width: medium;
	border-top-style: double;
	border-top-color: #000099;
}	
		   
/* div for styling the paragraphs within the "bodycopy" div only */
#bodycopy p {
	text-align: justify;
	/*padding: 0px 20px 20px 20px;*/
	line-height: 1.1em;
}	   	  

/* the "homeimgleft" & "homeimgright" divs are using the FLOAT property which allows the div tags to sit next to one another like columns, vs. their default placement of stacking one on top of the other */
/* div specifically for the left image on the home page */		  
#homeimgleft {
	width: 120px;
	float: left;
	margin-top: 15px;
	background-color: #EEEEEE;
	height: auto;
	border-top-width: medium;
	border-top-style: double;
	border-top-color: #000099;
}

/* all paragraphs (p) in this div will be center aligned within the div. this will not apply to paragraphs anywhere else on the pages */
#homeimgleft p {
	text-align: center;
}

/* div specifically for the right image on the home page */		  
#homeimgright {
	width: 177px;
	float: left;
	text-align: center;
	margin-top: 15px;
	border-left-width: thin;
	border-right-style: none;
	border-left-style: solid;
	border-left-color: #000099;
	background-color: #CCCCCC;
	border-top-width: medium;
	border-bottom-width: thin;
	border-top-style: double;
	border-bottom-style: solid;
	border-top-color: #000099;
	border-bottom-color: #000099;
}

/* all paragraphs in the div specifically for the right image on the home page */			   
#homeimgright p {
	text-align: center;
}
			   	  
/* div for the footer text navigation & copyright */
/* eveything within the div will be centered. the MARGIN-TOP property pushes the div at least 20 pixels below the divs above it on the page, and will have a horizontal rule above the text/links */
/* the CLEAR property ensures the div will sit below all the previous ones, instead of behind them */
#footer {
	width: 800px;
	text-align: center;
	border-top: 1px solid #000000;
	clear: both;
	background-color: #000099;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
	margin: 0px;
}
		 
#footer p,a {
	font-size: 10px;
	/*text-align: center;*/
}
			 
			 	 
#credits {
	width: 760px;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
	padding-top: 5px;
	padding-right: 20px;
	padding-bottom: 5px;
	padding-left: 20px;
	text-align: center;
	font-size: 10px;
}

.prowrapper {
	background-color: #CCC;
	text-align: left;
	padding: 10px;
	width: 550px;
	margin-bottom: 20px;
	border: 1px dotted #000;
	overflow: hidden;
	margin-top: 10px;
	margin-left: 20px;
}

.proimage {
	height: 100px;
	width: 100px;
	margin-right: 20px;
	border: 1px solid #000;
	float: left;
}

.prodesc {
	text-align: left;
	clear: both;
	float: left;
	width: 300px;
	margin-top: 10px;
}

.proname {
	font-weight: bold;
	float: left;
	width: 150px;
	margin-right: 10px;
}