{% extends 'playground/base.html' %}

{% block main %}
  <div class="jumbotron jumbotron-fluid bg-primary text-white pb-xxl mb-4" >
    <div class="container">
      <div class="row justify-content-center">
        <div class="col-md-6">
          <h1 class="display-4">{% block modal_title %}{% endblock %}</h1>
          <p class="lead text-justify">{% block modal_text %}{% endblock %}</p>
        </div>
      </div>
    </div>
  </div>

  <div class="container mt--xxl">
    <div class="row justify-content-center">
      <div class="col-md-5">
        <div class="card">
          <div class="card-body">
            {% block modal_content %}{% endblock %}
          </div>
        </div>
      </div>
    </div>
  </div>
{% endblock main %}