/* 1vm = 1% of screen width */

html {
  font-size: 12px;
}

/* Uses vh and vm with calc */
/* if 100vw = 264 px, then fond = 12px */
@media screen and (min-width: 20rem){
  html { font-size: calc( 12px + 3.5*(100vw - 264px) / (800 - 400) ); }
}


/* Safari <8 and IE <11 */
@media screen and (min-width: 22rem){
  html { font-size: calc( 14px + 3.5*(100vw - 308px) / (800 - 400) ); }
}


@media screen and (min-width: 100rem){
    html { font-size: 22px; }
}