:root {
    --cce-klant-logo:url('https://assets.compucase.nl/themes/peijnenburgverzuimbegeleiding/logo.png');

    /*  Navigatie bovenste balk kleuren */
    --cce-nav-top-bg-color: #fff;
    --cce-nav-top-text-color: #1a1f6b;

    /*  Navigatie onderste balk achtergrondkleur */
    --cce-nav-bottom-bg-color: #19206C;
    --cce-nav-bottom-text-color: white;

    /* Navigatie actief item kleuren  */
    --cce-active-menu-bg-color: #19206C;
    --cce-active-menu-text-color: white;

    /* Navigatie submenu hover kleuren */
    --cce-active-submenu-bg-color: #E61873;
    --cce-active-submenu-text-color: white;

    /* Link caret icoon kleuren */
    /* Caret default */
    --cce-menu-icon-color: rgba(255, 255, 255, 0.8);
    --cce-menu-icon-border-color: rgba(255, 255, 255, 0.2);
    --cce-menu-icon-bg-color: transparent;
    /* Caret actief menu item */
    --cce-active-menu-icon-color: rgba(255, 255, 255, 0.8);
    --cce-active-menu-icon-border-color: rgba(255, 255, 255, 0.2);
    --cce-active-menu-icon-bg-color: #E61873;
    /* Caret open menu item */
    --cce-open-menu-icon-color: rgba(255, 255, 255, 0.8);
    --cce-open-menu-icon-border-color: rgba(255, 255, 255, 0.2);
    --cce-open-menu-icon-bg-color: #E61873;

    /* Dropdown navigatie link seperator */
	/* Bug: wordt niet gebruikt maar is eigenlijk ook niet nodig */
    --cce-menu-seperator-color: #e61873;

    /* Navigatiebalk bedrijfsnaam kleuren en display (om te verbergen) */
    --cce-logo-bedrijfsnaam-bg-color: #4E2B82;
    --cce-logo-bedrijfsnaam-text-color: white;
    --cce-bedrijfsnaam-display: none;

    /* Hero icoon achtergrond en tekstkleur */
    --ut-hero-region-icon-background-color: #E61873;
    --ut-hero-region-icon-text-color: #fff;

    /* Links kleur */
    --ut-link-text-color: #19206C;

    /* Logo hoogte en breedte */
    --ut-header-logo-height: 38px;
    --cce-max-logo-width: 400px;
	--cce-logo-height: 38px;

    /* Login scherm */
    --cce-login-header-bg-color: #fbf9f8;
    --cce-login-header-text-color: #000;
    --cce-login-header-text-display: none;
    --ut-login-region-background-color: #f1ede9;
    --cce-tabs-bg-color: rgba(78, 43, 130, 0.1);
    --cce-tabs-hover-bg-color: rgba(78, 43, 130, 0.2);
    --cce-tabs-text-color: black;
}


/* Button */
.t-Button--hot {
    --a-button-background-color: #19206c;
    --a-button-text-color: #ffffff;
    --a-button-hover-background-color: #e61873;
    --a-button-hover-text-color: var(--a-button-text-color);
    --a-button-active-background-color: #e61873;
	--ut-focus-outline-color: #c6690b;
}

/* Logo applicatie */
.t-Header-logo img {
    --image-width: 400px;
    display: block;
    box-sizing: border-box;
    background-repeat: no-repeat;
    width: var(--image-width);
    background-image: var(--cce-klant-logo);
    height: var(--cce-logo-height);
    background-size: contain;
    background-position: center;
    padding-left: var(--image-width);
    margin-top: 10px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    margin-right: 3px;
    margin-left: 3px;
}

/* Logo inlogscherm */
#cce_login_logo {
    --image-width: 400px;
    background-image: var(--cce-klant-logo);
    display: block;
    box-sizing: border-box;
    background-repeat: no-repeat;
    width: var(--image-width);
    height: 60px;
    background-size: contain;
    background-position: center;
    padding-left: var(--image-width);
    margin-top: 15px;
    padding-bottom: 15px;
    margin-left: auto;
    margin-right: auto;
}