Support for multilanguage sites, Internationalization (I18N)

[xxdex]

can some one help how to change in I18N i18n_navigation

to create a submenu with arrows when is a submenu

i have a css for multi level menu in html

look at this:
this is a html file

PHP Code:

<ul id="mainmenu">
    <li><a href="#">Home page</a></li>
    <li><a href="#">Information<i class="arrow"></i></a>
        <ul>
            <li><a href="#">Welcome level #2</a></li>
            <li><a href="#">Welcome level  #2</a></li>
            <li><a href="#">Welcome level  #2</a></li>
        </ul>
    </li>
    <li><a href="#">Gallery <i class="arrow"></i></a>
        <ul>
            <li><a href="#">Welcome level  #2</a></li>
            <li><a href="#">Welcome level  #3 <i class="arrow"></i></a>
                <ul>
                    <li><a href="#">Welcome level  #3</a></li>
                </ul>
            </li>
            <li><a href="#">Welcome level  #2</a></li>
        </ul>
    </li>
</ul> 


the css file is look like:

PHP Code:

#mainmenu, #mainmenu ul {list-style: none; margin: 0; padding: 0;}
#mainmenu ul {width: 160px;}
#mainmenu ul li {clear: both;}
#mainmenu > li {float: left; margin-right: 10px; position: relative;}
#mainmenu > li li {position: relative;}
#mainmenu > li ul {position: absolute; left: 0;}
#mainmenu > li ul li ul {position: absolute; left: 160px; top: 0px;}
ul ul {display: none;}[/code]
ul li:hover > ul {display: block;}

/*level 1*/
#mainmenu {margin: 50px 50px; font-family: calibri; tahoma, arial;}
#mainmenu > li > a {display: table; width: auto; padding: 8px; border-radius: 3px; text-align: center; text-decoration: none; color: #84c5f7;}
#mainmenu > li:hover > a {background: #eee; color: #0090ff;}

/*level next*/
#mainmenu ul {font-size: 12px; border-radius: 3px; background: #eee;}
#mainmenu ul li > a {color: #999; display: block; padding: 5px; border-radius: 3px; text-decoration: none;}
#mainmenu ul li:hover > a {color: #eee; background: #aaa;}

.arrow {display: inline-block; margin: 0 5px 0; height: 0; vertical-align: top; content: ""; position: absolute;}
#mainmenu > li > a > .arrow {top: 17px; right: 0; margin-right: -8px; border-top: 3px solid #333; border-right: 3px solid transparent; border-left: 3px solid transparent;}
ul ul .arrow {top: 10px; right: 0; border-top: 3px solid transparent; border-right: 3px solid transparent; border-left: 3px solid #333; border-bottom: 3px solid transparent;} 


i'm was a add this code for a getsimple page.. but how to enable a aroows ??

this multilevel menu is brilliant and simple ... but how to integrate it with arrows ?
can someone help?

this is the demo of full menu (found in google - in polish)
http://webroad.pl/poradnik/menu-wielopoziomowe/

----
the seccond questions:
how to give in menu in all of level menu different class or id?
i think about example:
i'm searching something like that.. to level menu one

PHP Code:

<li class="dir">About>
                <ul>
                    <li><a href="./">Menu Subitem #1</a></li>
                    <li><a href="./">Menu Subitem #2</a></li>
                    <li><a href="./">Menu Subitem #3</a></li>
                    <li><a href="./">Menu Subitem #4</a></li>
                </ul>
            </li> 


online previev example:
http://www.lwis.net/free-css-drop-down-m...ontal.html