Problem with menu

Question

When passing with the cursor over this one it turns blue and wanted it to stay blue while I was with the cursor over the submenu

code:

	menu
	{ 
		padding-left: 0;
		display: inline-block;
		padding: 5;
		margin: 0;
		text-align:center;
	}

	menu ul
	{
		padding: 0;
		margin: 0;
	}

	menu li
	{
		float:left;
	}

	menu li a, #menu li span
	{
		display: inline-block;
		padding: 1em 1.5em 1em 1.5em;
		letter-spacing: 0.10em;
		text-decoration: none;
		font-size: 1.2em;
		text-transform: uppercase;
		outline: 0;
		color: #FFF;
	}
	menu li a:hover
	{
		color: dodgerblue;
	}
	menu li a:hover
	{
		color: dodgerblue;
	}
	menu li ul li 
	{
		color: dodgerblue;
	}

	menu li:hover
	{
		color: dodgerblue;
		background:white;      
	}
	menu li ul
	{
		display: none;  
	}
	menu li:hover ul{
		display: block;
		position:absolute;
		z-index:20;
		color: dodgerblue;
	} 
	menu li ul
	{
		color: dodgerblue;
	}
	menu li:hover li{
		float:none;
	}
	menu li ul li{
		display:block;
		background: black;
	}

<ul>
  <li><a href="?op=5" accesskey="5" title="">Sobre</a></li>
  <li><a href="?op=1" accesskey="2" title="">Convocatórias</a></li>
  <li><a href="?op=2" accesskey="3" title="">Atas</a></li>
  <li><a href='?op=6' accesskey='5' title=''>+ Utilizador</a></li> 
  <li><a href="logout.php">Sessao</a>
    <ul  style="text-decoration: none;float:none;width:120px">
      <li><a href="#" style=" background: black; width: 120px;text-decoration: none;">Informacao</a></li>
      <li><a href="#" style="background: black;width: 120px;text-decoration: none;">Definicões</a></li>
      <li><a href="logout.php" style="background: black;width: 120px;text-decoration: none;">Terminar</a></li>
    </ul>
  </li>
</ul>