////
/// @group css variables
////

/// Variables that control how font family, and font-size of text on the sheet.
/// @name font variables
@mixin variables{
  // Font families
  --font1:var(--topHeadFont);
  --font2:var(--topHeadFont);
  --font3:var(--midHeadFont);
  --font4:var(--midHeadFont);
  --font5:var(--midHeadFont);
  --font6:var(--contentHeadFont);
  --font7:var(--contentHeadFont);

  // Font sizes
  --baseFontSize: 16px;
  --size1:300%;
  --size2:250%;
  --size3:200%;
  --size4:150%;
  --size5:125%;
  --size6:100%;
  --size7:87.5%;

  // Default icon font size
  --icon-size:24px;

  //Default fonts used
  --font-icon: 'Material Icons';
}