@charset "UTF-8";

//
// Percles
//
// A complext three column layout
//
// .layout-percles--right - Right side variant
//
// Markup: ../../../../../templates/layout/grid/three-column/percles/percles.twig
//
// Style guide: Layout.Grid.3Column.Percles
//
.layout-percles {

  > div {
    @include centered-column;
    @include responsive-grid-gap;

    @include grid-media('sm') {
      @include display-grid;
      @include grid-columns(1fr 1fr 1fr, false);
    }

    > header {
      @include grid-item-spans(2, span 2);
      -ms-grid-row: 1;
      -ms-grid-column: 2;
    }

    // IE 11 fixes.
    :nth-child(3),
    :nth-child(4),
    :nth-child(5) {
      -ms-grid-row: 2;
      -ms-grid-column: 1;
    }

    :nth-child(4) {
      -ms-grid-column: 2;
    }

    :nth-child(5) {
      -ms-grid-column: 3;
    }

  }

}
