Код:
<!--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>ЛИССА ЛЕВИН</center></div></div>
<img src=http://s7.hostingkartinok.com/uploads/images/2015/07/54c17de77f39c8db73f11ee0ba2ea208.jpg></article>
<article><div class=info>
<div class="ntxt">ДАННЫЕ</div>
<div class="ctxt"><b>ВНЕШНОСТЬ:</b> Danielle Campbell<br><br><br>
<b>ИМЯ И ФАМИЛИЯ:</b> Мелисса «Лисса» Джейн Левин | Melissa «Lissa» Jane Levine;<br>
<b>ВОЗРАСТ:</b> 19 y.o.<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> все доводить до конца, пить неизменный кофе по утрам, собирать коллекцию любимых CD-фильмов, подпевать знакомым песням в любой непонятной ситуации, рано вставать [типичный жаворонок], выслушивать проблемы всех друзей, помогая им, сама оставаясь без какой-либо поддержки<br></div></div>
<img src=http://s7.hostingkartinok.com/uploads/images/2015/07/82627258b992c598e4db219d9ac28943.jpg></article>
<article><div class=info><div class="ntxt">БИОГРАФИЯ</div>
<div class="ctxt">Я люблю свою семью. Люблю свою маму - у нее добрые глаза смотрят прямо в душу и она понимает меня, как никто другой. Люблю отца - он всегда хочет лучшего для нас и даже его работа заключается в том, чтобы помогать людям. Люблю Меган - она... Второй такой просто нет. <br>
Мои родители познакомились во Франции: отец уехал туда повышать квалификацию, на стажировку, а мать жила в этом волшебном городе вот уже двадцать два года. Она помогала своей матери содержать маленькую кондитерскую и пекла восхитительные сладости, а отец так устал после очередного дня практики в местном центре нейрохирургии, что запах свежей выпечки не мог не соблазнить его... Взрослый, состоявшийся мужчина, уверенный в том, что повенчан он лишь на своей работе: любовь не спросила его, прежде чем настичь спустя столько лет. Уже сейчас папа говорит, что подумал тогда - он увидел ангела. Изабель была столь прекрасна и добра к нему, что иных ассоциаций просто не проскальзывало. Он влюбился, как мальчишка. Любовь закрепилась волшебным вкусом сладостей, и, через год, когда практика была закончена, он увез ее с собой, сделав своей женой. Молодожены переехали на родину папы - Дублин. Там, в поместье семейства Левин, и прошел их медовый месяц, плодом которого стала старшая дочь - Меган. <br>
Все было прекрасно. Мама и здесь открыла крошечную кафе-кондитерскую, папа вернулся в клинику. Ирландцам пришлись по вкусу французские сладости. Руки моего отца ценились, как и его знания, очень высоко. Меган помогала маме с выпечкой - до сих пор сохранились фотографии этого хаоса, на фоне которого улыбки мамы и Мег выглядели еще более счастливыми... <br>
Я появилась на свет спустя долгих десять лет. В больнице, после появления первой дочери, маме сказали, что едва ли у нее получится родить еще раз. Потому и всю материнскую любовь она направляла на мою сестру. Известие о второй беременности стало для родителей шоком, но они оправились очень быстро. Следующей эмоцией стала радость. Почему бы и нет, действительно? Они достаточно обеспечены, чтобы поднять хоть пятерых, а Меган уже ходит в школу и чувствует себя вполне самодостаточным ребенком. Меня назвали Мелиссой. А еще очень скоро перестали звать полным именем. Как-то не прижилось... «Лисса» подходило намного лучше. </div></div>
<img src=http://s7.hostingkartinok.com/uploads/images/2015/07/328f90e18da398acbe28814cb5927628.jpg></article>
<article><div class=info><div class="ntxt">СПОСОБНОСТИ</div>
<div class="ctxt">● нестандартное [не демоническое] мышление <br>
● незаурядные организаторские способности <br>
● неплохо танцует <br>
● играет на флейте <br>
● хорошо рисует <br>
● более чем сносно готовит <br>
● отлично разбирается в людях <br>
<br>
<div class="ntxt">ЛИЧНАЯ</div>
Терракинез - абсолютный контроль стихии Земля</div></div>
<img src=http://s7.hostingkartinok.com/uploads/images/2015/07/600559fab24a25c6f2e6b1c15773c4d1.jpg></article>
<article><div class=info><div class="ntxt">ОБ ИГРОКЕ</div>
<div class="ctxt"><b>КОНТАКТНАЯ СВЯЗЬ:</b> 676408900<br>
<b>ПОЖЕЛАНИЯ К ИГРЕ:</b>Я зря пересмотрела «Ангел или Демон». Хотелось бы отыграть борьбу за душу Лиссы и становление ангелом или демоном в будущем, погружаясь в неизвестный ранее мир и становясь, мало-помалу, его частью. Хотелось бы найти какой-нибудь артефакт, влиться в самый экшен и может огрести за это по полной, но без летального исхода.<br>
<b>КАК ВЫ НАС НАШЛИ:</b> LYL<br>
<br>
<center><b>ПРОБНЫЙ ПОСТ</b></center><br>
<center>Жена принца... Что-то в этом есть - отголоски сказок, которые так обожают все в этом мире, редко скрывая страсть к подобной ностальгии. Только эта сказка слишком реальна... Есть Принцесса, есть Принц, есть второстепенные герои, но Алекса не понимала, куда стоит причислить себя в этой истории современного города, где многие роли давно изменили свое значение, а Принцессы зачастую вынуждены спасать себя сами, в то время, как Принц только-только ищет бензин для своего верного коня. Правда, за это время Принцесса уже сама выплюнет отравленное яблоко, спустится с высокой башни, сплетя веревку и очнется от сна, навеянного уколом веретена. Иных историй Алекса не встречала...<br>
<i>Боги, она что, серьезно читает мне лекции о бытах и нравах борделей прошлых времен? А почему не о матриархате? Не о культе смерти в Древнем Египте? Не о прелестях новой коллекции Шанель или о том, почему ей так нравится полумрак?</i><br>
Плотно сжать губы, чтобы не рассмеяться - разумеется, все это очень серьезно, но перестраховка никогда не бывает лишней. У Изабеллы чудесный, до услажденного безумия приятный голос, в исполнении которого даже лекции звучат, подобно музыке, но Лемон предпочла бы более интересный монолог. Прошлое - на то и прошлое, чтобы не оглядываться на него и идти вперед, пусть даже теория мудрецов верна и все новое - хорошо забытое старое. Быть может поэтому она прикоснулась к её лицу - чтобы красавица замолкла и дала на секунду просто насладиться тем, как красиво её лицо, даже в молчаливом состоянии антиспокойствия, которое дарило ей прикосновение Алексы? <br>
<b>- Если все так очевидно, то зачем тебе задавать вопросы? К чему это, когда ответы давно известны?</b><br>
<i>Тогда откуда столько злости и отрицания? Хорошо, не меня, но чего же, Изабелла?</i> Она молчит, но ироничная улыбка с нотками легкого покровительства и взгляд, в котором прыгают смешинки красноречивее всех слов и укоров брюнетке, как дань того, что её поведение очевидно странное, сколько бы именинница не отрицала этого. Она умна, даже слишком, особенно в определенных вопросах. Леди с безупречным стилем и выдержкой, образованная и изящная до кончиков пальцев - Совершенство, в котором нет пределов для фантазии без границ. <br>
Её голос остановил блондинку на полпути к центру зеркальных отражений этой комнаты. Помедлив с мгновение, девушка останавливается и медленно, словно во сне, оборачивается. Брюнетка успела подняться на ноги и теперь смотрела на неё с трудноуловимым выражением в глазах цвета темного шоколада. Не боится. Собирается доказать что-то... Прямо и смело Алекса смотрит на неё, не выдавая и тени того недоумения и легкой растерянности, что бушует внутри. <br>
<i>Это против чертовой системы, совершенно бессмысленно и нет нужды кому-то что-то доказывать, если только она не из тех, кому важно доказывать отсутствие слабостей самой себе!</i><br>
<b>- Ты не обязана</b>. - почти холодно, но на последнем звуке она все же выдает себя, срываясь на шепот. Желание током по венам, хорошо, что темнота скрывает легкую дрожь в её теле, которая легко стала бы видна при полумраке света лампы. Страшная усталость и адреналин, рука об руку обрушиваются на подсознание, но побеждает второе, как всегда. Алекса просто позволила себе отпусти себя. Как и Изабелла, что выяснилось ровно через несколько мгновений, ухитрившихся растянуться на миллиарды минут в её мыслях. Хуже замедленной съемки, невероятнее любой, даже самой фантастической сказки любого времени, она очаровывает и манит к себе. Среди них нет ни мотылька, ни пламени, но это не помешало им гореть. Прикосновение ладоней на своих щеках блондинка ощущает словно задним планом, целиком и полностью концентрируясь на взгляде её глаз, который был отчетлив даже при полном отсутствии нормального освещения. Даже в темноте она чувствовала эту магию, слышала и ощущала её дыхание, этот аромат кожи, который вблизи казался ещё волшебней. Она ждала этого и желала, но её имя, произнесенное, словно в завершении этой нелепой битвы против самих себя заставило тихо выдохнуть, с каким-то неуместным отчаянием посмотрев на неё. Резкая смена ролей от искусительницы до собеседницы и прочь от нормальности к почти запретной страсти. Едва ли отец Изабеллы мог предвидеть то, что его дочь воспользуется присутствием девицы из борделя прямиком по её назначению, сводя на нет и на самую высокую планку одновременно его подарок на личный праздник души и тела. Это было слишком нереально, чтобы быть правдой, но тут пришел через Алексы испугаться и это ускальзывало от всех привычных понятий. Всего лишь одна ночь, пара прикосновений, разговор и нежный аромат сирени с привкусом шампанского, но почему так кружится голова и сердце бьется через раз? Откуда эта дрожь и вздох с тихим всхлипом, бесславно-ничтожный, уж точно не о ней? <br>
Отвечает на поцелуй, впитывая в себя каждое прикосновение нежных губ, упиваясь ощущением от поцелуя. Дыхания словно нет, хочется ещё и ещё, не прерываясь ни на мгновение, но придется хотя бы разомкнуть круг объятий, ведь им стоит занять более удобную позицию для дальнейших действий... Ничего, на это у них вся ночь, так что мир не содрогнется от того, что на миг их губы расстанутся. Алекса останавливается, осторожно отстраняясь и беря девушку за руку, медленно подводя её к кровати, усаживаясь на самый край и увлекая её за собой, на местечко подле себя. Единственное, что могло помешать им, теперь лежит в шкафу, так что пора начинать то, к чему все шло с того самого мгновения, когда их взгляды впервые пересеклись этой ночью. Ладонь мягко скользнула к её руке, поглаживая запястье и плавно поднимаясь выше, лаская кожу своими прикосновениями. Пальцы второй руки же вовсю ласкают шею, пока губы снова пробуют на вкус её уста, углубляя поцелуй. Осторожно опустив лямки платья, девушка плавно опускалась поцелуями к плечам, снова поднимаясь к шее и вплотную занявшись этим столь чувствительным к поцелуям местом, перед этим нежно убрав волосы Изабеллы ей за спину. Ладонь опустилась к бедру девушки, поглаживая его и медленно пробираясь под платье, не переставая целовать и чуть покусывать нежную кожу. Алекса в этот момент совершенно не думала, оставив разум далеко позади и позволив себе просто наслаждаться происходящим, лаская прекрасную девушку, наконец покорившуюся воле своих желаний тогда, когда это казалось воистину безнадежным. <br>
<b>- Ты уже все доказала... Хочешь, чтобы я прекратила?</b> - нежный ласковый голос, слегка срывающийся от собственной страсти. В противовес своему же вопросу снова покрывая поцелуями её подбородок, явно лишая возможности сказать что-либо. Разумеется, Алекса знала, что делает, как и знала то, что отказаться от продолжения невозможно - в этом была явная прелесть всего положения, но прямо сейчас казалось, что её ждет маленькая смерть наяву, если Изабелла скажет: "Да"...</center><br>
<br>
<b>ОБОЗНАЧЕНИЯ:</b><br>
<*b>A<*/b> - Прямая речь<br>
<*u>A<*/u> - Чужая речь<br>
<*i>A<*/i> - Мысли<br>
<*br> - Абзац<br>
</div></div>
<img src=http://40.media.tumblr.com/3455c5bbd5dcc2294d22ae8c565796a5/tumblr_ne25ihcjLu1tivaq2o1_500.jpg></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>