*{

	margin: 0;
	padding: 0;
	font-family: "Archivo", Arial, Tahoma, sans-serif;
	scroll-behavior: smooth;

}

body{

	min-height: 150vh;
	margin-top: 57px;
}



.boxed{

	width: 1200px;
	max-width: 100%;
	margin: auto;

}

.full-width{
	
	width: 100%;
	
}


h2, h3{
	
/*	text-align: center;*/
	font-weight: normal;
	
}

iframe{
	width: 100%;
	margin: 20px 0;
/*	height: auto;*/
}

h2{
	
	font-size: 43px;
	
}

h3{
	
	font-size: 32px;
	
}

p{
	
	color: #545454;
	font-size: 20px;
/*	text-align: center;*/
	
}

.text-center{
	
	text-align: center !important;
	
}



#banner div.col-50, #responsivo div.col-50, #desempenho div.col-50, #busca div.col-50, .banner div.col-50{
	
	    display: flex;
    flex-direction: column;
    align-items: baseline;
    justify-content: center;
	text-align: left !important;
	
}


#banner p, #responsivo p, #desempenho p, #busca p, .banner p{
	line-height: 1.2;
	padding: 20px 70px;
	
}

#banner h2, #responsivo h2, #desempenho h2, #busca h2, .banner h2{
	padding: 0px 70px;
	
}

.font-orange{
	
	color: #F05336 !important;	
	
}

.font-purple{
	
	color: #6B419B !important;
	
}


.row{

	display: flex;
	flex-wrap: wrap;

}

.col {
	
	flex-direction: column !important;
	
}

.overflow{
	
	overflow: auto;
	
}

.overflow::-webkit-scrollbar {
  width: 15px;               /* width of the entire scrollbar */
}

.overflow::-webkit-scrollbar-track {
  background: white;        /* color of the tracking area */
}

.overflow::-webkit-scrollbar-thumb {
  background-color: darkgray;    /* color of the scroll thumb */
  border-radius: 20px;       /* roundness of the scroll thumb */
  border: 3px solid white;  /* creates padding around scroll thumb */
}




.col-25{
	
	width: 25%;
	
}


.col-33{
	
	width: 33.3333%;
	
}

.col-40 {

	width: 40%;

}

.col-50 {

	width: 50%;

}

.col-60 {

	width: 60%;

}

.col-70 {

	width: 70%;

}


.col-100{
	
	width: 100%;
	
	
	
}

section{
	
/*	border-bottom: 1px solid #eee;*/
	padding: 100px 0;
	
}
/*
.scroll{
	
	visibility: hidden;
	
}*/


.secao-boxes h4, .secao-boxes h3{
	
	padding: 15px;
	color: #343131;
	font-size: 25px;
	text-align: center;
}

.secao-boxes p{
	
	padding: 0 15px;
	text-align: justify;
}


.secao-boxes .col-33{
	
	display: flex;
    justify-content: center;
	
}

.secao-boxes .box{
	
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 50px 0;
	border: 1px solid #eee;
	border-radius: 20px;
	max-width: 100%;
/*	width: 350px;*/
	width: 300px;	
	margin: 50px 10px;
	
	-webkit-box-shadow: 2px 10px 20px -1px rgb(217 215 215);
	-moz-box-shadow: 2px 10px 20px -1px rgb(217 215 215);
	box-shadow: 2px 10px 20px -1px rgb(217 215 215);
	 transition: 0.6s ease;
}

.secao-boxes .box:hover{
	
/*	background-color: #F05336;*/
/*	background-color: #6B419B;*/
/*	color: white;*/
	background-color: #ccc;
	
}


.secao-boxes .box:hover > p, .secao-boxes .box:hover > h4, .secao-boxes .box:hover > h3{
	
/*	background-color: #F05336;*/
/*	color: white;*/
	
}



.secao-boxes .box img{
	
	width: 70px;
	height: auto;
	
}

#portifolio{
	
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	
}


.margin-bottom-50 {
	
	margin-bottom: 50px;
	
}


.card{
	
	padding: 10px;
    border-radius: 10px;
    background-color: #FBFBFB;
    box-shadow: 0 0 6px 1px rgba(0,0,0,.19);
	margin: 30px 0;
	
	
}


#portifolio img{
	
	max-width: 100%;
	margin-bottom: 50px;
	    width: 100%;
    height: auto;
	
}




