body {
    text-align: center;
    margin: 0px auto;
    background: #EAEAEA url("../../images/bg.gif") repeat-y center top;
    font-family:  Arial, sans-serif;
    color: #333;
}

#container {
    width: 755px;
    margin: 0px auto;
    padding: 0px;
}

#banner {
    margin: 0px auto;
    padding: 0px;
    padding-bottom: 5px;
    width: 755px;
}

#banner .logo {
    margin: 4px auto 0px auto;
    width: 755px;
    height: 95px; 
    background: url("../../images/banner_logo.gif") no-repeat center;
    display: block;
    line-height: normal;
}
#banner .c2a p {
    text-align:right;
    display:block;
    padding-top: 77px;
    margin-right: 5px;
    font-weight: bold;
    font-size: 12px;
}

#banner .c2a a {
    color: #000;
    text-decoration: none;
}

#banner .c2a a:hover {
    text-decoration: underline;
}

#banner .menu {
    background: url("../../images/bar_bg.gif") repeat-x;
    border: 1px #ACACAC solid;
    height: 21px;
    width: 745px;
    display: block;
    text-align: left;
    font-size: 11px;
    margin: auto;
}


#banner .bannernavigation {
    margin-top: 3px;
    margin-left: 5px;
}

#banner .menu a {
    padding: 1px 5px 2px 5px;
    font-weight: bold;
    font-family: Arial, sans-serif;
    text-decoration: none;
    color: #333;
    }

#banner .menu a:hover {
    background: #eaeaea;
    border: 1px #acacac solid;
    padding: 1px 4px 2px 4px;
}

#banner .mktg_msg {
    background: url("../../images/mktg_msg_sub.jpg") no-repeat;
    width: 755px;
    height: 86px;
    display: block;
}

#banner .bannershadow {
    background: url("../../images/bottom_bar.gif") no-repeat;
    height: 29px;
    width:747px;
    margin: 0 auto;
    display: block;
		padding-top:4px;
    }

#banner .breadcrumbs {
    float: left;
    margin-left: 10px;
    font-size: 11px;
}

#banner .print {
    text-align: right;
    float: right;
    width: 100px;
    font-size: 11px;
    margin-right: 5px;
}

#left {
    width: 170px;
    float: left;
    margin-left:3px;
    text-align: left;
    font-size:11px;
}

/* the idea is that this can be reused throughout the site and if it set to display block then it will take on the width of it's parent... the navtop div defines the top left corner and the H2 used for the title of the box will draw the the rest of the top, it can be at it's widest 400px... you can edit the graphic to be as long as needed so that it can stretch, our plans show that the long we will need is 290px
*/
.navtop {
    background: url("../../images/navbox_topleft.gif") no-repeat top left;
    height: 26px;
    display: block;
}

/* an H2 is essential for this to work */
.navtop h2 {
    background: url("../../images/navbox_top.gif") no-repeat top right;
    padding: 6px 0px 6px 0px;
    font-size: 12px;
    margin: 0px 0px 0px 14px;
    color: #424242;
    }

.navtop h2 a {
    color: #424242;
    text-decoration: none;
}

.navtop h2 a:hover {
    color: #424242;
    text-decoration: underline;
}

.navtop img {
    display: inline;
    margin:0px;
    padding: 0px;
}

/* all the contents goes in here */
.navcontents {
    display: block;
    padding:0px;
    margin:0px;
    margin-top:-2px; 
    border-left: 1px #CACACA solid;
    border-right: 1px #CACACA solid;
    background: #FAF8F8;
    color: #414141;
    line-height: 130%;
    font-size: 12px;
}

.navcontents a {
    color: #414141;
    font-weight: bold;
}   

.navcontents p {
    padding:5px;
    padding-left:10px;
    margin: 0px;
}

/* this is the div for the bottom and draws the bottom left corner of the box */

.navbottom {
    background: url("../../images/navbox_bottomleft.gif") no-repeat bottom left;
    height: 8px;
    font-size: 0px;
    line-height: 0px;
    display:block;
    margin:0px;
    margin-bottom:10px;
    padding:0px;
}

/* this is what draws the rest of the bottom */

.navbottom .closer {
    background: url("../../images/navbox_bottom.gif") no-repeat bottom right;
    height:8px;
    margin:0px;
    margin-left:16px;
    padding: 0px;    
    display:block;
    font-size:0px;
    line-height: 0px;

}
/* end navbox code */

