<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>{% block title %}{% endblock %}</title>
    <meta name="description" content="">
    <meta name="author" content="Fulfil.IO Inc.">

    {% block stylesheets %}
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="{{ 'report_html_purchase/reports/bootstrap/css/bootstrap.min.css'|modulepath }}">
    <link rel="stylesheet" href="{{ 'report_html_purchase/reports/font-awesome/css/font-awesome.min.css'|modulepath }}">
    {% endblock stylesheets %}

    {% block custom_style %}
    <style type="text/css">
      .page-break {
        padding-top: 10px;
        page-break-before: always;
      }
      hr {
        border-top: 1px solid #000;
      }
      .h4{
        font-size: 12px;
      }
      .h3 {
        font-size: 16px;
      }
      .h2 {
        font-size: 20px;
      }
      body {
        font-family: 'Lora', serif;
        font-size: 10px;
      }
      .b-right {
        border-right: 1px solid #ddd;
        width: 50%;
      }
      .b-right-hidden {
        width: 50%;
      }
      .b-hide {
        border: hidden;
      }
      tbody tr {
        page-break-inside: avoid;
      }
      table.no-border td {
        border: 0px !important;
      }
    </style>
    {% endblock custom_style %}

  </head>
  <body>
    {% block body %}
    {% for record in records %}
      {# loop will not be available in the context of scoped block #}
      {% set first = loop.first %}

      {% block main scoped %}
      <div class="container-fluid {% if not first %}page-break{% endif %}">
        <div class="row">
          <div class="col-xs-6">
            {% block company_header scoped %}
            {% include header %}
            {% endblock company_header %}
          </div>
          <div class="col-xs-6">
            {% block report_header scoped %}
            {% endblock report_header %}
          </div>
        </div>
        <div class="row">
          <div class="col-xs-12">
          {% block report_body scoped %}
          {% endblock report_body %}
          </div>
        </div>
      </div>
      {% endblock main %}
    {% endfor %}
    {% endblock body %}
  </body>
</html>
