@import "../helpers";
:root {
  // font-family
  --font-family--primary: "Roboto", serif;
  --font-family--secondary: "Raleway", sans-serif;
  //font-weight
  --font-weight--light: 300;
  --font-weight--normal: 400;
  --font-weight--medium: 500;	
  --font-weight--semibold: 600;
  --font-weight--bold: 700;
  // font-size
  --font-size--xs: 0.75rem; //12px
  --font-size--sm: 0.875rem; //14px
  --font-size--base: 1rem; //16px
  --font-size--lg: 1.125rem; //18px
  // heading font-size
  --h1-font-size: 1.5rem; //24px
  --h2-font-size: 1.5rem; //24px
  --h3-font-size: var(--font-size--lg); //18px
  --h4-font-size: var(--font-size--lg); //18px
  --h5-font-size: var(--font-size--base); //16px
  --h6-font-size: var(--font-size--base); //16px
  @include for-desktop {
    --h1-font-size: 2.625rem; //42px
    --h2-font-size: 2.25rem; //36px
    --h3-font-size: 1.625rem; //26px
    --h4-font-size: 1.25rem; //20px
    --h5-font-size: var(--font-size--base); //16px
    --h6-font-size: var(--font-size--sm); //14px
  }	  
}
