/*
colors:
yellows, dark to light:
644714 / b2802e / f2a832
*/

/* START: base elements */
body { 
margin: 0;
padding: 0;
background: #666 url(/img/body-bg.png) top left repeat-x;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
border: none;
font-family: Arial, Helvetica, sans-serif;
letter-spacing: normal;
}
p, ul, ol, li {
margin: 0;
padding: 0;
color: #333;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
line-height: 11px;	
}
a         { font-weight: normal; text-decoration: underline; }
a:link    { color: #dc992c; }
a:visited { color: #dc992c; }
a:hover   { color: #999; text-decoration: none; }
a:active  { color: #999; text-decoration: none; }
/* END: base elements */

img.inline {
	display:inline;
}

/* h1 replacement for header */
#header h1 {
padding: 118px 0 0 0;
height: 0px !important;
height /**/:118px; /* IE hack */
overflow: hidden;
background-image: url(/img/osi-header-logo-v3.png);
background-repeat: no-repeat;
}

/* START: layout */
#wrap { 
margin: 0; 
padding: 0;
width: 1020px;
background: url(/img/wrap-bg.png) top left repeat-y;
}
#wrap-in-home { 
margin: 0 20px;
padding: 0;
text-align: left;
}
#wrap-in {
margin: 0 20px;
padding: 0;
text-align: left;
background: url(/img/wrap-in-sub-bg.gif) top left repeat-y;
}

/* START: header content */
#header {
margin: 0;
padding: 0;
width: 980px;
/* v1: height: 166px; */
/* v2: height: 138px; */
height: 118px;
position: relative;
background: url(/img/header-bg-v3.png) top left no-repeat;
border-bottom: 2px solid #000;
}
#header a {
text-decoration: none;
}
#header-left, #header-right {
margin: 0;
padding: 0;
position: absolute;
width: 220px;
}
#header-left {
bottom: 23px;
left: 500px;
}
#header-right {
bottom: 25px;
left: 740px;
}
#header p {
padding: 0 0 5px 0;
color: #eee;
line-height: 11px;	
}
.distLink {
margin: 0;
padding: 0;
background: url(/img/header-sm-arrow.png) 82% 44% no-repeat;
}

/* these holders force the content to align bottom */
#h-pushdown-holder {
margin: 0;
padding: 0;
width: 220px;
border: none;
position: relative;
}
#h-pushdown {
margin: 0;
padding: 0;
border: none;
position: absolute;
bottom: 0px;
left: 0px;
}
/* /these holders force the content to align bottom */

/* END: header content */


/* START: main holders */
#main {
margin: 0 0 0 20px;
padding: 0;
float: left;
width: 700px;
}
#main-in {
margin: 0;
padding: 20px;
text-align: left;
}

/* home flash / content is 694 x 394 */
#home-flash-holder {
	border: 1px solid #999;
	margin: 20px 0 20px 0;
	padding: 2px;	
}
/* /home flash */

/* home */
#main-home-feature {
margin: 0;
padding: 0;
}
/* /home */

/* subs */
#main-left {
margin: 0;
padding: 0;
float: left;
width: 200px;
font-size: 0px;
line-height: 0px;
}
#main-right {
margin: 0;
padding: 0;
float: right;
width: 440px;
font-size: 0px;
line-height: 0px;
}


/* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */
/* FLIP left and right divs for individual product pages */
/* 
In these holder divs, ONLY the float has been changed.
There will be divs labeled "right," in the left column, and vice-versa.
This is so the divs INSIDE these holder divs will keep the same name, and no need to create all new internal divs.
*/
#main-left-flip {
margin: 0;
padding: 0;
float: right;
width: 340px;
font-size: 0px;
line-height: 0px;
}
#main-right-flip {
margin: 0;
padding: 0;
float: left;
width: 300px;
font-size: 0px;
line-height: 0px;
}
/* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */


/* show-hide content */
#show-hide-holder, #static-right-holder {
margin: 0 0 20px 0;
padding: 0;
border: none;
width: 440px;
}

#static-right-holder-in {
margin: 0;
padding: 5px;
border: 1px solid #666;
}

