/* 
 * LEIA:
 * 
 * O css e dividido em 2 grupos (BASE E ESPECIFICO):
 * BASE: css definido como base do template. O css fica dentro do diretorio raiz do numero do "template"
 * - Esse ccs possue 3 grupos (TAMANHO, ESTILO, POSICAO).
 * - Para cada uns desses grupos havera um sub-grupo especificando a qual modulo se refere
 * ESPECIFICO: css especifico para o numero do irmao. O css fica dentro do diretorio raiz do numero do "irmao"
 * - A estrutura desse parte fica a cargo do desenvolvedor do template,
 * - E recomandado usar o mesmo padao usado no grupo de css BASE se o codigo for muito extenso
 * 
*/

/*________________________________________________ CSS BASE - TEMPLATE  _____________________________________________________*/
.clear-fix:before,
.clear-fix:after {
    content: " ";
    display: table;
}
.clear-fix:after { clear: both; }
.clear-fix { *zoom: 1; }

#detalheLayoutFundo {
    height: 0;
    position: relative;
    z-index: 0;
}
#detalheLayoutFundo .detalhe1{
	width: 100%;
	margin: auto;
	z-index: -2;
	position: relative;
	height: 7px;
}
#detalheLayoutFundo .detalhe2{
	width: 100%;
	margin: auto;
	z-index: -1;
	position: relative;
	height: 25px;
}
#detalheLayoutFundo .detalhe3{
	width: 100%;
	margin: auto;
	z-index: -2;
	position: relative;
	height: 270px;
}

#conteinerSiteInterno{
	z-index: 9999;
	position: relative;
}

/*__________ TAMANHO __________*/
	.forma{
		margin-bottom: 30px;
	}

	/*** MIOLO ***/
	#conteinerConteudo #conteinerMiolo{
		height:auto; 
		margin:auto;
	}
	
	#conteinerMiolo h1{
		font-weight: bold;
		line-height: 35px;
	}
	
	/*** IMAGEM ***/
	.conteinerImagem{ 
		margin:auto;
	}

	.tituloItem h1{
		font-size:20px;
	}
	/*** LOGO ***/
	#boxLogo{ 
		width:880px;
		margin: auto;
	}
	#boxLogo a{ 
		width:880px;
		display: table-cell; 	
	}
	#boxLogo img{ 
		max-width:400px;
		max-height: 120px;	
	}
	#conteinerLogo{
		width:680px;
		margin:auto;
	}
