Код:
<!--HTML--><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link href='http://fonts.googleapis.com/css?family=Roboto+Slab:400,700,300,100|Montserrat:400,700' rel='stylesheet' type='text/css'><style>
#waffles {height: 600px; width: 450px; position: relative; background: red; border: 10px solid #786252; box-shadow: 0px 0px 10px rgba(0,0,0,0.3)}
.wafflesh {height: 120px; background-image : url(http://s3.uploads.ru/I1Gxt.jpg); background-color: #1d1e21; width: 450px; position: absolute; top: 0px;}
.wafflesh1 {height: 80px; width: 80px; border: 8px solid #786252; box-shadow: 0px 0px 5px rgba(0,0,0,0.3); position: absolute;background-repeat: no-repeat; top: 13px; left: 14px;}
.wafflesh2 {height: 20px; font-family: montserrat; text-transform: uppercase; color: #885621; letter-spacing: 3px; padding-bottom: 3px; font-size: 9px; position: absolute; width: 300px; border-bottom: 1px dotted #3d3639; right: 10px; top: 15px; line-height: 25px; text-align: right}
.wafflesh3 {height: 50px; width: 300px; text-shadow: 2px 2px 10px rgba(0,0,0,0.1); color: #6f5d49; text-transform: lowercase; font-family: roboto slab; position: absolute; right: 10px; top: 50px; font-size: 45px; text-align: left; letter-spacing: -3px; line-height: 30px }
.wafflesh3::first-letter {color: #865723}
.wafflesf {height: 40px; width: 450px; line-height: 40px; background-image : url(http://s3.uploads.ru/I1Gxt.jpg); background-color: #1d1e21; position: absolute; bottom: 0px; color: #885621; font-family: montserrat; letter-spacing: 3px; font-size: 9px; text-align: center; text-transform: uppercase}
.wafflesm {width: 430px; height: 420px; background-image: url(http://i.imgur.com/RXxfq8F.png); position: absolute; top: 120px; background-color: rgba(61, 54, 57, 0.96);background-blend-mode: multiply; padding: 5px; border: 5px solid transparent; overflow: auto}
.wafflesm td {padding-bottom: 10px; border-bottom: 1px solid #786252; width: }
.waffless {height: 120px; width: 120px; position: relative; overflow: hidden; margin: 3px 5px 3px 4px; background-size: cover; background-repeat: no-repeat}
.waffless1 {background: rgba(61,54,57, 0.8); height:120px; width: 120px; position: absolute; top: 0px; z-index: 2;}
.waffless .waffless1 {top: -120px; -webkit-transition: 0.4s ease}
.waffless:hover .waffless1 {top: 0px}
.waffless1a {height: 40px; width: 100px; background-color: #865723; position: absolute; top: 10px; left: 10px; font-size: 14px; line-height: 40px; color: #786252; text-align: center}
.waffless1b {position: absolute; height: 15px; font-family: montserrat; text-transform: uppercase; text-align: center; line-height: 15px; width: 100px; left: 10px; color: #1d1e21; font-size: 7px; background: #6e5c48; text-transform: uppercase}
.wafflesm::-webkit-scrollbar {width:0px}
</style>
<center>
<div id="waffles">
<div class="wafflesh">
<div class="wafflesh1" style="background-image:url(http://s6.uploads.ru/QJon9.png)"></div>
<div class="wafflesh2">CHAPTER I</div>
<div class="wafflesh3">BAD BLOOD</div>
</div>
<div class="wafflesm">
<table cellspacing="8px">
<tr>
<td>
<div class="waffless" style="background-image:url(http://s3.uploads.ru/t/i8Gw4.png)">
<div class="waffless1">
<a href="https://www.youtube.com/watch?v=pw540DtB5mM"><div class="waffless1a"><i class="fa fa-play" style="line-height: 40px"></i></div></a>
<div class="waffless1b" style="top: 55px">No More Dream</div>
<div class="waffless1b" style="top: 75px">BTS</div>
<div class="waffless1b" style="top: 95px">Wake Up</div>
</div>
</div>
</td>
<td>
<div class="waffless" style="background-image:url(http://s7.uploads.ru/t/keO38.png)">
<div class="waffless1">
<a href="https://www.youtube.com/watch?v=FJt7gNi3Nr4"><div class="waffless1a"><i class="fa fa-play" style="line-height: 40px"></i></div></a>
<div class="waffless1b" style="top: 55px">No Church In The Wild </div>
<div class="waffless1b" style="top: 75px">Kanye West </div>
<div class="waffless1b" style="top: 95px">Watch the Throne</div>
</div>
</div>
</td>
<td>
<div class="waffless" style="background-image:url(http://s6.uploads.ru/t/Wik0h.png)">
<div class="waffless1">
<a href="https://www.youtube.com/watch?v=_VG54Pjnc-Y"><div class="waffless1a"><i class="fa fa-play" style="line-height: 40px"></i></div></a>
<div class="waffless1b" style="top: 55px">Cold Red Light </div>
<div class="waffless1b" style="top: 75px"> IAMX</div>
<div class="waffless1b" style="top: 95px">Volatile Times</div>
</div>
</div>
</td>
</tr>
<tr>
<td>
<div class="waffless" style="background-image:url(http://s6.uploads.ru/t/ajyQz.png)">
<div class="waffless1">
<a href="https://www.youtube.com/watch?v=CnmLjdvTeCE"><div class="waffless1a"><i class="fa fa-play" style="line-height: 40px"></i></div></a>
<div class="waffless1b" style="top: 55px">Super Fly</div>
<div class="waffless1b" style="top: 75px">24K</div>
<div class="waffless1b" style="top: 95px">날라리 Super Fly</div>
</div>
</div>
</td>
<td>
<div class="waffless" style="background-image:url(http://s2.uploads.ru/t/Ya6Dl.png)">
<div class="waffless1">
<a href="https://www.youtube.com/watch?v=tcJ71Zy1voY"><div class="waffless1a"><i class="fa fa-play" style="line-height: 40px"></i></div></a>
<div class="waffless1b" style="top: 55px">BBHMM</div>
<div class="waffless1b" style="top: 75px">Rihanna</div>
<div class="waffless1b" style="top: 95px">Single</div>
</div>
</div>
</td>
<td>
<div class="waffless" style="background-image:url(http://s3.uploads.ru/t/8Wcbr.png)">
<div class="waffless1">
<a href="https://www.youtube.com/watch?v=VwV2I5tH4no"><div class="waffless1a"><i class="fa fa-play" style="line-height: 40px"></i></div></a>
<div class="waffless1b" style="top: 55px">MADE</div>
<div class="waffless1b" style="top: 75px">BIGBANG</div>
<div class="waffless1b" style="top: 95px">Trailer</div>
</div>
</div>
</td>
</tr>
<tr>
<td>
<div class="waffless" style="background-image:url(http://s3.uploads.ru/t/Gqtir.png)">
<div class="waffless1">
<a href="https://www.youtube.com/watch?v=_tjre3EOCaY"><div class="waffless1a"><i class="fa fa-play" style="line-height: 40px"></i></div></a>
<div class="waffless1b" style="top: 55px">WARRIOR </div>
<div class="waffless1b" style="top: 75px">B.A.P</div>
<div class="waffless1b" style="top: 95px">WARRIOR </div>
</div>
</div>
</td>
<td>
<div class="waffless" style="background-image:url(http://s7.uploads.ru/t/ePHk2.png)">
<div class="waffless1">
<a href="https://www.youtube.com/watch?v=LbPRGDwlfqs"><div class="waffless1a"><i class="fa fa-play" style="line-height: 40px"></i></div></a>
<div class="waffless1b" style="top: 55px">I'm A Man</div>
<div class="waffless1b" style="top: 75px"> Black Strobe</div>
<div class="waffless1b" style="top: 95px">Burn Your Own Church</div>
</div>
</div>
</td>
<td>
<div class="waffless" style="background-image:url(http://s6.uploads.ru/t/AUOoN.png)">
<div class="waffless1">
<a href="https://www.youtube.com/watch?v=_bSXY75R3Wc"><div class="waffless1a"><i class="fa fa-play" style="line-height: 40px"></i></div></a>
<div class="waffless1b" style="top: 55px">Life Of The Party</div>
<div class="waffless1b" style="top: 75px">The Weeknd</div>
<div class="waffless1b" style="top: 95px">Trilogy</div>
</div>
</div>
</td>
</tr>
</table>
</div>
<div class="wafflesf">BADLANDS SOUNDTRACKS</div>
</div>
</center>
