Position Fixed Doesn't Work

Position Fixed Doesn't Work

I want to make my topmenu stay on fixed position. I know i have to use
position:fixed property but it doesnt work. Seems like after i put
position:fixed top:0 on id topmenu it's overlapping with my below content.
here i put my code here is my site desawisataserang.com
HTML
<div id="topmenu">
<ul class="menu">
<li class="item-464 active"></li></ul>
<div id="search">
<div class="search">
</div>
</div>
</div>
CSS
#topmenu {
margin: auto;
width: 1000px;
padding-left: 0px;
font-family: :"Segoe UI", "Segoe WP", "Helvetica Neue", 'RobotoRegular',
sans-serif; font-weight: 400;
font-size: 1.2em;
color: #fff;
background-color: #c02929;
overflow: auto;
}
#topmenu ul {
float: left;
padding: 18px;
padding-top: 0px;
padding-bottom: 0px;
margin: 0;
list-style: none;
background-color: #c02929;
}
#topmenu a {
display: block;
color: #fff;
padding-top: 14px;
padding-bottom: 14px;
padding-left: 24px;
padding-right: 24px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: 0px;
text-decoration:none;
text-transform: uppercase;
}
#topmenu a:hover {
color: #000;
text-decoration: none;
display:block;
background-color:#525252;
}
#topmenu li {
float: left;
}
#topmenu li:first-child {
border-left: 0px solid #000000;
}