/* PNG FIX */
img.headerOverlay		            { behavior:url("/common/htc/iepngfix.htc"); }

html, body							{ height: 100%; margin-bottom:1px; }
html								{  }
body, div, p, form, img  			{ margin:0; padding:0; border:0; }
ul									{ margin:0; padding:0; }

/* Set Font Info */
body, div, td, p					{ font-family:arial, sans-serif; font-size:12px; line-height:16px; color:#626262; }
a									{ font-family: arial, sans-serif; font-size:12px; color:#626262; text-decoration: none; }
a:hover								{ color:#000000; text-decoration:none; }

a.arrowDown                         { background:url('../images/bullet-arrowdown.gif') no-repeat 0 2px; padding-left:11px; }
a.arrowRight                        { background:url('../images/bullet-arrowRight.gif') no-repeat center right; padding-right:13px; }

div#canvas          { margin:0 auto; width:800px; background:#FFFFFF url(../images/bg-canvas.gif) repeat-y 0 0;  }

div#header          { position:relative; z-index:1; top:-1px; left:0; width:800px; height:218px; }
div#header img.headerOverlay    { position:absolute; top:0; left:0; z-index:1; width:800px; height:192px; }
div#header img.headerKeyVisual  { position:absolute; top:63px; left:0; }

#nav                 { position:absolute; z-index:1; top:192px; left:1px; width:100%; height:26px; }

#nav ul              { list-style-type:none; margin:2px 0 0 0; padding:0; width:798px; background-color:#ffffff; }
#nav li              { float:left; margin:0; padding:0; height:22px; border-left:1px dotted #aaaaaa; cursor:pointer; }
#nav li.first        { border:none; }
#nav li a            { display:block; margin:5px 17px 0 17px; font-size:9px; text-transform:uppercase; }

#nav ul.subnav                 { display:none; position:absolute; top:25px; width:auto; border-left:1px solid #d6d6d6; border-right:1px solid #d6d6d6; border-bottom:1px solid #d6d6d6; }
#nav ul.subnav li              { float:none; margin:0; padding:0; position:relative; border-left:none; border-top:1px dotted #aaaaaa; background-color:#ffffff; }
#nav ul.subnav li              /* IE hack */ { float:left; clear:left; }

#nav ul.subsubnav                 { display:none; position:absolute; top:-3px; width:auto; }
#nav ul.subsubnav li              { float:none; border-left:none; border-top:1px dotted #aaaaaa; background-color:#ffffff; }
#nav ul.subsubnav li              /* IE hack */ { float:left; clear:left; }
#nav ul.subsubnav li.first        { border-top:1px solid #d6d6d6; }

div#content                     { float:none; padding-top:2px; margin-left:1px; width:798px; background:#FFFFFF url(../images/bg-content.gif) repeat-x 0 0; }

div#footer                      { margin:0 auto; width:800px; height:65px; border-top:1px solid #bfbfbf; text-align:center; }
div#footer div                  { padding-top:5px; font-size:10px; }
div#footer div a                { font-size:10px; }



/* containment approach for div's with floated children */
.clearfix:after 					{ content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix							{ display: inline-block; }
html[xmlns] .clearfix 				{ display: block; }
* html .clearfix 					{ height: 1%; }
.clearMe							{ overflow:hidden; width:100%; }

/* Separator to clear floats */
.clearing {
  clear: both;
}

/* Common */
h3                      { padding:0; margin:0; color:#474747; font-size:13px; line-height:16px; font-weight:bold; }

li.arrowRight           { background:transparent url('../images/bullet-arrowRight.gif') no-repeat bottom right; padding-right:13px; }

.contentColumn          { float:left; width:265px; border-right:1px solid #d6d6d6; }
.contentColumn div      { padding:16px 23px 16px 23px; }

.contentColumn.left         {  }
.contentColumn.mid div      { padding:16px 10px 16px 10px; border-bottom:1px solid #d6d6d6; }
.contentColumn.mid div.last { border-bottom:none; }
.contentColumn.right        { border-right:none; }

.contentColumn div.grayPane { margin-bottom:16px; padding:9px 15px 9px 15px; background-color:#efefef; border:1px solid #d6d6d6; }
.contentColumn div.grayPane.last { margin-bottom:0px; }


.introLargeCopy         { padding-bottom:29px; color:#474747; font-size:17px; line-height:21px; font-weight:bold; }
.copyHeading            { font-size:12px; line-height:21px; font-weight:bold;  }


/* Homepage */
#homepage .contentColumn   { height:365px; }
#homepage .right img       { margin-bottom:18px; }
#homepage .right img.last  { margin-bottom:0px; }

#homepage div.grayPane     { height:138px; }
#homepage .tryme           { font-size:9px; }





/* --------------------------------------------------------------------------------------------------------------------- */
/* -------------------------- THE FOLLOWING ARE OLD STYLES COPIED FROM BEFORE THE PHASE 1 REFRESH ---------------------- */
/* --------------------------------------------------------------------------------------------------------------------- */



/* Content */
div#ko-content {
  width: 730px;
  padding: 0 0 0 24px;
  color:#000000;
}

#ko-content a,
#ko-catalog a {
    color:#0033CC;
    text-decoration:underline;
}

#ko-content a:hover,
#ko-catalog a:hover {
  color: #0033CC;
}

#content #ko-catalog,
#content #ko-catalog a {
    font-size:9px;
}

#ko-content h1 {
    margin:11px 0 11px;
}

#ko-content h2 {
    margin:10px 0 0px;
}

div#ko-content p {
    
}

/*
#ko-content div,
#ko-content td,
#ko-content p {
  color:#000000;
}
*/

/* Fix IE. Hide from IE Mac \*/
* html div#ko-content { width: 750px; }
/* End */

div#ko-section {
  width: 400px;
}
div#ko-section h2 {
  height: 20px;
}
div#ko-section > h2 {
  height: 40px;
}
div#ko-section_ws {
  width: 600px;
}
div#ko-section_ws h2 {
  height: 20px;
}
div#ko-section_ws > h2 {
  height: 40px;
}

