<!doctype html>
<!-- https://github.com/paulirish/html5-boilerplate/blob/master/index.html -->
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
<head>
  {% block starthead %}{% endblock starthead %}
  <meta charset="{{ resource.meta.charset }}">

  <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
       Remove this if you use the .htaccess -->
  <meta http-equiv="X-UA-Compatible" content="{{ resource.meta.compatibility }}">

  <!-- encoding must be specified within the first 512 bytes
        www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#charset -->

  <!-- meta element for compatibility mode needs to be before
        all elements except title & meta
        msdn.microsoft.com/en-us/library/cc288325(VS.85).aspx -->
  <!-- Chrome Frame is only invoked if meta element for
        compatibility mode is within the first 1K bytes
        code.google.com/p/chromium/issues/detail?id=23003 -->

  <title>{% block title %}{{ resource.meta.title }}{% endblock %}</title>
  <meta name="description" content="{{ resource.meta.description }}">
  <meta name="author" content="{{ resource.meta.author }}">

  <!--  Mobile viewport optimized: j.mp/bplateviewport -->
  <meta name="viewport" content="{{ resource.meta.viewport }}">

  {% block favicons %}
  <!-- Place favicon.ico & apple-touch-icon.png
        in the root of your domain and delete these references -->
  <link rel="shortcut icon" href="{{ media_url('/images/favicon.ico') }}">
  <link rel="apple-touch-icon" href="{{ media_url('/images/apple-touch-icon.png') }}">
  {% endblock favicons %}

  {% block css %}
  <link rel="stylesheet" href="{{ media_url('css/site.css') }}">
  <link rel="stylesheet" href="{{ media_url('css/syntax.css') }}">
  {% endblock css %}

  {% block headjs %}
  <!-- All JavaScript at the bottom, except for Modernizr which
        enables HTML5 elements & feature detects -->
    <script src="{{ media_url('js/libs/modernizr-1.7.min.js') }}"></script>
  {% endblock headjs %}
  {% block endhead %}{% endblock endhead %}
</head>
<body id="{{ resource.meta.id if resource.meta.id else resource.slug }}">
  {% block content %}
  <div id="container">
      {% block container %}
      <div id="main" role="main">
          <header class="banner clearfix">
          {% block header -%}
            <h1>BASIC</h1>
            <h3>A hyde website</h3>
          {%- endblock %}
          {% block nav %}
          {% from "macros.j2" import render_nav with context %}
          {{ render_nav(menu, 'main_nav') }}
          {% endblock %}
          </header>
          <section class="content">
          {% block main %}
          {% endblock main %}
          </section>
      </div>
    {% endblock container %}
  </div> <!--! end of #container -->
  <footer>
      Powered by <a href="http://ringce.com/hyde">hyde</a>.
  </footer>
  {% endblock content%}
  {% block js %}
  <!-- Javascript at the bottom for fast page loading -->
  {% block jquery %}
  <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
  <script>window.jQuery || document.write('<script src="js/libs/jquery-1.5.1.min.js">\x3C/script>')</script>
  {% endblock jquery %}

  {% block scripts %}
  {% endblock scripts %}


  <!--[if lt IE 7 ]>
    <script src="js/libs/dd_belatedpng.js"></script>
    <script>DD_belatedPNG.fix('img, .png_bg'); // Fix any <img> or .png_bg bg-images. Also, please read goo.gl/mZiyb </script>
  <![endif]-->

  {% block analytics %}
  {% include "analytics.j2" %}
  {% endblock analytics %}

  {% endblock js %}
</body>
</html>
