:root {
  --green-back: #baffc9;
  --green-border: #a9eeb8;
  --blue-back: #bae1ff;
  --blue-border: #0a538c;
  --orange-back: #ffdfba;
  --orange-back-light: #fff4e7;
  --orange-border: #eecea9;
  --orange-text: #4a2a07;
  --orange-peach-gradient: conic-gradient(from 0deg at 0% 0%, hsl(32 100% 83% / 1) 0grad, hsl(38 90% 92% / 1) 160grad, hsl(32 67% 75% / 1) 360grad);
  --orange-peach-gradient-switch: conic-gradient(from 280deg at 0% 0%, hsl(32 100% 83% / 1) 0grad, hsl(38 90% 92% / 1) 160grad, hsl(32 67% 75% / 1) 360grad);
  --orange-peach-gradient-small: conic-gradient(from 0deg at 0% 0%, hsl(32 100% 87% / 1) 0grad, hsl(38 90% 92% / 1) 160grad, hsl(32 67% 83% / 1) 360grad);
  --orange-light-gradient-small: conic-gradient(from 0deg at 0% 0%, hsl(32, 83%, 91%) 0grad, hsl(35, 100%, 96%) 160grad, hsl(33, 73%, 84%) 360grad);
  --brown-gradient-small: conic-gradient(from 0deg at 0% 0%, hsl(32, 75%, 35%) 0grad, hsl(38, 69%, 21%) 160grad, hsl(32, 32%, 60%) 360grad);
  --link-back: #cccccc1a;
  --yellow-border: #eeeea9;
  --yellow-text: #9e9e00;
  --base-back: #fff9c6;
  --yellow-back: #fff9c6;
  --base-grey: #fafaef;
  --base-border: #e2e2d7;
  --link: #375575;
  --visited: #b0014e;
  --link-border: #0079d6;
  --visited-border: #b0014d7c;
  --faded-yellow: #f8f7f2;
  --background-color-post: var(--base-grey);
  --postCard-border-color: var(--base-border);
}

:root {
  --background-color: var(--orange-back);
  --border-color: var(--orange-border);
  --text-color: var(--orange-text);
  --background-color-light: var(--orange-back-light);
}

.BaseBack {
  background-color: var(--base-back);
}
.GreyBack {
  background-color: var(--base-grey);
}