/*

  SYSTEM FONTS

*/

.system-sans-serif {
  font-family: -apple-system,
               'avenir next', avenir,
               roboto, noto,
               'helvetica neue', helvetica,
               ubuntu,
               'franklin gothic medium', 'century gothic',
               sans-serif;
}


/*
  Reference:

  https://webkit.org/blog/3709/using-the-system-font-in-web-content/
  https://en.wikipedia.org/wiki/Avenir_(typeface)
  https://www.google.com/design/spec/style/typography.html#typography-typeface

*/

/*

  SYSTEM FONTS

*/

.system-sans-serif {
  font-family: -apple-system, BlinkMacSystemFont, /* MacOS and iOS */
               'avenir next', avenir, /* MacOS and iOS */
               'Segoe UI' /* Windows */
               'lucida grande', /* Older MacOS */
               'helvetica neue', helvetica, /* Older MacOS */
               'Fira Sans', /* Firefox OS */
               roboto, noto, /* Google stuff */
               'Droid Sans', /* Old Google stuff */
               cantarell, oxygen, ubuntu, /* Linux stuff */
               'franklin gothic medium', 'century gothic', /* Windows stuff */
               sans-serif; /* Everything else */
}


/*
  References:

  https://webkit.org/blog/3709/using-the-system-font-in-web-content/
  https://en.wikipedia.org/wiki/Avenir_(typeface)
  https://www.google.com/design/spec/style/typography.html#typography-typeface

*/

Update with more updated stack.
Update with more updated stack.
