@charset "utf-8";

/*
-----------------------------------------------------------------------------------------
MAGNET 2009 - PRICING GUIDE

--------------
CONTENTS
--------------
## KITCHEN HEADERS
## PROMO BANNER
## GENERIC ITEM
## NEWS ITEMS
## TRENDS & INNOVATIONS ITEMS

-----------------------------------------------------------------------------------------
*/

small { font-size: 0.7em; }

/*  ## KITCHEN HEADERS  ---------------------------------------------------*/
.screen {
  position: relative;
}
.screen-content {
  height: auto;
}
.wish-list #nav,
.uniquely-magnet-kitchens #nav,
.purely-magnet-kitchens #nav,
.essentially-magnet-kitchens #nav {
  margin-top: -8px;
}
.kitchen-detail #nav {
  margin-top: 0;
}
.kitchens-list {
  margin: 0 31px 0 35px;
  min-height: 452px;
  overflow: hidden;
  position: relative;
  width: 928px;
}
.kitchens-list .hgroup {
  display: inline;
  float: left;
  height: 222px;
  margin: 0 8px 8px 0;
  overflow: hidden;
  text-indent: -3000em;
  width: 224px;
}
.kitchens-list .hgroup a {
  position: absolute;
  top: 0;
  left: 0;
  height: 222px;
  margin: 0 8px 8px 0;
  overflow: hidden;
  text-indent: -3000em;
  width: 224px;
}
.kitchens-list ul.items li {
  background-color: grey;
  display: inline;
  float: left;
  height: 222px;
  margin: 0 8px 8px 0;
  position: relative;
  width: 224px;
}
.kitchens-list .last {
  margin: 0 0 8px 0;
}
.kitchens-list .bottom li {
  margin: 0 8px 0 0;
}
.kitchens-list .bottom li.last {
  margin: 0;
}
.kitchens-list ul.items li a {
  float: left;
}
.uniquely-magnet-kitchens div.hgroup {
  background: url(/stat/hdr-kitchens-uniquely-02-224x222.gif) no-repeat 0 0;
}
.purely-magnet-kitchens div.hgroup {
  background: url(/stat/hdr-kitchens-purely-02-224x222.gif) no-repeat 0 0;
}
.essentially-magnet-kitchens div.hgroup {
  background: url(/stat/hdr-kitchens-essentially-02-224x222.gif) no-repeat 0 0;
}

.js-active #nav {
  margin-top: 0;
}
.js-active .kitchens-list {
  visibility: hidden;
  height: 452px;
}
.js-active .kitchens .section {
  clear: none;
  float: left;
  width: 928px;
  height: 452px;
  margin-right: 8px;
}
.kitchens .items a,
.kitchens .row a {
  display: inline;
  float: left;
  height: 222px;
  margin: 0 8px 8px 0;
  overflow: hidden;
  position: relative;
  text-decoration: none;
  width: 224px;
}
.kitchens .items a span.name,
.kitchens .row a span.name {
  background-color: #000000;
  bottom: -26px;
  color: #FFFFFF;
  display: block;
  font-size: 75%;
  height: 20px;
  padding: 4px 25px 2px;
  position: absolute;
  right: 0;
  text-align: right;
  text-transform: uppercase;
}
.uniquely-magnet-kitchens .kitchens a span.name {
  background:transparent url(/stat/bg-swatch-80-uniquely.png);
}
.purely-magnet-kitchens .kitchens a span.name {
  background:transparent url(/stat/bg-swatch-80-purely.png);
}
.essentially-magnet-kitchens .kitchens a span.name {
  background:transparent url(/stat/bg-swatch-80-essentially.png);
}
.wish-list .kitchens a span.name {
  background:transparent url(/stat/bg-swatch-80-wish-list.png);
}
.kitchens a:hover span.name,
.kitchens a:focus span.name,
.kitchens a:active span.name {
  bottom: 0;
}
.js-active .kitchens a:hover span.name,
.js-active .kitchens a:focus span.name,
.js-active .kitchens a:active span.name {
  bottom: -26px;
}
.activeScroller .kitchens-list {
  width: 928px
}
.activeScroller .kitchens {
  position: absolute;
  width: 300000em;
  height: 452px;
}
.activeScroller .kitchens .section {
  width: 928px;
}


