@charset "utf-8";
/* CSS Document */

body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif; margin: 0; padding: 0; text-align: center; color: #333; background-image: url(images/bg_body_gradient.jpg); background-repeat: repeat;
}
.supercontainer #container {
	position: relative; width: 900px; background: #fff; margin: 0 auto; border: 1px solid #ccc; text-align: left; overflow: hidden;
} 

.supercontainer p {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	color: #333;
	line-height: 1.8;
}
.supercontainer #header { 
	height: 160px; /* if you're changing the source order of the columns, you'll may want to use a height on the header so that you can give the columns a predictable top value */
	padding: 0;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
} 

.supercontainer #header p {
	font-family: Verdana, Geneva, sans-serif;
	font-size: x-small;
	color: #666;
	text-align: right;
	vertical-align: top;
	position: absolute;
	top: 3px;
	right: 140px;
	border: none;
	margin-right:0px;
	padding-top: 0px;
	margin-top: 0px;
}

.supercontainer #header .search {
	font-family: Verdana, Geneva, sans-serif;
	font-size: x-small;
	color: #ccc;
	text-align: right;
	vertical-align: top;
	position: absolute;
	top: 0px;
	right: 0px;
	border: none;
}

.supercontainer #header h5 {
	font-family: Arial, Verdana, Geneva, sans-serif;
	font-size: 12px;
	font-weight:bold;
	color: #0082b3;
	text-align: left;
	vertical-align: top;
	position: absolute;
	top: 3px;
	padding-top: 0px;
	margin-top: 0px;
	padding-left: 20px;
}
.top {
	vertical-align: middle;
	position: absolute;
	top: 3px;
	border: none;
	margin-right:0px;
	padding-top:0px;
	padding-left:10px;
}

.supercontainer #header h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #0082b3;
	text-align: right;
	vertical-align: baseline;
	position: absolute;
	top: 50px;
	right: 50px;
	border: none;
}

.supercontainer #header a hover{ text-decoration:underline; color: #000000; }
.supercontainer #header a{ color: #000000; }
	
.supercontainer #sidebar1 {
	position: absolute;
	top: 180px;
	left: 0px;
	width: 150px; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 15px 10px 15px 20px; /* padding keeps the content of the div away from the edges */
}
	
.supercontainer #sidebar1 h3{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	font-weight: bold;
	color: #0082b3;
	padding-left: 5px;
}

.supercontainer #sidebar1 p{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	padding-left: 5px;
	color: #0082b3;
	font-weight: bold;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	line-height: 1.5em;
}

.supercontainer #sidebar1 a hover{ text-decoration:underline; color:#0082b3; }
.supercontainer #sidebar1 a{ color: #0082b3; }

.supercontainer #sidebar2 {
	position: absolute;
	top: 200px;
	right: 0px;
	width: 160px; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 15px 10px 15px 20px;
	border-top: 1px solid #ccc;
	border-right: 0px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-left: 1px solid #ccc;
}

.supercontainer #sidebar2 h3{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: bold;
	color: #0082b3;
}

.supercontainer #sidebar2 ul, p{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	list-style-type: none;
	padding-left: 0px;
	margin-left: 0;
	line-height: 1.1;
}

.supercontainer #sidebar2 li{
	padding-bottom: 5px;
}

.supercontainer #sidebar2 a hover{ text-decoration:underline; color:#333 }
.supercontainer #sidebar2 a{ color: #333; }


.supercontainer #mainContent {
	margin-top: 0;
	margin-right: 180px;
	margin-bottom: 0;
	margin-left: 190px;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 10px;
}

.supercontainer #mainContent  h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.3em;
	color: #333;
	padding-top: 0px;
	padding-bottom: 20px;
	position: relative;
	top: 0px;
}

.supercontainer #mainContent  h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #0082b3;
	padding-top:0px;
	margin-top:0px;
	font-weight:bold;
}

.supercontainer #mainContent  p {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	color: #333;
	line-height: 1.8;
}

