<!--HTML--> 
<link href='http://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'>

<style>
.pon {width: 570px; height: auto; padding: 5px; background: url("http://zagruzitfoto.com/images/2016/04/16/p0n2.png") no-repeat center top, url("http://i.imgur.com/0i8QhTv.png") no-repeat center bottom, url("http://i.imgur.com/Ln7yhHb.png") repeat-y center;}

.the-image {width: 150px; height: 203px;}
.the-image .the-hover {margin: auto 20px auto 20px; padding: 10px; opacity: 0; width: 190px; height: 260px; transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -webkit-transition: all 0.6s ease-in-out; -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; position: relative; top: 20px;}
.the-image:hover .the-hover {opacity: 1.0;}
.the-writing {margin-top: -32px; margin-left: -94px; text-align: justify; overflow: auto; height: 265px; padding-right: 5px; line-height: 90%;}
.the-writing b {color: #FB5472;}
</style>

<div class="pon">
<div style="padding-top: 120px; line-height: 100%;overflow: auto;">
<div style="font-family: 'lobster', serif; font-size: 30px;font-weight: bold;letter-spacing: -1px;text-shadow: 1px 1px 0px #cd9234;
text-transform: lowercase; text-align: center;color: #ffffff;">12 причин нас любить</div>
<center>
<div style="width: 400px; padding: 10px; background-color: #f3f8dd; border-radius: 5px; text-align: justify;font-size: 10px;letter-spacing: 1px;"><center>Хей, даже не думай, что у нас завышенная самооценка, и что мы расписываем себя тут такими супер-пупер крутыми, но мы предлагаем тебе прочитать 12 причин почему ты можешь выбрать нас и не пожалеть о собственном решении!</center></div>
<div style="margin-left: 310px; width: 15px; height: 15px; font-size: 20px; color: #f8dde6; text-shadow: none;">▼</div>
</center>
<div style="margin-top: -10px; margin-left: 30px; text-align: justify; width: 520px; height: auto; line-height: 140%;">
<br>
<table><tr>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29Kw8.png);"></div> 
</td>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29Kw7.png);"></div> 
</td>
</tr>

<tr>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29Kw6.png);"></div> 
</td>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29Kw5.png);"></div> 
</td>
</tr>


<tr>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29Kw4.png);"></div> 
</td>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29Kw3.png);"></div> 
</td>
</tr>


<tr>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29Kw2.png);"></div> 
</td>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29KvZ.png);"></div> 
</td>
</tr>


<tr>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29KvY.png);"></div> 
</td>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29Kwi.png);"></div> 
</td>
</tr>


<tr>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29KvX.png);"></div> 
</td>
<td width="220px;"><div style="margin-left: 0px; width: 240px; height: 149px; background-image: url(http://funkyimg.com/i/29Kwh.png);"></div> 
</td>
</tr>
</table>
<br>
<br>
<br>
<br>
<br></div>
</div>
</div>
</center>