/* Centered menu */
#centeredmenu {
   float:left;
   width:100%;
   /*background:#fff;*/
   /*border-bottom:4px solid #000;*/
   margin-bottom:10px;
   overflow:hidden;
   position:relative;
}
#centeredmenu ul {
   clear:left;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   left:50%;
   text-align:center;
}
#centeredmenu ul li {
   display:block;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   right:50%;
}
#centeredmenu ul li a, ul.horizontal li a {
   display:block;
   border:1px solid #BCBAAC;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;   
   /*margin:0 0 0 2px;*/
   padding:3px 10px;
   background:#ddd;
   color:#000;
   text-decoration:none;
   line-height:1.3em;
}
#centeredmenu ul li a:hover, ul.horizontal li a:hover {
   background:#369;
   color:#fff;
   background:#fff;
   color:#000;
}

#centeredmenu ul li a.active,
#centeredmenu ul li a.active:hover {
   color:#fff;
   background:#000;
   font-weight:bold;
}

ul.horizontal,.horizontal ul {  
    list-style:none;  
    width:160px; /* this is the width of the ul, change here as per your requirement*/  
}  
ul.horizontal li {  
    display:inline;  
    border:none 0px;  
    float:left;  
    padding:2px;  
    width:160px; /* this is the width of the each li, change it if your text is too long*/  
    text-align:center;  
    }