/*
                                DEFAULT.CSS

=============================================================================
  OVERVIEW:
=============================================================================
  This stylesheet defines all styles for the default ecredco web site.  It
  overrides and extends the Yahoo! User Interface (YUI) core stylesheets:
   - reset.css: resets all css styles for cross-browser compatibility
   - fonts.css: sets default font sizes
   - grids.css: defines common column layouts
  Please see http://developer.yahoo.com/yui for complete documentation.
  The following YUI css file combines and minifies the three stylesheets
  mentioned above, and is referenced in the ecredco.Master page:
   - ~/App_Themes/reset-fonts-grids.css
  The reset-fonts-grids.css file should never be edited.  Any of its settings
  can be overwritten in this file.

=============================================================================
  ORGANIZATION:
=============================================================================
  This file is organized into logical sections, each with a name in capital
  letters beginning with an underscore (e.g. _EXAMPLE).  To quickly locate a
  section, search for the section name with the initial underscore to avoid
  finding tags/classes/selectors with the same name.

  The sections (with initial underscore removed) are:
   - OVERRIDES
   - GLOBAL_TAGS
   - TEXT
   - LINKS
   - HELPERS
   - SPRITES
   - HEADER
   - PRIMARY NAVIGATION
   - BODY
   - FOOTER
   - CONTAINERS
   - MODAL_POPUP_DIALOGS
   - GRIDS_TABLES
   - FORMS
   - LISTS
   - <PAGE_OR_FEATURE_NAME>
   - ELEMENT_IDS

  To jump quickly from section to section, search for _SECTION.

=============================================================================
  FONTS:
=============================================================================
  Per Yahoo! recommendations, specify all font sizes in percentages, which
  render more consistently across browsers, and scale properly when users
  resize text.  Use the chart below to determine the correct percentage to
  use, and only use values from the chart if possible.  Do not use
  pixels (px), points (pt), ems (em), or any other unit.  Ems can be used
  for margins and line heights.

  Pixel  =  Percentage
  --------------------
  10px   =  77%
  11px   =  85%
  12px   =  93%
  13px   =  100%
  14px   =  108%
  15px   =  116%
  16px   =  123.1%
  17px   =  131%
  18px   =  138.5%
  19px   =  146.5%
  20px   =  153.9%
  21px   =  161.6%
  22px   =  167%
  23px   =  174%
  24px   =  182%
  25px   =  189%
  26px   =  197%

=============================================================================
  NAMING:
=============================================================================
  CSS selector/class names are intentionally kept short to minimize file
  size.  To keep the system as generic as possible, commonly used classes and
  their variations are given sequential numeric identifiers.  For example,
  .grid1 and .grid2 define different layouts for a GridView control, but they
  are named generically because they may look completely different in another
  Theme.  A cheat sheet with screenshots of all common layouts is available
  at: TODO: Create cheat sheet and reference here

=============================================================================
  SKINS:
=============================================================================
  Many of the styles in this file are referenced and organized by Skins.  The
  default skin file is: ~/App_Themes/Default/Default.skin.  Where applicable,
  the style defined in this file (default.css) references its parent SkinID
  in Default.skin.

=============================================================================
  PERFORMANCE:
=============================================================================
  The YUI CSS file is minified for performance reasons.  All other
  styles are defined in this css file, so clients do not have to download
  multiple stylesheets.  An additional stylesheet, ie.css, is loaded
  conditionally for IE browsers (see ie.css for more information).
*/

/*===========================================================================*\
    _SECTION_OVERRIDES: Overrides styles defined in YUI reset-fonts-grids.css
\*===========================================================================*/

body
{
	background-image: #fff url(../img/global/page-bg.gif) repeat-x;
	/* DO NOT override the default font here, it will affect the width of the
	   main content area in IE (but not Firefox).  If you need to override
	   the default font, set it in the #doc4 style below. */
}

/*===========================================================================*\
    _SECTION_GLOBAL_TAGS: Defines global styles after YUI reset applied
\*===========================================================================*/

