=grid-container
  +clearfix
  box-sizing: border-box
  margin-right: auto
  margin-left: auto
  position: relative

=grid-row($gutter: 10px)
  +clearfix
  box-sizing: border-box
  position: relative
  margin-left:  -($gutter / 2)
  margin-right: -($gutter / 2)
  margin-top:  -($gutter / 2)
  margin-bottom: -($gutter / 2)

=grid-item($gutter: 10px)
  box-sizing: border-box
  position: relative
  padding-left:  ($gutter / 2)
  padding-right: ($gutter / 2)
  padding-top:  ($gutter / 2)
  padding-bottom: ($gutter / 2)
  float: left
  word-break: break-all

=grids($grid-columns: 12, $grid-gutter: 10px, $debug: true)
  @at-root
    #{&}
      +grid-container

    #{&}__row
      +grid-row($grid-gutter)

    #{&}__item
      @if $debug
        +debug-block
      +grid-item($grid-gutter)
      width: percentage(3 / $grid-columns)
      &.c
        clear: both
      @for $i from 0 through $grid-columns
        &.is-col#{$i}
          width: percentage($i / $grid-columns)