<!--HTML-->
<div id="main-bank">

 <div class="tabs-bank">
   <input type="radio" name="tab-bank" id="tab-bank-1"  value="" checked>
    <label for="tab-bank-1">Начало</label>

    <input type="radio" name="tab-bank" id="tab-bank-2" value="">
    <label for="tab-bank-2">Время на форуме</label>

    <input type="radio" name="tab-bank" id="tab-bank-3" value="">
    <label for="tab-bank-3">Таблица</label>

 <input type="radio" name="tab-bank" id="tab-bank-4" value="">
    <label for="tab-bank-4">Посты</label>

        <input type="radio" name="tab-bank" id="tab-bank-5" value="">
    <label for="tab-bank-5">Активность</label>

<div id="start">
<start>Заполненная анкета: 100$</start>
<start>Заполненная анкета на нужного: 150$</start>
<start>Оформленные отношения: 5$</start>
<start>Оформленная хронология: 5$</start>
</div>


<div id="time-times">
<start>За месяц с даты регистрации: 50$</start>
<start>За полгода с даты регистрации: 100$</start>
<start>За каждый год с даты регистрации: 500$</start>
<start>За каждые 24 часа [Провел на форуме]: 20$</start>

<start>Подача заявки на нужного: 10$</start>
<start>Хотим видеть: 5$</start>
<start>Приведи друга: 20$</start>
<start>Приведи 3-х друзей [после принятия их анкет]: 100$</start>
</div>

<div id="active-table">
<start>Активист недели: 10$</start>
<start>Эпизод недели: 20$</start>
<start>Дуэт недели: 10$</start>
<start>Пост недели: 20$</start>
</div>

<div id="posts">
<start>Создание эпизода: 20$</start>
<start>Первый пост: 20$</start>
<start>Закрытый эпизод: 30$</start>
<start>Пост от 2 001 до 3 000 символов: 30$</start>
<start>Пост от 3 001 до 4 000 символов: 100$</start>
<start>Пост от 4 001 до 5 000 символов: 200$</start>
<start>Пост от 5 001 до 6 000 символов: 300$</start>
<start>Пост от 6 001 до 7 000 символов: 400$</start>
<start>Пост от 7 001 до 8 000 символов: 500$</start>
<start>Пост от 8 001 до 9 000 символов: 600$</start>
<start>Пост от 9 001 до 10 000 символов: 700$&nbsp;&nbsp;&nbsp;<span style="font-size: 12px; user-select: none;" title="И далее по той же системе до бесконечности">⚠</span></start>
</div>

<div id="active">
<start>Один уникальный аватар в общей галерее: 20$</start>
<start>Графический комплект в подарок: 60$</start>
<start>Создание личной темы: 20$</start>
<start>Один закрытый уровень в игровой системе: 50$</start>
<start>Одно выполненное игровое задание: 20$</start>
<start>Попадание в номер газеты: 20$</start>

<start>Создание соцсети: 20$</start>
<start>Один пост в соцсети: 10$</start>
<start>Участие в марафоне — один пост в соцсети: 30$</start>

<start>Каждые 250 сообщений: 50$</start>
<start>Каждые 250 оставленных плюсов: 40$</start>
<start>Каждые 250 полученных плюсов: 30$</start>
<start>Один пост с рекламой: 5$</start>
<start>Один голос / клик в топе с отметкой в теме: 10$</start>
<start>Один отзыв в топе: 50$</start>

<start>Пополнение фонда форума:
1 кредит - 10$&nbsp;&nbsp;&nbsp;<span style="font-size: 12px; user-select: none;" title="полученные средства будут использоваться на отключение рекламы и продвижение ролевой">⚠</span></start>
<start>100 баллов - 10$&nbsp;&nbsp;&nbsp;<span style="font-size: 12px; user-select: none;" title="менее актуально, т.к. реклама отключается только за кредиты, а эти две валюты между собой не конвертируются">⚠</span></start> 
</div>

</div>
</div>


<div class="attt">
<span class="attention">⚠&nbsp;Перевод денежных средств с профиля на профиль комиссией не облагается&nbsp;⚠</span></div>
<strong class="legend"><a href="javascript://" onclick="select_text($(this).parent().next().find('pre').get(0));return!1"><button class="code-bank">забрать деньги</button></a></strong><div style="font-size: 0px"><pre>— за что получаем деньги
— доказательства (ссылка, скрин и тд)
— было + начисляем = <span>[</span>b<span>]</span>стало<span>[</span>/b<span>]</span></pre></div>

<style>

#main-bank {
background: url(https://i.imgur.com/Rl9ms1d.png);
    background-size: 100%;
    width: 850px;
    height: 585px;
    margin-top: -10px;
}

.attention {
position: relative;
    top: -137px;
    left: 250px;
    text-transform: uppercase;
    font-size: 9px!important;
    color: #f3f3f3;
    width: 340px!important;
}

.tabs-bank>input[type="radio"] {
display: none;
}

.tabs-bank>div {
display: none;
padding: 10px 15px;
font-size: 16px;
}

#tab-bank-1:checked~#start,
#tab-bank-2:checked~#time-times,
#tab-bank-3:checked~#active-table, 
#tab-bank-4:checked~#posts,
#tab-bank-5:checked~#active {
display: block;
}

.tabs-bank>label {
padding: 8px;
    user-select: none;
    font-size: 12.5px;
    font-family: Roboto Condensed;
    color: #f3f3f3;
    text-transform: uppercase;
    line-height: 1.5;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
    cursor: pointer;
    top: 95px;
    left: 220px;
    position: relative;
    text-shadow: 0px 0px 3px #ffffff99;
    border-bottom: 2px solid white;
}

.tabs-bank>label:not(:first-of-type) {
}

.tabs-bank>input[type="radio"]:checked+label {
background: #ffffff3b;
}

.tabs-bank>label:hover {
background: #ffffff3b;
}

#start, #time-times, #active-table, #active {
position: relative;
    top: 130px;
    left: 130px;
    width: 400px;
}

#posts {
position: relative;
    top: 130px;
    left: 130px;
    width: 400px;
    height: 275px;
    overflow: auto;
    padding-right: 190px;
}

#active {
    position: relative;
    top: 130px;
    left: 130px;
    width: 400px;
    height: 275px;
    overflow: auto;
    padding-right: 190px;
}

start {
    display: flex;
    margin-bottom: 10px!important;
    background: #9f5029ad;
    color: #f3f3f3;
    font-size: 12px;
    text-shadow: 0 0 3px #ffffffc2;
    padding: 4px;
    width: 565px;
}

#active::-webkit-scrollbar              { width: 5px;  }
#active::-webkit-scrollbar-track        { background-color: #da8155; }
#active::-webkit-scrollbar-thumb        { background-color:  #914825; }

#posts::-webkit-scrollbar              { width: 5px;  }
#posts::-webkit-scrollbar-track        { background-color: #da8155; }
#posts::-webkit-scrollbar-thumb        { background-color:  #914825; }

.code-bank {
width: 150px;
    position: relative;
    margin-left: 360px;
    top: -120px;
    background-color: #da8155;
    color: #965536!important;
    text-transform: uppercase;
    padding: 5px 15px 5px 15px;
    font-size: 11px;
    border: none;
    outline: none;
    font-weight: bold;
    cursor: pointer;
    letter-spacing: 0.8px;
}

.code-bank:hover {
    background-color: #657163;
    color: #f3f3f3!important;
}

.code-bank:active {
background-color: #f3f3f3;
    color: #da8155!important;
}

.attt {width: 440px;}

</style>