*, :before, :after {
  box-sizing: border-box;
}

html {
  height: 100vh;
}

body {
  @include layout(column);
  flex-wrap: nowrap;
  font-size: 16px;
  line-height: 1.8rem;
  height: 100vh;
}

.section {
  flex: 0 0 auto;

  & > .container {
    margin: 0 auto;
    width: 100%;

    @include breakpoint('screen', 'xs') { max-width: 100vw; }
    @include breakpoint('screen', 's') { max-width: 100vw; }
    @include breakpoint('screen', 'm') { max-width: 95vw; }
    @include breakpoint('screen', 'l') { max-width: 90vw; }
    @include breakpoint('screen', 'xl') { max-width: rem(1400); }
    @include breakpoint('screen', 'xxl') { max-width: rem(1600); }
  }
}