/*SE VERA ASI MIENTRA NO SE ALCANCEN LOS 1490px QUE SE MODIFICARAN LOS PARAMETROS ESPECIFICADOS*/

.botonera {
   background-color: grey;
   width: 100%;
   margin: auto;
   display: grid;
   grid-template-columns: 100%;
   margin: auto;
   list-style-type: none;
   padding: 0;
   }
.botonera > a{
   width: 80%;
   border-radius: 5px;
   padding: 10px;
   margin: 5px;
   background-color: rgb(207,232,220);
   border: 2px solid black;
   text-decoration:none;
   text-align:center;
   color: back;
   }
.botonera > a:hover {
   background-color: black;
   border: 2px solid white;
   color: white;
   }
.botonera > form > input{
   width: 85%;
   border-radius: 5px;
   padding: 10px;
   margin: 5px;
   background-color: rgb(207,232,220);
   border: 2px solid black;
   text-decoration:none;
   text-align:center;
   color: back;
   }
.botonera > form > input:hover {
   background-color: black;
   border: 2px solid white;
   color: white;
   }
/*Una vez alcance los 1490px realizas el cambio*/
@media screen and (min-width: 1490px) {

.botonera {
   background-color: grey;
   width: 50%;
   display: grid;
   grid-template-columns: 20% 20% 20% 20% 20%;
   margin: auto;
   padding: 0;
   }
.botonera > a{
   width: 80%;
   border-radius: 5px;
   padding: 10px;
   margin: 5px;
   background-color: rgb(207,232,220);
   border: 2px solid black;
   text-decoration:none;
   text-align:center;
   color: back;
   }
.botonera > a:hover {
   background-color: black;
   border: 2px solid white;
   color: white;
   }
.botonera > form > input{
   width: 94%;
   border-radius: 5px;
   padding: 10px;
   margin: 5px;
   background-color: rgb(207,232,220);
   border: 2px solid black;
   text-decoration:none;
   text-align:center;
   color: back;
   }
.botonera > form > input:hover {
   background-color: black;
   border: 2px solid white;
   color: white;
   }
}

