$gutter: 10px;

container {
   max-width: 1600px;
   width: 95%;
}

%column {
   margin: calc(#{$gutter} / 2);
   float: left;
   background: #ccc;
   height: 40px;
}

.column {
   &--1 {
      @extend %column;
      width: calc(100% / 12 * 1 - #{$gutter});
   }
   
   &--2 {
      @extend %column;
      width: calc(100% / 12 * 2 - #{$gutter});
   }
   
   &--3 {
      @extend %column;
      width: calc(100% / 12 * 3 - #{$gutter});
   }
   
   &--4 {
      @extend %column;
      width: calc(100% / 12 * 4 - #{$gutter});
   }
   
   &--5 {
      @extend %column;
      width: calc(100% / 12 * 5 - #{$gutter});
   }
   
   &--6 {
      @extend %column;
      width: calc(100% / 12 * 6 - #{$gutter});
   }
   
   &--7 {
      @extend %column;
      width: calc(100% / 12 * 7 - #{$gutter});
   }
   
   &--8 {
      @extend %column;
      width: calc(100% / 12 * 8 - #{$gutter});
   }
   
   &--9 {
      @extend %column;
      width: calc(100% / 12 * 9 - #{$gutter});
   }
   
   &--10 {
      @extend %column;
      width: calc(100% / 12 * 10 - #{$gutter});
   }
   
   &--11 {
      @extend %column;
      width: calc(100% / 12 * 11 - #{$gutter});
   }
   
   &--12 {
      @extend %column;
      width: calc(100% / 12 * 12 - #{$gutter});
   }
}