.bg-gray{
	
	background-color: #F6F6F6 !important;
	
}

.bg-orange{

/*	background-color: #F05336  !important;*/
	background: rgb(240,83,54);
	background: linear-gradient(180deg, rgba(240,83,54,1) 0%, rgba(239,43,6,1) 100%);
	
}
/*.bg-orange label,*/ .bg-orange p, .bg-orange h1, .bg-orange h2, .bg-orange h3{

	color: white;

	
}

.bg-orange p{
	
	
	padding: 20px 0;
	
}




/* form */

form{

	justify-content: space-between;
	padding: 50px;
	border-radius: 10px;
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.23);

}


form p{
	
	font-size: 20px !important;
	color: #545454 !important;
	
}

form h2.font-orange{
	
	color: #F05336 !important;
	
}
	
.form-group{

	margin: 10px 0;
	display: flex;
    flex-wrap: wrap;

}

.form-group input, .form-group textarea{

	width: 100%;
	padding: 6px 12px;
	border: none;
	    font-size: 16px;
	
	color: #555;
/*	border: 1px solid #ced4da;*/

}


.form-group input::placeholder, .form-group textarea::placeholder {
  color: #ACACAC;
}


input[type="submit"]{

	padding: 10px 20px;
/*    background-color: white;*/
    border: none;
	width: auto !important;
	color: white;
	cursor: pointer;

}
/*
.form-group.col-100 input, .form-group.col-100 textarea{

	width: 100%;

}*/

.form-group label{

	width: 100%;
	display: block;
	font-size: 14px;
	margin: 5px 0;
	font-weight: 600;

}

.form-group textarea{

	height: 250px;

}



/*Header*/

header{
	
	justify-content: space-between;
	position: fixed;
    background-color: white;
    opacity: 0.7;
	top: 0;
	z-index: 999;
/*	border-bottom: 1px solid #F05336;*/
	
}



header img {
	
	width: 40px;
	margin: auto 30px;
	height: auto;
	
}


.menu{

/*	margin-right: 30px;*/

	    margin: auto 30px;
}

.menu ul{
	
	list-style: none;
	
}

#midias img{
	
	width: 20px;
	height: 20px;
	margin: 0 15px;
	
}

#midias{
	
	align-items: center;
	list-style: none;
	
	
}


.menu li{
	
	margin: 20px;
	
}

.menu a{
	
	width: 100%;
	height: 100%;
	text-decoration: none;
	color: #F05336;
}

.menu a:hover{
	
	color: rgba(239,43,6,1);
	
}

#btn-menu-mobile, #btn-fechar, .menu-mobile{

	display: none;

}


/* ---------------------------- */


/* btn  wpp */

#btn-wpp{
	
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 40px;
	height: 40px;
	
}

#btn-wpp img{
	
	width: 40px;
	height: 40px;
	
	
}


/* --------- */

.no-padding{
	
	padding: 0 !important;
	
}

.no-padding-bottom{
	
	padding-bottom: 0 !important;
	
}

.no-padding-top{
	
	padding-top: 0 !important;
	
}

.margin-auto{
	
	margin: auto !important;
	
}

.align-items-center{
	
	align-items: center !important;
	
}

.justify-content-center{
	
	justify-content: center !important;
	
}

.justify-content-space-around{
	
	justify-content: space-around!important;
	
}

.padding-x-10{
	
	padding: 0 10px;
	
}

.alert{
	
	background-color: green;
	color: white;
	padding: 20px;
	text-align: center;
	display: none;
	opacity: 0.7;
}



#contato .formulario{
	
	margin: 0 auto;
		
	
}

#contato img{

	width: 100%;
	height: auto;
	
}
#contato h3{

	margin-top: 50px;

}


#contato .container-dados-contato p{

	font-size: 30px !important;

}

/*
#contato p:first-child{

	font-size: 30px !important;

}
*/

.box-contato{

	justify-content: center;
	align-items: center;
	margin: 10px 0;
	text-align: center;

}


.mobile{
	
	display: none;
	visibility: hidden;
}

img.desktop{
	
	height: auto;
	
}

.btn-fechar-alert{
	
	float: right;
	   color: white;
    text-decoration: none;
}


footer{
	
	padding: 20px 0;
	
}