h1{font-size:138.5%;  margin-top:20px; margin-bottom:12px;}
h2{font-size:123.1%; margin:1em 0px;}
h3{font-size:108%; margin:1em 0px;}
h4{font-size:93%;} /* used for all sub headers */
h5{font-size:85%;}
h1,h2,h3,h4,h5,h6{font-weight:bold}
p{margin-bottom:1em; font-size: 93%; line-height:18px; color: #666;}
a:active,a:link,a:visited{text-decoration:underline; color: #685745;}
a:hover{text-decoration:underline; color: #E23D28;}
strong{font-weight:bold; color: #666;}
em{font-style:italic}
/*
ul,ol,dl{margin:1em 0 1em 2em}
ol li,ul li{list-style-position:outside}
ol li{list-style-type:decimal}
ul li{list-style-type:disc; color: #666;}
*/
dl dd{margin-left:1em}
th,caption{text-align:center}
th{font-weight:bold}
caption{margin-bottom:0.5em}
textarea{font:normal 100% arial}
blockquote{margin:0px 18px;}
hr { color:#E5E5E5; }

/*===========================================================================*\
    _SECTION_HELPERS: Shortcuts to commonly used styles
\*===========================================================================*/

.float-left {float:left;}
.float-right {float:right;}
.float-none {float:none;}
.clear-left {clear:left;}
.clear-right {clear:right;}
.clear-both {clear:both;}
.display-none {display:none;}
.display-block {display:block;}
.align-left {text-align:left;}
.align-center {text-align:center;}
.align-right {text-align:right;}
.valign-top {vertical-align:top;}
.valign-middle {vertical-align:middle;}
.valign-bottom {vertical-align:bottom;}
.border-none {border: solid 0px #fff;}

/*===========================================================================*\
    _SECTION_HEADER: Defines the structure and appearance of the header
\*===========================================================================*/
/* Header Structure */
#hd
{
	margin: 0; /* To match settings defined in #bd */
	width: 974px;
}

#hd-top
{
	height: 25px;
	width: 974px;
}

#hd-global-nav
{
	float: right;
	margin: 7px 0 0 0;
	text-align: right;
	width: 200px;
}

#hd-main
{
	height: 94px;
	width: 974px;
}

#hd-main-logo
{
	float: left;
	margin: 0 0 0 0;
	height: 94px;
	width: 143px;
}

#hd-search
{
	float: right;
	margin: 24px 0 0 0;
	text-align: right;
	width: 300px;
}

#hd-bottom
{
	height: 26px;
	width: 974px;
	background-image: url(../img/nav/bg-main.gif);
	background-repeat: no-repeat;
}

/* Header Apperance */

#hd-global-nav a
{
  color: #685745;
  font-size: 77%;
  text-decoration: none;
}

#hd-global-nav a:hover
{
    text-decoration: underline;
}

#hd-global-nav i 
{
    color: #E8E1D5;
    font-size: 77%;
}

#hd-search p
{
  color: #E23D28;
  font-size: 85%;
  font-weight: bold;
  padding: 10px 0 0 0;
}

/*===========================================================================*\
    _SECTION_MAIN_NAV: Defines the appearance of the navigation
\*===========================================================================*/
/* Main nav structure */

#main-nav {
/* border: solid 1px green; */
	font-family: arial, sans-serif;
	position: relative;
	width: 665px;
	height: 26px;
	font-size:13px;
	font-weight: bold;
	color:#fff;
	margin: 0 auto;
}

#main-nav ul {
	list-style-type: none;
}

#main-nav ul li {
	float: left;
	position: relative;
}

#main-nav ul li a {
	text-align: center;
	padding: 5px 34px 0 0;
	display:block;
	text-decoration:none;
	color:#fff;
}

#main-nav ul li ul {
	display: none
}

#main-nav ul li li {
	float:none;
}

#main-nav ul li:hover ul, #main-nav ul li.sfhover ul {
	display: block;
	position: absolute;
}

#main-nav ul li:hover ul li a, #main-nav ul li.sfhover ul li a {
	display:block;
	background:#eee;
	color:#685745;
	width: 150px;
	text-align: left;
	padding: 5px 0 5px 10px;
	border-bottom: 1px solid #999;
	border-right: none;
	font-size:12px;
	font-weight: bold;
}

#main-nav ul li:hover ul li a:hover, main-nav ul li.sfhover ul li a.sfhover {
	background:#eee;
	color:#E23D28;
}

/*===========================================================================*\
    _SECTION_BODY_HOME: Defines the appearance of the body content on homepage
\*===========================================================================*/
/* Body Structure */
#bd
{
	width: 974px;
}

#bd-home-main 
{
	margin: 3px 0 0 0;
}

#bd-homebottom {
	width: 974px;
	margin: 20px 0 0 0;	
}

#bd-homebottom-left
{
	float: left;
	margin: 0 0 0 20px;
	_margin: 0 0 0 10px;
	width: 300px;
}

#bd-homebottom-center
{
	float: left;
	margin: 0 0 0 20px;
	width: 300px;
}

#bd-homebottom-right
{
	float: left;
	margin: 0 0 0 20px;
	width: 300px;
}

