@charset "UTF-8";

//
// Molive
//
// A four column collapsible layout with a centered header and footer.
//
// Markup: ../../../../../templates/layout/grid/four-column/molive/molive.twig
//
// Style guide: Layout.Grid.4Column.Molive
//
.layout-molive {

  // A centered column that spans the max-width of the breakpoint.
  > header {
    @include centered-column;
  }

  // A centered column broken in to four equal parts.
  // Collapses to 2 columns by 2 columns at the su-breakpoint-md
  // Collapses to 1 column at mobile screens.
  > section {
    @include centered-column;
    @include responsive-grid-columns($su-responsive-columns-four);
  }

  // A centered column that spans the max-width of the breakpoint.
  > footer {
    @include centered-column;
  }
}
