/* LQ Scroll Column — responsive spacing, wrapper and inner wrapper settings. */

/* Wrapper horizontal align — desktop/base */
.lq-scroll-column--wrapper-align-left {
  align-self: start;
  margin-left: 0;
  margin-right: auto;
}

.lq-scroll-column--wrapper-align-center {
  align-self: center;
  margin-left: auto;
  margin-right: auto;
}

.lq-scroll-column--wrapper-align-right {
  align-self: end;
  margin-left: auto;
  margin-right: 0;
}

.lq-scroll-column--wrapper-align-stretch {
  align-self: stretch;
  width: 100%;
  max-width: 100%;
}

/* Inner horizontal align — desktop/base */
.lq-scroll-column--inner-align-left .lq-scroll-column__inner {
  margin-left: 0;
  margin-right: auto;
}

.lq-scroll-column--inner-align-center .lq-scroll-column__inner {
  margin-left: auto;
  margin-right: auto;
}

.lq-scroll-column--inner-align-right .lq-scroll-column__inner {
  margin-left: auto;
  margin-right: 0;
}

.lq-scroll-column--inner-align-stretch .lq-scroll-column__inner {
  width: 100%;
  max-width: none;
}

@media (min-width: 768px) and (max-width: 991px) {
  .lq-scroll-column {
    width: var(
      --lq-scroll-column-tablet-wrapper-width,
      var(--lq-scroll-column-wrapper-width, auto)
    );
    max-width: var(
      --lq-scroll-column-tablet-wrapper-max-width,
      var(--lq-scroll-column-wrapper-max-width, 100%)
    );
    min-width: var(
      --lq-scroll-column-tablet-wrapper-min-width,
      var(--lq-scroll-column-wrapper-min-width, 0)
    );
    top: var(
      --lq-scroll-column-tablet-offset-top,
      var(--lq-scroll-column-offset-top, auto)
    );
    right: var(
      --lq-scroll-column-tablet-offset-right,
      var(--lq-scroll-column-offset-right, auto)
    );
    bottom: var(
      --lq-scroll-column-tablet-offset-bottom,
      var(--lq-scroll-column-offset-bottom, auto)
    );
    left: var(
      --lq-scroll-column-tablet-offset-left,
      var(--lq-scroll-column-offset-left, auto)
    );
    margin-top: var(
      --lq-scroll-column-tablet-wrapper-margin-top,
      var(--lq-scroll-column-wrapper-margin-top, 0)
    );
    margin-right: var(
      --lq-scroll-column-tablet-wrapper-margin-right,
      var(--lq-scroll-column-wrapper-margin-right, 0)
    );
    margin-bottom: var(
      --lq-scroll-column-tablet-wrapper-margin-bottom,
      var(--lq-scroll-column-wrapper-margin-bottom, 0)
    );
    margin-left: var(
      --lq-scroll-column-tablet-wrapper-margin-left,
      var(--lq-scroll-column-wrapper-margin-left, 0)
    );
    padding-top: var(
      --lq-scroll-column-tablet-wrapper-padding-top,
      var(
        --lq-scroll-column-wrapper-padding-top,
        var(--lq-scroll-column-tablet-pt, var(--lq-scroll-column-pt, 0))
      )
    );
    padding-right: var(
      --lq-scroll-column-tablet-wrapper-padding-right,
      var(
        --lq-scroll-column-wrapper-padding-right,
        var(--lq-scroll-column-tablet-pr, var(--lq-scroll-column-pr, 0))
      )
    );
    padding-bottom: var(
      --lq-scroll-column-tablet-wrapper-padding-bottom,
      var(
        --lq-scroll-column-wrapper-padding-bottom,
        var(--lq-scroll-column-tablet-pb, var(--lq-scroll-column-pb, 0))
      )
    );
    padding-left: var(
      --lq-scroll-column-tablet-wrapper-padding-left,
      var(
        --lq-scroll-column-wrapper-padding-left,
        var(--lq-scroll-column-tablet-pl, var(--lq-scroll-column-pl, 0))
      )
    );
    overflow: var(
      --lq-scroll-column-tablet-wrapper-overflow,
      var(--lq-scroll-column-wrapper-overflow, visible)
    );
  }

  .lq-scroll-column--has-tablet-wrapper-z-index {
    z-index: var(
      --lq-scroll-column-tablet-wrapper-z-index,
      var(--lq-scroll-column-wrapper-z-index, var(--lq-scroll-column-z-index))
    );
  }

  .lq-scroll-column__inner {
    width: var(
      --lq-scroll-column-tablet-inner-width,
      var(--lq-scroll-column-inner-width, 100%)
    );
    max-width: var(
      --lq-scroll-column-tablet-inner-max-width,
      var(--lq-scroll-column-inner-max-width, 100%)
    );
    min-width: var(
      --lq-scroll-column-tablet-inner-min-width,
      var(--lq-scroll-column-inner-min-width, 0)
    );
    margin-top: var(
      --lq-scroll-column-tablet-inner-margin-top,
      var(--lq-scroll-column-inner-margin-top, 0)
    );
    margin-right: var(
      --lq-scroll-column-tablet-inner-margin-right,
      var(--lq-scroll-column-inner-margin-right, 0)
    );
    margin-bottom: var(
      --lq-scroll-column-tablet-inner-margin-bottom,
      var(--lq-scroll-column-inner-margin-bottom, 0)
    );
    margin-left: var(
      --lq-scroll-column-tablet-inner-margin-left,
      var(--lq-scroll-column-inner-margin-left, 0)
    );
    padding-top: var(
      --lq-scroll-column-tablet-inner-padding-top,
      var(--lq-scroll-column-inner-padding-top, 0)
    );
    padding-right: var(
      --lq-scroll-column-tablet-inner-padding-right,
      var(--lq-scroll-column-inner-padding-right, 0)
    );
    padding-bottom: var(
      --lq-scroll-column-tablet-inner-padding-bottom,
      var(--lq-scroll-column-inner-padding-bottom, 0)
    );
    padding-left: var(
      --lq-scroll-column-tablet-inner-padding-left,
      var(--lq-scroll-column-inner-padding-left, 0)
    );
    overflow: var(
      --lq-scroll-column-tablet-inner-overflow,
      var(--lq-scroll-column-inner-overflow, visible)
    );
  }

  .lq-scroll-column--tablet-wrapper-align-left {
    align-self: start;
    margin-left: 0;
    margin-right: auto;
  }

  .lq-scroll-column--tablet-wrapper-align-center {
    align-self: center;
    margin-left: auto;
    margin-right: auto;
  }

  .lq-scroll-column--tablet-wrapper-align-right {
    align-self: end;
    margin-left: auto;
    margin-right: 0;
  }

  .lq-scroll-column--tablet-wrapper-align-stretch {
    align-self: stretch;
    width: 100%;
    max-width: 100%;
  }

  .lq-scroll-column--tablet-inner-align-left .lq-scroll-column__inner {
    margin-left: 0;
    margin-right: auto;
  }

  .lq-scroll-column--tablet-inner-align-center .lq-scroll-column__inner {
    margin-left: auto;
    margin-right: auto;
  }

  .lq-scroll-column--tablet-inner-align-right .lq-scroll-column__inner {
    margin-left: auto;
    margin-right: 0;
  }

  .lq-scroll-column--tablet-inner-align-stretch .lq-scroll-column__inner {
    width: 100%;
    max-width: none;
  }
}

