Код:
<!--HTML--><link href='http://fonts.googleapis.com/css?family=Oswald:300' rel='stylesheet' type='text/css'><style type="text/css">
#slider {	text-align: center; width:450px; height:450px;}

label, #active, img { -moz-user-select:none;-webkit-user-select:none; }
.catch { display: block; height: 0; overflow: hidden; }
#slider { margin: 0 auto; }

#slider input {display: none;}
#slidercr { font-family: oswald; font-size:10px; text-transform:uppercase; }
#slidercr a {color:#206876;}
#slide1:checked ~ #slides .inner { margin-left:0; }
#slide2:checked ~ #slides .inner { margin-left:-100%; }
#slide3:checked ~ #slides .inner { margin-left:-200%; }
#slide4:checked ~ #slides .inner { margin-left:-300%; }
#slide5:checked ~ #slides .inner { margin-left:-400%; }

#controller {width:450px; height:450px; overflow:hidden; }
#overflow {width: 100%;overflow: hidden;}
article img {width: 450px; height:450px;}
#slides .inner {width: 500%;line-height: 0;}
#slides article {	width: 20%;float: left;}
#controls {margin-top: -50%; margin-left:16%; margin-right:0%; margin-bottom:0%; width: 68%;height: 50px;}
#controls label { display: none;width: 50px;	height: 50px;opacity: 0.3;}
#active {margin: 27% 0 0;text-align: center;}

#active label {-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; display: inline-block;	width: 10px;
height: 10px; background: #bbb; }

#active label:hover {	background: #ccc; border-color: #0e0e0e!important; }

#controls label:hover { opacity: 0.8; }

#slide1:checked ~ #controls label:nth-child(2), 
#slide2:checked ~ #controls label:nth-child(3), 
#slide3:checked ~ #controls label:nth-child(4), 
#slide4:checked ~ #controls label:nth-child(5), 
#slide5:checked ~ #controls label:nth-child(1) { background: url('http://csscience.com/responsiveslidercss3/next.png') no-repeat; float: right; margin: 0 -70px 0 0; display: block;}

#slide1:checked ~ #controls label:nth-child(5),
#slide2:checked ~ #controls label:nth-child(1),
#slide3:checked ~ #controls label:nth-child(2),
#slide4:checked ~ #controls label:nth-child(3),
#slide5:checked ~ #controls label:nth-child(4) { background: url('http://csscience.com/responsiveslidercss3/prev.png') no-repeat; float: left; margin: 0 0 0 -70px; display: block; }

#slide1:checked ~ #active label:nth-child(1),
#slide2:checked ~ #active label:nth-child(2),
#slide3:checked ~ #active label:nth-child(3),
#slide4:checked ~ #active label:nth-child(4),
#slide5:checked ~ #active label:nth-child(5) { background: #0e0e0e; border-color: #0e0e0e !important; }

/* Info Box */

