<!doctype html>

<meta charset=utf-8>
<title>Happy Birthday, Sindre!</title>

<style>
body {
    margin: 0;
    padding: 0;
    background-color: #eee;
    color: #333;
    font-family: helvetica;
}

canvas {
    position: absolute;
}

.hud {
    position: absolute;
    margin-left: 1em;
}

.hit {
    font-weight: bold;
    color: red;
}

footer {
    position: fixed;
    bottom: 4em;
    left: 2em;
}

.winimg {
    width: 100%;
}
</style>

<div class="hud">
    <h1 id="level"></h1>
    <p>It's Sindre's Birthday! Hit the boxes!</p>
    <p id="score"></p>
</div>

<div id="webgl-container"></div>

<footer>
    Based on <a href="http://codepen.io/chris-creditdesign/pen/emKQwY">a Codepen by chris-creditdesign</a>
</footer>

<script src="//cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/3.3.1/lodash.min.js"></script>
<script src="game.js"></script>

<!doctype html>

<meta charset=utf-8>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#000000">
<title>Happy Birthday, Sindre!</title>


<style>
body {
    margin: 0;
    padding: 0;
    background-color: #eee;
    color: #333;
    font-family: helvetica;
}

canvas {
    position: absolute;
}

.hud {
    position: absolute;
    margin-left: 1em;
}

.hit {
    font-weight: bold;
    color: red;
}

footer {
    position: fixed;
    bottom: 4em;
    left: 2em;
}

.winimg {
    width: 100%;
}
</style>

<div class="hud">
    <h1 id="level"></h1>
    <p>It's Sindre's Birthday! Hit the boxes!</p>
    <p id="score"></p>
</div>

<div id="webgl-container"></div>

<footer>
    Based on <a href="http://codepen.io/chris-creditdesign/pen/emKQwY">a Codepen by chris-creditdesign</a>
</footer>

<script src="//cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/3.3.1/lodash.min.js"></script>
<script src="game.js"></script>

Add meta viewport, theme color
Add meta viewport, theme color
