*{margin:0; padding:0;}

htm, html, body{height:100%;}

body{background: #111f3c url(img/bg_page.png) repeat-x 0 0; font-family: Arial, sans-serif; font-size: 12px;}

a{outline:none; text-decoration:none;}

a:hover{text-decoration:underline;}

a img{border:0;}

p{}

#wrapper-center{margin:0 auto; width: 951px;}


/*---------------------------- Header ----------------------------------------------------------*/

#header{float:left; width: 951px; background: url(img/bg_header.gif) repeat-x 0 0; height: 86px;}
#search {float: right; margin: 5px 10px;}
#search input.search-input {width: 175px; border: 1px solid #6c697b; padding: 3px 5px; margin: 0 5px 0 0; float: left; font-size: 11px;}
#search input.search-icon {margin-top: 2px; float: left;}
/*---------------------------- Headings ----------------------------------------------------------*/
h1 {font-size: 26px; color: #6f92f8; text-transform: uppercase; line-height: 25px; font-weight: normal; margin-bottom: 20px;}
h1.severe-duty-logo {margin: 10px 0 0 25px; float: left;}
h1.severe-duty-logo a{display:block; float:left; text-indent:-9999px; width:261px; height:76px; background: url(img/logo.gif) no-repeat;} /* Set up for image replacement */

h2{color: #393a73; font-size: 24px; margin-bottom: 10px;}

h3{color: #0f1130; font-size: 16px; margin-bottom: 10px;}

h4{text-transform: uppercase; font-size: 11px; margin-bottom: 5px; color: #6f92f8;}
#content-inner h4 a {color: #666771; text-decoration: none;}

/*---------------------------- Main Nav ----------------------------------------------------------*/

#main-nav {width: 628px; float: left; list-style:none; z-index:200; padding:0; margin:25px 0 0 0; background: #2d3365; height: 30px;}
#main-nav ul {list-style: none; padding: 0; margin: 0;}
#main-nav table {border-collapse:collapse;}
#main-nav li {float:left; padding:0px; margin: 0px;}
#main-nav li li {float:none;}
/* a hack for IE5.x and IE6 */
#main-nav li a li {float:left;}

#main-nav li a {display:block; float:left; color:#fff; font-weight:bold; font-size: 12px; padding:10px 11px; margin:0px; text-decoration:none; white-space:nowrap; line-height: 12px;}

#main-nav li li a {height:14px; line-height:14px; float:none; text-transform: none; color: #fff; font-weight: normal; padding: 5px 11px; border-bottom: 1px solid #8484a6;}

#main-nav li a.active{color:#fff; background:url(img/bg_nav_hover.gif) bottom repeat-x; margin: -2px 0 0 0;position: relative; } /* for active state*/

#main-nav li:hover {position:relative; z-index:300;}
#main-nav a:hover {position:relative; z-index:300; color:#b2b2d5; text-decoration:none;}

#main-nav :hover ul {left:0; top:30px;}
/* another hack for IE5.5 and IE6 */
#main-nav a:hover ul {left:-15px;}

#main-nav ul {position:absolute; left:-9999px; top:-9999px; background: #b2b2d5 url(img/bg_header.gif) repeat-x bottom; padding-bottom: 10px;}

/* it could have been this simple if all browsers understood */
/* show next level */
#main-nav li:hover li:hover > ul {left:-15px; margin-left:100%; top:-1px;}
/* keep further levels hidden */
#main-nav li:hover > ul ul {position:absolute; left:-9999px; top:-9999px; width:auto;}
/* show path followed */
#main-nav li:hover > a {color:#b2b2d5; text-decoration:none;}


#main-nav li li a:hover {color:#0f1130;}

/* but IE5.x and IE6 need this lot to style the flyouts*/
/* show next level */
#main-nav a:hover a:hover ul,
#main-nav a:hover a:hover a:hover ul,
#main-nav a:hover a:hover a:hover a:hover ul,
#main-nav a:hover a:hover a:hover a:hover a:hover ul
{left:100%; top:-1px;}

/* keep further levels hidden */
#main-nav a:hover ul ul,
#main-nav a:hover a:hover ul ul,
#main-nav a:hover a:hover a:hover ul ul,
#main-nav a:hover a:hover a:hover a:hover ul ul
{position:absolute; left:-9999px; top:-9999px;}


/*---------------------------- Content ----------------------------------------------------------*/

#wrapper{float:left; width: 951px; padding-bottom:  12px; background: url(img/bg_wrapper_bottom.gif) no-repeat bottom;}
#main-content-top {float:left; width: 951px; background: url(img/bg_wrapper_top.gif) no-repeat; height: 12px;}
#main-content{float:left; width: 951px; background: #0f1130;}

#content-inner-wrapper{float:left; width: 713px; background: #e5d9cc url(img/bg_content_bottom.gif) no-repeat bottom;}
#content-inner {float:left; width: 673px; background: url(img/bg_content_top.gif) no-repeat top; padding: 20px;}
#content-inner p{margin-bottom:10px;}

body.one-col #content-inner-wrapper {margin-left: 25px; width: 900px; background-image: url(img/bg_content_bottom_full.gif);}
body.one-col #content-inner {width: 860px; background: url(img/bg_content_top_full.gif) no-repeat top left; padding: 20px;}

#content-inner ul, #content-inner ol{margin:0 0 10px 0px;}

#content-inner a{color: #3e4e7c;}

#content-inner a:hover{text-decoration:underline;}


/*---------------------------- Sidebar ----------------------------------------------------------*/

#sidebar{float:left; color: #fff; margin: 25px; width: 165px;}

#sidebar ul{list-style: none;}
#sidebar ul li{ padding: 3px 5px; text-transform: uppercase; font-weight: bold;}
#sidebar a{color: #e5d9cc}
#sidebar ul li a:hover{color: #fff;}

body.home #sidebar p {line-height: 22px;}

/*---------------------------- Footer ----------------------------------------------------------*/

#footer{clear:left; float: left; color: #5e677f; width: 100%; margin-top: 20px;}
#footer a{ color: #5e677f;}
#footer a:hover{ color: #fff;}
#footer ul {list-style: none; float: left; width: 630px; margin-bottom: 15px;}
#footer ul li {float: left; margin-right: 7px; padding-right: 7px; border-right: 1px solid #5e677f; line-height: 12px;}
#footer ul li.last {border-right: 0px none;}
#footer p{ margin-bottom: 15px; margin-left: 10px;}
#footer p#project-listings {width: 255px; float: left; color: #fff; font-weight: bold; padding-right: 25px; margin-right: 25px; border-right: 1px solid #5e677f;}
#footer p#project-listings img {margin-right: 10px;}
#footer p#project-listings a {color: #6f92f8; text-transform: uppercase; font-size: 20px;}

/*---------------------------- Home ----------------------------------------------------------*/

#tabs {width: 385px; margin-right: 12px; float: left;}
/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .ui-tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .ui-tabs-nav {
        display: none;
    }
}

/* Skin */
#content-inner .ui-tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0;
}
.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.ui-tabs-nav li {
    float: left;
    margin: 0 2px 0 0;
    min-width: 84px; /* be nice to Opera */
    border: 1px solid #000;
    border-bottom: 0;
    width: 189px;
}
.ui-tabs-nav li#tab02 {margin-right: 0;width: 190px;}
.ui-tabs-nav a, .ui-tabs-nav a span {
    display: block;
    padding: 0 10px;
    background: #4a509c;
}
#content-inner .ui-tabs-nav a {
    margin: 0; /* position: relative makes opacity fail for disabled tab in IE */
    padding-left: 0;
    color: #a5a8ce;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 1;
    text-align: left;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */    
    outline: 0; /* prevent dotted border in Firefox */
}
#content-inner .ui-tabs-nav .ui-tabs-selected a {
    position: relative;
    top: 0;
    z-index: 2;
    margin-top: 0;
    color: #0f1130;
}
.ui-tabs-nav a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 18px; /* IE 6 treats height as min-height */
    min-height: 18px;
    padding-top: 6px;
    padding-right: 0;
}
*>.ui-tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
.ui-tabs-nav .ui-tabs-selected a span {
    padding-bottom: 0px;
}
#content-inner .ui-tabs-nav a:hover, 
#content-inner .ui-tabs-nav a:hover span{background-color: #8484a6; color: #fff;}
#content-inner .ui-tabs-nav .ui-tabs-selected a, 
#content-inner .ui-tabs-nav .ui-tabs-selected a:hover
#content-inner .ui-tabs-nav a:focus, 
#content-inner .ui-tabs-nav a:active {
    background-color: #cfd1e4;
    color: #0f1130;
}
.ui-tabs-nav a, .ui-tabs-nav .ui-tabs-disabled a:hover, .ui-tabs-nav .ui-tabs-disabled a:focus, .ui-tabs-nav .ui-tabs-disabled a:active {
}
#content-inner .ui-tabs-nav .ui-tabs-selected a span, 
#content-inner .ui-tabs-nav .ui-tabs-selected a:hover span
#content-inner .ui-tabs-nav a:focus span, 
#content-inner .ui-tabs-nav a:active span {
   background-color: #cfd1e4;
   color: #0f1130;
}
#content-inner .ui-tabs-nav a span, #content-inner .ui-tabs-nav .ui-tabs-disabled a:hover span, #content-inner .ui-tabs-nav .ui-tabs-disabled a:focus span, #content-inner .ui-tabs-nav .ui-tabs-disabled a:active span {
}
.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
#content-inner .ui-tabs-nav a:hover, #content-inner .ui-tabs-nav a:focus, #content-inner .ui-tabs-nav a:active,
#content-inner .ui-tabs-nav .ui-tabs-deselectable a:hover, #content-inner .ui-tabs-nav .ui-tabs-deselectable a:focus, #content-inner .ui-tabs-nav .ui-tabs-deselectable a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
#content-inner .ui-tabs-disabled {
    opacity: .4;
    filter: alpha(opacity=40);
}
#content-inner .ui-tabs-panel {
    border-color: #393f52;
    border-style: solid;
    border-width: 0 1px 1px 1px;
    padding: 5px 10px;
    background: #cfd1e4 url(bg_ft_box1.gif) repeat-x bottom; /* declare background color for container to avoid distorted fonts in IE while fading */
}
#content-inner .ui-tabs-panel a {color: #373b6a;}
#content-inner .ui-tabs-loading em {
    padding: 0 0 0 20px;
    background: url(loading.gif) no-repeat 0 50%;
}

