html, body
    {
    height: 100%;
    }

body
    {
    background: #F2F2F2;
    font-family: Arial, Helvetica, Verdana, sans-serif;
    font-size: 75%;
    line-height: 1.2em;
    margin: 0;
    padding: 0;
    color: #666;
    }

table, tr, td, input, select, textarea, ol, ul
    {
    font-family: Arial, Helvetica, Verdana, sans-serif;
    font-size: 100%;
    }

a img, img
    {
    border: 0;
    }

a
    {
    color: #83ACD6;
    text-decoration: underline;
    }

a:hover, a.active
    {
    text-decoration: none;
    background: #DDE8F4;
    color: #3B88D7;
    }

h1, h2, h3
    {
    color: #83ACD6;
    font-family: Arial narrow, Arial, Helvetica, Verdana, sans-serif;
    line-height: 1.1em;
    }
h1
    {
    font-size: 2.4em;
    font-weight: normal;
    padding: 0 0 .4em 0;
    margin: 0;
    clear: both;
    }

h2
    {
    font-size: 1.8em;
    margin: 1.6em 0 .3em 0;
    font-weight: normal;
    margin-left: 30px;
    }

h3
    {
    font-family: Arial, Helvetica, Verdana, sans-serif;
    font-size: 1.5em;
    margin: 1em 0 .3em 0;
    font-weight: normal;
    margin-left: 0px;
    line-height: 1.2em;
    }

h4
    {
    font-family: Arial, Helvetica, Verdana, sans-serif;
    font-size: 1.1em;
    margin: 1.7em 0 0;
    font-weight: bold;
    color: #4A4A2A;
    }

.hide
    {
    position: absolute;
    left: -2000px;
    }


p
{
    margin: .5em 10% 1em 0;
    line-height: 1.3em;
}

ul
    {
    list-style: square;
    }

li
{
    margin: 0 0 0 0;
}

td#util, #util_index {
    width: 582px;
    background: #83ACD6 url(/images/utility-bg.gif) right repeat-y;
    }
/*td#util_index {
    width: 565px;
    background: #83ACD6 url(/images/utility-homepage-bg.gif) right repeat-y;
    }*/

td#util_index div.utility_wrapper,
td#util div.utility_wrapper {
    position: relative;
    width: 582px;
    }

/** search **/

div#search label {
    font-family: Arial narrow, arial, sans-serif;
    white-space: nowrap;
    float: left;
    clear: both;
    top: -15px;
    border-bottom: none;
    color: #fff;
    font-size: 1.167em;
    margin: 0;
    padding: 0 10px;
    }

div#search {
    background: transparent url('/images/search-bg.gif') no-repeat 0 100%;
    position: absolute;
    width: 195px;
    height: 37px;
    left: 221px;
    bottom: 7px;
    }
td#util div#search {
    left: 247px;
    bottom: 7px;
    }

form.search_form input.text {
    float: left;
    background: none;
    border: none;
    margin: -4px 0;
    padding: 2px 0 1px 10px;
    width: 136px;
    color: #717b84;
    font-family: arial, sans-serif;
    font-size: 0.917em;
    outline: none;
    }
form.search_form input.search_button {
    float: right;
    width: 38px;
    height: 23px;
    display: block;
    margin-top: -7px;
    margin-right: 7px;
    }



/** utility nav **/
ul#utility_nav
    {
    margin: 0 0 5px 1em;
    text-align: left;
    width: 115px;
    list-style: none;
    padding: 0 0 1px 0;
    }
ul#utility_nav li
    {
    margin: .5em 0;
    padding: 0;
    width: 115px;
    }
ul#utility_nav li a
    {
    font-family: arial narrow, arial, sans-serif;
    color: #fff;
    text-transform: uppercase;
    font-size: .85em;
    line-height: 1.1em;
    text-decoration: none;
    }
ul#utility_nav a:hover
    {
    text-decoration: underline;
    background: none;
    }



