:root {
    --color-true-white: #ffffff;
    --color-true-black: #000000;

    --color-white: #f8f8f8;
    --color-grey: #777;
    --color-black: #22202e;

    --color-grey-light: #f3f3f3;
    --color-grey-dark: #c4c4c4;

    --color-primary: #CD9B33;
    --color-secondary: #CD7A33;
    --color-tertiary: #CDB333;

    --color-primary-light: #E5B759;
    --color-secondary-light: #E59A59;
    --color-tertiary-light: #E5CE59;

    --color-primary-dark: #A87919;
    --color-secondary-dark: #A85B19;
    --color-tertiary-dark: #A89119;

    --color-text-black: var(--color-black);
    --color-text-grey: var(--color-grey);
    --color-text-white: var(--color-white);

    --color-text-on-primary: var(--color-white);
    --color-text-on-secondary: var(--color-white);
    --color-text-on-tertiary: var(--color-white);

    --color-text-on-primary-light: var(--color-white);
    --color-text-on-secondary-light: var(--color-white);
    --color-text-on-tertiary-light: var(--color-white);

    --color-text-on-primary-dark: var(--color-white);
    --color-text-on-secondary-dark: var(--color-white);
    --color-text-on-tertiary-dark: var(--color-white);

    --color-success: #155724;
    --color-success-background: #d4edda;
    --color-success-border-color: #c3e6cb;
    --color-error: #FF0000;

    --color-background: var(--color-white);
    --color-background-reverse: var(--color-black);

    --font-familly: Lora, serif;
    --font-family-title: var(--font-familly);
    --font-size: 16px;
    --text-color: var(--color-black);
    --text-color-reverse: var(--color-text-white);
}