body { color: #006 !important; font-size: 9pt !important; font-family: Arial, Helvetica, Sans-serif; line-height: 14pt; background-image: url(../images/background2.gif); top: 0; }
a:link { color: #2a3036; font-weight: bold; text-decoration: none; }
a:hover { color: #000; font-weight: bold; text-decoration: underline; }
a:active { color: red; font-weight: bold; text-decoration: underline; }
a:visited { color: #656363; font-weight: bold; text-decoration: none; }
h1 { font-size: 2em; font-weight: bold; line-height: 1em; margin: 0.67em 0; }
table { vertical-align: top; top: 0; }
/* All <ul> tags in the menu including the first level */
.menulist, .menulist  ul { font-size: 9pt; font-weight: lighter; margin: 0; padding: 0; list-style: none; text-align: center       ; position: relative; top: 190px; left: 70px; z-index: 999; }
/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.menulist ul { visibility: hidden; position: absolute; top: 2.5em; /* I'm using ems rather than px to allow people to zoom their font */
 left: 0; }

/* Second and third etc. level submenus - position across from parent instead */
.menulist ul ul { color: #dedede; background-color: #006; top: 0; left: 155px; }


/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.menulist li { font-size: 9pt; font-family: Arial, Helvetica, Sans-serif; font-weight: lighter; background-color: #e7e9f8; background-repeat: repeat; background-attachment: scroll; float: left; position: relative; width: 194px; height: auto; margin-right: -1px; border: solid 1px #727274; }

/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulist ul li { font-weight: lighter;; background-color: #e7e9f8; background-image: none; width: 200px; float: none; margin-right: 0; margin-bottom: -1px; border-color: #678ab2; border-width: 1px; }
.menulist ul>li:last-child { background-image: none; margin-bottom: 1px; }

/* Links inside the menu */
.menulist a { display: block; padding: 3px; color: #1e1e1e; text-decoration:  none; }

/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus { color: #499bee; background-color: #0a0093; background-image: none; }
.menulist  a.highlighted {
 color: #006;
 background-color: #678ab2;
}
/*
 If you want per-item background images in your menu items, here's how to do it.
 1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">
 2) Copy and paste these next lines for each link you want to have an image:
    .menulist a#xyz {
      background-image: url(out.gif);
    }
    .menulist a#xyz:hover, .menulist a.highlighted#xyz, .menulist a:focus {
     background-image: url(over.gif);
    }
*/
 .menulist xyz { background-color: #6998e2; }
    .menulist xyz:hover, .menulist a.highlighted xyz, .menulist a:focus { background-color: #6998e2; }
/* Only style submenu indicators within submenus. */
.menulist a .subind {
 display:  none;
}
.menulist ul a .subind {
 display:  block;
 float: right;
}

/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.menulist a {
 float: left;
}
.menulist ul a {
 float: none;
}
/* \*/
.menulist a {
 float: none;
}
/* */


/* This semi-commented section exists to fix bugs in IE/Windows (the 'Holly Hack'). \*/
* html .menulist  ul li {
 float: left;
 height: 1%;
}
* html .menulist  ul a {
 height: 1%;
}
/* End Hack */
.footerCopyright { font-size: 7pt; line-height: 7pt; }
.footer-link { font-size: 8pt; }
.section-body{
	background:#e9f0f5;
	height:140px;
	padding:14px;
}
ul, li{border:0; margin:0; padding:0; list-style:none;}
ul{
	border-bottom:solid 1px #e9f0f5;
	height:29px;
}
li{float:left; margin-right:2px;}
.tab a:link, .tab a:visited{ color:#56554e; display:block; font-weight:bold; height:30px; line-height:30px; background: url(../images/img/tab-round.png) right 60px; text-decoration:none; }
.tab a span{
	background:url(../images/img/tab-round.png) left 60px;
	display:block;
	height:30px;
	margin-right:14px;
	padding-left:14px;
}
.tab a:hover{ display:block; color:#e0ded0; background-image: url(../images/img/tab-round.png); background-repeat: repeat; background-attachment: scroll; background-position: right 30px; }
.tab a:hover span{
	background:url(../images/img/tab-round.png) left 30px;
	display:block;
}

/* -------------------------------- */
/* 	ACTIVE ELEMENTS					*/
.active a:link, .active a:visited, .active a:visited, .active a:hover{
	color:#1c4e7e;
	background:url(../images/img/tab-round.png) right 0 no-repeat;
} 
.active a span, .active a:hover span{
	background:url(../images/img/tab-round.png) left 0 no-repeat;
}
.navigation { }
.indexcopylight { color: #dedede; font-size: 14px; font-family: sans-serif; font-weight: normal; }
.indexcopydark { color: #191970; font-size: 14px; font-family: sans-serif; font-weight: normal; }
.content { position: absolute; top: 100px; left: 30px; z-index: 0; }
.menulistcom, .menulistcom  ul { font-size: 9pt; font-weight: lighter; margin: 0; padding: 0; list-style: none; text-align: center       ; position: relative; top: 190px; left: 70px; z-index: 99; }
/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.menulistcom ul { visibility: hidden; position: absolute; top: 2.5em; /* I'm using ems rather than px to allow people to zoom their font */
 left: 0; }
/* Second and third etc. level submenus - position across from parent instead */
.menulistcom ul ul { color: #dedede; background-color: #006; top: 0; left: 155px; }
/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.menulistcom li { font-size: 9pt; font-family: Arial, Helvetica, Sans-serif; font-weight: lighter; background-color: #e7e9f8; background-repeat: repeat; background-attachment: scroll; float: left; position: relative; width: 155px; height: auto; margin-right: -1px; border: solid 1px #727274; }
/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulistcom ul li { font-weight: lighter;; background-color: #e7e9f8; background-image: none; width: 150px; float: none; margin-right: 0; margin-bottom: -1px; border-color: #678ab2; border-width: 1px; }
.menulistcom ul>li:last-child { background-image: none; margin-bottom: 1px; }
/* Links inside the menu */
.menulistcom a { display: block; padding: 3px; color: #1e1e1e; text-decoration:  none; }
/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulistcom a:hover, .menulistcom a.highlighted:hover, .menulistcom a:focus { color: #499bee; background-color: #0a0093; background-image: none; }
.menulistcom  a.highlighted {
 color: #006;
 background-color: #678ab2;
}
/*
 If you want per-item background images in your menu items, here's how to do it.
 1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">
 2) Copy and paste these next lines for each link you want to have an image:
    .menulist a#xyz {
      background-image: url(out.gif);
    }
    .menulist a#xyz:hover, .menulist a.highlighted#xyz, .menulist a:focus {
     background-image: url(over.gif);
    }
*/
.menulistcom xyz { background-color: #6998e2; }
.menulistcom xyz:hover, .menulistcom a.highlightedcom xyz, .menulistcom a:focus { background-color: #6998e2; }
/* Only style submenu indicators within submenus. */
.menulistcom a .subind {
 display:  none;
}
.menulistcom ul a .subind {
 display:  block;
 float: right;
}
/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.menulistcom a {
 float: left;
}
.menulistcom ul a {
 float: none;
}
/* \*/
.menulistcom a {
 float: none;
}
/* */
/* This semi-commented section exists to fix bugs in IE/Windows (the 'Holly Hack'). \*/
* html .menulistcom  ul li {
 float: left;
 height: 1%;
}
* html .menulistcom  ul a {
 height: 1%;
}
/* End Hack */
.iFrame { z-index: -999; }