/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

HTML TAGS 
#84B7FF; - light bright blue
#95B3DE; - a bit darker blue
#2660B1 - another blue for links
#657DA6; - dark blue
#4B964B; - dark green
#D6DEEC - extra light blue 
#ff6600 - orange
#B1C0D5 - darker shade of light blue 
#CDFFAA - light green
#FFF7D7 - light orange
#FAE5B0 - orange
#FAD163 = dark oragnge
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/*typography*/
body{font: 76% verdana,arial,sans-serif;text-align: center;color: #666666; }
h1,h2,h3,h4{font-family: verdana, clean, sans-serif, tahoma, arial}
h1{font-size: 160%; margin-left: 0px;}
h2{font-size: 120%;margin: 5px  5px 10px 0px;padding:0}
h3{font-size:110%;text-transform:uppercase;letter-spacing:1px;margin: 5px 5px 5px 0px}
h4{font-size: 100%; margin: 0  0px 5px 0; border: solid 0px #000;}
h5{font-size: 80%}
h1, h2, h4, h5{color: #657DA6}
h3{color: #f60}

p{margin: 0 0px;padding:0;padding-bottom: 0.7em;line-height: 1.5}
div#contentwrap  li{margin: 0 0px;padding:0;padding-bottom: 0.2em;line-height: 1.5}
div#help ul li{margin:0 0  5px -20px; padding:0 0 5px 0;
 list-style-type:square;
 line-height: 1.4}

div#helpNum ul li{margin:0 0  5px -20px; padding:0 0 5px 0;
 line-height: 1.4}


a{text-decoration: none}
a:hover{text-decoration: underline}
address{padding: 3px 15px;font-style:normal}
div#relax p{font-size: 120%}

img { border: 0px; }

hr{
	color: #336699;
	background-color: #336699;
	height: 1px;
	border:0;
	margin: 0;
	padding: 0;
	border: solid 0px #000;
}


/*layout*/
html{height: 100%; margin-bottom: 1px}
html,body{margin:0;padding:0 0 20px}
div#container{width: 815px;margin: 0px auto;text-align: left}
div#header{margin:0 0 10px;padding: 0 0 5px}
div#header h1{margin:0 5px;padding:60px 0 2px}
div#header a{margin-left: 10px}

div#sidebar{float: right;width: 150px}
div#sidebar div{padding: 5px 0;margin-bottom: 5px}
div#sidebar div#menu{margin: 0 5px}
div#sidebar p{margin: 0 5px;padding:0}
div#sidebar p+p{margin-top: 0.7em}

div#nav ul, div#nav li{margin:0; margin-left:5px; padding:0;list-style-type:none;line-height: 1.5}
div#nav a{margin-left:5px;padding-left:10px}
div#nav .selected { background: #fff; margin-left:5px}
div#myform {margin: 5px 0;padding: 5px 0}
div#myform  h3{margin-bottom: 10px}
div#myform  div{padding: 5px 0}
div#myform  input#find{width: 90px;margin-left:10px}
blockquote{float:left;display:inline;width: 100%;margin:  10px 0px  10px 0px;padding: 5px 0}
blockquote p{margin:0;padding: 0 5px;text-align: left}
div#relax{margin: 0 15px 10px;padding: 5px 0}
div#relax p, div#relax h2{margin: 0 5px}
div#footer{clear: right;margin-top: 10px}

div#content2{width:595px;padding:5px 0}


div#content {
} 

.contentCss {
  margin: 0  160px 0 145px; /* the right margin can be given in ems or pixels. It creates the space down the right side of the page. */
  background: #D6DEEC;
} 

div#contentLeft {
} 

.contentLeftCss {
  margin: 0  160px 0px 0px; /* the right margin can be given in ems or pixels. It creates the space down the right side of the page. */
  background: #D6DEEC;
} 

div#contentRight {
} 

.contentRightCss {
  margin: 0  0 0 145px; /* the right margin can be given in ems or pixels. It creates the space down the right side of the page. */
  background: #D6DEEC;
} 

div#contentAll {
} 

.contentAllCss {
  margin: 0 0 0 0; /* the right margin can be given in ems or pixels. It creates the space down the right side of the page. */
  background: #D6DEEC;
}





