@mixin overlay($z-index: null) {
  &::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: $color-image-overlay;
    opacity: $opacity-image-overlay;
    @if ($z-index) {
      z-index: $z-index;
    }
  }
}

@mixin ul-margin-padding-reset($li-margin: null) {
  margin: 0;
  padding: 0;
  list-style: none;
  & ll {
    margin: 0;
    padding: 0;
  }
}

@mixin section-bg($postion) {
  position: absolute;
  top: 0;
  height: 100%;
  #{$postion}: 0;
  width: calc((100% - #{map-get($container-max-widths, "xl")} + 2px) / 2);
}
@mixin small-bg($postion) {
  position: absolute;
  top: 0;
  height: 100%;
  #{$postion}: 0;
  width: calc(100% / 2);
  z-index: -1;
}
@mixin bg-position($position, $isabsolute: null) {
  @if $isabsolute {
    position: absolute;
  }
  top: 0;
  height: 100%;
  #{$position}: 0;
  z-index: -1;
}
@mixin bg-position-full($position, $isabsolute: null) {
  @if $isabsolute {
    position: absolute;
  }
  top: 0;
  width: calc(100% - 15px);
  height: 100%;
  #{$position}: 0;
  z-index: -1;
}

@mixin arrow($direction) {
}