верх

Код:
<div style="position: absolute;
top: 430px;
left: 207px;
width: 570px;">
<style>
.container1 {width: 570px; margin: 0 auto; padding: 0;}
ul.tabs {
    margin: 0;
    padding: 0;
    float: right;
    list-style: none;
    height: 40px;
    width: 467px;
    width: 100%;
}
ul.tabs li {
    float: right;
   text-align: center;
    margin: 0px;
    padding: 0px;
    height: 24px;
    width: 135px;
    line-height: 24px;
    border: 0px;
    margin-bottom: -2px;
    background: url();
    overflow: hidden;
    position: relative;
}

ul.tabs li a {
    text-decoration: none;
    color: transparent;
    display: block;
    padding: 0 5px;
    background: url(http://savepic.su/7103960.png);
    outline: none;
}

ul.tabs li a:hover {
       background: url(http://savepic.su/7078340.png);

}    

html ul.tabs li.active  {
    background: url(http://savepic.su/7103960.png);     
}  

html ul.tabs li.active a:hover  {
        background: url(http://savepic.su/7078340.png);
    border-bottom: 0px solid #160f0a;
}

.tab_container1 {
    clear: both;
    float: center; 
    width: 570px;
    height: 190px;
    background-image : url();   
background-color: #transparent;  
}

.tab_content {
    padding: 5px;
}

.tab_content h2 {
    font-weight: normal;
    padding-bottom: 2px;
    border-bottom: 0px dashed #000000;
}
</style>

<div class="container">
    <div class="html-box">

<ul class="tabs">

    <li class="active"><a href="#tab1">ГЛАВНОЕ</a></li>
    <li><a href="#tab2">НОВОСТИ</a></li>
    <li><a href="#tab3">ЛУЧШИЕ</a></li>

</ul>

      <div class="tab_container1">

<div style="display: block;" id="tab1" class="tab_content">
<center>
<font color="b0dbfe"><font face="Trebuchet Ms">Мы приветствуем вас на нашем форуме <b>"MASS EFFECT: ANDROMEDA "</b>, который создан по мотивам ожидаемой игры с одноименным названием. <br>Мы  уже готовы отправиться вместе сквозь пространство и время навстречу новым приключениям! А вы?
<br>
жанр: космическая фантастика | рейтинг: NC-17 (18+) | система игры: эпизодическая </font></font><br><br>
<font color="b0dbfe"><font face="Trebuchet Ms"><b><u>АДМИНИСТРАЦИЯ:</u></b> </font></font><br><br>
<div  class=ImgWrap>
<a href="http://masseda.rusff.me/profile.php?id=3">
<img class="image UP" src="http://savepic.su/7105868.png"/>
<img class="image Down" src="http://savepic.su/7103820.gif"/>
</a> 
</div>
<div  class=ImgWrap>
<a href="http://masseda.rusff.me/profile.php?id=4">
<img class="image UP" src="http://savepic.su/7123278.png"/>
<img class="image Down" src="http://savepic.su/7139649.gif"/>
</a> 
</div>
<div  class=ImgWrap>
<a href="http://masseda.rusff.me/profile.php?id=7">
<img class="image UP" src="http://savepic.su/7130440.png"/>
<img class="image Down" src="http://savepic.su/7133512.gif"/>
</a> 
</div>


</td></tr></center>
</div>

<div style="display: none;" id="tab2" class="tab_content">
<center>
<div style="overflow: auto; height: 190px" ><font color="e5f0fb"><font face="Trebuchet Ms">блаблабалаблбла новости?</font></font></div>
</center>
</div>

<div style="display: block;" id="tab3" class="tab_content">
<center>
<font color="b0dbfe"><font face="Trebuchet Ms">Давайте поприветствуем тех, кто без устали пишет, вдохновляет и восхищает! </font></font></center>

<table layout=fixed width=100%><tr><td>
<center>
<font color="b0dbfe"><font face="Trebuchet Ms">ПАРА:</font></font><br><br>
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/7000130m.gif" title="Пара" /></a> 
<br><br>
<font color="e5f0fb"><font face="Trebuchet Ms">ИГРОКИ:</font></font><br><br>
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/6955075m.gif" title="Игрок 1" /></a> 
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/6955075m.gif" title="Игрок 2" /></a> 
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/6955075m.gif" title="Игрок 3" /></a>
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/6955075m.gif" title="Игрок 4" /></a>
<br><br>
</center>
</td>

<td>
<center>
<font color="b0dbfe"><font face="Trebuchet Ms">ФАНДОМЩИК:</font></font><br><br>
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/7000130m.gif" title="Фандомщик" /></a> 
<br><br>
<font color="e5f0fb"><font face="Trebuchet Ms">АКТИВИСТЫ:</font></font><br><br>
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/6955075m.gif" title="Активист 1" /></a> 
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/6955075m.gif" title="Активист 2" /></a> 
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/6955075m.gif" title="Активист 3" /></a>
<a href="http://testcross.rusff.me/"><img src="http://savepic.su/6955075m.gif" title="Активист 4" /></a> 
<br><br>
</center>
</td></tr></table>
</center>
</div>

      </div>
    </div>
</div>


</div>




















<div style="position: absolute;
top: 465px;
left: 20px;
width: 180px;">
<div class="expand">
<a href="http://masseda.rusff.me/viewtopic.php?id=3#p3">Гостевая </a>
<a href="http://masseda.rusff.me/viewtopic.php?id=2#p2"> Правила </a>
<a href="http://masseda.rusff.me/viewtopic.php?id=31#p32"> Сюжет </a>
<a href="http://masseda.rusff.me/viewtopic.php?id=5#p5"> F.A.Q </a>
<a href="http://masseda.rusff.me/viewtopic.php?id=4#p4">Список персонажей </a>
<a href="http://masseda.rusff.me/viewforum.php?id=4"> Акции </a>
<a href="http://masseda.rusff.me/viewtopic.php?id=9#p9">Шаблоны анкет </a>
<a href="http://masseda.rusff.me/viewforum.php?id=2"> Кодекс </a>
</div>
</div>








<div style="position: absolute;
top: 45px;
left: 710px;
width: 228px;">
<img src="http://savepic.su/7063524m.gif">
</div>

<div style="position: absolute;
top: 68px;
left: 316px;
width: 330px;">
<img src="http://savepic.su/7054308.gif">
</div>




<style type="text/css">

/*1. Настройка общего вида линков */
#pun-navlinks a {
display: inline-block;
margin-left: 10px;

}

/*2. Настройка изображений */
#navindex a {
  background: url("http://savepic.su/7013348.png") no-repeat top center; 
  display: inline-block; 
  position: absolute; 
  z-index: 1000; 
height: 23px;
width: 311px;
top: -405px; 
left: -67px;
}
#navuserlist a {
  background: url("http://savepic.su/7044090.png") no-repeat top center; 
  display: inline-block; 
  position: absolute; 
  z-index: 1000; 
height: 23px;
width: 311px;
top: -380px; 
left: -67px;
}
#navsearch a {
  background: url("http://savepic.su/7034874.png") no-repeat top center; 
  display: inline-block; 
  position: absolute; 
  z-index: 1000; 
height: 23px;
width: 311px;
top: -355px; 
left: -67px;
}
#navprofile a {
  background: url("http://savepic.su/7073789.png") no-repeat top center; 
  display: inline-block; 
  position: absolute; 
  z-index: 1000; 
