.container{
	/* padding-right: 15px;
  	padding-left: 15px; */
  	margin-right: auto;
  	margin-left: auto;
}
@media (max-width: 480px) {
  .no-mobile{
  display: none !important;
}
}
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 900px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 930px;
  }
  .no-desktop{
  	display: none !important; 
  }
}
.container-fluid{
	padding-right: 15px;
  	padding-left: 15px;
  	margin-right: auto;
  	margin-left: auto;
}
.container-flex{
	display: flex;
	flex-wrap: wrap;
	   height: 40px; 
	
}


.container-flex1{
    display: flex;
    flex-wrap: wrap;
    /* Usar un gap ligero en el contenedor principal ayuda a la separación lateral */
    column-gap: 8px; /* Espacio horizontal entre las categorías */
    
    /* AÑADIDO: row-gap es la solución más robusta para el corte vertical */
    row-gap: 15px;  /* Espacio vertical entre filas de categorías */
    
    margin-bottom: 20px;
    
    /* Asegúrate que el UL no tenga una altura fija que lo estrangule */
    height: auto; 
    
    /* Importante: Asegúrate que el UL no tiene un padding vertical 0 o un overflow: hidden */
    padding-top: 5px; 
    padding-bottom: 5px;
}

/* 2. Estilos para cada Item (<li>) -- EL PUNTO CLAVE */
.container-flex1 li {
    /* Eliminamos margin-bottom aquí porque ahora usamos row-gap */
    
    /* * OPCIONAL: Define cómo se comportan los ítems. */
    flex: 0 0 auto; 
    list-style: none; /* Asegura que no haya viñetas si la clase list-unstyled falla */
}

/* 3. Estilos del Enlace (<a>) -- Para el botón visual */
.container-flex1 li a {
    /* Dale un padding interno a la etiqueta 'a' para que parezca un botón o badge */
    padding: 5px 10px; 
    border: 1px solid #ccc; /* Un borde sutil para definir la separación visual */
    border-radius: 4px; /* Bordes redondeados */
    text-decoration: none; /* Quita el subrayado */
    display: inline-block; /* Permite aplicar padding y margin */
}
.space-between{
	justify-content: space-between;
}
.space-around{
	justify-content: space-around;
}
.divider{
	border-top:2px solid #eeeeee;
}
.divider-2{
	border-top:2px solid #000;
	opacity: 0.1;
}
.space-center{
	justify-content: center;
}
.container-inline-flex{
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
}
.block-left{
	float: left!important;
}
.block-right{
	float: right!important;
}
.text-left{
	text-align: left;
}
.text-center{
	text-align: center;
}
.text-right{
	text-align: right;
}
.text-uppercase{
	text-transform: uppercase;
}
.text-capitalize{
	text-transform: capitalize;
}
.center-block{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.hidden {
  display: none !important;
}
.invisible {
  visibility: hidden;
}
.clearfix{
	clear: both;
}

.c-gris{
	color: #bdbdbd;
}
.c-gris-2{
	color: #333333;
}
.c-green{
	color: #44e4e4;
}
.c-white{
	color: #fff;
}
.c-negro{
	color: #000;
}
.list-unstyled{
	padding-left: 0;
    list-style: none;
}
.list-unstyled{
	padding-left: 0;
}
.list-unstyled1 li {
	margin: -15px 10px 10px 10px; /* Espaciado entre elementos */
	list-style: none;
}



.img-responsive{
	max-width: 100%;
	height: auto;
	display: block;
}
.space-inter{
	padding: 35px 5px;
}
.space-inter2{
	padding: 10px 5px;
}
.margin-25{
	margin:25px 0;
}
.padding-20{
	padding: 20px 0;
}
.active{
	color: #bdbdbd;
	border-bottom: 0 !important;
}
.pagination-active{
	background: #1a8ebc !important;
	color: #fff !important;
}
.hover{
	border-bottom: 2px solid #1a8ebc;
	padding-bottom: 5px;
}