<!--HTML-->
<style type="text/css">
::-webkit-scrollbar { height: 12px; width: 10px; background-color: #fff;} 
::-webkit-scrollbar-thumb { background: #090C13; } 
::-webkit-scrollbar-corner { background: #090C13; }
::-webkit-scrollbar-track { background: #fff; }
#thtabcontainer { width: 460px; padding: 20px; background-image: url('http://funkyimg.com/i/22VAa.jpg'); } /* фон */

.tabs { position: relative; height: 700px; width: 460px; clear: both; margin: 15px 0; }
.tab { float: left; }
.tab label { display: block; background: #ad956b; color: #ccc; height: 12px; width: 60px; font: 12px/10px lekton; padding: 5px; -webkit-border-radius: 2px; margin: 1px; position: relative;  left: 45px; }
.tab [type=radio] { display: none; }

[type=radio]:checked ~ label { background: #cdc1a9; color: #090C13; border-bottom: 0px; z-index: 2; }
[type=radio]:checked ~ label ~ .thcontent { z-index: 1; }
.thcontent { position: absolute; width: 460px; top: 30px; background-color: #cdc1a9;  right: 0; bottom: 0; padding: 0px; border: 0px; text-align: center; }
[type=radio]:checked ~ label { background: #cdc1a9; color: #090C13; border-bottom: 0px; z-index: 2; }
[type=radio]:checked ~ label ~ .thcontent { z-index: 1; }


.apptitle { font-family: yanone kaffeesatz; text-transform: uppercase; letter-spacing: 3px; font-size: 10px; text-align: center; box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.44) inset; color: #A5A5A5; background-color: #000; padding: 5px; margin: 5px 0px;  }
.thfirsttabcredit { font-family: lekton; font-size: 8px; text-transform: uppercase; text-align: center; line-height: 9px; padding-top: 20px; letter-spacing: 2px; word-spacing: 4px; color: #606060; }


.thappcontent { width: 440px; height: 400px; overflow: auto; font-family: Georgia; padding: 10px; font-size: 11px; line-height: 12px; color: #090C13; }
.thappcontent1 { width: 440px; height: 400px; overflow: auto; font-family: Georgia; padding: 10px; font-size: 11px; line-height: 12px; color: #090C13; }

</style>

<center>
<div id="thtabcontainer">


<center><div class="tabs">
   
  <div class="tab">
      <input type="radio" id="tab-1" name="tab-group-1" checked>
      <label for="tab-1">Аггелон</label>
      
      <div class="thcontent">
<div class="thappcontent"> <table><tr><td style="text-align: center;"><b>Б</b>ьььь</td><td style="text-align: center;"><b>О</b>od</td></tr>
<tr><td style="text-align: center;"><b>NЮ</b>ююююю, <font style="font-size: 8px;">юююююю</font><br>





</td><td style="text-align: center;">
<b>Ю</b>ююююю, <font style="font-size: 8px;">бббб</font><br>






</td></tr></table>
      </div>
</div>
  </div>
   
  <div class="tab">
      <input type="radio" id="tab-2" name="tab-group-1">
      <label for="tab-2">Ренхальт</label>
      
      <div class="thcontent">
<div class="thappcontent"><table><tr><td style="text-align: center;"><b>Ю</b>юююю</td><td style="text-align: center;"><b>Ю</b>od</td></tr>
<tr><td style="text-align: center;"><b>И</b>ЮЮЮЮЮ, <font style="font-size: 8px;">лллл</font><br> 




</td><td style="text-align: center;">
<b>Ю</b>юююю, <font style="font-size: 8px;">ююююю</font> <br>




</td></tr></table></div>     
      </div> 
  </div>
   
  <div class="tab">
      <input type="radio" id="tab-3" name="tab-group-1">
      <label for="tab-3">Халланд</label>
     
      <div class="thcontent">
<div class="thappcontent">
       <table><tr><td style="text-align: center;"><b>G</b>oddess</td><td style="text-align: center;"><b>б</b>od</td></tr>
<tr><td style="text-align: center;"><b>Ю</b>юююю, <font style="font-size: 8px;">ббббб</font><br> 



</td><td style="text-align: center;">
<b>Ю</b>юююююю <font style="font-size: 8px;">бббб</font> <br>




</td></tr></table>
</div>
      </div> 
  </div>

  <div class="tab">
      <input type="radio" id="tab-4" name="tab-group-1">
      <label for="tab-4">Байсэ</label>
     
      <div class="thcontent">
<div class="thappcontent">
<table><tr><td style="text-align: center;"><B>Ю</B>ЮЮЮЮЮЮЮЮЮЮЮЮЮ</td><td style="text-align: center;"><B>Ю</B>ююююю</td></tr>
<tr><td style="text-align: center;"><b>Ю</b>ююююю<font style="font-size: 8px;">бббббб</font><br>



 </td><td style="text-align: center;"><b>Ь</b>оооооооо<font style="font-size: 8px;">ооооооо</font> <br>



</td></tr></table>
         </div> 
      </div> 
</div> 
<div class="tab">
      <input type="radio" id="tab-5" name="tab-group-1">
      <label for="tab-5">Бошеби</label>
           <div class="thcontent">
<div class="thappcontent"><B>P</B>ЬЬЬЬЬЬЬЬЬЬЬЬЬЬЬЬЬЬЬЬЬЬ
<table><tr><td style="text-align: center;"><b>Ь</b>оооооооо</td><td style="text-align: center;"><b>Ь</b>ддддддддд</td></tr>
<tr><td style="text-align: center;"><b>Б</b>ббббббббббббб <font style="font-size: 8px;">бббббббббб</font><br> 


</td><td style="text-align: center;"><b>Б</b>ььььььььььь, <font style="font-size: 8px;">ьььььььььььььь</font> <br>


</td></tr></table><br>
<B>P</B>БББББББББББББББББ
<table><tr><td style="text-align: center;"><b>Ь</b>ттттттттт</td><td style="text-align: center;"><b>Т</b>оооо</td></tr>
<tr><td style="text-align: center;"><b>О</b>ооооооооо<font style="font-size: 8px;">ооооо</font><br> </td><td style="text-align: center;"><b>Ш</b>оооооооооо<font style="font-size: 8px;">ррррррррр</font> <br></td></tr></table><br>
        </div>  
      </div> 
  </div>
   
</div>
</div></center>

</div>
</center>