Код:
<!--HTML--><div class="postcolor"> 
<link href="https://fonts.googleapis.com/css?family=Anaheim" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Raleway:900,800,700" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

<style type="text/css">

.ntitle { width: 512px; background: #000; color: #fff; font-family: raleway; font-weight: 800; font-size: 30px; text-transform: uppercase; padding: 85px 30px 50px 30px; }
.nstuff { height: 345px; width: 250px; overflow: auto; text-align: justify; padding: 0px 5px 0px 0px; font-family: arial; font-size: 10px; line-height: 100%; }
thing { font-family: anaheim; font-size: 8px; text-transform: uppercase; margin-left: -15px; font-weight: normal; letter-spacing: 1px; color: #373737; }
.nstuff2 { height: 345px; overflow: auto; text-align: justify; font-family: arial; font-size: 10px; padding: 5px; }
.nstuffff { margin-left: 15px; }
.head { color: #ccc; font-family: raleway; font-weight: 900; text-transform: uppercase; font-size: 15px; padding: 5px; border-bottom: solid 1px #eee; margin: 5px; text-align: left; }
.ndetails { width: 541px; padding: 15px; raleway; font-weight: 700; background: #000; color: #fff; text-transform: uppercase; font-size: 8px; letter-spacing: 1px; margin-left: 40px; margin-top: -10px; text-align: center; }
.nshipper { background-color: #fafafa; border: 1px solid #eee; width: 550px; height: 400px; padding: 10px 10px 10px 10px; }
.Ncontainer {
 height: 400;
 width: 550;
}
.Ntabs {
 position: relative;
 width: 550px; 
 height:  400px;
}
.Ntab {
 float: left; }
.Ntab label {
 display: block;
 width: 90px;
 height: 20px;
 background: #fff;
 padding: 10px; 
 margin: 0px;
 position: relative;
 left: 0px;
 top: 0px;
 z-index: 3;
 font-family: anaheim;
 text-transform: uppercase; }
.Ntab input[type=radio]:checked ~ label {
 border-bottom: 5px solid #ccc;
 z-index: 2; }
.Ntab input[type=radio] {
 display: none; }
.Ncontent {
 position: absolute;
 top: 0px;
 bottom: 0px;
 left: 0px;
 right: 0px;
 background: white;
 padding: 45px 0px 0px 0px;
 opacity: 0; 
 -webkit-transition-duration: 1s; 
 -moz-transition-duration: 1s;
  -o-transition-duration: 1s; }
.Ntab input[type=radio]:checked ~ label ~ .Ncontent {
 z-index: 1; 
 opacity: 1; }
</style>

<center>
<div class="ntitle" style="background: url('http://funkyimg.com/i/2qEvv.png')">



</div>
<div class="nshipper">
<div class="Ncontainer">

<div class="Ntabs">


<div class="Ntab">
<input type="radio" id="Ntab-1" name="Ntab-group-1" checked="">
<label for="Ntab-1"> <i class="fa fa-home fa-fw" style="font-size: 10px;margin-top:5px"></i>&nbsp; image</label>
<div class="Ncontent">
<img src="http://s010.radikal.ru/i314/1702/b5/c7add2defac7.png" width="550" height="355">
</div>
</div>


<div class="Ntab">
<input type="radio" id="Ntab-2" name="Ntab-group-1">
<label for="Ntab-2"> <i class="fa fa-heartbeat" style="font-size: 10px;margin-top:5px"></i>&nbsp; in-depth</label>
<div class="Ncontent">
<table cellpadding="5" cellspacing="0"><tbody><tr><td>

<img src="http://s019.radikal.ru/i611/1702/57/80a8521cb931.png" width="200" height="345">

</td><td>

<div class="nstuff">
<div class="nstuffff">
<div class="head">basics</div>
<thing>✱ full name:</thing> Сэм и Фил Штайм.
<br>
<thing>✱ nicknames/aliases:</thing> Гаджет и Чип.
<br>
<thing>✱ date of birth:</thing> 11.10.97.
<br>
<thing>✱ zodiac sign:</thing> весы.
<br>
<thing>✱ place of birth:</thing> Нимбаса Сити.
<br>
<thing>✱ hometown:</thing> Китринос Сити.
<br>
<thing>✱ languages:</thing> Английский.
<br>
<thing>✱ member group:</thing> Хранители.
<br>
<thing>✱ type:</thing> электрический.
<br>
<thing>✱ award:</thing> Electrium Z.
<br>
<thing>✱ theme:</thing> <a href="https://www.youtube.com/watch?v=zG28TM7rKOs">Varien & Razihel - Toothless Hawkins</a>.

<div class="head">appearance</div>

<thing>✱ prototype:</thing> Len & Rin Kagamine [Vocaloid].
<br>
<thing>✱ height:</thing> 1.62 | 1.71 м.
<br>
<thing>✱ weight:</thing> 43 | 68 кг.
<br>
<thing>✱ tattoos:</thing> нет.
<br>
<thing>✱ piercings:</thing> ушной.
<br>
<thing>✱ scars:</thing> пара мелких ожогов.
<br>
<thing>✱ distinguishing features:</thing> яркие и стильные.

<div class="head">relationships</div>

<thing>✱ sexual orientation:</thing> гетеросексуальность.
<br>
<thing>✱ relationship status:</thing> не состоят.
<br>
<thing>✱ past partners:</thing> неизвестны.

<div class="head">health</div>

<thing>✱ mental illness:</thing> нет.
<br>
<thing>✱ allergies:</thing> у Сэм на клубнику.
<br>
<thing>✱ smoking:</thing> активно.
<br>
<thing>✱ drugs:</thing> легкие.
<br>
<thing>✱ alcohol:</thing> периодически.

<div class="head">personality</div>

<thing>✱ negative traits:</thing> ребячество.
<br>
<thing>✱ positive traits:</thing> умение совмещать приятное с полезным.
<br>
<thing>✱ bad habits:</thing> бросают окурки на землю, переводят все в шутку.
<br>
<thing>✱ fears:</thing> оказаться на смертной работе.
<br>
<thing>✱ hopes and dreams:</thing> установить рекорды на всех игровых автоматах города.
<br>
<thing>✱ likes:</thing> электронная музыка.
<br>
<thing>✱ dislikes:</thing> драма во всех проявлениях.

<div class="head">favorites</div>

<thing>✱ movie:</thing> у Фила Звездный Десант, у Сэм Дорога Домой.
<br>
<thing>✱ book:</thing> у Сэм Маленькие Женщины.
<br>
<thing>✱ song:</thing> нет.
<br>
<thing>✱ food:</thing> фисташковое мороженое.
<br>
<thing>✱ holiday:</thing> Рождество.
<br>
<thing>✱ color:</thing> желтый.

</div></div></td></tr></tbody></table></div></div>


<div class="Ntab">
<input type="radio" id="Ntab-3" name="Ntab-group-1">
<label for="Ntab-3"> <i class="fa fa-pencil fa-fw" style="font-size: 10px;margin-top:5px"></i>&nbsp; about</label>
<div class="Ncontent">

<div class="nstuff2" style="padding: 10px 40px 10px 40px">
<div class="head">characteristics</div>
<p>
✱ Штаймы - дальние родственники лидера стадиона Нимбасы. Подобно именитой звезды Юновы, Фил и Сэм всегда питали нежные чувства к электрическим покемонам и ярким шоу. Им так же приятно быть в центре внимания, а то и на пьедестале общего обожания. С самого детства двойняшки дополняли друг друга, что ни раз оказывало благоприятный эффект: победы на научных ярмарках, отличные оценки и только первые места на всевозможных выступлениях. Будучи весьма любознательными детьми, Штаймы пробовали себя в самых разных дисциплинах: от танцев до шахмат. Лишь танцы и электрические покемоны сопровождали их на жизненном пути, в то время как все остальные занятости менялось одна за другой.
</p><p>
✱ В возрасте пяти лет двойняшки перебрались в Эриалс, причиной чему стало повышение родителей. Держась друг друга,
 Фил и Сэм, сами того не подозревая, начали стремительный подъем к Олимпу. Успехи в физике и тренерский потенциал не остались без внимания. Штаймы никогда не планировали стать сильнейшими тренерами или мастерами электрического типа, да и их покемоны тому подтверждение. Однако, умелое использование грызунов и компетентность в вопросах электроэнергии помогли им закрепить за собой рабочие места на электростанции. Несерьезное отношение двойняшек к учебному процессу вынудило родителей устроить их на работу. Во время аварии на станции, Фил и Сэм спасли четверых работников и устранили неполадку, чем предотвратили падение электросети во всем регионе. На следующее утро комитет Лиги утвердил двойняшек на должность Хранителей.</p><p>
✱ Отсутствие высшего образование ограничивает их возможности и препятствует карьерному росту. Пока родители гнут свою линию, согласно которой двойняшки обязаны взять себя в руки и получить бумажки, сами Хранители довольствуются минимальной занятостью. Работа в Лиге обеспечивает Штайнов куда лучше, чем земные профессии могут предложить. На электростанции держатся лишь для убийства времени - пока друзья ни освободятся для вечерних гуляний.</p></div></div></div>

<div class="Ntab">
<input type="radio" id="Ntab-4" name="Ntab-group-1">
<label for="Ntab-4"> <i class="fa fa-user-plus" style="font-size: 10px;margin-top:5px"></i> &nbsp; quests</label>
<div class="Ncontent">

<table cellpadding="3" cellspacing="0"><tbody><tr>

<td><div class="nstuff">

<div class="head">Monday:</div>

<p>✱ <b>Time:</b> 10.00 - 13.00.<br>
✱ <b>Place:</b> Ветряные мельницы.<br>
✱ <b>Info:</b> Каким-то невообразимым способом, <abbr title="Skarmory | #227">Скармори</abbr> свила гнездо меж лопастей ветряного генератора. И все бы ничего, пока птенцы ни вылупились. Стальные птички неуклюже повредили механизм, чем вывели мельницу из строя. Попытки двойняшек вернуть лопасти в движение наткнулись на сопротивление старшей Скармори, расценившей приближение людей, как угрозу для потомства.<br>
✱ <b>Quest:</b> помочь Штаймам запустить мельницу.
</p><p>

</p><div class="head">Tuesday:</div>

<p>✱ <b>Time:</b> 9.00 - 10.00.<br>
✱ <b>Place:</b> Электростанция.<br>
✱ <b>Info:</b> Регулярными гостями электростанции, как бы оно странно ни звучало, являются <abbr title="Muk | #089">Маки</abbr> и <abbr title="Grimer | #088">Граймеры</abbr>, которым весьма уютно на бабинах водяного генератора. Очередное массовое появление ядовитых покемонов забило катушку, из-за чего механизм встал. Двойняшкам порядочно надоело лезть в эту грязь, так что им весьма повезло, что Вы подвернулись этим утром.<br>
✱ <b>Quest:</b> освободить бабину от незваных гостей.
</p><p>

</p><div class="head">Wednesday:</div>

<p>✱ <b>Time:</b> 13.30 - 14.30.<br>
✱ <b>Place:</b> Столовая Электростанции.<br>
✱ <b>Info:</b> Фил и Сэм ушли на перерыв, когда все двери оказались заблокированы по вине Хит-Фистов. Дерзкое нападение преступников на оплот электроснабжения региона привело к изоляции Хранителей.<br>
✱ <b>Quest:</b> Вступить в бой с Грантами, пока Фил и Сэм берут контроль над станцией в свои руки.
</p><p>

</p><div class="head">Thursday:</div>

<p>✱ <b>Time:</b> 17.15 - 18.45.<br>
✱ <b>Place:</b> Торговый центр Люмиос Стейшен.<br>
✱ <b>Info:</b> Падение электросети в крупнейшем моле города вызвало панику. Фил и Сэм прибыли на место,
 но проблема вызвана третьими лицами, а не безалаберностью проверяющего. <abbr title="Joltik | #595">Жолтики</abbr>, поселившиеся в подвальные помещения мола, хорошо устроились на всем готовеньком, и активно высасывали электричество из кабелей.<br>
✱ <b>Quest:</b> Хранители не могут заменить погрызенные провода, пока все паучье гнездо обедает. Но и проводить замену нет смысла, пока подвал кишит пауками. Выгнать Жолтиков и отбить желание возвращаться.
</p><p>

</p><div class="head">Friday:</div>

<p>✱ <b>Time:</b> 21.15 - 24.00.<br>
✱ <b>Place:</b> Развлекательный комплекс Аркада.<br>
✱ <b>Info:</b> Заслуженный пятничный отрыв - Фил, Сэм и их друзья заняли любимое место в игровом доме. Под музыку и прочий гул, близнецы настроены установить очередной рекорд.<br>
✱ <b>Quest:</b> Одолеть близнеца / близнецов в игре.
</p><p>

</p><div class="head">Saturday:</div>
<p>✱ <b>Time:</b> 10.45 - 15.00.<br>
✱ <b>Place:</b> Квартира №16 на улице Флаффи.<br>
✱ <b>Info:</b> Похмельное утро имеет обязательную программу, в которую не входит появление очередного тренера. Крайне саркастичный, до обидного грубый Филипп требует подношения. Он не сообщит, что же требуется его персоне, но с этим поможет Гугл. Черный кофе или пиво - иные товары не интересуют Штайма субботним утром.<br>
✱ <b>Quest:</b> Напиться с Филом. Или принести кофе, заварить его, убраться в квартире и решить задачу из учебника по физике.
</p><p>


</p><div class="head">Sunday:</div>
<p>✱ <b>Time:</b> 13.20 - 14.00.<br>
✱ <b>Place:</b> Трек.<br>
✱ <b>Moves:</b> Единственный день в неделю, когда Саманта пропадает с радаров. К концу первой половины воскресения она появляется на треке, где часами накручивает круги на электрокаре. Но это заведение не для начинающих гонщиков -
 трасса подразумевает взаимодействие с покемонами для преодоления ряда препятствий: пропасти, крутого подъема, извилистого отрезка.<br>
✱ <b>Quest:</b> Не отстать от Сэм.
</p><p>
</p></div></td>
<td>

<img src="http://s45.radikal.ru/i110/1702/27/58e15548901c.png" width="200" height="345">

</td></tr></tbody></table>

</div>
</div>

<div class="Ntab">
<input type="radio" id="Ntab-5" name="Ntab-group-1">
<label for="Ntab-5"> <i class="fa fa-cog fa-fw" style="font-size: 10px;margin-top:5px"></i> &nbsp; personality</label>
<div class="Ncontent">
<table cellpadding="5" cellspacing="0"><tbody><tr><td>
<center><img src="http://funkyimg.com/i/2sBT4.gif" width="200" height="160">
<p>
<img src="http://funkyimg.com/i/2sBT5.gif" width="200" height="160">
</p></center></td><td>
<div class="nstuff">
<div class="nstuffff">
<div class="head">personality:</div>
<p>
✱ Пожалуй, худшее проявление Вечных Детей: саркастичные хамы, провоцирующие доказать слова делом. Ни к чему не относятся серьезно и все переводят в шутку. Действуют, исходя из настроения. В самом скверном расположении духа засчитают прохождение испытания, если претендент решит задачку из школьной программы. Но при благоприятных обстоятельствах, превратят проверку в игру, и все получат массу удовольствия.
</p><p>
✱ Несмотря на поверхностное отношение к большинству аспектов жизни, близнецы придерживаются пунктов ≪не навреди≫ и ≪любая жизнь бесценна≫. Даже лишение вредителей крова вызывает у них негативные реакцию. Что весьма вредит их работе, так как причиной многих проблем являются дикие покемоны, которых им жаль.</p><p>
✱ Не считают себя, да и кого-либо в целом ≪плохими≫. Когда речь заходит о Хит-Фистах, близнецы придерживаются Европейской точки зрения, - ≪не они такие, а жизнь такая≫. Они отдают отчет многим своим недостаткам, но раз они не встают в позу из-за чужих тараканов в голове, то почему кого-то должны волновать их?
</p>
</div></div></td></tr></tbody></table>

</div></div></div></div></div> </center></div>