CSS Menu Drop Shadow (IE) and Cross Browser Alignment Issues

Project Description:
I am experiencing some issues with a drop down menu which I have taken from aext.net/2009/08/perfect-sign-in-dropdown-box-likes-twitter-with-jquery/ and adjusted to incorporate a second drop down menu which can be seen at lyyk.com/main.html. In addition to this I have added a -webkit-box-shadow and -moz-box-shadow and attempted to implement progid:DXImageTransform.Microsoft.Shadow for IE. I am having problems with 2 areas which are the shadow and the alignment of the drop down menu.

Design Code and Demo

I have uploaded the demo to lyyk.com/main.html and the code is all within the source file of this.

1. Drop Shadow

The shadow works exactly as intended in Firefox/Chrome & Safari but I am having problems with the drop shadow in Internet Explorer. The actual drop down menu shadow works fine in IE but the header drop shadow doesn't work which I have added to #menu a.menu-open. (See attachment image)

2. Drop Menu Alignment

I have experienced some problems in certain browsers with the positioning of the drop down menu and was wondering if anyone could also help with this. The menu works perfectly in Firefox and Google Chrome but has minor alignment issues in other browsers which I have outlined in the attached picture which shows various browsers and the alignment problems.

I am looking for someone to check the code and see if it is missing anything that would fix this and not require going down the CSS Hack route?

Many thanks in advance