span div {
    padding: 1px 7px;
    border-radius: 5px;
    display: inline;
    font-size: 18px;
    color: #fff;
    margin-right: 7px;
}

.majitel {
    background-color: #ed2c29;
}

.majitel::before {
    content: "Majitel";
}

.admin {
    background-color: #bc0402;
}

.admin::before {
    content: "Admin";
}

.manazer {
    background-color: #007fff;
}

.manazer::before {
    content: "Manažer";
}

.qa {
    background-color: #4f0754;
}

.qa::before {
    content: "QA";
}

.hmoderator {
    background-color: #75ff09;
}

.hmoderator::before {
    content: "H. Moderátor";
}

.emoderator {
    background-color: #197610;
}

.emoderator::before {
    content: "E. Moderátor";
}

.moderator {
    background-color: #34eb25;
}

.moderator::before {
    content: "Moderátor";
}

.zmoderator {
    background-color: #898989;
}

.zmoderator::before {
    content: "Z. Moderátor";
}

.hbuilder {
    background-color: #004aff;
}

.hbuilder::before {
    content: "H. Builder";
}

.ebuilder {
    background-color: #00c8ff;
}

.ebuilder::before {
    content: "E. Builder";
}

.builder {
    background-color: #15b7df;
}

.builder::before {
    content: "Builder";
}

.zbuilder {
    background-color: #898989;
}

.zbuilder::before {
    content: "Z. Builder";
}

.eventer {
    background-color: #4b2a87;
}

.eventer::before {
    content: "Eventer";
}