:root {
    /* 
        https://www.materialpalette.com/colors - BLUE 
        https://gist.github.com/lopspower/03fb1cc0ac9f32ef38f4
    */
    
    /* colors */
    --color-bg-default: #eeeef6;
    --color-fg-default: #fff;
    --color-fg-80: #ffffffcc;

    --color-font-default: #0d47a1;
    --color-font-header-default: #0d47a1;
    --color-font-header-default-48: #0d47a188;
    --color-font-header-40: #0d47a166;
    --color-font-header-10: #0d47a11a;
    --color-font-contrast-default: #2d78ce;
    --color-font-contrast-dark-default:#0d47a1;
    --color-font-highlight-default: #fff;
    --color-font-invert-default: #000;

    --color-border-dim-default: #0d47a1;
    --color-border-bright-default: #1565c0;
    --color-border-highlight-default: #90caf9;

    --color-highlight-default: #2d78ce;
    --color-highlight-80: #2d78cecc;
    --color-highlight-greyscale: #ccc;

    --color-diasbled-default: #ddd;
    
    --color-hover-highlight-80: rgba(0, 0, 0, 0.8);
    --color-hover-highlight-20: rgba(0, 0, 0, 0.2);
    --color-hover-highlight-10: rgba(0, 0, 0, 0.1);

    /* settings */
    --setting-border-radius-big-default: 5px;

    /* shadows */
    --shadow-default: 0px 0px 7px rgb(100, 100, 150, 0.3);
    --shadow-highlight: 0px 0px 10px rgb(100, 100, 150, 0.3);
}