/*  Theme Name: Super Metais - Instalações Comerciais
Theme URI: 
Description: The default theme for Super Metais - Instalações Comerciais
Version: 1.0
Author: Felipe Campos
Author URI:
*/

/*
+----------------------------------------------------------------+
	ÍNDICE
+----------------------------------------------------------------+
- 1. RESET CSS
- 2. EXTRAS
- 3. DEFINIÇÕES GERAIS
- 4. CONTAINER
- 5. HEADER
- 6. CONTENT
- 7. FOOTER

+----------------------------------------------------------------+
	PÁGINAS
+----------------------------------------------------------------+
- 1.1 PRODUTOS
+----------------------------------------------------------------+
*/

/*
+----------------------------------------------------------------+
	1. Reset CSS by Eric Meyer: http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
+----------------------------------------------------------------+
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {margin:0; padding:0; border:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline;}
body {line-height: 1;}
ol, ul {list-style: none;}

/*
+----------------------------------------------------------------+
	2. Extras
+----------------------------------------------------------------+
*/
.clear {clear:both; overflow:hidden; font-size:0; visibility:hidden}
.alignleft {float:left}
.alignright {float:right}
div:after, ul:after, dl:after, dd:after, dt:after {clear:both; content:""; display:block; font-size:0; height:0; visibility:hidden}
/*Limpar fluxo oculto para IE-mac \*/
* html div, * html ul, * html dl, * html dd, * html dt {height:1%;}
/* final hack IE-mac */
*:first-child+html div, *:first-child+html ul, *:first-child+html dl, *:first-child+html dd, *:first-child+html dt, *:first-child+html ol {height:auto; display: inline-block;}

