In my case i made the following mistake in my css code.
*{
font-family: 'Open Sans', sans-serif !important;
}
This will override all font family rules for the entire page.
My solution was to move the code to body like so.
body{
font-family: 'Open Sans', sans-serif;
}
NB: Whenever you use the !important flag in css, any other css rule declared of the same type on the same element will get overriden.