/*******************************************************
 * rheem-styles.css  (For Dotcom)
 *
 * The general idea here is to begin with box layout, starting with
 * the outermost elements and working our way in.
 * written by Jeremy Uchitel and John McCullough
 * *****************************************************/ 
html {
/*    height: 100%; */
}

/* body element
 * margin, padding, and height, determine layout of the body element box
 * background-color sets the blue-green background seen at the margins
 * of the page.
 * font-family, font-size, and color set default values for text elements
 * in the site.  They may be overridden by more specific styles later.
 */

body, tbody {
    margin: 0;
    padding: 0;
/*    height: 100%; */
    background-color: #fff;
    font-family: verdana, sans-serif;
    font-size: 10px;
    color: #333333;
}
a:link, a:visited {
    font-family: verdana, sans-serif;
    font-size: 10px;
    color:#0099ff;
    text-decoration: none;
}
a:hover {
	text-decoration:underline
}

.alignLeft{
    text-align: left;
    align: left;
    padding-left: 0;    
}
h1, h2, h3, {
    font-family: Arial Narrow, Arial, sans-serif;
    font-weight: bold;
    color: #333333;
    font-size: 14px;
}

h1 {
    caption: Heading 1;
    font-size: 14px;
}

h2 {
    caption: Heading 2;
    font-size: 12px;
}


/********************************
   this header is used for the press release Contacts heading 
   that appears at the bottom of the page.  It's red
 ********************************/
h3 {
    caption: Heading 3;
    font-size: 18px;
    color: #cc0000;
}

title  {
  padding:  0 0 8px 4px; 
  display: block; 
}

.pic_left{margin-right:13px; float:left;}
.pic_right{margin-left:13px; float:right;}


#Generic {
}

#Generic .title {
  padding:  0 0 8px 4px; 
  display: block; 
}

.smallfont-normal {
  font-size: 9px;
  font-style: normal;
}

.small-font-italic {
  font-size: 9px;
  font-style: italic;
}

.small-font-bold{
  font-size: 9px;
  font-style: bold;
}


/* form element
*/
form {
    margin: 0;
    padding: 0;
}

/* outer-box div element
 *
 * This element will enclose all other page content.  It establishes the
 * horizontal 'auto' margins that allow the browser to center the box
 * on the page.
 * 
 * The position: relative directive allows us to use this box as our
 * coordinate system when positioning the subordinate boxes to come later.
 *
 * We import this style for mozilla-based browsers to make the height "auto"
 * The HTML has a separate conditional comment for an IE stylesheet to make
 * the height 100%.
 */
#outer-box {
    position: relative;
    margin: 0 auto;
    padding: 0;
    min-height: 100%;
    width: 900px;
    background-color: #ffffff;
}

@import url("/content/resources/css/outer-box-moz.css" ) screen,projection; 

/* * * *
 * main-content div element
 *
 * We complete our "frame" around the content by simulating
 * the top margin with border-top set to the same color as our
 * body-tag background.
 *
 * The height: 1% property ensures that this element "has layout"
 * for Internet Explorer. Without this, floating content nested
 * under this element would "escape" the box.
 * * * */
#main-section {
    position: relative;
    margin: 0;
    padding: 0 0 30px 0;
    border-top: 10px solid #e4f5fd;
    height: 1%;
    min-height: 100%;
}

/* * * *
 * footer div element
 *
 * We complete our "frame" around the content by simulating
 * the bottom margin with border-bottom set to the same color as our
 * body-tag background.
 *
 * The footer is abolutely positioned at the bottom of of its containing
 * block, in this case "main-section."
 * * * */
#footer {
/*  position: absolute; */
/*   bottom: 0; */
  padding: 0;
  width: 790px;
  border-bottom: 10px solid #e4f5fd;
  text-align: center;
  height: 50px;
  margin: 0 auto;
}

/* * * *
 * left-column div element
 *
 * This element is floated left and contains the logo, navigation, and promo
 * * * */
#left-column {
  float: left;
  margin: 0;
  padding: 0;
  width: 165px;
}


/* * * *
 * right-column div element
 *
 * This element contains most of the page content. Left margin equal to
 * the width of the left-column is marked off.
 * * * */
#right-column {
   float: left;
   margin: 0 0 0 8px;
   padding: 0;
   width: 682px;
}

/* * * * *
 * We set up each of the 3 left-column boxes
 * with 5px left- and right-margins and no width
 * to center them in the column.
 * * * * */
#side-navigation {
    margin: 10px 5px 0 5px;
    width: 165px;

}

#visitor-type-rheem {
    margin: 12px 5px 10px 5px;
    height: 225px; 
    background-color: #faf6ea;
    border: 1px solid #d9d2b5;
}

#visitor-type-ruud {
    margin: 12px 5px 10px 5px;
    height: 180px; 
    background-color: #faf6ea;
    border: 1px solid #d9d2b5;
}

#visitor-type-canada {
    margin: 12px 5px 10px 5px;
    height: 180px; 
    background-color: #faf6ea;
    border: 1px solid #d9d2b5; 
}


