Blog title and blog heading too large

I’m trying to change font type and size and vertical spacing between in the heading of a blog post. I know this has been answered in the forum in many vairations, but I haven’t been able to make any of the suggestions work.


When I try the example CSS it changes the blog post font style and size in full-screen mode but also affects the Enfold Top menu, Headline Rotator, etc. 

It also stops working completely when I decrease the screen size while looking at a post but doesn’t change the other elements that have been affected.

As you know from answering these support posts over the years, the text size is too large and gives the appearance of overlap on mobile phones. I haven’t found any way to do this within the theme itself. I have many approaches using custom CSS Enfold Theme Options->General Styling->Quick CSS and the Advanced Tab->Development Custom CSS. 
 I am not a software engineer or CSS coder. 



This is what I am hoping the outcome to be
color: RED;

 font-size: 20px;

 line-height: 1.1em;

 font-weight: 400;

 text-transform: none;