#wrapper-menu-top,  {
    width: 85%;
    margin: 0 auto;
    text-align: left;
  }


#wrapper-menu-top {
    background: white url('..//image/bg02-white-left.png') no-repeat left top;
  }


#menu-top {
    background: transparent url('..//image/bg02-white-right.png') no-repeat right top;
    overflow: hidden;
    /* no idea why this works, but it fixes a FF problem */;
  }


#menu-top ul {
    margin: 0 20px;
    padding: 1em 0 0 0;
    list-style: none;
    font-size: 85%;
    float: left;
  }


#menu-top li {
    display: inline;
    float: left;
  }


#menu-top a {
    background-image : url('..//image/menuleft.png');
    background-position : left top;
    background-repeat : no-repeat;
    float : left;
    line-height : 1.5em;
    margin-bottom : 0;
    margin-left : 0;
    margin-right : 0;
    margin-top : 0;
    padding-bottom : 0;
    padding-left : 3px;
    padding-right : 0;
    padding-top : 0;
    text-decoration : none;
  }


#menu-top a span {
    background: transparent url('..//image/menuright.png') no-repeat right top;
    padding:5px 15px 4px 6px;
    color:#5b8fbe;
    display: block;
    float: left;
    cursor: pointer;
    /* IE doesnt display the hand when you roll over the link for some reason. This fixes it */;
  }


#menu-top a:hover {
    background-position:0% -42px;
  }


#menu-top a:hover span {
    background-position:100% -42px;
  }