#visitor-type-richmond {
    margin: 12px 5px 10px 5px;
}

/* * * * *
 * promotion div element
 *
 * Box model lesson: padding is part of the background of the element, so
 * height and width must be set to allow for this.
 *
 * This same effect should be achievable by setting the padding to '0' and
 * using these same padding widths for the margin of promo-text.  However
 * an apparent bug in Firefox causes it to render the combination incorrectly
 * unless a border is placed around the promotion div.
 * * * * */

#promotion-Rheem {
  margin: 10px auto;
  padding-top: 62px;
  background: url('/content/resources/images/relax_its_rheem.jpg') no-repeat;
  width: 143px;
  height: 159px; 
}

#promotion-Ruud {
  margin: 10px auto;
  padding-top: 50px;
  background: url('/content/resources/images/rely_on_ruud.jpg') no-repeat;
  width: 143px;
  height: 159px; 
}

#promotion-Richmond {
  margin: 10px auto;
  padding-top: 62px;
  background: url('/content/resources/images/water_heater_experts.jpg') no-repeat;
  width: 143px;
  height: 159px; 
}

#promotion-Mexico-Rheem {
  margin: 10px auto;
  padding-top: 62px;
  background: url('/content/resources/images/relax_its_rheem_mexico.jpg') no-repeat;
  width: 143px;
  height: 159px; 
}

#promotion-Canada-Fr {
  padding: 90px 10px 10px 10px;
  background: url('/content/resources/images/relax_its_rheem_french.jpg') no-repeat;
  width: 130px;
  height: 300px; 
}

#promo-text {
  margin: 0;
  padding: 0 12px;
  font-size: 86%;
}

#promo-text2 {
  margin: 0;
  padding: 0 12px;
  font-size: 9px;
  }

#header {
  background-color: #fff;
  margin:  0;
  padding: 0;
  border-bottom: 1px solid #666666;
  position: relative;	
}

#util-nav {
  padding: 0px 4px 0px 0px;
  text-align: right;
}

#topnav-search {
  float: right;
  font-size: 11px;
  width: 228px;
  font-size: 11px;
  margin: 15px 0 0 0;
}

#topnav-search img{
float: right;
margin: -22px 0 0 2px;
border: 0;
}

/***********
* Content element styles 
*/
img.block {
  margin:  0;
  padding: 0;
  display: block;
}

img#logo {
  margin: 0 auto;
  width: 120px !important;
}

a.link3:link, a.link3:visited {
  font-size: 10px;
  color: #333333;
  text-decoration: none;
}

a.link3:hover {
  color: #cc0000;
  text-decoration: underline;
}
/* * * *
 * home-content div element
 *
 * This element acts as a container for the home page content section. 
 * * * */
#home-content {
  margin-top: 4px;
}

#home-content .left-column {
    float: left;
    margin: 0;
    padding: 0;	
    width: 524px;
}

#home-content .right-column {	
    float: left;
    margin: 0;
    padding: 0;	
}

#home-content #top {
  height: 365px; 
}

#home-content #bottom {
  margin-top: 10px;
  height: 196px;
}

#home-content .footer,
#home-content .bottomLink {
  margin-top: 15px;
  text-align: center;  
}

#home-content  .container-one,
#home-content  .container-two {
  float: left; 
  margin-right: 16px;
}

#home-content  .container-three {
  float: left;
}

#home-content  .container-type-one .title {
  padding:  0 0 8px 4px; 
  display: block; 
}

#home-content  .container-type-one .content {
  border-top: 1px solid #d9d2b6;
  padding-top: 8px;
}

.container-type-one {
   border: 1px solid #d9d2b6;
   padding: 10px 8px 5px 8px;
   margin: 10px 0 0 0;
   width: 145px;
   height: 181px;   
   background-color: #faf6ea;
   position: relative; 
}

.container-type-one-bottom {
    position: absolute;
    bottom: 0px;
clear: both;
}


/* **********  This is for Canada abnd Mexico home ***************************/

#home-content  .container-A {
  float: left; 
}

#home-content  .container-B {
  float: right;
}

#home-content  .container-type-x .title, 
#home-content  .container-type-two .title,
#home-content  .container-type-three .title {
  padding:  0 0 8px 4px; 
  display: block; 
}

#home-content  .container-type-two .content {
  border-top: 1px solid #d9d2b6;
  padding-top: 8px;
}
#home-content  .container-type-x .content,
#home-content  .container-type-three .content,
#home-content  .container-type-four .content {
  padding-top: 0px;
}

.container-type-two {
   border: 1px solid #d9d2b6;
   padding: 10px 8px 5px 8px;
   margin: 10px 0 0 0;
   width: 240px;
   height: 175px;   
   background-color: #faf6ea;
   position: relative; 
}

.container-type-three {
   border: 1px  solid #d9d2b6;
   padding: 10px 8px 5px 8px;
   margin: 10px 0 0 0;
   background-color: #faf6ea;
   position: relative; 
   width: 506px;
   height: 165px; 

}
.container-type-x {
   border: 1px  solid #d9d2b6;
   padding: 10px 8px 5px 8px;
   margin: 10px 0 0 0;
   background-color: #faf6ea;
   position: relative; 
   width: 506px;
   height: 100px; 

}

