/* CSS Document */
body{
	background:url(images/bg3.gif) repeat-x 0 0 #05386B; color:#80B7EE;
	font:normal 14px/20px Arial, Helvetica, sans-serif;
	margin:0; padding:0;}
div, h1, h2, h3, h4, h5, h6, form, label, input, span, ul, li, p, a{
	margin:0; padding:0;}
ul{
	list-style:none;}
.spacer{
	font-size:0; line-height:0; clear:both;}
	
a {
	text-decoration: none;
}

a:link {
	color: #80B7EE;
	background-color: none;
}

a:hover {
	text-decoration: underline;
}

a:visited {
	text-decoration: underline;
	color: #80B7EE;
}

/* ---------------- funcionar dropdown no ios? - */

ios ul { display: none; }
ios li:hover ul { display: block; }

#ios ul { display: none; }
#ios li:hover ul { display: block; }

	
/* ------------------------ deixar barra de rolagem sempre visivel - */	
html { overflow-y: scroll; }
html { overflow: -moz-scrollbars-vertical; }
html { overflow-x: auto; }

/* ------------------------ menu Pulldown --------------------------- */

div.pdmenu { margin: 0; padding: 0; text-align: center; }
div.pdmenu li { width: 133px; height: 40px; margin: 0 -0px 0 0; padding: 0; float: left; display: block; cursor: pointer; line-height: 25px; list-style: none; border: 0px solid #000; }
div.pdmenu a { height: 40px; padding: 0; color:#000; display: block; line-height: 32px; text-decoration: none; }
div.pdmenu li ul { padding: 0; display: none; }
div.pdmenu li:hover ul { width: 133px; margin: 0 0 0 -0px; padding: 0; display: block; }
div.pdmenu li ul li a:hover { background: #999; }
/* ------------------------ pulldown end --- */
/* ------------------------ inicio Cabecalho --------------------------- */
#cabecalho{
	position:relative; width:798px; height:282px; margin:0 auto;
	background:url(images/header_bg.jpg) no-repeat 0 0 #05386B; color:#80B7EE;}
#cabecalho ul li{
	font:bold 12px/40px Arial, Helvetica, sans-serif; color:#FFFFFF; float:left;
	background:url(images/top_nav_bg.jpg) repeat-x 0 0 #0E0E0E;}
#cabecalho ul li a{
	font: 12px/40px Arial, Helvetica, sans-serif; color:#FFFFFF; text-align:center; text-decoration:none;
	background:url(images/top_nav_bg.jpg) repeat-x 0 0 #0E0E0E;4px; height:40px; display:block;}
#cabecalho ul li a.hover{
	font: 12px/40px Arial, Helvetica, sans-serif; color:#FFFFFF; text-align:center; text-decoration:none;
	background:url(images/top_nav_bg_h999.jpg) repeat-x 0 0 #0E0E0E;
	width:133px; height:40px; display:block;}
#cabecalho ul li a:hover{
	font: 12px/40px Arial, Helvetica, sans-serif; color:#FFFFFF; text-align:center; text-decoration:none;
	background:url(images/top_nav_bg_h.jpg) repeat-x 0 0 #0E0E0E;
	width:133px; height:40px; display:block;}
/* ------------------------ fim do Cabeçalho--------------------------- */



/* ------------------------ faixa Amarela --------------------------- */
#faixa{
	position:relative; width:800px; height:88px; margin:0 auto;
	background:url(images/faixa_bg.jpg) no-repeat 0 0 #DEA418; color:#FFFFFF;}
#faixa h2{
	background:url(images/faixa_texto.jpg) no-repeat 0 0 #DEA418; color:#FFFFFF;
	width:280px; height:59px; text-indent:-2000px; position:absolute; left:1px; top:14px;}
#faixa ul{
	position:absolute; left:290px; top:3px; height:86px;}
#faixa ul li.pic{
	margin:0; height:82px; float:left;}
#faixa ul li.pic img{
	border:#05386B 1px solid;}
#faixa ul li.pic a{
	background-color:#FFFFFF; color:#000000; padding:0 3px; display:block;}
	
	
/* ------------------------ setinhas do lado das fotos 
#faixa ul li.arrowLeft{
	height:88px; float:left;
	}
#faixa ul li.arrowLeft a{
	background:url(images/left_arrow.gif) no-repeat 0 0; display:block; text-indent:-20000px; text-decoration:none;
	width:13px; height:20px; margin:30px 0 0 0;}
#faixa ul li.arrowRight{
	height:88px; float:left;
	}
#faixa ul li.arrowRight a{
	background:url(images/right_arrow.gif) no-repeat 0 0; display:block; text-indent:-2000px; text-decoration:none;
	width:13px; height:20px; margin:30px 0 0 0;}
	
	
	--------------------------- */
	
