:root {
    /* CONFIGURACION GENERAL */
    --cont-color-principal: #DEB707;
    --cont-color-principal-hover: #BFA205;
    --cont-color-secundario: #000;
    /* BOTON GENERAL */
    --relleno-boton-vertical: 12px;
    --relleno-boton-horizontal: 30px;
    --redondez-esquinas-boton: 4px;
    /* OTROS PARAMETROS */
    --medianil-img-textos: 3rem;
    --parametros-flex: 1 1 300px;
    --encaje-img-marco: cover;
    --tiempo-transicion: 0.33s;
    --tipo-transicion: ease;
    --relleno-scc-fondo-color: 3rem;
    --relacion-aspecto-img-galeria: 1/1;
    /* CONFIGURACION DEL BOTON */
    /* COLOR BOTON */
    --btn-color-texto: var(--cont-color-secundario) !important;
    --btn-color-fondo: var(--cont-color-principal) !important;
    --btn-color-borde: var(--cont-color-principal) !important;
    --btn-color-texto-hover: var(--cont-color-secundario) !important;
    --btn-color-fondo-hover: var(--cont-color-principal-hover) !important;
    --btn-color-borde-hover: var(--cont-color-principal-hover) !important;
    /* DIMENSIONES BOTON */
    --btn-padding: var(--relleno-boton-vertical) var(--relleno-boton-horizontal) !important;
    --btn-radio-esquinas: var(--redondez-esquinas-boton) !important;
    /* SECCION CON FONDO DE COLOR */
    --scc-color-fondo: var(--cont-color-principal) !important;
    --scc-color-texto: var(--cont-color-secundario) !important;
    --scc-relleno: var(--relleno-scc-fondo-color) !important;
    /* BOTON SECCION CON FONDO DE COLOR */
    --scc-btn-color-texto: var(--cont-color-secundario) !important;
    --scc-btn-color-fondo: var(--cont-color-principal-hover) !important;
    --scc-btn-color-borde: var(--cont-color-secundario) !important;
    --scc-btn-color-texto-hover: var(--cont-color-secundario) !important;
    --scc-btn-color-fondo-hover: var(--cont-color-principal) !important;
    --scc-btn-color-borde-hover: var(--cont-color-secundario) !important;
    /* CONFIGURACION PAGINA */
    --pg-medianil-seccion: var(--medianil-img-textos) !important;
    --pg-parametros-flex-box: var(--parametros-flex) !important;
    --pg-encaje-img-marco: var(--encaje-img-marco) !important;
    --pg-transicion: var(--tiempo-transicion) all var(--tipo-transicion) !important;
}

#contenidoSW {
    margin: 1.5rem 0;
}

#contenidoSW .seccion-contenido {
    margin-bottom: 2rem;
}

#contenidoSW .seccion-contenido.seccion-con-fondo {
    background-color: var(--scc-color-fondo);
    color: var(--scc-color-texto);
    padding: var(--scc-relleno);
}

/* para forzar a usar nuestro color en algunas páginas */
#contenidoSW .seccion-contenido.seccion-con-fondo * {
    color: var(--scc-color-texto);
}

#contenidoSW .seccion-contenido .fila {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-gap: var(--pg-medianil-seccion);
    -moz-gap: var(--pg-medianil-seccion);
    gap: var(--pg-medianil-seccion);
}

#contenidoSW .seccion-contenido .columna {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 300px;
    flex: 1 1 300px;
    display: -ms-grid;
    display: grid;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#contenidoSW .seccion-contenido * {
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
}

#contenidoSW .seccion-contenido img {
    -ms-grid-column-align: center;
    justify-self: center;
    -o-object-fit: var(--pg-encaje-img-marco);
    object-fit: var(--pg-encaje-img-marco);
    padding: 0.75rem;
}

#contenidoSW .seccion-contenido.contenido-galeria img {
    aspect-ratio: var(--relacion-aspecto-img-galeria);
}

#contenidoSW div>a {
    display: inline-block;
    text-decoration: none;
    border: 1px solid;
    border-radius: var(--btn-radio-esquinas);
    padding: var(--btn-padding);
    margin: 2rem 0;
    max-width: var(--btn-ancho-maximo);
    -webkit-transition: var(--pg-transicion);
    -o-transition: var(--pg-transicion);
    transition: var(--pg-transicion);
    cursor: pointer;
    text-align: center;
    color: var(--btn-color-texto);
    background-color: var(--btn-color-fondo);
    border-color: var(--btn-color-borde);
}

#contenidoSW div>a:hover {
    color: var(--btn-color-texto-hover);
    background-color: var(--btn-color-fondo-hover);
    border-color: var(--btn-color-borde-hover);
}

/* boton seccion con fondo de color */
#contenidoSW .seccion-contenido.seccion-con-fondo div>a {
    color: var(--scc-btn-color-texto);
    background-color: var(--scc-btn-color-fondo);
    border-color: var(--scc-btn-color-borde);
}

#contenidoSW .seccion-contenido.seccion-con-fondo div>a:hover {
    color: var(--scc-btn-color-texto-hover);
    background-color: var(--scc-btn-color-fondo-hover);
    border-color: var(--scc-btn-color-borde-hover);
}