Ready menu

<div id='menubor'/><center><ul id='menu'>
      <li><a class='hmlink' href='/'>Home Page</a></li>
<li><a class='winlink' href='#' target='_blank'>Menu 1</a></li>
<li><a class='maclink' href='#' target='_blank'>Menu 2</a></li>
<li><a class='andlink' href='#' target='_blank'>Menu 3</a></li>
<li><a class='gamlink' href='#' target='_blank'>Menu 4</a></li>
<li><a class='seclink' href='#' target='_blank'>Menu 5</a></li>
<li><a class='linlink' href='#' target='_blank'>Menu 5</a></li>
</ul></center>
<style>
#menu li {             
 display: inline;             
 list-style: none;             
 padding: 0;         
 }                 

 #menu li a {                               
 padding: 15px 20px 15px 20px;             
 text-decoration: none;             
  color:black;
  font-family: &#39;Noto Serif&#39;, serif;
-moz-box-shadow: inset 0 0 13px -2px #000;
-webkit-box-shadow: inset 0 0 13px -2px #000;
box-shadow: inset 0 0 13px -2px #000;
  font-size:18px;
  -webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
  transition: padding-bottom .666s;
-webkit-transition: padding-bottom .666s;
-moz-transition: padding-bottom .666s;
-o-transition: padding-bottom .666s;
-ms-transition: padding-bottom .666s;
 
 
}
 #menu li a:hover {                               

  padding-bottom:20px;
}
.hmlink{
  background:#999999;
}
.winlink{
  background-color: rgba(153, 153, 153,1);
}
.maclink{
  background-color: rgba(153, 153, 153,1);
}
  .weblink{
    background:#EEEE00;
    color:black;
  }
.andlink{
  background-color: rgba(153, 153, 153,1);
}
.gamlink{
  background-color: rgba(153, 153, 153,1);
}
.seclink{
  background-color: rgba(153, 153, 153,1);
}
.linlink{
  background-color: rgb(153, 153, 153);
}
#menubor{
  border-top:1px solid black;
  margin-bottom:-1px;
}
  .header-outer{
    padding-bottom:20px;
  }
</style>