:root {
  --padding: 12px;
  --margin: 12px;
  --white: #fff;
  --black: #000;
  --red: #f00;
  --green: #45af45;
  --grey: #5A5A5A;
  --grey-darker: #666666;
  --grey-accent-color: #eee;
  --blue: #80A7D5;
  --light-blue: #B2C6DA;
  --light-orange: #D2977F;
  --middle-orange: #BF9683;
  --light-grey: #F8F8F8;
  --lighter-yellow: #FCF9EF;
  --light-yellow: #F8F5EF;
  --background-color: var(--light-yellow);
  --box-shadow-primary: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  --box-shadow-secondary: rgba(0, 0, 0, 0.12) 0px 8px 14px -8px, rgba(0, 0, 0, 0.08) 0px 3px 6px -4px;
  --font-color: var(--grey);
  --head-color: var(--grey);
  --link-color: var(--light-orange);
  --link-hover: var(--light-orange);
  --primary-color: #45af45;
  --secondary-color: #f00;
  --grey-input-background: #F8F8F8;
  --input-border-color: #c1c1c1;
  --border-radius-smaller: 12px;
  --border-radius-small: 20px;
  --border-radius-normal: 40px;
  --border-radius-bigger: 57px;
  --btn-color: var(--light-orange);
  --btn-color-hover: var(--light-orange);
  --btn-text-color: var(--white);
  --btn-secondary-color: var(--white);
  --btn-secondary-color-hover: var(--light-orange);
  --btn-secondary-text-color: var(--grey);
  --font-base: 'poppins', sans-serif;
  --font-heading: 'urbane-rounded', sans-serif;
  --font-weight: 400;
  --heading-weight: bold;
}
