* /*Set's border, padding and margin to 0 for all values*/
{
padding: 0;
margin: 0;
border: 0;
}
body, html {

color: #000; 
font-family: Verdana, Arial, Tahoma, sans-serif;
background-color: rgb(255,255,255);
}
body {
font-size: 12px;  /* Enables font size scaling in MSIE */
min-width: 760px;
}
p {
padding: 7px 0 7px 0;
}
/* */
a {
color: #000099;
}
a:hover{
color: #0000FF;
text-decoration: none;
}

h1, h2, h3 {
font-weight: bold;
padding-bottom: 5px;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 1.4em;
}
h3 {
font-size: 1.3em;
}
h1 a, #header h2{
color: #fff;
}

.clear { clear: both; }

#mainContainer {
min-height: 300px;

border: 1px solid rgb(216,210,195);
}

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

background-color:#6566FF; 
padding: 10px
 height:60px; 
 width:100%;
}

#header h1, h2 {
padding-left: 50px;

  background-color: transparent;
  font-weight: normal;
}

#header h1 a {
padding-left: 50px;
  color: #ffffff;
  background-color: transparent;
  text-decoration: none;
  font-size: 110%;  /* For MSIE */
  font-weight: bold;
  font-style: italic;
}

#header > a {
  font-size: 138%;  /* For fully standards-compliant user agents */
}

/**************************
SUB HEADER
**************************/
.subHeader {
  color: white;
  background-color: black;
  font-size: 109%;
  text-align: center;
  margin: 0;
  padding: 0.5ex 0;
}

.subHeader a {
  color: white;
  background-color: black;
  text-decoration: none;
  font-weight: bold;
  margin: 0;
  padding: 0 1ex;
}

.subHeader a:hover {
  color: black;
  background-color: white;
}


/**************************
CONTENT AND COLUMNS
**************************/
.outer {

padding-left: 165px;
padding-right: 130px;
background: url("right_line.gif") 100% 0 repeat-y;
}
/*** This is the visible right col background. Because of IE (both 6 and 7) the right col background and inner border is in fact an repating image where 1px of the left part of the image is black, and is simulating a border.
***/
* html .outer {
/*** No need for hacking IE on this layout ***/

}
.inner {
width: 100%;
border: 1px solid rgb(216,210,195); /*** BORDER COLOUR ***/
border-width: 0 0 0 1px;
margin-left: -2px; /*** This fixes a small overlap problem. Without this the border on the left side of the right column won't be visible ***/
}
* 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 padding-left but with negative value ***/

}
* html .float-wrap {
/*** No need for hacking IE on this layout ***/
}
#content {
float: right;
background: transparent;
margin-right: -165px; /*** Same length as .outer padding-left but with negative value ***/
width: 100%;
}
* html #content {
position: relative; /*** IE needs this  ***/
}
.contentWrap{
padding: 5px 55px 5px 5px;

}
.contentWrap a {
  color: black;
  background-color: transparent;
  text-decoration: none;
}

.contentWrap a:hover {
  color: rgb(64,64,64);
  background-color: transparent;
  text-decoration: none;
}
/* */
.contentWrap ol, .contentWrap ul {
margin: 3px 0 5px 35px;

}
.contentWrap li {
padding-bottom: 2px;
}

.doNotDisplay {
  display: none !important;
}
img  { 	border: 0px none; 
}


input, select ,textarea {
font-family:  Arial,Verdana,Helvetica,sans-serif; 
 font-size:  12px; 
 color:  #000000; 
 border-width:  1px; 
 border-style:  double; 
 border-color:  #000000; 
 padding:  1px; 
 
 }

/**************************
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: 150px;

min-height: 250px;

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


#left ul {

padding-bottom: 4px;
}
#left li {
  margin: 0 0 1em 0;
}

#left .sideBarTitle {
  color: rgb(255,255,255);
  background-color: rgb(51,51,255);
  font-weight: bold;
  padding: 0.8ex 1ex;
}

#left ul {
  list-style-type: none;
  list-style-position: outside;
  margin: 0 0 0 0;
  padding: 5px;
}


#left a {
  color: rgb(0,0,0);
  background-color: rgb(255,255,255);
  text-decoration: none;
}

#left a:hover {
  color: rgb(64,64,64);
  background-color: transparent;
  text-decoration: none;
}

/* 
#left .sideBarText {
  color: rgb(166,140,83);
  background-color: transparent;
  line-height: 1.25em;
*/


/*************************
RIGHT COLUMN
**************************/
#right {
float: right; 
width: 150px;
position: relative; /*** IE needs this  ***/
padding: 5px;
min-height: 250px;
margin-right: -130px; /** This negative margin-right value is the width of the right column + the padding, in this example 130px. ***/

background-color: #6666FF;
}
* html #right {
height: 250px;
}
#right ul {
list-style: none;
padding-bottom: 4px;
}
#right li {
padding-bottom: 2px;
}

/*** RIGHT COLUMN CONTENT ***/

#right .sideBarTitle {
  color: rgb(255,255,255);
  background-color: rgb(51,51,255);
  font-weight: bold;
  padding: 0.8ex 1ex;
}

#right a {
  color: rgb(255,255,255);
  background-color: transparent;
  text-decoration: underline;
  font-weight: bold;
}

#right .sideBarText a {
  text-decoration: underline;
}

#right.sideBarText a:hover {
  text-decoration: none;
}

/**************************
FOOTER
**************************/

#footer {

clear: right;
clear: both;

padding: 0;
margin: 0;
text-align: center;
background-color: yellow;

}

/* */
#footer{
width:100%; 
background-color:#E6DFCF;
font-size: 12px;
text-align: center;
font-family: arial, verdana, helvetica, sans-serif;
} 

#footer a {
  color: black;
  background-color: transparent;
  text-decoration: underline;
  font-weight: bold;

}

#footer a:hover {
  text-decoration: none;
}

.footer links{
  padding-top: 10px;
  padding-bottom: 10px;

}