Решено Помогите с банерами WHITE RUSSIA

[T I H O N]

https://forum.whiterussia.online/index.php Здраствуйте вот форум с которых я хочу банеры но не знаю где их взять щас скину пример. Помогите пожалуйста!

 

[T I H O N]

 

[T I H O N]

Вот как сделать такие банеры и цвет ника

 

[Mortis_Panarenka]

Вот баннеры

.gradientBanner {
    position: relative
}

.gradientBanner:after {
    content: '';
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: ;
    animation: animate-shine 3s ease-out infinite
}

@keyframes animate-shine {
    0% {
        opacity: .1;
        width: 0
    }

    50% {
        opacity: .5
    }

    100% {
        opacity: 0;
        width: 100%
    }
}

.gradientBanner {
    font-size: 80%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    padding: 1px 3px;
    border: 1px solid transparent;
    border-radius: 2px;
    text-align: center;
    display: inline-block
}

.legend {
    color: #fff;
    background: #8c5eff;
    border-color: #fff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.legend {
    color: #fff;
    background: #8c5eff;
    border-color: #fff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.legend {
    color: #fff;
    background: #8c5eff;
    border-color: #fff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.yspeshniy {
    color: #fff;
    background: #20aeb3;
    border-color: #fff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.specadm {
    color: #fff;
    background: #d80000;
    border-color: #a50000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.razrab {
    color: #fff;
    background: #1cb4d6;
    border-color: #1cb4d6;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.ga {
    color: #fff;
    background: #0a8208;
    border-color: #e83f3f;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.zga {
    color: #fff;
    background: #6DB36D;
    border-color: #55a154;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.redd {
    color: #fff;
    background: #d80000;
    border-color: #59a1ff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.mur {
    color: #fff;
    background: #396798;
    border-color: #396798;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.kur {
    color: #fff;
    background: #9676f5;
    border-color: #b459ff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.tech {
    color: #fff;
    background: #ff6f0f;
    border-color: #ff6f0f;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.ld {
    color: #fff;
    background: #74cfe8;
    border-color: #74cfe8;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.admin {
    color: #fff;
    background: #4284f5;
    border-color: #4284f5;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.admins {
    color: #fff;
    background: #f2b852;
    border-color: #326fa8;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.moder {
    color: #fff;
    background: #26bbed;
    border-color: #26bbed;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.kp {
    color: #000;
    background: #FDC000;
    border-color: #FDC000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.staff {
    color: #fff;
    background: black;
    border-color: black;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.piar {
    color: #fff;
    background: #f5a142;
    border-color: #f5a142;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.support {
    color: #fff;
    background: #a83c32;
    border-color: #a83c32;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.test {
    color: #000;
    background: #20DCD9;
    border-color: #20DCD9;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.rukds {
    color: #fff;
    background: #188EFF;
    border-color: #188EFF;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.gta {
    color: #fff;
    background: #ff6f0f;
    border-color: #ff6f0f;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.zgta {
    color: #fff;
    background: #f24444;
    border-color: #000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.pet {
    color: #fff;
    background: #ffcd00;
    border-color: #ffcd00;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.user {
    color: #fff;
    background: #ababab;
    border-color: #ababab;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.vet {
    color: #fff;
    background: #a408ff;
    border-color: #a408ff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.blok {
    color: #fff;
    background: #ababab;
    border-color: #ababab;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.gradientBanner.red {
    box-shadow: 0px 0px 5px #f00;
    background-color: #ff0000;
    border-color: #ff0000;
    color: #fff
}

.gradientBanner.green {
    box-shadow: 0px 0px 5px #008000;
    background-color: green;
    border-color: green;
    color: #fff
}

.gradientBanner.yellow {
    box-shadow: 0px 0px 5px #fdc000;
    background-color: #Fdc000;
    border-color: #Fdc000;
    color: #fff
}

.gradientBanner.white {
    box-shadow: 0px 0px 5px #ababab;
    background-color: #ababab;
    border-color: #ababab;
    color: #fff
}

.gradientBanner.ber {
    box-shadow: 0px 0px 5px #20dcd9;
    background-color: #20DCD9;
    border-color: #20DCD9;
    color: #fff
}

.userBanner.userBanner--staff {
    display: none
}

.blog {
    color: #fff;
    background: #a8608e;
    border-color: #a8608e;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.dev_vinter_ruk {
    color: #fff;
    background: #d80000;
    border-color: #a50000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.dev_vinter_ruk::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(#fff 20%, transparent 20%),radial-gradient(#fff 20%, transparent 20%);
    background-size: 20px 20px;
    background-position: 0 0,10px 10px;
    animation: starsMove 5s linear infinite;
    opacity: 0.3;
    z-index: 0;
    pointer-events: none
}

@keyframes starsMove {
    from {
        background-position: 0 0,10px 10px
    }

    to {
        background-position: -40px -40px,-30px -30px
    }
}

.dev_vinter_dev {
    color: #00ffcc;
    background: #0d1b15;
    border-color: #00ffcc;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 2px 22px;
    border: 1px solid;
    border-radius: 4px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1;
    font-family: 'Courier New',monospace;
    box-shadow: 0 0 5px rgba(0,255,204,0.3),0 0 10px rgba(0,255,204,0.2),0 0 20px rgba(0,255,204,0.1);
    transition: all .3s ease
}

.dev_vinter_dev:hover {
    box-shadow: 0 0 10px rgba(0,255,204,0.6),0 0 20px rgba(0,255,204,0.4),0 0 30px rgba(0,255,204,0.3);
    transform: scale(1.05)
}

.dev_vinter_dev::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    right: -50%;
    bottom: -50%;
    background-image: linear-gradient(90deg, rgba(0,255,204,0.05) 1px, transparent 1px),linear-gradient(rgba(0,255,204,0.05) 1px, transparent 1px);
    background-size: 20px 20px;
    z-index: 0;
    opacity: 0.15;
    animation: gridMove 3s linear infinite;
    pointer-events: none
}

