diff --git "a/\\" "b/\\"
deleted file mode 100644
index 1d25d33..0000000
--- "a/\\"
+++ /dev/null
@@ -1,19 +0,0 @@
-Doc update: new Volley class
-
-Change-Id: Ife3a9a64439e07aaaf92a22adc6d1678138caf7d
-
-# Please enter the commit message for your changes. Lines starting
-# with '#' will be ignored, and an empty message aborts the commit.
-# On branch volley
-# Changes to be committed:
-#	new file:   docs/html/images/training/volley-request.png
-#	modified:   docs/html/training/basics/network-ops/connecting.jd
-#	modified:   docs/html/training/basics/network-ops/index.jd
-#	modified:   docs/html/training/training_toc.cs
-#	new file:   docs/html/training/volley/index.jd
-#	new file:   docs/html/training/volley/request-custom.jd
-#	new file:   docs/html/training/volley/request.jd
-#	new file:   docs/html/training/volley/requestqueue.jd
-#	new file:   docs/html/training/volley/setup.jd
-#	new file:   docs/html/training/volley/simple.jd
-#
diff --git a/docs/html/about/dashboards/index.jd b/docs/html/about/dashboards/index.jd
index c61a94b..32b9c9e 100644
--- a/docs/html/about/dashboards/index.jd
+++ b/docs/html/about/dashboards/index.jd
@@ -64,7 +64,7 @@
 </div>
 
 
-<p style="clear:both"><em>Data collected during a 7-day period ending on May 1, 2014.
+<p style="clear:both"><em>Data collected during a 7-day period ending on June 4, 2014.
 <br/>Any versions with less than 0.1% distribution are not shown.</em>
 </p>
 
@@ -95,7 +95,7 @@
 </div>
 
 
-<p style="clear:both"><em>Data collected during a 7-day period ending on May 1, 2014.
+<p style="clear:both"><em>Data collected during a 7-day period ending on June 4, 2014.
 <br/>Any screen configurations with less than 0.1% distribution are not shown.</em></p>
 
 
@@ -114,7 +114,7 @@
 
 
 <img alt="" style="float:right"
-src="//chart.googleapis.com/chart?chs=400x250&cht=p&chd=t%3A0.1%2C87.0%2C12.9&chf=bg%2Cs%2C00000000&chl=GL%201.1%20only%7CGL%202.0%7CGL%203.0&chco=c4df9b%2C6fad0c" />
+src="//chart.googleapis.com/chart?chs=400x250&cht=p&chd=t%3A0.1%2C83.6%2C16.3&chf=bg%2Cs%2C00000000&chl=GL%201.1%20only%7CGL%202.0%7CGL%203.0&chco=c4df9b%2C6fad0c" />
 
 <p>To declare which version of OpenGL ES your application requires, you should use the {@code
 android:glEsVersion} attribute of the <a
@@ -136,17 +136,17 @@
 </tr>
 <tr>
 <td>2.0</th>
-<td>87.0%</td>
+<td>83.6%</td>
 </tr>
 <tr>
 <td>3.0</th>
-<td>12.9%</td>
+<td>16.3%</td>
 </tr>
 </table>
 
 
 
-<p style="clear:both"><em>Data collected during a 7-day period ending on May 1, 2014</em></p>
+<p style="clear:both"><em>Data collected during a 7-day period ending on June 4, 2014</em></p>
 
 
 
@@ -164,47 +164,42 @@
 var VERSION_DATA =
 [
   {
-    "chart": "//chart.googleapis.com/chart?chs=500x250&cht=p&chd=t%3A1.0%2C16.2%2C0.1%2C13.4%2C60.8%2C8.5&chf=bg%2Cs%2C00000000&chl=Froyo%7CGingerbread%7CHoneycomb%7CIce%20Cream%20Sandwich%7CJelly%20Bean%7CKitKat&chco=c4df9b%2C6fad0c",
+    "chart": "//chart.googleapis.com/chart?chl=Froyo%7CGingerbread%7CIce%20Cream%20Sandwich%7CJelly%20Bean%7CKitKat&chf=bg%2Cs%2C00000000&chd=t%3A0.8%2C14.9%2C12.3%2C58.4%2C13.6&chco=c4df9b%2C6fad0c&cht=p&chs=500x250",
     "data": [
       {
         "api": 8,
         "name": "Froyo",
-        "perc": "1.0"
+        "perc": "0.8"
       },
       {
         "api": 10,
         "name": "Gingerbread",
-        "perc": "16.2"
-      },
-      {
-        "api": 13,
-        "name": "Honeycomb",
-        "perc": "0.1"
+        "perc": "14.9"
       },
       {
         "api": 15,
         "name": "Ice Cream Sandwich",
-        "perc": "13.4"
+        "perc": "12.3"
       },
       {
         "api": 16,
         "name": "Jelly Bean",
-        "perc": "33.5"
+        "perc": "29.0"
       },
       {
         "api": 17,
         "name": "Jelly Bean",
-        "perc": "18.8"
+        "perc": "19.1"
       },
       {
         "api": 18,
         "name": "Jelly Bean",
-        "perc": "8.5"
+        "perc": "10.3"
       },
       {
         "api": 19,
         "name": "KitKat",
-        "perc": "8.5"
+        "perc": "13.6"
       }
     ]
   }
@@ -226,23 +221,22 @@
         "xhdpi": "0.6"
       },
       "Normal": {
-        "hdpi": "33.9",
-        "mdpi": "12.5",
-        "xhdpi": "19.9",
-        "xxhdpi": "13.5"
+        "hdpi": "34.2",
+        "mdpi": "12.0",
+        "xhdpi": "19.6",
+        "xxhdpi": "14.6"
       },
       "Small": {
-        "ldpi": "7.5"
+        "ldpi": "7.2"
       },
       "Xlarge": {
         "hdpi": "0.3",
-        "ldpi": "0.1",
-        "mdpi": "4.2",
+        "mdpi": "4.0",
         "xhdpi": "0.3"
       }
     },
-    "densitychart": "//chart.googleapis.com/chart?chs=400x250&cht=p&chd=t%3A8.2%2C21.1%2C1.6%2C34.8%2C20.8%2C13.5&chf=bg%2Cs%2C00000000&chl=ldpi%7Cmdpi%7Ctvdpi%7Chdpi%7Cxhdpi%7Cxxhdpi&chco=c4df9b%2C6fad0c",
-    "layoutchart": "//chart.googleapis.com/chart?chs=400x250&cht=p&chd=t%3A4.9%2C7.8%2C80.0%2C7.5&chf=bg%2Cs%2C00000000&chl=Xlarge%7CLarge%7CNormal%7CSmall&chco=c4df9b%2C6fad0c"
+    "densitychart": "//chart.googleapis.com/chart?chl=ldpi%7Cmdpi%7Ctvdpi%7Chdpi%7Cxhdpi%7Cxxhdpi&chf=bg%2Cs%2C00000000&chd=t%3A7.8%2C20.4%2C1.6%2C35.1%2C20.5%2C14.6&chco=c4df9b%2C6fad0c&cht=p&chs=400x250",
+    "layoutchart": "//chart.googleapis.com/chart?chl=Xlarge%7CLarge%7CNormal%7CSmall&chf=bg%2Cs%2C00000000&chd=t%3A4.6%2C7.8%2C80.4%2C7.2&chco=c4df9b%2C6fad0c&cht=p&chs=400x250"
   }
 ];
 
diff --git a/docs/html/distribute/engage/analytics.jd b/docs/html/distribute/engage/analytics.jd
new file mode 100644
index 0000000..5f7cade
--- /dev/null
+++ b/docs/html/distribute/engage/analytics.jd
@@ -0,0 +1,50 @@
+page.title=Understand User Behavior
+page.metaDescription=Use Google Analytics to learn what your users like and what keeps them coming back.
+page.tags="analytics, user behavior"
+page.image=/images/gp-analytics.jpg
+
+@jd:body
+
+<div class="figure">
+  <img src="{@docRoot}images/gp-analytics.jpg" style="width:320px">
+</div>
+
+
+<p>
+  Link your Google Play Developer Console with Google Analytics to learn much
+  more about how users interact with your app &mdash; before and after they
+  download it.
+</p>
+
+<p>
+  Start by discovering how many people visit your Google Play listing page,
+  where they come from, and how many go on to install your app. Once the app is
+  launched, use Google Analytics to see which of your features are most
+  popular, where power users spend their time, who tends to make in-app
+  purchases, and more.
+</p>
+
+<p>
+  Google Analytics delivers the numbers in real time, so you can act fast to
+  update your landing page and your app. <a href=
+  "http://www.google.com/analytics/mobile/">Learn more</a>.
+</p>
+
+<p>
+  If you have a Google Analytics account already, linking it to Google Play
+  takes just a few moments. You can also link your Google Analytics account to
+  Admob to start gaining more user insights to improve your in-app marketing.
+</p>
+
+  <div class="headerLine clearfloat">
+  <h2 id="related-resources">
+    Related Resources
+  </h2>
+</div>
+
+<div class="resource-widget resource-flow-layout col-13" 
+  data-query="collection:distribute/engage/analytics"
+  data-sortorder="-timestamp"
+  data-cardsizes="9x3"
+  data-maxresults="6">
+</div>
\ No newline at end of file
diff --git a/docs/html/distribute/engage/deep-linking.jd b/docs/html/distribute/engage/deep-linking.jd
index 0417ba1..a25c3c6 100644
--- a/docs/html/distribute/engage/deep-linking.jd
+++ b/docs/html/distribute/engage/deep-linking.jd
@@ -1,13 +1,13 @@
 page.title=Deep Link to Bring Users Back
-page.metaDescription=Use deep links to bring your users into your apps from social posts or search.
+page.metaDescription=Use deep links to bring your users into your apps from social posts, search, or ads.
 page.tags="app indexing, google+ signin"
 page.image=/images/gp-listing-4.jpg
 
 @jd:body
 
 <p>
-  Use deep links to bring your users into your apps from social posts or
-  search.
+  Use deep links to bring your users into your apps from social posts,
+  search, or ads.
 </p>
 
 <div class="headerLine">
@@ -47,6 +47,11 @@
 <h2>Deep Linking from Google Search &mdash; App Indexing</h2>
 </div>
 
+
+<div style="float:right;">
+  <img src="/images/gp-listing-4.jpg" style="padding-top:1em;padding-left:2em;">
+</div>
+
 <p>
   Another way to bring users back to your apps is to apply for app indexing.
 </p>
@@ -60,11 +65,29 @@
   content</a>.
 </p>
 
-<div>
-  <img src="{@docRoot}images/gp-listing-4.jpg" style="padding-top:1em;">
+<div class="clearfloat" style="margin-top:2em;"></div>
+
+<div style="float:right;width:340px;padding-left:2em;">
+  <img src="/images/gp-ads-linking2.jpg" style="padding-top:1em;">
 </div>
 
-<div class="headerLine">
+<div class="headerLine ">
+<h2>Deep Linking from Google Ads</h2>
+</div>
+<p>
+  Ads can remind users about the apps they already have.
+</p>
+
+<p>
+  As with deep links from Google's organic search results, AdWords deep links
+  send users directly to the relevant pages in apps they already have on their
+  mobile device. A mobile search for "flights to London," for instance, could
+  take a user straight to the London page in a travel app. <a href=
+  "http://www.thinkwithgoogle.com/products/ads-apps.html"
+  class="external-link">Learn more</a>.
+</p>
+
+<div class="headerLine clearfloat">
   <h2 id="related-resources">
     Related Resources
   </h2>
diff --git a/docs/html/distribute/engage/engage_toc.cs b/docs/html/distribute/engage/engage_toc.cs
index 0314f8c..596051a 100644
--- a/docs/html/distribute/engage/engage_toc.cs
+++ b/docs/html/distribute/engage/engage_toc.cs
@@ -37,6 +37,12 @@
   </li>
   <li class="nav-section">
     <div class="nav-section empty" style="font-weight:normal"><a href="<?cs
+        var:toroot?>distribute/engage/analytics.html">
+        <span class="en">Understand User Behavior</span></a>
+    </div>
+  </li>
+  <li class="nav-section">
+    <div class="nav-section empty" style="font-weight:normal"><a href="<?cs
         var:toroot?>distribute/engage/app-updates.html">
         <span class="en">Update Regularly</span></a>
     </div>
diff --git a/docs/html/distribute/engage/index.jd b/docs/html/distribute/engage/index.jd
index f8cd1ee..2b103c3 100644
--- a/docs/html/distribute/engage/index.jd
+++ b/docs/html/distribute/engage/index.jd
@@ -15,8 +15,8 @@
 
   <div class="resource-widget resource-flow-layout landing col-16"
     data-query="collection:distribute/engagelanding"
-    data-cardSizes="6x6"
-    data-maxResults="9">
+    data-cardSizes="9x6,9x6,6x6,6x6,6x6,9x6,9x6,6x6,6x6,6x6"
+    data-maxResults="10">
   </div>
 
   <h3>Related Resources</h3>
diff --git a/docs/html/distribute/engage/widgets.jd b/docs/html/distribute/engage/widgets.jd
index 286adea..6adb55c 100644
--- a/docs/html/distribute/engage/widgets.jd
+++ b/docs/html/distribute/engage/widgets.jd
@@ -1,5 +1,5 @@
 page.title=Build Useful Widgets
-page.metaDescription=Use widgets to remind users about important information in your apps and games, even when your apps are closed.
+page.metaDescription=Use home screen widgets to remind users about important information in your apps and games, even when your apps are closed.
 page.tags=""
 page.image=/images/gp-engage-0.jpg
 
diff --git a/docs/html/distribute/essentials/essentials_toc.cs b/docs/html/distribute/essentials/essentials_toc.cs
index 7084fdd..d0a1114 100644
--- a/docs/html/distribute/essentials/essentials_toc.cs
+++ b/docs/html/distribute/essentials/essentials_toc.cs
@@ -11,12 +11,6 @@
     </div>
   </li>
   <li class="nav-section">
-    <div class="nav-section empty" style="font-weight:normal"><a href="<?cs var:toroot?>distribute/essentials/gpfe-guidelines.html">
-          <span class="en">Education Guidelines</span>
-        </a>
-    </div>
-  </li>
-  <li class="nav-section">
     <div class="nav-section empty" style="font-weight:normal"><a href="<?cs var:toroot?>distribute/essentials/optimizing-your-app.html">
           <span class="en">Optimize Your App</span>
         </a>
