Adding a header image or background to a site that doesn't have one.

Hi there. Try the following changes in your style.css file:
1. Locate this code:

#header {
margin: 0 0 -1em 0;
padding: 5em 0 0 0;
position: relative;
}

and replace it with this one:

#header {
background:url('https://tinywhitenorth.com/wordpress/wp-content/uploads/2012/05/TWN-LogoWEBSITE.jpg') no-repeat 0 0;
margin: 0 0 -1em 0;
padding: 0;
position: relative;
}

Then locate this chunk of code:

h1 {
font-size: 25px;
font-weight: normal;
}

and replace it with:

h1 {
font-size: 25px;
font-weight: normal;
padding: 60px 0 0;
}

You can adjust the position of the site name by increasing or decreasing the top padding value of 60px. Increasing it will bring it farther from the top, and decreasing it, closer.
Hope that helps!

Thanks Marventus but that didn’t work for me.

I found the first part you talked about and replaced it but the image never came up and couldn’t find the second part you referenced at all. Here is a part of the css that seems to contain the area you are referring to…

[Code moderated as per the Forum Rules. The maximum number of lines of code that you can post in these forums is ten lines. Please use the pastebin]

Hi!
Just an FYI: you should always use Pastebin to share code chunks bigger than 10 lines on the WP forums.
Also, I just looked at your source code, and I didn’t see any of my code implemented (not even the first part).
The second part is right at the beginning of the style.css file, in the Typography section.

Thanks Marventus, sorry for the pastebin thing, I didn’t know.

I took your code out after I saw I couldn’t get it to work and went back to the original but now I know where you mean I’ll go back and try again.

Thanks for your help, will let everyone know how I got on.

That worked a treat, the only thing now is that the bottom of the images gets cropped out for some reason. The logo height is 142px and it seems like maybe the bottom 25% is missing or I would guess masked in some way.

Yeah, I forgot to tell you to set the <h1> height property to the same height of the image (or even a little higher just to be on the safe side).
So this:

h1 {
font-size: 25px;
font-weight: normal;
padding: 60px 0 0;
}

Should become this:

h1 {
font-size: 25px;
font-weight: normal;
height: 150px;
padding: 60px 0 0;
}

OK I figured it out, just had to change the padding from 60px to 95px and it all fits awesomely.

A HUGE thank you to Marventus for all you help.

??

No worries. Glad I could help.
Take care!