.info {line-height: 20px; margin: 0 0 -150%; position: absolute; padding: 30px 30px; opacity: 0; color: #000; align:center; height:450px;}
.firstslide {line-height: 20px; margin: 0 0 -150%; position: absolute; padding: 30px 30px; opacity: 0; color: #000; text-align: justify; height:450px;}
.fstxt { margin-top:360px 0 0 50px; background-color:rgba(255,255,255,0.7); background-color:rgb(255,255,255,0.7); color:#191919; font-size:38px; font-family:oswald; text-align:center; padding:15px; text-transform:uppercase; letter-spacing:2px;}
.ntxt { margin-top:360px 0 0 50px; background-color:rgba(255,255,255,0.7); background-color:rgb(255,255,255,0.7); color:#191919; font-size:38px; font-family:oswald; text-align:center; padding:15px; text-transform:uppercase; letter-spacing:2px;}
.ctxt { background-color:rgba(255,255,255,0.7); background-color:rgb(255,255,255,0.7); width:350px; padding: 5px 25px 25px 25px; text-align:justify; font-family:georgia; font-size:11px; text-transform:lowercase; line-height:95%; height:315px; overflow:auto;}
#slides { box-shadow: 1px 1px 4px #666;}
.ctxt b { font-weight:bold; color:#565070; text-transform:uppercase; font-family:oswald;}

#slides .inner {-webkit-transform: translateZ(0);-webkit-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); -moz-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);  -ms-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);  -o-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);  transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); -webkit-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); -moz-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); -ms-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); -o-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); }

#slider { -webkit-transform: translateZ(0);-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;transition: all 0.5s ease-out;}

#controls label{	-webkit-transform: translateZ(0); -webkit-transition: opacity 0.2s ease-out;-moz-transition: opacity 0.2s ease-out;-o-transition: opacity 0.2s ease-out;transition: opacity 0.2s ease-out;}

#slide1:checked ~ #slides article:nth-child(1) .firstslide,
#slide2:checked ~ #slides article:nth-child(2) .info,
#slide3:checked ~ #slides article:nth-child(3) .info,
#slide4:checked ~ #slides article:nth-child(4) .info,
#slide5:checked ~ #slides article:nth-child(5) .info { opacity: 1;	-webkit-transition: all 1s ease-out 0.6s;-moz-transition: all 1s ease-out 0.6s;-o-transition: all 1s ease-out 0.6s;	transition: all 1s ease-out 0.6s;}
.info, #controls, #slides, #active, #active label, .info h3, .desktop, .tablet, .mobile { -webkit-transform: translateZ(0); -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out;  transition: all 0.5s ease-out; }</style>

<div class="controller"><article id=slider>
<input checked type=radio name=slider id=slide1 />
<input type=radio name=slider id=slide2 />
<input type=radio name=slider id=slide3 />
<input type=radio name=slider id=slide4 />
<input type=radio name=slider id=slide5 />

<div id=slides>
<div id=overflow>
<div class=inner>
<article><div class=firstslide><div class="fstxt"><center>FREYA MIKAELSON</center></div></div>
<img src=http://firepic.org/images/2015-04/27/znl8p2s9kzyh.png></article>
   	
<article><div class=info>
<div class="ntxt">ДАННЫЕ</div>
<div class="ctxt"><b>ИМЯ И ФАМИЛИЯ:</b>Freya Mikaelson | Фрея Майклсон <br>
<b>ДАТА РОЖДЕНИЯ | ВОЗРАСТ:</b> 973 г.р. 1042 года<br>
<b>ВНЕШНОСТЬ:</b> Riley Voelkel<br>
<b>МЕСТО РОЖДЕНИЯ:</b> Восточная Европа<br>
<b>МЕСТО ПРОЖИВАНИЯ:</b> Новый Орлеан<br>
<b>РОДСТВЕННИКИ:</b> -Майкл — отец
-Эстер — мать
-Финн Майклсон — младший брат
-Элайджа Майклсон — младший брат
-Никлаус Майклсон — младший брат
-Кол Майклсон — младший брат
-Хенрик Майклсон — младший брат
-Ребекка Майклсон — младшая сестра
-Далия — тетя, по линии (Эстер)<br>
<b>РАСА:</b> Ведьма<br>
<b>Р. СПОСОБНОСТИ:</b> ● чтение заклинаний
● приготовление зелий, которые усиливают заклинание
● связь с миром духов
● управление погодой, они конечно не всесильны, но все таки нечто вроде шторма они могут сделать
● видения - ими обладают, конечно не все, но все же многие из ведьм и колдунов имеют эту способность
● ментальные способности, другими словами то, что заставляет подвергать боли вампиров, оборотней и гибридов, или например с помощью этой способности они могут вызвать огонь<br>
<b>И. СПОСОБНОСТИ:</b>Хорошо делает оружие.<br>
<b>РОД ДЕЯТЕЛЬНОСТИ:</b> Заноза у Клауса и хочет, чтобы семья перешла на её сторону.<br>
<b>АРТЕФАКТЫ:</b> Кулон на шее, который наделяет особой магией, которая в случае чего может спасти жизнь другому, если его передаст.<br>
<b>ЛОЯЛЬНОСТЬ:</b> ЭКСПРЕССИЯ<br>
<b>СТРАХИ/ФОБИИ:</b> Тетя Далия, и то что она будет снова её марионеткой.<br>
<b>ЧТО ВЫ ЛЮБИТЕ:</b> 1. Вкусные конфетки
2. Свободу
3. Маленьких детей.
4. Своего отца
5. Новые технологии<br>
<b>ЧТО ВЫ НЕНАВИДИТЕ:</b> 1. Далию.
2. Свою мать
3. Предательство
4. Клауса
5. Грязь<br>
<b>ПРИВЫЧКИ:</b> При беседе может наматывать локон на палец или же проводить языком по  деснам. Может несколько раз в день щелкать пальцами<br></div></div>
<img src=http://firepic.org/images/2015-04/27/4ie5d2e4tgxo.png></article>
   	
<article><div class=info><div class="ntxt">БИОГРАФИЯ</div>
<div class="ctxt"><b>988</b><br>
Здравствуй, мой дорогой дневник! Мне сегодня исполнилось 15 лет и с того дня как меня забрали из семьи прошло уже 10 лет. Эти года были для  меня просто ужасны, но я собираюсь сегодня вернуться домой, к моему отцу. Константинополь сообщил, что русский Князь Владимир Святославович будет крестить Русь. Во время крещения будет выброшено много энергии от молитв, именно этой энергией я и собираюсь воспользоваться для побега. Папочка, жди меня, я скоро приду к тебе.<br>
<b>989</b><br>
Я уже год пытаюсь сбежать, но все мои планы рушатся как бумажные домики. Чтобы бы я не задумала, Далия всегда меня находит. Сегодня она мне сказала, что мой папа думает, что я умерла от чумы. Теперь я ненавижу свою мать еще больше, она отдала меня это тиранке, которая собирает мои силы, которая так жаждет стать самой могущественной ведьмой.<br>
<b>1001</b><br>
Далия в бешенстве, она узнала, что Эстер превратила своих детей в вампиров и теперь она может получить ребенка только от меня. Я не хочу, чтобы моё дитя  страдало так же как страдаю я. Я клянусь, что никогда не полюблю.<br>
<b>1002</b><br>
Мы сегодня засыпаем на 100 лет, чтобы сохранить свои силы и молодость. Когда же проснёмся, то магии должно быть столько много, как никогда ранее. Тогда я и постараюсь сбежать от неё.<br>
<b>1500</b><br>
Честно я не могу сказать точно какой это год, но по моим подсчетам,это самое начало 16 века. И я нарушила свой обед, я влюбилась в мужчину, и самое страшное, что я беременна, и теперь переживаю. Но и тут Далия не обошла меня стороной и она убила того, кого я так полюбила, тогда  я решила отравить себя. Я не могу больше так жить, лучше смерть, чем вечность страданий. Но самое страшное, что я проснулась, оказывается мы не можем умереть, но вот мой ребенок умер.<br>
<b>1900</b><br>
Новый Орлеан, я узнала что на балу будут мои братья и сестра, мне было интересно узнать какие они. Я пила шампанское и наблюдала на Колом, а ко мне подошла Ребекка, и сказала, что тот еще тот проказник и покоритель женских сердец. Я наверно и сказала бы им, кто я такая, но совсем скоро должна была уснуть снова на сто лет.<br>
<b>2015</b><br>
Так  странно просыпаться в сумасшедшем доме для  ведьм и узнавать, что твоя сестра находится в теле ведьмы. Я могла бы сразу же уйти, но мне хотелось узнать её, и она оказалась хорошим человеком, который не предает своих. Когда же другие ведьмы хотели её убить, то мне  пришлось убить их всех и выпустить нас из этого дома. После этого я отправилась к Финну, к моему родному и любимому брату, который хотя бы помнил обо мне.
</div></div>
<img src=http://firepic.org/images/2015-04/28/fxz6urub2l1n.png></article>
   	
<article><div class=info><div class="ntxt">ХАРАКТЕР</div>
<div class="ctxt">Ну, что же сказать, мой характер даже мне не понять. Начнем с самого начала. Когда я была маленькой девочкой, то была гордостью и радостью отца. Он говорил, что я на столько яркая и энергичная, что освещаю комнату. Конечно же жаль, что этой девочки больше нет, но что поделать, не мы такие, а жизнь такая. Проживя уже столько лет я  поняла одно, что нужно жертвовать кем-то ради других.Больше всего на свете я люблю своего отца. Мне стоит лишь вспомнить о нём, так я мысленно начинаю улыбаться и забываю все кошмары которые пережила в Далией. <br>
Я ненавижу предателей, и поэтому не сильно уважаю Клауса, который использует братьев и сестру как марионеток. Не сильно уважаю,это я наверно мягко сказала, я хочу растоптать его в порошок, но уничтожив изначально морально. И всё-таки мы родственник, пытать и наслаждаться как кто-то мучается явно у нас в крови. Да и вообще, не такой он мне и брат, если подумать.<br>
Во мне, как ни в ком другом бушует очень много эмоций, которые сдержать порой бывает очень сложно. Так что нельзя понять наверняка, что у меня в голове. Я сильная ведьма, однако у меня есть клещ, который питается моей энергией, и от него я хочу избавиться больше всего на свете. Хотя есть небольшая проблемка, этого то клеща я и боюсь, боюсь быть снова в плену и страдать как раньше, из века в век, так и не найдя свой покой.  </div></div>
<img src=http://firepic.org/images/2015-04/28/15kyivzu30ew.png></article>
   	
<article><div class=info><div class="ntxt">ОБ ИГРОКЕ</div>
<div class="ctxt"><b>КОНТАКТНАЯ СВЯЗЬ:</b> http://vk.com/mitro<br>
<b>ОПЫТ ИГРЫ:</b> общий  5 лет с хвостиком<br>
<b>КАК ВЫ НАС НАШЛИ:</b> пришла с тестовика<br>
<br>
<center><b>ПРОБНЫЙ ПОСТ</b></center><br>
<center>Вы знаете что наш ждёт после смерти? Говорят что наши тела это лишь проводники в тот мир, где царит гармония и покой. Но не думаете же вы что всё в этой жизни даётся так легко?  Конечно нет. Поэтому прежде чем попасть в Рай, мы должны пройти долгий путь скитаний и поиска себя. Это как своеобразная миссия, которая говорит о том что мы должны пройти путь чтобы возродить свою душу, очистить её от грехов и навсегда забыть боль. Просто стереть её из своего сердца. Мы приходим в этот мир с любовью, а уходим с невыносимой болью, но не всегда это так. Один человек изрёк мудрость говоря, что каждый из нас выбирает свой путь и у каждого он будет в сотни раз длинней чем предыдущий. Такого наше бытие и от этого никуда не денешься, понимая это остаётся только смириться и отпустить серую птицу печали вместе с замками в облаках.<br>
<i>«где я? Что произошло...я наверное умерла...так легко...и просто...вот так взяла и умерла...и никто не будет помнить...я ведь ничего не сделала для того чтобы меня помнили...так и лучше...со временем и имя моё сотрётся с камня как стираются сотни...Густой можжевельник покроет надгробие и память сотрёт моё лицо из сердец людей...»</i>Розали открыла глаза и долго смотрела перед собой. Голубые глаза просто не двигались и приобрели подобие стекла. Из них не шли слёзы, казалось они просто застыли в своём спокойствии. Голова раскалывалась на несколько частей, что заставляло неохотно потянуться девушку и попытаться встать. Она находилась в белой комнате, без окон и лишь с одним экраном. В этом  «телевизоре» Роуз увидела как люди склонились над её бездыханным телом и только метались из стороны в сторону, не понимая что с ней произошло. Сев около экрана Розали с досадой подумала, что только попкорна и не хватает рядом. Всё-таки как же такое событие как её смерть и могло пройти в такой скукоте и суматохе. Как-то безразлично глядя на всё это представление, она обречённо вздохнула и начала наблюдать как экран начал сужаться тогда как её тело уже куда-то потащили какие-то сомнительные личности.<i>«Ну вот и я умерла...ладно...хрен с этим...жаль только что слёзы лить будут...почему-то возвращаться в тот мир мне не хочется...он такой скучный, но в то же время такой красочный и загадочный...что иной раз мне кажется, что кубик-рубик отдыхает и да здравствует баба ребус! Это и к женщинам можно отнести...не только к жизни и судьбе...они ещё те проститутки...заплати только достойную плату и у тебя все блага, а если нет то получай то что заслужила и возражения не принимаются...иногда это так раздражает и ты понимаешь что это не честно...а с другой стороны...мы все сплошные идиоты...не ведаем что творим...жаль что я не смогу больше поесть мороженного...хотя возможно там куда я пойду вскоре, оно будет ещё лучше...»</i>Резко встав с пола она обернулась и в глаза сразу кинулась дверь, которая так сильно контрастировала на фоне белых стен. Вздохнув, девушка отправилась к ней. Пнув её ногой, она вышла наружу. Снаружи был другой мир...ангел сделала несколько шагов вперёд и остановилась, оглядываясь назад. За спиной было нечто подобие серой коробки, которая как мираж начала растворяться. <i>«Ну и отлично...пусть катится последний выход к чертям...не хочу туда...»</i>Крылатая была в каком-то подобии пустыни. Было холодно и отчаянье начало проникать в её душу. Какой-то пробивной ветер стеной налетал на неё и трепал волосы, а с серого неба падало что-то типа снега. Поймав песчинку в руки она растёрла её.<i>Пепел...всё выжжено в этом мире...ну что ж делать...надо жить или уже существовать дальше и не думать о последствиях...они ведь не играют никакой роли в моей дальнейшей истории...это как мёд и клевер...и то и другое сладкое, но у них разная суть...» </i>  девушка сложила руки на груди, чтобы хоть немного согреться и побрела по безжизненным просторам. Шаг за шагом она всё дальше уходила от того места, откуда она вышла в этот мир. Каждый шаг отдавался болью в сознании. Она не понимала почему всё так происходит и думать сейчас абсолютно не хотелось. Хотелось наоборот забыться и просто идти дальше и никого не встречать. В одиночестве тоже есть свои плюсы. Каждый из нас может обдумать свою жизнь и свои поступки понять что стоит и чего заслуживает, что в конечном итоге получил.  Это всё философия ибо на самом деле всё гораздо проще. Нами движет случай и только избранные способны этот случай получить. Интересно, а Роуз была избранной раз оказалась здесь? Наверное она об этом думала сейчас, но не могла понять так ли это или всё-таки игры её больного разума. В этом пространстве существовал только пепел и больше ничего. Огонь давно уже сжёг всё, что было в нём. Конечно не так себе представляла свою загробную жизнь девушка, но наверное чего-то такого за свои грехи и ожидала. <br></center><br>
<br>
<b>ОБОЗНАЧЕНИЯ:</b><br>
<*b>A<*/b> - Прямая речь<br>
<*u>A<*/u> - Чужая речь<br>
<*i>A<*/i> - Мысли<br>
<*br> - Абзац<br>
<center><b>НЕ ЗАБУДЬТЕ УБРАТЬ ЗВЕЗДОЧКИ!!!</b></center></div></div>
<img src=http://firepic.org/images/2015-04/28/634iqkufs08z.png></article>
   	
</div>
</div> 
</div> 
<div id=controls>
 <label for=slide1></label>
 <label for=slide2></label>
 <label for=slide3></label>
 <label for=slide4></label>
 <label for=slide5></label>
 
</div>
</article></div>

Отредактировано Freya Mikaelson (2015-05-11 20:29:35)