diff --git a/docs/html/distribute/essentials/gpfe-guidelines.jd b/docs/html/distribute/essentials/gpfe-guidelines.jd
deleted file mode 100644
index 734bddc..0000000
--- a/docs/html/distribute/essentials/gpfe-guidelines.jd
+++ /dev/null
@@ -1,509 +0,0 @@
-page.title=Education Guidelines
-page.metaDescription=These guidelines and requirements help you develop great apps for students, which offer compelling content and an intuitive user experience on Android tablets.
-page.image=/distribute/images/edu-guidelines.jpg
-Xnonavpage=true
-
-@jd:body
-
-
-<div id="qv-wrapper"><div id="qv">
-<h2>Guidelines</h2>
-<ol>
-<li><a href="#basic-reqts">Basic Requirements</a></li>
-<li><a href="#monetizing-ads">Monetizing and Ads</a></li>
-<li><a href="#e-value">Educational Value</a></li>
-<li><a href="#quality">App Quality</a></li>
-<li><a href="#related-resources">Related Resources</a></li>
-</ol>
-
-<h2>
-  Testing
-</h2>
-
-<ol>
-  <li>
-    <a href="#test-environment">Setting Up a Test Environment</a>
-  </li>
-</ol>
-
-</div></div>
-
-<div style="margin:0 0 1em 0;">
-  <img src="{@docRoot}distribute/images/edu-guidelines.jpg" style=
-  "width:274px;">
-</div>
-
-<p>
-  These guidelines and requirements help you develop great apps for students,
-  which offer compelling content and an intuitive user experience on Android
-  tablets.
-</p>
-
-<p>
-  You’ll also need to ensure that your apps comply with the terms of the
-  <a href=
-  "https://play.google.com/about/developer-distribution-agreement-addendum.html">
-  Google Play for Education Addendum</a>, <a href=
-  "http://play.google.com/about/developer-content-policy.html">Google Play
-  Developer Program Policies</a>, and <a href=
-  "http://play.google.com/about/developer-distribution-agreement.html">Developer
-  Distribution Agreement</a>.
-</p>
-
-<div class="headerLine">
-  <h2 id="basic-reqts">
-    Basic Requirements
-  </h2>
-
-
-</div>
-
-<p>
-  To participate, your apps must be designed for the K-12 market. The basic
-  requirements that your apps must meet are:
-</p>
-
-<ul>
-  <li>
-    <p>
-      Apps and the ads they contain must not collect personally identifiable
-      information, other than user credentials or data required to operate and
-      improve the app.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      Apps must not use student data for purposes unrelated to its educational
-      function.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      Apps must have a content rating of "Everyone" or "Low Maturity" (apps
-      with a "Medium Maturity" rating are allowed, if they have that rating
-      solely because they allow communication between students).
-    </p>
-  </li>
-
-  <li>
-    <p>
-      App content, including ads displayed by the app, must be consistent with
-      the app's maturity rating. The app must not display any "offensive"
-      content, as described in the <a href=
-      "http://play.google.com/about/developer-content-policy.html">Google Play
-      Developer Program Policies</a> and <a href=
-      "https://support.google.com/googleplay/android-developer/answer/188189">content-rating
-      guidelines</a>.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      Apps must comply with the Children’s Online Privacy Protection Act and
-      all other applicable laws and regulations.
-    </p>
-  </li>
-</ul>
-
-<div class="headerLine">
-  <h2 id="monetizing-ads">
-    Monetizing and Ads
-  </h2>
-
-
-</div>
-
-<p>
-  In-app purchase is currently not supported with Google Play for Education, so
-  a student device will block any transactions. To avoid confusion, be sure to
-  remove any in-app purchase buttons and related UI elements from your apps.
-  We’re investigating additional purchase mechanisms to enable more flexible
-  pricing models for developers and schools.
-</p>
-
-<p>
-  If your apps are priced In Google Play for Education, you must allow Google
-  Play to offer teachers limited free trials before purchase (you provide this
-  through business terms only, no development work is needed.)
-</p>
-
-<p>
-  You can only choose not to remove in-app purchasing from your apps where all
-  content and services are sold through Google Play for Education using In-app
-  Billing. If you choose not to remove In-app Billing features, ensure that:
-</p>
-
-<ul>
-  <li>
-    <p>
-      Users can access your apps’ core functionality for a classroom setting
-      without an in-app purchase.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      In-app purchases are clearly identifiable in your UI.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      You declare the use of in-app purchases at <a href=
-      "{@docRoot}distribute/googleplay/edu/start.html#publish">opt-in</a>.
-    </p>
-  </li>
-</ul>
-
-<p>
-  For each app that you publish, you can set a single price that applies to
-  both Google Play and Google Play for Education. You can’t set a different
-  price for a given app (based on a single package name) in Google Play for
-  Education.
-</p>
-
-<p>
-  If your apps display ads, you should disable the display of ads if possible,
-  or ensure that:
-</p>
-
-<ul>
-  <li>Ads are not distracting for students or teachers (this includes
-  Flash-based ads, video ads, and ads that flash or move)
-  </li>
-
-  <li>Interstitial ads are not served in the app
-  </li>
-
-  <li>Ad walls do not appear in the app UI
-  </li>
-
-  <li>Ads do not occupy a significant portion of the screen
-  </li>
-
-  <li>Ads content does not exceed the maturity rating of the app.
-  </li>
-
-  <li>
-    <p>
-      You declare the use of ads at <a href=
-      "{@docRoot}distribute/googleplay/edu/start.html#publish">opt-in</a>.
-    </p>
-  </li>
-</ul>
-
-<div class="headerLine">
-  <h2 id="e-value">
-    Educational Value
-  </h2>
-
-
-</div>
-
-<div class="figure">
-  <img src="{@docRoot}images/gp-e-value.png" class="border-img">
-</div>
-
-<p>
-  Apps submitted to Google Play for Education will be evaluated by a
-  third-party educator network, which will review them based on alignment with
-  <a href="http://www.corestandards.org/">Common Core Standards</a> and other
-  educational considerations. This will help make your content more
-  discoverable for teachers and administrators as they browse by grade level,
-  subject, core curriculum, and other parameters.
-</p>
-
-<p>
-  Apps with highest educational value will have these characteristics:
-</p>
-
-<ul>
-  <li>
-    <p>
-      Designed for use in K-12 classrooms.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      Aligned with a common core standard or support common-core learning.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      Simple, easy to use, and intuitive for the grade levels the apps are
-      targeting. Apps are relatively easy to navigate without teacher guidance.
-      Not distracting or overwhelming to students.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      Enjoyable and interactive. Apps are engaging to students and lets them
-      control their experience.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      Versatile. Apps have features that make them useful for more than one
-      classroom function or lesson throughout the school year.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      Supports the "4Cs":
-    </p>
-
-    <ul>
-      <li>
-        <p>
-          <em>Creativity</em> &mdash; Allows students to create in order to
-          express understanding of the learning objectives, and try new
-          approaches, innovation, and invention to get things done.
-        </p>
-      </li>
-
-      <li>
-        <p>
-          <em>Critical thinking</em> &mdash; Allows students to look at
-          problems in a new way, linking learning across subjects and
-          disciplines.
-        </p>
-      </li>
-
-      <li>
-        <p>
-          <em>Collaboration</em> &mdash; Allows students and (if appropriate)
-          educators to work together to reach a goal.
-        </p>
-      </li>
-
-      <li>
-        <p>
-          <em>Communication</em> &mdash; Allows students to comprehend,
-          critique and share thoughts, questions, ideas, and solutions.
-        </p>
-      </li>
-    </ul>
-  </li>
-</ul>
-
-<p>
-  As you design and develop your apps, make sure they offer high educational
-  value by addressing as many of these characteristics as possible.
-</p>
-
-<div class="headerLine">
-  <h2 id="quality">
-    App Quality
-  </h2>
-
-
-</div>
-
-<div class="figure">
-  <img src="{@docRoot}images/gp-edu-quality.png">
-</div>
-
-<p>
-  Your apps should be designed to perform well and look great on Android
-  tablets, and they should offer the best user experience possible.
-</p>
-
-<p>
-  High quality apps are engaging, intuitive, and offer compelling content.
-  Google Play for Education will highlight high-quality apps for easy discovery
-  in the store. Here are some recommendations for making your app easy for
-  students and teachers to enjoy:
-</p>
-
-<ul>
-  <li>
-    <p>
-      Meet the Core Quality Guidelines:
-    </p>
-
-    <ul>
-      <li>
-        <p>
-          Follow <a href="{@docRoot}design/index.html">Android Design
-          Guidelines</a>. Pay special attention to the sections on <a href=
-          "{@docRoot}design/patterns/actionbar.html">Action Bar</a>, <a href=
-          "{@docRoot}design/patterns/navigation.html">Navigation</a>, and
-          <a href="{@docRoot}design/patterns/pure-android.html">Pure
-          Android</a>.
-        </p>
-      </li>
-
-      <li>
-        <p>
-          Test your apps against the <a href=
-          "{@docRoot}distribute/essentials/quality/core.html">Core Quality
-          Guidelines</a>.
-        </p>
-      </li>
-    </ul>
-  </li>
-
-  <li>
-    <p>
-      Meet the Tablet App Quality guidelines:
-    </p>
-
-    <ul>
-      <li>
-        <p>
-          Follow our best practices for tablet app development.
-        </p>
-      </li>
-
-      <li>
-        <p>
-          Review the <a href=
-          "{@docRoot}distribute/essentials/quality/tablets.html">Tablet App
-          Quality</a> guidelines and <a href=
-          "http://android-developers.blogspot.com/2012/11/designing-for-tablets-were-here-to-help.html">
-          blog post on designing for tablets.</a>
-        </p>
-
-        <ul>
-          <li>Check your Optimization Tips in the <a href=
-          "https://play.google.com/apps/publish/">Developer Console</a> (if
-          you've already uploaded your apps.)
-          </li>
-        </ul>
-      </li>
-
-      <li>
-        <p>
-          Strive for simplicity and highest usability for students:
-        </p>
-
-        <ul>
-          <li>
-            <p>
-              Design your app so that teachers and students can use all the
-              capabilities of your app without having to sign-in to multiple
-              accounts and remember multiple passwords.
-            </p>
-          </li>
-
-          <li>
-            <p>
-              Every student or teacher using a Google Play for Education tablet
-              will already be signed in with a Google account on the device.
-              You can take advantage of that to provide a simple, seamless
-              sign-in experience in your app. A recommended approach is to use
-              <a href="{@docRoot}google/play-services/auth.html">Google OAuth 2
-              authorization</a> through Google Play Services.
-            </p>
-          </li>
-        </ul>
-      </li>
-    </ul>
-  </li>
-</ul>
-
-<div class="headerLine">
-  <h2 id="test-environment">
-    Test Environment
-  </h2>
-
-
-</div>
-
-<p>
-  To test your app and assess it against the guidelines in this document, it's
-  recommended that you <a href=
-  "{@docRoot}distribute/essentials/quality/tablets.html#test-environment">set
-  up a test environment</a> that replicates the actual environment in which
-  students and teachers will run your app.
-</p>
-
-<h3>
-  Test conditions
-</h3>
-
-<p>
-  Make sure to test your apps under conditions that simulate those of schools.
-  For example, Google Play for Education lets administrators <a href=
-  "https://support.google.com/a/answer/182442?hl=en">control or disable certain
-  capabilities</a> for students, so it's good to test your app with those
-  capabilities disabled. Below are some conditions to test your apps for, to
-  ensure best results in the Google Play for Education environment:
-</p>
-
-<ul>
-  <li>
-    <p>
-      <em>Android version</em> &mdash; Test the apps on devices running Android
-      4.2. Google Play for Education devices will be running Android 4.2 or
-      higher (API level 17+).
-    </p>
-  </li>
-
-  <li>
-    <p>
-      <em>Proxy server</em> &mdash; Test the apps in a network environment that
-      uses proxies. Many schools use proxies.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      <em>No location services</em> &mdash; Test the apps to make sure they
-      work properly with location services disabled. Many schools will disable
-      location services for student devices.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      <em>No In-app Billing</em> &mdash; Test the apps to make sure they work
-      properly without access to In-app Billing. In-app purchases are blocked
-      on Google Play for Education devices.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      <em>No Bluetooth</em> &mdash; Test the apps to make sure they work
-      properly when Bluetooth is disabled. Many schools will disable Bluetooth
-      on student devices.
-    </p>
-  </li>
-
-  <li>
-    <p>
-      <em>No access to network</em> &mdash; Test the app to make sure it works
-      properly when the device cannot connect to the internet.
-    </p>
-  </li>
-</ul>
-
-<div class="headerLine">
-<h2>Related Resources</h2>
-</div>
-
-<div class="dynamic-grid">
-<h3>FOR DEVELOPERS</h3>
-
-<div class="resource-widget resource-flow-layout col-13"
-    data-query="collection:distribute/essentials/eduessentials/developers"
-    data-sortOrder="-timestamp"
-    data-cardSizes="6x3,6x3,6x3"
-    data-maxResults="6"></div>
-
-<h3>FOR TEACHERS AND EDUCATORS</h3>
-
-<div class="resource-widget resource-flow-layout col-13"
-    data-query="collection:distribute/essentials/eduessentials/educators"
-    data-sortOrder="-timestamp"
-    data-cardSizes="6x3,6x3,6x3"
-    data-maxResults="3"></div>
-</div>
\ No newline at end of file
diff --git a/docs/html/distribute/googleplay/edu/about.jd b/docs/html/distribute/googleplay/edu/about.jd
index e73356e..60d9402 100644
--- a/docs/html/distribute/googleplay/edu/about.jd
+++ b/docs/html/distribute/googleplay/edu/about.jd
@@ -9,7 +9,7 @@
 
 <p>
   Google Play for Education is an extension of Google Play designed for
-  schools. Here educators can discover apps approved by teachers for teachers,
+  schools. Here educators can discover Android and Chrome apps approved by teachers for teachers,
   as well as educational videos and a collection of classic books for their
   classroom.
 </p>
@@ -22,7 +22,7 @@
 </p>
 
 
-<div class="resource-widget resource-flow-layout col-13"
+<div class="resource-widget resource-flow-layout col-13" style="height:323px"
   data-query="collection:distribute/googleplay/gpfe/highlight"
   data-sortOrder="-timestamp"
   data-cardSizes="18x6,"
diff --git a/docs/html/distribute/googleplay/edu/faq.jd b/docs/html/distribute/googleplay/edu/faq.jd
deleted file mode 100644
index 36e2064..0000000
--- a/docs/html/distribute/googleplay/edu/faq.jd
+++ /dev/null
@@ -1,433 +0,0 @@
-page.title=Education FAQ
-meta.tags="gpfe, edu"
-page.metaDescription=Answers to frequent questions about Google Play for Education.
-page.image=/distribute/images/gpfe-faq.jpg
-
-@jd:body
-
-<div id="qv-wrapper">
-  <div id="qv">
-  <h2>
-    Topics
-  </h2>
-
-  <ol>
-    <li>
-    <a href="#business-model-and-monetization">Business Model and
-    Monetization</a>
-    </li>
-
-    <li>
-    <a href="#free-trials">Free Trials</a>
-    </li>
-
-    <li>
-    <a href="#discovery">Discovery</a>
-    </li>
-
-    <li>
-    <a href="#app-review-process">App Review Process</a>
-    </li>
-
-    <li>
-    <a href="#app-features">App Features</a>
-    </li>
-
-    <li>
-    <a href="#marketing-and-roi">Marketing and ROI</a>
-    </li>
-
-    <li>
-    <a href="#devices">Devices</a>
-    </li>
-
-    <li>
-    <a href="#accounts">Accounts</a>
-    </li>
-
-    <li>
-    <a href="#related-resources">Related Resources</a>
-    </li>
-  </ol>
-  </div>
-</div>
-
-<p>
-  This page provides answers to common questions that you might have about
-  Google Play for Education.
-</p>
-
-<div class="headerLine">
-  <h2 id="business-model-and-monetization">
-  Business Model and Monetization
-  </h2>
-
-
-</div>
-
-<p>
-  <strong>What is Google Play for Education?</strong>
-</p>
-
-<p>
-  Google Play for Education is a new online destination designed for schools.
-  Teachers can discover educational apps, books, and videos to meet the needs
-  of a single student, a classroom, or a whole district. Educators can browse
-  apps by grade, subject, keyword, or standard including Common Core State
-  Standards. Purchasing is done using a PO with no credit card required. Apps
-  are distributed to tablets instantly through the cloud.
-</p>
-
-<p>
-  <strong>Is Google Play for Education primarily for students or
-  educators?</strong>
-</p>
-
-<p>
-  The store on Google Play for Education is for educators, but its content is
-  for both educators and students. Teachers and administrators have the ability
-  to make purchases and control who within their school has access to the
-  purchase flows.
-</p>
-
-<div class="figure">
-  <img src="{@docRoot}distribute/images/gpfe-faq.jpg" style=
-  "width:480px;margin:1em 0em 1.5em 1.5em;">
-</div>
-
-<p>
-  <strong>Will Google Play for Education support subscription
-  purchases?</strong>
-</p>
-
-<p>
-  Currently, Google Play for Education supports one-time purchases. We’re
-  investigating additional purchase mechanisms to enable more flexible pricing
-  models for developers and schools.
-</p>
-
-<p>
-  <strong>Why is it recommended that in-app purchase features are
-  removed?</strong>
-</p>
-
-<p>
-  In-app Billing is currently not supported with Google Play for Education, and
-  a student device will block the Google Play transaction if a student attempts
-  to make an in-app purchase. To avoid confusing students, we recommend not
-  including any in-app purchase buttons and other UI in your apps. We’re
-  investigating additional purchase mechanisms to enable more flexible pricing
-  models for developers and schools.
-</p>
-
-<p>
-  <strong>Is Google Play for Education restricted so only its users can
-  purchase from the Google Play for Education? Or will anyone be able to
-  purchase from it?</strong>
-</p>
-
-<p>
-  Currently, only schools that are signed up for Google Play for Education can
-  make purchases on it.
-</p>
-
-<p>
-  <strong>Can I set different prices for my apps in Google Play for Education
-  and Google Play?</strong>
-</p>
-
-<p>
-  You set a single price for each app that applies to both Google Play and
-  Google Play for Education. You can’t set a different price for a given app
-  (based on a single package name) in Google Play for Education.
-</p>
-
-<div class="headerLine">
-  <h2 id="free-trials">
-  Free Trials
-  </h2>
-
-
-</div>
-
-<p>
-  <strong>Can I offer free trials through Google Play for Education?</strong>
-</p>
-
-<p>
-  Google Play for Education doesn't currently support free trials. If you want,
-  you can offer a free version of your app with limited functionality in Google
-  Play for Education, but that app would need to be separate from your paid app
-  and be reviewed separately for educational content.
-</p>
-
-<p>
-  <strong>Can I offer a free trial through Google Play's "In-app Subscriptions
-  with Free Trials" feature?</strong>
-</p>
-
-<p>
-  Google Play for Education doesn’t currently support In-app Billing or In-app
-  Subscriptions with free trials.
-</p>
-
-<div class="headerLine">
-  <h2 id="discovery">
-  Discovery
-  </h2>
-
-
-</div>
-
-<p>
-  <strong>What are the categories in Google Play for Education?</strong>
-</p>
-
-<p>
-  Google Play for Education includes categories for all grade levels from
-  Kindergarten to 12 and the following subjects: English Language Arts, World
-  Languages, Mathematics, Science, Social Science, Elective, Open Education
-  Resources (OER), and Tools.
-</p>
-
-<p>
-  <strong>I created an app specifically for Google Play for Education and don’t
-  want it to show up in Google Play. Is this possible?</strong>
-</p>
-
-<p>
-  Currently, it’s not possible to publish an app on Google Play for Education
-  and make it unavailable on Google Play.
-</p>
-
-<p>
-  <strong>If my app offers content for every level of education, how will it
-  fit the Common Core State Standard filters?</strong>
-</p>
-
-<p>
-  If your app applies to multiple levels of education, then the app will show
-  up in filtered results for multiple levels.
-</p>
-
-<div class="headerLine">
-  <h2 id="app-review-process">
-  App Review Process
-  </h2>
-
-
-</div>
-
-<p>
-  <strong>How are apps being reviewed? By whom and against what
-  criteria?</strong>
-</p>
-
-<p>
-  Apps are being reviewed by a third-party network of educators. These
-  educators assign the appropriate subject, grade, and Common Core State
-  Standards metadata, as well as evaluating whether the app meets the Google
-  Play for Education <a href=
-  "{@docRoot}distribute/essentials/gpfe-guidelines.html">criteria for classroom
-  use</a>.
-</p>
-
-<p>
-  <strong>How do I update my apps in Google Play for Education?</strong>
-</p>
-
-<p>
-  You can update your apps on Google Play for Education in the same manner you
-  do on Google Play. App updates will not be reviewed prior to being made
-  available through Google Play for Education. However, we will periodically
-  review updated apps for quality.
-</p>
-
-<p>
-  <strong>Does the app maturity rating reflect solely on what a user can do
-  within my Android app, or does the web version of my app influence the rating
-  as well?</strong>
-</p>
-
-<p>
-  The maturity rating that you set for an Android app refers only to the
-  content displayed in that app.
-</p>
-
-<div class="headerLine">
-  <h2 id="app-features">
-  App Features
-  </h2>
-
-
-</div>
-
-<p>
-  <strong>Do I need separate builds of my phone and tablet apps for Google Play
-  for Education, or is it the exact same app that lives on Google
-  Play?</strong>
-</p>
-
-<p>
-  We recommend you create one app and use it in both Google Play and Google
-  Play for Education.
-</p>
-
-<p>
-  <strong>What is the best way to get students’ work within apps sent back to
-  their teachers?</strong>
-</p>
-
-<p>
-  Teachers have mentioned that many apps achieve this by email from a third
-  party, which isn’t optimal for schools. As many schools use Google Apps for
-  Education, consider integrating your apps with Google Drive using the
-  <a href="https://developers.google.com/drive/about-sdk">SDK</a>.
-</p>
-
-<p>
-  <strong>How can developers test the teacher experience in Google Play for
-  Education? Is there a way to get an account to test it?</strong>
-</p>
-
-<p>
-  Currently, we are unable to provide developers with a test account to test
-  the Google Play for Education user experience. We’re investigating ways to
-  allow developers to simulate the environment.
-</p>
-
-<p>
-  <strong>If I already have an app in the Chrome Apps Pack will I get some help
-  migrating this to Android?</strong>
-</p>
-
-<p>
-  If you’d like to reach tablet users in schools we encourage you to build a
-  native app for the optimal user experience. Considerations for building your
-  apps can be found in the <a href=
-  "{@docRoot}distribute/essentials/gpfe-guidelines.html">Google Play for
-  Education Guidelines</a>.
-</p>
-
-<div class="headerLine">
-  <h2 id="marketing-and-roi">
-  Marketing and ROI
-  </h2>
-
-
-</div>
-
-<p>
-  <strong>What are you doing to promote these apps to educators?</strong>
-</p>
-
-<p>
-  Google Play for Education is an extension of Google Play targeting schools
-  and making the discovery of educational apps easier. It helps your apps gain
-  visibility with the right audiences, without having to knock on school doors.
-  We’re constantly referring to the highest quality apps in our educator
-  outreach. We’ve also developed a series of collections to help educators
-  quickly browse apps for the most common use cases.
-</p>
-
-<p>
-  <strong>How many installs have similar apps had on Google Play for Education?
-  How much can I expect to make if I do an ROI analysis?</strong>
-</p>
-
-<p>
-  While we cannot disclose specific numbers, Google Play app listings provide
-  app download ranges for all apps.
-</p>
-
-<p>
-  <strong>What is the seasonality like for the education market? What are the
-  key timing considerations for app developers?</strong>
-</p>
-
-<p>
-  In the United States, school districts’ budget decisions go through a
-  planning phase in the Spring with budgets being released on July 1. We’ve
-  observed high purchase-volumes in the second quarter of the calendar year, to
-  use up end-of-year budgets. New budget purchases begin in the third quarter
-  of the calendar year.
-</p>
-
-<p>
-  <strong>Is there a way to offer a special deal, such as a discount, only on
-  Google Play for Education and not on Google Play?</strong>
-</p>
-
-<p>
-  No, this isn’t possible. Pricing, including special offers, must be the same
-  between Google Play for Education and Google Play.
-</p>
-
-<div class="headerLine">
-  <h2 id="devices">
-  Devices
-  </h2>
-
-
-</div>
-
-<p>
-  <strong>Which devices are available in the program? Will more be
-  available?</strong>
-</p>
-
-<p>
-  Nexus 7 is available for shipment now, and the Asus Transformer, HP Slate 8
-  Pro, and Galaxy Tab for Education will be available in early 2014. We look
-  forward to welcoming more Android devices into the Google in Education family
-  soon.
-</p>
-
-<p>
-  <strong>Can the devices be shared among many students?</strong>
-</p>
-
-<p>
-  No. Currently, this program is for one-to-one use. Each student can login to
-  one specific tablet that is allocated to them.
-</p>
-
-<div class="headerLine">
-  <h2 id="accounts">
-  Accounts
-  </h2>
-
-
-</div>
-
-<p>
-  <strong>Will an app know whether a user is a teacher or student?</strong>
-</p>
-
-<p>
-  No, the app has no mechanism for knowing if it’s running on a teacher’s
-  device or a student’s device. We recommend developers use their own user
-  database to enable this feature, where logins can be based on Google Account
-  information.
-</p>
-
-<p>
-  <strong>What log-in method do you recommend for an app on Google Play for
-  Education?</strong>
-</p>
-
-<p>
-  One of the key pieces of feedback we’ve heard multiple times from various
-  schools is that they prefer apps that offer Google Single Sign-on, so that
-  teachers and students don’t need to remember multiple log-in credentials. As
-  schools in the program use Google Accounts and Google Apps for Education,
-  offering Google Single Sign-on is ideal.
-</p>
-<div class="headerLine"><h2 id="related-resources">Related Resources</h2></div>
-
-<div class="resource-widget resource-flow-layout col-13"
-  data-query="collection:distribute/toolsreference/gpfefaq"
-  data-sortOrder="-timestamp"
-  data-cardSizes="6x3,6x3,6x3,9x3,9x3,9x3"
-  data-maxResults="6"></div>
-
diff --git a/docs/html/distribute/googleplay/edu/start.jd b/docs/html/distribute/googleplay/edu/start.jd
index 4886b5a..136611c 100644
--- a/docs/html/distribute/googleplay/edu/start.jd
+++ b/docs/html/distribute/googleplay/edu/start.jd
@@ -1,4 +1,4 @@
-page.title=Get Started with Education
+page.title=Publish Android Apps for Education
 page.image=/distribute/images/play-education.jpg
 meta.tags="education", "guidelines", "quality"
 page.tags="education", "addendum"
@@ -16,21 +16,23 @@
 </ol>
 </div></div>
 <p>
-  If you've got great apps for education and want to reach even more teachers
+  If you've got great Android apps for education and want to reach even more teachers
   and students, you can join the <strong>Google Play for Education</strong>
   program in a few simple steps. You do everything using the familiar tools and
   processes in Google Play.
 </p>
 
 <p>
-  Note that Google Play for Education is currently available to <strong>K-12
-  schools in the United States</strong> only.
+Note that Google Play for Education is currently available to <strong>K-12 schools in the United
+States</strong> only.</p>
+
+<p>If you have an educational Chrome app instead of an Android app, you can learn more about
+Chrome Apps in Google Play for Education at <a href=
+"https://developers.google.com/edu">developers.google.com/edu</a>.
 </p>
 
-<div class="center-img">
-  <img src="{@docRoot}images/gpfe-start-0.jpg" style=
-  "border:1px solid #ddd;padding:0px;width:100%;">
-</div>
+<img src="{@docRoot}images/gpfe-start-0.jpg" style=
+  "border:1px solid #ddd;padding:0px" width="760" height="403">
 
 <div class="headerLine">
   <h2 id="register">
diff --git a/docs/html/distribute/googleplay/googleplay_toc.cs b/docs/html/distribute/googleplay/googleplay_toc.cs
index 4196c39..36e424a 100644
--- a/docs/html/distribute/googleplay/googleplay_toc.cs
+++ b/docs/html/distribute/googleplay/googleplay_toc.cs
@@ -25,13 +25,7 @@
   </li>
   <li class="nav-section">
     <div class="nav-section empty" style="font-weight:normal"><a href="<?cs var:toroot?>distribute/googleplay/edu/start.html">
-          <span class="en">Get Started with Education</span>
-        </a>
-    </div>
-  </li>
-  <li class="nav-section">
-    <div class="nav-section empty" style="font-weight:normal"><a href="<?cs var:toroot?>distribute/googleplay/edu/faq.html">
-          <span class="en">Education FAQ</span>
+          <span class="en">Publish Android Apps for Education</span>
         </a>
     </div>
   </li>
diff --git a/docs/html/distribute/monetize/ads.jd b/docs/html/distribute/monetize/ads.jd
index bcb1e52..9a847ff 100644
--- a/docs/html/distribute/monetize/ads.jd
+++ b/docs/html/distribute/monetize/ads.jd
@@ -10,17 +10,32 @@
 </div>
 
 <p>
-  In-app advertising offers a quick and easy way to incorporate a monetization
-  option into both your <a href=
+  Ads can be a quick and easy way to earn more from your <a href=
   "{@docRoot}distribute/monetize/freemium.html">freemium</a>, <a href=
   "{@docRoot}distribute/monetize/premium.html">premium</a>, and <a href=
-  "{@docRoot}distribute/monetize/subscriptions.html">subscription</a> apps. </p>
+  "{@docRoot}distribute/monetize/subscriptions.html">subscription</a> apps.
+  AdMob and the Google Mobile Ads SDK let you add advertising to your apps with
+  just a few lines of code.
+</p>
 
-<p>Using <a href=
+<p>
+  The question is: which model gets the best results for your app? Google's ad
+  tools are made to help you figure out what combination works best for both
+  your audience and your bottom line. </p>
+
+<p>Start by linking your AdMob and Google
+  Analytics accounts to get better insights and more earning power: for
+  instance, AdMob can promote in-app purchases to the people who buy them most
+  often, while showing income-generating ads to those less likely to buy right
+  now.
+</p>
+
+<p>
+  Using <a href=
   "http://www.google.com/ads/admob/monetize.html#subid=us-en-et-dac">AdMob</a>
-  and the <a href="{@docRoot}google/play-services/ads.html">Google
-  Mobile Ads SDK</a> included in Google Play Services, you’re able to add
-  advertising into your apps, with just a few lines of code.
+  and the <a href="{@docRoot}google/play-services/ads.html">Google Mobile Ads
+  SDK</a> included in Google Play Services, you’re able to add advertising into
+  your apps, with just a few lines of code.
 </p>
 
 <p>
@@ -30,36 +45,33 @@
 <ul>
   <li>
     <p>
-      <strong>Placement within your apps</strong> &mdash; Well placed ads will
-      optimize your revenue by making it more likely that users will ‘click
-      through’. Poorly placed ads can result in low click-through rates, and in
-      the worse cases poor rating and users rapidly abandoning your apps. You
-      can get advice on how to best place ads from the developer training on
-      <a href=
-      "{@docRoot}training/monetization/ads-and-ux.html">using
-      ads</a>.
+      <strong>Placement within your apps</strong> &mdash; Well-placed ads make
+      it more likely that users will click through and convert. Poorly-placed
+      ads lead to lower click-through rates, and even poor ratings and users
+      abandoning your apps. Our <a href=
+      "{@docRoot}training/monetization/ads-and-ux.html">developer training</a>
+      on using ads shows some of the best ways to place ads.
     </p>
   </li>
 
   <li>
     <p>
       <strong>Ad formats</strong> &mdash; Every app offers a different type of
-      experience for users, so it’s important to consider the format of ads
-      you’re using to ensure it’s compatible with the experience. While banner
-      ads may work well for a flashlight utility app, an immersive gaming app
-      may benefit more from a video interstitial. Mismatched ad formats may
-      negatively affect your users’ experience and ad revenue, so try to select
-      formats that fit well with the content and flow of your apps.
+      experience for users, so it’s important that your ad formats match that
+      experience. While banner ads may work well for a flashlight utility app,
+      an immersive gaming app may benefit more from a video interstitial.
+      Mismatched ad formats can make users unhappy and leave money on the
+      table.
     </p>
   </li>
 
   <li>
     <p>
-      <strong>Maximizing your performance</strong> &mdash; Ensure you’re optimizing
-      your advertising revenue by maximizing your CPMs <em>and</em> fill rate.
-      Often ad providers will cite very high CPMs but will have a low fill rate
-      that can severely decrease your effective CPM, so look at both of these
-      figures. Also consider using a <a href=
+      <strong>Maximizing your performance</strong> &mdash; Make sure you’re
+      optimizing your advertising revenue by maximizing your CPMs and fill
+      rate. Ad providers often cite their very high CPMs but don't mention low
+      fill rates that can severely decrease your effective CPM. Be sure to look
+      at both of these figures. Consider using a <a href=
       "https://support.google.com/admob/v2/answer/3063564?hl=en&amp;ref_topic=3063091#subid=us-en-et-dac">
       mediation</a> solution if you’d like to use multiple ad providers in your
       apps. Look for solutions that offer yield management or <a href=
@@ -71,30 +83,43 @@
 
   <li>
     <p>
-      <strong>Exercising control options</strong> &mdash; A variety of ads promoting a
-      broad selection of other services or apps may show up within you apps.
-      Depending on your goals and the type of experience you want to provide
-      your users, it may make sense to <a href=
+      <strong>Exercising control options</strong> &mdash; A variety of ads may
+      show up within your app. It may make sense to <a href=
       "https://support.google.com/admob/v2/answer/3150235?hl=enl#subid=us-en-et-dac">
-      block</a> certain advertisements from appearing. Some developers don’t
-      want apps in a similar category showing to their users, but some don’t
-      mind.
+      block</a> certain of those advertisements from appearing, depending on
+      your goals and the type of experience you want to provide. Some
+      developers, for instance, don’t want ads for apps in their same category
+      showing to their users, while others don’t mind at all.
     </p>
   </li>
 
   <li>
     <p>
-      <strong>Cross promoting your other apps</strong> &mdash; Ads can be used for
-      more than just earning revenue. Consider using <a href=
+      <strong>Cross promoting your other apps</strong> &mdash; Ads can do more
+      than earn revenue. Consider running <a href=
       "https://support.google.com/admob/v2/answer/3210452?hl=en#subid=us-en-et-dac">
-      house ads</a> within your apps to create awareness and promote your
-      entire portfolio of apps. When launching new apps, an easy way to quickly
-      attract users is to promote directly to your existing customers.
+      house ads</a> within your apps to promote other apps in your portfolio.
+      When you launch a new app, this kind of promotion is a free and easy way
+      to attract new users quickly.
     </p>
   </li>
 </ul>
 
 <p>
+  Don't forget that paid channels like AdWords and YouTube can help you cast a
+  wider net by reaching targeted audiences outside the app ecosystem. They're a
+  great way to find new users at a price that you control. <a href=
+  "https://support.google.com/adwords/answer/2549053">Learn more</a>.
+</p>
+
+<p>
+  To start monetizing with ads, sign up for AdMob and integrate the Google
+  Mobile Ads SDK into your apps. If you also need to manage direct deals with
+  advertisers, consider using DoubleClick for Publishers Small Business.
+</p>
+
+
+<p>
   To start monetizing with ads sign up for <a href=
   "http://www.google.com/ads/admob/#subid=us-en-et-dac">AdMob</a> and integrate
   the <a href="https://developers.google.com/mobile-ads-sdk/download">Google
diff --git a/docs/html/distribute/users/index.jd b/docs/html/distribute/users/index.jd
index 77ef609..a810f36 100644
--- a/docs/html/distribute/users/index.jd
+++ b/docs/html/distribute/users/index.jd
@@ -14,8 +14,8 @@
 
 <div class="resource-widget resource-flow-layout landing col-16"
   data-query="collection:distribute/users"
-  data-cardSizes="6x6, 6x6, 6x6, 9x6, 9x6, 6x6, 6x6, 6x6"
-  data-maxResults="8">
+  data-cardSizes="6x6"
+  data-maxResults="6">
 </div>
 
 <h3>Related resources</h3>
diff --git a/docs/html/distribute/users/promote-with-ads.jd b/docs/html/distribute/users/promote-with-ads.jd
new file mode 100644
index 0000000..1e28ae1
--- /dev/null
+++ b/docs/html/distribute/users/promote-with-ads.jd
@@ -0,0 +1,45 @@
+page.title=Promote Your App with Ads
+page.metaDescription=Promote your app through AdMob, AdWords, and YouTube to find new users at the right moment.
+page.image=/images/gp-ads-console.jpg
+page.tags="users, ads, analytics"
+
+@jd:body
+
+<p>
+  AdMob is Google's advertising platform for mobile apps. You can use it to
+  monetize your app and promote your apps, and you can link your Google
+  Analytics account to AdMob so you can analyze your apps &mdash; all in one
+  place.
+</p>
+
+<p>
+  <a href="http://www.google.com/ads/admob/">AdMob</a> is the largest mobile ad
+  app network. But you get more than just massive scale: AdMob will soon help
+  you find the right users in related apps. If your app is for bicycling, AdMob
+  can promote your app on other fitness and cycling-related apps worldwide.
+  <a href=
+  "https://apps.admob.com/admob/signup?subid=us-en-et-dac&_adc=ww-ww-et-admob2&hl=en">
+  Sign up for AdMob</a>.
+</p>
+
+<p>
+  AdMob also offers new solutions to help you achieve app-related goals such as
+  downloads, re-engagement and in-app purchases using Google search and the
+  Google Display Network. These solutions include streamlined campaign creation
+  flows and tools to track performance across the entire app lifecycle.
+  <a href="https://support.google.com/adwords/answer/2549053?hl=en">Learn
+  More</a>.
+</p>
+<div style="margin-top:2em;">
+  <img src="{@docRoot}images/gp-ads-console.jpg">
+</div>
+
+<div class="headerLine">
+<h2 id="related-resources">Related Resources</h2>
+</div>
+
+<div class="resource-widget resource-flow-layout col-13"
+  data-query="collection:distribute/users/promotewithads"
+  data-sortOrder="-timestamp"
+  data-cardSizes="9x3"
+  data-maxResults="6"></div>
\ No newline at end of file
diff --git a/docs/html/distribute/users/users_toc.cs b/docs/html/distribute/users/users_toc.cs
index a2437a6..1f173cb 100644
--- a/docs/html/distribute/users/users_toc.cs
+++ b/docs/html/distribute/users/users_toc.cs
@@ -28,7 +28,12 @@
         </a>
     </div>
   </li>
-
+  <li class="nav-section">
+    <div class="nav-section empty" style="font-weight:normal"><a href="<?cs var:toroot?>distribute/users/promote-with-ads.html">
+          <span class="en">Promote with Ads</span>
+        </a>
+    </div>
+  </li>
 </ul>
 
 
diff --git a/docs/html/google/play-services/index.jd b/docs/html/google/play-services/index.jd
index f5d4574..eec4f5a 100644
--- a/docs/html/google/play-services/index.jd
+++ b/docs/html/google/play-services/index.jd
@@ -11,10 +11,8 @@
 <div class="col-6">
 
   <h1 itemprop="name" style="margin-bottom:0;">Google Play Services</h1>
-  <p itemprop="description">
-  </p>
-
-  <p>Give your apps more features to attract users on a wider range of devices.
+  <p itemprop="description">Give your apps more features to attract users
+  on a wider range of devices.
   With Google Play services, your app can take advantage
   of the latest, Google-powered features such as Maps, Google+, and more,
   with automatic platform updates distributed as an APK through
diff --git a/docs/html/google/play-services/setup.jd b/docs/html/google/play-services/setup.jd
index d502e8d..744e191 100644
--- a/docs/html/google/play-services/setup.jd
+++ b/docs/html/google/play-services/setup.jd
@@ -95,7 +95,9 @@
   <li>Open the <code>build.gradle</code> file inside your application module directory. 
       <p class="note"><strong>Note:</strong> Android Studio projects contain a top-level 
       <code>build.gradle</code> file and a <code>build.gradle</code> file for each module. 
-      Be sure to edit the file for your application module.</p></li>
+      Be sure to edit the file for your application module. See
+      <a href="{@docRoot}sdk/installing/studio-build.html">Building Your Project with
+      Gradle</a> for more information about Gradle.</p></li>
   <li>Add a new build rule under <code>dependencies</code> for the latest version of
 <code>play-services</code>. For example:
 <pre class="no-pretty-print">
diff --git a/docs/html/guide/guide_toc.cs b/docs/html/guide/guide_toc.cs
index 0a234aa..ea36405 100644
--- a/docs/html/guide/guide_toc.cs
+++ b/docs/html/guide/guide_toc.cs
@@ -373,6 +373,9 @@
             <li><a href="<?cs var:toroot ?>guide/topics/media/mediarouteprovider.html">
                   <span class="en">Media Route Provider</span></a>
                 </li>
+            <li><a href="<?cs var:toroot ?>guide/topics/media/exoplayer.html">
+                  <span class="en">ExoPlayer</span></a>
+                </li>
             <li><a href="<?cs var:toroot ?>guide/appendix/media-formats.html">
                    <span class="en">Supported Media Formats</span></a>
                 </li>
@@ -564,7 +567,11 @@
       <li><a href="<?cs var:toroot ?>guide/practices/tablets-and-handsets.html">
             <span class="en">Supporting Tablets and Handsets</span>
           </a></li>
-
+      <li>
+        <a href="<?cs var:toroot ?>guide/practices/verifying-apps-art.html">
+          <span class="en">Verifying App Behavior on ART</span>
+        </a>
+      </li>
     </ul>
   </li>
 
diff --git a/docs/html/guide/practices/verifying-apps-art.jd b/docs/html/guide/practices/verifying-apps-art.jd
new file mode 100644
index 0000000..8a88222
--- /dev/null
+++ b/docs/html/guide/practices/verifying-apps-art.jd
@@ -0,0 +1,296 @@
+page.title=Verifying App Behavior on the Android Runtime (ART)
+@jd:body
+
+<div id="qv-wrapper">
+<div id="qv">
+<h2>Quickview</h2>
+  <ul>
+    <li>The new Android runtime (ART) is available on some of the newest Android
+      devices, though all of them currently have Dalvik as the default
+      runtime.</li>
+    <li>App developers should make sure their apps are compatible with ART,
+      especially if you use JNI to run native code or if you use certain tools
+      that produce non-standard code (such as some obfuscators).</li>
+  </ul>
+
+  <h2 id="Contents">In this document</h2>
+ <ol>
+    <li><a href="#GC_Migration">Addressing Garbage Collection (GC) Issues</a></li>
+    <li><a href="#JNI_Issues">Preventing JNI Issues</a>
+      <ol>
+        <li><a href="#JNI_and_GC">Checking JNI code for garbage-collection
+          issues</a></li>
+        <li><a href="#Error_Handling">Error handling</a></li>
+        <li><a href="#Object_Model_Changes">Object model changes</a></li>
+      </ol>
+    </li>
+    <li><a href="#Stack_Size">Preventing Stack Size Issues</a></li>
+    <li><a href="#AOT_Fails">Fixing AOT Compilation Issues</a></li>
+    <li><a href="#Reporting_Problems">Reporting Problems</a></li>
+  </ol>
+  <h2>See also</h2>
+  <ol>
+    <li><a href="http://source.android.com/devices/tech/dalvik/art.html">Introducing ART</a></li>
+    <li><a
+href="http://android-developers.blogspot.com/2011/07/debugging-android-jni-with-checkjni.html">Debugging
+Android JNI with CheckJNI</a></li>
+  </ol>
+</div>
+</div>
+
+<p>With Android 4.4, we are beginning to roll out a new Android runtime,
+<strong>ART</strong>. This runtime offers a number of new features that improve
+performance and smoothness of the Android platform and apps. (You can find more
+information about ART's new features in <a
+href="http://source.android.com/devices/tech/dalvik/art.html">Introducing
+ART</a>.)</p>
+
+<p>Currently, ART is available on a number of Android 4.4 devices, such as the
+Nexus 4, Nexus 5, Nexus 7, and Google Play edition devices.
+At this time, all devices still use Dalvik as the default runtime. We encourage
+you to test your apps for ART compatibility and to take advantage of ART's new
+features. However, for the time being, you should also take care to maintain
+compatibility with Dalvik.</p>
+
+<p>This document lets you know about things to watch for when migrating an
+existing app to be compatible with ART. Most apps should just work when
+running with ART. However, some techniques that work on Dalvik do not work on
+ART. This document discusses some of these issues.</p>
+
+<h2 id="GC_Migration">Addressing Garbage Collection (GC) Issues</h2>
+
+<p>Under Dalvik, apps frequently find it useful to explicitly call {@link
+java.lang.System#gc() System.gc()} to prompt garbage collection (GC). This should be
+far less necessary with ART, particularly if you're invoking garbage collection
+to prevent <a
+href="{@docRoot}/tools/debugging/debugging-memory.html#LogMessages"><code>GC_FOR_ALLOC</code></a>-type
+occurrences or to reduce fragmentation. You can verify which runtime is in use
+by calling {@link java.lang.System#getProperty(java.lang.String)
+System.getProperty("java.vm.version")}. If ART is in use, the property's value
+is <code>"2.0.0"</code> or higher.</p>
+
+<p>Furthermore, a compacting garbage collector is under development in the <a
+href="https://source.android.com">Android Open-Source Project (AOSP)</a> to
+improve memory management. Because of this, you should avoid using techniques
+that are incompatible with compacting GC (such as saving pointers to object
+instance data). This is particularly important for apps that make use of the
+Java Native Interface (JNI). For more information, see <a
+href="#JNI_Issues">Preventing JNI Issues</a>.</p>
+
+<h2 id="JNI_Issues">Preventing JNI Issues</h2>
+
+<p>ART's JNI is somewhat stricter than Dalvik's. It is an especially good idea
+to use CheckJNI mode to catch common problems. If your app makes use of C/C++
+code, you should review the following article:</p>
+
+<p><a
+href="http://android-developers.blogspot.com/2011/07/debugging-android-jni-with-checkjni.html">Debugging
+Android JNI with CheckJNI</a></p>
+
+<h3 id="JNI_and_GC">Checking JNI code for garbage-collection issues</h3>
+
+<p>ART has a compacting garbage collector under development on the
+Android Open Source Project (AOSP). Once the compacting garbage collector is in
+use, objects may be moved in memory. If you use C/C++ code, do not
+perform operations that are incompatible with compacting GC. We have enhanced
+CheckJNI to identify some potential issues (as described in <a
+href="http://android-developers.blogspot.com/2011/11/jni-local-reference-changes-in-ics.html">JNI
+Local Reference Changes in ICS</a>).</p>
+
+<p>One area to watch for in particular is the use of
+<code>Get...ArrayElements()</code> and <code>Release...ArrayElements()</code>
+functions. In runtimes with non-compacting GC, the
+<code>Get...ArrayElements()</code> functions typically return a reference to the
+actual memory backing the array object. If you make a change to one of the
+returned array elements, the array object is itself changed (and the arguments
+to <code>Release...ArrayElements()</code> are usually ignored). However, if
+compacting GC is in use, the <code>Get...ArrayElements()</code> functions may
+return a copy of the memory. If you misuse the reference when compacting GC is
+in use, this can lead to memory corruption or other problems. For example:</p>
+
+<ul>
+
+  <li>If you make any changes to the returned array elements, you must call the
+  appropriate <code>Release...ArrayElements()</code> function when you are done,
+  to make sure the changes you made are correctly copied back to the underlying
+  array object.</li>
+
+  <li>When you release the memory array elements, you must use the appropriate
+  mode, depending on what changes you made:
+
+    <ul>
+
+      <li>If you did not make any changes to the array elements, use
+      <code>JNI_ABORT</code> mode, which releases the memory without copying
+      changes back to the underlying array object.</li>
+
+      <li>If you made changes to the array, and do not need the reference any
+      more, use code <code>0</code> (which updates the array object and frees
+      the copy of the memory).</li>
+
+      <li>If you made changes to the array that you want to commit, and you want
+      to keep the copy of the array, use <code>JNI_COMMIT</code> (which updates
+      the underlying array object and retains the copy).</li>
+
+    </ul>
+
+  </li>
+
+  <li>When you call <code>Release...ArrayElements()</code>, return the same
+  pointer that was originally returned by <code>Get...ArrayElements()</code>. For
+  example, it's not safe to increment the original pointer (to scan through the
+  returned array elements) then pass the incremented pointer to
+  <code>Release...ArrayElements()</code>. Passing this modified pointer can cause
+  the wrong memory to be freed, resulting in memory corruption.</li>
+
+</ul>
+
+<h3 id="Error_Handling">Error handling</h3>
+
+<p>ART's JNI throws errors in a number of cases where Dalvik didn’t. (Once
+again, you can catch many such cases by testing with CheckJNI.)</p>
+
+<p>For example, if <code>RegisterNatives</code> is called with a method that
+does not exist (perhaps because the method was removed by a tool such as
+<strong>ProGuard</strong>), ART now properly throws {@link
+java.lang.NoSuchMethodError}:</p>
+
+<pre class="no-pretty-print">
+08-12 17:09:41.082 13823 13823 E AndroidRuntime: FATAL EXCEPTION: main
+08-12 17:09:41.082 13823 13823 E AndroidRuntime: java.lang.NoSuchMethodError:
+    no static or non-static method
+    "Lcom/foo/Bar;.native_frob(Ljava/lang/String;)I"
+08-12 17:09:41.082 13823 13823 E AndroidRuntime:
+    at java.lang.Runtime.nativeLoad(Native Method)
+08-12 17:09:41.082 13823 13823 E AndroidRuntime:
+    at java.lang.Runtime.doLoad(Runtime.java:421)
+08-12 17:09:41.082 13823 13823 E AndroidRuntime:
+    at java.lang.Runtime.loadLibrary(Runtime.java:362)
+08-12 17:09:41.082 13823 13823 E AndroidRuntime:
+    at java.lang.System.loadLibrary(System.java:526)
+</pre>
+
+<p>ART also logs an error (visible in logcat) if <code>RegisterNatives</code> is
+called with no methods:</p>
+
+<pre class="no-pretty-print">
+W/art     ( 1234): JNI RegisterNativeMethods: attempt to register 0 native
+methods for &lt;classname>
+</pre>
+
+<p>In addition, the JNI functions <code>GetFieldID()</code> and
+<code>GetStaticFieldID()</code> now properly throw {@link java.lang.NoSuchFieldError}
+instead of simply returning null. Similarly, <code>GetMethodID()</code> and
+<code>GetStaticMethodID()</code> now properly throw {@link java.lang.NoSuchMethodError}.
+This can lead to CheckJNI failures because of the unhandled exceptions or the
+exceptions being thrown to Java callers of native code. This makes it
+particularly important to test ART-compatible apps with CheckJNI mode.</p>
+
+<p>ART expects users of the JNI <code>CallNonvirtual...Method()</code> methods
+(such as <code>CallNonvirtualVoidMethod()</code>) to use the method's declaring
+class, not a subclass, as required by the JNI specification.</p>
+
+<h2 id="Stack_Size">Preventing Stack Size Issues</h2>
+
+<p>Dalvik had separate stacks for native and Java code, with a default Java
+stack size of 32KB and a default native stack size of 1MB. ART has a unified
+stack for better locality. Ordinarily, the ART {@link java.lang.Thread} stack
+size should be approximately the same as for Dalvik. However, if you explicitly
+set stack sizes, you may need to revisit those values for apps running in
+ART.</p>
+
+<ul>
+
+  <li>In Java, review calls to the {@link
+  java.lang.Thread#Thread(java.lang.ThreadGroup, java.lang.Runnable,
+  java.lang.String, long) Thread} constructor that specify an explicit stack
+  size. For example, you will need to increase the size if {@link
+  java.lang.StackOverflowError} occurs.</li>
+
+  <li>In C/C++, review use of <code>pthread_attr_setstack()</code> and
+  <code>pthread_attr_setstacksize()</code> for threads that also run Java code via
+  JNI. Here is an example of the error logged when an app attempts to call JNI
+  <code>AttachCurrentThread()</code> when the pthread size is too small:
+
+<pre class="no-pretty-print">F/art: art/runtime/thread.cc:435]
+    Attempt to attach a thread with a too-small stack (16384 bytes)</pre>
+  </li>
+
+</ul>
+
+<h2 id="Object_Model_Changes">Object model changes</h2>
+
+<p>Dalvik incorrectly allowed subclasses to override package-private methods.
+ART issues a warning in such cases:</p>
+
+<pre class="no-pretty-print">
+Before Android 4.1, method void com.foo.Bar.quux()
+would have incorrectly overridden the package-private method in
+com.quux.Quux
+</pre>
+
+<p>If you intend to override a class's method in a different package, declare the
+method as <code>public</code> or <code>protected</code>.</p>
+
+<p>{@link java.lang.Object} now has private fields. Apps that reflect on fields
+in their class hierarchies should be careful not to attempt to look at the
+fields of {@link java.lang.Object}. For example, if you are iterating up a class
+hierarchy as part of a serialization framework, stop when
+
+<pre>Class.getSuperclass() == java.lang.Object.class</pre>
+
+instead of continuing until the method returns <code>null</code>.</p>
+
+<p>Proxy {@link
+java.lang.reflect.InvocationHandler#invoke(java.lang.Object,java.lang.reflect.Method,java.lang.Object[])
+InvocationHandler.invoke()} now receives <code>null</code> if there are no
+arguments instead of an empty array. This behavior was documented previously but
+not correctly handled in Dalvik. Previous versions of <a
+href="https://code.google.com/p/mockito/">Mockito</a> have difficulties with
+this, so use an updated Mockito version when testing with ART.</p>
+
+<h2 id="AOT_Fails">Fixing AOT Compilation Issues</h2>
+
+<p>ART's Ahead-Of-Time (AOT) Java compilation should work for all standard Java
+code. Compilation is performed by ART's
+<code>dex2oat</code> tool; if you encounter any issues related to
+<code>dex2oat</code> at install time, let us know (see <a
+href="#Reporting_Problems">Reporting Problems</a>) so we can fix them as quickly
+as possible. A couple of issues to note:</p>
+
+<ul>
+
+  <li>ART does tighter bytecode verification at install time than Dalvik does.
+  Code produced by the Android build tools should be fine. However, some
+  post-processing tools (especially tools that perform obfuscation) may produce
+  invalid files that are tolerated by Dalvik but rejected by ART. We have been
+  working with tool vendors to find and fix such issues. In many cases, getting
+  the latest versions of your tools and regenerating the DEX files can fix these
+  problems.</li>
+
+  <li>Some typical problems that are flagged by the ART verifier include:
+    <ul>
+      <li>invalid control flow</li>
+      <li>unbalanced <code>moniterenter</code>/<code>moniterexit</code></li>
+      <li>0-length parameter type list size</li>
+    </ul>
+  </li>
+
+  <li>Some apps have dependencies on the installed <code>.odex</code> file
+  format in <code>/system/framework</code>, <code>/data/dalvik-cache</code>, or
+  in {@link dalvik.system.DexClassLoader}’s optimized output directory. These
+  files are now ELF files and not an extended form of DEX files. While ART tries
+  to follow the same naming and locking rules as Dalvik, apps should not depend
+  on the file format; the format is subject to change without notice.</li>
+
+
+
+<h2 id="Reporting_Problems">Reporting Problems</h2>
+
+<p>If you run into any issues that aren’t due to app JNI issues, report
+them via the Android Open Source Project Issue Tracker at <a
+href="https://code.google.com/p/android/issues/list">https://code.google.com/p/android/issues/list</a>.
+Include an <code>"adb bugreport"</code> and a link to the app in the Google
+Play store if available. Otherwise, if possible, attach an APK that reproduces
+the issue. Note that issues (including attachments) are publicly
+visible.</p>
diff --git a/docs/html/guide/topics/media/exoplayer.jd b/docs/html/guide/topics/media/exoplayer.jd
new file mode 100644
index 0000000..17b4669
--- /dev/null
+++ b/docs/html/guide/topics/media/exoplayer.jd
@@ -0,0 +1,514 @@
+page.title=ExoPlayer
+page.tags="audio","video","adaptive","streaming","DASH","smoothstreaming"
+@jd:body
+
+<div id="qv-wrapper">
+  <div id="qv">
+    <h2>In this document</h2>
+    <ol>
+      <li><a href="#overview">Overview</a></li>
+      <li><a href="#trackrenderer">TrackRenderer</a></li>
+      <li><a href="#samplesource">SampleSource</a>
+        <ol>
+          <li><a href="#mediaextractor">Providing media using MediaExtractor</a></li>
+          <li><a href="#adaptive-playback">Providing media for adaptive playback</a>
+            <ol>
+              <li><a href="#format-selection">Format selection for adaptive playback</a></li>
+            </ol>
+          </li>
+        </ol>
+      <li><a href="#events">Player Events</a>
+        <ol>
+          <li><a href="#high-events">High level events</a></li>
+          <li><a href="#low-events">Low level events</a></li>
+        </ol>
+      </li>
+      <li><a href="#sending-messages">Sending messages to components</a></li>
+      <li><a href="#customizing">Customizing ExoPlayer</a>
+        <ol>
+          <li><a href="#custom-guidelines">Custom component guidelines</a></li>
+        </ol>
+      </li>
+      <li><a href="#drm">Digital Rights Management</a></li>
+    </ol>
+    <h2>Key Classes</h2>
+    <ol>
+      <li>{@link android.media.MediaCodec}</li>
+      <li>{@link android.media.MediaExtractor}</li>
+      <li>{@link android.media.AudioTrack}</li>
+    </ol>
+    <h2>Related Samples</h2>
+    <ol>
+      <li><a class="external-link" href="https://github.com/google/ExoPlayer">
+        ExoPlayer Project</a></li>
+      <li><a class="external-link" href="http://google.github.io/ExoPlayer/doc/reference/packages.html">
+        Class Reference</a></li>
+    </ol>
+  </div>
+</div>
+
+
+<p>Playing videos and music is a popular activity on Android devices. The Android framework
+  provides {@link android.media.MediaPlayer} as a quick solution for playing media with minimal
+  code, and the {@link android.media.MediaCodec} and {@link android.media.MediaExtractor} classes
+  are provided for building custom media players. The open source project, ExoPlayer, is a
+  solution between these two options, providing a pre-built player that you can extend.</p>
+
+<p>ExoPlayer supports features not currently provided by
+  {@link android.media.MediaPlayer}, including Dynamic adaptive streaming
+  over HTTP (DASH), SmoothStreaming, and persistent caching. ExoPlayer can be extended
+  to handle additional media formats, and because you include it as part of your app code,
+  you can update it along with your app.</p>
+
+<p>This guide describes how to use ExoPlayer for playing Android supported media formats, as well as
+  DASH and SmoothStreaming playback. This guide also discusses ExoPlayer events, messages, DRM
+  support and guidelines for customizing the player.</p>
+
+<p class="note">
+  <strong>Note:</strong> ExoPlayer is an open source project that is not part of the Android
+  framework and is distributed separately from the Android SDK. The project contains a library and
+  a demo app that shows both simple and more advanced use of ExoPlayer:</p>
+
+<ul>
+    <li><a class="external-link" href="https://github.com/google/ExoPlayer/tree/master/library">
+      ExoPlayer Library</a> &mdash; This part of the project contains the core library classes.</li>
+    <li><a class="external-link" href="https://github.com/google/ExoPlayer/tree/master/demo/src/main/java/com/google/android/exoplayer/demo/simple">
+      Simple Demo</a> &mdash; This part of the app demonstrates a basic use of ExoPlayer.</li>
+    <li><a class="external-link" href="https://github.com/google/ExoPlayer/tree/master/demo/src/main/java/com/google/android/exoplayer/demo/full">
+      Full Demo</a> &mdash; This part of the app demonstrates more advanced features,
+      including the ability to select between multiple audio tracks, a background audio mode,
+      event logging and DRM protected playback. </li>
+</ul>
+
+
+<h2 id="overview">Overview</h2>
+
+<p>ExoPlayer is a media player built on top of the {@link android.media.MediaExtractor} and
+  {@link android.media.MediaCodec} APIs released in Android 4.1 (API level 16). At the core of this
+  library is the {@code ExoPlayer} class. This class maintains the player’s global state, but makes few
+  assumptions about the nature of the media being played, such as how the media data is obtained,
+  how it is buffered or its format. You inject this functionality through ExoPlayer’s {@code
+  prepare()} method in the form of {@code TrackRenderer} objects.</p>
+
+<p>ExoPlayer provides default {@code TrackRenderer} implementations for audio and
+  video, which make use of the {@link android.media.MediaCodec} and {@link android.media.AudioTrack}
+  classes in the Android framework. Both renderers require a {@code SampleSource} object, from which
+  they obtain individual media samples for playback. Figure 1 shows the high level object model for
+  an ExoPlayer implementation configured to play audio and video using these components.</p>
+
+<img src="{@docRoot}images/exoplayer/object-model.png" alt="" id="figure1" />
+<p class="img-caption">
+  <strong>Figure 1.</strong> High level object model for an ExoPlayer configured to play audio
+  and video using {@code TrackRenderer} objects
+</p>
+
+
+<h2 id="trackrenderer">TrackRenderer</h2>
+
+<p>A {@code TrackRenderer} processes a component of media for playback, such as
+  video, audio or text. The ExoPlayer class invokes methods on its {@code TrackRenderer} instances from a
+  single playback thread, and by doing so causes each media component to be rendered as the global
+  playback position is advanced. The ExoPlayer library provides {@code MediaCodecVideoTrackRenderer} as
+  the default implementations rendering video and {@code MediaCodecAudioTrackRenderer} for audio.
+  Both implementations make use of {@link android.media.MediaCodec} to decode individual media
+  samples. They can handle all audio and video formats supported by a given Android device
+  (see <a href="http://developer.android.com/guide/appendix/media-formats.html">Supported Media
+  Formats</a> for details). The ExoPlayer library also provides an implementation for rendering
+  text called {@code TextTrackRenderer}.
+</p>
+
+<p>The code example below outlines the main steps required to instantiate an ExoPlayer to play video
+  and audio using the standard {@code TrackRenderer} implementations.</p>
+
+<pre>
+// 1. Instantiate the player.
+player = ExoPlayer.Factory.newInstance(RENDERER_COUNT);
+// 2. Construct renderers.
+MediaCodecVideoTrackRenderer videoRenderer = …
+MediaCodecAudioTrackRenderer audioRenderer = ...
+// 3. Inject the renderers through prepare.
+player.prepare(videoRenderer, audioRenderer);
+// 4. Pass the surface to the video renderer.
+player.sendMessage(videoRenderer, MediaCodecVideoTrackRenderer.MSG_SET_SURFACE,
+        surface);
+// 5. Start playback.
+player.setPlayWhenReady(true);
+...
+player.release(); // Don’t forget to release when done!
+</pre>
+
+<p>For a complete example, see the {@code SimplePlayerActivity} in the ExoPlayer demo app, which
+  correctly manages an ExoPlayer instance with respect to both the {@link android.app.Activity} and
+  {@link android.view.Surface} lifecycles.</p>
+
+
+<h2 id="samplesource">SampleSource</h2>
+
+<p>A standard {@code TrackRenderer} implementation requires a {@code SampleSource} to
+  be provided in its constructor. A {@code SampleSource} object provides format information and
+  media samples to be rendered. The ExoPlayer library provides {@code FrameworkSampleSource} and
+  {@code ChunkSampleSource}. The {@code FrameworkSampleSource} class uses {@link
+  android.media.MediaExtractor} to request, buffer and extract the media samples. The {@code
+  ChunkSampleSource} class provides adaptive playback using DASH or SmoothStreaming, and
+  implements networking, buffering and media extraction within the ExoPlayer library.</p>
+
+
+<h3 id="mediaextractor">Providing media using MediaExtractor</h3>
+
+<p>
+  In order to render media formats supported by the Android framework, the {@code
+  FrameworkSampleSource} class uses {@link android.media.MediaExtractor} for networking,
+  buffering and sample extraction functionality. By doing so, it supports any media container format
+  supported by the version of Android where it is running. For more information about media formats
+  supported by Android, see <a href="{@docRoot}guide/appendix/media-formats.html">Supported
+  Media Formats</a>.
+</p>
+
+<p>The diagram in Figure 2 shows the object model for an ExoPlayer implementation using
+  {@code FrameworkSampleSource}.</p>
+
+<img src="{@docRoot}images/exoplayer/frameworksamplesource.png" alt="" id="figure2" />
+<p class="img-caption">
+  <strong>Figure 2.</strong> Object model for an implementation of ExoPlayer that renders
+  media formats supported by Android using {@code FrameworkSampleSource}
+</p>
+
+<p>The following code example outlines how the video and audio renderers are constructed to
+  load the video from a specified URI.</p>
+
+<pre>
+FrameworkSampleSource sampleSource = new FrameworkSampleSource(
+        activity, uri, null, 2);
+MediaCodecVideoTrackRenderer videoRenderer = new MediaCodecVideoTrackRenderer(
+        sampleSource, null, true, MediaCodec.VIDEO_SCALING_MODE_SCALE_TO_FIT, 0,
+        mainHandler, playerActivity, 50);
+MediaCodecAudioTrackRenderer audioRenderer = new MediaCodecAudioTrackRenderer(
+        sampleSource, null, true);
+</pre>
+
+<p>The ExoPlayer demo app provides a complete implementation of this code in
+  {@code DefaultRendererBuilder}. The {@code SimplePlaybackActivity} class uses it to play one
+  of the videos available in the demo app. Note that in the example, video and audio
+  are muxed, meaning they are streamed together from a single URI. The {@code FrameworkSampleSource}
+  instance provides video samples to the {@code videoRenderer} object and audio samples to the
+  {@code audioRenderer} object as they are extracted from the media container format. It is also
+  possible to play demuxed media, where video and audio are streamed separately from different URIs.
+  This functionality can be achieved by having two {@code FrameworkSampleSource} instances instead
+  of one.</p>
+
+
+<h3 id="adaptive-playback">Providing media for adaptive playback</h3>
+
+<p>ExoPlayer supports adaptive streaming, which allows the quality of the
+  media data to be adjusted during playback based on the network conditions. DASH
+  and SmoothStreaming are examples of adaptive streaming technologies. Both these approaches
+  load media in small chunks (typically 2 to 10 seconds in duration). Whenever a chunk of media
+  is requested, the client selects from a number of possible formats. For example, a client may
+  select a high quality format if network conditions are good, or a low quality format if network
+  conditions are bad. In both techniques, video and audio are streamed separately.</p>
+
+<p>ExoPlayer supports adaptive playback through use of the {@code ChunkSampleSource} class,
+  which loads chunks of media data from which individual samples can be extracted. Each {@code
+  ChunkSampleSource} requires a {@code ChunkSource} object to be injected through its constructor,
+  which is responsible for providing media chunks from which to load and read samples. The {@code
+  DashMp4ChunkSource} and {@code SmoothStreamingChunkSource} classes provide DASH and SmoothStreaming
+  playback using the FMP4 container format. The {@code DashWebMChunkSource} class uses the WebM
+  container format to provide DASH playback.</p>
+
+<p>All of the standard {@code ChunkSource} implementations require a {@code FormatEvaluator} and
+  a {@code DataSource} to be injected through their constructors. The {@code FormatEvaluator}
+  objects select from the available formats before each chunk is loaded. The {@code DataSource}
+  objects are responsible for actually loading the data. Finally, the {@code ChunkSampleSources}
+  require a {@code LoadControl} object that controls the chunk buffering policy.</p>
+
+<p>The object model of an ExoPlayer configured for a DASH adaptive playback is shown in the
+  diagram below. This example uses an {@code HttpDataSource} object to stream the media over the
+  network. The video quality is varied at runtime using the adaptive implementation of {@code
+  FormatEvaluator}, while audio is played at a fixed quality level.</p>
+
+<img src="{@docRoot}images/exoplayer/adaptive-streaming.png" alt="" id="figure3" />
+<p class="img-caption">
+  <strong>Figure 3.</strong> Object model for a DASH adaptive playback using ExoPlayer
+</p>
+
+<p>The following code example outlines how the video and audio renderers are constructed.</p>
+
+<pre>
+Handler mainHandler = playerActivity.getMainHandler();
+LoadControl loadControl = new DefaultLoadControl(
+        new BufferPool(BUFFER_SEGMENT_SIZE));
+BandwidthMeter bandwidthMeter = new BandwidthMeter();
+
+// Build the video renderer.
+DataSource videoDataSource = new HttpDataSource(userAgent,
+        HttpDataSource.REJECT_PAYWALL_TYPES, bandwidthMeter);
+ChunkSource videoChunkSource = new DashMp4ChunkSource(videoDataSource,
+        new AdaptiveEvaluator(bandwidthMeter), videoRepresentations);
+ChunkSampleSource videoSampleSource = new ChunkSampleSource(videoChunkSource,
+        loadControl, VIDEO_BUFFER_SEGMENTS * BUFFER_SEGMENT_SIZE, true);
+MediaCodecVideoTrackRenderer videoRenderer = new MediaCodecVideoTrackRenderer(
+        videoSampleSource, null, true, MediaCodec.VIDEO_SCALING_MODE_SCALE_TO_FIT,
+        0, mainHandler, playerActivity, 50);
+
+// Build the audio renderer.
+DataSource audioDataSource = new HttpDataSource(userAgent,
+        HttpDataSource.REJECT_PAYWALL_TYPES, bandwidthMeter);
+ChunkSource audioChunkSource = new DashMp4ChunkSource(audioDataSource,
+        new FormatEvaluator.FixedEvaluator(), audioRepresentation);
+SampleSource audioSampleSource = new ChunkSampleSource(audioChunkSource,
+        loadControl, AUDIO_BUFFER_SEGMENTS * BUFFER_SEGMENT_SIZE, true);
+MediaCodecAudioTrackRenderer audioRenderer = new MediaCodecAudioTrackRenderer(
+        audioSampleSource, null, true);
+</pre>
+
+<p>In this code, {@code videoRepresentations} and {@code audioRepresentation} are {@code
+  Representation} objects, each of which describes one of the available media streams. In the DASH
+  model, these streams are parsed from a media presentation description (MPD) file. The ExoPlayer
+  library provides a {@code MediaPresentationDescriptionParser} class to obtain {@code
+  Representation} objects from MPD files.</p>
+
+<p class="note">
+  <strong>Note:</strong> Building Representation objects from MPD files is not required. You can
+  build Representation objects from other data sources if necessary.
+</p>
+
+<p>The ExoPlayer demo app provides complete implementation of this code in
+  {@code DashVodRendererBuilder}. The {@code SimplePlaybackActivity} class uses this builder to
+  construct renderers for playing DASH sample videos in the demo app. It asynchronously fetches a
+  specified MPD file in order to construct the required {@code Representation} objects. For an
+  equivalent SmoothStreaming example, see the {@code SmoothStreamingRendererBuilder} class in the
+  demo app.</p>
+
+
+<h4 id="format-selection">Format selection for adaptive playback</h4>
+
+<p>For DASH and SmoothStreaming playback, consider both static format selection at the
+  start of playback and dynamic format selection during playback. Static format selection should be
+  used to filter out formats that should not be used throughout the playback, for example formats
+  with resolutions higher than the maximum supported by the playback device. Dynamic selection varies
+  the selected format during playback, typically to adapt video quality in response to changes in
+  network conditions.</p>
+
+<h5 id="static-selection">Static format selection</h5>
+
+<p>When preparing a player, you should consider filtering out some of the available formats if
+  they are not useable for playback. Static format selection allows you to filter out
+  formats that cannot be used on a particular device or are not compatible with your player.
+  For audio playback, this often means picking a single format to play and discarding the others.</p>
+
+<p>For video playback, filtering formats can be more complicated. Apps should first
+  eliminate any streams that whose resolution is too high to be played by the device. For H.264,
+  which is normally used for DASH and SmoothStreaming playback, ExoPlayer’s {@code MediaCodecUtil}
+  class provides a {@code maxH264DecodableFrameSize()} method that can be used to determine what
+  resolution streams the device is able to handle, as shown in the following code example:</p>
+
+<pre>
+int maxDecodableFrameSize = MediaCodecUtil.maxH264DecodableFrameSize();
+Format format = representation.format;
+if (format.width * format.height &lt;= maxDecodableFrameSize) {
+  // The device can play this stream.
+  videoRepresentations.add(representation);
+} else {
+  // The device isn't capable of playing this stream.
+}
+</pre>
+
+<p>This approach is used to filter {@code Representations} in the {@code DashVodRendererBuilder}
+  class of the ExoPlayer demo app, and similarly to filter track indices in {@code
+  SmoothStreamingRendererBuilder}.</p>
+
+<p>In addition to eliminating unsupported formats, it should be noted that the ability to
+  seamlessly switch between H.264 streams of different resolution is an optional decoder feature
+  available in Android 4.3 (API level 16) and higher, and so is not supported by all devices. The
+  availability of an adaptive H.264 decoder can be queried using {@code MediaCodecUtil}, as shown in
+  the following code example:</p>
+
+<pre>
+boolean isAdaptive = MediaCodecUtil.getDecoderInfo(MimeTypes.VIDEO_H264).adaptive;
+</pre>
+
+<p>The {@code MediaCodecVideoTrackRenderer} class is still able to handle resolution changes on
+  devices that do not have adaptive decoders, however the switch is not seamless. Typically, the
+  switch creates a small discontinuity in visual output lasting around 50-100ms. For devices that
+  do not provide an adaptive decoder, app developers may choose to adapt between formats at
+  a single fixed resolution so as to avoid discontinuities. The ExoPlayer demo app
+  implementation does not pick a fixed resolution.</p>
+
+
+<h5 id="dynamic-selection">Dynamic format selection</h5>
+
+<p>During playback, you can use a {@code FormatEvaluator} to dynamically select from the
+  available video formats. The ExoPlayer library provides a {@code FormatEvaluator.Adaptive}
+  implementation for dynamically selecting between video formats based on the current network
+  conditions.</p>
+
+<p>This class provides a simple, general purpose reference implementation, however you are
+  encouraged to write your own {@code FormatEvaluator} implementation to best suit your particular
+  needs.</p>
+
+
+<h2 id="events">Player Events</h2>
+
+<p>During playback, your app can listen for events generated by the ExoPlayer that indicate the
+  overall state of the player. These events are useful as triggers for updating the app user
+  interface such as playback controls. Many ExoPlayer components also report their own component
+  specific low level events, which can be useful for performance monitoring.</p>
+
+
+<h3 id="high-events">High level events</h3>
+
+<p>ExoPlayer allows instances of {@code ExoPlayer.Listener} to be added and removed using its
+  {@code addListener()} and {@code removeListener()} methods. Registered listeners are notified of
+  changes in playback state, as well as when errors occur that cause playback to fail. For more
+  information about the valid playback states and the possible transitions between them, see the
+  ExoPlayer source code.</p>
+
+<p>Developers who implement custom playback controls should register a listener and use it to
+  update their controls as the player’s state changes. An app should also show an
+  appropriate error to the user if playback fails.</p>
+
+<h3 id="low-events">Low level events</h3>
+
+<p>In addition to high level listeners, many of the individual components provided by the
+  ExoPlayer library allow their own event listeners. For example, {@code
+  MediaCodecVideoTrackRenderer} has constructors that take a {@code
+  MediaCodecVideoTrackRenderer.EventListener}. In the ExoPlayer demo app, {@code SimplePlayerActivity}
+  acts as a listener so that it can adjust the dimensions of the target surface to have the correct
+  height and width ratio for the video being played:</p>
+
+<pre>
+&#64;Override
+public void onVideoSizeChanged(int width, int height) {
+  surfaceView.setVideoWidthHeightRatio(height == 0 ? 1 : (float) width / height);
+}
+</pre>
+
+<p>The {@code RendererBuilder} classes in the ExoPlayer demo app inject the activity as the
+  listener, for example in the {@code DashVodRendererBuilder} class:</p>
+
+<pre>
+MediaCodecVideoTrackRenderer videoRenderer = new MediaCodecVideoTrackRenderer(
+        videoSampleSource, null, true, MediaCodec.VIDEO_SCALING_MODE_SCALE_TO_FIT,
+        0, <strong>mainHandler, playerActivity</strong>, 50);
+</pre>
+
+<p>Note that you must pass a {@link android.os.Handler} object to the renderer, which determines
+  the thread on which the listener’s methods are invoked. In most cases, you should use a
+  {@link android.os.Handler} associated with the app’s main thread, as is the case in this example.
+  </p>
+
+<p>Listening to individual components can be useful for adjusting UI based on player events, as
+  in the example above. Listening to component events can also be helpful for logging performance
+  metrics. For example, {@code MediaCodecVideoTrackRenderer} notifies its listener of dropped video
+  frames. A developer may wish to log such metrics to track playback performance in their
+  app.</p>
+
+<p>Many components also notify their listeners when errors occur. Such errors may or may not
+  cause playback to fail. If an error does not cause playback to fail, it may still result in
+  degraded performance, and so you may wish to log all errors in order to track playback
+  performance. Note that an ExoPlayer instance always notifies its high level listeners of errors that
+  cause playback to fail, in addition to the listener of the individual component from which the error
+  originated. Hence, you should display error messages to users only from high level listeners.
+  Within individual component listeners, you should use error notifications only for informational
+  purposes.</p>
+
+
+<h2 id="sending-messages">Sending messages to components</h2>
+
+<p>Some ExoPlayer components allow changes in configuration during playback. By convention, you make
+  these changes by passing asynchronous messages through the ExoPlayer to the component.
+  This approach ensures both thread safety and that the configuration change is
+  executed in order with any other operations being performed on the player.</p>
+
+<p>The most common use of messaging is passing a target surface to
+  {@code MediaCodecVideoTrackRenderer}:</p>
+
+<pre>
+player.sendMessage(videoRenderer, MediaCodecVideoTrackRenderer.MSG_SET_SURFACE,
+        surface);
+</pre>
+
+<p>Note that if the surface needs to be cleared because
+  {@link android.view.SurfaceHolder.Callback#surfaceDestroyed
+  SurfaceHolder.Callback.surfaceDestroyed()} has been invoked, then you must send this
+  message using the blocking variant of {@code sendMessage()}:</p>
+<p>
+
+<pre>
+player.blockingSendMessage(videoRenderer,
+        MediaCodecVideoTrackRenderer.MSG_SET_SURFACE, null);
+</pre>
+
+<p>You must use a blocking message because the contract of {@link
+  android.view.SurfaceHolder.Callback#surfaceDestroyed surfaceDestroyed()} requires that the
+  app does not attempt to access the surface after the method returns. The {@code
+  SimplePlayerActivity} class in the demo app demonstrates how the surface should be set and
+  cleared.</p>
+
+
+<h2 id="customizing">Customizing ExoPlayer</h2>
+
+<p>One of the main benefits of ExoPlayer over {@link android.media.MediaPlayer} is the ability to
+  customize and extend the player to better suit the developer’s use case. The ExoPlayer library
+  is designed specifically with this in mind, defining a number of abstract base classes and
+  interfaces that make it possible for app developers to easily replace the default implementations
+  provided by the library. Here are some use cases for building custom components:</p>
+
+<ul>
+  <li><strong>{@code TrackRenderer}</strong> - You may want to implement a custom
+    {@code TrackRenderer} to handle media types other than audio and video. The {@code
+    TextTrackRenderer} class within the ExoPlayer library is an example of how to implement a
+    custom renderer. You could use the approach it demonstrates to render custom
+    overlays or annotations. Implementing this kind of functionality as a {@code TrackRenderer}
+    makes it easy to keep the overlays or annotations in sync with the other media being played.</li>
+  <li><strong>{@code SampleSource}</strong> - If you need to support a container format not
+    already handled by {@link android.media.MediaExtractor} or ExoPlayer, consider implementing a
+    custom {@code SampleSource} class.</li>
+  <li><strong>{@code FormatEvaluator}</strong> - The ExoPlayer library provides {@code
+    FormatEvaluator.Adaptive} as a simple reference implementation that switches between different
+    quality video formats based on the available bandwidth. App developers are encouraged to
+    develop their own adaptive {@code FormatEvaluator} implementations, which can be designed to
+    suit their use specific needs.</li>
+  <li><strong>{@code DataSource}</strong> - ExoPlayer’s upstream package already contains a
+    number of {@code DataSource} implementations for different use cases, such as writing and
+    reading to and from a persistent media cache. You may want to implement you own
+    {@code DataSource} class to load data in another way, such as a custom
+    protocol or HTTP stack for data input.</li>
+</ul>
+
+
+<h3 id="custom-guidelines">Custom component guidelines</h3>
+
+<p>If a custom component needs to report events back to the app, we recommend that you
+  do so using the same model as existing ExoPlayer components, where an event listener is passed
+  together with a {@link android.os.Handler} to the constructor of the component.</p>
+
+<p>We recommended that custom components use the same model as existing ExoPlayer components to
+  allow reconfiguration by the app during playback, as described in
+  <a href="#sending-messages">Sending messages to components</a>.
+  To do this, you should implement a {@code ExoPlayerComponent} and receive
+  configuration changes in its {@code handleMessage()} method. Your app should pass
+  configuration changes by calling ExoPlayer’s {@code sendMessage()} and {@code
+  blockingSendMessage()} methods.</p>
+
+
+<h2 id="drm">Digital Rights Management</h2>
+
+<p>On Android 4.3 (API level 18) and higher, ExoPlayer supports Digital Rights Managment (DRM)
+  protected playback. In order to play DRM protected content with ExoPlayer, your app must
+  inject a {@code DrmSessionManager} into the {@code MediaCodecVideoTrackRenderer} and {@code
+  MediaCodecAudioTrackRenderer} constructors. A {@code DrmSessionManager} object is responsible for
+  providing the {@code MediaCrypto} object required for decryption, as well as ensuring that the
+  required decryption keys are available to the underlying DRM module being used.</p>
+
+<p>The ExoPlayer library provides a default implementation of {@code DrmSessionManager}, called
+  {@code StreamingDrmSessionManager}, which uses {@link android.media.MediaDrm}. The session
+  manager supports any DRM scheme for which a modular DRM component exists on the device. All
+  Android devices are required to support Widevine modular DRM (with L3 security, although many
+  devices also support L1). Some devices may support additional schemes such as PlayReady.</p>
+
+<p>The {@code StreamingDrmSessionManager} class requires a {@code MediaDrmCallback} to be
+  injected into its constructor, which is responsible for actually making provisioning and key
+  requests. You should implement this interface to make network requests to your license
+  server and obtain the required keys. The {@code WidevineTestMediaDrmCallback} class in the
+  ExoPlayer demo app sends requests to a Widevine test server.</p>
diff --git a/docs/html/images/exoplayer/adaptive-streaming.png b/docs/html/images/exoplayer/adaptive-streaming.png
new file mode 100644
index 0000000..9fc650c9
--- /dev/null
+++ b/docs/html/images/exoplayer/adaptive-streaming.png
Binary files differ
diff --git a/docs/html/images/exoplayer/frameworksamplesource.png b/docs/html/images/exoplayer/frameworksamplesource.png
new file mode 100644
index 0000000..fd1e314
--- /dev/null
+++ b/docs/html/images/exoplayer/frameworksamplesource.png
Binary files differ
diff --git a/docs/html/images/exoplayer/object-model.png b/docs/html/images/exoplayer/object-model.png
new file mode 100644
index 0000000..e0d6e55
--- /dev/null
+++ b/docs/html/images/exoplayer/object-model.png
Binary files differ
diff --git a/docs/html/images/gp-ads-console.jpg b/docs/html/images/gp-ads-console.jpg
new file mode 100644
index 0000000..158e31d
--- /dev/null
+++ b/docs/html/images/gp-ads-console.jpg
Binary files differ
diff --git a/docs/html/images/gp-ads-linking2.jpg b/docs/html/images/gp-ads-linking2.jpg
new file mode 100644
index 0000000..0c2f731
--- /dev/null
+++ b/docs/html/images/gp-ads-linking2.jpg
Binary files differ
diff --git a/docs/html/images/gp-analytics.jpg b/docs/html/images/gp-analytics.jpg
new file mode 100644
index 0000000..e1a92c7
--- /dev/null
+++ b/docs/html/images/gp-analytics.jpg
Binary files differ
diff --git a/docs/html/images/gpfe-start-0.jpg b/docs/html/images/gpfe-start-0.jpg
index e97381d..bb68aaa 100644
--- a/docs/html/images/gpfe-start-0.jpg
+++ b/docs/html/images/gpfe-start-0.jpg
Binary files differ
diff --git a/docs/html/jd_collections.js b/docs/html/jd_collections.js
index 8a4ac47..8dfc2f5 100644
--- a/docs/html/jd_collections.js
+++ b/docs/html/jd_collections.js
@@ -29,14 +29,14 @@
     "resources": [
       "distribute/googleplay/edu/about.html",
       "distribute/googleplay/edu/start.html",
-      "distribute/googleplay/edu/faq.html"
+      "https://developers.google.com/edu/faq"
     ]
   },
   "distribute/essentials": {
     "resources": [
       "distribute/essentials/quality/core.html",
       "distribute/essentials/quality/tablets.html",
-      "distribute/essentials/gpfe-guidelines.html",
+      "https://developers.google.com/edu/guidelines",
       "distribute/essentials/optimizing-your-app.html",
       "distribute/essentials/best-practices/apps.html",
       "distribute/essentials/best-practices/games.html"
@@ -49,7 +49,8 @@
       "distribute/users/your-listing.html",
       "distribute/users/build-buzz.html",
       "distribute/users/build-community.html",
-      "distribute/users/expand-to-new-markets.html"
+      "distribute/users/expand-to-new-markets.html",
+      "distribute/users/promote-with-ads.html"
     ]
   },
   "distribute/engagelanding": {
@@ -60,6 +61,7 @@
       "distribute/engage/easy-signin.html",
       "distribute/engage/deep-linking.html",
       "distribute/engage/game-services.html",
+      "distribute/engage/analytics.html",
       "distribute/engage/app-updates.html",
       "distribute/engage/community.html",
       "distribute/engage/video.html"
@@ -147,16 +149,18 @@
     "title": "About Google Play for Education / Developers",
     "resources": [
       "distribute/googleplay/edu/start.html",
-      "distribute/essentials/gpfe-guidelines.html",
-      "distribute/googleplay/edu/faq.html",
-      "distribute/essentials/quality/tablets.html"
+      "https://developers.google.com/edu/guidelines",
+      "https://developers.google.com/edu/faq",
+      "distribute/essentials/quality/tablets.html",
+      "https://developers.google.com/edu/",
+      "https://www.google.com/edu/tablets/#tablets-family"
     ]
   },
   "distribute/googleplay/gpfe/dev": {
     "title": "About Google Play for Education / Developers",
     "resources": [
       "distribute/googleplay/edu/about.html",
-      "distribute/essentials/gpfe-guidelines.html",
+      "https://developers.google.com/edu/guidelines",
       "distribute/essentials/quality/tablets.html",
       "distribute/googleplay/developer-console.html",
       "http://play.google.com/about/developer-distribution-agreement-addendum.html",
@@ -188,7 +192,7 @@
     "resources": [
       "distribute/googleplay/developer-console.html",
       "distribute/googleplay/edu/start.html",
-      "distribute/googleplay/edu/faq.html"
+      "https://developers.google.com/edu/faq"
     ]
   },
   "distribute/essentials/eduessentials/educators": {
@@ -214,6 +218,13 @@
       "distribute/stories/localization.html"
     ]
   },