/*  ## PROMO/BANNER  -------------------------------------------------------------*/
.screen-content {
  height: 452px;
}
.screen-content .banner {
  height: 452px;
  left: 35px;
  position: absolute;
  width: 920px;
}
.banner .hgroup {
  background: url(/stat/pricing-guide-banner/bg-hgroup.png) no-repeat 0 0;
  height: 452px;
  left: 0;
  position: absolute;
  top: 0;
  width: 224px;
}
.banner .hgroup h1,
.banner .hgroup h2,
.rows p {
  display: none;
}
.banner .rows {
  height: 452px;
  position: absolute;
  right: 0;
  top: 0;
  width: 685px;
}
.rows h3,
.rows h3 a {
  display: block;
  height: 144px;
  width: 144px;
}
.rows h3 a {
  left: 0;
  margin: 0;
  overflow: hidden;
  position: absolute;
  text-decoration: none;
  text-indent: -3000em;
  top: 0;
}
.rows img {
  left: 0;
  margin: 0;
  position: absolute;
  top: 0;
}
.rows .uniquely {
  border-right: 15px solid #a8a8a8;
  height: 144px;
  left: 0;
  position: absolute;
  top: 0;
  width: 670px;
}
.rows .uniquely h3 a {
  background: url(/stat/pricing-guide-banner/u-text.png) no-repeat 0 0;	
}
.rows .uniquely img.a {
  left: 154px;
}
.rows .uniquely img.b {
  left: 527px;
}
.rows .purely {
  border-left: 15px solid #5c98a2;
  border-right: 15px solid #5c98a2;
  height: 144px;
  left: 0;
  position: absolute;
  top: 154px;
  width: 655px;
}
.rows .purely h3 a {
  background: url(/stat/pricing-guide-banner/p-text.png) no-repeat 0 0;	
  left: 139px;
}
.rows .purely img.a {
  left: 0;
}
.rows .purely img.b {
  left: 293px;
}
.rows .essentially {
  border-left: 15px solid #750220;
  border-right: 15px solid #750220;
  height: 144px;
  left: 0;
  position: absolute;
  top: 308px;
  width: 655px;
}
.rows .essentially h3 a {
  background: url(/stat/pricing-guide-banner/e-text.png) no-repeat 0 0;	
  left: 293px;
}
.rows .essentially img.a {
  left: 0;
}
.rows .essentially img.b {
  left: 447px;
}


/*  ## PAGE CONTENT 'IN SALE'  --------------------------------------------------*/
.pricing-guide #content .main-content {
  width: 438px;
}
.pricing-guide #content .section {
  margin: 0;
  width: 100%;
}
.pricing-guide #content .secondary-content {
  width: 310px;
}
.pricing-guide #content .secondary-content div {
  margin-bottom: 20px;
}
.pricing-guide #content .secondary-content h2 {
  font-size: 156.25%;
  margin-bottom: 0;
}
.pricing-guide #content .secondary-content h3 {
  margin-bottom: 5px;
  text-transform: none;
}
.pricing-guide #content .secondary-content .uniquely h2 a,
.pricing-guide #content .secondary-content .uniquely h3 {
  color: #a8a8a8;
}
.pricing-guide #content .secondary-content .uniquely h2 a {
  background: url(/stat/pricing-guide-banner/u-heading.png) no-repeat center center;
  display: block;
  height: 55px;
  text-indent: -9999px;
}
.pricing-guide #content .secondary-content .purely h2 a,
.pricing-guide #content .secondary-content .purely h3 {
  color: #5c98a2;
}
.pricing-guide #content .secondary-content .purely h2 a {
  background: url(/stat/pricing-guide-banner/p-heading.png) no-repeat center center;
  display: block;
  height: 55px;
  text-indent: -9999px;
}
.pricing-guide #content .secondary-content .essentially h2 a,
.pricing-guide #content .secondary-content .essentially h3 {
  color: #750220;
}
.pricing-guide #content .secondary-content .essentially h2 a {
  background: url(/stat/pricing-guide-banner/e-heading.png) no-repeat center center;
  display: block;
  height: 55px;
  text-indent: -9999px;
}

/** Tables **/

#content table {
  border-collapse: collapse;	
  width: 100%;
}
#content table td,
#content table th {
  border-bottom: 2px solid #0D0D0D;
  background-color: #666;
  color: white;
  padding: 5px 10px;
  font-size: 105.5%;
  text-transform: uppercase;
}
#content table td.price,
#content table th.price {
  text-align: right;
}
#content table th {
  background-color: #333;	
}
#content table td a {
  color: #FFF;
}
#content table td a:hover {
  text-decoration: none;
}
#content table tr:hover td {
  cursor: pointer;
}

.uniquely-magnet-kitchens #content table th     { background-color:rgb(165,165,165); }
.uniquely-magnet-kitchens #content table td     { background-color:rgb(165,165,165); }

.purely-magnet-kitchens #content table th       { background-color:rgb(89,151,162); }
.purely-magnet-kitchens #content table td       { background-color:rgba(89,151,162, 0.8); }

.essentially-magnet-kitchens #content table th  { background-color:rgb(115,2,32); }
.essentially-magnet-kitchens #content table td  { background-color:rgb(115,2,32); }

.uniquely-magnet-kitchens     #table-of-kitchens tr:hover td { background-color:rgb(165,165,165); }
.purely-magnet-kitchens       #table-of-kitchens tr:hover td { background-color:rgb(73,123,123); }
.essentially-magnet-kitchens  #table-of-kitchens tr:hover td { background-color:#396A67; }

