Trying to add flags to Xili-language plugin – doesn't work

Hi,

I am trying to add flags to my menu using the xili-language plugin…

website is: https://www.birdwatchingsouthcostarica.com

So far the language names show up, but whenever I add the following css code into the stylesheet, nothing shows up.

/* some few modifications for xili-language list */
ul.xililanguagelist {list-style: none !important ; margin-left:0 !important ;}

/* example in header menu if filter xiliml_infunc_language_list is on*/

ul.menu li.lang-en_us a {background: transparent url(images/flags/en_us.png) no-repeat center 13px;}
ul.menu li.lang-de_de a {background: transparent url(images/flags/de_de.png) no-repeat center 13px;}
ul.menu li.lang-es_es a {background: transparent url(images/flags/es_es.png) no-repeat center 13px;}

li.lang-en_us:hover > a {background:  #333 url(images/flags/en_us.png) no-repeat center 13px !important;}
li.lang-de_de:hover > a {background:  #333 url(images/flags/de_de.png) no-repeat center 13px !important;}
li.lang-es_es:hover > a {background:  #333 url(images/flags/es_es.png) no-repeat center 13px !important;}

ul.menu li.lang-en_us, ul.menu li.lang-de_de, ul.menu li.lang-es_es {text-indent:-9999px; width:18px;}

What am I doing wrong? I am sorry, I’m a newbie with css and php, so please explain to me if there is anything I need to change/add…

Janina