Новые анимированные баннеры KING RUSSIA

Difold_Walker · Вчера в 17:25

Всем привет, недавно на форуме King Russia Появились новые анимированные баннеры

CSS:

@charset "UTF-8";

/********* public:extra.less ********/
div[class*="snow-effect"],
div[class*="particles"],
div[class*="snowflake"] {
    display: none !important;
    visibility: hidden !important
}

.forum,
.glavadm,
.kk,
.dir,
.server1a,
.server1l,
.zga,
.prmanager,
.f5,
.f6,
.f7,
.f8,
.f9,
.f4,
.f3,
.f2,
.f1,
.moroz,
.modr,
.vklad,
.sliva,
.legend,
.gltest,
.zgt,
.sist,
.mlmoder,
.stmoder,
.zgta,
.techadm,
.adm,
.stadm,
.razrab,
.dima,
.vlad,
.glavsled,
.zamglavsled,
.lider,
.kur,
.rykvod,
.userBanner.userBanner--staff,
.pomtech,
.server2a,
.server3l,
.server3a,
.server4a,
.server2l,
.ban,
.specadm {
    color: rgba(255, 255, 255, 0.95);
    border: none;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: default;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    min-height: 30px;
    margin: 0 4px 5px 0;
    line-height: 1.2;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgba(30, 30, 40, 0.65) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
    border: 1.5px solid;
    transition: all .3s cubic-bezier(.4, 0, .2, 1);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3)
}

.forum::after,
.glavadm::after,
.kk::after,
.dir::after,
.server1a::after,
.server1l::after,
.zga::after,
.prmanager::after,
.f5::after,
.f6::after,
.f7::after,
.f8::after,
.f9::after,
.f4::after,
.f3::after,
.f2::after,
.f1::after,
.moroz::after,
.modr::after,
.vklad::after,
.sliva::after,
.legend::after,
.gltest::after,
.zgt:after,
.sist::after,
.mlmoder::after,
.stmoder::after,
.zgta::after,
.techadm::after,
.adm::after,
.stadm::after,
.razrab::after,
.dima::after,
.vlad::after,
.glavsled::after,
.zamglavsled::after,
.lider::after,
.kur::after,
.rykvod::after,
.userBanner.userBanner--staff::after,
.pomtech::after,
.server2a::after,
.server3l::after,
.server3a::after,
.server4a::after,
.server2l::after,
.ban::after,
.specadm::after {
    content: '';
    position: absolute;
    top: 2px;
    right: 8px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    opacity: 0.9;
    filter: blur(.5px);
    animation: neonPulse 3s ease-in-out infinite
}

@keyframes neonPulse {

    0%,
    100% {
        opacity: 0.6;
        transform: scale(.9)
    }

    50% {
        opacity: 1;
        transform: scale(1.1)
    }
}

.forum:hover,
.glavadm:hover,
.kk:hover,
.dir:hover,
.server1a:hover,
.server1l:hover,
.zga:hover,
.prmanager:hover,
.f5:hover,
.f6:hover,
.f7:hover,
.f8:hover,
.f9:hover,
.f4:hover,
.f3:hover,
.f2:hover,
.f1:hover,
.moroz:hover,
.modr:hover,
.vklad:hover,
.sliva:hover,
.legend:hover,
.gltest:hover,
.sist:hover,
.mlmoder:hover,
.stmoder:hover,
.zgta:hover,
.techadm:hover,
.adm:hover,
.stadm:hover,
.razrab:hover,
.dima:hover,
.vlad:hover,
.glavsled:hover,
.zamglavsled:hover,
.lider:hover,
.kur:hover,
.rykvod:hover,
.userBanner.userBanner--staff:hover,
.pomtech:hover,
.server2a:hover,
.server3l:hover,
.server3a:hover,
.server4a:hover,
.server2l:hover,
.ban:hover,
.specadm:hover,
.zgt:hover {
    transform: translateY(-2px);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.1), 0 0 15px currentColor, inset 0 1px 0 rgba(255, 255, 255, 0.2);
    z-index: 10
}

