Своё

[html]

<style>

@import url('https://fonts.googleapis.com/css2?family=Alegreya:wght@400;700&display=swap');

.bg3-header {
--color: #b1a394;
--font-main: 'Alegreya';

position: relative;
width: 100%;
height: 700px;
background: url(https://forumstatic.ru/files/001c/a5/43/34540.png) no-repeat top center / cover;
overflow: hidden;
border-radius: 10px;
font-family: var(--font-main);
text-transform: none;
}

.bg3-header * {
box-sizing: border-box;
scrollbar-gutter: stable:
}

.bg3-header::selection {
color: var(--black);
background: var(--color)
}

.bg3-header *::-webkit-scrollbar {
width: 2px;
height: 2px;
}

.bg3-header *::-webkit-scrollbar-track {
background: transparent !important;
border-radius: 10px;
}

::-webkit-scrollbar-thumb {
background: #42352c !important;
border-radius: 10px;
}

.tabs-bg3 {
margin: auto;
position: relative;
height: 100%;
}

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

.nav-bg3 {
display: flex;
justify-content: center;
gap: 2px;
position: relative;
background-size: cover;
background-position: center;
border-radius: 8px 8px 0 0;
z-index: 5;
}

.nav-bg3::before,
.nav-bg3::after {
content: '';
position: relative;
top: 0px;
height: 55px;
width: 200px;
background-size: 100%;
}

.nav-bg3::before {
background-image: url(https://forumstatic.ru/files/001c/a5/43/78593.jpg);
right: 0px;
}
.nav-bg3::after {
background-image: url(https://forumstatic.ru/files/001c/a5/43/81103.jpg);
left: 0px;
}

.nav-bg3 label {
position: relative;
display: block;
color: var(--color);
text-shadow: 0 2px 3px black, 0 1px 3px black;
font-size: 14px;
letter-spacing: 1px;
text-align: center;
width: 165px;
height: 66px;
box-sizing: border-box;
padding-top: 30px;
background-image: url(https://forumstatic.ru/files/001c/a5/43/89878.png);
background-size: cover;
cursor: pointer;
border-radius: 4px;
transform-style: preserve-3d;
transition: all 0.3s;
}

.nav-bg3 label::before {
content: '';
position: absolute;
top: -8px;
left: 0;
z-index: -1;
transform: translateZ(-1px);
width: 100%;
border-radius: 10px;
height: 70px;
filter: hue-rotate(0deg) brightness(1) saturate(1) contrast(1);
background: radial-gradient(ellipse at 50% 103%, #615145 0%, #3c2f27 40%, #2e2621 49%, #000000 88%);
mask: linear-gradient(to top, black 67%, transparent 98%);
transition: 0.3s;
}

#tab1-bg3:checked ~ .nav-bg3 label[for="tab1-bg3"],
#tab2-bg3:checked ~ .nav-bg3 label[for="tab2-bg3"],
#tab3-bg3:checked ~ .nav-bg3 label[for="tab3-bg3"] {
transform: translateY(10px);
color: white;
}

#tab1-bg3:checked ~ .nav-bg3 label[for="tab1-bg3"]::before,
#tab2-bg3:checked ~ .nav-bg3 label[for="tab2-bg3"]::before,
#tab3-bg3:checked ~ .nav-bg3 label[for="tab3-bg3"]::before {
filter: hue-rotate(182deg) brightness(1.3) saturate(2.5) contrast(1);
}

.panels-bg3 {
padding: 0px;
width: 67%;
position: absolute;
right: 15px;
top: 95px;
bottom: 50px;
}

.panel-bg3 {
display: none;
animation: fadeEffect 0.5s;
color: #987e6d;
padding: 10px 20px 0 0;
height: 100%;
overflow: auto;
}

#tab1-bg3:checked ~ .panels-bg3 .panel-1,
#tab2-bg3:checked ~ .panels-bg3 .panel-2,
#tab3-bg3:checked ~ .panels-bg3 .panel-3 {
display: block;
}

@keyframes fadeEffect {
from {opacity: 0; transform: translateY(10px);}
to {opacity: 1; transform: translateY(0);}
}

div.bg3-greetings {
position: absolute;
width: 28%;
position: absolute;
left: 15px;
top: 95px;
bottom: 135px;
z-index: 3;
}

div.bg3-greetings img {
width: 100%;
position: absolute;
}

div.bg3-greetings img.bg3-gr-bottom {
bottom: 0px;
}

div.bg3-greetings div {
color: var(--color);
font-size: 14px;
line-height: 120%;
width: 83%;
padding-right: 3px;
margin: auto;
white-space: pre-line;
text-transform: none;
height: 72%;
position: absolute;
bottom: 40px;
overflow: auto;
left: calc(50% + 3px);
transform: translateX(-50%);
}

div.bg3-greetings hh5 {
display: block;
width: 100%;
height: 20px;
position: absolute;
color: black;
font-size: 16px;
font-weight: 700;
top: 27px;
text-align: center;
z-index: 5;
}

a.bg3-tg {
background: url(https://forumstatic.ru/files/001c/9e/b0/21634.png) no-repeat center;
position: absolute;
z-index: 5;
bottom: 50px;
left: 50px;
height: 32px;
width: 182px;
display: flex;
align-items: center;
justify-content: center;
color: var(--color);
font-size: 14px;
}

.panel-3 {
height: 100%;
padding: 10px 20px 0 0;
overflow: auto;
}

.panel-3 div {
display: flex;
flex-direction: column;
gap: 10px;
margin-bottom: 15px;
margin-left: 30px;
}

.panel-3 > div a {
margin-top: 5px;
color: #c9b89b;
font-size: 18px;
}

.panel-3 > div a {
color: var(--color)!important;
position: relative;
}

.panel-3 > div a::before {
content: '';
position: absolute;
width: 21px;
height: 21px;
left: -24px;
top: 2px;
background: url(https://forumstatic.ru/files/001c/9e/b0/17094.png) no-repeat center / 100%;
}
.panel-1 {
height: 100%;
overflow: auto;

}
.panel-1 ul {
height: 100%;
overflow: auto;
display: flex;
flex-direction: column;
gap: 15px;
list-style-type: disc;
padding-left: 25px;
font-size: 15px;
padding-right: 10px;
}
.panel-2 > div {
display: grid;
grid-template-columns: 1fr 10fr 1fr;
margin: 15px 20px;
position: relative;
}

.panel-2 > div img {
align-self: center;
width: 45px;
height: 45px;
}

.panel-2 > div img.bg3-av {
width: 60px;
height: 80px;
border-radius: 4px;
border: 2px solid var(--color);
object-fit: cover;
}

.panel-2 > div a {
margin-top: 5px;
margin-left: 15px;
color: #c9b89b;
font-size: 18px;
}
.panel-2 > div a {
color: var(--color)!important;
}

.panel-2 > div span {
display: block;
color: #7a7167;
font-size: 13px;
}

</style>

<hh5>WELCOME!</hh5>

<div> Привет, путник! Ты удачно прокинул кубик на Внимательность и нашел нас.

Мы - безумный каст Baldur's Gate 3. У нас тут своя атмосфера: Астарион точит клыки и сарказм, Карлах горит энтузиазмом (буквально), Лаэзель уже критикует твою боевую стойку, Уилл полирует репутацию Клинка Фронтира, Даммон пытается починить всё, что мы умудрились сломать, а Дурдж мучительно решает: спасти сегодня мир или просто пустить всех на фарш, потому что голоса в голове рассказали смешной анекдот. И да, за драмой следит Хаэр'Далис, который уже пишет пьесу о нашем грядущем апокалипсисе.

Располагайся у костра! Мы здесь, чтобы травить байки, делиться секретами и отвечать на твои вопросы. Хочешь узнать, как выжить в Подземье? Или кто все-таки ворует вино из припасов? Спрашивай смело, мы не кусаемся (ну, кроме одного бледного эльфа).

Главное правило: не корми медвесыча после полуночи и следи за своей личинкой. Добро пожаловать в отряд!
</div>

</div>

<a href='#' class='bg3-tg'> Telegram лагеря </a>

<div class="nav-bg3">
<label for="tab1-bg3"><i class="fa-solid fa-feather-pointed"></i> Решения </label>
<label for="tab2-bg3"><i class="fa-solid fa-bahai"></i> Участники </label>
<label for="tab3-bg3"><i class="fa-solid fa-fire-flame-curved"></i> Эпизоды</label>
</div>

<div class="panels-bg3">

<div class="panel-bg3 panel-1">
<ul>
<li> В лагере демократия. Ведёт квест тот, кто разбирается в теме. Какие-то квесты, особенно личные, народ будет проходить в одиночку или по двое-трое, а не фуллпати.</li>
<li> Мозги были размазаны по заливу.</li>
<li> Иллитидом стал Орфей.</li>
<li> Рощу друидов не вырезали, но Минтару только оглушили, она жива. Может присоединиться так или иначе, либо быть в антагонизме.</li>
<li> К отряду в начале первой главы присоединился Хаэр'Далис, бард.</li>
<li> Астарион желает убить своего создателя и получить полную свободу.</li>
<li> Урдж прикинулся неофитом ордена Баала, в одиночку встретился с Трибуналом через все ритуалы и ни с кем не поделился своими планами до последнего, до боя в храме. Папашу послал, но дедушка его спас. Остался немного на грани.</li>
<li> Карлах с Уиллом разбирались со всеми адскими вещами, прихватывая с собой подвернувшихся сопартийцев.</li>
<li> К отряду присоединился кузнец Даммон на этапе начала второй главы.</li>
<li> Лаэзель - принц кометы и ведёт свой народ к свободе. Яйцо спасено.</li>
<li> Думаю, в лагере есть и Шкряб, и медвесычёнок, и даже Лопата. Урдж однажды был замечен в игре со Шкрябом в "брось-принеси" человеческой кистью.</li>
</ul>
</div>

<div>
<img src='https://bg3.wiki/w/images/thumb/3/3b/Edward-vanderghote-astarion-portrait.png/234px-Edward-vanderghote-astarion-portrait.png' class='bg3-av'>
<a href='https://notacross.ru/viewtopic.php?id=1977#p294519'>Шарлатан <span>Астарион</span></a>
<img src='https://forumstatic.ru/files/001c/9e/b0/84609.webp'>
</div>

<div>
<img src='https://bg3.wiki/w/images/thumb/f/f4/Dammon.png/800px-Dammon.png' class='bg3-av'>
<a href='https://notacross.ru/viewtopic.php?id=1981#p295692'>Кузнец<span>Даммон</span></a>
<img src='https://forumstatic.ru/files/001c/9e/b0/23542.webp'>
</div>

<div>
<img src='https://upforme.ru/uploads/001c/57/ad/666/585893.png' class='bg3-av'>
<a href='https://notacross.ru/viewtopic.php?id=1991#p297436'>Мировой бард<span>Хаэр'Далис</span></a>
<img src='https://forumstatic.ru/files/001c/9e/b0/43143.webp'>
</div>

<div>
<img src='https://bg3.wiki/w/images/thumb/2/2a/Edward-vanderghote-karlach.jpg/375px-Edward-vanderghote-karlach.jpg' class='bg3-av'>
<a href='https://notacross.ru/viewtopic.php?id=1907#p284641'>Скиталец <span>Карлах</span></a>
<img src='https://forumstatic.ru/files/001c/9e/b0/74369.webp'>
</div>

<div>
<img src='https://bg3.wiki/w/images/8/86/Portrait_Lae%27zel.png' class='bg3-av'>
<a href='https://notacross.ru/viewtopic.php?id=1929#p287637'>Солдат<span>Лаэзель</span></a>
<img src='https://forumstatic.ru/files/001c/9e/b0/46234.webp'>
</div>

<div>
<img src='https://forumstatic.ru/files/001c/9e/b0/11961.jpg' class='bg3-av'>
<a href='https://notacross.ru/viewtopic.php?id=1906#p284634'>Жертва одержимости <span>Тиас</span></a>
<img src='https://forumstatic.ru/files/001c/9e/b0/22639.webp'>
</div>

<div>
<img src='https://bg3.wiki/w/images/thumb/f/fc/Edward-vanderghote-wyll.jpeg/375px-Edward-vanderghote-wyll.jpeg' class='bg3-av'>
<a href='https://notacross.ru/viewtopic.php?id=1915#p285410'>Народный герой <span>Уилл</span></a>
<img src='https://forumstatic.ru/files/001c/9e/b0/20982.webp'>
</div>

</div>

<style>

</style>

<div>
<a href='https://notacross.ru/viewtopic.php?id=1908#p284654'>Killing Strangers</a>
<span>Карлах, Дурдж</span>
<desc>Бардесса Альфира была убита самым беспощадным образом. Осталось выяснить кто это сделал, ещё и непосредственно в лагере. Вот кто, а?</desc>
</div>

<div>
<a href='https://notacross.ru/viewtopic.php?id=1997#p297826'>Target Audience</a>
<span>Хаэр'далис, Дурдж, Лаэзель, Астарион</span>
<desc>Путешествие по планам для легендарного барда вылилось в попадание на наутилоид, правда, благо, без личинки в голове. Он изучил отряд, собравшийся из заражённых отщепенцев и решил к ним присоединиться.</desc>
</div>

<div>
<a href='https://notacross.ru/viewtopic.php?id=1920#p285894'>We Are Chaos</a>
<span>Астарион, Дурдж</span>
<desc>Астарион и Тиас пошли выяснить точную дорогу к Яслям гитьянки и узнать о возможных угрозах в пути. Главной угрозой для всего оказались они сами.</desc>
</div>

<div>
<a href='https://notacross.ru/viewtopic.php?id=1931#p288009'>(S)aint</a>
<span>Лаэзель, Дурдж</span>
<desc>Лаэзель и Тиас довольно далеко забрались вдвоём в поисках верной и безопасной дороги. Остальная часть отряда отставала от них на сутки, потому что следовало закончить некоторые дела в роще друидов. Встреча с гитиянки, особенно после того, как Тиас и Астарион заметили красного дракона, стала не просто желанной, а необходимой. Ведь если верить Лаэзель — это их единственный способ избавиться от личинок иллитидов в своих головах. Вот только тропинки к цели очень уж запутанные...</desc>
</div>

<div>
<a href='https://notacross.ru/viewtopic.php?id=1983#p295793'>Four Rusted Horses</a>
<span>Даммон, Дурдж, Лаэзель</span>
<desc>Начало второй главы. Кузнец Даммон, уже дважды спасавший своим мастерством жизнь Карлах, отлаживая её движитель, решил присоединиться к отряду на постоянной основе. Но для начала до лагеря надо добраться сквозь проклятые земли...</desc>
</div>

<div>
<a href='https://notacross.ru/viewtopic.php?id=1985#p296189'> No Funeral Without Applause</a>
<span>Даммон, Дурдж</span>
<desc>Первая часть третьей главы. Кузнец Даммон решил взять в подвале "Эльфийской песни" банку с солениями, но нашёл там очень мёртвый труп и Тиаса с отрезанной кистью в руках. Но даже это стало только началом приключений.</desc>
</div>

</div></div></div></div></section>[/html][hideprofile]

шаблон для добавления эпизода

Заодно просто укажите между какими эпизодами вставить ваш, потому что они в порядке очерёдности.
Код:
<div><a href='https://ссылка_на_эпизод'> Название эпизода</a>
<span>Участник, Участник</span>
<desc>Описание эпизода. В начале таймлайн в пару слов для ориентира.</desc>
</div>

Test

Меню навигации

Пользовательские ссылки

Объявление

Информация о пользователе

Своё

Сообщений 1 страница 2 из 2

Поделиться12026-01-31 13:39:05

Поделиться22026-01-31 14:16:08