{#
/**
 * @file
 * Template for a complex column panel layout.
 *
 * This template provides a complex column panel display layout, with
 * each column roughly equal in width.
 *
 * Variables:
 * - $id: An optional CSS id to use for the layout.
 * - $content: An array of content, each item in the array is keyed to one
 *   panel of the layout. This layout supports the following sections:
 *   - $content['first']: Content in the left column.
 *   - $content['second']: Content in the right column.
 */
#}
<div{{ attributes }} class="layout {{ modifier_class }}">
  <div class="flex-container flex-container--row-gap centered-container">
    <div class="flex-md-6-of-12">
      {{ first }}
    </div>

    <div class="flex-md-6-of-12">
      {{ second }}
    </div>

    <div class="flex-md-4-of-12">
      {{ third }}
    </div>

    <div class="flex-md-4-of-12">
      {{ fourth }}
    </div>

    <div class="flex-md-4-of-12">
      {{ fifth }}
    </div>
  </div>
