:root {
/*NEW COLORS*/
  --white: #FFFFFF;
  --black: #0A0A0A;
  --green: #466F67;
  --medium-green: #5FA186;
  --light-green: #97B2AB;
  --lightest-green: #DFECE7;

  --purple: #A486AD;
  --light-purple: #F3ECF5;

  --pink: #E0C9C9;
  --light-blue: #CED9DE;

  --dark-grey: #333333;
  --grey: #5C5C5C;
  --link-grey: #999999;
  --medium-grey: #EBEBEB;
  --light-grey: #FAFAFA;
  
  --primary-color: var(--black);
  --secondary-color: var(--green);
  --success-green: var(--medium-green);
  --text-grey: var(--grey);
  --title-grey: var(--dark-grey);
  --heading-color: var(--black);

  --button-black: var(--black);
  --button-black-hover: #5C5C5C;
  --button-black-active: #333333;

  --button-green: #5FA186;
  --button-green-hover: #42876D;
  --button-green-active: #396150;

  --blue: #2E71B5;
  --info-blue: var(--blue);
  --lightest-blue: #EAF1F8;

  --button-outline-hover: var(--button-black-hover);
  --button-outline-active: var(--button-black-active);

  --button-outline-light: var(--medium-grey);

  --button-white: #FAFAFA;
  --button-white-hover: var(--black);


  --button-disabled-grey: var(--light-grey);
  --button-disabled-text: var(--grey);

  --button-red: #CC5B60;
  --button-red-hover: #BB3A40;
  --button-red-active: #942E32;

  /*CREDITBAR COLORS*/

  --red: var(--button-red);
  --orange: #DC9376;
  --yellow: #F4DE8E;
  --yellow-green: #B5CBB0;

  /*LEGACY COLOR VARIABLES*/

  --main-dark: var(--black);
  --blueish-dark-grey: var(--grey);
  --blueish-grey: var(--grey);
}