@getbase/base/less/containers.less

A Rock Solid, Responsive CSS Framework built to work on all devices big, small and in-between.

@import "_mixins";

.container {
  max-width: (@breakpoint-xl - @grid-gutter * 2);
  padding-left: @grid-gutter;
  padding-right: @grid-gutter;
  margin-left: auto;
  margin-right: auto;
}

.breakpoint(m, {
  .container-m {
    width: (@breakpoint-m - @grid-gutter * 2);
    max-width: auto;
    padding-left: @grid-gutter;
    padding-right: @grid-gutter;
    margin-left: auto;
    margin-right: auto;
  }
});

.breakpoint(l, {
  .container-l {
    width: (@breakpoint-l - @grid-gutter * 2);
    max-width: auto;
    padding-left: @grid-gutter;
    padding-right: @grid-gutter;
    margin-left: auto;
    margin-right: auto;
  }
});

.breakpoint(xl, {
  .container-xl {
    width: (@breakpoint-xl - @grid-gutter * 2);
    max-width: auto;
    padding-left: @grid-gutter;
    padding-right: @grid-gutter;
    margin-left: auto;
    margin-right: auto;
  }
});