.bd-homebottom-title
{
	float: left;
	padding: 0 0 12px 0;
	width: 285px;
}

.bd-homebottom-products
{
	overflow: hidden;
	width: 100%;
	float: left;
	margin: 0 0 10px 0;

}

.bd-homebottom-products-thumb
{
	float: left;
	width: 26%;
}

.bd-homebottom-products-description
{
	float: left;
	width: 65%;
}

#bd-homebottom-products-description-long
{
	float: left;
	margin: 0 0 0 0;
	width: 100%;
}

#bd-homebottom a
{
  color: #685745;
  
}

#bd-homebottom a:hover
{
      color: #E23D28;
	  text-decoration: underline;
}

/*===========================================================================*\
    _SECTION_BODY_INTERIOR: Defines the appearance of the body content on interior pages
\*===========================================================================*/

/* Body Structure */

#bd-main
{
	margin: 15px 0 0 0;
}

#bd-left
{
	float: left;
	margin: 0 0 0 20px;
	_margin: 0 0 0 10px;
	width: 178px;
}

#bd-center
{
	float: left;
	margin: 0 0 0 49px;
	width: 482px;
}

#bd-right
{
	float: left;
	margin: 0 0 0 49px;
	width: 178px;
}

#bd-left-twocolumn
{
	float: left;
	margin: 0 0 0 20px;
	_margin: 0 0 0 10px;
	width: 716px;
}

#bd-right-twocolumn
{
	float: left;
	margin: 0 0 0 49px;
	width: 178px;
}

/*===========================================================================*\
    _TEXT_HEADERS: Styles for HTML headers (<h1> and <h2>...)
\*===========================================================================*/

h1.no-pic
{
	margin: 8px 0 0 0;
}

h4.bullet-title
{
    color: #666;
    margin-bottom: 5px;  
}

h4.sitemap-title
{
    color: #666;
    margin-bottom: 5px;  
}

h4.sitemap-title a
{
	color: #666;
	font-size: 100%;
	font-weight: bold;
	text-decoration: underline;
}

h4.sitemap-title a:hover
{
	color: #e23d28;
	text-decoration: underline;
}

h4.sitemap-title2
{
    color: #666;
    margin-bottom: 12px;  
}

h4.sitemap-title2 a
{
	color: #666;
	font-size: 100%;
	font-weight: bold;
	text-decoration: underline;
}

h4.sitemap-title2 a:hover
{
	color: #e23d28;
	text-decoration: underline;
}

h4.sitemap-title3
{
    color: #666;
    margin: 0 0 5px 10px;
}

h4.sitemap-title3 a
{
	color: #666;
	font-size: 100%;
	font-weight: bold;
	text-decoration: underline;
}

h4.sitemap-title3 a:hover
{
	color: #e23d28;
	text-decoration: underline;
}

h4.contact
{
    color: #333;
    margin: 10px 0 5px 0; 
}

h4.orange
{
    color: #f93;
    margin-bottom: 5px;  
}

h4.reqinfo
{
    color: #333;
    margin: 0 0 5px 0; 
}

h4.subtitle
{
    color: #666;
    font-style: italic; 
	margin: 5px 0 12px 0;  
}

h6.footnote
{
	margin: 20px 0 0 0;
    font-size: 77%;
	color: #666;
    font-style: italic; 
}

.tagline
{
  color: #666;
  font-size: 93%;
  font-style: italic;
  line-height: normal;
}


.register-mark
{
  color: #333;
  font-size: 12px;
  font-style: normal;
  line-height: normal;
  vertical-align:super;
}

/*===========================================================================*\
    _SECTION_LISTS: Defines the appearance of the lists
\*===========================================================================*/

#ulmain-bullet
{
	color: #666;
	margin-left: 8px;
	padding-top: 3px;
	padding-left: 5px;
	list-style: none;
	display: inline-block;
	margin-top: 3px;
	font-size:12px;
}

#ulmain-bullet li
{
	font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	padding-left: 12px;
	padding-right: 5px;
	padding-bottom: 5px;
	background-image: url(../img/bullets/bullet-blue.gif);
	background-repeat: no-repeat;
	background-position: 0 .5em;
	line-height: 17px;	
}

#ulmain2-bullet
{
	color: #666;
	font-size:12px;
	list-style: none;
	display: inline-block;
	margin: 3px 0 0 8px;
	padding: 3px 0 5px 5px;
}

#ulmain2-bullet li
{
	font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	font-style: italic;
	padding: 0 5px 5px 12px;
	background-image: url(../img/bullets/bullet-blue.gif);
	background-repeat: no-repeat;
	background-position: 0 .5em;
	line-height: 17px;	
}

