/**
 * F1CSS - Menu - 10 Dec 2022
 *  
 * @author  C. Moller <xavier.tnc@gmail.com>
 * 
 * @version 2.0.0 - REL - 07 Jan 2023
 *
 */

.menu {
  --menu-spacing: 0.5em;
  --menu-color-text: inherit;
  --menu-color-acent: rgba(255,255,255,50);
  --menu-color-text-highlight: inherit;
  --menu-color-acent-highlight: rgba(255,255,255,90);
  --menu-border-radius: 4px;
}

.menu {
  display: flex;
  list-style: none;
  gap: var(--menu-spacing);
}

.menu > li {
  position: relative;
  display: block;
}

.menu > li > a {
  color: var(--menu-color-text);
  padding: calc(0.5*var(--menu-spacing)) var(--menu-spacing);
  text-decoration: none;
  line-height: 2.25em;
  white-space: nowrap;
  display: block;
  opacity: 0.8;
  width: 100%;
}

.menu > li:hover > a {
  opacity: 1;
}

.menu > li > a span {
  position: relative;
}