height: 23px;
width: 311px;
top: -330px; 
left: -67px;
}
#navpm a {
  background: url("http://savepic.su/7060477.png") no-repeat top center; 
  display: inline-block; 
  position: absolute; 
  z-index: 1000;
height: 23px;
width: 311px;
top: -305px; 
left: -67px;
}
#navadmin  a {
  background: url("http://savepic.su/7057404.png") no-repeat top center; 
  display: inline-block; 
  position: absolute; 
  z-index: 1000; 
height: 23px;
width: 207px;
top: -257px; 
left: 23px;
}
#navlogout   a {
  background: url("http://savepic.su/7035901.png") no-repeat top center; 
  display: inline-block; 
  position: absolute; 
  z-index: 1000; 
height: 23px;
width: 311px;
top: -280px; 
left: -67px;
}
#navlogin  a {
  background: url("http://savepic.su/7023612.png") no-repeat top center; 
  display: inline-block; 
  position: absolute; 
  z-index: 1000; 
height: 23px;
width: 311px;
top: -330px; 
left: -67px;
}
#navregister a {
  background: url("http://savepic.su/7031804.png") no-repeat top center; 
  display: inline-block; 
  position: absolute; 
  z-index: 1000; 
height: 23px;
width: 311px;
top: -305px; 
left: -67px;
}


