*{margin:0; padding:0; border:0; text-decoration:none;}

input[type='submit'], input[type='reset'], button[type='submit'], button[type='reset'], [onClick], li{cursor:pointer; outline:none;}

header, nav, section, article, footer, aside{ display:block;}

/* h1, h2, h3, h4, h5, h6, h7, p, span{ cursor:default; } */

::-webkit-scrollbar {background:white; width:0.9rem; border-radius:0.5rem; z-index:50; position:relative;}
::-moz-scrollbar {background:white; width:0.9rem; border-radius:0.5rem; z-index:50; position:relative;}
::-webkit-scrollbar-thumb {background:black;} 
::-moz-scrollbar-thumb {background:black;} 
::-webkit-scrollbar-track {background:rgba(0,0,0,0.3);} 
::-moz-scrollbar-track {background:rgba(0,0,0,0.3);} 

.up{ cursor:pointer; position:fixed; bottom:0.5rem; right:1.5rem; z-index:9999; width:6.0rem; height:6.0rem; text-align:center; border-radius:50% 50% 0; background:black; display:none;}
.up:before{ font:lighter 2.5rem/6rem 'FontAwesome'; text-align:center; content:'\f102'; color:white; }
.up:hover:before{ color:rgb(34, 45, 132); }

html{ font-size: 62.5% !important; }

#dots{ position:absolute; z-index:900; width:100%;  height:100%; opacity:0.6; top:0; overflow:hidden; background:url(../banner/dots4.png); } 
#fotos{ z-index:-10; width:100%; max-height:40rem; right:0; overflow:hidden; }
#fotos img{ width:100%; height:auto; }

#layout{ width:100%; height:12rem; background:rgb(251, 199, 1); overflow:hidden; }
#logo{width:100%; max-width:350px; float:right; background:rgb(255, 255, 255); height:100%;}  
#logo img{margin-top:25px;}

#layout2{ width:80%; margin:0 auto; overflow:hidden; }
#layout2 .l2{ width:40%; margin:4%; float:left; }
#layout2 .l2 img{ width:100%; height:auto; border:0.5rem solid whiteSmoke; display:block; padding:0; }
#layout2 .l2 h2{ font:400 3rem 'Fjalla One', sans-serif; color:rgb(23, 29, 77); padding:1.5rem 0; letter-spacing:-0.1rem; text-transform:uppercase; } 
#layout2 .l2:nth-child(1) h1:before{ content:'\f015'; font:normal 4rem 'FontAwesome'; }
#layout2 .l2:nth-child(2) h1:before{ content:'\f0ad'; font:normal 4rem 'FontAwesome'; }
#layout2 .l2 p{ font:400 1.6rem 'Archivo Narrow', sans-serif; color:rgb(23, 29, 77); text-align:justify; }
#layout2 .l2 span{ font:400 1.4rem 'Cuprum', sans-serif; color:grey; text-transform:uppercase; }

button[name='bl2']{ -webkit-transition:all ease-out 150ms; -moz-transition:all ease-out 150ms; -ms-transition:all ease-out 150ms; -o-transition:all ease-out 150ms; }
button[name='bl2']{ cursor:pointer; font:400 1.6rem 'Archivo Narrow', sans-serif; color:white; padding:2rem 3rem; border-radius:0.3rem; background:rgb(34, 45, 132); float:right; margin-top:4rem; }
button[name='bl2']:hover{ background:rgb(23, 29, 77); -webkit-transform:scale(1.05,1.05); -moz-transform:scale(1.05,1.05); -ms-transform:scale(1.05,1.05); -o-transform:scale(1.05,1.05); }

#layout3{ width:100%; background:rgb(34, 45, 132); overflow:hidden;}
#layout3 .l3{ width:80%; margin:0 auto; }
#layout3 .l3 .l3a{ width:45%; margin:1% 2.5%; float:left; }
#layout3 .l3 .l3a h3{ font:400 3rem 'Fjalla One', sans-serif; color:white; padding:1.5rem 0; letter-spacing:-0.1rem; text-transform:uppercase; } 
#layout3 .l3 .l3a p{ font:400 1.6rem 'Archivo Narrow', sans-serif; color:white; text-align:justify; }

button[name='bl3']{ -webkit-transition:all ease-out 150ms; -moz-transition:all ease-out 150ms; -ms-transition:all ease-out 150ms; -o-transition:all ease-out 150ms; }
button[name='bl3']{ cursor:pointer; font:400 1.5rem 'Archivo Narrow', sans-serif; color:white; padding:2rem; border-radius:50%; background:rgb(23, 29, 77); float:right; margin-right:2rem; margin-top:1rem; }
button[name='bl3']:hover{ background:white; color:rgb(23, 29, 77); -webkit-transform:scale(1.05,1.05); -moz-transform:scale(1.05,1.05); -ms-transform:scale(1.05,1.05); -o-transform:scale(1.05,1.05); }

