nav.menu {
  display           : flex;
  justify-content   : space-between; /* Zorgt voor ruimte tussen de twee lijsten */
  align-items       : center;        /* Zorgt ervoor dat de items verticaal gecentreerd zijn */
  padding           : 10px 10px;     /* Optionele opvulling */
  background-color  : #ddd;          /* Achtergrondkleur van het menu */
}

.menu-left, .menu-right {
  list-style-type : none;
  margin          : 0;
  padding         : 0;
  display         : flex;
}

.menu-left li, 
.menu-right li {
  margin          : 0 15px;         /* Spacing tussen de items */
}

.menu a,
.menu span {
  color           : navy;
  font-family     : Arial;  
  text-decoration : none;
  font-size       : 1.0em;
  padding         : 5px 10px;
}

.menu a:hover {
  background-color : #999;         /* Hover effect */
  border-radius    : 4px;
}