/* CORPO */
* {
        margin: 0;
        padding: 0;
        scroll-behavior:smooth;
      }
body{
	font-family: Nunito, sans-serif;
        flex-direction: column;                                       
        align-items: center;
        background-image: url("../img/bg.jpg");
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-color: #00050a;
        text-align: center;

        
}

h1{
	font-family: Asap, sans-serif;
        color:rgb(255, 255, 255);
        font-size: 35px;
        padding-top: 100px;
    
}

h2{
        color:#ffffff;
        font-size: 15PX;    

}

h3{
        font-family: Asap, sans-serif;
        color:#000000;
        font-size: 25PX;
        padding: 1px;
        width: 100%;
        text-decoration:8px solid rgb(233, 160, 12) underline;
        margin-bottom: 50px;
}

h4{
        font-family: Asap, sans-serif;
        color:#ffffff;
        font-size: 25PX;
        padding: 1px;
        width: 100%;
        text-decoration:11px solid rgb(233, 160, 12) underline;
        margin-bottom: 50px;
}

        
/*Navegação*/

nav {
     display: flex;
     flex-direction: column;
     align-items: center;
     font-weight: bold;
     background: rgba(250, 250, 250, 0.85);

    
 }

 nav a {
 	text-decoration: none;
 	font-weight: 600;
 	font-size: 12px;
       
 }

 nav ul {
     display: flex;
     max-width: 500px;
    flex-direction: column;
     align-items: center;
     list-style: none;
     
 }

 nav ul li {
 	 text-align: center;
 	 width: 20%;
         color:#000000;
         
 }

 nav ul li a {
 	display: inline-block;
 	width: 100%;
 	text-decoration: none;
        color:#000000;

 }

 nav ul li a:hover {    
        color:rgb(255, 136, 0);
 }

 /*  Cabeçalho*/


 header {
        display: flex;
        flex-direction: column;                                       
        align-items: center;
        background-size: cover;
        text-align: center;

 }

header img{
        width: 100%;
        max-width:800PX;  
}

 header p {
        max-width: 550px;
        text-align: center;
 }

 header div {
        display: flex;
	flex-direction: column;
	align-items: center;
	margin: 30px;
        display: flex;
        flex-direction: column;
        width: 40%;
        font-size: 20px;
        justify-content: center;
} 

/* Quem Somos */

#quemsomos{
        display: flex;
        flex-direction: column;
        margin-top: 150px;
        padding-top: 50px;
        align-items: center;
        text-align: center;
        background-color: #FFFFFF;
}

#quemsomos p {
        padding-top: 30px;
        margin: 2em;
        max-width: 450px;
        text-align: justify;
        flex-direction: column;
        align-items: center;
        text-align: justify;
        padding-top: 10px;
 }

 #quemsomos img {
        border: 10px solid rgb(58, 47, 47);
        width: 100%;
        max-width:200PX;
        margin-left: 50px;
        margin-bottom: 50px;
}

/* Diferencials */

#diferencial {
        display: flex;
        flex-direction: column;
        align-items: center;
        background-color: rgb(148, 148, 148);
        padding: 50px;
        font-size: 25px;
        color: #ffffff;
        text-align: center;
}
 #diferencial img {
        width: 100%;
        max-width:300PX;
        margin-left: 50px;
        margin-bottom: 50px;
}


/* Serviços */

#servicos {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 100px;
        background-color: rgb(57, 57, 57, 0.9);
}

#servicos p{
        font-display: bold;
        padding-top: 10px;
        font-weight: bold;
        text-align:center;
        color: #FFFFFF;
        margin-bottom: 2em;
        max-width: 550px;
        font-size: 12px;
}

#servicos div {
        display: flex;
	flex-direction: column;
	align-items: center;
	margin: 30px;
        display: flex;
        flex-direction: column;
        width: 20%;
        font-size: 20px;
        justify-content: center;
}


#contato {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-top: 50px;
        background-image: url("../img/bckCont.png");
        padding: 100px;
        font-size: 25px;
}


#contato p{
        font-display: bold;
        padding-top: 10px;
        font-weight: bold;
        text-align:center;
        color: #FFFFFF;
        margin-bottom: 2em;
        max-width: 550px;
}


#contato a:link{
	text-decoration: none;
}

#contato a:hover {    
	transform: scale(1.2);
	transition: all 0.2s;
}

#contato div {
	display:flex;
        flex-direction: column;
	align-items: center;
	display: flex;
        flex-direction: column;
        width: 20%;
        font-size: 15px;
        justify-content: center;
        margin-top: 100px;
        margin-bottom: 100px;
}

/*botão voltar ao topo*/

.bt_top {
        text-decoration:none;
        color: #FFFFFF;
        padding: 5px;
        background-color:rgb(233, 160, 12);
        position: fixed;
        right: 10px;
        bottom: 10px;
        border-radius: 100px;   
        
}       
        

/* Rodapé*/

footer {
        text-align: center;
        padding: 10px;

        color: #ffffff;
}

footer p{
font-size: 14px;

}

footer a {
        text-decoration: none;
        font-weight: bold;
        color:rgb(255, 255, 255);
}

@media screen and (min-width: 700px) {

    /* nav */

nav {
-ms-flex-align: start;
    flex-direction: row;
    justify-content: space-evenly;
 }

 nav ul {
        flex-direction: row;
        width: 100%;
}

/* Cabeçalho */

header {

        justify-content: center;
}

/* Serviços*/

#quemsomos {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-start;
        max-width: 100%;
        justify-content: center;
}

.quemsomos {
        flex-basis: 400px;
        padding: 10px;
        margin: 50px;

}

#diferencial {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-start;
        max-width: 100%;
        justify-content: center;
}

.diferencial {
        flex-basis: 300px;
}

#servicos {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-start;
        max-width: 100%;
        margin: 0 auto; 
        justify-content: center;
}

.servicos {
        flex-basis: 200px;
        padding: 0 10px;
        margin-left: 40px;
       
}

#contato {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-start;
        max-width: 100%;
        justify-content: center;
}

#contato div {
        flex-basis: 200px;
        padding: 5px;
   
}

footer .hr {
        border: 0;
        border-top: 1px dashed #CCC;
        border-bottom: 2px solid #CCC;
        height: 3px;
}