:root {
    /*  Declaration van de variabelen.
        aangezien deze app op maat is ontwikkeld voor bbb hoeft die niet vanuit de backend dynamisch ingesteld te worden.
    */
    --ivx-fontsize-default: 14px;
    --ivx-fontsize-large: 22px;
    --ivx-fontcolor: #5e5e5c;
    --ivx-boxcolor: #e6e6e5;
    --ivx-captions-color: #8a99a8;
    --ivx-lineheight-cards: 1.5;
    /* afspraak markers */
    --ivx-marker-buitenles: #a6b49c;
    --ivx-marker-cabineles: #e6d9d1;
    --ivx-marker-zaalles: #b5d1e5;
    --ivx-marker-online: #797873;
    --ivx-marker-coaching: #956d61;
    --ivx-marker-personal: #e6d891;
    /* fontsizes */
    --ivx-fontsize-default: 14px;
    --ivx-fontsize-large: 22px;
    /* tabpage properties*/
    --ivx-tabpage-bordercolor: #e6e6e5;
    --ivx-tabitem-active-backgroundcolor: #9e98cd; /*gelijk aan de widget background.*/
    --ivx-tabitem-active-color: white;
    --ivx-tabitem-active-bordercolor: #576675;
    --ivx-tabitem-inactive-backgroundcolor: white;
    --ivx-tabitem-inactive-color: black;
    --ivx-tabitem-inactive-bordercolor: rgba(172,185,202,0.5);
    /* widget */
    --ivx-widget-background: #e8e6ff;
    --ivx-widget-hover-background: #9e98cd;

    /* Menuitems properties. */
    --ivx-mainmenu-background: #33383e;
    --ivx-menuitem-background: #33383e;
    --ivx-menuitem-hover: #3e454c;
    --ivx-menuitem-active-bordercolor: rgb(105,85,140);