Loading a web font nicely, with FOUT

style.less

body {

  // set your base
  font-family: sans-serif;
  line-height: 1.25;
  
  // .wf-loading means js is running and the webfont is loading,
  // so adjust the base font to minimise the jank when the switch happens
  .wf-loading & {
    font-size: 0.935em;
    line-height: 2.5;
  }
  
  // when the webfont has loaded, apply it
  .wf-active & {
    font-family: "Source Sans Pro", sans-serif;
  }
}