:root {
    /* base fonts */
    --font-regular: 'Open Sans','BOI-regular', Arial, Verdana, Helvetica, sans-serif;
    --font-light: 'Open Sans','BOI-regular', Arial, Verdana, Helvetica, sans-serif;
    --font-bold: 'Open Sans','BOI-bold', Arial, Verdana, Helvetica, sans-serif;
    --font-semibold: 'Open Sans','BOI-bold', Arial, Verdana, Helvetica, sans-serif;
    /* base colors */
    --color-white: #fff;
    --color-boi-blue: #0000ff;
    --color-teal: #00ffc5;
    --color-dark-blue: rgb(0,6,69);
    --color-navy-blue: rgb(0,6,123);
    --color-sage: rgb(0,126,132);
    --color-lime: rgb(179,255,0);
    --color-grey: rgb(60,60,60);
    --color-grey-light: rgb(40,40,40);
    /* buttons */
    --color-button-main: var(--color-dark-blue);
    --color-button-focus: var(--color-boi-blue);
    --color-button-important: var(--color-dark-blue) !important;
    /* backgrounds */
    --text-color-link: var(--color-boi-blue);
    --background-main: var(--color-white);
    --background-main-important: var(--color-white) !important;
    --background-panel: var(--color-sage);
    --background-dialog: var(--color-white);
    --background-dialog-listheader: var(--color-teal);
    --background-dialog-list: var(--color-white);
    --background-dialog-panel: var(--color-sage);
    --background-topbar: var(--color-boi-blue);
    --background-summary-headers: var(--color-teal);
    --background-analysisview-container: var(--color-white);
    --background-analysispanel-header: var(--color-sage);
    --background-report-container: var(--color-white);
    --background-report-header: var(--color-sage);
    --background-report-details: var(--color-white);
    --background-report-selectedalignment: var(--color-teal);
    --background-custselector: var(--color-white);
    --background-custselector-list: var(--color-white);
    /* borders */
    --border-orange: 1px solid #006;
    --border-orange-important: 2px solid #006 !important;
    --border-grey: 1px solid #c5c5c5;
    /* shadows */
    --shadow: 0px 4px 8px 0px rgb(0 0 0 / 20%), 0px 6px 20px 0 rgb(0 0 0 / 19%);
    --shadow2: 3px 0px 10px 3px rgb(197 197 197 / 30%);
    --dropshadow: drop-shadow(2px 2px 4px var(--color-grey-light));
    /* text */
    --text-color-primary: #161616;
    --text-color-secondary: #fff;
    --text-login-title: var(--color-dark-blue);
    --text-color-titlebar: var(--text-color-primary);
    --text-color-topbar: var(--text-color-secondary);
    --text-color-summarygroup-header: var(--text-color-primary);
    --text-color-summarygroup-item: var(--text-color-primary);
    --text-color-analysispanel-tabheader: var(--text-color-primary);
    --text-color-analysispanel-header: var(--text-color-secondary);
    --text-color-analysispanel-item: var(--text-color-primary);
    --text-color-menubar: var(--text-color-primary);
    --text-color-menubar-active: var(--text-color-secondary);
    --text-color-popupmenu: var(--text-color-secondary);
    --text-color-popupmenu-active: var(--text-color-secondary);
    --text-color-report-header: var(--text-color-secondary);
    --text-color-report-item: var(--text-color-primary);
    --text-color-button: var(--text-color-secondary);
    --text-color-button-active: var(--text-color-secondary);
    --text-color-dialog-label: var(--text-color-secondary);
    --text-color-dialog-text: var(--text-color-primary);
    --text-color-custselector-listitem: var(--text-color-primary);
    --text-color-error: #ff0000;
    --text-color-warning: #EE7C2B;
    --text-color-adminpanel-header: var(--text-color-secondary);
    --text-color-adminpanel-item: var(--text-color-secondary);
    --text-color-message: var(--text-color-primary);
    /* other stuff */
    --og-gradient: linear-gradient(125deg, #006, #006);
    --color-primary: #00f;
    --color-accent: #00ffc5;
    --color-success: #00ffc5;
    --color-alert: #b20000;
    --color-primary-dark: #006;
    --color-primary-light: #b2dbff;
    --color-accent-light: #357c83;
    --color-accent-dark: #1d4144;
    --color-grey-lightest: #efefef;
    /* menus */
    --background-menubar: var(--color-teal);
    --menubar-backgroundgradient: linear-gradient(125deg, var(--color-boi-blue), var(--color-boi-blue));
    --background-popup-menu: var(--color-boi-blue);
    --background-popup-menu-active: var(--color-dark-blue);
    /* datepicker */
    --background-datepicker: var(--color-boi-blue);
}