{% extends 'section.html' %}

{% block styles %}
{{ super() }}
<style>
  h5 {
    margin-bottom: 2rem!important;
  }
</style>
{% endblock %}


{% block hero %}

  <div class="container-fluid hero2 d-flex flex-column justify-content-center">

    <div class="container">

        <div class="row mt-4 mb-4">

          <div class="col-12 text-center mb-lg-5">

            {% if page.extra and page.extra.logo %}
              <img src="{{ get_url(path=page.extra.logo, cachebust=true) }}" alt="logo" {% if page.extra and page.extra.logo_size %}width="{{ page.extra.logo_size }}"{% endif %}>
            {% endif %}

            {% if not page.extra.logo_only %}
              {% if page.extra and page.extra.title %}
                <h1>{{ page.extra.title }}</h1>
              {% else %}
                <h1>{{ page.title }}</h1>
              {% endif %}
            {% else %}
              <div></div>
            {% endif %}

            <img src="{{ get_url(path='images/ion@2x.png', cachebust=true) }}" width="100" align="ion">

          </div>

        </div>

    </div>

  </div>

{% endblock %}


{% block main %}

  <main class="container {% block maincss %}{% endblock %}">

    <div class="row">

      <div class="{% if page and page.extra and page.extra.layout_css %}{{ page.extra.layout_css }}{% else %}col-12{% endif %}">

        {% block main_content %}

          {% if page and page.content %}
          {{ page.content | safe }}
          {% endif %}

        {% endblock %}

      </div>

    </div>

  </main>

  {% block outside %}{% endblock %}

{% endblock %}


{% block footer_contact %}{% endblock %}