Код:

[c*ode]<!--HT*ML--><link href="http://fonts.googleapis.com/css?family=Oswald" rel="stylesheet" type="text/css">
<style>
.mbm-text::-webkit-scrollbar-thumb {background: -webkit-linear-gradient(#574951, #B3ACB0); height: auto; 
border: 1px solid #bbb }
.mbm-text::-webkit-scrollbar-track { background-color: #ccc; height:10px; width:1px; border: 2px solid #fff;}
.mbm-text::-webkit-scrollbar { background-color: #ccc; height:10px; width:5px; border: 2px solid #fff;} hr { background-color: #ccc; height: 0.5px; border: 0; } .miricredit { width: 490px; text-align: right; font-family: calibri; font-size: 7px; text-transform:uppercase; letter-spacing:1px; color: #ccc; line-height: 15pt; } .miricredit a { color: #000 }

.mbm-gif { -webkit-transition:1s ease-in-out; -moz-transition:1s ease-in-out;
-o-transition:1s ease-in-out; transition:1s ease-in-out;  }
.mbm-base .mbm-base-hover { background-color: rgba(87, 73, 81, 0.5); padding: 0px; width: 500px; height: 500px; margin-top: -500px; -webkit-transition: all 1.5s ease-in-out; -moz-transition: all 1.5s ease-in-out;  -o-transition: all 1.5s ease-in-out;  transition: all 1.5s ease-in-out;  transition-delay: 0.6s;  }
.mbm-base:hover .mbm-base-hover { margin-top: 0px; -webkit-transition: all 1.4s ease-in-out;  -moz-transition: all 1.4s ease-in-out;  -o-transition: all 1.4s ease-in-out;  transition: all 1.4s ease-in-out;  transition-delay: .3s; }
.mbm-base .mbm-base-content { position: relative; top: -382px; left: 0px; width: 400px; height: 210px; 
background-color: #FDFDFD; padding: 25px; margin-top: -385px; color: #000; 
-webkit-transition: all .8s ease-in-out;  -moz-transition: all .8s ease-in-out;  
-o-transition: all .9s ease-in-out;  transition: all .9s ease-in-out;  transition-delay: .4s;  border: 1px solid #ddd; }
.mbm-base:hover .mbm-base-content { margin-top: -100px; -webkit-transition: all  1.1s ease-in-out;  -moz-transition: all  1.1s ease-in-out;  -o-transition: all  1.1s ease-in-out;  transition: all 1.1s ease-in-out;  transition-delay: 1.1s; }


.mbm-text {width: 400px; height: 184px; padding-right: 5px; margin-bottom: 5px; text-align: justify; font-family: calibri; font-size: 10px; overflow: auto; line-height: 140%;}
.letter1 { margin-top: 0px; float: left; font-family: times; text-transform: uppercase; font-size: 35px; color: #403f3f; padding: 10px; font-style: italic; }

.mbmstats { color: #fff; border: 1px solid #ccc; width: 400px; padding: 3px;
text-align: center; font-family: times; font-size: 11px; 
letter-spacing: 2px; line-height: 140%; font-style: italic; background: rgba(87, 73, 81, 1);
background: -moz-linear-gradient(45deg, rgba(87, 73, 81, 1) 0%, rgba(171,171,171,1) 100%);
background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(87, 73, 81, 1)), color-stop(100%, rgba(87, 73, 81, 1)));
background: -webkit-linear-gradient(45deg, rgba(87, 73, 81, 1) 0%, rgba(171,171,171,1) 100%);
background: -o-linear-gradient(45deg, rgba(87, 73, 81, 1) 0%, rgba(171,171,171,1) 100%);
background: -ms-linear-gradient(45deg, rgba(87, 73, 81, 1) 0%, rgba(171,171,171,1) 100%);
background: linear-gradient(45deg, rgba(87, 73, 81, 1) 0%, rgba(171,171,171,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#574951', endColorstr='#ababab', GradientType=1 );
border: 1px solid #bbb; width: 396px; padding: 3px; margin-top: 5px; text-align: center; font-family: times; font-size: 11px; letter-spacing: 2px; line-height: 140%; font-style: italic;}

.mbm-lyrics {width: 508px; font: 34px oswald; color: #333; text-align: right; text-transform: uppercase; line-height: 115%; letter-spacing: 2.5px; font-weight: bold; margin-bottom: 5px;}

.mbm-base { background-color: #fff; background-image:url(http://placehold.it/500x300);  width: 500px; height: 300px; overflow: hidden; border: 1px solid #ccc}
</style>

<center><div class="mbm-lyrics"> in silence we search</div>

<div class="mbm-base"><div class="mbm-base-hover"></div>
<div class="mbm-base-content"><div class="mbm-text">

<img src="http://placehold.it/140x140" width="140" height="140" align="left" style="padding: 0px 8px 1px 0px;" class="mbm-gif">

<div class="letter1">о</div>писание</div>

<div class="mbmstats">фамилия имя— возраст— род деятельности - ориентация</div></div></div></center>
[/c*ode]