[HTML][CSS] Rodzic wpływający na zachowanie potomka Opcje

[matwiej]

Mam taki oto kod.

[HTML] pobierz, plaintext 
 <nav> 
			<ul>
				<li><div class=kropka></div>Oferta</li>
				<li><div class=kropka></div>Galeria</li>
				<li><div class=kropka></div>Kontakt</li>
			</ul>
		</nav>
[HTML] pobierz, plaintext 

Chciałbym zrobić tak że gdy najadę na element listy <li>. Zaszła reakcja w divie np

[HTML] pobierz, plaintext 
ul li .kropka:hover{
background: red;
}
[HTML] pobierz, plaintext 

Inaczej mówiąc chciałbym aby po najechaniu na napis np oferta kropka zmieniła swój kolor.
Tutaj jeszcze css kropki.

[HTML] pobierz, plaintext 
.kropka{
height:15px;
width:15px;
background: #a8a2a2;
position: absolute;
margin: 10px 0 0 -25px;
}
[HTML] pobierz, plaintext 

Czy istnieje możliwość zrobienia tego za pomocą html/css ?
Czy wyłącznie JS ?