Adding stuff to the Amsterdam header

Hi Cargo, loving the use of your system, its awesome! Well done for all the hard work that has gone into this.

I'm trying to customise my website (http://www.portfelio.co.uk) by adding some social network buttons just above the nav in my header. However I've hit a bit of a snag as I'm not sure how to make the list stay relative to the header. First of all it by default it wants to go in the content area, so I have to enter negative values to position it in the header area! If theres a way to append it to the header area I think that would help!

My social network bar is currently in my custom html like this:


</script>
<ul id="social_buttons">
<li id="twitter_button">
<a href="http://www.twitter.com/portfelio" target=""> <img src="http://payload77.cargocollective.com/1/8/258525/3842443/twitterbutton_o.png"></a>
</li>
<li id="fbook_button">
<a href="http://www.facebook.com/portfelio" target=""> <img src="http://payload77.cargocollective.com/1/8/258525/3842443/fbookbutton_o.png"></a>
</li>
<li id="linkedin_button">
<a href="http://uk.linkedin.com/pub/felio-sotomayor/20/86b/a22" target=""> <img src="http://payload77.cargocollective.com/1/8/258525/3842443/linkedinbutton_o.png"></a>
</li>
<li id="bhance_button">
<a href="http://www.behance.net/portfelio" target=""> <img src="http://payload77.cargocollective.com/1/8/258525/3842443/behancebutton_o.png"></a>
</li>
</ul>


with corresponding CSS:

#social_buttons{
position: relative;
z-index:99999;
float:right;
list-style:none;
top:-166px;
left:-210px;
height:40px;


}

#social_buttons li{
float:right;
display: inline;
padding: 0px 5px 0px 5px;

}


any help would be greatly appreciated!! Thanks!!