1

Код:
<!--HTML--><br>
<br>
<link href='https://forumstatic.ru/files/0017/74/4f/33371.css' rel='stylesheet' type='text/css'>
<link href='https://forumstatic.ru/files/0017/74/4f/42577.css' rel='stylesheet' type='text/css'>
<style>
url(https://fonts.googleapis.com/css?family=Lobster&subset=latin,cyrillic);
.click-ipad * { box-sizing: border-box; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: Roboto; font-size: 12px; line-height: 13px; color: #333; }
.click-ipad { margin: 0 auto; width: 470px; height: 546px; background: url(http://2.firepic.org/2/images/2016-04/04/y4fy24hrdhti.png) no-repeat 55px 50px; position: relative; }
.click-ipad label { text-align: center;  position: absolute; height: 50px; width: 50px; border-radius: 3px; cursor: pointer; color: #FFF; line-height: 33px; background-size: contain; font-size: 11px; bottom: 75px; left: 111px; z-index: 20; opacity: 1;}
.click-ipad label span { color: #FFF; position: absolute; bottom: -15px; right: 13px; text-shadow: 1px 1px 0 #000000;}
.click-ipad .click-close label { top: -2px; left: 350px; color: black; }
.click-ipad .click-close label span { text-shadow: none; color: black; }
.click-ipad .click-notes label { left: 70px; background-image: url(http://i.imgur.com/rdfBob7.png) }
.click-ipad .click-skype label { left: 135px; background-image: url(http://i.imgur.com/qwcHHep.png) }
.click-ipad .click-music label { left: 200px; background-image: url(http://i.imgur.com/fhydx1Z.png) } 
.click-ipad .click-emoji label { left: 260px; background-image: url(http://i.imgur.com/BwI0rpi.png) }
.click-ipad .click-plush label { left: 330px; background-image: url(http://i.imgur.com/n2clIRt.png) }
</style>

<link href='https://forumstatic.ru/files/0017/74/4f/54663.css' rel='stylesheet' type='text/css'>


<div class="click-ipad">
<img src="http://2.firepic.org/2/images/2016-04/03/87fs1mh4fdpk.png" style="background-size: contain; z-index: 0; position: absolute;">
<div class="click-close"><input id="click-0" name="ipad" type="radio" checked="checked">
<label for="click-0"><span>⊗</span></label>
</div>
<div class="click-plush">
<input id="click-5" name="ipad" type="radio" />
<label for="click-5"><span>status</span></label>
<div class="click-content">
<h3 class="click-title">status</h3>
<div class="click-text">
\*размещаем здесь*\
</div>
</div>
</div>
<div class="click-emoji">
<input id="click-4" name="ipad" type="radio" />
<label for="click-4"><span>awards</span></label>
<div class="click-content">
<h3 class="click-title">awards</h3>
<div class="click-text">

\*размещаем здесь*\

 </body>
</div>
</div>
</div>
<div class="click-notes">
<input id="click-1" name="ipad" type="radio"/>
<label for="click-1"><span>info</span></label>
<div class="click-content">
<br>
<h3 class="click-title">Miles Mikel Archer</h3>
<div class="click-text">
<center><table>
<tr>
<td>
<center><b>POSTS:</b></center><br>
<center>00</center>
</td>
<td><center>
<img src="http://i.imgur.com/WTYtIRL.jpg" style="width: 88px; border-radius: 100%; border: 5px double #8ccf61!important; background: #195583!important; box-shadow: 2px 1px 4px rgba(39, 40, 34, 0.42);"></center>
</td>
<td>
<center><b>GLOBE:</b></center><br>
<center>000</center>
</td>
</tr>
</table></center>
<center><h3 class="click-title">00 ЛЕТ❖ ОРИЕНТАЦИЯ ❖ ПРОФЕССИЯ </h3> </center>
<HR>
<center><h4 class="click-title">УСПЕХ</h3> </center>
<center>
<table>
<tr>
<td>
<img src="http://i.imgur.com/NJ3lm0G.png" title="пост">
<center>0</center>
</td>
<td>
<img src="http://i.imgur.com/NJ3lm0G.png" title="цитата">
<center>0</center>
</td>
<td>
<img src="http://i.imgur.com/NJ3lm0G.png" title="эпизод">
<center>0</center>
</td>
<td>
<img src="http://i.imgur.com/NJ3lm0G.png" title="пара">
<center>0</center>
</td>
<td>
<img src="http://i.imgur.com/NJ3lm0G.png" title="флудер">
<center>0</center>
</td>
<td>
<img src="http://i.imgur.com/NJ3lm0G.png" title="постописец">
<center>0</center>
</td>
</tr>
</table>
</center>
<hr>
<center><h4 class="click-title">МАФИЯ</h3> </center>
<center>
<table>
<tr>
<td>
<center>
<img src="http://i.imgur.com/NJ3lm0G.png" title="победы">
<center>0</center>
</center>
</td>
<td>
<center>
<img src="http://i.imgur.com/NJ3lm0G.png" title="пороигрыши">
<center>0</center>
</center>
</td>
</tr>
</table>
</center>



</div>
</div>
</div>
<div class="click-skype">
<input id="click-2" name="ipad" type="radio" />
<label for="click-2"><span>lala</span></label>
<div class="click-content">
<br>
<h3 class="click-title">LALAGRAM</h3>
<div class="click-text">
<link href='ССЫЛКУ НА СТИЛЬ ТВИТТЕРА СЮДА' rel='stylesheet' type='text/css'>

<center><div class="tweet" style="background-image: url(http://placehold.it/330x250);"><div class="tweeti"><img src="http://placehold.it/100"/></a></div><div class="tweetn">

first last

</div><div class="tweeth">
@username

</div></div><div class="tweetb"><table cellpadding="0" cellspacing="0"><td>1923<br><b>fans</b></td><td>96<br><b>like</b></td><td>194<br><b>post</b></td><td><div class="tweetf">+ fllw</div></td></table></div></center>
</div>
</div>
</div>
<div class="click-music">
<input id="click-3" name="ipad" type="radio" />
<label for="click-3"><span>itunes</span></label>
<div class="click-content">
<h3 class="click-title">itunes</h3>
\*размещаем здесь*\

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