:root {
    /*--blue: #26819d;*/
    --blue: #0f98c1;
    --lightblue: #ebf5fe;
    --lighterblue: #f5fafe;
    
    --brown: #65645e;
    --darkbrown: #3e3a2e;
    --lightbrown: #8b8555;
    --yellow: #ada249;
    
    --green: #1eb9b9;
    --lightgreen: #e6f6f6;
    --lightergreen: #f4fbfb;
    
    --purple: #7784c3;
    --lightpurple: #ebedf6;
    --lighterpurple: #f8f9fc;
    
    --background: #fff;
    
    --error: #f00;
}

/* kleuren pagina's Jeugdigen */

body.jeugdigen .page_content a.btn { color: #fff; background-color: var(--green); }

body.jeugdigen #header { background-color: var(--lightgreen); }

body.jeugdigen ul#menu li.active a.master { color: var(--green); }
body.jeugdigen ul#menu li a.master:hover { color: var(--green); }
body.jeugdigen ul#menu li.hassub ul.sub li a:hover { color: var(--green); }
body.jeugdigen ul#menu li.hassub ul.sub li.active a { color: var(--green); }
body.jeugdigen ul#menu-second li.active a,
body.jeugdigen ul#menu-second li:hover a { color: var(--green); }

body.jeugdigen h1 { color: var(--green); }

body.jeugdigen .page_content a { color: var(--green); }
body.jeugdigen .page_content a:hover { color: var(--brown); }

body.jeugdigen #submenu { background-color: var(--green); }
body.jeugdigen #submenu ul li a:hover { opacity: 0.75; }
body.jeugdigen #submenu ul li.parent.active a,
body.jeugdigen #submenu ul li.active a.master,
body.jeugdigen #submenu ul li.active ul li.subactive a { opacity: 0.75; }

body.jeugdigen .row:nth-of-type(even) { background: var(--lightgreen); }

body.jeugdigen .row.logos { background-color: var(--lightergreen)!important; }

body.jeugdigen footer { background-color: var(--green); }

@media screen and (max-width: 1100px) {
    body.jeugdigen .nav-button#menu-button { background-color: var(--green); }
    body.jeugdigen #menu-holder { background-color: var(--lightgreen); }
}


/* kleuren pagina's Professionals */

body.professionals .page_content a.btn { color: #fff; background-color: var(--purple); }
body.professionals .page_content a.btn:hover { color: #fff; background-color: var(--brown); }

body.professionals #header { background-color: var(--lightpurple); }

body.professionals ul#menu li.active a.master { color: var(--purple); }
body.professionals ul#menu li a.master:hover { color: var(--purple); }
body.professionals ul#menu li.hassub ul.sub li a:hover { color: var(--purple); }
body.professionals ul#menu li.hassub ul.sub li.active a { color: var(--purple); }
body.professionals ul#menu-second li.active a,
body.professionals ul#menu-second li:hover a { color: var(--purple); }

body.professionals h1 { color: var(--purple); }

body.professionals .page_content a { color: var(--purple); }
body.professionals .page_content a:hover { color: var(--brown); }

body.professionals #submenu { background-color: var(--purple); }
body.professionals #submenu ul li a:hover { opacity: 0.75; }
body.professionals #submenu ul li.parent.active a,
body.professionals #submenu ul li.active a.master,
body.professionals #submenu ul li.active ul li.subactive a { opacity: 0.75; }

body.professionals .row:nth-of-type(even) { background: var(--lightpurple); }

body.professionals .row.logos { background-color: var(--lighterpurple)!important; }

body.professionals footer { background-color: var(--purple); }

@media screen and (max-width: 1100px) {
    body.professionals .nav-button#menu-button { background-color: var(--purple); }
    body.professionals #menu-holder { background-color: var(--lightpurple); }
}