td#sidenav
    {
    padding: 30px 0 20px 13px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    background: #eee url(/images/sidenav_bg.gif) repeat-y left;
    width:  204px;
    table-layout: fixed;
    }

td#sidenav ul
    {
    list-style: none;
    /*margin: 0 0 0 13px;*/
    width: 224px;
    padding: 0;
    margin: 0;
    text-transform: uppercase;
    border-top: 1px solid #fff;
    border-bottom:  1px solid #fff;
    }

td#sidenav ul ul, td#sidenav ul ul ul  {
    border:  none;
}

td#sidenav li
    {
    margin: 0;
    padding: 0 0 0 13px;
    color:  #999;
    font-size: 11px;
    line-height: 2em;
    width: 211px;
    }

td#sidenav li li
    {
    width: 191px;
    }

td#sidenav li li li
    {
    width: 178px;
    }

td#sidenav li.category {
    padding-top:  5px;
    padding-bottom: 5px;
    width:  209px;
    overflow:  hidden;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

td#sidenav li.category_one_line {
    padding-top:  5px;
    padding-bottom: 5px;
    width:  209px;
    overflow:  hidden;
    border-bottom: 1px solid #fff;
}

td#sidenav ul ul li {
    padding-left: 0;
}

/* 2nd level Nav */
td#sidenav ul li ul li a {
    padding-left: 20px;
}

td#sidenav ul li ul li a:hover {
    padding-left: 20px;
}


/* 3rd level Nav */
td#sidenav ul  ul  ul li a, td#sidenav ul  ul  ul li a:hover {
    padding-left: 40px;
}

td#sidenav li li a:hover, td#sidenav li li li a.active {
    padding-left: 40px
}

td#sidenav li a
    {
    font-family: arial, helvetica, sans-serif;
    display: block;
    font-size: 12px;
    padding: 7px 0;
    color: #6699cc;
    text-decoration: none;
    line-height: 1em;
    background: none;
    text-transform: capitalize;
    }

td#sidenav li a:hover, td#sidenav li a.active
    {
    text-decoration: none;
    color: #000;
    }

   /* subnav styles */

td#sidenav ul ul /* 3rd level */
    {
    padding: 0 0 0 0;
    margin: 0 0 5px 0px;

    }

td#sidenav li li a
    {
    display:  block;
    color: #6699cc;
    padding: 2px 5px;
    margin: 0 6px;
    margin-left: 0px;
    font-weight: normal;
    width: 102px; /* if no width specified IE stuffs up the list spacing something awful */
    voice-family: "\"}\"";
    voice-family: inherit;
    width: auto;
    line-height: 1.45em; /* spacing 3rd level */
    }

td#sidenav li li a:hover, td#sidenav li li a.active
    {
    color: #000;
    padding: 2px 5px;
    padding-left: 20px;
    }

td#sidenav ul li ul li {
    border:  none;
}

.display
    {
    position: relative;
    float: right;
    margin: 1em;
    border: 6px solid #8D7495;
    }

#banner
{
    background-color: #eee;
    height: 100px;
width: 582px;
position: relative;
}

#banner img
{
    width: 582px;
    height: 100px
}


#banner div.overlay,
#banner_index div.overlay {
    height: 100px;
    width: 129px;
    position: absolute;
    right: 0;
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
    background: transparent url('/images/overlay-bg.png') repeat;
/*background: #233f46 url('/images/modal-bg.png') 0 0 repeat;
    opacity: .9;
    filter:Alpha(Opacity=90);
    */
    }

* html #banner div.overlay,
* html #banner_index div.overlay {
    filter:Alpha(Opacity=25);
    }

#banner div.overlay {height: 100px;}
#banner_index div.overlay {height: 176px;}


#banner_index
{
    background-color: #eee;
    height: 176px;
    width: 582px;
    position: relative;
    }

#banner_index img
{
    width: 582px;
    height: 176px
}