.forum {
    border-color: #C266FF;
    box-shadow: 0 0 10px rgba(194, 102, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: forumPulse 2s infinite alternate !important
}

.forum::after {
    background: #C266FF;
    box-shadow: 0 0 8px #c266ff
}

@keyframes forumPulse {
    0% {
        box-shadow: 0 0 10px rgba(194, 102, 255, 0.3);
        border-color: rgba(194, 102, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(194, 102, 255, 0.9);
        border-color: #c266ff
    }
}

.glavadm {
    border-color: #00FF88;
    box-shadow: 0 0 10px rgba(0, 255, 136, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: glavadmPulse 2s infinite alternate !important
}

.glavadm::after {
    background: #00FF88;
    box-shadow: 0 0 8px #0f8
}

@keyframes glavadmPulse {
    0% {
        box-shadow: 0 0 10px rgba(0, 255, 136, 0.3);
        border-color: rgba(0, 255, 136, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(0, 255, 136, 0.9);
        border-color: #0f8
    }
}

.kk {
    border-color: #00F0FF;
    box-shadow: 0 0 10px rgba(0, 240, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: kkPulse 2s infinite alternate !important
}

.kk::after {
    background: #00F0FF;
    box-shadow: 0 0 8px #00f0ff
}

@keyframes kkPulse {
    0% {
        box-shadow: 0 0 10px rgba(0, 240, 255, 0.3);
        border-color: rgba(0, 240, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(0, 240, 255, 0.9);
        border-color: #00f0ff
    }
}

.dir {
    border-color: #FF3366;
    box-shadow: 0 0 10px rgba(255, 51, 102, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: dirPulse 2s infinite alternate !important
}

.dir::after {
    background: #FF3366;
    box-shadow: 0 0 8px #f36
}

@keyframes dirPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 51, 102, 0.3);
        border-color: rgba(255, 51, 102, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 51, 102, 0.9);
        border-color: #f36
    }
}

.server1a {
    border-color: #FF3333;
    box-shadow: 0 0 10px rgba(255, 51, 51, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: server1aPulse 2s infinite alternate !important
}

.server1a::after {
    background: #FF3333;
    box-shadow: 0 0 8px #f33
}

@keyframes server1aPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 51, 51, 0.3);
        border-color: rgba(255, 51, 51, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 51, 51, 0.9);
        border-color: #f33
    }
}

.server1l {
    border-color: #FF5555;
    box-shadow: 0 0 10px rgba(255, 85, 85, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: server1lPulse 2s infinite alternate !important
}

.server1l::after {
    background: #FF5555;
    box-shadow: 0 0 8px #f55
}

@keyframes server1lPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 85, 85, 0.3);
        border-color: rgba(255, 85, 85, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 85, 85, 0.9);
        border-color: #f55
    }
}

.zga {
    border-color: #6AFF7A;
    box-shadow: 0 0 10px rgba(106, 255, 122, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: zgaPulse 2s infinite alternate !important
}

.zga::after {
    background: #6AFF7A;
    box-shadow: 0 0 8px #6aff7a
}

@keyframes zgaPulse {
    0% {
        box-shadow: 0 0 10px rgba(106, 255, 122, 0.3);
        border-color: rgba(106, 255, 122, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(106, 255, 122, 0.9);
        border-color: #6aff7a
    }
}

.prmanager {
    border-color: #FFAA33;
    box-shadow: 0 0 10px rgba(255, 170, 51, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: prmanagerPulse 2s infinite alternate !important
}

.prmanager::after {
    background: #FFAA33;
    box-shadow: 0 0 8px #fa3
}

@keyframes prmanagerPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 170, 51, 0.3);
        border-color: rgba(255, 170, 51, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 170, 51, 0.9);
        border-color: #fa3
    }
}

