@charset "utf-8";

/*ESTE ARQUIVO CSS FOI DESENVOLVIDO POR PUBLIONLINE BRASIL
http://www.publionline.com.br*/

/* DEFINIÇÕES GERAIS (RESET) */

*{
	margin: 0;
	padding: 0;	
}

body{
	width: 100%;
	height: auto;
	background: #FAF4DE url(../img/body_bg.jpg) no-repeat left top;
	font: 12px Arial, Helvetica, sans-serif;
	color: #333;
}

ul{
	list-style: none;	
}

img{
	border: none;	
}

img a{
	border: none;	
}

form, fieldset{
	display: block;
	border: none;
}

h1{
	font-size: 24px;
	font-weight: bolder;
}

h2{
	font-size: 20px;
	font-weight: bolder;
}

h3{
	font-size: 16px;
	font-weight: bolder;
}

h4{
	font-size: 14px;	
	font-weight: bolder;
}

.clear{
	clear: both;	
}

.left{
	float: left;	
}

.right{
	float: right;	
}

/* clearfix
----------------------------------------*/
.clearfix:after {
	clear: both;
	display: block;
	content: " ";
	height: 0px;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}
/* Hide these rules from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
li.clearfix {
	display: list-item;
}
/* End hide from IE-mac */



/*INSTRUÇÕES*/

/*
-------------------FLAGS-------------------

UTILIZEI O CARACTERE "!" NO INÍCIO DO NOME DAS PRINCIPAIS DIVS ('FLAGS'), ASSIM FICA MAIS FÁCIL FAZER UMA BUSCA NA FOLHA DE ESTILOS.
ENTÃO, SE QUISER ACHAR A DIV GERAL DIGITE "!G"; BANNER: "!B"; RODAPE: "!R" E ASSIM POR DIANTE.
*/


/* !Geral
--------------------------------------*/
#geral{ width: 100%; height: auto; }



/* !Menu
---------------------------------------*/
#menu{ width: 100%; height: 30px; border-top: solid 4px #FFCF00; background: #fff; }
#menu-interno{ width: 940px; height: 30px; margin: 0 auto; }
#menu-interno ul{ display: block; list-style: none; float: right; width: 660px; _width: 680px; }
#menu-interno ul li{ font: 11px Arial, Helvetica, sans-serif; float: left; margin: 0 0 0 20px; color: #555; }
#menu-interno ul li a{ font: 11px Arial, Helvetica, sans-serif; float: left; color: #555; text-decoration: none; display: block; padding: 8px; background: #fff;  }
#menu-interno ul li a:hover{ font: 11px Arial, Helvetica, sans-serif; float: left; color: #fff; text-decoration: none; display: block; background: #FFCF00; padding: 8px; }



/* !Banner
---------------------------------------*/

/* Home
---------------------------------------*/
#banner-home{ width: 100%; height: 293px; background: #000; margin: 35px 0 0 0; display: block; }
#banner-interno-home{ width: 940px; height: 293px; margin: 0 auto; background: #000; display: block; position: relative;  }


/* Interna
---------------------------------------*/
#banner-internas{ width: 100%; height: 167px; background: #000; margin: 35px 0 0 0; display: block; padding: 0; position: relative; }
#banner-interno-internas{ width: 940px; height: 167px; margin: 0 auto; background: transparent; display: block; position: relative; z-index: 50; }

#logo{ position: absolute; top: -30px; left: 0; display: block; z-index: 50; }

/* Div que engloba as imagens do banner
-------------------------------------------------------------------------*/
#engloba-imagens-banner{ height: 167px; overflow: hidden; margin: 0; display: block; width: 100%; position: absolute; top: 0; left: 0; z-index: 30; }

/* Imagens do banner
-------------------------------------------------------------------------*/
#engloba-imagens-banner .img-01{ height: 167px; width: 1500px; }
#engloba-imagens-banner .img-02{ height: 167px; width: 1500px; }
#engloba-imagens-banner .img-03{ height: 167px; width: 1500px; }
#engloba-imagens-banner .img-04{ height: 167px; width: 1500px; }

