Код:
<!--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://s012.radikal.ru/i320/1702/30/25e8fffdf2af.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://s019.radikal.ru/i642/1702/3b/3a98d1b03717.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/i617/1702/36/3f446b8c1258.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> 18.02.00.
<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> Waterium Z, TM94	Surf, TM98 Waterfall.
<br>
<thing>theme song:</thing> <a href="https://youtu.be/mb-XCaA2HZs">Rick and Morty - Evil Morty (feewet Trap Remix)</a>.

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

<thing>prototype:</thing> Ganaha Hibiki | THE iDOLM@STER.
<br>
<thing>height:</thing> 1.51 м.
<br>
<thing>weight:</thing> 40 кг.
<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>current addictions:</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>  <a href="https://www.youtube.com/watch?v=xWpmZz28ZOg">электронный треп</a>.
<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><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.30 - 12.00.<br>
✱ <b>Place:</b> Морской путь 11 маршрута.<br>
✱ <b>Info:</b> Группа отправляется к острову. Добравшись до края пешего пути, туристы пересаживаются на Лапрасов. Во главе выступает, разумеется,
 Саманта, верхом на своем покемоне. Преодолев половину, наступает время для развлекательной программы. Хранительница раздает маски, после чего объявляет конкурс лучшей подводной фотографии.<br>
✱ <b>Quest:</b> удивить всех и, особенно, Саманту.
</p><p>

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

<p>✱ <b>Time:</b> 12.30 - 13.00.<br>
✱ <b>Place:</b> Морской путь 11 маршрута.<br>
✱ <b>Info:</b> Сильный ветер, невероятные волны, туристический путь закрыт. Не упускать же момент! Отделавшись от всей лишней одежды, Сэм предлагает ожидающим поезд до острова провести время с удовольствием - серфинг верхом на <abbr title="#226 | Mantine.">Мантайнах</abbr>!<br>
✱ <b>Quest:</b> Саманта не ищет легких путей, так что держитесь крепче! Будет трясти.
</p><p>

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

<p>✱ <b>Time:</b> 14.00 - 14.30.<br>
✱ <b>Place:</b> Морской путь 11 маршрута.<br>
✱ <b>Info:</b> Во время инструктажа Саманта многократно повторяет наказ не заплывать за буйки. Вода ли показалось прозрачнее, или что-то иное привлекло любительницу экстремальных селфи, но дуреха потревожила косяк <abbr title="#319 | Sharpedo.">Шапред</abbr>. В навыках Хранительницы сомневаться не приходится, вот только испугавшаяся девица свалилась с Лапраса, и Саманта вынуждена отвлечься от боя.<br>
✱ <b>Quest:</b> Прогнать акул.
</p><p>

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

<p>✱ <b>Time:</b> 19.15 - 19.45.<br>
✱ <b>Place:</b> Морской путь 11 маршрута.<br>
✱ <b>Info:</b> Туристический путь закрывается, но вахта Хранителя еще не окончена. Внезапное понижение уровня воды и сбой навигационной системы привели к крушению рыболовной лодки. Спасатели уже в пути, но Саманта не согласна ждать их указаний.<br>
✱ <b>Quest:</b> Способствовать эвакуации рыбаков.
</p><p>

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

<p>✱ <b>Time:</b> 22.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> 09.45 - 10.50.<br>
✱ <b>Place:</b> Точка Дайв-Дип.<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>Info:</b> Как и полагается привлекательной девушке, Сэм не обошлась без своего поклонника. Вот только ответной симпатии парень не получил, сколько бы не старался. Сама того не желая, Саманта довела молодого человека до края, и он захватил Аквапарк. Несчастный влюбленный испортил несколько аттракционов, что сулит гибель, если Ли не согласится стать его девушкой. И можно было бы притвориться, но дети уже в опасности.<br>
✱ <b>Quest:</b> Спасти маленьких детей, тонущих в закрытой трубе горки-смыва. 
</p><p>

</p></div></td>
<td>

<img src="http://s015.radikal.ru/i332/1702/1c/e1b7903d26a2.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/2xAux.gif" width="200" height="160">
<p>
<img src="http://funkyimg.com/i/2xAuy.gif" width="200" height="160">
</p></center></td><td>
<div class="nstuff">
<div class="nstuffff">
<div class="head">PERSONALITY:</div>
<p>✱ Неунывающая, бойкая, громкая - первая реакция. Способная, подготовленная, надежная - вторая реакция. Забавная, интересная, раскрепощенная -  третья реакция. Легкомысленная, дуреха, ДА ЧТО ТЫ ТВОРИШЬ?! Она привыкла к жизни на берегу, к купальникам, совместной деятельности и свободной манере высказывания своих мыслей. Но приезжим это часто кажется чем-то вызывающим и неприличным. А когда дело доходит до действий, то бесстрашие Саманты и вовсе вынуждает переживать за ее безопасность.<br></p><p>
✱ Несмотря на значимую должность в Лиги, Сэм остается подростком. Полная отдача днем, и безудержное веселье по вечерам, особенно по пятницам.
 В силу молодости или удачливым генам, но даже самая хмельная ночь не помешает ей проснуться бодрой и полной сил. Хранительница не склонна к действиям по привычке - каждое решение принимается обдуманно в той или иной степени. Она внимательна к претендентам, насколько это возможно.
 Всегда инструктирует туристов, наказывает прихватить головные уборы, крем от загара, бутылочку воды и строго следовать маршруту.<br></p><p>
✱ Ли далека от разборок Генезиса и Хит-Фиста, про существование Райетов слышала мельком, хоть и является большой поклонницей DJ:Repel. Ей куда важнее поведение человека и его отношение к окружающим, нежели причастность к фракции. При злоупотреблении властью, она настучит по голове и Генезису, и добрым самаритянам, и самой Чемпионке. Силенок для последней, к сожалению, ей не хватит, но порыву ничего не помешает.</p>
</div></div></td></tr></tbody></table>

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