It's usually recommended to not edit any of the default SharePoint files, because if an update to SharePoint gets applied, and that file is part of the update, your changes will get overwritten by the update.
There are a couple of ways you could approach this. If the site you are working with has the publishing features enabled, in Site Settings under "Look and Feel" there should be a link titled "Master page". In the Master Page settings, there is a place to specify an Alternate CSS file to be used. This would apply throughout the site. You can create a stylesheet with the settings you want to override .title-With-Background, upload it to a location on the site (I like to put things in the Site Assets folder), and specify the URL to the file in the Alternate CSS URL setting.
If you do not have publishing enabled, you can use a similar technique to link in a stylesheet just to the page you want it on. You would upload the custom style sheet to somewhere on the site, go to the page you want it applied to, add a Script Editor Web Part at the top of the page, and in the script editor snippet, add the link to the style sheet:
<link rel="stylesheet" type="text/css" href="/sites/mysite/SiteAssets/myStyleSheet.css" />
That should override the SP default styles. If it does not, one thing you might want to try is to make a more specific selector.
By that I mean, look at the page and see if you can see some other element you can use that is applicable to all the places you want your new title-With-Background style to apply, and use that to narrow the selection. For instance, you could just specify all title-With-Backgrounds that are within a web part zone:
.ms-webpart-zone .title-With-Background {
/* your custom styles here */
}