/* ------------------------ fim da faixa --------------------------- */

/* ------------------------ body start --------------------------- */
#body{
	width: 775px;
	margin: 0 auto;
	padding: 15px; border: 0px solid;
	background: url(images/body_shadow_top.gif) no-repeat 0 0 #05386B;
	color: #80B7EE;
	text-align: justify;
}

#body h2{
	font:normal 24px/30px Arial, Helvetica, sans-serif; background-color:#05386Biiiii; color:#FFFFFF;}
#body p{
	font: normal 14px/20px Arial, Helvetica, sans-serif;
	color: #80B7EE;
	background-color: #05386Biiiii;
	font-weight: bold;
}
	
#body p strong{
	font:bold 14px/20px Arial, Helvetica, sans-serif; color:#D1E8FF; background-color:#05386B;}

/* -------------- caixas esquerda e direita do body ---------------- */
#bodyCentral{
	width:780px; float:left; padding:5px 0 17px 0; margin:2px 0 17px 0px}

#bodyEsquerda{
	width:352px; float:left; padding:5px 0 17px 0; margin:24px 0 17px 0px}

#bodyDireita{
	width:352px; float:left; background:url(images/bg_div.gif) repeat-x 0 0 #05386B; color:#FFFFFF; padding:5px 25px 14px; margin:24px 0 17px 20px;}
	

/* ------------------------ boxes do rodapé, apoio, etc ------------------------- */
#bodyRodape{
width:800px; margin:0 auto; padding:40px 20px 0;
background:url(images/body_footer_shadow.gif) no-repeat 0 0 #05386B; color:#FFFFFF;}

#bodyRodape a.quadrado01{
background:url(images/curta.png) no-repeat 0 0 #05386B; color:#FFFFFF; float:left;
width:200px; height:130px; display:block; text-decoration:none; text-indent:-2000px;}

#bodyRodape a.quadrado02{
background:url(images/depoimentos.png) no-repeat 0 0 #05386B; color:#FFFFFF; float:left;
width:200px; height:130px; display:block; text-decoration:none; text-indent:-2000px;} 

#bodyRodape a.quadrado03{
background:url(images/contribua.png) no-repeat 0 0 #05386B; color:#FFFFFF; float:left;
width:200px; height:130px; display:block; text-decoration:none; text-indent:-2000px;}

#bodyRodape a.quadrado04{
background:url(images/apoio.png) no-repeat 0 0 #05386B; color:#FFFFFF; float:left;
width:200px; height:130px; display:block; text-decoration:none; text-indent:-2000px;}
/* ------------------------ body end ------------------------- */






/* ------------------------ rodape start ------------------- */
#rodape{
background:url(images/footer_bg.gif) repeat-x 0 0 #14191C; color:#FFFFFF; margin:15px 0 0 0;}

#rodapeConteudo{
	width:800px; margin:0 auto; padding:22px 0;}
#rodapeConteudo ul{
	width:800px; margin:0 auto;}
#rodapeConteudo ul li{
	font:bold 15px/16px Arial, Helvetica, sans-serif;
	background-color:#14191C; color:#FFFFFF; float:left;}
#rodapeConteudo ul li a{
	font:bold 15px/16px Arial, Helvetica, sans-serif; padding:0 7px;
	background-color:#14191C; color:#FFFFFF; text-decoration:none;}
#rodapeConteudo ul li a:hover{
	font:bold 15px/16px Arial, Helvetica, sans-serif; padding:0 7px;
	background-color:#22292D; color:#FFFFFF; text-decoration:none;}	
	
#rodapeConteudo p{
	font:normal 12px/26px Arial, Helvetica, sans-serif; width:800px; text-align:center;
	background-color:#14191C; color:#FFFFFF; text-decoration:none; margin:0 auto;}


#rodapeConteudo p.desenv{
font:normal 11px/26px Arial, Helvetica, sans-serif; width:295px; text-align:center;
background-color:#14191C; color:#FFFFFF; text-decoration:none; margin:0 auto;}
#rodapeConteudo p.desenv a{
font:bold 11px/26px Arial, Helvetica, sans-serif; width:295px; text-align:center;
background-color:#14191C; color:#FFC04E; text-decoration:none; margin:0 auto;}
#rodapeConteudo p.desenv a:hover{
font:bold 11px/26px Arial, Helvetica, sans-serif; width:295px; text-align:center;
background-color:#22292D; color:#FFCE09; text-decoration:none; margin:0 auto;}

/* ------------------------ fim do rodapé --------------------------- */






/* --------- slider show dos formandos ---------- */

