@char-set "utf-8";
/* CSS Document */

*{margin:0; padding:0; outline:none; resize:none}
body{width:100%; background:rgb(216, 237, 255); border-top:3px solid rgb(38, 56, 104);}
a{text-decoration:none;}
h1{font:normal 35px "denseregular"; color:rgb(38, 56, 104); padding:0 0 10px 0;}
h2{font:normal 35px "denseregular";}
p, a{font:13px "fira_sanslight"; color:rgb(51, 51, 51); text-align:justify;}


#topo{width:98%; max-width:1200px; margin:10px auto; position:relative; overflow:hidden;}
#logo{width:100%; max-width:200px; float:left;}
#webmail{position:absolute; right:0; font:12px "fira_sanslight"; color:rgb(51, 51, 51); cursor:pointer;}
#webmail:hover{color:rgb(166, 206, 57);}

#mainmenu{width:80%; float:right; font-size:0;  margin-top:55px;}
#mainmenu li{width:calc(100% / 8); display:inline-block; border-bottom:5px solid rgb(38, 56, 104); text-align:center;}
#mainmenu li a{font:16px/60px "fira_sanslight"; color:#616161; text-transform:uppercase;  text-align:center; display:block;}
#mainmenu li a:hover{color:rgb(166, 206, 57); -moz-transform:scale(1.1,1.1); -webkit-transform:scale(1.1,1.1); -ms-transform:scale(1.1,1.1);}
#mainmenu li a{-moz-transition:all ease-out 300ms; -webkit-transition:all ease-out 300ms; -ms-transition:all ease-out 300ms;}
#mainmenu li:hover{border-bottom:5px solid rgb(166, 206, 57);}
nav select{width:90%; font:18px/50px "fira_sanslight"; color:rgb(255, 255, 255); text-transform:uppercase; display:none; border:0; border-radius:3px; padding:15px 5px; margin:20px auto; background:rgb(167, 206, 70);}

#container{width:98%; max-width:1200px; margin:20px auto; overflow:hidden; font-size:0;}
#fotos{width:66%; float:left; position:relative;}
#banner{width:100%;}
#banner img{border-radius:7px 0 7px 0; overflow:hidden;}
#nav{position:absolute; z-index:1000; right:10px; top:-10px;}
#nav span{color:rgb(166, 206, 57); text-decoration:none; font:normal 53px Arial; cursor:pointer;}
#nav span:hover, #nav span.cycle-pager-active {color:rgb(38, 56, 104);}

#conteudo{width:66%; float:left; overflow:hidden;}
#conteudo p a{-moz-transition:all ease-out 300ms; -webkit-transition:all ease-out 300ms; -ms-transition:all ease-out 300ms;}
#conteudo p a:hover{color:rgb(166, 206, 57);}
#conteudo img{margin-right:5px;}
#conteudo .links{width:calc(100% / 3); display:inline-block; vertical-align:top;}
#conteudo .links a, .email{ display:inline-block; margin-left:5px; }
#conteudo .links a:hover, .email:hover{-moz-transform:scale(1.1,1.1); -webkit-transform:scale(1.1,1.1); -ms-transform:scale(1.1,1.1); }
#conteudo form{width:100%; margin-top:20px;}
#conteudo form input, textarea{font:16px "fira_sanslight"; color:rgb(51, 51, 51); padding:5px; margin-bottom:5px;}
#conteudo form input[name="nome"]{width:100%;}
#conteudo form input[name="email"]{width:49%; float:left;}
#conteudo form input[name="fone"]{width:50%; float:right;}
#conteudo form button{width:80px; font:14px "fira_sanslight"; color:#FFF; border:0; background:rgb(8,76,127); cursor:pointer; padding:10px; margin:10px 10px 0 0;}
#conteudo form textarea{width:100%;}

.servicos_menu{width:30%; float:left; margin-top:35px;}
.servicos_menu p {font:normal 30px "denseregular"; color:rgb(38, 56, 104); border-radius:3px; padding:3px; margin-bottom:8px; cursor:pointer; border-bottom:1px dotted rgb(204, 204, 204);}
.servicos_menu p:hover { background:rgb(222, 230, 234);}
#cont_servicos{margin-left:13%; width:50%; float:left; margin-top:35px; background:rgb(16, 68, 115); padding:5px 2%; border-radius:15px; box-sizing:border-box;}
#cont_servicos p, #cont_servicos h1{color:rgb(255, 255, 255);}

.qdr{width:50%; float:left; overflow:hidden; text-align:center;}


#lateral{width:32%; float:right;}
#lateral h2{color:rgb(255, 255, 255); padding:5px 0;}
#lateral form{width:100%; background:rgb(16,68,115); padding:10px; border-radius:7px 0 7px 0;  box-sizing:border-box;}
#lateral form input{width:100%; font:14px "fira_sanslight";  color:rgb(255, 255, 255); border:1px solid rgb(0,96,168); margin-bottom:5px; padding:8px 5px; background:rgb(8,76,127);}
#lateral form button{width:80px; font:14px "fira_sanslight"; color:rgb(255, 255, 255); border:1px solid rgb(0,96,168); background:rgb(8,76,127); cursor:pointer; margin-right:5px;}
#lateral form a{color:rgb(255, 255, 255); float:right; cursor:pointer; margin:5px 0}
#lateral form a:hover{color:rgb(166, 206, 57);}
#twitter{width:100%; min-height:280px; margin-top:10px;}