div.ko-story div {
  position: relative;
  margin: 5px 155px 0 0;
  left: -5px;
}

div.ko-line {
  height: 15px;
  margin: 0 0 0 10px;
}
#ko-presslinks {
  width: 180px;
  float: right;
  text-align: right;
  margin: 40px 7px 0 0;
  padding: 0;
}
#ko-sidebar {
  width: 110px;
  float: right;
  text-align: right;
  margin: 0 7px 0 0;
  padding: 0;
}
/* Home page */
div#ko-mainhome {
  float: left;
  width: 430px;
  margin: 0;
  padding: 0;
}

div#ko-main {
  float: left;
  width: 457px;
  margin: 0;
  padding: 0;
}

div#ko-latest {
  float: right;
  width: 230px;
  margin: 0 15px 0 0;
  padding: 0;
  display: inline;
}

div#ko-latest h2 {
  height: 14px;
}
div#ko-latest > h2 {
  height: 30px;
}
div#ko-latest li {
  margin-left: 20px;
}

div#ko-promo {
  position:absolute;
  top:142px;
  left:447px;
  width:305px;
  height:431px;
}

div#ko-promo img {
  behavior: url("/common/htc/iepngfix.htc");
}

/* Fix IE. Hide from IE Mac \*/
* html div#ko-latest li { margin-left: 20px; }
/* End */

/* Bathroom designer */
div#ko-designer {
  margin: 0 0 0 10px;
  padding: 20px 0 0 0;
  width: 420px;
}
div#ko-designer div {
  position: relative;
  margin: 0 200px 0 0;
  left: -5px;
}
#ko-designer-img {
  float: right;
  margin: 0 0 0 5px;
        padding: 0 0 0 14px;
}
.ko-designer-shot {
  margin: 0;
  padding: 0 0 0 5px;
}