#ulmain3-bullet
{
	color: #666;
	font-size:12px;
	list-style: none;
	display: inline-block;
	margin: -2px 0 0 8px;
	padding: 0 0 4px 5px;
}

#ulmain3-bullet li
{
	font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	font-style: italic;
	padding: 0 5px 5px 12px;
	background-image: url(../img/bullets/bullet-blue.gif);
	background-repeat: no-repeat;
	background-position: 0 .5em;
	line-height: 17px;	
}

#ultwocolumn-bullet
{
	color: #666;
	margin-left: 8px;
	padding-top: 3px;
	padding-left: 5px;
	list-style: none;
	display: inline-block;
	margin-top: 3px;
	font-size:12px;
}

#ultwocolumn-bullet li
{
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
	padding-left: 12px;
	padding-right: 5px;
	padding-bottom: 5px;
	background-image: url(../img/bullets/bullet-blue.gif);
	background-repeat: no-repeat;
	background-position: 0 .5em;
	line-height: 17px;	
}

#ultwocolumn2-bullet
{
	color: #666;
	margin-left: 8px;
	padding-top: 3px;
	padding-left: 5px;
	list-style: none;
	display: inline-block;
	margin-top: 3px;
	font-size:12px;
}

#ultwocolumn2-bullet li
{
	font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	font-style: italic;
	padding-left: 12px;
	padding-right: 5px;
	padding-bottom: 5px;
	background-image: url(../img/bullets/bullet-blue.gif);
	background-repeat: no-repeat;
	background-position: 0 .5em;
	line-height: 17px;	
}

#ulsitemap-bullet
{
	color: #666;
	margin-left: 8px;
	padding-top: 3px;
	padding: 0 0 10px 5px;
	list-style: none;
	display: inline-block;
	margin-top: 3px;
	font-size:12px;
}

#ulsitemap-bullet li
{
	font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	padding-left: 12px;
	padding-right: 5px;
	padding-bottom: 5px;
	background-image: url(../img/bullets/bullet-blue.gif);
	background-repeat: no-repeat;
	background-position: 0 .5em;
	line-height: 17px;	
}

#list-twocolumn
{
	overflow: hidden;
	width: 100%;
	float: left;
	margin: 0 0 0 0;
}

#list-twocolumn2
{
	overflow: hidden;
	width: 100%;
	float: left;
	margin: 0 0 0 0;
	padding: 0 0 10px 0;
}

.list-twocolumn-left
{
	float: left;
	width: 50%;
	margin: 0 0 0 0;
}

.list-twocolumn-right
{
	float: left;
	width: 50%;
	margin: 0 0 0 0;
}

.list-sitemap-left
{
	float: left;
	width: 55%;
	margin: 0 0 0 0;
}

.list-sitemap-right
{
	float: left;
	width: 45%;
	margin: 0 0 0 0;
}

.list-tagline
{ 
	color: #666;
  	font-size: 12px;
  	font-style: italic;
  	line-height: normal;
  	font-weight: normal;
}

.list-thickbox
{ 
	padding: 8px 0 0 0;
	font-size: 12px;
}

/*===========================================================================*\
    _SECTION_CONTACT: Defines the structure and appearance of the contact us
\*===========================================================================*/

#contact
{
	overflow: hidden;
	width: 100%;
	float: left;
	margin: 10px 0 0 0;

}

.contact-left
{
	float: left;
	width: 20%;
	margin: 0 0 15px 0;
}

.contact-right
{
	float: left;
	width: 70%;
	margin: 0 0 15px 0;
}

/*===========================================================================*\
    _SECTION_EXECUTIVE_MANAGEMENT: Defines the appearance of the executive management pages
\*===========================================================================*/

#exec-bio
{
	width: 600px;
	margin-left: auto;
  	margin-right: auto;
	padding: 25px 0 0 0;
}

#exec-bio p
{
    font-size: 12px;
    font-family: Arial, Verdana, Helvetica, sans-serif;
}

.exec-bio-wrapper
{
	height: 86px;
	width: 100%;
	padding-top: 11px 0 20px 0;
	margin: 0 0 20px 0;
}

.exec-bio-thumb
{
	float: left;
	height: 86px;
	width: 75px;
}

.exec-bio-content
{
	padding: 15px 0 0 95px;
}

.alignRight 
{ 
	float:right; 
	margin: 0 0 10px 20px;
}

/*===========================================================================*\
    _SECTION_FOOTER: Defines the structure and appearance of the footer
\*===========================================================================*/
/* Footer Structure */
#ft
{
	width:974px;
	padding: 40px 0 0 0;
}

