@media screen {

/* --- Generics --- */
body {
	font: normal 62.5% Arial, Helvetica, FreeSans, "Liberation Sans", "Nimbus Sans L", sans-serif; /*creates a 10px base which allows all subsequent font sizes to be easily calculated*/
    text-align: left;
	background: url(/_hbi_ui/_HCO/_images/bkg/bkgBody.gif) #44689a repeat top left;
	color: #000;
}
#wrap {
	margin: 0 auto;
	background-color: #ffffff;
}
#uberContainer {
	background-color: #ffffff;
	color: #000;
	position: relative; /*Beware This messes with modal overlays in IE6 - 
	please move them outside of the ubercontainer*/ 
}

/* ---------- structure ---------- */

/* right border/Shaddow */
#content,
#footer {
	background: url(/_hbi_ui/_HCO/_images/bkg/bkgRightShadow.gif) top right repeat-y;
	overflow:hidden;
}

#content {
	margin-right: 4px;
}
#footer {
	clear:both;
	margin: 0 6px 0 12px;
}

#contentInner,
#footerInner {
	padding-right: 5px;
}


#header {
	width:100%;
}
#content {
	padding: 0;
}
#maincol,
#xcol {
	margin-right:5px;
}
#maincolInner {
	padding: 12px 0 0 11px;
}
#xcol {
	background-color: #d4ddea;
}
#xcolInner {
	padding: 12px 5px 0 6px;
}

/* ---------- general elements ---------- */

#content h1,
#content h2,
#content h3,
#content h4,
#content h5,
#content caption,
#content legend {
    font-weight: bold;
    text-align: left;
	line-height: 1.4;
}
#content h1 {
	font-size: 1.8em; 
}
#content h2 {
	font-size: 1.6em; 
}
#content h3 {
	font-size: 1.5em;
}
#content h4 {
	font-size: 1.4em;
}
#content h5 {
	font-size: 1.3em;
}

#content p,
#content li,
#content td,
#content th {
	font-size: 1.2em;
	line-height: 1.4;
}
.content p,
.content ul,
.content ol,
.content dl,
.content blockquote,
.content hr,
.content fieldset,
.content table {
	margin-bottom: 1.5em;
}
.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content caption,
.content legend {
	margin-bottom: 0.5em;
}
#content li li, #content td td, #content li p, #content td p { font-size: 100%; }
.content li ul, .content li ol, .content dl dl, #content td p {margin-bottom: 0;}

/* links */
a {
    color: #005ca8;
	text-decoration:none;
}

a:hover {
	text-decoration:underline;
}

.content a:link,
.content a:visited {
    text-decoration: underline;
}
.content a:hover,
.content a:active,
.content a:focus {
    text-decoration: none;
}
#content h1 a:link, #content h2 a:link, #content h3 a:link, #content h4 a:link, #content h5 a:link,
#content h1 a:visited, #content h2 a:visited, #content h3 a:visited, #content h4 a:visited, #content h5 a:visited {
    text-decoration: none;
}
#content h1 a:hover, #content h2 a:hover, #content h3 a:hover, #content h4a:hover, #content h5 a:hover,
#content h1 a:active, #content h2 a:active, #content h3 a:active, #content h4 a:active, #content h5 a:active,
#content h1 a:focus, #content h2 a:focus, #content h3 a:focus, #content h4 a:focus, #content h5 a:focus {
    text-decoration: underline;
}
/* links in linklists */
ul.linklist a {
    text-decoration: none;
	font-weight: bold;
	background:transparent url(/_hbi_ui/_HCO/_images/icon/icon_Bullet.gif) 0 5px no-repeat;
	padding-left: 14px;
	display: block;
}

ul.linklist a:link,
ul.linklist a:visited {
	color: #000;
}
ul.linklist a:hover,
ul.linklist a:active,
ul.linklist a:focus {
    color: #005ca8;
}
ul.linklist a.moreLink,
ul.linklist a.lessLink {
	background-image: none;
}

#content .mims a:link,
#content .mims a:visited {
	color: #2a4276;
}
#content .mims a:hover,
#content .mims a:active,
#content .mims a:focus {
	color: #000;
}

.cms li, .cms dd { margin-left: 2.5em; }
.cms li li, .cms dd dd { margin-left: 1.5em; }
.cms ul li { list-style-type: disc; }
.cms ol li { list-style-type: decimal; }


/* Table styles to work with HTML from old site */

.cms table tr.thead td, 
.cms table tr.caption td,
#content .cms table td.thead, 
#content .cms table td.caption{
	
	background-color: #3671a4;
	color:#fff;
	font-weight: 700;
	text-transform:uppercase;
	padding: .2em 0.5em;
}

	#content .cms table tr.thead td,
	#content .cms table td.thead{
		color:#fff;
		padding: .3em 1em;
		font-size:1.4em;
	}
	

