@each $size in $pixelSizes {
  .pa#{$size} { padding: #{$size}px; }
  .pt#{$size} { padding-top: #{$size}px; }
  .pr#{$size} { padding-right: #{$size}px; }
  .pb#{$size} { padding-bottom: #{$size}px; }
  .pl#{$size} { padding-left: #{$size}px; }
  .ph#{$size} { padding-left: #{$size}px; padding-right: #{$size}px; }
  .pv#{$size} { padding-top: #{$size}px; padding-bottom: #{$size}px; }

  @each $breakpoint in $breakpoints {
    $bp: nth($breakpoint, 1);
    $letters: nth($breakpoint, 2);

    @media #{$bp} {
      .pa#{$size}-#{$letters} { padding: #{$size}px; }
      .pt#{$size}-#{$letters} { padding-top: #{$size}px; }
      .pr#{$size}-#{$letters} { padding-right: #{$size}px; }
      .pb#{$size}-#{$letters} { padding-bottom: #{$size}px; }
      .pl#{$size}-#{$letters} { padding-left: #{$size}px; }
      .ph#{$size}-#{$letters} { padding-left: #{$size}px; padding-right: #{$size}px; }
      .pv#{$size}-#{$letters} { padding-top: #{$size}px; padding-bottom: #{$size}px; }
    }
  }
}
