html {

    --primary-lighter:#a0977c;
    --primary-light: #938a72;
    --primary: #867e68;
    --primary-dark: #78715d;
    --primary-darker: #6b6453;

    --secondary: #efd59e;
    --secondary-light: #ffeaad;
    --secondary-dark: #d7bf8e;

    --accent: #0886D7;
    --accent-light: #0893ec;
    --accent-dark: #0778c1;

    --light: #f9fafb;
    --light-light: #ffffff;
    --light-dark: #e0e1e1;

    --background: #FFFFFF;
    --background-light: #ffffff;
    --background-dark: #e5e5e5;

    --element-size: 42px;
    --font-color: #1f2937;
}

html.dark {

    --light: #3e4955;
    --light-light: #434d5a;
    --light-dark: #2a323a;

    --background: #1f2937;
    --background-light: #363f4d;
    --background-dark: #10151d;

    --font-color: #f9fafb;
}