// ============================================================
//          Flexbox                                  
// ------------------------------------------------------------*/

+route(style,base)

  // Until we can utilise flexbox natively we can kinda, sorta, attempt to emulate
  // it, in a way... e.g.:

  // <header class="flexbox">

  //     <div class="flexbox--item">
  //         <b>Welcome to</b>
  //     </div>

  //     <div class="flexbox__item">
  //         <img src="blubb.jpg">
  //     </div>

  // </header>

  // We can also combine our grid system classes with '.flexbox--item' classes,
   
  //    <div class="flexbox">
  //        <div class="flexbox--item  unit--8">
  //        </div>
  //        <div class="flexbox--item  unit--10">
  //        </div>
  //    </div>

  .flexbox
    display: table
    width: 100%

  html.flexbox
    display: block
    width: auto

  .flexbox--item
    display: table-cell
    vertical-align: middle