+  "distribute/users/promotewithads": {
+    "title": "",
+    "resources": [
+      "http://www.google.com/ads/admob/#subid=us-en-et-dac",
+      "distribute/essentials/optimizing-your-app.html"
+    ]
+  },
   "distribute/users/buildbuzz": {
     "title": "",
     "resources": [
@@ -394,6 +405,14 @@
       "http://play.google.com/about/developer-content-policy.html"
     ]
   },
+  "distribute/engage/analytics": {
+    "title": "",
+    "resources": [
+      "http://www.google.com/analytics/mobile/",
+      "http://android-developers.blogspot.com/2013/10/improved-app-insight-by-linking-google.html",
+      "https://developers.google.com/analytics/devguides/collection/android/"
+    ]
+  },
   "distribute/engage/widgets": {
     "title": "",
     "resources": [
@@ -553,7 +572,7 @@
     "resources": [
       "distribute/essentials/quality/core.html",
       "distribute/essentials/quality/tablets.html",
-      "distribute/essentials/gpfe-guidelines.html"
+      "https://developers.google.com/edu/guidelines"
     ]
   },
   "distribute/toolsreference/launchchecklist/rating": {
diff --git a/docs/html/jd_extras.js b/docs/html/jd_extras.js
index f26b747b..605af525 100644
--- a/docs/html/jd_extras.js
+++ b/docs/html/jd_extras.js
@@ -208,7 +208,7 @@
     "keywords": [],
     "type": "support",
     "titleFriendly": ""
-  },   
+  },
   {
     "lang": "en",
     "group": "",
@@ -571,7 +571,7 @@
     "image":"http://chart.googleapis.com/chart?chl=GL%201.1%20only%7CGL%202.0%7CGL%203.0&chf=bg%2Cs%2C00000000&chd=t%3A0.1%2C93.5%2C6.4&chco=c4df9b%2C6fad0c&chs=400x250&cht=p",
     "lang":"en",
     "type":"about"
-  }, 
+  },
   {
     "lang": "en",
     "group": "",
@@ -700,7 +700,7 @@
     "timestamp": 1383243492000,
     "image": "http://i1.ytimg.com/vi/vzvpcEffvaE/maxresdefault.jpg",
     "title": "Introducing Google Play for Education",
-    "summary": "Google Play for Education is a destination where schools can find great, teacher-approved, educational apps and videos on Play Store. Teachers can filter content by subject matter, grade and other criteria. Bulk purchase and instant distribution let educators bring your apps directly to classrooms and schools.",
+    "summary": "Google Play for Education is a destination where schools can find great, teacher-approved, educational content&mdash;from videos and books, to educational apps&mdash;all in one place. Teachers can filter content by subject matter, grade and other criteria. Bulk purchase and instant distribution let educators bring your apps directly to classrooms and schools.",
     "keywords": [],
     "type": "youtube",
     "titleFriendly": ""
@@ -726,6 +726,21 @@
     "tags": [
       "#engagement",
     ],
+    "url": "http://www.google.com/analytics/mobile/",
+    "timestamp": 1383243492000,
+    "image": "http://www.google.com//analytics/images/heros/mobile-index.jpg",
+    "title": "Google Mobile App Analytics",
+    "summary": "Mobile App Analytics measures what matters most at all key stages: from first discovery and download to in-app purchases. ",
+    "keywords": ["analytics,user behavior"],
+    "type": "guide",
+    "titleFriendly": ""
+  },
+  {
+    "lang": "en",
+    "group": "",
+    "tags": [
+      "#engagement",
+    ],
     "url": "https://developers.google.com/app-indexing/",
     "timestamp": 1383243492000,
     "image": "https://developers.google.com/app-indexing/images/allthecooks_srp.png",
@@ -1101,4 +1116,69 @@
     "type": "Google+",
     "titleFriendly": ""
   },