#ko-designer-tryme {
  float:right;
  position: relative;
  margin: 0 0 0 0;
  top: -7px;
    left:0px;
}

/* Catalog */
div#ko-catalog {
  width: 654px;
  margin-left: 100px;
}

div#ko-catalog ul {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style-type: none;
  clear: both;
  position: relative;
  left: -2px;
  vertical-align: middle;
}

div#ko-catalog li {
  float: left;
  width: 124px;
  overflow: hidden;
}

.ko-catalog-title li {
  width: 122px;
}

/* Prodcut closeup */
#ko-product {
  width: 600px;
  float: left;
}

#ko-product img {
  float: left;
  margin-top: 50px;
  z-index: 1;
}

#ko-product div {
  margin: 100px 0 0 0;
  width: 190px;
  float: right;
  font-size:10px;
  color:#000000;
}

#ko-product a {
  font-size:10px;
}

/* Fix IE. Hide from IE Mac \*/
* html #ko-product div { width: 190px; }
/* End */

#ko-product li {
  margin-left: 15px;
}

#ko-product div#ko-product-logo {
	margin:60px 0 0 0;
	padding:0px;
}

#ko-product div#ko-product-logo img {
	float:left;
	margin:0 0 10px 10px;
	padding:0;
}

div#ko-nav ul li {
  position: relative;
}

div#ko-nav > ul li ul {
  position: absolute;
  left: 0px; /* Set 1px less than menu width */
  top: 17px;
  display: none;
  margin: 0;
  z-index: 10;
}

div#ko-nav > ul li ul li ul {
  position: absolute;
  left: 110px; /* Set 1px less than menu width */
  top: 0px;
  display: none;
  margin: 0;
  z-index: 10;
}
.ko-nav-ul-li-ul a {
  display: block;
  width: 100px;
}

div#ko-nav > ul ul li a, div#ko-nav > ul ul li {
  display: block;
  width: 100px;
}

.ko-nav-ul-li-ul {
  position: absolute;
  left: 0px; /* Set 1px less than menu width */
  top: 17px;
  display: none;
  margin: 0;
  z-index: 10;
  /*width: 100px;*/
}
.ko-nav-ul-li-ul-li-ul {
  position: absolute;
  left: 100px; /* Set 1px less than menu width */
  top: 0;
  height: 0;
  display: none;
  margin: 0;
  z-index: 11;
  /*width: 100px;*/
}

/* Fix IE. Hide from IE Mac \*/
* html .ko-nav-ul-li { float: left; height: 1%; z-index: 100; }
* html .ko-nav-ul-li-ul-li { float: left; height: 1%;  z-index: 100; }
* html .ko-nav-ul-li-ul-li-ul-li { float: left; height: 1%; z-index: 100;  }
* html .ko-nav-ul-li-a { height: 1%; z-index: 100;  }
* html .ko-nav-ul-li-ul-li-a { height: 1%; z-index: 100;  }
* html .ko-nav-ul-li-ul-li-ul-li-a { height: 1%; z-index: 100;  }
/* End */
* html #ko-nav ul.ko-hidden {
  display: none;
}

#ko-sitemap {
  padding: 10px;
}

#ko-sitemap ul {
  margin-left: 25px;
  padding: 3px;
}

#ko-sitemap li {
  margin-left: 15px;
  padding: 2px;
}





/* General style */

input {
  font-family: 'arial', helvetica, sans-serif;
  font-size: 10px;
}

#ko-content p,
#ko-product p,
#ko-section p {
  padding: 5px;
}

/* The navigation style */
#ko-nav {
  color: #333;
  font-family: 'arial black', helvetica, sans-serif;
  font-size: 7px;
}

#ko-nav > ul > li {
  border-right: solid 1px #999;
  cursor: pointer;
}
#ko-nav > ul > li > a {
  color: #333;
  text-decoration: none;
}