@keyframes gridMove {
    from {
        transform: translateX(0) translateY(0)
    }

    to {
        transform: translateX(20px) translateY(20px)
    }
}

.dev_vinter_dev::after {
    content: '0 1 [ ] { } = ; / \\ * & ^ % $ # @ !';
    position: absolute;
    top: -20px;
    left: 0;
    white-space: nowrap;
    font-family: monospace;
    font-size: 14px;
    color: rgba(0,255,204,0.2);
    animation: codeScroll 8s linear infinite;
    z-index: 0;
    pointer-events: none;
    letter-spacing: 1px
}

@keyframes codeScroll {
    from {
        transform: translateY(0)
    }

    to {
        transform: translateY(100px)
    }
}

@keyframes neonPulse {
    0%,100% {
        box-shadow: 0 0 5px rgba(0,255,204,0.6),0 0 10px rgba(0,255,204,0.4)
    }

    50% {
        box-shadow: 0 0 10px rgba(0,255,204,0.8),0 0 20px rgba(0,255,204,0.5)
    }
}

.dev_vinter_forum {
    color: #fff;
    background: linear-gradient(135deg, #a8608e, #7a3b7a);
    border-color: #7a3b7a;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.dev_vinter_vlad {
    color: #fff;
    background: linear-gradient(135deg, #f00, #f00);
    border-color: #ff0000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.dev_vinter_forum::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='%23ffffff' opacity='0.3'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z'/%3E%3C/svg%3E");
    background-size: 40px 40px;
    background-repeat: repeat;
    animation: symbolsMove 5s linear infinite;
    opacity: 0.3;
    z-index: 0;
    pointer-events: none
}

.dev_vinter_vlad::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='%23ffffff' opacity='0.3'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z'/%3E%3C/svg%3E");
    background-size: 40px 40px;
    background-repeat: repeat;
    animation: symbolsMove 5s linear infinite;
    opacity: 0.3;
    z-index: 0;
    pointer-events: none
}

@keyframes symbolsMove {
    from {
        background-position: 0 0
    }

    to {
        background-position: -40px -40px
    }
}

.dev_vinter_vp {
    color: #fff;
    border: none;
    font-size: 75%;
    font-weight: 600;
    font-style: normal;
    padding: 1px 20px;
    border-radius: 4px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1;
    text-shadow: 0 0 5px #f0f,0 0 10px #f0f,0 0 20px #f0f,0 0 40px #f0f
}

.dev_vinter_vp::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    border: 2px solid transparent;
    background: linear-gradient(45deg, #f0f, #0ff, #f0f, #0ff);
    background-size: 400% 400%;
    border-radius: 10px;
    animation: edgeLight 3s infinite linear;
    z-index: -1;
    filter: blur(2px)
}

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

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

.dev_vinter_vp::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(circle, rgba(255,0,255,0.5) 10%, transparent 10%),radial-gradient(circle, rgba(0,255,255,0.5) 10%, transparent 10%);
    background-size: 50px 50px;
    background-position: 0 0,25px 25px;
    animation: particlesMove 6s linear infinite;
    opacity: 0.7;
    z-index: 0;
    pointer-events: none
}

