Сделать CSS выпадающего меню 2 столбца

В настоящее время у меня есть раскрывающееся меню css

• , в котором используется следующий код. К сожалению, я хочу, чтобы подменю отображались в 2 столбца, поскольку в этом подменю около 16 элементов. Кто-нибудь знает, как использовать следующий код, чтобы сделать это выпадающее меню двумя столбцами?

  .menu{
      border:none;
      border:0px;
      margin:0px;
      padding:0px;
      font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
      font-size:18px;
      font-weight:bold;
  }
  .menu ul{
      background:#006633;
      height:35px;
      list-style:none;
      margin:0;
      padding:0;
  }
  .menu li{
      float:left;
      padding:0px;
  }
  .menu li a{
      background:#006633 url("../images/seperator.gif") bottom right no-repeat;
      color:#ffffff;
      display:block;
      font-weight:normal;
      line-height:35px;
      margin:0px;
      padding:0px 25px;
      text-align:center;
      text-decoration:none;
  }
  .menu li a:hover, .menu ul li:hover a{
      background: #003f20 url("../images/hover.gif") bottom center no-repeat;
      color:#FFFFFF;
      text-decoration:none;
  }
  .menu li ul{
      background:#006633;
      display:none;
      height:auto;
      padding:0px;
      margin:0px;
      border:0px;
      position:absolute;
      width:225px;
      z-index:200;
      /*top:1em;
      /*left:0;*/
  }
  .menu li:hover ul{
      display:block;
  }
  .menu li li {
      background:url('../images/sub_sep.gif') bottom left no-repeat;
      display:block;
      float:none;
      margin:0px;
      padding:0px;
      width:225px;
  }
  .menu li:hover li a{
      background:none;
  }
  .menu li ul a{
      display:block;
      height:30px;
      font-size:12px;
      font-style:normal;
      margin:0px;
      padding:0px 10px 0px 15px;
      text-align:left;
  }
  .menu li ul a:hover, .menu li ul li:hover a{
      background:#003f20 url('../images/hover_sub.gif') center left no-repeat;
      border:0px;
      color:#ffffff;
      text-decoration:none;
  }
  .menu p{
      clear:left;
  }