
**


/* Header: vaste achtergrondkleur */
header,
.site-header,
.header {
  background: #f2cacb; !important; /* vervang door gewenste kleur */
  background-image: none !important;
}

/* Footer: vaste achtergrondkleur */
footer,
.site-footer,
.footer {
  background: #f2cacb; !important; /* vervang door gewenste kleur */
  background-image: none !important;
}

.container-header .mod-menu > li > a, .container-header .mod-menu > li > span {
color: #800020;
}
.container-header .mod-menu  ul } 
 background-color; #f2cacb; /* roze achtergrond dropdown */
  
.container-header .mod-menu ul li a:hover {
  background-color: #f2cacb; /* hover achtergrond */
  color: #800020; /* hover tekstkleur */
}



/* Hoofdmenu (horizontale header) */
.header, /* voorbeeld */
.site-header,
nav.main-nav {
  background-color: #f2cacb; /* gewenste achtergrondkleur */
  color: #800020; /* tekstkleur */
}

/* Links in hoofdmenu */
.header a,
.site-header a,
nav.main-nav a {
  color: #800020;
  text-decoration: none;
}

/* Hover-staat voor hoofdmenu-links */
.header a:hover,
.site-header a:hover,
nav.main-nav a:hover {
  color: #800020;
}

/* Submenu (dropdown) */
nav.main-nav .submenu,
nav.main-nav ul li ul,
.header .submenu, {
  background-color: #f2cacb; /* submenu achtergrond */
  color: #fffacb;
  border: 1px solid rgba(255,255,255,0.1);
}

/* Submenu links */
nav.main-nav .submenu a,
nav.main-nav ul li ul a {
  color: #800020;
}

/* Hover-staat voor submenu-links */
nav.main-nav .submenu a:hover,
nav.main-nav ul li ul a:hover {
  color: #f2cacb;
}

/* Optioneel — pijltje/indicatorkleur */
nav.main-nav .submenu-toggle,
.header .dropdown-toggle {
  color: #800020;
}

:root 
{
    /* De hoofdkleuren van de website */
    --cassiopeia-color-primary: #f2cacb;    /* Roze (bijv. voor headers/knoppen) */
    --cassiopeia-color-hover: #f2cacb;      /* Roze (voor hover-effecten) */
    --cassiopeia-color-link: #800020;       /* Rood (voor standaard tekstlinks) */

    /* Achtergrondkleuren */
    --body-bg: #f2cacb;                     /* Roze de achtergrond van de hele pagina */
    --card-bg: #f2cacb;                     /* Roze achtergrond van modules/kaarten */

    /* Tekstkleuren */
    --body-color: #800020;                  /* Standaard tekstkleur rood) */
    --heading-color: #800020;               /* Rode Kleur van koppen (H1, H2, H3, etc.) */
}

/* Aanvulling voor de header als je het standaard Cassiopeia template gebruikt */
.header {
    background-color: var(--cassiopeia-color-primary);
}

/* Aanvulling voor de footer van cassiopeia*/
.footer {
    background-color: #f2cacb;              /* Roze */
    color: #800020; /* Rood */
}

.container-header .mod-menu > li > a, .container-header .mod-menu > li > span {
color: #800020;
}

/* Hover-staat voor hoofdmenu-links */
.header a:hover,
.site-header a:hover,
nav.main-nav a:hover {
  color: #800020;
}

/* Links in hoofdmenu */
.header a,
.site-header a,
nav.main-nav a {
  color: #800020;
  text-decoration: none;
}

/* Submenu (dropdown) */
nav.main-nav .submenu,
nav.main-nav ul li ul,
.header .submenu, {
  background-color: #f2cacb; /* submenu achtergrond */
  color: #800020;
  }

}
.container-header .mod-menu  ul } 
 background-color; #f2cacb; /* roze achtergrond dropdown */
  

/* Cassiopeia hoofdmenu: kleur van dropdown hoofdlink (met pijltje) */
.navbar-nav .nav-item.dropdown > a{
  color: inherit !important; /* neemt hoofdmenu-kleur over */
}


.container-h eader .mod-menu ul li a:hover {
  background-color: #f2cacb; /* hover achtergrond */
  color: #800020; /* hover tekstkleur */
}



/* Hoofdmenu (horizontale header) */
.header, /* voorbeeld */
.site-header,
nav.main-nav {
  background-color: #f2cacb; /* gewenste achtergrondkleur */
  color: #800020; /* tekstkleur */
}

/* Links in hoofdmenu */
.header a,
.site-header a,
nav.main-nav a {
  color: #800020;
  text-decoration: none;
}

/* Hover-staat voor hoofdmenu-links */
.header a:hover,
.site-header a:hover,
nav.main-nav a:hover {
  color: #800020;
}

/* Submenu (dropdown) */
nav.main-nav .submenu,
nav.main-nav ul li ul,
.header .submenu, {
  background-color: #f2cacb; /* submenu achtergrond */
  color: #fffacb;
  border: 1px solid rgba(255,255,255,0.1);
}

/* Submenu links */
nav.main-nav .submenu a,
nav.main-nav ul li ul a {
  color: #800020;
}

/* Hover-staat voor submenu-links */
nav.main-nav .submenu a:hover,
nav.main-nav ul li ul a:hover {
  color: #f2cacb;
}

/* Zorg dat dropdown zichtbaar blijft boven andere elementen */
nav.main-nav ul li ul {
  z-index: 9999;
  .header .submenu {
  
  } 

