:root {
    --font-display: 'Quicksand'; /* 'Quicksand, Arial, sans-serif'; */
    --font-default: 'Arial';
    --color-primary-600: #3371b1;
    --color-primary: #6292c2;
    --color-primary-400: #89b7e1;
    --color-primary-300: #97c0e4;
    --color-primary-200: #a6c9e8;
    --color-primary-100: #b5d2ec;
    --color-primary-50: #c4dbf0;
    --color-primary-hover: var(--color-primary-600);
    --color-primary-contrast: #fff;
    --color-primary-contrast-hover: var(--color-primary-contrast);
    --color-secondary: #ef6701;
    --color-secondary-200: #f4a366;
    --color-secondary-100: #f6b280;
    --color-secondary-50: #f7c199;
    --color-secondary-hover: var(--color-secondary-200);
    --color-secondary-contrast: #fff;
    --color-secondary-contrast-hover: var(--color-secondary-contrast);
    --color-border: #999999;
    --color-area-light: #fafafa;
    --color-area: #f5f5f5;
    --color-disabled: #eee;
    --color-disabled-contrast: #808080;
    --color-text: #333;
    --color-text-secondary: var(--color-disabled-contrast);
    --color-error: #e30713;
    --color-error-light: #f34d5b;
    --color-success: #96b94d;
    --color-success-light: #7daf3c;
    --color-warning: #004d9e;
}