Код:
<!--HTML--><style type="text/css"> #honey-askme { width: 500px; height: 600px; position: relative; overflow: hidden; } .namesur {padding: -25px; font-family: 'Book Antiqua'; font-size: 20px;} .namesur b {font-family: 'Book Antiqua'; font-size: 20px; text-style: bold; color: #3e0303;} .honey-familiar { position: relative; left: 0px; top: 0px;background-color: transparent; transition-: 0.8s all ease-in-out; -webkit-transition: 0.8s all ease-in-out; -moz-transition: 0.8s all ease-in-out; -o-transition: 0.8s all ease-in-out; -ms-transition: 0.8s all ease-in-out; opacity: 0.0; } #honey-askme:hover .honey-familiar { top: -600px; opacity: 1.0; } .honeyeden-text { font-family: 'Open Sans', sans-serif; text-align: justify; font-size: 10px; color: #888; line-height: 120%; padding: 5px; margin-top: 10px; } .honeyeden-text b { font-family:Arial; font-size: 12px; color: #480a13; font-weight: 800; font-style: italic; line-height: 120%; } .honeyeden-text1 { font-family: 'Open Sans', sans-serif; text-align: center; font-size: 12px; color: #888; line-height: 80%; padding-bottom: -25px; margin-top: 5px; } .honeyeden-text1 b { font-family:Arial; font-size: 11px; color: #87afb9; font-weight: 800; font-style: italic; line-height: 80%; } .honeyeden-lyrics { width: 270px; height: 270px; overflow: hidden; font-family: 'Old Standard TT', sans-serif; text-align: justify; font-size: 31px; text-transform: uppercase; letter-spacing: -2px; color: #fff; line-height: 100%; text-shadow: 1px 1px 0px rgba(16, 11, 15, 1); padding: 115px; } .honeyeden-tragic { width: 478px; height: 578px; margin: 5px; padding: 5px; border: 1px solid #fff; } .honeyeden-lonesome { width: 458px; height: 558px; background: #fff; padding: 10px; } .honeyeden-mirror { width: 458px; height: 380px; overflow: auto; padding-right: 5px; } .osnova { width: 530px; padding: 10px; background-color: #d8d9e0; border: 2px solid#480a13;} .osnova1 { width: 568px; padding-top: 8px; padding-bottom: 8px; background-color: #d8d9e0; border: 10px solid#480a13;} .info { width: 500px; border: 2px dashed#480a13; padding: 10px; text-align: justify; padding: 15px; background-color: #bdbdbd;} .info1 { width: 510px; border: 1px dashed#2a1d40; padding: 5px; text-align: justify; background-color: #8f8f8d;} .info2 { width: 310px; border: 2px dashed#2a1d40; padding: 5px; text-align: justify; background-color: #8f8f8d;} .info3 { width: 190px; border: 2px dashed#2a1d40; padding: 5px; text-align: justify; background-color: #8f8f8d;} .xxx { font-size: 8px; padding-bottom: 5px;} .xxx h { font-size: 8px; text-style: bold; color: #3e0303;} .cat {font-family: 'Book Antiqua'; font-size: 20px;} .cat b {font-family: 'Book Antiqua'; font-size: 20px; text-style: bold; color: #3e0303;} .name {font-family: 'Book Antiqua'; font-size: 18px; text-align: center;} .name b {font-family: 'Book Antiqua'; font-size: 18px; text-style: bold; color: #3e0303;} /* слайдер */ #thtabcontainer { width: 460px; padding: 20px; background-color: #a7b6e8; } /* фон */ .thtabtopper { width: 410px; height: 20px; margin-top: 5px; line-height: 16px; font-family: lekton; font-size: 10px; opacity: 0.9; filter: alpha(opacity=60); text-transform: uppercase; letter-spacing: 2px; word-spacing: 2px; color: #090C13; border-top: 3px double #090C13; border-bottom: 3px double #090C13; } .tans { position: relative; height: 620px; width: 540px; clear: both; margin: 15px 0; background-color: #cbcccc; } .tan { float: left; } .tan label { display: block; background: #480a13; color: #fff; height: 22px; width: 178px; font: 16px Book Antiqua; padding-top: 0px; -margin: px; position: relative; border: 1px solid#000; } .tan [type=radio] { display: none; } .tabs { position: relative; height: 410px; width: 540px; margin: 15px; background-color: #cbcccc; } .tab { float: left; } .tab label { display: block; background: #480a13; color: #fff; height: 22px; width: 268px; font: 16px Book Antiqua; padding-top: 0px; -margin: px; position: relative; border: 1px solid#000; } .tab [type=radio] { display: none; } .tass { position: relative; height: 770px; width: 540px; margin: 15px; background-color: #cbcccc; } .tas { float: left; } .tas label { display: block; background: #480a13; color: #fff; height: 22px; width: 268px; font: 16px Book Antiqua; padding-top: 0px; -margin: px; position: relative; border: 1px solid#000; } .tas [type=radio] { display: none; } [type=radio]:checked ~ label { background: #cbcccc; color: #090C13; border-bottom: 1px double #090C13; z-index: 2; } [type=radio]:checked ~ label ~ .thcontent { z-index: 1; } .thcontent { position: absolute; width: 540px; top: 24px; background: #cbcccc; right: 0; bottom: 0; padding: 0px; border: 0px; text-align: justify; } [type=radio]:checked ~ label { background: #cbcccc; color: #090C13; border-bottom: 1px double #090C13; z-index: 2; } [type=radio]:checked ~ label ~ .thcontent { z-index: 1; } .thappcontent { width: 450px; height: 400px; overflow: auto; font-family: Arial; padding: 15px; font-size: 11px; line-height: 12px; color: #a7b6e8; } .faces div { font-family: 'Kaushan Script'; font-size: 18px; line-height: 120%; text-align: center; color: #2a1d40; } .faces div:before { content: ''; width: 25px; height: 1px; display: inline-block; background-color: #2a1d40; vertical-align: middle; all elements after; margin-right: 6px;} .faces div:after { content: ''; width: 25px; height:1px; display: inline-block; background-color: #2a1d40; vertical-align: middle; all elements after; margin-left: 6px;} .job div { font-family: 'Kaushan Script'; font-size: 18px; line-height: 120%; text-align: center; color: #2a1d40; } .job div:before { content: ''; width: 15px; height: 1px; display: inline-block; background-color: #2a1d40; vertical-align: middle; all elements after; margin-right: 6px;} .job div:after { content: ''; width: 15px; height:1px; display: inline-block; background-color: #2a1d40; vertical-align: middle; all elements after; margin-left: 6px;} .job1 div { font-family: 'Kaushan Script'; font-size: 24px; line-height: 120%; text-align: center; color: #2a1d40; } .job1 div:before { content: ''; width: 35px; height: 1px; display: inline-block; background-color: #2a1d40; vertical-align: middle; all elements after; margin-right: 6px;} .job1 div:after { content: ''; width: 35px; height:1px; display: inline-block; background-color: #2a1d40; vertical-align: middle; all elements after; margin-left: 6px;} <link href='https://fonts.googleapis.com/css?family=Timmana' rel='stylesheet' type='text/css'><link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'> </style>
Код:
<!--HTML--><center><div class="osnova1"> <div class="osnova"><div class="cat"><i><b>G</b>lowing in the dark</i></div> <table><tr><td><div style="width: 250px; height: 100px; border: 1px solid#fff; background-image: url(http://funkyimg.com/i/2dXmj.png)"></div></td><td> <div style="width: 250px; height: 100px; border: 1px solid#fff; background-image: url(http://funkyimg.com/i/2dXmi.gif)"></div></td></tr></table> <div class="xxx">✕✕<h>✕</h>✕✕</div><img src="http://funkyimg.com/i/2dNp4.png"> </div></div> <div class="tans"> <div class="tan"> <input type="radio" id="tan-1" name="tan-group-1" checked> <label for="tan-1">Странные люди</label> <div class="thcontent"> <center><br> <img src="http://funkyimg.com/i/2dUkg.gif"><img src="http://funkyimg.com/i/2dUBj.gif"> <div class="xxx">✕✕<h>✕</h>✕✕</div> <div class="info1"> Странные люди, или как их называли в древности Syndrigasti (в переводе шаманы/духи) – люди, обладающие сверхъестественными способностями, или же аномальными отличиями от человеческой анатомии. Так же существует и другое, научное название вида – крипто сапиенс. <br>Каждый странный обладает уникальной способностью, проявляющейся в свое время. Человек может с пеленок обладать тем, что не могут объяснить взрослые, а может всю жизнь провести как обычный хомо сапиенс, не подозревая о своем внутреннем даре. Странность передается по наследству, но при этом (из-за многовекового смешения крови) у странных родителей может появиться простой человек, а у обычных – странный, если в роду хотя-бы у одного из родителей был синдригаст.</div><div class="xxx">✕✕<h>✕</h>✕✕</div> <div class="cat"><i><b>О</b>рганизация странных людей</i></div> <div class="info1"><br>Спасаясь от жестокости и непонимания простых людей, синдригасты создали по всему миру петли времени, в которых смогли спрятаться. В петле раз за разом происходит один и тот же день, что позволяет странным без опасений за собственные жизни спокойно сосуществовать рядом с людьми. На людей петля времени не действует, они так же не могут и попасть в нее. <br>Временную петлю может создать только имбрина – странная женщина, способная превращаться в птицу. Именно на ее плечи ложится забота и защита странных детей. Для обычных людей имбрины представляются директрисами приютов и частных школ, дабы объяснить любопытным, почему в их доме полно детей. <br>У синдригастов так же есть совет – своего рода правительство странных людей, который, ради безопасности, находится в петле. В обязанности совета входит хранить историю странных, обучать молодых имбрин и поддерживать порядок в странном мире. В каждой стране совет странных расположен в столице, куда раз в год имбрины, проживающие на территории данной страны, должны являться для отчета о прошедшем годе. </div><div class="xxx">✕✕<h>✕</h>✕✕</div></center> </div> </div> <div class="tan"> <input type="radio" id="tan-2" name="tan-group-1"> <label for="tan-2">Охотники на пустот</label> <div class="thcontent"> <center><br> <img src="http://funkyimg.com/i/2dUAV.gif"><img src="http://funkyimg.com/i/2dUAW.gif"> <div class="xxx">✕✕<h>✕</h>✕✕</div> <div class="info1"> После провального эксперимента в Сибири и появлении на свет пустот, многие странные решили не пытаться прятаться от угрозы, а наоборот, дать отпор. Именно с этой целью, 40 лет назад и был создан орден охотников на пустых. В данный орден допускаются странные, достигшие совершеннолетия, идеально владеющие собственной способностью и имеющие отличную физ. подготовку. <br>Охотники делятся на группы по 6 человек так, чтобы в каждой группе были локаторы (синдригасты, способные определять пустот), бойцы и медики. Охотиться на пустоту в одиночку – запрещено, хотя бы потому, что это сравни суициду. <br>В связи с тем, что после определенного времени покидать петлю времени становится невозможным, орден охотников всегда находится в настоящем времени, живя как обычные люди. <br>Средняя продолжительность обучения: 2-3 года, за это время странные учатся работать в команде и пользоваться оружием. На более долгий срок обучения попросту нет времени. <br>Отряды охотников – не элита странных людей, они постоянно ходят за руку со смертью и каждый день может оказаться последним. Большинство синдригастов считает их суицидниками и не поощряет сделанный ими выбор. Однако, им всегда рады в любой петле. <br>Орден спонсирует совет имбрин, пусть и не высказывает восторг от того, чем занимаются охотники. Однако, благодаря их деятельности, мир странных стал чуточку безопаснее. </div><div class="xxx">✕✕<h>✕</h>✕✕</div></center></div> </div> <div class="tan"> <input type="radio" id="tan-3" name="tan-group-1"> <label for="tan-3">Пустоты и твари</label> <div class="thcontent"> <center><br> <img src="http://funkyimg.com/i/2dUAX.gif"><img src="http://funkyimg.com/i/2dUd4.gif"> <div class="xxx">✕✕<h>✕</h>✕✕</div> <div class="info1"> Пустоты – невидимые (можно обнаружить лишь в тени) человекоподобные существа, имеющие во рту до 8 щупалец с острыми зубами и испытывающие постоянный голод, утоляемый только плотью странных. Не имеют разума, однако, могут жить вечно. Одна из слабостей – не могут проникнуть в петлю времени. <br>Твари – бывшие пустоты, полностью сожравшие странного человека и сумевшие обрести разум. Их отличительная особенность – белоснежная радужка с сероватой каймой и отсутствие зрачков. Так же могут жить вечно, но, в отличии от пустот, могут проникать в петли. Способностей не имеют. <br>Изначально в мире не существовало ни пустот, ни тем более тварей. В далеком 1908 году группа странных вознамерилась с помощью петель времени стать бессмертными и управлять обычными людьми. Эксперимент проводился в Сибири и был строжайше засекречен. Что-то пошло не так и, как итог, петля, в которой проходило сие действо, взорвалась. Взрыв был огромной мощности и вошел в историю как падение тунгусского метеорита. Все участники, как считалось в начале, погибли в петле. На деле же их откинуло в то прошлое, когда даже души еще не существовали, а мир покрывала лишь одна тьма. <br>Через 20 лет после этих событий, пустотам, в которых превратились участники эксперимента, удалось вырваться в настоящее (1928 год). Ведомые одним лишь голодом, они стали охотиться на странных людей. Сожрав достаточно странных, они становились тварями, и могли управлять своими не обратившимися собратьями. <br>Цель пустот и тварей – хаос во всем мире. Они могут убивать как странных, для того, чтобы утолить голод, так и простых людей, чисто ради забавы. </div><div class="xxx">✕✕<h>✕</h>✕✕</div></center> </div> </div> </div> </div></center>