emilyTK

What I saw at first sight is that there is already a declaration in style.css saying that your h1, h2, and h3 should be black in colour. Try overriding that to #990000 and see if that already fixes the issue.

Yup, it’s depending on new CSS rules that IE8 doesn’t know of yet.
But that’s alright, since #1 only 10% of users in the whole world use it, and #2 the text being an arch isn’t really necessary for the overall functionality of your website. So there’s nothing you need to worry about.

I just thought of this. This app allows testing your website on devices that run iOS. iPhone 5 looks good. Responsinator agrees. (Sorry I didn’t think of it earlier; rough day.)

There is no method in CSS. There are sure other methods of recognising text in an image, but they require an insane amount of programming skill. (Maybe someone already built a WordPress plugin.)

If, however, you want to use another bit of text inside the header, turn it into an arch and still make sure it won’t touch your site description, I’d recommend you do not put this text into a background image.

Well, you didn’t tell me in what kinds of situations your image appears to cover the description. So I supposed it depended on how the text is rendered by a browser.
As for the structure: Inspecting the header in Firebug will tell you that you have a background-image inside your site header. And that you have text inside an h2 element inside your site header. Both of these do not really care about each other. That’s all there really is to it.

How about this:

#site-description {
	max-width: 460px; /* Or whatever */
	margin: 0 auto;
}

You could give the header a padding and set the background-color to the same grey you used in your image:

#masthead {
	background-color: #f5f5f5;
	padding: 40px 0; /* Or whatever */
}

If this is your template, ask your question here. Those people can help you way faster.

And, woops, I totally forgot about the header image.
Try this:

#masthead {
	background-repeat: no-repeat;
	background-position: 50% 50%;
}

Lol, you’re the only person here who makes me go into this kind of detail.
Check this out:
https://www.smashingmagazine.com/2012/04/24/a-closer-look-at-font-rendering/
https://css-tricks.com/font-rendering-differences-firefox-vs-ie-vs-safari/

You don’t even have to read it all.
All I want is to show you that you’re doing just fine.

It says here that you could contact 4templates about any issues regarding themes and templates.

Did it work with your iPhone on the test domain?

Try asking the Customizr support forum. Faster solutions guaranteed.

In that case, try this:

.entry-header, .entry-content {
	background: red !important;
}

Sorry I didn’t see it earlier.

Right at the bottom of your file.
And why is there Meteor Slide PHP code in your CSS file?