/* Folha de estilos: SV Revestimentos - AGO/2007
Autor: Reginaldo Ornellas
*/

/* ===== GERAL =====================================================*/

* { margin:0; padding:0; } /* zerando os valores */

body {
  margin: 0 auto;
  background: #9FA287 url(imagens/bg_total.gif) top left repeat-x;
}

#bar_top {
margin: 0 20px;
height: 20px;
text-align: right;
padding-top: 2px;
}

#header {
margin: 10px auto 0 auto;
background: url(imagens/bg_header.gif) top left no-repeat;
width: 760px;
height: 150px;
}

.header_logo_sv {
width: 130px;
height: 130px;
position: absolute;
float: left;
margin-top: 10px;
margin-left: 70px;
}

.flash_header {
width: 760px;
height: 150px;
margin-top: 0;
margin-left: 0;
position: absolute;
float: left;
}

#menu_bar {
margin: 0 auto;
width: 760px;
height: 40px;
background: url(imagens/bg_menu_bar.gif) top left repeat-x;
clear: both;
}

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

ul.menu_bar li a {
margin: 4px auto auto 20px;
float:left;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:small;
font-weight:bold;
color:#FFF;
text-align:center;
text-decoration:none;
}

ul.menu_bar a:hover{
text-decoration: underline;
margin-top: 6px;
}

#conteudo {
margin: 0 auto;
width: 760px;
background: #E8E9E1;
overflow: hidden;
}

.slide_home {
/* Acrescentei margens direto no 'embed' para ocultar opções do slide.com */
width: 315px;
height: 210px;
text-align:center;
border: 2px solid #9FA287;
overflow: hidden;
margin: 10px;
position: relative;
float: right;
z-index: 1;
}

#box_revestimentos { /* div usada na descrição dos Revestimentos */
background:#FFF;
width: 740px;
margin: 10px auto;
border: 1px solid #CCC;
clear: both;
overflow: auto;
}

.img_left {
margin: 10px;
position: relative;
float: left;
display: block;
}
.img_right {
margin: 10px;
position: relative;
float: right;
display: block;
}

#rodape {
margin: 0 auto;
width: 760px;
height: 52px; /* util 35px, 4px margem top */
background: url(imagens/bg_rodape.gif) top left repeat-x;
position: relative;
clear: both;
border: 1px solid #9FA287;
}

#rodape p {
float: left;
font-family: Arial, Helvetica, sans-serif;
font-size: x-small;
text-align: left;
color: #84847C;
text-indent: 0;
}
#rodape p span{ font-weight: bold; }


h1 {
font-family: Arial, Helvetica, sans-serif;
font-size: larger;
color: #4C4E41;
text-align: justify;
text-indent: 20px;
margin: 10px;
}

h2 {
font-family: Arial, Helvetica, sans-serif;
font-size: medium;
color: #4C4E41;
text-align: justify;
text-indent: 20px;
margin: 10px;
}

p {
/* line-height: 1.5em;  espaçamento entre linhas */
font-family: Arial, Helvetica, sans-serif;
font-size: small;
text-align: justify;
text-indent: 20px;
padding: 10px 20px;
}

/* ============== CORES ====================== */
#box_cores { /* tamanho e posição dos boxes com as cores */
width: 100px;
height: 100px;
border: 1px outset #FFF;
margin: 30px 12px 10px;
display: inline-block;
float: left;
}
#box_cores h2 { /* define o titulo da cor, para ficar deslocado dentro do mesmo DIV */
height: 20px;
color: #4C4E41;
font-family: Arial, Helvetica, sans-serif;
font-size: small;
text-align: center;
margin: -20px 0 0 0;
text-indent: 0;
}

