Site web + css : petit pb de Menu

Bonjour la compagnie...,

c'est remoi !!!!

Suis je venu vous souhaiter une bonne année ???
Je n'en suis pas sure, alors je me rattrape si ce n'est pas le cas...
Une bonne année à vous tous, une bonne santé pour vous et vos proches... et comme d'hab, plein d'internautes et d'handicapés du web ou de l'informatique comme moi, qui trouveront des solutions grace à vos réponses !!!

Alors voilà ce qui m'amène !!

Je suis en train de faire un petit site web (sans prétention...) pour un ami.
Je ne m'en sors pas trop mal, mais je n'arrive pas à obtenir un effet souhaité sur mon menu.

je m'explique : j'ai un menu gauche avec 7 items.
Chaque item est chargé avec une puce blanche... et affiche une puce marron et le texte en gras au survol de la souris.
Jusque là, tout va bien !!

L'effet que je cherche à obtenir est d'avoir la puce marron et le texte gras qui reste affiché lorsque l'on est sur la page appelée par l'item en question... (suis je claire ???)

Ben... je n'y arrive pas !!!!


Voici le code de ma feuille de style concernant le menu :

/* mesu gauche vertical */
div.menuGauche {
   padding: 20px 0 20px 0;
   margin: 20px 0 20px 0;
	line-height: 2.4;
	width: 170px;
	float: left;
} 
div.menuGauche ul {
	list-style-type:none;
}         
div.menuGauche li a {
	padding: 10px 0 10px 20px;
	font-family: arial;
	font-size: 12px;
	text-decoration: none;
	color:#663300;
	background: transparent url(monsite/picto/puce.gif) center left no-repeat;
}
div.menuGauche li a:link {
	color:#663300;
	font-weight:bold;
	background-image: url(monsite/picto/puce.gif);
}
div.menuGauche li a:visited {
	color:#663300;
	background-image: url(monsite/picto/puce.gif);
}
div.menuGauche li a:hover {
	color:#663300;
	font-weight:bold;
	background-image: url(monsite/picto/puce2.gif);
}
div.menuGauche li a:active {
	color:#663300;
	font-weight:bold;
	background-image: url(monsite/picto/puce2.gif);
}

et le code de ma page html

    <div class="menuGauche"> 
      <ul>
	     <li><a href="index.html">Accueil</a></li>
        <li><a href="portrait.html">Portrait</a></li>
        <li><a href="galerie.html">Galerie</a></li>
        <li><a href="boutique.html">Boutique</a></li>
        <li><a href="expos.html">Expos</a></li>
        <li><a href="liens.html">Liens</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
	</div>

Si quelqu'un a une idée, ce serait super.
Bon, l'effet attendu ne ferait qu'améliorer le rendu, ce n'est pas bloquant si je n'y arrive pas... mais en même temps, je progresserais un peu !!!

Merci à vous et bonne journée !