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>