/* --------------------------------------------------
   Columns
   -------------------------------------------------- */

.view-layout-columns .example-container {
  padding-bottom: 15px;
  text-align: center;

  /* a minimum width fallback */
  -webkit-column-width: 25px;
  -moz-column-width: 25px;
  column-width: 25px;

  -webkit-column-gap: 10px;
  -moz-column-gap: 10px;
  column-gap: 10px;

  /* chrome does not repaint column-rule when switching classes in js :( */
  /*-webkit-column-rule: 1px dashed #999;*/
  /*-moz-column-rule: 1px dashed #999;*/
  /*column-rule: 1px dashed #999;*/

  -webkit-margin-bottom-collapse: separate;

  &.col-2 {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }

  &.col-3 {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
  }

  &.col-4 {
    -webkit-column-count: 4;
    -moz-column-count: 4;
    column-count: 4;
  }
}
