/********************
Estilizações gerais
********************/
* {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #273C77;
	margin: 0;
	padding: 0;
	border: none;
	list-style: none;
	text-decoration: none;
	vertical-align: baseline;
}

html { background: #C2C6D0 url(../images/background.jpg) repeat-x top; }

body { background: url(../images/sombra-lateral-destaque.gif) no-repeat 50% 75px; }

#geral {
	width: 770px;
	margin: 0 auto;
	background: url(../images/sombra-destaque.gif) no-repeat 0 354px;
}

hr, legend, .oculto { display: none; }
/********************
Fimd as estilizações gerais
********************/


/********************
Painel
********************/
#painel {
	width: 700px;
	margin: 0 auto;
	padding: 0 15px;
	background: url(../images/painel-externo.gif) repeat-x top;
}

#painel .limite {
	height: 65px;
	padding: 7px 24px 3px;
	background: url(../images/painel.gif) repeat-x top;
}

#painel span {
	float: left;
	width: 103px;
	height: 25px;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../images/bem-vindo.gif) no-repeat;
}

#painel p {
	float: right;
	margin-top: 5px;
}

#painel ul {
	clear: both;
	padding: 15px 0 0 3px;
}

#painel li {
	position: relative;
	z-index: 999;
	float: left;
	margin-right: 4px;
}

#painel li.ultimo { margin-right: 0; }

#painel li a, #painel li.sub {
	cursor: pointer;
	color: #FFF;
	text-align: center;
	display: block;
	width: 95px;
	padding: 3px 0;
	border: 2px solid #B0BCE2;
	background-color: #61719C;
}

#painel li.faq a {width:128px;}

#painel li a:hover, #painel li.sub:hover, #painel li.over { background-color: #7586B6; }

#painel li ul {
	display: none;
	position: absolute;
	top: 110%;
	left: -2px;
	width: 136px;
	padding: 7px;
	padding-top: 3px;
	border: 3px solid #8F98B5;
	background-color: #FFF;
	opacity: 0.9;
	-khtml-opacity: 0.9;
	filter: alpha(opacity=90);
	z-index: 999;
}

#painel li:hover ul, #painel li.over ul { display: block; }

#painel li li {
	float: none;
	margin: 0;
	padding: 3px 0;
	border-bottom: 1px dashed #A3A9B1;
}

#painel li li.over { background: none; }

#painel li li a {
	color: #273C77;
	text-align: left;
	display: block;
	width: 120px;
	padding: 3px;
	padding-left: 13px;
	border: none;
	background: url(../images/bullet-submenu.gif) no-repeat 5px 8px;
}

#painel li li a:hover {
	color: #FFF;
	background-position: 5px -7px;
}
/********************
Fim do painel
********************/


/********************
Destaque
********************/
#destaque {
	position: relative;
	clear: both;
	width: 770px;
	height: 279px;
}

#destaque h1 {
	position: absolute;
	top: 5px;
	left: 5px;
	width: 301px;
	height: 269px;
}

#destaque a {
	display: block;
	width: 301px;
	height: 269px;
	text-indent: -9999px;
	background-color: #FFF;
	opacity: 0;
	-khtml-opacity: 0;
	filter: alpha(opacity=0)
}

#destaque a:hover {
	opacity: 0.1;
	-khtml-opacity: 0.1;
	filter: alpha(opacity=15);
}

#destaque img {
	display: block;
	width: 760px;
	height: 269px;
	overflow: hidden;
	border: 5px solid #7F89A6;
}
/********************
Fim do estaque
********************/


/********************
Conteudo
********************/
#conteudo {
	width: 700px;
	margin: 0 auto;
	padding: 0 15px;
	background: url(../images/bg-conteudo.gif) repeat-x top;
}

#conteudo .limite {
	overflow: hidden;
	padding: 1px 4px 0;
	background: #FFF url(../images/conteudo-sombra.gif) repeat-x top;
}

#principal {
	float: right;
	width: 500px;
	min-height: 523px;
	padding-bottom: 20px;
}

	/********************
	Menu de navegacao
	********************/
	#nav {
		height: 62px;
		margin-bottom: 0px;
		padding: 8px 10px 5px;
		background: url(../images/bg-navegacao.gif) repeat-x top; 
	}
	
	#nav h6 {
		font-weight: normal;
		float: left;
		padding-left: 11px;
		background: url(../images/bullet-nav.gif) no-repeat left;
	}
	
	#nav h6 a {
		color: #000;
		text-decoration: underline;
	}
	
	#nav h6 a:hover { text-decoration: none; }
	
	#nav span { float: right; }
	
	#nav span a {
		color: #000;
		padding-left: 11px;
		background: url(../images/bullet-voltar.gif) no-repeat left;
	}
	
	#nav span a:hover { text-decoration: underline; }
	
	#nav h6, #nav span { margin-bottom: 3px; }
	
	#nav h2 {
		font-size: 1.6em;
		clear: both;
		padding-top: 10px;
		border-top: 1px solid #9aa5c4;
	}
	/********************
	Fim do menu de navegacao
	********************/
/********************
Fim do conteudo
********************/


/********************
Lateral
********************/
#lateral {
	float: left;
	width: 160px;
	padding: 5px 13px;
	background: url(../images/bg-lateral.gif) repeat-x top;
}

#lateral div { margin-bottom: 8px; }

