@import url("/stylesheets/forms.css");
/*****************************************************************************/
/*****                         STYLE APPLIED TO THE BODY                ******/
/*****************************************************************************/
body {
 margin: 0; 
 padding: 0px; 
 text-align: center; 
 background: #999 url(/images/backgrounds/body_bg.gif) repeat-x 0 0;
 color: #000;
 }
 
 .clear-left {clear: left;}
 
/*****************************************************************************/
/*****                          LAYOUT                                 ******/
/*****************************************************************************/
/****** outer layout (borders) ***** */
#frame {
 margin: 0px auto; 
 text-align: left;
 color: #000;
 font: 76% arial,verdana,geneva,lucida,sans-serif; 
 background: transparent;
 }
 
#frame {width:960px;  voice-family: "\"}\""; voice-family:inherit; width: 960px;}
html>body #frame{width: 960px;}

#main_wrapper {
 padding: 4px;
 background: #fff;
 text-align: left;
 border: 1px solid #000;
 border-top: none;
}

/* Filter IE 5 */
#main_wrapper {float: left;  voice-family: "\"}\""; voice-family:inherit; float: none;}

/* layout  columns*/
#home_cols {
 margin: 2px 0 0 0;
 /*width: 100%;*/  /* remove for IE6 */
 float: left; /* NS */
 line-height: 150%;
 clear: both;
 padding: 0;
 background: url(/images/backgrounds/home-col-bg.gif) repeat-y left;
 }
 
html>body #home_cols {width: 100%;} /* Hack IE 6 and below  ( don't remove this; otherwise Safari on Mac does not render right )*/

#sub_cols, #sub_3cols {
 margin: 0;
 /*width: 100%;*/  /* remove for IE6 */
 line-height: 150%;
 padding: 0;
 background: url(/images/backgrounds/col-bg.gif) repeat-y left;
 overflow: hidden;
}

html>body #sub_cols {width: 100%;} /* Hack IE 6 and below  ( don't remove this; otherwise Safari on Mac does not render right )*/
html>body #sub_3cols {width: 100%;} /* Hack IE 6 and below  ( don't remove this; otherwise Safari on Mac does not render right )*/

#home_cols #primary_content_wrapper,  #sub_cols #primary_content_wrapper, #sub_3cols #primary_content_wrapper {
 float: left;
 margin: 0px;
 padding: 0px;
}
 
#home_cols #primary_content_wrapper {width:695px;  voice-family: "\"}\""; voice-family:inherit; width: 695px;}
html>body #home_cols #primary_content_wrapper{width: 695px;}

#sub_cols #primary_content_wrapper {width:764px;  voice-family: "\"}\""; voice-family:inherit; width: 764px;}
html>body #sub_cols #primary_content_wrapper{width: 764px;}

#sub_3cols #primary_content_wrapper {width:764px;  voice-family: "\"}\""; voice-family:inherit; width: 764px;}
html>body #sub_3cols #primary_content_wrapper{width: 764px;}

#home_cols #sidebar_content_wrapper_a, #sub_cols #sidebar_content_wrapper_a, #sub_3cols #sidebar_content_wrapper_a, #sub_3cols #sidebar_content_wrapper_b {
 float: left;
 width: 255px;
 w\idth: 257px
 line-height: 120%;
 background: #e1e6ee;
}

#sub_cols #sidebar_content_wrapper_a, #sub_3cols #sidebar_content_wrapper_a, #sub_3cols #sidebar_content_wrapper_b  {
width:186px;
background: #b5c2d7;
}

#sub_3cols #sidebar_content_wrapper_b {
 float: right;
 display: inline;
 width: 200px;
 background: #fff;
 margin-top: 1px;
 margin-left: 40px;
 margin-bottom: 20px;
}

#sub_3cols #sidebar_content_wrapper_b .default {
 border:4px solid #ebebeb;
 margin-bottom: 10px;
}

/* home/sub content layout */
#home_cols #primary_content_wrapper .content, #sub_cols #primary_content_wrapper .content, #sub_3cols #primary_content_wrapper .content{
 margin: 5px 15px 0px 25px;
 padding-bottom: 15px;
}

