

/*
CSS-file for Strictly CSS three column layout 2006
http://www.strictlycss.com
Developed by Eivind Savio
*/
* /*Set's border, padding and margin to 0 for all values*/
{
padding: 0;
margin: 0;
border: 0;
}


p {padding: 7px 0 7px 0;}



.clear { clear: both; }
#mainContainer {
/*min-height: 300px; */
background: #add8e6;
width: 964px;
margin:0 auto;
height: 100%;

}
* 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 ***/
width: 964px;
height: 100%; /**************/

}
#containerbackground{
background-image: url(/images/maincontentbg.gif);
width: 980px;



}
/**************************
CONTENT AND COLUMNS
**************************/
.outer {

border-left: 165px solid #ebeff0; /*** This is the width and the color for our left column ***/
border-right: 190px solid #ecf7eb; /*** 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: -165px; /*** Same length as .outer border-left but with negative value ***/

}
* html .float-wrap {
/*** No need for hacking IE on this layout ***/
}
#content {
	float: right;
	background: #fff;
	margin-right: -165px;  /*** Same length as .outer border-left but with negative value ***/
	width: 100%;
	height: 100%;
}
* html #content {
position: relative;
}
.contentWrap{
	padding: 10px;
  min-height:475px;
 height:auto !important; 

}
	/*height: 260px; 
	height: 100%;
	height: 320px;*/



.contentWrap ol, .contentWrap ul {
margin: 3px 0 5px 35px;
}
.contentWrap li {
padding-bottom: 2px;
}
/**************************
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. 
***/
#left {
float: left;
width: 155px;
/*min-height: 250px;*/
height: 100%;
padding: 0px 0px 10px 0px;
}
* html #left {
position: relative;  /*** IE needs this  ***/
/*height: 250px;*/
height: 100%;
}
#left ul {
list-style: none;
padding-bottom: 4px;
}
#left li {
padding-bottom: 2px;
}
/*************************
RIGHT COLUMN
**************************/
#right {
float: right; 
width: 170px;
padding: 10px;
/*min-height: 250px; */
height: 100%;
margin-right: -190px; /** This negative margin-right value is the width of the right column + the padding, in this example 130px. ***/
}
* html #right {
/*height: 250px; */
height: 100%;
position: relative;  /*** IE needs this  ***/
}
#right ul {
list-style: none;
padding-bottom: 4px;
}
#right li {
padding-bottom: 2px;
}