.slides {
    padding: 0;
    width: 730px;
    height: 700px;
    display: block;
    margin: 0 auto;
    position: relative;
	
}

.slides * {
    user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.slides input { display: none; }

.slide-container { display: block; }

.slide {
    top: 0;
    opacity: 0;
    width: 730px;
    height: 670px;
    display: block;
    position: absolute;

    transform: scale(0);

    transition: all .7s ease-in-out;
}

.slide img {
    width: 100%;
    height: 100%;
}

.nav label {
    width: 100px;
    height: 95%;
    display: none;
    position: absolute;

	  opacity: 0;
    z-index: 9;
    cursor: pointer;

    transition: opacity .2s;

    color: #FFF;
    font-size: 156pt;
    text-align: center;
    line-height: 380px;
    font-family: "Varela Round", sans-serif;
    background-color: rgba(255, 255, 255, .3);
    text-shadow: 0px 0px 15px rgb(119, 119, 119);
}

.slide:hover + .nav label { opacity: 0.5; }

.nav label:hover { opacity: 1; }

.nav .next { right: 0; }

input:checked + .slide-container  .slide {
    opacity: 1;

    transform: scale(1);

    transition: opacity 1s ease-in-out;
}

input:checked + .slide-container .nav label { display: block; }

.nav-dots {
	width: 100%;
	bottom: 9px;
	height: 11px;
	display: block;
	position: absolute;
	text-align: center;
}

.nav-dots .nav-dot {
	top: -5px;
	width: 21px;
	height: 21px;
	margin: 0 6px;
	position: relative;
	border-radius: 100%;
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.6);
}

.nav-dots .nav-dot:hover {
	cursor: pointer;
	background-color: rgba(0, 0, 0, 0.8);
}

input#img-1:checked ~ .nav-dots label#img-dot-1,
input#img-2:checked ~ .nav-dots label#img-dot-2,
input#img-3:checked ~ .nav-dots label#img-dot-3,
input#img-4:checked ~ .nav-dots label#img-dot-4,
input#img-5:checked ~ .nav-dots label#img-dot-5,
input#img-6:checked ~ .nav-dots label#img-dot-6,
input#img-7:checked ~ .nav-dots label#img-dot-7,
input#img-8:checked ~ .nav-dots label#img-dot-8,
input#img-9:checked ~ .nav-dots label#img-dot-9,
input#img-10:checked ~ .nav-dots label#img-dot-10,
input#img-11:checked ~ .nav-dots label#img-dot-11,
input#img-12:checked ~ .nav-dots label#img-dot-12,
input#img-13:checked ~ .nav-dots label#img-dot-13,
input#img-14:checked ~ .nav-dots label#img-dot-14,
input#img-15:checked ~ .nav-dots label#img-dot-15,
input#img-16:checked ~ .nav-dots label#img-dot-16,
input#img-17:checked ~ .nav-dots label#img-dot-17,
input#img-18:checked ~ .nav-dots label#img-dot-18,
input#img-19:checked ~ .nav-dots label#img-dot-19,
input#img-20:checked ~ .nav-dots label#img-dot-20,
input#img-21:checked ~ .nav-dots label#img-dot-21,
input#img-22:checked ~ .nav-dots label#img-dot-22,
input#img-23:checked ~ .nav-dots label#img-dot-23,
input#img-24:checked ~ .nav-dots label#img-dot-24,
input#img-25:checked ~ .nav-dots label#img-dot-25,
input#img-26:checked ~ .nav-dots label#img-dot-26,
input#img-27:checked ~ .nav-dots label#img-dot-27,
input#img-28:checked ~ .nav-dots label#img-dot-28,
input#img-29:checked ~ .nav-dots label#img-dot-29,
input#img-30:checked ~ .nav-dots label#img-dot-30,
input#img-31:checked ~ .nav-dots label#img-dot-31,
input#img-32:checked ~ .nav-dots label#img-dot-32,
input#img-33:checked ~ .nav-dots label#img-dot-33,
input#img-34:checked ~ .nav-dots label#img-dot-34,
input#img-35:checked ~ .nav-dots label#img-dot-35,
input#img-36:checked ~ .nav-dots label#img-dot-36,
input#img-37:checked ~ .nav-dots label#img-dot-37,
input#img-38:checked ~ .nav-dots label#img-dot-38,
input#img-39:checked ~ .nav-dots label#img-dot-39,
input#img-40:checked ~ .nav-dots label#img-dot-40,
input#img-41:checked ~ .nav-dots label#img-dot-41,
input#img-42:checked ~ .nav-dots label#img-dot-42
 {
	background: #DEA418;
}
/* ------------------------ fim do slider show  -------------- */