Баннеры вроде с King Russia

Добро пожаловать!

Зарегистрировавшись у нас, вы сможете обсуждать, делиться и отправлять личные сообщения другим участникам нашего сообщества.

Зарегистрироваться!
  • Если Вы желаете помогать развитию проекта, готовы заполнять раздел(-ы) и подсказывать другим пользователям на портале, есть возможность попасть в команду редакторов. Для этого следует обратиться в техническую поддержку
Пользователь
Регистрация
17 Май 2023
Сообщения
44
Ребята сливаю для вас баннеры вроде бы с форума king Russia (автор я)
.banner {
width: 300px;
height: 100px;
display: flex;
justify-content: center;
align-items: center;
color: white;
font-size: 20px;
font-weight: bold;
border-radius: 15px;
margin: 20px auto;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
animation: glow 3s ease-in-out infinite;
transition: all 0.3s ease;
}
.director {
background: #FF0000;
border: 2px solid rgba(255, 255, 255, 0.5);
animation: redGlow 3s ease-in-out infinite;
}
.successful-user {
background: #FF69B4;
border: 2px solid rgba(255, 255, 255, 0.5);
animation: pinkGlow 3s ease-in-out infinite;
}
@keyframes glow {
0%, 100% {
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
50% {
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4);
}
}
@keyframes redGlow {
0%, 100% {
box-shadow: 0 8px 16px rgba(255, 0, 0, 0.4);
}
50% {
box-shadow: 0 12px 24px rgba(255, 0, 0, 0.8);
}
}
@keyframes pinkGlow {
0%, 100% {
box-shadow: 0 8px 16px rgba(255, 105, 180, 0.4);
}
50% {
box-shadow: 0 12px 24px rgba(255, 105, 180, 0.8);
}
}
.banner:hover {
transform: scale(1.1);
box-shadow: 0 16px 32px rgba(0, 0, 0, 0.6);
}

Напишите как вам баннер и реакцию плиз
 

Вложения

  • Screenshot_2025-02-25-15-00-47-993_com.yandex.browser-edit.jpg
    Screenshot_2025-02-25-15-00-47-993_com.yandex.browser-edit.jpg
    128.8 KB · Просмотры: 34
777
Профессионал
Регистрация
2 Ноя 2024
Сообщения
1,178
похожи с предыдущими баннерами которые ты сливал, но опять же, хотелось кастомных баннеров, а не обычных от хенфоро
 
Пользователь
Регистрация
13 Окт 2024
Сообщения
144
Ребята сливаю для вас баннеры вроде бы с форума king Russia (автор я)
.banner {
width: 300px;
height: 100px;
display: flex;
justify-content: center;
align-items: center;
color: white;
font-size: 20px;
font-weight: bold;
border-radius: 15px;
margin: 20px auto;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
animation: glow 3s ease-in-out infinite;
transition: all 0.3s ease;
}
.director {
background: #FF0000;
border: 2px solid rgba(255, 255, 255, 0.5);
animation: redGlow 3s ease-in-out infinite;
}
.successful-user {
background: #FF69B4;
border: 2px solid rgba(255, 255, 255, 0.5);
animation: pinkGlow 3s ease-in-out infinite;
}
@keyframes glow {
0%, 100% {
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
50% {
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4);
}
}
@keyframes redGlow {
0%, 100% {
box-shadow: 0 8px 16px rgba(255, 0, 0, 0.4);
}
50% {
box-shadow: 0 12px 24px rgba(255, 0, 0, 0.8);
}
}
@keyframes pinkGlow {
0%, 100% {
box-shadow: 0 8px 16px rgba(255, 105, 180, 0.4);
}
50% {
box-shadow: 0 12px 24px rgba(255, 105, 180, 0.8);
}
}
.banner:hover {
transform: scale(1.1);
box-shadow: 0 16px 32px rgba(0, 0, 0, 0.6);
}

Напишите как вам баннер и реакцию плиз
Ладно
 
Регистрация
27 Окт 2024
Сообщения
248
ку это не их баннеры вот их баннеры

CSS:
a.bb-code-href-button {
    border: 1px solid transparent;
    -webkit-transition: background-color .2s ease;
    transition: background-color .2s ease;
    font-size: 14px;
    font-weight: 600;
    border-radius: 4px;
    padding-top: 0;
    padding-right: 10px;
    padding-bottom: 0;
    padding-left: 10px;
    text-align: center;
    outline: none;
    line-height: 36px;
    height: 36px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-sizing: content-box;
    -webkit-appearance: none;
    will-change: box-shadow;
    transition: all .3s cubic-bezier(.25, .8, .25, 1);
    white-space: nowrap;
    text-decoration: none !important;
    vertical-align: bottom;
    color: #fff;
    background-color: #7c7771;
    border-color: #908b86;
    display: inline-block;
    font: normal normal normal 18px/1 "Material Design Icons";
    font-size: 110%;
    font-weight: normal;
    line-height: inherit;
    width: auto;
    border: none;
    padding: 0px 4px;
    margin: 3px 6px 4px 0;
    border-radius: 2px;
    box-shadow: 1px 1px #dfdfdf,2px 2px #6c6666
}