#layout4{ width:80%; margin:4% auto; overflow:hidden; }
#layout4 .l4{ width:30%; margin:0 1.5%; float:left; }
#layout4 .l4 h4{ font:400 3rem 'Fjalla One', sans-serif; color:rgb(23, 29, 77); padding:1.5rem 0; letter-spacing:-0.1rem; text-transform:uppercase; } 
#layout4 .l4 p{ font:400 1.6rem 'Archivo Narrow', sans-serif; color:rgb(23, 29, 77); text-align:justify; }

#layout5{ width:80%; margin:0 auto; overflow:visible; }
#layout5 h5{ font:400 6rem 'Poiret One', cursive; text-align:center; color:rgb(23, 29, 77); letter-spacing:-0.1rem; }

form[name='online']{ width:100%; padding:5% 0; }
form[name='online'] input{ position:relative; float:left; width:20%; margin:0 0.5%; float:left; font:400 1.4rem/6rem 'Archivo Narrow', sans-serif; text-transform:uppercase; color:DarkSlateGrey; background:transparent; text-indent:1rem; border-left:solid 0.4rem DarkSlateGrey; border-bottom:solid 0.1rem DarkSlateGrey; margin-bottom:1rem; outline:none; }
form[name='online'] input:focus{ border-left:solid 1.5rem DarkSlateGrey; background:white; }
form[name='online'] input, button[name='send'], button[name='reset'], #layout5 button[name='admin'], #layout5 button[name='bl5']{ -webkit-transition:all ease-out 200ms; -moz-transition:all ease-out 200ms; -ms-transition:all ease-out 200ms; -o-transition:all ease-out 200ms; }

button[name='send']{ float:left; cursor:pointer; width:20%; border-radius:0.3rem; background:rgb(23, 29, 77); color:white; font:400 1.7rem/6rem 'Fjalla One', sans-serif; text-transform:uppercase; outline:none; }
button[name='reset']{ float:left; cursor:pointer; width:8%; margin:0 0.5%; border-radius:0.3rem; background:grey; color:white; font:400 1.7rem/6rem 'Fjalla One', sans-serif; text-transform:uppercase; outline:none; }
button[name='reset']:before{ content:'\f00d'; font:normal 1.9rem 'FontAwesome'; color:white; }

button[name='admin']{ float:left; cursor:pointer; width:5%; border-radius:0.3rem; background:salmon; color:white; text-transform:uppercase; outline:none; }
button[name='admin']:before{ content:'\f234'; font:normal 1.9rem/6rem 'FontAwesome'; }
button[name='send']:hover, button[name='reset']:hover, button[name='admin']:hover{ background:black; }

button[name='bl5']{ float:left; cursor:pointer; margin:3% 1%; width:31%; padding:1% 0; border-radius:0.3rem; background:rgb(23, 29, 77); color:white; font:400 2.4rem 'Fjalla One', sans-serif; text-align:center; text-transform:uppercase; outline:none; }
button[name='bl5'] p{ font:400 1.4rem 'Archivo Narrow', sans-serif; text-transform:uppercase; color:white; }
button[name='bl5']:hover{ background:black; -webkit-transform:scale(1.05,1.05); -moz-transform:scale(1.05,1.05); -ms-transform:scale(1.05,1.05); -o-transform:scale(1.05,1.05); }

#layout6{ width:100%; border-top:solid 1rem rgb(11, 15, 48); background:rgb(34, 45, 132); overflow:hidden; }
#layout6 .l6{ width:80%; margin:0 auto; padding:3rem 0; }
#layout6 .l6 h6{ font:400 6rem 'Poiret One', cursive; text-align:center; color:white; }
#layout6 .l6 p{ font:400 1.6rem 'Archivo Narrow', sans-serif; padding:8rem 0; color:white; text-align:center; }

#layout6 .l6a{ width:32rem; margin:0 auto; bottom:5rem; position:relative; }
#layout6 .l6a social{ cursor:pointer; }
#layout6 .l6a .social div{ box-shadow: inset -0.5rem 0.5rem 1rem rgb(0, 0, 0); width:5rem; height:5rem; margin:0 0.1rem; text-align:center; float:left; border-radius:50%; background:rgb(23, 29, 77); -webkit-transition:all ease-out 400ms; -moz-transition:all ease-out 400ms; -ms-transition:all ease-out 400ms; -o-transition:all ease-out 400ms; }
#layout6 .l6a .social:hover div { z-index:50; -webkit-transform:rotateY(360deg) scale(1.2,1.2); -moz-transform:rotateY(360deg) scale(1.2,1.2); -ms-transform:rotateY(360deg) scale(1.2,1.2); -o-transform:rotateY(360deg) scale(1.2,1.2);  -webkit-transition:all ease-out 400ms; -moz-transition:all ease-out 400ms; -ms-transition:all ease-out 400ms; -o-transition:all ease-out 400ms; }
#layout6 .l6a .social:nth-child(1) div:before{ content:'\f09a'; font:normal 2.5rem/5rem 'FontAwesome'; color:white; }
#layout6 .l6a .social:nth-child(2) div:before{ content:'\f099'; font:normal 2.5rem/5rem 'FontAwesome'; color:white; }
#layout6 .l6a .social:nth-child(3) div:before{ content:'\f0e1'; font:normal 2.5rem/5rem 'FontAwesome'; color:white; }
#layout6 .l6a .social:nth-child(4) div:before{ content:'\f16d'; font:normal 2.5rem/5rem 'FontAwesome'; color:white; }
#layout6 .l6a .social:nth-child(5) div:before{ content:'\f0d5'; font:normal 2.5rem/5rem 'FontAwesome'; color:white; }
#layout6 .l6a .social:nth-child(6) div:before{ content:'\f16a'; font:normal 2.5rem/5rem 'FontAwesome'; color:white; }