.container-type-four {
   padding: 10px 8px 5px 8px;
   margin: 10px 0 0 0;
   position: relative; 
   width: 400px;
   height: 165px; 
}
.container-type-two-bottom {
    position: absolute;
    bottom: 0px;
    clear: both;
}


/* * * *
 * message-content div element
 *
 * This element acts as a container for the message area on any tpl
 * * * */
#message-content {
  width: 100%;
}

#message-content div.text {
  float: left;
  margin-top: 28px;
  padding: 0;
  width: 450px;
}

#message-content .message-image {
  float: left;
  margin: 16px 16px 16px 0px;
  padding: 0;
}

#message-content .container-family {
   float: left;
   border: 1px solid #d9d2b6;
   padding: 10px 8px 5px 8px;
   margin: 20px 0 0 0;
   width: auto;
   height: auto;   
   background-color: #faf6ea;
   position: relative; 
}


/* * * *
 * residential-products-content div element
 *
 * This element acts as a container for the residential products page content section. 
 * * * */

#residential-products-content {
}

#residential-products-content .container-family {
   float: left;
   border: 1px solid #d9d2b6;
   padding: 10px 8px 5px 8px;
   margin: 20px 0 0 0;
   width: 142px;
   height: 227px;   
   background-color: #faf6ea;
   position: relative; 
}

#residential-message {
  width: 100%;
}

#residential-message div.text {
  float: left;
  margin-top: 28px;
  padding: 0;
  width: 450px;
}

#residential-message .message-image {
  float: left;
  margin: 16px 16px 16px 0px;
  padding: 0;
}

#residential-products-content .message-text { 
}

#residential-products-content .container-one,
#residential-products-content .container-two,
#residential-products-content .container-three {
  margin-right: 10px;
}

#residential-products-content .container-family .title {
  padding:  0 0 8px 4px; 
  display: block; 
}

#residential-products-content .container-family .content {
  border-top: 1px solid #d9d2b6;
  padding-top: 8px;
}

#residential-products-content .container-family .image {
  float: left;
  padding-top: 8px;
  display: block; 
}

#residential-products-content .container-family p.text {
  float: left;
}

#residential-products-content .button {
    clear: both;
    position: absolute;
    right: 22px;
    bottom: 8px;
}

/* * * *
 * commercial-products-content div element
 *
 * This element acts as a container for the commercial products page content section. 
 * * * */

#commercial-products-content {
}

#commercial-products-message .message-image {
  float: left;
  margin: 16px 16px 16px 0px;
  padding: 0;
}


#commercial-products-message div.text {
  float: left;
  margin-top: 28px;
  padding: 0;
  width: 450px;
}


#containers {
	clear: both;
	text-align: center;
	align: center;
	width: 100%;
}

#containers .container-family .container-title{
    color: #3399cc;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    align: center;
    width: 98%;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #d9d2b6 !IMPORTANT;
}


.content p{
    align: left;
    text-align: left;
    margin-bottom: 2px;
}

#commercial-products-content .container-family {
   float: left;
   clear: none;
   border: 1px solid #d9d2b6;
   padding: 4px 4px 4px 4px;
   margin: 10px 4px 0 0;
   width: 210px;
/*   height: 260px;   */
   height: 280px;   
   background-color: #faf6ea;
   position: relative; 
   text-align: left;
}

#commercial-products-content .container-one {
	margin-right: 4px;
}

#commercial-products-content .two-col-container{
	width: 45% !IMPORTANT;
}

#commercial-products-content .two-col-container .content p.text{
	float: right;
	clear: none;
	width: 145px !IMPORTANT;
	margin: 6px !IMPORTANT;
	text-align: left !IMPORTANT;
}

#commercial-products-content .two-col-container img.image {
  float: left;
  margin: 1px 4px 0px 2px !IMPORTANT;
  display: block; 
}



#commercial-products-content .container-family .title {
  padding:  0 0 8px 4px; 
  display: block; 
}

#commercial-products-content .container-family .content {

  padding-top: 2px;
  color: #333;
  width: 100%;
  text-align: left;
  align: left;
}

#commercial-products-content .container-family img.image {
  margin: 1px auto 0px auto;
  padding-top: 14px;
  display: block; 
}

#commercial-products-content .container-family p.text {
  float: left;
  margin: 6px;
  width: 180px;
  text-align: left !IMPORTANT;
}

#commercial-products-content .button {    
    clear: both;
    position: absolute;
    right: 22px;
    bottom: 8px;
}


/*******************************************************************************
     	used for the product pages where feature boxes have no images
********************************************************************************/

#no-feature-image-content {
}

/*******************************************************************************  
	this section defines the box for the feature text 
********************************************************************************/
#no-feature-image-content .container-family {
   float: left;
   clear: none;
   border: 1px solid #d9d2b6;
   padding: 4px 4px 4px 4px;
   margin: 10px 4px 0 0;
   width: 300px;
   height: 120px;    
   background-color: #faf6ea;
   position: relative; 
   text-align: left;
} 