/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear, @ IE 6 & IE 7 Quirks Mode */
    display: inline-block;
}
*:first-child+html .ui-tabs-nav  { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
    display: inline-block;
}

#content-inner .ft-box {border: 1px solid #0f1130;float: left; margin-bottom: 5px; width: 264px; padding: 5px; background: #1a1a53 url(img/bg_ft_box2.gif) repeat-x top;}
#content-inner .ft-box h2 {font-size: 12px;}
#content-inner .ft-box h2 a {color: #fff; display: block; font-weight: normal}
#content-inner .ft-box h2 a:hover {color: #6f92f8; text-decoration: none;}
#content-inner .ft-box h2 a span {text-transform: uppercase; font-size: 15px; font-weight: bold;}
#content-inner .ft-box .float-left {margin-right: 8px;}

/*---------------------------- Common Classes ----------------------------------------------------------*/

.last a{border-right:0 !important;}

.float-right{float:right;}
.float-left{float:left;}
.clear-right{clear:right;}
.clear-left{clear:left;}
.clear-both{clear:both;}

.hr {height: 1px; margin: 10px 0; border-bottom: 1px solid #999baa;}
.hr hr {display: none;}

#content-inner .more {text-align: right; display: block; text-transform: uppercase; font-size: 10px; text-decoration: none; }


/* HPC styles */
.PageTitle {font-size: 21px; line-height: 22px; margin-bottom:0.25em; color: #9f791f; font-weight: bold; text-transform: uppercase;}

.ItemRow
{   
    height:22px;
}

.ItemAltRow
{     
    height:22px;
}

.ItemGrid TD {
	BORDER-BOTTOM: none;
	border-top:  #ffffff 1px solid;
	border-left: none;
	border-right: none;	
}

.ItemGrid TH {
	BORDER-BOTTOM:  none;
	border-top:  none;
	border-left: none;
	border-right: none;	
	white-space: nowrap;
}

.ItemHeaderTR 
{
    
	FONT-WEIGHT: bold; 
	FONT-SIZE: 11px; 
	COLOR: #000000; 		
	TEXT-DECORATION: none;  
	height: 0px;
}

.GridRow
{   
    height:22px;
}

.GridAltRow
{     
    height:22px;
    background-color: #f6f6f6; 
}

.dataGrid TD {
	BORDER-BOTTOM: #d9d9d9 1px solid;
	border-top: #d9d9d9 1px solid;
	border-left: #d9d9d9 1px solid;
	border-right: #d9d9d9 1px solid;
	
}

.dataGrid TH {
	BORDER-BOTTOM: #d9d9d9 1px solid;
	border-top: #d9d9d9 1px solid;
	border-left: #d9d9d9 1px solid;
	border-right: #d9d9d9 1px solid;
	white-space: nowrap;
}

.GridHeaderTR 
{
    
	FONT-WEIGHT: bold; 
	FONT-SIZE: 11px; 
	COLOR: #000000; 		
	TEXT-DECORATION: none;  
	height: 22px;
	BACKGROUND: url(img/lightCellHeader.gif);
}

.GridHeaderTR a {
	FONT-WEIGHT: bold; 
	FONT-SIZE: 11px; 
	COLOR: #000000; 
	FONT-FAMILY: arial, san-serif;
	cursor: hand;
}

.GridHeaderTR a:link {
	FONT-WEIGHT: bold; 
	FONT-SIZE: 11px; 
	COLOR: #000000; 
	FONT-FAMILY: arial, san-serif;
	cursor: hand;
}

.GridHeaderTR a:visited {
	FONT-WEIGHT: bold; 
	FONT-SIZE: 11px; 
	COLOR: #000000; 
	FONT-FAMILY: arial, san-serif;
	cursor: hand;
}

.GridHeaderTR a:hover {
	FONT-WEIGHT: bold; 
	FONT-SIZE: 11px; 
	COLOR: #000000; 
	FONT-FAMILY: arial, san-serif;
	cursor: hand;
}

#content table.tb_grid {
  
  width: 100%;
}
