html {
    --color_primary: #000;
    --color_text_light: #888;
    --color_text: black;

    --base-font-size: 16px;

    --font_primaryFamily: Morandi, sans-serif;
    --font_primaryWeight: 400;
    --font_primaryLineHeight: 1.35;
    --font_secondaryFamily: Publico, serif;
    --font_secondaryWeight: 400;
    --font_secondaryLineHeight: 1.5;

    --typescale: 1.333;

    --type-preset-1__fontSize: calc(1em * var(--typescale) * var(--typescale) * var(--typescale) * var(--typescale) * var(--typescale));
    --type-preset-2__fontSize: calc(1em * var(--typescale) * var(--typescale) * var(--typescale) * var(--typescale));
    --type-preset-3__fontSize: calc(1em * var(--typescale) * var(--typescale) * var(--typescale));
    --type-preset-4__fontSize: calc(1em * var(--typescale) * var(--typescale));
    --type-preset-5__fontSize: calc(1em * var(--typescale));
    --type-preset-6__fontSize: 1em;
    --type-preset-7__fontSize: calc(1em / var(--typescale));

    --vr: 1.6rem;
    --vr2x: calc(var(--vr) * 2); 
    --vr4x: calc(var(--vr) * 4); 

    --canvas_backgroundColor: #fff;
}