/****************************************************************************
	this section impact the way the text in the feature
	box appears
****************************************************************************/
#no-feature-image-content .two-col-container .content p.text{
	float: left;
	clear: none;
	margin: 6px !IMPORTANT;
	text-align: left !IMPORTANT;
}

/*****************************************************************************************
  this controls the way the button looks
***************************************************************************************/
#no-feature-image-content .button {    
    clear: both;
    position: absolute;
    right: 22px;
    bottom: 8px;
}

/* * * *
 * parts-catalog-content div element
 *
 * This element acts as a container for the parts catalog page content section. 
 * * * */

#parts-catalog-content {
}

#parts-catalog-message .message-image {
  float: left;
  margin: 16px 16px 16px 0px;
  padding: 0;
}

#parts-catalog-message div.text {
  float: left;
  margin-top: 28px;
  padding: 0;
  width: 450px;
  text-align: left;
}

#parts-catalog-content table.parts-catalog-table {  
  clear: both;
  width: 642px;
}

#parts-catalog-content table.parts-catalog-table th {
  text-align: left;
  height: 20px;  
  background-color: #3399cc;
  font-size: 12px;
  color: #fff;
}

#parts-catalog-content table.parts-catalog-table th.col-1 {
  width: 50%;
}

#parts-catalog-content table.parts-catalog-table th.col-2,
#parts-catalog-content table.parts-catalog-table th.col-3 {
  width: 25%;
}

#parts-catalog-content table.parts-catalog-table td {
  padding: 4px 0px 2px 0px;
  border-bottom: 1px solid #d9d2b6;
  text-align: left;
  height: 24px; 
  background-color: #faf6ea;  
}

#parts-catalog-content table.parts-catalog-table td.col-1 {
  border-left: 1px solid #d9d2b6;
  padding-left: 20px;  
}

#parts-catalog-content table.parts-catalog-table td.col-3 {
  border-right: 1px solid #d9d2b6;;  
}


/*******************************************************
 * one-col-content div element
 *
 * This element acts as a container for the one-col content pages content section. 
 ********************************************************/

#one-col-content {
}

#one-col-content .container-family {
   float: left;
   border: 1px solid #d9d2b6;
   padding: 10px 8px 5px 8px;
   margin: 20px 0 0 0;
   width: auto;
   height: auto;
   background-color: #faf6ea;
   position: relative; 
}


#one-col-content .container-family .title {
  padding:  0 0 8px 4px; 
  display: block; 
}

#one-col-content .container-family .content {
  border-top: 1px solid #d9d2b6;
  padding-top: 8px;
}

#one-col-content .container-family .image {
  float: left;
  padding-top: 8px;
  display: block; 
}

#one-col-content .container-family p.text {
  float: left;
}

#one-col-content .button {
    clear: both;
    position: absolute;
    right: 22px;
    bottom: 8px;
}

#one-col-message {
  width: 100%;
}

#one-col-message div.text {
  float: left;
  margin-top: 28px;
  padding: 0;
  width: 450px;
}

#one-col-message .message-image {
  float: left;
  margin: 16px 16px 16px 0px;
  padding: 0;
}

#one-col-content .message-text { 
}

/* * * *
 * residential-gas-content div element
 *
 * This element acts as a container for the residential gas page content section. 
 * * * */
  
#residential-gas-content {
}

#residential-gas-message .message-image {
  float: left;
  margin: 16px 16px 16px 0px;
  padding: 0;
}

#residential-gas-message div.text {
  float: left;
  margin-top: 28px;
  padding: 0;
  width: 450px;
text-align: left;
}

#residential-gas-content table.residential-gas-table {  
  clear: both;
  width: 642px;
}

#residential-gas-content table.residential-gas-table th {
  text-align: left;
  height: 20px;  
  background-color: #3399cc;
  font-size: 12px;
  color: #fff;
  width: 50%;
}

#residential-gas-content table.residential-gas-table th.col-1 {
  padding-left: 20px;
}

#residential-gas-content table.residential-gas-table td {
  padding: 8px 0px;
  border-bottom: 1px solid #d9d2b6;
  text-align: left;
  height: 24px; 
  background-color: #faf6ea;  
}

#residential-gas-content table.residential-gas-table td.col-1 {
  border-left: 1px solid #d9d2b6;
  padding-left: 20px;  
}

#residential-gas-content table.residential-gas-table td.col-2 {
  padding-right: 8px;
  border-right: 1px solid #d9d2b6;;  
}  
  
/* * * *
 * product-resources-content div element
 *
 * This element acts as a container for the product resources page content section. 
 * * * */

#product-resources-content {
}

#product-resources-content .container-family {
   float: left;
   border: 1px solid #d9d2b6;
   padding: 10px 8px 5px 8px;
   margin: 20px 0 0 0;
   width: 194px;
   height: 146px;   
   background-color: #faf6ea;
   position: relative; 
}

