Animierte schrift im Menü

Nachdem ich heute schon soooviel dazugelernt habe und echt eine tolle Lösung bekommen habe, versuche ich es mit dieser Frage auch.
Ich habe vor kurzem (leider weis ich nicht mehr wo) ein X5 Template gesehen, wo die Schrift beim Mneü nach unten gesprungen ist (Mouseover effekt)

Ich finde leider keine Einstellung und sonst leider auch nichts.

Was will ich haben:
6 Menüpunkte Home,über mich,...
diese sollen ohne Hintergrund sein
Schriftfarbe grau und wenn man mit der Mouse darüberfährt versetzt es die Schrit um ca 5-10 Pixel nach rechts unten

Ich würde das gerne bei meinem neuen Projekt einbauen und weis nicht wie...

Kann mir jemand helfen?
Danke
LG Tino

Ja aber ohne Button brauche nur die Schrift die in einem horizontalen Menü quasi nach unten swicht

Der Code gehört unter Hauptmenü in das Kästchen HTML Code??
Sorry aber das ist noch Neuland für mich

Danke für den code
ABER
Der schreibt das oben als erstes auf die seite
Ich habe es unter seo dann auf erweitert
im ersten Feld oben bei 1 reinkopiert
dann gespeichert
dann ok
dann vorschau

Hallo Andy

Hab das jetzt mit den Klammern alles in einer Reihe eingefügt Also sieht es im Programm so aus:
Option SEO und Code
Karte erweitert
Benuzerdefinierter Code
Dropdown steht vor dem Tag
1: <style>#imMnMn.main-menu li:hover {padding-down: 10px;}</style>

Der Code ist zwar nicht sichtbar aber auch funktionslos... (in der Vorschau)

Oder muss ich die Seite im Netz haben um eine Funktion zu sehen?

Alternativ würde mich ein Unterstrichenes Menü auch gefallen.... (falls das leichter ist)
Danke
lg tino