:root{
                --primary: #69a1ab;
--primary-o2: #69a1ab32;
--primary-o4: #69a1ab64;
--primary-o6: #69a1ab96;
--primary-o8: #69a1abC8;

                --primary-strong: #598b94;
--primary-strong-o2: #598b9432;
--primary-strong-o4: #598b9464;
--primary-strong-o6: #598b9496;
--primary-strong-o8: #598b94C8;

                --primary-light: #a7c4c9;
--primary-light-o2: #a7c4c932;
--primary-light-o4: #a7c4c964;
--primary-light-o6: #a7c4c996;
--primary-light-o8: #a7c4c9C8;

                --on-primary: #ffffff;
--on-primary-o2: #ffffff32;
--on-primary-o4: #ffffff64;
--on-primary-o6: #ffffff96;
--on-primary-o8: #ffffffC8;

                --on-primary-strong: #ffffff;
--on-primary-strong-o2: #ffffff32;
--on-primary-strong-o4: #ffffff64;
--on-primary-strong-o6: #ffffff96;
--on-primary-strong-o8: #ffffffC8;

                --on-primary-light: #ffffff;
--on-primary-light-o2: #ffffff32;
--on-primary-light-o4: #ffffff64;
--on-primary-light-o6: #ffffff96;
--on-primary-light-o8: #ffffffC8;


                --secondary: #f2f0e3;
--secondary-o2: #f2f0e332;
--secondary-o4: #f2f0e364;
--secondary-o6: #f2f0e396;
--secondary-o8: #f2f0e3C8;

                --secondary-strong: #d9d7c8;
--secondary-strong-o2: #d9d7c832;
--secondary-strong-o4: #d9d7c864;
--secondary-strong-o6: #d9d7c896;
--secondary-strong-o8: #d9d7c8C8;

                --secondary-light: #ffffff;
--secondary-light-o2: #ffffff32;
--secondary-light-o4: #ffffff64;
--secondary-light-o6: #ffffff96;
--secondary-light-o8: #ffffffC8;

                --on-secondary: #707070;
--on-secondary-o2: #70707032;
--on-secondary-o4: #70707064;
--on-secondary-o6: #70707096;
--on-secondary-o8: #707070C8;

                --on-secondary-strong: #333333;
--on-secondary-strong-o2: #33333332;
--on-secondary-strong-o4: #33333364;
--on-secondary-strong-o6: #33333396;
--on-secondary-strong-o8: #333333C8;

                --on-secondary-light: #2a2a2a;
--on-secondary-light-o2: #2a2a2a32;
--on-secondary-light-o4: #2a2a2a64;
--on-secondary-light-o6: #2a2a2a96;
--on-secondary-light-o8: #2a2a2aC8;


                --background: #f2f0e3;
--background-o2: #f2f0e332;
--background-o4: #f2f0e364;
--background-o6: #f2f0e396;
--background-o8: #f2f0e3C8;

                --background-variant: #333333;
--background-variant-o2: #33333332;
--background-variant-o4: #33333364;
--background-variant-o6: #33333396;
--background-variant-o8: #333333C8;

                --on-background: #121212;
--on-background-o2: #12121232;
--on-background-o4: #12121264;
--on-background-o6: #12121296;
--on-background-o8: #121212C8;

                --on-background-variant: #f2f0e3;
--on-background-variant-o2: #f2f0e332;
--on-background-variant-o4: #f2f0e364;
--on-background-variant-o6: #f2f0e396;
--on-background-variant-o8: #f2f0e3C8;


                --surface: #ffffff;
--surface-o2: #ffffff32;
--surface-o4: #ffffff64;
--surface-o6: #ffffff96;
--surface-o8: #ffffffC8;

                --surface-variant: #f2f0e3;
--surface-variant-o2: #f2f0e332;
--surface-variant-o4: #f2f0e364;
--surface-variant-o6: #f2f0e396;
--surface-variant-o8: #f2f0e3C8;

                --on-surface: #333333;
--on-surface-o2: #33333332;
--on-surface-o4: #33333364;
--on-surface-o6: #33333396;
--on-surface-o8: #333333C8;

                --on-surface-variant: #333333;
--on-surface-variant-o2: #33333332;
--on-surface-variant-o4: #33333364;
--on-surface-variant-o6: #33333396;
--on-surface-variant-o8: #333333C8;


                --success: #008000;
--success-o2: #00800032;
--success-o4: #00800064;
--success-o6: #00800096;
--success-o8: #008000C8;

                --on-success: #ffffff;
--on-success-o2: #ffffff32;
--on-success-o4: #ffffff64;
--on-success-o6: #ffffff96;
--on-success-o8: #ffffffC8;

                
                --error: #7d1d1d;
--error-o2: #7d1d1d32;
--error-o4: #7d1d1d64;
--error-o6: #7d1d1d96;
--error-o8: #7d1d1dC8;

                --on-error: #ffffff;
--on-error-o2: #ffffff32;
--on-error-o4: #ffffff64;
--on-error-o6: #ffffff96;
--on-error-o8: #ffffffC8;


                --primary-font: 'Roboto',sans-serif,serif;
--primary-font-o2: 'Roboto',sans-serif,serif32;
--primary-font-o4: 'Roboto',sans-serif,serif64;
--primary-font-o6: 'Roboto',sans-serif,serif96;
--primary-font-o8: 'Roboto',sans-serif,serifC8;

                --secondary-font: 'Roboto',sans-serif,serif;
--secondary-font-o2: 'Roboto',sans-serif,serif32;
--secondary-font-o4: 'Roboto',sans-serif,serif64;
--secondary-font-o6: 'Roboto',sans-serif,serif96;
--secondary-font-o8: 'Roboto',sans-serif,serifC8;


                --primary-alt: #cf574d;
--primary-alt-o2: #cf574d32;
--primary-alt-o4: #cf574d64;
--primary-alt-o6: #cf574d96;
--primary-alt-o8: #cf574dC8;

                --primary-alt-variant: #000000;
--primary-alt-variant-o2: #00000032;
--primary-alt-variant-o4: #00000064;
--primary-alt-variant-o6: #00000096;
--primary-alt-variant-o8: #000000C8;

                --on-primary-alt: #ffffff;
--on-primary-alt-o2: #ffffff32;
--on-primary-alt-o4: #ffffff64;
--on-primary-alt-o6: #ffffff96;
--on-primary-alt-o8: #ffffffC8;

                --on-primary-alt-variant: #ffffff;
--on-primary-alt-variant-o2: #ffffff32;
--on-primary-alt-variant-o4: #ffffff64;
--on-primary-alt-variant-o6: #ffffff96;
--on-primary-alt-variant-o8: #ffffffC8;

                --background-alt: #ffffff;
--background-alt-o2: #ffffff32;
--background-alt-o4: #ffffff64;
--background-alt-o6: #ffffff96;
--background-alt-o8: #ffffffC8;

                --on-background-alt: #333333;
--on-background-alt-o2: #33333332;
--on-background-alt-o4: #33333364;
--on-background-alt-o6: #33333396;
--on-background-alt-o8: #333333C8;

                --background-alt-variant: #333333;
--background-alt-variant-o2: #33333332;
--background-alt-variant-o4: #33333364;
--background-alt-variant-o6: #33333396;
--background-alt-variant-o8: #333333C8;

                --on-background-alt-variant: #f2f0e3;
--on-background-alt-variant-o2: #f2f0e332;
--on-background-alt-variant-o4: #f2f0e364;
--on-background-alt-variant-o6: #f2f0e396;
--on-background-alt-variant-o8: #f2f0e3C8;

            }