#product-resources-content .container-one,
#product-resources-content .container-two {
  margin-right: 20px;
}

#product-resources-content .container-family .title {
  padding: 0 0 8px 4px;  
}

#product-resources-content .container-family .content {
  border-top: 1px solid #d9d2b6;
}


#product-resources-content .container-family p.text {
align: left;
text-align: left;
}

#product-resources-content .bottom {
    position: absolute;
	left: 8px;
    bottom: 16px;
}

/* *********************************
*
Left Navigation Positioning Elements
* 
*************************************/
#left-aud-list{
margin: 0;
}

#left-aud-list li{
vertical-align: middle;
}

#left-aud-list li img{
vertical-align: bottom;
}

#left-aud-list li a{
margin-top: 4px;
}

.message-title {
  font-size: 12px;
  font-weight: bold;    
}

.font-type-two {
  font-family: verdana, sans-serif;
  font-size: 10px;
  color: #333333;
 }
 
a.link-type-two:link, a.link-type-two:visited {
  font-weight: normal;
  font-family: verdana;
  font-size: 10px;
  color: #0099ff;
  text-decoration: none;
}

a.link-type-two:hover {
  text-decoration: underline;
}

a.link-type-three:link, a.link-type-three:visited {
  font-family: verdana;
  font-weight: bold;
  font-style: italic;
  font-size: 12px;
  color: #0099ff;
  text-decoration: none;
}

a.link-type-three:hover {
  text-decoration: underline;
}

#focus-on-tankless,
#focus-on-hpwh,
#focus-on-wh, 
#focus-on-raypak, 
#focus-on-instantaneos,
#focus-on-solar, 
#focus-on-solares,
#focus-on-ac, 
#focus-on-parts, 
#focus-on-partes, 
#focus-on-canada,
#focus-on-pieces,
#focus-on-sansReservoir,
#focus-on-solaires {
	position: relative;
	margin: 0;
	margin-bottom: 10px;  
	width: 143px;
	height: 179px;
	font-family: verdana, sans-serif;
	font-size: 9px;
}

#focus-on-tankless p, 
#focus-on-instantaneos p,
#focus-on-solar p,
#focus-on-solares p,
#focus-on-ac p,
#focus-on-parts p,
#focus-on-hpwh p,
#focus-on-partes p,
#focus-on-solaires p {
  margin: 5px;
  padding: 10px 0px 0px 5px;
  width: 75px;
}

#focus-on-ac p,
#focus-on-raypak p,
#focus-on-wh p {
  margin: 5px;
  padding: 10px 0px 0px 5px;
  width: 132px;
}

#focus-on-parts p,
#focus-on-partes p {
  margin: 5px;
  padding: 10px 0px 0px 5px;
  width: 132px;
}

#focus-on-hpwh p {
  margin: 5px;
  padding: 10px 0px 0px 5px;
  width: 132px;
}

#focus-on-pieces p, 
#focus-on-sansReservoir p {
  margin: 0px;
  padding: 0px 5px 5px 5px;
  width: 130px;
}

#focus-on-tankless {
  background: url('/content/resources/images/features/focus_on_tankless.jpg') no-repeat;
}

#focus-on-wh {
  background: url('/content/resources/images/features/focus_on_wh.jpg') no-repeat;
}
#focus-on-raypak {
  background: url('/content/resources/images/features/focus_on_raypak.jpg') no-repeat;
}

#focus-on-instantaneos {
  background: url('/content/resources/images/features/focus_on_instantaneos.jpg') no-repeat;
}

#focus-on-sansReservoir {
  background: url('/content/resources/images/features/focus_on_sansReservoir.jpg') no-repeat;
}

#focus-on-solar {
  background: url('/content/resources/images/features/focus_on_solar.jpg') no-repeat;
}

#focus-on-solares {
  background: url('/content/resources/images/features/focus_on_solares.jpg') no-repeat;
}

#focus-on-solaires {
  background: url('/content/resources/images/features/focus_on_solaires.jpg') no-repeat;
}

#focus-on-ac {
  background: url('/content/resources/images/features/focus_on_ac.jpg') no-repeat;
}

#focus-on-parts {
  background: url('/content/resources/images/features/focus_on_parts.jpg') no-repeat;
}

#focus-on-hpwh {
  background: url('/content/resources/images/features/focus_on_hpwh.jpg') no-repeat;
}

#focus-on-canada {
  background: url('/content/resources/images/features/focus_on_canada.jpg') no-repeat;
}


#focus-on-partes {
  background: url('/content/resources/images/features/focus_on_partes.jpg') no-repeat;
}

#focus-on-pieces {
  background: url('/content/resources/images/features/focus_on_pieces.jpg') no-repeat;
}

#focus-on-tankless .focus-on-bottom, 
#focus-on-solar .focus-on-bottom,
#focus-on-canada .focus-on-bottom,
#focus-on-parts .focus-on-bottom, 
#focus-on-hpwh .focus-on-bottom, 
#focus-on-pieces .focus-on-bottom,
#focus-on-raypak .focus-on-bottom {
    margin-left: 6px;
    position: absolute; 
    bottom: 40px; 
}
#focus-on-pieces .focus-on-bottom,
#focus-on-canada .focus-on-bottom,
#focus-on-sansReservoir .focus-on-bottom {
    margin-left: 80px;
    bottom: 50px; 
}