@keyframes particlesMove {
    0% {
        transform: translate(0, 0)
    }

    100% {
        transform: translate(-25px, -25px)
    }
}

.dev_vinter_vp span {
    animation: neonText 2s infinite alternate
}

@keyframes neonText {
    0% {
        text-shadow: 0 0 5px #f0f,0 0 10px #f0f,0 0 20px #f0f,0 0 40px #f0f
    }

    100% {
        text-shadow: 0 0 10px #f0f,0 0 20px #f0f,0 0 40px #f0f,0 0 80px #f0f,0 0 120px #f0f
    }
}

.dev_vinter_vip {
    color: #fff;
    background: #ff6f61;
    border-color: #e04b3f;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.dev_vinter_vip::before {
    content: '';
    position: absolute;
    bottom: -50px;
    left: 50%;
    transform: translateX(-50%);
    width: 15px;
    height: 35px;
    background: linear-gradient(to bottom, #ff005c 0%, #ff005c 60%, #d2691e 60%, #8b4513 100%);
    clip-path: polygon(50% 0%, 100% 50%, 100% 60%, 50% 100%, 0% 60%, 0% 50%);
    box-shadow: 0 0 6px rgba(255,255,255,0.4),inset 0 0 3px rgba(255,255,255,0.6);
    animation: moveUpDiagonal 5s linear infinite,lollipopSpin 5s linear infinite,lollipopShine 3s ease-in-out infinite;
    z-index: -1
}

@keyframes lollipopShine {
    0% {
        box-shadow: 0 0 6px rgba(255,255,255,0.4),inset 0 0 3px rgba(255,255,255,0.6)
    }

    50% {
        box-shadow: 0 0 9px rgba(255,255,255,0.6),inset 0 0 4px rgba(255,255,255,0.8)
    }

    100% {
        box-shadow: 0 0 6px rgba(255,255,255,0.4),inset 0 0 3px rgba(255,255,255,0.6)
    }
}

@keyframes moveUpDiagonal {
    from {
        bottom: -50px;
        transform: translateX(-50%) translateY(0) rotate(0deg)
    }

    to {
        bottom: 150%;
        transform: translateX(-50%) translateY(-100px) rotate(0deg)
    }
}

@keyframes lollipopSpin {
    from {
        transform: translateX(-50%) rotate(0deg)
    }

    to {
        transform: translateX(-50%) rotate(360deg)
    }
}

font-weight: 900;
    color: #fff;
    text-shadow: 0 0 5px #f0f, 0 0 10px #f0f, 0 0 5px #f0f, 0 0 7px #f0f;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3), 0 0 20px rgba(255, 0, 255, 0.5);

 

[T I H O N]

Вот баннеры

.gradientBanner {
    position: relative
}

.gradientBanner:after {
    content: '';
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: ;
    animation: animate-shine 3s ease-out infinite
}

@keyframes animate-shine {
    0% {
        opacity: .1;
        width: 0
    }

    50% {
        opacity: .5
    }

    100% {
        opacity: 0;
        width: 100%
    }
}

.gradientBanner {
    font-size: 80%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    padding: 1px 3px;
    border: 1px solid transparent;
    border-radius: 2px;
    text-align: center;
    display: inline-block
}

.legend {
    color: #fff;
    background: #8c5eff;
    border-color: #fff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.legend {
    color: #fff;
    background: #8c5eff;
    border-color: #fff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.legend {
    color: #fff;
    background: #8c5eff;
    border-color: #fff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.yspeshniy {
    color: #fff;
    background: #20aeb3;
    border-color: #fff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.specadm {
    color: #fff;
    background: #d80000;
    border-color: #a50000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.razrab {
    color: #fff;
    background: #1cb4d6;
    border-color: #1cb4d6;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.ga {
    color: #fff;
    background: #0a8208;
    border-color: #e83f3f;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.zga {
    color: #fff;
    background: #6DB36D;
    border-color: #55a154;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.redd {
    color: #fff;
    background: #d80000;
    border-color: #59a1ff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.mur {
    color: #fff;
    background: #396798;
    border-color: #396798;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.kur {
    color: #fff;
    background: #9676f5;
    border-color: #b459ff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.tech {
    color: #fff;
    background: #ff6f0f;
    border-color: #ff6f0f;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.ld {
    color: #fff;
    background: #74cfe8;
    border-color: #74cfe8;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.admin {
    color: #fff;
    background: #4284f5;
    border-color: #4284f5;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.admins {
    color: #fff;
    background: #f2b852;
    border-color: #326fa8;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.moder {
    color: #fff;
    background: #26bbed;
    border-color: #26bbed;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.kp {
    color: #000;
    background: #FDC000;
    border-color: #FDC000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.staff {
    color: #fff;
    background: black;
    border-color: black;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.piar {
    color: #fff;
    background: #f5a142;
    border-color: #f5a142;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.support {
    color: #fff;
    background: #a83c32;
    border-color: #a83c32;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.test {
    color: #000;
    background: #20DCD9;
    border-color: #20DCD9;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.rukds {
    color: #fff;
    background: #188EFF;
    border-color: #188EFF;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.gta {
    color: #fff;
    background: #ff6f0f;
    border-color: #ff6f0f;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.zgta {
    color: #fff;
    background: #f24444;
    border-color: #000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.pet {
    color: #fff;
    background: #ffcd00;
    border-color: #ffcd00;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.user {
    color: #fff;
    background: #ababab;
    border-color: #ababab;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.vet {
    color: #fff;
    background: #a408ff;
    border-color: #a408ff;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.blok {
    color: #fff;
    background: #ababab;
    border-color: #ababab;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.gradientBanner.red {
    box-shadow: 0px 0px 5px #f00;
    background-color: #ff0000;
    border-color: #ff0000;
    color: #fff
}

.gradientBanner.green {
    box-shadow: 0px 0px 5px #008000;
    background-color: green;
    border-color: green;
    color: #fff
}

.gradientBanner.yellow {
    box-shadow: 0px 0px 5px #fdc000;
    background-color: #Fdc000;
    border-color: #Fdc000;
    color: #fff
}

.gradientBanner.white {
    box-shadow: 0px 0px 5px #ababab;
    background-color: #ababab;
    border-color: #ababab;
    color: #fff
}

.gradientBanner.ber {
    box-shadow: 0px 0px 5px #20dcd9;
    background-color: #20DCD9;
    border-color: #20DCD9;
    color: #fff
}

.userBanner.userBanner--staff {
    display: none
}

.blog {
    color: #fff;
    background: #a8608e;
    border-color: #a8608e;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block
}

.dev_vinter_ruk {
    color: #fff;
    background: #d80000;
    border-color: #a50000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.dev_vinter_ruk::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(#fff 20%, transparent 20%),radial-gradient(#fff 20%, transparent 20%);
    background-size: 20px 20px;
    background-position: 0 0,10px 10px;
    animation: starsMove 5s linear infinite;
    opacity: 0.3;
    z-index: 0;
    pointer-events: none
}

@keyframes starsMove {
    from {
        background-position: 0 0,10px 10px
    }

    to {
        background-position: -40px -40px,-30px -30px
    }
}

.dev_vinter_dev {
    color: #00ffcc;
    background: #0d1b15;
    border-color: #00ffcc;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 2px 22px;
    border: 1px solid;
    border-radius: 4px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1;
    font-family: 'Courier New',monospace;
    box-shadow: 0 0 5px rgba(0,255,204,0.3),0 0 10px rgba(0,255,204,0.2),0 0 20px rgba(0,255,204,0.1);
    transition: all .3s ease
}

.dev_vinter_dev:hover {
    box-shadow: 0 0 10px rgba(0,255,204,0.6),0 0 20px rgba(0,255,204,0.4),0 0 30px rgba(0,255,204,0.3);
    transform: scale(1.05)
}

.dev_vinter_dev::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    right: -50%;
    bottom: -50%;
    background-image: linear-gradient(90deg, rgba(0,255,204,0.05) 1px, transparent 1px),linear-gradient(rgba(0,255,204,0.05) 1px, transparent 1px);
    background-size: 20px 20px;
    z-index: 0;
    opacity: 0.15;
    animation: gridMove 3s linear infinite;
    pointer-events: none
}

@keyframes gridMove {
    from {
        transform: translateX(0) translateY(0)
    }

    to {
        transform: translateX(20px) translateY(20px)
    }
}

.dev_vinter_dev::after {
    content: '0 1 [ ] { } = ; / \\ * & ^ % $ # @ !';
    position: absolute;
    top: -20px;
    left: 0;
    white-space: nowrap;
    font-family: monospace;
    font-size: 14px;
    color: rgba(0,255,204,0.2);
    animation: codeScroll 8s linear infinite;
    z-index: 0;
    pointer-events: none;
    letter-spacing: 1px
}

@keyframes codeScroll {
    from {
        transform: translateY(0)
    }

    to {
        transform: translateY(100px)
    }
}

@keyframes neonPulse {
    0%,100% {
        box-shadow: 0 0 5px rgba(0,255,204,0.6),0 0 10px rgba(0,255,204,0.4)
    }

    50% {
        box-shadow: 0 0 10px rgba(0,255,204,0.8),0 0 20px rgba(0,255,204,0.5)
    }
}

.dev_vinter_forum {
    color: #fff;
    background: linear-gradient(135deg, #a8608e, #7a3b7a);
    border-color: #7a3b7a;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.dev_vinter_vlad {
    color: #fff;
    background: linear-gradient(135deg, #f00, #f00);
    border-color: #ff0000;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.dev_vinter_forum::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='%23ffffff' opacity='0.3'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z'/%3E%3C/svg%3E");
    background-size: 40px 40px;
    background-repeat: repeat;
    animation: symbolsMove 5s linear infinite;
    opacity: 0.3;
    z-index: 0;
    pointer-events: none
}

.dev_vinter_vlad::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='%23ffffff' opacity='0.3'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z'/%3E%3C/svg%3E");
    background-size: 40px 40px;
    background-repeat: repeat;
    animation: symbolsMove 5s linear infinite;
    opacity: 0.3;
    z-index: 0;
    pointer-events: none
}

@keyframes symbolsMove {
    from {
        background-position: 0 0
    }

    to {
        background-position: -40px -40px
    }
}

.dev_vinter_vp {
    color: #fff;
    border: none;
    font-size: 75%;
    font-weight: 600;
    font-style: normal;
    padding: 1px 20px;
    border-radius: 4px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1;
    text-shadow: 0 0 5px #f0f,0 0 10px #f0f,0 0 20px #f0f,0 0 40px #f0f
}

.dev_vinter_vp::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    border: 2px solid transparent;
    background: linear-gradient(45deg, #f0f, #0ff, #f0f, #0ff);
    background-size: 400% 400%;
    border-radius: 10px;
    animation: edgeLight 3s infinite linear;
    z-index: -1;
    filter: blur(2px)
}

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

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

.dev_vinter_vp::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(circle, rgba(255,0,255,0.5) 10%, transparent 10%),radial-gradient(circle, rgba(0,255,255,0.5) 10%, transparent 10%);
    background-size: 50px 50px;
    background-position: 0 0,25px 25px;
    animation: particlesMove 6s linear infinite;
    opacity: 0.7;
    z-index: 0;
    pointer-events: none
}

@keyframes particlesMove {
    0% {
        transform: translate(0, 0)
    }

    100% {
        transform: translate(-25px, -25px)
    }
}

.dev_vinter_vp span {
    animation: neonText 2s infinite alternate
}

@keyframes neonText {
    0% {
        text-shadow: 0 0 5px #f0f,0 0 10px #f0f,0 0 20px #f0f,0 0 40px #f0f
    }

    100% {
        text-shadow: 0 0 10px #f0f,0 0 20px #f0f,0 0 40px #f0f,0 0 80px #f0f,0 0 120px #f0f
    }
}

.dev_vinter_vip {
    color: #fff;
    background: #ff6f61;
    border-color: #e04b3f;
    font-size: 75%;
    font-weight: 400;
    font-style: normal;
    padding: 1px 20px;
    border: 1px solid transparent;
    border-radius: 3px;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.dev_vinter_vip::before {
    content: '';
    position: absolute;
    bottom: -50px;
    left: 50%;
    transform: translateX(-50%);
    width: 15px;
    height: 35px;
    background: linear-gradient(to bottom, #ff005c 0%, #ff005c 60%, #d2691e 60%, #8b4513 100%);
    clip-path: polygon(50% 0%, 100% 50%, 100% 60%, 50% 100%, 0% 60%, 0% 50%);
    box-shadow: 0 0 6px rgba(255,255,255,0.4),inset 0 0 3px rgba(255,255,255,0.6);
    animation: moveUpDiagonal 5s linear infinite,lollipopSpin 5s linear infinite,lollipopShine 3s ease-in-out infinite;
    z-index: -1
}

@keyframes lollipopShine {
    0% {
        box-shadow: 0 0 6px rgba(255,255,255,0.4),inset 0 0 3px rgba(255,255,255,0.6)
    }

    50% {
        box-shadow: 0 0 9px rgba(255,255,255,0.6),inset 0 0 4px rgba(255,255,255,0.8)
    }

    100% {
        box-shadow: 0 0 6px rgba(255,255,255,0.4),inset 0 0 3px rgba(255,255,255,0.6)
    }
}

@keyframes moveUpDiagonal {
    from {
        bottom: -50px;
        transform: translateX(-50%) translateY(0) rotate(0deg)
    }

    to {
        bottom: 150%;
        transform: translateX(-50%) translateY(-100px) rotate(0deg)
    }
}

@keyframes lollipopSpin {
    from {
        transform: translateX(-50%) rotate(0deg)
    }

    to {
        transform: translateX(-50%) rotate(360deg)
    }
}

font-weight: 900;
    color: #fff;
    text-shadow: 0 0 5px #f0f, 0 0 10px #f0f, 0 0 5px #f0f, 0 0 7px #f0f;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3), 0 0 20px rgba(255, 0, 255, 0.5);

А kod 2 это че

 

[Mortis_Panarenka]

это код цвета баннера владелец

 

[Mortis_Panarenka]

может спасибо скажешь

 

[T I H O N]

Спасибо я просто проверял

 

[Mortis_Panarenka]

незачто