absolute and relative positioning of div's

Hello,

I'd like to position a div wrapper.

http://www.michaelwalz.org/eng/jazz-n-cheers please. I placed the skyline image as kind of a header and want the wordpress page content to start below the image.

I thought I throw the page content into a wrapper and adjust the wrapper's positioned accordingly. The skyline image is not coded in the page content since it belongs to the customized template page.

However, I wasn't able to move the text down. It would be nice if someone had a look at the source code.

In wordpress page:

<style type="text/css">
wrapper {
top: 680px;
right: 200px;
position: absolute;
}
</style>

<div class="wrapper">
<div class="soundcloudholder">
<h3>Darn That Dream (Live)</h3>
<iframe src="https://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F89601556%3Fsecret_token%3Ds-iXbv4&color=121aab&auto_play=true&show_comments=false&show_artwork=false&show_playcount=false&show_user=false" height="60" width="60" frameborder="no" scrolling="no"> </iframe>
</div>

<div class="textPageContent">
<p>Jazz Standards and own compositions from Bebop to Fusion, from Latin to World music Michael Walz and band perform concerts for private and corporate events. Jazz ‘n’ Cheers!, as the name implies, is Jazz music that suits your festivity.</p>

<img src="http://www.michaelwalz.org/eng/wp-content/uploads/2013/04/Acoustic-Guitar-300x199.jpg" alt="Michael Walz playing Nylon String Guitar" width="300" height="199" class="alignright size-medium wp-image-1501" />
</div>

</div>

Thanks,
mikkolaus