.ko-nav-ul-li-a, .ko-nav-ul-li-a-highlight {
  color: #333;
  text-decoration: none;
  cursor: pointer;
}
.ko-nav-ul-li, .ko-nav-ul-li-highlight {
  border-right: solid 1px #999;
  cursor: pointer;
  color: #333;
}

/* The trail style */
#ko-trail {
  font-family: 'arial', helvetica, sans-serif;
  font-size: 10px;
}

#ko-crumbs {
}

#ko-search input {
  margin: 6px 3px;
  padding: 0;
  border: 1px solid #ccc;
}

#ko-search span {
  color: #78B;
  font-size: 11px;
}

#ko-search img {
  padding: 0;
}

/* Content */
div#ko-content h1 {
  font-family: "Helvetica Neue", "Arial CE", Arial, Helvetica, Sans-Serif;
  color: #78B;
  font-size: 16px;
}
div.ko-storyhome {
  border: 1px solid #ffd05c;
  padding: 0;
}
div.ko-story {
  border: 1px solid #ffd05c;
  padding: 0;
}

div.ko-story p {
  padding: 12px;
}

div.ko-story div {
  font-family: "Helvetica Neue", "Arial CE", Arial, Helvetica, Sans-Serif;
  font-weight: bold;
  font-size: 12px;
  color: #333;
  background: #ffd05c;
  padding: 2px 0 2px 5px;
}

div.ko-line {
  border-left: 1px solid #ffd05c;
}

/* Home page */
#ko-main, #ko-mainhome {
  font-family: "Helvetica Neue", "Arial CE", Arial, Helvetica, Sans-Serif;
  color: #666;
  font-size: 12px;
}
/* The footer style */
#ko-footer {
  font-family: Arial, Helvetica, Sans-Serif;
  color: #999;
  font-size: 9px;
  font-weight: bold;
}

#ko-footer a {
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
  font-weight: bold;
}

.ko-footer {
  color: #999;
  text-decoration: none;
  font-weight: bold;
}

.ko-footer-highlight {
  color: black;
  font-size: 9px;
  font-weight: bolder;
}

/* Bathroom designer */
div#ko-designer {
  border-left: 1px solid #ffd05c;
  border-bottom: 1px solid #ffd05c;
}

div#ko-designer div {
  font-family: 'Arial black', helvetica, sans-serif;
  font-weight: bold;
  font-size: 8px;
  color: #333;
  background: #ffd05c;
  padding: 2px 0 2px 5px;
}

div#ko-designer p {
  padding: 12px;
}

/* Latest news */
#ko-latest {
  background: #ffedbf;
  font-family: "Helvetica Neue", "Arial CE", Arial, Helvetica, Sans-Serif;
  font-size: 11px;
  color: #666;
}

#ko-latest h2 {
  background: #3069b0 no-repeat right center;
  color: #ffd05c;
  padding: 14px 0 0 12px; /* IE Fix overriden by child selector below */
  font-size: 11px;
}
div#ko-latest > h2 {
  line-height: 43px;
  padding: 0 0 0 10px;
}

.ko-latest-title {
  color: #333333;
}

/* Section */
div#ko-section,
div#ko-section p {
  font-family: 'arial', helvetica, sans-serif;
  font-size: 11px;
  color: #999;
}

div#ko-section a {
    font-size:11px;
}

div#ko-section h2 {
  color: #ffd05c;
  font-size: 11px;
  padding: 20px 0 0 10px; /* IE Fix overriden by child selector below */
}
div#ko-section > h2 {
  line-height: 60px;
  padding: 0 0 0 10px;
}

div#ko-section span {
  color: white;
}

/* Catalog */
#ko-catalog {
  font-family: "Helvetica Neue", "Arial CE", Arial, Helvetica, Sans-Serif;
  font-size: 9px;
  border-left: 1px solid #ffd05c;
  background: transparent;
  z-index: 10;
}

