/* 
   Simple JQuery Collapsing menu.
   HTML structure to use:

   <ul id="menu">
     <li><a href="#">Sub menu heading</a>
     <ul>
       <li><a href="http://site.com/">Link</a></li>
       <li><a href="http://site.com/">Link</a></li>
       <li><a href="http://site.com/">Link</a></li>
       ...
       ...
     </ul>
     <li><a href="#">Sub menu heading</a>
     <ul>
       <li><a href="http://site.com/">Link</a></li>
       <li><a href="http://site.com/">Link</a></li>
       <li><a href="http://site.com/">Link</a></li>
       ...
       ...
     </ul>
     ...
     ...
   </ul>
*/

function initMenu() {
  $('#serviceList ul').hide();
  
   $('#serviceList li a').toggle(
      function () {
        $(this).css({"font-weight":"bold", "color":"#3399CC"});
      },
      function () {
        $(this).css({"font-weight":"normal", "color":""});
      }
    );
  
  $('#serviceList li a').click(
    function() {
        $(this).next().slideToggle('normal');
      }
    );
  }
$(document).ready(function() {initMenu();});