/* Conjunto de positions das imagens do banner conforme a resolução
-------------------------------------------------------------------------*/
.img-01-1024{ background:url(../img/banner-img01.jpg) no-repeat 42% top; }
.img-02-1024{ background:url(../img/banner-img02.jpg) no-repeat 35% top; }
.img-03-1024{ background:url(../img/banner-img03.jpg) no-repeat 42% top; }
.img-04-1024{ background:url(../img/banner-img04.jpg) no-repeat 42% top; }

.img-01-1280{ background:url(../img/banner-img01.jpg) no-repeat 68% top; }
.img-02-1280{ background:url(../img/banner-img02.jpg) no-repeat 58% top; }
.img-03-1280{ background:url(../img/banner-img03.jpg) no-repeat 68% top; }
.img-04-1280{ background:url(../img/banner-img04.jpg) no-repeat 68% top; }
/*----------------------------------------*/


/* Frase topo
----------------------------------------*/
#box-chamada{ display: block; margin: 20px auto 0 auto; width: 940px; height: auto; position: relative; z-index: 10; text-align: center; }



/* !Conteúdo
--------------------------------------*/
#conteudo{ width: 100%; height: auto; background: transparent url(../img/bg_conteudo.gif) no-repeat left top; padding: 200px 0 0 0; margin:-70px 0 0 0; position: relative; z-index:5; }
#conteudo-interno{ width: 100%; height: auto; background: #fff; padding: 0 0 20px 0; margin: 0; }
#conteudo-interno2{ width: 940px; height: auto; margin: 0 auto; }

#sombra{ width: 100%; height: 28px; background: url(../img/sombra.png) repeat-x; }



/* !Esquerda
---------------------------------------*/
#esquerda{ width: 615px; height: auto; background: #fff; float: left; }
#esquerda #box-conteudo{ border-right: solid 1px #ccc; width: 584px; height: auto; padding: 0 20px 0 0; }



/* !Direita
---------------------------------------*/
#direita{ float: right; height: auto; background: #fff; width: 315px; }

#balao-tags{ width: 280px; height: 154px; background: url(../img/balao-tags.gif) no-repeat left top; display: block; padding: 10px; text-align: center; line-height:2.3em; }


