/* ================================= Margin Css Start =========================== */
@each $property, $value in $spaces {
  .tw-m-#{$property} {
    margin: var(--size-#{$property});
  }
}

@each $property, $value in $spaces {
  .tw-mx-#{$property} {
    margin-inline: var(--size-#{$property});
  }
}

@each $property, $value in $spaces {
  .tw-my-#{$property} {
    margin-block: var(--size-#{$property});
  }
}

@each $property, $value in $spaces {
  .tw-ms-#{$property} {
    margin-inline-start: var(--size-#{$property});
  }
}

@each $property, $value in $spaces {
  .tw-me-#{$property} {
    margin-inline-end: var(--size-#{$property});
  }
}

@each $property, $value in $spaces {
  .tw-mt-#{$property} {
    margin-block-start: var(--size-#{$property});
  }
}

@each $property, $value in $spaces {
  .tw-mb-#{$property} {
    margin-block-end: var(--size-#{$property});
  }
}


.tw {
  &-ms-auto {
    margin-inline-start: auto;
  }
  &-me-auto {
    margin-inline-end: auto;
  }
  &-ms {
    &-128-px {
      margin-inline-start: 128px;
    }
    &-148-px {
      margin-inline-start: 148px;
    }
    &-80-px {
      margin-inline-start: 80px;
    }
  }
  &-mt {
    &-70-px {
      margin-block-start: 70px;
    }
    &-80-px {
      margin-block-start: 80px;
    }
    &-105-px {
      margin-block-start: 105px;
    }
    &-132-px {
      margin-block-start: clamp(3rem, -2.7414rem + 10.8731vw, 8.125rem);
    }
    &-160-px {
      margin-block-start: 160px;
    }
    &-194-px {
      margin-block-start: 194px;
    }
  }
  &-mx {
    &-48-px {
      margin-inline: clamp(1rem, -2.7414rem + 5.8731vw, 3rem);
    }
  }
  &-me {
    &-84-px {
      margin-inline-end: 84px;
    }
    &-90-px {
      margin-inline-end: 90px;
    }
    &-12-percent {
      margin-inline-end: 12%;
    }
  }
  &-mb {
    &-148-px {
      margin-block-end: 148px;
    }
    &-80-px {
      margin-block-end: 80px;
    }
  }
}

.tw {
  &--m {
    &-24-px {
      margin: -24px;
    }
  }
  &--ms {
    &-10-px {
      margin-inline-start: -10px;
    }
    &-24-px {
      margin-inline-start: -24px;
    }
    &-76-px {
      margin-inline-start: -76px;
    }
    &-110-px {
      @media (min-width: 992px) {
        margin-inline-start: -110px;
      }
    }
  }
  &--me {
    &-8-px {
      margin-inline-end: -8px;
    }
    &-12-px {
      margin-inline-end: -12px;
    }
    &-32-px {
      margin-inline-end: -32px;
    }
    &-48-px {
      margin-inline-end: -48px;
    }
    &-74-px {
      margin-inline-end: -70px;
    }
  }
  &--mt {
    &-8-px {
      margin-block-start: -8px;
    }
    &-12-px {
      margin-block-start: -12px;
    }
    &-28-px {
      margin-block-start: -28px;
    }
    &-170-px {
      margin-block-start: -170px;
    }
  }
  &--mb {
    &-40-px {
      margin-block-end: -40px;
    }
  }
}

.my-120 {
  margin-block-start: 60px;
  margin-block-end: 60px;
  @media (min-width: 576px) {
    margin-block-start: 80px;
    margin-block-end: 80px;
  }
  @media (min-width: 992px) {
    margin-block-start: 120px;
    margin-block-end: 120px;
  }
}
.mt-120 {
    margin-block-start: 60px;
    @media (min-width: 576px) {
    margin-block-start: 80px;
  }
    @media (min-width: 992px) {
    margin-block-start: 120px;
  }
}
.mb-120 {
    margin-block-end: 60px;
    @media (min-width: 576px) {
    margin-block-end: 80px;
  }
    @media (min-width: 992px) {
    margin-block-end: 120px;
  }
}
.mt-60 {
    margin-block-start: 30px;
    @media (min-width: 576px) {
    margin-block-start: 40px;
  }
    @media (min-width: 992px) {
    margin-block-start: 60px;
  }
}
  .mb-60 {
    margin-block-end: 30px;
    @media (min-width: 576px) {
    margin-block-end: 40px;
  }
    @media (min-width: 992px) {
    margin-block-end: 60px;
  }
}
/* ================================= Margin Css End =========================== */
