:root {
  --color-p1: #fbad23;
  --color-p1-dark: #fba60f;
  --color-p1-darker: #37604e;
  --color-p1-darkest: #2a4a3c;
  --color-p1-light: #fcbd4f;
  --color-p1-lighter: #fdce7b;
  --color-p1-lightest: #fddea7;
  --color-p2: #457862;
  --color-p2-dark: #3e6b58;
  --color-p2-darker: #376053;
  --color-p2-darkest: #2a4a3f;
  --color-p2-light: #699280;
  --color-p2-lighter: #8fada0;
  --color-p2-lightest: #b4c9c0;
  --color-p3: #1c4c37;
  --color-p3-dark: #163c2c;
  --color-p3-darker: #112f22;
  --color-p3-darkest: #08150f;
  --color-p3-light: #496f5f;
  --color-p3-lighter: #769386;
  --color-p3-lightest: #a4b7af;
  --color-s1: #e8f1ed;
  --color-s1-darker: #dfece6;
  --color-s1-lighter: #f4f8f6;
  --color-s2: #daefe6;
  --color-s2-dark: #c1e4d5;
  --color-s2-darker: #a9dac5;
  --color-s3: #9ec9b6;
  --color-s3-dark: #86bba4;
  --color-s3-light: #c6dfd4;
  --color-s3-lighter: #d8eae2;
  --sub-nav-bg: var(--color-s1-lighter);
  --mobile-drawer: var(--color-p3);
  --mobile-drawer-active: var(--color-p3-light);
}