footer p{
	
	font-size: 11px !important;
	
}


.btn-acessar-site{
	
	display: block !important;
	padding: 15px 0;
	color: white  !important;
	text-decoration: none;
}

.secao-projeto .col-100{
	
	padding: 10px 0;
	
}

.secao-projeto img{
	
	border-radius: 100%;
    border: 1px dashed #111;
    width: 170px;
    height: 170px;
    padding: 5px;
    margin: auto;
	
}


.secao-projeto .img-entrega{
	
    width: 250px;
    height: 250px;

	
}

.secao-projeto h3{
	
   font-size: 25px !important;
	margin: 10px 0 0 0;
	color: #666;
	
}


.secao-projeto .box {
	
	display: flex;
    flex-direction: column;
    align-items: center;
	
}

#pre-footer p{
	
	line-height: 1.3;
    padding: 20px 0;
	
}

#fale ul{
	
	display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
	
}

#fale ul li{
	
	align-items: center !important;
	padding: 10px 0;
	
}

#fale a {
	text-decoration: none;
	
}

#fale ul li img{
	
	margin-right: 10px;
	
}

@media (max-width: 900px){
	
	
	
}

@media (max-width: 720px){

 
	header{

/*		justify-content: center;*/
		padding-top: 5px;
		
	} 
	
	header img{

		margin: auto 0px auto 20px;

	}

	section{
		
		padding: 20px 0 0 0;
		
	}
	
	#banner p, #responsivo p, #desempenho p, .banner p, #busca p, #banner h2, #responsivo h2, #desempenho h2, .banner h2, #busca h2, .boxed p, .boxed h2, .boxed .form-group  {
		
		
		padding: 20px;
		
	}
	
	
	.reverse-mobile{
		
		flex-direction: column-reverse;
		
	}
	
	.col-100, .col-50, .col-33, .col-70, .col-40, .col-60, .col-25{

		margin-top: 50px;	
		width: 100%;

	}
	
	.secao-boxes .box{
		
		margin: 0;
		
	}

	.form-group input, .form-group textarea{

		width: 90%;
		padding: 10px;
		border: none;
	
	}

	.form-group.col-100, .form-group.col-70, .form-group.col-50, .form-group.col-40, .form-group.col-33, .form-group.col-25, .form-group.col-30{

		margin-top: 0 !important;

	}



	#menu-top{

		display: none;

	}

	#btn-menu-mobile{

		width: 40px;
		
		
	}
	
	#btn-fechar{

		height: 33px; 
    	width: 35px;
		
		
	}

	#btn-menu-mobile, #btn-menu-mobile img,  #btn-fechar,  #btn-fechar img{

		height: 100%;
		

	}

	#btn-menu-mobile img,  #btn-fechar img{

		width: 100%;
		padding: 5px;


	}

	#btn-fechar.show, #btn-menu-mobile.show, .menu-mobile.show{

		display: block;
		/* margin-right: 40px; */

	}

	#btn-fechar.show, #btn-menu-mobile.show{

		margin-right: 40px;

	}

	.menu-mobile ul {

		border-top: 1px solid #F05336 !important;

	}

	.menu-mobile ul li{

		width: 100%;
		padding: 0;
		height: 69px;
		text-align: center;
		border-bottom: 1px solid #F05336 !important;

	}

	.menu-mobile a {
		text-decoration: none;
		color: #F05336;
		display: block;
		height: 100%;
		line-height: 69px;
	}

	.menu-mobile a:hover, .menu-mobile ul li:hover {
		color: white;
		background-color: #F05336;
		
	}
	
	
	#midias img{
	
		width: 25px;
		height: 25px;
		margin: 0 10px;

	}

	header.opacity-1{

		opacity: 1 !important;

	}


	/* ---------- */


	.padding-section-bottom-mobile{

		padding-bottom: 70px !important;

	}

	#contato{
		
		background-color: transparent !important;
		
	}

	
	
	.desktop{
		
		display: none;
		visibility: hidden;
		
	}
	.mobile{
		
		display: block;
		visibility: inherit;
		
	}
	
	img.mobile{
		
		height: auto;
		
	}
	
	
	form{

		padding: 0;

	}
	
	iframe{
		
		margin: 0 2%;
		width: 96%;
		
	}
	
	.card{
		
		margin: 30px 20px;
		
	}
}