td p.range_description
{
    width: 422px;
    color: #758FAA;
    font-size: 1em;
}

td.body_content
{
    background:#f2f2f2 url(/images/inside_grey_strip.gif) repeat-y;
    border-top: 1px solid #fff;
}
table.listing
{
    background-color: #fff;
    width: 582px;
}
.listing h3
{
    font-size: 1.1em;
}

.listing td
    {
    padding: 12px 10px 12px 20px;
    border-bottom: 1px solid #F0F0F0;
    }

.listing thead td
    {
    border-right: 1px solid #fff;
    }
.listing tr:last-child td
    {
    border-right: 1px solid #fff;
    }

.listing .right_bg
{
    background-color: #f8f8f8;
    padding: 1em 0;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #eee;
    width: 129px;
    voice-family: "\"}\"";
    voice-family: inherit;
    width: 130px;
width: 129px;
}

.listing p
    {
    /*  margin-right: 50px; */
    margin: 0 0 1em 0;
    font-size: .95em;
    }

.listing h2
    {
    font-size: 1.6em;
    color: #666;
    margin: 0 50px .3em 0;
    }

a.more
    {
    color: #83ACD6;
    text-transform: uppercase;
    font-size: .9em;
    line-height: 1.3em;
    background: url(/images/arrow.gif) 0 .4em no-repeat;
    padding: 0 0 0 14px;
    margin: 0 33px .3em 4px;
    display: block;
    }

a.more:hover
    {
    text-decoration: none;
    color: #3B88D7;
    background-color: #DDE8F4;
    }

dt
    {
    color: #000;
    }

dd
    {
    margin: 0 0 .5em 0em;
    }

.content_padding
{
    width: 410px;
    margin: 1em 0 2em 20px;
}

fieldset
    {
    position: relative;
    display: block;
    color: #000;
    font-weight: bold;
    margin: 20px 0 20px 0;
    background: #ddd;
    padding: 10px;
    border: 1px solid #8D7495;
    }

label
    {
    display: block;
    position: relative;
    margin: 10px 0;
    color: #333366;
    padding: 6px 220px 6px 6px;
    border-bottom: 1px dotted #fff;
    font-weight: normal;
    }

label input, label select
    {
    position: absolute;
    right: 10px;
    top: 0;
    }


/* Form */

table.no_border td,
table.no_border td.right_bg {
    border: none;
}

table.no_border form {
    position: relative;
    top: -2em;
}

form ul {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 1px solid #f0f0f0;
    padding-top: 4px;
}

form ul li {
    clear: both;
    border-bottom: 1px solid #f0f0f0;
    padding: 0px 0px 2px 6px;
}

form li label {
    float: left;
    padding: 6px 0 0;
    width: 136px;
    margin: 0;
    color: #666;
}

form li input, form li textarea {
    color: #666;
    width: 195px;
    height: 20px;
    border: none;
    background: transparent url('/images/bg-input.png') no-repeat 0 0;
    padding: 8px 12px 0;
}

form li input.input_small {
    width: 15px;
    background: transparent url('/images/bg-input-small.png') no-repeat 0 0;
}

form li textarea.input_textarea {
    width: 195px;
    height: 156px;
    background: transparent url('/images/bg-input-textarea.png') no-repeat 0 0;
    border: none;
    overflow: auto;
}

form input.input_submit {
    width: 87px;
    height: 37px;
    background: transparent url('/images/button-submit.png') no-repeat 0 0;
}

form input.input_submit:hover {background-position: 0 -37px;}


#footer
    {
    background-color: #fff;
    font-size: .9em;
    margin: 0 25px 0 210px;
    padding: 10px 0 14px 0;
    border-top: 1px solid #eee;
    }

#footer div
{
    width: 750px;
    text-align: center;
}
.top
    {
    position: absolute;
    bottom: 50px;
    right: 10%;
    }

/* staff */

#staff {
    width: 100%;
    float: left;
    margin-bottom: 1em;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 24px;
}

