$block = ".crow";
$small = .5;
$medium = 1;
$large = 2;

horizontal-gutter($multiplier) {
  margin-right: (- 4 * $multiplier)px;
  margin-left: (- 4 * $multiplier)px;

  > * {
    padding-right: (4 * $multiplier)px;
    padding-left: (4 * $multiplier)px;
  }
}

{$block} {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
  margin: 0;
  padding: 0;
  height: 100%;

  &__ws-auto > * {
    flex: 1;
  }

  &__right {
    justify-content: flex-end;
  }

  &__down {
    align-items: flex-end;
  }

  &__left {
    justify-content: flex-start;
  }

  &__up {
    align-items: flex-start;
  }

  &{$block}__gutter-small {
    horizontal-gutter($small);
  }

  &{$block}__gutter-medium {
    horizontal-gutter($medium);
  }

  &{$block}__gutter-large {
    horizontal-gutter($large);
  }
}