Numele gradului din care face parte respectivu membru cand pui sageata pe el

Imagine: https://i.imgur.com/flxP7oW.png
Cum arata in imagine si titlul, cred ca va-ti dat seama!
Cand pui sageata pe numele unui membru din staff, sa ii apara deasupra intr-un chenar cu respectiva culoare care face parte din grad-ul respcetiv, text-ul: Moderator forumx.
De exemplu: pun sageata pe Admin si deasupra lui cu rosu imi apare Admin Forumgratuit.ro
Cum pot face acest lucru si eu?

Buna ziua,
Vizitati: Panoul de administrare => Afisare => Culori => Foaia de stil CSS si adaugati:

Cod:

a span[style="color:#FF4400"] strong {
position: relative;
}
a span[style="color:#FF4400"] strong:hover:after {
background-color:#FF4400;
content: "Administrator";
border-radius:5px;
font-weight:bold;
font-size:10px;
padding:2px;
color:#fff;
position:absolute;
top:15px;
right:0;
display:inline-block;
white-space:nowrap;
z-index:1;
margin:-35px;
}


a span[style="color:#5BAB33"] strong {
position: relative;
}
a span[style="color:#5BAB33"] strong:hover:after {
background-color:#5BAB33;
content: "Moderator";
border-radius:5px;
font-weight:bold;
font-size:10px;
padding:2px;
color:#fff;
position:absolute;
top:15px;
right:0;
display:inline-block;
white-space:nowrap;
z-index:1;
margin:-35px;
}

a span[style="color:#A80094"] strong {
position: relative;
}
a span[style="color:#A80094"] strong:hover:after {
background-color:#A80094;
content: "Asistent";
border-radius:5px;
font-weight:bold;
font-size:10px;
padding:2px;
color:#fff;
position:absolute;
top:15px;
right:0;
display:inline-block;
white-space:nowrap;
z-index:1;
margin:-35px;
}

a span[style="color:#D60056"] strong {
position: relative;
}
a span[style="color:#D60056"] strong:hover:after {
background-color:#D60056;
content: "Designer";
border-radius:5px;
font-weight:bold;
font-size:10px;
padding:2px;
color:#fff;
position:absolute;
top:15px;
right:0;
display:inline-block;
white-space:nowrap;
z-index:1;
margin:-35px;
}

a span[style="color:#007BFF"] strong {
position: relative;
}
a span[style="color:#007BFF"] strong:hover:after {
background-color:#007BFF;
content: "Analist";
border-radius:5px;
font-weight:bold;
font-size:10px;
padding:2px;
color:#fff;
position:absolute;
top:15px;
right:0;
display:inline-block;
white-space:nowrap;
z-index:1;
margin:-35px;
}

a span[style="color:#00678C"] strong {
position: relative;
}
a span[style="color:#00678C"] strong:hover:after {
background-color:#00678C;
content: "Membru";
border-radius:5px;
font-weight:bold;
font-size:10px;
padding:2px;
color:#fff;
position:absolute;
top:15px;
right:0;
display:inline-block;
white-space:nowrap;
z-index:1;
margin:-35px;
}

Multumesc.
Solved.