#sub_cols #primary_content_wrapper .content, #sub_3cols #primary_content_wrapper .content {
 margin-top: 20px;
 overflow: hidden;
 width: 724px;
 }
#home_cols #sidebar_content_wrapper_a .content{
 margin: 15px;
}

#sub_3cols #sidebar_content_wrapper_b .content {
 margin: 5px 12px 10px;
 width: auto;
}

#sub_3cols #sidebar_content_wrapper_b .subtitle {
	padding:1em 9px; 
	font-weight:bold;
	border-bottom: 1px solid #fff; 
	font-size: 14px;
   color: #00345e;
	margin: 0;
   background: #ebebeb;
}

#sub_3cols #sidebar_content_wrapper_b .subtitle img {
   margin-left: 11px;
   vertical-align: middle;
}


/*****************************************************************************/
/*****                          HEADER                                  ******/
/*****************************************************************************/

#header {
 width: 100%;
 /*float: left; */  /* NS */
 margin: 0;
 background: #000;
 font-size: 10px;
}

#logo {
 float: left; 
 width: 210px;
 padding: 0 0 0 5px;
}

#utilities {
 background: #000;
 color: #cae4fe;
 margin: 30px 10px 10px 0;
 text-align: right;
 float: right;
 /* width:  for IEs */
}

#utilities ul {
  background: #000;
  padding: 0px;
  margin: 0px;
  text-align: right;
  padding-right: 5px;
}

#utilities ul li { 
  display: inline;
  background: url(/images/navs/utilities_divider.gif) no-repeat 100% 50%;
  margin:  0;
  text-transform: uppercase;
}

#utilities ul li a {
  color: #cae4fe;
  text-decoration: none; 
  padding: 7px 15px 7px 10px; 
  /*padding: 10px 5px 5px 5px;*/
}

#utilities ul li.last {
 background: none;
}

#utilities ul li a:hover {
 color: #fff;
}

#utilities ul li.current a {
 color: #fff;
 font-weight: bold;
}

#search_box {
 float: right;
 text-align: right!important;
 margin: 24px 6px 0px 0;
 padding: 0 0 0 2px;
 background: #000;
 color: #cae4fe;
 }
 
#search_box form {display: inline;}

#search_box .text {
 margin: 0px 0px 0px 10px;
 padding: 1px 1px 1px 5px;
 width: 150px;
 font-size: 10px;
}

.go{
 width: 23px;
 height: 19px;
 background: #99CCFF;
 border: 1px solid #CCC;
 color: #000;
 margin-left: 5px;
 margin-right: 5px;
 text-align: center;
 font-size: 11px;
 font-weight: bold;
 }

#branding, #title {
 margin: 1px 0 0 0;
 width: 100%;
 border-top: 4px solid #ccc;
 background: #fff;
 padding: 2px 0 0 0;
 float: left;
}

#title {
padding: 2px 0;
border-bottom: 4px solid #ccc;
}

#branding .left_img, #title .left_img {border-right: 1px solid #fff; float: left;}
#branding .tagline {border-bottom: 1px solid #ccc; float: right;margin: 0;}
#branding .right_img {float: right; margin: 0;}

#title h1 {
float: right;
margin: 0;
background: url(/images/backgrounds/header_bg-wide.jpg) #062666; 
display: block; width: 738px; height: 37px; color: #fff; 
font: bold 18px arial,verdana,geneva,lucida,sans-serif; 
padding: 18px 0 0 25px; 
border-bottom: 1px solid #fff;
}

#breadcrumbs {
float: right;
background: #D2D5D9; color: #000; 
padding: 3px 5px 2px 25px;
display: block;
width: 733px;
margin: 0;
font: 10px arial,verdana,geneva,lucida,sans-serif;
}

#breadcrumbs a {color: #0066CC; 
text-decoration: none; 
}

#breadcrumbs a:hover {
text-decoration: underline;
}
/*****************************************************************************/
/*****                   GLOBAL NAVIGATION *                            ******/
/*****************************************************************************/

#main_nav {
 font-size: 11px;
 margin: 0px;
 padding: 0;
 background: #ebebeb; 
 width: 100%; 
 border-top: 2px solid #fff;
 float: left;
 text-transform: uppercase;
}