/* Cx !Tags
--------------------------------------*/
a.link-tag-10px{ font: 10px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
a.link-tag-10px:hover{ font: 10px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: none;  }

a.link-tag-11px{ font: 11px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
a.link-tag-11px:hover{ font: 11px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: none;  }

a.link-tag-12px{ font: 12px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
a.link-tag-12px:hover{ font: 12px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: none;  }

a.link-tag-13px{ font: 13px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
a.link-tag-13px:hover{ font: 13px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: none;  }

a.link-tag-14px{ font: 14px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
a.link-tag-14px:hover{ font: 14px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: none;  }

a.link-tag-16px{ font: 16px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
a.link-tag-16px:hover{ font: 16px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: none;  }

a.link-tag-18px{ font: 18px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
a.link-tag-18px:hover{ font: 18px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: none;  }



/* !Rodapé
---------------------------------------*/
#rodape{ width: 100%; height: 100px; background: none; margin: 5px 0 0 0; padding: 0; position: relative; clear: both;  }
#corpo-rodape-interno{ width: 940px; height: 70px; margin: 0 auto; }
#logo-rodape{ width: 180px; height: 100px; background: transparent url(../img/logo-rodape.gif) no-repeat left 50%; float: left; display: block; }
#rodape-interno{ width: ; height: 80px; background: url(../img/bg_rodape.gif) repeat-x left top; float: left; margin: 0 0 0 10px; position: absolute; top: 0; right: 0; padding: 10px 0 10px 10px; }
#rodape-interno ul{ list-style: none; display: block; margin: 4px 0; clear: both; float: left; width: 770px; border: solid 0px #fff; }
#rodape-interno ul li{ float: left; font: 11px Arial, Helvetica, sans-serif; color: #636363; margin: 0 0 0 15px; }
#rodape-interno ul li a{ font: 11px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
#rodape-interno ul li a:hover{ font: 11px Arial, Helvetica, sans-serif; color: #FFCF00; text-decoration: none;  }


/* Conjunto de larguras do rodapé conforme a resolução
-----------------------------------------------------*/
.largura-rodape-1280{ width: 895px; }

.largura-rodape-1024{ width: 770px; }

.largura-rodape-1600{ width: 1055px; }

.largura-rodape-1440{ width: 975px; }

.largura-rodape-1360{ width: 935px; }
/*-------------------------------------*/



/* Etiqueta
---------------------------------*/
#etiqueta{ width: 33px; height: 161px; position:absolute; background: url(../img/acesse_cel.gif) no-repeat left top; top:200px; z-index: 999999; right: 0; text-indent: -5000px; }

#etiqueta a{ display: block; width: 52px; height: 242px; }



/* Classes gerais
---------------------------------------*/
.observacao-italico{ font: oblique 10px Arial, Helvetica, sans-serif; color: #636363; }
.img-centralizada{ margin: 0 auto; display: block; }



/* Tipografia geral
---------------------------------------*/
.titulo-laranja-40px{ font: bold 3.5em Arial, Helvetica, sans-serif; color: #E39F24; }
.titulo-laranja-24px{ font: bold 2em Arial, Helvetica, sans-serif; color: #E39F24; }
.titulo-laranja-36px{ font: bold 2.8em Arial, Helvetica, sans-serif; color: #E39F24; }

.titulo-preto-40px{ font: bold 3.5em Arial, Helvetica, sans-serif; color: #000; }
.titulo-preto-24px{ font: bold 2em Arial, Helvetica, sans-serif; color: #000; }
.titulo-preto-36px{ font: bold 2.8em Arial, Helvetica, sans-serif; color: #000; }

.txt-cinza-12px{ font: 12px Arial, Helvetica, sans-serif; color: #636363; }
.txt-amarelo-12px{ font: 12px Arial, Helvetica, sans-serif; color: #FFCF00; }

.txt-cinza-14px{ font: 14px Arial, Helvetica, sans-serif; color: #636363; }
.txt-cinza-20px{ font: 20px Arial, Helvetica, sans-serif; color: #636363; }

.txt-destaque{ display: block; padding: 10px; font: 14px Arial, Helvetica, sans-serif; color: #636363; background: #EEE8D3; text-align: ; }

.titulo-preto-borda{ font: bolder 18px Arial, Helvetica, sans-serif; color: #3C3934; border-bottom: solid 5px #EEE8D3; padding: 5px 0; display: block; }
.titulo-laranja-borda{ font: bolder 18px Arial, Helvetica, sans-serif; color: #E39F24; border-bottom: solid 5px #EEE8D3; padding: 5px 0; display: block; }



/* Links gerais
---------------------------------------*/
a.link-amarelo-sub-12px{ font: 12px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: underline; }
a.link-amarelo-sub-12px:hover{ font: 12px Arial, Helvetica, sans-serif; color: #636363; text-decoration: underline; }

a.link-amarelo-sub-14px{ font: 14px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: underline; }
a.link-amarelo-sub-14px:hover{ font: 14px Arial, Helvetica, sans-serif; color: #636363; text-decoration: underline; }

a.link-cinza-12px{ font: 12px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
a.link-cinza-12px:hover{ font: 12px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: none; }

a.link-cinza-14px{ font: 14px Arial, Helvetica, sans-serif; color: #636363; text-decoration: none; }
a.link-cinza-14px:hover{ font: 14px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: none; }

a.link-cinza-sub-12px{ font: 12px Arial, Helvetica, sans-serif; color: #636363; text-decoration: underline; }
a.link-cinza-sub-12px:hover{ font: 12px Arial, Helvetica, sans-serif; color: #E3A32F; text-decoration: underline; }