.

Код:
<!--HTML--><link rel="stylesheet" type="text/css" href="http://forumfiles.ru/files/0017/aa/b3/16821.css" />

<style>


.sliderB {
        width: 700px;
        height: 466px;
        position: relative;
        overflow: hidden;
        margin-left: 50px;
        margin-top: -30px;
    }

    .sliderB > input {
        display: none;
    }

    .sliderB > label {
        display: none;
    }

    .sliderB > input:checked + div + label,
    .sliderB > input:checked + div + label + label {
        display: block;
        width: 80px;
        height: 80px;
        margin-top: 220px;
        border-radius: 40px;
        cursor: pointer;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 100;
    }

    .sliderB > input:checked + div + label:after,
    .sliderB > input:checked + div + label + label:after {
        font-size: 30px;
        color: #fff;
        display: block;
        position: absolute;
        top: 0px;
        bottom: 0px;
        line-height: 80px;
    }

    .sliderB > input:checked + div + label {
        left: -40px;
    }

    .sliderB > input:checked + div + label:after {
        content: '◀';
        left: 55%;
    }

    .sliderB > input:checked + div + label + label {
        right: -40px;
    }

    .sliderB > input:checked + div + label + label:after {
        content: '▶';
        right: 55%;
    }

    .sliderB > div {
        position: absolute;
        top: 0px;
        left: 0px;
        right: 0px;
        bottom: 0px;
        z-index: 0;
    }

    .sliderB > div {
        visibility: hidden;
        opacity: 0;
        transition: opacity 0.8s ease-out 0.1s, visibility 0.1s ease-out 0.9s;
    }

    .sliderB > input:checked + div {
        visibility: visible;
        opacity: 1;
        transition: opacity 0.8s ease-out 0.1s, visibility 0.1s ease-out 0s;
    }

    .sliderB > div > p {
        position: absolute;
        top: 0px;
        left: 0px;
        right: 0px;
        text-align: center;
        color: #fff;
        text-shadow: 1px 1px 2px #000;
    }









 </style> 

<center><div class="glav" position="absolute">
<div class="lichocnov">
<div class="notebook2">
    <input type="radio" name="notebook2a" id="notebook2a_1" checked="checked">
    <input type="radio" name="notebook2a" id="notebook2a_2">
    <input type="radio" name="notebook2a" id="notebook2a_3">
        <div>
        <label for="notebook2a_1"><img src="http://funkyimg.com/i/2dBRv.png"></label>
        <p>
          <div class="podl1">
           <!------ ИМЯ ------>
<div class="lichname">Fester J. Larson</div>
            <!------ ЛИЦО ------>
<img class="lichface " src="http://funkyimg.com/i/2eLeM.png">
            
       <div class="lich11"></div><div class="lich12"></div><div class="lich13"></div>
            
            
<div class="lich14">
<!------ ЗДЕСЬ КОМАНДА ------>
<img src="http://funkyimg.com/i/2e8Cn.png" title="Spirit">

</div>
   <div class="lich21">
<!------ ЗДЕСЬ ЗВЕЗДА ------>
<img src="http://funkyimg.com/i/2dC2E.png" title="успешно пройден курс">
</div>
            
       <div class="lich15">
<!------ ЗДЕСЬ ЦИТАТА ------>
Бывших психов, как и бывших наркоманов, не бывает! </div>     
            
            <div class="lich16">
<!------ ЗДЕСЬ ЦЕЛИ ------>
я добился многого, в совокупности 
<div class="lich17"><b>00</b></div> 
<br><br><br>
жизненных целей 
</div>          
                <div class="lich18">
<!------ ЗДЕСЬ СТРАНЫ ------>
я посетил 
<div class="lich19"><b>03</b></div> 
<br><br><br>
стран, и о каждой у меня осталось множество впечатлений, о которых я непременно расскажу
</div>   
           <!------ КОЛ-ВО ЗАКОНЧЕННЫХ ЭПИЗОДОВ------> 
  <div class="lich20">005</div>           
            
            
 <div class="lich23">
<!------ ОСОБЫЕ НАГРАДЫ ------>
   <img src="http://funkyimg.com/i/2dZ1L.png" title="пара недели 4.08 - 11.08.16"> 
<img src="http://funkyimg.com/i/2dZ1Z.png" title="постописец недели 4.08 - 11.08.16"> 
   <img src="http://funkyimg.com/i/2dZ1Z.png" title="постописец недели 11.08-18.08.16"> 