/* define a cor do box ref. ao produto S.V.N, etc */
.svn {background: #558844;}
.smf {background: #FFEEBB;}
.sazc {background: #66AAFF;}
.scmu {background: #999966;}
.sant {background: #000066;}
.svc {background: #003300;}

.scmd {background: #808080;}
.sces {background: #333333;}
.scp {background: #C0C0C0;}
.sbg {background: #FAFEFC;}
.smc {background: #996600;}
.sve {background: #AA0000;}

.sazm {background: #0066CC;}
.svf {background: #005500;}
.sam {background: #FFCC00;}
.sazf {background: #000077;}
.slr {background: #EE3300;}
.sazd {background: #000044;}

/* ======== GALERIA DE FOTOS =============================*/
#flashcontent {
height: 400px;
margin-top: -50px;
margin-left: -10px;
margin-right: -40px;
margin-bottom: -30px;
border: 2px solid #9FA287;
}

/* ======== CLIENTES ========== */
#box_clientes { /* tamanho e posição dos boxes com as cores */
width: 200px;
height: auto;
border: 1px dotted #9FA287;
margin: 10px 25px 10px;
float: left;
border-top: 2px solid #FFCC00;
text-indent: 0;
padding: 0; 
}

#box_clientes h1{ /* tamanho e posição dos boxes com as cores */
font-family: Arial, Helvetica, sans-serif;
color: #333;
font-size: medium;
text-align: left;
margin: 5px;
text-indent: 0;
padding: 0;
}

#box_clientes h2{ /* tamanho e posição dos boxes com as cores */
font-family: Arial, Helvetica, sans-serif;
color: #4C4E41;
font-size: small;
text-align: left;
margin: 5px;
text-indent: 0;
padding: 0;
}

#box_clientes p{ /* tamanho e posição dos boxes com as cores */
font-family: Arial, Helvetica, sans-serif;
color: #333;
font-size: x-small;
text-align: left;
margin: 5px;
text-indent: 0;
padding: 0;
}

/* ======== FORMULARIO ===== */

.iframe_form_contato {
width: 380px;
height: 260px;
float: right;
margin: 5px 15px; 
}

.iframe_obrigado {
width: 380px;
height: 90px;
float: right;
margin: 25px 15px;
}

#form_contato { /* Container do FORM */
  width: 370px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  border: 1px dotted #9FA287;
}

#form_contato h1{ /* chamada do formulario */
font-family: Arial, Helvetica, sans-serif;
background: #9FA287;
font-weight:bold;
font-size: medium;
text-align: center;
color: #FFF;
padding: 5px;
clear: both;
margin: 5px;
}

#form_contato h2{ /* 'confira os dados' */
font-family: Arial, Helvetica, sans-serif;
background: #9FA287;
font-weight:bold;
font-size: small;
text-align: center;
color: #FF0;
padding: 5px;
clear: both;
margin: 5px;
}

#form_contato h3{ /* Usado só na pagina obrigado.html */
font-family: Arial, Helvetica, sans-serif;
font-weight:bold;
font-size: large;
text-align: center;
color: #366;
padding: 5px;
clear: both;
}

#form_contato label{
width: 110px;
height: auto;
float: left;
font-family: Arial, Helvetica, sans-serif;
font-size: small;
text-align: right;
margin: 2px auto 2px 5px;
}

#form_contato input, textarea{
background:#FFF; /* a cor do fundo dos três campos */
border:1px inset #9FA287;/* Borda dos Campos 'text-area' */
width: 200px;
float: left;
margin: 2px auto 2px 5px;
}

#form_contato input.botao {
  background-color: #CCC;
  text-align: center;
  color: #000; /* a cor das letras Enviar */
  border:2px outset #663;/* uma borda de 2px solida branca no botão*/
  width: 50px;
  float: none;
  clear: both;
  margin: 5px auto;
}

.logo_adapt {
border: none;
}

a.adapt, a.adapt:link {
float: right;
margin-right: 20px;
margin-top: 10px;
width: 65px;
height: 30px;
border: none;
text-decoration: none;
}

a.adapt:hover, a.adapt:visited, a.adapt:active { border: none; }
