CSS Divs overlapping, how do I force one above the other?

I'm new to CSS and trying to build my site. I'm coming across a problem. I've created a div with a fixed position, however it is appearing below other elements on the site. How do I force it to the top?

div#floater {
    position: fixed; 
    top: 420px; 
    left: -110px;   
}

div#floater:hover {
    left: 0;

The site can be found at goinnativerecords.com (hover over the images to the side). I know my coding isn't the cleanest (tips are appreciated).

Thanks!