a.bb-code-href-button.button--splitTrigger>.button-text {
    border-right-color: #89847e
}

a.bb-code-href-button.button--splitTrigger>.button-menu {
    border-left-color: #6f6a65
}

a.bb-code-href-button:hover,a.bb-code-href-button:active,a.bb-code-href-button:focus {
    background-color: #96836c
}

a.bb-code-href-button:before {
    content: "\f360";
    display: inline-block;
    text-align: center
}

a.bb-code-href-button:before {
    padding: 0 4px
}

a.bb-code-href-button:hover {
    color: #b0babc;
    background-color: #504d4a;
    border-color: #65615e;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

a.bb-code-href-button:hover.button--splitTrigger>.button-text {
    border-right-color: #5d5a56
}

a.bb-code-href-button:hover.button--splitTrigger>.button-menu {
    border-left-color: #43403e
}

a.bb-code-href-button:hover:hover,a.bb-code-href-button:hover:active,a.bb-code-href-button:hover:focus {
    background-color: #655749
}

.f4 {
    background: #14c84b;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.f3 {
    background: #000000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.f2 {
    background: #88ecdf;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.f1 {
    background: #9e18ff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.prmanager {
    background: #642CD0;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.moroz {
    background: #ff0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.ozga {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.mkur {
    background: #ff0000;
    color: white;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.modr {
    background: #F08D8D;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.vklad {
    background: #c636ff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.zgt {
    background: #0A8B94;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.pdr {
    background: #0A8B94;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.sliva {
    background: #eb2f90;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.Pod {
    background: #49BFBF;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.legend {
    background: #c636ff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.forum {
    color: white;
    background: #FF18E2;
    text-align: center;
    font-size: 87%;
    font-style: normal;
    border: none;
    border-radius: 10px;
    padding: 1px 10px 3px
}

.gltest {
    background: #caca3f;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.sist {
    background: #57CDD6;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.zga {
    background: #6DB36D;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.mlmoder {
    background: #87ceeb;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.stmoder {
    background: #87ceeb;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.zgta {
    background: #FF4D00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.techadm {
    background: #FF4D00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.adm {
    background: #ffcc66;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.stadm {
    background: #ffcc66;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.glavadm {
    background: #008000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.razrab {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.dima {
    background: #ff6b81;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.vlad {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.glavsled {
    background: #004eff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.zamglavsled {
    background: #004eff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.lider {
    background: #ffbf00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.kur {
    background: #9676f5;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.rykvod {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.userBanner.userBanner--staff {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.pomtech {
    background: #FF4D00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server1a {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server2a {
    background: #008000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server3l {
    background: #004eff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server3a {
    background: #004eff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server4a {
    background: #ffcb00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server2l {
    background: #008000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server1l {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.ban {
    background: url(https://svgshare.com/i/1BSc.svg);
    width: 139px;
    height: 35px;
    font-size: 0px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border: none
}

.play {
    background: #808080;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.specadm {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.button.button--cta,button.button a.button.button--cta {
    color: #fff;
    background: #FFC618;
    border: none;
    border-color: #e14f4d
}

.p-nav-list .p-navEl.is-selected {
    color: #FFC618;
    font-weight: 600;
    background: #42464d
}

.blockMessage.blockMessage--error {
    border-left: 2px solid #c84448;
    background: #2d3238;
    color: #c84448
}

.block-rowMessage.block-rowMessage--warning {
    border-left: 2px solid #dcda54;
    background: #383c42;
    color: white
}

.block-container .uix_newIndicator {
    font-size: 12px;
    color: #fff;
    background: #FFC618;
    border-radius: 4px;
    padding-top: 1px;
    padding-right: 4px;
    padding-bottom: 1px;
    padding-left: 4px
}

.uix_fabBar .p-title-pageAction .button {
    border-radius: 100%;
    height: 60px;
    width: 60px;
    padding: 0;
    font-size: 0;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 10px 0px rgba(0,0,0,0.14),0 1px 18px 0px rgba(0,0,0,0.12),0 3px 5px 0 rgba(0,0,0,0.2);
    background: #FFC618;
    color: #fff
}

.test {
    color: #00FF1F;
    background: black;
    font-size: 12px;
    font-weight: bold;
    color: #ffffff;
    background: #008000;
    font-size: 11px;
    font-weight: italic
}

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

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

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

.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
}

.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
}
 
Редактор
Регистрация
4 Ноя 2024
Сообщения
295
ку это не их баннеры вот их баннеры

CSS:
a.bb-code-href-button {
    border: 1px solid transparent;
    -webkit-transition: background-color .2s ease;
    transition: background-color .2s ease;
    font-size: 14px;
    font-weight: 600;
    border-radius: 4px;
    padding-top: 0;
    padding-right: 10px;
    padding-bottom: 0;
    padding-left: 10px;
    text-align: center;
    outline: none;
    line-height: 36px;
    height: 36px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-sizing: content-box;
    -webkit-appearance: none;
    will-change: box-shadow;
    transition: all .3s cubic-bezier(.25, .8, .25, 1);
    white-space: nowrap;
    text-decoration: none !important;
    vertical-align: bottom;
    color: #fff;
    background-color: #7c7771;
    border-color: #908b86;
    display: inline-block;
    font: normal normal normal 18px/1 "Material Design Icons";
    font-size: 110%;
    font-weight: normal;
    line-height: inherit;
    width: auto;
    border: none;
    padding: 0px 4px;
    margin: 3px 6px 4px 0;
    border-radius: 2px;
    box-shadow: 1px 1px #dfdfdf,2px 2px #6c6666
}

a.bb-code-href-button.button--splitTrigger>.button-text {
    border-right-color: #89847e
}

a.bb-code-href-button.button--splitTrigger>.button-menu {
    border-left-color: #6f6a65
}

a.bb-code-href-button:hover,a.bb-code-href-button:active,a.bb-code-href-button:focus {
    background-color: #96836c
}

a.bb-code-href-button:before {
    content: "\f360";
    display: inline-block;
    text-align: center
}

a.bb-code-href-button:before {
    padding: 0 4px
}

a.bb-code-href-button:hover {
    color: #b0babc;
    background-color: #504d4a;
    border-color: #65615e;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

a.bb-code-href-button:hover.button--splitTrigger>.button-text {
    border-right-color: #5d5a56
}

a.bb-code-href-button:hover.button--splitTrigger>.button-menu {
    border-left-color: #43403e
}

a.bb-code-href-button:hover:hover,a.bb-code-href-button:hover:active,a.bb-code-href-button:hover:focus {
    background-color: #655749
}

.f4 {
    background: #14c84b;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.f3 {
    background: #000000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.f2 {
    background: #88ecdf;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.f1 {
    background: #9e18ff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.prmanager {
    background: #642CD0;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.moroz {
    background: #ff0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.ozga {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.mkur {
    background: #ff0000;
    color: white;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.modr {
    background: #F08D8D;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.vklad {
    background: #c636ff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.zgt {
    background: #0A8B94;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.pdr {
    background: #0A8B94;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.sliva {
    background: #eb2f90;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.Pod {
    background: #49BFBF;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.legend {
    background: #c636ff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.forum {
    color: white;
    background: #FF18E2;
    text-align: center;
    font-size: 87%;
    font-style: normal;
    border: none;
    border-radius: 10px;
    padding: 1px 10px 3px
}

.gltest {
    background: #caca3f;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.sist {
    background: #57CDD6;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.zga {
    background: #6DB36D;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.mlmoder {
    background: #87ceeb;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.stmoder {
    background: #87ceeb;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.zgta {
    background: #FF4D00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.techadm {
    background: #FF4D00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.adm {
    background: #ffcc66;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.stadm {
    background: #ffcc66;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.glavadm {
    background: #008000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.razrab {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.dima {
    background: #ff6b81;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.vlad {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.glavsled {
    background: #004eff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.zamglavsled {
    background: #004eff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.lider {
    background: #ffbf00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.kur {
    background: #9676f5;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.rykvod {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.userBanner.userBanner--staff {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.pomtech {
    background: #FF4D00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server1a {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server2a {
    background: #008000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server3l {
    background: #004eff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server3a {
    background: #004eff;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server4a {
    background: #ffcb00;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server2l {
    background: #008000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.server1l {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.ban {
    background: url(https://svgshare.com/i/1BSc.svg);
    width: 139px;
    height: 35px;
    font-size: 0px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border: none
}

.play {
    background: #808080;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.specadm {
    background: #FF0000;
    font-size: 75%;
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    padding: 1px 10px;
    text-align: center;
    display: inline-block;
    border-radius: 8px
}

.button.button--cta,button.button a.button.button--cta {
    color: #fff;
    background: #FFC618;
    border: none;
    border-color: #e14f4d
}

.p-nav-list .p-navEl.is-selected {
    color: #FFC618;
    font-weight: 600;
    background: #42464d
}

.blockMessage.blockMessage--error {
    border-left: 2px solid #c84448;
    background: #2d3238;
    color: #c84448
}

.block-rowMessage.block-rowMessage--warning {
    border-left: 2px solid #dcda54;
    background: #383c42;
    color: white
}

.block-container .uix_newIndicator {
    font-size: 12px;
    color: #fff;
    background: #FFC618;
    border-radius: 4px;
    padding-top: 1px;
    padding-right: 4px;
    padding-bottom: 1px;
    padding-left: 4px
}

.uix_fabBar .p-title-pageAction .button {
    border-radius: 100%;
    height: 60px;
    width: 60px;
    padding: 0;
    font-size: 0;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 10px 0px rgba(0,0,0,0.14),0 1px 18px 0px rgba(0,0,0,0.12),0 3px 5px 0 rgba(0,0,0,0.2);
    background: #FFC618;
    color: #fff
}

.test {
    color: #00FF1F;
    background: black;
    font-size: 12px;
    font-weight: bold;
    color: #ffffff;
    background: #008000;
    font-size: 11px;
    font-weight: italic
}

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

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

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

.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
}

.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
}
.pgreen, .porange, .pred, .ypred, .bpred - эти классы используются у них для префиксов. Вот целый пак баннеров, которые они используют на своем форуме:
Less:
.userBanner
{
    font-size: 11px;
    padding: 1px 10px;
    border-radius: 8px;
    color: white;
    
    &.f4
    {
        background: #14c84b;
    }
    
    &.f3
    {
         background: #000000;
    }
    
    &.f2
    {
        background: #88ecdf;
    }
    
    &.f1
    {
        background: #9e18ff;
    }
    
    &.prmanager
    {
        background: #642CD0;
    }
    
    &.moroz
    {
        background: #ff0000;
    }
    
    &.ozga
    {
        background: #FF0000;
    }
    
    &.mkur
    {
        background: #ff0000;
    }
    
    &.modr
    {
        background: #F08D8D;
    }
    
    &.vklad
    {
        background: #c636ff;
    }
    
    &.zgt
    {
        background: #0A8B94;
    }
    
    &.pdr
    {
        background: #0A8B94;
    }
    
    &.sliva
    {
        background: #eb2f90;
    }
    
    &.Pod
    {
        background: #49BFBF;
    }
    
    &.legend
    {
        background: #c636ff;
    }
    
    &.forum
    {
        font-size: 87%;
        background: #FF18E2;
        padding: 1px 10px 3px;
    }
    
    &.gltest
    {
        background: #caca3f;
    }
    
    &.sist
    {
        background: #57CDD6;
    }
    
    &.zga
    {
        background: #6DB36D;
    }
    
    &.mlmoder
    {
        background: #87ceeb;
    }
    
    &.stmoder
    {
        background: #87ceeb;
    }
    
    &.zgta
    {
        background: #FF4D00;
    }
    
    &.techadm
    {
        background: #FF4D00;
    }
    
    &.adm
    {
        background: #ffcc66;
    }
    
    &.stadm
    {
        background: #ffcc66;
    }
    
    &.glavadm
    {
        background: #008000;
    }
    
    &.razrab
    {
        background: #FF0000;
    }
    
    &.dima
    {
        background: #ff6b81;
    }
    
    &.vlad
    {
        background: #FF0000;
    }
    
    &.glavsled
    {
        background: #004eff;
    }
    
    &.zamglavsled
    {
        background: #004eff;
    }
    
    &.lider
    {
        background: #ffbf00;
    }
    
    &.kur
    {
        background: #9676f5;
    }
    
    &.rykvod
    {
        background: #FF0000;
    }
    
    &.userBanner--staff
    {
        background: #FF0000;
    }
    
    &.pomtech
    {
        background: #FF4D00;
    }
    
    &.server1a
    {
        background: #FF0000;
    }
    
    &.server2a
    {
        background: #008000;
    }
    
    &.server3l
    {
        background: #004eff;
    }
    
    &.server3a
    {
        background: #004eff;
    }
    
    &.server4a
    {
        background: #ffcb00;
    }
    
    &.server2l
    {
        background: #008000;
    }
    
    &.server1l
    {
        background: #FF0000;
    }
    
    &.play
    {
        background: #808080;
    }
    
    &.specadm
    {
        background: #FF0000;
    }
}
1740593479351.png
 
Сверху