.grid.grid--ten-pixel
  .grid__item.one-third
    .text .grid__item.one-third
  .grid__item.two-thirds
    .text .grid__item.two-thirds

@include 'responsive-grid'
 
grid-base()
grid-widths('', 1 2 3)
grid-modifier('ten-pixel', 10px)

.grid.grid--ten-percentage
  .grid__item.one-half
    .text .grid__item.one-half
  .grid__item.one-half
    .text .grid__item.one-half

@include 'responsive-grid'
 
grid-base()
grid-widths('', 1 2)
grid-modifier('ten-percentage', 10%)

.grid.grid--ten-em
  .grid__item.one-half
    .text .grid__item.one-half
  .grid__item.one-half
    .text .grid__item.one-half

@include 'responsive-grid'
 
grid-base()
grid-widths('', 1 2)
grid-modifier('ten-em', 10em)