<style>  
  .topnav {  
  width: 213px;  
  padding: 40px 28px 25px 0;  
  font-family: "CenturyGothicRegular", "Century Gothic", Arial, Helvetica, sans-serif;  
  }  

  ul.topnav {  
  padding: 0;  
  margin: 0;  
  font-size: 1em;  
  line-height: 0.5em;  
  list-style: none;  
  }  

  ul.topnav li {}  

  ul.topnav li a {  
  line-height: 10px;  
  font-size: 11px;  
  padding: 10px 5px;  
  color: #000;  
  display: block;  
  text-decoration: none;  
  font-weight: bolder;  
  }  

  ul.topnav li a:hover {  
  background-color:#675C7C;  
  color:white;  
  }  

  ul.topnav ul {  
  margin: 0;  
  padding: 0;  
  display: none;  
  }  

  ul.topnav ul li {  
  margin: 0;  
  padding: 0;  
  clear: both;  
  }  

  ul.topnav ul li a {  
  padding-left: 20px;  
  font-size: 10px;  
  font-weight: normal;  
  outline:0;  
  }  

  ul.topnav ul li a:hover {  
  background-color:#D3C99C;  
  color:#675C7C;  
  }  

  ul.topnav ul ul li a {  
  color:silver;  
  padding-left: 40px;  
  }  

  ul.topnav ul ul li a:hover {  
  background-color:#D3CEB8;  
  color:#675C7C;  
  }  

  ul.topnav span{  
  float:right;  
  }  
  </style>  
  <script type="text/javascript" src="http://demo.gelesson.net/scriptbreaker-multiple-accordion-1.js"></script>  
  <script language="JavaScript">  

  $(document).ready(function() {  
  $(".topnav").accordion({  
  accordion:false,  
  speed: 500,  
  closedSign: '[+]',  
  openedSign: '[-]'  
  });  
  });  

  </script>  
   
  <ul class="topnav">  
  <li><a href="/">Home Page</a>  
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="/">Category</a>
  <li><a href="http://gelesson.net/">Meny By GeLesson.Net</a>
  <ul>  
   
  </ul>