#main_nav ul {
 margin: 0;
 padding: 0px;
 list-style:none;
}

#main_nav ul a {
  display: block; 
  color: #015fbd;
  margin: 0;
  background: #ebebeb; 
}

/* don't remove the following, it's filter for IE on mac; otherwise the global nav won't diaply well */
/*\*//*/
#main_nav ul a {
 float: left;
}
/**/

/* don't remove the above code */

#main_nav ul li {
  /*display: inline;*/
  color: #015fbd;
  float: left; /* otherwise there are gaps between each nav item */
  padding: 0px;
  margin: 0 auto;
  padding-right: 1px; /* so that the divider can be displayed */
  background: url(/images/navs/global_navs_divider.gif) no-repeat 100% 50%;
 }

#main_nav ul li a {
 /*display: inline;  remove this otherwide the dropdown menus will be shifted to the right of the nav on IE*/
  margin: 0px auto;
  color: #015fbd;
  text-decoration: none;
  padding: 3px 26px;
  font-weight: bold;
  text-align: center;
 }

#main_nav ul a:hover, #main_nav ul li.current a, #main_nav ul li.current a:hover {
 background: #024f9c;
 color: #fff;
}

/*************** Dropdown Menu *************/
/******************************************/
#main_nav ul li ul{ 
  font-size: 10px;
  display: block;
  position: absolute;
  left: -999em;
  width: 210px;
  border: 1px solid #fff;
  border-top: none!important;
  z-index: 100;
  overflow: hidden;
  margin: 0px 0px 0px 0px;
  padding: 0;
  float: none;
  filter:alpha(opacity=100);
  opacity: 1;
  -moz-opacity:1;
}

#main_nav ul li ul li {
  float: none;
  display: block;
  padding: 0;
  margin: 0!important;
}

#main_nav ul li:hover ul, #main_nav li.sfhover ul { /* lists nested under hovered list items */
  left: auto;
  padding: 0px;
  padding-right: 15px!important;
}

#main_nav ul li ul a {
 background-image: none;
}

#main_nav ul li ul li {
  background: none;
  padding: 0;
  margin: 0;
  /*width: 100%;remove it so that it won't have a gap between each list item on IE 7 */
  display: inline; /* add this so that it won't have a gap between each list item on IE 6 */
}

#main_nav ul li ul li a, #main_nav ul li.current ul li a {
    /*width: 220px!important;*/
	font-size: 10px;
	width: 220px;
    font-weight: normal;
  	padding: 4px 5px 4px 10px;
	border-top: 1px solid #fff;
	border-bottom: none;
	color: #fff;
	margin-bottom: 0!important;
	display: block;
	background-image: none;  /* so that the background image won't display on Safari */
	background: #024f9c;
	text-align: left;
}

#main_nav ul li ul a:hover {
 color: #fff;
 background: #012243;
 /*background-image: none!important; */ /* so that the background image won't display on Safari */
}

#main_nav ul li.current ul li a {
 background: #024f9c;
 /*background-image: none!important;*/
 color: #fff;
 }

#main_nav ul li.current ul li a:hover {
 background: #012243;
 color: #fff;
}


/*****************************************************************************/
/*****                   SUB/LOCAL NAVIGATION *                         ******/
/*****************************************************************************/

#sub_nav {
 margin: 0;
 background: #b5c2d7;
}

#sub_nav h2.title {
 margin: 0;
 background: #dce9f6 url(/images/backgrounds/blue_gradient_title_bg.gif) repeat-x 0 0px;
 padding: 10px 5px 10px 10px;
 border: 1px solid #adadad;
 border-right: none;
 font: 16px helvetica verdana,arial, sans-serif;
 line-height: 100%;
 font-weight: bold;
 color: #003366;
 display: block;
}

#sub_nav ul {
 list-style: none;
 margin: 0px;
 padding: 0px;
 background: #b5c2d7;
 border-top: 1px solid #fff;
}

#sub_nav ul li {
  display: inline; /* so that IE 6 display properly on each list item */
  line-height: 120%;
}

