Switch to new way of using iron-flex-layout classes

In addition textfit.js is wrapped in Polymer element to ensure single
registration.

bower.json

@@ -20,7 +20,7 @@
   ],
   "dependencies": {
     "textfit": "STRML/textFit#^2.3.0",
-    "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0",
+    "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.5",
     "iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.3",
     "paper-styles": "PolymerElements/paper-styles#^1.0.11",
     "paper-card": "PolymerElements/paper-card#^1.1.1"

demo/index.html

@@ -7,11 +7,11 @@
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
-  <link rel="import" href="../../iron-flex-layout/iron-flex-layout.html">
+  <link rel="import" href="../../iron-flex-layout/iron-flex-layout-classes.html">
   <link rel="import" href="../textfit-div.html">
   <link rel="import" href="../../paper-card/paper-card.html">
   <link rel="import" href="../../paper-styles/demo-pages.html">
-  <style is="custom-style">
+  <style is="custom-style" include="iron-flex">
   .horizontal-section {
     height: 400px;
     min-width: 200px;

textfit-div.html

@@ -1,7 +1,7 @@
 <link rel="import" href="../polymer/polymer.html">
 <link rel="import" href="../iron-resizable-behavior/iron-resizable-behavior.html">
-<link rel="import" href="../iron-flex-layout/classes/iron-flex-layout.html">
-<script src="../textfit/textFit.js"></script>
+<link rel="import" href="../iron-flex-layout/iron-flex-layout-classes.html">
+<link rel="import" href="textfit-import.html">
 <!--
 ### Example:
     <div class="layout horizontal flex wrap">
@@ -17,7 +17,7 @@
   @demo demo/index.html
 -->
 <dom-module id="textfit-div" class="flex">
-  <style>
+  <style include="iron-flex">
   :host {
     height: 100%;
     width: 100%;

textfit-import.html

@@ -0,0 +1 @@
+<script src="../textfit/textFit.js"></script>