#container02{width:98%; max-width:1200px; overflow:hidden; margin:0 auto; padding:40px 0;}
#container02 .blocos{width:calc(100% / 3); padding:0 10px; float:left; border-right:1px solid rgb(16, 68, 115); box-sizing:border-box;}
#container02 .blocos:last-child{border:0;}
#container02 .blocos div{width:100px; font:70px/100px 'FontAwesome'; color:rgb(16, 68, 115); margin:0 auto; text-align:center;}
#container02 .blocos h2{font:25px/30px 'Oswald', sans-serif; color:rgb(16, 68, 115); text-align:center;}
#container02 .blocos p{font:16px 'Archivo Narrow', sans-serif; color:rgb(16, 68, 115); text-align:center; margin:30px 0;}
#container02 .blocos a{color:rgb(16, 68, 115); text-decoration:none;}
#container02 .blocos a:hover h2, #container02 .blocos a:hover p{color:rgb(183, 222, 54);}

#acesso{ width:98%; max-width:1200px; margin:0 auto; padding:40px 0; overflow:hidden; font-size:0;}
#acesso .l7{ width:14.28%; height:72px; display:inline-block; vertical-align:top; cursor:pointer; text-align:center; margin:10px 0;}
#acesso .l7:hover{ opacity:0.7;}
#acesso .l7:nth-child(1){background:url('../imagens/ip1.png') no-repeat center;}
#acesso .l7:nth-child(2){background:url('../imagens/ip2.png') no-repeat center;}
#acesso .l7:nth-child(3){background:url('../imagens/ip3.png') no-repeat center;}
#acesso .l7:nth-child(4){background:url('../imagens/ip4.png') no-repeat center;}
#acesso .l7:nth-child(5){background:url('../imagens/ip5.png') no-repeat center;}
#acesso .l7:nth-child(6){background:url('../imagens/ip6.png') no-repeat center;}
#acesso .l7:nth-child(7){background:url('../imagens/ip7.png') no-repeat center;}

#palco_rodape{ width:100%; margin-top:5px; padding:38px 0; background:url(../imagens/bg_header.jpg) center no-repeat;}
#rodape{width:100%; max-width:1200px; margin:0 auto; overflow:hidden;}
#rodape p{color:rgb(38, 56, 104); font-size:25px; float:left; margin-left:40px;}
#rodape p span{font-size:20px;}

#rede{width:210px; float:right; overflow:hidden; font-size:0;}
#rede .social{width:50px; height:50px; text-align:center; display:inline-block; vertical-align:top; background:rgb(166, 206, 57); margin:10px; -webkit-transition:all ease-out 400ms; -moz-transition:all ease-out 400ms; -ms-transition:all ease-out 400ms; -o-transition:all ease-out 400ms;}
#rede .social:hover{position:relative; box-shadow:black 0 0 5px; z-index:100; -webkit-transform:scale(1.2,1.2); -moz-transform:scale(1.2,1.2); -ms-transform:scale(1.2,1.2); -o-transform:scale(1.2,1.2);}
#rede .social:nth-child(1):before{content:'\f09a'; font:normal 25px/50px 'FontAwesome'; color:rgb(38, 56, 104);}
#rede .social:nth-child(2):before{content:'\f099'; font:normal 25px/50px 'FontAwesome'; color:rgb(38, 56, 104);}
#rede .social:nth-child(3):before{content:'\f0e1'; font:normal 25px/50px 'FontAwesome'; color:rgb(38, 56, 104);}


@media screen and (max-width:1024px){
	#palco_rodape{background:rgb(221, 221, 223)}
}
@media screen and (max-width:780px){
	#logo{float:none; margin:0 auto;}
	#mainmenu{float:none; width:100%;}
	#webmail{right:10px; top:20px;}
	#conteudo{width:100%; float:none;}
	#fotos{width:100%; float:none;}
	#lateral{width:100%; overflow:hidden; margin-top:20px;}
	#lateral form{width:50%; float:left; margin-top:10px;}
	#twitter{float:right; width:49%;}
	#acesso .l7{ width:calc(100% / 3);}
}
@media screen and (max-width:680px){
	#rodape p{text-align:center; float:none; margin:0;}
	#rede{float:none; margin:20px auto;}
	#mainmenu{ display:none; }
	nav select{ display:block; }
	#conteudo .links{width:100%;}
	.servicos_menu{width:100%; float:none;}
	#cont_servicos{width:100%; float:none; margin:0;}
}
@media screen and (max-width:640px){
	#lateral form, #twitter{width:100%; float:none;}
	#container02 .blocos{width:100%; border:0;}
	.qdr{width:100%; float:none;}
}
@media screen and (max-width:320px){
	#conteudo img{margin-bottom:5px;}
}