#sub_nav ul li a {
  display: block;
  background: #b5c2d7 url(/images/navs/arrow_white.gif) no-repeat 5px 7px;
  padding: 4px 3px 4px 17px;
  border-bottom: 1px solid #fff;
  color: #000;
  font: bold 10px verdana,arial,geneva,lucida,sans-serif; 
  margin: 0px;
  text-decoration: none;
}

#sub_nav ul li ul {
  margin: 0 0 0 10px;
  padding: 0;
}

#sub_nav ul li a:hover, #sub_nav ul li.current a {
 background: #90a4bf url(/images/navs/arrow_orange.gif) no-repeat 5px 7px;
 color: #fff;
}

#sub_nav ul li.current a {
 font-weight: bold;
 border-bottom: none;
}

#sub_nav ul li.current ul {
 margin: 0;
}

#sub_nav ul li.current ul li a {
  font-size: .90em;
  border: none;
  padding: 4px 0 4px 17px; 
  margin: 0px;
  display: block;
  color: #000;
  background: #e1e6ee;
  border-bottom: 1px solid #fff;
}

#sub_nav ul li.current ul li a:hover, #sub_nav ul li.current ul li.current a{
 color: #cc3300;
 border: none; /* IE 6 */
 border-bottom: 1px solid #fff;
 background: #e1e6ee;
}

#sub_nav ul li.current ul li.current a {
 border-bottom: none;
}

#sub_nav ul li.current ul li.current ul {
 margin: 0;
 padding: 0px;
}

#sub_nav ul li.current ul li.current ul li a {
 color: #000;
 background: #e1e6ee;
 border-bottom: 1px solid #fff;
 font-weight: normal;
 padding-left: 25px;
}

#sub_nav ul li.current ul li.current ul li:hover a, #sub_nav ul li.current ul li.current ul li.current a {
color: #cc3300;
font-weight: bold;
}

#sub_nav ul li.current ul li.current ul li.current a {
border-bottom: none;
}

/*****************************************************************************/
/*****                          FOOTER                                  *****/
/*****************************************************************************/
#footer {
 float: left;
 margin: 1px 0 0 0;
 padding: 20px 0 0 0;
 line-height: 100%;
 width: 100%;
 color: #666;
 border-top: 4px solid #ccc;
}

#footer #copyright {
 color: #999;
 text-align: left;
 float: left;
 padding: 0 10px 10px 10px;
 line-height: 110%;
 width: 238px;
}

#copyright .phone_number {
 padding-left: 10px;
 font-weight: bold;
}

#footer ul {
 margin: 0 0 0 10px;
 float: left;
 text-align: center;
 padding: 0;
 width: 488px;
}

#footer ul li {
 display: inline;
 margin: 0px;
}
#footer ul li a {
  color: #999;
  margin: 0;
  background: url(/images/navs/footer_navs_divider.gif) no-repeat 100% 50%;
  padding: 0 18px 0 12px;
  text-decoration: none;
  font-weight: normal;
}

#footer ul li a:hover {
 color: #000;
}

#footer ul li.last a {
 background: none;
}

#footer ul li.current a {
 font-weight: bold;
 color: #000;
}

/*****************************************************************************/
/*****                          CONTENT                                  *****/
/*****************************************************************************/
/*misc */
.clear {clear: both; font-size: .01em; height: 1px;}
.clear_fix {clear: both;}
.bld {font-weight: bold;}
.dash_line {
 height: 1px;
 margin: 10px 0;
 border-bottom: 1px dotted #231f20;
}

/*title */
#primary_content_wrapper .content h1 {font-weight: bold; font-size: 1.3em; margin: 0px;}
h2 {font-size: 1.2em;}
h3 {font-size: 1.1em;}
h4 {font-size: 1em;}

/* bulleted list */
.news_sidebar h2 {background: #16599B; 
 border-bottom: 1px solid #fff; 
 color: #fff; 
 padding: 6px 15px; 
 font-weight: bold; 
 font-size: 12px;
 margin: 0;
 }

ul.news{
 list-style: none;
 margin: 10px 5px 5px 10px !important;
 padding: 0px; 
}

ul.news li{
 list-style: none;
 padding: 0 0 10px 15px;
 background: url(/images/misc/four_dots.gif) no-repeat 0 4px; 
}

