/*=========== RESET ===========*/

*{margin:0;padding: 0;font-size:100%;border:none;outline: none;font-weight: 300;box-sizing:border-box; font-family: 'Lato', sans-serif; }
body{background-color: #f5f5f5;}
a{text-decoration: none;}
ul{list-style: none;}
img{max-width: 100%;}


/*=========== CONTAINER ===========*/
.container{
	width:100%;
	float:left;
	padding: 2% 4%;
	text-align: center;
	border:0px solid black;
}
/*=========== BG COLOR ===========*/
.bg-gradient{
	background: linear-gradient(to right,#05CEF2,#0074B6);
}
 
/*=========== CABECALHO ===========*/
 
.logo{
	width:65px; 
	height:65px;
	float:left;
	background: url(../img/logo.gif) center center/65px  no-repeat;
	font-size:0;

}
.btn-menu{
	width:56px; 
	height: 56px; 
	float:right;
	text-align: center;
	color:#fff;
	border-radius: 56px;
	cursor: pointer;
	 
}
/*=========== MENU ===========*/
.menu{
	width:100%;
	height:100%; 
	position: fixed;
	background-color:rgba(0,0,0,0.9);
	top:0;
	left:0;
	display: none;

}
.btn-close{
	font-size:2em;
	color:#fff;
	float:right;
	cursor:pointer;
	margin: 4% 4%;
}
.menu ul{
	width:100%;
	float:left;
	text-align: center;
}
.menu li{
	padding: 1.5%;
}
.menu li a{
	font-size: 2em; 
	color:#fff; 
	padding:1.5% 3%;
}

.menu li a:hover {border:1px solid orange;}


/*=========== BANNER ===========*/
.banner{

	background: url(../img/bg.jpg) no-repeat left  fixed;

}
.title h2{font-size: 2.5em; color: black; font-weight: 700;}
.title h3{font-size: 1.5em; color: black; }

.btn{
	width:100%;
	font-size: 1.5em;
	text-align: left;
	cursor:pointer;
	padding: 5%;
	border-radius: 10px;
	margin-top: 2%;
}

.btn-contato{

	background-color:rgb(52, 175, 35);
	font-weight:700;
	color:#fff;
	
}
.btn-contato i{
	
	color:#fff;
	float:none!important;
	margin-left:15px;
	
}
.btn-empresa{
 
	background-color:black;
	color:#fff;
}
.buttons {
	padding-top:50px;
	padding-bottom:30px;

}
/* EMPRESA */
.empresa{
	width:100%;
	float:left;
	padding: 1% 1%;
}

.empresadesc{
	padding: 2%;
}
.empresadesc a{
	font-size: 1.5em;
	color:black;
	font-weight: 700;

}
.empresadesc h4{
	font-size: 1.2em;color:black;margin-top: 2%;
}
.empresadesc p{
	margin-top: 1%;
	color:black;
	line-height: 1.1em;
}
/*=========== SERVIÇOS ===========*/

.servicos{
	width:100%;
	float:left;
	padding: 3% 4%;
}
.servico{
	width:100%;
	float:left;
	background-color: #fff;
	text-align: left;
	border-radius: 7%;
	margin-bottom: 3%;

}
.servico img{
	border-radius: 3% 3% 0 0 ;
	cursor:default;
}
.inner{
	padding: 7%;
}
.inner a{
	font-size: 1.5em;
	color:black;
	font-weight: 700;
	cursor:default;

}
.inner h4{
	font-size: 1.2em;color:black;margin-top: 2%;
}
.inner p{
	margin-top: 6%;
	color:black;
	line-height: 1.5em;
}
/*=========== NEWSLETTER ===========*/
.newsletter{
 
	background-color: black;
 
}
.newsletter h2{
	font-size: 1.5em;
	color:#fff;
	font-weight: 700;
}
.newsletter h3{
	 color:#fff;
}
.newsletter form{
	margin-top: 2%;
	
}
.newsletter input{
	width:100%;
	background-color: black; 
	border:1px solid rgba(255,255,255,0.3);
	padding:5%;
	border-radius: 5px;

}
.newsletter button{
	width:100%;
	background-color: #fff; 
	color:black;
	padding: 5%;
	border-radius: 5px;
	cursor:pointer;
	margin-top:2%;
}
.verde-whatsapp{
	
	color:rgb(52, 175, 35);
}
/*
.verde-whatsapp:hover{
	 
	color:rgba(52, 175, 35,0.5);
}*/
form h2:hover{
	width:100%;
	color:rgba(255, 255, 255,0.7);
}
/*=========== FOOTER ===========*/
 
.social-icons a{
	font-size: 1.5em;
	color: rgba(255,255,255,0.7);
	margin-right:3% 
}
.social-icons a:last-child{margin-right: 0px;}

.social-icons a:hover{
	color: rgb(255,255,255);
}

.copyright{
	margin-top: 2%;
	color: rgb(255,255,255);

}
.topo-centro{
	display:none;
	color:	#6495ED;
}
/*=========== Mobile first ===========*/
/*Smal devices - smartphones*/
@media screen and (min-width: 480px){
	.logo{
		width:40%;
		width:100px; 
		height:100px;
		background: url(../img/logo.gif) center center/100px  no-repeat;
	}
	.topo-centro{
		width:60%;
		float:left;
		display:block;
	}
	.topo-centro h2{
		font-size: 1.2em;
		
		font-weight: 700;
		margin-top: 15%;
	}
	.btn{
		font-size: 2em;
	}
}
/*medium devices - tablets*/
@media screen and (min-width: 768px){
	.servico{
		width:49%;
		float:left;
		margin-right:2%;
	}
	.servico:nth-child(2){
		margin-right: 0;
	}
	.newsletter h2{
		font-size: 2em;
		 
	}
	.topo-centro h2{
		font-size: 2em;
 		margin-top: 5%;
	}
	.newsletter h3{
		font-size: 1.5em;
	}


	.newsletter form h2{
		width:50%;
		float:left;
		 
	}
	.newsletter form h2:nth-child(2){	
		float:right;
		text-align: left;
		padding: 0 2%;
	}
	.newsletter form h2:nth-child(1){	
		 
		text-align: right;
		padding: 0 2%;
	}
}
/*medium devices - tablets e desktops*/
@media screen and (min-width: 960px){

	.title{
		width:70%;float:left; text-align: left;
	}
	.buttons{
		width:30%;float:right; text-align: left;margin-top:0;
	}
	.title h2{font-size: 3em;}
	.title h3{font-size: 2em;}

	.servico{
		width:32%;
	}
	.servico:nth-child(2){
		margin-right: 2%;
	}
		.servico:nth-child(3){
		margin-right: 0;
	}
}

/*Large devices - widescreens*/
@media screen and (min-width: 1280px){
	.btn-menu{
		display:none;
	}
	.btn-close{
		display: none;
	}
	.menu{
		width:auto;
		height: 56px;
		line-height: 56px;
		float:right;
		background-color: #f5f5f5;
		display: block !important;	
		position:static;

	}
	.menu li{
		padding: 0;
		float: left;
	}
	.menu li a{
		color:black;
		font-size: 1em;
		padding: 15px;
	}
	.meu li a:hover{
		border:none;
		color:#05CEF2;
	}
}
#toTop {
    padding: 5px 3px;
    background: #000;
    color: #fff;
    position: fixed;
    bottom: 0;
    right: 5px;
    display: none;
    cursor:pointer;
}