/* CSS Document */

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

project:	jhdweb.com.br
author:		JHD Comunicação - jhdweb.com.br
date:		2009/05/25

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

html, body {height:100%;}
body { margin: 0; padding:0; color: #86804a; font: 62.5%/1.25 Arial, Helvetica, sans-serif; background:#FFF url(../images/bg_main.gif) left top repeat-x;}
textarea, input, select, option, optgroup, button {color: #6f6b3f; font: 1em "Lucida Sans Unicode","Lucida Grande",Arial,Helvetica,sans-serif; margin:0; padding:0;}
div.clear{clear:both;font-size:0;height:0;line-height:0;display:block;margin:0;padding:0;}


/* RE-SETS

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

* { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; }

li, dt, dd, p, th, td, caption { font-size: 1.2em; }
ul, ol, dl, p { margin-bottom: 10px; }
ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; }
li *, li p, li li, dt *, dd *, p * { font-size: 1em; }

abbr, acronym { border: none; cursor: help; }

form, label, fieldset {margin:0; padding:0;}

fieldset, img { border: none; }
button { overflow: visible; cursor: pointer; }
legend { display: none; }

pre { font: 1.1em "Courier New",monospace; white-space: pre-wrap; }

a, a:active, a:focus { color: #000; text-decoration: none; outline: none; }
a:hover { text-decoration: underline; }
:focus {-moz-outline-style: none;}

p, blockquote {line-height:18px;}

/* HEADINGS

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

h1, h2, h3, h4, h5, h6 {margin: 0 0 10px; font-family:Arial Narrow, Helvetica, sans-serif}
h1 { font-size: 3.2em; }
h2 { font-size: 2.0em; width:300px; height:38px; background:url(../images/headers.gif) left top no-repeat; text-indent:-10001px; margin:30px 0 15px 0;}
h3 { font-size: 2.4em; color:#345273; margin-top:15px; font-weight:normal; }
h3 a { color:#345273; text-decoration:none;}
h4 { font-size: 1.8em; }
h5 { font-size: 1.6em; }
h6 { font-size: 1.3em; }

/* GENERAL
------------------------------------------- */

input[type="text"], button, textarea {border:0;}
input[type="text"] {background:url(../images/bg_input_1.gif) left top no-repeat; width:242px; height:14px; padding:4px;}
input[type="text"], select {margin:0 0 10px 0;}
select {width:250px; padding:4px;}
textarea {width:242px; height:92px; overflow:auto; padding:4px; background:none;}
.textarea {width:250px; height:100px; background:url(../images/bg_textarea.gif) left top no-repeat;}

div.conteudo {width:1000px; left:50%; position:absolute; margin-left:-500px;}
p.more {float:right;}
p.more a {background:url(../images/bg_bt_action.gif) left -24px no-repeat; float:left; padding:0 0 0 10px; color:#FFF; font-size:10px; text-transform:lowercase;}
p.more a span {background:url(../images/bg_bt_action.gif) right top no-repeat; float:left; display:block; padding:0 10px 0 0; line-height:24px; cursor:pointer;}
p.more a:hover {background:url(../images/bg_bt_action.gif) left -72px no-repeat; text-decoration:none;}
p.more a:hover span {background:url(../images/bg_bt_action.gif) right -48px no-repeat;}

h2#produtos {background-position:left -50px;}
h2#dicas {background-position:left -200px;}

.form_busca fieldset {border:1px solid #d9d7bb; background:#f3f2dc; padding:10px 20px;}
.form_busca legend {display:inline; font-size:18px;}
.form_busca button {width:41px; height:22px; background:url(../images/bt_form_ok.gif) left top no-repeat; text-indent:-10001px;}


/* LAYOUT

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

#site {width:1000px; position:relative; height:100%; min-height:100%; left:50%; margin-left:-500px;}
body > #site {height:auto; min-height:100%;}

#nav {display:block; height:58px;}
#nav ul {margin:0; padding:22px 0 0 0;}
#nav ul li {margin:0; padding:0; list-style-type:none; display:inline; text-transform:lowercase;}
#nav ul li a {background:url(../images/bg_menu_button.gif) left top no-repeat; float:left; padding:0 0 0 15px; color:#FFF; margin:0 2px 0 0;}
#nav ul li a span {background:url(../images/bg_menu_button.gif) left top no-repeat; float:left; display:block; padding:0 15px 0 0; line-height:36px; cursor:pointer;}
#nav ul li a:hover {background:url(../images/bg_menu_button.gif) left -72px no-repeat; padding:0 0 0 15px; text-decoration:none; color:#807659;}
#nav ul li a:hover span {background:url(../images/bg_menu_button.gif) right -36px no-repeat; padding:0 15px 0 0; line-height:36px;}
#nav ul li.current {background:url(../images/bg_menu_button.gif) left -72px no-repeat; padding:0 0 0 15px; float:left; color:#807659; margin:0 2px 0 0;}
#nav ul li.current span {background:url(../images/bg_menu_button.gif) right -36px no-repeat; padding:0 15px 0 0; line-height:36px; float:left;}

#top {display:block; height:122px; background:url(../images/bg_topo.gif) right top no-repeat;}
#top h1 {width:172px; height:121px; background:url(../images/logotipo_portinaty.gif) left top no-repeat; overflow:hidden;}
#top h1 a {height:0; min-height:0; padding:400px 0 0 0; display:block;}
#top form {width:298px; height:34px; padding:12px 0 0 15px; background:url(../images/bg_form_busca.gif) left top no-repeat; z-index:2; position:absolute; right:0; top:155px;}
#top form label {color:#6f6b3f; font-size:12px; margin:0 10px 0 0; padding:3px 0 0 0; float:left;}
#top form input[type="text"] {width:178px; height:14px; float:left; background:url(../images/bg_input_2.gif) left top no-repeat; padding:4px; margin:0 5px 0 0;}
#top form button {width:41px; height:22px; float:left; background:url(../images/bt_form_ok.gif) left top no-repeat; text-indent:-10001px;}

#content {height:auto; padding-bottom:120px;}
#content blockquote#banner {width:1000px; height:194px; margin:0; padding:0; text-indent:-10001px;}

#introduction {width:435px; float:left;}
#introduction p {line-height:18px; text-align:justify;}

#home_colecao {float:right; width:534px; margin:30px 0 0 0; padding:0;}
#home_colecao li {margin:0; padding:0; list-style-type:none; display:inline;}
#home_colecao li a img {padding:10px; background:url(../images/bg_big_frame.jpg) left top no-repeat;}

#footer {height:auto; min-height:105px; display:block; background:#345273; margin-top:-105px; position:relative;}
#footer ul {margin:10px 0 0 0; padding:0;}
#footer ul li.first {border:0; padding:0 10px 0 0;}
#footer ul li {padding:0 10px; margin:0; display:inline; color:#FC0; border-left:1px solid #FC0;}
#footer ul li a {color:#FFF;}
#footer p {font-size:11px; color:#FFF; margin:15px 0 0 0;}
#footer p#jhd {width:156px; height:35px; margin:0; background:url(../images/logotipo_jhd.gif) left top no-repeat; overflow:hidden; position:absolute; right:0; bottom:0;}
#footer p#jhd a {height:0; min-height:0; display:block; padding:400px 0 0 0;}


/* ELEMENTS

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

.lista_colecoes {margin:30px 0 0 0; padding:0;}
.lista_colecoes li {margin:0 10px 10px 0; padding:10px; list-style-type:none; display:inline; background:url(../images/bg_frame_colecoes.jpg) left top no-repeat; float:left; text-align:center;}
.lista_colecoes li.end_line {margin:0 0 10px 0;}
.lista_colecoes li a span {display:block; font:18px Arial, Helvetica, sans-serif; font-weight:bold; color:#FFF; margin:12px 0 0 0; /margin:15px 0 0 0;}
.lista_colecoes li a:hover span {text-decoration:none;}

.lista_categorias {border:1px solid #d9d7bb; background:#f3f2dc; padding:10px 10px 5px 10px; margin:0; min-height:55px; height:auto;}
.lista_categorias li {margin:0; padding:0; list-style-type:none; display:inline;}
.lista_categorias li a {color:#FFF; font-size:10px; text-transform:uppercase; padding:5px 10px; background:#86804a; margin:0 5px 5px 0; width:110px; float:left;}
.lista_categorias li a:hover {text-decoration:none; background:#676025;}

#contato h2 {background-position:left -150px;}
#contato form {float:left; width:300px;}
#contato form label {display:block;}
#contato form button {width:64px; height:22px; float:left; margin:5px 0 0 0; background:url(../images/bt_form_envia.gif) left top no-repeat; text-indent:-10001px;}
#contato #info {width:670px; margin:10px 0 0 0; padding:15px; background:#c8c5a2; -moz-border-radius:0.5em; float:right; color:#000;}
#contato #info h3 {font-size:18px; color:#6f6b3f;}
#contato #info iframe {float:right;}

.tip {padding:20px; background:#f2f0db; margin:0 0 20px 0; border-bottom:1px dashed #dcd9b3;}
.tip p {margin:0; padding:0;}

#representantes h2 {background-position:left -100px;}
#representantes form label {display:block;}
#representantes form button {width:64px; height:22px; float:left; margin:5px 0 0 0; background:url(../images/bt_form_envia.gif) left top no-repeat; text-indent:-10001px;}

.produto {clear:both; padding:20px 0; border-bottom:1px solid #e3dfbf;}
.produto img {float:left; width:350px; margin:0 20px 0 0;}
.produto .info {width:455px; float:left; margin:0 0 15px 0;}
.produto .info h4 {color:#345273; font-size:18px;}
.produto .dimensoes {width:425px; padding:15px; background:#b4ae7c; -moz-border-radius:8px; -khtml-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; float:left;}
.produto .dimensoes h5 {color:#585221; font-size:24px; font-weight:normal;}
.produto .dimensoes p {color:#FFF; margin:0; padding:0;}
.produto .dimensoes p.medida {font-weight:bold;}
.produto .dimensoes .altura,
.produto .dimensoes .largura,
.produto .dimensoes .profundidade,
.produto .dimensoes .diametro {width:80px; height:45px; padding:0 0 0 45px; float:left; background:url(../images/cubo_altura.gif) left top no-repeat;}
.produto .dimensoes .largura {background-image:url(../images/cubo_largura.gif);}
.produto .dimensoes .profundidade {background-image:url(../images/cubo_profundidade.gif);}
.produto .dimensoes .diametro {background-image:url(../images/cubo_diametro.gif);}

.texturas {width:450px; float:left; margin:10px 0 0 0;}
.texturas ul {margin:0; padding:0; width:300px;}
.texturas ul li {margin:0; padding:0; list-style-type:none; display:inline;}
.texturas ul li a {width:53px; height:56px; float:left; text-indent:-10001px; background:url(../images/txt_avela_envelhecido.jpg) left top no-repeat;}
.texturas ul li.t1 a {background:url(../images/txt_avela_envelhecido.jpg) left top no-repeat;}
.texturas ul li.t2 a {background:url(../images/txt_avela_mesc_friz.jpg) left top no-repeat;}
.texturas ul li.t3 a {background:url(../images/txt_white.jpg) left top no-repeat;}
.texturas ul li.t4 a {background:url(../images/txt_avela_10.jpg) left top no-repeat;}
.texturas ul li.t5 a {background:url(../images/txt_preto_6.jpg) left top no-repeat;}
.texturas ul li.t6 a {background:url(../images/txt_chocolate_10.jpg) left top no-repeat;}
.texturas ul li.t7 a {background:url(../images/txt_mba_friz_12.jpg) left top no-repeat;}
.texturas ul li.t8 a {background:url(../images/txt_bananeira_10.jpg) left top no-repeat;}
.texturas ul li.t9 a {background:url(../images/txt_bambu_mesclado.jpg) left top no-repeat;}
.texturas ul li.tl1 a {background:url(../images/tela_amarelo_t51.jpg) left top no-repeat;}
.texturas ul li.tl2 a {background:url(../images/tela_azul_t53.jpg) left top no-repeat;}
.texturas ul li.tl3 a {background:url(../images/tela_marrom_mesclado_t54.jpg) left top no-repeat;}
.texturas ul li.tl4 a {background:url(../images/tela_marrom_mesclado_t56.jpg) left top no-repeat;}
.texturas ul li.tl5 a {background:url(../images/tela_perola_t55.jpg) left top no-repeat;}
.texturas ul li.tl6 a {background:url(../images/tela_preto_t57.jpg) left top no-repeat;}