/* Standard table styles */

.cms table{
	border-color:#ccc;
	border-left:1px solid #ccc;
	border-top:1px solid #ccc;
	margin-left:1px; /*FF needs this or the border gets lost in the overflow*/
}

#content .cms table th {
	font-weight: 700;
	font-size:1.4em;
	text-transform:uppercase;
	background:#d9e6f5;
	text-align:left;
}

#content .cms table tr.alternate{
	background:#eef4fb;
}

.cms table th,
.cms table td {
	padding: .4em 1em;
	vertical-align: top;
	border-bottom: 1px solid #ccc;
	border-right:1px solid #ccc;
}

.cms table td{
	color:#454545;
}

#content .cms table td ul{
	margin-bottom:0;
}
	
	#content .cms table td ul li{
		font-size:1.0em;
	}
#content .cms table th img,
#content .cms table td img{
	margin:0!important;
}

/* HCR Use tables for layout so they required a non styled version */

.cms table.layout{
	border:none;
}

.cms table.layout th,
.cms table.layout td {
	padding: 0.4em;
	vertical-align: top;
	border:none;
}

#content .cms table.layout tr.alternate{
	background:none;
}

.cms .intro {
	font-weight: 700;
}

strong { font-weight: 700; }
em { font-style:italic; }
sub { vertical-align: sub; font-size: 80%;}
sup { vertical-align: super; font-size: 80%;}


#skipNav {
	position: absolute;
	top: 140px;
	left: 3px;
}
#skipNav li {
	display: inline;
}
#skipNav a,
a.skipNav {
	text-decoration: none;
}
#skipNav a:link,
#skipNav a:visited,
#skipNav a:hover {
	color: #fff;
	background-color: #fff;
}
#skipNav a:active,
#skipNav a:focus {
	color: #005CA8;
	background-color: #fff;
}

#xcol a.skipNav {
	float: right;
	margin: 3px 5px;
}
#xcol a.skipNav:link,
#xcol a.skipNav:visited,
#xcol a.skipNav:hover {
	color: #D4DDEA;
	background-color: #D4DDEA;
}
#xcol a.skipNav:active,
#xcol a.skipNav:focus {
	color: #005CA8;
	background-color: #D4DDEA;
}


#maincol .backToTop {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 5px 0;
	font-size: 1.1em;
	margin: 25px 0 10px;
}
#maincol .backToTop a {
	color: #000;
}


hr {
	display: block;
	clear: both;
	height: 1px;
	background-color: #999;
	border: none;
}
	
/* used to show and hide areas of the page */
.hide {display: none;}
.show {display:block;}

.hideMessage {
	visibility: hidden;
}
	
.showMessage {
	visibility: visible;
}
	
div.clearFloat {
	clear: both;
	height: 0;
	line-height: 1px;
	font-size: 1px;
	visibility: hidden;
}

.clearfix:after {
	content:" ";
	display:block;
	height:0;
	line-height: 0;
	clear:both;
	visibility:hidden;
}

.clearfix {
	display:inline-block;
}

.a11y {
    position: absolute;
    left: -5000px;
    top: -2000px;
    width: 0;
    height: 0;
    overflow: hidden;
    display: inline;
}


#content a.button {
	float: left;
	font-weight: bold;
	text-decoration: none !important;
}
#content .module {
	margin-bottom: 16px;
}


/* -----------------------------------
 * generic styling for modules and buttons with rounded corners
 * ----------------------------------*/
.rounded,
.rounded .bg {
	background-repeat: no-repeat;
	display: block;
}
.rounded {
	background-position: left bottom;
}
.rounded .r1 {
	background-position: right bottom;
	padding: 0 0 7px 0;
	margin-left: 7px;
}
.rounded .r2 {
	background-position: left top;
	padding: 0 0 0 7px;
	margin-left: -7px;
}
.rounded .r3 {
	background-position: right top;
	padding: 7px 7px 0 0;
}

/* ---- different types of rounded corners ---- */
#maincol .module,
#maincol .module .bg {
	background-image: url(/_hbi_ui/_HCO/_images/bkg/bkgModuleMaincol.gif);
	background-color: #fff;
	color: #000;
}
#xcol .module,
#xcol .module .bg,
#CommonSidebarRight .module,
#CommonSidebarRight .module .bg {
	background-image: url(/_hbi_ui/_HCO/_images/bkg/bkgModuleXcol.gif);
	background-color: #fff;
	color: #000;
}
a.button,
a.button .bg {
	background-image: url(/_hbi_ui/_HCO/_images/btn/btnBkg.gif) !important;
	background-color: #fff;
	color: #005CA8;
	line-height: 1;
	cursor: pointer;
}
a.button .r3 {
	padding: 7px 14px 0 7px;
}

