%col {
  @include grid-column;

  &--2 {
    @include grid-column;

    @include breakpoint (medium) {
      @include grid-column(6)
    }
  }

  &--3 {
    @include grid-column;

    @include breakpoint (medium) {
      @include grid-column(4)
    }
  }

  &--3-2 {
    @include grid-column;

    @include breakpoint (medium) {
      @include grid-column(8)
    }
  }

  &--10 {
    @include grid-column;

    @include breakpoint (medium) {
      @include grid-column(10);
      @include grid-column-position(center);
    }
  }
}

%hide-mobile {
  display: none;
  @include breakpoint (medium) {
    display: block;
  }
}

%show-mobile {
  display: block !important;
  @include breakpoint (medium) {
    display: none !important;
  }
}
