Код:
<!--HTML--><center>

<div class="titanicc">
<div class="titanics">

<div class="titanic">
<input type="radio" id="titanic-1" name="titanic-group-1" checked>
<label for="titanic-1">Инфо</label>
<div class="ctitanic">

<div style="width:320px; height:290px; padding:5px; overflow:auto; ">

<a href="#">Общая информация</a>
<span>
<i>Аллея Славы протянулась с востока на запад по Голливудскому бульвару от Гауэр-стрит до Ла Бреа авеню, и совсем немного по Пути Маршфилд, которая расположена по диагонали между Голливудским бульваром и Ла Бреа авеню, а также с севера на юг по Вайн-стрит между Юкка-стрит и Сансет бульваром.</i><br><br>
<b>Как может попасть на Аллею Славы игрок Вертиго?</b> <br>
Любой Ваш профиль может попасть на Аллею при достижении определенных требований. На Аллее славы мы рады отметить и игроков, которые усердно пишут посты, и флудеров.<br>
</span>
</div>

</div>
</div>

<div class="titanic">
<input type="radio" id="titanic-2" name="titanic-group-1">
<label for="titanic-2" style="top:20px;">Игроки</label>
<div class="ctitanic">

<div style="width:290px; height:290px; padding:15px; overflow:auto; ">

<a href="#">Условия получения Звезды:</a>
<span>
> 30 завершенных эпизодов <br>
> 10 раз стать игроком <br>
> 10 лучших постов  <br>
> 10 лучших эпизодов  <br>
> 5 раз участвовать в квестах  <br>
</span>


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

<div class="titanic">
<input type="radio" id="titanic-3" name="titanic-group-1">
<label for="titanic-3" style="top:40px;">Флудеры</label>
<div class="ctitanic">

<div style="width:290px; height:290px; padding:15px; overflow:auto; ">

<a href="#">Условия получения Звезды:</a>
<span>
> 30 раз попасть в флудеры <br>
> 25 раз поучаствовать в конкурсах <br>
> 10 раз поучаствовать в флешмобах <br>
> 5 раз победить в конкурсах<br>
> 5 раз выдать цитату недели<br>
</span>

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


<style type="text/css">

.titanicc {
  width: 360px;
  height: 360px;
  padding: 20px;
  border-right: 100px solid #121212;
  background-image: url(http://i.imgur.com/IL7jRsm.jpg);
  -webkit-background-size: auto 400px;
  background-size: auto 400px;
  position: relative
  }

.titanics {
  position: relative;
  width: 360px;
  height: 360px
  }

.titanic {
  float: left
  }

.titanic label {
  display: block;
  background-color: white;
  color: 121212;
  padding: 0 5px;
  font-family: orator std;
  font-size: 10px;
  width: 70px;
  text-align: center;
  text-transform: uppercase;
  position: absolute;
  left: 390px;
  height: 15px;
  line-height: 20px
  }

.titanic [type=radio] {
  display: none
  }

.ctitanic {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: white;
  padding: 20px;
  text-align: center;
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  -webkit-transform: scale(0);
  transform: scale(0);
  -moz-transition-duration: 0.8s;
  -o-transition-duration: 0.8s;
  -webkit-transition-duration: 0.8s;
  transition-duration: 0.8s
  }

.titanicc [type=radio]:checked ~ label {
  background: white;
  border-bottom: 1px solid white;
  z-index: 4
  }

.titanicc [type=radio]:checked ~ label ~ .ctitanic {
  z-index: 1;
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1)
  }

.ctitanic a {
  display: block;
  font-family: georgia;
  font-size: 15px;
  padding: 5px;
  color: #121212;
  text-align: center;
  letter-spacing: -1px;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease
  }

.ctitanic a:hover {
  color: #f0f0f0;
  text-shadow: 1px 1px 0 #232424;
  background-color: #232424;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease
  }

.ctitanic span {
  display: block;
  padding: 5px;
  width: 220px;
  text-align: justify;
  font-family: orator std;
  font-size: 11px;
  color: #666;
  line-height: 100%;
  margin: 0 auto
  }

.ctitanic span b {
  color: #A4967D;
  font-size: 13px;
  display: block;
  font-weight: 400
  }

.libcred a {
   font-family: orator std;
   font-size: 10px;
   color: #03435e;
   padding-right: 10px;
   padding-top:10px;
   line-height: 8px;
   letter-spacing: 1px
   }
</style>