#layoutLogo{
	width:960px;
	height:174px;
}
	/*** MENU ***/
	.conteinerMenu{
		margin:auto auto 10px auto;
	}
	.boxMenuLayout{
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		border-radius: 8px;
	}
		
	.menuHorizontal .item_0{
		-moz-border-radius-topleft: 8px;
		-moz-border-radius-bottomleft: 8px;
		-webkit-border-top-left-radius: 8px;
		-webkit-border-bottom-left-radius: 8px;
		border-top-left-radius: 8px;
		border-bottom-left-radius: 8px;	
	}
	.menuHorizontal .menuHorizontal-mais:hover{
		-moz-border-radius-topright: 8px;
		-moz-border-radius-bottomright: 8px;	
		-webkit-border-top-right-radius: 8px;
		-webkit-border-bottom-right-radius: 8px;
		border-top-right-radius: 8px;
		border-bottom-right-radius: 8px;
	}
	.servicosEndereco{
		margin-top: 10px;
	}
	#conteinerSiteInterno,
	#conteinerEndereco{
		-moz-border-radius-bottomleft: 8px;
		-moz-border-radius-bottomright: 8px;
		-webkit-border-bottom-left-radius: 8px;
		-webkit-border-bottom-right-radius: 8px;
		border-bottom-left-radius: 8px;
		border-bottom-right-radius: 8px;
	}
	
	.menuVertical .item_0:hover{
		-moz-border-radius-topleft: 8px;
		-moz-border-radius-topright: 8px;
		-webkit-border-top-left-radius: 8px;
		-webkit-border-top-right-radius: 8px;
		border-top-left-radius: 8px;
		border-top-right-radius: 8px;
	}
	.menuVertical .menuVertical-mais:hover{
		-moz-border-radius-bottomright: 8px;
		-moz-border-radius-bottomleft: 8px;
		-webkit-border-bottom-right-radius: 8px;
		-webkit-border-bottom-left-radius: 8px;
		border-bottom-right-radius: 8px;
		border-bottom-left-radius: 8px;
	}
	
	.menuVertical .item_0.itemAtivo{
		-moz-border-radius-topleft: 8px;
		-moz-border-radius-topright: 8px;
		-webkit-border-top-left-radius: 8px;
		-webkit-border-top-right-radius: 8px;
		border-top-left-radius: 8px;
		border-top-right-radius: 8px;
	}

	.conteinerMenuBg{
		width:960px;
	}

	/*** SERVICOS ***/
	.conteinerServicos{
		width:210px;
		height: auto;
		display: block;
	}
	.conteinerServicos .titulo h1{
		width:90%;
		padding:8px 10px 0 10px;
		font-size:20px;
	}

	.caixa{
		display:inline-block;
	}
	.caixa .conteiner{
		margin: 5px auto!important;
	}
	.conteinerServicos h2, .conteinerServicos2 h2{
		text-transform: uppercase;
		font-weight: bold!important;
	}
	.caixa h2{
		text-indent: 10px;
	}
	.caixa .titulo{
		height: 30px;
		line-height: 30px;
		position: relative;

		-moz-border-radius: 7px;
		-webkit-border-radius: 7px;	
		border-radius:7px;
		
		margin-bottom: 8px!important;
		
	}
	.caixa .btn{
		margin-top: 2px;
	}
	
	.descricao{
		padding:0 10px;
		width: 190px!important;
	}
	
	/*** CONTEUDO ***/
	#conteinerConteudo{
		width:918px;
		margin-left:auto;
		margin-right:auto;
		display: table;
	}

	#conteinerConteudo{
		margin-top: 10px;
	}
	
	/*** SERVICOS ENDERECO ***/
	#conteinerEndereco .modelo2 .titulo h2{
		text-align: center;
	}
	#conteinerEndereco .titulo h2{
		margin-bottom: 10px;
	}
	
	#conteinerEndereco{
		width:878px;
		margin:auto;
	}

	/*** SERVICOS ENDERECO HORIZONTAL  ***/
	#conteinerEndereco{
		width:878px;
		margin-left:auto;
		margin-right:auto;
	}
	.regulagemConteudo{
		width: 100%;
	}
	/*** SERVICOS ENDERECO HORIZONTAL MODELO 1 ***/
	#conteinerEndereco .modelo1 .conteudo{
		width:266px;
	}
	
	ul#enderecoRetratil li .abrir{font-size: 12px;}
	
	/*** RODAPE ***/
	#rodape{
		margin-top: 2px;
	}
	#conteinerVisitantesRodape{
		width:960px;
		margin:10px auto 0 auto;
		padding-bottom:10px;
		margin-bottom:10px;
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		border-radius: 8px;
		height: 25px;
		line-height: 25px;
	}
	.boxRodape, .boxRodape a{
		font-size: 14px;
		text-align: center;
	}

/*__________ POSICAO __________*/

	/*** FRASE EFEITO ***/
	#boxLetreiro{
		top:146px;
		position:absolute;
		z-index: 999;
	}
	
	/*** IMAGEM ***/
	.conteinerImagem{
		position:relative;
	}

	/*** LOGO ***/
	#boxLogo{
		vertical-align: middle;
		text-align: center;
	}
	#boxLogo a{ 
		vertical-align: middle;
		text-align: center;
	}
	#conteinerLogo{
		position: relative;
	}

	/*** MENU ***/
	.conteinerMenu{
		position: relative;
	}

	/*** RODAPE ***/
	#conteinerVisitantes{
		vertical-align: middle;
		text-align: center;
		width: 250px;
	}
	.boxVisitantes{
		vertical-align: middle;
		text-align: center;
	}
	#conteinerRodape{
		float: right;
	}
	
	.boxCotacaoMoeda .conteudo,
	.boxCotacaoBolsa .animacao{
		margin-top: 8px;
	}
	
	.menuHorizontal li ul{
		right: 6px!important;
	}
/*__________ ESTILO __________*/

	/*** MENU ***/
	.menuHorizontal .menuHorizontal-itens a,
	.menuHorizontal-mais a{	
	    font-size: 12px;
	    font-weight: bold;
	    text-decoration: none;
	    text-transform: uppercase;
	}
	.menuVertical .menuVertical-itens a,
	.menuVertical-mais a{
		text-decoration: none;
		font-size: 11px;
	}
	.menuHorizontal .menuHorizontal-mais ul li a{
	    font-size: 11px;
	}

/*DATA E HORAS*/
	#dataHora{
		width:960px;
		margin:auto;
		height: 24px;
		line-height: 24px;
		vertical-align: middle;
		position: relative;
		z-index:99900;
	}
	#dataHora div{
		font-family: "Arial";
		font-size: 12px;
	}
			
	#dataHora .layout{float: right}
	#dataHora .diaSemana,
	#dataHora .data,
	#dataHora .hora{float: left;}	
	#dataHora .hora{width: 54px;}
	#conteinerEndereco .separadorEndereco{
		border-style: dotted !important;
	}
	
	#conteinerEndereco{
		float: left;
	}