#show-hide-content-three, #show-hide-content-four, #show-hide-content-five {
margin: 0;
padding: 10px;
border: 1px solid #666;
}
#show-hide-content-one {
/*z-index: 5;*/
}
#show-hide-content-two {
/*z-index: 10;*/
}
#show-hide-content-three {
/*z-index: 15;*/
}
#show-hide-content-four {
/*z-index: 20;*/
}
#show-hide-content-five {
/*z-index: 25;*/
}
#show-hide-content-one {
margin: 0;
padding: 0;
border-top: none;
}
/* /show-hide content */

#show-hide-content-two {
margin: 0;
padding: 10px 0px 0px 0px;
border-top: 1px solid #666;
}

#why {
margin: 0;
padding: 10px;
border: 1px solid #666;
}

/* /show-hide content */


/*
cross-browser border-padding box model
the content size forces the correct holder size, 
with border and padding, omitting the need for an IE box-model hack 
*/
#main-right-visual-holder-img {
border: 1px solid #666;
margin: 0;
padding: 5px;
}
#main-right-visual-holder-flash {
border: 1px solid #666;
margin: 0;
padding: 0;
}
#main-right-visual-holder-products {
border: 1px solid #666;
margin: 0;
padding: 10px;
}
/* 
padding + sizes:
images: 5px padding / image size: 428w x 288h *images / graphics with white BG should include 10px of border space in them* 
flash modules: 0 padding / flash files: 438w x 298h *Flash files should include 10px of border space in them*
products: 10px padding / product display module width: 418w x (no height)
*/

/* product display module */
#main-right-product {
margin: 0 0 20px 0;
padding: 0;
border-bottom: 1px solid #666;
}
#main-right-product-img {
margin: 0; padding: 0;
float: left;
width: 300px
}
#main-right-product-links {
margin: 0; padding: 0;
float: right;
}
/* /product display module */


/* product description holder */
#product-description-holder {
margin: 0;
padding: 0;
background-color: #efe0ca;
}
#product-description-holder p {
margin: 0; 
padding: 15px;
}
/* /product description holder */


#ie-fix-holder {
/* 
zero attributes in ie-fix files
use this when ie adds white-space under divs
*/
}

#main-horizline, #main-horizline-light {
margin: 0;
padding: 0;
border: none;
width: 100%;
}
#main-horizline {
background: url(/img/horizline.gif) top left repeat-x;
height: 21px;
max-height: 21px;
}

/* special case for QUAD CCR pages only */
#main-horizline-quad {
background: url(/img/horizline.gif) bottom left repeat-x;
height: 17px;
max-height: 21px;
}

#main-horizline-light {
background: url(/img/horizline-light.gif) top left repeat-x;
height: 7px;
max-height: 7px;
}
/* /subs */

/* brands */
#main-brands {
position: relative;
margin: 20px 0 0 0;
padding: 0;
width: 700px;
height: 160px;
background: url(/img/brands-bg-v2.png) top left no-repeat;
}
#main-brands .osi, #main-brands .quad, #main-brands .winteq, #main-brands .green  {
margin: 0;
padding: 0 0 0 10px;
position: absolute;
top: 0px;
height: 140px;
width: 175px;
}
#main-brands .osi  {
left: 0px;
}
#main-brands .quad  {
left: 175px;
}
#main-brands .winteq  {
left: 350px;
}
#main-brands .green  {
left: 525px;
}
.brand-link {
margin: 0;
padding: 0;
width: 150px;
height: 50px;
}
#main-brands p {
color: #999;
line-height: 14px;
}
#main-brands p a {
color: #f2a832;
font-size: 10px;
text-decoration: none;
}
#main-brands p a:hover {
color: #333;
}
/* /brands */

/* END: main holders */


/* START: sidebar holders */
#sidebar {
margin: 0 20px 0 0;
padding: 0;
float: right;
width: 220px;
}
#sidebar-in {
margin: 0;
padding: 0 20px 20px 20px;
text-align: left;
}
#sidebar-in-home {
margin: 0;
padding: 20px 0;
text-align: left;
}

/* sidebar For the Pros nav is in nav.css */

/* misc sidebar stuff */
#dot-line {
border-top: 1px dotted #999;
border-right: 0px;
border-bottom: 0px;
border-left: 0px;
margin: 3px 0;
}
#home-spotlight-holder {
border: 1px solid #999;
margin: 0;
padding: 4px;	
}
#home-spotlight-left, #home-spotlight-right {
margin: 0; 
padding: 0;
width: 100px;
height: 100px;
}
#home-spotlight-left {
float: left;
}
#home-spotlight-right {
float: right;
}
/* /misc sidebar stuff */

