/*

Filename:	PageLayout.css	072510hd
	This controls the basic page layout. These settings will affect all pages on the site.

*/
/********************************************************************************************************************/

#ScreenWrapper /* sets and encompasses the entire browser display area */
{
	width:	1024px;
	height:	768px;
	border:	1%;
	border-color:	blue;
	border-style: solid;
	padding-left: 2%;
	padding-right: 2%;
	background-color:	#f0e2c8;
}
#HeaderWrapper /* the header area of the page */
{
	position: relative;
	top: 1%;
	left: 1%;
	width:	98%;	/* this width is correct when first opening, then changes upon refresh, becoming too wide??? NOTE: somehow, on 072710, when populating main menu, this was corrected ???? */
	height:	10%;
	border:	1%;
	border-color:	blue;
	border-style: solid;
	background-color:	#c6be39;
	overflow: hidden;
}
#MenuWrapper /* the menu area, below the header, on the page */
{
	position: relative;
	top: 1.5%;
	left: 1%;
	width:	98%;
	height:	5%;
	border:	0;
	border-color: blue;
	border-style: solid;
	background-color:	#ebe0be;	/* menu selection background color	*/
	overflow: hidden;
}
#QuadrantWrapper /* encloses the entire information area (below the header and menu) on the page. */
{
	position: relative;
	top: 1.7%;
	left: 1%;
	width:	98%;
	height:	82%;
	border:	0;
	border-color:	red;
	border-style: solid;
}
/********************************************************************************************************************/
/* The four quadrants of the website information area. */
#NWQuadrant
{
	position: absolute;
	top: 0;
	right: 0;
	width:	68%;
	height:	100%;
	border:	0;
	border-color:	gray;
	border-style: solid;
	padding-left: 0;
	padding-top: 1%;
	
	overflow: hidden;
}
#NEQuadrant
{
	position: absolute;
	top: 0;
	right: 0;
	width:	29.5%;
	height:	39.5%;
	border:	0;
	border-color:	gray;
	border-style: solid;
	padding: 1%;
	overflow: hidden;
}
#SWQuadrant
{
	position: absolute;
	bottom: 0;
	right: 0;
	width:	29.5%;
	height:	39%;
	border:	0;
	border-color:	gray;
	border-style: solid;
	overflow: hidden;
}
#SEQuadrant
{
	position: absolute;
	bottom: 0;
	right: 0;
	width:	29.5%;
	height:	39%;
	border:	0;
	border-color:	gray;
	border-style: solid;
	overflow: hidden;
}
/* END The four quadrants of the website information area. */
/********************************************************************************************************************/