body {
  margin: 0;
  line-height: normal;
}

:root {
  /* font sizes */
  --h1-size: 20px;
  --h2-size: 18px;
  --h3-size: 16px;
  --p-size: 16px;
  --label-size: 12px;
  --button-small-size: 15px;
  --code-size: 36px;

  --font-size-mini: 15px;

  /* Colors */
  --black: #2E2A25;
  --75-black: #615E5A;
  --50-black: #95938F;
  --30-black: #BEBDBA;
  --10-black: #E7E7E5;

  --yellow: #fff8b7;
  --green-button-bg: #dcf3eb;
  --off-white: #fcfcfa;
  --white: #fff;

  /* Paddings */
  --padding: 16px;
  --half-padding: 8px;
  --quater-padding: 4px;
  --offset: 40px;

  --padding-m: 12px;
  --half-padding-m: 6px;
  --quater-padding-m: 3px;
  --offset-m: 12px;
}