#staff p {
    line-height: 24px;
}

#staff a {
    color: #336699;
    font-weight: bold;
    text-decoration: none;
}

#staff a.highlight {
    border-bottom: 1px solid #95AFC8;
}

#staff a:focus, #staff a:hover, #staff a:active {
    background: none;
    border-bottom: 1px solid #95AFC8;
}

#staff .member {
    background: #F8F8F8;
    clear: both;
    float: left;
    width: 100%;
    margin-bottom: 20px;
    line-height: 18px;
}

#staff .member p {
    line-height: 18px;
}

#staff .text {
    width: 230px;
    float: left;
}

#staff .navigation {
    list-style: none;
    float: right;
    margin: 0;
    padding: 0;
    width: 168px;
    height: 38px;
}

#staff .navigation li {
    margin: 0;
    padding: 0;
}

#staff .navigation a {
    margin: 0;
    padding: 0;
    display: block;
    text-indent: -999em;
    height: 38px;
    border: none;
}

#staff .navigation li.previous a {
    width: 92px;
    background: transparent url(/images/bg-previous.gif) no-repeat 0% 0%;
    float: left;
}

#staff .navigation li.next a {
    width: 76px;
    background: transparent url(/images/bg-next.gif) no-repeat 0% 0%;
    float: right;
}

#staff .header {
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 25px;
}

#staff.list {
    margin-top: 20px;
}

#staff.list .image {
    width: 131px;
    height: 131px;
    float: left;
    position: relative;
}

#staff.list .image img.overlay {
    position: absolute;
    top: 0;
    left: 0;
}

#staff.list .image img.thumb {
    margin: 6px 0 0 13px;
}

#staff.view .image {
    background: transparent url(/images/bg-staff-view-image.gif) no-repeat 0% 0%;
    width: 169px;
    height: 210px;
    float: left;
    position: relative;
}

#staff.view .image img {
    display: block;
}

#staff.view .image img.overlay {
    position: absolute;
    top: 0;
    left: 0;
}

#staff.view .image img.main {
    margin: 6px 0 0 6px;
}

#staff .title {
    float: right;
    width: 230px;
    position: absolute;
    bottom: 0;
    right: 0;
}

#staff h2 {
    margin: 0 0 10px;
    padding: .5em 0 .3em;
    width: 100%;
    border-bottom: 1px solid #bbb;
}

#staff h2 a {
    color: #83ACD6;
    font-weight: normal;
}

#staff h2 a:hover, #staff h2 a:hover, #staff h2 a:hover {
    border-bottom: none;
}


#staff h2.faq {
    margin-top: 20px;
}

#staff h3 {
    color: #555;
    font-size: 16px;
    font-weight: bold;
    margin: 0;
    padding: 0;
}

#staff .content {
    clear: both;
}

#staff dt, #staff dd {
    padding-left: 37px;
    margin-bottom: 25px;
}

#staff dt {
    color: #336699;
    font-weight: bold;
    background: transparent url(/images/bg-question.gif) no-repeat 0% 2px;
}

#staff dd {
    background: transparent url(/images/bg-answer.gif) no-repeat 0% 2px;
}

#whats_new {
    background: green;
    margin: 0;
    padding: 0;
}

#whats_new tr{
}
#whats_new td {
    margin: 0;
    padding: 0;
    outline: 1px solid blue;

}

a#go_green {
    background: url(/images/go-green-button.gif) 0 0 no-repeat;
    display: block;
    width: 207px;
    height: 37px;
    text-indent: -9999px;
    margin: 20px 0 0 0;
}

a#go_green:hover {
    background: url(/images/go-green-button.gif) 0 0 no-repeat;
    background-position: left bottom;
    margin: 20px 0 0 0;
}


/* Recent Press */
a.pdf {
    background: url(/images/pdf.gif) left no-repeat;
    padding: 3px 0 2px 25px;
}

.press_date {
    color: #333;
}

