@use '../breakpoints';
@use '../functions';

.sl-l-container {
  margin: {
    right: auto;
    left: auto;
  }
  padding: {
    right: functions.sl-px-to-rem(16px);
    left: functions.sl-px-to-rem(16px);
  }

  max-width: functions.sl-px-to-rem(1920px);

  @include breakpoints.sl-breakpoint--small {
    padding: {
      right: functions.sl-px-to-rem(32px);
      left: functions.sl-px-to-rem(32px);
    }
  }

  &--small {
    max-width: functions.sl-px-to-rem(960px);
  }

  .sl-l-container {
    padding: 0;
  }
}