/*
+----------------------------------------------------------------+
	3. Definicoes Gerais
+----------------------------------------------------------------+
*/
html, body {height:100%}
body {background:#FFF url(img/bg.jpg) repeat-x center top; font:62.5% Arial, Helvetica, sans-serif; text-align:center}
a {text-decoration:none}
h1, h2, h3, h4, h5, h6, strong {font-weight:bold}

/*
+----------------------------------------------------------------+
	4. Container
+----------------------------------------------------------------+
*/
#container {margin:0 auto; width:911px}

/*
+----------------------------------------------------------------+
	5. Header
+----------------------------------------------------------------+
*/
#header {background:url(img/bg-header.jpg) no-repeat center top}
#header h1 {display:block; height:146px; margin:0 auto; overflow:hidden; padding:4px 0 2px 0; position:relative; text-align:left; width:214px}
#header h1 span {background:url(img/img-logo.jpg) no-repeat; height:100%; position:absolute; width:100%}
#header h1 a {cursor:pointer}
#header #nav {background:url(img/bg-menu.jpg) no-repeat left top; height:292px; position:relative}
#header #nav #menu embed {left:0; margin:0 0 0 7px; position:absolute; top:0; z-index:50}
#header #nav #banner {height:229px; left:0; position:absolute; top:72px; width:911px}
#produtos #header #nav, #detalhes #header #nav, #carrinho #header #nav, #orcamento #header #nav, #frete #header #nav, #formas-pagamento #header #nav, #sac #header #nav {background:none; height:73px}

/*
+----------------------------------------------------------------+
	6. Content
+----------------------------------------------------------------+
*/
#content {margin:36px auto 35px; text-align:left}
#sidebar-left {background:url(img/img-divisao.jpg) no-repeat right top; float:left; font-size:1.2em; margin-right:28px; width:212px}
#sidebar-left a#orcamento {background:url(img/img-orcamento.jpg) no-repeat left center; color:#000; display:block; height:53px; margin-bottom:28px; padding:10px 0 0 66px; width:130px}
#sidebar-left a#frete {background:url(img/img-frete.jpg) no-repeat left center; color:#000; display:block; height:52px; margin-bottom:37px; padding:10px 0 0 66px; width:130px}
#sidebar-left a#procura {background:url(img/img-procura.jpg) no-repeat left center; color:#000; display:block; height:49px; margin-bottom:31px; padding:0 0 0 66px; width:130px}
#sidebar-left a#formas-pagto {background:url(img/img-formas-pagto.jpg) no-repeat left center; color:#000; display:block; height:39px; padding:12px 0 0 66px; width:115px}
#main {background:url(img/img-divisao.jpg) no-repeat right top; float:left; margin-right:37px; width:425px}
#main .prod-destaque {color:#000; float:left; font-size:1.1em;margin:0 36px 38px 0; text-align:center; width:105px}
#main .prod-destaque img {display:block; margin:0 auto}
#main .noborder {margin-right:0}
#main .prod-destaque a {color:#F37021; display:block}
#main .prod-destaque a.comprar {background:url(img/img-carrinho-compra.jpg) no-repeat right center; color:#f37021; display:block; font-size:1.1em; height:21px; line-height:21px; margin:0 auto; padding-right:30px; width:44px}
#sidebar-right {float:right; font-size:1.2em; text-align:right}
#sidebar-right #busca {margin-bottom:24px}
#sidebar-right #busca #search {border:1px solid #919191; width:151px}
#sidebar-right #sac {background:url(img/img-sac.jpg) no-repeat right top; height:55px; margin-bottom:34px; padding-right:71px}
#sidebar-right #sac a {color:#000}
#sidebar-right #localizacao {background:url(img/img-localizacao.jpg) no-repeat right top; height:51px; line-height:51px; margin-bottom:30px; padding-right:67px}
#sidebar-right #localizacao a {color:#000}
#sidebar-right #newsletter p {display:inline-block; margin-bottom:16px}
#sidebar-right #newsletter li {margin-bottom:5px}
#sidebar-right #newsletter input {border:1px solid #919191; width:150px}
#sidebar-right #newsletter #enviar {background:url(img/img-seta-enviar.jpg) no-repeat 0 7px; border:0 none; cursor:pointer; padding-left:8px; width:48px}

/*
+----------------------------------------------------------------+
	7. Footer
+----------------------------------------------------------------+
*/
#footer {background:url(img/img-bg-footer.jpg) repeat-x center bottom; padding-bottom:10px}
#footer .endereco {color:#f37021; font-size:1.2em; font-weight:bold}
#footer #end li {border-right:1px solid; color:#323232; display:inline; font-size:1.2em; margin-right:5px; padding-right:5px}
#footer #end li.email {border:0 none}
#footer #end li.email a {color:#323232}
#footer #category {margin-top:30px}
#footer #category li {border-right:1px solid; color:#dfdfdf; display:inline; font-size:1.2em; margin-right:5px; padding-right:5px}
#footer #category a {color:#dfdfdf}
#footer #category li.diversos {border:0 none}
#footer .doze {bottom:0; position:absolute; right:0}

/*
+----------------------------------------------------------------+
	1.1 Produtos
+----------------------------------------------------------------+
*/
#produtos #sidebar-left {background:none; float:left; font-size:1.2em; margin:0; width:212px}
#produtos #sidebar-left #busca {margin-bottom:24px}
#produtos #sidebar-left #busca #search {border:1px solid #919191; width:151px}
#produtos #sidebar-left #categorias li {background:url(img/img-seta-produtos.jpg) no-repeat left center; color:#4a4847; margin-bottom:18px; padding-left:10px}
#produtos #sidebar-left #categorias li a {color:#4a4847}
#produtos #sidebar-left #categorias li.act {color:#f37021}
#produtos #main {background:url(img/img-div-produtos.jpg) repeat-y left top; color:#4a4847; margin:0; padding:0 0 0 28px; width:671px}
#produtos #main h2 {float:left; font-size:2.3em; font-weight:normal}
#produtos #main #itens-carrinho {background:url(img/img-carrinho.jpg) no-repeat right center; color:#4a4847; float:right; line-height:27px; padding-right:40px}
#produtos #main #lista-produtos {clear:both; padding-top:17px}
#produtos #main #lista-produtos li {color:#000; float:left; font-size:1.1em; margin:0 101px 58px 0; text-align:center; width:147px}
#produtos #main #lista-produtos li img {border:1px solid #4A4847}
#produtos #main #lista-produtos li p {font-size:1.2em; margin-top:10px}
#produtos #main #lista-produtos li.noborder {margin-right:0}
#produtos #main #lista-produtos li a.comprar {background:url(img/img-carrinho-compra.jpg) no-repeat right center; color:#f37021; display:block; font-size:1.1em; height:21px; line-height:21px; margin:0 auto; padding-right:30px; width:44px}

/*
+----------------------------------------------------------------+
	1.2 Produtos Detalhes
+----------------------------------------------------------------+
*/
#detalhes #sidebar-left {background:none; float:left; font-size:1.2em; margin:0; width:212px}
#detalhes #sidebar-left #busca {margin-bottom:24px}
#detalhes #sidebar-left #busca #search {border:1px solid #919191; width:151px}
#detalhes #sidebar-left #categorias li {background:url(img/img-seta-produtos.jpg) no-repeat left center; color:#4a4847; margin-bottom:18px; padding-left:10px}
#detalhes #sidebar-left #categorias li a {color:#4a4847}
#detalhes #sidebar-left #categorias li.act {color:#f37021}
#detalhes #main {background:url(img/img-div-produtos.jpg) repeat-y left top; color:#4a4847; margin:0; padding:0 0 0 28px; width:671px}
#detalhes #main h2 {float:left; font-size:2.3em; font-weight:normal; margin:0 0 22px 0}
#detalhes #main #itens-carrinho {background:url(img/img-carrinho.jpg) no-repeat right center; color:#4a4847; float:right; line-height:27px; padding-right:40px}
#detalhes #main .imagens {float:left; margin-right:15px}
#detalhes #main .imagens p {clear:both; text-align:center}
#detalhes #main .imagens .link_imagem {display:block}
#detalhes #main .imagens .thumbs {margin:0 3px}
#detalhes #main #imagem {border:1px solid #4A4847; margin:0 19px 22px 0}
#detalhes #main p {font-size:1.2em; line-height:24px; text-align:justify}
#detalhes #main li.cores {border:1px solid #666; float:left; margin:0 5px 5px 0; padding:1px}
#detalhes #main #comprar {background:url(img/bt-comprar.png) no-repeat left top; cursor:pointer; display:block; float:right; height:42px; overflow:hidden; position:relative; width:128px}
#detalhes #main #comprar span {display:none; height:100%; position:absolute; width:100%}
#detalhes #main #divisao {border:0 none; display:block; margin:0 auto; padding:30px 0}
#detalhes #main #produtos-relacionados {clear:both; margin-bottom:93px; padding-top:17px}
#detalhes #main #produtos-relacionados li {float:left; margin:0 43px 0 0}
#detalhes #main #produtos-relacionados li img {border:1px solid #4A4847}
#detalhes #main #produtos-relacionados li.noborder {margin-right:0}
#detalhes #main #produtos-relacionados strong {display:block; font-size:1.4em; text-align:center}
#detalhes #main a#voltar {background:url(img/bt-voltar.png) no-repeat left top; display:block; float:left; height:26px; overflow:hidden; position:relative; width:103px}
#detalhes #main a#voltar span {display:none; height:100%; position:absolute; width:100%}

/*
+----------------------------------------------------------------+
	1.3 Carrinho
+----------------------------------------------------------------+
*/
#carrinho #main {background:none; color:#4a4847; margin:0; padding-left:10px; width:895px}
#carrinho #main h2 {float:left; font-size:2.3em; font-weight:normal; margin-bottom:28px}
#carrinho #main h2 span {color:#e77817}
#carrinho #main .carrinho {clear:both}
#carrinho #main td.esquerdo {background:url(img/img-canto-esquerdo.jpg) no-repeat left top; width:18px}
#carrinho #main td.direito {background:url(img/img-canto-direito.jpg) no-repeat right top; width:17px}
#carrinho #main td.cabecalho {background:url(img/bg-topo-tabela-carrinho.jpg) repeat-x left top; color:#FFFFFF; font-size:1.2em; height:28px}
#carrinho #main .quantidade, #carrinho #main .excluir, #carrinho #main .preco, #carrinho #main .total {text-align:center}
#carrinho #main .produto {width:350px}
#carrinho #main .excluir {width:50px}
#carrinho #main .quantidade {width:100px}
#carrinho #main .preco {width:200px}
#carrinho #main .total {width:150px}
#carrinho #main td.bt-continuar {width:150px}
#carrinho #main td.meio {width:100%}
#carrinho #main td.bt-atualiza {width:150px}
#carrinho #main .bt-continuar-compra {display:block; height:34px; overflow:hidden; position:relative; width:150px}
#carrinho #main .bt-continuar-compra span {background:url(img/bt-continuar-compra.jpg) no-repeat left top; height:100%; position:absolute; width:100%}
#carrinho #main .atualizar-carrinho {border:0 none; float:none; height:34px; margin:5px 0 0; width:150px}
#carrinho #main #itens {border-bottom:1px solid #4A4847; height:119px}
#carrinho #main #itens img {border:1px solid #4A4847; float:left; margin-right:19px}
#carrinho #main #itens .nome-produto p {line-height:63px}
#carrinho #main #itens .quant, #carrinho #main #itens .preco-unit, #carrinho #main #itens .valor-total {text-align:center}
#carrinho #main #itens .quant input {float:left; font-size:1em; text-align:center; width:20px}
#carrinho #main #itens .excluir .remover {background:url(img/lixo.png) no-repeat left top; display:block; height:16px; margin:0 auto; width:16px}
#carrinho #main #itens .nome-produto, #carrinho #main #itens .preco-unit, #carrinho #main #itens .valor-total {font-size:1.1em}
#carrinho #main #itens .nome-produto {width:350px}
#carrinho #main #mensagem {background-color:#d2d2d2; font-size:1em; height:33px}
#carrinho #main .txt-valor-total {color:#e29049; font-size:1.2em; text-align:center; text-transform:uppercase}
#carrinho #main .txt-valor-final {font-size:1.2em; text-align:center}
#carrinho #main #mensagem-form {font-size:1.2em; margin:15px 0; text-align:center}
#carrinho #main #orcamento-compra {margin:0 auto; text-align:right; width:410px}
#carrinho #main form label {float:left; font-size:1.2em; line-height:20px; margin-right:5px; width:145px}
#carrinho #main form input, #carrinho #main form textarea {border:1px solid #919191; float:left; font-size:1.1em; margin-bottom:5px; width:250px}
#carrinho #main form select {float:left; font-size:1.1em; margin-bottom:5px; width:40px}
#carrinho #main form textarea {font-family:Arial, Helvetica, sans-serif; font-size:1.1em; height:100px; overflow:auto}
#carrinho #main form input#orcamento, #carrinho #main form input#compra {width:15px}
#carrinho #main form label#lbl-orcamento, #carrinho #main form label#lbl-compra {text-align:left; width:61px}
#carrinho #main form #bt-send {background-color:transparent; border:0 none; clear:both; cursor:pointer; float:right; width:70px}
#carrinho #main h3 {font-size:1.4em; margin:30px 0 10px; text-transform:uppercase}
#carrinho #main p {font-size:1.2em; margin-bottom:10px}

/*
+----------------------------------------------------------------+
	1.4 Orcamento
+----------------------------------------------------------------+
*/
#orcamento #main {background:none; color:#4a4847; margin:0; padding-left:10px; width:895px}
#orcamento #main h2 {float:left; font-size:2.3em; font-weight:normal; margin-bottom:28px}
#orcamento #main h2 span {color:#e77817}
#orcamento #main p {font-size:1.2em; margin-bottom:10px}
#orcamento #main p a {color:#4a4847; text-decoration:underline}
#orcamento #main strong {display:block; font-size:1.4em; margin:30px 0 10px}
#orcamento #main form {clear:left; margin:50px auto 0; text-align:right; width:410px}
#orcamento #main form label {float:left; font-size:1.2em; line-height:20px; margin-right:5px; width:145px}
#orcamento #main form input, #orcamento #main form textarea {border:1px solid #999999; float:left; font-size:1.1em; margin-bottom:5px; width:250px}
#orcamento #main form select {float:left; font-size:1.1em; margin-bottom:5px; width:40px}
#orcamento #main form textarea {font-family:Arial, Helvetica, sans-serif; font-size:1.1em; height:100px; overflow:auto}
#orcamento #main form #bt-send {background-color:transparent; border:0 none; clear:both; cursor:pointer; float:right; width:70px}
#orcamento #main h3 {font-size:1.4em; margin:30px 0 10px; text-transform:uppercase}

/*
+----------------------------------------------------------------+
	1.5 Frete
+----------------------------------------------------------------+
*/
#frete #main {background:none; color:#4a4847; margin:0; padding-left:10px; width:895px}
#frete #main h2 {float:left; font-size:2.3em; font-weight:normal; margin-bottom:28px}
#frete #main h2 span {color:#e77817}
#frete #main p {font-size:1.2em; margin-bottom:10px}
#frete #main p a {color:#4a4847; text-decoration:underline}
#frete #main strong {display:block; font-size:1.4em; margin:30px 0 10px}
#frete #main form {clear:left; margin:50px auto 0; text-align:right; width:410px}
#frete #main form label {float:left; font-size:1.2em; line-height:20px; margin-right:5px; width:145px}
#frete #main form input, #frete #main form textarea {border:1px solid #999999; float:left; font-size:1.1em; margin-bottom:5px; width:250px}
#frete #main form select {float:left; font-size:1.1em; margin-bottom:5px; width:40px}
#frete #main form textarea {font-family:Arial, Helvetica, sans-serif; font-size:1.1em; height:100px; overflow:auto}
#frete #main form #bt-send {background-color:transparent; border:0 none; clear:both; cursor:pointer; float:right; width:70px}
#frete #main h3 {font-size:1.4em; margin:30px 0 10px; text-transform:uppercase}

/*
+----------------------------------------------------------------+
	1.6 Formas Pagamento
+----------------------------------------------------------------+
*/
#formas-pagamento #main {background:none; color:#4a4847; margin:0; padding-left:10px; width:895px}
#formas-pagamento #main h2 {float:left; font-size:2.3em; font-weight:normal; margin-bottom:28px}
#formas-pagamento #main h2 span {color:#e77817}
#formas-pagamento #main p {font-size:1.2em; margin-bottom:10px}
#formas-pagamento #main ul {width:500px}
#formas-pagamento #main li {font-size:1.2em; margin-bottom:10px}
#formas-pagamento #main li.logo-bradesco {background:url(img/bradesco.png) no-repeat left top; float:right; height:53px; width:70px}
#formas-pagamento #main li.logo-unibanco {background:url(img/unibanco.png) no-repeat left top; float:right; height:22px; width:138px}
#formas-pagamento #main li.cartoes {background:url(img/formas-pg.png) no-repeat left top; height:223px; width:151px}
#formas-pagamento #main p a {color:#4a4847; text-decoration:underline}
#formas-pagamento #main strong {clear:both; display:block; font-size:1.4em; margin:30px 0 10px}
#formas-pagamento #main h3 {font-size:1.4em; margin:30px 0 10px; text-transform:uppercase}

/*
+----------------------------------------------------------------+
	1.7 SAC
+----------------------------------------------------------------+
*/
#sac #main {background:none; color:#4a4847; margin:0; padding-left:10px; width:895px}
#sac #main h2 {float:left; font-size:2.3em; font-weight:normal; margin-bottom:28px}
#sac #main h2 span {color:#e77817}
#sac #main form {clear:left; margin:0 auto; text-align:right; width:410px}
#sac #main form label {float:left; font-size:1.2em; line-height:20px; margin-right:5px; width:145px}
#sac #main form input, #sac #main form textarea {border:1px solid #999999; float:left; font-size:1.1em; margin-bottom:5px; width:250px}
#sac #main form select {float:left; font-size:1.1em; margin-bottom:5px; width:40px}
#sac #main form textarea {font-family:Arial, Helvetica, sans-serif; font-size:1.1em; height:100px; overflow:auto}
#sac #main form #bt-send {background-color:transparent; border:0 none; clear:both; cursor:pointer; float:right; width:70px}
#paginacao {padding:20px 0; text-align:center}

/*
+----------------------------------------------------------------+
	Modal
+----------------------------------------------------------------+
*/
#mask {background-color:#000; display:none; left:0; position:absolute; top:0; z-index:500}
#boxes .window {background-color:#FFF; display:none; height:200px; padding:20px; position:absolute; width:440px; z-index:8000}
/* Personalize a janela modal aqui. Você pode adicionar uma imagem de fundo. */
#boxes #dialog {height:505px; width:505px}
#boxes #dialog img {left:22px; position:absolute; top:33px; z-index:8500}
#boxes #dialog #watermark {background:transparent url(img/marca-dagua.png) no-repeat scroll left top; left:0; height:500px; position:absolute; top:33px; width:500px; z-index:9999}
/* posiciona o link para fechar a janela */
.close {color:#000; display:block; float:right; text-align:right}