//
// Columns
// --------------------------------------------------


//
// Mixin Columns
// --------------------------------------------------
.columns-default(@n, @w) {
  -webkit-column-count: @n; /* Chrome, Safari, Opera */
  -webkit-column-gap: @grid-gutter-width; /* Chrome, Safari, Opera */
  -webkit-column-width: @w; /* Chrome, Safari, Opera */

  -moz-columns: @n @w;
  -moz-column-gap: @grid-gutter-width; /* Firefox */

  column-width: @w;
  column-count: @n;
  column-gap: @grid-gutter-width;
  li {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
  }
}
.columns-line(@n, @w) {
  -webkit-column-count: @n; /* Chrome, Safari, Opera */
  -webkit-column-gap: @grid-gutter-width; /* Chrome, Safari, Opera */
  -webkit-column-width: @w; /* Chrome, Safari, Opera */
  -webkit-column-rule:1px solid @gray-light; /* Chrome, Safari, Opera */

  -moz-columns: @n @w;
  -moz-column-gap: @grid-gutter-width; /* Firefox */
  -moz-column-rule:1px solid @gray-light; /* Firefox */

  column-width: @w;
  column-count: @n;
  column-gap: @grid-gutter-width;
  column-rule:1px solid @gray-light;

  li {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
  }
}

//
// List Columns
// --------------------------------------------------
.list-columns {
     > ul {
        .columns-default(5, 80px);
    }
}
//
// List Columns
// --------------------------------------------------
.list-columns-4 {
	 > ul {
		.columns-default(4, 100px);
        > li {
            line-height: 1.2em;
            margin-bottom: @grid-gutter-width/2;
        }
	}
}


.list-columns-2 {
  > ul {
    .columns-default(2, 200px);
    > li {
      line-height: 1.2em;
      margin-bottom: @grid-gutter-width/3;
    }
  }
}
