I have a pre-code page coded as follows:

    <div id="linearBg">
            <div id="wrapper">
                    <div class="logo"></div>
                    <div class="navigation"></div>
                    <div class="video"></div> 
                    <div class="content"></div>
            </div>
    </div>

Where linearBg is a gradient background, the back board of the website. Wrapper is the container for the inner div's, and the rest are content oriented.

So i've already implemented this with styles and all sorts, but the thing is I want to add:

<div class="watermark"></div>

underneath/behind both the content and video div, sort of like a reverse watermark,

I've tried z-indexing but i'm not an expert. Could you guide me on to do make this possible?

Thanks in advance