#news a {color: #0066CC; font-weight: bold; text-decoration: none;}
#news a:hover {color: #FF6633;}


#home_cols #primary_content_wrapper ul {
margin: 10px 0 10px 15px;
padding: 0 0 0 10px;
}

#home_cols #primary_content_wrapper ul li {
line-height: 100%;
padding: 0 0 5px 0px;
margin-left: 0px;
}

ul.blue_arrow {
 margin: 10px 5px 10px 0px;
 padding: 0;
 list-style: none;
}

ul.blue_arrow li {
 list-style: none;
 background: url(/images/misc/blue_arrow.gif) no-repeat 0 1px;
 padding-left: 20px;
 margin-left: 10px;
 text-decoration: none;
 line-height: 115%;
 margin-bottom: 10px;
 font-size: .95em;
}

ul.blue_arrows {
 margin: 10px 0px 10px 5px;
 padding: 0;
 list-style: none;
}

ul.blue_arrows li {
 list-style: none;
 background: url(/images/misc/blue_arrows.gif) no-repeat 5px 4px;
 padding-left: 20px;
 margin-left: 0px;
 text-decoration: none;
 line-height: 115%;
 margin-bottom: 10px;
 font-size: .95em;
}

#sub_3cols #sidebar_content_wrapper_b ul{
	list-style: none; 
	margin: 14px 0 10px;
	padding-left: 0px;
}

#sub_3cols #sidebar_content_wrapper_b ul li{
   padding-left: 19px;
   margin-bottom: 20px;
   background: url(/images/misc/doc-icon.gif) no-repeat left 3px;;
}

