↳ ❝ [sliding music player] ¡! ❞

<!--
        MUSIC PLAYER #01 by glenthemes
        ♬ glenthpvs.tumblr.com/player01
--->
<script src="//cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js"></script>
<script src="//glenthemes.github.io/-music-/glenplayer01.js"></script>
<link href="//glenthemes.github.io/-music-/glenplayer01.css" rel="stylesheet">

<style element="glenplayer01">
:root {
    --MusicPlayer-Distance-From-Bottom:30px;

    --MusicPlayer-Frame-Thickness:12px;
    --MusicPlayer-Frame-Color:#fff;
    --MusicPlayer-Frame-Transparency:40%;

    --MusicPlayer-Text-Background:#fff;
    --MusicPlayer-Text-Padding:12px;
    --MusicPlayer-Text-Align:right;

    --MusicPlayer-Text-TOP-Size:10px;
    --MusicPlayer-Text-TOP-Color:#999;

    --MusicPlayer-Text-BOTTOM-Size:10px;
    --MusicPlayer-Text-BOTTOM-Color:#222;

    --MusicPlayer-Circle-Size:50px;
    --MusicPlayer-Circle-Background:#fff;

    --MusicPlayer-PlayButton-Size:10px;
    --MusicPlayer-PlayButton-Color:#222;

    --MusicPlayer-Bar-Thickness:2px;
    --MusicPlayer-Bar-Spacing:2px;
    --MusicPlayer-Bar-Color:#222;

    --MusicPlayer-SlideIn-Speed:0.69s;
    --MusicPlayer-SlideOut-Speed:1s;
}
</style>

<div glenplayer01>
    <div top-text>Fleeting Words / Family</div>
    <div bottom-text>Keiichi Okabe / Square Enix Music</div>

    <audio id="music-id" src="https://cdn.glitch.com/575112cc-11b3-450e-a9e0-7c6c330b016c/Fleeting%20Words%20-%20Family.mp3"></audio>
</div>
<!--- end music player --->