@charset "UTF-8";

//
// Plakes
//
// A two column centered 25/75 template with header
//
// .layout-plakes--right - Right sidebar variant.
//
// Markup: ../../../../../templates/layout/grid/two-column/plakes/plakes.twig
//
// Style guide: Layout.Grid.2Column.Plakes
//
$_layout-plakes-columns: (
  $su-breakpoint-xs: 1fr,
  $su-breakpoint-sm: 1fr 1fr 1fr,
  $su-breakpoint-md: 1fr 1fr 1fr,
  $su-breakpoint-lg: 1fr 1fr 1fr 1fr,
  $su-breakpoint-xl: 1fr 1fr 1fr 1fr,
  $su-breakpoint-2xl: 1fr 1fr 1fr 1fr
);

.layout-plakes {

  > div,
  > header,
  > footer {
    @include centered-column;
  }

  > div {
    @include responsive-grid-columns($_layout-plakes-columns);

    aside {
      @include grid-media('sm') {
        @include grid-item-spans(1, span 1);
      }
    }

    section {
      @include grid-media('sm') {
        @include grid-item-spans(2, span 3, 1, span 1);
      }
    }

  }

}
