beam-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From k...@apache.org
Subject [beam-site] 01/03: New top menu plus side nav layout
Date Fri, 03 Nov 2017 19:04:26 GMT
This is an automated email from the ASF dual-hosted git repository.

kenn pushed a commit to branch asf-site
in repository https://gitbox.apache.org/repos/asf/beam-site.git

commit 7c82d515bf3fcb31538ab486392c711d5824f092
Author: davidpgoo <davidper@google.com>
AuthorDate: Wed Oct 11 10:46:47 2017 -0500

    New top menu plus side nav layout
---
 .../capability/2016/03/17/capability-matrix.html   | 117 +++++----------------
 .../2016/04/03/presentation-materials.html         | 117 +++++----------------
 .../sdk/2016/02/25/python-sdk-now-public.html      | 117 +++++----------------
 content/beam/release/2016/06/15/first-release.html | 117 +++++----------------
 .../2016/10/11/strata-hadoop-world-and-beam.html   | 117 +++++----------------
 .../update/website/2016/02/22/beam-has-a-logo.html | 117 +++++----------------
 .../blog/2016/05/18/splitAtFraction-method.html    | 117 +++++----------------
 .../05/27/where-is-my-pcollection-dot-map.html     | 117 +++++----------------
 .../2016/06/13/flink-batch-runner-milestone.html   | 117 +++++----------------
 content/blog/2016/08/03/six-months.html            | 117 +++++----------------
 content/blog/2016/10/20/test-stream.html           | 117 +++++----------------
 content/blog/2017/01/09/added-apex-runner.html     | 117 +++++----------------
 content/blog/2017/01/10/beam-graduates.html        | 117 +++++----------------
 .../blog/2017/02/01/graduation-media-recap.html    | 117 +++++----------------
 content/blog/2017/02/13/stateful-processing.html   | 117 +++++----------------
 content/blog/2017/03/16/python-sdk-release.html    | 117 +++++----------------
 .../blog/2017/05/17/beam-first-stable-release.html | 117 +++++----------------
 content/blog/2017/08/16/splittable-do-fn.html      | 117 +++++----------------
 content/blog/2017/08/28/timely-processing.html     | 117 +++++----------------
 src/_includes/head.html                            |   3 +
 src/_includes/header.html                          | 114 +++++---------------
 src/_includes/page-toc.html                        |  76 +++++++++++++
 src/_includes/section-menu/contribute.html         |  33 ++++++
 src/_includes/section-menu/documentation.html      |  95 +++++++++++++++++
 src/_includes/section-menu/get-started.html        |  20 ++++
 src/_includes/section-menu/runners.html            |   8 ++
 src/_includes/section-menu/sdks.html               |  18 ++++
 src/_layouts/section.html                          |  26 +++++
 src/_sass/_global.sass                             |  25 ++++-
 src/_sass/_navbar.sass                             |  59 ++++++++++-
 src/_sass/_page-nav.sass                           |  36 +++++++
 src/_sass/_section-nav.sass                        |  73 +++++++++++++
 src/_sass/_syntax-highlighting.scss                |  17 +++
 src/_sass/_vars.sass                               |   3 +
 src/contribute/contribution-guide.md               |   3 +-
 src/contribute/design-principles.md                |   8 +-
 src/contribute/docker-images.md                    |  15 +--
 src/contribute/index.md                            |   3 +-
 src/contribute/logos.md                            |   3 +-
 src/contribute/maturity-model.md                   |  71 +++++++------
 src/contribute/presentation-materials.md           |   3 +-
 src/contribute/ptransform-style-guide.md           |   6 +-
 src/contribute/release-guide.md                    |   5 +-
 src/contribute/runner-guide.md                     |  60 +++++------
 src/contribute/source-repository.md                |   3 +-
 src/contribute/team.md                             |   3 +-
 src/contribute/testing.md                          |  97 ++++++++---------
 src/contribute/work-in-progress.md                 |   4 +-
 src/css/site.scss                                  |   2 +
 src/documentation/dsls/sql.md                      |  62 ++++++-----
 src/documentation/execution-model.md               |   4 +-
 src/documentation/index.md                         |   3 +-
 src/documentation/io/authoring-java.md             |   3 +-
 src/documentation/io/authoring-overview.md         |   3 +-
 src/documentation/io/authoring-python.md           |   3 +-
 src/documentation/io/built-in-hadoop.md            |  13 +--
 src/documentation/io/built-in.md                   |   3 +-
 src/documentation/io/contributing.md               |   3 +-
 src/documentation/io/io-toc.md                     |   3 +-
 src/documentation/io/testing.md                    |   7 +-
 .../pipelines/create-your-pipeline.md              |   3 +-
 .../pipelines/design-your-pipeline.md              |   3 +-
 src/documentation/pipelines/test-your-pipeline.md  |   9 +-
 src/documentation/programming-guide.md             |   3 +-
 src/documentation/resources.md                     |  25 ++---
 src/documentation/runners/apex.md                  |   4 +-
 src/documentation/runners/capability-matrix.md     |   3 +-
 src/documentation/runners/dataflow.md              |   4 +-
 src/documentation/runners/direct.md                |   4 +-
 src/documentation/runners/flink.md                 |   4 +-
 src/documentation/runners/gearpump.md              |   8 +-
 src/documentation/runners/jstorm.md                |   3 +-
 src/documentation/runners/mapreduce.md             |   3 +-
 src/documentation/runners/spark.md                 |   5 +-
 src/documentation/sdks/feature-comparison.md       |   7 ++
 src/documentation/sdks/java-extensions.md          |   7 +-
 src/documentation/sdks/java.md                     |   5 +-
 src/documentation/sdks/javadoc/current.md          |   4 +-
 src/documentation/sdks/javadoc/index.md            |   4 +-
 src/documentation/sdks/nexmark.md                  |   4 +-
 src/documentation/sdks/pydoc/current.md            |   3 +-
 src/documentation/sdks/pydoc/index.md              |   3 +-
 src/documentation/sdks/python-custom-io.md         |  16 +--
 .../sdks/python-pipeline-dependencies.md           |  14 +--
 src/documentation/sdks/python-type-safety.md       |   4 +-
 src/documentation/sdks/python.md                   |   4 +-
 src/get-started/beam-overview.md                   |   5 +-
 src/get-started/downloads.md                       |   3 +-
 src/get-started/index.md                           |   3 +-
 src/get-started/mobile-gaming-example.md           |   3 +-
 src/get-started/quickstart-java.md                 |   4 +-
 src/get-started/quickstart-py.md                   |   4 +-
 src/get-started/support.md                         |   5 +-
 src/get-started/wordcount-example.md               |   4 +-
 src/js/fix-menu.js                                 |  64 +++++++++++
 src/js/language-switch.js                          |  13 +++
 src/js/page-nav.js                                 |  53 ++++++++++
 src/js/section-nav.js                              |  87 +++++++++++++++
 98 files changed, 1550 insertions(+), 2076 deletions(-)

diff --git a/content/beam/capability/2016/03/17/capability-matrix.html b/content/beam/capability/2016/03/17/capability-matrix.html
index d43be29..f461890 100644
--- a/content/beam/capability/2016/03/17/capability-matrix.html
+++ b/content/beam/capability/2016/03/17/capability-matrix.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/beam/capability/2016/03/17/capability-matrix.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/beam/capability/2016/04/03/presentation-materials.html b/content/beam/capability/2016/04/03/presentation-materials.html
index b4ac7e5..0de7b3b 100644
--- a/content/beam/capability/2016/04/03/presentation-materials.html
+++ b/content/beam/capability/2016/04/03/presentation-materials.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/beam/capability/2016/04/03/presentation-materials.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/beam/python/sdk/2016/02/25/python-sdk-now-public.html b/content/beam/python/sdk/2016/02/25/python-sdk-now-public.html
index 7e4def6..fd3cdc4 100644
--- a/content/beam/python/sdk/2016/02/25/python-sdk-now-public.html
+++ b/content/beam/python/sdk/2016/02/25/python-sdk-now-public.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/beam/python/sdk/2016/02/25/python-sdk-now-public.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/beam/release/2016/06/15/first-release.html b/content/beam/release/2016/06/15/first-release.html
index ef9d5f0..b52b053 100644
--- a/content/beam/release/2016/06/15/first-release.html
+++ b/content/beam/release/2016/06/15/first-release.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/beam/release/2016/06/15/first-release.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/beam/update/2016/10/11/strata-hadoop-world-and-beam.html b/content/beam/update/2016/10/11/strata-hadoop-world-and-beam.html
index f2a9ad6..9c939a8 100644
--- a/content/beam/update/2016/10/11/strata-hadoop-world-and-beam.html
+++ b/content/beam/update/2016/10/11/strata-hadoop-world-and-beam.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/beam/update/2016/10/11/strata-hadoop-world-and-beam.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/beam/update/website/2016/02/22/beam-has-a-logo.html b/content/beam/update/website/2016/02/22/beam-has-a-logo.html
index 2434a66..f86b437 100644
--- a/content/beam/update/website/2016/02/22/beam-has-a-logo.html
+++ b/content/beam/update/website/2016/02/22/beam-has-a-logo.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/beam/update/website/2016/02/22/beam-has-a-logo.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2016/05/18/splitAtFraction-method.html b/content/blog/2016/05/18/splitAtFraction-method.html
index 8eb90e7..33c0628 100644
--- a/content/blog/2016/05/18/splitAtFraction-method.html
+++ b/content/blog/2016/05/18/splitAtFraction-method.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2016/05/18/splitAtFraction-method.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2016/05/27/where-is-my-pcollection-dot-map.html b/content/blog/2016/05/27/where-is-my-pcollection-dot-map.html
index 9ab05d0..06e6577 100644
--- a/content/blog/2016/05/27/where-is-my-pcollection-dot-map.html
+++ b/content/blog/2016/05/27/where-is-my-pcollection-dot-map.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2016/05/27/where-is-my-pcollection-dot-map.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2016/06/13/flink-batch-runner-milestone.html b/content/blog/2016/06/13/flink-batch-runner-milestone.html
index 4d8c8e3..4687164 100644
--- a/content/blog/2016/06/13/flink-batch-runner-milestone.html
+++ b/content/blog/2016/06/13/flink-batch-runner-milestone.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2016/06/13/flink-batch-runner-milestone.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2016/08/03/six-months.html b/content/blog/2016/08/03/six-months.html
index a32ed09..b349072 100644
--- a/content/blog/2016/08/03/six-months.html
+++ b/content/blog/2016/08/03/six-months.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2016/08/03/six-months.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2016/10/20/test-stream.html b/content/blog/2016/10/20/test-stream.html
index 8511e11..ad43e27 100644
--- a/content/blog/2016/10/20/test-stream.html
+++ b/content/blog/2016/10/20/test-stream.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2016/10/20/test-stream.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2017/01/09/added-apex-runner.html b/content/blog/2017/01/09/added-apex-runner.html
index 68359e4..77f4402 100644
--- a/content/blog/2017/01/09/added-apex-runner.html
+++ b/content/blog/2017/01/09/added-apex-runner.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2017/01/09/added-apex-runner.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2017/01/10/beam-graduates.html b/content/blog/2017/01/10/beam-graduates.html
index 16741b9..d752ba6 100644
--- a/content/blog/2017/01/10/beam-graduates.html
+++ b/content/blog/2017/01/10/beam-graduates.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2017/01/10/beam-graduates.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2017/02/01/graduation-media-recap.html b/content/blog/2017/02/01/graduation-media-recap.html
index 425ce18..2b69137 100644
--- a/content/blog/2017/02/01/graduation-media-recap.html
+++ b/content/blog/2017/02/01/graduation-media-recap.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2017/02/01/graduation-media-recap.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2017/02/13/stateful-processing.html b/content/blog/2017/02/13/stateful-processing.html
index c56a946..7d2643d 100644
--- a/content/blog/2017/02/13/stateful-processing.html
+++ b/content/blog/2017/02/13/stateful-processing.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2017/02/13/stateful-processing.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2017/03/16/python-sdk-release.html b/content/blog/2017/03/16/python-sdk-release.html
index 00cc655..db2bcc7 100644
--- a/content/blog/2017/03/16/python-sdk-release.html
+++ b/content/blog/2017/03/16/python-sdk-release.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2017/03/16/python-sdk-release.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2017/05/17/beam-first-stable-release.html b/content/blog/2017/05/17/beam-first-stable-release.html
index af8ea5e..2627a3d 100644
--- a/content/blog/2017/05/17/beam-first-stable-release.html
+++ b/content/blog/2017/05/17/beam-first-stable-release.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2017/05/17/beam-first-stable-release.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2017/08/16/splittable-do-fn.html b/content/blog/2017/08/16/splittable-do-fn.html
index 34dfba0..6459b1e 100644
--- a/content/blog/2017/08/16/splittable-do-fn.html
+++ b/content/blog/2017/08/16/splittable-do-fn.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2017/08/16/splittable-do-fn.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/content/blog/2017/08/28/timely-processing.html b/content/blog/2017/08/28/timely-processing.html
index cc30423..6fd341a 100644
--- a/content/blog/2017/08/28/timely-processing.html
+++ b/content/blog/2017/08/28/timely-processing.html
@@ -11,6 +11,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="/js/bootstrap.min.js"></script>
   <script src="/js/language-switch.js"></script>
+  <script src="/js/fix-menu.js"></script>
+  <script src="/js/section-nav.js"></script>
+  <script src="/js/page-nav.js"></script>
   <link rel="canonical" href="https://beam.apache.org/blog/2017/08/28/timely-processing.html" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="Apache Beam" href="https://beam.apache.org/feed.xml">
@@ -27,103 +30,37 @@
   <body class="body ">
     <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="/images/beam_logo_navbar.png">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="/get-started/downloads">Downloads</a></li>
-            <li><a href="/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="/documentation/sdks/javadoc/2.1.0/" target="_blank">Java SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="/documentation/sdks/pydoc/2.1.0/" target="_blank">Python SDK API Reference <img src="/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="/contribute/testing/">Testing Guide</a></li>
-            <li><a href="/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="/contribute/">Contribute</a>
         </li>
-
         <li><a href="/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -139,7 +76,7 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
 
     <div class="body__contained">
diff --git a/src/_includes/head.html b/src/_includes/head.html
index 6d21742..a085e03 100644
--- a/src/_includes/head.html
+++ b/src/_includes/head.html
@@ -9,6 +9,9 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   <script src="{{ "/js/bootstrap.min.js" | prepend: site.baseurl }}"></script>
   <script src="{{ "/js/language-switch.js" | prepend: site.baseurl }}"></script>
+  <script src="{{ "/js/fix-menu.js" | prepend: site.baseurl }}"></script>
+  <script src="{{ "/js/section-nav.js" | prepend: site.baseurl }}"></script>
+  <script src="{{ "/js/page-nav.js" | prepend: site.baseurl }}"></script>
   <link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}" data-proofer-ignore>
   <link rel="shortcut icon" type="image/x-icon" href="{{ site.baseurl }}/images/favicon.ico">
   <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}">
diff --git a/src/_includes/header.html b/src/_includes/header.html
index 1981fb1..d74c28f 100644
--- a/src/_includes/header.html
+++ b/src/_includes/header.html
@@ -1,102 +1,36 @@
 <nav class="header navbar navbar-fixed-top">
     <div class="navbar-header">
+      <button type="button" class="navbar-toggle" aria-expanded="false" aria-controls="navbar">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+
       <a href="{{ site.baseurl }}/" class="navbar-brand" >
         <img alt="Brand" style="height: 25px" src="{{ "/images/beam_logo_navbar.png" | prepend: site.baseurl }}">
       </a>
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
     </div>