<img src="http://funkyimg.com/i/2dZ1Z.png" title="постописец недели 18.08-25.08.16"> 
<img src="http://funkyimg.com/i/2dZ1Z.png" title="постописец недели 25.08-1.09.16"> <img src="http://funkyimg.com/i/2dZ1Z.png" title="постописец недели 2.09-8.09.16"><img src="http://funkyimg.com/i/2dZ1X.png" title="флудер недели 08.09.-14.09.16"> <img src="http://funkyimg.com/i/2dZ1X.png" title="флудер недели 15.09.-21.09.16"> <img src="http://funkyimg.com/i/2dZ1X.png" title="флудер недели 22.09.-28.09.16"> <img src="http://funkyimg.com/i/2dZ1X.png" title="флудер недели 29.09.-05.10.16"> <img src="http://funkyimg.com/i/2dZ1Z.png" title="постописец недели 06.10.-12.10.16"> 
            
            </div>
             <div class="lich24"> 
            <!------ ПЛАШКИ ------>
            <img src="http://funkyimg.com/i/2eYny.png">
<img src="http://funkyimg.com/i/2fGxF.png">
   <img src="http://funkyimg.com/i/2fUqE.png">  
<img src="http://savepic.net/8504527.png">  
<img src="http://savepic.net/8506575.png">  
<img src="http://savepic.net/8516815.png">         
            
            
            
            
            
            </div>
</div>
      </p> 
    </div><div>
    
        <label for="notebook2a_2"><img src="http://funkyimg.com/i/2dBRu.png"></label>
            <p>
<!------ ВКЛАДКА 2 ПРОКАЧКА ПЕРСОНАЖА------>
 <div class="lich22"></div>
  <div style="width: 315px; height: 390px; margin-top: 30px; margin-left: 418px;  overflow: auto; z-index:9999; position:relative; text-align: left;  line-height: 20px;">
     <!------ ОБЫЧНЫЕ НАГРАДЫ ------>
<img src="http://funkyimg.com/i/2dZ1H.png"  title="добро пожаловать"> <img src="http://funkyimg.com/i/2dZ1K.png"  title="первый пост"> <img src="http://funkyimg.com/i/2dZ28.png"  title="100 сообщений"> <img src="http://funkyimg.com/i/2dZ2j.png"  title="регистрация соц.сети"> <img src="http://funkyimg.com/i/2dZ26.png" title="500 сообщений"> <img src="http://funkyimg.com/i/2dZ29.png" title="1000 сообщений"> <img src="http://funkyimg.com/i/2dZ2g.png" title="сутки на форуме"> <img src="http://funkyimg.com/i/2dZ3L.png" title="неделя на форуме"> <img src="http://funkyimg.com/i/2dZ43.png" title="10 игровых постов"> <img src="http://funkyimg.com/i/2dZ49.png" title="заполнены отношения и хронология"> <img src="http://funkyimg.com/i/2dZ4n.png" title="день рождения"> <img src="http://funkyimg.com/i/2dZ44.png" title="закрыт эпизод">  <img src="http://funkyimg.com/i/2dZ2h.png" title="25 постов в соц.сети"> <img src="http://funkyimg.com/i/2dZ3J.png" title="отзыв на RPG топе"> <img src="http://funkyimg.com/i/2dZ3K.png" title="месяц на форуме"> <img src="http://funkyimg.com/i/2gqC6.png" title="больше 100 мыслей"> <img src="http://funkyimg.com/i/2gqCn.png" title="завсегдатай флуда"> <img src="http://funkyimg.com/i/2dZ3Z.png" title="50 игровых постов"> <img src="http://funkyimg.com/i/2gqC9.png" title="чаще на форуме утром"> <img src="http://funkyimg.com/i/2dZ4k.png" title="посетил 1 страну"> <img src="http://funkyimg.com/i/2dZ3Y.png" title="победа команды"> <img src="http://funkyimg.com/i/2gqAU.png" title="закрыто 5 эпизодов"> <img src="http://funkyimg.com/i/2dZ4g.png" title="попал в таблицу 10 раз"> <img src="http://funkyimg.com/i/2dZ3M.png" title="попал в сплетни">
   