#lateral h4 {
	height: 43px;
	margin-bottom: 5px;
	text-indent: -9999px;
	border: 2px solid #B7BED2;
	background-color: #FFF;
	background-repeat: no-repeat;
	background-position: 20px 50%;
}

	/********************
	Agenda
	********************/
	#agenda h4 { background-image: url(../images/agenda.gif); }
	
		/********************
		Calendario
		********************/
		#lateral #calendario {
			position: relative;
			width: 154px;
			margin: 0 auto;
			padding: 2px;
			padding-bottom: 20px;
			overflow: hidden;
			background: #FFF url(../images/calendario.gif) no-repeat 2px 98%;
		}
		
		#calendario div { margin: 0; }
		
		#calendario button { cursor: pointer; }

			/********************
			Mes anterior/atual/proximo
			********************/
			.meses {
				height: 14px;
				padding: 0 4px 3px;
				border-bottom: 1px solid #CED4E3;
			}

			.meses button {
				width: 16px;
				height: 14px;
				text-indent: -9999px;
			}

			.mes-ant {
				float: left;
				margin-right: 10px;
				background:url(../images/mes-anterior.gif) no-repeat;
			}

			.meses strong {
				font-size: 0.9em;
				font-weight: normal;
				color: #FFF;
				text-align: center;
				float: left;
				width: 93px;
				height: 14px;
				background: url(../images/mes-atual.gif) no-repeat;
			}

			.mes-prox {
				float: right;
				background:url(../images/mes-proximo.gif) no-repeat;
			}
			/********************
			Fim: mes anterior/atual/proximo
			********************/


			/********************
			Dias
			********************/
			#calendario table {
				clear: both;
				border-top: 1px solid #ECEEF4;
				background-color: #ECEEF4;
			}

			#calendario caption { display: none; }

			#calendario th {
				cursor: default;
				color: #6376A7;
				font-weight: bold;
				padding: 2px 0;
				background-color: #F1F3F7;
			}

			#calendario th, #calendario td { vertical-align: middle; }

			#calendario tr { background-color: #ECEEF4; }

			#calendario tr td { border-bottom: 1px solid #E0E4ED; }

			#calendario td span, #calendario td a {
				display: block;
				padding: 2px 5px;
				background-color: #FFF;
			}

			#calendario td a { background-color: #D0D6E4; }

			#calendario td a:hover {
				color: #FFF;
				background-color: #6376A7;
			}
			/********************
			Fim: dias
			********************/


			/********************
			Ano anterior/atual/proximo
			********************/
			.ano {
				position: absolute;
				bottom: 2px;
				right: 3px;
				width: 45px;
				height: 14px;
			}

			.ano button {
				position: absolute;
				right: 0;
				width: 15px;
				height: 7px;
				padding: 0;
				overflow: hidden;
				text-indent: -9999px;
			}

			.ano button.ano-ant {
				bottom: 0;
				background: url(../images/ano-anterior.gif) no-repeat top;
			}

			.ano button.ano-prox {
				top: 0;
				background: url(../images/ano-proximo.gif) no-repeat top;
			}
			/********************
			Fim: ano anterior/atual/proximo
			********************/
		/********************
		Fim: calendario
		********************/
	
	#agenda .mais {
		color: #FFF;
		display: block;
		width: 140px;
		margin: 3px auto 0;
		padding: 3px 5px 3px 11px;
		background: #61719C url(../images/bullet-submenu.gif) no-repeat 5px -7px;
	}
	
	#agenda .mais:hover { background-color: #7586B6; }
	/********************
	Fim da agenda
	********************/

	/********************
	Cursos
	********************/
	#cursos1 h4 { background-image: url(../images/agenda.gif); }
	
	#cursos1 ul { padding-bottom: 3px; }
	
	#cursos1 li { margin-bottom: 2px; }
	
	#cursos1 li a {
		display: block;
		width: 142px;
		padding: 3px;
		padding-left: 10px;
		background: #FFF;
	}
	
	#cursos1 li a:hover { background-color: #CFD7EB; }
	
	#cursos1 .mais {
		color: #FFF;
		display: block;
		width: 140px;
		margin: 3px auto 0;
		padding: 3px 5px 3px 11px;
		background: #61719C url(../images/bullet-submenu.gif) no-repeat 5px -7px;
	}
	
	#cursos1 .mais:hover { background-color: #7586B6; }	
	
	/********************
	Fim: cursos
	********************/

	/********************
	Cursos
	********************/
	#cursos h4 { background-image: url(../images/cursos.gif); }
	
	#cursos ul { padding-bottom: 3px; }
	
	#cursos li { margin-bottom: 2px; }
	
	#cursos li a {
		display: block;
		width: 142px;
		padding: 3px;
		padding-left: 15px;
		background: #E6EAF5 url(../images/bullet01.gif) no-repeat 5px 50%;
	}
	
	#cursos li a:hover { background-color: #CFD7EB; }
	
	#cursos .mais {
		padding-left: 15px;
		background: url(../images/bullet01.gif) no-repeat 5px 50%;
	}
	
	#cursos .mais:hover { text-decoration: underline; }
	/********************
	Fim: cursos
	********************/

	/********************
	Fale conosco
	********************/
	#fale-conosco h4 { background-image: url(../images/fale-conosco.gif); }
	
	#fale-conosco p {
		text-align: justify;
		padding: 0 15px 0 10px;
	}
	
	#fale-conosco p a:hover { text-decoration: underline; }
	/********************
	Fim: fale conosco
	********************/
/********************
Fim da lateral
********************/


/********************
Rodape
********************/
#rodape {
	clear: both;
	width: 633px;
	height: 46px;
	margin: 0 auto;
	padding: 24px 40px 5px 33px;
	background: url(../images/rodape.jpg) no-repeat top;
}

#rodape p {
	float: left;
	width: 93px;
	height: 13px;
	text-indent: -9999px;
	background: url(../images/etjk.gif) no-repeat;
}

#rodape a {
	float: right;
	width: 39px;
	height: 16px;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../images/interag.gif) no-repeat 0 0;
}
#rodape a:hover { background-position: 0 -16px; }
/********************
Fim do rodape
********************/