:root {
  --main-bg-color: brown;
  --gray-darker: #131313;
  --gray-dark: #666;
  --gray: #a7a7a7;
  --gray-light: #bebebe;
  --gray-lighter: #e4e4e4;
  --gray-bg: #f2efe8;
  --gray-bg-light: #f2f2f2;
  --primary-dark: #ffd600;
  --primary: #e84e0f;
  --primary-light: #ffe953;
  --secondary-dark: #79577f;
  --secondary: #ffdd00;
  --secondary-light: #a589ba;
  --tertiary-dark: #5e0c1e;
  --tertiary: #463521;
  --tertiary-light: #f9ead7;
	--maron:#5c0c1d;
  --transition-4s: all 0.4s ease-in-out 0s;
  --transition-6s: all 0.6s ease-in-out 0s;
  --border-radius: 30px;
  --letter-spacing: 0.5px;
  --font-family-sans-serif: 'Niramit', sans-serif;
  --font-family-serif: 'Niramit', sans-serif;
  --font-family-base: var(--font-family-sans-serif);
  --font-size-base: 1rem;
  --font-size-xl: 1.7rem;
  --font-size-lg: 1.4rem;
  --font-size-md: 1.125rem;
  --font-size-s: 0.85rem;
  --font-size-sm: 0.75rem;
  --font-size-xs: 0.65rem;
  --font-size-h1: 2rem;
  --font-size-h2: 1.8rem;
  --font-size-h3: 1.6rem;
  --font-size-h4: 1.43rem;
  --font-size-h5: 1.3rem;
  --font-size-h6: 1.2rem;
  --display1-size: 4rem;
  --display2-size: 3rem;
  --display3-size: 2.5rem;
  --display4-size: 2rem;
  --display5-size: 1.5rem;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-bold: bold;
  --font-weight-extrabold: 800;
}