/* -------------------------------------------------------------- 
  
   Estilos para tela
	 * baseado no framework Blueprint v0.6 - http://code.google.com/p/blueprintcss/
	 
	 *** Seletores marcados com *IE FIX* indicam relação com o documento ie6.css onde ***
	 *** as propriedades são configuradas específicamente para o Internet Explorer 6  ***
   
-------------------------------------------------------------- */

@import 'reset.css';	/* Zera valores igualando os navegadores */
@import 'tipo.css';		/* Tipografia, fontes, cores e tamanhos */
@import 'grid.css';		/* Estrutura (container, colunas, etc) */
@import 'forms.css';	/* Formulários */

/* -------------------------------------------------------------- 
	
	MENUS (Navegação, menu lateral, submenu, etc.)
		*Utilize a classe desejada na div que contém a UL
		
-------------------------------------------------------------- */
h1.logo {
	float:left;
}
	h1.logo a {
		display: block;
		background:url(../img/logo.jpg) center no-repeat;
		width:220px;
		height:56px;
		text-indent:-9000px;
		padding:0;
	}

#nav.abas { 
	clear:both; 
	float:left;
	width:100%;
 }

.abas ul {
	list-style:none;
	margin:0;
	float:left; 
	border-bottom:1px solid #D7EcFF;
}
.abas ul li {
	display:inline;
	margin:auto;
}
.abas ul li a {
	background:url(../img/borda_aba.jpg) no-repeat top right;
	padding:0px 8px 0 0;
	float:left;
	margin-right:5px;
	text-decoration:none;
}
.abas ul li a span {
	background:url(../img/bg_aba.jpg) no-repeat top left;
	padding:7px 0 3px 8px;
	display:block;
	float:none;
}
.abas ul li a:hover, 
.abas ul li a.atual { background-position:bottom right; }

.abas ul li a:hover span,
.abas ul li a.atual span { background-position:bottom left; }

.abas ul li a.atual { font-weight:bold;}

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

Submenu com níveis em CSS:

Primeiro, considere a estrutura máxima de 3 níveis, sendo:
* Nível 1
* Nivel 1
	* Nível 2
	* Nivel 2
	* Nivel 2
		* Nivel 3
		* Nivel 3
	* Nivel 2
* Nivel 1

Esses três níveis podem ser exibidos de 2 maneiras diferentes:
1- classe .sub-1:
	O método mais clássico onde o usuário passa o mouse sobre o link e o nível seguinte aparece flutuando.

2- classe .sub-2:
	Nesse método, o segundo nível aparece dentro do nível principal, abaixo do link, e o nível seguinte aparece flutuando ao apontar o mouse sobre o ítem desejado.
	
Por questões de usabilidade, não é aconselhável que o menu ultrapasse os 3 níveis propostos.
Se for o caso, o ideal é repensar a estrutura do site (Arquitetura da Informação), ou em último caso, deixar apenas os 3 níveis na navegação e os níveis subsequentes dentro das páginas internas, como subnavegação.

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

.submenu ul {
	margin:0;
	list-style:none;
	float:left;
	width:100%; /* a largura é definida pela DIV onde a UL está contida */
	}
	
	.submenu ul ul { display:none; } /* Esconde os subníveis  */

	
.submenu ul li { /* Define os ítens de lista de todos os níveis */
	float:left;
	width:100%;
	clear:left;
	} /* Garante que os ítens de lista sejam exibidos corretamente nos navegadores IE 6 e 7 */
	
	.horizontal ul li { float:left; width:auto; clear:none; }
		.horizontal ul li li { width:100%; }

.submenu li:hover,
.submenu li.over { 
	position:relative;  /* O ítem sobre o qual o mouse está posicionado se torna a referência para o submenu */
 }

.submenu li a { /* IEFIX */ 
	text-decoration:none; 
	display:block; /* o visual é definido no link <a> ao invés do ítem de lista <li>, por isso o display:block*/
	padding:4px;
	border-bottom:1px solid #000;
	font-weight:bold;
	background-color:#CCCCCC;	/* Visual do primeiro nível */
	}
	
	.horizontal li a { 
		border-bottom:0 none;
		border-right:1px solid #ccc;
		text-align:center;
		padding:4px 10px;
		float:left;
		}
		
		.horizontal li li a { text-align:left; float:none; }
	

	.submenu li a:hover,
	.submenu li:hover a,
	.submenu li.over a {
		background-color:#eee;
		text-decoration:none;
		}
	
	