.focus-on-button {
    margin-left: 6px;
    position: absolute;
    left:80px;
    top:130px
}

#certificate-organization {
    margin-left: 12px;
    margin-top:  40px;
}

#certificate-organization .ul-certificate {
   float: left;
   width:  84px;
   height: 65px;
}

#certificate-organization .gama-organization,
#certificate-organization .csa-organization {
   float: left;
   vertical-align: top;
}

.certificates {
    padding: 5px 5px 5px 5px;
    margin: 5px 5px 5px 5px;
    align: center;
}



#page-title {
	margin: 4px 0px 0px 0px;
	width: 673px ;
	height: 63px !IMPORTANT;
}

#page-title #titleText{
	margin: 17px 0px 0px 23px;
	font-size: 19px;
	font-weight: 600;
	color: white;
	position: relative;
	z-index: -1;
}


#page-title img{
	position: relative;
	z-index: -9;
	margin-top: -62px;
}

#page-title h1{
	font-size: 19px;
	font-weight: 600;
	color: white;
	position: relative;
	z-index: -1;
	margin-left: 22px;
	margin-top: 26px;
}

#question-help {
	clear: both;
}

#audience-content {
	float: left;
	padding-left: 5px;
}

#audience-content .img {
	float: left;
	margin: 16px 24px 10px 0px; 
	padding: 0;
	width: 189px;
	height: 106px;
}

#audience-content .title {
	font-size: 12px;
	font-weight: bold; 
	margin-top: 16px;   
	
}
#audience-content a.link, 
#audience-content a.visited {
	color: #CC9933;
	text-decoration: none;
}

#audience-content a.hover {
	text-decoration: underline;
}


.page-point {
  clear: both;
}

.page-point-clear {
  clear: right;
  margin-top: 10px;
}

.page-point-clear img{
	margin-top: 0px; 
}

.page-point-clear div.text{
	float: left;
	width: 445px;
	padding-left: 5px;
}

.page-point-image {
  float: left;
  margin: 16px 16px 10px 0px;
  padding: 0;
  width: 189px;
  height: 106px;
}

.page-point-image-right {
  align: right;
  margin: 16px 16px 0px 0px;
}

.page-point div.text {
  align: left;
  margin-top: 16px;
  padding: 0;
  width: 420px;
  text-align: left;
}

a.page-point:link, a.page-point:visited {
  color: #CC9933;
  text-decoration: none;
}

a.page-point:hover {
  text-decoration: underline;
}



.page-point .text-no-image {
  float: left;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 0;
  width: 650px;
}

.page-point-title {
  font-size: 12px;
  font-weight: bold;    
}

#page-message {
}

select.document-select { 
  font-family: verdana, sans-serif;
  font-size: 10px;
  color: #333333;
}

.document-select { 
  font-family: verdana, sans-serif;
  font-size: 10px;
  color: #000000;
}

.section-title {
  clear: both;
  margin: 16px 0px;
  font-family: verdana, sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #333333;
}

.section-text {
  margin: 8px 0px;
}

.section-header {
  margin: 2px 0px;
  font-family: verdana, sans-serif;
  font-size: 12px;
  font-weight: bold;
  font-style: italic;
  color: #333333;
}


#questions {
    list-style-type: none;
    font-family: verdana, sans-serif;
    font-size: 11px;
    margin-left: 0;
    padding-left: 0;
}

#questions a, 
#questions a:link, 
#questions a:visited {
    font-family: verdana, sans-serif;
    font-size: 11px;
    text-decoration: none;
}

#questions a:hover {
    font-family: verdana, sans-serif;
    font-size: 11px;
    text-decoration: underline;
}

dt {
    font-weight: bold;
    margin-top: 11px;
}

dt .label {
    color: #333333;
}

dd {
    margin-left: 0;
}

.page-title
{
  padding: 6px 0px 12px 0px;
  background: url('/content/resources/images/section_divider.gif') no-repeat bottom;
}

#ContentSection
{
  padding: 0 0 6px 0;
  background: url('/content/resources/images/section_divider.gif') no-repeat bottom;
  margin: 0;
}

#ContentSection p
{
  margin-top: 5px;
  margin-bottom: 10px;
  font-family: verdana;
  font-size: 11px;
  line-height: 15px;
  color: #333333;
  font-weight: normal;
}

#ContentSection .title
{
  font-family: verdana, sans-serif;
  font-size: 14px;
  color: #;
  font-weight: normal;
}

#ContentSection .displaydate {
  font-weight: bold;
}


/***********************************
    TOP NAVIGATION  		  
***********************************/
#container {
	margin: 0;
}

#nav {
	float: left;
	list-style: none;
	background: white;
	font-weight: bold;
	padding: 0;
	margin: 34px 0 0 0;
	font: 12px arial, helvetica, serif;
	font-weight: bold;
	color: #666;
	position: relative;
	z-index: 999;
}