-]); 
\ No newline at end of file
+  {
+    "lang": "en",
+    "group": "",
+    "tags": ["analytics"],
+    "url": "https://developers.google.com/analytics/devguides/collection/android/",
+    "timestamp": null,
+    "image": "https://developers.google.com/analytics/images/home/gear-logo.png",
+    "title": "Google Mobile App Analytics SDK",
+    "summary": "The Google Analytics for Mobile Apps SDKs make it easy for you to implement Google Analytics in your mobile application.",
+    "keywords": ["analytics, user behavior"],
+    "type": "sdk",
+    "titleFriendly": ""
+  },
+  {
+    "lang": "en",
+    "group": "",
+    "tags": [],
+    "url": "https://developers.google.com/edu/guidelines",
+    "timestamp": null,
+    "image": "http://developer.android.com/distribute/images/edu-guidelines.jpg",
+    "title": "Education Guidelines",
+    "summary": "These guidelines and requirements help you develop great apps for students, which offer compelling content and an intuitive user experience on Android tablets.",
+    "keywords": [],
+    "type": "",
+    "titleFriendly": ""
+  },
+  {
+    "lang": "en",
+    "group": "",
+    "tags": [],
+    "url": "https://developers.google.com/edu/faq",
+    "timestamp": null,
+    "image": "http://developer.android.com/distribute/images/gpfe-faq.jpg",
+    "title": "Education FAQ",
+    "summary": "Answers to common questions you might have about Google Play for Education.",
+    "keywords": [],
+    "type": "",
+    "titleFriendly": ""
+  },
+  {
+    "lang": "en",
+    "group": "",
+    "tags": [],
+    "url": "https://developers.google.com/edu/",
+    "timestamp": null,
+    "image": "https://developers.google.com/edu/images/home-android.png",
+    "title": "Chrome Apps in Google Play for Education",
+    "summary": "Find out more about Chrome apps in Google Play for Education.",
+    "keywords": [],
+    "type": "",
+    "titleFriendly": ""
+  },
+  {
+    "lang": "en",
+    "group": "",
+    "tags": [],
+    "url": "https://www.google.com/edu/tablets/#tablets-family",
+    "timestamp": null,
+    "image": "https://www.google.com/edu/images/tablets/big-tablet.png",
+    "title": "Google Play for Education Tablets",
+    "summary": "Google Play for Education leverages a diverse set up tablets approved for the classroom which may help inform you how to build educational apps.",
+    "keywords": [],
+    "type": "",
+    "titleFriendly": ""
+  }
+]);
diff --git a/docs/html/preview/default.css b/docs/html/preview/default.css
new file mode 100644
index 0000000..e3363fb
--- /dev/null
+++ b/docs/html/preview/default.css
@@ -0,0 +1,7306 @@
+/* color definitions */
+/* 16 column layout */
+/* clearfix idiom */
+/* common mixins */
+/* page layout + top-level styles */
+::selection {
+  background-color: #0099cc;
+  color: #fff; }
+::-webkit-selection {
+  background-color: #0099cc;
+  color: #fff; }
+::-moz-selection {
+  background-color: #0099cc;
+  color: #fff; }
+
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  background-color:#F9F9F9;
+  -webkit-font-smoothing: antialiased;
+  /* prevent subpixel antialiasing, which thickens the text */
+  /* text-rendering: optimizeLegibility; */
+  /* turned off ligatures due to bug 5945455 */ }
+
+body {
+  color: #222;
+  font: 14px/19px Roboto, sans-serif;
+  font-weight: 400;
+  letter-spacing:.1;
+  padding:0 10px; }
+
+#page-container {
+  width: 940px;
+  margin: 0 40px; }
+
+#page-header {
+  height: 80px;
+  margin-bottom: 20px;
+  font-size: 48px;
+  line-height: 48px;
+  font-weight: 100;
+  padding-left: 10px; }
+  #page-header a {
+    display: block;
+    position: relative;
+    top: 20px;
+    text-decoration: none;
+    color: #555555 !important; }
+
+#main-row {
+  display: inline-block; }
+  #main-row:after {
+    content: ".";
+    display: block;
+    height: 0;
+    clear: both;
+    visibility: hidden; }
+  * html #main-row {
+    height: 1px; }
+
+#page-footer {
+  margin-left: 190px;
+  margin-top: 80px;
+  color: #999999;
+  padding-bottom: 40px;
+  font-size: 12px;
+  line-height: 15px; }
+  #page-footer a {
+    color: #777777; }
+  #page-footer #copyright {
+    margin-bottom: 10px; }
+
+#nav-container {
+  width: 160px;
+  min-height: 10px;
+  margin-right: 20px;
+  float: left; }
+
+#nav {
+  margin:0;
+  padding:0 0 30px;
+}
+
+#side-nav {
+  min-height:5px; /* silly way to avoid doc floating left when nav goes fixed */
+  margin-bottom:1px;
+}
+#devdoc-nav {
+  outline:none;
+  width:auto;
+  margin: 20px 0 0; }
+
+#devdoc-nav h2 {
+  border:0;
+}
+
+#devdoc-nav.fixed {
+  position: fixed;
+  margin:0;
+  top: 65px; /* sticky-header height + 20px gutter */
+}
+
+#devdoc-nav span.small {
+  font-size:12px;
+  font-weight:normal;
+}
+
+#content {
+  width: 760px;
+  float: left; }
+
+a:hover,
+acronym:hover {
+  color: #7aa1b0 !important; }
+
+a:focus,
+a:active {
+  color: #33b5e5 !important; }
+
+a.external-link {
+  background:url('../images/styles/open_new_page.png') no-repeat 100% 50%;
+  padding-right:16px;
+}
+
+img {
+  border: none; }
+#jd-content img {
+  margin-bottom:15px;
+}
+
+ul {
+  margin: 0;
+  padding: 0; }
+
+strong {
+  font-weight: 500; }
+
+em {
+  font-style: italic; }
+
+acronym,
+.tooltip-link {
+  border-bottom: 1px dotted #555555;
+  cursor: help; }
+
+acronym:hover,
+.tooltip-link:hover {
+  color: #7aa1b0;
+  border-bottom-color: #7aa1b0; }
+
+img.with-shadow,
+video.with-shadow {
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25); }
+
+/* disclosures mixin */
+/* content layout */
+.layout-content-row {
+  display: inline-block;
+  margin-bottom: 10px; }
+  * html .layout-content-row {
+    height: 1px; }
+
+.layout-content-col {
+  float: left;
+  margin-left: 20px; }
+  .layout-content-col:first-child {
+    margin-left: 0; }
+  .layout-content-col h3,
+  .layout-content-col h4 {
+    margin-top:0; }
+
+.layout-content-col.span-1 {
+  width: 40px; }
+
+.layout-content-col.span-2 {
+  width: 100px; }
+
+.layout-content-col.span-3 {
+  width: 160px; }
+
+.layout-content-col.span-4 {
+  width: 220px; }
+
+.layout-content-col.span-5 {
+  width: 280px; }
+
+.layout-content-col.span-6 {
+  width: 340px; }
+
+.layout-content-col.span-7 {
+  width: 400px; }
+
+.layout-content-col.span-8 {
+  width: 460px; }
+
+.layout-content-col.span-9 {
+  width: 520px; }
+
+.layout-content-col.span-10 {
+  width: 580px; }
+
+.layout-content-col.span-11 {
+  width: 640px; }
+
+.layout-content-col.span-12 {
+  width: 700px; }
+
+.layout-content-col.span-13 {
+  width: 760px; }
+
+.vspace.size-1 {
+  height: 10px; }
+
+.vspace.size-2 {
+  height: 20px; }
+
+.vspace.size-3 {
+  height: 30px; }
+
+.vspace.size-4 {
+  height: 40px; }
+
+.vspace.size-5 {
+  height: 50px; }
+
+.vspace.size-6 {
+  height: 60px; }
+
+.vspace.size-7 {
+  height: 70px; }
+
+.vspace.size-8 {
+  height: 80px; }
+
+.vspace.size-9 {
+  height: 90px; }
+
+.vspace.size-10 {
+  height: 100px; }
+
+.vspace.size-11 {
+  height: 110px; }
+
+.vspace.size-12 {
+  height: 120px; }
+
+.vspace.size-13 {
+  height: 130px; }
+
+.vspace.size-14 {
+  height: 140px; }
+
+.vspace.size-15 {
+  height: 150px; }
+
+.vspace.size-16 {
+  height: 160px; }
+
+/* nav */
+#nav {
+  /* section header divs */
+  /* expanded section header divs */
+  /* sublinks */ }
+  #nav li {
+    list-style-type: none;
+    font-size: 14px;
+    margin:0;
+    padding:0;
+    line-height: 15px; }
+  #nav a {
+    color: #555555;
+    text-decoration: none;
+    word-wrap:break-word; }
+  #nav .nav-section-header {
+    position: relative;
+    margin-bottom: 1px;
+    padding: 0 30px 0 0; }
+  #nav li.selected a, #nav li.selected > .nav-section-header > a {
+    color: #09C;
+  }
+  #nav li.selected ul li a {
+  /* don't highlight child items */
+    color: #555555; }
+  #nav .nav-section .nav-section .nav-section-header {
+    /* no white line between second level sections */
+    margin-bottom: 0; }
+    /* section header links */
+    #nav > li > div > a {
+      display: block;
+      color: #333333;
+      font-weight: 500;
+      padding: 10px 0 10px 10px; }
+    #nav .nav-section-header:after {
+      content: '';
+      background: transparent url(../images/styles/disclosure_down.png) no-repeat scroll 50% 50%;
+      width: 34px;
+      height: 34px;
+      display: block;
+      position: absolute;
+      top: 0;
+      right: 0; }
+    #nav .nav-section-header.empty {
+      padding:0; }
+    #nav .nav-section-header.empty:after {
+      display: none; }
+    /* nested nav headers */
+    #nav .nav-section .nav-section {
+      position: relative;
+      padding: 0;
+      margin: 0; }
+    #nav .nav-section li a {
+    /* first gen child (2nd level li) */
+      display:block;
+      font-weight: normal;
+      text-transform: none;
+      padding: 7px 5px 7px 10px;
+       }
+    #nav .nav-section li li a {
+    /* second gen child (3rd level li) */
+      padding: 5px 5px 5px 10px;
+       }
+  #nav li.expanded .nav-section-header {
+    background:#e9e9e9;
+    background: rgba(0, 0, 0, 0.05); }
+  #nav li.expanded li .nav-section-header {
+    background: transparent; }
+  #nav li.expanded li ul {
+  /* 3rd level ul */
+    padding:0 0 0 10px;
+  }
+    #nav li.expanded > .nav-section-header:after {
+      content: '';
+      background: transparent url(../images/styles/disclosure_up.png) no-repeat scroll 50% 50%;
+      width: 34px;
+      height: 34px; }
+  #nav li.expanded li ul.tree-list-children {
+    padding: 0;
+  }
+  #nav li.expanded li ul.tree-list-children .tree-list-children {
+    padding:0 0 0 10px;
+  }
+  #nav li span.tree-list-subtitle {
+    display:inline-block;
+    padding:5px 0 0 10px;
+    color:#555;
+    text-transform:uppercase;
+    font-size:12px;
+  }
+  #nav li span.tree-list-subtitle:before {
+    content: '—';
+  }
+  #nav li span.tree-list-subtitle:after {
+    content: '—';
+  }
+  #nav li span.tree-list-subtitle.package {
+    padding-top:15px;
+    cursor:default;
+  }
+  #nav li span.tree-list-subtitle.package:before {
+    content: '';
+  }
+  #nav li span.tree-list-subtitle.package:after {
+    content: '';
+  }
+  #nav li ul.tree-list-children.classes {
+    padding-left:10px;
+  }
+  #nav li ul {
+    display:none;
+    overflow: hidden;
+    margin: 0; }
+    #nav li ul.animate-height-in {
+      -webkit-transition: height 0.25s ease-in;
+      -moz-transition: height 0.25s ease-in;
+      transition: height 0.25s ease-in; }
+    #nav li ul.animate-height-out {
+      -webkit-transition: height 0.25s ease-out;
+      -moz-transition: height 0.25s ease-out;
+      transition: height 0.25s ease-out; }
+    #nav li ul li {
+      padding: 0; }
+      #nav li li li {
+        padding: 0; }
+  #nav li.expanded ul {
+    }
+    #nav li ul > li {
+      padding:0;
+    }
+    #nav li ul > li:last-child {
+      padding-bottom:5px;
+    }
+    #nav li ul.tree-list-children > li:last-child {
+      padding-bottom:0;
+    }
+    #nav li.expanded ul > li {
+      background:#efefef;
+      background: rgba(0, 0, 0, 0.03); }
+    #nav li.expanded ul > li li {
+      background:inherit; }
+  #nav li ul.tree-list-children ul {
+    display:block; }
+
+#nav.samples-nav li li li {
+  font-size:13px;
+}
+#nav.samples-nav li li li a {
+  padding-top:3px;
+  padding-bottom:3px;
+}
+#nav.samples-nav li li ul > li:last-child {
+  padding-bottom:3px;
+}
+
+.new,
+.new-child {
+  font-size: .78em;
+  font-weight: bold;
+  color: #ff3d3d;
+  vertical-align:top;
+  white-space:nowrap;
+}
+
+/* content header */
+.content-header {
+  height: 30px;
+  margin:36px 0 23px;  /* same as h1 */
+  padding:0 0 10px;}  /* same as h1 */
+.content-header.just-links {
+  margin-bottom:0;
+  padding-bottom:0;}
+
+.content-header h1 {
+  margin:0;
+  padding:0;
+  width: 700px;
+}
+.content-header > div:first-child {
+  height:1px; /* set fixed height for the header div to ensure the
+                  next/prev links align with toc on training classes */
+}
+
+.content-footer {
+  border-top: 1px solid #ccc;
+  margin-top: 10px;
+  padding-top:10px;
+  width:100%; }
+
+.content-footer .col-9 {
+  margin-left:0;
+}
+.content-footer .col-4 {
+  margin-right:0;
+}
+.content-footer.wrap {
+  width:940px;
+}
+.content-footer .plus-container {
+  margin:5px 0 0;
+  text-align:right;
+  float:right;
+}
+
+.paging-links {
+  position: relative;
+  height:30px; }
+  .paging-links a {
+    position: absolute; }
+  .paging-links a,
+  .training-nav-top a {
+    color: #555555;
+    text-decoration: none;
+    text-transform: uppercase; }
+    .paging-links .prev-page-link:before,
+    .training-nav-top .prev-page-link:before {
+      content: '';
+      background: transparent url(../images/styles/disclosure_left.png) no-repeat scroll 50% 50%;
+      width: 10px;
+      height: 10px;
+      display: inline-block;
+      margin-right: 5px; }
+    .training-nav-top .next-page-link,
+    .training-nav-top .start-class-link,
+    .training-nav-top .start-course-link {
+    right: 10px; }
+    .paging-links .prev-page-link {
+      left: -15px; }
+    .paging-links .next-page-link {
+      right: 0; }
+    .next-page-link:after,
+    .start-class-link:after,
+    .start-course-link:after,
+    .next-class-link:after,
+    .go-link:after {
+      content: '';
+      background: transparent url(../images/styles/disclosure_right.png) no-repeat scroll 50% 50%;
+      width: 10px;
+      height: 10px;
+      display: inline-block;
+      margin-left: 5px; }
+    .prev-page-link.inline:before {
+      content: none; }
+    .next-page-link.inline:after {
+      content: none; }
+
+  .content-footer .paging-links .next-page-link {
+    left:0;
+  }
+
+  .training-nav-top a {
+    display:block;
+    float:left;
+    width:122px;
+    height:28px;
+    padding: 8px;
+    line-height:28px;
+    text-align:center;
+    border:1px solid #DADADA;
+    border-bottom:0;
+  }
+
+  .training-nav-top a.next-page-link {
+    border-left:0;
+    width:123px;
+  }
+
+  .paging-links a.disabled,
+  .training-nav-top a.disabled,
+  .content-footer a.disabled {
+    color:#bbb;
+  }
+
+  .paging-links a.disabled:hover,
+  .training-nav-top a.disabled:hover,
+  .content-footer a.disabled:hover {
+    cursor:default;
+    color:#bbb !important;
+  }
+
+  .training-nav-top a.start-class-link,
+  .training-nav-top a.start-course-link {
+    width:262px;
+  }
+
+  .paging-links a.start-class-link {
+    width:100%;
+  }
+
+  /* list of classes on course landing page */
+  ol.class-list {
+    list-style:none;
+    margin-left:0;
+  }
+  ol.class-list>li {
+    margin:0 0 15px;
+    padding:5px 0 0;
+    overflow:hidden;
+    border-top:1px solid #ccc;
+  }
+  ol.class-list li a.title {
+    font-size:16px;
+    margin:0;
+    clear:left;
+    display:block;
+    height:32px;
+    padding:0 4px;
+  }
+  ol.class-list li a.title h2 {
+    color:inherit;
+    margin:0 0 10px;
+    display:block;
+    float:left;
+    width:675px;
+  }
+  ol.class-list li a.title span {
+    display:none;
+    float:left;
+    font-size:18px;
+    font-weight:bold;
+    background: transparent url(../images/styles/disclosure_right.png) no-repeat scroll 50% 50%;
+    width: 10px;
+    height: 32px;
+  }
+  ol.class-list li a.title:hover {
+    background:#ddd;
+    color:#258AAF !important;
+  }
+  ol.class-list li a.title:hover span {
+    display:block;
+  }
+
+  #jd-content
+  ol.class-list li img {
+    float:left;
+    clear:left;
+    width:64px;
+    margin:0 20px 0 0;
+  }
+  ol.class-list li p.description {
+    float:left;
+    display:block;
+    width:250px;
+    margin:0;
+  }
+  ol.class-list li p.description.article {
+    width: 550px;
+  }
+  ol.class-list ol {
+    float:left;
+    width:320px;
+    margin:0 0 0 30px;
+    list-style:none;
+    margin:0 0 0 20px;
+  }
+  ol.class-list div.lessons li {
+    margin:0 0 6px;
+    line-height:16px;
+  }
+
+
+  .hide {
+    display:none !important;
+  }
+
+
+
+  /* inner-doc tabs w/ title */
+
+div#title-tabs-wrapper {
+  border-bottom:1px solid #ccc;
+  margin:20px 0 30px;
+}
+h1.with-title-tabs {
+  display:inline-block;
+  margin:0 0 -1px 0;
+  padding:0 60px 0 0;
+  border-bottom:1px solid #F9F9F9;
+}
+ul#title-tabs {
+  list-style:none;
+  padding:0;
+  height:29px;
+  margin:0;
+  font-size:16px;
+  line-height:26px;
+  display:inline-block;
+  vertical-align:bottom;
+}
+ul#title-tabs li {
+  display:block;
+  float:left;
+  margin-right:40px;
+  border-bottom: 3px solid transparent;
+}
+ul#title-tabs li.selected {
+  border-bottom: 3px solid #93C;
+}
+ul#title-tabs li a {
+  color:#333;
+}
+ul#title-tabs li a:hover,
+ul#title-tabs li a:active {
+  color:#93C !important;
+}
+
+
+
+/* content body */
+@-webkit-keyframes glowheader {
+  from {
+    background-color: #33b5e5;
+    color: #000;
+    border-bottom-color: #000; }
+
+  to {
+    background-color: transparent;
+    color: #33b5e5;
+    border-bottom-color: #33b5e5; } }
+
+@-moz-keyframes glowheader {
+  from {
+    background-color: #33b5e5;
+    color: #000;
+    border-bottom-color: #000; }
+
+  to {
+    background-color: transparent;
+    color: #33b5e5;
+    border-bottom-color: #33b5e5; } }
+
+@keyframes glowheader {
+  from {
+    background-color: #33b5e5;
+    color: #000;
+    border-bottom-color: #000; }
+
+  to {
+    background-color: transparent;
+    color: #33b5e5;
+    border-bottom-color: #33b5e5; } }
+
+h1:target,
+h2:target,
+h3:target {
+    -webkit-animation-name: glowheader;
+    -moz-animation-name: glowheader;
+    animation-name: glowheader;
+    -webkit-animation-duration: 0.7s;
+    -moz-animation-duration: 0.7s;
+    animation-duration: 0.7s;
+    -webkit-animation-timing-function: ease-out;
+    -moz-animation-timing-function: ease-out;
+    animation-timing-function: ease-out; }
+
+.design ol h4 {
+  margin-bottom:0;
+}
+.design ol {
+  counter-reset: item; }
+  .design ol>li {
+    font-size: 14px;
+    line-height: 20px;
+    list-style-type: none;
+    position: relative; }
+    .design ol>li:before {
+      content: counter(item) ". ";
+      counter-increment: item;
+      position: absolute;
+      left: -20px;
+      top: 0; }
+    .design ol li.value-1:before {
+      content: "1. "; }
+    .design ol li.value-2:before {
+      content: "2. "; }
+    .design ol li.value-3:before {
+      content: "3. "; }
+    .design ol li.value-4:before {
+      content: "4. "; }
+    .design ol li.value-5:before {
+      content: "5. "; }
+    .design ol li.value-6:before {
+      content: "6. "; }
+    .design ol li.value-7:before {
+      content: "7. "; }
+    .design ol li.value-8:before {
+      content: "8. "; }
+    .design ol li.value-9:before {
+      content: "9. "; }
+    .design ol li.value-10:before {
+      content: "10. "; }
+.design .with-callouts ol>li {
+  list-style-position: inside;
+  margin-left: 0; }
+  .design .with-callouts ol>li:before {
+    display: inline;
+    left: -20px;
+    float: left;
+    width: 17px;
+    color: #33b5e5;
+    font-weight: 500; }
+.design .with-callouts ul>li {
+  list-style-position: outside; }
+
+/* special list items */
+li.no-bullet {
+  list-style-type: none !important; }
+li.no-bullet *{
+  margin:0; }
+
+.design li.with-icon {
+  position: relative;
+  margin-left: 20px;
+  min-height: 30px; }
+  .design li.with-icon p {
+    margin-left: 0 !important; }
+  .design li.with-icon:before {
+    position: absolute;
+    left: -40px;
+    top: 0;
+    content: '';
+    width: 30px;
+    height: 30px; }
+  .design li.with-icon.tablet:before {
+    background-image: url(../images/styles/ico_phone_tablet.png); }
+  .design li.with-icon.web:before {
+    background-image: url(../images/styles/ico_web.png); }
+  .design li.with-icon.action:before {
+    background-image: url(../images/styles/ico_action.png); }
+  .design li.with-icon.use:before {
+    background-image: url(../images/styles/ico_use.png); }
+
+/* figures and callouts */
+.figure {
+  position: relative; }
+  .figure.pad-below {
+    margin-bottom: 20px; }
+  .figure .figure-callout {
+    position: absolute;
+    color: #fff;
+    font-weight: 500;
+    font-size: 16px;
+    line-height: 23px;
+    text-align: center;
+    background: transparent url(../images/styles/callout.png) no-repeat scroll 50% 50%;
+    padding-right: 2px;
+    width: 30px;
+    height: 29px;
+    z-index: 1000; }
+    .figure .figure-callout.top {
+      top: -9px; }
+    .figure .figure-callout.right {
+      right: -5px; }
+
+.figure-caption {
+  margin: 0 10px 20px 0;
+  font-size: 14px;
+  line-height: 20px;
+  font-style: italic; }
+
+/* rows of figures */
+.figure-row {
+  font-size: 0;
+  line-height: 0;
+  /* to prevent space between figures */ }
+  .figure-row .figure {
+    display: inline-block;
+    vertical-align: top; }
+  .figure-row .figure + .figure {
+    margin-left: 10px;
+    /* reintroduce space between figures */ }
+
+/* video  containers */
+.framed-galaxynexus-land-span-13 {
+  background: transparent url(../images/styles/device_galaxynexus_blank_land_span13.png) no-repeat
+scroll top left;
+  padding: 42px 122px 62px 126px;
+  overflow: hidden; }
+  .framed-galaxynexus-land-span-13, .framed-galaxynexus-land-span-13 video,
+.framed-galaxynexus-land-span-13 img {
+    width: 512px;
+    height: 286px; }
+
+
+.framed-galaxynexus-land-span-8{
+  background: transparent url(../images/styles/device_galaxynexus_blank_land_span8.png) no-repeat
+scroll top left;
+  padding: 26px 68px 38px 72px;
+  overflow: hidden; }
+  .framed-galaxynexus-land-span-8, .framed-galaxynexus-land-span-8 video,
+.framed-galaxynexus-land-span-8 img {
+    width: 320px;
+    height: 180px; }
+
+.framed-galaxynexus-port-span-9 {
+  background: transparent url(../images/styles/device_galaxynexus_blank_port_span9.png) no-repeat
+scroll top left;
+  padding: 95px 122px 107px 124px;
+  overflow: hidden; }
+  .framed-galaxynexus-port-span-9, .framed-galaxynexus-port-span-9 video,
+.framed-galaxynexus-port-span-9 img {
+    width: 274px;
+    height: 488px; }
+
+.framed-galaxynexus-port-span-5 {
+  background: transparent url(../images/styles/device_galaxynexus_blank_port_span5.png) no-repeat
+scroll top left;
+  padding: 75px 31px 76px 33px;
+  overflow: hidden; }
+  .framed-galaxynexus-port-span-5, .framed-galaxynexus-port-span-5 video,
+.framed-galaxynexus-port-span-5 img {
+    width: 216px;
+    height: 384px; }
+
+.framed-nexus4-port-216 {
+  background: transparent url(../images/styles/device_nexus4_blank_port_432.png) no-repeat
+scroll top left;
+  background-size:240px 465px;
+  padding: 52px 12px 52px 12px;
+  overflow: hidden; }
+  .framed-nexus4-port-216, .framed-nexus4-port-216 video,
+  .framed-nexus4-port-216 img {
+    width: 216px;
+    height: 360px; }
+
+.framed-nexus5-port-span-5 {
+  background: transparent url(../images/styles/device_nexus5_blank_port_span5.png) no-repeat
+  scroll top left;
+  padding: 52px 33px 69px 31px;
+  overflow: hidden;
+}
+
+.framed-nexus5-port-span-5,
+.framed-nexus5-port-span-5 video,
+.framed-nexus5-port-span-5 img {
+  width: 216px;
+  height: 384px;
+}
+
+.framed-nexus5-land-span-13 {
+  background: transparent url(../images/styles/device_nexus5_blank_land_span13.png) no-repeat scroll top left;
+  padding: 36px 119px 54px 108px;
+  overflow: hidden;
+}
+
+.framed-nexus5-land-span-13,
+.framed-nexus5-land-span-13 video,
+.framed-nexus5-land-span-13 img {
+  width: 533px;
+  height: 300px;
+}
+
+.framed-nexus5-port-span-5,
+.framed-nexus5-port-span-5 video,
+.framed-nexus5-port-span-5 img {
+  width: 216px;
+  height: 384px;
+}
+
+/* wear device frames */
+
+.framed-wear-square {
+  background: transparent url(../images/styles/device_wear_square.png) no-repeat scroll top left;
+  background-size: 302px 302px;
+  height:222px;
+  width:222px;
+  padding:40px;
+  overflow:hidden;
+}
+
+#jd-content
+.framed-wear-square img {
+  height:222px;
+  width: 222px;
+  padding:0;
+  margin:0;
+}
+
+
+
+
+
+
+/* landing page disclosures */
+.landing-page-link {
+  text-decoration: none;
+  font-weight: 500;
+  color: #333333; }
+  .landing-page-link:after {
+    content: '';
+    background: transparent url(../images/styles/disclosure_right.png) no-repeat scroll 50% 50%;
+    width: 10px;
+    height: 10px;
+    display: inline-block;
+    margin-left: 5px; }
+
+/* tooltips */
+.tooltip-box {
+  position: absolute;
+  background-color: rgba(0, 0, 0, 0.9);
+  border-radius: 2px;
+  font-size: 14px;
+  line-height: 20px;
+  color: #fff;
+  padding: 6px 10px;
+  max-width: 250px;
+  z-index: 10000; }
+  .tooltip-box.below:after {
+    position: absolute;
+    content: '';
+    line-height: 0;
+    display: block;
+    top: -10px;
+    left: 5px;
+    border: 5px solid transparent;
+    border-bottom-color: rgba(0, 0, 0, 0.9); }
+
+/* video note */
+.video-instructions {
+  margin-top: 10px;
+  margin-bottom: 10px; }
+  .video-instructions:before {
+    content: '';
+    background: transparent url(../images/styles/ico_movie_inline.png) no-repeat scroll top left;
+    display: inline-block;
+    width: 12px;
+    height: 12px;
+    margin-right: 8px; }
+  .video-instructions:after {
+    content: 'Click device screen to replay movie.'; }
+
+/* download buttons */
+.download-button {
+  display: block;
+  margin-bottom: 5px;
+  text-decoration: none;
+  background-color: #33b5e5;
+  color: #fff !important;
+  font-weight: 500;
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12);
+  padding: 6px 12px;
+  border-radius: 2px; }
+  .download-button:hover, .download-button:focus {
+    background-color: #0099cc;
+    color: #fff !important; }
+  .download-button:active {
+    background-color: #006699; }
+
+/* UI tables and other things found in Writing style and Settings pattern */
+.ui-table {
+  width: 100%;
+  background-color: #282828;
+  color: #fff;
+  border-radius: 2px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
+  border-collapse: separate; }
+  .ui-table th,
+  .ui-table td {
+    padding: 5px 10px;
+    background-color: inherit;
+    border:0;}
+  .ui-table thead th {
+    font-weight: bold; }
+  .ui-table tfoot td {
+    border-top: 1px solid #494949;
+    border-right: 1px solid #494949;
+    text-align: center; }
+    .ui-table tfoot td:last-child {
+      border-right: 0; }
+
+.layout-with-list-item-margins {
+  margin-left: 30px !important; }
+
+.emulate-content-left-padding {
+  margin-left: 10px; }
+
+.do-dont-label {
+  margin-bottom: 10px;
+  padding-left: 20px;
+  background: transparent none no-repeat scroll 0px 3px; }
+  .do-dont-label.bad {
+    background-image: url(../images/styles/ico_wrong.png); }
+  .do-dont-label.good {
+    background-image: url(../images/styles/ico_good.png); }
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/***** PREVIOUSLY style.css ******************/
+
+
+
+
+
+@media screen, projection, print {
+[dir='rtl'] {
+    direction: rtl;
+}
+html {
+    line-height: 20px;
+}
+pre, table, input, textarea, code {
+    font-size: 1em;
+}
+address, abbr, cite {
+    font-style: normal;
+}
+[dir='rtl'] th {
+    text-align: right;
+}
+html[lang^=ja] blockquote, html[lang^=ja] q, html[lang^=ko] blockquote, html[lang^=ko] q,
+html[lang^=zh] blockquote, html[lang^=zh] q {
+    font-style: normal;
+}
+q {
+    font-style: italic;
+}
+fieldset, iframe, img {
+    border: 0;
+}
+img {
+  -ms-interpolation-mode: bicubic;
+  vertical-align: middle;
+  max-width: 100%;
+}
+q {
+    quotes: none;
+}
+sup, sub {
+    font-size: 11px;
+    line-height: 0;
+}
+}
+
+@media screen, projection {
+
+table, fieldset {
+    margin: 0;
+}
+h1 {
+    color:#333;
+    font-size: 34px;
+    margin: 36px 0 27px;
+    padding:0 0 10px;
+    font-weight:300;
+}
+h1, h2 {
+    line-height: 30px;
+}
+h1.short {
+  margin-right:320px;
+}
+h1.short {
+  margin-right:320px;
+}
+h1.super {
+    font-size: 37px;
+}
+h2 {
+    color:#333;
+    font-size: 26px;
+    margin: 32px 0 20px;
+    padding:0;
+    font-weight:300;
+}
+h3 {
+    color:#333;
+    font-size: 21px;
+    font-weight:400;
+    margin:21px 0 14px 0;
+}
+h3, h4 {
+    line-height: 21px;
+}
+h4 {
+  font-size: 18px;
+  margin: 12px 0;
+  font-weight:500;
+}
+h5 {
+  font-size: 14px;
+}
+h5, h6 {
+  margin: 5px 0;
+}
+h6 {
+  font-size: 12px;
+}
+hr { /* applied to the bottom of h2 elements */
+  height: 1px;
+  margin: 3px 0 12px;
+  border: 0;
+  background: #ccc;
+}
+p, pre, table, form {
+    margin: 0 0 15px;
+}
+small {
+  font-size: 11.5px;
+  color: #000;
+}
+ul, ol {
+    margin: 0 0 15px 18px;
+    padding: 0;
+}
+[dir='rtl'] ul, [dir='rtl'] ol {
+    margin: 10px 30px 10px 10px;
+}
+ul ul, ul ol, ol ul, ol ol {
+    margin-bottom: 0;
+    margin-top: 0;
+}
+li {
+  margin:0 0 5px;
+}
+dd {
+  margin:0 0 10px 30px;
+}
+dd p,
+dd pre,
+dd ul,
+dd ol,
+dd dl {
+  margin-top:10px;
+}
+li p,
+li pre,
+li ul,
+li ol,
+li dl {
+  margin-top:5px;
+  margin-bottom:5px;
+}
+dl dd dl:first-child {
+  margin-top:0;
+}
+pre strong, pre b, a strong, a b, a code {
+    color: inherit;
+}
+pre, code {
+    color: #060;
+    font: 13px/1.5 monospace;
+}
+code {
+    font-weight:bold;
+    font: 13px/14px monospace;
+}
+
+legend {
+    display: none;
+}
+a:link, a:visited {
+  color: #258aaf;
+  text-decoration: none;
+}
+a:focus, a:hover, a:active {
+  color: #33B5E5;
+  text-decoration: none;
+}
+a.white {
+  color: #fff;
+  text-decoration:underline;
+}
+a.white:hover, a.white:active {
+  color: #ccc !important;
+}
+strong, b {
+  font-weight:bold;
+  color: #222;
+}
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+  border:0;
+  margin: .5em 1em 1em 0;
+  width:100%; /* consistent table widths; within IE's quirks */
+  background-color:#f7f7f7;
+}
+th, td {
+  padding: 4px 12px;
+  vertical-align: top;
+  text-align: left;
+}
+td {
+  background-color:inherit;
+  border:solid 1px #DDD;
+}
+td *:last-child {
+  margin-bottom:0;
+}
+th {
+  background-color: #999;
+  color: #fff;
+  border:solid 1px #DDD;
+  font-weight: normal;
+}
+tr:first-of-type th:first-of-type:empty {
+    visibility: hidden;
+}
+
+/* --------------------------------------------------------------------------
+Footer
+*/
+.line {
+    clear: both;
+    background: #acbc00;
+    background: -moz-linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%);
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #acbc00),
+color-stop(50%, #acbc00), color-stop(50%, #bdde00), color-stop(100%, #bdde00));
+    background: -webkit-linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%);
+    background: -o-linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%);
+    background: -ms-linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%);
+    background: linear-gradient(top, #acbc00 0, #acbc00 50%, #bdde00 50%, #bdde00 100%);
+    height: 2px;
+    margin-top: 150px;
+    position: relative;
+    z-index: 11;
+}
+#footer {
+    font-size:11px;
+    clear: both;
+    color: #999;
+    padding: 15px 0;
+    margin-top:10px;
+    width:auto;
+}
+#footer-local ul {
+  list-style: none;
+  margin: 5px 0 30px 0;
+}
+#footer-local li {
+    display: inline;
+}
+#footer-local li+li:before {
+    content: '|';
+    padding: 0 3px;
+  color: #e5e5e5;
+}
+#footer-global {
+    padding: 10px 15px;
+  background: #f5f5f5;
+}
+#footer-global {
+    border-top: 1px solid #ebebeb;
+    font-size: 11.5px;
+    line-height: 1.8;
+    list-style: none;
+}
+#footer-global ul {
+    margin: 0;
+}
+#footer-global li {
+    display: inline;
+    font-weight: bold;
+}
+#footer-global li+li:before {
+    content: '¬?';
+    padding: 0 3px;
+}
+* html #footer-global li {
+    margin: 0 13px 0 0;
+}
+* [dir='rtl'] #footer-global li {
+    margin: 0 0 0 13px;
+}
+*+html #footer-global li {
+    margin: 0 13px 0 0;
+}
+*+[dir='rtl'] #footer-global li {
+    margin: 0 0 0 13px;
+}
+#footer-global li a {
+    font-weight: normal;
+}
+.locales {
+  margin: 10px 0 0 0px;
+}
+[dir='rtl'] .locales {
+    background-position: right center;
+    float: left;
+    padding: 0 24px 0 0;
+}
+.locales form {
+    margin: 0;
+}
+.locales select, .sites select {
+  line-height: 3.08;
+  margin: 0px 0;
+  border: solid 1px #EBEBEB;
+  -webkit-appearance: none;
+  background: white url('../images/arrows-up-down.png') right center no-repeat;
+  height: 30px;
+  color: #222;
+  line-height: normal;
+  padding: 5px;
+  width: 230px;
+}
+}
+
+/* =============================================================================
+   Print Only
+   ========================================================================== */
+@media print {
+  /* configure printed page */
+  @page {
+      margin: 0.75in 1in;
+      widows: 4;
+      orphans: 4;
+  }
+
+  /* reset spacing metrics */
+  html, body, .wrap {
+      margin: 0 !important;
+      padding: 0 !important;
+      width: auto !important;
+  }
+
+  /* leave enough space on the left for bullets */
+  body {
+      padding-left: 20px !important;
+  }
+  #doc-col {
+      margin-left: 0;
+  }
+
+  /* hide a bunch of non-content elements */
+  #header, #footer, #nav-x, #side-nav,
+  .training-nav-top, .training-nav-bottom,
+  #doc-col .content-footer,
+  .nav-x, .nav-y,
+  .paging-links {
+      display: none !important;
+  }
+
+  /* remove extra space above page titles */
+  #doc-col .content-header {
+      margin-top: 0;
+  }
+
+  /* bump up spacing above subheadings */
+  h2 {
+      margin-top: 40px !important;
+  }
+
+  /* print link URLs where possible and give links default text color */
+  p a:after {
+      content: " (" attr(href) ")";
+      font-size: 80%;
+  }
+  p a {
+      word-wrap: break-word;
+  }
+  a {
+      color: inherit;
+  }
+
+  /* syntax highlighting rules */
+  .str { color: #060; }
+  .kwd { color: #006; font-weight: bold; }
+  .com { color: #600; font-style: italic; }
+  .typ { color: #404; font-weight: bold; }
+  .lit { color: #044; }
+  .pun { color: #440; }
+  .pln { color: #000; }
+  .tag { color: #006; font-weight: bold; }
+  .atn { color: #404; }
+  .atv { color: #060; }
+}
+
+/* =============================================================================
+   Columns
+   ========================================================================== */
+
+@media screen, projection, print {
+.full {
+  padding: 2.5em 0;
+  border-top: solid 1px #ddd;
+  border-bottom: solid 1px #ddd;
+  background: #f7f7f7;
+}
+.wrap {
+  margin: 0 auto;
+  width: 940px;
+  clear: both;
+}
+.cols {
+    height: 1%;
+    margin: 0 -1.533742331288343558282%;
+    width: 103.06748466257669%}
+*+html .cols {
+    margin-bottom: 20px;
+}
+.cols:after {
+    clear: both;
+    content: ' ';
+    display: block;
+    height: 0;
+    visibility: hidden;
+}
+.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12,
+.col-13, .col-14, .col-15, .col-16 {
+    display: inline;
+  float: left;
+  margin-left: 10px;
+  margin-right: 10px;
+}
+/*
+* html .col-1, * html .col-2, * html .col-3, * html .col-4, * html .col-5, * html .col-6, * html
+.col-7, * html .col-8, * html .col-9, * html .col-10, * html .col-11, * html .col-12  {
+    margin: 0;
+    padding: 0 1.4% 20px;
+}
+[dir='rtl'] .col-1, [dir='rtl'] .col-2, [dir='rtl'] .col-3, [dir='rtl'] .col-4, [dir='rtl'] .col-5,
+[dir='rtl'] .col-6, [dir='rtl'] .col-7, [dir='rtl'] .col-8, [dir='rtl'] .col-9, [dir='rtl'] .col-10,
+[dir='rtl'] .col-11, [dir='rtl'] .col-12 {
+    float: right;
+}
+*/
+.col-1 { width: 40px }
+.col-2 { width: 100px }
+.col-3 { width: 160px }
+.col-4 { width: 220px }
+.col-5 { width: 280px }
+.col-6 { width: 340px }
+.col-7 { width: 400px }
+.col-8 { width: 460px }
+.col-9 { width: 520px }
+.col-10 { width: 580px }
+.col-11 { width: 640px }
+.col-12 { width: 700px }
+.col-13 { width: 760px }
+.col-14 { width: 820px }
+.col-15 { width: 880px }
+.col-16 { width: 940px }
+}
+
+.col-right {
+  margin-right:0px;
+}
+
+@media screen and (max-width:772px) {
+.col-5, .col-6, .col-7 {
+    clear: both;
+    width: 97.0238096%}
+}
+
+/* =============================================================================
+   Layout
+   ========================================================================== */
+@media screen, projection, print {
+
+/* --------------------------------------------------------------------------
+Header, Login, Nav-X, Search
+*/
+#header {
+  margin: 0;
+  padding: 0;
+}
+#header:before, #header:after {
+  content: "";
+  display: table;
+  clear: both
+}
+.logo, .nav-x {
+    float: left;
+}
+.nav-x {
+    margin-top: -2px;
+  list-style-type: none;
+}
+.nav-x a {
+    color: #333;
+    font-size: 16px;
+}
+.about a.selected {
+    color: #9933CC;
+}
+.design a.selected {
+    color: #33b5e5;
+}
+.develop a.selected {
+    color: #F80;
+}
+.distribute a.selected {
+    color: #9C0;
+}
+
+
+
+.nav-x li {
+    display: inline;
+    margin-right: 45px;
+}
+.search {
+  float: right;
+  position: relative;
+  width: 220px
+}
+.search .bottom, .search .left, .search .right {
+  position: absolute;
+  background-color: #a3a3a3;
+}
+.search .bottom {
+  width: 220px;
+  height: 1px;
+  top: 24px;
+  left: 0
+}
+.search .left, .search .right {
+  height: 5px;
+  width: 1px
+}
+.search .left { top: 19px; left: 0 }
+.search .right { top: 19px; right: 0 }
+.search form {
+  float: left;
+  margin-top: 2px;
+  width: inherit;
+}
+.search .close,
+#player-frame .close {
+  position: absolute;
+  right: 8px;
+  bottom: 4px;
+  width: 16px;
+  height: 16px;
+  margin: 0;
+  text-indent: -1000em;
+  background: url(../images/close.png) no-repeat 0 0;
+  z-index:9999;
+}
+.search .close:hover, .search .close:focus,
+#player-frame .close:hover, #player-frame .close:focus {
+  background-position: -16px 0;
+  cursor:pointer;
+}
+#player-frame .close {
+  top: 6px;
+}
+.search form input {
+  color: #999;
+  font-size: 1em;
+  width: inherit;
+  border: none;
+  margin: 0;
+  padding:0 0 0 6px;
+  z-index: 1500;
+  background-color: transparent
+}
+.search:hover .bottom, .search:hover .left, .search:hover .right {
+  background-color: #33b5e5;
+}
+.search:hover .icon {
+  background-position: -8px 0
+}
+.search form input:focus {
+  color: #222;
+  font-weight: bold;
+  outline:0;
+}
+/* Search Dropdown */
+.search-dropdown {
+  padding: 15px;
+  width: 192px;
+  border: solid 1px #c5c5c5;
+  background: #fff;
+  position: absolute;
+  top: 35px;
+  left: 0;
+  -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2);
+  -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2);
+  box-shadow: 0  0 10px rgba(0,0,0,0.2)
+}
+.search-dropdown ul, .search-dropdown ul li {
+  list-style-type: none;
+  margin: 0;
+  padding: 0
+}
+.search-dropdown ul li {
+  clear: both
+}
+.search-dropdown img {
+  float: left;
+  margin: 0 10px 10px 0
+}
+.search-dropdown h6 {
+  color: #222;
+  margin: 0;
+  line-height: normal
+}
+.search-dropdown .desc {
+  color: #999;
+  font-size: 11.5px;
+  line-height: normal;
+  margin: 0;
+}
+.search-dropdown li a:hover h6, .search-dropdown li a:hover .desc {
+  color: #33b5e5
+}
+/* --------------------------------------------------------------------------
+Buttons
+*/
+.button, a.button, .button-secondary, a.button-secondary {
+  border-image: initial;
+    -webkit-border-radius: 2px;
+    -moz-border-radius: 2px;
+    border-radius: 2px;
+    cursor: pointer;
+}
+.button, a.button {
+    display:inline-block;
+    background-color: #09c;
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#2faddb), to(#09c));
+    background-image: -webkit-linear-gradient(top, #2faddb, #09c);
+    background-image: -moz-linear-gradient(top, #2faddb, #09c);
+    background-image: -ms-linear-gradient(top, #2faddb, #09c);
+    background-image: -o-linear-gradient(top, #2faddb, #09c);
+    background-image: linear-gradient(top, #2faddb, #09c);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2faddb', EndColorStr='#0099cc',GradientType=0);
+    border: 1px solid #3990ab;
+    color: #fff;
+}
+.button-secondary, a.button-secondary {
+    background-color: #f3f3f3;
+    border: 1px solid #dcdcdc;
+    color: #444;
+}
+a.button, a.button:visited, a.button-secondary, a.button-secondary:visited {
+    margin-right: 16px;
+   font-weight: 400;
+    min-width: 54px;
+    outline: 0;
+    padding: 8px 15px;
+    text-align: center;
+}
+.button, .button-secondary {
+    margin-right: 16px;
+  font-weight: 400;
+    min-width: 54px;
+    outline: 0;
+    padding: 0 15px;
+    text-align: center;
+}
+.button:hover, a.button:hover {
+    border-color: #09c;
+    background-color: #4cadcb;
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#5dbcd9), to(#4cadcb));
+    background-image: -webkit-linear-gradient(top, #5dbcd9, #4cadcb);
+    background-image: -moz-linear-gradient(top, #5dbcd9, #4cadcb);
+    background-image: -ms-linear-gradient(top, #5dbcd9, #4cadcb);
+    background-image: -o-linear-gradient(top, #5dbcd9, #4cadcb);
+    background-image: linear-gradient(top, #5dbcd9, #4cadcb);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#5dbcd9',
+EndColorStr='#4cadcb',GradientType=0);
+    color: #fff !important;
+}
+.button:active, a.button:active {
+    background-color: #1e799a;
+    background-image: none;
+    border-color: #30b7e6;
+}
+a.button.big.subtitle {
+  line-height:18px;
+}
+.button-secondary:hover, a.button-secondary:hover {
+    border-color: #dbdbdb;
+    background-color: #f3f3f3;
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#ececec));
+    background-image: -webkit-linear-gradient(top, #f9f9f9, #ececec);
+    background-image: -moz-linear-gradient(top, #f9f9f9, #ececec);
+    background-image: -ms-linear-gradient(top, #f9f9f9, #ececec);
+    background-image: -o-linear-gradient(top, #f9f9f9, #ececec);
+    background-image: linear-gradient(top, #f9f9f9, #ececec);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f9f9f9',
+EndColorStr='#ececec');
+    color: #33B5E5 !important;
+}
+.button-secondary:active, a.button-secondary:active {
+   border-color: #dadada;
+  background: #ebebeb; /* Old browsers */
+  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
+  background:
+url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/
+Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0Jv
+eD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+
+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIg
+eDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ViZWJl
+YiIgc3RvcC1vcGFjaXR5PSIxIi8+
+CiAgICA8c3RvcCBvZmZzZXQ9IjEwJSIgc3RvcC1jb2xvcj0iI2Y5ZjlmOSIgc3RvcC1vcGFjaXR5PSIxIi8+
+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2ZhZmFmYSIgc3RvcC1vcGFjaXR5PSIxIi8+
+CiAgICA8c3RvcCBvZmZzZXQ9IjkwJSIgc3RvcC1jb2xvcj0iI2Y5ZjlmOSIgc3RvcC1vcGFjaXR5PSIxIi8+
+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmNmY2ZjYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFy
+R3JhZGllbnQ+
+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIg
+Lz4KPC9zdmc+);
+  background: -moz-linear-gradient(top,  #ebebeb 0%, #f9f9f9 5%, #fafafa 50%, #f9f9f9 90%,
+#ffffff 100%); /* FF3.6+ */
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ebebeb),
+color-stop(5%,#f9f9f9), color-stop(50%,#fafafa), color-stop(90%,#f9f9f9), color-stop(100%,#ffffff));
+/* Chrome,Safari4+ */
+  background: -webkit-linear-gradient(top,  #ebebeb 0%,#f9f9f9 5%,#fafafa 50%,#f9f9f9
+90%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
+  background: -o-linear-gradient(top,  #ebebeb 0%,#f9f9f9 5%,#fafafa 50%,#f9f9f9 90%,#ffffff
+100%); /* Opera 11.10+ */
+  background: -ms-linear-gradient(top,  #ebebeb 0%,#f9f9f9 5%,#fafafa 50%,#f9f9f9 90%,#ffffff
+100%); /* IE10+ */
+  background: linear-gradient(top,  #ebebeb 0%,#f9f9f9 5%,#fafafa 50%,#f9f9f9 90%,#ffffff
+100%); /* W3C */
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebebeb',
+endColorstr='#ffffff',GradientType=0 ); /* IE6-8 */
+  -webkit-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05);
+  -moz-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05);
+  box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05);
+  color: #258AAF !important;
+}
+.button.big {
+  font-size:20px;
+  display:inline-block;
+}
+.button.big span.small {
+  font-size:14px;
+}
+.button-caption {
+  margin-top:10px;
+  font-size:12px;
+  font-style:italic;
+}
+
+.button.disabled,
+.button.disabled:hover,
+.button.disabled:active {
+  background:#ebebeb;
+  color:#999 !important;
+  border-color:#999;
+  cursor:default;
+}
+
+.training-nav-top a.button-secondary,
+.training-nav-bottom a.button-secondary {
+  display:block;
+  float:left;
+  margin:0;
+  width:130px;
+  text-transform:uppercase;
+  font-weight:bold;
+
+    background-color: #f3f3f3;
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#ececec));
+    background-image: -webkit-linear-gradient(top, #f9f9f9, #ececec);
+    background-image: -moz-linear-gradient(top, #f9f9f9, #ececec);
+    background-image: -ms-linear-gradient(top, #f9f9f9, #ececec);
+    background-image: -o-linear-gradient(top, #f9f9f9, #ececec);
+    background-image: linear-gradient(top, #f9f9f9, #ececec);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f9f9f9',
+EndColorStr='#ececec');
+    color: #33B5E5;
+}
+
+.training-nav-top a.button-secondary:hover,
+.training-nav-bottom a.button-secondary:hover {
+    background-color: #09c;
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#2faddb), to(#09c));
+    background-image: -webkit-linear-gradient(top, #2faddb, #09c);
+    background-image: -moz-linear-gradient(top, #2faddb, #09c);
+    background-image: -ms-linear-gradient(top, #2faddb, #09c);
+    background-image: -o-linear-gradient(top, #2faddb, #09c);
+    background-image: linear-gradient(top, #2faddb, #09c);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2faddb', EndColorStr='#09c');
+    border: 1px solid #3990ab;
+    color: #fff !important;
+}
+
+.training-nav-top a.button-secondary.last,
+.training-nav-bottom a.button-secondary.last {
+  border-left:0;
+}
+
+.training-nav-top a.button-secondary.double-size,
+.training-nav-bottom a.button-secondary.double-size {
+  width:291px;
+}
+
+.training-nav-top,
+.training-nav-bottom {
+  float:right;
+  margin:0 0 0 20px;
+}
+
+.training-nav-top {
+  position:relative;
+  top:73px;
+}
+
+.training-nav-bottom {
+  padding:0 0 20px;
+}
+
+#tb-wrapper,
+#qv-wrapper {
+  float:right;
+  clear:right;
+  margin:6px 0 0 30px; /* negative top-margin to counter the content-header bottom margin */
+  padding:0 0 30px;
+}
+
+#tb-wrapper {
+  margin:51px 0 0 20px; /* negative top-margin to counter the content-header bottom margin */
+}
+
+#tb,
+#qv {
+  font-size:13px;
+  line-height:18px;
+  width:238px;
+  border:1px solid #ccc;
+  float:right;
+}
+
+#tb {
+  width:278px;
+}
+
+#tb h2,
+#qv h2 {
+  margin:10px 15px;
+  padding:0;
+  text-transform:uppercase;
+  border-bottom:1px solid gainsboro;
+}
+
+#tb *,
+#qv * {
+  font-size:inherit;
+}
+
+#tb .download-box,
+#qv .download-box {
+  padding:0 0 0 15px;
+}
+
+#tb .download-box .filename,
+#qv .download-box .filename {
+  font-size:11px;
+  margin:4px 4px 10px;
+  color:#666;
+}
+
+
+/* Dev guide quicknav */
+
+.sidebox-wrapper {
+  float:right;
+  clear:right;
+  margin:0 0 0 20px;
+  padding:0 0 20px;
+}
+
+.sidebox {
+  width:226px;
+  font-size:13px;
+  line-height:18px;
+  border-left:4px solid #99CC00;
+  float:right;
+  padding:0 0 0 10px;
+  margin:0 0 1em 20px;
+}
+
+.sidebox h2,
+.sidebox h3,
+.sidebox h4,
+.sidebox h5 {
+  font-weight:bold;
+  margin:0 0 10px;
+  line-height: 16px;
+}
+
+.sidebox * {
+  font-size:inherit;
+}
+
+.sidebox > *:last-child {
+  margin-bottom:0;
+}
+
+#tb ol,
+#tb ul,
+#qv ul {
+  margin:0 15px 10px 35px;
+}
+
+#tb p {
+  margin:0 15px 10px;
+}
+
+#qv ol {
+  list-style:none;
+  margin:0 15px 15px;
+  font-size:inherit;
+  line-height:inherit;
+}
+
+#tb ol ol,
+#tb ul ul,
+#qv ol ol,
+#qv ul ul,
+.sidebox ol ol,
+.sidebox ul ul {
+  margin-bottom:0;
+}
+
+#qv ol ol {
+  margin:3px 0 3px 15px;
+}
+
+.sidebox p,
+#qv p,
+#tb p {
+  margin: 0 0 10px;
+}
+
+/* related resources blocks in checklists */
+
+/* related resources sections that have dynamic content */
+
+
+
+h3.rel-resources {
+margin:1.25em auto;
+}
+
+/* --------------------------------------------------------------------------
+Form
+*/
+.article form {
+    margin: 0 0 20px;
+}
+.article form .form-required {
+    color: #dd4b39;
+}
+.article form fieldset {
+    margin: 0 0 20px;
+    padding: 0;
+}
+.article form legend {
+    display: block;
+    line-height: 1.5;
+    margin: 0;
+    padding: 0;
+}
+/*
+.article form ol, .article form ul {
+    margin: 0 0 0 1em;
+    padding: 0 0 0 1em;
+}
+[dir='rtl'] .article form ol, [dir='rtl'] .article form ul {
+    margin: 0 1em 0 0;
+    padding: 0 1em 0 0;
+}
+.article form ol ul, .article form ul ul, [dir='rtl'] .article form ol ul, [dir='rtl'] .article form
+ul ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+.article form li {
+    margin: 0 0 20px;
+}
+.article form li li {
+    margin: 0 0 5px;
+}
+*/
+.article form label {
+    display: block;
+    margin: 0 0 5px;
+    padding: 0;
+}
+.article form input[type='text'], .article form select, .article form textarea, .article form
+.checkbox-group, .article form .radio-group {
+    margin-bottom: 15px;
+}
+.checkbox-group input {
+  width: 13px;
+  height: 13px;
+  background: #fff;
+  border: solid 1px #c6c6c6;
+  float: left;
+}
+.article form .checkbox-group, .article form .radio-group {
+  display: block
+}
+.article form select {
+    border: solid 1px #ebebeb;
+    border-top-color: #ddd;
+    -webkit-appearance: none;
+    background: #f3f3f3 url(../images/arrows-up-down.png) right center no-repeat;
+    height: 30px;
+    color: #222;
+    line-height: normal;
+    padding: 5px;
+    width: 130px;
+}
+
+.article form .browse .browse-msg {
+  font-size: 11.5px;
+}
+.article form .browse .button-secondary {
+  height: auto;
+  line-height: 25px;
+  font-size: 11px;
+  padding: 0 8px;
+  margin: 0 10px 15px 0;
+}
+.article form input[type='text'], .article form textarea {
+    border: 1px solid #ebebeb;
+    border-top-color: #dcdcdc;
+    color: #222;
+    line-height: normal;
+    padding: 6px 10px;
+    width: 300px;
+}
+.article form textarea {
+    height: 150px;
+}
+.article form input[type='text']:focus, .article form textarea:focus {
+    border-color: #33B5E5;
+    -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2);
+    -o-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2);
+    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2);
+    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2);
+    outline: 0;
+}
+.article form input[disabled], .article form textarea[disabled], .article form label.form-disabled {
+    color: #999;
+}
+.article form input[type='text'][disabled], .article form textarea[disabled] {
+    background-color: #ebebeb;
+}
+form .form-error input[type='text'], form .form-error textarea {
+    border-color: #dd4b39;
+  margin-right: 20px;
+}
+.aside {
+    -moz-border-radius: 2px;
+    -webkit-border-radius: 2px;
+    border-radius: 2px;
+    margin: 10px 0;
+    padding: 20px;
+  color: #666;
+    position: relative;
+  background: #f9f9f9;
+}
+/*
+.aside, .notification, .promo {
+    -moz-border-radius: 2px;
+    -webkit-border-radius: 2px;
+    border-radius: 2px;
+    margin: 10px 0;
+    padding: 10px;
+    position: relative;
+}
+.aside>:first-child, .notification>:first-child, .promo>:first-child {
+    margin-top: 0;
+}
+.aside>:last-child, .notification>:last-child, .promo>:last-child {
+    margin-bottom: 0;
+}
+.aside {
+    background: #f9f9f9;
+}
+.notification {
+    background: #fffbe4;
+    border-color: #f8f6e6;
+}
+.promo {
+    background: #f6f9ff;
+    border-color: #eff2f9;
+}
+*/
+
+/* SDK TOS styles */
+
+div.sdk-terms {
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  font-family: inherit;
+  font-size: inherit;
+  padding: 10px;
+  height: 370px;
+  width: 738px;
+  border: 1px solid #444;
+  background: transparent;
+  overflow:auto;
+  margin:0 0 10px;
+}
+
+div.sdk-terms.fullsize {
+  padding: 0;
+  height: auto;
+  width: auto;
+  border:none;
+}
+
+div.sdk-terms h3,
+div.sdk-terms h2 {
+  margin:0;
+}
+
+div#sdk-terms-form {
+  padding:0 0 0 10px;
+}
+
+div#sdk-terms-form input {
+  display:inline;
+  margin:4px 4px 4px 0;
+}
+
+
+/* --------------------------------------------------------------------------
+Code Style
+*/
+pre {
+  margin:0 0 1em 0;
+  padding: 1em;
+  overflow: auto;
+  border: solid 1px #ddd;
+  background: #f7f7f7;
+}
+.str { color: #800; } /* Code string */
+.kwd { color: #008; }
+.typ { color: #606; }
+.lit { color: #066; }
+.pun { color: #660; }
+.pln { color: #000; }
+.tag { color: #008; }
+.atn { color: #828; }
+.atv { color: #800; } /* XML string */
+.dec { color: #606; }
+
+/* --------------------------------------------------------------------------
+Three-Pane
+*/
+/* Package Nav & Classes Nav */
+.three-pane {
+  position: relative;
+  border-top: solid 1px #ebebeb;
+}
+#packages-nav .js-pane,
+#classes-nav .js-pane {
+  overflow:visible;
+}
+#packages-nav {
+        height:270px;
+  max-height: inherit;
+  overflow: hidden;
+  position: relative;
+}
+#classes-nav {
+  overflow: hidden;
+  position: relative;
+}
+#packages-nav ul, #classes-nav ul {
+  list-style-type: none;
+  margin: 10px 0 20px 0;
+  padding: 0;
+}
+#classes-nav li {
+  font-weight: bold;
+  margin: 5px 0;
+}
+#packages-nav li,
+#classes-nav li li {
+  margin: 0;
+}
+#packages-nav li a, #packages-nav li a:active, #packages-nav li a:visited,
+#classes-nav li a, #classes-nav li a:active, #classes-nav li a:visited {
+  padding: 0 0 0 4px;
+}
+#packages-nav li a, #packages-nav li a:active, #packages-nav li a:visited,
+#classes-nav li li a, #classes-nav li li a:active, #classes-nav li li a:visited,
+#nav-tree li a, #nav-tree li a:active, #nav-tree li a:visited {
+  color: #222;
+  font-weight: normal;
+}
+#packages-nav li a, #packages-nav li a:active, #packages-nav li a:visited,
+#classes-nav li li a, #classes-nav li li a:active, #classes-nav li li a:visited {
+  display: block;
+}
+#packages-nav li.selected a, #packages-nav li.selected a:active, #packages-nav li.selected
+a:visited,
+#classes-nav li li.selected a, #classes-nav li li.selected a:active, #classes-nav li li.selected
+a:visited,
+#nav-tree li div.selected {
+    font-weight: 500;
+    color: #0099cc;
+    background-color:#fff; }
+  #packages-nav li.selected ul li a,
+  #classes-nav li.selected ul li a {
+  /* don't highlight child items */
+    color: #555555; }
+#nav-tree li div.selected a {
+    font-weight: 500;
+    color: #0099cc;
+}
+#nav-swap {
+  height:30px;
+  border-top:1px solid #ccc;
+}
+#nav-swap a {
+  display:inline-block;
+  height:100%;
+  color: #222;
+  font-size: 12px;
+  padding: 5px 0 5px 5px;
+}
+
+#nav-swap .fullscreen {
+  float: right;
+  width: 24px;
+  height: 24px;
+  text-indent: -1000em;
+  padding:0;
+  margin:3px 5px 0;
+  background: url(../images/fullscreen.png) no-repeat -24px 0;
+}
+#nav-swap .fullscreen.disabled {
+  background-position: 0 0;
+}
+#nav-swap .fullscreen:hover,
+#nav-swap .fullscreen:focus {
+  cursor:pointer;
+}
+
+
+/* nav tree */
+#side-nav, #swapper,
+#nav-tree, #tree-list {
+  overflow:hidden;
+  margin-left:0;
+}
+
+#devdoc-nav {
+  overflow:visible !important; /* To keep the "to top" button visible */
+}
+
+#nav-tree ul {
+  list-style:none;
+  padding:0;
+  margin:10px 0;
+}
+
+#nav-tree ul li div {
+  padding:0 0 0 4px;
+}
+
+#side-nav #nav-tree ul li a,
+#side-nav #nav-tree ul li span.no-children {
+  padding: 0;
+  margin: 0;
+}
+
+#nav-tree .plus {
+  margin: 0 3px 0 0;
+}
+
+#nav-tree ul ul {
+  list-style: none;
+  margin: 0;
+  padding: 0 0 0 0;
+}
+
+#nav-tree ul li {
+  margin: 0;
+  padding: 0 0 0 0;
+  white-space: nowrap;
+}
+
+#nav-tree .children_ul {
+  padding:0;
+  margin:0;
+}
+#nav-tree .children_ul li div {
+  padding:0 0 0 10px;
+}
+#nav-tree .children_ul .children_ul li div {
+  padding:0 0 0 20px;
+}
+
+#nav-tree a.nolink {
+  color: #222;
+  text-decoration: none;
+}
+
+#nav-tree span.label {
+  width: 100%;
+}
+
+#nav-tree {
+  overflow-x: auto;
+  overflow-y: scroll;
+  outline:0;
+}
+
+
+/* Content */
+#doc-col {
+  margin-right:0;
+}
+
+/* Uncomment this for preview release watermark
+#doc-col {
+  background: url('../images/preview.png') repeat;
+}
+*/
+
+#doc-content-container {
+  margin-left: 291px
+}
+#doc-header, #doc-content {
+  padding: 1em 2em;
+}
+#doc-header {
+  background: #f7f7f7;
+}
+#doc-header h1 {
+  line-height: 0;
+  margin-bottom: 15px;
+}
+#api-info-block {
+  float: right;
+  font-weight: bold;
+}
+#api-info-block a, #api-info-block a:active, #api-info-block a:visited {
+  color: #222;
+}
+#api-info-block a:hover, #api-info-block a:focus {
+  color: #33B5E5;
+}
+#api-nav-header {
+  height:19px; /* plus 16px padding = 35; same as #nav li */
+  font-size:14px;
+  padding: 8px 0;
+  margin: 0;
+  border-bottom: 1px solid #CCC;
+  background:#e9e9e9;
+  background: rgba(0, 0, 0, 0.05); /* matches #nav li.expanded */
+
+}
+#api-nav-title {
+  padding:0 5px;
+  white-space:nowrap;
+}
+
+#api-level-toggle {
+  float:right;
+  padding:0 5px;
+}
+
+#api-level-toggle label {
+  margin:0;
+  vertical-align:top;
+  line-height: 19px;
+  font-size:13px;
+  height: 19px;
+}
+
+#api-level-toggle .select-wrapper {
+  width: 35px;
+  display: inline-block;
+  overflow: hidden;
+}
+#api-level-toggle select {
+  border: 0;
+  appearance:none;
+  -moz-appearance:none;
+  -webkit-appearance: none;
+  background: transparent url(../images/arrows-up-down.png) 23px 5px no-repeat;
+  color: #222;
+  height: 19px;
+  line-height: 19px;
+  padding: 0;
+  margin:1px 0 0 0;
+  width:150%;
+  font-size:13px;
+  vertical-align:top;
+  outline:0;
+}
+
+
+/* Toggle for revision notes and stuff */
+div.toggle-content.closed .toggle-content-toggleme {
+  display:none;
+}
+
+#jd-content img.toggle-content-img {
+  margin:0 5px 5px 0;
+}
+
+div.toggle-content-toggleme {
+  padding:0 0 0 15px;
+}
+
+
+/* API LEVEL FILTERED MEMBERS */
+
+.absent,
+.absent a:link,
+.absent a:visited,
+.absent a:hover,
+.absent * {
+  color:#bbb !important;
+  cursor:default !important;
+  text-decoration:none !important;
+}
+#devdoc-nav li.absent.selected,
+#devdoc-nav li.absent.selected *,
+#devdoc-nav div.label.absent.selected,
+#devdoc-nav div.label.absent.selected * {
+  background-color:#eaeaea !important;
+}
+.absent h4.jd-details-title,
+.absent h4.jd-details-title * {
+  background-color:#f6f6f6 !important;
+}
+.absent img {
+  opacity: .3;
+  filter: alpha(opacity=30);
+  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
+}
+
+
+
+
+
+
+
+
+
+/* JQUERY RESIZABLE STYLES */
+.ui-resizable { position: relative; }
+.ui-resizable-handle { position: absolute; display: none; font-size: 0.1px; z-index:1; }
+.ui-resizable .ui-resizable-handle { display: block; border-bottom: 1px solid #e4e4e4; }
+/*body .ui-resizable-disabled .ui-resizable-handle { display: none; }
+body .ui-resizable-autohide .ui-resizable-handle { display: none; }*/
+.ui-resizable-s { cursor: s-resize; height: 10px; width: 100% !important; bottom: -11px; left: 0;
+border-bottom: solid 1px #ededed;
+  background: #f7f7f7 url("../images/resizable-s2.png") no-repeat scroll center center; }
+/*
+.ui-resizable-e {
+cursor: e-resize; width: 10px; right: 0; top: 0; height: 100%; border-right: solid
+1px #ededed;background: #f7f7f7 url("../images/resizable-e2.png") no-repeat scroll center center; }
+*/
+
+/* --------------------------------------------------------------------------
+Lightbox
+*/
+.lightbox {
+  width: 769px;
+  padding: 1.5em;
+  margin: 0 auto;
+  border: solid 1px #dcdcdc;
+  background: #fff;
+  -moz-box-shadow: 1px 1px 5px rgba(0,0,0,0.1);
+  -webkit-box-shadow: 1px 1px 5px rgba(0,0,0,0.1);
+  box-shadow: 1px 1px 5px rgba(0,0,0,0.1)
+}
+.lightbox .header {
+  float: left;
+  width: 720px;
+  margin: -10px 20px 10px 0;
+}
+.lightbox .close {
+  float: right;
+  width: 10px;
+  height: 10px;
+  margin: -10px -10px 10px 0;
+  text-indent: -1000em;
+  background: url(../images/close.png) no-repeat 0 0;
+}
+.lightbox .close:hover, .lightbox .close:focus {
+  background-position: -10px 0;
+}
+
+/* --------------------------------------------------------------------------
+Styles for samples browser
+*/
+
+#codesample-wrapper {
+  width:100000px; /* super wide to contain floats, but doesn't cause scroll */
+  overflow:visible;
+}
+pre#codesample-block {
+  float:left;
+  overflow:visible;
+  background:transparent;
+  border:none;
+}
+pre#codesample-block a.number {
+  display:none;
+}
+pre#codesample-block .code-line:hover {
+  background:#e7e7e7;
+}
+pre#codesample-line-numbers {
+  float:left;
+  width:2em;
+  background:transparent;
+  border:none;
+  border-right:1px solid #ccc;
+  padding-left:0;
+  font-family:monospace;
+  text-align:right;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: -moz-none;
+  -ms-user-select: none;
+  user-select: none;
+}
+pre#codesample-line-numbers a {
+  color:#999;
+}
+pre#codesample-line-numbers.hidden {
+  display:none;
+}
+pre#codesample-block span.code-line {
+  width:100%;
+  display:inline-block;
+}
+
+/*
+Styles for displaying image or video resources in samples browser.
+Resources are marked as no-display if they exceed the size limit.
+*/
+div#codesample-resource img, div#codesample-resource video {
+  border: 1px solid #ececec;
+}
+
+div#codesample-resource.noDisplay div {
+  border: 1px solid #ececec;
+  width:120px;
+  margin-bottom:4px;
+  padding:20px;
+}
+
+div#codesample-resource .noDisplay-message:after {
+  font-style:italic;
+  font-size:12px;
+  content: 'This resource is not available for browsing. To view it, please download the project.';
+}
+
+/*
+Styles for project structure (treeview) page
+*/
+.structure-dir {
+background-image:url(../../assets/images/folder.png);
+background-repeat:no-repeat;
+background-position:16px 2px;
+  margin:.25em 0 0 0;
+  padding:0 0 0 0;
+}
+
+.structure-toggleme {
+  margin:0 0 0 3em;
+  padding:0 0 0 0;
+  text-decoration:none;
+}
+
+.structure-java{
+background-image:url(../../assets/images/file-java.png);
+background-repeat:no-repeat;
+background-position:0px 2px;
+  margin:.3em 0 0 0;
+  padding:.3em 0 .3em 22px;
+}
+
+.structure-file {
+background-image:url(../../assets/images/file-generic.png);
+background-repeat:no-repeat;
+background-position:0px 2px;
+  margin:.3em 0 0 0;
+  padding:.3em 0 .3em 22px;
+}
+
+.structure-xml {
+background-image:url(../../assets/images/file-xml.png);
+background-repeat:no-repeat;
+background-position:0px 2px;
+  margin:.3em 0 0 0;
+  padding:.3em 0 .25em 22px;
+}
+
+.structure-img {
+background-image:url(../../assets/images/file-image.png);
+background-repeat:no-repeat;
+background-position:0px 2px;
+  margin:.3em 0 0 0;
+  padding:.3em 0 .25em 22px;
+}
+
+.structure-manifest {
+background-image:url(../../assets/images/file-manifest.png);
+background-repeat:no-repeat;
+  margin:.0 0 0 1.25em;
+  padding:0 0 0 22px;
+  text-decoration:none;
+}
+
+#jd-content .structure-toggle-img {
+  margin:.5em 0 0 0;
+padding-right:2.1em;
+}
+
+.dirInfo {
+  margin-left:2em;
+}
+
+.structure-dir a {
+  text-decoration:none;
+}
+
+.structure-manifest a {
+  text-decoration: none;
+}
+.structure-file a {
+  text-decoration: none;
+}
+
+.sampleEmbed {
+  background-color:rgb(249, 249, 249);
+}
+
+.sampleEmbed ol.lineNumbers {
+  list-style-type: decimal;
+  padding-left:1em;
+}
+
+.sampleEmbed ol.lineNumbers li {
+border-left:1px solid #ddd;
+border-right:1px solid #ddd;
+color:gray;
+background-color:#f7f7f7;
+margin:0 0 0 24px;
+padding: 2px 2px 2px 6px;
+}
+
+.sampleEmbed ol.lineNumbers li:hover {
+background: #efefef;
+}
+
+.samples-nav li a {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* --------------------------------------------------------------------------
+Styles for raw formatted line numbers (not used with listformatted version)
+div.sampleLine div.lineNumber {
+  display: inline;
+}
+div.sampleLine div.lineCode {
+  display: inline;
+  padding-left:6px;
+}
+div.sampleLine {
+  padding:0;
+  margin:0;
+}*/
+
+/* --------------------------------------------------------------------------
+Butterbar
+*/
+#butterbar-wrapper {
+  position:absolute;
+  top:0;
+  left:0;
+  width:100%;
+}
+#butterbar {
+  width:940px;
+  margin:0 auto;
+}
+#butterbar-message {
+  background-color:#f80;
+  float:right;
+  font-size:12px;
+  font-weight:bold;
+  padding:0 10px;
+  border-radius: 0 0 5px 5px;
+}
+#butterbar-message a {color:#fff !important}
+#butterbar-message a:hover {text-decoration:underline;}
+
+/* --------------------------------------------------------------------------
+Misc
+*/
+
+
+.clearfix:before, .clearfix:after {
+  content: "";
+  display: table
+}
+.clearfix:after {
+  clear: both
+}
+.clearfix {
+  *zoom: 1
+}
+table.blank th, table.blank td {
+    border: 0;
+  background: none
+}
+.caption {
+  margin: 0.5em 0 2em 0;
+  color: #000;
+  font-size: 11.5px;
+}
+
+.nolist, .nolist ul, .nolist ol {
+  list-style:none;
+  margin-left:0;
+}
+#tb .nolist {
+  margin-left:15px;
+}
+
+dl.xml>dt {
+  text-transform:uppercase;
+}
+dl.xml dl.attr {
+  margin-top:0;
+}
+
+pre.classic {
+  background-color:transparent;
+  border:none;
+  padding:0;
+}
+
+p.img-caption {
+  margin: -10px 0 20px;
+  font-size:13px;
+  color:#666;
+}
+
+div.figure,
+div.figure-right {
+  float:right;
+  clear:right;
+  margin:10px 0 0 0;
+  padding:0 0 0 20px;
+  /* width must be defined w/ an inline style matching the image width */
+}
+
+div.figure-left {
+  float:left;
+  clear:left;
+  margin:10px 0 0 0;
+  padding:0 20px 0 0;
+  /* width must be defined w/ an inline style matching the image width */
+}
+
+img.frame {
+  border:1px solid #DDD;
+  padding:4px;
+}
+
+p.table-caption {
+  margin: 0 0 4px 0;
+  font-size:13px;
+  color:#666;
+}
+
+p.code-caption {
+  margin-bottom: 4px;
+  font: 12px/1.5 monospace;
+  color:#666;
+}
+
+div.note,
+div.caution,
+div.warning {
+  margin: 0 0 15px;
+}
+
+p.note, div.note,
+p.caution, div.caution,
+p.warning, div.warning {
+  padding: 0 0 0 10px;
+  border-left: 4px solid;
+}
+
+p.note, div.note {
+  border-color: #258AAF;
+}
+
+p.caution, div.caution {
+  border-color: #FF8800;
+}
+
+p.warning, div.warning {
+  border-color: #ff4443;
+}
+
+div.note.design {
+  border-left: 4px solid #33B5E5;
+}
+
+div.note.develop {
+  border-left: 4px solid #F80;
+}
+
+div.note.distribute {
+  border-left: 4px solid #9C0;
+}
+
+.note p, .caution p, .warning p {
+  margin:0 0 5px;
+}
+
+.note p:last-child, .caution p:last-child, .warning p:last-child {
+  margin-bottom:0;
+}
+
+body.about blockquote {
+  display:block;
+  float:right;
+  width:280px;
+  font-size:20px;
+  font-style:italic;
+  line-height:24px;
+  color:#33B5E5;
+  margin:0 0 20px 30px;
+}
+
+div.design-announce p {
+  margin:0 0 10px;
+}
+
+.expandable {
+  height:34px;
+  padding-left:20px;
+  position:relative;
+}
+.expandable:before {
+  content: '';
+  background-image: url(../images/styles/disclosure_down.png);
+  background-repeat:no-repeat;
+  background-position: -12px -9px;
+  width: 20px;
+  height: 20px;
+  display: inline-block;
+  position: absolute;
+  top: 0;
+  left: 0; }
+}
+.expandable.expanded:before {
+  background-image: url(../images/styles/disclosure_up.png);
+}
+
+/* notice box for cross links between Design/Develop docs */
+a.notice-developers-video,
+a.notice-developers,
+a.notice-designers-video,
+a.notice-designers {
+  float:right;
+  clear:right;
+  width:238px;
+  min-height:50px;
+  margin:0 0 20px 20px;
+  border:1px solid #ddd;
+}
+a.notice-developers-video.wide,
+a.notice-developers.wide,
+a.notice-designers-video.wide,
+a.notice-designers.wide {
+  width:278px;
+}
+a.notice-developers-video div,
+a.notice-developers div,
+a.notice-designers-video div,
+a.notice-designers div {
+  min-height:40px;
+  background:url('../images/styles/notice-developers@2x.png') no-repeat 10px 10px;
+  background-size:40px 40px;
+  padding:10px 10px 10px 60px;
+}
+a.notice-designers div {
+  background:url('../images/styles/notice-designers@2x.png') no-repeat 10px 10px;
+  background-size:40px 40px;
+}
+a.notice-designers-video div {
+  background:url('../images/styles/notice-designers-video@2x.png') no-repeat 10px 10px;
+  background-size:40px 40px;
+}
+a.notice-developers-video div {
+  background:url('../images/styles/notice-developers-video@2x.png') no-repeat 10px 10px;
+  background-size:40px 40px;
+}
+a.notice-developers-video:hover,
+a.notice-developers:hover,
+a.notice-designers-video:hover,
+a.notice-designers:hover {
+  background:#eee;
+}
+a.notice-developers-video h3,
+a.notice-developers h3,
+a.notice-designers-video h3,
+a.notice-designers h3 {
+  font-size:13px;
+  line-height:18px;
+  font-weight:bold;
+  text-transform:uppercase;
+  color:#000 !important;
+  margin:0 0 1px;
+}
+a.notice-developers-video p,
+a.notice-developers p,
+a.notice-designers-video p,
+a.notice-designers p {
+  margin:0;
+  line-height:14px;
+}
+a.notice-developers-video.left,
+a.notice-developers.left,
+a.notice-designers-video.left,
+a.notice-designers.left {
+  margin-left:0;
+  float:left;
+}
+
+
+/* hide nested list items; companion to hideNestedLists() */
+.hide-nested li ol,
+.hide-nested li ul {
+  display:none;
+}
+
+a.header-toggle {
+  display:block;
+  float:right;
+  text-transform:uppercase;
+  font-size:.8em !important;
+  font-weight:normal;
+  margin-top:2px;
+}
+
+
+/* for IDE instruction toggle (Studio/Eclipse/Other) */
+select.ide {
+  background: transparent;
+  border: 1px solid #bbb;
+  border-left: 0;
+  border-right: 0;
+  margin: 10px 0;
+  padding: 10px 0;
+  color:#666;
+}
+select.ide,
+select.ide option {
+  font-family: inherit;
+  font-size:16px;
+  font-weight:500;
+}
+/* hide all except eclipse by default */
+.select-ide.studio,
+.select-ide.other {
+  display:none;
+}
+/* ... unless eclipse also includes one of the others */
+.select-ide.eclipse.studio,
+.select-ide.eclipse.other {
+  display:block;
+}
+
+
+/* -----------------------------------------------
+good/bad example containers
+*/
+
+div.example-block {
+  background-repeat: no-repeat;
+  background-position:10px 8px;
+  background-color:#ccc;
+  padding:4px;
+  margin:.8em auto 1.5em 2em;
+  width:260px;
+  float:right;
+}
+/* red container */
+.example-block.bad {
+  background-image: url(/images/example-bad.png);
+  background-color:#f4cccc;
+}
+/* green container */
+.example-block.good {
+  background-image: url(/images/example-good.png);
+  background-color:#d9ead3;
+}
+/* container heading div */
+#jd-content .example-block .heading {
+  font-weight:bold;
+  margin:6px 0 9px 36px;
+  padding:6px auto;
+}
+/* container image (if any) */
+#jd-content .example-block img {
+  margin:0;
+  padding:0px;
+}
+
+.example-block table {
+  margin:0;
+}
+
+/* -----------------------------------------------
+Dialog box for popup messages
+*/
+
+div.dialog {
+  height:0;
+  margin:0 auto;
+}
+
+div.dialog>div {
+  z-index:99;
+  position:fixed;
+  margin:70px 0;
+  width: 391px;
+  height: 200px;
+  background: #F7F7F7;
+-moz-box-shadow: 0 0 15px rgba(0,0,0,0.5);
+-webkit-box-shadow: 0 0 15px rgba(0,0,0,0.5);
+box-shadow: 0 0 15px rgba(0,0,0,0.5);
+}
+/* IE6 can't position fixed */
+* html div.dialog div { position:absolute; }
+
+
+div#deprecatedSticker {
+  display:none;
+  z-index:99;
+  position:fixed;
+  right:15px;
+  top:114px;
+  margin:0;
+  padding:1em;
+  background:#FFF;
+  border:1px solid #dddd00;
+  box-shadow:-5px 5px 10px #ccc;
+  -moz-box-shadow:-5px 5px 10px #ccc;
+  -webkit-box-shadow:-5px 5px 10px #ccc;
+}
+
+div#naMessage {
+  display:none;
+  width:555px;
+  height:0;
+  margin:0 auto;
+}
+
+div#naMessage div {
+  z-index:99;
+  width:450px;
+  position:fixed;
+  margin:50px 0;
+  padding:4em 4em 3em;
+  background:#FFF;
+  border:1px solid #999;
+  box-shadow:-10px 10px 40px #888;
+  -moz-box-shadow:-10px 10px 40px #888;
+  -webkit-box-shadow:-10px 10px 40px #888;
+}
+/* IE6 can't position fixed */
+* html div#naMessage div { position:absolute; }
+
+div#naMessage strong {
+  font-size:1.1em;
+}
+
+
+/* --------------------------------------------------------------------------
+Slideshow Controls & Next/Prev
+*/
+.slideshow-next, .slideshow-prev {
+  width: 20px;
+  height: 36px;
+  text-indent: -1000em;
+}
+.slideshow-container {
+  margin: 2em 0;
+}
+.slideshow-container:before, .slideshow-container:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+a.slideshow-next, a.slideshow-next:visited {
+
+  float: right;
+
+  background: url(../images/arrow-right.png) no-repeat 0 0
+
+}
+
+a.slideshow-prev, a.slideshow-prev:visited {
+
+  float: left;
+
+  background: url(../images/arrow-left.png) no-repeat 0 0
+
+}
+
+.slideshow-next:hover, .slideshow-prev:hover, .slideshow-next:focus, .slideshow-prev:focus {
+
+  background-position: 0 -36px
+
+}
+
+.slideshow-next:active, .slideshow-prev:active {
+
+  background-position: 0 -72px
+
+}
+.slideshow-nav {
+  width: 74px;
+  margin: 0 auto;
+}
+.slideshow-nav a, .slideshow-nav a:visited {
+  display: inline-block;
+  width: 12px;
+  height: 12px;
+  margin: 0 2px 20px 2px;
+  background: #ccc;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+}
+.slideshow-nav a:hover, .slideshow-nav a:focus {
+
+  background: #33B5E5
+}
+
+.slideshow-nav a:active {
+
+  background: #1e799a;
+  background: #ebebeb;
+  -webkit-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05);
+  -moz-box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05);
+  box-shadow: inset 0px 0px 5px 2px rgba(0, 0, 0, .05);
+}
+.slideshow-nav a.active, .slideshow-nav a.active:active, .slideshow-nav a.active:visited {
+  background: #33B5E5
+}
+/* --------------------------------------------------------------------------
+Tabs
+*/
+ul.tabs {
+  padding: 0;
+  margin: 2em 0 0 0;
+}
+ul.tabs:before, ul.tabs:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+ul.tabs li {
+  list-style-type: none;
+  float: left;
+}
+ul.tabs li a, ul.tabs li a:active, ul.tabs li a:visited {
+  display: block;
+  height: 36px;
+  line-height: 36px;
+  padding: 0 15px;
+  margin-right: 2px;
+  color: #222;
+  -moz-border-radius-topleft: 2px;
+  -moz-border-radius-topright: 2px;
+  -moz-border-radius-bottomright: px;
+  -moz-border-radius-bottomleft: px;
+  -webkit-border-radius: 2px 2px px px;
+  border-radius: 2px 2px px px;
+  border-top: solid 1px #ebebeb;
+  border-left: solid 1px #ebebeb;
+  border-right: solid 1px #ebebeb;
+  background-color: #fff;
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#fafafa));
+    background-image: -webkit-linear-gradient(top, #ffffff, #fafafa);
+    background-image: -moz-linear-gradient(top, #ffffff, #fafafa);
+    background-image: -ms-linear-gradient(top, #ffffff, #fafafa);
+    background-image: -o-linear-gradient(top, #ffffff, #fafafa);
+    background-image: linear-gradient(top, #ffffff, #fafafa);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff',
+EndColorStr='#fafafa');
+}
+ul.tabs li a:hover {
+  color: #33B5E5;
+}
+ul.tabs li a.selected {
+  height: 37px;
+  color: #33B5E5;
+  background-color: #f7f7f7;
+  background-image: none;
+  border-color: #ddd;
+}
+.tab-content {
+  padding: 1.2em;
+  margin: -1px 0 2em 0;
+  -webkit-border-radius: 2px;
+    -moz-border-radius: 2px;
+    border-radius: 2px;
+  border: solid 1px #ddd;
+  background: #f7f7f7;
+}
+/* --------------------------------------------------------------------------
+Feature Boxes
+*/
+.feature-box {
+  width: 291px;
+  height: 200px;
+  position: relative;
+  background: #F7F7F7;
+}
+.box-border .top, .box-border .bottom, .box-border .left, .box-border .right {
+  z-index: 100;
+  position: absolute;
+  background-color: #aaa;
+}
+.box-border .top, .box-border .bottom {
+  width: 291px;
+  height: 1px;
+}
+.dialog .box-border .top,
+.dialog .box-border .bottom { width:391px; }
+
+.box-border .left, .box-border .right {
+  width: 1px;
+  height: 8px;
+}
+.box-border .top { top: 0; left: 0 }
+.box-border .top .left { top: 1px; left: 0 }
+.box-border .top .right { top: 1px; right: 0 }
+.box-border .bottom .left { top: -8px; left: 0 }
+.box-border .bottom { top: 200px; left: 0 }
+.box-border .bottom .right { top: -8px; right: 0 }
+
+.feature-box h4,
+.dialog h4 {
+    margin: 15px 18px 10px;
+    padding:0;
+}
+
+.feature-box p,
+.dialog p {
+    margin: 10px 18px;
+    padding:0;
+}
+.feature-box .link,
+.dialog .link {
+    border-top: 1px solid #dedede;
+    bottom: 0;
+    position: absolute;
+    width: inherit;
+}
+.feature-box a, .feature-box h4,
+.dialog a, .dialog h4 {
+    -webkit-transition: color .4s ease;
+    -moz-transition: color .4s ease;
+    -o-transition: color .4s ease;
+    transition: color .4s ease;
+}
+.feature-box:hover {
+  cursor: pointer;
+}
+.feature-box:hover .box-border .top, .feature-box:hover .box-border .bottom, .feature-box:hover
+.left, .feature-box:hover .right {
+  background-color: #33B5E5;
+}
+.feature-box:hover h4, .feature-box:hover a {
+  color: #33B5E5;
+}
+/* --------------------------------------------------------------------------
+Page-Specific Styles
+*/
+.colors {
+  position: relative;
+  float: left;
+  width: 92px;
+  margin: 40px 0 20px;
+}
+.colors div {
+  color: #fff;
+  font-size: 11.5px;
+  width: 82px;
+  height: 82px;
+  margin-top:-30px;
+  line-height: 82px;
+  text-align: center;
+  border: solid 5px #fff;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/* ########### REFERENCE DOCS ################## */
+
+#packages-nav h2,
+#classes-nav h2 {
+  font-size:18px;
+  margin:0;
+  padding:0 0 0 4px;
+}
+
+#jd-header {
+  padding: 0 0 12px;
+  margin: 20px 0 12px;
+  font-size:12px;
+  padding-bottom:12px;
+  border-bottom:solid 1px #ccc;
+}
+
+#jd-header h1 {
+  margin:0;
+  padding:0 0 6px 0;
+}
+
+/* not sure if this is needed in the ref docs, disabling for now
+.jd-descr h2 {
+  margin:16px 0;
+}
+*/
+
+/* page-top-right container for reference pages (holds
+links to summary tables) */
+#api-info-block {
+  font-size:12px;
+  margin:20px 0 0;
+  padding:0 10px 6px;
+  font-weight:normal;
+  float:right;
+  text-align:right;
+  color:#999;
+  max-width:80%;
+  font-size: 12px;
+  line-height:14px;
+}
+
+#api-info-block div.api-level {
+  font-weight:bold;
+  font-size:inherit;
+  float:none;
+  color:#222;
+  padding:0;
+  margin:0;
+}
+
+/* inheritance table */
+.jd-inheritance-table {
+  border-spacing:0;
+  margin:0;
+  padding:0;
+  font-size:12px;
+  line-height:14px;
+  background-color:transparent;
+}
+.jd-inheritance-table tr td {
+  border: none;
+  margin: 0;
+  padding: 0;
+  background-color:transparent;
+}
+.jd-inheritance-table .jd-inheritance-space {
+  font-weight:bold;
+  width:1em;
+}
+.jd-inheritance-table .jd-inheritance-interface-cell {
+  padding-left: 17px;
+}
+
+
+
+.jd-sumtable a {
+  text-decoration:none;
+}
+
+.jd-sumtable a:hover {
+  text-decoration:underline;
+}
+
+/* the link inside a sumtable for "Show All/Hide All" */
+.toggle-all {
+  display:block;
+  float:right;
+  font-weight:normal;
+  font-size:0.9em;
+}
+
+/* adjustments for in/direct subclasses tables */
+.jd-sumtable.jd-sumtable-subclasses {
+  margin: 1em 0 0 0;
+  max-width:968px;
+  background-color:transparent;
+  font-size:13px;
+}
+
+/* extra space between end of method name and open-paren */
+.sympad {
+  margin-right: 2px;
+}
+
+/* right alignment for the return type in sumtable */
+.jd-sumtable .jd-typecol {
+  text-align:right;
+}
+
+/* adjustments for the expando table-in-table */
+.jd-sumtable-expando {
+  margin:.5em 0;
+  padding:0;
+}
+
+/* a div that holds a short description */
+.jd-descrdiv {
+  padding:3px 1em 0 1em;
+  margin:0;
+  border:0;
+}
+
+#jd-content img.jd-expando-trigger-img {
+  padding:0 4px 4px 0;
+  margin:0;
+}
+
+.jd-sumtable-subclasses div#subclasses-direct,
+.jd-sumtable-subclasses div#subclasses-indirect {
+  margin:0 0 0 13px;
+}
+
+
+
+/********* MEMBER REF *************/
+
+
+.jd-details {
+/*  border:1px solid #669999;
+  padding:4px; */
+  margin:0 0 1em;
+}
+
+/* API reference: a container for the
+.tagdata blocks that make up the detailed
+description */
+.jd-details-descr {
+  padding:0;
+  margin:.5em .25em;
+}
+
+/* API reference: a block containing
+a detailed description, a params table,
+seealso list, etc */
+.jd-tagdata {
+  margin:.5em 1em;
+}
+
+.jd-tagdata p {
+  margin:0 0 1em 1em;
+}
+
+/* API reference: adjustments to
+the detailed description block */
+.jd-tagdescr {
+  margin:.25em 0 .75em 0;
+}
+
+.jd-tagdescr ol,
+.jd-tagdescr ul {
+  margin:0 2.5em;
+  padding:0;
+}
+
+.jd-tagdescr table,
+.jd-tagdescr img {
+  margin:.25em 1em;
+}
+
+.jd-tagdescr li {
+margin:0 0 .25em 0;
+padding:0;
+}
+
+/* API reference: heading marking
+the details section for constants,
+attrs, methods, etc. */
+h4.jd-details-title {
+  font-size:1.15em;
+  background-color: #E2E2E2;
+  margin:1.5em 0 .6em;
+  padding:3px 95px 3px 3px; /* room for api-level */
+}
+body.google h4.jd-details-title {
+  background-color: #FFF;
+  padding-top:5px;
+  border-top: 1px solid #ccc;
+}
+body.google table.jd-sumtable th {
+  background-color: #FFF;
+  color:#000;
+}
+
+h4.jd-tagtitle {
+  margin:0;
+}
+
+h4 .normal {
+  font-weight:normal;
+}
+
+/* API reference: heading for "Parameters", "See Also", etc.,
+in details sections */
+h5.jd-tagtitle {
+  margin:0 0 .25em 0;
+  font-size:1em;
+}
+
+.jd-tagtable {
+  margin:0;
+  background-color:transparent;
+  width:auto;
+}
+
+.jd-tagtable td,
+.jd-tagtable th {
+  border:none;
+  background-color:#fff;
+  vertical-align:top;
+  font-weight:normal;
+  padding:2px 10px;
+}
+
+.jd-tagtable th {
+  font-style:italic;
+}
+
+/* Inline api level indicator for methods */
+div.api-level {
+  font-size:.8em;
+  font-weight:normal;
+  color:#999;
+  float:right;
+  padding:0 8px 0;
+  margin-top:-30px;
+}
+
+table.jd-tagtable td,
+table.jd-tagtable th {
+  background-color:transparent;
+}
+
+table.jd-tagtable th {
+  color:inherit;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/* SEARCH FILTER */
+
+.menu-container {
+  position:relative;
+}
+#search_autocomplete {
+  font-weight:normal;
+}
+
+.search_filtered_wrapper.reference {
+  width: 193px;
+  float: right;
+}
+.search_filtered_wrapper.docs {
+  width:875px;
+  float: left;
+  position:absolute;
+  top:26px;
+  right:66px;
+}
+.suggest-card {
+  position:relative;
+  width:170px;
+  min-height:90px;
+  padding:5px;
+  border: solid 1px #C5C5C5;
+  background: white;
+  top: 15px;
+  margin-right:-5px;
+  -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2);
+  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
+}
+.suggest-card.reference {
+  position:absolute;
+  z-index:999;
+  min-width:171px; /* +padding and border makes this match input width */
+  min-height:93px; /* add 3px because this has 1 not 4px top border */
+  width:auto;
+  top:41px;
+  margin:0;
+}
+.suggest-card.develop {
+  z-index:997;
+  border-top: solid 4px #F80;
+  float:right;
+}
+.suggest-card.design {
+  z-index:996;
+  border-top: solid 4px #33b5e5;
+  float:right;
+}
+.suggest-card.distribute {
+  z-index:995;
+  border-top: solid 4px #9C0;
+  float:right;
+}
+.child-card {
+  width:100%;
+}
+.suggest-card.dummy {
+  width:172px;
+  float:right;
+  border:0;
+  background:transparent;
+  -moz-box-shadow: none;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+}
+
+ul.search_filtered {
+  min-width:100%;
+  list-style: none;
+  margin: 0 0 5px;
+  padding: 0;
+}
+.search_filtered .jd-selected {
+  background:#efefef;
+  cursor:pointer;
+}
+.search_filtered .jd-selected,
+.search_filtered .jd-selected a {
+    color:#09C !important;
+}
+
+.no-display {
+  display: none;
+}
+
+.search_filtered li.jd-autocomplete {
+  font-size: 0.81em;
+  border: none;
+  margin: 0 0 2px;
+  padding: 0;
+  line-height:1.5em;
+}
+
+.search_filtered li a {
+  padding:0 5px;
+  color:#222 !important;
+  display:inline-block;
+  line-height:12px;
+}
+
+.search_filtered li.header {
+  font-weight:bold;
+  color:#444;
+  border: none;
+  margin: 8px 0 2px;
+  padding:1px 5px;
+  line-height:1.5em;
+}
+.search_filtered li.header.small {
+  font-size:0.85em;
+}
+
+.suggest-card.reference
+.search_filtered li.header {
+  color:#aaa;
+  font-size: 0.81em;
+}
+
+.search_filtered li.header:first-child {
+  margin: 0 0 2px;
+}
+
+.show-item {
+  display: table-row;
+}
+.hide-item {
+  display: hidden;
+}
+
+
+
+
+
+/* SEARCH RESULTS */
+
+
+#leftSearchControl .gsc-twiddle {
+  background-image : none;
+}
+
+#leftSearchControl td, #searchForm td {
+  border: 0px solid #000;
+  padding:0;
+}
+
+#leftSearchControl .gsc-resultsHeader .gsc-title {
+  padding-left : 0px;
+  font-weight : bold;
+  font-size : 13px;
+  color:#006699;
+  display : none;
+}
+
+#leftSearchControl .gsc-resultsHeader div.gsc-results-selector {
+  display : none;
+}
+
+#leftSearchControl .gsc-resultsRoot {
+  padding-top : 6px;
+}
+
+#leftSearchControl div.gs-visibleUrl-long {
+  display : block;
+  color:#006699;
+}
+
+#leftSearchControl .gsc-webResult {
+  padding:0 0 20px 0;
+}
+
+.gsc-webResult div.gs-visibleUrl-short,
+table.gsc-branding,
+.gsc-clear-button {
+  display : none;
+}
+
+.gsc-cursor-box .gsc-cursor div.gsc-cursor-page,
+.gsc-cursor-box .gsc-trailing-more-results a.gsc-trailing-more-results,
+#leftSearchControl a,
+#leftSearchControl a b {
+  color:#006699;
+}
+
+.gsc-resultsHeader {
+  display: none;
+}
+
+/* Disable built in search forms */
+.gsc-control form.gsc-search-box {
+  display : none;
+}
+table.gsc-search-box {
+  margin:6px 0 0 0;
+  border-collapse:collapse;
+}
+
+td.gsc-input {
+  padding:0 2px;
+  width:100%;
+  vertical-align:middle;
+}
+
+input.gsc-input {
+  border:1px solid #BCCDF0;
+  width:99%;
+  padding-left:2px;
+  font-size:.95em;
+}
+
+td.gsc-search-button {
+  text-align: right;
+  padding:0;
+  vertical-align:top;
+}
+
+
+#searchResults {
+  overflow:hidden; /* because the repositioned page links makes the section think it needs to scroll
+(it doesn't) */
+  height:auto;
+}
+
+#searchResults .gsc-control {
+  position:relative;
+  width:auto;
+  padding:0 0 10px;
+}
+
+#searchResults .gsc-tabsArea {
+  position:relative;
+  white-space:nowrap;
+  float:left;
+  width:200px;
+}
+
+#searchResults .gsc-above-wrapper-area {
+  display:none;
+}
+
+#searchResults .gsc-resultsbox-visible {
+  float:left;
+  width:720px;
+  margin-left:20px;
+}
+
+#searchResults .gsc-tabHeader {
+  padding: 3px 6px;
+  position:relative;
+  width:auto;
+  display:block;
+}
+
+#searchResults h2#searchTitle {
+  padding:0;
+  margin:5px 0;
+  border:none;
+}
+
+#searchResults h2#searchTitle em {
+  font-style:normal;
+  color:#33B5E5;
+}
+
+#searchResults .gsc-table-result {
+  margin:5px 0 10px 0;
+  background-color:transparent;
+}
+#searchResults .gs-web-image-box, .gs-promotion-image-box {
+  width:120px;
+}
+#searchResults .gs-web-image-box img.gs-image, .gs-promotion-image-box img.gs-promotion-image {
+  max-width:120px;
+}
+
+#searchResults .gsc-table-result .gsc-thumbnail {
+  padding:0 20px 0 0;
+}
+
+#searchResults td {
+  background-color:transparent;
+}
+
+#searchResults .gsc-expansionArea {
+  position:relative;
+}
+#searchResults .gsc-tabsArea .gsc-cursor-box {
+  width:200px;
+  padding:20px 0 0 1px;
+}
+#searchResults .gsc-cursor-page {
+  display:inline-block;
+  float:left;
+  margin:-1px 0 0 -1px;
+  padding:0;
+  height:27px;
+  width:27px;
+  text-align:center;
+  line-height:2;
+}
+
+#searchResults .gsc-tabHeader.gsc-tabhInactive,
+#searchResults .gsc-cursor-page {
+  text-decoration:none;
+  color:#258AAF;
+  border: solid 1px #DADADA;
+}
+
+#searchResults .gsc-tabHeader.gsc-tabhInactive:hover,
+#searchResults .gsc-cursor-page:hover {
+  border-color: #DBDBDB;
+  background-color: #F3F3F3;
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#F9F9F9), to(#ECECEC));
+  background-image: -webkit-linear-gradient(top, #F9F9F9, #ECECEC);
+  background-image: -moz-linear-gradient(top, #F9F9F9, #ECECEC);
+  background-image: -ms-linear-gradient(top, #F9F9F9, #ECECEC);
+  background-image: -o-linear-gradient(top, #F9F9F9, #ECECEC);
+  background-image: linear-gradient(top, #F9F9F9, #ECECEC);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f9f9f9',
+EndColorStr='#ececec');
+  color: #33B5E5;
+}
+
+#searchResults .gsc-tabHeader.gsc-tabhActive,
+#searchResults .gsc-tabHeader.gsc-tabhActive:hover,
+#searchResults .gsc-cursor-page.gsc-cursor-current-page,
+#searchResults .gsc-cursor-page.gsc-cursor-current-page:hover {
+  color:#fff;
+  background-color: #09C;
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#2FADDB), to(#09C));
+  background-image: -webkit-linear-gradient(top, #2FADDB, #09C);
+  background-image: -moz-linear-gradient(top, #2FADDB, #09C);
+  background-image: -ms-linear-gradient(top, #2FADDB, #09C);
+  background-image: -o-linear-gradient(top, #2FADDB, #09C);
+  background-image: linear-gradient(top, #2FADDB, #09C);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#2faddb', EndColorStr='#09c');
+  border: 1px solid #3990AB;
+  z-index:100;
+}
+
+
+
+
+
+/************ STICKY NAV BAR ******************/
+
+#header-wrapper {
+  background: #f9f9f9;
+  margin: 0 -10px 0 -10px;
+  padding: 31px 10px 0px 10px;
+  position: relative;
+}
+#header-wrapper #nav-x div.wrap {
+  max-width: 940px;
+  height: 38px;
+}
+#header-wrapper #nav-x ul.nav-x li {
+  margin-right: 36px !important;
+  margin-top: 5px;
+  margin-bottom: 0px;
+  height: 30px;
+}
+#header-wrapper #nav-x > div.wrap ul.nav-x li.active  {
+  color: #669900;
+  border-bottom: 3px solid #669900;
+}
+#header-wrapper #nav-x > div.wrap ul.nav-x li.active a {
+  color: #669900;
+}
+#header-wrapper #nav-x > div.wrap ul.nav-x a {
+  font-size: 14.5px;
+}
+#header-wrapper .developer-console-btn {
+  float: right;
+  background: #fefefe;
+  border-radius: 4px;
+  padding: 8px 14px;
+  box-shadow: 1px 1px 0px #7a7a7a;
+  font-size: 14px;
+  margin-top: -6px;
+  cursor: pointer;
+  color: #464646;
+  margin-right: 20px;
+}
+/* not currently used */
+#header-wrapper .shadow {
+  width: 1034px;
+  height: 4px;
+  position: absolute;
+  left: 50%;
+  margin-left: -517px;
+  bottom: -4px;
+  background-image: url(../images/header-shadow.png);
+}
+
+#context {
+  clear: both;
+  padding-top: 14px;
+}
+#context .breadcrumb {
+  float: left;
+  margin-bottom: 10px;
+}
+#context .util {
+  float: right;
+  margin-right: 20px;
+}
+
+.breadcrumb {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  position: relative;
+}
+.breadcrumb li {
+  float: left;
+  padding: 0 20px 0 0;
+  color: #000;
+  white-space: nowrap;
+}
+.breadcrumb li a {
+  color: #000;
+}
+.breadcrumb li:after {
+  content: url(../images/breadcrumb.png);
+  position: relative;
+  top: 1px;
+  left: 10px;
+  width: 5px;
+  height: 10px;
+}
+.breadcrumb li.current {
+  font-weight: 700;
+}
+.breadcrumb li.current:after {
+  display: none;
+}
+
+/* Sticky Nav overrides */
+.sticky-menu {
+  position: fixed;
+  width: 940px;
+  height: 0px;
+  z-index: 51;
+  top: 12px;
+}
+#sticky-header {
+  display: none;
+  padding: 0 10px;
+  position: fixed;
+  background: #f9f9f9;
+  top: 0px;
+  left: 0px;
+  right: 0px;
+  height: 45px;
+  box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);
+  border-bottom: 1px solid #a5c43a;
+  z-index: 50;
+}
+#sticky-header.design {
+  border-bottom: 1px solid #33b5e5;
+}
+#sticky-header.develop {
+  border-bottom: 1px solid #F80;
+}
+#sticky-header.distribute {
+  border-bottom: 1px solid #9C0;
+}
+#sticky-header.about {
+  border-bottom: 1px solid #9933CC;
+}
+#sticky-header > div {
+  overflow: hidden;
+  *zoom: 1;
+  width: 940px;
+  margin: 0 auto;
+  clear: both;
+  padding-top: 9px;
+}
+#sticky-header > div .logo {
+  float: left;
+  width: 26px;
+  height: 25px;
+  background: url(../images/dac_logo.png);
+  background-image: -webkit-image-set(url(../images/dac_logo.png) 1x, url(../images/dac_logo@2x.png) 2x);
+  z-index: 52;
+  position: relative;
+}
+#sticky-header > div .top {
+  float: left;
+  width: 38px;
+  height: 38px;
+  position: relative;
+  background: url(../images/styles/gototop.png);
+  z-index: 52;
+}
+#sticky-header > div .breadcrumb {
+  float: left;
+  padding: 0 0 0 10px;
+  border-left: 1px solid #d2d2d2;
+  line-height: 24px;
+  font-size: 14px;
+  position: relative;
+  top: 0px;
+  z-index: 52;
+}
+
+
+}
+
+
+
+
+
+
+
+/*********** PREVIOUSLY dac-styles.css ***************/
+
+
+#header {
+  border-bottom:0;
+}
+
+#header .wrap {
+  max-width:940px;
+  height:41px;
+  border-bottom:1px solid;
+  border-color: #ccc;
+  position:relative;
+}
+
+.about #header .wrap {
+  border-color: #9933CC;
+}
+
+.design #header .wrap {
+  border-color: #33b5e5;
+}
+
+.develop #header .wrap {
+  border-color: #F80;
+}
+
+.distribute #header .wrap {
+  border-color: #9C0;
+}
+
+.logo a {
+  float:left;
+}
+
+#header .logo {
+  margin-top: -6px;
+  margin-left: 0px;
+  margin-bottom:0px;
+  width: 160px;
+  padding-right:10px;
+}
+
+
+#header-wrap .logo.landing-logo {
+  width:220px;
+  margin:0;
+  padding:0;
+  margin-bottom:22px;
+}
+#header-wrap .logo.landing-logo img {
+  padding:0 0 0 10px;
+}
+
+.search {
+  height:25px;
+  margin-top: -3px;
+  margin-bottom: 0px;
+}
+
+
+
+/* Quicknav */
+.btn-quicknav {
+  width:20px;
+  height:28px;
+  float:left;
+  margin-left:6px;
+  padding-right:10px;
+  position:relative;
+  cursor:pointer;
+  border-right:1px solid #CCC;
+}
+
+.btn-quicknav a {
+  zoom:1;
+  position:absolute;
+  top:13px;
+  left:5px;
+  display:block;
+  text-indent:-9999em;
+  width:10px;
+  height:5px;
+  background:url(../images/quicknav_arrow.png) no-repeat;
+}
+
+.btn-quicknav a.arrow-active {
+  background-position: 0 -5px;
+  display:none;
+}
+
+#header-wrap.quicknav a.arrow-inactive {
+  display:none;
+}
+
+.btn-quicknav.active a.arrow-active {
+  display:block;
+}
+
+.nav-x li {
+  display:block;
+  float:left;
+  margin-right:45px;
+  -webkit-transition: all 0.25s linear;
+      -moz-transition: all 0.25s linear;
+       -ms-transition: all 0.25s linear;
+        -o-transition: all 0.25s linear;
+           transition: all 0.25s linear;
+}
+
+#header-wrap.quicknav .nav-x li {
+  min-width:160px;
+  margin-right:20px;
+}
+
+#header-wrap.quicknav li.last {
+  margin-right:0px;
+}
+
+#quicknav {
+ float:none;
+ clear:both;
+ margin-left:0;
+ margin-top:-30px;
+ display:none;
+ overflow:hidden;
+}
+
+#header-wrap.quicknav #quicknav {
+
+}
+
+#quicknav ul {
+  margin:10px 0;
+  padding:0;
+}
+
+#quicknav ul li.about {
+  border-top:1px solid #9933CC;
+}
+
+#quicknav ul li.design {
+  border-top:1px solid #33b5e5;
+}
+
+#quicknav ul li.develop {
+  border-top:1px solid #FF8800;
+}
+
+#quicknav ul li.distribute {
+  border-top:1px solid #99cc00;
+}
+
+#quicknav ul li {
+  display:block;
+  float:left;
+  margin:0 20px 0 0;
+  min-width:140px;
+}
+
+#quicknav ul li.last {
+  margin-right:0px;
+}
+
+#quicknav ul li ul li {
+  float:none;
+}
+
+#quicknav ul li ul li a {
+  color:#222;
+}
+
+#quicknav ul li li ul,
+#quicknav ul li li ul li {
+  margin:0;
+}
+
+#quicknav ul li li ul li:before {
+  content:"\21B3";
+}
+
+#header-wrap {
+   -webkit-transition: all 0.25s ease-out;
+      -moz-transition: all 0.25s ease-out;
+       -ms-transition: all 0.25s ease-out;
+        -o-transition: all 0.25s ease-out;
+           transition: all 0.25s ease-out;
+
+}
+
+#header-wrap.quicknav {
+  height:196px;
+
+}
+
+/* SEARCH AND MORE */
+.search {
+  position: absolute;
+  width: 50px;
+  height:28px;
+  display: block;
+  margin-top:-3px;
+  margin-bottom:7px;
+  overflow:hidden;
+  z-index:100;
+  right:54px;
+  -webkit-transition: width 0.4s ease;
+     -moz-transition: width 0.4s ease;
+       -o-transition: width 0.4s ease;
+          transition: width 0.4s ease;
+}
+
+.search #search-btn {
+  width:50px;
+  height:28px;
+  background:url(../images/icon_search.png) no-repeat;
+  float:left;
+}
+
+.search-inner {
+  width:245px;
+}
+
+.search:hover, .search.active {
+  width:245px;
+}
+
+.search .bottom, .search .left, .search .right {
+  position: absolute;
+  background-color: #a2a2a2
+}
+
+.search .bottom {
+  width: 214px;
+  height: 1px;
+  top: 24px;
+  left: 0
+}
+
+.search .left, .search .right {
+  height: 5px;
+  width: 1px
+}
+
+.search .left {
+  top: 22px;
+  left: 56px;
+  background-color:#CCC;
+}
+
+.search .right {
+  top: 22px;
+  left: 238px;
+  background-color:#CCC;
+}
+
+.search form {
+  margin-top: 2px;
+  width: 162px;
+  float:left;
+}
+
+.search form input {
+  color: #2f2f2f;
+  font-size: 0.95em;
+  width: 178px;
+  border: none;
+  margin-left: 6px;
+  z-index: 1500;
+  position: relative;
+  background-color: transparent;
+  border-bottom:1px solid #CCC;
+  padding:0 0 0 4px;
+  outline:none;
+  height:24px;
+}
+
+.search:hover form input {
+  border-bottom:1px solid #33B5E5;
+}
+
+.search:hover .bottom, .search:hover .left, .search:hover .right {
+  background-color: #33b5e5;
+}
+
+.search:hover #search-btn {
+  background-position: 0 -28px
+}
+
+.search form input:focus {
+  color: #222;
+  font-weight: bold
+}
+
+.moremenu {
+  float: right;
+  position: relative;
+  width: 50px;
+  height:28px;
+  display: block;
+  margin-top:-3px;
+  margin-bottom:7px;
+  overflow:hidden;
+  -webkit-transition: width 0.25s ease;
+     -moz-transition: width 0.25s ease;
+       -o-transition: width 0.25s ease;
+          transition: width 0.25s ease;
+}
+
+.moremenu #more-btn {
+  width:40px;
+  height:28px;
+  background:url(../images/icon_more.png) no-repeat;
+  border-left:1px solid #CCC;
+  float:left;
+  cursor:pointer;
+}
+
+.moremenu:hover #more-btn {
+  background-position:0 -28px;
+}
+
+.morehover {
+  position:absolute;
+  right:6px;
+  top:-9px;
+  width:40px;
+  height:35px;
+  z-index:99;
+  overflow:hidden;
+
+  -webkit-opacity:0;
+     -moz-opacity:0;
+       -o-opacity:0;
+          opacity:0;
+
+  -webkit-transform-origin:100% 0%;
+     -moz-transform-origin:100% 0%;
+       -o-transform-origin:100% 0%;
+          transform-origin:100% 0%;
+
+  -webkit-transition-property: -webkit-opacity;
+  -webkit-transition-duration: .25s;
+  -webkit-transition-timing-function:ease;
+
+  -moz-transition-property: -moz-opacity;
+  -moz-transition-duration: .25s;
+  -moz-transition-timing-function:ease;
+
+  -o-transition-property: -o-opacity;
+  -o-transition-duration: .25s;
+  -o-transition-timing-function:ease;
+
+  transition-property: opacity;
+  transition-duration: .25s;
+  transition-timing-function:ease;
+}
+
+.morehover:hover,
+.morehover.hover {
+  opacity:1;
+  height:385px;
+  width:268px;
+  -webkit-transition-property:height,  -webkit-opacity;
+}
+
+.morehover .top {
+  width:268px;
+  height:39px;
+  background:url(../images/more_top.png) no-repeat;
+}
+
+.morehover .mid {
+  width:228px;
+  background:url(../images/more_mid.png) repeat-y;
+  padding:10px 20px 0 20px;
+}
+
+.morehover .mid .header {
+  border-bottom:1px solid #ccc;
+  font-weight:bold;
+}
+
+.morehover .bottom {
+  width:268px;
+  height:6px;
+  background:url(../images/more_bottom.png) no-repeat;
+}
+
+.morehover ul {
+  margin:10px 10px 20px 0;
+}
+
+.morehover ul li {
+  list-style:none;
+}
+
+.morehover ul li.active a,
+.morehover ul li.active a:hover {
+  color:#222 !important;
+}
+
+.morehover ul li.active img {
+  margin-right:4px;
+}
+
+
+
+
+/* MARQUEE */
+.slideshow-container {
+  width:100%;
+  overflow:hidden;
+  position:relative;
+}
+.slideshow-container .slideshow-prev {
+  position:absolute;
+  top:50%;
+  left:0px;
+  margin-top:-36px;
+  z-index:99;
+}
+.slideshow-container .slideshow-next {
+  position:absolute;
+  top:50%;
+  margin-top:-36px;
+  z-index:99;
+  right:0px;
+}
+
+.slideshow-container .pagination {
+  position:absolute;
+  bottom:20px;
+  width:100%;
+  text-align:center;
+  z-index:99;
+}
+.slideshow-container .pagination ul {
+  margin:0;
+}
+.slideshow-container .pagination ul li{
+  display: inline-block;
+  width:12px;
+  height:12px;
+  text-indent:-8000px;
+  list-style:none;
+  margin: 0 2px;
+  border-radius:6px;
+  background-color:#ccc;
+  cursor:pointer;
+        -webkit-transition:color .5s ease-in;
+        -moz-transition:color .5s ease-in;
+        -o-transition:color .5s ease-in;
+        transition:color .5s ease-in;
+}
+.slideshow-container .pagination ul li:hover {
+  background-color:#999;
+}
+.slideshow-container .pagination ul li.active {
+  background-color:#33b5e5;
+}
+.slideshow-container .pagination ul li.active:hover {
+  background-color:#33b5e5;
+}
+.slideshow-container ul li {
+  display:inline;
+  list-style:none;
+}
+
+
+#landing h1 {
+  margin:17px 0 20px 0 !important;
+}
+
+a.download-sdk {
+    float:right;
+    margin:-10px 0;
+    height:30px;
+    padding-top:4px;
+    padding-bottom:0px;
+}
+
+#nav-x {
+  padding-top: 13px;
+}
+
+#nav-x .wrap {
+  min-height:32px;
+}
+
+#nav-x .wrap,
+#searchResults.wrap {
+    max-width:940px;
+    border-bottom:1px solid #CCC;
+}
+
+#searchResults.wrap #leftSearchControl {
+  min-height:700px
+}
+.nav-x {
+    margin-left:0;
+    margin-bottom:0;
+}
+
+
+
+
+
+
+
+
+
+
+/*
+ * CSS Styles that are needed by jScrollPane for it to operate correctly.
+ */
+
+.jspContainer {
+  overflow: hidden;
+  position: relative;
+}
+
+.jspPane {
+  position: absolute;
+  width:100% !important; /* to avoid cut-off api names in reference in horiz scroll */
+}
+
+.jspVerticalBar {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 4px;
+  height: 100%;
+  background: #f5f5f5;
+}
+
+.jspHorizontalBar {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 4px;
+  background: #f5f5f5;
+}
+
+.jspVerticalBar *,
+.jspHorizontalBar * {
+  margin: 0;
+  padding: 0;
+}
+.jspCap {
+  display: block;
+}
+
+.jspVerticalBar .jspCap {
+  height: 4px;
+}
+
+.jspHorizontalBar .jspCap {
+  width: 0;
+  height: 100%;
+}
+
+.jspHorizontalBar .jspCap {
+  float: left;
+}
+
+.jspTrack {
+  position: relative;
+}
+
+.jspDrag {
+  background: #bbb;
+  position: relative;
+  top: 0;
+  left: 0;
+  cursor: pointer;
+}
+
+.jspDrag:hover,
+.jspDrag:active {
+  border-color: #09c;
+  background-color: #4cadcb;
+  background-image: -webkit-gradient(linear, left top, right top, from(#5dbcd9), to(#4cadcb));
+  background-image: -webkit-linear-gradient(left, #5dbcd9, #4cadcb);
+  background-image: -moz-linear-gradient(left, #5dbcd9, #4cadcb);
+  background-image: -ms-linear-gradient(left, #5dbcd9, #4cadcb);
+  background-image: -o-linear-gradient(left, #5dbcd9, #4cadcb);
+  background-image: linear-gradient(left, #5dbcd9, #4cadcb);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#5dbcd9', EndColorStr='#4cadcb');
+}
+
+.jspHorizontalBar .jspTrack,
+.jspHorizontalBar .jspDrag {
+  float: left;
+  height: 100%;
+}
+
+.jspArrow {
+  background: #999;
+  text-indent: -20000px;
+  display: block;
+  cursor: pointer;
+}
+
+.jspArrow.jspDisabled {
+  cursor: default;
+  background: #ccc;
+}
+
+.jspVerticalBar .jspArrow {
+  height: 16px;
+}
+
+.jspHorizontalBar .jspArrow {
+  width: 16px;
+  float: left;
+  height: 100%;
+}
+
+.jspVerticalBar .jspArrow:focus {
+  outline: none;
+}
+
+.jspCorner {
+  float: left;
+  height: 100%;
+}
+
+/* Yuk! CSS Hack for IE6 3 pixel bug :( */
+* html .jspCorner {
+  margin: 0 -3px 0 0;
+}
+/******* end of jscrollpane *********/
+
+
+
+
+
+/************ DEVELOP HOMEPAGE ******************/
+
+/* Slideshow */
+.slideshow-develop {
+  height: 316px;
+  width: 940px;
+  position: relative;
+  overflow:hidden;
+}
+.slideshow-develop .frame {
+  width: 940px;
+  height: 316px;
+}
+.slideshow-develop img.play {
+  max-width:350px;
+  max-height:240px;
+  margin:20px 0 0 90px;
+  -webkit-transform: perspective(800px ) rotateY( 35deg );
+  box-shadow: -16px 20px 40px rgba(0, 0, 0, 0.3);
+  -moz-box-shadow: -16px 20px 40px rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: -16px 20px 40px rgba(0, 0, 0, 0.3);
+}
+.slideshow-develop img.play.no-shadow {
+    box-shadow: none;
+    -moz-box-shadow: none;
+    -webkit-box-shadow: none;
+}
+.slideshow-develop img.play.no-transform {
+  -webkit-transform: none;
+}
+.slideshow-develop a.slideshow-next {
+  background: url(../images/arrow-right-develop.png);
+}
+.slideshow-develop a.slideshow-prev {
+  background: url(../images/arrow-left-develop.png);
+}
+.slideshow-develop .content-right {
+  float: left;
+}
+.slideshow-develop .content-right h2 {
+  padding:0;
+  margin-bottom:10px;
+  border:none;
+  font-size:24px;
+}
+.slideshow-develop .item {
+  height: 300px;
+  width: 940px;
+}
+.slideshow-develop .pagination ul li.active {
+  background-color: #F80;
+}
+.slideshow-develop .pagination ul li.active:hover {
+  background-color: #F80;
+}
+.slideshow-develop .item hr {
+  margin:5px 0 10px;
+}
+.slideshow-develop .item p {
+  margin:10px 0;
+}
+.slideshow-develop .item p.title-intro {
+  position:absolute;
+  margin:0;
+}
+
+/* Feeds */
+.feed ul {
+  margin: 0;
+}
+.feed .feed-nav {
+  height: 25px;
+  border-bottom: 1px solid #CCC;
+}
+.feed .feed-nav li {
+  list-style: none;
+  float: left;
+  height: 21px; /* +4px bottom border = 25px; same as .feed-nav */
+  margin-right: 25px;
+  cursor: pointer;
+}
+.feed .feed-nav li.active {
+  color: #000;
+  border-bottom: 4px solid #F80;
+}
+.feed .feed-container {
+  overflow: hidden;
+  width: 460px;
+}
+.feed .feed-container .feed-frame {
+  width: 1000px;
+}
+.feed .feed-container .feed-frame ul {
+  float: left;
+  width:460px;
+}
+.feed .feed-container .feed-frame ul ul {
+  float: none;
+  margin:10px 0 0 30px;
+}
+.feed .feed-container .feed-frame li {
+  list-style: none;
+  margin: 20px 0 20px 0;
+  width: 460px;
+  height:93px;
+}
+.feed .feed-container .feed-frame li.playlist {
+  height:auto;
+}
+.feed .feed-container .feed-frame li.playlist a {
+  height:93px;
+  display:block;
+}
+.feed .feed-container .feed-frame li.more {
+  height:20px;
+  margin:10px 0 5px 5px;
+}
+.feed .feed-container .feed-frame li.more a {
+  height:inherit;
+}
+.feed .feed-container .feed-frame li.playlist-video {
+  list-style: none;
+  margin: 0;
+  width: 460px;
+  height:55px;
+  font-size:12px;
+}
+.feed .feed-container .feed-frame li.playlist-video a {
+  height:45px;
+  padding:5px;
+}
+.feed .feed-container .feed-frame li.playlist-video h5 {
+  font-size:12px;
+  line-height:13px;
+  margin:0;
+}
+.feed .feed-container .feed-frame li.playlist-video p {
+  margin:5px 0 0;
+  line-height:15px;
+}
+.feed-container .feed-frame div.feed-image {
+  float: left;
+  border: 1px solid #999;
+  margin:0 20px 0 0;
+  width:122px;
+  height:92px;
+  background:url('../images/blog-default.png') no-repeat 0 0;
+  background-size:180px;
+}
+#jd-content .feed .feed-container .feed-frame li img {
+  float: left;
+  border: 1px solid #999;
+  margin:0 20px 0 0;
+  width:122px;
+  height:92px;
+}
+#jd-content .feed .feed-container .feed-frame li.playlist-video img {
+  width:inherit;
+  height:inherit;
+}
+
+.feed .feed-container .feed-frame li a,
+.feed .feed-container .feed-frame li a:active {
+  color:#555 !important;
+}
+
+.feed .feed-container .feed-frame li a:hover,
+.feed .feed-container .feed-frame li a:hover * {
+  color:#7AA1B0 !important;
+}
+
+/* Video player */
+#player-wrapper {
+  display:none;
+  margin: -1px auto 0;
+  position: relative;
+  width: 940px;
+  height: 0px;
+}
+#player-frame {
+  background: #EFEFEF;
+  border: 1px solid #CCC;
+  padding: 0px 207px;
+  z-index: 10; /* stay above marque, but below search suggestions */
+  width: 525px;
+  height: 330px;
+  position: relative;
+}
+
+
+
+/************ DEVELOP TOPIC CONTAINERS ************/
+
+.landing-banner,
+.landing-docs {
+  margin:20px 0;
+}
+.landing-banner > div:first-child,
+.landing-docs > div:first-child,
+.landing-docs > .col-12 {
+  margin-left:0;
+  min-height:280px;
+}
+.landing-banner.short > div {
+  min-height:50px;
+}
+.landing-banner > div:last-child,
+.landing-docs > div:last-child,
+.landing-docs > .col-12 {
+  margin-right:0;
+}
+
+.landing-banner > div > *:last-child {
+  margin-bottom:0;
+}
+.landing-banner h1 {
+  margin-top:16px;
+  padding-bottom:24px;
+}
+.landing-docs,
+.landing-banner {
+  clear:both;
+  overflow:hidden;
+}
+.landing-docs h3 {
+  font-size:14px;
+  line-height:21px;
+  color:#555;
+  text-transform:uppercase;
+  border-bottom:1px solid #CCC;
+  margin:0 0 20px;
+}
+.landing-docs a {
+  color:#333 !important;
+}
+
+.landing-docs a:hover,
+.landing-docs a:hover * {
+  color:#7AA1B0 !important
+}
+
+.landing-docs .normal-links a {
+  color:#258aaf !important;
+}
+
+.plusone {
+  float:right;
+}
+
+
+
+.next-docs {
+  border-top:1px solid #ccc;
+  margin:40px 0 0;
+  padding:5px 0 0;
+  clear:left;
+  overflow:hidden;
+}
+.next-docs div:first-child {
+  margin-left:0;
+}
+.next-docs div:last-child {
+  margin-right:0;
+}
+
+.next-docs h2 {
+  font-size:14px;
+  line-height:21px;
+  color:#555;
+  text-transform:uppercase;
+  border-bottom:none;
+  margin:0 0 1em;
+  padding:5px 0 0;
+}
+
+
+
+/************* HOME/LANDING PAGE *****************/
+
+.slideshow-home {
+  height: 500px;
+  width: 940px;
+  border-bottom: 1px solid #CCC;
+  position: relative;
+  margin: 0;
+}
+.slideshow-home .frame {
+  width: 940px;
+  height: 500px;
+}
+.slideshow-home .content-left {
+  float: left;
+  text-align: center;
+  vertical-align: center;
+  margin: 0 0 0 35px;
+}
+.slideshow-home .content-right {
+  margin: 80px 0 0 0;
+}
+.slideshow-home .content-right p {
+  margin-bottom: 10px;
+}
+.slideshow-home .content-right p:last-child {
+  margin-top: 15px;
+}
+.slideshow-home .content-right h1 {
+  padding:0;
+}
+.slideshow-home .item {
+  height: 500px;
+  width: 940px;
+}
+.home-sections {
+  padding: 30px 20px 20px;
+  margin: 20px 0;
+  background: -webkit-linear-gradient(top, #F6F6F6,#F9F9F9);
+}
+.home-sections ul {
+  margin: 0;
+}
+.home-sections ul li {
+  float: left;
+  display: block;
+  list-style: none;
+  width: 170px;
+  height: 35px;
+  border: 1px solid #ccc;
+  background: white;
+  margin-right: 10px;
+  border-radius: 1px;
+  -webkit-border-radius: 1px;
+  -moz-border-radius: 1px;
+  box-shadow: 1px 1px 5px #EEE;
+  -webkit-box-shadow: 1px 1px 5px #EEE;
+  -moz-box-shadow: 1px 1px 5px #EEE;
+  background: white;
+}
+.home-sections ul li:hover {
+  background: #F9F9F9;
+  border: 1px solid #CCC;
+}
+.home-sections ul li a,
+.home-sections ul li a:hover {
+  font-weight: bold;
+  margin-top: 8px;
+  line-height: 18px;
+  float: left;
+  width: 100%;
+  text-align: center;
+  color: #09c !important;
+}
+.home-sections ul li a {
+  font-weight: bold;
+  margin-top: 8px;
+  line-height: 18px;
+  float: left;
+  width:100%;
+  text-align:center;
+}
+.home-sections ul li img {
+  float: left;
+  margin: -8px 0 0 10px;
+}
+.home-sections ul li.last {
+  margin-right: 0px;
+}
+.fullpage #footer {
+  margin-top: -40px;
+}
+
+/************ DISTRIBUTE PAGES ******************/
+
+.article-detail #body-content {
+  padding-top: 10px;
+}
+
+/* A container for grid sets with uppercase h3 and rule */
+.dynamic-grid h3 {
+  font-size:14px;
+  line-height:21px;
+  color:#555;
+  text-transform:uppercase;
+  border-bottom:1px solid #CCC;
+  padding:8px 0 0 1px;
+  margin-bottom:14px;
+  clear:both;
+}
+
+.top-right-float {
+  float: right;
+}
+
+.clearfloat {
+  float: none;
+  clear: both;
+}
+
+.border-img {
+  border: 1px solid #CCC;
+}
+
+.center-img {
+  margin: auto;
+  text-align: center;
+}
+.center-img img {
+  margin-bottom: 15px;
+}
+
+.figure img, .border-img {
+  margin-bottom: 15px;
+}
+
+/************ RESOURCE CARDS ******************/
+
+/* Resource cards, 12, 13, 16-col */
+
+/* Basic card-styling with shadow */
+.resource-card {
+  border-radius: 1px;
+  box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.12);
+  background: #fefefe;
+}
+
+/* Styling for background image including tinting and section icons in stacks */
+.card-bg {
+  display: block;
+  position: absolute;
+  vertical-align: top;
+  width: 100%;
+  left: 0;
+  top: 0;
+  background-size: cover;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-image: url(../images/resource-card-default-android.jpg);
+}
+.card-bg:after {
+  content: "";
+  display: block;
+  height: 100%;
+  width: 100%;
+  opacity: 1;
+  background: rgba(0, 0, 0, 0.2);
+  -webkit-transition: opacity 0.5s;
+  -moz-transition: opacity 0.5s;
+  -o-transition: opacity 0.5s;
+  transition: opacity 0.5s;
+}
+.static .card-bg:after {
+  display:none;
+}
+.card-bg .card-section-icon {
+  position: absolute;
+  top: 50%;
+  width: 100%;
+  margin-top: -35px;
+  text-align: center;
+  padding-top: 65px;
+  z-index: 100;
+}
+.card-bg .card-section-icon .icon {
+  position: absolute;
+  left: 50%;
+  margin-left: -28px;
+  top: 0px;
+  width: 56px;
+  height: 56px;
+  background-repeat: no-repeat;
+  background-position: 50% 50%;
+  background-image: url(../images/stack-icon.png);
+}
+.card-bg .card-section-icon .section {
+  text-transform: uppercase;
+  color: white;
+  font-size: 14px;
+}
+
+.card-info {
+  position: absolute;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  overflow: hidden;
+  background: #fefefe;
+  padding: 4px 12px 6px 12px;
+}
+.card-info .section {
+  text-transform: uppercase;
+  color: #898989;
+  font-size: 12px;
+  margin-bottom: 1px;
+}
+.card-info .title {
+  color: #363636;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  padding-bottom: 5px;
+  margin-bottom: -2px;
+  font-size: 16px;
+}
+.card-info .description {
+  overflow: hidden;
+}
+.card-info .description .text {
+  color: #464646;
+  font: 13px/15px Roboto Condensed;
+  overflow: hidden;
+  width:100%;
+}
+.card-info .description .util {
+  position: absolute;
+  right: 5px;
+  bottom: 70px; /*-2px;*/
+  opacity: 0;
+  -webkit-transition: opacity 0.5s;
+  -moz-transition: opacity 0.5s;
+  -o-transition: opacity 0.5s;
+  transition: opacity 0.5s;
+}
+.card-info.empty-desc .title {
+  white-space: normal;
+  overflow: visible;
+}
+.card-info.empty-desc .description {
+  display: none;
+}
+/* Truncate card summaries at bounding box and
+ * and apply ellipsis at lower right */
+.ellipsis {
+  overflow: hidden;
+  float:right;
+  line-height: 15px;
+  width:100%;
+}
+.resource-card-6x6 .card-info .description .teddddddxt {
+ float:left;
+  position:relative;
+  margin-left:0;
+}
+.ellipsis:before {
+  content:"";
+  float: left;
+  width: 5px;
+  height:100%;
+}
+.ellipsis > *:first-child.text {
+  float: right;
+  width: 100%  !important;
+  margin-left: -5px;
+}
+.ellipsis:after {
+  content: "\02026";
+  height:17px;
+  padding-bottom:4px;
+
+  box-sizing: content-box;
+  -webkit-box-sizing: content-box;
+  -moz-box-sizing: content-box;
+
+  float: right; position: relative;
+  top: -16px; left: 100%;
+  width: 4em; margin-left: -4em;
+  padding-right: 5px;
+
+  background: -webkit-gradient(linear, left top, right top,
+    from(rgba(255, 255, 255, 0)), to(white), color-stop(65%, white));
+  background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white);
+  background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white);
+  background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white);
+  background: linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white);
+}
+.ellipsis:after {
+  font-style: normal; color: #aaa;
+  font-size:13px;
+  text-align: right;
+}
+
+/* Flow Layout */
+.resource-flow-layout {
+  display: inline-block;
+}
+.resource-flow-layout .resource-card, .resource-flow-layout .resource-card-stack {
+  float: left;
+  position: relative;
+}
+.resource-flow-layout .resource-card-stack > .resource-card {
+  margin-right: 0px !important;
+}
+.resource-flow-layout:after {
+  content: ".";
+  display: block;
+  height: 0;
+  position:relative;
+  clear: both;
+  visibility: hidden;
+}
+.resource-card:hover {
+  cursor: pointer;
+}
+.static .resource-card:hover {
+  cursor: auto;
+}
+.resource-card:hover .card-bg:after {
+  opacity: 0;
+}
+/* disabled to make way for fade/ellipsis truncation,
+   and the plusone moves up.
+.resource-card:hover .card-info .description .text {
+  padding-right: 70px;
+} */
+.resource-card:hover .card-info .description .util {
+  opacity: 1;
+}
+
+/* Carousel Layout */
+/* Carousel styles for landing page */
+.resource-carousel-layout {
+  margin: 20px 0 20px 0;
+  position: relative;
+  overflow: hidden;
+}
+.resource-carousel-layout .slideshow-prev, .resource-carousel-layout .slideshow-next {
+  display: none;
+}
+.resource-carousel-layout .pagination {
+  bottom: 0px;
+}
+.resource-carousel-layout .frame li {
+  position: relative;
+}
+.resource-carousel-layout .frame li .card-bg {
+  height: 300px;
+}
+.resource-carousel-layout .frame li .card-info {
+  padding: 7px 15px 0px 15px;
+  top: 300px;
+}
+.resource-carousel-layout .frame li .card-info .section {
+  font-size: 13px;
+  margin-bottom: 7px;
+}
+.resource-carousel-layout .frame li .card-info .title {
+  font-size: 25px;
+  margin-bottom: 2px;
+}
+.resource-carousel-layout .frame li .card-info .description {
+  font-family: 15px/16px Roboto Condensed, sans-serif;
+}
+.resource-carousel-layout .frame li .card-info .description .text {
+  height: 40px;
+}
+.resource-carousel-layout .frame li .card-info .description .util {
+  bottom:97px;
+  right:4px;
+}
+
+/* Stack Layout */
+.resource-stack-layout {
+  display: inline-block;
+}
+.resource-stack-layout .resource-card-stack {
+  float: left;
+  position: relative;
+}
+.resource-stack-layout .resource-card {
+  margin-bottom: 20px;
+  display: block;
+  position: relative;
+}
+.resource-stack-layout .section-card-menu > .card-info .section, .resource-stack-layout .section-card > .card-info .title {
+  /*text-transform: uppercase;*/
+  color: #898989;
+  font-size: 17px;
+  line-height: 24px;
+  margin-bottom: 6px;
+}
+.resource-stack-layout .section-card {
+  height: 284px;
+}
+.resource-stack-layout .section-card > .card-bg {
+  height: 192px;
+}
+.resource-stack-layout .section-card > .card-info {
+  padding: 4px 12px 6px 12px;
+  top: 192px;
+}
+.resource-stack-layout .section-card > .card-info .section {
+  display: none;
+}
+.resource-stack-layout .section-card > .card-info .title {
+  font-size: 17px;
+  border-bottom: 1px solid #959595;
+  padding-bottom: 0px;
+}
+.resource-stack-layout .section-card > .card-info .description {
+  font-size: 13px;
+  line-height: 15px;
+}
+.resource-stack-layout .section-card > .card-info .description .text {
+  height: 30px;
+}
+.resource-stack-layout .related-card {
+  height: 90px;
+}
+.resource-stack-layout .related-card > .card-bg {
+  left: 0;
+  top: 0;
+  width: 90px;
+  height: 100%;
+  position: absolute;
+  display: block;
+}
+.resource-stack-layout .related-card > .card-info {
+  left: 90px;
+  padding: 4px 12px 4px 12px;
+}
+.resource-stack-layout .related-card > .card-info .section {
+  font-size: 12px;
+  margin-bottom: 1px;
+  display: none;
+}
+.resource-stack-layout .related-card > .card-info .title {
+  font-size: 16px;
+  margin-bottom: -2px;
+  white-space: normal;
+  overflow: visible;
+  text-overflow: ellipsis;
+}
+.resource-stack-layout .related-card > .card-info .title:after {
+  content: url(../images/link-out.png);
+  display: block;
+}
+.resource-stack-layout .related-card > .card-info .description {
+  display: none;
+}
+.resource-stack-layout .section-card-menu {
+  /* Flexible height */
+  display: block;
+  height: auto;
+  width: auto;
+}
+.resource-stack-layout .section-card-menu .card-bg {
+  height: 155px;
+  /* Flexible height */
+  position: relative;
+  display: inline-block;
+  vertical-align: top;
+}
+.resource-stack-layout .section-card-menu .card-info {
+  padding: 4px 12px 0px 12px;
+  /* Flexible height */
+  position: relative;
+  left: auto;
+  top: auto;
+  right: auto;
+  bottom: auto;
+}
+.resource-stack-layout .section-card-menu .card-info ul {
+  list-style: none;
+  margin: 0;
+}
+.resource-stack-layout .section-card-menu .card-info ul li {
+  list-style: none;
+  margin: 0;
+  padding: 15px 0;
+  border-top-width: 1px;
+  border-top-style: solid;
+  border-top-color: #959595;
+}
+.resource-stack-layout .section-card-menu .card-info ul li a, .resource-stack-layout .section-card-menu .card-info ul li a:focus, .resource-stack-layout .section-card-menu .card-info ul li a:link, .resource-stack-layout .section-card-menu .card-info ul li a:visited, .resource-stack-layout .section-card-menu .card-info ul li a:active, .resource-stack-layout .section-card-menu .card-info ul li a:hover {
+  color: #363636 !important;
+}
+.resource-stack-layout .section-card-menu .card-info ul li:first-child {
+  border-top: none;
+}
+.resource-stack-layout .section-card-menu .card-info ul li:hover .title:after {
+  opacity: 1;
+  -webkit-transition: opacity 0.5s;
+  -moz-transition: opacity 0.5s;
+  -o-transition: opacity 0.5s;
+  transition: opacity 0.5s;
+}
+.resource-stack-layout .section-card-menu .card-info ul li:hover .description {
+  max-height: 30px;
+  opacity: 1;
+  -webkit-transition: max-height 0.5s, opacity 1s;
+  -moz-transition: max-height 0.5s, opacity 1s;
+  -o-transition: max-height 0.5s, opacity 1s;
+  transition: max-height 0.5s, opacity 1s;
+}
+.resource-stack-layout .section-card-menu .card-info .title {
+  font-size: 16px;
+  margin-bottom: -2px;
+  position: relative;
+}
+.resource-stack-layout .section-card-menu .card-info .title:after {
+  background: url(../images/stack-arrow-right.png);
+  content: '';
+  opacity: 0;
+  -webkit-transition: opacity 0.25s;
+  -moz-transition: opacity 0.25s;
+  -o-transition: opacity 0.25s;
+  transition: opacity 0.25s;
+  position: absolute;
+  right: 0px;
+  top: 3px;
+  width: 10px;
+  height: 15px;
+}
+.resource-stack-layout .section-card-menu .card-info .title.more {
+  text-transform: uppercase;
+  color: #898989;
+  display: inline-block;
+}
+.resource-stack-layout .section-card-menu .card-info .title.more:after {
+  background: url(../images/stack-arrow-right.png);
+  content: '';
+  display: block;
+  position: absolute;
+  right: -20px;
+  top: 3px;
+  width: 10px;
+  height: 15px;
+}
+.resource-stack-layout .section-card-menu .card-info .description {
+  max-height: 0px;
+  opacity: 0;
+  overflow: hidden;
+  font-size: 13px;
+  line-height: 15px;
+  /* Hover off */
+  -webkit-transition: max-height 0.5s, opacity 0.5s;
+  -moz-transition: max-height 0.5s, opacity 0.5s;
+  -o-transition: max-height 0.5s, opacity 0.5s;
+  transition: max-height 0.5s, opacity 0.5s;
+}
+.resource-stack-layout .section-card-menu .card-info .description .text {
+  height: 30px;
+}
+.resource-stack-layout:after {
+  content: ".";
+  display: block;
+  height: 0;
+  clear: both;
+  visibility: hidden;
+}
+
+/* Generate the flow layout styles for a 3-column 16-col span */
+.resource-flow-layout.col-16 {
+  margin: 0 -14px 0 0;
+  width: 954px;
+}
+.resource-flow-layout.col-16 .resource-card, .resource-flow-layout.col-16 .resource-card-stack {
+  margin: 0 14px 20px 0;
+}
+.resource-flow-layout.col-16 .resource-card-row-stack-last {
+  margin-bottom: 0px !important;
+}
+.resource-flow-layout.col-16 .resource-card-col-stack-last {
+  margin-bottom: 0px !important;
+}
+.resource-flow-layout.col-16 .resource-card-3x6 {
+  width: 145px;
+  height: 284px;
+}
+.resource-flow-layout.col-16 .resource-card-3x12 {
+  width: 145px;
+  height: 588px;
+}
+.resource-flow-layout.col-16 .resource-card-3x18 {
+  width: 145px;
+  height: 892px;
+}
+.resource-flow-layout.col-16 .resource-card-6x6 {
+  width: 304px;
+  height: 284px;
+}
+.resource-flow-layout.col-16 .resource-card-6x12 {
+  width: 304px;
+  height: 588px;
+}
+.resource-flow-layout.col-16 .resource-card-6x18 {
+  width: 304px;
+  height: 892px;
+}
+.resource-flow-layout.col-16 .resource-card-9x6 {
+  width: 463px;
+  height: 284px;
+}
+.resource-flow-layout.col-16 .resource-card-9x12 {
+  width: 463px;
+  height: 588px;
+}
+.resource-flow-layout.col-16 .resource-card-9x18 {
+  width: 463px;
+  height: 892px;
+}
+.resource-flow-layout.col-16 .resource-card-12x6 {
+  width: 622px;
+  height: 284px;
+}
+.resource-flow-layout.col-16 .resource-card-12x12 {
+  width: 622px;
+  height: 588px;
+}
+.resource-flow-layout.col-16 .resource-card-12x18 {
+  width: 622px;
+  height: 892px;
+}
+.resource-flow-layout.col-16 .resource-card-15x6 {
+  width: 781px;
+  height: 284px;
+}
+.resource-flow-layout.col-16 .resource-card-15x12 {
+  width: 781px;
+  height: 588px;
+}
+.resource-flow-layout.col-16 .resource-card-15x18 {
+  width: 781px;
+  height: 892px;
+}
+.resource-flow-layout.col-16 .resource-card-18x6 {
+  width: 940px;
+  height: 284px;
+}
+.resource-flow-layout.col-16 .resource-card-18x12 {
+  width: 940px;
+  height: 420px;
+}
+.resource-flow-layout.col-16 .resource-card-18x18 {
+  width: 940px;
+  height: 892px;
+}
+.resource-flow-layout.col-16 .resource-card-3x2 {
+  width: 145px;
+  height: 95px;
+}
+.resource-flow-layout.col-16 .resource-card-3x2x3 {
+  width: 145px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-16 .resource-card-3x3 {
+  width: 145px;
+  height: 142px;
+}
+.resource-flow-layout.col-16 .resource-card-3x3x2 {
+  width: 145px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-16 .resource-card-6x2 {
+  width: 304px;
+  height: 95px;
+}
+.resource-flow-layout.col-16 .resource-card-6x2x3 {
+  width: 304px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-16 .resource-card-6x3 {
+  width: 304px;
+  height: 142px;
+}
+.resource-flow-layout.col-16 .resource-card-6x3x2 {
+  width: 304px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-16 .resource-card-9x2 {
+  width: 463px;
+  height: 95px;
+}
+.resource-flow-layout.col-16 .resource-card-9x2x3 {
+  width: 463px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-16 .resource-card-9x3 {
+  width: 463px;
+  height: 142px;
+}
+.resource-flow-layout.col-16 .resource-card-9x3x2 {
+  width: 463px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-16 .resource-card-12x2 {
+  width: 622px;
+  height: 95px;
+}
+.resource-flow-layout.col-16 .resource-card-12x2x3 {
+  width: 622px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-16 .resource-card-12x3 {
+  width: 622px;
+  height: 142px;
+}
+.resource-flow-layout.col-16 .resource-card-12x3x2 {
+  width: 622px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-16 .resource-card-15x2 {
+  width: 781px;
+  height: 95px;
+}
+.resource-flow-layout.col-16 .resource-card-15x2x3 {
+  width: 781px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-16 .resource-card-15x3 {
+  width: 781px;
+  height: 142px;
+}
+.resource-flow-layout.col-16 .resource-card-15x3x2 {
+  width: 781px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-16 .resource-card-18x2 {
+  width: 940px;
+  height: 95px;
+}
+.resource-flow-layout.col-16 .resource-card-18x2x3 {
+  width: 940px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-16 .resource-card-18x3 {
+  width: 940px;
+  height: 142px;
+}
+.resource-flow-layout.col-16 .resource-card-18x3x2 {
+  width: 940px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+
+/* Generate the flow layout styles for a 3-column 16-col span */
+.resource-flow-layout.col-12 {
+  margin: 0 -14px 0 0;
+  width: 714px;
+}
+
+.resource-flow-layout.col-12 .resource-card, .resource-flow-layout.col-12 .resource-card-stack {
+  margin: 0 14px 20px 0;
+}
+.resource-flow-layout.col-12 .resource-card-row-stack-last {
+  margin-bottom: 0px !important;
+}
+.resource-flow-layout.col-12 .resource-card-col-stack-last {
+  margin-bottom: 0px !important;
+}
+.resource-flow-layout.col-12 .resource-card-3x6 {
+  width: 105px;
+  height: 284px;
+}
+.resource-flow-layout.col-12 .resource-card-3x12 {
+  width: 105px;
+  height: 588px;
+}
+.resource-flow-layout.col-12 .resource-card-3x18 {
+  width: 105px;
+  height: 892px;
+}
+.resource-flow-layout.col-12 .resource-card-6x6 {
+  width: 224px;
+  height: 284px;
+}
+.resource-flow-layout.col-12 .resource-card-6x12 {
+  width: 224px;
+  height: 588px;
+}
+.resource-flow-layout.col-12 .resource-card-6x18 {
+  width: 224px;
+  height: 892px;
+}
+.resource-flow-layout.col-12 .resource-card-9x6 {
+  width: 343px;
+  height: 284px;
+}
+.resource-flow-layout.col-12 .resource-card-9x12 {
+  width: 343px;
+  height: 588px;
+}
+.resource-flow-layout.col-12 .resource-card-9x18 {
+  width: 343px;
+  height: 892px;
+}
+.resource-flow-layout.col-12 .resource-card-12x6 {
+  width: 462px;
+  height: 284px;
+}
+.resource-flow-layout.col-12 .resource-card-12x12 {
+  width: 462px;
+  height: 588px;
+}
+.resource-flow-layout.col-12 .resource-card-12x18 {
+  width: 462px;
+  height: 892px;
+}
+.resource-flow-layout.col-12 .resource-card-15x6 {
+  width: 581px;
+  height: 284px;
+}
+.resource-flow-layout.col-12 .resource-card-15x12 {
+  width: 581px;
+  height: 588px;
+}
+.resource-flow-layout.col-12 .resource-card-15x18 {
+  width: 581px;
+  height: 892px;
+}
+.resource-flow-layout.col-12 .resource-card-18x6 {
+  width: 700px;
+  height: 284px;
+}
+.resource-flow-layout.col-12 .resource-card-18x12 {
+  width: 700px;
+  height: 420px;
+}
+.resource-flow-layout.col-12 .resource-card-18x18 {
+  width: 700px;
+  height: 892px;
+}
+.resource-flow-layout.col-12 .resource-card-3x2 {
+  width: 105px;
+  height: 95px;
+}
+.resource-flow-layout.col-12 .resource-card-3x2x3 {
+  width: 105px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-12 .resource-card-3x3 {
+  width: 105px;
+  height: 142px;
+}
+.resource-flow-layout.col-12 .resource-card-3x3x2 {
+  width: 105px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-12 .resource-card-6x2 {
+  width: 224px;
+  height: 95px;
+}
+.resource-flow-layout.col-12 .resource-card-6x2x3 {
+  width: 224px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-12 .resource-card-6x3 {
+  width: 224px;
+  height: 142px;
+}
+.resource-flow-layout.col-12 .resource-card-6x3x2 {
+  width: 224px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-12 .resource-card-9x2 {
+  width: 343px;
+  height: 95px;
+}
+.resource-flow-layout.col-12 .resource-card-9x2x3 {
+  width: 343px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-12 .resource-card-9x3 {
+  width: 343px;
+  height: 142px;
+}
+.resource-flow-layout.col-12 .resource-card-9x3x2 {
+  width: 343px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-12 .resource-card-12x2 {
+  width: 462px;
+  height: 95px;
+}
+.resource-flow-layout.col-12 .resource-card-12x2x3 {
+  width: 462px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-12 .resource-card-12x3 {
+  width: 462px;
+  height: 142px;
+}
+.resource-flow-layout.col-12 .resource-card-12x3x2 {
+  width: 462px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-12 .resource-card-15x2 {
+  width: 581px;
+  height: 95px;
+}
+.resource-flow-layout.col-12 .resource-card-15x2x3 {
+  width: 581px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-12 .resource-card-15x3 {
+  width: 581px;
+  height: 142px;
+}
+.resource-flow-layout.col-12 .resource-card-15x3x2 {
+  width: 581px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-12 .resource-card-18x2 {
+  width: 700px;
+  height: 95px;
+}
+.resource-flow-layout.col-12 .resource-card-18x2x3 {
+  width: 700px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-12 .resource-card-18x3 {
+  width: 700px;
+  height: 142px;
+}
+.resource-flow-layout.col-12 .resource-card-18x3x2 {
+  width: 700px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+
+/* Generate the flow layout styles for a 3-column 13-col span */
+
+.resource-flow-layout.col-13 {
+  margin: 0 -14px 0 0;
+  width: 774px;
+}
+.resource-flow-layout.col-13 .resource-card, .resource-flow-layout.col-13 .resource-card-stack {
+  margin: 0 14px 20px 0;
+}
+.resource-flow-layout.col-13 .resource-card-row-stack-last {
+  margin-bottom: 0px !important;
+}
+.resource-flow-layout.col-13 .resource-card-col-stack-last {
+  margin-bottom: 0px !important;
+}
+.resource-flow-layout.col-13 .resource-card-3x6 {
+  width: 115px;
+  height: 284px;
+}
+.resource-flow-layout.col-13 .resource-card-3x12 {
+  width: 115px;
+  height: 588px;
+}
+.resource-flow-layout.col-13 .resource-card-3x18 {
+  width: 115px;
+  height: 892px;
+}
+.resource-flow-layout.col-13 .resource-card-6x6 {
+  width: 244px;
+  height: 284px;
+}
+.resource-flow-layout.col-13 .resource-card-6x12 {
+  width: 244px;
+  height: 588px;
+}
+.resource-flow-layout.col-13 .resource-card-6x18 {
+  width: 244px;
+  height: 892px;
+}
+.resource-flow-layout.col-13 .resource-card-9x6 {
+  width: 373px;
+  height: 284px;
+}
+.resource-flow-layout.col-13 .resource-card-9x12 {
+  width: 373px;
+  height: 588px;
+}
+.resource-flow-layout.col-13 .resource-card-9x18 {
+  width: 373px;
+  height: 892px;
+}
+.resource-flow-layout.col-13 .resource-card-12x6 {
+  width: 502px;
+  height: 284px;
+}
+.resource-flow-layout.col-13 .resource-card-12x12 {
+  width: 502px;
+  height: 588px;
+}
+.resource-flow-layout.col-13 .resource-card-12x18 {
+  width: 502px;
+  height: 892px;
+}
+.resource-flow-layout.col-13 .resource-card-15x6 {
+  width: 631px;
+  height: 284px;
+}
+.resource-flow-layout.col-13 .resource-card-15x12 {
+  width: 631px;
+  height: 588px;
+}
+.resource-flow-layout.col-13 .resource-card-15x18 {
+  width: 631px;
+  height: 892px;
+}
+.resource-flow-layout.col-13 .resource-card-18x6 {
+  width: 760px;
+  height: 284px;
+}
+.resource-flow-layout.col-13 .resource-card-18x12 {
+  width: 760px;
+  height: 420px;
+}
+.resource-flow-layout.col-13 .resource-card-18x18 {
+  width: 760px;
+  height: 892px;
+}
+.resource-flow-layout.col-13 .resource-card-3x2 {
+  width: 115px;
+  height: 95px;
+}
+.resource-flow-layout.col-13 .resource-card-3x2x3 {
+  width: 115px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-13 .resource-card-3x3 {
+  width: 115px;
+  height: 142px;
+}
+.resource-flow-layout.col-13 .resource-card-3x3x2 {
+  width: 115px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-13 .resource-card-6x2 {
+  width: 244px;
+  height: 95px;
+}
+.resource-flow-layout.col-13 .resource-card-6x2x3 {
+  width: 244px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-13 .resource-card-6x3 {
+  width: 244px;
+  height: 142px;
+}
+.resource-flow-layout.col-13 .resource-card-6x3x2 {
+  width: 244px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-13 .resource-card-9x2 {
+  width: 373px;
+  height: 95px;
+}
+.resource-flow-layout.col-13 .resource-card-9x2x3 {
+  width: 373px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-13 .resource-card-9x3 {
+  width: 373px;
+  height: 142px;
+}
+.resource-flow-layout.col-13 .resource-card-9x3x2 {
+  width: 373px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-13 .resource-card-12x2 {
+  width: 502px;
+  height: 95px;
+}
+.resource-flow-layout.col-13 .resource-card-12x2x3 {
+  width: 502px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-13 .resource-card-12x3 {
+  width: 502px;
+  height: 142px;
+}
+.resource-flow-layout.col-13 .resource-card-12x3x2 {
+  width: 502px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-13 .resource-card-15x2 {
+  width: 631px;
+  height: 95px;
+}
+.resource-flow-layout.col-13 .resource-card-15x2x3 {
+  width: 631px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-13 .resource-card-15x3 {
+  width: 631px;
+  height: 142px;
+}
+.resource-flow-layout.col-13 .resource-card-15x3x2 {
+  width: 631px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+.resource-flow-layout.col-13 .resource-card-18x2 {
+  width: 760px;
+  height: 95px;
+}
+.resource-flow-layout.col-13 .resource-card-18x2x3 {
+  width: 760px;
+  height: 90px;
+  margin-bottom: 7px;
+}
+.resource-flow-layout.col-13 .resource-card-18x3 {
+  width: 760px;
+  height: 142px;
+}
+.resource-flow-layout.col-13 .resource-card-18x3x2 {
+  width: 760px;
+  height: 138px;
+  margin-bottom: 8px;
+}
+
+/*
+  The following are styles for cards in the flowlayout above, styled by the number of rows they span
+*/
+/* Single row items, might be simpler to just apply a class */
+.resource-card-3x6 > .card-bg, .resource-card-6x6 > .card-bg, .resource-card-9x6 > .card-bg, .resource-card-12x6 > .card-bg, .resource-card-15x6 > .card-bg, .resource-card-18x6 > .card-bg {
+  height: 192px;
+}
+.resource-card-3x6 > .card-info, .resource-card-6x6 > .card-info, .resource-card-9x6 > .card-info, .resource-card-12x6 > .card-info, .resource-card-15x6 > .card-info, .resource-card-18x6 > .card-info {
+  padding: 4px 12px 6px 12px;
+  top: 192px;
+}
+.resource-card-3x6 > .card-info .section, .resource-card-6x6 > .card-info .section, .resource-card-9x6 > .card-info .section, .resource-card-12x6 > .card-info .section, .resource-card-15x6 > .card-info .section, .resource-card-18x6 > .card-info .section {
+  font-size: 12px;
+  margin-bottom: 1px;
+}
+.resource-card-3x6 > .card-info .title, .resource-card-6x6 > .card-info .title, .resource-card-9x6 > .card-info .title, .resource-card-12x6 > .card-info .title, .resource-card-15x6 > .card-info .title, .resource-card-18x6 > .card-info .title {
+  font-size: 16px;
+  margin-bottom: -2px;
+}
+.resource-card-3x6 > .card-info .description, .resource-card-6x6 > .card-info .description, .resource-card-9x6 > .card-info .description, .resource-card-12x6 > .card-info .description, .resource-card-15x6 > .card-info .description, .resource-card-18x6 > .card-info .description {
+  font-size: 13px;
+  line-height: 15px;
+}
+.resource-card-3x6 > .card-info .description .text, .resource-card-6x6 > .card-info .description .text, .resource-card-9x6 > .card-info .description .text, .resource-card-12x6 > .card-info .description .text, .resource-card-15x6 > .card-info .description .text, .resource-card-18x6 > .card-info .description .text {
+  height: 30px;
+}
+
+/* Double row items */
+.resource-card-3x12 > .card-bg, .resource-card-6x12 > .card-bg, .resource-card-9x12 > .card-bg, .resource-card-12x12 > .card-bg, .resource-card-15x12 > .card-bg, .resource-card-18x12 > .card-bg {
+  height: 320px;
+}
+.resource-card-3x12 > .card-info, .resource-card-6x12 > .card-info, .resource-card-9x12 > .card-info, .resource-card-12x12 > .card-info, .resource-card-15x12 > .card-info, .resource-card-18x12 > .card-info {
+  padding: 4px 12px 6px 12px;
+  top: 320px;
+}
+.resource-card-3x12 > .card-info .section, .resource-card-6x12 > .card-info .section, .resource-card-9x12 > .card-info .section, .resource-card-12x12 > .card-info .section, .resource-card-15x12 > .card-info .section, .resource-card-18x12 > .card-info .section {
+  font-size: 12px;
+  margin-bottom: 1px;
+}
+.resource-card-3x12 > .card-info .title, .resource-card-6x12 > .card-info .title, .resource-card-9x12 > .card-info .title, .resource-card-12x12 > .card-info .title, .resource-card-15x12 > .card-info .title, .resource-card-18x12 > .card-info .title {
+  font-size: 16px;
+  margin-bottom: -2px;
+  white-space: normal;
+}
+.resource-card-3x12 > .card-info .description, .resource-card-6x12 > .card-info .description, .resource-card-9x12 > .card-info .description, .resource-card-12x12 > .card-info .description, .resource-card-15x12 > .card-info .description, .resource-card-18x12 > .card-info .description {
+  font-size: 13px;
+  line-height: 15px;
+}
+
+/* 1/3 row items */
+.resource-card-3x2 > .card-bg, .resource-card-6x2 > .card-bg, .resource-card-9x2 > .card-bg, .resource-card-12x2 > .card-bg, .resource-card-15x2 > .card-bg, .resource-card-18x2 > .card-bg {
+  left: 0;
+  top: 0;
+  width: 90px;
+  height: 100%;
+  position: absolute;
+  display: block;
+}
+.resource-card-3x2 > .card-info, .resource-card-6x2 > .card-info, .resource-card-9x2 > .card-info, .resource-card-12x2 > .card-info, .resource-card-15x2 > .card-info, .resource-card-18x2 > .card-info {
+  left: 90px;
+  padding: 4px 12px 4px 12px;
+  height: 80px;
+  overflow: hidden;
+}
+.resource-card-3x2 > .card-info .section, .resource-card-6x2 > .card-info .section, .resource-card-6x3 > .card-info .section, .resource-card-9x2 > .card-info .section, .resource-card-12x2 > .card-info .section, .resource-card-15x2 > .card-info .section, .resource-card-18x2 > .card-info .section {
+  font-size: 12px;
+  margin-bottom: 1px;
+  /* display: none; */
+}
+.resource-card-3x2 > .card-info .title, .resource-card-6x2 > .card-info .title, .resource-card-9x2 > .card-info .title, .resource-card-12x2 > .card-info .title, .resource-card-15x2 > .card-info .title, .resource-card-18x2 > .card-info .title {
+  font-size: 16px;
+  margin-bottom: -2px;
+  white-space: normal;
+  overflow: visible;
+  text-overflow: ellipsis;
+}
+.resource-card-3x2 > .card-info .title:after, .resource-card-6x2 > .card-info .title:after, .resource-card-9x2 > .card-info .title:after, .resource-card-12x2 > .card-info .title:after, .resource-card-15x2 > .card-info .title:after, .resource-card-18x2 > .card-info .title:after {
+  /* content: url(../images/link-out.png); */
+  display: block;
+}
+.resource-card-3x2 > .card-info .description, .resource-card-6x2 > .card-info .description, .resource-card-9x2 > .card-info .description, .resource-card-12x2 > .card-info .description, .resource-card-15x2 > .card-info .description, .resource-card-18x2 > .card-info .description {
+  display: none;
+}
+
+
+/* Override to show the description instead of the content section */
+.no-section .resource-card-3x2 > .card-info .section,
+.no-section .resource-card-6x2 > .card-info .section {
+  display: none;
+}
+.no-section .resource-card-3x2 > .card-info .description,
+.no-section .resource-card-6x2 > .card-info .description {
+  display: block;
+}
+
+/* 1/2 row items */
+.resource-card-3x3 > .card-bg, .resource-card-6x3 > .card-bg, .resource-card-9x3 > .card-bg, .resource-card-12x3 > .card-bg, .resource-card-15x3 > .card-bg, .resource-card-18x3 > .card-bg {
+  left: 0;
+  top: 0;
+  width: 90px;
+  height: 100%;
+  position: absolute;
+  display: block;
+}
+.resource-card-3x3 > .card-info, .resource-card-6x3 > .card-info, .resource-card-9x3 > .card-info, .resource-card-12x3 > .card-info, .resource-card-15x3 > .card-info, .resource-card-18x3 > .card-info {
+  left: 90px;
+  padding: 4px 12px 0px 12px;
+}
+.resource-card-3x3 > .card-info .section, .resource-card-6x3 > .card-info .section, .resource-card-9x3 > .card-info .section, .resource-card-12x3 > .card-info .section, .resource-card-15x3 > .card-info .section, .resource-card-18x3 > .card-info .section {
+  font-size: 12px;
+  margin-bottom: 1px;
+  display: none;
+}
+.resource-card-3x3 > .card-info .title, .resource-card-6x3 > .card-info .title, .resource-card-9x3 > .card-info .title, .resource-card-12x3 > .card-info .title, .resource-card-15x3 > .card-info .title, .resource-card-18x3 > .card-info .title {
+  font-size: 16px;
+  margin-bottom: -2px;
+  white-space: normal;
+  overflow: visible;
+}
+.resource-card-3x3 > .card-info .description .text, .resource-card-6x3 > .card-info .description .text, .resource-card-9x3 > .card-info .description .text, .resource-card-12x3 > .card-info .description .text, .resource-card-15x3 > .card-info .description .text, .resource-card-18x3 > .card-info .description .text {
+  font-size: 12px;
+  line-height: 15px;
+  padding-right: 0px !important;
+  height: 80px;
+}
+.resource-card-3x3 > .card-info .description .util, .resource-card-6x3 > .card-info .description .util, .resource-card-9x3 > .card-info .description .util, .resource-card-12x3 > .card-info .description .util, .resource-card-15x3 > .card-info .description .util, .resource-card-18x3 > .card-info .description .util {
+  display: none;
+}
+/* placement of plusone */
+.resource-card-6x12 > .card-info .description .util, .resource-card-9x12 > .card-info .description .util, .resource-card-12x12 > .card-info .description .util, .resource-card-15x12 > .card-info .description .util {
+  bottom:2px;
+}
+.resource-card-18x12 > .card-info .description .util {
+  bottom:2px;
+}
+/* Overrides for col-16 6x6 cards linking to local content on landing pages.
+   Suppresses "section" and puts the title above a hairline rule. */
+.landing .card-info .section, .resource-flow-layout.col-16.landing .resource-card-9x6 .card-info .section {
+  display:none;
+}
+.landing  .card-info .title {
+  color: #898989;
+  font-size: 17px;
+  line-height: 24px;
+  margin-bottom: 6px;
+  border-bottom: 1px solid #959595;
+  padding-bottom: 0px;
+}
+.landing .card-info .description {
+  font-size: 13px;
+  line-height: 15px;
+}
+.landing .card-info .description .text {
+height:30px;
+}
+.landing .resource-card-6x6 > .card-info .description .util, .landing .resource-card-9x6 > .card-info .description .util {
+  bottom:2px;
+}
+/*
+  Generate a resource stack layout for a 3 column widget spanning 16 grid cols
+*/
+.resource-stack-layout.col-16 {
+  margin: 0 -14px 0 0;
+  width: 954px;
+}
+.resource-stack-layout.col-16 .resource-card-stack {
+  margin: 0 14px 0 0;
+  width: 304px;
+}
+
+/* Example of card menu tinting */
+.resource-widget[data-section=distribute\/tools] .section-card-menu
+.card-bg:after {
+  background: rgba(126, 55, 148, 0.4) !important;
+}
+.resource-widget[data-section=distribute\/tools] .section-card-menu
+.card-section-icon .icon {
+  background-color: #7e3794 !important;
+}
+.resource-widget[data-section=distribute\/tools] .section-card-menu
+.card-info ul li {
+  border-top-color: #7e3794 !important;
+}
+
+/* tinting for stacks */
+
+div.jd-descr > .resource-widget[data-section=distribute\/tools]
+.section-card-menu .card-info ul li {
+  border-top-color: #7e3794 !important;
+}
+
+
+
+/**
+ * UTILITIES
+ */
+
+
+.border-box {
+  box-sizing: border-box;
+}
+
+.vertical-center-outer {
+  display: table;
+  height: 100%;
+  width: 100%;
+}
+
+.vertical-center-inner {
+  display: table-cell;
+  vertical-align: middle;
+}
+
+/**
+ * TYPE STYLES
+ */
+
+.landing-h1 {
+  font-weight: 100;
+  font-size: 60px;
+  line-height: 78px;
+  text-align: center;
+  letter-spacing: -1px;
+}
+
+.landing-pre-h1 {
+  font-weight: 400;
+  font-size: 28px;
+  color: #93B73F;
+  line-height: 36px;
+  text-align: center;
+  letter-spacing: -1px;
+  text-transform: uppercase;
+
+}
+
+.landing-h1.hero {
+  text-align: left;
+}
+
+.landing-h2 {
+  font-weight: 300;
+  font-size: 42px;
+  line-height: 64px;
+  text-align: center;
+}
+
+.landing-subhead {
+  color: #999999;
+  font-size: 20px;
+  line-height: 28px;
+  font-weight:300;
+  text-align: center;
+}
+.landing-subhead.hero {
+  text-align: left;
+  color: white;
+}
+
+.landing-hero-description {
+  text-align: left;
+  margin: 1em 0;
+}
+
+.landing-hero-description p {
+  font-weight: 300;
+  margin: 0;
+  font-size: 18px;
+  line-height: 24px;
+}
+
+.landing-body .landing-small {
+  font-size: 14px;
+  line-height: 19px;
+}
+
+.landing-body.landing-align-center {
+  text-align: center;
+}
+
+.landing-align-left {
+  text-align: left;
+}
+
+/**
+ * LAYOUT
+ */
+
+#body-content,
+.fullpage,
+#jd-content,
+.jd-descr,
+.landing-body-content {
+  height: 100%;
+}
+
+.landing-section {
+  padding: 80px 10px 80px;
+  width: 100%;
+  margin-left: -10px;
+  text-rendering: optimizeLegibility;
+}
+
+#extending-android-to-wearables {
+  padding-top: 30px;
+}
+
+.landing-short-section {
+  padding: 40px 10px 28px;
+}
+
+.landing-gray-background {
+  background-color: #e9e9e9;
+}
+
+.landing-white-background {
+  background-color: white;
+}
+
+.landing-red-background {
+  color: white;
+  background-color: hsl(8, 70%, 54%);
+}
+
+.landing-subhead-red {
+  color: hsl(8, 71%, 84%);
+  text-align: left;
+}
+
+.landing-subhead-red p {
+  margin-top: 20px;
+}
+
+.landing-hero-container {
+  height: 100%;
+}
+
+
+.preview-hero {
+  height: calc(100% - 110px);
+  min-height: 504px;
+  margin-top: -5px;
+  padding-top: 0;
+  padding-bottom: 0;
+  background-image: url(../../preview/images/hero.jpg);
+  background-size: cover;
+  background-position: right center;
+  color: white;
+  position: relative;
+  overflow: hidden;
+}
+
+.wear-hero {
+  height: calc(100% - 110px);
+  min-height: 504px;
+  margin-top: -5px;
+  padding-top: 0;
+  padding-bottom: 0;
+  background-image: url(../../wear/images/hero.jpg);
+  background-size: cover;
+  background-position: top center;
+  color: white;
+  position: relative;
+  overflow: hidden;
+}
+
+.tv-hero {
+  height: calc(100% - 110px);
+  min-height: 504px;
+  margin-top: -5px;
+  padding-top: 0;
+  padding-bottom: 0;
+  background-image: url(../../tv/images/hero.jpg);
+  background-size: cover;
+  background-position: right center;
+  color: white;
+  position: relative;
+  overflow: hidden;
+}
+
+.auto-hero {
+  height: calc(100% - 110px);
+  min-height: 504px;
+  margin-top: -5px;
+  padding-top: 0;
+  padding-bottom: 0;
+  background-image: url(../../auto/images/hero.jpg);
+  background-size: cover;
+  background-position: right center;
+  color: white;
+  position: relative;
+  overflow: hidden;
+}
+
+.landing-hero-scrim {
+  background: black;
+  opacity: .2;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  margin-left: -10px;
+}
+
+.landing-hero-wrap {
+  margin: 0 auto;
+  width: 940px;
+  clear: both;
+  height: 100%;
+  position: relative;
+}
+
+.landing-section-header {
+  margin-bottom: 40px;
+}
+
+.landing-hero-wrap .landing-section-header {
+  margin-bottom: 16px;
+}
+
+.landing-body {
+  font-size: 18px;
+  line-height: 24px;
+}
+
+.landing-button {
+  white-space: nowrap;
+  display: inline-block;
+  padding: 16px 32px;
+  font-size: 18px;
+  font-weight: 500;
+  line-height: 24px;
+  cursor: pointer;
+  color: white;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+       -o-user-select: none;
+  user-select: none;
+  -webkit-transition: .2s background-color ease-in-out;
+     -moz-transition: .2s background-color ease-in-out;
+       -o-transition: .2s background-color ease-in-out;
+  transition: .2s background-color ease-in-out;
+}
+
+.landing-primary {
+  background-color: hsl(8, 70%, 44%);
+  color: #f8f8f8;
+}
+
+.landing-button.landing-primary:hover {
+  background-color: hsl(8, 70%, 36%);
+}
+
+.landing-button.landing-primary:active {
+  background-color: hsl(8, 70%, 30%);
+}
+
+.landing-button.landing-secondary {
+  background-color: #2faddb;
+}
+
+.landing-button.landing-secondary:hover {
+  background-color: #09c;
+}
+
+.landing-button.landing-secondary:active {
+  background-color: #3990ab;
+}
+
+a.landing-button,
+a.landing-button:hover,
+a.landing-button:visited {
+  color: white !important;
+}
+
+.landing-video-link {
+  white-space: nowrap;
+  display: inline-block;
+  padding: 16px 32px 16px 82px;
+  font-size: 18px;
+  font-weight: 400;
+  line-height: 24px;
+  cursor: pointer;
+  color: hsla(0, 0%, 100%, .8);
+  -webkit-user-select: none;
+     -moz-user-select: none;
+       -o-user-select: none;
+  user-select: none;
+  -webkit-transition: .2s color ease-in-out;
+     -moz-transition: .2s color ease-in-out;
+       -o-transition: .2s color ease-in-out;
+  transition: .2s color ease-in-out;
+}
+
+.landing-video-link:before {
+  height: 64px;
+  width: 64px;
+  display: inline-block;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAFuklEQVR42u2dXWgcVRSAV9LWtBBTTZVWUhNqEQtq1QeroDRKFRFsROqTYPuo+JCiIoJKFC0USqlUfCiowRcfrBgVUUElefAPkW5T8aeaGn9aRbFsjP0x2cx8PuRMvFxmdjeb2Z17Z8+B85DsZPbO+eaec3/OPSkABdXsVI2gABSAqgJQAKoKQAGoKgAFoKoAFICqAlAAqgpAAai6DqDRAiwDeoFtwB7gPaAInABKwKToCWAMeB/YDdwJrAWWNLh9+QMAXABsBQ4A3wFTwAxQBmaBAAhjNJDPy3L938BXwAvArUCHAkh+kCXAVcA+YBw4bRg7MngtkgTlDPA98CywHmhTAP8/xCbgVeAvMZZpwDQllN7xB/AysKGlAQAXAvuBkzW85UVgCBgENlfQQbmuWAXELPAnsAvoaikAQBtwh/j3coLhS2LIfqCzzu/plL8fkvvFgZiR4L2lHrfkHQBgpQTFUwmGnwC212v0KjC2y/3jQPwDPA+05xYAcBHwubx1YZzhC02QBBBRbxgBzssdAOBy4JgRZE0ZTPuNr7FHDCbEhqNAd24AAN0yUbID7QSwsZChABut3hANXY8Bq70HIMb/Ocb4w81+66v0hmGrN0QQ1ngLQJYRvpWHMWWo4KDIaMnuCcVKgdlZAGL8t2J8vpPGrwChDLyWBMFlAA8D0z4ZvwKEs8D93gCQEc9Jy/jFgkdizaRDGUSs8wXAu1bQLQE9ngHosWbPAXDQeQAypT9rBd3+gociyxi2K9riLABZUj5iuZ6RgsciM2OzFxw2A7JrAO6VwGtKTwpG+Anoy9AVmb3gDHCPcwCAFcChRox6jPu9CazMeFQUAKNRL3AJwE2yopjq228BQPZ/d2bcCyaBTa4BeNGa8Q6naIA4GQWubiKEYWvBbp8zAGQt5VfL/fQ3GEAkTzXDLVkjokA2k5a7AuA2GaLNj/tTfvhq0pQgbcwLQtlQusYVALtlzSR191MjADNI9zbJDZWBR10BMGr5/4GMADQ0SAMDlht62xUAxy0AmzMEEMnhtIO0ZF2YAH5wITd0hQw/5wE04M1bjDyXZpC2hqMlYGnWAHqBf40APOEYgChI35VSWyasWfGqrAH0WVkOIw4CSC1IG2tDoSy7XJE1gPs8ArDoIG0BmJGk30wBDHgGYFFBOgbAtqwB7GxxAHerC8rOBU0Dt2gQzjYIb8gawDor+6HVhqFdrkzEwhabiAVOTMSkUb+06FLEUVfWgj5q0cW4g64AeNo66ZLlcnTDNmesBN4y8KArAG6QU42ttCEzBVzpCoAO4EfLDeV5SzIEvgHaXdqUP2BlQud1Ux55zj2uZUX02cPRnKalRLmu17qYmPWF5YbymJgVAh8Ay5wCII3ZEZOYm6fURGT2u9X43Mnk3CDHybmfmRVYXExPv9nKEcpLejqSC3SjdY2TBzTesHqB7wc0onTEV2KucxLApXKkJy9HlAI5anuJFwCkYQ/EuCJfD+mdBnYkXOssgHY53un7MdVZ4CVgqVcADAhjMafkfTioHc14P04yvvMApIEXy5F/+7S8y6UKolPyR4BVVf7Wi2IdawwIPhTrmAW+rmZ8bwBIQ7vloXwoVzNWS6UUrwAYy9YfOlqwKZDkgneA5Qu4l3cly84F9sqGhislywLmaozuYoGFXr0DII1ukxP1hxJ6QzR7HqLxRfumZaRzXZ3f4XXZyi7gCeB3kqsnzs+kSb9s5XHgMeD8RTxDLgq3rmeuYuFvNYCoR8wqujNi+L3UWBcu9wAMt3QZ8LiMlk5RuU50teq6kcEDgTolveIRYHUQBOek1O5cFu/ukLz7/ZJgNSm+OirebWpgaPS7slxfAr4EngGuX8jopqUBxGzyrAVuB54EXgc+lV4yLhO8cfn5E+ZqUD8kBu9sQvv0Hzj4rmoEBaAAVBWAAlBVAApAVQEoAFUFoABUFYACUFUACkC1CfofXVRJocowZVYAAAAASUVORK5CYII=);
+  background-size: contain;
+  position: absolute;
+  content: "";
+  opacity: .7;
+  margin-top: -19px;
+  margin-left: -64px;
+  -webkit-transition: .2s opacity ease-in-out;
+     -moz-transition: .2s opacity ease-in-out;
+       -o-transition: .2s opacity ease-in-out;
+  transition: .2s opacity ease-in-out;
+}
+
+.landing-video-link:hover {
+  color: hsla(0, 0%, 100%, 1);
+}
+
+.landing-video-link:hover:before {
+  opacity: 1;
+}
+
+.landing-social-image {
+  float: left;
+  margin-right: 14px;
+  height: 64px;
+  width: 64px;
+}
+
+.landing-social-copy {
+  padding-left: 78px;
+}
+
+.landing-scroll-down-affordance {
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  text-align: center;
+  z-index: 10;
+}
+
+.landing-down-arrow {
+  padding: 24px;
+  display: inline-block;
+  opacity: .5;
+  -webkit-transition: .2s opacity ease-in-out;
+     -moz-transition: .2s opacity ease-in-out;
+       -o-transition: .2s opacity ease-in-out;
+  transition: .2s opacity ease-in-out;
+
+  -webkit-animation-name: pulse-opacity;
+  -webkit-animation-duration: 4s;
+}
+
+.landing-down-arrow:hover {
+  opacity: 1;
+}
+
+.landing-down-arrow img {
+  height: 28px;
+  width: 28px;
+  margin: 0 auto;
+  display: block;
+}
+
+.landing-divider {
+  display: inline-block;
+  height: 2px;
+  background-color: white;
+  position: relative;
+  margin: 10px 0;
+}
+
+/* 3 CLOLUMN LAYOUT */
+
+.landing-breakout {
+  margin-top: 40px;
+  margin-bottom: 40px;
+}
+
+.landing-breakout img {
+  margin-bottom: 20px;
+}
+
+.landing-partners img {
+  margin-bottom: 20px;
+}
+
+.landing-breakout p {
+  padding: 0 23px;
+}
+
+.landing-breakout.landing-partners img {
+  margin-bottom: 20px;
+}
+
+.col-3-wide {
+  display: inline;
+  float: left;
+  margin-left: 10px;
+  margin-right: 10px;
+}
+
+.col-3-wide {
+  width: 302px;
+}
+
+/**
+ * ANIMATION
+ */
+
+@-webkit-keyframes pulse-opacity {
+  0% {
+    opacity: .5;
+  }
+  20% {
+    opacity: .5;
+  }
+  40% {
+    opacity: 1;
+  }
+  60% {
+    opacity: .5;
+  }
+  80% {
+    opacity: 1;
+  }
+  100% {
+    opacity: .5;
+  }
+}
+
+
+
+/**
+ * VIDEO
+ */
+
+#video-container {
+  display:none;
+  position:fixed;
+  top:0;
+  left:-10px;
+  width:102%;
+  height:100%;
+  background-color:rgba(0,0,0,0.7);
+  z-index:99;
+}
+
+#video-frame {
+  width:940px;
+  height:526.4px;
+  margin:80px auto 0;
+  display:none;
+}
+
+.video-close {
+cursor: pointer;
+position: relative;
+left: 940px;
+top: 0;
+pointer-events: all;
+}
+
+#icon-video-close {
+background-image: url("../images/close.png");
+background-position: 0 0;
+height: 36px;
+width: 36px;
+display:block;
+}
+
+
+
+
+/******************
+Styles for d.a.c/index:
+*******************/
+
+
+
+/* Generic full screen carousel styling to be used across pages. */
+.fullscreen-carousel {
+  margin: 0 -10px;
+  width: 100%;
+  overflow: hidden;
+  position: relative;
+}
+
+.fullscreen-carousel-content {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  display: table; /* For vertical centering */
+}
+
+.fullscreen-carousel .vcenter {
+  display: table-cell;
+  vertical-align: middle;
+  position: relative;
+}
+
+.fullscreen-carousel .vcenter > div {
+  margin: 10px auto;
+}
+
+/* Styles for the full-bleed hero image type. */
+.fullscreen-carousel .hero, .fullscreen-carousel .hero h1 {
+  color: #fff;
+}
+
+.fullscreen-carousel .hero h1 {
+  font-weight: 300;
+  font-size: 60px;
+  line-height: 68px;
+  letter-spacing: -1px;
+  margin-top: 0;
+}
+
+.fullscreen-carousel .hero p {
+  font-weight: 300;
+  font-size: 18px;
+  line-height: 24px;
+  -webkit-font-smoothing: antialiased;
+}
+
+.fullscreen-carousel .hero .hero-bg {
+  background-size: cover;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0px;
+  top: 0px;
+}
+
+
+/* Full screen carousel styling for the resource flow layout type of content */
+.fullscreen-carousel .resource-flow-layout:after {
+  height: 0; /* Dont know why this is set at 10 in default.css */
+}
+
+.fullscreen-carousel .resource-flow-layout {
+  margin-bottom: 20px;
+}
+
+
+
+/* Generic Tab carousel styling to be used across multiple pages. */
+
+.tab-carousel .tab-nav {
+  list-style: none;
+  position: relative;
+  text-align: center;
+}
+
+.tab-carousel .tab-nav li {
+  display: inline-block;
+  font-size: 22px;
+  font-weight: 400;
+  line-height: 50px;
+  list-style: none;
+  margin: 0;
+  padding: 0 25px;
+  position: relative;
+}
+
+.tab-carousel .tab-nav li a,
+.tab-carousel .tab-nav li a:hover {
+  color: #333 !important;
+  padding: 10px 10px 13px 10px;
+  position: relative;
+  z-index: 1000;
+}
+
+.tab-carousel .tab-nav li:after {
+  background: #ddd;
+  bottom: 0;
+  content: '';
+  height: 4px;
+  left: 0;
+  position: absolute;
+  width: 100%;
+  z-index: 0;
+}
+
+.tab-carousel .tab-nav .highlight {
+  position: absolute;
+  height: 4px;
+  width: 100px;
+  bottom: 0;
+  background: #33b5e5;
+}
+
+.tab-carousel .tab-carousel-content {
+  position: relative;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.tab-carousel .tab-carousel-content [data-tab] {
+  display: inline-block;
+  white-space: normal;
+}
+
+
+
+/*
+  Resource styling for the tab carousel. The tab carousel contains either
+  a 3 column layout of resources or a single full-width resource. The
+  latter has the 18x12 class applied to it and can be styled differently
+  that way.
+*/
+
+.tab-carousel .resource .image {
+  width: 100%;
+  height: 250px;
+  background-repeat: no-repeat;
+  background-size: contain;
+  background-position: 50% 50%;
+}
+
+.tab-carousel .resource .info .title {
+  font-size: 18px;
+  line-height: 24px;
+}
+
+.tab-carousel .resource .info .summary,
+.tab-carousel .resource .info .cta {
+  line-height: 24px;
+  font-size: 16px;
+}
+
+.tab-carousel .resource-card-18x12 {
+  position: relative;
+  padding-left: 450px;
+  box-sizing: border-box;
+  display: table-cell;
+  vertical-align: middle;
+}
+
+.tab-carousel .resource-card-18x12 .image {
+  position: absolute;
+  width: 420px;
+  height: 100%;
+  left: 0;
+  top: 0;
+}
+
+.tab-carousel .resource-card-18x12 .info {
+  display: inline-block;
+}
+
+.tab-carousel .resource-card-18x12 .info .title {
+  margin-bottom: 26px;
+}
+
+
+
+
+
+/*
+   Styles for the entity link used in the actions bar and in the cta of
+   the resources that appear in the tab carousel.
+*/
+.actions-bar a:after,
+.resource .cta:after {
+  content: '›';
+  font-weight: 400;
+  font-size: 22px;
+  left: 5px;
+  line-height: 1;
+  position: relative;
+  top: 1px;
+  transition: left 190ms ease-out;
+}
+
+.actions-bar a:hover:after,
+.resource .cta:hover:after {
+  left: 10px;
+}
+
+
+
+
+/*
+  Styles for the actions bar.
+*/
+.actions-bar {
+  background: #9acd00;
+  margin: 0 -10px;
+  text-align: center;
+}
+
+.actions-bar .actions {
+  padding: 30px 0 30px;
+  text-align: justify;
+  font-size: 0.1px;
+  line-height: 0.1px;
+  margin: 0 10px 0 0;
+}
+
+.actions-bar .actions:after {
+  content: '';
+  width: 100%;
+  display: inline-block;
+}
+
+.actions-bar .actions > div {
+  display: inline-block;
+}
+
+.actions-bar a {
+  font-size: 21px;
+  line-height: 27px;
+  color: #fff;
+  font-weight: 300;
+  -webkit-font-smoothing: antialiased;
+}
+
+.actions-bar a:after {
+  top: 0px;
+  font-size: 22px;
+}
+
+.actions-bar a:hover {
+  color: #fff !important;
+}
+
+
+
+
+
+/*
+  Specific styles for new home page layout of the carousels.
+*/
+
+/* Big blue button */
+a.home-new-cta-btn,
+.home-new-carousel-1 .resource-card-18x6 .cta {
+  white-space: nowrap;
+  display: inline-block;
+  padding: 14px 32px;
+  font-size: 18px;
+  font-weight: 500;
+  line-height: 24px;
+  cursor: pointer;
+  background: #33b5e6;
+  border-radius: 4px;
+  margin-top: 20px;
+  color: #fff;
+  transition: 0.2s background-color ease-in-out;
+}
+
+.home-new-carousel-1 .resource-card-18x6 .cta:after {
+  display: none; /* Hide the entity for this button */
+}
+
+a.home-new-cta-btn:hover,
+.home-new-carousel-1 .resource-card-18x6 .cta:hover {
+  color: #fff !important;
+  background: #2d9fca;
+}
+
+.home-new-carousel-1 .resource-card-18x6 .cta {
+  position: absolute;
+  bottom: 20px;
+  left: 16px;
+}
+
+/* Fullscreen carousel. */
+.home-new-carousel-1 {
+  max-height: 700px; /* Set max height so doesn't get too long */
+  margin-top: 20px;
+}
+
+.home-new-carousel-1 .fullscreen-carousel-content {
+  min-height: 450px;  /* Set min height for all content */
+}
+
+.home-new-carousel-1 .hero {
+  background: #000;
+}
+
+.home-new-carousel-1 .hero-bg {
+  background-image: url(/home-new/images/hero.jpg);
+  background-position: right center;
+  opacity: 0.85;
+}
+
+/*
+  Styling for special top card of full screen layout resource layout.
+  We need to specifically style the 18x6 card to adjust its size and layout,
+  since it's not a standard card, not sure if this is unique to the home page
+  layout or should be namespaced within the fullscreen-carousel container.
+*/
+.home-new-carousel-1 .resource-flow-layout.col-16 .resource-card-18x6 {
+  height: 334px;
+}
+
+.home-new-carousel-1 .resource-card-18x6 .card-bg {
+  width: 636px;
+  height: 100%;
+}
+
+.home-new-carousel-1 .resource-card-18x6 .card-info {
+  right: 0px;
+  left: 636px;
+  height: 100%;
+  top: 0px;
+  padding: 15px 22px;
+}
+
+.home-new-carousel-1 .resource-card-18x6 .card-info .util {
+  display: none;
+}
+
+.home-new-carousel-1 .resource-card-18x6 .card-info .title {
+  font-size: 20px;
+  font-weight: 500;
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+
+.home-new-carousel-1 .resource-card-18x6 .card-info .text {
+  font-size: 15px;
+  line-height: 21px;
+}
+
+
+/* Tabbed carousel. */
+.home-new-carousel-2 {
+  margin: 35px auto 100px auto;
+}
+
+.home-new-carousel-2 h1 {
+  font-size: 47px;
+  font-weight: 100;
+  line-height: 54px;
+  text-align: center;
+}
diff --git a/docs/html/preview/images/auto-music.png b/docs/html/preview/images/auto-music.png
new file mode 100644
index 0000000..cb599d2
--- /dev/null
+++ b/docs/html/preview/images/auto-music.png
Binary files differ
diff --git a/docs/html/preview/images/auto-nav.png b/docs/html/preview/images/auto-nav.png
new file mode 100644
index 0000000..a874f61c
--- /dev/null
+++ b/docs/html/preview/images/auto-nav.png
Binary files differ
diff --git a/docs/html/preview/images/l-dev-prev.png b/docs/html/preview/images/l-dev-prev.png
new file mode 100644
index 0000000..eae6ede
--- /dev/null
+++ b/docs/html/preview/images/l-dev-prev.png
Binary files differ
diff --git a/docs/html/preview/images/tv-components.png b/docs/html/preview/images/tv-components.png
new file mode 100644
index 0000000..5984c64
--- /dev/null
+++ b/docs/html/preview/images/tv-components.png
Binary files differ
diff --git a/docs/html/preview/images/tv-recommendations.png b/docs/html/preview/images/tv-recommendations.png
new file mode 100644
index 0000000..e7aa01d
--- /dev/null
+++ b/docs/html/preview/images/tv-recommendations.png
Binary files differ
diff --git a/docs/html/preview/images/tv-search.png b/docs/html/preview/images/tv-search.png
new file mode 100644
index 0000000..92e1e5f
--- /dev/null
+++ b/docs/html/preview/images/tv-search.png
Binary files differ
diff --git a/docs/html/preview/images/wear-apps.png b/docs/html/preview/images/wear-apps.png
new file mode 100644
index 0000000..5d4b1c1
--- /dev/null
+++ b/docs/html/preview/images/wear-apps.png
Binary files differ
diff --git a/docs/html/preview/images/wear-data.png b/docs/html/preview/images/wear-data.png
new file mode 100644
index 0000000..dc798c5
--- /dev/null
+++ b/docs/html/preview/images/wear-data.png
Binary files differ
diff --git a/docs/html/preview/images/wear-voice.png b/docs/html/preview/images/wear-voice.png
new file mode 100644
index 0000000..e727ab5
--- /dev/null
+++ b/docs/html/preview/images/wear-voice.png
Binary files differ
diff --git a/docs/html/preview/index.html b/docs/html/preview/index.html
new file mode 100644
index 0000000..8d7e9ea
--- /dev/null
+++ b/docs/html/preview/index.html
@@ -0,0 +1,405 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+
+
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<meta name="viewport" content="width=970" />
+
+<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
+<title>Coming Soon | Android Developers</title>
+
+<!-- STYLESHEETS -->
+<link rel="stylesheet"
+href="//fonts.googleapis.com/css?family=Roboto+Condensed">
+<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:light,regular,medium,thin,italic,mediumitalic,bold"
+  title="roboto">
+<link href="default.css" rel="stylesheet" type="text/css">
+
+
+
+<!-- JAVASCRIPT -->
+<script src="//www.google.com/jsapi" type="text/javascript"></script>
+<script src="/assets/js/android_3p-bundle.js" type="text/javascript"></script>
+<script type="text/javascript">
+  var toRoot = "/";
+  var metaTags = [];
+  var devsite = false;
+</script>
+<script src="/assets/js/docs.js" type="text/javascript"></script>
+
+<script>
+  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+  ga('create', 'UA-5831155-1', 'android.com');
+  ga('create', 'UA-49880327-2', 'android.com', {'name': 'universal'});  // New tracker);
+  ga('send', 'pageview');
+  ga('universal.send', 'pageview'); // Send page view for new tracker.
+</script>
+
+</head>
+
+<body class="gc-documentation
+
+" itemscope itemtype="http://schema.org/Article">
+
+
+<a name="top"></a>
+<div id="body-content">
+<div class="fullpage" >
+<div id="jd-content">
+  <div class="jd-descr" itemprop="articleBody">
+    <style>
+.fullpage>#footer,
+#jd-content>.content-footer.wrap {
+  display:none;
+}
+</style>
+
+<style>
+#footer {
+    display: none;
+}
+.content-footer {
+  display: none;
+}
+.landing-section h2 {
+  font-size:50px;
+  text-align:center;
+  font-weight:100;
+}
+h1.landing-h1 {
+  margin:80px 0 60px;
+}
+</style>
+
+    <div class="landing-rest-of-page">
+          <h1 class="landing-h1">Coming June 26, 2014</h1>
+            <div class="landing-subhead" style="margin-bottom:160px">
+              We've just announced these new developer platforms!<br>
+              Visit <a href="http://developer.android.com">developer.android.com</a> tomorrow to get started.
+            </div>
+
+      <div class="landing-section landing-gray-background" style="padding-top:30px">
+        <div class="wrap">
+
+          <div class="landing-section-header" style="margin:0">
+            <h2 class="norule">Android L Developer Preview</h2>
+            <div class="landing-subhead">
+              Get an early look at the next platform release and get your apps ready for when
+              it officially launches.
+            </div>
+
+            <img src="/preview/images/l-dev-prev.png" style=" margin:0px 0 0 40px" width="860px"/>
+
+          </div>
+
+          <div class="landing-body">
+            <div class="landing-breakout cols" style="margin-top:0">
+              <div class="col-4">
+                <p>A New UI Design</p>
+                <p class="landing-small">
+                  Create a consistent experience across mobile and the web with
+                   <b>material design</b>, the new Google-wide standard.
+                </p>
+              </div>
+              <div class="col-4">
+                <p>A New Runtime</p>
+                <p class="landing-small">
+                  Test your apps and get them ready for <b>ART</b> (<b>A</b>ndroid <b>R</b>un<b>t</b>ime),
+                  the default runtime in the next release.
+                </p>
+              </div>
+              <div class="col-4">
+                <p style="width:230px">Enhanced Notifications</p>
+                <p class="landing-small">
+                   Get control over where notifications appear,
+                   how they look, and how they sync to non-handheld devices.
+                </p>
+              </div>
+              <div class="col-4">
+                <p>Increased Efficiency</p>
+                <p class="landing-small">
+                  <b>Project Volta</b> is our effort to make the platform energy efficient and
+                  to give you more control over resource usage.
+                </p>
+              </div>
+            </div>
+          </div>
+        </div> <!-- end .wrap -->
+      </div> <!-- end .landing-section -->
+
+
+
+<div class="landing-section">
+  <div class="wrap">
+    <div class="landing-section-header">
+      <h2 class="norule">Android Wear SDK</h2>
+      <div class="landing-subhead">
+       Android Wear extends the Android platform to a new generation of devices,
+with a user experience that's designed specifically for wearables.
+      </div>
+    </div>
+
+    <div class="landing-body">
+      <div class="landing-breakout cols">
+        <div class="col-4">
+          <img src="/preview/images/wear-data.png" alt="">
+          <p>Synced Notifications</p>
+          <p class="landing-small">
+            Notifications on handhelds can automatically sync to wearables, so design them
+            with both devices in mind.
+          </p>
+        </div>
+        <div class="col-4">
+          <img src="/preview/images/wear-apps.png" alt="">
+          <p>Wearable Apps</p>
+          <p class="landing-small">
+            Create custom experiences with activities, services, sensors, and much
+            more with the Android SDK.
+          </p>
+        </div>
+        <div class="col-4">
+          <img src="/preview/images/wear-data.png" alt="">
+          <p>Send Data</p>
+          <p class="landing-small">
+            Send data and actions between handhelds and wearables with
+            data replication APIs and RPCs.
+          </p>
+        </div>
+        <div class="col-4">
+          <img src="/preview/images/wear-voice.png" alt="">
+          <p>Voice Actions</p>
+          <p class="landing-small">
+            Register your app to handle voice actions, like "Ok Google, take a&nbsp;note,"
+            for a hands-free experience.
+          </p>
+        </div>
+      </div>
+    </div>
+  </div> <!-- end .wrap -->
+</div>
+
+
+
+
+
+<div class="landing-section landing-gray-background">
+        <div class="wrap">
+          <div class="landing-section-header">
+            <h2 class="norule">Android TV Preview SDK</h2>
+            <div class="landing-subhead">
+              Design your app to shine on the biggest screen in the house.
+            </div>
+          </div>
+
+
+          <div class="landing-body">
+            <div class="landing-breakout cols">
+
+              <div class="col-3-wide">
+                <img src="/preview/images/tv-components.png" alt="TV layout components" style="margin-left: 23px;">
+
+                <p>Made for TV</p>
+                <p class="landing-small">
+                  Take advantage of pre-built fragments for browsing and interacting with media
+                  catalogs.
+                </p>
+              </div>
+
+              <div class="col-3-wide">
+                <img src="/preview/images/tv-search.png" alt="Search" style="margin-left: 23px;">
+
+                <p>Get Found</p>
+                <p class="landing-small">
+                  Help users find your content quickly with in-app searching.
+                </p>
+              </div>
+
+              <div class="col-3-wide">
+                <img src="/preview/images/tv-recommendations.png" alt="Recommendations" style="margin-left: 23px;">
+
+                <p>Recommend</p>
+                <p class="landing-small">
+                  Suggest content from your app to keep your users coming back.
+                </p>
+              </div>
+
+            </div>
+
+          </div>
+        </div>  <!-- end .wrap -->
+      </div>
+
+
+
+
+
+
+
+
+<div class="landing-section">
+  <div class="wrap">
+    <div class="landing-section-header">
+      <h2 class="norule">Android Auto SDK</h2>
+      <div class="landing-subhead">
+       Later this year, you'll be able to extend your apps to cars with the Auto SDK
+      </div>
+    </div>
+
+    <div class="landing-body">
+      <div class="landing-breakout cols">
+        <div class="col-8">
+          <img src="/preview/images/auto-nav.png" alt="">
+          <p style="padding:0">Build for One Platform</p>
+          <p style="padding:0" class="landing-small">
+            Write your apps without having to worry about vehicle-specific hardware differences like screen resolution, software interfaces, knobs, and touch controls. Your users get the same experience on any compatible vehicle such as a consistent app launcher and system events such as notifications.
+          </p>
+        </div>
+        <div class="col-8">
+          <img src="/preview/images/auto-music.png" alt="">
+          <p style="padding:0">Minimize Distraction</p>
+          <p style="padding:0" class="landing-small">
+            Android Auto defines the user interaction model for all apps and let you hook into a standard UI with touch and voice controls. The interface is designed to reduce driver distraction while still letting you customize and brand them to properly deliver your content.
+          </p>
+        </div>
+      </div>
+    </div>
+  </div> <!-- end .wrap -->
+</div>
+
+
+
+
+
+
+<div class="landing-section landing-gray-background">
+  <div class="wrap">
+    <div class="landing-section-header">
+      <h2 class="norule">Related Links</h2>
+      <div class="landing-subhead">
+       Learn more about these Android announcements
+      </div>
+    </div>
+
+    <div class="landing-body">
+            <div class="landing-breakout cols">
+              <div class="col-4">
+                <p><a href="http://www.android.com/wear/index.html">Android Wear</a></p>
+              </div>
+              <div class="col-4">
+                <p><a href="http://www.android.com/tv/index.html">Android TV</a></p>
+              </div>
+              <div class="col-4">
+                <p><a href="http://www.android.com/auto/index.html">Android Auto</a></p>
+              </div>
+              <div class="col-4">
+                <p><a href="http://android-developers.blogspot.com/">Developer Blog</a></p>
+              </div>
+            </div>
+
+    </div>
+
+  </div><!-- wrap -->
+</div><!-- landing section -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    <div class="content-footer wrap" itemscope="" itemtype="http://schema.org/SiteNavigationElement">
+      <div class="layout-content-col col-16" style="padding-top:4px">
+        <style>#___plusone_0 {float:right !important;}</style>
+        <div class="g-plusone" data-size="medium"></div>
+      </div>
+    </div>
+    <div id="footer" class="wrap" style="width:940px;position:relative;top:-35px;z-index:-1">
+      <div id="copyright">
+        Except as noted, this content is
+        licensed under <a href="http://creativecommons.org/licenses/by/2.5/">
+        Creative Commons Attribution 2.5</a>. For details and
+        restrictions, see the <a href="/license.html">Content
+        License</a>.
+      </div>
+    </div>
+  </div> <!-- end landing-body-content -->
+
+  <script>
+  $("a.landing-down-arrow").on("click", function(e) {
+    $("body").animate({
+      scrollTop: $(".preview-hero").height() + 76
+    }, 1000, "easeOutQuint");
+    e.preventDefault();
+  });
+  </script>
+    </div>
+
+      <div class="content-footer wrap"
+                    itemscope itemtype="http://schema.org/SiteNavigationElement">
+
+        <div class="paging-links layout-content-col col-10">
+
+        </div>
+        <div class="layout-content-col plus-container col-2" >
+          <style>#___plusone_0 {float:right !important;}</style>
+            <div class="g-plusone" data-size="medium"></div>
+
+        </div>
+
+      </div>
+
+
+
+
+  </div> <!-- end jd-content -->
+
+<div id="footer" class="wrap" style="width:940px">
+
+
+  <div id="copyright">
+
+  Except as noted, this content is
+  licensed under <a href="http://creativecommons.org/licenses/by/2.5/">
+  Creative Commons Attribution 2.5</a>. For details and
+  restrictions, see the <a href="/license.html">Content
+  License</a>.
+  </div>
+
+
+</div> <!-- end footer -->
+</div><!-- end doc-content -->
+
+</div> <!-- end body-content -->
+
+
+
+
+
+  <script src="https://developer.android.com/ytblogger_lists_unified.js" type="text/javascript"></script>
+  <script src="/jd_lists_unified.js" type="text/javascript"></script>
+  <script src="/jd_extras.js" type="text/javascript"></script>
+  <script src="/jd_collections.js" type="text/javascript"></script>
+  <script src="/jd_tag_helpers.js" type="text/javascript"></script>
+
+</body>
+</html>
diff --git a/docs/html/sdk/installing/studio.jd b/docs/html/sdk/installing/studio.jd
index 2ad5808..a6f1115 100644
--- a/docs/html/sdk/installing/studio.jd
+++ b/docs/html/sdk/installing/studio.jd
@@ -395,7 +395,9 @@
     <p class="note"><strong>Note:</strong> If you previously developed your Android project
     with Eclipse, you should first use the new export feature in the ADT plugin to prepare
     your project with the new Gradle build system. For more information, read
-    <a href="{@docRoot}sdk/installing/migrate.html">Migrating from Eclipse</a>.</p>
+    <a href="{@docRoot}sdk/installing/migrate.html">Migrating from Eclipse</a> and
+    <a href="{@docRoot}sdk/installing/studio-build.html">Building Your Project with
+    Gradle</a>.</p>
   </li>
 </ul>
 
diff --git a/docs/html/tools/sdk/tools-notes.jd b/docs/html/tools/sdk/tools-notes.jd
index 9b06a9d..f490053 100644
--- a/docs/html/tools/sdk/tools-notes.jd
+++ b/docs/html/tools/sdk/tools-notes.jd
@@ -28,6 +28,39 @@
 <div class="toggle-content opened">
   <p><a href="#" onclick="return toggleContent(this)">
     <img src="{@docRoot}assets/images/triangle-opened.png" class="toggle-content-img"
+      alt=""/>SDK Tools, Revision 22.6.4</a> <em>(June 2014)</em>
+  </p>
+
+  <div class="toggle-content-toggleme">
+
+    <dl>
+    <dt>Dependencies:</dt>
+
+    <dd>
+      <ul>
+        <li>Android SDK Platform-tools revision 18 or later.</li>
+        <li>If you are developing in Eclipse with ADT, note that this version of SDK Tools is
+          designed for use with ADT 22.6.3 and later. If you haven't already, update your
+        <a href="{@docRoot}tools/sdk/eclipse-adt.html">ADT Plugin</a> to 22.6.3.</li>
+        <li>If you are developing outside Eclipse, you must have
+          <a href="http://ant.apache.org/">Apache Ant</a> 1.8 or later.</li>
+      </ul>
+    </dd>
+
+    <dt>General Notes:</dt>
+    <dd>
+      <ul>
+        <li>Fixed an issue with the x86 emulator that caused Google Maps to crash.
+            (<a href="http://b.android.com/69385">Issue 69385</a>)</li>
+        <li>Fixed minor OpenGL issues.</li>
+      </ul>
+    </dd>
+  </div>
+</div>
+
+<div class="toggle-content closed">
+  <p><a href="#" onclick="return toggleContent(this)">
+    <img src="{@docRoot}assets/images/triangle-closed.png" class="toggle-content-img"
       alt=""/>SDK Tools, Revision 22.6.3</a> <em>(April 2014)</em>
   </p>
 
diff --git a/docs/html/training/contacts-provider/retrieve-names.jd b/docs/html/training/contacts-provider/retrieve-names.jd
index b034a6a..7106889a 100644
--- a/docs/html/training/contacts-provider/retrieve-names.jd
+++ b/docs/html/training/contacts-provider/retrieve-names.jd
@@ -102,9 +102,9 @@
 <p>
     To display the search results in a {@link android.widget.ListView}, you need a main layout file
     that defines the entire UI including the {@link android.widget.ListView}, and an item layout
-    file that defines one line of the {@link android.widget.ListView}. For example, you can define
-    the main layout file <code>res/layout/contacts_list_view.xml</code> that contains the
-    following XML:
+    file that defines one line of the {@link android.widget.ListView}. For example, you could create
+    the main layout file <code>res/layout/contacts_list_view.xml</code> with
+    the following XML:
 </p>
 <pre>
 &lt;?xml version="1.0" encoding="utf-8"?&gt;
@@ -250,7 +250,8 @@
     public View onCreateView(LayoutInflater inflater, ViewGroup container,
             Bundle savedInstanceState) {
         // Inflate the fragment layout
-        return inflater.inflate(R.layout.contacts_list_layout, container, false);
+        return inflater.inflate(R.layout.contact_list_fragment,
+            container, false);
     }
 </pre>
 <h3 id="DefineAdapter">Set up the CursorAdapter for the ListView</h3>
@@ -268,7 +269,8 @@
         super.onActivityCreated(savedInstanceState);
         ...
         // Gets the ListView from the View list of the parent activity
-        mContactsList = (ListView) getActivity().findViewById(R.layout.contact_list_view);
+        mContactsList =
+            (ListView) getActivity().findViewById(R.layout.contact_list_view);
         // Gets a CursorAdapter
         mCursorAdapter = new SimpleCursorAdapter(
                 getActivity(),