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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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