<!DOCTYPE html>
<html lang="en">
  <head>
    <title>{% block title %}{{ title }}{% endblock %}</title>
    {% block head %}{% endblock %}
    <!-- Require only loaded in standalone file. -->
    <script src="{{require_js}}"></script>

    <link rel="shortcut icon" href="{{favicon}}" />

    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, height=device-height,
	  initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui"/>
  </head>
  <body>
    {% block content %}{% endblock %}

    <script>
     // temporary fixes for mobile browsers (currently iOS)
     if (navigator.userAgent.match(/.*OS 7_\d/i)) {
       $(".fill-screen-div").css('height', window.innerHeight +"px");
       $(window).resize(function(){
	 $(".fill-screen-div").css('height', window.innerHeight +"px");
	 document.body.scrollTop = 0;
       })
     }
    </script>
  </body>
</html>
