/* Classes comuns  - São as classes que poderão ser utilizadas em todo site, independendo da área em questão.*/
* { margin:0; padding:0; }

body{background: #4F4745; color: #fff; font-family: "Trebuchet MS", sans-serif;font-size: 0.8em;}
li{ line-height: 1.5em;}
img{border: none;}
legend{ color: #fff;}
hr { visibility: hidden; }
ul { list-style-type: none; }
span { display:none; }
label { display:block; margin-top:10px; }
form label { color:#E8EA55; font-weight:bold; }
button { border:none; display:block; margin:5px; cursor:pointer; }
textarea, input, select { border:solid 1px #E8EA55; }
button span { display:block; }
button { margin-top:10px; background:#E3E4AE; padding:5px; border:solid 1px #F28359; }
button:hover { background:#E8EA55; }
em { color:#FFFFFF; }
a { text-decoration:underline; color: yellow; }
a:hover { text-decoration:none; }
.clear { clear:both; }
.left { float:left; }
.right { float:right; }
.descricao { font-style:italic; color:#fff; margin-bottom:10px; }
.requerido { display:inline; color:#FFFC00; }

#tudo { min-width: 750px; max-width: 1000px; width:95%; margin: 0 auto; border-left: 1px solid #000; border-right: 1px solid #000; background:#fff;}
#coluna-direita { float:right; width:30%; }
#coluna-esquerda { width:67%; float:left; }
#corpo { background:#000; padding:15px; }

#conteudo-lateral #destaque { background: url('../i/destaque_inicio.jpg') no-repeat; display:block; width:294px; height:300px; }

#conteudo-lateral #conteudo { background-color:#000; padding:10px 5px; border:solid 1px #FFF; }
#conteudo-lateral #conteudo img { float:right; margin: 7px 0 7px 7px; }
#conteudo-lateral #conteudo p { margin:0; margin-top:5px; }

#topo { background:#c4d5dc url('../i/bg-cabe.gif') repeat-y top left; }
#topo #logo a { background:url('../i/logo_cyan_v10.jpg') no-repeat; width:130px; height:111px; margin:10px 0 0 25px; float:left; }
#topo #logo { margin:10px 0 5px 25px; float:left; }
#fundoslogan{ background: url('../i/bg-cabe.gif') repeat-y left top;height: 131px; display: block;}
#topo #slogan { background: url('../i/slogan.gif') no-repeat center center; width:100%; height:131px; float:left;  }


#menu { height:31px; background: url('../i/barra-navegacao.jpg') repeat-x; }
#menu ul { text-align:center; display:block; }
#menu ul li { padding:6px 0px 7px 0px; display:inline; height:31px; line-height:31px; border-left:solid 1px #fff;}
#menu ul li a { padding:6px 10px 7px 10px; margin-right:-4px; color:#fff; text-decoration:none; height:31px; line-height:31px; }
#menu ul li a:hover { background: url('../i/bg-menu-hover.gif') repeat-x; color:#000; }
#menu #ultimo { border-right:solid 1px #fff; }

#menu-inferior { background:#000; height:28px; margin:0; font-size:0.95em; }
#menu-inferior ul { text-align:center; }
#menu-inferior ul li { display:inline; line-height:28px; border-left:solid 1px yellow;}
#menu-inferior ul li a { padding:3px 4px 3px 6px; text-decoration:none;  }
#menu-inferior ul li a:hover { text-decoration:underline; }
#menu-inferior .primeiro { border:none; }

#rodape { background:url('../i/bg-rodape.jpg') repeat-x; }
#rodape ul { min-width:600px; }
#rodape ul li span { display:inline; }
#rodape a { text-decoration:underline; }
#rodape a:hover { text-decoration:none; }
.vcard { clear:both; padding:3px 2%; color:#FFF; float: left; }
.tecmedia { height:21px;}
.tecmedia a { background:url('../i/creditos.gif') no-repeat bottom center; width:63px; height:21px; display:block; float:right; margin: 30px 10px 30px 0; }
.tecmedia a:hover { background-position:top center; }

/* Instrucoes das areas da capa  - Aqui será colocado todas as instruções dos blocos da capa, bem como as imagens do layout e dos referidos blocos.*/

#conheca-o-pratic { display:inline; text-align:center; background: #000; border:solid 10px #a5d3ea; float:left; height:192px; width:98%; }
#clique-aqui-pratic { clear:both; background: url('../i/clique1.jpg') repeat-x top left; display:block; width:100%; height:55px; min-width:433px; }
#clique-aqui { background: url('../i/clique2.jpg') no-repeat top right; display:block; width:254px; height:55px; float:right; margin-right:-8px;}
.capa #conteudo h4 a, #conteudo-lateral h4 a { font-weight:normal; float:right; background: url('../i/mais.gif') no-repeat bottom right; padding-right:18px; }

#produtos.capa { clear:both; position:relative; top:20px; }
#produtos.capa #conteudo { padding-left:30px; }
#produtos.capa #conteudo h3 { margin-bottom:7px; }
#produtos.capa #conteudo .produto-inferior { float:left; display:block; width:22%; height:161px; margin:0 20px 15px 0; }
#produtos.capa #conteudo h4 { margin-top:10px; }

#imagem-produto { float:left; background: url('../i/produtos/2.jpg') no-repeat; width:30%; height:160px;  margin:10px 0 0 0; display:block;}
#imagem-detalhes img { margin:0 10px 5px 0; }
#descricao-produto { margin:0 0 0 10px; }

#produtos.capa { clear:both; position:relative; top:20px; }
#produtos.capa #conteudo { padding-left:30px; }
#produtos.capa #conteudo h3 a { margin-bottom:5px; float:left; display:block; width:22%; height:183px; margin:0 15px 15px 0;}
#produtos.capa #conteudo h4 { margin-top:10px; }

#produtos-coluna-a { float:left; width: 150px;}
#produtos-coluna-a ul li { list-style-type:none; margin:0 0 4px 0; background:#E3E4AE; padding:1px; border:solid 1px #F28359; }
#produtos-coluna-a ul li:hover { background:#E8EA55; }
#produtos-coluna-a ul li a { color:#000; text-decoration:none; display: block; }

#produtos-coluna-b { float:left; width: 150px;}
#produtos-coluna-b ul li { list-style-type:none; margin:0 0 4px 0; background:#E3E4AE; padding:1px; border:solid 1px #F28359; }
#produtos-coluna-b ul li:hover { background:#E8EA55; }
#produtos-coluna-b ul li a { color:#000; text-decoration:none; display: block; }

/* Instrucoes das áreas internas - Neste bloco colocar apenas as instruções referentes as áreas internas do site.  */ 

#conteudo p { margin:10px; }
#conteudo p.descricao { margin-left:0; }

#institucional ul, #produtos ul, #mapa-do-site ul, #acessibilidade ul { list-style-type:circle; margin:10px 0 10px 25px; }
#mapa-do-site ul { margin:10px 0 10px 10px; list-style:none; }
#mapa-do-site ul ul { margin:0 15px; list-style-type:circle; }
#mapa-do-site ul ul ul { list-style-type:disc; }
#fale-conosco ul, #trabalhe-conosco ul { margin:0 10px; }

#institucional #conteudo.menu p { margin-top:0; }/*A não ser que as descrições sejam grandes (parágrafos)*/
#institucional #submenu { margin-left:5%; }
#institucional #submenu li { list-style:none; display:inline; border-left:solid 1px #c7d5de; }
#institucional #submenu li a { padding:3px 4px 3px 6px; text-decoration:none;  }
#institucional #submenu li a:hover { text-decoration:underline; }
#institucional #submenu .primeiro { border:none; }
#institucional img { float:right; margin:10px 0 10px 10px; }

#areas-de-atuacao #representantes { float:left; width:50%;}
#areas-de-atuacao ul { margin-bottom:20px; margin-left:10px;}
#areas-de-atuacao .rep { margin-bottom:8px; }
#areas-de-atuacao li strong { font-size:1.1em; }
#areas-de-atuacao #mapa { margin:0 auto; display:block;}

.erro span{ display:inline; }
.erro{ background: #FFF3F3; border-top: red 2px solid; padding: 10px; width: 50%;}
.erro span{ font-weight: bolder;}
.erro h6{ font-size: 1.3em; font-weight: bold;  margin-bottom: 10px;}

#distancia { padding-top:10px; }