/*==========================================================================
 * Contains
 * ========================================================================== */


.l-contain {
  @include contain();
}

.l-contain--small {
  max-width: 800px;
}

.l-contain--wide {
  max-width: 1430px;
}

/**
 * Contain classes used when only
 */

.l-contain\@s {
  @include contain(s);
}

.l-contain\@m {
  @include contain(m);
}

.l-contain\@l {
  @include contain(l);
}


/**
 * Contain classes used when nested inside an 'l-contain@x' class
 * To get the content on the grid when nested inside a contain class
 */


.l-contain\^s {
  @include contain($max:s);
}

.l-contain\^m {
  @include contain($max:m);
}

.l-contain\^l {
  @include contain($max:l);
}