<!-- активисты начало -->
<!-- 1 -->
<div style="position: absolute; margin-top: 295px; margin-left: 609px; "><a hred="ссылка на персонажа"><img src="http://placehold.it/80x50" title="активист" class="Hoverbuttons"></a></div>
<!-- 2 -->
<div style="position: absolute; margin-top: 295px; margin-left: 694px; "><a href="ссылка на персонажа"><img src="http://placehold.it/80x50" title="активист" class="Hoverbuttons"></a></div>
<!-- 3 -->
<div style="position: absolute; margin-top: 295px; margin-left: 779px; "><a hred="ссылка на персонажа"><img src="http://placehold.it/80x50" title="активист" class="Hoverbuttons"></a></div>
<!-- 4 -->
<div style="position: absolute; margin-top: 295px; margin-left: 865px; "><a hred="ссылка на персонажа"><img src="http://placehold.it/80x50" title="активист" class="Hoverbuttons"></a></div>

<!-- активисты конец -->

<!-- эпизод-->

<div style="position: absolute; margin-top: 355px; margin-left: 611px; "><a hred="ссылка "><img src="http://placehold.it/160x60" title="название" class="Hoverbuttons"></a></div>
<!-- эпизод конец -->

<!-- пара -->
<div style="position: absolute; margin-top: 355px; margin-left: 781px; "><img src="http://placehold.it/160x60" title="имена" class="Hoverbuttons"></div>
<!-- пара конец -->

<!-- пост-->

<div style="position: absolute; margin-top: 358px; margin-left: 40px; "><a hred="ссылка "><img src="http://placehold.it/160x60" title="имя" class="Hoverbuttons"></a></div>
<!-- пост -->

<!--------------- объявления в таблице------------------->
<div style="position: absolute; margin-top: 295px; margin-left: 270px; ">
<div style="width: 320px; height: 20px; color: #e7e7e7;  text-align: center; text-transform: lowercase; font-family: 'arial'; font-size: 11px; line-height: 90%; letter-spacing: 1px;  text-shadow: 1px 0px 0px #"> текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст</div>
<br>
</div>
<!--------------- конец ------------------->

<!--------------- объявления в шапке ------------------->
<div style="position: absolute; margin-top: 155px; margin-left: 25px; ">
<center><div style="width: 350px; height: 20px; color: #3e4a5a;  text-align: center; text-transform: lowercase; font-family: 'arial'; font-size: 11px; line-height: 90%; letter-spacing: 1px;  text-shadow: 1px 0px 0px #f7f7f7"> текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст</div></center>
<br>
</div>
<!--------------- конец ------------------->

<!--------------- группы ------------------->
<style type="text/css">
.uninvited { width: 100px;
height: 50px;
background: #cecdcd;
padding: 5px;
color: #D3CD9D;
opacity: 0;
transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
margin-top: -60px; } .uninvited:hover { opacity: 0.9;
}
@font-face {font-family:'Soopafresh'; src:url('http://static.tumblr.com/9wzbixa/PQlm26p56/soopafre.ttf');}
</style>

<!--------------- НАЗВАНИЕ ПЕРВОЙ ГРУППЫ------------------->
<div style="position: absolute; margin-top: 293px; margin-left: 10px; ">
<img src="http://placehold.it/110x60/ffffff/555555"><div class="uninvited">
<div style="line-height: 60%; text-align:center; text-shadow: 2px 0px #000, 3px 0px #cecdcd; font-family: Soopafresh; color: #3b4757; text-transform: lowercase; font-size: 40px; letter-spacing: 0px; margin-top: 10px;">

666 </div>
<div style="font-family: calibri; font-size: 8px; text-transform: uppercase; text-align:center; line-height: 100%; letter-spacing: 1px; background: #3b4757; color: #cecdcd; margin-top:2px; margin-bottom: 2px; padding: 3px; width: 95px;">название группы</div>
</div></div>
<!--------------- конец первой------------------->

<!--------------- НАЗВАНИЕ ВТОРОЙ ГРУППЫ------------------->
<div style="position: absolute; margin-top: 293px; margin-left: 135px; ">
<img src="http://placehold.it/110x60/ffffff/555555"><div class="uninvited">
<div style="line-height: 60%; text-align:center; text-shadow: 2px 0px #000, 3px 0px #cecdcd; font-family: Soopafresh; color: #3b4757; text-transform: lowercase; font-size: 40px; letter-spacing: 0px; margin-top: 10px;">

666 </div>
<div style="font-family: calibri; font-size: 8px; text-transform: uppercase; text-align:center; line-height: 100%; letter-spacing: 1px; background: #3b4757; color: #cecdcd; margin-top:2px; margin-bottom: 2px; padding: 3px; width: 95px;">название группы</div>
</div>

<!--------------- конец второй------------------->

<!--------------- навигация------------------->
<div style="position: absolute; margin-top: -250px; margin-left: 745px; font-family: vardana; font-size: 13px; color: #311d55; line-height: 90%;">
<div class="links"><a href="ccылка">название</a></div></div>

<div style="position: absolute; margin-top: -230px; margin-left: 745px; font-family: vardana; font-size: 13px; color: #311d55; line-height: 90%;">
<div class="links"><a href="ccылка">название</a></div></div>

<div style="position: absolute; margin-top: -210px; margin-left: 745px; font-family: vardana; font-size: 13px; color: #311d55; line-height: 90%;">
<div class="links"><a href="ccылка">название</a></div></div>

<div style="position: absolute; margin-top: -189px; margin-left: 745px; font-family: vardana; font-size: 13px; color: #311d55; line-height: 90%;">
<div class="links"><a href="ccылка">название</a></div></div>

<div style="position: absolute; margin-top: -168px; margin-left: 745px; font-family: vardana; font-size: 13px; color: #311d55; line-height: 90%;">
<div class="links"><a href="ccылка">название</a></div></div>