* /*Set's border, padding and margin to 0 for all values*/
{
	padding: 0;
	margin: 0;
	/*border: 0;*/
	font-family: 'Tahoma','sans-serif';
	/*font-size: 11px;*/
}

body, html 
{
	color: #000; 	
	background-color: #F9F7EB;
	font-size:0.9em;
}
/*h1
{
	font-size:1.74em;
}*/
body 
{
	/*font-size: 70%;*/
	min-width: 760px;
}

.clear 
{ 
	clear: both; 
	font-size: 1px;
	height: 1px;
	line-height: 1px;
	overflow: hidden;
}

#mainContainer 
{
	min-height: 300px;
	background-color: White;
	border-bottom: 3px solid white;
}

* html #mainContainer 
{
	height: 300px; 
	/*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/
}



/**************************
CONTENT AND COLUMNS
**************************/
.outer 
{	
	/*position: relative;
	top: -20px;*/
	border-left: 185px solid #F3EDD5; 
	/*** This is the width and the color for our left column ***/
	border-right: 190px solid white; 
	/*** This is the width and the color for our right column ***/
}

* html .outer 
{
	/*** No need for hacking IE on this layout ***/
}

.inner 
{
	width: 100%; 	
}

* html .inner 
{
	/*** No need for hacking IE on this layout ***/
}

/*** div.inner is wider than its container, div.outer, and so overlaps to the right, pushing
div.right into the proper position. IE expands div.outer instead, requiring a Tan hack to avoid 
blowing the layout apart. IE gets the original 100% width as in the Livingstone layout. It blows 
my mind that all this hacking is being caused by the mighty Gecko engine! (shakes head ruefully)
***/
.float-wrap 
{
	float: left;
	width: 100%;
	margin-left: -185px; 
	/*** Same length as .outer border-left but with negative value ***/
}

* html .float-wrap 
{
	/*** No need for hacking IE on this layout ***/
}

#contentOuter 
{
	float: right;
	margin-right: -185px;  
	/*** Same length as .outer border-left but with negative value ***/
	width: 100%;
}

* html #content 
{
	position: relative;
}

#content
{
	border-left: 1px solid white;
	/*font-size: medium;*/
}

/**************************
LEFT COLUMN
**************************/
/*** div.left is in div.float-wrap, and when div.float-wrap is neg margined to the left, 
div.left is carried over into the proper position. 
***/
#leftside
{
	float: left;
	width: 185px;
	min-height: 250px;
	padding: 0px;
	
}

* html #leftside
{
	position: relative;  /*** IE needs this  ***/
	height: 250px;
}

/*************************
RIGHT COLUMN
**************************/
#rightside
{
	float: right; 
	width: 190px;
	padding: 0px;
	min-height: 250px;
	margin-right: -190px; 
}

* html #rightside 
{
	height: 250px;
	position: relative;  /*** IE needs this  ***/
}



/****************************************************
************************ HEADER *********************
****************************************************/
#header 
{
	height: 111px;
	background-position: 0px 35px;
	background-repeat: repeat-x;
	/*	
	background-image: 
	This property is overidden at the department specific CSS file.
	*/
}


/**************************
FOOTER
**************************/
#footerOuter 
{
	background-image: url(../images/bottom_border.gif);
	background-repeat: repeat-x;
	background-position: 0px 0px;
}

/* ############################################################# */
/* ############################################################# */
/* ############################################################# */
/* ############################################################# */
#footer
{
	margin-left:10px;
	/*margin-top: 5px;*/
	line-height: 16px;
	color: #705E46;
}

#footer A
{
	color: #705E46;
}

.bottom_spacer
{
	height: 30px;
}