Submenus won't display on siteground-j16-44

[mlcdigital]

I've created the category Boards with subcategories Selectmen, Planning, and Zoning.
The module is setup to show all submenus.
The code is showing up.

<div class="top-menu">
<div id="sgmenu">

<ul class="menu">
<li id="item-101" class="current active"><a href="/" ><span>Home</span></a></li><li id="item-102" class="parent"><a href="/index.php/boards" ><span>Boards</span></a><ul><li id="item-103"><a href="/index.php/boards/board-of-selectmen" ><span>Board of Selectmen</span></a></li><li id="item-104"><a href="/index.php/boards/planning-board" ><span>Planning Board</span></a></li><li id="item-105"><a href="/index.php/boards/zoning-board" ><span>Zoning Board</span></a></li></ul></li></ul>
</div>
</div>

The CSS is all there too but the submenus aren't dropping down...?

[Hristo.P]

Hi,

Could you paste the url of the website with that menu published? I will then check it and try to assist you further

[mlcdigital]

Thank you...
http://setup.mlcdigital.com/

[Hristo.P]

Hi,

Remove the following line (212) from your template.css file. Then, the submenus will be displayed and you will be able to style them as per your needs

#sgmenu ul li ul {
visibility: hidden;
}

[mlcdigital]

When I did that the attached image is what happend, without mouseovering.

Here's the sgmenu section of the CSS.

#sgmenu ul.menu:after {clear: both;content: "";display: block; }
#sgmenu ul.menu {float: right; }
#sgmenu ul li {float: left;margin: 0 10px 0 0;position: relative; }
#sgmenu ul li a {background-image: -moz-linear-gradient(center bottom , #D4D3D6 27%, #DFDDDF 64%, #ECEBEB 82%);
border-radius: 5px 5px 5px 5px;
box-shadow: 0 -1px 1px #696969; }
#sgmenu ul li ul {position: absolute;visibility: hidden; }
#sgmenu ul li ul li {float: none; }
#sgmenu ul li ul li a {width: auto; }
#sgmenu ul li ul {background: #fff;margin-top: 30px;z-index: 500; }
#sgmenu ul.menu li ul li a, #sgmenu ul.menu li ul li a:link, #sgmenu ul.menu li ul li a:visited {background: #fff; }
#sgmenu ul.menu li ul li a span {padding: 0 10px; }
#sgmenu ul.menu li ul li a:hover span {color: #000; }
#sgmenu ul.menu li a, #sgmenu ul.menu li a:link, #sgmenu ul.menu li a:visited {color: #404041;cursor: pointer;display: block;float: left;font-family: Arial, Times New Roman;font-size: 14px;font-weight: 400;height: 30px;line-height: 30px;margin: 0;padding: 0 10px; }
#sgmenu ul.menu li a:hover, #sgmenu ul.menu li.active a {background: none repeat scroll 0 0 #E4E4E4;
border-radius: 5px 5px 5px 5px;
box-shadow: 0 -1px 1px #696969; }