#main {
    float: left;
    width: 540px;
    text-align: left;
    margin-left:10px;
    margin-right: 10px;
    margin-bottom:10px;
    display: block;
}

#main img {margin: 2px;}

#main ul {
    list-style: square;
    font-size: 0.9em;
    margin-top: 0px;
    padding-top: 0px;
}

#main p {
    font-size: 0.9em;
    line-height: 140%;
    margin-bottom: 4px;
    }
/* this rule creates the subscript effect*/
#main p em, #main a em, #main td em {
    font-size: 0.7em;
    font-style: normal;
    vertical-align:sub;
}

#main .destination_text {
    width: 260px;
    float: right;
    display: block;
}

#main .subpage_div {
    margin-top: 15px;
}

#main h1 {
    font-size: 1.3em;
}

#main .products {
    float: right;
    margin-right:5px;
}

#main .productsbox {
    width: 300px;
    display: block;
}

#main .productsbox .navtop {
    background: url("../../images/navbox_topleft_nobull.gif") no-repeat top left;
}


#main .productsbox .navtop h2 {
    margin-left: 5px;
}

#main .productsbox .navcontents p {
    padding:5px;
    font-size: 1em;
    margin: 0px;
    }

#main .productsbox .col1 { 
    width: 150px;
}

#main td {
vertical-align: top;
}

#footer {
    width: 745px;
    background: #F7F7F7 url("../../images/footer_bg.gif") repeat-x bottom;
    border: 1px #ABABAB solid;
    height: 50px;
    margin: 10px auto 0px auto;
    font-size: 11px;
    display: block;
}

#footer .footernavigation {
    padding-top: 5px;
}
#footer a {
    color: #000;
}


#contactform
{
    width: 500px;
    font-size: 100%;

}

#contactform .formfield
{
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 8px;
    clear: both;
    border-top: 1px #ddd solid;
    background: #fff url("../../images/form_bg.jpg") no-repeat;

}

#contactform .col1, #contactform .wide
{
    text-align: center;
    font-size: 11px;
    margin-right: 18px;
    font-weight: bold;
    text-align: left;
    float: left;
}

#contactform table {
    margin-left: 20px;
    margin-bottom: 20px;
}

#contactform td {
    font-size: 11px;
    border-right: 1px #ddd solid;
    padding: 4px;
}

#contactform .col1
{
    width: 120px;
}

#contactform .input input
{
    width: 140px;
}

#contactform .data input
{
    width: 30px;
}


#contactform .multiline textarea
{
    width: 174px;
}

#contactform .wide
{
    padding-left: 12px;
}

#contactform .Components {
    background-image: url("../../images/div_form_bg.jpg");
}

#contactform .checkbox {
    float: left;
    clear: left;
    background-image: none;
    border: none;
    padding-left: 150px;
    width: 200px;
}

#contactform .Acid_Gases .col2 {
    width: 300px;
}

#contactform .widemultiline textarea
{
    width: 352px;
}

#contactform .submit
{
    text-align: center;
}

#contactform .submit input {
    border: 3px double #999999;
    border-top-color: #CCCCCC;
    border-left-color: #CCCCCC;
    padding: 0.25em;
    background-color: #EEEEEE;
    background-image: url("../../images/background_form_element.jpg");
    background-repeat: repeat-x;
    color: #333333;
    font-size: 100%;
    font-weight: bold;
    font-family: Verdana, Helvetica, Arial, sans-serif;
}

#main .selection_guide {
    border: 1px #999 solid;
    margin-bottom: 15px;
    width: 99%;
}

#main .selection_guide td {
    border-bottom: 1px #ccc solid;
    border-right: 1px #ccc solid;
    background: url("../../images/td_bg.jpg") no-repeat bottom right;
    padding: 2px;
}

#main .selection_guide .col1 td {
    font-weight: bold;
}
    

#main .selection_guide .header td {
    font-weight: bold;
    text-align: center;
background: #eee;
}

#main .selection_guide em {
    font-size: 0.8em;
    font-style: normal;
    vertical-align:sub;
}
/*These are a Hack for displaying fraction in specs for products Series 3500 and Series 2500*/
#fraction_table td { vertical-align: middle;padding:0;margin:0;}
#fraction_table table {margin:0;padding:0;}

#maincontent #video-callout p {
	padding:0 20px 15px;
	margin:0;
}
#maincontent #video-callout a {
	font-size:14px;
	line-height:14px;
}