<div class="container">
<div class="column add-bottom">
<div id="mainwrap">
<div id="nowPlay">
<span id="npAction">Paused...</span><span id="npTitle"></span>
</div>
<div id="audiowrap">
<div id="audio0">
<audio id="audio1" preload controls>Your browser does not support HTML5 Audio! 😢</audio>
</div>
<div id="tracks">
<a id="btnPrev">←</a><a id="btnNext">→</a>
</div>
</div>
<div id="plwrap">
<ul id="plList"></ul>
</div>
</div>
</div>
<div class="column add-bottom center">
<p>Music by <a href="http://www.mythium.net/">Mythium</a></p>
<p>Download: <a href="https://archive.org/download/mythium/mythium_vbr_mp3.zip">zip</a> / <a href="https://archive.org/download/mythium/mythium_archive.torrent">torrent</a></p>
</div>
</div>
/* Font Family
================================================== */
@import url("https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap");
/* Global Styles
================================================== */
html,body {
-webkit-font-smoothing:antialiased;
-webkit-text-size-adjust:100%;
background-color:#0665a2;
color:#fff;
font-size:1rem;
font-family:"Source Sans Pro", arial, sans-serif;
font-weight:400;
letter-spacing:.025rem;
line-height:1.618;
padding:1rem 0;
}
*,::before,::after {
box-sizing:border-box;
}
* {
-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
-webkit-tap-highlight-color:transparent;
}
/* Setup
================================================== */
.container { position:relative; margin:0 auto; max-width:800px; width:100%; }
.column { width:inherit; }
/* Typography / Links
================================================== */
p { color:#fff; display:block; font-size:.9rem; font-weight:400; margin:0 0 2px; }
a,a:visited { color:#8cc3e6; outline:0; text-decoration:underline; }
a:hover,a:focus { color:#bbdef5; }
p a,p a:visited { line-height:inherit; }
/* Misc.
================================================== */
.add-bottom { margin-bottom:2rem !important; }
.left { float:left; }
.right { float:right; }
.center { text-align:center; }
.hidden { display:none; }
.no-support {
margin:2rem auto;
text-align:center;
width:90%;
}
/* Audio Player Styles
================================================== */
audio {
display:none;
}
#audiowrap,
#plwrap {
margin:0 auto;
}
.
.
.
