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

}

     
body {
 	font-family:verdana;
 	font-size:20px;
 	color:black;
 	margin:0px;
 	padding: 0px;
	text-align: justify;
	background: #F5AB26;
	background-image: linear-gradient(to right, #F5AB26 , #FFCB29 , #F5AB26);
	overflow-x: hidden;
 } 
p {
	margin:10px 20px 20px 20px;
 }

h1 {
 	font-size: 30px ;
	font-style: bold;
	margin: 0px 20px 20px 20px;
 }
h2 {
 	font-size: 30px ;
	font-style: bold;
	margin: 0px 20px 20px 20px;
 }
ul { 
	list-style-type: square;
	list-style-position: inside;
}
ul.circle {
	list-style-type: circle;
	padding-left: 20px;
}
ol { 
	list-style-type: decimal;
	list-style-position: inside;
}
a {
	color:black;
 	text-decoration:underline;
	cursor:pointer;
 }
a:visited {
 	text-decoration:underline;
 }
a:hover {
 	color:black;
 	text-decoration:none;
 }
.fix_float {clear:both;}

/* -------------------------------------------------- TOPO -------------------------------------------------- */



#topo {width:100%;height:450px;background:#04345A;background-image:url(../interface/fundo-azul.jpg);background-position:center;background-repeat:no-repeat;z-index:300;position:relative;transition-duration: 0.4s;}
#topo_conteudo {width:100%;}



.logotipo-amarelo-02 {
	width:340px;
	position:absolute;
	left:50%;
	margin:-40px 0px 0px -170px;
	transition-duration: 0.4s;
	animation-name: fade;
	animation-duration: 2s;
	animation-timing-function: ease;
	animation-delay: 0s;
	animation-iteration-count: 1;
	animation-direction: alternate;
	animation-play-state: running;
	}
.logotipo-amarelo-01 {display:none;}



.logotipo-azul-02 {
	width:340px;
	position:relative;
	left:50%;
	margin:0px 0px 0px -170px;
	transition-duration: 0.4s;
	animation-name: fade;
	animation-duration: 2s;
	animation-timing-function: ease;
	animation-delay: 0s;
	animation-iteration-count: 1;
	animation-direction: alternate;
	animation-play-state: running;
	}
.logotipo-azul-02:hover {transform:scale(1.1);transition-duration:0.4s;}
.logotipo-azul-01 {display:none;}

/* -------------------------------------------------- MENU -------------------------------------------------- */

.nav {height:40px;background:#04345A;position:sticky;top:0px;z-index:200;border-bottom: solid 10px black;box-shadow:0px 10px 80px black;background-image:url(../interface/fundo-azul.jpg);background-position:center;background-repeat:no-repeat;z-index:300;}

#menu {display:none;}

.menu_mobile {
	font-size: 45px;
	margin:0px 0px 0px -140px;	
	position: relative;
	left:50%;top:15px;
	z-index: 3100;
	cursor:pointer;
	transition: 0.3s;
	background-color: #FFF;
	padding:20px 60px 20px 40px;
}
.menu_mobile:hover, .menu_mobile:focus {
  color: black;
}
.overlay {
  height: 0%;
  width: 100%;
  position: fixed;
  z-index: 4000;
  top: 0;
  left: 0;
  background-color: #04345A;
  overflow-y: hidden;
  transition: 0.5s;
}

.overlay-content {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
  margin-top: 0px;
}

.overlay a {
  padding: 8px;
  margin-bottom:20px;
  text-decoration: none;
  font-size: 36px;
  color: white;
  display: block;
  transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
  color: #F5AB26;
}

.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
}

@media screen and (max-height: 450px) {
  .overlay {overflow-y: auto;}
  .overlay a {font-size: 20px}
  .overlay .closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }
}


/* ----- MEIO ----- */



#meio {
	width: 100%;
}
article {
	width: 100%;
	margin-top: 100px;
}

