#Buscador {
  width: 33% !important;
  text-align: center;
  margin-left: 22% !important;
}

/*.col-3 { border: 1px solid black !important;
padding:19px !important;
border-radius: 14px !important;
margin:10px !important;
max-width: 23% !important;
font-size: 16px !important;
font-family: Montserrat !important;
text-transform: uppercase !important;
font-weight: bold !important;
color:black !important;
}*/

.col-12.cart3 {
  border: 1px solid black !important;
  margin-top: 9px !important;
  border-radius: 10px !important;
}

  .col-12.cart3:hover {
  border: 1px solid black !important;
  margin-top: 9px !important;
  border-radius: 10px !important;
  /* Agregar sombra al elemento */
  transition: box-shadow 0.3s ease; /* Agregar una transición suave para la sombra */
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); }

#bannerbusqueda2 {
  width: 100% !important;
  margin-left: 0% !important;
  height: 80px !important;
  padding: 1% !important;
  background: #a398b6 !important;
  
}
.btn.btn-light {
  color: black !important;
  background: white !important;
  border: 2px solid gray !important;
  border-radius: 14px;
  padding: 5px !important;
}
    
.row::after {
    content: "";
    clear: both;
    display: table;
}

 
[class*="col-"] {
    float: left;
    width: 100%;
    padding: 15px;
}




 
@media only screen and (min-width: 576px)

{
    .col-sm-1 {width: 8.33333%;}
    .col-sm-2 {width: 16.66667%;}
    .col-sm-3 {width: 25%;}
    .col-sm-4 {width: 33.33333%;}
    .col-sm-5 {width: 41.66667%;}
    .col-sm-6 {width: 50%;}
    .col-sm-7 {width: 58.33333%;}
    .col-sm-8 {width: 66.66667%;}
    .col-sm-9 {width: 75%;}
    .col-sm-10 {width: 83.33333%;}
    .col-sm-11 {width: 91.66667%;}
    .col-sm-12 {width: 100%;}
}
.col-1 {
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
}

.col-2 {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
}

.col-3 {
    flex: 0 0 25%;
    max-width: 25%;
}

.col-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

.col-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
}

.col-6 {
    flex: 0 0 50%;
    max-width: 50%;
}

.col-7 {
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
}

.col-8 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
}

.col-9 {
    flex: 0 0 75%;
    max-width: 75%;
}

.col-10 {
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
}

.col-11 {
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
}

.col-12 {
    flex: 0 0 100%;
    max-width: 100%;
}
 
@media only screen and (max-width: 576px) {
    
     .col-12.cart3{
  border: 1px solid black !important;
  margin-top: 9px !important;
  border-radius: 10px !important;
  /* Agregar sombra al elemento */
  width: 99% !important;
  margin-left: 0% !important;
    }
    
   .col-12.cart3:hover {
  border: 1px solid black !important;
  margin-top: 9px !important;
  border-radius: 10px !important;
  /* Agregar sombra al elemento */
  transition: box-shadow 0.3s ease; /* Agregar una transición suave para la sombra */
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); 
  width: 99% !important;
  margin-left: 0% !important;
    }
 /*.col-3 { border: 1px solid black !important;
padding:5px !important;
border-radius: 14px !important;
margin:10px !important;
max-width: 27% !important;
font-size: 10px !important;
font-family: Montserrat !important;
text-transform: uppercase !important;
font-weight: bold !important;
color:black !important;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; /* Opcional, ajusta seg��n sea necesario */
 }


/*.col-3:hover {
  box-shadow: 0 0 10px #aaaaaa !important; /* Cambia el color y la intensidad de la sombra al hacer hover */
/* transition: box-shadow 0.3s ease-in-out; /* Agrega una transición suave */
/*}*/

#bannerbusqueda1 {
  background: #A398B6 !important;
  border-radius: 0px !important;
  
}

#bannerbusqueda2 {
  width: 100% !important;
  margin-left: 1% !important;
  height: 80px !important;
  padding: 1% !important;
  background: #a398b6 !important;
  
}


#Responses {
  padding: 3% !important;
}

/*texto botón*/
.btn.btn-light {
  color: black !important;
  background: white !important;
  border: 2px solid gray !important;
  border-radius: 14px;
  padding: 5px !important;
  	height: 86% !important;
  margin-top: 1% !important;
}

/*texto botón*/
.btn.btn-light:hover {
  color: white !important;
  background: grey !important;
  border: 2px solid gray !important;
  border-radius: 14px;
  padding: 5px !important;
  box-shadow: 0 0 10px #aaaaaa !important;
  transition: box-shadow 0.3s ease-in-out; /* Agrega una transición suave */
}


