@charset "utf-8";
/*  CSS Document */

@font-face {
    font-family: 'denseregular';
    src: url('fontes/dense-regular-webfont.eot');
    src: url('fontes/dense-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fontes/dense-regular-webfont.woff2') format('woff2'),
         url('fontes/dense-regular-webfont.woff') format('woff'),
         url('fontes/dense-regular-webfont.ttf') format('truetype'),
         url('fontes/dense-regular-webfont.svg#denseregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body{width:100%; background:rgb(238, 238, 238);}
*{margin:0; padding:0; outline:none; resize:none; color: inherit; }
a{text-decoration:none; -webkit-transition:all ease-out 300ms; -moz-transition:all ease-out 300ms; -ms-transition:all ease-out 300ms; -o-transition:all ease-out 300ms;}
html{font-size:62.5%;}

.topo {position:fixed; bottom:0; right:10px; z-index:9999; width:50px; height:50px; cursor:pointer; display:none; font:20px/50px 'FontAwesome'; color:rgb(255,255,255);  background:rgb(68, 7, 132); text-align:center;}

#topo{width:100%; position:relative;}

#banner{width:100%; max-height: 615px; position:relative; overflow:hidden; z-index:0;}
.fotos{width: 100%; min-height: 615px; background-size: cover;}

#FxTopo{width:100%; background:rgba(0, 0, 0, 0.5); height: 150px; position:absolute; z-index:1000; top:20px;}
#container{width:98%; max-width:1200px; margin:0 auto; position:relative;}
#logo{width:320px; margin:20px auto 0 auto;}

#menu{width:120px; position:relative; float:left; background:rgb(68, 7, 132); border-radius:3px; padding:0 5px; margin:30px 0;}
#menu p{font:3rem/5rem 'Pathway Gothic One', sans-serif; color:rgb(255, 255, 255); text-align:center; cursor:pointer;}
#menu p::before{font:3rem/5rem 'FontAwesome'; color:rgb(255, 255, 255); content:"\f0c9"; margin-right:10px;}
#menu01{width:300px;  position:absolute; z-index:20; display:none;  left:0; top:90px;}

#mainmenu{width:100%; background:rgb(255, 255, 255); list-style:none; border-radius:3px; text-transform:uppercase; overflow:hidden;}
#mainmenu li{width:100%; border-bottom:1px solid rgb(238, 238, 238);}
#mainmenu li a{font:2.5rem/5rem 'denseregular'; color:rgb(100, 100, 100); display: block;  padding:0 10px;}
#mainmenu li a::before{content:"\f105"; font:3rem/7rem 'FontAwesome';  margin-right:20px; border-right:1px solid rgb(238, 238, 238); padding-right:15px;}
#mainmenu li:last-child{border-bottom:none;}
#mainmenu li a:hover{color:rgb(255, 255, 255); background:rgb(255, 55, 0);}

#textos{width:95%; max-width:1200px; margin:0 auto; overflow:hidden; padding:50px 0; position: relative;}
#textos h1{font:5rem 'denseregular'; color:rgb(51, 51, 51); text-transform:uppercase; margin-bottom:50px;}
#textos h1 span{font:6rem 'FontAwesome'; margin-right:10px;}
#textos p{font:1.4rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51); text-align:justify;}
#textos p a{color:rgb(51, 51,51)}
#textos p a:hover{color: rgb(255, 55, 0);}
#textos .utilitarios{width:25%; float:left;}
#textos .utilitarios p{font:1.4rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51); text-align:justify; margin:35px 5px;}
#textos .utilitarios p a{-webkit-transition:all ease-out 300ms; -moz-transition:all ease-out 300ms; -ms-transition:all ease-out 300ms; -o-transition:all ease-out 300ms;}
#textos .utilitarios p a{padding:10px 5px; border-radius:3px; text-align:center; cursor:pointer;}
#textos .utilitarios p a:hover{background:rgb(255, 55, 0); color:rgb(255, 255, 255);}
#textos div{width:50%; float:left; margin-bottom:50px;}
#textos div input, textarea{width:100%; padding:20px 10px; border:0; font:1.4rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51); margin-bottom:5px; outline:none;  border-bottom:3px solid rgba(81, 81, 81, 0.3); border-radius:3px;}
#textos div input:focus, textarea:focus{border-bottom:3px solid rgb(255, 55, 0);}
#textos div button{width:20%; background:rgb(81, 81, 81); border:0; color:rgb(255, 255, 255); height:70px; cursor:pointer; float:left; border-radius:3px; margin-right:5px;}
#textos div button[name="enviar"]{margin-right:5px;}
#textos div button[name="enviar"]::before{font:2.5rem 'FontAwesome'; content:"\f1d8";}
#textos div button[name="limpar"]::before{font:2.5rem 'FontAwesome'; content:"\f00d";}

#container01{width:98%; max-width:1200px; margin:0 auto; overflow:hidden; position: relative;}
#container01>h2{font:7rem 'denseregular'; color:rgb(51, 51, 51); text-align:center; border-bottom:1px solid rgb(51, 51, 51); text-transform:uppercase; padding:35px 0; width:90%; margin:0 auto;}
#container01 .box{width:calc(50% - 20px); float:left; margin:50px 10px 50px 0; background:rgb(255, 255, 255); padding:5px; overflow:hidden;}
#container01 .box:last-child{margin:50px 0 50px 10px;}
#container01 .box>h2{font:4rem/6rem 'denseregular'; color:rgb(51, 51, 51); text-align:justify; text-transform:uppercase;}
#container01 .box>h2 span{font:4rem/6rem 'FontAwesome'; color:rgb(51, 51, 51); margin-right:10px;}
#container01 .box p{font:1.4rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51); text-align:justify;}
#container01 .box p a{color:rgb(51, 51, 51); font:2.5rem 'denseregular'; cursor:pointer;}
#container01 .box p a:hover{color:rgb(255, 55, 0);}
#container01 .box p a::after{float:right; font:2.5rem 'FontAwesome'; content:"\f105";}

#container02{width:100%; background:url(imagens/04.jpg); background-position:60% 0; margin:20px 0;}
#container02 div{width:98%; max-width:1200px; margin:0 auto;}
#container02 div h2{font:5rem 'denseregular'; color:rgb(255, 255, 255); text-align:center; padding:100px 0; text-transform:uppercase;}

#container03{width:98%; max-width:1200px; margin:100px auto; overflow:hidden;}
#container03 .blocos{width:calc(25% - 10px); margin-right:10px; background:rgb(255, 255, 255); padding:20px 0; float:left; text-align:center;}
#container03 .blocos:last-child{background:none; margin-right:0; margin-left:10px; padding:0; text-align:justify;}
#container03 .blocos h2{font:6.5rem 'denseregular'; color:rgb(68, 7, 132);}
#container03 .blocos h2 span{color:rgb(51, 51, 51); display:block; font-size:4rem;}
#container03 .blocos>p{font:1.4rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51); margin:70px 0;}
#container03 .blocos button{width:75px; height:50px; background:rgb(51, 51, 51); font:2rem/5rem 'denseregular'; color:rgb(255, 255, 255); text-align:center; margin:0 auto; cursor:pointer; border-radius:3px; border:0;}
#container03 .blocos button:hover{-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); background:rgb(255, 55, 0);}
#container03 .blocos button{-webkit-transition:all ease-out 300ms; -moz-transition:all ease-out 300ms; -ms-transition:all ease-out 300ms; -o-transition:all ease-out 300ms;}
#container03 .blocos .links{width:calc(100% - 10px); background:rgb(68, 7, 132); cursor:pointer; margin:0 auto; font:2.5rem 'denseregular'; color:rgb(255, 255, 255); padding:10px 5px; margin-top:15px;}
#container03 .blocos .links span{font:2.3rem 'FontAwesome'; color:rgb(255, 255, 255); margin:0 10px;}
#container03 .blocos .links02{width:calc(100% - 10px); background:rgb(255, 255, 255); margin:0 auto; display:none; padding:20px 5px;}
#container03 .blocos .links02>p{font:1.2rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51);}
#container03 .blocos .links02>p:hover{color:rgb(255, 55, 0); cursor:pointer;}

#container04{width:100%; background:url(imagens/05.jpg); padding:50px 0; overflow:hidden;}
#container05{width:98%; max-width:1200px; margin:0 auto;}
#container05 h2{font:5.5rem/8rem 'denseregular'; color:rgb(255, 255, 255); text-align:center; text-transform:uppercase;}
#container05 .prog{width:calc(50% - 20px); margin:10px 5px 0 5px; background:rgba(255, 255, 255, 0.7); padding:5px; float:left; cursor:pointer; overflow:hidden;}
#container05 .prog div{width:120px; background:rgb(51, 51, 51); font:6rem/12rem 'FontAwesome'; color:rgb(255, 255, 255); text-align:center; border-radius:50%; float:left; margin-right:10px;}
#container05 .prog h3{font:5rem 'denseregular'; color:rgb(51, 51, 51);}
#container05 .prog p{font:1.4rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51);}
#container05 .prog:hover{-webkit-transform:scale(1.1,1.1); -moz-transform:scale(1.1,1.1); -ms-transform:scale(1.1,1.1); -o-transform:scale(1.1,1.1); background:rgb(255, 255, 255);}
#container05 .prog{-webkit-transition:all ease-out 300ms; -moz-transition:all ease-out 300ms; -ms-transition:all ease-out 300ms; -o-transition:all ease-out 300ms;}

#midia{width:100%; overflow:hidden; padding:20px 0;}
#container06{width:98%; max-width:1200px; margin:20px auto; overflow:hidden;}
#container06 div{width:120px; background:rgb(51, 51, 51); font:5rem/12rem 'FontAwesome'; color:rgb(255, 255, 255); float:left; text-align:center; border-radius:50%; margin-right:10px;}
#container06 h2{font:5rem/8rem 'Pathway Gothic One', sans-serif; color:rgb(49, 53, 61); text-transform:uppercase;}
#container06 p{font:1.2rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51);}
#container06 p a{color:rgb(51, 51, 51); font:1.4rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51);}
#container06 p a::before{font:1.6rem 'FontAwesome'; color:rgb(51, 51, 51); content:"\f023"; margin-right:5px;}
#container06 p a:hover{color:rgb(116, 144, 202);}
#container06 form{width:100%; overflow:hidden; margin-top:50px;}
#container06 input{width:25%; height:72px; border:0; padding:0 20px; font:1.4rem 'Carrois Gothic SC', sans-serif; color:rgb(51, 51, 51); border-bottom:3px solid rgba(81, 81, 81, 0.3);}
#container06 input:focus{border-bottom:3px solid rgb(255, 55, 0);}
#container06 button{width:11%; height:72px; background:rgb(51, 51, 51); border:0; color:rgb(255, 255, 255); float:right; cursor:pointer; border-radius:3px;}
#container06 button[name="enviar"]{margin-right:5px;}
#container06 button[name="enviar"]::before{font:2.0rem 'FontAwesome'; content:"\f1d8";}
#container06 button[name="limpar"]::before{font:2.0rem 'FontAwesome'; content:"\f00d";}

#container07{width:100%; background:rgb(51, 51,51); padding:50px 0;}
#rodape{width:98%; max-width:1200px; margin:0 auto; text-align:center;}
#rodape h2{font:6rem 'Poiret One', cursive; color:rgb(255, 255, 255);}
#rodape p{font:1.4rem/5rem 'Carrois Gothic SC', sans-serif; color:rgb(255, 255, 255);}
#rodape p a{color:rgb(255, 255, 255);}
#rodape p a:hover{color:rgb(255, 55, 0);}

#social{width:100%; max-width:240px; margin:0 auto; overflow:hidden;}
#social .redes{width:50px; height:50px; float:left; border-radius:50%; margin:10px 5px; text-align:center; overflow:hidden; font:3rem/5rem 'FontAwesome'; color:rgb(255, 255, 255); background:rgb(255, 55, 0); cursor:pointer; box-shadow:0 4px 5px rgb(51, 51, 51) inset;}
#social .redes:nth-child(1)::before{content:"\f09a";}
#social .redes:nth-child(2)::before{content:"\f099";}
#social .redes:nth-child(3)::before{content:"\f0d5";}
#social .redes:nth-child(4)::before{content:"\f0e1";}

@media screen and (max-width:780px){
	#container03 .blocos{width:calc(50% - 10px);}
	#container03 .blocos:nth-child(2){margin-right:0; margin-left:10px;}
}
@media screen and (max-width:640px){
	#container05 .prog{width:calc(90% - 20px); margin:10px auto; float:none;}
	#container06 input{width:100%; margin-bottom:5px;}
	#textos div{width:100%; margin-bottom:20px;}
	#container06 button, #textos div button{width:25%;}
	#textos .utilitarios{width:50%; float:left;}
}
@media screen and (max-width:480px){
	#container03 .blocos, #container03 .blocos:nth-child(2), #container03 .blocos:last-child{width:90%; float:none; margin:10px auto;}
	#container03 .blocos button{width:100px; height:75px;}
	#container01 .box, #container01 .box:last-child{width:90%; margin:10px auto; float:none;}
}
@media screen and (max-width:320px){
	#menu{float:none; margin:0 auto;}
	#logo{margin:35px auto;}
	#textos .utilitarios{width:100%; float:none;}
	#textos h1 span{display:block;}
	#container06 div{float:none; display:block;}
	#container05 .prog{text-align:center;}
	#container05 .prog div{margin:0 auto; float:none}
}