:root {
  --primary: #F05A4E;
  --secondary: #FBCECA;
  --terciary: #F58C83;
  --black: #1B1B1C;
  --xxxl: 56px;
  --xxl: 50px;
  --xxml: 40px;
  --xl: 36px;
  --xml: 28px;
  --xmml: 24px;
  --l: 20px;
  --ml: 18px;
  --m: 16px;
  --s: 14px;
  --xs: 12px;
  --xxs: 10px;
  --trans: all .2s ease-out;
  --xl-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
  --l-shadow: 0 0 35px rgba(0, 0, 0, 0.3);
  --ml-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
  --submenu-shadow: 0 3px 3px rgba(0, 0, 0, 0.05);
  --m-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  --s-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  --roomy-light: 'Sathosi-light';
  --roomy-normal: 'Sathosi-normal';
  --roomy-medium: 'Sathosi-medium';
  --roomy-bold: 'Sathosi-bold';
  --roomy-black: 'Sathosi-black';
}

@media (max-width: 992px) {
  :root {
    --xxxl:42px;
    --xxl: 40px;
    --xxml: 32px;
    --xl: 28px;
    --xml: 24px;
    --l: 20px;
    --ml: 18px;
    --m: 16px;
    --s: 14px;
    --xs: 12px;
    --xxs: 10px;
  }
}

@media (max-width: 767px) {
  :root {
    --xxxl:36px;
    --xxl: 32px;
    --xxml: 28px;
    --xl: 24px;
    --xml: 22px;
    --l: 18px;
    --ml: 16px;
    --m: 14px;
    --s: 12px;
    --xs: 11px;
    --xxs: 10px;
  }
}