@media(max-width:768px){

  #div1{
    display: grid;
    grid-template-columns: 30% 1% 70%;
    
    align-items: center;
    padding-top: 10%;
    
  }

#lm-logo{
  width: 100%;
}

#barra{
  width: 30%;
}

#titulo-div1{
  font-size: 2rem;
}

#div2{
  display: grid;
 grid-auto-flow: column;
  justify-items: center;
  align-items: center;
}


#div3{
  display: grid;
  grid-auto-flow: column;
  justify-items: center;
  align-items: center;
}

#botao{
  width: 50%;
   -webkit-tap-highlight-color: transparent;

}


#img-tenis-capa{
  width: 70%;
  
  
}



#div4{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  column-gap: 1%;
  row-gap: 5%;
  padding-bottom: 45rem;
  
}

.tenis{
  width: 80%;
}




  


#texto-cor{
  font-size: 1rem;
}

#rodape{
  
 -webkit-tap-highlight-color: transparent;
}

.rodape{
  width: 7%;
  

}


#texto-rodape{
  font-size: 20%;
}

select{
  width: 40%;
  margin-top: 15%;
}
input{
  width: 50%;
  margin-bottom: 3%;
}

textarea{
  width: 80%;
}

button{
  width: 40%;
  margin-top: 5%;
  margin-bottom: 20%;

}

#containerInfo{ 
  padding-top: 5%;
  display: inline-block;
  font-size: 50%;
}

#containerInfo1{
  text-align: center;
  padding-bottom: 10%;
  
}
#rodape p {
  padding-bottom: 5%;
  font-size: 50%;
}

#black{
width: 100%;
padding-bottom: 10%;
margin-left: auto;
  
}

}