#ft-left
{
	float: left;
	margin: 5px 0 0 0;
	width: 670px;
	height: 24px;
}
#ft-right
{
	float: right;
	margin: 5px 0 0 0;
	height: 24px;
}
#ft-top
{
	float: left;
	margin: 0 0 0 0;
	width: 974px;
}

#ft-bottom
{
	float: left;
	margin: 0 0 0 0;
	width: 974px;
}

/* Footer Apperance */

#ft p
{
  color: #685745;
  font-size: 77%;
  text-decoration: none;
  padding: 0 0 10px 0;
}

#ft a
{
  color: #685745;
  font-size: 77%;
  text-decoration: none;
}

#ft a:hover
{
    text-decoration: underline;
}

#ft i 
{
    color: #666;
    font-size: 77%;
}

/*===========================================================================*\
    _REQUEST_INFORMATION: Defines the structure and appearance of the request information form
\*===========================================================================*/

#reqinformation
{
	float: left;
	margin: 29px 0 0 0;
	_margin: 41px 0 0 0;
}

.reqinformation td
{
    color: #333;
	font-size: 85%;
}

.reqinformation td input
{
    color: #666;
    border: solid 1px #ccc;
    font-size: 11px;
    width: 175px;
}

.reqinformation td select
{
    color: #666;
    font-size: 11px;
    width: 175px;
}

.item-required
{
    color: #f00;   
}

/*===========================================================================*\
    _SECTION_TABLES: Styles for tables
\*===========================================================================*/

/* Table Left Nav */

#tbl-left-nav
{
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	background: #fff;
	margin: 0;
	width: 100%;
	border-collapse: collapse;
	text-align: left;
}
#tbl-left-nav th
{
	font-size: 12px;
	font-weight: normal;
	color: #666;
	padding: 10px 8px;
	border-bottom: 2px solid #6678b1;
}
#tbl-left-nav td
{
	border-bottom: 1px solid #ccc;
	color: #666;
	padding: 10px 8px;
}

#tbl-left-nav a
{
  color: #333;
  text-decoration: none;
}

#tbl-left-nav a:hover
{
    color: #E23D28;
	text-decoration: underline;
}

.subcat
{
    margin: 0 0 0 15px;
	line-height: 20px;
	font-size: 93%;
	color: #69c;
}

/*===========================================================================*\
    _SECTION_THINKBOX: Defines styles for lightbox effect
\*===========================================================================*/

/* global settings needed for thickbox */
*{padding: 0; margin: 0;}

/* thickbox specific link and font settings */
#TB_window {
	font-size: 12px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color: #69c;
}

#TB_secondLine {
	font-size: 10px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color: #666;
}

#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}

/* thickbox settings */
#TB_overlay {
	position: fixed;
	z-index:100;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}

.TB_overlayMacFFBGHack {background: url(../assets/images/macFFBgHack.png) repeat;}
.TB_overlayBG {
	background-color:#000;
	filter:alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_window {
	position: fixed;
	background: #ffffff;
	z-index: 102;
	color:#000000;
	display:none;
	border: 4px solid #525252;
	text-align:left;
	top:50%;
	left:50%;
}

* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_window img#TB_Image {
	display:block;
	margin: 15px 0 0 15px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #666;
	border-left: 1px solid #666;
}

#TB_caption{
	height:25px;
	padding:7px 30px 10px 25px;
	float:left;
}

#TB_closeWindow{
	height:25px;
	padding:11px 25px 10px 0;
	float:right;
}

#TB_closeAjaxWindow{
	padding:7px 10px 5px 0;
	margin-bottom:1px;
	text-align:right;
	float:right;
}

#TB_ajaxWindowTitle{
	float:left;
	padding:7px 0 5px 10px;
	margin-bottom:1px;
}

#TB_title{
	background-color:#e8e8e8;
	height:27px;
}

#TB_ajaxContent{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
	padding:15px;
}

#TB_ajaxContent p{
	padding:5px 0px 5px 0px;
}

#TB_load{
	position: fixed;
	display:none;
	height:13px;
	width:208px;
	z-index:103;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}

* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_HideSelect{
	z-index:99;
	position:fixed;
	top: 0;
	left: 0;
	background-color:#fff;
	border:none;
	filter:alpha(opacity=0);
	-moz-opacity: 0;
	opacity: 0;
	height:100%;
	width:100%;
}

* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_iframeContent{
	clear:both;
	border:none;
	margin-bottom:-1px;
	margin-top:1px;
	_margin-bottom:1px;
}