@sizes: 1, 2, 3, 4, 5, 6, 7, 8;
@base: 8px;

each(@sizes, {
  .m {
    &-@{value} {
      margin: @base * @value;
    }
    &t-@{value} {
      margin-top: @base * @value;
    }
    &r-@{value} {
      margin-right: @base * @value;
    }
    &b-@{value} {
      margin-bottom: @base * @value;
    }
    &l-@{value} {
      margin-left: @base * @value;
    }
    &x-@{value} {
      margin: 0 @base * @value;
    }
    &y-@{value} {
      margin: @base * @value 0;
    }
  }

  .p {
    &-@{value} {
      padding: @base * @value;
    }
    &t-@{value} {
      padding-top: @base * @value;
    }
    &r-@{value} {
      padding-right: @base * @value;
    }
    &b-@{value} {
      padding-bottom: @base * @value;
    }
    &l-@{value} {
      padding-left: @base * @value;
    }
    &x-@{value} {
      padding: 0 @base * @value;
    }
    &y-@{value} {
      padding: @base * @value 0;
    }
  }
});