/* Body begins here */

body{	
	background-image:url(strip5y.jpg);
	font-size: 12px; 
line-height: 16px;/* Specifies space around font */
font-family:  Verdana, Arial, Sans-serif, serif; 
margin: 0 auto;
padding: 0;
width: 750px;
margin-top: 0px;

}

#header {
	
	background-image:url(bannerlogo.gif); /* banner.*/
	margin-top: 0px;
	width: 750px;
	height: 175px;
	float: left;
}
	#header1 {/* banner.aboutus page*/
	
	background-image:url(bannergrye.jpg); /* banner.*/
	margin-top: 0px;
	width: 750px;
	height: 250px;
	float: left;
}

#orangeline { /*{ this is the background of the navigation bar */
	background-image: url(orangebackground.jpg);
	margin-top: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	float: left;
	width: 750px;
	height: 40px;	
	
}
  /*
#banner1 {
	margin-top: 20px;
	margin-left: 250px;
	
}
#banner2 {margin-top: 20px;
margin-left: 500px;
}*/
#content {
margin: 0px; /* margin from top*/  /*margin from right*/ /*margin from bottom*/ /*margin from left*/
max-width: 750px; 
padding: 9px;
background-color: #ffffff; /*white */
color: black;

} 

#navigation {
	margin-bottom: 5px;
	
	
}
#navigation ul { 
 list-style: none;
margin: 0 0px 0px 100px;
padding: 0;
padding-top: 1em;

}
#navigation li {
display: inline;
margin-right: 10px; /* puts space between buttons.  */
font-family: Verdana, Arial, Sans-serif, serif; 
font-style: italic;
}
#navigation a:link {
	
margin-right: 0.2em;
padding: 0.2em 0.6em 0.2em 0.6em;
color: white;/* text*/
background-color:  #006e53;/*green */;
text-decoration: none;
border-top: 0px solid #ffffff;
border-left: 0px solid #ffffff;
border-bottom: 1px solid #ffffff;
border-right: 1px solid #ffffff;
}
#navigation a:visited {
	
margin-right: 0.2em;
padding: 0.2em 0.6em 0.2em 0.6em;
color: #006e53;/*green text*/
background-color: #ffffff/*white*/;
text-decoration: none;
border-top: 2px solid #ffffff;
border-left: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
border-right: 2px solid #ffffff;
}
#navigation a:hover { 
	background-color: #ffffff;/*white */
border-top: 2px solid #006e53;/*green */
border-left: 2px solid #006e53;
border-bottom: 0px solid  #006e53;/*green */
border-right: 0px solid #006e53;/*green */
color: #006e53; 
}


div.imgleft { /* styling for images sets them on the left or right and puts a black border around them and the captions. */
	float: left;
	text-align: center;
	padding: 10px 10px 0px 10px;
margin-left: 0px;
margin-right: 30px;
margin-bottom: 10px;
margin-top: 0px;
background-image: url(orangebackground.jpg);
/*background-color: black;*/
color: white;
}

#imgright {
	float: right;
text-align: center;
background-image: url(orangebackground.jpg);
background-color: black;
padding: 20px 20px 0px 20px;
margin-left: 30px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 10px;
color: white;
}
#images1 {
	width: 270px;
		float: left;
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 30px;
	margin-bottom: 20px;
}
#images {
	width: 220px;
		float: left;
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 30px;
	margin-bottom: 0px;
}
#pagetitle {
		text-align: center;
		/*margin-top: 225px;*/
		margin-bottom: 10px;
}
#pagetitle1 { /* about us page */
		text-align: center;
				margin-bottom: 10px;
	}
h1 {
	font-family:  Verdana, Arial, Sans-serif, serif;
	color: #006e53;
	text-align: center;
	margin-top: 15px;
}
	
#content1 {
	
	float: right;
	margin-top: 10px;
	
}
#contact {
	margin-left: 10px;
font-size: 20px;
line-height: 24px;
font-weight: bold;
}

#factbox { /* styling for fact box which defines size of box and background colour */
	width: 680px;
	
	
	margin-top: 10px;
	margin-left: 15px;
	margin-bottom: 10px;
	margin-right: 10px;
	padding: 10px;
	color: white;
	background: #006e53; /* green */
	}
	
	#factbox2{/*aboutus page*/
	width: 450px;
	/*height: 315px;*/
	float: left;
	margin-top: 10px;
	margin-left: 0px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 20px;
	color: white;
	background: #006e53; }/* green */
	
	#factbox3{/*programs page*/
	width: 430px;

	float: right;
	margin-top: 10px;
	margin-left: 0px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 10px;
	color: white;
	background: #006e53; }/* green */
p.right { /* defines styling for paragraphs defined as p class right */
text-align: center;
font-size: 14px;
line-height: 18px;
margin-left: 10px;
margin-right: 10px;
}
div.indent {
	margin-left: 300px;
}
#indent2 { /*about uspage*/
margin-top: 10px;
margin-left: 510px;
}
/* Styles for the headings h3-h6 */
h3, h5, h6 {
font-family: Verdana, Arial, Sans-serif, serif;
font-weight: bolder; 
font-style: italic;
color: #006e53;
text-align: left;
margin-top: 2px;
margin-bottom: 0px;
padding: 2px 0 0px 0;
letter-spacing: 0.03em;
}
h2, h4 {font-family:  Verdana, Arial, Sans-serif, serif; /* Styles for headings in boxes */
font-weight: bolder; 
font-style: italic;
color: black;
text-align: center;
margin-top: 4px;
margin-bottom: 10px;
padding: 2px 0 0px 0;
letter-spacing: 0.03em;
}

#footer {
		background-image: url(orangebackground.jpg);
	font-family:  Verdana, Arial, Sans-serif, serif;
width: 100%;
font-style: italic;
margin-top: 10px;
margin-bottom: 10px;
padding: 2px;
text-align: center;
font-size: 0.8em;
font-weight: bold;
	float: left;
	width: 750px;
	height: 35px;
clear: both; /*This is crucial to getting the footer to stay on the bottom of the layout, regardless of the length of any of the three columns.
	So the problem in Assignment 2 withe the footer was that it would fall at the bottom of the content, but not the left or right column if they were
	longer. The clear: both declaration means that the footer will clear the left and the right columns (Andrew & Shafer, p 239) Ned11. This is no longer 
	needed, as the layout has been simplified, but I never want to forget it as it was so tricky at the time. */
}
p.contact {
	margin-left: 10px;
font-size: 20px;
line-height: 24px;
font-weight: bold;
}

p.quote {
		font-style: italic;
}
p.name {
		font-weight: bold;
}
