.elementor-10675 .elementor-element.elementor-element-c77b100{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-10675 .elementor-element.elementor-element-20c243b img{width:100%;}.elementor-10675 .elementor-element.elementor-element-ad3b9ce{--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;}.elementor-10675 .elementor-element.elementor-element-aef753b{z-index:1;}:root{--page-title-display:none;}/* Start custom CSS *//* Colores base para ambos botones */
#anterior,
#siguiente {
    background-color: #28a745; /* Verde estándar de Bootstrap success */
    border-color: #28a745;
    color: white; /* Color del texto */
}

/* Colores para ambos botones cuando están en estado hover, active, focus o con la clase 'active' */
#anterior:hover,
#siguiente:hover,
#anterior:active,
#siguiente:active,
#anterior:focus,
#siguiente:focus,
#anterior.active, /* Si usas una clase 'active' en tu JS para el botón de navegación */
#siguiente.active { /* Si usas una clase 'active' en tu JS para el botón de navegación */
    background-color: #4CAF50 !important; /* Un verde un poco más claro para el estado activo/hover */
    border-color: #4CAF50 !important;
    color: white !important;
    /* Esto es importante para sobrescribir los estilos de Bootstrap que podrían dar el rosa */
    box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5) !important; /* Sombra de enfoque sutil */
}

/* Opcional: Si Elementor o Bootstrap añade una clase específica para el botón 'seleccionado' */
/* por ejemplo, si tu JS añade una clase 'activo' que no es la misma que la del índice superior */
/* Si tu JS añade la clase 'activo' a #anterior o #siguiente cuando se seleccionan, asegúrate de que también tenga este color */
#anterior.activo,
#siguiente.activo {
    background-color: #4CAF50 !important;
    border-color: #4CAF50 !important;
    color: white !important;
}/* End custom CSS */