[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;
}
.tabbed > input {
display: none;
}
.tabbed > label {
margin-top: 87px;
margin-left: 43px;
margin-bottom: -70px;
display: block;
padding-top: 10px;
text-align: center;
}
.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: 125%;
padding: 10px;
z-index: 0;
margin-top: 44px;
margin-left: 0px;
margin-right: 55px;
}
/* Переключатели */
/* Слева */
#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="tabbed">
<!-- Навигация слева -->
<!-- Слева 1 -->
<input type="radio" name="tabs-body" id="nav-left-1" checked>
<label for="nav-left-1">2020-2050</label>
<!-- Слева 2 -->
<input type="radio" name="tabs-body" id="nav-left-2">
<label for="nav-left-2">2060-2070</label>
<!-- Слева 3 -->
<input type="radio" name="tabs-body" id="nav-left-3">
<label for="nav-left-3">2080-2090</label>
<!-- Слева 4 -->
<input type="radio" name="tabs-body" id="nav-left-4">
<label for="nav-left-4">2100-2110</label>
<input type="radio" name="tabs-body" id="nav-left-5">
<label for="nav-left-5">2118-2123</label>
<div class="tabs-body">
<!-- Контент вкладок слева -->
<div class="body-left-1"><table width=100% ; style="color:#000"; bgcolor="#959D9F"; border="1px"; bordercolor="#000";><td>Автор: Unk</td><td>Дата: 29.08.2123</td><td>Просмотры: 122k</td><td>Рейтинг: ★★★★☆</td></table>
<b>Месть Земли</b>
<br><i>Биокатастрофа ставит под вопрос выживание человечества.</i>
<br><br><p align="justify"> Появление мутаций заметили не сразу. Мировое сообщество было слишком занято другими проблемами, возникающими повсеместно. Эпидемии сменяли друг друга, унося миллионы жизней, природные катастрофы стирали с лица земли целые города, мировая экономика трещала по швам, но сами люди продолжали истреблять друг друга намного быстрей.
<br><br>Точная дата, когда эволюция свернула не туда, не известна, но уже в 2040-х годах у детей начали проявляться необычные способности.
<br><br>Биокатастрофа за какие-то десять-двадцать лет уничтожила половину человечества. Агрессивные мутации наделяли животных и растения дополнительными инструментами для убийства - еще больше зубов, ядовитых шипов, инфракрасное зрение, длинные острые когти, гигантские размеры, защитная броня. Хуже всего пришлось небольшим городам и фермерским хозяйствам, которые атаковали мутировавшие растения и животные.
<br><br>Детей, у которых внезапно начинают проявляться разные способности, называют мутантами и начинают избегать. Появляются первые религиозные секты, призывающие уничтожить “исчадий ада”.</p></div>
<div class="body-left-2"><table width=100% ; style="color:#000"; bgcolor="#959D9F"; border="1px"; bordercolor="#000";><td>Автор: Unk</td><td>Дата: 29.08.2123</td><td>Просмотры: 132k</td><td>Рейтинг: ★★★★☆</td></table>
<b>“Всевидящая” Охра</b>
<br><i>Мировое правительство защищает уцелевшие города с помощью измененных.</i>
<br><br><p align="justify">Мировой экономики к привычном понимании больше не существует. Международной банковской системы тоже, как и геополитики. Стран больше нет.
<br><br>Представители оставшихся в живых встречаются в 2065 году в мегаполисе, образовавшемся на месте Цюриха на территории бывшей Швейцарии, и подписывают несколько важных соглашений, в том числе и торговых. К власти приходит Мировое правительство (позже “Сиена”). Выжившие стараются селиться большими группами, в итоге соседние города объединятся друг с другом и образуются гигантские мегаполисы на большом расстоянии друг от друга.
<br><br>Мутантов с непонятными и часто опасными способностями начинают преследовать и истреблять, что приводит к еще большим жертвам.
Универсальным языком установлен английский.
<br><br>Между мегаполисами устанавливаются прочные международные хозяйственные, торговые и политические отношения, налажены торговые пути сообщения. Примерно в 70-х появляются активные защитники прав измененных, как начинают называть мутантов все, кто не желает иметь отношения к геноциду. Движение набирает обороты, и правительство вносит поправки в существующие законы. Правительство создает интернаты для измененных со способностями, которых воспитывают, обучают, и после используют там, где необходимо применение их способностей. Полный контроль над жизнями измененных полностью сосредоточен в руках Охры - организации, созданной на основе Скайнет, бывшей китайской государственной программы контроля за населением, которая напрямую подчиняется приказам Мирового правительства.
Всем жителям городов устанавливают чипы-идентификаторы.</p></div>
<div class="body-left-3"><table width=100% ; style="color:#000"; bgcolor="#959D9F"; border="1px"; bordercolor="#000";><td>Автор: Unk</td><td>Дата: 29.08.2123</td><td>Просмотры: 372k</td><td>Рейтинг: ★★★☆☆</td></table>
<b>Расцвет Академий</b>
<br><i>Измененные спасают человечество ценой собственных жизней.</i>
<br><br><p align="justify">К 2087 году жизнеспособными оказываются только мегаполисы, которые успели возвести защитно-оборонительные сооружения по всему периметру и отгородиться от агрессивной среды заминированной и просматриваемой буферной зоной. Ощетинившиеся огнестрельным оружием и силовыми барьерами города становятся не только защитой от мутировавших животных и растений, но и отличной тюрьмой для тех, кто успел в них спрятаться.
<br><br>Недовольные новым порядком или политикой Мирового правительства, уходят из городов и образуют редкие и малочисленные колонии, которые представляют собой небольшие фортифицированные военизированные поселения.
<br><br>Охра учреждает элитные военные Академии для обучения измененных, имеющих наиболее подходящие боевые способности и навыки. И создает из них особые элитные спецгруппы. Всем измененным с момента проявления способности и передачи в интернат, присваивают пожизненным статус “М” и устанавливают с помощью уникальной технологии специальную метку - сдерживающую печать, позволяющую контролировать измененного, а также временно блокировать его способности, если это необходимо.
<br><br>Измененных, не прошедших отбор в элитные военные Академии, обучают в других, после чего они становятся многочисленными винтиками огромного сложного механизма под названием Охра. Раз попав в систему, они больше не могут вернуться к нормальной жизни и навсегда остаются под бдительным наблюдением Всевидящей.
<br><br>Выпускники элитных Академий, задача которых заключается в ликвидации угрозы для городов, становятся настоящими героями.</p></div>
<div class="body-left-4"><table width=100% ; style="color:#000"; bgcolor="#959D9F"; border="1px"; bordercolor="#000";><td>Автор: Unk</td><td>Дата: 29.08.2123</td><td>Просмотры: 251k</td><td>Рейтинг: ★★★★☆</td></table>
<b>Укрепление власти Сиены</b>
<br><i>Под контролем Мирового правительства.</i>
<br><br><p align="justify">Стоящие у власти в мегаполисах пытаются противостоять Мировому правительству и добиться суверенитета. Но Всевидящая не дремлет. По планете проносится настоящая волна бунтов и попыток захватить власть в городах, которую Охра жестко подавляет с помощью своих элитных отрядов.
<br><br>Родители все чаще пытаются спрятать от Охры детей, у которых пробудились способности. Некоторым измененным удается избежать интернат и даже сбежать, чтобы избежать идентифицирующей маркировки. В начале 10-х появляется Вирид - радикально настроенная организация, которая борется за права измененных. Члены организации тщательно скрываются в городах среди обычных людей.
<br><br>Ходят слухи о том, что где-то на земле даже есть город, основанный измененными. Всевидящая постоянно выслеживает членов Вирид и при возможности уничтожает на месте. Никаких расследований и судов. Измененного, которого забирают спецгруппы, больше никто никогда не видит.</p></div>
<div class="body-left-5"><table width=100% ; style="color:#000"; bgcolor="#959D9F"; border="1px"; bordercolor="#000";><td>Автор: Unk</td><td>Дата: 29.08.2123</td><td>Просмотры: 561k</td><td>Рейтинг: ★★★★★</td></table>
<b>Ошибка Охры</b>
<br><i>Красная Неделя (1.10.2118 - 07.10.2118)</i>
<br><br><p align="justify">Система отбраковки Охры дает сбой. Один из психически неустойчивых измененных, способности которого были несколько лет назад признаны недостойными Академии, сумел найти способ заявить о себе и за неделю уничтожил все Академии и большинство интернатов. Из Академий в целых осталась только одна - в Амазонии. Всего в мире погибло как минимум три четверти измененных, находящихся под контролем Всевидящей.
<br><br>Виновный в геноциде измененных террорист Марк Шейн, известный под именем Апостол, был обнаружен и ликвидирован одним из элитных отрядов, а его ликвидатор, Блэк Фрайдей, стал настоящим героем войны, которая продлилась всего неделю, и символом для оставшихся в живых измененных.
<br><br>Интернаты в городах восстановили, но измененных в них уже не сотни, а десятки. А единственная оставшаяся целой Академия после этого случая принимает измененных с любыми способностями. Ужесточился отлов уклонившихся от идентифицирующей маркировки измененных, которых по достижении 18-ти летия привозят в Академию напрямую, минуя интернаты.
Больше Охра не повторит своей ошибки.</p></div>
</div>
</div>
</div>
[/html]