.submenu li li a,				
.submenu li:hover li a,
.submenu li.over li a  { 
	background-color:#DCE9DF;/* Visual do segundo nível */
	color:#006;
	}
		
	.submenu li li a:hover,
	.submenu li li:hover a,
	.submenu li li.over a { background-color:#D1DFD4; }
		
		
.submenu li li li a,
.submenu li li:hover li a,
.submenu li li.over li a {
	background-color:#EDEFF3; /* Visual do terceiro nível */
	color:#069;
	}
			
.submenu li li li a:hover { background-color:#E0E5EF;	}

/* Exibe o submenu do primeiro e segundo níveis no mouse over */
.sub-1 li:hover ul,
.sub-1 li.over ul,
	.sub-1 ul ul li:hover ul,
	.sub-1 ul ul li.over ul,
.sub-2 ul ul li:hover ul,
.sub-2 ul ul li.over ul {
	display:block;
	}
	
	/* Mantém os próximos níveis escondidos até chegar a hora deles */
	.sub-1 li:hover ul ul,
	.sub-1 li.over ul ul {
		display:none;
	}

/* Posiciona os submenus */	
.sub-1 ul ul,
.sub-2 ul ul ul,
.horizontal ul ul ul {
	position:absolute;
	top:15%;
	left:75%;
	width:150px;
	z-index:200;
	}
	
	.horizontal ul ul ul {
		width:170px;
		}
	
	.horizontal ul ul {
		left:0%;
		top:100%;
		}
		

.sub-2 ul ul a { padding-left:15px; } /*Identação para o segundo nível */


/* -------------------- Lista de Notícias -------------------- */

ul.listanoticia { 
	list-style:none;
	margin:0;
	float:left;
	}
	
	ul.listanoticia li {
		clear:both;
		border-bottom:1px solid #ddd;
		margin-bottom:1em;
		padding-bottom:0.5em;
		}
	
	ul.listanoticia li img{
		float:left; 
		margin:0 5px 0 0;
	}
	
	ul.listanoticia h4 {
		line-height:1em;
		margin-bottom:0.4em;
		}
	
	ul.divide div {
		float:left;
		width: 75%;
		}

/* -------------------- Texto de Notícia -------------------- */

.detnoticia h3 { margin-bottom:4px; }
.data { display:block; font-style:italic; color:#666; }
.anexos { 
	float:left;
	margin:5px 0 0;
	list-style:none;
	}
	.anexos li {
		padding:3px 12px 3px 18px;
		background:#f5f5f5 url(../img/ico_anexo.gif) no-repeat 5px;
		margin-bottom:2px;
		border:1px solid #ccc;
		float:left;
		margin-right:3px;
	}
	
.fonte { margin: 5px 0; }
	.fonte cite { display:block; line-height:1; }

/* -------------------- Galeria de Imagens -------------------- */

table.galeria {
	list-style:none;
	margin:0;
	float:left;
	border-collapse:separate;
	border-spacing:5px;
	}
	
	table.galeria td { 
		padding:10px;
		line-height:0;
		vertical-align:middle;
		text-align:center;
		}
		
		table.galeria td img {
			margin:0;
			}
			
			
			
			/* CONTEÚDO c/ publicidade */
#conteudob{ width:500px;  text-align:left; float:left; padding-left:50px;}
		#conteudob h3{ margin:0; padding:0;} 
	
	    #conteudob ul{ margin:0; padding:0; list-style:none; float:left; width:500px;}
			#conteudob ul li{width:145px; margin-bottom:20px; float:left;}
				#conteudob ul li span{width:640px; font-size:10px; margin-top:20px; color:#514f4b; float:left; clear:both;}
				#conteudob ul li h4{width:145px; float:left; margin-bottom:5px; padding:0;}
				#conteudob ul li h4 a{  font-size:11px; font-weight:bold; margin:5px 0 0 0; padding:0; color:#373537; float:left; text-decoration:none;}
					#conteudob li h4 a:hover{ text-decoration:underline;}
				#conteudob ul li img{float:left; margin-right:12px;}
				#conteudob ul li p{float:left;  width:380px;}
					#conteudob ul li p a{text-decoration:none; color:#514f4b; text-align:center;}
					#conteudob ul li p a:hover{text-decoration:underline; color:#514f4b;}
div#conteudob img.imgproduto{float:none};

