:root {
  /* Common Colors */
  --white: #fff;
  --light-gray: #d6d6d6;
  --primary: #2a3136;
  --gray-medium: #d9d9d9;
  --gray: #434343;
  --gray2: #4d4d4d;
  --lightgray400: #ebebeb;;
  --lightgray1: #fafafa;
  --lightgray2: #d8d8d8;
  --lightgray3: #a0a0a0;
  --shadow: #00000029;
  --lightgrey1: #e2e2e2;
  --grey600: #aaaaaa;
  --tealblue: #0b698e;
  --tealbluelight100: #ddf0f8;
  --buttonhovercolor: #0a4d68;
  --commentstime: var(--grey600);
  --bordergrey: var(--lightgrey1);
  --box-shadow: var(--shadow);
  --primarytext: var(--primary);
  --titletext: var(var(--gray2));
  --buttonbg: var(--tealblue);
  --buttonhoverbg: var(--gray);
  --buttonwhitetext: var(--white);
  --liningbg: var(--light-gray);
  --bordercolor: var(--lightgray400);
  --form-border: var(--lightgray2);
  --form-text: var(--gray);
  --form-bg: var(--lightgray1);
  --form-label: var(--gray2);
  /* Font properties */
  --weight-small: 200;
  --weight-regular: 400;
  --weight-medium: 600;
  --weight-bold: 700;
}