Код:
<!--HTML--><div id="tumblr1">
<div id="tumblr2">
<div id="tumblr3"></div>
<img src="http://funkyimg.com/i/2aeh4.gif">
<h1>важные новости и нововведение</h1>
<h1>+ лотерея</h1>
<h1>не упустите шанс (:</h1>
</div>
<div id="tumblr4">
<div class="tpost1"><span><img src="http://funkyimg.com/i/2ahya.png"></span>
<div class="toast">
<b>важные новости | нововведение</b>
<i>hey, guys :з (всегда подбешивало такое приветствие, но я же типа полу американец, мне можно хдд) в общем, спешу обрадовать вас небольшим нововведением. ну как небольшим... пожалуй, о важности этого события решать только вам. короче, не буду вас томить... <br>/фанфары хд/ у нас новые статусы! :) нет-нет-нет, если вы подумали, что старые отменяются - думайте обратно хд, потому что старый любимый вид статусов так и останется базовым. новые же статусы станут ну оооочень редкими, поистине вип-статусами. и заработать их будет ох, как непросто ^^ ♥~ <s>хотя кто знает, кто знает... хд</s></i>
</div>
</div>
<div class="tpost2">
<span><img src="http://funkyimg.com/i/2aemF.png"></span>
<span><img src="http://funkyimg.com/i/2aenp.png"></span><br>
<span><img src="http://funkyimg.com/i/2aenq.png"></span>
<span><img src="http://funkyimg.com/i/2aens.png"></span><br>
<span><img src="http://funkyimg.com/i/2aent.png"></span>
<span><img src="http://funkyimg.com/i/2aenu.png"></span><br>
<span><img src="http://funkyimg.com/i/2aenv.png"></span>
<span><img src="http://funkyimg.com/i/2aenw.png"></span><br>
<span><img src="http://funkyimg.com/i/2aenx.png"></span>
<span><img src="http://funkyimg.com/i/2aenB.png"></span><br>
<span><img src="http://funkyimg.com/i/2aenC.png"></span>
<span><img src="http://funkyimg.com/i/2aenD.png"></span><br>
<div class="toast">
<b>лотерея</b>
<i><br><s>чтобы организовать лотерею, гадкий Я призвал своих миньончиков хдд</s>
<br><br>чтобы ввести "моду" на <s>новую одежду хд</s> новые статусы и разжечь ваш дальнейший интерес к подобного рода статусам, предлагаем вам принять участие в абсолютно <b>бесплатной</b> (для многих это ключевое слово, я знаю хд) лотерее! успейте отхватить свободного миньона:з
<br>за 12 миньончиками спрятаны 4 статуса. за остальными - утешительный приз в виде 400 krw, что тоже неплохо, правда?
<br>вы просто выбираете понравившегося и свободного(!) миньона и посылаете хд его сообщением ниже. результаты лотереи будут сказаны только тогда, когда разберут всех миньонов:з
<br>заранее поздравляем счастливчиков, тех, кто не только успел подбежать вовремя, но и отхватить миньончика со статусом:з
<br>ну а те, кто припоздал - не стоит расстраиваться:з
<br>следите за обновлениями:з
<br>обещаем, они не заставят себя долго ждать. любим вас, котики ♥ ^^</i>
</div>
</div>
</div>
</div>
<link href='https://fonts.googleapis.com/css?family=Roboto:400,900|Open+Sans:400,800' rel='stylesheet' type='text/css'>
<style>
#tumblr1 { text-align: justify; width: 500px; height: 400px; background: #104556; margin: 0 auto; position: relative; }
#tumblr2 { width: 140px; height: 400px; }
#tumblr2 img { width: 100px; position: relative; top: 20px; left: 20px; border: 5px solid #84ab41; border-radius: 50%; }
#tumblr3 { width: 90px; height: 400px; position: absolute; top: 0; left: 0; background: #84ab41; }
#tumblr2:before { content: "✽"; color: #84ab41; z-index: 2; font: 800 40px/100% open sans; position: absolute; bottom: 10px; left: 15px; text-shadow: 1px 1px white, -1px -1px white, -2px -1px white, 1px -1px white, -1px 1px white, -4px -1px white, 3px 3px #104556; }
#tumblr2 h1 { position: relative; top: 50px; left: 10px; border-bottom: 1px solid #104556; padding: 2px; width: 76px; margin: 0; z-index: 2; font: 900 8px/100% roboto; text-transform: uppercase; letter-spacing: 1px; color: white; margin: 0 0 5px 0; }
#tumblr4 { width: 340px; padding-right: 10px; height: 380px; background: #104556; position: absolute; top: 0; right: 0; border: 10px solid #104556; overflow: auto; }
#tumblr4 h1 { position: relative; top: 0; left: 0; }
.tpost1, .tpost2, .tpost3 { text-transform: uppercase; letter-spacing: 1px; font: 8px roboto; color: white; margin: 4px 0; transition: 1s; border: 1px solid #e9e9e9; min-height: 120px; padding: 10px; position: relative; }
.tpost1 img { transform: scale(1); width: 320px; transition: 1s; }
.tpost1 span { width: 316px; height: 99px; overflow: hidden; display: block; }
.tpost1:before, .tpost2:before, .tpost3:before { color: white; content: "reblog"; position: absolute; bottom: 10px; left: 10px; font: 8px roboto; text-transform: uppercase; letter-spacing: 1px; background: #84ab41; padding: 2px 6px; border-radius: 4px; }
.tpost1:after, .tpost2:after, .tpost3:after { color: white; content: "notes"; position: absolute; bottom: 10px; left: 63px; font: 8px roboto; text-transform: uppercase; letter-spacing: 1px; background: #84ab41; padding: 2px 6px; border-radius: 4px; }
.tpost1:hover, .tpost2:hover, .tpost3:hover { border: 1px solid #84ab41; transition: 1s; }
.tpost1 i, .tpost2 i, .tpost3 i { font: 10px cuprum; display: block; margin: 3px 20px; }
.toast { min-height: 30px; padding: 10px 10px 20px 10px; }
.tpost2 { min-height: 225px; }
.tpost2 img { width: 100px; transition: 1s; }
.tpost2 span { width: 100px; height: 100px; margin: 1px; overflow: hidden; display: inline-block; position: relative; left: 56px; }
.tpost3 { min-height: 20px; }
#tumblr4::-webkit-scrollbar { width: 1px; }
#tumblr4::-webkit-scrollbar-track { background: #104556; }
#tumblr4::-webkit-scrollbar-thumb { background: white; }
</style>
