[html]<!-- Стиль для вкладок в постах (done by Kolobdur) -->
<style>
.tablet {
background-image: url(https://forumupload.ru/uploads/001b/ce/b4/4/104993.png);
width: 700px;
height: 920px;
margin-left: 20px;
}
/* Строка имени */
.stim {
width: 578px;
border: 1px;
border-color: #000;
background-color: #959D9F;
font-family: Oswald;
text-align: center;
position: absolute;
margin-top: 40px;
margin-left: 55px;
text-transform: uppercase;
}
.tabbed > input {
display: none;
}
.tabbed > label {
width: 100px;
margin-top: 110px;
margin-left: 43px;
margin-bottom: -90px;
display: block;
padding-top: 10px;
padding-left: 5px;
padding-right: 5px;
font-family: Oswald;
text-size: 20px;
text-transform: uppercase;
}
.tabbed > label:not(.nav-top-start):not(.nav-top-end):not(.nav-bottom-start):not(.nav-bottom-end) {cursor: pointer;z-index: 1;}
/* Оформление */
/* Оформление неактивного переключателя */
.tabbed > label:not(.nav-top-start):not(.nav-top-end):not(.nav-bottom-start):not(.nav-bottom-end) {
background: transparent;
color: #191970;
height: 30px;
}
/* Оформление активного переключателя и при наведении */
.tabbed > label:not(.nav-top-start):not(.nav-top-end):not(.nav-bottom-start):not(.nav-bottom-end):hover,
.tabbed > input:checked + label {
background: #A02223 !important;
color: azure !important;
}
/* Оформление поля с контентом */
.tabs-body {
background: transparent;
color: #000;
}
/* Даем имена переключателям и полю с контентом */
/* Имя поля с контентом */
.tabs-body {grid-area: tabs-body;}
/* Имена переключателей слева */
#nav-left-1 {grid-area: nav-left-1;}
#nav-left-2 {grid-area: nav-left-2;}
#nav-left-3 {grid-area: nav-left-3;}
#nav-left-4 {grid-area: nav-left-4;}
#nav-left-5 {grid-area: nav-left-5;}
#nav-left-6 {grid-area: nav-left-6;}
#nav-left-7 {grid-area: nav-left-7;}
#nav-left-8 {grid-area: nav-left-8;}
#nav-left-9 {grid-area: nav-left-9;}
#nav-left-10 {grid-area: nav-left-10;}
.tabs-body {
width: auto;
position: relative;
}
.tabs-body > div {
position: absolute;
top: 0;
left: 0;
line-height: 1.4em;
opacity: 0;
width: auto;
height: 726px;
padding: 10px;
z-index: 0;
margin-top: 110px;
margin-right: 55px;
text-align: justify;
overflow: auto;
}
/* Переключатели */
/* Слева */
#nav-left-1:checked ~ .tabs-body > .body-left-1,
#nav-left-2:checked ~ .tabs-body > .body-left-2,
#nav-left-3:checked ~ .tabs-body > .body-left-3,
#nav-left-4:checked ~ .tabs-body > .body-left-4,
#nav-left-5:checked ~ .tabs-body > .body-left-5,
#nav-left-6:checked ~ .tabs-body > .body-left-6,
#nav-left-7:checked ~ .tabs-body > .body-left-7,
#nav-left-8:checked ~ .tabs-body > .body-left-8,
#nav-left-9:checked ~ .tabs-body > .body-left-9,
#nav-left-10:checked ~ .tabs-body > .body-left-10,
/* Справа */
#nav-right-1:checked ~ .tabs-body > .body-right-1,
#nav-right-2:checked ~ .tabs-body > .body-right-2,
#nav-right-3:checked ~ .tabs-body > .body-right-3,
#nav-right-4:checked ~ .tabs-body > .body-right-4,
#nav-right-5:checked ~ .tabs-body > .body-right-5,
#nav-right-6:checked ~ .tabs-body > .body-right-6,
#nav-right-7:checked ~ .tabs-body > .body-right-7,
#nav-right-8:checked ~ .tabs-body > .body-right-8,
#nav-right-9:checked ~ .tabs-body > .body-right-9,
#nav-right-10:checked ~ .tabs-body > .body-right-10 {
transform: translateY(0px);
transform: translateX(0%);
opacity: 1;
z-index: 1;
}
input[id^=nav] ~ .tabs-body > div[class^=body] {
}
</style>
<!-- В пост. Только слева. (done by Kolobdur) -->
<style>
.tabbed {
display: grid;
grid-template: /* навигация слева и поле */
"nav-left-1 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-2 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-3 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-4 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-5 tabs-body tabs-body tabs-body tabs-body" 1fr
/* Коллонки */
/ 1fr 1fr 1fr 1fr 1fr;
width: 100%;
}
</style>
<div class="tablet">
<div class="stim"><td> Фелициан Краен <br> Уровень доступа: E </div>
<div class="tabbed">
<!-- Навигация слева -->
<!-- Слева 1 -->
<input type="radio" name="tabs-body" id="nav-left-1" checked>
<label for="nav-left-1">Личные данные</label>
<!-- Слева 2 -->
<input type="radio" name="tabs-body" id="nav-left-2">
<label for="nav-left-2">Внешность</label>
<!-- Слева 3 -->
<input type="radio" name="tabs-body" id="nav-left-3">
<label for="nav-left-3">Способность</label>
<!-- Слева 4 -->
<input type="radio" name="tabs-body" id="nav-left-4">
<label for="nav-left-4">Характеристика</label>
<input type="radio" name="tabs-body" id="nav-left-5">
<label for="nav-left-5">Биография</label>
<div class="tabs-body">
<!-- Контент вкладок слева -->
<div class="body-left-1">
<center><img src="https://forumupload.ru/uploads/001b/fb/3e/5/534500.jpg"></center>
original art<br>
Пол: мужской<br>
Дата рождения: 25.10.2103<br>
Возраст: 21 лет<br>
Рост и вес: 173 см / 69 кг<br>
<br>
Семейное положение: холост<br>
Должность/Статус: студент 4 курса факультета Кризис менеджмента<br>
Ник в чате академии: Cian<br>
<br>
Отличительные признаки<br>
Цвет глаз: светло - янтарный<br>
Цвет волос: рыжий с рубиновым оттенком на свету<br>
Татуировки/Шрамы/Пирсинг/Пигментация: проколоты уши. Девственно чистая кожа без каких-либо татуировок на теле. Отличительной чертой, можно считать, небольшую родину в виде полумесяц на левой ягодице. Есть шрам на правом бедре от азотного ожога.
</div>
<div class="body-left-2">
Циан из тех, кто предпочитает быть тем, кого встречают по одежде. Всегда опрятно одет, а вероятность получить пятно на своей рубашке, сродни истерики девушки по поводу поломанного ногтя. Если есть возможность выделиться внешним видом, его ничто не остановит, ни эпатажность, ни цена изделия. От природы у Фелициана рыжие волнистые волосы, которыми Краен гордится больше, чем своими успехами в учебе, подстригает лишь кончики, продолжая их отращивать. Для тренировок волосы заплетает в французскую косу, знает, что это его слабость в бою, но ни за что не решится подстричься, даже ради будущей работы. Либо какой он есть, либо пусть сами, без него. Из-за частой работы с карандашом и прочими красящими веществами будь то краска, уголь, тушь, подушечки пальцев перепачканы, но чудесным образом не являются причиной порчи ни одежды, ни рисунков Циана. У этого парня эктоморфное телосложение тела, поэтому вместо слабых потуг нарастить мышечную массу сконцентрировался на оттачивании маневренности, работая над пластичностью и гибкость. Смотря на этого парня, взгляд привлекает не только золотистость глаз обрамленныех пушистостью рыжих ресниц, но и длинные тонкие пальцы с ухоженными ногтями. В Фелициане каждая часть его тела, как и общий образ, создаёт обманчивое впечатление хрупкости. Движения Циана грациозны, голос высок и мелодичен. <br>
</div>
<div class="body-left-3">
► Материализация рисунков.<br><br>
Применение: активная способность, применяется на любой объект способный сохранить изображение. Дальность оживления не более 500 метров. <br><br>
Ограничения: при применении на применяемом объекте должен остаться любой биологический след от хозяина данной способности (отпечаток пальцев, слюна). Оживление происходит постепенно и материализуется в зависимости от изображенного. Создание может занять как от пары секунд, так и до десяти минут в зависимости от заданных параметров. Скажем, материлизовать верёвку или меч хватит и пяти секунд, куда сложнее с объёмным картинами. Та же взрывчатка, для этой реакции потребуется не менее трех минут. Создание же какого-то монстра и того более 5 минут. Может создавать в сутки не более пяти предметов с полной их изначальной структурой. В остальном, до 15 предметов под цвет и структуру на которое было нанесено изображение, и эти предметы имеют уязвимость к воде, разрушаясь от этой стихии. Способность черпает жизненную энергию обладателя, переутруждение приводит не только к мигреням, тошноте, но и способна довести до обморочного состояния, и даже комы. <br><br>
Описание способности: матерелизует нарисованное, либо с изначальной полной структурой того, что было нарисовано, либо со структурой материала на котором был нанесён рисунок. Создатель рисунков, при активной способности, имеет связь со всеми своими творениями, сам определяет время их материализации, может ими управлять. При насильственном разрушении, воспринимает уничтожение творений как ментальную атаку на свое сознание, в остальном же, может самостоятельно развеять свою способность без последствий для себя.
<br>
</div>
<div class="body-left-4">
Успеваемость: (охотно грызет гранит науки, но наблюдаются некоторые трудности с огнестрелом)<br><br>
Циан ярко выраженный интроверт. Мог бы быть душой компании, если бы эту самую компанию не сторонился. В общение игрив и язвителен, знает что словом можно ранить и очень часто этим пользуется, специально отгораживаясь от остальных. Самодостаточен, есть зачатки нарциссизма. Творческая личность, без педантических замашек, исключение его одежда. В быту весьма рассеян, спалить что-то на комфорке, при лабораторных работах спутать химические реагенты - запросто. Добрый души молодой человек, чуток к происходящему, не сможет пройти мимо бездомного животного и обязательно затащит к себе в комнату, где потом выходит и окружит заботой и любовью. И не важно, что это может быть какая-то мутированная опасная хрень от которой другие будут шугаться, в его глазах этот комок тепла нуждающихся в его опеке. И не смотря на такую открытость души к братьям нашим меньшем, весьма мстителей и злопамятен. Если заупрямится, тушите свет, бессмысленно и бесполезно пытаться переубедить, даже если он не прав. Падок на лесть, но ума хватает не вестись на открытые провокации. Не любитель метода решения через грубую силу, лучше подключить смекалку и хитрость. Личность легко увлекаемая в авантюры, но только с теми, кого подпускает к себе ближе, чем на вытянутую руку. Ко всем изначально относится с недоверием, хоть и скрывает это за радушной маской и любезно улыбкой. Хороший актёр, время от времени, показывает истинные эмоций будь то восхищение или удивление. Любит строить из себя капризного молодого человека, наблюдая за окружением.
</div>
<div class="body-left-5">
Фелициан Краен младшенький, у него есть брат старше его на 3 года. Матушка известная певица, а отец преуспевающий бизнесмен. Все было бы в их семье хорошо, если бы не эти злосчастные мутации. Оба родителя простые любящие родители и люди, но вначале им пришлось отдать в интернат старшего сына, а потом не завидная участь постигла и самого Фелициан, а ведь была надежда, что хоть их младшенького минует эта участь, но увы.
Обоих сыновей как приговор стал возраст 13 лет. Сам Циан воспринял отлучение от семьи, как предательство и до сих пор не поддерживает с ними связь, только со своим братом, для которого стал той ещё занозой. Отношения братьев не сказать, чтобы тёплые. Одного съедает чувство вины за один случай, а Циан этим пользуется, заставляя брата страдать и расплачиваться по сей день. Отношение к организации, что его растила в интернате и к самой академии, к слову, не чуть не лучше, чем к родителям, но тут хватает ума помалкивать и не показывать своих зубов. Все что он сейчас может, это учиться, набираться знаний и оттачивать свою способность.
<br><br>
Секретная информация:
Слышал о радикальных организация, лелеет надежду примкнуть к Вирид.
</div>
</div>
</div>
</div>
[/html]
