.elementor-3424 .elementor-element.elementor-element-3b23c78{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}.elementor-3424 .elementor-element.elementor-element-5164bf1{text-align:center;}.elementor-3424 .elementor-element.elementor-element-5164bf1 .elementor-heading-title{color:#FFFFFF;}.elementor-3424 .elementor-element.elementor-element-ad0cf7d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}.elementor-3424 .elementor-element.elementor-element-646303c{text-align:center;}.elementor-3424 .elementor-element.elementor-element-646303c .elementor-heading-title{color:#FFFFFF;}.elementor-3424 .elementor-element.elementor-element-6eab9f6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}/* Start custom CSS for shortcode, class: .elementor-element-93b3813 */.flags-container {
    display: flex;
    flex-wrap: wrap; /* Permite que los elementos se ajusten automáticamente a una nueva línea */
    gap: 15px; /* Espacio entre las banderas */
    justify-content: center; /* Centrar las banderas horizontalmente */
}

.flag {
    flex: 1 1 23%; /* Cada bandera ocupará el 23% del ancho (ajustable), 4 columnas */
    max-width: 23%; /* Establece un ancho máximo para que las banderas no se estiren demasiado */
    text-align: center; /* Centra el contenido dentro de cada bandera */
    box-sizing: border-box; /* Incluye el relleno y los bordes en el tamaño total */
}

.flag img {
    width: 100%; /* La imagen ocupa el 100% del ancho disponible */
    height: auto; /* Mantiene la proporción de la imagen */
    border-radius: 8px; /* Borde redondeado para las imágenes */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Añade sombra para darle un mejor estilo */
}

@media (max-width: 768px) {
    .flag {
        flex: 1 1 45%; /* En pantallas pequeñas, 2 banderas por fila */
        max-width: 45%;
    }
}

@media (max-width: 480px) {
    .flag {
        flex: 1 1 100%; /* En pantallas muy pequeñas, 1 bandera por fila */
        max-width: 100%;
    }
}/* End custom CSS */