a{ color:white; }
a:hover{ color:rgb(57, 75, 219); }

form[name='contato']{ position:relative; margin:4rem 1rem; }

form[name='contato'] input{ font:400 1.6rem 'Archivo Narrow', sans-serif; color:rgb(51, 51, 51); width:98%; height:8rem; background:white; text-indent:1rem; border-left:solid 0.4rem rgb(251, 199, 1); border-bottom:solid 0.1rem rgb(251, 199, 1); margin-bottom:1rem; outline:none; }
form[name='contato'] input:focus{ border-left:solid 1.5rem rgb(251, 199, 1); background:whiteSmoke; }

form[name='contato'] textarea{ font:400 1.6rem 'Archivo Narrow', sans-serif; color:rgb(51, 51, 51); width:98%; height:26rem; background:white; text-indent:1rem; border-left:solid 0.4rem rgb(251, 199, 1); border-bottom:solid 0.1rem rgb(251, 199, 1); margin-bottom:10rem; outline:none; }
form[name='contato'] textarea:focus{ border-left:solid 1.5rem rgb(251, 199, 1); background:whiteSmoke; }

button[name='cont']{ width:100%; height:5rem; background:url(../imagem/c3b.png) center  no-repeat rgb(23, 29, 77); border-radius:2px; margin-top:1rem;  }
button[name='cont']:hover{ width:100%; height:5rem; background:url(../imagem/c3b.png) center no-repeat rgb(34, 45, 132); border-radius:0.2rem; }

form[name='contato'] input, form[name='contato'] input:focus, form[name='contato'] textarea, form[name='contato'] textarea:focus, button[name='cont'], button[name='cont']:hover{ -webkit-transition:all ease-out 250ms; -moz-transition:all ease-out 250ms; -ms-transition:all ease-out 250ms; -o-transition:all ease-out 250ms; }


#conteudo{ width:80%; margin:0 auto; }
#conteudo h1{ width:100%; padding:5rem 0; font:400 3.2rem 'Fjalla One', sans-serif; color:rgb(23, 29, 77); text-transform:uppercase; }
#conteudo p{ font:400 1.6rem 'Archivo Narrow', sans-serif; padding:1rem 0; text-align:justify; }
#conteudo .pree{ margin-top:4.5rem; }
#conteudo .pree span{ font:400 1.6rem 'Archivo Narrow', sans-serif; color:white; background:rgb(23, 29, 77); padding:2rem; }

@media screen and (max-width:1366px) {
	#conteudo, #layout2, #layout3 .l3, #layout4, #layout5{ width:90%; }
}
@media screen and (max-width:1280px) { }

@media screen and (max-width:1024px) {
	#layout2, #layout3 .l3, #layout4, #layout5{ width:100%; }
	#conteudo{ width:98%; }
}
@media screen and (max-width:768px) {
	#layout{ padding-bottom:10rem; } 
	#layout h1{ width:100%; text-align:center; padding:0; }
	
	#layout4 .l4{ display:block !important; width:50%; margin-left:25%; margin-bottom:2.5rem; }
	
	form[name='online'] input{ width:98%; }
	button[name='send']{ margin-left:0.5%; margin-bottom:5%; }
	button[name='admin']{ width:8% !important; }
	button[name='bl5']{ width:90%; margin:1rem auto; margin-left:5%; }
}
@media screen and (max-width:640px) {
	#layout2 .l2{ width:90%; }
	#layout3 .l3 .l3a{ width:90%; }
	#layout4 .l4{ display:block !important; width:60%; margin-left:20%; }
	#layout6 .l6{ width:98%; }
}
@media screen and (max-width:480px) {
	#fotos{ display:none; }
	#layout4 .l4{ display:block !important; width:80%; margin-left:10%; }
	
	button[name='send']{ width:40%; }
	button[name='reset'], button[name='admin']{ width:20% !important; }
	
	.fcon{ display:block; width:100% !important; }
}
@media screen and (max-width:320px) {
	#conteudo .pree span{ font-size:1.4rem; }
}