/* 50-flex.css */

.o-flex-container {
  /* layout */
  display: flex;
  flex-direction: column;
}

.o-flex-container--centering {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.o-flex-container--horizontal {
  /* layout */
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 2em;
  padding-top: 0.5em;
}

.o-flex-container--horizontal > * {
  margin-left: 0.5em;
}

.o-flex-container--vertical {
  /* layout */
  display: flex;
  flex-direction: column;
}

.o-flex-grow {
  flex-grow: 1;
}

.o-flex-item {
  /* layout */
  margin: 0.5em 0.1em;
  padding: 0.5em;
}