.f5 {
    border-color: #FF66AA;
    box-shadow: 0 0 10px rgba(255, 102, 170, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: f5Pulse 2s infinite alternate !important
}

.f5::after {
    background: #FF66AA;
    box-shadow: 0 0 8px #f6a
}

@keyframes f5Pulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 102, 170, 0.3);
        border-color: rgba(255, 102, 170, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 102, 170, 0.9);
        border-color: #f6a
    }
}

.f6 {
    border-color: #FFD700;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    color: #FFFFFF;
    animation: f6Pulse 2s infinite alternate !important
}

.f6::after {
    background: #FFD700;
    box-shadow: 0 0 8px #ffd700
}

@keyframes f6Pulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 215, 0, 0.3);
        border-color: rgba(255, 215, 0, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 215, 0, 0.9);
        border-color: #ffd700
    }
}

.f7 {
    border-color: #FF9933;
    box-shadow: 0 0 10px rgba(255, 153, 51, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: f7Pulse 2s infinite alternate !important
}

.f7::after {
    background: #FF9933;
    box-shadow: 0 0 8px #f93
}

@keyframes f7Pulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 153, 51, 0.3);
        border-color: rgba(255, 153, 51, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 153, 51, 0.9);
        border-color: #f93
    }
}

.f8 {
    border-color: #44FF77;
    box-shadow: 0 0 10px rgba(68, 255, 119, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: f8Pulse 2s infinite alternate !important
}

.f8::after {
    background: #44FF77;
    box-shadow: 0 0 8px #4f7
}

@keyframes f8Pulse {
    0% {
        box-shadow: 0 0 10px rgba(68, 255, 119, 0.3);
        border-color: rgba(68, 255, 119, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(68, 255, 119, 0.9);
        border-color: #4f7
    }
}

.f9 {
    border-color: #55FF88;
    box-shadow: 0 0 10px rgba(85, 255, 136, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: f9Pulse 2s infinite alternate !important
}

.f9::after {
    background: #55FF88;
    box-shadow: 0 0 8px #5f8
}

@keyframes f9Pulse {
    0% {
        box-shadow: 0 0 10px rgba(85, 255, 136, 0.3);
        border-color: rgba(85, 255, 136, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(85, 255, 136, 0.9);
        border-color: #5f8
    }
}

.f4 {
    border-color: #66FF99;
    box-shadow: 0 0 10px rgba(102, 255, 153, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: f4Pulse 2s infinite alternate !important
}

.f4::after {
    background: #66FF99;
    box-shadow: 0 0 8px #6f9
}

@keyframes f4Pulse {
    0% {
        box-shadow: 0 0 10px rgba(102, 255, 153, 0.3);
        border-color: rgba(102, 255, 153, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(102, 255, 153, 0.9);
        border-color: #6f9
    }
}

.f3 {
    border-color: #888;
    box-shadow: 0 0 10px rgba(136, 136, 136, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: f3Pulse 2s infinite alternate !important
}

.f3::after {
    background: #888;
    box-shadow: 0 0 8px #888
}

@keyframes f3Pulse {
    0% {
        box-shadow: 0 0 10px rgba(136, 136, 136, 0.3);
        border-color: rgba(136, 136, 136, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(136, 136, 136, 0.9);
        border-color: #888
    }
}

.f2 {
    border-color: #66FFFF;
    box-shadow: 0 0 10px rgba(102, 255, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    color: #222;
    animation: f2Pulse 2s infinite alternate !important
}

.f2::after {
    background: #66FFFF;
    box-shadow: 0 0 8px #6ff
}

@keyframes f2Pulse {
    0% {
        box-shadow: 0 0 10px rgba(102, 255, 255, 0.3);
        border-color: rgba(102, 255, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(102, 255, 255, 0.9);
        border-color: #6ff
    }
}

.f1 {
    border-color: #CC66FF;
    box-shadow: 0 0 10px rgba(204, 102, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: f1Pulse 2s infinite alternate !important
}

.f1::after {
    background: #CC66FF;
    box-shadow: 0 0 8px #c6f
}

@keyframes f1Pulse {
    0% {
        box-shadow: 0 0 10px rgba(204, 102, 255, 0.3);
        border-color: rgba(204, 102, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(204, 102, 255, 0.9);
        border-color: #c6f
    }
}

.moroz {
    border-color: #66CCFF;
    box-shadow: 0 0 10px rgba(102, 204, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: morozPulse 2s infinite alternate !important
}

.moroz::after {
    background: #66CCFF;
    box-shadow: 0 0 8px #6cf
}

@keyframes morozPulse {
    0% {
        box-shadow: 0 0 10px rgba(102, 204, 255, 0.3);
        border-color: rgba(102, 204, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(102, 204, 255, 0.9);
        border-color: #6cf
    }
}

.modr {
    border-color: #FF99CC;
    box-shadow: 0 0 10px rgba(255, 153, 204, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: modrPulse 2s infinite alternate !important
}

.modr::after {
    background: #FF99CC;
    box-shadow: 0 0 8px #f9c
}

@keyframes modrPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 153, 204, 0.3);
        border-color: rgba(255, 153, 204, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 153, 204, 0.3);
        border-color: #f9c
    }
}

.vklad {
    border-color: #6688FF;
    box-shadow: 0 0 10px rgba(102, 136, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: vkladPulse 2s infinite alternate !important
}

.vklad::after {
    background: #6688FF;
    box-shadow: 0 0 8px #68f
}

@keyframes vkladPulse {
    0% {
        box-shadow: 0 0 10px rgba(102, 136, 255, 0.3);
        border-color: rgba(102, 136, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(102, 136, 255, 0.9);
        border-color: #68f
    }
}

.sliva {
    border-color: #FF77AA;
    box-shadow: 0 0 10px rgba(255, 119, 170, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: slivaPulse 2s infinite alternate !important
}

.sliva::after {
    background: #FF77AA;
    box-shadow: 0 0 8px #f7a
}

@keyframes slivaPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 119, 170, 0.3);
        border-color: rgba(255, 119, 170, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 119, 170, 0.9);
        border-color: #f7a
    }
}

.legend {
    border-color: #D966FF;
    box-shadow: 0 0 10px rgba(217, 102, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: gltestPulse 2s infinite alternate !important
}

.legend::after {
    background: #D966FF;
    box-shadow: 0 0 8px #d966ff
}

@keyframes gltestPulse {
    0% {
        box-shadow: 0 0 10px rgba(217, 102, 255, 0.3);
        border-color: rgba(217, 102, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(217, 102, 255, 0.9);
        border-color: #d966ff
    }
}

.gltest {
    border-color: #FFFF66;
    box-shadow: 0 0 10px rgba(255, 255, 102, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: gltestPulse 2s infinite alternate !important
}

.gltest::after {
    background: #FFFF66;
    box-shadow: 0 0 8px #ff6
}

@keyframes gltestPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 255, 102, 0.3);
        border-color: rgba(255, 255, 102, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 255, 102, 0.9);
        border-color: #ff6
    }
}

.zgt {
    border-color: #FFFF66;
    box-shadow: 0 0 10px rgba(255, 255, 102, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: zgtPulse 2s infinite alternate !important
}

.zgt::after {
    background: #FFFF66;
    box-shadow: 0 0 8px #ff6
}

@keyframes zgtPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 255, 102, 0.3);
        border-color: rgba(255, 255, 102, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 255, 102, 0.9);
        border-color: #ff6
    }
}

.sist {
    border-color: #66E0FF;
    box-shadow: 0 0 10px rgba(102, 224, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: sistPulse 2s infinite alternate !important
}

.sist::after {
    background: #66E0FF;
    box-shadow: 0 0 8px #66e0ff
}

@keyframes sistPulse {
    0% {
        box-shadow: 0 0 10px rgba(102, 224, 255, 0.3);
        border-color: rgba(102, 224, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(102, 224, 255, 0.9);
        border-color: #66e0ff
    }
}

.mlmoder {
    border-color: #77DDFF;
    box-shadow: 0 0 10px rgba(119, 221, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: mlmoderPulse 2s infinite alternate !important
}

.mlmoder::after {
    background: #77DDFF;
    box-shadow: 0 0 8px #7df
}

@keyframes mlmoderPulse {
    0% {
        box-shadow: 0 0 10px rgba(119, 221, 255, 0.3);
        border-color: rgba(119, 221, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(119, 221, 255, 0.9);
        border-color: #7df
    }
}

.stmoder {
    border-color: #88EEFF;
    box-shadow: 0 0 10px rgba(136, 238, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: stmoderPulse 2s infinite alternate !important
}

.stmoder::after {
    background: #88EEFF;
    box-shadow: 0 0 8px #8ef
}

@keyframes stmoderPulse {
    0% {
        box-shadow: 0 0 10px rgba(136, 238, 255, 0.3);
        border-color: rgba(136, 238, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(136, 238, 255, 0.9);
        border-color: #8ef
    }
}

.zgta {
    border-color: #FF88CC;
    box-shadow: 0 0 10px rgba(255, 136, 204, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: zgtaPulse 2s infinite alternate !important
}

.zgta::after {
    background: #FF88CC;
    box-shadow: 0 0 8px #f8c
}

@keyframes zgtaPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 136, 204, 0.3);
        border-color: rgba(255, 136, 204, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 136, 204, 0.9);
        border-color: #f8c
    }
}

.username--style3 {
    background: linear-gradient(to right, #f00, #ffa500, #ff0, #008000, #0ff);
    background-size: 400% 400%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    font-weight: bold;
    animation: AnimNic 6s ease infinite !important
}

.techadm {
    border-color: #FF8844 !important;
    background: rgba(255, 136, 68, 0.1);
    box-shadow: 0 0 10px rgba(255, 136, 68, 0.3);
    animation: techPulse 2s infinite alternate !important
}

.techadm::after {
    background: #FF8844;
    box-shadow: 0 0 8px #f84
}

@keyframes AnimNic {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}

@keyframes techPulse {
    0% {
        box-shadow: 0 0 5px rgba(255, 136, 68, 0.4);
        border-color: rgba(255, 136, 68, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 136, 68, 0.9);
        border-color: #f84
    }
}

.adm {
    border-color: #FFCC44;
    box-shadow: 0 0 10px rgba(255, 204, 68, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: admPulse 2s infinite alternate !important
}

.adm::after {
    background: #FFCC44;
    box-shadow: 0 0 8px #fc4
}

@keyframes admPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 204, 68, 0.3);
        border-color: rgba(255, 204, 68, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 204, 68, 0.9);
        border-color: #fc4
    }
}

.stadm {
    border-color: #FFDD55;
    box-shadow: 0 0 10px rgba(255, 221, 85, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: stadmPulse 2s infinite alternate !important
}

.stadm::after {
    background: #FFDD55;
    box-shadow: 0 0 8px #fd5
}

@keyframes stadmPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 221, 85, 0.3);
        border-color: rgba(255, 221, 85, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 221, 85, 0.9);
        border-color: #fd5
    }
}

.razrab {
    border-color: #FF4466;
    box-shadow: 0 0 10px rgba(255, 68, 102, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: razrabPulse 2s infinite alternate !important
}

.razrab::after {
    background: #FF4466;
    box-shadow: 0 0 8px #f46
}

@keyframes razrabPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 68, 102, 0.3);
        border-color: rgba(255, 68, 102, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 68, 102, 0.9);
        border-color: #f46
    }
}

.dima {
    border-color: #FF99DD;
    box-shadow: 0 0 10px rgba(255, 153, 221, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: dimaPulse 2s infinite alternate !important
}

.dima::after {
    background: #FF99DD;
    box-shadow: 0 0 8px #f9d
}

@keyframes dimaPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 153, 221, 0.3);
        border-color: rgba(255, 153, 221, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 153, 221, 0.9);
        border-color: #f9d
    }
}

.vlad {
    border-color: #FF3355;
    box-shadow: 0 0 10px rgba(255, 51, 85, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: vladPulse 2s infinite alternate !important
}

.vlad::after {
    background: #FF3355;
    box-shadow: 0 0 8px #f35
}

@keyframes vladPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 51, 85, 0.3);
        border-color: rgba(255, 51, 85, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 51, 85, 0.9);
        border-color: #f35
    }
}

.glavsled {
    border-color: #4477FF;
    box-shadow: 0 0 10px rgba(68, 119, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: glavsledPulse 2s infinite alternate !important
}

.glavsled::after {
    background: #4477FF;
    box-shadow: 0 0 8px #47f
}

@keyframes glavsledPulse {
    0% {
        box-shadow: 0 0 10px rgba(68, 119, 255, 0.3);
        border-color: rgba(68, 119, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(68, 119, 255, 0.9);
        border-color: #47f
    }
}

.zamglavsled {
    border-color: #5588FF;
    box-shadow: 0 0 10px rgba(85, 136, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: zamglavsledPulse 2s infinite alternate !important
}

.zamglavsled::after {
    background: #5588FF;
    box-shadow: 0 0 8px #58f
}

@keyframes zamglavsledPulse {
    0% {
        box-shadow: 0 0 10px rgba(85, 136, 255, 0.3);
        border-color: rgba(85, 136, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(85, 136, 255, 0.9);
        border-color: #58f
    }
}

.lider {
    border-color: #59d8ff;
    box-shadow: 0 0 10px #52e8ff, inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: liderPulse 2s infinite alternate !important
}

.lider::after {
    background: #59d8ff;
    box-shadow: 0 0 8px #59d8ff
}

@keyframes liderPulse {
    0% {
        box-shadow: 0 0 10px rgba(82, 232, 255, 0.3);
        border-color: rgba(82, 232, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px #52e8ff;
        border-color: #52e8ff
    }
}

.kur {
    border-color: #AA88FF;
    box-shadow: 0 0 10px rgba(170, 136, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: kurPulse 2s infinite alternate !important
}

.kur::after {
    background: #AA88FF;
    box-shadow: 0 0 8px #a8f
}

@keyframes kurPulse {
    0% {
        box-shadow: 0 0 10px rgba(170, 136, 255, 0.3);
        border-color: rgba(170, 136, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(170, 136, 255, 0.9);
        border-color: #a8f
    }
}

.rykvod {
    border-color: #FF2244;
    box-shadow: 0 0 10px rgba(255, 34, 68, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: rykvodPulse 2s infinite alternate !important
}

.rykvod::after {
    background: #FF2244;
    box-shadow: 0 0 8px #f24
}

@keyframes rykvodPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 34, 68, 0.3);
        border-color: rgba(255, 34, 68, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 34, 68, 0.9);
        border-color: #f24
    }
}

.userBanner.userBanner--staff {
    border-color: #FF5555;
    box-shadow: 0 0 10px rgba(255, 85, 85, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1)
}

.userBanner.userBanner--staff::after {
    background: #FF5555;
    box-shadow: 0 0 8px #f55
}

.pomtech {
    border-color: #FF9966;
    box-shadow: 0 0 10px rgba(255, 153, 102, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: pomtechPulse 2s infinite alternate !important
}

.pomtech::after {
    background: #FF9966;
    box-shadow: 0 0 8px #f96
}

@keyframes pomtechPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 153, 102, 0.3);
        border-color: rgba(255, 153, 102, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 153, 102, 0.9);
        border-color: #f96
    }
}

.server2a {
    border-color: #44FF44;
    box-shadow: 0 0 10px rgba(68, 255, 68, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: server2aPulse 2s infinite alternate !important
}

.server2a::after {
    background: #44FF44;
    box-shadow: 0 0 8px #4f4
}

@keyframes server2aPulse {
    0% {
        box-shadow: 0 0 10px rgba(68, 255, 68, 0.3);
        border-color: rgba(68, 255, 68, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(68, 255, 68, 0.9);
        border-color: #4f4
    }
}

.server3l {
    border-color: #4477FF;
    box-shadow: 0 0 10px rgba(68, 119, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: server3lPulse 2s infinite alternate !important
}

.server3l::after {
    background: #4477FF;
    box-shadow: 0 0 8px #47f
}

@keyframes server3lPulse {
    0% {
        box-shadow: 0 0 10px rgba(68, 119, 255, 0.3);
        border-color: rgba(68, 119, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(68, 119, 255, 0.9);
        border-color: #47f
    }
}

.server3a {
    border-color: #6699FF;
    box-shadow: 0 0 10px rgba(102, 153, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: server3aPulse 2s infinite alternate !important
}

.server3a::after {
    background: #6699FF;
    box-shadow: 0 0 8px #69f
}

@keyframes server3aPulse {
    0% {
        box-shadow: 0 0 10px rgba(102, 153, 255, 0.3);
        border-color: rgba(102, 153, 255, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(102, 153, 255, 0.9);
        border-color: #69f
    }
}

.server4a {
    border-color: #FFFF44;
    box-shadow: 0 0 10px rgba(255, 255, 68, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    color: #222
}

.server4a::after {
    background: #FFFF44;
    box-shadow: 0 0 8px #ff4
}

.server2l {
    border-color: #66FF66;
    box-shadow: 0 0 10px rgba(102, 255, 102, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: server2lPulse 2s infinite alternate !important
}

.server2l::after {
    background: #66FF66;
    box-shadow: 0 0 8px #6f6
}

@keyframes server2lPulse {
    0% {
        box-shadow: 0 0 10px rgba(102, 255, 102, 0.3);
        border-color: rgba(102, 255, 102, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(102, 255, 102, 0.9);
        border-color: #6f6
    }
}

.ban {
    border-color: #666;
    box-shadow: 0 0 10px rgba(102, 102, 102, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1)
}

.ban::after {
    background: #FF3333;
    box-shadow: 0 0 8px #f33
}

.specadm {
    border-color: #FF3366;
    box-shadow: 0 0 10px rgba(255, 51, 102, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: specPulse 2s infinite alternate !important
}

.specadm::after {
    background: #FF3366;
    box-shadow: 0 0 8px #f36
}

@keyframes specPulse {
    0% {
        box-shadow: 0 0 10px rgba(255, 51, 102, 0.3);
        border-color: rgba(255, 51, 102, 0.6)
    }

    100% {
        box-shadow: 0 0 15px rgba(255, 51, 102, 0.9);
        border-color: #f36
    }
}

@media (max-width:768px) {

    .forum,
    .glavadm,
    .kk,
    .dir,
    .server1a,
    .server1l,
    .zga,
    .prmanager,
    .f5,
    .f6,
    .f7,
    .f8,
    .f9,
    .f4,
    .f3,
    .f2,
    .f1,
    .moroz,
    .modr,
    .vklad,
    .sliva,
    .legend,
    .gltest,
    .zgt,
    .sist,
    .mlmoder,
    .stmoder,
    .zgta,
    .techadm,
    .adm,
    .stadm,
    .razrab,
    .dima,
    .vlad,
    .glavsled,
    .zamglavsled,
    .lider,
    .kur,
    .rykvod,
    .userBanner.userBanner--staff,
    .pomtech,
    .server2a,
    .server3l,
    .server3a,
    .server4a,
    .server2l,
    .ban,
    .specadm {
        font-size: 0.6rem;
        padding: 4px 10px;
        min-height: 26px;
        border-radius: 8px;
        margin: 0 2px 3px 0;
        backdrop-filter: blur(5px);
        -webkit-backdrop-filter: blur(5px)
    }

    .forum::after,
    .glavadm::after,
    .kk::after,
    .dir::after,
    .server1a::after,
    .server1l::after,
    .zga::after,
    .prmanager::after,
    .f5::after,
    .f6::after,
    .f7::after,
    .f8::after,
    .f9::after,
    .f4::after,
    .f3::after,
    .f2::after,
    .f1::after,
    .moroz::after,
    .modr::after,
    .vklad::after,
    .sliva::after,
    .legend::after,
    .gltest::after,
    .sist::after,
    .mlmoder::after,
    .stmoder::after,
    .zgta::after,
    .techadm::after,
    .adm::after,
    .stadm::after,
    .razrab::after,
    .dima::after,
    .vlad::after,
    .glavsled::after,
    .zamglavsled::after,
    .lider::after,
    .kur::after,
    .rykvod::after,
    .userBanner.userBanner--staff::after,
    .pomtech::after,
    .server2a::after,
    .server3l::after,
    .server3a::after,
    .server4a::after,
    .server2l::after,
    .ban::after,
    .specadm::after,
    .zgt::after {
        display: none
    }
}

.message .message-user .userBannerWrapper {
    margin-bottom: 6px !important
}

.message .message-user .userBanner {
    margin: 2px 4px 4px 0 !important
}

@media (prefers-color-scheme:dark) {

    .forum,
    .glavadm,
    .kk,
    .dir,
    .server1a,
    .server1l,
    .zga,
    .prmanager,
    .f5,
    .f6,
    .f7,
    .f8,
    .f9,
    .f4,
    .f3,
    .f2,
    .f1,
    .moroz,
    .modr,
    .vklad,
    .sliva,
    .legend,
    .gltest,
    .zgt,
    .sist,
    .mlmoder,
    .stmoder,
    .zgta,
    .techadm,
    .adm,
    .stadm,
    .razrab,
    .dima,
    .vlad,
    .glavsled,
    .zamglavsled,
    .lider,
    .kur,
    .rykvod,
    .userBanner.userBanner--staff,
    .pomtech,
    .server2a,
    .server3l,
    .server3a,
    .server4a,
    .server2l,
    .ban,
    .specadm {
        background: rgba(20, 20, 30, 0.7) !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1), inset 0 -1px 0 rgba(0, 0, 0, 0.2)
    }
}

.pgreen {
    background-image: linear-gradient(150deg, #32cd32, #008000);
    color: white;
    text-transform: uppercase;
    font-size: 66%;
    padding: 3px 6px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0px 0px 6px #32cd32
}

.porange {
    background-image: linear-gradient(150deg, #ffbf00, #ff9800);
    color: white;
    text-transform: uppercase;
    font-size: 66%;
    padding: 3px 6px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0px 0px 6px #ff9800
}

.paqua {
    background-image: linear-gradient(150deg, #03a9f4, #2ebcfc);
    color: white;
    text-transform: uppercase;
    font-size: 66%;
    padding: 3px 6px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0px 0px 6px #03a9f4
}

.pred {
    background-image: linear-gradient(150deg, #f00, #b22222);
    color: white;
    text-transform: uppercase;
    font-size: 66%;
    padding: 3px 6px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0px 0px 6px #f00
}

.ypred {
    background-image: linear-gradient(150deg, #ffe218, #ffc018);
    color: black;
    text-transform: uppercase;
    font-size: 66%;
    padding: 3px 6px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0px 0px 6px #ffc018
}

.bpred {
    background-image: linear-gradient(150deg, #1844ff, #186fff);
    color: white;
    text-transform: uppercase;
    font-size: 66%;
    padding: 3px 6px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0px 0px 6px #1844ff
}

Прошу не путать данные баннеры с https://pawno-help.ru/threads/bannery-king-russia-2025.11629/ так как они различаются анимациями

Посмотреть в живую: https://forum.kingrussia.com/index.php?members/50/

Lucifer_Luciano · Вчера в 21:57

Помогите как сделать? (Ничего не помню)

Difold_Walker · Сегодня в 05:40

Lucifer_Luciano написал(а):
Помогите как сделать? (Ничего не помню)

Копируешь, заходишь на свой форум дальше в панель управления и потом в extra.less это вставляешь

Поиск

Welcome!

Новые анимированные баннеры KING RUSSIA

Difold_Walker

Lucifer_Luciano

Difold_Walker