=flex($justify: space-between, $alignItem: initial)
  display: -webkit-box      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox      /* TWEENER - IE 10 */
  display: -webkit-flex     /* NEW - Chrome */
  display: flex


  +prefixer(justify-content, $justify, webkit moz ms)
  +prefixer(align-items, $alignItem, webkit moz ms)


=flex-rows
  +prefixer(flex-wrap, wrap, webkit ms)
  +prefixer(flex-direction, row, webkit ms)
  +prefixer(flex-flow, row wrap, webkit)

=order($place)
  +prefixer(order, $place, webkit ms)

$gridColumns: 12

@function column($columnCount : 1, $origin : $gridColumns)
  @return calculateColumnSize($columnCount,$origin) * 1%

/**
  * This is where the magic happens
  * Return percentage based on amount of columns
  * Use parent column size to adjust the origin
  */
@function calculateColumnSize($columnCount : 1, $origin : $gridColumns)
  // Calculate the width for a single column on a full grid
  $singleColumnSize : 100 / $gridColumns

  // Get the origin size in percentage from the full grid
  $originPercentage : $origin / $gridColumns * 100

  // Calculate single column from new origin
  $newSingleColumnSize : $singleColumnSize / $originPercentage * 100

  // Return amount of columns as percentage
  @return ($newSingleColumnSize * $columnCount)