@charset "UTF-8";
/** @define utilities */

/* Applies to flex container
   ========================================================================== */

/**
 * Container
 */

.vwi_flex {
  display: flex !important;
}

.vwi_flexInline {
  display: inline-flex !important;
}

/**
 * Direction: row
 */

.vwi_flexRow {
  flex-direction: row !important;
}

.vwi_flexRowReverse {
  flex-direction: row-reverse !important;
}

/**
 * Direction: column
 */

.vwi_flexCol {
  flex-direction: column !important;
}

.vwi_flexColReverse {
  flex-direction: column-reverse !important;
}

/**
 * Wrap
 */

.vwi_flexWrap {
  flex-wrap: wrap !important;
}

.vwi_flexNoWrap {
  flex-wrap: nowrap !important;
}

.vwi_flexWrapReverse {
  flex-wrap: wrap-reverse !important;
}

/**
 * Align items along the main axis of the current line of the flex container
 */

.vwi_flexJustifyStart {
  justify-content: flex-start !important;
}

.vwi_flexJustifyEnd {
  justify-content: flex-end !important;
}

.vwi_flexJustifyCenter {
  justify-content: center !important;
}

.vwi_flexJustifyBetween {
  justify-content: space-between !important;
}

.vwi_flexJustifyAround {
  justify-content: space-around !important;
}

/**
 * Align items in the cross axis of the current line of the flex container
 * Similar to `justify-content` but in the perpendicular direction
 */

.vwi_flexAlignItemsStart {
  align-items: flex-start !important;
}

.vwi_flexAlignItemsEnd {
  align-items: flex-end !important;
}

.vwi_flexAlignItemsCenter {
  align-items: center !important;
}

.vwi_flexAlignItemsStretch {
  align-items: stretch !important;
}

.vwi_flexAlignItemsBaseline {
  align-items: baseline !important;
}

/**
 * Aligns items within the flex container when there is extra
 * space in the cross-axis
 *
 * Has no effect when there is only one line of flex items.
 */

.vwi_flexAlignContentStart {
  align-content: flex-start !important;
}

.vwi_flexAlignContentEnd {
  align-content: flex-end !important;
}

.vwi_flexAlignContentCenter {
  align-content: center !important;
}

.vwi_flexAlignContentStretch {
  align-content: stretch !important;
}

.vwi_flexAlignContentBetween {
  align-content: space-between !important;
}

.vwi_flexAlignContentAround {
  align-content: space-around !important;
}

/**
 * 1. Set the flex-shrink default explicitly to fix IE10 - http://git.io/vllC7
 */

/* postcss-bem-linter: ignore */

.vwi_flex > *,
.vwi_flexInline > * {
  flex-shrink: 1; /* 1 */
}

/* Applies to flex items
   ========================================================================== */

/**
 * Override default alignment of single item when specified by `align-items`
 */

.vwi_flexAlignSelfStart {
  align-self: flex-start !important;
}

.vwi_flexAlignSelfEnd {
  align-self: flex-end !important;
}

.vwi_flexAlignSelfCenter {
  align-self: center !important;
}

.vwi_flexAlignSelfStretch {
  align-self: stretch !important;
}

.vwi_flexAlignSelfBaseline {
  align-self: baseline !important;
}

.vwi_flexAlignSelfAuto {
  align-self: auto !important;
}

/**
 * Change order without editing underlying HTML
 */

.vwi_flexOrderFirst {
  order: -1 !important;
}

.vwi_flexOrderLast {
  order: 1 !important;
}

.vwi_flexOrderNone {
  order: 0 !important;
}

/**
 * Specify the flex grow factor, which determines how much the flex item will
 * grow relative to the rest of the flex items in the flex container.
 *
 * Supports 1-5 proportions
 *
 * 1. Provide all values to avoid IE10 bug with shorthand flex
 *    - http://git.io/vllC7
 *
 *    Use `0%` to avoid bug in IE10/11 with unitless flex basis. Using this
 *    instead of `auto` as this matches what the default would be with `flex`
 *    shorthand - http://git.io/vllWx
 */

.vwi_flexGrow1 {
  flex: 1 1 0% !important; /* 1 */
}

.vwi_flexGrow2 {
  flex: 2 1 0% !important;
}

.vwi_flexGrow3 {
  flex: 3 1 0% !important;
}

.vwi_flexGrow4 {
  flex: 4 1 0% !important;
}

.vwi_flexGrow5 {
  flex: 5 1 0% !important;
}

/**
 * Aligning with `auto` margins
 * http://www.w3.org/TR/css-flexbox-1/#auto-margins
 */

.vwi_flexExpand {
  margin: auto !important;
}

.vwi_flexExpandLeft {
  margin-left: auto !important;
}

.vwi_flexExpandRight {
  margin-right: auto !important;
}

.vwi_flexExpandTop {
  margin-top: auto !important;
}

.vwi_flexExpandBottom {
  margin-bottom: auto !important;
}