
.menu ul{
    margin: 0px; /*Igualamos a cero tanto el margen como el padding y eliminamos los marcadores predeterminados*/
    padding: 0px;
    list-style-type: none; /*Establecemos el máximo ancho de la barra de navegación y el color de fondo*/
    max-width: 42rem;
    background-color: black; 
    
    display: flex; /*Posicionamos con FLEX*/
}

.menu ul a{
    display: block; /* Hacemos que los elementos ancla de la lista se comporten como botones*/
    padding: 0 2em; /*Relleno a la derecha e izquierda de las anclas*/
    line-height: 2.1em; /*Centrar verticalmente el texto*/
    text-decoration: none; /*Desactivar el subrayado*/
    color: white;
    font-weight: bold;
    transition: color 0.3s ease-in-out;
}

.menu ul li.primerli a{
    border-left: none; /*Para eliminar espacio a la izquierda*/
}

.menu ul a:hover{
    color:#c79c60; /*Cambiar el color del elemento ancla cuando se coloque el puntero*/
} 

.nav-link a:active {
    color:#c79c60;
}

/* Pie de página enlaces*/
a:hover{
    color:#c79c60;
} 


/*--------------------*/
/*--Menú hamburguesa--*/
/*--------------------*/

button#burger{
    display: none; /*Ocultamos el botón*/
    cursor: pointer;
    
    border: none;
}

.transparent {
    background-color: transparent;
}

.gold {
    background-color: #c79c60;
    transition: all 0.5s ease-in-out;
}




/*El menú hamburguesa aparecerá con esta resolución o menor*/
@media screen and (max-width:768px){

/*Configuramos el menú hamburguesa*/
button#burger{
    display: block; /*Se muestra el botón*/
    margin-left: auto; /*Damos margen automático izquierdo para posicionar a la derecha*/
    right: 40px; /* Nuevo */

}

.menu{
    display: none; /*Ocultamos el nav*/
}

/* button#burger:focus + .menu{ // Lo hacemos mejor con js*/ 
.menuBlock {
    display: block; /*Al pulsar el botón aparece el nav*/
}

/*.menu:hover{
    display:block; Al pulsar el botón aparece el nav y nos permite enlazar a la sección
}
*/



.navul{ /*Posicionamos el menú en columnas utilizando FLEX*/
display: flex;
flex-direction: column;

position: absolute; /* Nuevo */
top: 80px; /* Nuevo */
right: 25px; /* Nuevo */
}

.menu ul a{
    border-bottom: #FFFFFF solid thin; /* Bordes bottom */
    font-size: 0.9rem;
}
button img{
    width: 16px;
    height: 16px;
    margin-top: 2px;
}




}
