title: HTML Wordpress Menu - hover removes text?
body: <p>I have developed a website in wordpress, using a theme called - the restaurant. 
  For some reason the Menu is misbehaving and the client cannot view it. </p>
  
  <p>It think the problem is something to do with the rollover bit, as you can see from the image below this is the problem. </p>
  
  <p><a href="http://i40.tinypic.com/1z6dpja.jpg" rel="nofollow">http://i40.tinypic.com/1z6dpja.jpg</a></p>
  
  <p>Weird thing is it is working on all my browsers. </p>
  
  <p>Any suggestions. x</p>
  
  <pre><code>/* begin ---------------------------------------- menu */
  
  
   #mainmenu {
  position: absolute;
  z-index: 10;
  top: 81px;
  width: 100%;
  }
  
   #mainmenu .wrapper {
  position: relative;
  width: 990px;
   }
   #menu-bg {
  width: 990px;
  height: 53px;
  display: inline-block;
  background: url('images/menu_bg.png') no-repeat;
   }
  
  #menu-left {
  position: absolute;
  top: 4px;
  left: 0px;
  height: 15px;
  width: 15px;
  background-image: url(images/menu_left.png);
  background-repeat: no-repeat;
   }
  
  #menu-right {
  position: absolute;
  top: 4px;
  right: 0px;
  height: 15px;
  width: 15px;
  background-image: url(images/menu_right.png);
  background-repeat: no-repeat;
   }
  
   #menu-container {
  position: absolute;
  top: 4px;
  left: 15px;
  width: 960px;
  height: 43px;
  display: inline-block;
  background: url('images/patern_sharp.png');
  float: left;
  border-top: #000 1px solid;
  border-bottom: 1px solid;
   }
  
  #mainmenu ul.menu {
  position: absolute;
  top: 0px;
  left: 150px;
   }
  
  #mainmenu .dropdown_arrow {
  height: 0px;
  width: 0px;
  position: absolute;
  top: 19px;
  right: 10px;
  border-color: #fff transparent transparent transparent;
  border-style: solid;
  border-width: 5px;
   }
  
   #mainmenu ul.menu li.has-sub-menu:hover .dropdown_arrow, #mainmenu ul.menu li.has-sub-     
  
   menu.current-menu-item .dropdown_arrow, #mainmenu ul.menu li.has-sub-menu.current-
   menu-   parent .dropdown_arrow {
  top: 21px;
   }
  
  #mainmenu ul.menu li {
  float: left;
  font-size: 14px;
  padding: 15px;
  margin: 0 3px;
  display: inline-block;
  position: relative;
   }
  
   #mainmenu ul.menu li.has-sub-menu {
  padding-right: 30px;
  }
  
  #mainmenu ul.menu li a {
  color: #fff;
  }
  
   #mainmenu ul.menu li:hover, #mainmenu ul.menu li.current-menu-item, #mainmenu ul.menu  
   li.current-menu-parent{
  background: #fff;
  padding: 17px 14px 18px 14px;
  margin: -3px 3px 0 3px;
  border-top: #dedede 1px solid;
  border-right: #dedede 1px solid;
  border-left: #dedede 1px solid;
   }
  
  #mainmenu ul.menu li.has-sub-menu:hover, #mainmenu ul.menu li.has-sub-menu.current-  
   menu-item, #mainmenu ul.menu li.has-sub-menu.current-menu-parent {
  padding-right: 29px;
   }
  
   #mainmenu ul.menu li.has-sub-menu:hover {
  padding-bottom: 24px;
   }
  
   #mainmenu ul.menu li ul.sub-menu {
  position: absolute;
  width: auto;
  top: 55px;  left: -1px;
  background: #fff;
  display: none;
  padding: 10px 0;
  border-right: #dedede 1px solid;
  6border-bottom: #dedede 1px solid;
  border-left: #dedede 1px solid;
    }
  
   #mainmenu ul.menu li:hover ul.sub-menu {
  display: inline-block;
    }
  
   #mainmenu ul.menu li ul.sub-menu li {
  clear: both;
  height: auto;
  width: 200px;
  padding: 10px 15px;
  margin: 0;
  border: 0;
  display: block;
    }
  
  #mainmenu ul.menu li ul.sub-menu li.current-menu-item, #mainmenu ul.menu li ul.sub-menu        
   li:hover {
  padding: 10px 15px;
  margin: 0;
  border: 0;
  background: #eee;
   }
  
  #mainmenu ul.menu li:hover ul.sub-menu li a, #mainmenu ul.menu li ul.sub-menu li a {
  padding: 0 10px 0 0;
  display: block;
  font-size: 13px;
  height: auto;
   }
  
  #mainmenu ul.menu li a:hover, #mainmenu ul.menu li ul.sub-menu li a:hover {
  text-decoration: none;
   }
  </code></pre>
  
  <p>/* end ---------------------------------------- menu */</p>