:root {
  --color-primaryYellow: #ffc82d;
  --color-primaryYellowLight: #fff4d5;
  --color-offBlack: #0b0c0c;
  --color-offBlackTransparent: rgba(11, 12, 12, 0.3);
  --color-offBlackTransparentLight: rgba(11, 12, 12, 0.1);
  --color-grey: #333333;
  --color-darkGrey: #182026;
  --color-lightGrey: #d3e2ee;
  --color-midGrey: #597489;
  --color-midGreyTransparent: #a4b5c2;
  --color-backgroundGrey: #f0f6fb;
  --color-placeholderGrey: #9daab3;
  --color-keylineGrey: #d4e3ee;
  --color-keylineGreyTransparent: rgba(212, 227, 238, 0.4);
  --color-lightGreyTransparent: rgba(89, 116, 137, 0.5);
  --color-shadowGreyTransparent: rgb(212, 227, 238, 0.8);
  --color-navigationShadow: rgba(0, 0, 0, 0.1);
  --color-outlineGrey: #aaaaaa;
  --color-trueWhite: #ffffff;
  --color-hoverWhite: #fafafa;
  --color-whiteTransparent: rgba(255, 255, 255, 0.6);
  --color-linkBlue: #0d6dd3;
  --color-linkLightBlue: rgba(13, 109, 211, 0.1);
  --color-linkVeryLightBlue: rgba(13, 109, 211, 0.05);
  --color-backgroundLightBlue: #c0dae9;
  --color-backgroundBlue: #baddec;
  --color-reviewBackgroundLightBlue: #f0f6fa;
  --color-reviewBackgroundBlue: #bce0f0;
  --color-photographyBlue: #b5d2d8;
  --color-photographyBlueAlt: #badbeb;
  --color-collectiveBackground: #b9dae7;
  --color-successLightGreen: #e1fccd;
  --color-successGreen: #2e7e40;
  --color-successDarkGreen: #9ed685;
  --color-successGreenCheck: #6ca951;
  --color-errorRed: #da2525;
  --color-errorRedBackground: #fff2f2;
  --color-creamBenefitsBackground: #badbec;
  --color-shareBlue: #a9cede;
  --color-ingredientBlue: #9cd4ec;
  --color-treatmentBackgroundBlue: #dfedf7;
  --color-bannerBackgroundBlue: #d3f3fb;
  --color-presentTeal: #0095b6;
  --color-benefitsLightGrey: #eaf2f7;
  --color-benefitsMidGrey: #f7fafd;
  --color-darkYellow: #eba400;
  /* fonts */
  --font-masqualero: masqualero, sans-serif;
  --font-viktorie: viktorie, serif;
  --font-proximaNova: proxima-nova, sans-serif;
  /* media queries */
  --mq-smallPhone: 320px;
  --mq-standardPhone: 375px;
  --mq-midPhone: 414px;
  --mq-largePhone: 450px;
  --mq-smallTablet: 576px;
  --mq-tablet: 768px;
  --mq-laptop: 992px;
  --mq-wide: 1278px;
  --mq-extraWide: 1540px;
}