Container X-Axis

.l-containerxaxis {
  padding-left: $gridspacing * 2;
  padding-right: $gridspacing * 2;

  @media (min-width: $media-tablet) {
    padding-left: $gridspacing * 5;
    padding-right: $gridspacing * 5;
  }

  @media (min-width: $media-desktop) {
    padding-left: $container-maxpadding;
    padding-right: $container-maxpadding;
  }

  @media (min-width: #{$container-maxwidthbreakpoint}) {
    padding-left: calc(50vw - #{$container-maxwidth / 2});
    padding-right: calc(50vw - #{$container-maxwidth / 2});
  }

}