About to dive in to the world of CSS...

Hi there BlueSmurfarita.

If I was laying out your site it would be something like the following (changes will probably be needed as you test your site though).

Have a div that contains the whole layout. This outter div would be used to center the page in the middle of the screen. Make sure to have text-align center in the body for your CSS. Then this outter div should have margin 0 auto; -- this is to center the div. If you don't do that then some browsers will position the layout to the left.

The outter div would get a border and a set width (either in pixels or %).

The div for the image would come next, again with the border around it.

Next that banner going across the image. You can use a relative position to move the banner up over the image.

Then you'd have a choice about the menu and what I assume would be content areas.

You could float the menu div to the right and the content area to the left. But then you would need (or should) to use clear both on a div under that so the layout works right. The div that clears the section could be a footer for copyright, links, etc. But it might not let you have the vertical line got to the very bottom of the page, unless it's a background image.

OR

Wrap both the menu and content div in an outter div. You could use a background image on this outter div to have that vertical line to seperate the menu from the content. Then again float the menu to the right and the content to the left. You could use an empty div under those with clear both. The background-color to all those divs would be transparent so that vertical line, which is in the background image, would show through.

Of course this is just me ... others will have their own way to do it. But this is a simple enough solution for a beginner to work with.