@import "../abstracts/variables";
@import "../abstracts/mixins";

.n-container-fluid,
.n-container {
  margin-right: auto;
  margin-left: auto;
}

.n-container-fluid {
  padding-right: 1rem;
  padding-left: 1rem;
}

.n-row {
  box-sizing: border-box;
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  margin-right: -0.5rem;
  margin-left: -0.5rem;
}

.n-row.n-reverse {
  flex-direction: row-reverse;
}

.n-col.n-reverse {
  flex-direction: column-reverse;
}

@include set-grid-cols(xs) // mobile

.n-container {
  @include breakpoint(sm) {
    width: #{$sm}rem;
  }
  @include breakpoint(md) {
    width: #{$md}rem;
  }
  @include breakpoint(lg) {
    width: #{$lg}rem;
  }
}

@include _breakpoint(sm) {
  @include set-grid-cols(sm);
}

@include _breakpoint(md) {
  @include set-grid-cols(md);
}

@include _breakpoint(lg) {
  @include set-grid-cols(lg);
}