</div>
  
  <div style="margin-top: -437px; margin-left: 109px;"><img src="http://funkyimg.com/i/2e1sW.png"></div>
      
      <div style="margin-top: 60px; margin-left: 69px;"><img src="http://funkyimg.com/i/2e1sX.png"></div>
        <div style="margin-top: 100px; margin-left: 59px;"><img src="http://funkyimg.com/i/2e1sV.png"></div>
  
  <div style="margin-top: -135px; margin-left: 76px; width: 309px; height: 95px; overflow: auto; text-align: center; padding: 20px 6px 3px px;"> 
       <!------ ВЫПОЛНЕННЫЕ НАВЫКИ ------>
<table>  <tr><td>  
   <img src="http://funkyimg.com/i/2dUbS.png">
   <img src="http://funkyimg.com/i/2dTVi.png">
</td><td>  
    <img src="http://funkyimg.com/i/2dUJS.png">
</td></tr>
    
   
    
    
    </table>   </div>
  
  
    <div style="margin-top: 50px; margin-left: 69px;width: 317px; height: 130px; overflow: auto; z-index:9999; position:relative;"> 
   <!------ НАВЫКИ В ПРОЦЕССЕ ------>
      <table>  <tr>
  
  <td>  
<div style="background: url(http://funkyimg.com/i/2dUiC.png) no-repeat;  width: 137px; height: 125px; text-align: left; padding: 0px 6px 3px 9px;"><br><br><br>

<img src="http://funkyimg.com/i/2dUiy.png" title="выложить пошлую картинку/гифку*"><img src="http://funkyimg.com/i/2dUiu.png" title="заняться сексом">

</div>
 </td>
  <td>  
<div style="background: url(http://funkyimg.com/i/2dU4V.png) no-repeat;  width: 137px; height: 125px; text-align: left; padding: 0px 6px 3px 9px;"><br><br><br>

<img src="http://funkyimg.com/i/2dU4U.png" title="терпеть боль"><img src="http://funkyimg.com/i/2dU4T.png" title="иметь не менее 1500 сообщений*">

</div>
</td>
  </tr></table></div>
    <div style="margin-top: -375px; margin-left: 102px; width: 282px; height: 55px; overflow: auto; text-align: center; padding: 20px 6px 3px px;"> 
   <!------ ВЫПОЛНЕННЫЕ ЖИЗНЕННЫЕ ЦЕЛИ ------>
    
    
    
 </div>
  
  </p>
    </div>
    <div>
        <label for="notebook2a_3"><img src="http://funkyimg.com/i/2dBRt.png"></label>
        <p>  
<!------ ПУТЕШЕСТВИЯЕ ВКЛАДКА 3------>
          
           <div class='sliderB'>
  
    <input type="radio" name="slider1" id="slider1_1" checked="checked">
    <div>
   <!------ ФОТОАЛЬБОМ СО СТРАНАМИ ------>
  
 <!------ СТРАНА ------>
<div style="margin-top: 25px; margin-left: -253px;"><img src="http://funkyimg.com/i/2hxXT.png"></div>
    <!------ ЛИЦО ------>
<div style="margin-top: 147px; margin-left: -275px;"><img src="http://funkyimg.com/i/2iaQH.png"></div>
           <!------ ПЕЧАТЬ ------>
<div style="margin-top: -400px; margin-left: -480px;"><img src="http://funkyimg.com/i/2hxY8.png"></div>  
       <!------ украшение ------>
<div style="margin-top: -90px; margin-left: -310px;"><img src="http://funkyimg.com/i/2hxY1.png"></div>
      <!------ украшение ------>
<div style="margin-top: 0px; margin-left: -570px;"><img src="http://funkyimg.com/i/2hxY2.png"></div>
      <!------ ПОТТЕР ------>
<div style="margin-top: -95px; margin-left: -129px;"><img src="http://funkyimg.com/i/2hxY4.png"></div>
       <!------ БУДКА ------>
<div style="margin-top: -45px; margin-left: -632px;"><img src="http://funkyimg.com/i/2hxY3.png"></div>
       <!------ КОРОНА ------>
<div style="margin-top: -180px; margin-left: -350px;"><img src="http://funkyimg.com/i/2hxXZ.png"></div>
        <!------ РОЗА ------>
<div style="margin-top: -60px; margin-left: -520px;"><img src="http://funkyimg.com/i/2hxXU.png"></div>
   <!------ ЧАЙНИК ------>
<div style="margin-top: 65px; margin-left: -522px;"><img src="http://funkyimg.com/i/2hxXX.png"></div>
       <!------ ЧАШКИ ------>
