[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> Уровень доступа: C </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/8/42807.jpg"></center>
original art<br>
Пол: м<br>
Дата рождения: 02.01.2102 <br>
Возраст: 22 год <br>
Рост и вес: 198 см / 110 кг<br>
<br>
Семейное положение: холост<br>
Должность/Статус: студент 4 курса факультета тактической подготовки, представитель ДК<br>
Ник в чате академии: Халк<br>
<br>
Отличительные признаки<br>
Цвет глаз: черный<br>
Цвет волос: черный<br>
Татуировки/Шрамы/Пирсинг/Пигментация: имеются мелкие шрамы на теле, полученные в боевых миссиях.
</div>
<div class="body-left-2">
Если судить по внешности, Рик типичный представитель той категории людей, которых часто олицетворяют с силой. Высокий, крупный, массивный, с фигурой качка и крепкими литыми мышцами. Может создаться ощущение, что он питается исключительно стероидными коктейлями и биодобавками для увеличения мышечной массы, и не выходит из спортзала сутками. Это не совсем так, хотя и близко к реальности. Рик действительно проводит много времени в спортзале, занимается на тренажерах и постоянно оттачивает свое умение сражаться и использовать способность. Стероидами не интересуется от слова “совсем”, биодобавками тоже не пользуется, хотя питание у него проработанное и сбалансированное, составленное диетологами в медицинском центре. <br>
Волосы подстрижены коротко, взгляд внимательный и оценивающий. Хотя многие этого не замечают сразу, ведь первое, что бросается в глаза (реально бросается, порой кажется с целью их выцарапать хд) это его бицепсы. Смотреть в глаза парню с объемом бицепса полметра все равно, что смотреть в глаза девушке с пятым размером груди. <br>
Татуировок и пирсинга не имеет, зато полно мелких шрамов по всему телу. В одежде предпочитает спортивный стиль, в приоритете удобство и практичность. Не смотря на всю массивность фигуры, Рик достаточно ловкий и быстрый, что порой оказывается неожиданностью для его противников. Походка тяжелая, но при этом научился перемещаться практически бесшумно, ведь от этого зависит его жизнь за пределами безопасной территории академии. Голос низкий и глубокий. Рик редко повышает его, обычно говорит спокойно и уверенно, это голос командира, приказы которого не оспариваются, а выполняются беспрекословно. <br>
</div>
<div class="body-left-3">
► Гравиокинез (управление гравитацией)<br><br>
Применение: способен изменить показатели гравитационного поля на определенной площади. Радиус действия способности - 500 метров. Способность активная (активируется носителем). Центром области действия способности всегда остается носитель, но на него самого способность не действует. Площадь, на которую действует способность, не перемещается, если ее “центр” меняет свое положение в пространстве. Носитель может по своему усмотрению увеличивать или уменьшать гравитацию в области действия способности.<br><br>
Ограничения: Чем больше значение гравитационной постоянной отличается от нормы, тем больше силы тратится на применение способности. То же и с уменьшением радиуса действия способности, его можно сделать меньше по области, но это требует высокой концентрации и больших затрат энергии. <br><br>
Описание способности: На площади определенного радиуса изменяется значение гравитационной постоянной, вследствии чего все предметы и живые существа получают увеличение или уменьшение своей массы. Способность действует на все материальные объекты, попадающие в поле действия способности, кроме самого носителя.
<br>
</div>
<div class="body-left-4">
Успеваемость: отличник, в тройке лучших учеников на курсе.<br><br>
Лидер. Упрямый, гордый, ответственный, прямолинейный. Рик из тех людей, которые требуют безоговорочного подчинения, но лишь потому, что он берет на себя ответственность за их жизни и здоровье. Он скрупулезно оценивает все риски, учитывает все показатели каждого члена команды, чтобы добиться поставленной цели максимально эффективно и с минимальными потерями, а в идеале без них вовсе. У него самые высокие показатели по закрытым миссиям. Быть в его команде не только почетно, но и безопасно.<br>
Упрям, имеет на все свою точку зрения. Рик далеко не дурак, у него высокие показатели по всем предметам, он весьма умен и быстро соображает в критических ситуациях. Способен действовать быстро и четко, если того требуют обстоятельства. Но вот стратегическое планирование с учетом всех факторов, которые могут повлиять на исход операции ему удается крайне сложно. Насколько Рик отличный тактик, настолько же хреновый стратег.
Нельзя сказать, что для него существует только его точка зрения и ничья больше. Нет, его можно убедить изменить свое решение, но это будет очень и очень непросто. Себе Харт привык доверять, как и своим решениям. А потому с большим недоверием относится ко всем, кто пытается поставить его способности под сомнение. Он не гордец, и не безумец, рвущийся в бой несмотря ни на что. Он никогда не станет вести в заведомо проигрышный бой, или бросаться в драку не оценив силы противника. Рик прекрасно знает свои возможности, и способен оценить риски. <br>
В общении Рик часто спокоен, даже по-своему мягок, всю твердость характера проявляет в основном в миссиях. Легко может помочь другим с какой-то проблемой, защитить младших и слабых, взять шефство над выводком каких-нибудь котиков или кроликов, если такие найдутся в округе. Вывести его довольно сложно.
</div>
<div class="body-left-5">
Единственный ребенок в семье. Родители среднестатические жители одного из мегаполисов (Цюрих), оба работают на производстве. Рик всегда проявлял лидерские качества, с детства защищал слабых, имел повышенное чувство справедливости, был с малых лет самостоятельным и независимым, чем часто доставлял проблемы родителям, хотя и вызывал у них чувство гордости.<br>
В возрасте пяти лет у него проснулась первая способность. В мегаполисе скрыть подобное сложно, за измененными, да и за всем населением идет постоянное наблюдение. В шесть Рика забрали из семьи и поместили в интернат для измененных. Там он прилежно учился, улучшал контроль над способностью, постигал базовые знания полезных наук. Там же научился по настоящему дружить, любить и попробовал вкус предательства и потери.
После интерната Рик попадает в Академию. К этому времени он уже вполне сформированная сильная личность. С первых недель обучения успел ввязаться в пару драк, собрал вокруг себя группу поклонников и вполне отлично себя чувствовал в качестве лидера класса. Парнем он был не глупым, умел и расположить к себе, и доказать правильность своей точки зрения. Но все еще оставался вспыльчивым молодым человеком, контроль эмоций которого значительно уступал контролю способности.<br>
К третьему курсу отличился на многих миссиях, показал себя талантливым тактиком и командиром. И хотя слава о нем в стенах академии все еще ходит весьма спорная (качок, буйвол, прет напролом, ему лучше дорогу не переходить, растопчет и не заметит), но многие признавали в нем талантливого и ответственного лидера, и мечтали попасть в его группу на миссиях. На третьем курсе большинством голосов его избирают в Дисциплинарный кабинет.
Сейчас учится на четвертом курсе, входит в тройку лучших студентов на своем курсе, является примером для других (с подачи учителей, естественно) и претендует на звание лучшего студента своего выпуска. Конечно, чтобы добиться этого и сохранить позиции до самого выпуска, придется еще хорошенько постараться, но сдаваться не намерен. Не в его характере сдаваться на полпути к цели.
<br><br>
Секретная информация: обожает всякие пушистые милые штучки вроде небольших игрушек, пледов, подушек и прочего. Хранит чувства к другу детства, в которого был влюблен, но тот его предал, а подобного не прощает. Очень неохотно признает свои ошибки (читай никогда), не умеет извиняться, по крайней мере словами.
</div>
</div>
</div>
</div>
[/html]