/* END: sidebar holders */


/* START: footer content */
#footer {
margin: 20px auto;
padding: 0;
width: 940px;
background-color: #000;
text-align: center;
border: 1px solid #ccc;
}
#footer p { color: #666; }
#footer p a { text-decoration: none; }
#footer-bottom {
margin: 0;
padding: 0;
width: 1020px;
height: 40px;
background: #666 url(/img/footer-bottom.png) bottom left no-repeat;
}


p.copy-bottom-credit { 
color: #666; 
}
p.copy-bottom-credit a         { font-weight: normal; text-decoration: none; }
p.copy-bottom-credit a:link    { color: #666; }
p.copy-bottom-credit a:visited { color: #666; }
p.copy-bottom-credit a:hover   { color: #666; }
p.copy-bottom-credit a:active  { color: #666; }


.footer-logo {
width: 160px;
padding-left: 55px;
background: url(/img/henkel-header-logo.png) top left no-repeat;
text-align: left;
}

.partner-holders {
margin: 20px 0 10px 0;
padding: 0;
width: 604px;
height: 90px;
position: relative;
}
.ph-pss, .ph-pl, .ph-lt, .ph-gg {
margin: 0;
padding: 0;
position: absolute;
}
.ph-pss {
top: 5px;
left: 0px;
width: 124px;
height: 50px;
}
.ph-pl {
top: 0px;
left: 164px;
width: 88px;
height: 60px;
}
.ph-lt {
top: 5px;
left: 292px;
width: 147px;
height: 50px;	
}
.ph-gg {
top: 0px;
right: 0px;
width: 125px;
height: 60px;	
}

.clearfix {
margin: 0px;
padding: 0px;
border: none;
border: 0px;
height: 0px;
max-height: 0px;
font-size: 0px;
line-height: 0px;
clear: both;
}
/* END: footer content */

/* END: layout */


/* START: styles */
.copy {
padding-bottom: 10px;
line-height: 14px;
}
#main h2 {
font-size: 21px;
line-height: 21px;
color: #644714;
font-weight: bold;
}
#main h2 a,         #main h3 a         { font-weight: bold; text-decoration: none; }
#main h2 a:link,    #main h3 a:link    { color: #644714; }
#main h2 a:visited, #main h3 a:visited { color: #644714; }
#main h2 a:hover,   #main h3 a:hover   { color: #f2a832; }
#main h2 a:active,  #main h3 a:active  { color: #f2a832; }

#main h2.brands {
margin: 0;
padding: 15px 0 5px 0;
border-bottom: 1px solid #999;
font-size: 21px;
line-height: 21px;
color: #fff;
font-weight: normal;
}
#main h2.brands a:link    { color: #fff; }
#main h2.brands a:visited { color: #fff; }
#main h2.brands a:hover   { color: #f2a832; }
#main h2.brands a:active  { color: #f2a832; }

#main h3 {
padding-bottom: 10px;
font-size: 17px;
line-height: 19px;
color: #644714;
font-weight: bold;
}

#main h3.extras {
padding-bottom: 5px;
}

#main h3.npb {
padding-bottom: 3px;
}

#main h3.prodinfo {
padding: 10px 0px 2px 0px;
}

#main h3.box {
padding: 0px 0px 10px 0px;
}

#main h3.box2 {
padding: 10px 0px;
}


#main h4 {
padding-bottom: 10px;
font-size: 13px;
line-height: 14px;
color: #644714;
text-transform: uppercase;
font-style: italic;
}
#main h4 a         { font-weight: normal; text-decoration: none; }
#main h4 a:link    { color: #644714; }
#main h4 a:visited { color: #644714; }
#main h4 a:hover   { color: #f2a832; }
#main h4 a:active  { color: #f2a832; }

#main h5 {
padding-bottom: 10px;
font-size: 13px;
line-height: 15px;
color: #b2802e;
}

#sidebar h2 {
margin: 0;
padding: 20px 0 0 0;
font-size: 17px;
line-height: 19px;
color: #f2a832;
font-weight: bold;
}
#sidebar p {
color: #fff;	
}
#sidebar p a         { font-weight: normal; text-decoration: none; }
#sidebar p a:link    { color: #eee; }
#sidebar p a:visited { color: #eee; }
#sidebar p a:hover   { color: #999; }
#sidebar p a:active  { color: #999; }