.supercontainer #mainContent  ul, li, td, th, dt, dd {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	color: #333;
}

  dl.tablestyle1 {
    padding: 0.5em;
  }
  
  dl.tablestyle1 dt {
    float: left;
    clear: left;
    width: 150px;
    text-align: right;
    font-weight: bold;
	clear: left;
  }
  dl.tablestyle1 dd {
    margin: 0 0 0 160px;
    padding: 0 0 0.5em 0;
	clear: right;
  }

* html .tablestyle1 dd {
	float: none;
	margin-left: 25%;}
	
  dl.tablestyle3 {
    border: 0px solid #ccc;
    padding: 0.5em;
  }

  dl.tablestyle3 dt {
    float: left;
    clear: left;
    width: 150px;
    text-align: right;
    font-weight: bold;
	clear: left;
  }

  dl.tablestyle3 dd {
    margin: 0 0 0 160px;
    padding: 0 0 0.5em 0;
	clear: right;
  }

* html .tablestyle3 dd {
	float: none;
	margin-left: 25%;}

.supercontainer #footer {
	padding: 0 10px 0 20px;
} 
.supercontainer #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font-family: Verdana, Geneva, sans-serif;
	font-size: x-small;
	color: #666;
	text-align: center;
}
.supercontainer #footer a hover{ text-decoration:underline; }
.supercontainer #footer a{ color: #666; }
.fltrt { /* 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;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}

.language {
	font-family: Verdana, Geneva, sans-serif;
	font-size: small;
	color: #999;
	text-align: right;
	vertical-align: top;
	position: relative;
	top: 10px;
	right: 10px;
}

.search {
	font-family: Verdana, Geneva, sans-serif;
	font-size: x-small;
	color: #ccc;
	text-align: right;
	vertical-align: top;
	position: relative;
	top: 0px;
	right: 0px;
	border: none;
}

img 
{
	border: 0;
	top: 0px;
}

.rightaligned {
	border: 0;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	float:right;
}

.leftaligned {
	border: 0;
	padding: 3px;
	float: left;
}

.orange {
	color: ff9900;
}
/* Link styles */
a { color: #0082b3;  text-decoration:none;}
a:hover { text-decoration:underline; }
a:link{ }
a:visited{ color: #003366; }
a:active {color: #0082b3; }


/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
{
	list-style-type: none;
	font-size: 70%;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	cursor: default;
	width: auto;
	margin: 0;
	padding: 0;
	position:absolute;
	top: 130px;
	left: 3px;
	font-weight: bold;
}
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
{
	z-index: 1000;
}
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	position: relative;
	text-align: center;
	cursor: pointer;
	width: 128px;
	hight: 31px;
	float: left;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #2BAFE1;
}

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

 DESIGN INFORMATION: describes color scheme, borders, fonts

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

/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
{
	display: block;
	color: #ccc;
	cursor: pointer;
	width: 99px;
	hight: 31px;
	float: left;
	padding-top: 4px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	text-decoration: none;
}

ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{
	text-decoration: underline;	
}


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

 BROWSER HACKS: the hacks below should not be changed unless you are an expert

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

/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
{
	position: absolute;
	z-index: 1010;
	filter:alpha(opacity:0.1);
}
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
{
	ul.MenuBarHorizontal li.MenuBarItemIE
	{
		display: inline;
		f\loat: left;
		background: #FFF;
	}
}

/*<![CDATA[*/
 br.c5 {clear:both}
 img.c4 {position:absolute; top:20px;}
 input.c3 {width: 16px; height: 16px; border: 0px; vertical-align:middle}
 input.c2 {font-weight:regular; border:1px solid #dddddd;background-color:#ffffff;font-family:'Bitstream Vera Sans', verdana, arial, helvetica, sans; color:#404040; font-size:10px; width:100px; padding-left:1px; padding-right:1px;}
 fieldset.c1 {display: none}
/*]]>*/

[if IE 5]>
<style type="text/css"> 
/* place css box model fixes for IE 5* in this conditional comment */
.supercontainer #sidebar1 { width: 180px; }
.supercontainer #sidebar2 {
	width: 150px;
}

<![endif]