{% extends "_layout.html" %}

{%- block title -%}
Control panel
{%- endblock -%}

{%- block styles -%}
<style>
  main {
       display: grid;
       grid-template-columns: repeat(2, 1fr);
       grid-gap: 1rem;
       padding: 1rem;
       margin: auto;
       max-width: 75%;
       margin: auto;
  }

  .grid-section {
      border: 1px black solid;
      padding: 0.5rem;
      border-radius: 0.5rem;
  }
</style>
{%- endblock -%}

{%- block content -%}
<main>
  <div class='grid-section'>
    <h2>Test</h2>
  </div>

  <div class='grid-section'>
    <h2>Test</h2>
  </div>

  <div class='grid-section'>
    <h2>Test</h2>
  </div>

  <div class='grid-section'>
    <h2>Test</h2>
  </div>
</main>
{%- endblock -%}