<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">

  <title>{% block title %}{% trans %}Internet-in-a-Box{% endtrans %}{% endblock %}</title>

  <!--link rel="stylesheet" href="{{ static('lib/jquery.mobile-1.3.0/jquery.mobile-1.3.0.min.css') }}" -->
  <link rel="stylesheet" href="{{ static('lib/jquery.mobile-1.2.1.min.css') }}">
  <link rel="stylesheet" href="{{ static('iiab.css') }}">
  <script src="{{ static('lib/jquery-1.9.0.min.js') }}"></script>
  <script src="{{ static('lib/jquery-migrate-1.0.0.js') }}"></script>
  <!--script src="{{ static('lib/jquery.mobile-1.3.0/jquery.mobile-1.3.0.min.js') }}"></script> -->
  <script src="{{ static('lib/jquery.mobile-1.2.1.min.js') }}"></script>
  <!-- script src="{{ static('js/iiab.js') }}"></script -->

  <!-- Set the maximum width for desktop users -->
  <style type='text/css'>
      <!--
      html { background-color: #f3f3f3; }
      @media only screen and (min-width: 900px){
          .ui-page {
              width: 900px !important;
              margin: 0 auto !important;
              position: relative !important;
              border-right: 5px #666 outset !important;
              border-left: 5px #666 outset !important;
          }
      }
      -->
  </style>
  
  {% block head %}
  {% endblock %}

</head>
<body>

{% block content %}
{% endblock %}

</body>
</html>
