Menu não funciona no IE apenas no Firefox

senhores, tenho o seguinte menu que usa css, no firefox ele funciona perfeitamente porem no IE ele não funciona de jeito nenhum e não faço ideia do que possa ser, alguem pode me ajudar por favor ?

<style media="all" type="text/css">
 @import "menu/menu_style.css";
 </style>
 <div class="menu">
 <ul>
 <li><a href="index.php?page=meio" >Home</a></li>
 <li><a href="" target="_self" >Produtos</a>
 <ul>
 <li><a href="index.php?page=software">Software</a></li>
 <li><a href="index.php?page=hardware">Hardware</a></li>
 </ul>
 </li>
 <li><a href="index.php?page=servicos" >Serviços</a></li>
 <li><a href="index.php?page=suporte" >Suporte</a></li>
 <li><a href="index.php?page=email" >Email</a></li>
 <li><a href="index.php?page=contato" >Contato</a></li>
 <li><a href="" target="_self" ></a></li>
 </ul>
 </div>

o menu style.css segue abaixo

.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:14px;
	font-weight:bold;
	}

	background-image: url("IMAGES/SPACER.GIF");
	height:23px;
	list-style:none;
	margin:0;
	padding:0;
	}
	.menu li{
 float:left;
 padding:0px;
 }
	.menu li a{
 background-image: url("IMAGES/SPACER.GIF");
 color:#cccccc;
 display:block;
 font-weight:normal;
 line-height:23px;
 margin:0px;
 padding:0px 25px;
 text-align:center;
 text-decoration:none;
 }
 .menu li a:hover, .menu ul li:hover a{
 background: url("images/hover.gif") bottom center no-repeat;
 color:#FFFFFF;
 text-decoration:none;
 }
	.menu li ul{
 background:#8FBEE8;
 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:23px;
 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: url('images/hover_sub.gif') center left no-repeat;
 border:0px;
 color:#ffffff;
 text-decoration:none;
 }
	.menu p{
 clear:left;
 }