Код:
<link href='http://fonts.googleapis.com/css?family=Playfair+Display:400,900italic|Economica' rel='stylesheet' type='text/css'>
<style type="text/css">
.asf-bajancanadian {
width:400px;
height:400px;
padding:25px;
background-image:url(http://savepic.net/6051631.jpg);
background-position: center bottom;
}
.asf-jerome {
width: 350px;
padding:25px;
background-color:#888461;
margin-top:-50px;
z-index:1;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
}
.asf-noochm {
font-size:30px;
font-style:italic;
font-weight:bold;
font-family:playfair display;
color:#110813;
line-height:100%;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
}
.asf-mitch {
width:350px;
padding:25px;
overflow:auto;
font-family:calibri;
font-size:11px;
line-height:99%;
background-color:rgba(255, 255, 255, 0.8);
background-color:rgb(255, 255, 255, 0.8);
text-align:justify;
height:0px;
color:191919;
opacity:0;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
}
.asf-bajancanadian:hover .asf-jerome {
margin-top:0px;
}
.asf-bajancanadian:hover .asf-mitch {
opacity:1;
height:250px;
}
.mrc {
font-family:calibri;
font-size:35px;
text-transform:uppercase;
text-decoration:none;
}
.mrc a {
text-decoration:none;
color:#A23838;
}
</style>
<center>
<div class="asf-bajancanadian">
<div class="asf-mitch"><center>
Они смотрят на мир чужими глазами, но не стоит предлагать им попробовать встать на твое место, Мерцающие ведь могут и согласиться, и где тогда окажешься ты, еще не известно. Ведь порой копия куда правильнее и лучше оригинала. Они позабыли собственное лицо за множеством масок и образов. Но в каждой маске метаморфа есть душа, за каждым образом он сам. Это не костюмы в гардеробе, а новые личности.<br>
Хочешь прожить сразу несколько жизней в одной? Присмотрись к ним.<br>
- Внешность/имена и фамилии можно менять отписавшись в Беседке<br>
- Любовь администрации<br>
- Графический подарок<br>
- Интересная идея для колоритного персонажа.
</center></div>
<div class="asf-jerome">
<div class="asf-noochm">Когда маска становится лицом</div>
</div>
</div>
</center>