#nav a {
	display: block;
	color: #999;
	text-decoration: none;
}

#nav a:hover {
	display: block;
	color: #cc0000;
	text-decoration: underline;	
}

#nav li {
	position: relative;
	z-index: 999;
	float: left;
	padding: 2px 12px 2px 10px;	
	background-repeat: no-repeat;
	background-position: right;
}

/** 	NOTE:  this draws the box on the top nav elements when you hover over the level 1 item */

#nav li ul {
	position: absolute;
	left: -999em;
	height: auto;
	width: 12em;
	font-weight: normal;
	border-width: 1px;
	margin: 2px 0 0 0;
	z-index: 999;
	border: solid #069;
	background-color: white;
	line-height: 2;
}


#nav li ul a {
	width: 11em;
	color: #39c;
	text-decoration: none;
	background-color: white;
	background-image: url('/content/resources/images/nav/nav-bg.gif');
	z-index: 999;
}

#nav li ul a:hover {
	color: #cc0000;
	text-decoration: underline;
	font-weight: bold;
}



#nav li:hover ul, #nav li.sfhover ul {
	left: -999em;
	left: auto;
	z-index: 999;
}


/******** NOTE **********
  this is not used   
#nav li:hover, #nav li.sfhover {
	background-repeat: no-repeat;
	background-position: right;
	z-index: 999;
} 


#nav li ul li:hover, #nav li ul li.sfhover {
	background: #fff;
	background-repeat: no-repeat;
	background-position: left;
	z-index: 999;
}


li#lastNav, li#lastNav:hover, li:hover#lastNav{
	background: #fff !IMPORTANT;
	background-image: url('/content/resources/images/nav/nav-bg.gif') !IMPORTANT;
	width: 5.6em !IMPORTANT;
	z-index: 999;
}
*******************************/


/*
END TOP NAVIGATION
*/


/*
HOME PAGE SWF
*/

#homePageSWF{
z-index: -999;
position: relative;
}

object, embed, param, #top object, #top embed, #top param{
z-index: -999;
position: relative;
}


/* * * *
 * product-resources-content div element
 *
 * This element acts as a container for the product resources page content section. 
 * * * */

#product-resources-content {
}

#product-resources-content .container-category {
   float: left;
   border: 1px solid #d9d2b6;
   padding: 10px 8px 5px 8px;
   margin: 20px 0 0 0;
   width: 194px;
   height: 146px;   
   background-color: #faf6ea;
   position: relative; 
}


#product-resources-content .container-one,
#product-resources-content .container-two {
  margin-right: 8px;
}

#product-resources-content .container-category .title {
  padding: 0 0 8px 4px;  
}

#product-resources-content .container-category .content {
  border-top: 1px solid #d9d2b6;
}


#product-resources-content .container-category p.text {
}

#product-resources-content .bottom {
    position: absolute;
    bottom: 16px;
}


/* * * *
 * product-family-content div element
 *
 * This element acts as a container for the product family page content section. 
 * * * */
  
#product-family-content {
}

#product-family-message .message-image {
  float: left;
  margin: 16px 16px 16px 0px;
  padding: 0;
}

#product-family-message div.text {
  float: left;
  margin-top: 28px;
  padding: 0;
  width: 450px;
}

#product-family-content table.product-family-table {  
  clear: both;
  width: 642px;
}


#product-family-content table.product-family-table th {
  text-align: left;
  height: 20px;  
  background-color: #3399cc;
  font-size: 12px;
  color: #fff;
  width: 50%;
}

#product-family-content table.product-family-table th.col-1 {
  padding-left: 20px;
}

#product-family-content table.product-family-table td {
  padding: 8px 0px;
  border-bottom: 1px solid #d9d2b6;
  text-align: left;
  height: 24px; 
  background-color: #faf6ea;  
}

#product-family-content table.product-family-table td.col-1 {
  border-left: 1px solid #d9d2b6;
  padding-left: 20px;  
}

#product-family-content table.product-family-table td.col-2 {
  padding-right: 8px;
  border-right: 1px solid #d9d2b6;;  
}  


/*
// --------------------------------------------------------------------------------------------------------------------
// Catalog Products
// --------------------------------------------------------------------------------------------------------------------
*/
.portlet-products
{
    font-family: Verdana, Arial, Tahoma;
    font-size: 11px;
    color: #666666;
    vertical-align: top;
    padding-left: 12px;
    padding-right: 15px;
}

.portlet-products .column1
{
    vertical-align: top;
    width: 30%;
    text-align: left;
    padding: 2px;
}

.portlet-products .column2
{
    vertical-align: top;
    width: 30%;
    text-align: left;
    padding: 2px;
}

.portlet-products .column3
{
    vertical-align: top;
    width: 15%;
    text-align: left;
    padding: 2px;
}

.portlet-products .column4
{
    vertical-align: top;
    width: 25%;
    text-align: left;
    padding: 2px;
}

