<script defer="defer" src="/js/jquery.featureList-1.0.0.js"></script>
<script>$(document).ready(function() {$.featureList($("#tabs li a"),$("#output li"), {start_item:0});});</script>

<td class="gTableBody1">

<div id="feature_list">
<ul id="tabs">

<li><a href="javascript://" class="">Мод месяца</a></li> <!--1-->
<li><a href="javascript://" class="">Stalker News</a></li><!--2-->
<li><a href="javascript://" class="">Прямые трансляции</a></li><!--3-->
<li><a href="javascript://" class="">Видео топы лучших модов</a></li><!--4-->
<li><a href="javascript://" class="">5 самых ожидаемых модов</a></li><!--5-->
<li><a href="javascript://" class="">5 лучших модов 2016</a></li><!--6-->

</ul>

<ul id="output">
<li style="display: none;"><img src="/upload/mod_mes.jpg"><a href="#">Подробнее</a></li>
<!--1-->
<li style="display: none;"><img src="/upload/2.jpg"><a href="#">Подробнее</a></li>
<!--2-->
<li style="display: none;"><img src="/upload/6.jpg"><a href="#">Подробнее</a></li>
<!--3-->
<li style="display: none;"><img src="/upload/4.jpg"><a href="#">Подробнее</a></li>
<!--4-->
<li style="display: none;"><img src="/upload/3.jpg"><a href="#">Подробнее</a></li>
<!--5-->
<li style="display: list-item;"><img src="/upload/5.jpg"><a href="#">Подробнее</a></li>
</ul>
  
</div>
</div>

</td>

.gTableBody1 {
background: #0f0f0f;
padding: 4px;
margin-bottom: 5px;
font-family: Verdana,Arial,Sans-Serif;
font-size: 10px;
padding: 3px;
}

div#feature_list {
height: 195px;
overflow: hidden;
position: relative;
width: 484px;
}

div#feature_list ul {
list-style: outside none none;
position: absolute;
right: 0;
}

ul#tabs {z-index: 2;}

ul#tabs li img {
padding: 5px;
border: none;
float: left;
margin: 10px 10px 0 0;
}

ul#tabs li a {
background:rgba(255, 255, 255, 0.7);
border: 1px solid #777;
border-radius: 10px 0 0 10px;
margin-top: 2px;
padding-left: 1px;
position: relative;
width: 175px;
text-decoration: none;
display: block;
padding: 7px;
outline: none;
color: #000;
font-size: 10px;
font-weight: 700;
transition: all 0.4s ease 0s;
}

ul#tabs li a.current {background: rgba(0, 0, 0, 0.4); color: #fff;}
ul#tabs li a.current:hover {text-decoration: none;cursor: default;}

ul#output {
height: 195px;
position: relative;
width: 484px;
}

ul#output li {
position: absolute;
width: 463px;
height: 160px;
}

ul#output li a {
bottom: -20px;
background:#000;
border-radius: 5px;
bottom: -20px;
font-size: 11px;
left: 20px;
padding: 8px 12px;
position: absolute;
text-decoration: none;
}

ul#output li a:hover {background: #D33431;box-shadow: 0 0 10px #ff0600;}