div#contentwrap{ margin:   0px   5px 0px 5px; padding: 10px 10px 10px 10px; border: solid 0px #000;}
div#contentwrapWithMenu{ margin:   0px   0px 0px 0px; padding: 0px 0px  10px 0px; border: solid 0px #000;}
div#contentwrap2{  margin: 0 5px 0 5px;  padding:  5px 5px 5px  10px;}

div#leftbar{float: left;width: 150px}
div#leftbar div{padding: 5px 0;margin-bottom: 5px}
div#leftbar div#leftnav{margin:  0  0 0 0;}
div#leftbar p{margin: 0  5px 0 0;padding:0}
div#leftbar p+p{margin-top: 0.7em}

div#leftnav ul, div#leftnav li{margin:0;margin-left:0px;padding-left:5px;list-style-type:none;line-height: 2.0; font-size:100%;}
div#leftnav a{margin-left:0px;padding-left:0px}
div#leftnav .selected { background: #fff; margin-left:0px; 		font-weight:bold; }
div#leftnav .notselected { margin-left:0px; }

div#leftSubnav{
    background: #D6DEEC;
    padding:2px 2px  2px 5px;
    margin-right:5px; 
	border-bottom:1px solid #657DA6;
}
div#leftSubnav a{color: #657DA6}

div#leftSubnav ul { list-style: none;  margin: 0;  padding-top:4px; }
div#leftSubnav li { display: inline; margin:0; 
		padding: 5px  5px 2px 5px;
		list-style-type:none; font-size:110%; }
div#leftSubnav a{}
div#leftSubnav .selected { 
		background:#FFFFFF;
		padding:5px 5px  2px 5px;
		border: 1px solid #657DA6;
		border-bottom-color:#FFFFFF;
		font-weight:bold;
}
div#leftSubnav .notselected {}



div#sidetips{ float:left;display:inline; width: 100%; padding:  5px 0 5px 0;}
div#sidetips p{margin:0;padding: 0 5px 0 5px;text-align: left}
div#sidetips h4{margin:0;padding: 0 5px 5px 5px;text-align: left}
div#sidetips ul, div#sidetips li
{
    padding: 0px;
    margin: 5px 0 0 10px;
    list-style-position: outside;
    list-style-type: square;
}

div#pagetools{ float:left;display:inline; width: 100%; padding:  5px 0 5px 0; }
div#pagetools p{margin:0; padding: 0 5px 0 5px; text-align: left}
div#pagetools h4{margin:0;padding: 0 5px 5px 5px;text-align: left}
div#pagetools ul, div#pagetools li
{
    padding: 0px;
    margin: 5px 0 0 10px;
    list-style-position: outside;
    list-style-type: square;
}


div#sidehelp{ float:left;display:inline; width: 100%; padding:  5px 0 5px 0;}
div#sidehelp p{margin:0;padding: 0 5px 5px 5px;text-align: left}
div#sidehelp h4{margin:0;padding: 0 5px  5px 5px;text-align: left}
.quote{float:left;display:inline;width: 100%;margin:  10px 0px  10px 0px;padding: 5px 0}
.quote p{margin:0;padding: 0 5px;text-align: left}


/*colors*/
body{background: #ffffff}
a{color: #2660B1}
div#header{background: #84B7FF}
div#header h1{background: #657DA6}
div#nav{background: #B1C0D5}
div#nav a{color: #657DA6}
div#sidenotes{background:#D6DEEC}
div#myform{background: #B4CEF7}
blockquote{background: #CDFFAA}
div#relax{background: url('images/relax.jpg')}
div#relax h2{color: #F7DEB5}
div#relax p{color: #fff}
div#footer{background: #CCC;color: #333}

div#contentwrap2{background: #fff; height:100%;}
div#contentwrap{background: #fff; height:100%;  }
div#contentwrapWithMenu{background: #fff; height:100%;  }

div#leftnav{background: #D6DEEC}
div#leftnav a{color: #657DA6}

div#formMessage{background: #fffacd; color: #cc3333;}
div#sidetips{background:#fff; border: solid 0px #000;}
div#sidehelp{background:#fff; border: solid 0px #000;}
div#sidehelp .topicContent
{
    display: block; z-index: 3; background-color:#CDFFAA; 
    margin: 5px 5px 5px 5px;
}

.quote{background: #CDFFAA}


/* Miscellaneous classes for reuse */
.floatRight { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
	border: solid 0px black;
}
.floatLeft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
	 border: solid 0px black;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}