.card-grande {width:96%;color:#FFF;padding:0px 0px 0px 0px;margin:60px 0px 60px 0px;border:10px solid rgba(255,255,255,0.5);box-shadow:0px 10px 80px black;}
	.card-grande iframe {margin:0px 0px -4px 0px;}
	.card-grande img {margin:0px 0px -4px 0px;}
	.card-grande p {padding:10px;}
	.card-grande a {color:#FFF;text-decoration:underline;}
	.card-grande a:hover {color:#F5AB26;text-decoration:none;}
	
	.card-cta-orcamento {padding:10px 0px 10px 0px;background:#04345A;background-image: url(../interface/fundo-azul.jpg);background-position:center;background-repeat:no-repeat;}
	.card-cta-orcamento h2 {margin:10px 30px 20px 30px;}
	
.card-pequeno {margin:0px 0px 20px 0px;border:10px solid rgba(255,255,255,0.5);width:315px;height:315px;}

.esquerda {float:left;margin-bottom:20px;margin-right:20px;}
.direita {float:right;margin-bottom:20px;margin-left:20px;}


/* ----- FORMULÁRIOS ----- */

input{
	display:block;
	background:#FFF;
	padding:20px;
	margin-top:20px;
	width: 92%;
	font-size:20px;
 	font-family:verdana;
}
textarea {
 	font-family:verdana;
	display:block;
	background:#FFF;
	padding:20px;
	margin-top:20px;
	width: 92%;
	font-size:20px;
}
.g-recaptcha{margin-top:20px;margin-left:20%;}
.send{width:96%;font-size:30px;font-family:verdana;background:#04345A;color:#fff;margin:30px 0px 0px 10px;padding:20px;box-shadow: 0 0 0 10px rgba(255,255,255,0.5);}

/* -------------------------------------------------- FOOTER -------------------------------------------------- */


#footer {
	width: 100%;
	background: #04345A;
	box-shadow:0px 0px 80px black; 
	border-top: solid 10px black;	
}
#footer_content {
	width: 100%;
	background-image: url(../interface/fundo-azul.jpg);background-position:center;background-repeat:no-repeat;
	color: white;
	text-align: center;
}
#footer a {
	color: white;
}
#footer a:hover {
	color: #F5AB26;
}

/* -------------------------------------------------- SOCIAL ------------------------------------------------------- */


#social {
	width: 420px;
	position:relative;
	left:50%;
	margin-left:-210px;
	padding: 50px 10px 10px 10px;
	text-align:center;
}
#whatsapp a  {
	background: url(../interface/social_whatsapp01.png) top no-repeat; 
	width: 50px; 
	height: 50px;  
	margin: 10px;
	margin-top:20px;
	float: left;
	box-shadow: 0 0 0 5px rgba(255,255,255,0);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;	
}	
#whatsapp a:hover {
	background: url(../interface/social_whatsapp01.png) bottom no-repeat; 
	box-shadow: 0 0 0 5px rgba(255,255,255,0.5);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;	
}
#facebook a  {
	background: url(../interface/social_facebook01.png) top no-repeat; 
	width: 50px; 
	height: 50px;  
	margin: 10px;
	margin-top:20px;
	float: left;
	box-shadow: 0 0 0 5px rgba(255,255,255,0);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;	
}	
#facebook a:hover {
	background: url(../interface/social_facebook01.png) bottom no-repeat; 
	box-shadow: 0 0 0 5px rgba(255,255,255,0.5);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;	
}

#pinterest a  {
	background: url(../interface/social_pinterest01.png) top no-repeat; 
	width: 50px; 
	height: 50px; 
	margin: 10px;
	margin-top:20px;
	float: left;
	box-shadow: 0 0 0 5px rgba(255,255,255,0);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}	
#pinterest a:hover {
	background: url(../interface/social_pinterest01.png) bottom no-repeat; 
	box-shadow: 0 0 0 5px rgba(255,255,255,0.5);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;	
}

#instagram a  {
	background: url(../interface/social_instagram01.png) top no-repeat; 
	width: 50px; 
	height: 50px; 
	margin: 10px;
	margin-top:20px;
	float: left;
	box-shadow: 0 0 0 5px rgba(255,255,255,0);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}	
#instagram a:hover {
	background: url(../interface/social_instagram01.png) bottom no-repeat; 
	box-shadow: 0 0 0 5px rgba(255,255,255,0.5);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;	
}
#behance a  {
	background: url(../interface/social_behance01.png) top no-repeat; 
	width: 50px; 
	height: 50px; 
	margin: 10px;
	margin-top:20px;
	float: left;
	box-shadow: 0 0 0 5px rgba(255,255,255,0);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}	
#behance a:hover {
	background: url(../interface/social_behance01.png) bottom no-repeat; 
	box-shadow: 0 0 0 5px rgba(255,255,255,0.5);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;	
}
#youtube a  {
	background: url(../interface/social_youtube01.png) top no-repeat; 
	width: 50px; 
	height: 50px; 
	margin: 10px;
	margin-top:20px;
	float: left;
	box-shadow: 0 0 0 5px rgba(255,255,255,0);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}	
#youtube a:hover {
	background: url(../interface/social_youtube01.png) bottom no-repeat; 
	box-shadow: 0 0 0 5px rgba(255,255,255,0.5);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;	
}