/* MISC from the OLD SITE  ******* */
.border_right {border-right: 1px solid #ccc;}
.border_bottom {border-bottom: 1px solid #ccc;}

.list_left {margin-right: 5px; padding: 0 0 0 15px; width: 210px; float: left;}
.blue_bld {color: #0066CC; font-weight: bold; }
#learn_more {padding: 20px 0px; text-align: center;}
.gray_bar1 {border-top: 2px solid #fff; border-bottom: 2px solid #fff;}
.gray_bar2 {border-top: 2px solid #fff;}
.orange_txt {color: #CC3300;}
.blue_txt {color: #02376F;}
.workshop_table {background: #DCDFE5; border: 1px solid #A6ABB4;}
.workshop {font-weight: bold; border-bottom: 1px solid #A6ABB4; padding: 3px 3px 3px 5px;}
.workshop_details {padding: 3px 3px 3px 5px; font-weight: bold;}
hr {border: none; margin: 10px; background-color: #ccc; color: #ccc; height: 1px;}
.indent {margin-left: 20px;}

.anchor_title {
 padding: 2px 5px;
 border: 1px solid #ccc;
 background: #DFE3E8;
 margin: 10px 0;
 font-weight: bold;
}

.anchor_title a {
 color: #000;
}

.anchor_title a:hover {
 text-decoration: none;
}

.workshop_schedule_bg {
 background: #0066CC;
 display: block;
 padding: 5px; 
 font-weight: bold;
 text-align: center;
 border-bottom: 1px solid #fff;
 color: #fff;
}

.workshop_calendar_tb, .workshop_calendar_tb td, products_specifications_tb, .products_specifications_tb td {
 background: #D7DDE4;
 border-bottom: 1px solid #fff;
}
.workshop_type_title td, .products_specifications_title td {
background: #89B2DB!important;
font-weight: bold;
color: #fff;
}
.products_specifications_tb td, .products_specifications_title td{padding-left: 10px;}

/* forms */
form {display: inline; font-family: arial,verdana,geneva,lucida,sans-serif;}
select, option, input, textarea {font: 12px arial,verdana,geneva,lucida,sans-serif;}
fieldset {border: 3px double #8CAAC8; padding: 5px; margin-bottom: 15px;}
legend {font-size: 11px; color:#fff; background: #0066CC; padding: 4px; font-weight: bold; letter-spacing: 1px; margin-bottom: 10px;}
.left_field {text-align: right; margin-right: 5px; width: 140px;}
.left_field_dropdown select {width: 160px; margin-right: 3px;}
.asterisk {color: #FF6633; font-weight: bold;}
.warning, .message {color: #D23805; font-weight: bold; font-size: 1.1em;}
.submit_btn, .register_btn {background: #03396E; border: 1px solid #CCC; color: #fff; font-weight: bold; padding: 2px 4px; font-size: 0.95em; }
.register_btn {display:inline;}
.validation {color: #ab2624; font-style: oblique;}
.ans{padding: 1px 2px 1px 10px; font-weight: bold; background: #0066CC; display: block; color: #fff; border-bottom: 1px solid #fff;}
ul.dot2 li .faq_on {font-weight: bold;} 

/* form on products downloads page */
.download label{
float: left;
width: 120px;
font-weight: bold;
font-size: 11px;
text-align: right;
padding-right: 5px;
}

.download input{
margin-bottom: 5px;
border: 1px solid #A5ACB2;
}

.download .boxes{
width: 1em;
border: none;
}

.download .submit_btn{
margin-left: 123px;
margin-top: 5px;
font-weight: bold;
width: 80px;
background: #03396E; 
border: 1px solid #CCC; 
color: #fff; 
font-weight: bold; 
padding: 2px 4px; 
font-size: 0.95em;
}
.right_box {float: right;width: 30%; margin: 5px 0 3px 5px;}
.datasheets {border:1px solid #B5C2D7; margin-bottom: 5px; float: right; margin: 5px 0px 3px 5px;}
.datasheets .title {padding:2px; background:#B5C2D7; font-weight:bold; }
.datasheets .content {padding:4px;}

/* NEWS ON HOME PAGE*/
.news_header {background: #16599B; border-bottom: 1px solid #fff; color: #fff; padding: 6px 15px; font-weight: bold; font-size: 12px;}
.news_col {background: #E1E6EE; border-bottom: 1px solid #fff; }
#news {background: #E1E6EE; padding: 15px;} /*color: #0066CC;*/
ul.news{
 list-style-image: url(../images/four_dots.gif); 
 margin-left: 16px;
 padding-left: 0px; 
 margin-top:0px;
}
ul.news li{
 padding-bottom: 10px;
}

#news a {color: #0066CC; font-weight: bold; text-decoration: none;}
#news a:hover {color: #FF6633;}

/* UNORDER LIST*/
/*list on home */
ul.dot1{
 list-style-image: url(../images/dot.gif); 
 margin-left: 16px;
 padding-left: 0px; 
 margin-top:0px;
}

ul.dot li{
 padding-bottom: 10px;
}
/*list for sub pages */
ul.dot2, ul.dot3, ul.dot4 {
 list-style-image: url(/images/dot.gif); 
 margin-left: 20px;
 padding-left: 10px; 
}
ul.dot2 li {
 padding-bottom: 10px;
 line-height: 1.1em;
}

ul.dot2 li ul {
 margin-top: 6px;
}

ul.dot2 li ul li{
 list-style-image: none; 
 padding-bottom: 3px;
}

ul.dot3 li {
 padding-bottom: 6px;
 line-height: .8em;
}
ul.dot4 li {
 padding-bottom: 10px;
}





/* default links */
a {
 color: #0066cc;
 text-decoration: none;
 }

a:hover {
 color: #0066cc;
 text-decoration: underline;
}

/* tabbed content */
.tabs .nav li {float: left; display: inline; margin-left: 1em; border: 1px solid #000; border-bottom: 0; background: #b5c2d7;}
.tabs .nav li a {display: block; float: left; padding: 0.5em 1em 0.5em; text-decoration: none; color: #777; outline: 0;}
.tabs .nav li a:hover, .tabs .nav li a:focus {color: #000; background: #dfe3e8;}
.tabs .nav li.active {position: relative; top: 1px;}
.tabs .nav li.active a {color: #000; background: #fff;}
.tabs .tabbed-content {clear: both; padding: 20px; border: 1px solid #000; background: #fff;}


/*the following format is for IE5.x */
div,table{font-size: 99%; voice-family: "\"}\""; voice-family:inherit; font-size: 100%;}
html>body div,table {font-size: 100%;}
 
/* Print */
.header_print { display: none;}
