// PADDINGS

@for $i from 0 through 10 {
  .p-#{$i} {padding: #{$i*5}px;}

  .pt-#{$i} {padding-top: #{$i*5}px;}
  .pb-#{$i} {padding-bottom: #{$i*5}px;}
  .pl-#{$i} {padding-left: #{$i*5}px;}
  .pr-#{$i} {padding-right: #{$i*5}px;}
}

@for $i from 0 through 10 {
  .m-#{$i} {margin: #{$i*5}px;}

  .mt-#{$i} {margin-top: #{$i*5}px;}
  .mb-#{$i} {margin-bottom: #{$i*5}px;}
  .ml-#{$i} {margin-left: #{$i*5}px;}
  .mr-#{$i} {margin-right: #{$i*5}px;}
}