_layout.scss

// Layout
// ==========================================================================

// Content
// ==========================================================================

// Allow an ID here, this is useful as it matches the GOV.UK template skiplink
// scss-lint:disable IdSelector
#content {
  @extend %site-width-container;
  @extend %contain-floats;
  padding-bottom: $gutter;

  @include media(desktop) {
    padding-bottom: $gutter * 3;
  }

  // DEPRECATED: Tabindex on #content
  // https://github.com/alphagov/govuk_elements/pull/534
  // We no longer recommend using tabindex on #content
  outline: none;
}


// Grid layout
// ==========================================================================

// Usage:
// For two equal columns

// <div class="grid-row">
//   <div class="column-one-half">
//
//   </div>
//   <div class="column-one-half">
//
//   </div>
// </div>

// Use .grid-row to define a row for grid columns to sit in
.grid-row {
  @extend %grid-row;
}

// Use .grid-column to create a grid column with 15px gutter
// By default grid columns break to become full width at tablet size
.column-quarter,
.column-one-quarter {
  @include grid-column(1 / 4);
}

.column-half,
.column-one-half {
  @include grid-column(1 / 2);
}

.column-third,
.column-one-third {
  @include grid-column(1 / 3);
}

.column-two-thirds {
  @include grid-column(2 / 3);
}

.column-full {
  @include grid-column(1);
}