/*3. Настройка изображений при ховере (наведении) */
#navindex a:hover {background: url(http://savepic.su/7014372.png) no-repeat top center;}
#navuserlist a:hover {background: url(http://savepic.su/7069690.png) no-repeat top center;}
#navsearch a:hover {background: url(http://savepic.su/7025658.png) no-repeat top center;}
#navprofile a:hover {background: url(http://savepic.su/7070717.png) no-repeat top center;}
#navpm a:hover {background: url(http://savepic.su/7051261.png) no-repeat top center;}
#navadmin a:hover {background: url(http://savepic.su/7058428.png) no-repeat top center;}
#navlogout a:hover {background: url(http://savepic.su/7033853.png) no-repeat top center;}
#navlogin a:hover {background: url(http://savepic.su/7034876.png) no-repeat top center;}
#navregister a:hover {background: url(http://savepic.su/7030780.png) no-repeat top center;}
/* Скрываем текстовые надписи */
#pun-navlinks a span {display: none;}
</style>





<link href='https://fonts.googleapis.com/css?family=Jura:400,600&subset=latin,cyrillic' rel='stylesheet' type='text/css'>





<!-- Скрывает "Награды" из меню-навигации -->
<style>
#pun-navlinks #navawards {
   display: none;
   }
</style>


<!-- Убирает "Отредактировано" -->
<style>
.lastedit {display: none;}
</style>



<!-- Убирает надпись "Объявление" -->
<style type="text/css">
#pun-announcement h2 {display: none;}
#pun-announcement .container {padding-top: 1em;}
</style>



<!--Ставим рамки для Аватара --> 
<style type="text/css">
li.pa-avatar .Wrp-ava img[alt]{
  display:block;
  padding:0;
  border-width:0;
  margin:0px; /*Отступ рамки*/
}
</style>
<script>
  $(document).ready(function(){
    var imgWrp = "http://savepic.su/7123265.png"; // Ccылка на картинку;
    imgWrp = '<img src="'+imgWrp+'" width=100% height=100% style="position:absolute;z-index:100;"/>'
    $("div.post-author ul li.pa-avatar img[alt]").each(function () {
    $(this).wrap('<div class="Wrp-ava" style="display:inline-block;text-align:left;position:relative;"></div>');
    $(this).parent().prepend(imgWrp)
});});
</script><!--Конец//Рамки для Аватара-->



<!-- HTML верх -Cпойлер cкрытия Инфы под N-кнопок в Профиле Топика  -->
<style>
img.post-img-Sp {margin: 0px 3px;}
div.tipsy.tipsy-s.Sp-imgSp-img .tipsy-inner {font-size: 14px; letter-spacing: 1px;}
</style>
<script type="text/javascript" src="https://forumstatic.ru/files/0010/b4/f8/57844.js"></script>






<!-- Cтрелочки -Вверх вниз страницы -->
<div style="position:fixed;z-index:1003; right :0.5%; bottom: 50%;">
<a href="#top" onclick="scrollTo(0,0); return false;" title="Вверх страницы">
<img src="http://savepic.su/7067638m.png" alt="Вверх страницы"/>
</a>
<br/>
<br/>
<a href="#top" onclick="scrollTo(0, document.body.scrollHeight); return false;" title="Вниз страницы">
<img src="http://savepic.su/7054326m.png" alt="Вниз страницы"/>
</a>
</div><!--Конец Cтрелочки -->

<style>
#pun-main #profile1[action$="id=--"]{
display:none;
}
</style>





<!-- черный title -->
<script src="http://hostjs-mybb2011.narod.ru/js/transform_code_boxr.js"></script>
<script type="text/javascript" src="http://your.roll.tv/16311.js"></script>


















<style type="text/css">
.punbb .expand{
 display:inline-block;
 width:180px;
}
.punbb .expand a {
display:block;
color: #b0dbfe !important;
font-family: "Jura" !important;
font-size: 13px !important;
font-variant: small-caps !important;
text-shadow: #000000 0px 0px !important;
background: url("http://savepic.su/7129488.png") no-repeat transparent;
height: 22px;
line-height: 24px;
margin: 2px;
position: relative;
text-align: center;
}
.expand a:hover, .expand a:focus, .expand a:active { 
background: url("http://savepic.su/7118224.png") no-repeat transparent;
background-position: 0px 0px !important;
color: #efac63 !important;
}
</style>














<style>
.image.UP,
.image.Down {
   border:2px solid transparent;
   margin:0;
   padding:0;
}
.image.UP{
opacity:1.0;
   display:block;
   position:absolute;z-index:100;
   transition-duration: 0.96s;
  -webkit-transition-duration: 0.96s;
  -moz-transition-duration: 0.96s;
  -o-transition-duration: 0.96s;
  -ms-transition-duration: 0.96s; /* IE9+ */
}
.image.UP:hover {
   opacity:0.00;
}
 
div.ImgWrap{
display:inline-block;
padding:0;margin:0;
background-position:center center;
background-repeat:no-repeat;
}
</style>