/*Establecer tipografía para modificar los componentes de bootstrap. A los componentes propios, le aplicamos directamente la tipografía a la clase para que después sea más fácil modificarlos*/

.gm-font-type{
    font-family: 'Karla', sans-serif; /*Colocar la tipografía que queremos*/
}


.color-tipografia{
    color: var(--gris-2);
}

/*Establecer colores*/

:root{ /*Establecemos paleta de colores*/
    --primary-color: #fcf4d0;
    --primary-color-hard: #f5e392;
    --secondary-color: #e0d494;
    --secondary-color-hard: #beb05d;
    --blanco-1: #ffff;
    --blanco-2: #f8f5f5;
    --gris-1: #e6e3e3;
    --gris-2: #3f3f3f;
}

/*JUMBOTRON*/

.jumbotron-legales{
    width: 100%;
    display: grid;
}
.fondo-jumbotron-legales{
    width: 100%;
    height: 8rem;
    margin: auto;
    background-image: url(../images/fondo-boton-club-del-vino.webp);
    background-size: cover;
    filter: brightness(60%);
    position: absolute; /*El position absolute permite que otros elementos ocupen el mismo espacio*/
    z-index: -1; /*Con z-index "-1" lo mandamos para atrás*/
}

.titulo-legales{
    color: var(--primary-color);
    grid-column: 1/12;
    justify-self: center;
    align-self: center;
    margin-top: 2rem;
    font-weight: 900;
}

/*LISTADO LEGAL (adaptar el margin bottom de lista-legales, según corresponda para que el FOOTER quede al final de todo*/

.lista-legales{
    width: 50%;
    margin: auto;
    margin-top: 7rem;
    text-align: center;
}

@media (max-width: 600px) {
    .lista-legales {
      width: 90%;
    }
  }

.elemento-lista{
    margin-bottom: 1.5rem;
}