Submenu looks different on different browsers please help

Hi,
I’m using iNove theme and i set up my menu to display my categories. And some categories have sub categories and they are shown as drop down menu while pointing the mouse over the parent category.

i have problem with my dropdown menu for subcategories.
In Firefox, when i was pointing the mouse over the parent category, the dropdown was appearing “over” the main menu covering it, and it was causing navigation and surfing difficulties it wasn’t good look and i did “margin-top:25px;” to the #menus li ul {….} section. Now in Firefox it appears where it belongs but in Internet Explorer, Opera and Google Chrome it appears more below creating a distance with main menu.
What do i do to fix the problem?

my site at: https://guzelblogum.com

Here’s what submenu css look like:

/* submenu START */
#menus li ul {
display:none;
background:#ffffff;
border:solid #A6A6A6;
border-width:1px 1px 0;
line-height:0;
margin-top:25px;
position:absolute;
z-index:1;
}
#menus li li {
float:none;
margin:0;
padding:0;
list-style:none;
}
#menus li li a {
float:none;
padding:7px 18px 7px 10px;
text-decoration:none;
border-bottom:1px solid #DDD;
margin:0;
background-image:none;
height:auto;
line-height:125%;
color:#1d1d1d;
display:block;
width:120px;
}
#menus li li a.last {
border-color:#A6A6A6;
}
#menus li li a:hover,
#menus li li a.current {
background-color:#4e0101;
color:#ffffff;
}
#menus li li a.subtitle,
#menus li li a.subtitle:hover {
background-image:url(img/arrow.gif);
background-position:right;
background-repeat:no-repeat;
}
/* submenu END */