/* 
@media screen and (max-width: 1024px) {

.banner{
    position: absolute;
    top: 30%;
    left: 10%;
}    

.banner h1{
    font-size: 3.5rem;
}

.banner p {
    margin-bottom: 3%;
}

.banner button{
    margin:-8% 0% 1% 10%;
    padding: 1rem 2rem;
}


.hamburguer{
    right: 1.5rem;
}


#link-topo{
    right: 1.5rem;
}


} */
/* ----------------------------------------------- */

/* tablet */
/* 
@media screen and (max-width: 768px) {
  
    .banner h1{
        font-size: 2.5rem;
    }

    .banner p {
        margin-bottom: 2%;
    }

    .banner button{
        margin:0% 0% 2% 13%;
        padding: .5rem;
    }
    

    .hamburguer{
        right: 3rem;
    }
    
    
    #link-topo{
        right: 3rem;
    }
 

} */

/* ----------------------------------------
@media(max-width:768px){
@media(max-width:630px){
@media(max-width:540px){
@media(max-width:320px){ 
*/



@media screen and (max-width: 768px) {
    html{
        margin:auto;

        /* max-width:1200px; */
    }


   body{
       background-color:black;
       /* margin:0; */
       margin:auto;
   }
   
    .container{
       /* width: 100%; */
   }
   
   
    .banner{
       top:35% ;
       left:2%;
   }
    
    .banner h1{
        
        left:1%;
        font-size: 1.8rem;
        line-height: 1rem;
        margin-bottom: 1.5rem;
    }
    
    .nome{
        margin-top: 7rem;
    }

    .banner p {
        font-size: 1.3rem;
        line-height: 1rem;
        margin-top: 1rem;
        margin-bottom:1rem;        
    }
    
    .banner button{
        padding: 1rem 2rem;
    }    
    
    .hamburguer{
        top:1rem;
        right: 1rem;

        width: 3rem;
        height: 3rem;
    }
    
.show-menu #line3{
    transform: rotate(-45deg) translate(0.7rem, -0.8rem);

}

    .sidebar{
        width: 20rem;
        /* height: 100vh; */
        
     } 

     .aside .sidebar{

    } 

     .menu-link {
        font-size:1.5rem;
        line-height: 3rem;
        margin-bottom: 10rem;
    }

    #link-topo{ 
        bottom:1rem ;
        right: 1rem; 

        width: 3rem;
        height: 3rem;
    } 
        
    .projetos {
        display: flex;
        flex-direction: column;
        align-items: center;
        
        justify-content: center;
        margin-bottom: 2rem;
    }

    .card{
        margin-bottom: 2rem;
    }

.conhecimentos{
    display: flex;
    flex-direction: column;
    text-align: center;
    
}

.sessao-header h1 {
    font-family: var(--font-primary);
    font-size: 1.5rem;
    color: white;
    border-bottom: solid 5px #6a3093;
    margin-top:1.5rem;
    margin-bottom: 1.5rem;
}

.conhecimento-header {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 1rem;
}

.conhecimento-header h3 {
    font-family: var(--font-secundary);
    font-size: 1.5rem;
    padding-left: 1rem;
    text-shadow: 0.1rem 0.1rem 0.3rem rgb(0 0 0 / 70%);
    color: #6a3093;
}

.conhecimento-header i{
    font-size:1.8rem;
    

 } 
 
 .conhecimento-header p {
    font-size:1rem;
    padding: 0.5rem;

}

.conhecimento-img-wrapper{
   
    width: 1px;
    height: 1px; 
    object-fit: cover;   
    opacity: 0;
    
}

.sessao-contato{
    display: flex;
        flex-direction: column;
        align-items: center;        
        justify-content: center;
        
}

.contato-left {    
    width: 0%;    
}

.contato-right {
    margin:1rem;
    border-radius: 0.5rem;
        
    
}

.contato-wrapper {
    width: 100%;
    
   
}

.sessao-orcamento{
    height:auto;
}

.sessao-orcamento form {
    margin: 0.5rem;
    display: flex;
    flex-direction: column;
    margin:1.8rem;
    
}

.sessao-orcamento h1 {
    /* position: absolute; */
    top: -2.5rem;
    left: -3rem;
    font-size: 1.5rem;

}

.orcamento-wrapper {
    display: flex;
    align-items: center;
    justify-content:center;
    width:95%;
    margin-top:5rem;
    margin-bottom: 5rem;


}

.orcamento-wrapper label {
    font-size: 1.7rem;
    margin:auto;

}

.btn-orcamento{
    
margin:1rem;
}



.sessao-orcamento input[type="number"] {
width:2.5rem;


}

.field-label{
    left:1rem;
}

#qtde{
    font-size: 1.8rem;
    margin:auto;
    
}

#js{
    font-size: 2rem;
    margin:auto;
}
.social-list{
    margin:auto;

}


footer{
    margin-top: 0rem;
   
}

.footer-content{    
    flex-direction: column-reverse;  
    height:6rem ;      
}

.footer-content p {        
    font-size: .9rem;
    margin-top: 1rem;
    
    
}

}