@media (max-width: 767px) {
  .lq-scroll-column {
    width: var(
      --lq-scroll-column-mobile-wrapper-width,
      var(--lq-scroll-column-tablet-wrapper-width, var(--lq-scroll-column-wrapper-width, auto))
    );
    max-width: var(
      --lq-scroll-column-mobile-wrapper-max-width,
      var(--lq-scroll-column-tablet-wrapper-max-width, var(--lq-scroll-column-wrapper-max-width, 100%))
    );
    min-width: var(
      --lq-scroll-column-mobile-wrapper-min-width,
      var(--lq-scroll-column-tablet-wrapper-min-width, var(--lq-scroll-column-wrapper-min-width, 0))
    );
    top: var(
      --lq-scroll-column-mobile-offset-top,
      var(--lq-scroll-column-tablet-offset-top, var(--lq-scroll-column-offset-top, auto))
    );
    right: var(
      --lq-scroll-column-mobile-offset-right,
      var(--lq-scroll-column-tablet-offset-right, var(--lq-scroll-column-offset-right, auto))
    );
    bottom: var(
      --lq-scroll-column-mobile-offset-bottom,
      var(--lq-scroll-column-tablet-offset-bottom, var(--lq-scroll-column-offset-bottom, auto))
    );
    left: var(
      --lq-scroll-column-mobile-offset-left,
      var(--lq-scroll-column-tablet-offset-left, var(--lq-scroll-column-offset-left, auto))
    );
    margin-top: var(
      --lq-scroll-column-mobile-wrapper-margin-top,
      var(--lq-scroll-column-tablet-wrapper-margin-top, var(--lq-scroll-column-wrapper-margin-top, 0px))
    );
    margin-right: var(
      --lq-scroll-column-mobile-wrapper-margin-right,
      var(--lq-scroll-column-tablet-wrapper-margin-right, var(--lq-scroll-column-wrapper-margin-right, 0px))
    );
    margin-bottom: var(
      --lq-scroll-column-mobile-wrapper-margin-bottom,
      var(--lq-scroll-column-tablet-wrapper-margin-bottom, var(--lq-scroll-column-wrapper-margin-bottom, 0px))
    );
    margin-left: var(
      --lq-scroll-column-mobile-wrapper-margin-left,
      var(--lq-scroll-column-tablet-wrapper-margin-left, var(--lq-scroll-column-wrapper-margin-left, 0px))
    );
    padding-top: var(
      --lq-scroll-column-mobile-wrapper-padding-top,
      var(
        --lq-scroll-column-tablet-wrapper-padding-top,
        var(
          --lq-scroll-column-wrapper-padding-top,
          var(
            --lq-scroll-column-mobile-pt,
            var(--lq-scroll-column-tablet-pt, var(--lq-scroll-column-pt, 0))
          )
        )
      )
    );
    padding-right: var(
      --lq-scroll-column-mobile-wrapper-padding-right,
      var(
        --lq-scroll-column-tablet-wrapper-padding-right,
        var(
          --lq-scroll-column-wrapper-padding-right,
          var(
            --lq-scroll-column-mobile-pr,
            var(--lq-scroll-column-tablet-pr, var(--lq-scroll-column-pr, 0))
          )
        )
      )
    );
    padding-bottom: var(
      --lq-scroll-column-mobile-wrapper-padding-bottom,
      var(
        --lq-scroll-column-tablet-wrapper-padding-bottom,
        var(
          --lq-scroll-column-wrapper-padding-bottom,
          var(
            --lq-scroll-column-mobile-pb,
            var(--lq-scroll-column-tablet-pb, var(--lq-scroll-column-pb, 0))
          )
        )
      )
    );
    padding-left: var(
      --lq-scroll-column-mobile-wrapper-padding-left,
      var(
        --lq-scroll-column-tablet-wrapper-padding-left,
        var(
          --lq-scroll-column-wrapper-padding-left,
          var(
            --lq-scroll-column-mobile-pl,
            var(--lq-scroll-column-tablet-pl, var(--lq-scroll-column-pl, 0))
          )
        )
      )
    );
    overflow: var(
      --lq-scroll-column-mobile-wrapper-overflow,
      var(--lq-scroll-column-tablet-wrapper-overflow, var(--lq-scroll-column-wrapper-overflow, visible))
    );
  }

  .lq-scroll-column--has-mobile-wrapper-z-index {
    z-index: var(
      --lq-scroll-column-mobile-wrapper-z-index,
      var(
        --lq-scroll-column-tablet-wrapper-z-index,
        var(--lq-scroll-column-wrapper-z-index, var(--lq-scroll-column-z-index))
      )
    );
  }

  .lq-scroll-column__inner {
    width: var(
      --lq-scroll-column-mobile-inner-width,
      var(--lq-scroll-column-tablet-inner-width, var(--lq-scroll-column-inner-width, 100%))
    );
    max-width: var(
      --lq-scroll-column-mobile-inner-max-width,
      var(--lq-scroll-column-tablet-inner-max-width, var(--lq-scroll-column-inner-max-width, 100%))
    );
    min-width: var(
      --lq-scroll-column-mobile-inner-min-width,
      var(--lq-scroll-column-tablet-inner-min-width, var(--lq-scroll-column-inner-min-width, 0))
    );
    margin-top: var(
      --lq-scroll-column-mobile-inner-margin-top,
      var(--lq-scroll-column-tablet-inner-margin-top, var(--lq-scroll-column-inner-margin-top, 0px))
    );
    margin-right: var(
      --lq-scroll-column-mobile-inner-margin-right,
      var(--lq-scroll-column-tablet-inner-margin-right, var(--lq-scroll-column-inner-margin-right, 0px))
    );
    margin-bottom: var(
      --lq-scroll-column-mobile-inner-margin-bottom,
      var(--lq-scroll-column-tablet-inner-margin-bottom, var(--lq-scroll-column-inner-margin-bottom, 0px))
    );
    margin-left: var(
      --lq-scroll-column-mobile-inner-margin-left,
      var(--lq-scroll-column-tablet-inner-margin-left, var(--lq-scroll-column-inner-margin-left, 0px))
    );
    padding-top: var(
      --lq-scroll-column-mobile-inner-padding-top,
      var(--lq-scroll-column-tablet-inner-padding-top, var(--lq-scroll-column-inner-padding-top, 0px))
    );
    padding-right: var(
      --lq-scroll-column-mobile-inner-padding-right,
      var(--lq-scroll-column-tablet-inner-padding-right, var(--lq-scroll-column-inner-padding-right, 0px))
    );
    padding-bottom: var(
      --lq-scroll-column-mobile-inner-padding-bottom,
      var(--lq-scroll-column-tablet-inner-padding-bottom, var(--lq-scroll-column-inner-padding-bottom, 0px))
    );
    padding-left: var(
      --lq-scroll-column-mobile-inner-padding-left,
      var(--lq-scroll-column-tablet-inner-padding-left, var(--lq-scroll-column-inner-padding-left, 0px))
    );
    overflow: var(
      --lq-scroll-column-mobile-inner-overflow,
      var(--lq-scroll-column-tablet-inner-overflow, var(--lq-scroll-column-inner-overflow, visible))
    );
  }

  .lq-scroll-column--mobile-wrapper-align-left {
    align-self: start;
    margin-left: 0;
    margin-right: auto;
  }

  .lq-scroll-column--mobile-wrapper-align-center {
    align-self: center;
    margin-left: auto;
    margin-right: auto;
  }

  .lq-scroll-column--mobile-wrapper-align-right {
    align-self: end;
    margin-left: auto;
    margin-right: 0;
  }

  .lq-scroll-column--mobile-wrapper-align-stretch {
    align-self: stretch;
    width: 100%;
    max-width: 100%;
  }

  .lq-scroll-column--mobile-inner-align-left .lq-scroll-column__inner {
    margin-left: 0;
    margin-right: auto;
  }

  .lq-scroll-column--mobile-inner-align-center .lq-scroll-column__inner {
    margin-left: auto;
    margin-right: auto;
  }

  .lq-scroll-column--mobile-inner-align-right .lq-scroll-column__inner {
    margin-left: auto;
    margin-right: 0;
  }

  .lq-scroll-column--mobile-inner-align-stretch .lq-scroll-column__inner {
    width: 100%;
    max-width: none;
  }
}