@import "../../variable";

@media (min-width: $xl-breakpoint) {
  .m-xl-0 {
    margin: 0 !important
  }

  .mt-xl-0, .my-xl-0 {
    margin-top: 0 !important
  }

  .mr-xl-0, .mx-xl-0 {
    margin-right: 0 !important
  }

  .mb-xl-0, .my-xl-0 {
    margin-bottom: 0 !important
  }

  .ml-xl-0, .mx-xl-0 {
    margin-left: 0 !important
  }

  .m-xl-1 {
    margin: .25rem !important
  }

  .mt-xl-1, .my-xl-1 {
    margin-top: .25rem !important
  }

  .mr-xl-1, .mx-xl-1 {
    margin-right: .25rem !important
  }

  .mb-xl-1, .my-xl-1 {
    margin-bottom: .25rem !important
  }

  .ml-xl-1, .mx-xl-1 {
    margin-left: .25rem !important
  }

  .m-xl-2 {
    margin: .5rem !important
  }

  .mt-xl-2, .my-xl-2 {
    margin-top: .5rem !important
  }

  .mr-xl-2, .mx-xl-2 {
    margin-right: .5rem !important
  }

  .mb-xl-2, .my-xl-2 {
    margin-bottom: .5rem !important
  }

  .ml-xl-2, .mx-xl-2 {
    margin-left: .5rem !important
  }

  .m-xl-3 {
    margin: 1rem !important
  }

  .mt-xl-3, .my-xl-3 {
    margin-top: 1rem !important
  }

  .mr-xl-3, .mx-xl-3 {
    margin-right: 1rem !important
  }

  .mb-xl-3, .my-xl-3 {
    margin-bottom: 1rem !important
  }

  .ml-xl-3, .mx-xl-3 {
    margin-left: 1rem !important
  }

  .m-xl-4 {
    margin: 1.5rem !important
  }

  .mt-xl-4, .my-xl-4 {
    margin-top: 1.5rem !important
  }

  .mr-xl-4, .mx-xl-4 {
    margin-right: 1.5rem !important
  }

  .mb-xl-4, .my-xl-4 {
    margin-bottom: 1.5rem !important
  }

  .ml-xl-4, .mx-xl-4 {
    margin-left: 1.5rem !important
  }

  .m-xl-5 {
    margin: 3rem !important
  }

  .mt-xl-5, .my-xl-5 {
    margin-top: 3rem !important
  }

  .mr-xl-5, .mx-xl-5 {
    margin-right: 3rem !important
  }

  .mb-xl-5, .my-xl-5 {
    margin-bottom: 3rem !important
  }

  .ml-xl-5, .mx-xl-5 {
    margin-left: 3rem !important
  }
  .m-xl-auto {
    margin: auto !important
  }

  .mt-xl-auto, .my-xl-auto {
    margin-top: auto !important
  }

  .mr-xl-auto, .mx-xl-auto {
    margin-right: auto !important
  }

  .mb-xl-auto, .my-xl-auto {
    margin-bottom: auto !important
  }

  .ml-xl-auto, .mx-xl-auto {
    margin-left: auto !important
  }

  .m-grid {
    margin: $xl-main-padding;
  }
  .m--grid {
    margin: -$xl-main-padding;
  }
  .ml-grid, .mx-grid {
    margin-left: $xl-main-padding;
  }
  .ml--grid, .mx--grid {
    margin-left: -$xl-main-padding;
  }
  .mr-grid, .mx-grid {
    margin-right: $xl-main-padding;
  }
  .mr--grid, .mx--grid {
    margin-right: -$xl-main-padding;
  }

  .mt-grid, .my-grid {
    margin-top: $xl-main-padding;
  }
  .mt--grid, .my--grid {
    margin-top: -$xl-main-padding;
  }
  .mb-grid, .my-grid {
    margin-bottom: $xl-main-padding;
  }
  .mb--grid, .my--grid {
    margin-bottom: -$xl-main-padding;
  }

  .m-sm-grid {
    margin: $xl-main-padding !important;
  }
  .m-sm--grid {
    margin: -$xl-main-padding !important;
  }
  .ml-sm-grid, .mx-sm-grid {
    margin-left: $xl-main-padding !important;
  }
  .ml-sm--grid, .mx-sm--grid {
    margin-left: -$xl-main-padding !important;
  }
  .mr-sm-grid, .mx-sm-grid {
    margin-right: $xl-main-padding !important;
  }
  .mr-sm--grid, .mx-sm--grid {
    margin-right: -$xl-main-padding !important;
  }

  .mt-sm-grid, .my-sm-grid {
    margin-top: $xl-main-padding !important;
  }
  .mt-sm--grid, .my-sm--grid {
    margin-top: -$xl-main-padding !important;
  }
  .mb-sm-grid, .my-sm-grid {
    margin-bottom: $xl-main-padding !important;
  }
  .mb-sm--grid, .my-sm--grid {
    margin-bottom: -$xl-main-padding !important;
  }

  .m-md-grid {
    margin: $xl-main-padding;
  }
  .m-md--grid {
    margin: -$xl-main-padding;
  }
  .ml-md-grid, .mx-md-grid {
    margin-left: $xl-main-padding;
  }
  .ml-md--grid, .mx-md--grid {
    margin-left: -$xl-main-padding;
  }
  .mr-md-grid, .mx-md-grid {
    margin-right: $xl-main-padding;
  }
  .mr-md--grid, .mx-md--grid {
    margin-right: -$xl-main-padding;
  }

  .mt-md-grid, .my-md-grid {
    margin-top: $xl-main-padding;
  }
  .mt-md--grid, .my-md--grid {
    margin-top: -$xl-main-padding;
  }
  .mb-md-grid, .my-md-grid {
    margin-bottom: $xl-main-padding;
  }
  .mb-md--grid, .my-md--grid {
    margin-bottom: -$xl-main-padding;
  }

  .m-lg-grid {
    margin: $xl-main-padding;
  }
  .m-lg--grid {
    margin: -$xl-main-padding;
  }
  .ml-lg-grid, .mx-lg-grid {
    margin-left: $xl-main-padding;
  }
  .ml-lg--grid, .mx-lg--grid {
    margin-left: -$xl-main-padding;
  }
  .mr-lg-grid, .mx-lg-grid {
    margin-right: $xl-main-padding;
  }
  .mr-lg--grid, .mx-lg--grid {
    margin-right: -$xl-main-padding;
  }

  .mt-lg-grid, .my-lg-grid {
    margin-top: $xl-main-padding;
  }
  .mt-lg--grid, .my-lg--grid {
    margin-top: -$xl-main-padding;
  }
  .mb-lg-grid, .my-lg-grid {
    margin-bottom: $xl-main-padding;
  }
  .mb-lg--grid, .my-lg--grid {
    margin-bottom: -$xl-main-padding;
  }

  .m-xl-grid {
    margin: $xl-main-padding;
  }
  .m-xl--grid {
    margin: -$xl-main-padding;
  }
  .ml-xl-grid, .mx-xl-grid {
    margin-left: $xl-main-padding;
  }
  .ml-xl--grid, .mx-xl--grid {
    margin-left: -$xl-main-padding;
  }
  .mr-xl-grid, .mx-xl-grid {
    margin-right: $xl-main-padding;
  }
  .mr-xl--grid, .mx-xl--grid {
    margin-right: -$xl-main-padding;
  }

  .mt-xl-grid, .my-xl-grid {
    margin-top: $xl-main-padding;
  }
  .mt-xl--grid, .my-xl--grid {
    margin-top: -$xl-main-padding;
  }
  .mb-xl-grid, .my-xl-grid {
    margin-bottom: $xl-main-padding;
  }
  .mb-xl--grid, .my-xl--grid {
    margin-bottom: -$xl-main-padding;
  }

}