.portlet-products .links
{
    vertical-align: top;
    font-family: Verdana, Arial, Tahoma;
    font-size: 11px;
    color: #0602ED;
    text-align: left;
    
}

.portlet-products .header
{
    font-size: 14px;
    vertical-align: top;
    text-align: left;
}

.portlet-products .title
{
    font-family: Verdana, Arial, Tahoma;
    font-size: 12px;
    color: #CE3031;
    font-weight: bold;
    vertical-align: top;
   
}

.portlet-products .subtitle
{
    font-family: Verdana, Arial, Tahoma;
    font-size: 11px;
    color: #666666;
    vertical-align: top;
    
}

.portlet-products .headings
{
    font-family: Verdana, Arial, Tahoma;
    font-size: 11px;
    color: #666666;
    font-weight: bold;
    vertical-align: top;
    
}

.portlet-products .text
{
    vertical-align: top;
    font-family: Verdana, Arial, Tahoma;
    font-size: 11px;
    color: #666666;
    text-align: left;
    padding-right: 15px;
    
}

.portlet-products table.portlet-products-container {
   margin-top: 8px;
   width: 673px;
}
 

.portlet-products td.leftColumn {
  padding: 8px 10px 8px 0;
}
 

.portlet-products td.rightColumn {
  padding: 20px 0px 0px 10px;
  border-left: 1px solid #999999;
}
 
.product-images {
  list-style: none;
  padding:  20px 50px 0 0;  
  text-align: center;  

}

.product-document-title {
  font-family: verdana, sans-serif;
  font-size: 12px;
  color: #333333;
  font-weight: bold;
  text-align: center;
  margin-top: 16px;
}


.product-documents {
  list-style: none;
  text-align: left;
  margin: 0 0 2px 0;
}

.product-documents img{
   margin: 2px 2px 2px 2px;
   padding: 2px 2px 2px 2px;
}

.product-rating-images {
	list-style: none;
}

#search-results-content {
  font-size: 11px;
}

.search-result-item {
  margin-top: 5px;
  margin-bottom: 10px;
  font-family: verdana;
  font-size: 11px;
  line-height: 15px;
  color: #333333;
}

.search-result-item a:hover {
  text-decoration: underline;
} 

.search-result-item a.title {
  font-family: verdana;
  font-size: 11px;
  font-weight: bold;
  color: #3399cc;
  text-decoration: none;
}

.search-result-item a.url {
  font-family: verdana;
  font-size: 10px;
  font-weight: normal;
  color: #3399cc;
  text-decoration: none;
}

.search-results-pager {
  text-align: center;
  padding-top: 8px;
}

.search-results-pager a {
  font-family: verdana;
  font-size: 11px;
  font-weight: bold;
  color: #333333;
}

#topnav-search input {
  width: 140px;
}

.thankyou {
  font-family: verdana;
  font-size: 13px;
  font-weight: bold;
  color: #333333;
}

#video-movie {
  float: left;
  margin:12px 0 0 5px;
  padding: 0 0 0 0;
}
#video-nav {
  float: left;
  margin:12px 5px 0 0;
  padding: 0 0 0 0;
  font-family: verdana;
  font-size: 11px;
}

#tsContent {
    margin: 0;
    padding: 0;
    font-family: Arial, Verdana, Tahoma, sans-serif;
}

#tsContent h1 {
    font-size: 18px;
    color: #23428B;
}

#tsContent h2 {
    font-size: 11px;
    font-weight: bold;
    color: #0099ff;
}

#tsContent h3 {
    font-size: 13px;
    font-weight: bold;
    color: #CE3031;
}

#tsContent h2.dept {
    border-bottom: 1px dashed #666666;
    padding: 0;
    margin: 2px 0;
}

#tsContent p {
    font-size: 11px;
    margin-top: 5px;
    margin-bottom: 10px;
    padding: 0px;
}

#tsContent p.dateline {
    font-weight: bold;
}

#tsContent p.summary {
    font-style: italic;
}

#tsContent ul.questions {
    font-size: 12px;
    font-weight: bold;
    color: #23428B;
    padding-bottom: 3px;
    border-bottom: 1px solid black;
    list-style-type: none;
    margin-left: 0;
}

#tsContent .questions li {
    padding: 5px 0;
}

#tsContent dl.faq {
    font-size: 11px;
    font-weight: normal;
}

#tsContent .faq dt {
    color: #23428B;
}

#tsContent .faq dd {
    color: #666666;
    padding-bottom: 5px;
}

#tsContent table.contact {
    width: 640px;
}

#tsContent .contact td {
    font-size: 11px;
    vertical-align: top;
    margin: 5px 0;
    padding: 0;
}

#tsContent td.header {
    padding: 0;
    margin: 0;
}

#tsContent td.header2 {
    padding: 0;
    margin: 0;
	font-weight:bold;
}

#tsContent span.label {
    width: 60px;
    font-weight: bold;
}

#tsContent td {
    font-family: Arial, Verdana, Tahoma, sans-serif;
    font-size: 11px;
}

#tsContent li {
    font-family: Arial, Verdana, Tahoma, sans-serif;
    font-size: 11px;
}