#ko-catalog ul {
  padding: 0 1px;
}

#ko-catalog li {
  padding: 2px;
}

.ko-catalog-title li {
  background: #ffd97e;
  border-bottom: solid 1px #ca7;
  border-right: solid 1px #ca7;
  text-align: center;
}

/* Product page */
#ko-product {
  font-family: "Helvetica Neue", "Arial CE", Arial, Helvetica, Sans-Serif;
  font-size: 10px;
  padding: 3px;
  color: #333;
}

#ko-product li {
  padding: 2px 0;
  color: #666;
}

#ko-product p {
  background: #ffd05c;
  font-size: 12px;
  padding: 4px 5px 2px 5px;
  margin: 0;
  font-weight: bold;
  color: #333;
}

#ko-sidebar {
  font-family: "Helvetica Neue", "Arial CE", Arial, Helvetica, Sans-Serif;
  font-size: 11px;
}
#ko-presslinks, #ko-presslinks div {
  font-family: "Helvetica Neue", "Arial CE", Arial, Helvetica, Sans-Serif;
  font-size: 12px;
}
#ko-presslinks div {
  padding: 2px 3px;
  font-weight: bold;
}
#ko-sidebar li {
  padding: 4px 0;
}
#ko-presslinks li {
  padding: 4px 3px;
}
#ko-sidebar a, #ko-presslinks a {
  color: #68c;
}

#ko-sidebar ul, #ko-presslinks ul {
  list-style-type: none;
  padding: 7px 0;
}

/*
   The Popup navigation classes
   <div id="ko-nav">
    <ul>
      <li>main
        <ul>
  <li>first
            <ul>
      <li>second
*/
div#ko-nav ul ul {
  padding: 0;
  list-style: none;
  font-size: 9px;
  font-family: "Helvetica Neue", "Arial CE", Arial, Helvetica, Sans-Serif;
  font-weight: bold;
}

div#ko-nav > ul ul li ul li > a {
  background: #4671b5;
  color: white;
  border-bottom: 1px solid white;
}

div#ko-nav > ul ul li ul {
  padding: 0;
  list-style: none;
  font-size: 9px;
}

div#ko-nav > ul ul > li a {
  text-decoration: none;
  padding: 2px 5px;
  border-bottom: 1px solid green;
}

/* css 2 compliant browsers */
div#ko-nav > ul ul li > a {
  background: #f9c25b;
  color: black;
  border-bottom: 1px solid white;
}

/* non css2 compliant browsers - there are no child selectors in IE so must apply classes with javascript */
.ko-nav-ul-li-ul-li-a-highlight,.ko-nav-ul-li-ul-li-a,.ko-nav-ul-li-ul-li-ul-li-a-highlight,.ko-nav-ul-li-ul-li-ul-li-a {
  border-top: 0;
  border-left: 0;
  border-right: 0;
  padding: 2px 5px;
  text-decoration: none;
  border-bottom: 1px solid white;
}

.ko-nav-ul-li-ul-li-a-highlight {
  background: #fedea5;
  color: black;
}
.ko-nav-ul-li-ul-li-a {
  background: #f9c25b;
  color: black;
}
.ko-nav-ul-li-ul-li-ul-li-a-highlight {
  background: #7999c8;
  color: white;
}
.ko-nav-ul-li-ul-li-ul-li-a {
  background: #4671b5;
  color: white;
}

.super {
  vertical-align: super;
}

.ko-indent {
  padding: 2px 12px 5px 40px;
  margin: 0;

text-align: justify;
}





.datasheet {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
}
.caption {
  font-size: x-small;
  color: #666666;
  font-family: Arial, Helvetica, sans-serif;
}
#ko-nav > ul > li:hover {
  text-decoration: underline;
}

#ko-content a:hover {
  color: #0033CC;
}


li.print {
  background:transparent url(/MungoBlobs/bullet-printIcon.gif) no-repeat scroll 10% 50%;
}
li.print a {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
}