{#
/**
 * @file
 * Molive - Template for a 4 column panel layout.
 *
 * This template provides a four column panel display layout, with
 * each column roughly equal in width.
 *
 * Variables:
 * attributes - html attributes for the template wrapper tag
 * modifier_class - Variant modifier css classes
 * header - A four column span header area
 * first - First of four columns
 * second - Second of four columns
 * third - Third of four columns
 * fourth - Fourth of four columns
 * footer - A four column span footer area
 */
#}
<div{{ attributes }} class="layout layout-molive {{ modifier_class }}">

    {# A centered max-width header region #}
    {% if header is not empty %}
    <header>
      <div {{ region_attributes.header }}>
      {{ header }}
      </div>
    </header>
    {% endif %}

    {# Because of the responsive behaviour each column is required. #}
    <section>
      <div {{ region_attributes.first }}>
        {{ first }}
      </div>

      <div {{ region_attributes.second }}>
        {{ second }}
      </div>

      <div {{ region_attributes.third }}>
        {{ third }}
      </div>

      <div {{ region_attributes.fourth }}>
        {{ fourth }}
      </div>
    </section>

    {# Centered max-width footer region #}
    {% if footer is not empty %}
    <footer>
      <div {{ region_attributes.footer }}>
      {{ footer }}
      </div>
    </footer>
    {% endif %}
  </div>
