<?php require 'inc/_global/config.php'; ?>
<?php require 'inc/backend/config.php'; ?>
<?php require 'inc/_global/views/head_start.php'; ?>
<?php require 'inc/_global/views/head_end.php'; ?>
<?php require 'inc/_global/views/page_start.php'; ?>

<!-- Hero -->
<div class="bg-body-light">
  <div class="content content-full">
    <div class="d-flex flex-column flex-sm-row justify-content-sm-between align-items-sm-center py-2">
      <div class="flex-grow-1">
        <h1 class="h3 fw-bold mb-2">
          Grid
        </h1>
        <h2 class="fs-base lh-base fw-medium text-muted mb-0">
          Smart and super flexible for building awesome interfaces.
        </h2>
      </div>
      <nav class="flex-shrink-0 mt-3 mt-sm-0 ms-sm-3" aria-label="breadcrumb">
        <ol class="breadcrumb breadcrumb-alt">
          <li class="breadcrumb-item">
            <a class="link-fx" href="javascript:void(0)">Elements</a>
          </li>
          <li class="breadcrumb-item" aria-current="page">
            Grid
          </li>
        </ol>
      </nav>
    </div>
  </div>
</div>
<!-- END Hero -->

<!-- Page Content -->
<div class="content">
  <!-- Grid -->
  <h2 class="content-heading">Grid <small>Columns never collapse</small></h2>
  <div class="row text-center">
    <div class="col-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-3</code></p>
        </div>
      </div>
    </div>
  </div>
  <!-- END Grid -->

  <!-- sm Grid -->
  <h2 class="content-heading">sm Grid <small>Columns collapse at 576px</small></h2>
  <div class="row text-center">
    <div class="col-sm-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-sm-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-sm-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-sm-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-sm-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-sm-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-sm-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-sm-3</code></p>
        </div>
      </div>
    </div>
  </div>
  <!-- END sm Grid -->

  <!-- md Grid -->
  <h2 class="content-heading">md Grid <small>Columns collapse at 768px</small></h2>
  <div class="row text-center">
    <div class="col-md-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-md-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-md-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-md-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-3</code></p>
        </div>
      </div>
    </div>
  </div>
  <!-- END md Grid -->

  <!-- lg Grid -->
  <h2 class="content-heading">lg Grid <small>Columns collapse at 992px</small></h2>
  <div class="row text-center">
    <div class="col-lg-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-lg-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-lg-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-lg-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-lg-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-lg-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-lg-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-lg-3</code></p>
        </div>
      </div>
    </div>
  </div>
  <!-- END lg Grid -->

  <!-- xlg Grid -->
  <h2 class="content-heading">xl Grid <small>Columns collapse at 1200px</small></h2>
  <div class="row text-center">
    <div class="col-xl-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-xl-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-xl-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-xl-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-xl-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-xl-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-xl-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-xl-3</code></p>
        </div>
      </div>
    </div>
  </div>
  <!-- END xlg Grid -->

  <!-- xxlg Grid -->
  <h2 class="content-heading">xxl Grid <small>Columns collapse at 1400px</small></h2>
  <div class="row text-center">
    <div class="col-xxl-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-xxl-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-xxl-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-xxl-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-xxl-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-xxl-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-xxl-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-xxl-3</code></p>
        </div>
      </div>
    </div>
  </div>
  <!-- END xxlg Grid -->

  <!-- Mixed Grid -->
  <h2 class="content-heading">Mixed Grid <small>For complex layouts</small></h2>
  <div class="row text-center">
    <div class="col-sm-6 col-lg-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-6</code> <code>col-xl-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-sm-6 col-lg-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-6</code> <code>col-xl-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-sm-6 col-lg-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-6</code> <code>col-xl-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-sm-6 col-lg-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-6</code> <code>col-xl-3</code></p>
        </div>
      </div>
    </div>
  </div>
  <!-- END Mixed Grid -->

  <!-- Complex Grid -->
  <h2 class="content-heading">Grid with Offsets <small>For complex layouts</small></h2>
  <div class="row text-center">
    <div class="col-md-4 offset-md-1">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-4 offset-md-1</code></p>
        </div>
      </div>
    </div>
    <div class="col-md-4 offset-md-2">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-4 offset-md-1</code></p>
        </div>
      </div>
    </div>
  </div>
  <div class="row text-center">
    <div class="col-md-4 offset-md-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-4 offset-md-3</code></p>
        </div>
      </div>
    </div>
  </div>
  <div class="row text-center">
    <div class="col-md-4 offset-md-6">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-4 offset-md-6</code></p>
        </div>
      </div>
    </div>
  </div>
  <div class="row text-center">
    <div class="col-md-6 offset-md-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-5 offset-md-3</code></p>
        </div>
      </div>
    </div>
  </div>
  <div class="row text-center">
    <div class="col-md-3 offset-md-1">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-3 offset-md-8</code></p>
        </div>
      </div>
    </div>
    <div class="col-md-3 offset-md-4">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-3 offset-md-4</code></p>
        </div>
      </div>
    </div>
  </div>
  <div class="row text-center">
    <div class="col-md-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-3</code></p>
        </div>
      </div>
    </div>
    <div class="col-md-3 ms-auto">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-3</code> <code>ms-auto</code></p>
        </div>
      </div>
    </div>
  </div>
  <div class="row text-center">
    <div class="col-lg-4 ms-auto">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-lg-4</code> <code>ms-auto</code></p>
        </div>
      </div>
    </div>
    <div class="col-lg-4 me-auto">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-lg-4</code> <code>me-auto</code></p>
        </div>
      </div>
    </div>
  </div>
  <div class="row justify-content-center text-center">
    <div class="col-md-6">
      <div class="block block-rounded">
        <div class="block-content">
          <p><code>col-md-6</code> and <code>justify-content-center</code> in <code>row</code></p>
        </div>
      </div>
    </div>
  </div>
  <!-- END Complex Grids -->

  <!-- Small Grid Gutters -->
  <h2 class="content-heading">Small Grid Gutters <small>Useful for tiles/widgets</small></h2>
  <div class="row g-sm">
    <div class="col-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
    </div>
    <div class="col-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
    </div>
    <div class="col-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
    </div>
    <div class="col-3">
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block block-rounded">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
    </div>
  </div>
  <!-- END Small Grid Gutters -->

  <!-- Flat Grid -->
  <h2 class="content-heading">Flat Grid <small>No gutters</small></h2>
  <div class="row g-0">
    <div class="col-3">
      <div class="block mb-0 bg-body-dark">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block mb-0">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block mb-0 bg-body-dark">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
    </div>
    <div class="col-3">
      <div class="block mb-0">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block mb-0 bg-body-dark">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block mb-0">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
    </div>
    <div class="col-3">
      <div class="block mb-0 bg-body-dark">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block mb-0">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block mb-0 bg-body-dark">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
    </div>
    <div class="col-3">
      <div class="block mb-0">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block mb-0 bg-body-dark">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
      <div class="block mb-0">
        <div class="block-content">
          <p>...</p>
        </div>
      </div>
    </div>
  </div>
  <!-- END Flat Grid -->

  <!-- Blocks in Grid -->
  <h2 class="content-heading">Blocks in Grid</h2>
  <div class="row">
    <div class="col-md-6 col-xl-4">
      <div class="block block-rounded">
        <div class="block-header block-header-default">
          <h3 class="block-title">Block</h3>
          <div class="block-options">
            <button type="button" class="btn-block-option">
              <i class="si si-settings"></i>
            </button>
          </div>
        </div>
        <div class="block-content">
          <p>Block’s content..</p>
        </div>
      </div>
    </div>
    <div class="col-md-6 col-xl-4">
      <div class="block block-rounded">
        <div class="block-header block-header-default">
          <h3 class="block-title">Block</h3>
          <div class="block-options">
            <button type="button" class="btn-block-option">
              <i class="si si-settings"></i>
            </button>
          </div>
        </div>
        <div class="block-content">
          <p>Block’s content..</p>
        </div>
      </div>
    </div>
    <div class="col-md-6 col-xl-4">
      <div class="block block-rounded">
        <div class="block-header block-header-default">
          <h3 class="block-title">Block</h3>
          <div class="block-options">
            <button type="button" class="btn-block-option">
              <i class="si si-settings"></i>
            </button>
          </div>
        </div>
        <div class="block-content">
          <p>Block’s content..</p>
        </div>
      </div>
    </div>
    <div class="col-md-6 col-xl-4">
      <div class="block block-rounded">
        <div class="block-header block-header-default">
          <h3 class="block-title">Block</h3>
          <div class="block-options">
            <button type="button" class="btn-block-option">
              <i class="si si-settings"></i>
            </button>
          </div>
        </div>
        <div class="block-content">
          <p>Block’s content..</p>
        </div>
      </div>
    </div>
    <div class="col-md-6 col-xl-4">
      <div class="block block-rounded">
        <div class="block-header block-header-default">
          <h3 class="block-title">Block</h3>
          <div class="block-options">
            <button type="button" class="btn-block-option">
              <i class="si si-settings"></i>
            </button>
          </div>
        </div>
        <div class="block-content">
          <p>Block’s content..</p>
        </div>
      </div>
    </div>
    <div class="col-md-6 col-xl-4">
      <div class="block block-rounded">
        <div class="block-header block-header-default">
          <h3 class="block-title">Block</h3>
          <div class="block-options">
            <button type="button" class="btn-block-option">
              <i class="si si-settings"></i>
            </button>
          </div>
        </div>
        <div class="block-content">
          <p>Block’s content..</p>
        </div>
      </div>
    </div>
  </div>
  <!-- END Blocks in Grid -->

  <!-- Equal Blocks in Grid -->
  <h2 class="content-heading">Equal Blocks in Grid</h2>
  <div class="row items-push">
    <div class="col-sm-4">
      <div class="block block-rounded h-100 mb-0">
        <div class="block-header block-header-default">
          <h3 class="block-title">Block</h3>
          <div class="block-options">
            <button type="button" class="btn-block-option">
              <i class="si si-settings"></i>
            </button>
          </div>
        </div>
        <div class="block-content">
          <?php $one->get_text('small'); ?>
        </div>
      </div>
    </div>
    <div class="col-sm-4">
      <div class="block block-rounded h-100 mb-0">
        <div class="block-header block-header-default">
          <h3 class="block-title">Block</h3>
          <div class="block-options">
            <button type="button" class="btn-block-option">
              <i class="si si-settings"></i>
            </button>
          </div>
        </div>
        <div class="block-content">
          <?php $one->get_text('medium'); ?>
        </div>
      </div>
    </div>
    <div class="col-sm-4">
      <div class="block block-rounded h-100 mb-0">
        <div class="block-header block-header-default">
          <h3 class="block-title">Block</h3>
          <div class="block-options">
            <button type="button" class="btn-block-option">
              <i class="si si-settings"></i>
            </button>
          </div>
        </div>
        <div class="block-content">
          <?php $one->get_text('small'); ?>
        </div>
      </div>
    </div>
  </div>
  <!-- END Equal Blocks in Grid -->

  <!-- Paragraphs in Grid -->
  <h2 class="content-heading">Paragraphs in Grid</h2>
  <div class="block block-rounded">
    <div class="block-header block-header-default">
      <h3 class="block-title">Example</h3>
    </div>
    <div class="block-content">
      <div class="row items-push">
        <div class="col-md-6">
          <h3>Flexible Grid</h3>
          <?php $one->get_text(); ?>
        </div>
        <div class="col-md-6">
          <h3>Many Options</h3>
          <?php $one->get_text(); ?>
        </div>
      </div>
      <div class="row items-push">
        <div class="col-md-4">
          <h3 class="">For all screen sizes</h3>
          <?php $one->get_text(); ?>
        </div>
        <div class="col-md-4">
          <h3>Easy to use</h3>
          <?php $one->get_text(); ?>
        </div>
        <div class="col-md-4">
          <h3>Bootstrap Grid</h3>
          <?php $one->get_text(); ?>
        </div>
      </div>
      <div class="row items-push">
        <div class="col-md-4">
          <h3>12 Columns</h3>
          <?php $one->get_text(); ?>
        </div>
        <div class="col-md-8">
          <h3>Multiple Layouts</h3>
          <?php $one->get_text('large'); ?>
        </div>
      </div>
      <div class="row items-push">
        <div class="col-md-8">
          <h3>Mobile, Tablets and Desktop</h3>
          <?php $one->get_text('large'); ?>
        </div>
        <div class="col-md-4">
          <h3>Mixed Grid</h3>
          <?php $one->get_text(); ?>
        </div>
      </div>
    </div>
  </div>
  <!-- END Paragraphs in Grid -->

  <!-- Responsive Utility Classes -->
  <div id="grid-rutil" class="block block-rounded">
    <div class="block-header block-header-default">
      <h3 class="block-title">Responsive Utility Classes</h3>
    </div>
    <div class="block-content block-content-full">
      <p>For faster mobile-friendly development, use these utility classes for showing and hiding content by device via media query.</p>
      <div class="table-responsive">
        <table class="table table-bordered table-hover text-center mb-0">
          <thead>
            <tr>
              <th style="min-width: 100px;"></th>
              <th class="text-center">
                xs<br>
                <small class="fw-normal text-muted">&lt; 576px</small>
              </th>
              <th class="text-center">
                sm<br>
                <small class="fw-normal text-muted">&ge; 576px</small>
              </th>
              <th class="text-center">
                md<br>
                <small class="fw-normal text-muted">&ge; 768px</small>
              </th>
              <th class="text-center">
                lg<br>
                <small class="fw-normal text-muted">&ge; 992px</small>
              </th>
              <th class="text-center">
                xl<br>
                <small class="fw-normal text-muted">&ge; 1200px</small>
              </th>
              <th class="text-center">
                xxl<br>
                <small class="fw-normal text-muted">&ge; 1400px</small>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>
                <code>.d-none</code> <code>.d-sm-*</code>
              </td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
            </tr>
            <tr>
              <td><code>.d-none</code> <code>.d-md-*</code></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
            </tr>
            <tr>
              <td><code>.d-none</code> <code>.d-lg-*</code></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
            </tr>
            <tr>
              <td><code>.d-none</code> <code>.d-xl-*</code></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
            </tr>
            <tr>
              <td><code>.d-none</code> <code>.d-xxl-*</code></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-check text-success"></i></td>
            </tr>
          </tbody>
          <tbody>
            <tr>
              <td><code>.d-none</code></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
            </tr>
          </tbody>
          <tbody>
            <tr>
              <td><code>.d-sm-none</code></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
            </tr>
            <tr>
              <td><code>.d-md-none</code></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
            </tr>
            <tr>
              <td><code>.d-lg-none</code></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
            </tr>
            <tr>
              <td><code>.d-xl-none</code></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-close text-danger"></i></td>
              <td><i class="si si-close text-danger"></i></td>
            </tr>
            <tr>
              <td><code>.d-xxl-none</code></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-check text-success"></i></td>
              <td><i class="si si-close text-danger"></i></td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
  <!-- END Responsive Utility Classes -->
</div>
<!-- END Page Content -->

<?php require 'inc/_global/views/page_end.php'; ?>
<?php require 'inc/_global/views/footer_start.php'; ?>
<?php require 'inc/_global/views/footer_end.php'; ?>
