Change Post Title Font

I don’t see Lato being enqueued in your site. If the font isn’t enqueued first, then you can’t use it in the CSS.

Try using a Google Fonts plugin to enqueue the font in addition to targeting the CSS.

Also, the class header-font doesn’t exist, I’m curious where you got that. ??

This should do the trick once Lato is correctly enqueued:

.entry-header .entry-title {
  font-family: Lato, Helvetica, sans-serif;
}

Be sure to include at least one fallback font and one generic fallback font family, in case the main font isn’t available – for example, if the Google font server is down or doesn’t load.

I used a browser inspector to find the right element to target.

If I want to use the “light” version of Lato, how would I do that?

You would need to enqueue the Light version of Lato after installing a Google Font plugin. The plugin’s instructions should tell you how to do that.

Yes, I’ve done that, but how do I incorporate that into CSS? I assume the light version will need some kind of decoration assignment?

You can modify the font-weight property to match the variant you’re using:

https://www.google.com/fonts#UsePlace:use/Collection:Lato

For example, Lato Light would be equivalent to font-weight: 300;

Keep in mind that you’re still declaring Tahoma for several elements in your custom CSS, for example:

.content-area .entry-title a {
     font-family: Tahoma,Geneva,sans-serif;
     font-size: 20px;
}

.single-post .entry-title {
     color: #ffffff;
     font-family: Tahoma,Geneva,sans-serif;
     font-size: 50px;
}

Since these are lower down in your custom CSS, they are overriding your earlier Lato declarations.