-    <div id="navbar" class="navbar-collapse collapse">
+
+    <div class="navbar-mask closed"></div>
+
+    <div id="navbar" class="navbar-container closed">
       <ul class="nav navbar-nav">
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Get Started <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="{{ site.baseurl }}/get-started/beam-overview/">Beam Overview</a></li>
-            <li><a href="{{ site.baseurl }}/get-started/quickstart-java/">Quickstart - Java</a></li>
-            <li><a href="{{ site.baseurl }}/get-started/quickstart-py/">Quickstart - Python</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Example Walkthroughs</li>
-            <li><a href="{{ site.baseurl }}/get-started/wordcount-example/">WordCount</a></li>
-            <li><a href="{{ site.baseurl }}/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Resources</li>
-            <li><a href="{{ site.baseurl }}/get-started/downloads">Downloads</a></li>
-            <li><a href="{{ site.baseurl }}/get-started/support">Support</a></li>
-          </ul>
+        <li>
+          <a href="{{ site.baseurl }}/get-started/beam-overview/">Get Started</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documentation <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="{{ site.baseurl }}/documentation">Using the Documentation</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Beam Concepts</li>
-            <li><a href="{{ site.baseurl }}/documentation/programming-guide/">Programming Guide</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/execution-model/">Execution Model</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/resources/">Additional Resources</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Pipeline Fundamentals</li>
-            <li><a href="{{ site.baseurl }}/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/io/io-toc/">Pipeline I/O</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">SDKs</li>
-            <li><a href="{{ site.baseurl }}/documentation/sdks/java/">Java SDK</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/sdks/javadoc/{{ site.release_latest }}/" target="_blank">Java SDK API Reference <img src="{{ site.baseurl }}/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li><a href="{{ site.baseurl }}/documentation/sdks/python/">Python SDK</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/sdks/pydoc/{{ site.release_latest }}/" target="_blank">Python SDK API Reference <img src="{{ site.baseurl }}/images/external-link-icon.png"
-                                                                                                                                               width="14" height="14"
-                                                                                                                                                          alt="External link."></a>
-            </li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Runners</li>
-            <li><a href="{{ site.baseurl }}/documentation/runners/capability-matrix/">Capability Matrix</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/runners/direct/">Direct Runner</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/runners/apex/">Apache Apex Runner</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/runners/flink/">Apache Flink Runner</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/runners/gearpump/">Apache Gearpump Runner</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/runners/spark/">Apache Spark Runner</a></li>
-            <li><a href="{{ site.baseurl }}/documentation/runners/dataflow/">Cloud Dataflow Runner</a></li>
-
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">DSLs</li>
-            <li><a href="{{ site.baseurl }}/documentation/dsls/sql/">SQL</a></li>
-          </ul>
+        <li>
+          <a href="{{ site.baseurl }}/documentation/">Documentation</a>
         </li>
-        <li class="dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contribute <span class="caret"></span></a>
-          <ul class="dropdown-menu">
-            <li><a href="{{ site.baseurl }}/contribute">Get Started Contributing</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Guides</li>
-            <li><a href="{{ site.baseurl }}/contribute/contribution-guide/">Contribution Guide</a></li>
-            <li><a href="{{ site.baseurl }}/contribute/testing/">Testing Guide</a></li>
-            <li><a href="{{ site.baseurl }}/contribute/release-guide/">Release Guide</a></li>
-            <li><a href="{{ site.baseurl }}/contribute/ptransform-style-guide/">PTransform Style Guide</a></li>
-            <li><a href="{{ site.baseurl }}/contribute/runner-guide/">Runner Authoring Guide</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Technical References</li>
-            <li><a href="{{ site.baseurl }}/contribute/design-principles/">Design Principles</a></li>
-            <li><a href="{{ site.baseurl }}/contribute/work-in-progress/">Ongoing Projects</a></li>
-            <li><a href="{{ site.baseurl }}/contribute/source-repository/">Source Repository</a></li>
-            <li><a href="{{ site.baseurl }}/contribute/docker-images/">Docker Images</a></li>
-            <li role="separator" class="divider"></li>
-            <li class="dropdown-header">Promotion</li>
-            <li><a href="{{ site.baseurl }}/contribute/presentation-materials/">Presentation Materials</a></li>
-            <li><a href="{{ site.baseurl }}/contribute/logos/">Logos and Design</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="{{ site.baseurl }}/contribute/maturity-model/">Maturity Model</a></li>
-            <li><a href="{{ site.baseurl }}/contribute/team/">Team</a></li>
-          </ul>
+        <li>
+          <a href="{{ site.baseurl }}/documentation/sdks/java/">SDKS</a>
+        </li>
+        <li>
+          <a href="{{ site.baseurl }}/documentation/runners/capability-matrix/">RUNNERS</a>
+        </li>
+        <li>
+          <a href="{{ site.baseurl }}/contribute/">Contribute</a>
         </li>
-
         <li><a href="{{ site.baseurl }}/blog">Blog</a></li>
       </ul>
       <ul class="nav navbar-nav navbar-right">
@@ -112,5 +46,5 @@
           </ul>
         </li>
       </ul>
-    </div><!--/.nav-collapse -->
+    </div>
 </nav>
