.user-rank {
    margin: 10px 0;
}

.user-rank .progress-bar {
    background: #ddd;
    border-radius: 5px;
    overflow: hidden;
    width: 100%;
    max-width: 300px;
    margin: auto;
}

.user-rank .progress-bar .progress {
    background: linear-gradient(90deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #8f00ff);
    background-size: 400% 100%;
    animation: rainbow 3s linear infinite;
    padding: 5px 0;
}

@keyframes rainbow {
    0% { background-position: 0% 50%; }
    100% { background-position: 100% 50%; }
}

.rank {
    font-weight: bold;
    display: inline-block;
    text-transform: uppercase;
}
.comment-rank {
    font-size: 12px;
    color: #888;
    display: block;
    margin-top: 5px;
}
.uk-comment-header img.avatar {
    width: 80px;
    height: 80px;
    border-radius: 100%;
}

.lv-1 {
    color: #ff0000;
    font-size: 16px;
    animation: lv1 2s infinite linear;
}

.lv-2 {
    background: linear-gradient(90deg, #ff0000, #00ff00);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 17px;
    animation: lv2 2s infinite linear;
}

.lv-3 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 18px;
    animation: lv3 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-4 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 19px;
    animation: lv4 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-5 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 20px;
    animation: lv5 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-6 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 21px;
    animation: lv6 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-7 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff, #ff7f00);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 22px;
    animation: lv7 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-8 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff, #ff7f00, #7f00ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 23px;
    animation: lv8 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-9 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff, #ff7f00, #7f00ff, #00ff7f);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 24px;
    animation: lv9 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-10 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff, #ff7f00, #7f00ff, #00ff7f, #7fff00);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 25px;
    animation: lv10 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-11 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff, #ff7f00, #7f00ff, #00ff7f, #7fff00, #ff007f);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 26px;
    animation: lv11 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-12 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff, #ff7f00, #7f00ff, #00ff7f, #7fff00, #ff007f, #007fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 27px;
    animation: lv12 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-13 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff, #ff7f00, #7f00ff, #00ff7f, #7fff00, #ff007f, #007fff, #7f7fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 28px;
    animation: lv13 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-14 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff, #ff7f00, #7f00ff, #00ff7f, #7fff00, #ff007f, #007fff, #7f7fff, #ff7f7f);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 29px;
    animation: lv14 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

.lv-15 {
    background: linear-gradient(90deg, #ff0000, #00ff00, #0000ff, #ffff00, #ff00ff, #00ffff, #ff7f00, #7f00ff, #00ff7f, #7fff00, #ff007f, #007fff, #7f7fff, #ff7f7f, #7f7f7f);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 30px;
    animation: lv15 2s infinite linear;
    text-shadow: 1px 1px 2px gold;
}

@keyframes lv1 {
    0% {
        color: #ff0000;
    }
    100% {
        color: #ff0000;
    }
}

@keyframes lv2 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv3 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv4 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv5 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv6 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv7 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv8 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv9 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv10 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv11 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv12 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv13 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv14 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

@keyframes lv15 {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}