<div style="margin-top: -70px; margin-left: -650px;"><img src="http://funkyimg.com/i/2hxXW.png"></div>
        <!------ АВТОБУС ------>
<div style="margin-top: -5px; margin-left: -570px;"><img src="http://funkyimg.com/i/2hxXY.png"></div>
       <!------ ЗВЕЗДОЧКА ------>
<div style="margin-top: -269px; margin-left: -180px;"><img src="http://funkyimg.com/i/2dFWb.png"></div>



  <!------ СТРАНА ------>
<div style="margin-top: -215px; margin-left: 203px;"><img src="http://funkyimg.com/i/2gCgf.png"></div>
    <!------ ЛИЦО ------>
<div style="margin-top: -40px; margin-left: 470px;"><img src="http://funkyimg.com/i/2gCv8.png"></div>
             <!------ ПЕЧАТЬ ------>
<div style="margin-top: -100px; margin-left: 320px;"><img src="http://funkyimg.com/i/2gCgi.png"></div>  
       <!------ БЛИНЧИКИ ------>
<div style="margin-top: -270px; margin-left: 190px;"><img src="http://funkyimg.com/i/2gCgh.png"></div>
      <!------ БОБЕР ------>
<div style="margin-top: 0px; margin-left: 115px;"><img src="http://funkyimg.com/i/2gCgz.png"></div>
      <!------ ОЛЕНЬ ------>
<div style="margin-top: 30px; margin-left: 560px;"><img src="http://funkyimg.com/i/2gCgn.png"></div>
       <!------ СИРОП ------>
<div style="margin-top: -150px; margin-left: 399px;"><img src="http://funkyimg.com/i/2gCgm.png"></div>
       <!------ КЛЮШКА ------>
<div style="margin-top: -172px; margin-left: 273px;"><img src="http://funkyimg.com/i/2gCgk.png"></div>
    <!------ ВАРЕЖКИ ------>
<div style="margin-top: -100px; margin-left: 130px;"><img src="http://funkyimg.com/i/2gCgg.png"></div>
   <!------ ОФОРМЛЕНИЕ ------>
<div style="margin-top: -185px; margin-left: 170px;"><img src="http://funkyimg.com/i/2gCgo.png"></div>

  </div>


<label for="slider1_4"></label>
    <label for="slider1_2"></label>
  <input type="radio" name="slider1" id="slider1_2">
    <div>
        <div style="background: url(http://funkyimg.com/i/2hy1N.png); width: 332px; height: 224px; margin-top: 75px; margin-left: 340px;"> </div>
<!------ СТРАНА ------>
<div style="margin-top: -280px; margin-left: 383px;"><img src="http://funkyimg.com/i/2hy1H.png"></div>
    <!------ ЛИЦО ------>
<div style="margin-top: 180px; margin-left: 220px;"><img src="http://funkyimg.com/i/2ib6r.png"></div>
             <!------ ПЕЧАТЬ ------>
<div style="margin-top: -460px; margin-left: 130px;"><img src="http://funkyimg.com/i/2hy1D.png"></div>  
       <!------ ЛЕПЕШКА ------>
<div style="margin-top: -110px; margin-left: 600px;"><img src="http://funkyimg.com/i/2hy1G.png"></div>
      <!------ ОДЕЖДА ------>
<div style="margin-top: -2px; margin-left: 395px;"><img src="http://funkyimg.com/i/2hy1J.png"></div>
      <!------ ШЛЯПА ------>
<div style="margin-top: -150px; margin-left: 610px;"><img src="http://funkyimg.com/i/2hy1F.png"></div>
       <!------ МАРАКАСЫ ------>
<div style="margin-top: 23px; margin-left: 149px;"><img src="http://funkyimg.com/i/2hy1E.png"></div>
       <!------ СТОПКА ------>
<div style="margin-top: 82px; margin-left: 453px;"><img src="http://funkyimg.com/i/2hy1L.png"></div>
    <!------ ПЕРЧИК ------>
<div style="margin-top: -180px; margin-left: 590px;"><img src="http://funkyimg.com/i/2hy1K.png"></div>
  <!------ ЗВЕЗДОЧКА ------>
<div style="margin-top: -340px; margin-left: 80px;"><img src="http://funkyimg.com/i/2dFWb.png"></div>

<label for="slider1_4"></label>
    <label for="slider1_1"></label>


</div>
     </p>
    </div>
      </div>
</div></center>