I have the following code, but for some reason the text that I want to display in the footer displays under the images that I have there, how do I get the text to show up ontop of all the images?

CSS
Code:
#footer {
	margin : 0 -10px 0 -8.5px;
	width: 100%;
	background : url('FooterBorder.gif') repeat-x;
	height : 36px;
	position: absolute;
	
}

#footer p{
    margin : -36px;
    text-align : center;
	color: #003466;
	font-family: Corbel,sans-serif;
	font-style: oblique;
	border: medium double rgb(250,0,255);
}

#rbtop div { background: url(TopLeft.gif) no-repeat top left; }
#rbtop { background: url(TopRight.gif) no-repeat top right; }
#rbbot div { background: url(BottomLeft.gif) no-repeat bottom left; }
#rbbot { background: url(BottomRight.gif) no-repeat bottom right; }

#rbtop div, .rbtop {
height: 20px;
font-size: 1px;

}
#rbbot div, .rbbot {
height: 36px;
font-size: 1px;
}
HTML
Code:
<div id="footer">
	<div id="rbbot"><div></div></div></div>
	<p>Copyright &copy; 2008 - All Rights Reserved	</p>
	</div>
			
        </div>