<teal'c PI>Indeed</teal'c PI>
As I often say drawing some goofy picture before you have content, semantic markup and a layout in CSS is putting the cart before the horse. The pictures you hang on the layout should be the last part of the process, not the first.
Especially since quite often they have zero knowledge of accessibility, standards, and good practices making their goofy **** picture ultimately useless resulting in tinkertoy websites with over the top bounce rates. Most can't even seem to accept the notion that fixing the width and height of ANYTHING in the layout is a bad idea.
Well, there is the third option of kicking the dumbass art *** who knows nothing of how a website actually works in the nerts and telling them to bugger off.
Though that often doesn't go over well; Even if it IS the correct course of action in most cases.
In this particular case looking at the greatly reduced picture, I'm not seeing any real deal-breakers in that regard though. This could easily be turned into a real site with nothing truly horrid about it... apart from the redundancy between the top right menu and the horizontal menu -- or wasting time telling people "Website Menu" as if they are too stupid to know what that is. (I swear that's getting outright insulting these days)
Simply "turning it into CSS" isn't the whole picture - As I've said time and time again CSS is only as good as the markup it is applied to... so the first step is to get some semantic markup with some sensible section divers on it.
When writing said markup you generally need to forget that the appearance even exists when choosing the primary tag, and ask yourself "what is this element?" -- then you can add the extra bits to apply similar styling, or if need be a hook/sandbag (empty tag) for image-replacement methods like on a site logo.
<small>Free Photoshop Tutorial & Resources</small>
<li class="last"><a href="contact">Contact</a></li>
pageWrapper would be used to constrain the width so you only really have to say the target width once, the h1 is because that's the top-most heading, the span and small tags being to apply similar styling to the image logo for when images are disabled (a concept most PSD whackjobs never even think of), and the empty B tag being to place the image version of the logo over the text gilder-levin style.
Menus are always LI. I would float the menu right and use a negative margin to slide it up next to/over the h1. This removes the need to dick with floats on the h1 or to waste code on an extra container. The .last class I'd use to apply the rounded corner on that side so that the hover state would also be rounded.
The other reason for this approach is I'd be designing for fluid or semi-fluid, which makes that banner/palette image a really bad idea in the site layout... Which is part of why the "drawing a goofy picture" approach is completely broken.
Frankly, with that much 'content' already laid out before you even have markup, the pooch has already been shtupped, and you'll end up making all sorts of accessibility sacrifices to support it.