/*
 Shopping dos Colch›es
 
 CodeKings, www.codekings.com.br
 */

/* --- Typo --- */

@font-face { font-family: Calibri; src: url('../fonts/calibri.eot'); }
@font-face { font-family: Calibri; src: url('http://:/') format('No-IE-404'), url('../fonts/calibri.ttf') format('truetype'); }
@font-face { font-family: Calibri; src: url('../fonts/calibribold.eot'); font-weight: bold; }
@font-face { font-family: Calibri; src: url('http://:/') format('No-IE-404'), url('../fonts/calibribold.ttf') format('truetype'); font-weight: bold; }
@font-face { font-family: Calibri; src: url('../fonts/calibriitalic.eot'); font-style: italic; }
@font-face { font-family: Calibri; src: url('http://:/') format('No-IE-404'), url('../fonts/calibriitalic.ttf') format('truetype'); font-style: italic; }
@font-face { font-family: Calibri; src: url('../fonts/calibribolditalic.eot'); font-weight: bold; font-style: italic; }
@font-face { font-family: Calibri; src: url('http://:/') format('No-IE-404'), url('../fonts/calibribolditalic.ttf') format('truetype'); font-weight: bold; font-style: italic; }

/* -- */

* { margin: 0; padding: 0; }
 
html { background: #fff; color: #333; font: 100% 'Calibri', trebuchet, arial, sans-serif; }
body { font-size: .812em; }

#page {}
  header {}
  #content { padding-left: 30px; }
  footer { margin: 0 30px; padding: 18px 0; background: url('../images/border-dotted-dark.png') repeat-x left top; }

header,
footer,
section,
article,
aside,
nav { display: block; }

h1,
h2,
h3,
h4,
h5,
h6 { font-size: 1em; font-weight: normal; }

a { color: #666; text-decoration: none; }
a:hover { text-decoration: underline; }

img, 
fieldset { border: 0 none; }
:focus { outline: 0 none; }

input,
textarea,
button { font: 1em 'Calibri', trebuchet, arial, sans-serif; } 
button { cursor: pointer; }

/* -- Classes -- */

.hide { position: absolute; top: -9999em; }

.messages { margin: 15px 0; list-style: none; color: #900; font-weight: bold; }

/* -- Header -- */

header .wrap { height: 115px; padding: 6px 30px 0; background: #0e0e63 url('../images/header-background.png') repeat-x; }
header h1,
header h2 { float: left; width: 204px; height: 79px; margin-top: 21px; overflow: hidden; background: url('../images/logo.png') repeat-x; text-indent: -9999em; }
  header h1 a,
  header h2 a { display: block; height: 100%; overflow: hidden; }
header a { color: #999; }
header .social { float: right; height: 30px; }
  header .social ul { float: left; margin: 3px 20px 0 0; color: #999; text-transform: uppercase; list-style: none; }
    header .social ul li { display: inline; margin-left: 3px; }
    header .social ul li:before { content: '|'; }
    header .social ul li.first:before { content: ''; }
      header .social ul li a { margin-left: 6px; }
  header .social .share { float: left; }
header nav.secondary { clear: right; margin-left: 300px; }
  header nav.secondary ul { margin: 20px 0 5px; color: #999; }
  header nav.secondary h3 { clear: right; padding-top: 8px; background: url('../images/border-dotted-light.png') repeat-x left top; color: #e4e4e4; font: italic bold 1.385em georgia, times, serif; text-shadow: 3px 3px 5px #010144; letter-spacing: -1px; }
    header nav.secondary h3 strong { font-style: normal; }
    header nav.secondary h3 span { position: relative; }
    header nav.secondary h3 small { position: absolute; bottom: -10px; right: 0; font-size: .556em; font-weight: normal; letter-spacing: 0; text-shadow: none; }

/* -- Content -- */

#content .banner { position: relative; z-index: 5; height: 408px; margin-bottom: 40px; padding-bottom: 1px; background: url('../images/border-dotted-dark.png') repeat-x left bottom; }
  #content .banner ul { width: 990px; height: 408px; overflow: hidden; list-style: none; letter-spacing: -3px; white-space: nowrap; }
    #content .banner ul li { display: inline; }
      #content .banner ul li img { width: 990px; }

#content h1,
#content h2 { margin: 30px 0 10px; padding: 6px 8px 8px; background: #e4e4e4; font-size: 2em; }
#content h1.product,
#content h2.product { position: relative; margin: 10px 0; padding: 6px 8px 8px; background: url('../images/border-dotted-dark.png') repeat-x left bottom; font-size: 1.385em; text-transform: uppercase; }
  #content h1.product span.brand,
  #content h2.product span.brand { position: absolute; top: -25px; right: 0; display: block; padding-right: 22px; }
#content h3 { margin: 10px 0 10px; padding: 6px 8px 8px; background: url('../images/border-dotted-dark.png') repeat-x left bottom; font-size: 2em; }
#content h3.phone { margin-top: 0; padding: 6px 30px 8px; font: italic bold 1.385em georgia, times, serif; text-align: right; text-shadow: 3px 3px 5px #bbbbbc; }
#content h3.phone.colchoes-de-espuma { color: #6666cc; }
#content h3.phone.colchoes-e-conjunto-box { color: #6699cc; }
#content h3.phone.cabeceiras { color: #66cccc; }
#content h3.phone.camas-box { color: #91c55d; }
#content h3.phone.travesseiros-e-acessorios { color: #c8c82d; }
#content h3.phone.sofas-cama-e-poltronas-reclinaveis { color: #996633; }
#content h3.phone.camas-articuladas { color: #990000; }
  #content h3.phone strong { color: #0e0e63; }

#content p.breadcrumb { margin-bottom: 30px; padding: 10px; background: url('../images/border-dotted-dark.png') repeat-x left bottom; color: #0e0e63; font-style: italic; }
#content p.breadcrumb.product { margin-bottom: 10px; }
  #content p.breadcrumb.colchoes-de-espuma a { color: #6666cc; }
  #content p.breadcrumb.colchoes-e-conjunto-box a { color: #6699cc; }
  #content p.breadcrumb.cabeceiras a { color: #66cccc; }
  #content p.breadcrumb.camas-box a { color: #91c55d; }
  #content p.breadcrumb.travesseiros-e-acessorios a { color: #c8c82d; }
  #content p.breadcrumb.sofas-cama-e-poltronas-reclinaveis a { color: #996633; }
  #content p.breadcrumb.camas-articuladas a { color: #990000; }

#content article.product { overflow: hidden; padding: 0 30px 12px 0; background: url('../images/border-dotted-dark.png') repeat-x left bottom; }
  #content article.product .images { float: left; width: 454px; }
    #content article.product .images .image-wrap { width: 100%; height: 308px; overflow: hidden; }
    #content article.product .images .gallery { position: relative; width: 400px; padding: 0 27px; overflow: hidden; }
      #content article.product .images .gallery ul { overflow: hidden; white-space: nowrap; list-style: none; }
        #content article.product .images .gallery ul li { display: inline-block; width: 86px; height: 53px; }
          #content article.product .images .gallery ul li a { position: relative; }
            #content article.product .images .gallery ul li a span { display: none; position: absolute; left: 0; bottom: 0; width: 86px; height: 10px; background: #0e0e63; }
            #content article.product .images .gallery ul li a:hover span { display: block; }
      #content article.product .images .gallery > a { position: absolute; top: 20px; width: 13px; height: 13px; overflow: hidden; background: none no-repeat; text-indent: -9999em; }
      #content article.product .images .gallery > a.prev { left: 0; background-image: url('../images/gallery-prev.png'); }
      #content article.product .images .gallery > a.next { right: 0; background-image: url('../images/gallery-next.png'); }
  #content article.product .details { margin-left: 475px; }
    #content article.product .details ul.tabs { height: 28px; list-style: none; text-align: right; }
      #content article.product .details ul.tabs li { float: left; height: 18px; margin-right: 8px; padding: 4px 10px 6px 6px; background: #666; font-weight: bold; text-transform: uppercase; }
      #content article.product .details ul.tabs li:hover { background: #333; }
        #content article.product .details ul.tabs li a { color: #fff; }
        #content article.product .details ul.tabs li a:hover { text-decoration: none; }
          #content article.product .details ul.tabs li a .icon { display: inline-block; width: 13px; height: 13px; margin-right: 8px; vertical-align: -3px; }
          #content article.product .details ul.tabs li.buy a .icon { background: url('../images/buy-icon.png') no-repeat; }
      #content article.product.colchoes-de-espuma .details ul.tabs li.active,
          #content article.product.colchoes-de-espuma .details ul.tabs li a .icon { background-color: #6666cc; }
      #content article.product.colchoes-e-conjunto-box .details ul.tabs li.active,
          #content article.product.colchoes-e-conjunto-box .details ul.tabs li a .icon { background-color: #6699cc; }
      #content article.product.cabeceiras .details ul.tabs li.active,
          #content article.product.cabeceiras .details ul.tabs li a .icon { background-color: #66cccc; }
      #content article.product.camas-box .details ul.tabs li.active,
          #content article.product.camas-box .details ul.tabs li a .icon { background-color: #91c55d; }
      #content article.product.travesseiros-e-acessorios .details ul.tabs li.active,
          #content article.product.travesseiros-e-acessorios .details ul.tabs li a .icon { background-color: #c8c82d; }
      #content article.product.sofas-cama-e-poltronas-reclinaveis .details ul.tabs li.active,
          #content article.product.sofas-cama-e-poltronas-reclinaveis .details ul.tabs li a .icon { background-color: #996633; }
      #content article.product.camas-articuladas .details ul.tabs li.active,
          #content article.product.camas-articuladas .details ul.tabs li a .icon { background-color: #990000; }
    #content article.product .details .tab { padding: 8px 0; background: #efefef; border-top: 8px solid #ccc; }
      #content article.product .details .tab p { padding: .25em 18px; }
      #content article.product .details .tab table { width: 100%; border: 0 none; border-collapse: collapse; font-size: .923em; }
        #content article.product .details .tab table th { padding: 3px 4px; color: #0e0e63; text-align: left; }
        #content article.product .details .tab table td { padding: 3px 4px; }
          #content article.product .details .tab table tr.even td { background: #fff; }
    #content article.product.colchoes-de-espuma .details .tab { border-color: #6666cc; }
    #content article.product.colchoes-e-conjunto-box .details .tab { border-color: #6699cc; }
    #content article.product.cabeceiras .details .tab { border-color: #66cccc; }
    #content article.product.camas-box .details .tab { border-color: #91c55d; }
    #content article.product.travesseiros-e-acessorios .details .tab { border-color: #c8c82d; }
    #content article.product.sofas-cama-e-poltronas-reclinaveis .details .tab { border-color: #996633; }
    #content article.product.camas-articuladas .details .tab { border-color: #990000; }

#content section.products { overflow: hidden; }
  #content section.products article { position: relative; float: left; width: 450px; height: 125px; margin: 0 10px 10px 0; padding: 8px; background: #efefef; }
    #content section.products article .image-wrap { float: left; width: 210px; height: 125px; margin-right: 15px; background: #fff; }
    #content section.products article h3 { margin: 0; padding: 0; background: transparent; font-size: 1.231em; font-weight: bold; text-transform: uppercase; }
      #content section.products article h3 a { color: #333; }
    #content section.products article h4 { text-transform: uppercase; }
      #content section.products article h4 a { color: #333; }
    #content section.products article p.price { margin-top: .5em; font-weight: bold; }
    #content section.products article ul { position: absolute; left: 233px; bottom: 8px; list-style: none; }
      #content section.products article ul li { float: left; margin-right: 8px; padding: 4px 10px 6px 6px; font-weight: bold; text-transform: uppercase; }
        #content section.products article ul li a {}
          #content section.products article ul li a .icon { display: inline-block; width: 13px; height: 13px; margin-right: 8px; vertical-align: -3px; }
      #content section.products article ul li.info { background: #e4e4e4; }
        #content section.products article ul li.info a {}
          #content section.products article ul li.info a .icon { background: url('../images/info-icon.png') no-repeat; }
      #content section.products article ul li.buy { background: #666; }
        #content section.products article ul li.buy a { color: #fff; }
          #content section.products article ul li.buy a .icon { background: url('../images/buy-icon.png') no-repeat; }
          #content section.products article.colchoes-de-espuma ul li a .icon { background-color: #6666cc; }
          #content section.products article.colchoes-e-conjunto-box ul li a .icon { background-color: #6699cc; }
          #content section.products article.cabeceiras ul li a .icon { background-color: #66cccc; }
          #content section.products article.camas-box ul li a .icon { background-color: #91c55d; }
          #content section.products article.travesseiros-e-acessorios ul li a .icon { background-color: #c8c82d; }
          #content section.products article.sofas-cama-e-poltronas-reclinaveis ul li a .icon { background-color: #996633; }
          #content section.products article.camas-articuladas ul li a .icon { background-color: #990000; }

#content section.stores { overflow: hidden; }
  #content section.stores article { float: left; width: 450px; height: 67px; margin: 0 10px 10px 0; padding: 8px; }
    #content section.stores article .image-wrap { float: left; width: 120px; height: 67px; margin-right: 10px; background: #e4e4e4; }
    #content section.stores article h4 { margin-bottom: 5px; color: #0e0e63; font-size: 1.231em; font-weight: bold; line-height: .75em; text-transform: uppercase; }
    #content section.stores article p { line-height: 1.25em; }

#content .help { float: right; width: 225px; padding: 10px; margin-right: 30px; background: #efefef; }
  #content .help h4 { color: #66c; font: italic bold 1.538em/1.05em georgia, times, serif; text-shadow: 3px 3px 5px #ccc; }
  #content .help h5 { margin-top: 15px; color: #0e0e63; font: italic bold 1.385em georgia, times, serif; text-shadow: 3px 3px 5px #ccc; }
  #content .help p { margin-top: 4px; }
  #content .help form { margin-top: 7px; }
    #content .help form input { width: 12em; height: 16px; padding: 2px; border: 0 none; }
    #content .help form button { margin-left: 5px; background: transparent; border: 0 none; color: #333; font-size: 1.077em; text-transform: uppercase; }

#content .contact { width: 586px; overflow: hidden; margin-left: 8px; }
  #content .contact h3 { margin: 0; padding: 0; background: transparent; color: #0e0e63; font: bold 1em 'Calibri', trebuchet, arial, sans-serif; }
  #content .contact form { margin-top: 20px; }
    #content .contact form dl { margin-top: 20px; }
      #content .contact form dl dt { margin-bottom: 2px; }
      #content .contact form dl dd { margin-bottom: 10px; }
        #content .contact form dl dd input,
        #content .contact form dl dd textarea { width: 280px; padding: 4px 6px; background: #efefef; border: 0 none; }
        #content .contact form dl dd textarea { width: 574px; }
      #content .contact form dl dt#area-label { float: left; width: 52px; margin-right: 8px; }
      #content .contact form dl dd#area-element { float: left; clear: left; width: 52px; margin-right: 8px; }
        #content .contact form dl dd#area-element input { width: 40px; }
        #content .contact form dl dd#phone-element input { width: 220px; }
      #content .contact form dl dt#submit-label { display: none; }
        #content .contact form dl dd#submit-element input { float: right; width: 80px; padding: 5px 6px 6px 22px; background: #666 url('../images/buy-icon.png') no-repeat 8px 6px; color: #fff; font-weight: bold; text-transform: uppercase; cursor: pointer; }

/* -- Footer -- */

footer p {}
  footer p span { color: #ccc; }

/* -- Nav -- */

nav {}
  nav ul { list-style: none; }
    nav ul li { display: inline; }

nav.menu { clear: both; height: 50px; margin: 20px 0 0 30px; }
  nav.menu > ul { font-size: 1.077em; }
    nav.menu > ul > li { position: relative; z-index: 10; float: left; border-right: 1px solid #fff; text-align: center; text-transform: uppercase; }
      nav.menu > ul > li > a { float: left; max-width: 95px; height: 43px; padding: 0 8px; background-color: #e4e4e4; border-bottom: 7px solid #c9c9c9; color: #333; }
      nav.menu ul li a:hover { border-color: #0e0e63 !important; color: #fff; text-decoration: none; }
      nav.menu ul li ul { display: none; position: absolute; z-index: 50; top: 50px; left: 0; padding: 3px 0; background: #fff; text-align: left; box-shadow: 2px 2px 6px #ccc; }
      nav.menu ul li:hover ul { display: block; }
        nav.menu ul li ul li { display: inline; }
          nav.menu ul li ul li a { display: block; padding: 3px 10px; white-space: nowrap; text-transform: none; }
            nav.menu ul li ul li a span { display: inline-block; width: 90px; }
      nav.menu ul li.colchoes-de-espuma a { border-color: #6666cc; }
      nav.menu ul li.colchoes-de-espuma a:hover { background: #6666cc; }
      nav.menu ul li.colchoes-e-conjunto-box a { border-color: #6699cc; }
      nav.menu ul li.colchoes-e-conjunto-box a:hover { background: #6699cc; }
      nav.menu ul li.cabeceiras a { border-color: #66cccc; }
      nav.menu ul li.cabeceiras a:hover { background: #66cccc; }
      nav.menu ul li.camas-box a { border-color: #91c55d; }
      nav.menu ul li.camas-box a:hover { background: #91c55d; }
      nav.menu ul li.travesseiros-e-acessorios a { border-color: #c8c82d; }
      nav.menu ul li.travesseiros-e-acessorios a:hover { background: #c8c82d; }
      nav.menu ul li.sofas-cama-e-poltronas-reclinaveis a { max-width: 150px; border-color: #996633; }
      nav.menu ul li.sofas-cama-e-poltronas-reclinaveis a:hover { background: #996633; }
      nav.menu ul li.camas-articuladas a { border-color: #990000; }
      nav.menu ul li.camas-articuladas a:hover { background: #990000; }
        nav.menu > ul > li > a span { display: table-cell; height: 43px; vertical-align: middle; }
  nav.menu form { height: 43px; background-color: #e4e4e4; border-bottom: 7px solid #c9c9c9; color: #333; }
    nav.menu form fieldset { padding: 12px 30px 0 8px; text-align: right; }
      nav.menu form fieldset input { width: 12.5em; height: 16px; padding: 2px; border: 0 none; }
      nav.menu form fieldset button { margin-left: 5px; background: transparent; border: 0 none; color: #333; font-size: 1.077em; text-transform: uppercase; }

nav.secondary {}
  nav.secondary ul { float: right; color: #666; }
    nav.secondary ul li { margin-left: 3px; }
    nav.secondary ul li:before { content: '|'; }
    nav.secondary ul li.first:before { content: ''; }
      nav.secondary ul li a { margin-left: 6px; }