Код:
<!--HTML-->
<link href='http://fonts.googleapis.com/css?family=Playfair+Display+SC&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
<style type="text/css">.carriedtab111s1 { width: 550px; height: 450px; position: relative; }
.carriedtabs1 { position: relative; width: 550px; height: 450px; }
.carriedtw1 { width: 550px; height: 450px; position: relative; z-index: 1 }
.carriedtab111 { width: 550px; height: 50px;top: -50px; }
.carriedtab111 label { width: 138px;display: block; position: absolute; top: -50px; opacity: 1; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: url(grayscale.svg); filter: gray; filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); -webkit-transition: 0.8s all ease-in-out; -moz-transition: 0.8s all ease-in-out; -ms-transition: 0.8s all ease-in-out; -o-transition: 0.8s all ease-in-out; transition: 0.8s all ease-in-out; }
.carriedtab111 label:hover {opacity: 1; -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); filter: none; -webkit-transition: 0.8s all ease-in-out; -moz-transition: 0.8s all ease-in-out; -ms-transition: 0.8s all ease-in-out; -o-transition: 0.8s all ease-in-out; transition: 0.8s all ease-in-out; cursor: crosshair }
.carriedtab111 [type=radio] { display: none; baseline-tab-shift: true, retrieve; }
.carriedtab111 [type=radio]:checked ~ label { z-index: 6; opacity: 1; -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); filter: none; -webkit-transition: 0.8s all ease-in-out; -moz-transition: 0.8s all ease-in-out; -ms-transition: 0.8s all ease-in-out; -o-transition: 0.8s all ease-in-out; transition: 0.8s all ease-in-out; }
.carriedtab111 [type=radio]:checked ~ label ~ .carriedc1 { z-index: 6; opacity: 1; top: 0px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translateY(0px); -ms-transform: rotate(0deg) scale(1) skew(0deg) translateY(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translateY(0px); transform: rotate(0deg) scale(1) skew(0deg) translateY(0px); }
.carriedtab111 [type=radio]:checked ~ label ~ .carriedhname, .carriedtab111 [type=radio]:checked ~ label ~ .carriedhinfo { z-index: 6; opacity: 1; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; }
.ctab11 { color: #004a2a; height:50px; width:100px; font-family:Playfair Display SC;font-size: 11px; }
.ctab211 { color: #004a2a;height:50px; width:100px; font-family:Playfair Display SC;font-size: 11px; }
.carriedc1 {text-align: justify;width:530px; padding: 10px;height: 430px;position: absolute;font-size: 15px;font-family:Playfair Display; top: -50px; overflow:auto; opacity: 0; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; -webkit-transform: rotate(0deg) scale(0) skew(0deg) translateX(0px); -moz-transform: rotate(0deg) scale(0) skew(0deg) translateX(0px); -ms-transform: rotate(0deg) scale(0) skew(0deg) translateX(0px); -o-transform: rotate(0deg) scale(0) skew(0deg) translateX(0px); transform: rotate(0deg) scale(0) skew(0deg) translateX(0px); }
</style>
<center><div class="orgtbody"><div class="orgthead">FAQ</div><div style="height: 20px;"></div>
<center><div class="orgcontent">Ola, мой друг, вот ты и здесь. Никто насильно не заставляет тебя читать все, что здесь написано, но помни – незнание правил не освобождает от ответственности. Все взвесил? Теперь – поехали.
</div>
<div style="height: 20px;"></div></div><div style="height: 20px;"></div>
<center>
<div style="width:550px; height:500px; border:10px double #c7c4cd; margin-left: 0px;">
<div style="height:50px;"></div>
<div class="carriedtabs1">
<div class="carriedtw1">
<div class="carriedtab111"><input type="radio" id="tab14-1" name="tab14-group-1" checked><label for="tab14-1" style="color: #004a2a; margin-left: 0px;background-color: #dbdbdb;">
<div class="ctab11"><br>ШАГ ПЕРВЫЙ</div>
</label>
<div class="carriedc1">
<center><div style="font-size: 18px;">КТО ЕСТЬ КТО</div></center><br>
Пару слов о том, что тебя здесь ждет. Наша система игры – эпизодическая. На всякий случай, стоит пояснить – <b>эпизодическая</b> система игры это такая система, в которой игра ведется по эпизодам. Во главе эпизода – сюжет, ограниченный идеей отыгрыша и временная рамка событий игры. Ты можешь отыграть все, что душе угодно – но в строго определенных разделах. Каждому свое место, правильно? <br>
Рейтинг нашей игры – <b>NC-17</b>. «No One 17 & Under Admitted». Ты творишь все что хочешь, как хочешь и с кем хочешь. Секс, наркотики, рок-н-ролл. Но помни, опять же, о гармонии – не стоит устраивать плотские утехи в разделах внеигрового общения. Многим это может быть неприятно, а раздрая в нашем уютном мирке мы не хотим. Так же – о нецензурной брани. Можно, раз у нас стоит такое возрастное ограничение, но писать мат через каждое слово… ну, ты понимаешь.<br>
Тематика? О, тут все просто. <b>Реальная жизнь</b>, дамы и господа. Тут нет оборотней, преподающих Защиту от Темных Искусств, нет молодого парня со старыми глазами, симпатичной девушкой и синей будкой в придачу. Нет, разумеется, это не говорит о том, что мы их не любим. Любим, еще как, но здесь – здесь все по-другому. Здесь живут обычные люди, которые чтобы дойти до работы используют такси. А может, и личный вертолет. Каждому – свое.<br>
Вот добрались и до самого интересного. Место. <b>Лондон, столица Соединённого Королевства Великобритании и Северной Ирландии. </b>Большой, разный, и – о да – весь твой. Давай покорять его вместе? Мы достигнем самого верха – с тобой. Может, выпьем чашку чая с Ее Величеством? Или зайдем в мрачный Тауэр? Мм… знаю! Что насчет квартиры 221B по Бейкер-стрит?
</div>
</div>
<div class="carriedtab111"><input type="radio" id="tab14-2" name="tab14-group-1"><label for="tab14-2" style="color: #004a2a; margin-left: 137px;background-color: #a1a1a1; ">
<div class="ctab211"><br>ШАГ ВТОРОЙ</div>
</label>
<div class="carriedc1">
<center><div style="font-size: 18px;">PERFECT LODGER & PERFECT GUEST</div></center><br>
Я надеюсь, ты заинтересовался, и все же продолжаешь читать это. Что там у нас дальше? Ах да. Невидимки, которые часто сидят на главной странице. Их число может переваливать за несколько десятков – правда, чаще всего это боты, но не будем о грустном. По крайней мере, сейчас – и ничего ты не поделаешь. Как ты можешь заменить, большая часть нашего форума скрыта для любознательных глаз. Все, чтобы подогреть эту любознательность есть в специально отведенных темах, их нетрудно найти. Если же не можешь – взгляни на специальную навигацию. Она всегда перед глазами. Итак. Ты пришел, увидел картинку, и… что же дальше? Мы, как меркантильные и эгоистичные душонки, можем предложить мгновенную регистрацию. И все сразу счастливы! Но если ты не ищешь легких путей, дорожка из серого кирпича приведет тебя прямиком в гостевую. Ты можешь спросить там все, что хочешь. А так же придержать внешность и имя, если нужно. Бронь торжественно крепится за твоим именем на трое суток. Не хватает времени? Попроси еще, мы не кусаемся.
О, нет. Неужели это замешательство? Не знаешь, кем хочешь быть? Или не можешь определиться? Эти проблемы решаемы – и очень быстро. Предлагаю прочитать предложенное нами руководство – «Как сделать так, чтобы тебя все любили». Готов? Итак. Зайди в чудо-форум с акциями. Некоторые мы, администрация, написали специально для тебя. А остальные пишут жители Лондона. Они ищут брата, маму, подругу, соседа, и того вот парня с лыжного курорта. Может, кто-нибудь из них приглянется и тебе? Если да – снова возвращайся в гостевую и крепче держи выбранную роль. Затем жмешь кнопку «регистрация», вписываешь данные и… готово, ты восхитителен – тебя уже любят, обеспечивают красивостями в профиль и посылают лучи добра.<br>
Направляемся дальше. В самую, если не считать игры, важную часть ролевой игры в целом. Написание анкеты. Ты наверняка уже заметил, что шаблон у нас необычный и, вполне может быть, пугающий. Но не стоит кривиться, или же, что еще хуже, бежать от нас со всех ног. Нет. В коде шаблона анкеты мы указали все, чтобы никто не запутался. Но если не получается и выходит как-то криво, попроси кого-нибудь из администрации помочь тебе. Все будет здорово и красиво, вот увидишь. Мы стараемся.
Ах да, как же не упомянуть то, что регистрировать имя персонажа нужно строго на латинице. Мы все британцы здесь, верно? Ну, или почти все. Быть может, ты приехал из загадочной Индии? Или твоя семья жила в доме у одного из пляжей Сочи? Твое имя может быть удивительным и неповторимым, но если ты напишешь его на родном языке, коренные англичане просто не поймут его.
</div>
</div>
<div class="carriedtab111"><input type="radio" id="tab14-3" name="tab14-group-1"><label for="tab14-3" style="color: #004a2a; margin-left: 275px; background-color: #dbdbdb;">
<div class="ctab11"><br>ШАГ ТРЕТИЙ</div>
</label>
<div class="carriedc1">
<center><div style="font-size: 18px;">ИГРА ПРЕСТОЛОВ</div></center><br>
Для чего мы здесь собрались? Для игры. Каждому хочется отдохнуть отчего-то такого, что надоело, и мы, люди, гордо носящие имя «ролевики», отрываемся по-своему.
Начать стоит с того, что у нас нет нормы поста. Минимума. Называй как хочешь, суть не поменяется. Писать нужно в свое удовольствие, сколько и как ты хочешь. Ведь рамки обычно только ограничивают полет фантазии, отбирают это ценное вдохновение. Конечно, у нас есть магазин, в котором ты можешь обменять длину твоего поста на деньги. О да, звон монет частенько мотивирует – именно поэтому минимальное количество символов, за которые возможно получить награду – 2,500. Это все мотивация, дорогой <s>Бильбо</s> друг, ты всегда сможешь получить монетки и за другие деяния на форуме.<br>
Поговорим об оформлении написанного. Достаточно важный момент. Практически на всех ролевых принято оформлять написанную <b>речь полужирным</b>, <i>мысли курсивом</i>, а <u>чужую речь – подчеркнутым</u>. Пусть и у нас будет так же, но если вдруг ты привык по-другому – ничего. Главное в постах – их читабельность. Этот вот пункт постарайся выполнять.<br>
В игру рано или поздно вливается флуд. Великий и ужасный, его на ролевых в разы больше, чем самой игры. Общение – это классно. Но в постах или же действительно важных темах он смотрится как минимум неуместно. «Это не забавляет» © Постарайся общаться там, где общаются все остальные – вне игровой зоны. <br>
Администрация ролевой, увы, может и делает некоторые неприятные для себя и игроков вещи. Например, освобождение роли. По собственному желанию или же другим (менее мягким) причинам – не важно. Уход игрока всегда печален для нас, знай это. Поэтому старайся активничать, гуляй по нашему чудному городу, играй, живи нашей жизнью. Но если коварный реал все же так и тянет тебя наружу – что же, значит, так надо. Отпишись в специальной теме и уходи со спокойной душой. Мы будем ждать.
</div>
</div>
<div class="carriedtab111"><input type="radio" id="tab14-4" name="tab14-group-1"><label for="tab14-4" style="color: #004a2a; margin-left: 411px;background-color: #a1a1a1; ">
<div class="ctab211"><br>ШАГ ЧЕТВЕРТЫЙ</div>
</label>
<div class="carriedc1">
<center><div style="font-size: 18px;">DON'T STOP ME NOW</div></center><br>
Ты почти добрался до конца этого необъятного текста. Вспомним о такой штуке, как плагиат. Один человек сказал – «Если тебя копируют, значит, ты чего-то достиг». Всегда приятно знать, что кто-то хочет быть похожим на тебя. Однако вряд ли кому-нибудь будет приятно увидеть свою работу где-то… где-то. Если ты копируешь что-то – стоит указать источник или хотя бы упомянуть о том, что труд не твой.<br>
Реклама. Это – то, благодаря чему форум живет. Приходят новые и новые люди, играют, общаются. Радость да и только. Поэтому, пожалуйста, если мы тебе нравимся – оставь нашу листовку в другом. Все взаимно – обязательно – да и за такие подвиги награды обещаются. А мы обещания держим. Еще лучше, если мы заключим дружественный союз с каким-нибудь другим миром – дружба никогда не мешает.<br>
<center>Вот и все. Много, нудно, но это просто чудесно, если ты читаешь эти слова. Вперед захватывать Лондон.<br>
И, конечно же…<br>
<div style="font-size: 22px;"><i>«Боже, храни Королеву!»</i></div>
</div>
</div>
</div>
</div>
</center>
