creare una classe per un solo elemento <li>

[blur]

ciao

ho un menu espandibile in css/javascript

<ul id="menu">

  [*]Menu Item 1
    
Sub Item 1.1
Sub Item 1.2
Sub Item 1.3
  [*]Menu Item 2
    
Sub Item 2.1
Sub Item 2.2
Sub Item 2.3
  [/list]

e vorrei cambiare il line-height dei titoli di menu Menu item xx

ho provato a creare una classe .titolo {line height: 25px } e applicarla al[*]Menu Item, ma nno funziona. Ho provato a creare una classe perchè altrimenti la proprietà si estenderebbe anche alle voci di menu e non va bene.

il file css:

ul#menu {
  width: 179px;
  list-style-type: none;
  border-top: solid 1px #7EA4D8;
  margin: 0;
  padding: 0;
}

ul#menu ol {
  display: none;
  text-align: right;
  list-style-type: none;
  margin: 0;
  padding: 5px;
}

ul#menu li, 
  ul#menu a {
  font-family: verdana, sans-serif;
  font-size: 11px;
  color: #785a3c;
}

ul#menu li { padding-left:5px;
  border-bottom: solid 1px #7EA4D8;
  line-height: 15px;
}

ul#menu ol li {
  border-bottom: none;
  color:blue;
}

ul#menu ol li:before {
  content: "-> ";
}

ul#menu a {
  text-decoration: none;
  outline: none;
}

ul#menu a:hover {
  color: #539dbc;
}

ul#menu a.active {
  color: #be5028;
}

.titolo {line height: 25px }