headphone emoji floating music player

<html>
<head>
<style>
div.song {
position: absolute;
bottom: 60px;
right: 28px;
width: auto;
animation-name: floating;
animation-duration: 3s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
z-index: 2;
}

@keyframes floating {
0% { transform: translate(0, 0px); }
50% { transform: translate(0, 3px); }
100% { transform: translate(0, -0px); }
}

</style>
</head>
<body>

<div class="song">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">

<center>
<audio id="audio" src="https://dl.dropbox.com/s/40ldfrh5q2wod30/Stardew%20Valley%20OST%20-%20Fall%20%28The%20Smell%20of%20Mushroom%29.mp3"></audio>
<img id="img" src="https://dl.dropbox.com/scl/fi/vgz5mcbpxpcor4o08i87h/a5dfd1f7342e92e2ae99c7eba67a18.webp?rlkey=rrk0r1kly4hp5dhxe5dz022fg&st=neg7coir&dl=0" width=50px height=auto class="animate__animated">
</center>

<script>
document.getElementById("img").addEventListener("click", function(){
document.getElementById("audio").play();
});
</script>
</div>

</body>
</html>