css dropdown menu very slow on windows mobile - windows

Question

I am having a very slow menu drop down experience on windows mobile only. it works ok on chrome and android pc's etc.
image of drop down, GREEN sub menu is very very slow to apper on windows mobile phones (only) you have to keep the logon pressed for at least 1.5 secs before sub menu appears. I would be grateful if somebody could look at the CSS code an see if I need to add / alter any of the settings in CSS
small piece of my nav code
<nav>
<ul id="main-nav" class="clearfix">
<li> Log in
<ul>
<li> Members area </li>
<li> Rythe Centre </li>
<li> Members Email IT Support</li>
</ul>
</li>
</nav>
#main-nav a {
font-size: 100%;
padding: 6px 5px 3px 3px;
margin: 0px;
}
#main-nav a:hover {
padding-right:20px;
}
#main-nav ul a {
padding: 6px;
height: 10px;
width: auto;
height: auto;
line-height: 1;
display: block;
white-space: nowrap;
float: none;
text-transform: none;
font-size: 100%;
background: #090;
}
#main-nav ul a:hover {
background: #000;
}
#main-nav ul ul li:first-child a:after {
position:absolute;
left: -8px;
}
#main-nav ul ul {
top: 0;
left: 90px;
}
#main-nav ul a {
width: auto;
}
#main-nav ul ul a {
background: #f90;

Answer 1

I eventually found the solution, in this post
4 novel ways to deal with sticky :hover effects on mobile devices..
http://www.javascriptkit.com/dhtmltutors/sticky-hover-issue-solutions.shtml
emphasized textCSS's venerable :hover pseudo class forms the backbone of many CSS effects, triggered when the mouse rolls over an element on the page. In today's changing landscape however where touch screen inputs share center stage with the mouse, this has presented a bit of a conundrum for webmasters. Touch based devices in an effort to not be left out in the cold with such a pervasive CSS feature do respond to hover, but in the only way that's possible for them, on "tap" versus an actual "hover". While this is overall a good thing, it leads to what's known as the "sticky hover" issue on these devices, where the :hover style stays with the element the user just tapped on until he/she taps again elsewhere in the document, or in some circumstances, reloads the page before the effect is dismissed.
I have used Method 4- Dynamically add or remove a "can-touch" class based on current user input type.
Good luck.
Mark