.recent_press {
    padding: 5px 0 0 20px;
}


/* Search results */

h2.search_heading {
    margin-top: 0.95em;
    margin-bottom: 0.9em;
    font-size: 1.5em;
    color: #83acd6;
    }
h2.search_heading span {
    color: #2a689b;
    }
span.number_of_results {
    float: left;
    }
ul.pagination {
    float: right;
    margin: 0;
    padding: 0 6px 0 0;
    list-style-image: none;
    list-style: none;
    }
ul.pagination li {
    float: left;
    margin: 0;
    padding: 0;
    font-size: 0.917em;
    padding-left: 6px;
    }
ul.pagination li a {
    text-decoration: none;
    }
ul.pagination li a:hover {
    background: none;
    }
ul.pagination li.current,
ul.pagination li.current a {
    font-weight: bold;
    color: #666;
    }
ul.pagination li.prev,
ul.pagination li.next {
    text-transform: uppercase;
    font-family: Arial narrow, Arial, Helvetica, Verdana, sans-serif;
    }
ul.pagination li.prev a,
ul.pagination li.next a {
    text-decoration: underline;
    }


p.categories a {
    color: #83ACD6;
    font-size: .917em;
    line-height: 1.3em;
    background: url('/images/arrow.gif') 0 0.2em no-repeat;
    padding: 0 0 0 14px;
    margin: 0 6px .3em 4px;
    display: inline;
    text-decoration: none;
    text-transform: none;
    white-space: nowrap;
    }

p.categories a:hover {
    text-decoration: none;
    color: #3B88D7;
    background-color: #DDE8F4;
    }


div.sidenav_icons {padding: 25px 0 10px 30px; position: relative; width: 194px;}
div.sidenav_icons a {float: left;}
div.sidenav_icons a.facebook {position: absolute; right: 11px; top: 25px;}
div.sidenav_icons a.naturalproducts { margin-top: 15px; }
div.sidenav_icons a.enviromark {position: absolute; right: 11px; top: 80px;}


/*****************=Clearfix************* */

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
* html .clearfix {
    zoom: 1; /* triggers hasLayout */
    }
    
/**-- Customer comments --**/
div.customer_comment p {
    margin-bottom: 0px;
}
div.customer_comment p.author_location {
    margin-top: 0px;
    margin-bottom: 15px;
}

.hide_comment {
    display: none;
}

div#customer_comment_wrap div.customer_comment {
    /*position: absolute;*/
    /*width: 370px;*/
    margin-bottom: 20px;
    background-color: #fff;   
}

h2#home_intro_header {
    border-top: 1px solid #F0F0F0; 
    padding-top: 15px; 
    margin: 2.7em 0 .8em;
}

/* liScroll styles */
h4#customer_comments {
	margin: 24px 0 0;
	color: #999999;
	position: absolute;
	top: 275px;
	left: 262px;
	}
	
h4#customer_comments a {
    text-decoration: none;
}	
	
#ticker {
	/** Hiding this way off screen until it formats into a news feed style **/
	position: absolute;
    left: -5000px;
}	
.tickercontainer { /* the outer div with the black border */
border: none;
background: #fff; 
width: 452px; 
height: 44px; 
padding: 0;
overflow: hidden;
position: absolute;
top: 315px;
left: 237px;
margin-bottom: 0;

}
.tickercontainer .mask { /* that serves as a mask. so you get a sort of padding both left and right */
position: relative;
top: 8px;
width: 718px;
overflow: hidden;
}
ul.newsticker { /* that's your list */
position: relative;
left: 27px;
list-style-type: none;
margin: 0;
padding: 0;

}
ul.newsticker li {
float: left; /* important: display inline gives incorrect results when you check for elem's width */
margin: 0;
padding: 0;
background: #fff;
}
ul.newsticker p {
white-space: nowrap;
padding: 0;
margin: 0 50px 0 0;
} 
ul.newsticker span {
margin: 0 10px 0 0;
}