Place my navigation bar over image and 200px lower

Hi,

I need a webpage where I can place the navigation bar about 200px lower than the normal top-of-the-page-placed navigation bar, with an image above/behind it.

I put in a margin of 200px through CSS, which makes the navigation bar move down... But then I get a solid color around/behind it, instead of the picture of the website background. I looked into it: that solid color background is the footer background color.

How can I move my navigation bar down, without making this huge space of solid color where I can't put anything?

(See picture: the orange = the space I automatically created when changing the margins of my navigation bar. But I want that navigation bar to go over the picture that you see below.)

PS - this is the Stella template, but I don't really care which one I use, as long as I can get that navigation bar right

(PPS - I don't care if it's an actual 'navigation bar', or a white space with buttons in it... I just need the white line with blue text you see below, without that solid background I can't change anything about)

Hey, 

I found the solution:
In CSS, apart from the margin adjustment, I also added this and now it works with the image behind it:

header {
position: absolute;
 width: 100%;
z-index: 4;
}