Header change after refresh the page

The headers and the font of the articles change after refresh the page (F5)! But this only happens when the internet is offline (no connected).

When a enter into article across the menu (when offline), everything works right, but if i press F5, the page is reload with a different style: headers with font arial...

Why needs internet connection to some styles work right? How to fix it?

You must be online when looking the site because some custom fonts in this template are loading from Google's servers.

Loading fonts from google do not decrease the performance and load speed of the site?

Can I load the fonts from my host?

Host usually high speed internet connections , so there is no worry about using google fonts