diff --git a/src/_includes/page-toc.html b/src/_includes/page-toc.html
new file mode 100644
index 0000000..a9c82cb
--- /dev/null
+++ b/src/_includes/page-toc.html
@@ -0,0 +1,76 @@
+{% comment %}
+  Taken from https://github.com/allejo/jekyll-toc
+{% endcomment %}
+{% capture tocWorkspace %}
+    {% comment %}
+        "...like all things liquid - where there's a will, and ~36 hours to spare, there's usually a/some way" ~jaybe
+
+        Usage:
+            {% include toc.html html=content sanitize=true class="inline_toc" id="my_toc" h_min=2 h_max=3 %}
+
+        Parameters:
+            * html     (string) - the HTML of compiled markdown generated by kramdown in Jekyll
+
+        Optional Parameters:
+            * sanitize (bool)   : false  - when set to true, the headers will be stripped of any HTML in the TOC
+            * class    (string) :   ''   - a CSS class assigned to the TOC
+            * id       (string) :   ''   - an ID to assigned to the TOC
+            * h_min    (int)    :   1    - the minimum TOC header level to use; any header lower than this value will be ignored
+            * h_max    (int)    :   6    - the maximum TOC header level to use; any header greater than this value will be ignored
+
+        Output:
+            An unordered list representing the table of contents of a markdown block. This snippet will only generate the table of contents and will NOT output the markdown given to it
+    {% endcomment %}
+
+    {% capture my_toc %}{% endcapture %}
+    {% assign minHeader = include.h_min | default: 1 %}
+    {% assign maxHeader = include.h_max | default: 6 %}
+    {% assign nodes = include.html | split: '<h' %}
+    {% assign firstHeader = true %}
+
+    {% for node in nodes %}
+        {% if node == "" %}
+            {% continue %}
+        {% endif %}
+
+        {% assign headerLevel = node | replace: '"', '' | slice: 0, 1 | times: 1 %}
+
+        {% if headerLevel < minHeader or headerLevel > maxHeader %}
+            {% continue %}
+        {% endif %}
+
+        {% if firstHeader %}
+            {% assign firstHeader = false %}
+            {% assign minHeader = headerLevel %}
+        {% endif %}
+
+        {% assign indentAmount = headerLevel | minus: minHeader | add: 1 %}
+        {% assign _workspace = node | split: '</h' %}
+
+        {% assign _idWorkspace = _workspace[0] | split: '"' %}
+        {% assign html_id = _idWorkspace[1] %}
+
+        {% capture _hAttrToStrip %}{{ headerLevel }} id="{{ html_id }}">{% endcapture %}
+        {% assign header = _workspace[0] | replace: _hAttrToStrip, '' %}
+
+        {% assign space = '' %}
+        {% for i in (1..indentAmount) %}
+            {% assign space = space | prepend: '  ' %}
+        {% endfor %}
+
+        {% capture my_toc %}{{ my_toc }}
+{{ space }}- [{% if include.sanitize %}{{ header | strip_html }}{% else %}{{ header }}{% endif %}](#{{ html_id }}){% endcapture %}
+
+    {% endfor %}
+
+    {% if include.class %}
+        {% capture my_toc %}{:.{{ include.class }}}
+{{ my_toc | lstrip }}{% endcapture %}
+    {% endif %}
+
+    {% if include.id %}
+        {% capture my_toc %}{: #{{ include.id }}}
+{{ my_toc | lstrip }}{% endcapture %}
+    {% endif %}
+{% endcapture %}{% assign tocWorkspace = '' %}
+{{ my_toc | markdownify }}
diff --git a/src/_includes/section-menu/contribute.html b/src/_includes/section-menu/contribute.html
new file mode 100644
index 0000000..e42dbe8
--- /dev/null
+++ b/src/_includes/section-menu/contribute.html
@@ -0,0 +1,33 @@
+<li><span class="section-nav-list-main-title">Contribute</span></li>
+<li><a href="{{ site.baseurl }}/contribute">Get started contributing</a></li>
+<li>
+  <span class="section-nav-list-title">Guides</span>
+
+  <ul class="section-nav-list">
+    <li><a href="{{ site.baseurl }}/contribute/contribution-guide/">Contribution Guide</a></li>
+    <li><a href="{{ site.baseurl }}/contribute/testing/">Testing guide</a></li>
+    <li><a href="{{ site.baseurl }}/contribute/release-guide/">Release guide</a></li>
+    <li><a href="{{ site.baseurl }}/contribute/ptransform-style-guide/">PTransform style guide</a></li>
+    <li><a href="{{ site.baseurl }}/contribute/runner-guide/">Runner authoring guide</a></li>
+  </ul>
+</li>
+<li>
+  <span class="section-nav-list-title">Technical References</span>
+
+  <ul class="section-nav-list">
+    <li><a href="{{ site.baseurl }}/contribute/design-principles/">Design principles</a></li>
+    <li><a href="{{ site.baseurl }}/contribute/work-in-progress/">Ongoing projects</a></li>
+    <li><a href="{{ site.baseurl }}/contribute/source-repository/">Source repository</a></li>
+    <li><a href="{{ site.baseurl }}/contribute/docker-images/">Docker images</a></li>
+  </ul>
+</li>
+<li>
+  <span class="section-nav-list-title">Promotion</span>
+
+  <ul class="section-nav-list">
+    <li><a href="{{ site.baseurl }}/contribute/presentation-materials/">Presentation materials</a></li>
+    <li><a href="{{ site.baseurl }}/contribute/logos/">Logos and design</a></li>
+  </ul>
+</li>
+<li><a href="{{ site.baseurl }}/contribute/maturity-model/">Maturity Model</a></li>
+<li><a href="{{ site.baseurl }}/contribute/team/">Team</a></li>
diff --git a/src/_includes/section-menu/documentation.html b/src/_includes/section-menu/documentation.html
new file mode 100644
index 0000000..49cbf01
--- /dev/null
+++ b/src/_includes/section-menu/documentation.html
@@ -0,0 +1,95 @@
+<li><span class="section-nav-list-main-title">Documentation</span></li>
+<li><a href="{{ site.baseurl }}/documentation">Using the Documentation</a></li>
+<li><a href="{{ site.baseurl }}/documentation/execution-model">Beam Execution Model</a></li>
+<li>
+  <span class="section-nav-list-title">Pipeline development lifecycle</span>
+
+  <ul class="section-nav-list">
+    <li><a href="{{ site.baseurl }}/documentation/pipelines/design-your-pipeline/">Design Your Pipeline</a></li>
+    <li><a href="{{ site.baseurl }}/documentation/pipelines/create-your-pipeline/">Create Your Pipeline</a></li>
+    <li><a href="{{ site.baseurl }}/documentation/pipelines/test-your-pipeline/">Test Your Pipeline</a></li>
+  </ul>
+</li>
+<li>
+  <span class="section-nav-list-title">Beam programming guide</span>
+
+  <ul class="section-nav-list">
+    <li><a href="{{ site.baseurl }}/documentation/programming-guide/">Overview</a></li>
+    <li><a href="{{ site.baseurl }}/documentation/programming-guide/#creating-a-pipeline">Pipelines</a></li>
+    <li>
+      <span class="section-nav-list-title">PCollections</span>
+
+      <ul class="section-nav-list">
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#pcollections">Creating a PCollection</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#pcollection-characteristics">PCollection characteristics</a></li>
+      </ul>
+    </li>
+    <li>
+      <span class="section-nav-list-title">Transforms</span>
+
+      <ul class="section-nav-list">
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#applying-transforms">Applying transforms</a></li>
+        <li>
+          <span class="section-nav-list-title">Core Beam transforms</span>
+
+          <ul class="section-nav-list">
+            <li><a href="{{ site.baseurl }}/documentation/programming-guide/#pardo">ParDo</a></li>
+            <li><a href="{{ site.baseurl }}/documentation/programming-guide/#groupbykey">GroupByKey</a></li>
+            <li><a href="{{ site.baseurl }}/documentation/programming-guide/#cogroupbykey">CoGroupByKey</a></li>
+            <li><a href="{{ site.baseurl }}/documentation/programming-guide/#combine">Combine</a></li>
+            <li><a href="{{ site.baseurl }}/documentation/programming-guide/#flatten">Flatten</a></li>
+            <li><a href="{{ site.baseurl }}/documentation/programming-guide/#partition">Partition</a></li>
+          </ul>
+        </li>
+
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#requirements-for-writing-user-code-for-beam-transforms">Requirements for user code</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#side-inputs">Side inputs</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#additional-outputs">Additional outputs</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#composite-transforms">Composite transforms</a></li>
+      </ul>
+    </li>
+    <li>
+      <span class="section-nav-list-title">Pipeline I/O</span>
+
+      <ul class="section-nav-list">
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#pipeline-io">Using I/O transforms</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/io/built-in/">Built-in I/O transforms</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/io/authoring-overview/">Authoring new I/O transforms</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/io/testing/">Testing I/O transforms</a></li>
+      </ul>
+    </li>
+    <li>
+      <span class="section-nav-list-title">Data encoding and type safety</span>
+
+      <ul class="section-nav-list">
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#data-encoding-and-type-safety">Data encoding basics</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#specifying-coders">Specifying coders</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#default-coders-and-the-coderregistry">Default coders and the CoderRegistry</a></li>
+      </ul>
+    </li>
+    <li>
+      <span class="section-nav-list-title">Windowing</span>
+
+      <ul class="section-nav-list">
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#windowing">Windowing basics</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#provided-windowing-functions">Provided windowing functions</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#setting-your-pcollections-windowing-function">Setting your PCollection’s windowing function</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#watermarks-and-late-data">Watermarks and late data</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#adding-timestamps-to-a-pcollections-elements">Adding timestamps to a PCollection’s elements</a></li>
+      </ul>
+    </li>
+    <li>
+      <span class="section-nav-list-title">Triggers</span>
+
+      <ul class="section-nav-list">
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#triggers">Trigger basics</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#event-time-triggers">Event time triggers and the default trigger</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#processing-time-triggers">Processing time triggers</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#data-driven-triggers">Data-driven triggers</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#setting-a-trigger">Setting a trigger</a></li>
+        <li><a href="{{ site.baseurl }}/documentation/programming-guide/#composite-triggers">Composite triggers</a></li>
+      </ul>
+    </li>
+    <li><a href="{{ site.baseurl }}/documentation/resources/">Additional Resources</a></li>
+  </ul>
+</li>
diff --git a/src/_includes/section-menu/get-started.html b/src/_includes/section-menu/get-started.html
new file mode 100644
index 0000000..9abafe8
--- /dev/null
+++ b/src/_includes/section-menu/get-started.html
@@ -0,0 +1,20 @@
+<li><span class="section-nav-list-main-title">Get started</span></li>
+<li><a href="{{ site.baseurl }}/get-started/beam-overview/">Beam Overview</a></li>
+<li>
+  <span class="section-nav-list-title">Quickstarts</span>
+
+  <ul class="section-nav-list">
+    <li><a href="{{ site.baseurl }}/get-started/quickstart-java/">Quickstart - Java</a></li>
+    <li><a href="{{ site.baseurl }}/get-started/quickstart-py/">Quickstart - Python</a></li>
+  </ul>
+</li>
+<li>
+  <span class="section-nav-list-title">Example Walkthroughs</span>
+  <ul class="section-nav-list">
+     <li><a href="{{ site.baseurl }}/get-started/wordcount-example/">WordCount</a></li>
+     <li><a href="{{ site.baseurl }}/get-started/mobile-gaming-example/">Mobile Gaming</a></li>
+   </ul>
+</li>
+<li><a href="{{ site.baseurl }}/get-started/downloads">Downloads</a></li>
+<li><a href="{{ site.baseurl }}/get-started/support">Support</a></li>
+
diff --git a/src/_includes/section-menu/runners.html b/src/_includes/section-menu/runners.html
new file mode 100644
index 0000000..a05fcd9
--- /dev/null
+++ b/src/_includes/section-menu/runners.html
@@ -0,0 +1,8 @@
+<li><span class="section-nav-list-main-title">Runners</span></li>
+<li><a href="{{ site.baseurl }}/documentation/runners/capability-matrix/">Capability Matrix</a></li>
+<li><a href="{{ site.baseurl }}/documentation/runners/direct/">Direct Runner</a></li>
+<li><a href="{{ site.baseurl }}/documentation/runners/apex/">Apache Apex</a></li>
+<li><a href="{{ site.baseurl }}/documentation/runners/flink/">Apache Flink</a></li>
+<li><a href="{{ site.baseurl }}/documentation/runners/gearpump/">Apache Gearpump</a></li>
+<li><a href="{{ site.baseurl }}/documentation/runners/spark/">Apache Spark</a></li>
+<li><a href="{{ site.baseurl }}/documentation/runners/dataflow/">Google Cloud Dataflow</a></li>
diff --git a/src/_includes/section-menu/sdks.html b/src/_includes/section-menu/sdks.html
new file mode 100644
index 0000000..5237f79
--- /dev/null
+++ b/src/_includes/section-menu/sdks.html
@@ -0,0 +1,18 @@
+<li><span class="section-nav-list-main-title">SDKS</span></li>
+<li><a href="{{ site.baseurl }}/documentation/sdks/java/">Java SDK</a></li>
+<li><a href="{{ site.baseurl }}/documentation/sdks/javadoc/{{ site.release_latest }}/" target="_blank">Java SDK API Reference <img src="{{ site.baseurl }}/images/external-link-icon.png"
+                                                                                                                                   width="14" height="14"
+                                                                                                                                              alt="External link."></a>
+</li>
+<li><a href="{{ site.baseurl }}/documentation/sdks/python/">Python SDK</a></li>
+<li><a href="{{ site.baseurl }}/documentation/sdks/pydoc/{{ site.release_latest }}/" target="_blank">Python SDK API Reference <img src="{{ site.baseurl }}/images/external-link-icon.png"
+                                                                                                                                   width="14" height="14"
+                                                                                                                                              alt="External link."></a>
+</li>
+<li>
+  <span class="section-nav-list-title">DSLs</span>
+
+  <ul class="section-nav-list">
+    <li><a href="{{ site.baseurl }}/documentation/dsls/sql/">SQL</a></li>
+  </ul>
+</li>
diff --git a/src/_layouts/section.html b/src/_layouts/section.html
new file mode 100644
index 0000000..fdf28c7
--- /dev/null
+++ b/src/_layouts/section.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html lang="en">
+  {% include head.html %}
+  <body class="body" data-spy="scroll" data-target=".page-nav" data-offset="0">
+    {% include header.html %}
+    <div class="clearfix container-main-content">
+      <div class="section-nav closed" data-offset-top="90" data-offset-bottom="500">
+        <span class="section-nav-back glyphicon glyphicon-menu-left"></span>
+        <nav>
+          <ul class="section-nav-list" data-section-nav>
+            {% include {{ page.section_menu }} %}
+          </ul>
+        </nav>
+      </div>
+
+      <nav class="page-nav clearfix" data-offset-top="90" data-offset-bottom="500">
+        {% include page-toc.html html=content h_min=2 h_max=3 class="nav" %}
+      </nav>
+
+      <div class="body__contained body__section-nav">
+        {{ content }}
+      </div>
+    </div>
+    {% include footer.html %}
+  </body>
+</html>
diff --git a/src/_sass/_global.sass b/src/_sass/_global.sass
index ac8e34c..d77243d 100644
--- a/src/_sass/_global.sass
+++ b/src/_sass/_global.sass
@@ -14,7 +14,12 @@ body
 
   &:not(.body--index)
     .body__contained
-      +contained
+      padding: 0 30px
+      max-width: 1280px
+
+      figure
+        img
+          width: 100%
 
 .section
   &:not(.section--wide)
@@ -29,3 +34,21 @@ body
 
   a
     color: $color-brand
+
+.body__section-nav
+  margin-left: 256px
+  width: calc(100% - 492px)
+
+  > [id]:before
+    content: ''
+    display: block
+    height: 82px // fixed header height
+    margin: -82px 0 0 // negative fixed header height
+
+  @media (max-width: $ak-breakpoint-lg)
+    margin-left: 0
+    width: 100%
+
+.container-main-content
+  padding: 0 20px
+  position: relative
diff --git a/src/_sass/_navbar.sass b/src/_sass/_navbar.sass
index 4383de6..3bb5276 100644
--- a/src/_sass/_navbar.sass
+++ b/src/_sass/_navbar.sass
@@ -14,13 +14,64 @@
   .navbar-right
     margin-right: $pad
   a
-    color: #555
+    color: $color-dark-gray
     &:hover
       color: $color-brand
       span
         color: $color-brand
     span
-      color: #555
+      color: $color-dark-gray
 
-  .navbar-toggle .icon-bar
-    background-color: #555
+  .navbar-toggle
+    float: left
+
+    .icon-bar
+      background-color: $color-dark-gray
+
+    @media (max-width: $ak-breakpoint-lg)
+      display: block
+
+  .navbar-container
+    @media (max-width: $ak-breakpoint-lg)
+      background-color: $color-white
+      bottom: 0
+      min-height: 100vh
+      max-width: 256px
+      padding: 15px
+      position: fixed
+      top: 0
+      transition: transform 100ms linear
+      width: calc(100% - 32px)
+
+      .navbar-nav > li
+        width: 100%
+
+      &.closed
+        transform: translateX(-100%)
+
+      &.open
+        transform: translateX(0)
+
+  .navbar-mask
+    background: #212121
+    bottom: 0
+    display: none
+    min-height: 100vh
+    position: fixed
+    top: 0
+    transition: opacity 200ms
+
+    @media (max-width: $ak-breakpoint-lg)
+      display: block
+
+      &.closed
+        opacity: 0
+        width: 0
+
+      &.open
+        opacity: 0.5
+        width: 100%
+
+  @media (max-width: $ak-breakpoint-lg)
+    .navbar-right
+      margin-right: -15px
diff --git a/src/_sass/_page-nav.sass b/src/_sass/_page-nav.sass
new file mode 100644
index 0000000..19d3d49
--- /dev/null
+++ b/src/_sass/_page-nav.sass
@@ -0,0 +1,36 @@
+.page-nav
+  border-left: 3px solid $color-brand
+  overflow-y: auto
+  max-height: calc(100vh - 130px)
+  padding: 0 15px
+  position: fixed
+  width: 240px
+
+  li
+    display: block
+    width: 100%
+
+    a
+      color: $color-dark
+      display: block
+      font-size: 12px
+      padding: 5px
+
+    span
+      font-size: 12
+
+    ul
+      padding-left: 20px
+
+  .nav
+    > li.active
+      a
+        text-decoration: underline
+
+  @media (max-width: $ak-breakpoint-lg)
+    margin-top: 0
+    max-height: initial
+    right: 0
+    padding: 0 30px
+    position: relative
+    width: 100%
diff --git a/src/_sass/_section-nav.sass b/src/_sass/_section-nav.sass
new file mode 100644
index 0000000..38cf5b1
--- /dev/null
+++ b/src/_sass/_section-nav.sass
@@ -0,0 +1,73 @@
+.section-nav
+  max-width: 250px
+  position: fixed
+  width: 100%
+
+  nav
+    background-color: #F7F7F7
+    padding: 15px
+    max-height: calc(100vh - 130px)
+    overflow-y: auto
+
+    ul
+      list-style: none
+
+    li
+      margin-bottom: 5px
+
+      &:last-child
+        margin-bottom: 0
+
+    a
+      font-size: 12px
+
+    > .section-nav-list
+      padding: 0
+
+      .section-nav-list
+        padding-left: 15px
+
+    @media (max-width: $ak-breakpoint-lg)
+      background-color: $color-white
+      max-height: 100vh
+
+  &-back
+    display: none
+    padding: 15px
+
+    @media (max-width: $ak-breakpoint-lg)
+      display: block
+
+  &-list-title
+    display: block
+    font-size: 12px
+    margin-bottom: 5px
+    padding-top: 5px
+
+  &-list-main-title
+    display: block
+    font-size: 12px
+    font-weight: bold
+    margin-bottom: 15px
+    text-transform: uppercase
+
+  @media (max-width: $ak-breakpoint-lg)
+    background-color: $color-light-gray
+    bottom: 0
+    left: 0
+    max-width: 256px
+    position: fixed
+    top: 0
+    transition: transform 100ms linear
+    width: calc(100% - 32px)
+    z-index: 10000
+
+    nav
+      height: calc(100vh - 44px)
+      overflow-y: auto
+
+    &.closed
+      transform: translateX(-100%)
+
+    &.open
+      transform: translateX(0)
diff --git a/src/_sass/_syntax-highlighting.scss b/src/_sass/_syntax-highlighting.scss
index b5cd813..777b0b3 100644
--- a/src/_sass/_syntax-highlighting.scss
+++ b/src/_sass/_syntax-highlighting.scss
@@ -68,3 +68,20 @@
     .vi    { color: #008080 } // Name.Variable.Instance
     .il    { color: #099 } // Literal.Number.Integer.Long
 }
+
+.highlighter-custom {
+  border: 1px solid #ccc;
+  border-radius: 4px;
+
+  pre {
+    background: #eef;
+    border-radius: 0;
+    border: 0;
+    margin: 0;
+  }
+  p,
+  h2,
+  h3 {
+    margin: 10px;
+  }
+}
diff --git a/src/_sass/_vars.sass b/src/_sass/_vars.sass
index f0a7d65..76120dd 100644
--- a/src/_sass/_vars.sass
+++ b/src/_sass/_vars.sass
@@ -1,5 +1,8 @@
 $color-brand: #FF6D00
 $color-dark: #37424B
+$color-white: #FFF
+$color-light-gray: #F7F7F7
+$color-dark-gray: #555
 
 $pad-sm: 15px
 $pad: 30px
diff --git a/src/contribute/contribution-guide.md b/src/contribute/contribution-guide.md
index 4989596..53ce4ee 100644
--- a/src/contribute/contribution-guide.md
+++ b/src/contribute/contribution-guide.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Beam Contribution Guide"
 permalink: /contribute/contribution-guide/
+section_menu: section-menu/contribute.html
 redirect_from: /contribution-guide/
 ---
 
diff --git a/src/contribute/design-principles.md b/src/contribute/design-principles.md
index 87ddd24..9873237 100644
--- a/src/contribute/design-principles.md
+++ b/src/contribute/design-principles.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: 'Design Principles in Beam'
+section_menu: section-menu/contribute.html
 permalink: /contribute/design-principles/
 ---
 
@@ -14,7 +15,7 @@ Joshua Bloch’s [API Design Bumper Stickers](https://www.infoq.com/articles/API
 ## Use cases
 
 ### Unify the model
-Provide one model that works over both bounded (aka. batch) and unbounded (aka. streaming) datasets. Pay special attention to windows / triggers / state / timers, which often trip up folks used to a batch world.  Provide users with the right abstractions to adjust latency and completeness guarantees to cover both traditional batch and streaming use cases. 
+Provide one model that works over both bounded (aka. batch) and unbounded (aka. streaming) datasets. Pay special attention to windows / triggers / state / timers, which often trip up folks used to a batch world.  Provide users with the right abstractions to adjust latency and completeness guarantees to cover both traditional batch and streaming use cases.
 
 ### Separate data shapes and runtime requirements
 The model should focus on letting users describe their data and processing, without exposing any details of a specific runtime system. For example, bounded and unbounded describe the shape of data, but batch and streaming describe the behavior of specific runtime systems. Good test cases are to imagine a mythical micro-batching runner that sits somewhere between batch and streaming or a engine that dynamically switches between streaming and batch depending on the backlog.
@@ -31,7 +32,7 @@ Validate constraints on graph shape, runner requirements, etc as early in the co
 Backwards incompatible changes can only be made in the next major version. Because of the burden major versions place on users (code has to be modified, conflicting dependency nightmares, etc), we aim to do this infrequently. Clearly mark APIs that are considered experimental (may change at any point) and deprecated (will be removed in the next major version). Consider what APIs are more amenable to future changes (abstract classes vs. interfaces, etc.)
 
 ### Examples should be pedagogical
-Canonical examples help people ingrain the principles. Design examples that teach complex concepts in modular chunks. If you can’t explain the concept easily, then the API isn’t right. Examples should withstand random copy-pasting. 
+Canonical examples help people ingrain the principles. Design examples that teach complex concepts in modular chunks. If you can’t explain the concept easily, then the API isn’t right. Examples should withstand random copy-pasting.
 
 ## Extensibility
 
@@ -50,4 +51,3 @@ Many use cases or user communities can be served by provided ‘wrapper’ SDKs
 ### Design for the model, not specific runners
 
 The Beam APIs should serve all runners. Behind every runner-specific hook, there is a general principle in the model. Design APIs that generalize across multiple runners.
-
diff --git a/src/contribute/docker-images.md b/src/contribute/docker-images.md
index 0cb19da..23acf60 100644
--- a/src/contribute/docker-images.md
+++ b/src/contribute/docker-images.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: 'Beam Docker Images'
+section_menu: section-menu/contribute.html
 permalink: /contribute/docker-images/
 ---
 
@@ -12,19 +13,19 @@ Beam. You can use the docker images by using the provided [Docker scripts](https
 In this directory you will find scripts to build and run docker images for
 different purposes:
 
-- [file](#file): Create a Docker container from a Beam source code .zip file
+- [file](#file-based-image): Create a Docker container from a Beam source code .zip file
   in a given environment. It is useful to test a specific version of Beam,
   for example to validate a release vote.
 
-- [git](#git): Same as file but the Beam source code comes from the git repository,
+- [git](#git-based-image): Same as file but the Beam source code comes from the git repository,
   you can choose a given branch/tag/pull-request. Useful to test in a specific
   environment.
 
-- [release](#release): It builds an end-user distribution of the latest version of Beam
+- [release](#release-image): It builds an end-user distribution of the latest version of Beam
   and its dependencies. Useful for end-users who want to have a ready to use
   container with Beam (Python only for the moment).
 
-## <a name="file"></a>File based image
+## File based image
 
 If you want to build a container with a ready JDK 8 environment to test Beam:
 
@@ -151,7 +152,7 @@ enable the threading execution:
 mvn --threads 1C ...
 ```
 
-## <a name="git"></a>Git based image
+## Git based image
 
 It creates a docker container with a cloned version of the git repository, its
 branches and all the pull-requests. When it is run, it updates and checks out
@@ -171,7 +172,7 @@ docker build -t beam:git .
 docker run -e BRANCH=pr/ID -it beam:git /bin/bash
 ```
 
-## <a name="release"></a>Release image
+## Release image
 
 The release image is a container with the needed requirements to run Beam out of
 the box in a container, or to submit a pipeline to execute on Google Cloud
diff --git a/src/contribute/index.md b/src/contribute/index.md
index 1fa2326..f265910 100644
--- a/src/contribute/index.md
+++ b/src/contribute/index.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: 'Contribute to Beam'
+section_menu: section-menu/contribute.html
 redirect_from: '/docs/contribute'
 ---
 
diff --git a/src/contribute/logos.md b/src/contribute/logos.md
index 0aeccdd..c4a98c3 100644
--- a/src/contribute/logos.md
+++ b/src/contribute/logos.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Beam Logos"
+section_menu: section-menu/contribute.html
 permalink: /contribute/logos/
 redirect_from:
   - /project/logos/
diff --git a/src/contribute/maturity-model.md b/src/contribute/maturity-model.md
index 6a2d89f..f9225d5 100644
--- a/src/contribute/maturity-model.md
+++ b/src/contribute/maturity-model.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Maturity Model Assessment for Apache Beam"
+section_menu: section-menu/contribute.html
 permalink: /contribute/maturity-model/
 ---
 
@@ -680,7 +681,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] Scanning for projects...
 [INFO] ------------------------------------------------------------------------
 [INFO] Reactor Build Order:
-[INFO] 
+[INFO]
 [INFO] Apache Beam :: Parent
 [INFO] Apache Beam :: SDKs :: Java :: Build Tools
 [INFO] Apache Beam :: SDKs
@@ -717,35 +718,35 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Parent 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-parent ---
 [INFO] org.apache.beam:beam-parent:pom:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: Build Tools 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-build-tools ---
 [INFO] org.apache.beam:beam-sdks-java-build-tools:jar:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-parent ---
 [INFO] org.apache.beam:beam-sdks-parent:pom:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-parent ---
 [INFO] org.apache.beam:beam-sdks-java-parent:pom:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: Core 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-core ---
 [INFO] org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- io.grpc:grpc-auth:jar:1.0.1:compile
@@ -917,14 +918,14 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Runners 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-runners-parent ---
 [INFO] org.apache.beam:beam-runners-parent:pom:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Runners :: Core Java 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-runners-core-java ---
 [INFO] org.apache.beam:beam-runners-core-java:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -1118,7 +1119,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Runners :: Direct Java 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-runners-direct-java ---
 [INFO] org.apache.beam:beam-runners-direct-java:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -1340,7 +1341,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Runners :: Google Cloud Dataflow 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-runners-google-cloud-dataflow-java ---
 [INFO] org.apache.beam:beam-runners-google-cloud-dataflow-java:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -1562,14 +1563,14 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: IO 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-io-parent ---
 [INFO] org.apache.beam:beam-sdks-java-io-parent:pom:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: IO :: Google Cloud Platform 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-io-google-cloud-platform ---
 [INFO] org.apache.beam:beam-sdks-java-io-google-cloud-platform:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -1851,7 +1852,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: IO :: HDFS 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-io-hdfs ---
 [INFO] org.apache.beam:beam-sdks-java-io-hdfs:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -2244,7 +2245,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: IO :: JMS 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-io-jms ---
 [INFO] org.apache.beam:beam-sdks-java-io-jms:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -2428,7 +2429,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: IO :: Kafka 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-io-kafka ---
 [INFO] org.apache.beam:beam-sdks-java-io-kafka:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -2602,7 +2603,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: IO :: Kinesis 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-io-kinesis ---
 [INFO] org.apache.beam:beam-sdks-java-io-kinesis:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -2800,7 +2801,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: IO :: MongoDB 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-io-mongodb ---
 [INFO] org.apache.beam:beam-sdks-java-io-mongodb:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -2981,7 +2982,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: IO :: JDBC 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-io-jdbc ---
 [INFO] org.apache.beam:beam-sdks-java-io-jdbc:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -3157,14 +3158,14 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: Maven Archetypes 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-maven-archetypes-parent ---
 [INFO] org.apache.beam:beam-sdks-java-maven-archetypes-parent:pom:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: Maven Archetypes :: Starter 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-maven-archetypes-starter ---
 [INFO] org.apache.beam:beam-sdks-java-maven-archetypes-starter:maven-archetype:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:runtime
@@ -3311,7 +3312,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: Maven Archetypes :: Examples 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-maven-archetypes-examples ---
 [INFO] org.apache.beam:beam-sdks-java-maven-archetypes-examples:maven-archetype:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:runtime
@@ -3560,14 +3561,14 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: Extensions 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-extensions-parent ---
 [INFO] org.apache.beam:beam-sdks-java-extensions-parent:pom:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: Extensions :: Join library 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-extensions-join-library ---
 [INFO] org.apache.beam:beam-sdks-java-extensions-join-library:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -3731,7 +3732,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: Extensions :: Sorter 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-extensions-sorter ---
 [INFO] org.apache.beam:beam-sdks-java-extensions-sorter:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -4046,7 +4047,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: SDKs :: Java :: Java 8 Tests 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-sdks-java-java8tests ---
 [INFO] org.apache.beam:beam-sdks-java-java8tests:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:test
@@ -4211,14 +4212,14 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Runners :: Flink 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-runners-flink-parent ---
 [INFO] org.apache.beam:beam-runners-flink-parent:pom:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Runners :: Flink :: Core 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-runners-flink_2.10 ---
 [INFO] org.apache.beam:beam-runners-flink_2.10:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.flink:flink-streaming-java_2.10:jar:1.1.2:compile
@@ -4657,7 +4658,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Runners :: Flink :: Examples 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-runners-flink_2.10-examples ---
 [WARNING] The parameter output is deprecated. Use outputFile instead.
 [INFO] Wrote dependency tree to: /usr/local/google/home/davor/GitHub/incubator-beam/runners/flink/examples/wordcounts.txt
@@ -4665,7 +4666,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Runners :: Spark 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-runners-spark ---
 [INFO] org.apache.beam:beam-runners-spark:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.spark:spark-core_2.10:jar:1.6.2:provided
@@ -5249,7 +5250,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Runners :: Apex 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-runners-apex ---
 [INFO] org.apache.beam:beam-runners-apex:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.apex:apex-common:jar:3.5.0-SNAPSHOT:compile
@@ -5683,14 +5684,14 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Examples 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-examples-parent ---
 [INFO] org.apache.beam:beam-examples-parent:pom:0.4.0-incubating-SNAPSHOT
 [INFO]                                                                         
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Examples :: Java 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-examples-java ---
 [INFO] org.apache.beam:beam-examples-java:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -5925,7 +5926,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO] ------------------------------------------------------------------------
 [INFO] Building Apache Beam :: Examples :: Java 8 0.4.0-incubating-SNAPSHOT
 [INFO] ------------------------------------------------------------------------
-[INFO] 
+[INFO]
 [INFO] --- maven-dependency-plugin:2.10:tree (default-cli) @ beam-examples-java8 ---
 [INFO] org.apache.beam:beam-examples-java8:jar:0.4.0-incubating-SNAPSHOT
 [INFO] +- org.apache.beam:beam-sdks-java-core:jar:0.4.0-incubating-SNAPSHOT:compile
@@ -6619,7 +6620,7 @@ The following is a verbose dependency tree of the project. This complements the
 [INFO]    \- (org.spark-project.spark:unused:jar:1.0.0:runtime - omitted for duplicate)
 [INFO] ------------------------------------------------------------------------
 [INFO] Reactor Summary:
-[INFO] 
+[INFO]
 [INFO] Apache Beam :: Parent ............................. SUCCESS [0.821s]
 [INFO] Apache Beam :: SDKs :: Java :: Build Tools ........ SUCCESS [0.008s]
 [INFO] Apache Beam :: SDKs ............................... SUCCESS [0.007s]
diff --git a/src/contribute/presentation-materials.md b/src/contribute/presentation-materials.md
index 4295b58..93ce174 100644
--- a/src/contribute/presentation-materials.md
+++ b/src/contribute/presentation-materials.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Beam Presentation Materials"
+section_menu: section-menu/contribute.html
 permalink: /contribute/presentation-materials/
 redirect_from: /learn/presentation-materials/
 ---
diff --git a/src/contribute/ptransform-style-guide.md b/src/contribute/ptransform-style-guide.md
index 9f1130e..eccc54a 100644
--- a/src/contribute/ptransform-style-guide.md
+++ b/src/contribute/ptransform-style-guide.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "PTransform Style Guide"
+section_menu: section-menu/contribute.html
 permalink: /contribute/ptransform-style-guide/
 ---
 
@@ -345,7 +346,7 @@ public class Thumbs {
   public static Twiddle<T> twiddle() {
     return new AutoValue_Thumbs_Twiddle.Builder<T>().build();
   }
-  
+
   @AutoValue
   public abstract static class Twiddle<T>
        extends PTransform<PCollection<Foo>, PCollection<Bar<T>>> {
@@ -540,4 +541,3 @@ If the type of the collection involves generic type variables, the situation is
 * If it coincides with the transform's input type or is a simple wrapper over it, you can reuse the coder of the input `PCollection`, available via `input.getCoder()`.
 * Attempt to infer the coder via `input.getPipeline().getCoderRegistry().getCoder(TypeDescriptor)`. Use utilities in `TypeDescriptors` to obtain the `TypeDescriptor` for the generic type. For an example of this approach, see the implementation of `AvroIO.parseGenericRecords()`. However, coder inference for generic types is best-effort and in some cases it may fail due to Java type erasure.
 * Always make it possible for the user to explicitly specify a `Coder` for the relevant type variable(s) as a configuration parameter of your `PTransform`. (e.g. `AvroIO.<T>parseGenericRecords().withCoder(Coder<T>)`). Fall back to inference if the coder was not explicitly specified.
-
diff --git a/src/contribute/release-guide.md b/src/contribute/release-guide.md
index 9a7a969..bbf19df 100644
--- a/src/contribute/release-guide.md
+++ b/src/contribute/release-guide.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Beam Release Guide"
+section_menu: section-menu/contribute.html
 permalink: /contribute/release-guide/
 ---
 
@@ -377,7 +378,7 @@ Start the review-and-vote thread on the dev@ mailing list. Here’s an email tem
     * source code tag "v1.2.3-RC3" [5],
     * website pull request listing the release and publishing the API reference manual [6].
     * Java artifacts were built with Maven MAVEN_VERSION and OpenJDK/Oracle JDK JDK_VERSION.
-    * Python artifacts are deployed along with the source release to the dist.apache.org [2]. 
+    * Python artifacts are deployed along with the source release to the dist.apache.org [2].
 
     The vote will be open for at least 72 hours. It is adopted by majority approval, with at least 3 PMC affirmative votes.
 
diff --git a/src/contribute/runner-guide.md b/src/contribute/runner-guide.md
index b142f0c..0302cd1 100644
--- a/src/contribute/runner-guide.md
+++ b/src/contribute/runner-guide.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Runner Authoring Guide"
+section_menu: section-menu/contribute.html
 permalink: /contribute/runner-guide/
 ---
 
@@ -44,7 +45,7 @@ You need to know the core vocabulary:
  * _Runner_ - You are going to write a piece of software called a runner that
    takes a Beam pipeline and executes it using the capabilities of your data
    processing engine.
- 
+
 These concepts may be very similar to your processing engine's concepts. Since
 Beam's design is for cross-language operation and reusable libraries of
 transforms, there are some special features worth highlighting.
@@ -64,12 +65,12 @@ composite transform encapsulating a subgraph. The primitives are:
  * [_Read_](#implementing-the-read-primitive) - parallel connectors to external
    systems
  * [_ParDo_](#implementing-the-pardo-primitive) - per element processing
- * [_GroupByKey_](#implementing-the-groupbykey-and-window-primitive) - 
+ * [_GroupByKey_](#implementing-the-groupbykey-and-window-primitive) -
    aggregating elements per key and window
  * [_Flatten_](#implementing-the-flatten-primitive) - union of PCollections
  * [_Window_](#implementing-the-window-primitive) - set the windowing strategy
    for a PCollection
- 
+
 When implementing a runner, these are the operations you need to implement.
 Composite transforms may or may not be important to your runner. If you expose
 a UI, maintaining some of the composite structure will make the pipeline easier
@@ -253,7 +254,7 @@ Java-based.
 
 For correctness, a `DoFn` _should_ represent an element-wise function, but in
 fact is a long-lived object that processes elements in small groups called
-bundles. 
+bundles.
 
 Your runner decides how many elements, and which elements, to include in a
 bundle, and can even decide dynamically in the middle of processing that the
@@ -264,7 +265,7 @@ It will generally improve throughput to make the largest bundles possible, so
 that initialization and finalization costs are amortized over many elements.
 But if your data is arriving as a stream, then you will want to terminate a
 bundle in order to achieve appropriate latency, so bundles may be just a few
-elements. 
+elements.
 
 #### The DoFn Lifecycle
 
@@ -309,15 +310,15 @@ interface DoFnRunner<InputT, OutputT> {
 
 There are some implementations and variations of this for different scenarios:
 
- * [`SimpleDoFnRunner`](https://github.com/apache/beam/blob/master/runners/core-java/src/main/java/org/apache/beam/runners/core/SimpleDoFnRunner.java) - 
+ * [`SimpleDoFnRunner`](https://github.com/apache/beam/blob/master/runners/core-java/src/main/java/org/apache/beam/runners/core/SimpleDoFnRunner.java) -
    not actually simple at all; implements lots of the core functionality of
    `ParDo`. This is how most runners execute most `DoFns`.
- * [`LateDataDroppingDoFnRunner`](https://github.com/apache/beam/blob/master/runners/core-java/src/main/java/org/apache/beam/runners/core/LateDataDroppingDoFnRunner.java) - 
+ * [`LateDataDroppingDoFnRunner`](https://github.com/apache/beam/blob/master/runners/core-java/src/main/java/org/apache/beam/runners/core/LateDataDroppingDoFnRunner.java) -
    wraps a `DoFnRunner` and drops data from expired windows so the wrapped
    `DoFnRunner` doesn't get any unpleasant surprises
- * [`StatefulDoFnRunner`](https://github.com/apache/beam/blob/master/runners/core-java/src/main/java/org/apache/beam/runners/core/StatefulDoFnRunner.java) - 
+ * [`StatefulDoFnRunner`](https://github.com/apache/beam/blob/master/runners/core-java/src/main/java/org/apache/beam/runners/core/StatefulDoFnRunner.java) -
    handles collecting expired state
- * [`PushBackSideInputDoFnRunner`](https://github.com/apache/beam/blob/master/runners/core-java/src/main/java/org/apache/beam/runners/core/PushbackSideInputDoFnRunner.java) - 
+ * [`PushBackSideInputDoFnRunner`](https://github.com/apache/beam/blob/master/runners/core-java/src/main/java/org/apache/beam/runners/core/PushbackSideInputDoFnRunner.java) -
    buffers input while waiting for side inputs to be ready
 
 These are all used heavily in implementations of Java runners. Invocations
@@ -336,7 +337,7 @@ _Main design document:
 A side input is a global view of a window of a `PCollection`. This distinguishes
 it from the main input, which is processed one element at a time. The SDK/user
 prepares a `PCollection` adequately, the runner materializes it, and then the
-runner feeds it to the `DoFn`. See the 
+runner feeds it to the `DoFn`. See the
 
 What you will need to implement is to inspect the materialization requested for
 the side input, and prepare it appropriately, and corresponding interactions
@@ -456,7 +457,7 @@ _Main design document:
 
 A window is expired in a `PCollection`  if the watermark of the input PCollection
 has exceeded the end of the window by at least the input `PCollection`'s
-allowed lateness. 
+allowed lateness.
 
 Data for an expired window can be dropped any time and should be dropped at a
 `GroupByKey`. If you are using `GroupAlsoByWindow`, then just before executing
@@ -659,7 +660,7 @@ scan the dependencies of the SDK for tests with the JUnit category
           <beamTestPipelineOptions>
             [
               "--runner=MyRunner",
-              … misc test options … 
+              … misc test options …
             ]
           </beamTestPipelineOptions>
         </systemPropertyVariables>
@@ -696,7 +697,7 @@ public interface MyRunnerOptions extends PipelineOptions {
   @Required
   public Foo getMyRequiredFoo();
   public void setMyRequiredFoo(Foo newValue);
- 
+
   @Description("Enable Baz; on by default")
   @Default.Boolean(true)
   public Boolean isBazEnabled();
@@ -737,11 +738,11 @@ public static class MyRunnerRegistrar implements PipelineRunnerRegistrar {
   }
 }
 ```
- 
+
 ### Integrating with the Python SDK
 
 In the Python SDK the registration of the code is not automatic. So there are
-few things to keep in mind when creating a new runner. 
+few things to keep in mind when creating a new runner.
 
 Any dependencies on packages for the new runner should be options so create a
 new target in `extra_requires` in `setup.py` that is needed for the new runner.
@@ -785,7 +786,7 @@ interfaces for launching a pipeline and checking the status of a job. The RPC
 interfaces are still in development so for now we focus on the SDK-agnostic
 representation of a pipeline. By examining a pipeline only through Runner API
 interfaces, you remove your runner's dependence on the SDK for its language for
-pipeline analysis and job translation. 
+pipeline analysis and job translation.
 
 To execute such an SDK-independent pipeline, you will need to support the Fn
 API. UDFs are embedded in the pipeline as a specification of the function
@@ -813,8 +814,8 @@ The utilities are named consistently, like so:
 
  * `PTransformTranslation` - registry of known transforms and standard URNs
  * `ParDoTranslation` - utilities for working with `ParDo` in a
-   language-independent manner 
- * `WindowIntoTranslation` - same for `Window` 
+   language-independent manner
+ * `WindowIntoTranslation` - same for `Window`
  * `FlattenTranslation` - same for `Flatten`
  * `WindowingStrategyTranslation` - same for windowing strategies
  * `CoderTranslation` - same for coders
@@ -971,7 +972,7 @@ message CombinePayload {
   ...
 }
 ```
- 
+
 ### `PTransform` proto
 
 A `PTransform` is a function from `PCollection` to `PCollection`. This is
@@ -984,7 +985,7 @@ be passed back to an SDK harness; they do not represent a UDF.
 message PTransform {
   FunctionSpec spec;
   repeated string subtransforms;
- 
+
   // Maps from local string names to PCollection ids
   map<string, bytes> inputs;
   map<string, bytes> outputs;
@@ -1012,7 +1013,7 @@ message PCollection {
   string windowing_strategy_id;
   ...
 }
-``` 
+```
 
 ### `Coder` proto
 
@@ -1028,7 +1029,7 @@ message Coder {
   repeated string component_coder_ids;
 }
 ```
- 
+
 ## The Runner API RPCs
 
 While your language's SDK will probably insulate you from touching the Runner
@@ -1058,7 +1059,7 @@ message RunPipelineRequest {
   Struct pipeline_options;
 }
 ```
- 
+
 {:.no-toggle}
 ```proto
 message RunPipelineResponse {
@@ -1066,12 +1067,12 @@ message RunPipelineResponse {
 
   // TODO: protocol for rejecting pipelines that cannot be executed
   // by this runner. May just be REJECTED job state with error message.
- 
+
   // totally opaque to the SDK; for the shim to interpret
   Any contents;
 }
 ```
- 
+
 ### `PipelineResult` aka "Job API"
 
 The two core pieces of functionality in this API today are getting the state of
@@ -1086,19 +1087,18 @@ message CancelPipelineRequest {
   bytes pipeline_id;
   ...
 }
- 
+
 message GetStateRequest {
   bytes pipeline_id;
   ...
 }
- 
+
 message GetStateResponse {
   JobState state;
   ...
 }
- 
+
 enum JobState {
   ...
 }
 ```
- 
diff --git a/src/contribute/source-repository.md b/src/contribute/source-repository.md
index 7ddd241..6f62d21 100644
--- a/src/contribute/source-repository.md
+++ b/src/contribute/source-repository.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Beam Source Repository"
+section_menu: section-menu/contribute.html
 permalink: /contribute/source-repository/
 redirect_from: /source_repository/
 ---
diff --git a/src/contribute/team.md b/src/contribute/team.md
index 311a30a..9442d88 100644
--- a/src/contribute/team.md
+++ b/src/contribute/team.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Beam Team"
+section_menu: section-menu/contribute.html
 permalink: /contribute/team/
 redirect_from:
   - /project/team/
diff --git a/src/contribute/testing.md b/src/contribute/testing.md
index c6fd2a6..322591f 100644
--- a/src/contribute/testing.md
+++ b/src/contribute/testing.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: 'Beam Testing Guide'
+section_menu: section-menu/contribute.html
 permalink: /contribute/testing/
 ---
 
@@ -305,12 +306,12 @@ breakages. Beam Java unit tests are written in JUnit.
 #### How to run NeedsRunner tests
 
 NeedsRunner is a category of tests that require a Beam runner. A subset of these
-tests cannot be executed while building their corresponding modules because all 
-runners depend on these modules (e.g. `sdks/java/core`) to be built. To break 
-the circular dependency, these tests are executed after the Direct Runner is 
+tests cannot be executed while building their corresponding modules because all
+runners depend on these modules (e.g. `sdks/java/core`) to be built. To break
+the circular dependency, these tests are executed after the Direct Runner is
 built.
 
-To run this subset of the NeedsRunner tests (requires Maven 3.3.1+): 
+To run this subset of the NeedsRunner tests (requires Maven 3.3.1+):
 
 ```
 $ mvn -pl runners/direct-java -am install -DskipTests
@@ -326,7 +327,7 @@ $ mvn -pl runners/direct-java surefire:test@validates-runner-tests -Dtest=MapEle
 will run the `MapElementsTest.testMapBasic()` test.
 
 
-NeedsRunner tests in modules that are not required to build runners (e.g. 
+NeedsRunner tests in modules that are not required to build runners (e.g.
 `sdks/java/io/jdbc`) can be executed with the `mvn test` command:
 
 ```
@@ -398,30 +399,30 @@ verify that the simple pipelines they run end in the correct state.
 
 ### Effective use of the TestPipeline JUnit rule
 
-`TestPipeline` is JUnit rule designed to facilitate testing pipelines. 
-In combination with `PAssert`, the two can be used for testing and 
-writing assertions over pipelines. However, in order for these assertions 
-to be effective, the constructed pipeline **must** be run by a pipeline 
-runner. If the pipeline is not run (i.e., executed) then the 
-constructed `PAssert` statements will not be triggered, and will thus 
-be ineffective. 
+`TestPipeline` is JUnit rule designed to facilitate testing pipelines.
+In combination with `PAssert`, the two can be used for testing and
+writing assertions over pipelines. However, in order for these assertions
+to be effective, the constructed pipeline **must** be run by a pipeline
+runner. If the pipeline is not run (i.e., executed) then the
+constructed `PAssert` statements will not be triggered, and will thus
+be ineffective.
 
 To prevent such cases, `TestPipeline` has some protection mechanisms in place.
 
 __Abandoned node detection (performed automatically)__
 
-Abandoned nodes are `PTransforms`, `PAsserts` included, that were not 
-executed by the pipeline runner. Abandoned nodes are most likely to occur 
+Abandoned nodes are `PTransforms`, `PAsserts` included, that were not
+executed by the pipeline runner. Abandoned nodes are most likely to occur
 due to the one of the following scenarios:
- 1. Lack of a `pipeline.run()` statement at the end of a test. 
+ 1. Lack of a `pipeline.run()` statement at the end of a test.
  2. Addition of `PTransform`s  after the pipeline has already run.
 
-Abandoned node detection is *automatically enabled* when a real pipeline 
-runner (i.e. not a `CrashingRunner`) and/or a 
-`@NeedsRunner` / `@ValidatesRunner` annotation are detected. 
+Abandoned node detection is *automatically enabled* when a real pipeline
+runner (i.e. not a `CrashingRunner`) and/or a
+`@NeedsRunner` / `@ValidatesRunner` annotation are detected.
 
 Consider the following test:
-  
+
 ```java
 // Note the @Rule annotation here
 @Rule
@@ -431,7 +432,7 @@ public final transient TestPipeline pipeline = TestPipeline.create();
 @Category(NeedsRunner.class)
 public void myPipelineTest() throws Exception {
 
-final PCollection<String> pCollection = 
+final PCollection<String> pCollection =
   pipeline
     .apply("Create", Create.of(WORDS).withCoder(StringUtf8Coder.of()))
     .apply(
@@ -444,7 +445,7 @@ final PCollection<String> pCollection =
                 return WHATEVER;
               }
             }));
-            
+
 PAssert.that(pCollection).containsInAnyOrder(WHATEVER);       
 
 /* ERROR: pipeline.run() is missing, PAsserts are ineffective */
@@ -454,17 +455,17 @@ PAssert.that(pCollection).containsInAnyOrder(WHATEVER);
 ```py
 # Unsupported in Beam's Python SDK.
 ```
- 
-The `PAssert` at the end of this test method will not be executed, since 
-`pipeline` is never run, making this test ineffective. If this test method 
-is run using an actual pipeline runner, an exception will be thrown 
+
+The `PAssert` at the end of this test method will not be executed, since
+`pipeline` is never run, making this test ineffective. If this test method
+is run using an actual pipeline runner, an exception will be thrown
 indicating that there was no `run()` invocation in the test.
 
-Exceptions that are thrown prior to executing a pipeline, will fail 
+Exceptions that are thrown prior to executing a pipeline, will fail
 the test unless handled by an `ExpectedException` rule.
 
 Consider the following test:  
-  
+
 ```java
 // Note the @Rule annotation here
 @Rule
@@ -491,43 +492,43 @@ public void testReadingFailsTableDoesNotExist() throws Exception {
 ```py
 # Unsupported in Beam's Python SDK.
 ```  
-  
-The application of the `read` transform throws an exception, which is then 
-handled by the `thrown` `ExpectedException` rule. 
-In light of this exception, the fact this test has abandoned nodes 
-(the `read` transform) does not play a role since the test fails before 
-the pipeline would have been executed (had there been a `run()` statement). 
-   
+
+The application of the `read` transform throws an exception, which is then
+handled by the `thrown` `ExpectedException` rule.
+In light of this exception, the fact this test has abandoned nodes
+(the `read` transform) does not play a role since the test fails before
+the pipeline would have been executed (had there been a `run()` statement).
+
 __Auto-add `pipeline.run()` (disabled by default)__
 
-A `TestPipeline` instance can be configured to auto-add a missing `run()` 
-statement by setting `testPipeline.enableAutoRunIfMissing(true/false)`. 
-If this feature is enabled, no exception will be thrown in case of a 
+A `TestPipeline` instance can be configured to auto-add a missing `run()`
+statement by setting `testPipeline.enableAutoRunIfMissing(true/false)`.
+If this feature is enabled, no exception will be thrown in case of a
 missing `run()` statement, instead, one will be added automatically.
 
 
 ### API Surface testing
 
-The surface of an API is the set of public classes that are exposed to the 
-outer world. In order to keep the API tight and avoid unnecessarily exposing 
-classes, Beam provides the `ApiSurface` utility class. 
-Using the `ApiSurface` class,  we can assert the API surface against an 
+The surface of an API is the set of public classes that are exposed to the
+outer world. In order to keep the API tight and avoid unnecessarily exposing
+classes, Beam provides the `ApiSurface` utility class.
+Using the `ApiSurface` class,  we can assert the API surface against an
 expected set of classes.
 
 Consider the following snippet:
 ```java
 @Test
 public void testMyApiSurface() throws Exception {
-  
+
     final Package thisPackage = getClass().getPackage();
     final ClassLoader thisClassLoader = getClass().getClassLoader();
-    
+
     final ApiSurface apiSurface =
         ApiSurface.ofPackage(thisPackage, thisClassLoader)
             .pruningPattern("org[.]apache[.]beam[.].*Test.*")
             .pruningPattern("org[.]apache[.]beam[.].*IT")
             .pruningPattern("java[.]lang.*");
-    
+
     @SuppressWarnings("unchecked")
     final Set<Matcher<Class<?>>> allowed =
         ImmutableSet.of(
@@ -535,7 +536,7 @@ public void testMyApiSurface() throws Exception {
             classesInPackage("org.apache.beam.y"),
             classesInPackage("org.apache.beam.z"),
             Matchers.<Class<?>>equalTo(Other.class));
-    
+
     assertThat(apiSurface, containsOnlyClassesMatching(allowed));
 }
 ```
@@ -544,8 +545,8 @@ public void testMyApiSurface() throws Exception {
 # Unsupported in Beam's Python SDK.
 ```
 
-This test will fail if the classes exposed by `getClass().getPackage()`, except 
+This test will fail if the classes exposed by `getClass().getPackage()`, except
 classes which reside under `"org[.]apache[.]beam[.].*Test.*"`,  
 `"org[.]apache[.]beam[.].*IT"` or `"java[.]lang.*"`, belong to neither
-of the packages: `org.apache.beam.x`, `org.apache.beam.y`, `org.apache.beam.z`, 
+of the packages: `org.apache.beam.x`, `org.apache.beam.y`, `org.apache.beam.z`,
 nor equal to `Other.class`.
diff --git a/src/contribute/work-in-progress.md b/src/contribute/work-in-progress.md
index a2572af..4a10f5a 100644
--- a/src/contribute/work-in-progress.md
+++ b/src/contribute/work-in-progress.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: 'In Progress Work in Beam'
+section_menu: section-menu/contribute.html
 permalink: /contribute/work-in-progress/
 ---
 
@@ -30,4 +31,3 @@ Current branches include:
 | Tez Runner | [tez-runner](https://github.com/apache/beam/tree/tez-runner) | [runner-tez](https://issues.apache.org/jira/browse/BEAM/component/12333014) | [BEAM-2709](https://issues.apache.org/jira/browse/BEAM-2709) |
 | Beam SQL DSL | [DSL_SQL](https://github.com/apache/beam/tree/DSL_SQL) | [dsl-sql](https://issues.apache.org/jira/browse/BEAM/component/12332480) | [BEAM-301](https://issues.apache.org/jira/browse/BEAM-301) |
 {:.table}
-
diff --git a/src/css/site.scss b/src/css/site.scss
index cce10ac..ff2b08c 100644
--- a/src/css/site.scss
+++ b/src/css/site.scss
@@ -25,3 +25,5 @@
 @import "_hero.sass";
 @import "_logos.sass";
 @import "_pillars.sass";
+@import "_section-nav.sass";
+@import "_page-nav.sass";
diff --git a/src/documentation/dsls/sql.md b/src/documentation/dsls/sql.md
index 5c9308a..6fd26a0 100644
--- a/src/documentation/dsls/sql.md
+++ b/src/documentation/dsls/sql.md
@@ -1,22 +1,21 @@
 ---
-layout: default
-title: "DSLs: SQL"
+layout: section
+title: "Beam DSLs: SQL"
+section_menu: section-menu/sdks.html
 permalink: /documentation/dsls/sql/
 ---
 
-* [1. Overview](#overview)
-* [2. Usage of DSL APIs](#usage)
-* [3. Functionality in Beam SQL](#functionality)
-  * [3.1. Supported Features](#features)
-  * [3.2. Data Types](#data-type)
-  * [3.3. built-in SQL functions](#built-in-functions)
-* [4. The Internal of Beam SQL](#internal-of-sql)
+# Beam SQL
+
+* TOC
+{:toc}
 
 This page describes the implementation of Beam SQL, and how to simplify a Beam pipeline with DSL APIs.
 
-> Note, Beam SQL hasn't been merged to master branch yet(being developed with branch [DSL_SQL](https://github.com/apache/beam/tree/DSL_SQL)), but is coming soon.
+> Note: Beam SQL hasn't been merged to master branch yet (being developed with branch [DSL_SQL](https://github.com/apache/beam/tree/DSL_SQL)), but is coming soon.
+
+## 1. Overview {#overview}
 
-# <a name="overview"></a>1. Overview
 SQL is a well-adopted standard to process data with concise syntax. With DSL APIs (currently available only in Java), now `PCollection`s can be queried with standard SQL statements, like a regular table. The DSL APIs leverage [Apache Calcite](http://calcite.apache.org/) to parse and optimize SQL queries, then translate into a composite Beam `PTransform`. In this way, both SQL and normal Beam `PTransform`s can be mixed in the same pipeline.
 
 There are two main pieces to the SQL DSL API:
@@ -26,11 +25,11 @@ There are two main pieces to the SQL DSL API:
 
 We'll look at each of these below.
 
-# <a name="usage"></a>2. Usage of DSL APIs 
+## 2. Usage of DSL APIs {#usage}
 
-## BeamRecord
+### BeamRecord
 
-Before applying a SQL query to a `PCollection`, the data in the collection must be in `BeamRecord` format. A `BeamRecord` represents a single, immutable row in a Beam SQL `PCollection`. The names and types of the fields/columns in the record are defined by its associated [BeamRecordType]({{ site.baseurl }}/documentation/sdks/javadoc/{{ site.release_latest }}/index.html?org/apache/beam/sdk/values/BeamRecordType.html); for SQL queries, you should use the [BeamRecordSqlType]({{ site.baseurl [...]
+Before applying a SQL query to a `PCollection`, the data in the collection must be in `BeamRecord` format. A `BeamRecord` represents a single, immutable row in a Beam SQL `PCollection`. The names and types of the fields/columns in the record are defined by its associated [BeamRecordType]({{ site.baseurl }}/documentation/sdks/javadoc/{{ site.release_latest }}/index.html?org/apache/beam/sdk/values/BeamRecordType.html); for SQL queries, you should use the [BeamRecordSqlType]({{ site.baseurl [...]
 
 
 A `PCollection<BeamRecord>` can be created explicitly or implicitly:
@@ -81,11 +80,11 @@ Implicitly:
 
 Once you have a `PCollection<BeamRecord>` in hand, you may use the `BeamSql` APIs to apply SQL queries to it.
 
-## BeamSql
+### BeamSql
 
 `BeamSql` provides two methods for generating a `PTransform` from a SQL query, both of which are equivalent except for the number of inputs they support:
 
-* `BeamSql.query()`, which may be applied to a single `PCollection`. The input collection must be referenced via the table name `PCOLLECTION` in the query: 
+* `BeamSql.query()`, which may be applied to a single `PCollection`. The input collection must be referenced via the table name `PCOLLECTION` in the query:
   ```
   PCollection<BeamRecord> filteredNames = testApps.apply(
       BeamSql.query("SELECT appId, description, rowtime FROM PCOLLECTION WHERE id=1"));
@@ -107,11 +106,11 @@ Once you have a `PCollection<BeamRecord>` in hand, you may use the `BeamSql` API
                           FROM Apps INNER JOIN Reviews ON Apps.appId == Reviews.appId"));
   ```
 
-Both methods wrap the back-end details of parsing/validation/assembling, and deliver a Beam SDK style API that can express simple TABLE_FILTER queries up to complex queries containing JOIN/GROUP_BY etc. 
+Both methods wrap the back-end details of parsing/validation/assembling, and deliver a Beam SDK style API that can express simple TABLE_FILTER queries up to complex queries containing JOIN/GROUP_BY etc.
 
 [BeamSqlExample](https://github.com/apache/beam/blob/DSL_SQL/sdks/java/extensions/sql/src/main/java/org/apache/beam/sdk/extensions/sql/example/BeamSqlExample.java) in the code repository shows basic usage of both APIs.
 
-# <a name="functionality"></a>3. Functionality in Beam SQL
+## 3. Functionality in Beam SQL {#functionality}
 Just as the unified model for both bounded and unbounded data in Beam, SQL DSL provides the same functionalities for bounded and unbounded `PCollection` as well. Here's the supported SQL grammar supported in [BNF](http://en.wikipedia.org/wiki/Backus%E2%80%93Naur_Form)-like form. An `UnsupportedOperationException` is thrown for unsupported features.
 
 ```
@@ -146,7 +145,7 @@ tableExpression:
 booleanExpression:
     expression [ IS NULL | IS NOT NULL ]
   | expression [ > | >= | = | < | <= | <> ] expression
-  | booleanExpression [ AND | OR ] booleanExpression 
+  | booleanExpression [ AND | OR ] booleanExpression
   | NOT booleanExpression
   | '(' booleanExpression ')'
 
@@ -168,7 +167,7 @@ groupItem:
 
 ```
 
-## <a name="features"></a>3.1. Supported Features
+### 3.1. Supported Features {#features}
 
 **1. aggregations;**
 
@@ -185,11 +184,11 @@ SELECT f_int, COUNT(*) AS `size` FROM PCOLLECTION GROUP BY f_int, HOP(f_timestam
 SELECT f_int, COUNT(*) AS `size` FROM PCOLLECTION GROUP BY f_int, SESSION(f_timestamp, INTERVAL '5' MINUTE)
 ```
 
-Note: 
+Note:
 
 1. distinct aggregation is not supported yet.
 2. the default trigger is `Repeatedly.forever(AfterWatermark.pastEndOfWindow())`;
-3. when `time` field in `HOP(dateTime, slide, size [, time ])`/`TUMBLE(dateTime, interval [, time ])`/`SESSION(dateTime, interval [, time ])` is specified, a lateFiring trigger is added as 
+3. when `time` field in `HOP(dateTime, slide, size [, time ])`/`TUMBLE(dateTime, interval [, time ])`/`SESSION(dateTime, interval [, time ])` is specified, a lateFiring trigger is added as
 
 ```
 Repeatedly.forever(AfterWatermark.pastEndOfWindow().withLateFirings(AfterProcessingTime
@@ -289,8 +288,8 @@ PCollection<BeamSqlRow> result =
     input.apply("udafExample",
         BeamSql.simpleQuery(sql).withUdaf("squaresum", new SquareSum()));
 ```
-  
-## <a name="data-type"></a>3.2. Data Types
+
+### 3.2. Data Types {#data-types}
 Each type in Beam SQL maps to a Java class to holds the value in `BeamRecord`. The following table lists the relation between SQL types and Java classes, which are supported in current repository:
 
 | SQL Type | Java class |
@@ -306,7 +305,7 @@ Each type in Beam SQL maps to a Java class to holds the value in `BeamRecord`. T
 | Types.TIMESTAMP | java.util.Date |
 {:.table}
 
-## <a name="built-in-functions"></a>3.3. built-in SQL functions
+### 3.3. Built-in SQL functions {#built-in-functions}
 
 Beam SQL has implemented lots of build-in functions defined in [Apache Calcite](http://calcite.apache.org). The available functions are listed as below:
 
@@ -337,11 +336,11 @@ Beam SQL has implemented lots of build-in functions defined in [Apache Calcite](
 
 | Operator syntax | Description|
 | ---- | ---- |
-| numeric1 + numeric2 | Returns numeric1 plus numeric2| 
-| numeric1 - numeric2 | Returns numeric1 minus numeric2| 
-| numeric1 * numeric2 | Returns numeric1 multiplied by numeric2| 
-| numeric1 / numeric2 | Returns numeric1 divided by numeric2| 
-| MOD(numeric, numeric) | Returns the remainder (modulus) of numeric1 divided by numeric2. The result is negative only if numeric1 is negative| 
+| numeric1 + numeric2 | Returns numeric1 plus numeric2|
+| numeric1 - numeric2 | Returns numeric1 minus numeric2|
+| numeric1 * numeric2 | Returns numeric1 multiplied by numeric2|
+| numeric1 / numeric2 | Returns numeric1 divided by numeric2|
+| MOD(numeric, numeric) | Returns the remainder (modulus) of numeric1 divided by numeric2. The result is negative only if numeric1 is negative|
 {:.table}
 
 **Math functions**
@@ -432,7 +431,7 @@ Beam SQL has implemented lots of build-in functions defined in [Apache Calcite](
 | MIN(value) | Returns the minimum value of value across all input values |
 {:.table}
 
-# <a name="internal-of-sql"></a>4. The Internal of Beam SQL
+## 4. Internals of Beam SQL {#internals-of-sql}
 Figure 1 describes the back-end steps from a SQL statement to a Beam `PTransform`.
 
 ![Workflow of Beam SQL DSL]({{ "/images/beam_sql_dsl_workflow.png" | prepend: site.baseurl }} "workflow of Beam SQL DSL")
@@ -466,4 +465,3 @@ And compiled as a composite `PTransform`
 pCollection.apply(BeamSqlFilter...)
            .apply(BeamSqlProject...)
 ```
-
diff --git a/src/documentation/execution-model.md b/src/documentation/execution-model.md
index 049c7f3..4f839ca 100644
--- a/src/documentation/execution-model.md
+++ b/src/documentation/execution-model.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Beam Execution Model"
+section_menu: section-menu/documentation.html
 permalink: /documentation/execution-model/
 ---
 
@@ -188,4 +189,3 @@ down since they aren’t following the normal `DoFn` lifecycle .
 
 Executing transforms this way allows a runner to avoid persisting elements
 between transforms, saving on persistence costs.
-
diff --git a/src/documentation/index.md b/src/documentation/index.md
index 40ed972..d54543d 100644
--- a/src/documentation/index.md
+++ b/src/documentation/index.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Learn about Beam"
 permalink: /documentation/
+section_menu: section-menu/documentation.html
 redirect_from:
   - /learn/
   - /docs/learn/
diff --git a/src/documentation/io/authoring-java.md b/src/documentation/io/authoring-java.md
index d1d7013..6d1a8ec 100644
--- a/src/documentation/io/authoring-java.md
+++ b/src/documentation/io/authoring-java.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Authoring I/O Transforms - Java"
+section_menu: section-menu/documentation.html
 permalink: /documentation/io/authoring-java/
 ---
 
diff --git a/src/documentation/io/authoring-overview.md b/src/documentation/io/authoring-overview.md
index 186d853..927e669 100644
--- a/src/documentation/io/authoring-overview.md
+++ b/src/documentation/io/authoring-overview.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Authoring I/O Transforms - Overview"
+section_menu: section-menu/documentation.html
 permalink: /documentation/io/authoring-overview/
 ---
 
diff --git a/src/documentation/io/authoring-python.md b/src/documentation/io/authoring-python.md
index b6ccc56..4308765 100644
--- a/src/documentation/io/authoring-python.md
+++ b/src/documentation/io/authoring-python.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Authoring I/O Transforms - Python"
+section_menu: section-menu/documentation.html
 permalink: /documentation/io/authoring-python/
 ---
 
diff --git a/src/documentation/io/built-in-hadoop.md b/src/documentation/io/built-in-hadoop.md
index 240d919..82fc47f 100644
--- a/src/documentation/io/built-in-hadoop.md
+++ b/src/documentation/io/built-in-hadoop.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Hadoop InputFormat IO"
+section_menu: section-menu/documentation.html
 permalink: /documentation/io/built-in/hadoop/
 ---
 
@@ -68,7 +69,7 @@ p.apply("read",
   # The Beam SDK for Python does not support Hadoop InputFormat IO.
 ```
 
-#### Read data with configuration and key translation 
+#### Read data with configuration and key translation
 
 For example, a Beam `Coder` is not available for `Key` class, so key translation is required.
 
@@ -98,7 +99,7 @@ p.apply("read",
   # The Beam SDK for Python does not support Hadoop InputFormat IO.
 ```
 
-#### Read data with configuration, value translation and key translation 
+#### Read data with configuration, value translation and key translation
 
 For example, Beam Coders are not available for both `Key` class and `Value` classes of `InputFormat`, so key and value translation are required.
 
@@ -164,9 +165,9 @@ SimpleFunction<Row, String> cassandraOutputValueType = SimpleFunction<Row, Strin
 ```py
   # The Beam SDK for Python does not support Hadoop InputFormat IO.
 ```
- 
+
 ### Elasticsearch - EsInputFormat
- 
+
 To read data from Elasticsearch, use `EsInputFormat`, which needs following properties to be set:
 
 ```java
@@ -230,7 +231,7 @@ PCollection<KV<Long, HCatRecord>> hcatData =
 ### Amazon DynamoDB - DynamoDBInputFormat
 
 To read data from Amazon DynamoDB, use `org.apache.hadoop.dynamodb.read.DynamoDBInputFormat`.
-DynamoDBInputFormat implements the older `org.apache.hadoop.mapred.InputFormat` interface and to make it compatible with HadoopInputFormatIO which uses the newer abstract class `org.apache.hadoop.mapreduce.InputFormat`, 
+DynamoDBInputFormat implements the older `org.apache.hadoop.mapred.InputFormat` interface and to make it compatible with HadoopInputFormatIO which uses the newer abstract class `org.apache.hadoop.mapreduce.InputFormat`,
 a wrapper API is required which acts as an adapter between HadoopInputFormatIO and DynamoDBInputFormat (or in general any InputFormat implementing `org.apache.hadoop.mapred.InputFormat`)
 The below example uses one such available wrapper API - <https://github.com/twitter/elephant-bird/blob/master/core/src/main/java/com/twitter/elephantbird/mapreduce/input/MapReduceInputFormatWrapper.java>
 
diff --git a/src/documentation/io/built-in.md b/src/documentation/io/built-in.md
index 97e3c72..bf5bb88 100644
--- a/src/documentation/io/built-in.md
+++ b/src/documentation/io/built-in.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Built-in I/O Transforms"
+section_menu: section-menu/documentation.html
 permalink: /documentation/io/built-in/
 ---
 
diff --git a/src/documentation/io/contributing.md b/src/documentation/io/contributing.md
index 949db3c..6c58cf0 100644
--- a/src/documentation/io/contributing.md
+++ b/src/documentation/io/contributing.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Contributing I/O Transforms"
+section_menu: section-menu/documentation.html
 permalink: /documentation/io/contributing/
 ---
 
diff --git a/src/documentation/io/io-toc.md b/src/documentation/io/io-toc.md
index b92bd31..15b1354 100644
--- a/src/documentation/io/io-toc.md
+++ b/src/documentation/io/io-toc.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Pipeline I/O"
+section_menu: section-menu/documentation.html
 permalink: /documentation/io/io-toc/
 ---
 
diff --git a/src/documentation/io/testing.md b/src/documentation/io/testing.md
index 565bdcd..0c3f439 100644
--- a/src/documentation/io/testing.md
+++ b/src/documentation/io/testing.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Testing I/O Transforms"
+section_menu: section-menu/documentation.html
 permalink: /documentation/io/testing/
 ---
 
@@ -73,7 +74,7 @@ Python:
 *   Validate the correctness of the code in your I/O transform.
 *   Validate that the I/O transform works correctly when used in concert with reference implementations of the data store it connects with (where "reference implementation" means a fake or in-memory version).
 *   Be able to run quickly and need only one machine, with a reasonably small memory/disk footprint and no non-local network access (preferably none at all). Aim for tests than run within several seconds - anything above 20 seconds should be discussed with the beam dev mailing list.
-*   Validate that the I/O transform can handle network failures. 
+*   Validate that the I/O transform can handle network failures.
 
 
 ### Non-goals
@@ -158,7 +159,7 @@ mvn verify -Dio-it-suite-local -pl sdks/java/io/jdbc,sdks/java/io/jdbc -DpkbLoca
 
 Example run with the Cloud Dataflow runner:
 ```
-mvn verify -Dio-it-suite -pl sdks/java/io/jdbc -DintegrationTestPipelineOptions=["--project=PROJECT","--gcpTempLocation=GSBUCKET"] -DintegrationTestRunner=dataflow -DpkbLocation="/Users/me/dev/PerfKitBenchmarker/pkb.py" 
+mvn verify -Dio-it-suite -pl sdks/java/io/jdbc -DintegrationTestPipelineOptions=["--project=PROJECT","--gcpTempLocation=GSBUCKET"] -DintegrationTestRunner=dataflow -DpkbLocation="/Users/me/dev/PerfKitBenchmarker/pkb.py"
 ```
 
 
diff --git a/src/documentation/pipelines/create-your-pipeline.md b/src/documentation/pipelines/create-your-pipeline.md
index 8b32435..2ef9344 100644
--- a/src/documentation/pipelines/create-your-pipeline.md
+++ b/src/documentation/pipelines/create-your-pipeline.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Create Your Pipeline"
+section_menu: section-menu/documentation.html
 permalink: /documentation/pipelines/create-your-pipeline/
 ---
 # Create Your Pipeline
diff --git a/src/documentation/pipelines/design-your-pipeline.md b/src/documentation/pipelines/design-your-pipeline.md
index 176eaa0..87250af 100644
--- a/src/documentation/pipelines/design-your-pipeline.md
+++ b/src/documentation/pipelines/design-your-pipeline.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Design Your Pipeline"
+section_menu: section-menu/documentation.html
 permalink: /documentation/pipelines/design-your-pipeline/
 ---
 # Design Your Pipeline
diff --git a/src/documentation/pipelines/test-your-pipeline.md b/src/documentation/pipelines/test-your-pipeline.md
index 3df1419..74eb901 100644
--- a/src/documentation/pipelines/test-your-pipeline.md
+++ b/src/documentation/pipelines/test-your-pipeline.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Test Your Pipeline"
+section_menu: section-menu/documentation.html
 permalink: /documentation/pipelines/test-your-pipeline/
 ---
 # Test Your Pipeline
@@ -14,7 +15,7 @@ Before running your pipeline on the runner of your choice, unit testing your pip
 
 You can use [DirectRunner]({{ site.baseurl }}/documentation/runners/direct), a local runner helpful for testing and local development.
 
-After you test your pipeline using the `DirectRunner`, you can use the runner of your choice to test on a small scale. For example, use the Flink runner with a local or remote Flink cluster. 
+After you test your pipeline using the `DirectRunner`, you can use the runner of your choice to test on a small scale. For example, use the Flink runner with a local or remote Flink cluster.
 
 
 
@@ -46,7 +47,7 @@ The Beam SDK for Java provides a convenient way to test an individual `DoFn` cal
 
 To create a `DoFnTester`, first create an instance of the `DoFn` you want to test. You then use that instance when you create a `DoFnTester` using the `.of()` static factory method:
 
-```java 
+```java
 static class MyDoFn extends DoFn<String, Integer> { ... }
   MyDoFn myDoFn = ...;
 
@@ -177,7 +178,7 @@ PAssert.that(output)
 
 Any code that uses `PAssert` must link in `JUnit` and `Hamcrest`. If you're using Maven, you can link in `Hamcrest` by adding the following dependency to your project's `pom.xml` file:
 
-```java 
+```java
 <dependency>
     <groupId>org.hamcrest</groupId>
     <artifactId>hamcrest-all</artifactId>
diff --git a/src/documentation/programming-guide.md b/src/documentation/programming-guide.md
index ebe8a8e..2ccbd35 100644
--- a/src/documentation/programming-guide.md
+++ b/src/documentation/programming-guide.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Beam Programming Guide"
+section_menu: section-menu/documentation.html
 permalink: /documentation/programming-guide/
 redirect_from:
   - /learn/programming-guide/
diff --git a/src/documentation/resources.md b/src/documentation/resources.md
index 060b230..306a32d 100644
--- a/src/documentation/resources.md
+++ b/src/documentation/resources.md
@@ -1,12 +1,13 @@
 ---
-layout: default
+layout: section
 title: "Beam Learning Resources"
 permalink: /documentation/resources/
+section_menu: section-menu/documentation.html
 redirect_from: /learn/resources/
 ---
 # Additional Resources for Learning about Apache Beam
 
-This page provides links to some of our favorite videos, podcasts, and articles that will help you get started and learn more about Apache Beam. 
+This page provides links to some of our favorite videos, podcasts, and articles that will help you get started and learn more about Apache Beam.
 
 * TOC
 {:toc}
@@ -26,9 +27,9 @@ Presented by Tyler Akidau, *Apache Beam PPMC member*
 
 ### Apache Beam: A Unified Model for Batch and Streaming Data Processing
 
-Hadoop Summit, San Jose, CA, 2016 
+Hadoop Summit, San Jose, CA, 2016
 
-Presented by Davor Bonaci, *Apache Beam PPMC member* 
+Presented by Davor Bonaci, *Apache Beam PPMC member*
 
 <iframe width="560" height="315" src="https://www.youtube.com/embed/7DZ8ONmeP5A" frameborder="0" allowfullscreen></iframe>
 <br>
@@ -62,29 +63,29 @@ Click on the image to read the article.
 
 ### Software Engineering Radio Podcast Episode 272: Apache Beam
 
-Presented by Frances Perry, *Apache Beam PPMC member* 
+Presented by Frances Perry, *Apache Beam PPMC member*
 
 <a href="http://www.se-radio.net/2016/10/se-radio-episode-272-frances-perry-on-apache-beam/" target="_blank">![alt text]({{ site.baseurl }}/images/resources/se-radio-podcast.png)</a>
 <br>
 
 ## Beam & Friends
 
-The following resources present Apache Beam partnerships. 
+The following resources present Apache Beam partnerships.
 
 ### Flink and Beam: Current State & Roadmap
 
-Flink Forward, Berlin, 2016 
+Flink Forward, Berlin, 2016
 
-Presented by Maximilian Michels, *Apache Beam PPMC member* 
+Presented by Maximilian Michels, *Apache Beam PPMC member*
 
 <iframe width="560" height="315" src="https://www.youtube.com/embed/msdjh6KRXC8" frameborder="0" allowfullscreen></iframe>
 <br>
 
-### Lessons learned from developing a stream processing platform at scale 
+### Lessons learned from developing a stream processing platform at scale
 
 Big Things Meetup, Tel Aviv, 2016
 
-By Amit Sela, *Apache Beam PPMC member* 
+By Amit Sela, *Apache Beam PPMC member*
 
 <iframe width="560" height="315" src="https://www.youtube.com/embed/fc-YigLn_gs" frameborder="0" allowfullscreen></iframe>
 <br>
@@ -102,10 +103,10 @@ Presented by Slava Chernyak, *Software Engineer at Google*
 <iframe width="560" height="315" src="https://www.youtube.com/embed/TWxSLmkWPm4" frameborder="0" allowfullscreen></iframe>
 <br>
 
-### Triggers in Apache Beam 
+### Triggers in Apache Beam
 
 Strata+Hadoop World, New York, 2016
 
-Presented by Kenneth Knowles, *Apache Beam PPMC member* 
+Presented by Kenneth Knowles, *Apache Beam PPMC member*
 
 <iframe width="560" height="315" src="https://www.youtube.com/embed/E1k0B9LN46M" frameborder="0" allowfullscreen></iframe>
diff --git a/src/documentation/runners/apex.md b/src/documentation/runners/apex.md
index 9d68b2f..14cdc1b 100644
--- a/src/documentation/runners/apex.md
+++ b/src/documentation/runners/apex.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Apex Runner"
+section_menu: section-menu/runners.html
 permalink: /documentation/runners/apex/
 ---
 # Using the Apache Apex Runner
@@ -61,4 +62,3 @@ Depending on your installation, you may be able to monitor the progress of your
 
 * YARN : Using YARN web UI generally running on 8088 on the node running resource manager.
 * Apex command-line interface: [Using the Apex CLI to get running application information](http://apex.apache.org/docs/apex/apex_cli/#apex-cli-commands).
-
diff --git a/src/documentation/runners/capability-matrix.md b/src/documentation/runners/capability-matrix.md
index c5d91a8..9dd1bc8 100644
--- a/src/documentation/runners/capability-matrix.md
+++ b/src/documentation/runners/capability-matrix.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Beam Capability Matrix"
+section_menu: section-menu/runners.html
 permalink: /documentation/runners/capability-matrix/
 redirect_from:
   - /learn/runners/capability-matrix/
diff --git a/src/documentation/runners/dataflow.md b/src/documentation/runners/dataflow.md
index 8ef3ba2..452164a 100644
--- a/src/documentation/runners/dataflow.md
+++ b/src/documentation/runners/dataflow.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Cloud Dataflow Runner"
 permalink: /documentation/runners/dataflow/
+section_menu: section-menu/runners.html
 redirect_from: /learn/runners/dataflow/
 ---
 # Using the Google Cloud Dataflow Runner
@@ -171,4 +172,3 @@ To block until your job completes, call <span class="language-java"><code>waitTo
 
 <span class="language-java">If your pipeline uses an unbounded data source or sink, you must set the `streaming` option to `true`.</span>
 <span class="language-py">The Beam SDK for Python does not currently support streaming pipelines.</span>
-
diff --git a/src/documentation/runners/direct.md b/src/documentation/runners/direct.md
index 5cca0de..c39ec8d 100644
--- a/src/documentation/runners/direct.md
+++ b/src/documentation/runners/direct.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Direct Runner"
 permalink: /documentation/runners/direct/
+section_menu: section-menu/runners.html
 redirect_from: /learn/runners/direct/
 ---
 # Using the Direct Runner
@@ -61,4 +62,3 @@ interface for defaults and additional pipeline configuration options.
 ## Additional information and caveats
 
 Local execution is limited by the memory available in your local environment. It is highly recommended that you run your pipeline with data sets small enough to fit in local memory. You can create a small in-memory data set using a <span class="language-java">[`Create`]({{ site.baseurl }}/documentation/sdks/javadoc/{{ site.release_latest }}/index.html?org/apache/beam/sdk/transforms/Create.html)</span><span class="language-py">[`Create`](https://github.com/apache/beam/blob/master/sdks/pyt [...]
-
diff --git a/src/documentation/runners/flink.md b/src/documentation/runners/flink.md
index 75bb324..6dc6e7b 100644
--- a/src/documentation/runners/flink.md
+++ b/src/documentation/runners/flink.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Flink Runner"
+section_menu: section-menu/runners.html
 permalink: /documentation/runners/flink/
 redirect_from: /learn/runners/flink/
 ---
@@ -149,4 +150,3 @@ You can monitor a running Flink job using the Flink JobManager Dashboard. By def
 ### Streaming Execution
 
 If your pipeline uses an unbounded data source or sink, the Flink Runner will automatically switch to streaming mode. You can enforce streaming mode by using the `streaming` setting mentioned above.
-
diff --git a/src/documentation/runners/gearpump.md b/src/documentation/runners/gearpump.md
index 1be8e48..26e0632 100644
--- a/src/documentation/runners/gearpump.md
+++ b/src/documentation/runners/gearpump.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Gearpump (incubating) Runner"
+section_menu: section-menu/runners.html
 permalink: /documentation/runners/gearpump/
 ---
 # Using the Apache Gearpump Runner
@@ -126,8 +127,3 @@ When executing your pipeline with the Gearpump Runner, you should consider the f
   <td><code>beam_gearpump_app</code></td>
 </tr>
 </table>
-
-
-
-
-
diff --git a/src/documentation/runners/jstorm.md b/src/documentation/runners/jstorm.md
index 20e9322..6c292a7 100644
--- a/src/documentation/runners/jstorm.md
+++ b/src/documentation/runners/jstorm.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "JStorm Runner"
+section_menu: section-menu/documentation.html
 permalink: /documentation/runners/jstorm/
 ---
 # Using the JStorm Runner
diff --git a/src/documentation/runners/mapreduce.md b/src/documentation/runners/mapreduce.md
index fb32848..aeaf197 100644
--- a/src/documentation/runners/mapreduce.md
+++ b/src/documentation/runners/mapreduce.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Hadoop MapReduce Runner"
+section_menu: section-menu/runners.html
 permalink: /documentation/runners/mapreduce/
 ---
 # Using the Apache Hadoop MapReduce Runner
diff --git a/src/documentation/runners/spark.md b/src/documentation/runners/spark.md
index b3de10b..7c43d95 100644
--- a/src/documentation/runners/spark.md
+++ b/src/documentation/runners/spark.md
@@ -1,12 +1,13 @@
 ---
-layout: default
+layout: section
 title: "Apache Spark Runner"
+section_menu: section-menu/runners.html
 permalink: /documentation/runners/spark/
 redirect_from: /learn/runners/spark/
 ---
 # Using the Apache Spark Runner
 
-The Apache Spark Runner can be used to execute Beam pipelines using [Apache Spark](http://spark.apache.org/). 
+The Apache Spark Runner can be used to execute Beam pipelines using [Apache Spark](http://spark.apache.org/).
 The Spark Runner can execute Spark pipelines just like a native Spark application; deploying a self-contained application for local mode, running on Spark's Standalone RM, or using YARN or Mesos.
 
 The Spark Runner executes Beam pipelines on top of Apache Spark, providing:
diff --git a/src/documentation/sdks/feature-comparison.md b/src/documentation/sdks/feature-comparison.md
new file mode 100644
index 0000000..0ff6a77
--- /dev/null
+++ b/src/documentation/sdks/feature-comparison.md
@@ -0,0 +1,7 @@
+---
+layout: section
+title: "Beam Java SDK"
+section_menu: section-menu/sdks.html
+permalink: /documentation/sdks/feature-comparison/
+---
+# Beam SDK feature comparison
diff --git a/src/documentation/sdks/java-extensions.md b/src/documentation/sdks/java-extensions.md
index 17a79e7..7742345 100644
--- a/src/documentation/sdks/java-extensions.md
+++ b/src/documentation/sdks/java-extensions.md
@@ -1,11 +1,12 @@
 ---
-layout: default
+layout: section
 title: "Beam Java SDK Extensions"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/java-extensions/
 ---
 # Apache Beam Java SDK Extensions
 
-## <a name="join-library"></a>Join-library
+## Join-library
 
 Join-library provides inner join, outer left join, and outer right join functions. The aim
 is to simplify the most common cases of join to a simple function call.
@@ -30,7 +31,7 @@ PCollection<KV<String, KV<String, Long>>> joinedPcollection =
 ```
 
 
-## <a name="sorter"></a>Sorter
+## Sorter
 
 This module provides the `SortValues` transform, which takes a `PCollection<KV<K, Iterable<KV<K2, V>>>>` and produces a `PCollection<KV<K, Iterable<KV<K2, V>>>>` where, for each primary key `K` the paired `Iterable<KV<K2, V>>` has been sorted by the byte encoding of secondary key (`K2`). It is an efficient and scalable sorter for iterables, even if they are large (do not fit in memory).
 
diff --git a/src/documentation/sdks/java.md b/src/documentation/sdks/java.md
index 1fd6158..cabbb2f 100644
--- a/src/documentation/sdks/java.md
+++ b/src/documentation/sdks/java.md
@@ -1,12 +1,13 @@
 ---
-layout: default
+layout: section
 title: "Beam Java SDK"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/java/
 redirect_from: /learn/sdks/java/
 ---
 # Apache Beam Java SDK
 
-The Java SDK for Apache Beam provides a simple, powerful API for building both batch and streaming parallel data processing pipelines in Java. 
+The Java SDK for Apache Beam provides a simple, powerful API for building both batch and streaming parallel data processing pipelines in Java.
 
 
 ## Get Started with the Java SDK
diff --git a/src/documentation/sdks/javadoc/current.md b/src/documentation/sdks/javadoc/current.md
index b88b080..5e83e44 100644
--- a/src/documentation/sdks/javadoc/current.md
+++ b/src/documentation/sdks/javadoc/current.md
@@ -1,7 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Beam Javadoc"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/javadoc/current/
 redirect_to: /documentation/sdks/javadoc/2.1.0/
 ---
-
diff --git a/src/documentation/sdks/javadoc/index.md b/src/documentation/sdks/javadoc/index.md
index 4da4266..d1ef5ff 100644
--- a/src/documentation/sdks/javadoc/index.md
+++ b/src/documentation/sdks/javadoc/index.md
@@ -1,8 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Beam Javadoc"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/javadoc/
 redirect_from: /learn/sdks/javadoc/
 redirect_to: /documentation/sdks/javadoc/current/
 ---
-
diff --git a/src/documentation/sdks/nexmark.md b/src/documentation/sdks/nexmark.md
index 82bf868..b8d7efb 100644
--- a/src/documentation/sdks/nexmark.md
+++ b/src/documentation/sdks/nexmark.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Nexmark benchmark suite"
+section_menu: section-menu/documentation.html
 permalink: /documentation/sdks/nexmark/
 ---
 # Nexmark benchmark suite
@@ -538,4 +539,3 @@ Building package:
 Submit to the cluster:
 
     spark-submit --master yarn-client --class org.apache.beam.sdk.nexmark.Main --driver-memory 512m --executor-memory 512m --executor-cores 1 beam-sdks-java-nexmark-bundled-2.1.0-SNAPSHOT.jar --runner=SparkRunner --query=0 --streamTimeout=60 --streaming=false --manageResources=false --monitorJobs=true
-
diff --git a/src/documentation/sdks/pydoc/current.md b/src/documentation/sdks/pydoc/current.md
index e3998d6..0d812a4 100644
--- a/src/documentation/sdks/pydoc/current.md
+++ b/src/documentation/sdks/pydoc/current.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Beam Pydoc"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/pydoc/current/
 redirect_to: /documentation/sdks/pydoc/2.1.0/
 ---
diff --git a/src/documentation/sdks/pydoc/index.md b/src/documentation/sdks/pydoc/index.md
index 36ad5b1..0debf4f 100644
--- a/src/documentation/sdks/pydoc/index.md
+++ b/src/documentation/sdks/pydoc/index.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Beam Pydoc"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/pydoc/
 redirect_to: /documentation/sdks/pydoc/current/
 ---
diff --git a/src/documentation/sdks/python-custom-io.md b/src/documentation/sdks/python-custom-io.md
index 367910e..f6db5dd 100644
--- a/src/documentation/sdks/python-custom-io.md
+++ b/src/documentation/sdks/python-custom-io.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Beam: Creating New Sources and Sinks with the Python SDK"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/python-custom-io/
 ---
 # Creating New Sources and Sinks with the Python SDK
@@ -20,7 +21,7 @@ In simple cases, you may not need to create a new source or sink. For example, i
 However, if you'd like to use advanced features such as dynamic splitting and size estimation, you should use Beam's APIs and create a new source or sink.
 
 
-## <a name="basic-code-reqs"></a>Basic Code Requirements for New Sources and Sinks
+## Basic Code Requirements for New Sources and Sinks {#basic-code-reqs}
 
 Services use the classes you provide to read and/or write data using multiple worker instances in parallel. As such, the code you provide for `Source` and `Sink` subclasses must meet some basic requirements:
 
@@ -43,7 +44,7 @@ It is critical to exhaustively unit-test all of your `Source` and `Sink` subclas
 You can use test harnesses and utility methods available in the [source_test_utils module](https://github.com/apache/beam/blob/master/sdks/python/apache_beam/io/source_test_utils.py) to develop tests for your source.
 
 
-## <a name="creating-sources"></a>Creating a New Source
+## Creating a New Source
 
 You should create a new source if you'd like to use the advanced features that the Source API provides:
 
@@ -157,7 +158,7 @@ To create a source for a new file type, you need to create a sub-class of `FileB
 See [AvroSource](https://github.com/apache/beam/blob/master/sdks/python/apache_beam/io/avroio.py) for an example implementation of `FileBasedSource`.
 
 
-## <a name="reading-sources"></a>Reading from a New Source
+## Reading from a New Source
 
 The following example, `CountingSource`, demonstrates an implementation of `BoundedSource` and uses the SDK-provided `RangeTracker` called `OffsetRangeTracker`.
 
@@ -172,7 +173,7 @@ To read data from the source in your pipeline, use the `Read` transform:
 **Note:** When you create a source that end-users are going to use, it's recommended that you do not expose the code for the source itself as demonstrated in the example above, but rather use a wrapping `PTransform` instead. See [PTransform wrappers](#ptransform-wrappers) to see how and why to avoid exposing your sources.
 
 
-## <a name="creating-sinks"></a>Creating a New Sink
+## Creating a New Sink
 
 You should create a new sink if you'd like to use the advanced features that the Sink API provides, such as global initialization and finalization that allow the write operation to appear "atomic" (i.e. either all data is written or none is).
 
@@ -235,7 +236,7 @@ If your data source uses files, you can derive your `Sink` and `Writer` classes
 * Setting the output MIME type
 
 
-## <a name="writing-sinks"></a>Writing to a New Sink
+## Writing to a New Sink
 
 Consider a simple key-value storage that writes a given set of key-value pairs to a set of tables. The following is the key-value storage's API:
 
@@ -262,7 +263,7 @@ The following code demonstrates how to write to the sink using the `Write` trans
 **Note:** When you create a sink that end-users are going to use, it's recommended that you do not expose the code for the sink itself as demonstrated in the example above, but rather use a wrapping `PTransform` instead. See [PTransform wrappers](#ptransform-wrappers) to see how and why to avoid exposing your sinks.
 
 
-## <a name="ptransform-wrappers"></a>PTransform Wrappers
+## PTransform Wrappers
 
 If you create a new source or sink for your own use, such as for learning purposes, you should create them as explained in the sections above and use them as demonstrated in the examples.
 
@@ -291,4 +292,3 @@ Finally, write to the sink:
 
 ```
 {% github_sample /apache/beam/blob/master/sdks/python/apache_beam/examples/snippets/snippets.py tag:model_custom_sink_use_ptransform %}```
-
diff --git a/src/documentation/sdks/python-pipeline-dependencies.md b/src/documentation/sdks/python-pipeline-dependencies.md
index 9a4ebe7..b90139d 100644
--- a/src/documentation/sdks/python-pipeline-dependencies.md
+++ b/src/documentation/sdks/python-pipeline-dependencies.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Managing Python Pipeline Dependencies"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/python-pipeline-dependencies/
 ---
 # Managing Python Pipeline Dependencies
@@ -12,7 +13,7 @@ When you run your pipeline locally, the packages that your pipeline depends on a
 **Note:** Remote workers used for pipeline execution typically have a standard Python 2.7 distribution installation. If your code relies only on standard Python packages, then you probably don't need to do anything on this page.
 
 
-## <a name="pypi"></a>PyPI Dependencies
+## PyPI Dependencies {#pypi-dependencies}
 
 If your pipeline uses public packages from the [Python Package Index](https://pypi.python.org/pypi), make these packages available remotely by performing the following steps:
 
@@ -35,7 +36,7 @@ If your pipeline uses public packages from the [Python Package Index](https://py
 **Important:** Remote workers will install all packages listed in the `requirements.txt` file. Because of this, it's very important that you delete non-PyPI packages from the `requirements.txt` file, as stated in step 2. If you don't remove non-PyPI packages, the remote workers will fail when attempting to install packages from sources that are unknown to them.
 
 
-## <a name="localnonpypi"></a>Local or non-PyPI Dependencies
+## Local or non-PyPI Dependencies {#local-or-nonpypi}
 
 If your pipeline uses packages that are not available publicly (e.g. packages that you've downloaded from a GitHub repo), make these packages available remotely by performing the following steps:
 
@@ -56,7 +57,7 @@ If your pipeline uses packages that are not available publicly (e.g. packages th
 
    See the [sdist documentation](https://docs.python.org/2/distutils/sourcedist.html) for more details on this command.
 
-## <a name="multfiles"></a>Multiple File Dependencies
+## Multiple File Dependencies
 
 Often, your pipeline code spans multiple files. To run your project remotely, you must group these files as a Python package and specify the package when you run your pipeline. When the remote workers start, they will install your package. To group your files as a Python package and make it available remotely, perform the following steps:
 
@@ -82,10 +83,10 @@ Often, your pipeline code spans multiple files. To run your project remotely, yo
 
         --setup_file /path/to/setup.py
 
-**Note:** If you [created a requirements.txt file](#pypi) and your project spans multiple files, you can get rid of the `requirements.txt` file and instead, add all packages contained in `requirements.txt` to the `install_requires` field of the setup call (in step 1).
+**Note:** If you [created a requirements.txt file](#pypi-dependencies) and your project spans multiple files, you can get rid of the `requirements.txt` file and instead, add all packages contained in `requirements.txt` to the `install_requires` field of the setup call (in step 1).
 
 
-## <a name="nonpython"></a>Non-Python Dependencies or PyPI Dependencies with Non-Python Dependencies
+## Non-Python Dependencies or PyPI Dependencies with Non-Python Dependencies {#nonpython}
 
 If your pipeline uses non-Python packages (e.g. packages that require installation using the `apt-get install` command), or uses a PyPI package that depends on non-Python dependencies during package installation, you must perform the following steps.
 
@@ -109,4 +110,3 @@ If your pipeline uses non-Python packages (e.g. packages that require installati
         --setup_file /path/to/setup.py
 
 **Note:** Because custom commands execute after the dependencies for your workflow are installed (by `pip`), you should omit the PyPI package dependency from the pipeline's `requirements.txt` file and from the `install_requires` parameter in the `setuptools.setup()` call of your `setup.py` file.
-
diff --git a/src/documentation/sdks/python-type-safety.md b/src/documentation/sdks/python-type-safety.md
index c9f034a..ae8fc09 100644
--- a/src/documentation/sdks/python-type-safety.md
+++ b/src/documentation/sdks/python-type-safety.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Ensuring Python Type Safety"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/python-type-safety/
 ---
 #  Ensuring Python Type Safety
@@ -135,4 +136,3 @@ The following code shows the example `Player` class and how to define a `Coder`
 
 ```
 {% github_sample /apache/beam/blob/master/sdks/python/apache_beam/examples/snippets/snippets_test.py tag:type_hints_deterministic_key %}```
-
diff --git a/src/documentation/sdks/python.md b/src/documentation/sdks/python.md
index aeffcdc..46af4cc 100644
--- a/src/documentation/sdks/python.md
+++ b/src/documentation/sdks/python.md
@@ -1,6 +1,7 @@
 ---
-layout: default
+layout: section
 title: "Apache Beam Python SDK"
+section_menu: section-menu/sdks.html
 permalink: /documentation/sdks/python/
 ---
 # Apache Beam Python SDK
@@ -24,4 +25,3 @@ When you run your pipeline locally, the packages that your pipeline depends on a
 ## Creating New Sources and Sinks
 
 The Beam SDK for Python provides an extensible API that you can use to create new data sources and sinks. [Creating New Sources and Sinks with the Python SDK]({{ site.baseurl }}/documentation/sdks/python-custom-io) shows how to create new sources and sinks using [Beam's Source and Sink API](https://github.com/apache/beam/blob/master/sdks/python/apache_beam/io/iobase.py).
-
diff --git a/src/get-started/beam-overview.md b/src/get-started/beam-overview.md
index 1d3bbc6..e3a474a 100644
--- a/src/get-started/beam-overview.md
+++ b/src/get-started/beam-overview.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Beam Overview"
 permalink: /get-started/beam-overview/
+section_menu: section-menu/get-started.html
 redirect_from:
   - /use/beam-overview/
   - /docs/use/beam-overview/
@@ -40,7 +41,7 @@ Beam currently supports Runners that work with the following distributed process
          alt="Apache Spark">
 * Google Cloud Dataflow <img src="{{ site.baseurl }}/images/logos/runners/dataflow.png"
          alt="Google Cloud Dataflow">
-    
+
 **Note:** You can always execute your pipeline locally for testing and debugging purposes.
 
 ## Get Started
diff --git a/src/get-started/downloads.md b/src/get-started/downloads.md
index b50da91..388173b 100644
--- a/src/get-started/downloads.md
+++ b/src/get-started/downloads.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Beam Releases"
 permalink: get-started/downloads/
+section_menu: section-menu/get-started.html
 redirect_from:
   - /get-started/releases/
   - /use/releases/
diff --git a/src/get-started/index.md b/src/get-started/index.md
index 4748536..41bfd57 100644
--- a/src/get-started/index.md
+++ b/src/get-started/index.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Use Beam"
 permalink: /get-started/
+section_menu: section-menu/get-started.html
 redirect_from:
   - /use/
   - /docs/use/
diff --git a/src/get-started/mobile-gaming-example.md b/src/get-started/mobile-gaming-example.md
index b8a3957..bcc16b3 100644
--- a/src/get-started/mobile-gaming-example.md
+++ b/src/get-started/mobile-gaming-example.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Beam Mobile Gaming Example"
 permalink: /get-started/mobile-gaming-example/
+section_menu: section-menu/get-started.html
 redirect_from: /use/mobile-gaming-example/
 ---
 
diff --git a/src/get-started/quickstart-java.md b/src/get-started/quickstart-java.md
index 3c2fb82..8ffe261 100644
--- a/src/get-started/quickstart-java.md
+++ b/src/get-started/quickstart-java.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Beam Quickstart for Java"
 permalink: /get-started/quickstart-java/
+section_menu: section-menu/get-started.html
 redirect_from:
   - /get-started/quickstart/
   - /use/quickstart/
@@ -235,4 +236,3 @@ barrenly: 1
 * Join the Beam [users@]({{ site.baseurl }}/get-started/support#mailing-lists) mailing list.
 
 Please don't hesitate to [reach out]({{ site.baseurl }}/get-started/support) if you encounter any issues!
-
diff --git a/src/get-started/quickstart-py.md b/src/get-started/quickstart-py.md
index cae9db9..4f5323a 100644
--- a/src/get-started/quickstart-py.md
+++ b/src/get-started/quickstart-py.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Beam Quickstart for Python"
 permalink: /get-started/quickstart-py/
+section_menu: section-menu/get-started.html
 ---
 
 # Apache Beam Python SDK Quickstart
@@ -125,4 +126,3 @@ python -m apache_beam.examples.wordcount --input gs://dataflow-samples/shakespea
 * Join the Beam [users@]({{ site.baseurl }}/get-started/support#mailing-lists) mailing list.
 
 Please don't hesitate to [reach out]({{ site.baseurl }}/get-started/support) if you encounter any issues!
-
diff --git a/src/get-started/support.md b/src/get-started/support.md
index b3c7316..64f53d3 100644
--- a/src/get-started/support.md
+++ b/src/get-started/support.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Support"
 permalink: /get-started/support/
+section_menu: section-menu/get-started.html
 redirect_from:
   - /use/issue-tracking/
   - /use/mailing-lists/
@@ -71,5 +72,3 @@ You can find answers to many questions about [Beam on Stack Overflow](http://sta
 ## Beam Slack Channel
 
 You can participate in discussions and ask questions on the [Beam Slack Channel](https://apachebeam.slack.com/).
-
-
diff --git a/src/get-started/wordcount-example.md b/src/get-started/wordcount-example.md
index 8b37937..82d64b0 100644
--- a/src/get-started/wordcount-example.md
+++ b/src/get-started/wordcount-example.md
@@ -1,7 +1,8 @@
 ---
-layout: default
+layout: section
 title: "Beam WordCount Examples"
 permalink: get-started/wordcount-example/
+section_menu: section-menu/get-started.html
 redirect_from: /use/wordcount-example/
 ---
 
@@ -913,4 +914,3 @@ results and writes them to a BigQuery table using `BigQueryIO.Write`.
 ```py
 # This feature is not yet available in the Beam SDK for Python.
 ```
-
diff --git a/src/js/fix-menu.js b/src/js/fix-menu.js
new file mode 100644
index 0000000..535500a
--- /dev/null
+++ b/src/js/fix-menu.js
@@ -0,0 +1,64 @@
+$(document).ready(function() {
+  function FixMenu(conf) {
+    var idMenu = conf["classNameMenu"];
+    var CONST = {
+      DESKTOP_BREAKPOINT: 1024
+    };
+
+    return {
+      "idMenu": idMenu,
+      "menuConfig": {},
+
+      "bindEvents": function() {
+        var _self = this;
+
+        $(window).scroll(function(e) {
+          if($(window).width() > CONST.DESKTOP_BREAKPOINT) {
+            var scroll = $(window).scrollTop();
+            var scrollMenu = scroll + $("." + idMenu).height() + _self.menuConfig.offsetTop;
+            var scrollHeight = scroll + $(window).height();
+            var bodyHeightOffset = $('body')[0].scrollHeight - _self.menuConfig.offsetBottom;
+
+            if (scroll <= _self.menuConfig.offsetTop) {
+              $("." + idMenu).css({
+                top: '',
+                bottom: ''
+              });
+            } else if (scroll > _self.menuConfig.offsetTop && scrollMenu < bodyHeightOffset) {
+              $("." + idMenu).css({
+                top: _self.menuConfig.offsetTop,
+                bottom: ''
+              });
+            } else if (scrollMenu >= bodyHeightOffset) {
+              $("." + idMenu).css({
+                top: '',
+                bottom: scrollHeight - bodyHeightOffset
+              });
+            }
+          } else {
+            $("." + idMenu).css({
+              top: '',
+              bottom: ''
+            });
+          }
+        });
+
+        $(window).resize(function(e) {
+          if($(window).width() <= CONST.DESKTOP_BREAKPOINT) {
+            $("." + idMenu).css({
+              top: '',
+              bottom: ''
+            });
+          }
+        });
+      },
+      "init": function() {
+        this.menuConfig = $("." + this.idMenu).data();
+        this.bindEvents();
+      }
+    }
+  }
+
+  FixMenu({"classNameMenu":"section-nav"}).init();
+  FixMenu({ "classNameMenu":"page-nav" }).init();
+});
diff --git a/src/js/language-switch.js b/src/js/language-switch.js
index a402146..d183f81 100644
--- a/src/js/language-switch.js
+++ b/src/js/language-switch.js
@@ -80,13 +80,26 @@ $(document).ready(function() {
             },
             "toggle": function() {
                 var pref=localStorage.getItem(this.dbKey) || this.default;
+                var isPrefSelected = false;
+
                 // Adjusting active elements in navigation header.
                 $("." + this.wrapper + " li").removeClass("active").each(function() {
                     if ($(this).data("type") === pref) {
                         $(this).addClass("active");
+                        isPrefSelected = true;
                     }
                 });
 
+                if(!isPrefSelected) {
+                  pref = this.default;
+                  
+                  $("." + this.wrapper + " li").each(function() {
+                      if ($(this).data("type") === pref) {
+                          $(this).addClass("active");
+                      }
+                  });
+               }
+
                 // Swapping visibility of code blocks.
                 $(this.selector).hide();
                 $("nav"+this.selector).show();
diff --git a/src/js/page-nav.js b/src/js/page-nav.js
new file mode 100644
index 0000000..a40cf0f
--- /dev/null
+++ b/src/js/page-nav.js
@@ -0,0 +1,53 @@
+$(document).ready(function() {
+  function PageNav(conf) {
+    var idPageNav = conf["classNamePageNav"];
+    var idMainContainer = conf["classNameMainContainer"];
+
+    var CONST = {
+      DESKTOP_BREAKPOINT: 1024,
+      PAGENAV_WIDTH: 240
+    };
+
+    return {
+      "idPageNav": idPageNav,
+      "idMainContainer": idMainContainer,
+
+      "setPageNav": function() {
+        var mainContainerData = {
+          width: $("." + idMainContainer).width(),
+          offset: $("." + idMainContainer).offset()
+        };
+
+        if($(window).width() > CONST.DESKTOP_BREAKPOINT) {
+          $("." + idPageNav).css({
+            left: mainContainerData.offset.left +  mainContainerData.width - CONST.PAGENAV_WIDTH
+          });
+        } else {
+          $("." + idPageNav).css({
+            left: 0
+          });
+        }
+      },
+
+      "bindEvents": function() {
+        var _self = this;
+
+        $(window).resize(function() {
+          _self.setPageNav();
+        });
+      },
+
+      "init": function() {
+        this.bindEvents();
+        this.setPageNav();
+      }
+    }
+  }
+
+  PageNav(
+    {
+      "classNamePageNav":"page-nav",
+      "classNameMainContainer": "container-main-content"
+    }
+  ).init();
+});
diff --git a/src/js/section-nav.js b/src/js/section-nav.js
new file mode 100644
index 0000000..9676d74
--- /dev/null
+++ b/src/js/section-nav.js
@@ -0,0 +1,87 @@
+$(document).ready(function() {
+  function Navbar(conf) {
+    var idCTA = conf["classNameCTA"],
+        idContainer = conf["classNameContainer"],
+        idNavMask = conf["classNameMask"],
+        idBackCTA = conf["classNameBackCTA"],
+        idSectionNav = conf["classNameSectionNav"];
+
+    var CONST = {
+      OPEN_CLASS: "open",
+      DESKTOP_BREAKPOINT: 1024
+    };
+
+    return {
+      "idCTA": idCTA,
+      "idContainer": idContainer,
+      "idNavMask": idNavMask,
+      "idSectionNav": idSectionNav,
+      "idBackCTA": idBackCTA,
+      "hasSectionNav": false,
+
+      "bindEvents": function() {
+          var _self = this;
+          var sectionNavEl = $("." + idSectionNav);
+          var sectionNavHeight = $(sectionNavEl).height();
+
+          $(".container-main-content").css({"min-height": sectionNavHeight});
+
+          $(window).resize(function() {
+            if($(window).width() > CONST.DESKTOP_BREAKPOINT) {
+              var sectionNavHeight = $(sectionNavEl).height();
+              $(".container-main-content").css({"min-height": sectionNavHeight});
+            }else {
+              $(".container-main-content").css({"min-height": ''});
+            }
+          });
+
+          if(_self.hasSectionNav) {
+            $("." + _self.idCTA ).click(function(el) {
+              $("." + _self.idNavMask).addClass(CONST.OPEN_CLASS);
+              $("." + _self.idSectionNav).addClass(CONST.OPEN_CLASS);
+            });
+
+            $("." + _self.idBackCTA).click(function(el) {
+              $("." + _self.idSectionNav).removeClass(CONST.OPEN_CLASS);
+              $("." + _self.idContainer).addClass(CONST.OPEN_CLASS);
+            });
+          } else {
+            $("." + _self.idCTA ).click(function(el) {
+              $("." + _self.idNavMask).addClass(CONST.OPEN_CLASS);
+              $("." + _self.idContainer).addClass(CONST.OPEN_CLASS);
+            });
+          }
+
+          $("." + _self.idNavMask ).click(function(el) {
+            $("." + _self.idNavMask).removeClass(CONST.OPEN_CLASS);
+            $("." + _self.idContainer).removeClass(CONST.OPEN_CLASS);
+
+            if(_self.hasSectionNav) {
+              $("." + _self.idSectionNav).removeClass(CONST.OPEN_CLASS);
+            }
+          });
+      },
+      "findSectionNav": function() {
+        var sectionNavEl = $('body').find("[data-section-nav]");
+
+        if(sectionNavEl.length) {
+          this.hasSectionNav = true;
+        }
+      },
+      "init": function() {
+        this.findSectionNav();
+        this.bindEvents();
+      }
+    }
+  }
+
+  Navbar(
+    {
+      "classNameContainer":"navbar-container",
+      "classNameSectionNav": "section-nav",
+      "classNameBackCTA": "section-nav-back",
+      "classNameCTA": "navbar-toggle",
+      "classNameMask": "navbar-mask"
+    }
+  ).init();
+});

-- 
To stop receiving notification emails like this one, please contact
"commits@beam.apache.org" <commits@beam.apache.org>.

Mime
View raw message