/*  ## KITCHEN DETAIL PRICES  ---------------------------------------------------*/
#content #prices {
  width: 757px;
}
#prices .section {
  float: right;
  width: 605px;
  margin: 0;
}
#prices .section caption {
  display: none;
}
#table-of-kitchen-prices {
  width: 100%;
}
#content #table-of-kitchen-prices th {
  padding:        8px 10px;
  border-left:    1px solid #0D0D0D;
  border-bottom:  1px solid #0D0D0D;
  font-size:      13px;
  text-align:     center;
  text-transform: uppercase;
  line-height:    1;
}
#table-of-kitchen-prices thead tr th:first-child { -moz-border-radius-topleft: 32px; -webkit-border-top-left-radius: 32px; border-radius-topleft: 32px; }
#table-of-kitchen-prices tbody tr th:first-child { width: 120px; }
#table-of-kitchen-prices em {
  display:    block;
  font-style: normal;
  font-size:  12px;
}
#content #table-of-kitchen-prices td {
  padding: 10px;
  text-align:     center;
  border-left:    1px solid #0D0D0D;
  border-bottom:  1px solid #0D0D0D;
}
.uniquely-magnet-kitchens #table-of-kitchen-prices td {
  background-color: #607D4B;
}

#table-of-kitchen-prices strike { text-decoration: none; }
.uniquely-magnet-kitchens     #table-of-kitchen-prices tr td strike { color:rgba(255,255,255, 0.3); font-size: 14px; }
.purely-magnet-kitchens       #table-of-kitchen-prices tr td strike { color:rgba(255,255,255, 0.3); font-size: 14px; }
.essentially-magnet-kitchens  #table-of-kitchen-prices tr td strike { color:rgba(255,255,255, 0.3); font-size: 14px; }

#table-of-kitchen-prices #retail-price-row th,
#table-of-kitchen-prices #sale-price-row th {
  border-left: 0;
  text-align: right;
  font-size: 13px;
}
#table-of-kitchen-prices .unit-small  { background: url(/stat/units_vsmall.jpg) no-repeat center top; background-color:#FFF; height: 80px;}
#table-of-kitchen-prices .unit-medium { background: url(/stat/units_small.jpg) no-repeat center top; background-color:#FFF; height: 80px;}
#table-of-kitchen-prices .unit-large  { background: url(/stat/units_medium.jpg) no-repeat center top; background-color:#FFF; height: 80px;}

.uniquely-magnet-kitchens #table-of-kitchen-prices #retail-price-row th, 
.uniquely-magnet-kitchens #table-of-kitchen-prices #sale-price-row th { background-color: rgb(165,165,165); }

.purely-magnet-kitchens #table-of-kitchen-prices #retail-price-row th,
.purely-magnet-kitchens #table-of-kitchen-prices #sale-price-row th { background-color: rgb(89,151,162); }

.essentially-magnet-kitchens #table-of-kitchen-prices #retail-price-row th, 
.essentially-magnet-kitchens #table-of-kitchen-prices #sale-price-row th { background-color: rgb(115,2,32); }


.uniquely-magnet-kitchens #table-of-kitchen-prices th.hover,
.uniquely-magnet-kitchens #table-of-kitchen-prices td.hover { background-color: rgb(165,165,165); cursor:default;}

.purely-magnet-kitchens #table-of-kitchen-prices th.hover,
.purely-magnet-kitchens #table-of-kitchen-prices td.hover { background-color: rgb(73,123,123); cursor:default;}

.essentially-magnet-kitchens #table-of-kitchen-prices th.hover,
.essentially-magnet-kitchens #table-of-kitchen-prices td.hover { background-color: rgb(115,2,32); cursor:default;}

#table-of-kitchen-prices tr td {
  font-size: 18px;
}

div.finance-options {
  border-top: 1px solid #333;
  margin: 3px 0px 3px 0px;
  padding: 20px 1px 20px 1px !important;

}


/*-- Pricing guide flash container - not needed when new pricing guide HTML version goes live --------------*/
#pricing-guide {	
  height: 493px;
}
.pricing-guide .banner div#sale-message {
  background: url(/stat/homepage-banners/price-guide.png) no-repeat 0 0;
  height: 159px;
  left: 65px;
  overflow: hidden;
  position: absolute;
  text-indent: -3000em;
  top: 20px;
  width: 290px;
  z-index: 2;
}


/*-- Pricing HTML Holding Page when not 'In Sale' --------------*/
div.price-guide div.main-content {
  padding: 30px 0 60px 0 !important;
  width: 390px !important;
}
div.price-guide div.main-content h1 {
  color: #DDA400 !important;
  font-size: 25px !important;
  line-height: 27px;
}
div.price-guide div.main-content h2 {
  color: #607D46 !important;
  line-height: 35px !important;
}
div.price-guide div.main-content h2+h2 {
  color: #A73B21 !important;
}
div.price-guide div.main-content h2+h2+h2 {
  color: #38716F !important;
}
div.price-guide div.secondary-content {
  width: 500px !important;
}
div.price-guide div.secondary-content p {
  float: left;
  margin: 60px 0 0 25px;
  width: 160px;
}
div.price-guide div.secondary-content p.lozenge {
  color: #000000;
  height: 300px;
  margin: 0;
  position: relative;
  width: 300px;
}
div.price-guide div.secondary-content p.lozenge span {
  background: url(/images/price_guide_apology_300x300.png) no-repeat;
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}