<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>{{block title}}{{end}}</title>
    {{block meta}}
    <meta name="description" content="">
    <meta name="author" content="">
    {{end}}
    {{block use_bootstrap}}
        {{use "bootstrap"}}
    {{end}}
    <!-- toplinks -->
    <!-- bottomlinks -->
    <style type="text/css">
      /* Override some defaults */
      html, body {
        background-color: #eee;
      }
      body {
        padding-top: 40px; /* 40px to make the container go all the way to the bottom of the topbar */
      }
      .container > footer p {
        text-align: center; /* center align it with the container */
      }
      .container {
        width: 820px; /* downsize our container to make the content feel a bit tighter and more cohesive. NOTE: this removes two full columns from the grid, meaning you only go to 14 columns and not 16. */
      }
    
      /* The white background content wrapper */
      .content {
        background-color: #fff;
        padding: 20px;
        margin: 0 -20px; /* negative indent the amount of the padding to maintain the grid system */
        -webkit-border-radius: 0 0 6px 6px;
           -moz-border-radius: 0 0 6px 6px;
                border-radius: 0 0 6px 6px;
        -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
           -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
                box-shadow: 0 1px 2px rgba(0,0,0,.15);
      }
    
      /* Page header tweaks */
      .page-header {
        background-color: #f5f5f5;
        padding: 20px 20px 10px;
        margin: -20px -20px 20px;
      }
    
      .topbar .btn {
        border: 0;
      }
    
    </style>
    {{block _css}}{{end}}
  </head>

  <body>
    {{block header}}
    <div class="topbar">
      <div class="topbar-inner">
        <div class="container-fluid">
          <a class="brand" href="#">{{block project}}Project name{{end}}</a>
          {{block nav}}
          <ul class="nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>
          </ul>
          {{end nav}}
          {{block user_info}}<p class="pull-right">Logged in as <a href="#">username</a></p>{{end user_info}}
        </div>
      </div>
    </div>
    {{end header}}

    <div class="container">
      {{block content}}
      <div class="content">
        {{block page_header_container}}
        <div class="page-header">
          {{block page_header}}
          <h1>Page name <small>Supporting text or tagline</small></h1>
          {{end}}
        </div>
        {{end}}
        {{block content_main_container}}
        <div class="row">
          {{block content_main}}
          <div class="span10">
            <h2>Main content</h2>
          </div>
          <div class="span4">
            <h3>Secondary content</h3>
          </div>
          {{end}}
        </div>
        {{end}}
      </div>
      {{end content}}
    
      {{block footer_container}}
      <footer>
        {{block footer}}
        <p>&copy; Company 2011</p>
        {{end}}
      </footer>
      {{end}}
    
    </div> <!-- /container -->
  </body>
</html>