#main-right-product-links p, .switch {
font-size: 10px;
line-height: 12px;
}
#main-right-product-links p a, .switch a { text-decoration: none; }

#main-right-product-links p {
padding-bottom: 2px;
}

.switch {
padding-bottom: 10px;
}

#main-right-product-links p.doc {
line-height: 14px;
background: url('/img/download-doc-icon.gif') center left no-repeat;
padding: 0 0 0 12px; 
}

#seo-text h5 {
margin: 0;
padding: 20px 0 3px 0;
font-size: 12px;
line-height: 12px;
color: #999;	
}
#seo-text h5 a         { font-weight: bold; text-decoration: none; }
#seo-text h5 a:link    { color: #999; }
#seo-text h5 a:visited { color: #999; }
#seo-text h5 a:hover   { color: #ccc; }
#seo-text h5 a:active  { color: #ccc; }

#seo-text p {
margin: 0;
padding-bottom: 40px;
font-size: 10px;
line-height: 13px;
color: #999;	
}
#seo-text p a         { font-weight: normal; text-decoration: none; }
#seo-text p a:link    { color: #999; }
#seo-text p a:visited { color: #999; }
#seo-text p a:hover   { color: #ccc; }
#seo-text p a:active  { color: #ccc; }

ul.left-features {
margin: 0 0 0 15px;
padding: 0;
list-style-type: disc;
}
ul.left-features li {
margin: 0; padding: 0;
line-height: 14px;
}

ol.left-directions {
margin: 0 0 0 17px;
padding: 0;
list-style-type: decimal;
}
ol.left-directions li {
margin: 0; padding: 0;
line-height: 14px;
}
#home-spotlight-right p {
line-height: 13px;
}
#home-spotlight-right p a:link {
color: #f2a832;
}
#home-spotlight-right p a:hover {
color: #999;
}
#home-spotlight-right h4 {
margin: 0;
padding: 3px 0;
font-size: 15px;
line-height: 15px;
color: #f2a832;
}

/* END: styles */


/* style amends (must always appear AFTER general style settings) */
#main-right-product h4 {
line-height: 13px;
padding-bottom: 2px;
border-bottom: 1px solid #ccc;
margin-bottom: 7px;
}
/* /style amends */


/* START: form stuff */
input, select {
margin: 0;
padding: 0;
border: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px; 
line-height: 10px; 
font-weight: normal;
color: #333;
}

.admin {
	border: 1;
	background-color: #ccc;
}

#searchform {
margin: 0;
padding: 2px;
width: 190px;
height: 16px;
background-color: #ccc;
}
/*
#wtbform {
margin: 0;
padding: 2px;
width: 140px;
font-family: Verdana, sans-serif;
font-size: 10px;
line-height: 10px;
border: 1px solid #444;
}
*/
#dd {
width: 220px;
/*height: 20px;*/
margin: 0 0 3px 0;
padding: 1px;
background-color: #ccc;
border: 1px solid #ccc;
}

input.rr {
margin: 0 0 10px 0;
padding: 3px;
border: 1px solid #666;
background-color: #eee;
width: 200px;
}

/*
.formTwo {
width: 310px;
height: 100px;
margin: 0;
padding: 2px 0px 2px 2px;
background-color: #fff;
border: 1px solid #444;
color: #333;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px; 
line-height: 12px; 
font-weight: normal;
}
.formThree {
width: 295px;
height: 100px;
margin: 0 0 5px 0;
padding: 2px 0px 2px 2px;
background-color: #fff;
border: 1px solid #444;
color: #333;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px; 
line-height: 12px; 
font-weight: normal;
}
.formFour {
width: 295px;
height: 100px;
margin: 0;
padding: 2px 0px 2px 2px;
background-color: #fff;
border: 1px solid #444;
color: #333;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px; 
line-height: 12px; 
font-weight: normal;
}
.dd {
width: 150px;
margin: 0 0 5px 0;
padding: 2px 0px 2px 2px;
background-color: #fff;
border: 1px solid #444;
font-color: #333;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px; 
line-height: 12px; 
font-weight: normal;
}
.ddRfp {
width: 295px;
margin: 0 0 5px 0;
padding: 2px 0px 2px 2px;
background-color: #fff;
border: 1px solid #444;
font-color: #333;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px; 
line-height: 12px; 
font-weight: normal;
}
.cb {
margin: 0 5px 0 0;
padding: 0;
}
*/

/* END: form stuff */




