[html]<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,500,800|Inconsolata" rel="stylesheet">
<style>
#andfauna {
background: #eee;
width: 500px;
height: 460px;
position: relative;
margin: 20px auto 0px;
outline: 1px solid #ddd;
overflow: hidden;
}

#andfauna picture {
position: absolute;
background-size: cover;
height: 340px;
width: 200px;
left: 150px;
top: 60px;
outline: 1px solid #ddd;
display: block;
transition: 0.5s;
}

#fauna:checked ~ picture {
left: 270px;
}

#andfauna picture:after {
content: "";
display: block;
position: absolute;
height: 340px;
width: 200px;
background: #bf6a8b;
top: 0px;
left: 0px;
mix-blend-mode: multiply;
}

#andfauna lyrics {
position: absolute;
color: #bf6a8b;
background: #eee;
display: block;
font-size: 10px;
text-transform: uppercase;
font-family: inconsolata;
letter-spacing: 2px;
width:220px;
height: 18px;
line-height: 170%;
text-align: center;
outline: 1px solid #ccc;
transform: rotate(-20deg);
top: 130px;
left: 110px;
transition:0.5s;
z-index: 1;
}

#andfauna lyrics:nth-child(odd) {
top: 160px;
left: 150px;
}

#fauna:checked ~ lyrics {
left: 240px;
top: 60px;
}

#fauna:checked ~ lyrics:nth-child(odd) {
left: 270px;
top: 85px;
}

#andfauna input {
display: none;
}

#andfauna label {
display: block;
position: absolute;
color: #bf6a8b;
font-family: open sans;
font-weight: 900;
font-size: 60px;
top: 395px;
z-index: 2;
left: 20px;
cursor: crosshair;
transition: 0.5s;
line-height: 100%;
}

#fauna:checked+label {
top: 15px;
transform: rotate(45deg);
font-size: 30px;
left: 15px;
}

.fmusicbox {
height: 340px;
width: 200px;
position: relative;
background: #eee;
outline: 1px solid #ddd;
top: 60px;
left: -210px;
overflow: auto;
transition: 0.5s;
}

#fauna:checked ~ .fmusicbox {
left: 30px;
}

#andfauna songblock {
display: flex;
height: 41px;
width: 193px;
outline: 1px solid #ddd;
align-items: center;
border-bottom: 1px solid #bf6a8b;
margin-bottom: 1px;
flex-direction: row;
text-align: left;
}

#andfauna songblock:nth-child(odd) {
flex-direction: row-reverse; 
text-align: right;
}   

#andfauna album {
display: block;
background-size: cover;
height: 41px;
width: 41px;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
}

.fblock {
display: block;
}

#andfauna a {
text-decoration: none;
}

#andfauna h1 {
   display: block;
   font-family: inconsolata;
   font-size: 10px;
   color: #deadc0;
   margin: 5px 10px 0px;
   text-decoration: none;
   text-transform: uppercase;
   letter-spacing: 1px;
   line-height: 130%;
}

#andfauna h2 {
   display: block;
   text-transform: lowercase;
   font-size: 10px;
   margin: 0px 10px 5px;
   font-family: open sans;
   color: #bf6a8b;
   line-height: 130%;
}

.fmusicbox::-webkit-scrollbar{width:5px}
.fmusicbox::-webkit-scrollbar-thumb{border:1px solid #172735!important;background:transparent!important}
.fmusicbox::-webkit-scrollbar-track{background:#eee!important;border:none!important}

</style>
<div id="andfauna">
<input type="checkbox" id="fauna" >
  <label for="fauna" title="">❤</label>
<picture style="background-image: url(https://i.imgur.com/0UsTKBX.png)"></picture>
<lyrics>gojo satoru</lyrics>
<lyrics>nanami kento</lyrics>
<div class="fmusicbox">
<songblock>
   <album style="background-image: url(https://i.imgur.com/OAuNv22.png)"></album>
   <a href="https://music.yandex.ru/album/32452465/track/129051862?utm_source=desktop&utm_medium=copy_link"><div class="fblock">
     <h1>gojo satoru</h1>
     <h2>mvdx & zenome </h2>
   </div></a>
</songblock>
<songblock>
   <album style="background-image: url(https://i.imgur.com/kfZrFNn.png)"></album>
   <a href="https://youtu.be/bZYPI4mYwhw?si=o6MNXFHecwbs8nxu"><div class="fblock">
     <h1>my universe</h1>
     <h2>bts& coldplay</h2>
   </div></a>
</songblock>
<songblock>
   <album style="background-image: url(https://i.imgur.com/guopnnW.png)"></album>
   <a href="https://youtu.be/98WtmW-lfeE?si=CilhruMREpUDQvhu"><div class="fblock">
     <h1>teenage dream</h1>
     <h2>katy perry</h2>
   </div></a>
</songblock>
<songblock>
   <album style="background-image: url(https://i.imgur.com/ysgldTi.png)"></album>
   <a href="https://youtu.be/bPW9IInidms?si=En_nXPv2CtONSJLG"><div class="fblock">
     <h1>beautiful</h1>
     <h2>sunrise avenue</h2>
   </div></a>
</songblock>
<songblock>
   <album style="background-image: url(https://i.imgur.com/KzGXfa8.png)"></album>
   <a href="https://youtu.be/eRpRhXUOhGA?si=hV6WhlIpUbxyMhXS"><div class="fblock">
     <h1>i'll make love to you</h1>
     <h2>thomas doherty</h2>
   </div></a>
</songblock>
<songblock>
   <album style="background-image: url(https://i.imgur.com/ILxYJmA.png)"></album>
   <a href="https://youtu.be/a7fzkqLozwA?si=HL9mIRGNhh4S0aAU"><div class="fblock">
     <h1>i like me better</h1>
     <h2>lauv</h2>
   </div></a>
</songblock>
<songblock>
   <album style="background-image: url(https://i.imgur.com/UplccHP.png)"></album>
   <a href="https://youtu.be/BV3yw_gieXA?si=j_IgNxdV_EY9ngh7"><div class="fblock">
     <h1>miracle</h1>
     <h2>shinedown</h2>
   </div></a>
</songblock>
</div>
</div>[/html]