/**
 * Pas onderstaande kleuren aan en verwijder 'not' zodat ze geladen worden
 * Dus: "@supports not ()" => kleuren niet gebruikt, "@supports ()" => kleuren wel gebruikt
 **/
@supports not (display: block) {
  :root {
    /* Kleuren van tekst en achtergrond in menu */
    --menu-color-text: #ffffff;
    --menu-color-back: #19507e;

    /* Kleuren van tekst en achtergrond wanneer 'actief' (gekozen) */
    --menu-color-text-active: #ebebeb;
    --menu-color-back-active: #2b5e88;
  }

  /* ** Onderstaande niet wijzigen!!! ** */
  .portal-menu {
    color: var(--menu-color-text) !important;
    background-color: var(--menu-color-back) !important;
  }
  .navbar-text {
    color: var(--menu-color-text) !important;
  }
  .navbar-brand {
    color: var(--menu-color-text) !important;
    background-color: var(--menu-color-back) !important;
  }
  .navbar-toggler {
    color: var(--menu-color-text) !important;
    background-color: var(--menu-color-back) !important;
  }
  .nav-item, .nav-item .nav-link {
    color: var(--menu-color-text) !important;
    background-color: var(--menu-color-back) !important;
  }
  .nav-item.active, .nav-item.active .nav-link {
    color: var(--menu-color-text-active) !important;
    background-color: var(--menu-color-back-active) !important;
  }
}