/*The code in this file sets up the basic layout of every page.*/
/*Always keep a backup of this file!*/

/*Author:  Yvette Richey*/
/*Date Developed:  6/10/2006*/


/*The code below styles the pages for use on computer monitors.*/
@media screen{

	/*Sets up the basic canvas for the entire body of the page.*/
	body{
		margin: 1%;
		background-color: #ffffcc;
		color: #000;
		font-size: .8em;
		font-family: Arial, sans-serif;
	}

	/*Contains the part of the page that holds all the content*/
	/*(including the header, body, and footer).*/
	#pagecontainer{
		position: relative;
		margin-left: auto;
		margin-right: auto;
		width: 800px;
		height: 100%;
		background-color: #ccf2d9;
		color: #000;
		border-collapse: collapse;
	}

	/*Contains the header on each page.*/
	#titleheader{
		position: absolute;
		padding: 0px;
		width: 800px;
		height: 132px;
		z-index: 1;
	}

	/*Loads the three background images of the header inside of #titleheader.*/
	#header1, #header2, #header3{position: absolute; margin-top: 0px; height: 105px;}
	#header1{
		margin-left: 0px; 
		padding-top: 3px; 
		padding-left: 20px; 
		width: 261px;
		background: url(../images/layoutImages/header1_curve.jpg) no-repeat;
	}
	#header1 img{border: 0px none #000;}
	#header2{margin-left: 261px; width: 291px; background: url(../images/layoutImages/header2.jpg) no-repeat;}
	#header3{margin-left: 550px; width: 250px; background: url(../images/layoutImages/header3_curve.jpg) no-repeat;}


	/*Loads and inserts the bar inside of #titleheader*/
	/*that says "(number) Years of Excellence".*/
	#yearsexcellence{
		position: absolute;
		margin-top: 105px;
		padding: 0px;
		width: 800px;
		height: 27px;
		background-color: transparent;
		background: url(../images/layoutImages/yearsBar.jpg) no-repeat;
		color: #fff;
		font-size: 23px;
		text-align: center;	
	}

	/*Formats the text links of the main menu in the left column.*/
	#mainmenu{
		position: relative;
		padding-top: 150px;
		width: 120px;
		height: 100%;
		background-color: #ddf6cc;
		color: #000;
	}
	#menuitems{
		position: relative;
		margin-left: 10px;
		padding-bottom: 50px;
		padding-left: 0px;	
		font-size: 1em;
		font-weight: bold;
		list-style-type: none;
	}
	#menuitems li{margin-bottom: 15px;}
	#menuitems a:link{background-color: transparent; color: #004c66; text-decoration: none;}
	#menuitems a:hover{background-color: transparent; color: #b91b7d; text-decoration: none;}	
	#menuitems a:visited{background-color: transparent; color: #40016e; text-decoration: none;}

	/*Provides a container for the contents of the middle column*/
	/*(if page has 3 columns) or the right column (if page has 2 columns).*/
	#innercontainer1{
		position: relative;
		width: 84%;
		padding-top: 150px;
		padding-bottom: 50px;
		background-color: #ccf2d9;
		color: #000;
	}

	/*Provides a container for the contents of the right column in 3 column layout.*/
	#innercontainer2{
		position: relative;
		width: 0%;
		padding-top: 150px;
		padding-bottom: 50px;
		background-color: #d5f5ea;
		color: #000;
	}

	/*Sets up the footer on each page, loading its three images.*/
	#footer{
		position: relative;
		top: -2px;
		padding-top: 0px;
		padding-left: 0px;
		width: 800px;
		height: 79px;
		color: #000;
		background-color: #ffffcc;
	}
	#footer1, #footer2, #footer3{position: absolute; height: 98px;}
	#footer1{margin-left: 0px; width: 272px; background: url(../images/layoutImages/footer1_curve.jpg) no-repeat;}
	#footer2{margin-left: 271px; width: 303px; background: url(../images/layoutImages/footer2.jpg) no-repeat;}
	#footer3{margin-left: 574px; width: 226px; background: url(../images/layoutImages/footer3_curve.jpg) no-repeat;}

	/*Formats and sets up the text navigation inside the footer.*/
	#textnav, #accesslink, #copyright{position: relative; background-color: transparent; text-align: center; z-index: 1;}
	#textnav{padding-top: 15px;}

	/*Formats and sets up the copyright information inside the footer.*/
	#copyright{position: relative; margin-top: -10px; font-size: .75em;}

	/*Places the image link to the W3C validation status of the current page*/
	/*and the counter at the bottom.*/
	#validxhtmltrans{position: relative; padding: 15px;}
	#validxhtmltrans span img{border: 0px none #000;}
	
	/*Hides the link to the accessibility page in the  main navigation*/	
	/*and the "end of list" indicator from sighted users.*/
	#skiptocontent, .endlist{display: none;}
}