Rozwijane menu - kolor i rozmiar nie zmieniają się

Witam, jako ze jestem nowy to chcialbym wszystkich powitac :)
Mysle ze zostane tu na dluzej a samo programowanie nie znudzi mi sie tak szybko :P ale do rzeczy...

Pisze menu oparte na tym tutorialu: http://kodcss.pl/kurs-css/lekcje/dzial-4/dwupoziomowe-rozwijane-menu-css

no i poleglem w punkcie, w ktorym trzeba dodac selektory

#menu > li > ul > li > ol 
{
  width:150%;
}

#menu > li > ul > li > ol > li 
{
  background-color:#CCC;
}

zrobilem jak trzeba, ale kolor mi sie nie zmienia, tak samo rozmiar, powinien wynosic 150%
kombinuje od dluzszego czasu i nie moge do tego dojsc. Zrobilem plik style.css i podpiolem go do html ale bez zmian.
Pomozcie bo juz nie mam pomyslow

Zamieszczam link do calego kodu: http://wklej.to/dvt1X

dodanie znacznika <code class="css"> - @furious programming

w tym kodzie co podales to w nie masz przedrostka id (#) przy menu:

menu > li > ul > li > ol

i

menu > li > ul > li > ol >li

a i kod nie jest taki sam bo ol nie jest u ciebie zawarte w li a jest poza li i to css juz do niego nie ma zastosowania. (notabene normalne IDE, by ci zwrocilo na to uwage i podkreslilo ze tam amsz blad, tak samo brak hasha by zostalo zauwazone przez normalno srodowisko.

///EDIT

wiec zmien srodowisko. a jak mowie ze ol nie jest w li to mam na mysli to co mowie:

twoj kod:

**<li> <a href="###" > link 1 </a> </li>**<!-- tu sie zaczyna i KONCZY li -->
						**<ol>** <!-- a tu sie zaczyna ol-->
							<li> <a href="#"> dodany - 1</a> </li>
							<li> <a href="#"> dodany - 2</a> </li>
							<li> <a href="#"> dodany - 3</a> </li>
						</ol>

widzisz ze ol jest poza li, a style o beda dzialac gdy bedzie w srodku :)