.flex {
  display: flex;
}

.flex-inline {
  display: inline-flex;
}

.flex-column {
  flex-direction: column;
}

.flex-row {
  flex-direction: row;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-start {
  justify-content: flex-start;
}

.flex-center {
  justify-content: center;
}

.flex-end {
  justify-content: flex-end;
}

.flex-space-between {
  justify-content: space-between;
}

.flex-v-start {
  align-items: flex-start;
}

.flex-v-center {
  align-items: center;
}

.flex-v-end {
  align-items: flex-end;
}

.flex-basis-100p {
  flex-basis: 100%;
}

@for $i from 1 through 10 {
  .flex-#{$i} {
    flex: $i !important;
  }
}

.h-centered {
  justify-content: center;
}

.h-space-between {
  justify-content: space-between;
}

.v-centered {
  align-items: center;
}