//= template/header.html
<!-- START CONTENT  -->

<div class="player">
    <div class="player__bar">
        <div class="player__album">
            <div class="player__albumImg active-song" data-author="Khalid" data-song="Location" data data-src="http://ol5.mp3party.net/online/8418/8418598.mp3"
                style="background-image: url(img/album.jpg)">
            </div>
            <div class="player__albumImg" data-author="Khalid" data-song="Angels" data data-src="http://music.dawnfoxes.com/_fxs_/_upls_/_sngs_/USA/khalid-angels.mp3"
                style="background-image: url(img/album.jpg)">
            </div>
        </div>
        <div class="player__controls">

            <div class="player__prev">
                <svg class="icon">
                    <use xlink:href="img/sprite.svg#arrow"></use>
                </svg>
            </div>

            <div class="player__play">
                <svg class="icon play">
                    <use xlink:href="img/sprite.svg#play"></use>
                </svg>
                <svg class="icon pause">
                    <use xlink:href="img/sprite.svg#pause"></use>
                </svg>
            </div>

            <div class="player__next">
                <svg class="icon">
                    <use xlink:href="img/sprite.svg#arrow"></use>
                </svg>
            </div>
        </div>
    </div>
    <div class="player__timeline">
        <p class="player__author"></p>
        <p class="player__song"></p>
        <div class="player__timelineBar">
            <div id="playhead"></div>
        </div>
    </div>
</div>

<!-- END CONTENT  -->
//= template/footer.html