/* button hover effect */
a.button:hover,
a.button:active,
a.button:focus,
a.button:hover .bg,
a.button:active .bg,
a.button:focus .bg {
	background-image: url(/_hbi_ui/_HCO/_images/btn/btnBkgHover.gif) !important;
}
/* ---- special case ---- */
a.button:hover,
a.button:active,
a.button:focus {
	background-position: left top;
}
a.button:hover .r1,
a.button:active .r1,
a.button:focus .r1 {
	background-position: right top;
	padding: 7px 0 0 0;
}
a.button:hover .r2,
a.button:active .r2,
a.button:focus .r2 {
	background-position: left bottom;
}
a.button:hover .r3,
a.button:active .r3,
a.button:focus .r3 {
	background-position: right bottom;
	padding: 0 14px 7px 7px;
}

a.button{
	font-weight: 700;
	font-size: 1.2em;
}

/* button on light grey (#eef2f3) background */
a.onGrey,
a.onGrey .bg {
	background-image: url(/_hbi_ui/_HCO/_images/btn/btnGreyBkg.gif) !important;
}
a.onGrey:hover,
a.onGrey:active,
a.onGrey:focus,
a.onGrey:hover .bg,
a.onGrey:active .bg,
a.onGrey:focus .bg {
	background-image: url(/_hbi_ui/_HCO/_images/btn/btnGreyBkgHover.gif) !important;
}



a.button span.bg {
	color: #005CA8!important; /*otherwise .module .bg overides it below */
}

a.button input.roundedButton {
	border-width: 0 !important;
	margin: -3px !important;
	padding: 0 !important;
	background-color: transparent;
	color: #005CA8;
	font-weight: 700;
	cursor: pointer;
	font-size:1.0em;
}





.left {float: left;}
.right {float: right;}
.centered {	margin: 0 auto;	}
.none {	float: none;}
.clear {clear: both;}

.inline {display: inline;}

/* Margin Modifiers - used by community server? */

.noMargin {margin: 0!important;}

.marginLeft5 {margin-left: 5px!important;}
.marginLeft10 {margin-left: 10px!important;}
.marginLeft15 {margin-left: 15px!important;}
.marginLeft20 {margin-left: 20px!important;}

.marginRight5 {	margin-right: 5px!important;}
.marginRight10 {margin-right: 10px!important;}
.marginRight15 {margin-right: 15px!important;}
.marginRight20 {margin-right: 20px!important;}

.margin9H {	margin-right: 9px!important;margin-left: 9px!important;}

.marginTop5 {margin-top: 5px!important;}
.marginTop10 {margin-top: 10px!important;}
.marginTop15 {margin-top: 15px!important;}
.marginTop20 {margin-top: 20px!important;}
.marginTop25 {margin-top: 25px!important;}
.marginTop120 {margin-top: 120px!important;}

.marginBottom5{margin-bottom: 5px!important;}
.marginBottom10 {margin-bottom: 10px!important;}
.marginBottom15 {margin-bottom: 15px!important;}
.marginBottom20 {margin-bottom: 20px!important;}
.marginBottom25 {margin-bottom: 25px!important;}
.marginBottom30 {margin-bottom: 30px!important;}

	
/* Padding Modifiers - used by community server */

.noPadding {padding: 0!important;}


.paddingLeft5 {padding-left: 5px!important;}
.paddingLeft10 {padding-left: 10px!important;}
.paddingLeft15 {padding-left: 15px!important;}
.paddingLeft20 {padding-left: 20px!important;}

.paddingRight5 {padding-right: 5px!important;}
.paddingRight10 {padding-right: 10px!important;}
.paddingRight15 {padding-right: 15px!important;}
.paddingRight20 {padding-right: 20px!important;}

.padding9H {padding-left:9px; padding-right:9px;}
.padding18H {padding-left:18px; padding-right:18px;}

.paddingTop5 {padding-top: 5px!important;}
.paddingTop10 {padding-top: 10px!important;}
.paddingTop15 {padding-top: 15px!important;}
.paddingTop20 {	padding-top: 20px!important;}
.paddingTop25 {	padding-top: 25px!important;}
.paddingTop30 {	padding-top: 30px!important;}

.paddingBottom5 {padding-bottom: 5px!important;}
.paddingBottom10 {padding-bottom: 10px!important;}
.paddingBottom20 {padding-bottom: 20px!important;}
.paddingBottom25 {padding-bottom: 25px!important;}
.paddingBottom30 {padding-bottom: 30px!important;}
	
/* Text Modifiers */
	
.smallText {font-size: 1.1em;}
.greyText {color:#8e8e8e!important;}
.blackText {color:#000!important;}
.bold{	font-weight:700;}
.underline {text-decoration: underline!important;}

/* Display Modifiers */

.fullWidth {width: 100%;}	

.horizList ul li, ul.horizList li {
	float: left;
	display: inline;
	}
	
}/* closes @media screen { */