Add frontpage Mobile + MegaMenu + Pages Fixes
diff --git a/public/arch/clustering.html b/public/arch/clustering.html
index 4253054..f23ed85 100644
--- a/public/arch/clustering.html
+++ b/public/arch/clustering.html
@@ -8,10 +8,10 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/deployment-opts.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -50,35 +50,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -126,7 +281,7 @@
         <article class="nativebotblock nativebotblock--learn">
           <h3 class="h4 nativebotblock__title"><img class="nativebotblock__icon" src="/img/features/native-docs.svg" alt="" /><span>Want To Learn More?</span></h3>
           <p class="nativebotblock__text">Read Native Persistence article</p>
-          <a class="nativebotblock__link arrowlink" href="/arch/native-persistence.html" target="_blank">Native Persistence</a>
+          <a class="nativebotblock__link arrowlink" href="/arch/native-persistence.html">Native Persistence Article</a>
         </article>
       </div>
     </section>
diff --git a/public/arch/multi-tier-storage.html b/public/arch/multi-tier-storage.html
index 8218514..cb005de 100644
--- a/public/arch/multi-tier-storage.html
+++ b/public/arch/multi-tier-storage.html
@@ -8,10 +8,10 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/multi-tier.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -50,35 +50,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -145,12 +300,13 @@
             <div class="multitiervid__link pb-2"><span>In-Memory + External Database Mode Case-Study</span></div>
             <article class="comvideo">
               <div class="comvideo__box">
-                <a class="comvideo__screen" href="" target="_blank"
-                  ><span class="comvideo__txt comvideo__txt--small">In-Memory + External <br />Database Mode Case-Study</span><img src="/img/features/multitier/video-2.png" alt=""
+                <a class="comvideo__screen" href="https://www.youtube.com/watch?v=CPmwnjDJ1Sk" data-youtube="data-youtube"
+                  ><span class="comvideo__txt comvideo__txt--small">Embracing The Service Consumption Shift In&nbsp;Banking</span><img src="/img/poweredby/videos/006.png" alt=""
                 /></a>
               </div>
-              <div class="comvideo__descr pt-1"><div class="multitiervid__descr">Short description</div></div>
+              <div class="comvideo__descr pt-1"></div>
             </article>
+            <div class="multitiervid__descr">ING core banking system transformation with Apache Ignite.</div>
           </div>
         </div>
         <div class="multitiers__right">
diff --git a/public/arch/native-persistence.html b/public/arch/native-persistence.html
index da6d8bc..fc93e13 100644
--- a/public/arch/native-persistence.html
+++ b/public/arch/native-persistence.html
@@ -8,12 +8,12 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../js/vendor/highlight/default.min.css" />
     <link rel="stylesheet" href="../js/vendor/highlight/night-owl.css" />
     <script src="../js/vendor/highlight/highlight.min.js"></script>
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -52,35 +52,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
diff --git a/public/community.html b/public/community.html
index 8b6bb47..d39f568 100644
--- a/public/community.html
+++ b/public/community.html
@@ -8,6 +8,7 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
+    <link rel="stylesheet" href="../css/communnity.css" />
     <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
     <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
@@ -47,36 +48,191 @@
       </div>
     </div>
     <!-- MOBILE MENU END -->
-    <header class="hdr">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
+    <header class="hdr hdr__white">
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a class="hdrmenu__current" href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a class="hdrmenu__current" href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="cmtyhero">
       <div class="container">
         <div class="cmtyhero__main">
@@ -991,11 +1147,11 @@
           <div class="cmty-redstart__left">
             <h3 class="h4 pb-1">Project Awareness <br />Top Contributors</h3>
             <p class="h5 cmty-redstart__grey">Previous Quarter</p>
-            <h3 class="cmty-redstart__bottitle h5 pt-4 pb-3"><p>We do recognise and welcome non-code contributions. There are dozens of Apache Ignite community members who contribute this way</p></h3>
+            <h3 class="cmty-redstart__bottitle h5 pt-4 pb-3"><p>We do recognise and welcome non-code contributions. There are dozens of Apache Ignite community members who contribute this way.</p></h3>
           </div>
           <div class="cmty-redstart__botright">
             <iframe class="cmty-redstart__iframe themescroll" src="https://recognition-dev.gridgain.com/leaderboard-frame?limit=10&amp;interval=prev-quarter" frameborder="0"></iframe
-            ><a href="https://recognition.gridgain.com/main?product=ignite" target="_blank">See all contributors and contributions </a>
+            ><a href="https://recognition.gridgain.com/main?product=ignite" target="_blank">See all contributors </a>
           </div>
         </div>
       </div>
@@ -1006,7 +1162,7 @@
         <div class="cmty-ask__wrap flexi">
           <div class="cmty-ask__main">
             <h2 class="cmty-ask__title fz50 pb-3">Ask a Question</h2>
-            <div class="cmty-ask__text h5">Feel free to&nbsp;reach to&nbsp;our community if&nbsp;you have any <br />questions, doubts or&nbsp;proposals. There are a&nbsp;few <br />ways to&nbsp;do&nbsp;that</div>
+            <div class="cmty-ask__text h5">Feel free to&nbsp;reach to&nbsp;our community if&nbsp;you have any <br />questions, doubts or&nbsp;proposals. There are a&nbsp;few <br />ways to&nbsp;do&nbsp;that.</div>
           </div>
           <img class="cmty-ask__bg" src="/img/community/b15-askimg.svg" alt="" />
         </div>
diff --git a/public/css/communnity.css b/public/css/communnity.css
new file mode 100644
index 0000000..60823ae
--- /dev/null
+++ b/public/css/communnity.css
@@ -0,0 +1,835 @@
+.cmtyhero {
+    overflow: hidden;
+    height: calc(100vh - 96px);
+    display: flex;
+    flex-flow: column nowrap;
+    align-items: center;
+    justify-content: center;
+    min-height: 670px;
+    max-height: 800px;
+}
+.cmtyhero__img {
+    position: absolute;
+    right: 0px;
+    top: 50%;
+    transform: translateY(-50%);
+    width: 500px;
+    height: auto;
+    pointer-events: none;
+}
+.cmtyhero__main {
+    position: relative;
+    z-index: 10;
+    color: var(--dark);
+    display: flex;
+    flex-flow: column nowrap;
+    align-items: flex-start;
+    justify-content: flex-start;
+}
+.cmtyhero__h1 {
+    max-width: 725px;
+    font-size: 6rem;
+    line-height: 7rem;
+}
+.cmtyhero__text {
+    padding-top: 5rem;
+    max-width: 575px;
+    font-size: 2.4rem;
+    line-height: 3.6rem;
+}
+.cmtyhero__sub {
+    padding-top: 16rem;
+    font-size: 1.6rem;
+    line-height: 2.4rem;
+}
+.cmtyhistory {
+    padding-top: 11rem;
+    padding-bottom: 8rem;
+}
+.cmtyhistory1__title {
+    font-weight: 700;
+    font-size: 32px;
+    line-height: 1;
+}
+.cmtyhistory1__wrap {
+    padding-top: 10rem;
+}
+.cmtyhistory1__left {
+    width: 49%;
+    flex-shrink: 0;
+    flex-grow: 0;
+    position: relative;
+}
+.cmtyhistory1__left img {
+    margin-top: 50px;
+    margin-right: 112px;
+    display: block;
+    width: 335px;
+    max-width: 90%;
+    margin-left: auto;
+}
+.cmtyhistory__year {
+    position: absolute;
+    z-index: 10;
+    top: 8px;
+    left: 8px;
+    font-size: 4.8rem;
+    line-height: 1;
+    white-space: nowrap;
+}
+.cmtyhistory1__right {
+    flex-grow: 1;
+}
+.cmtyhistory1__h3 {
+    font-weight: 400;
+}
+.cmtyhistory__hr {
+    cursor: pointer;
+    margin-top: 35px;
+    margin-bottom: 35px;
+    height: 1px;
+    position: relative;
+    background: #e6e6e6;
+}
+.cmtyhistory__hr i, .cmtyhistory__hr span {
+    display: flex;
+    flex-flow: column nowrap;
+    align-items: center;
+    justify-content: center;
+    position: absolute;
+    left: 50%;
+    top: 0;
+    width: 30px;
+    height: 30px;
+    border-radius: 30px;
+    background-color: var(--grey2);
+    margin-top: -15px;
+    margin-left: -15px;
+    font-size: 20px;
+    z-index: 5;
+    user-select: none;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='%23000' d='M368 224H224V80c0-8.84-7.16-16-16-16h-32c-8.84 0-16 7.16-16 16v144H16c-8.84 0-16 7.16-16 16v32c0 8.84 7.16 16 16 16h144v144c0 8.84 7.16 16 16 16h32c8.84 0 16-7.16 16-16V288h144c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16z'%3E%3C/path%3E%3C/svg%3E");
+    background-repeat: no-repeat;
+    background-position: 50% 50%;
+    background-size: 12px;
+}
+.cmtyhistory__hr span {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='currentColor' d='M368 224H16c-8.84 0-16 7.16-16 16v32c0 8.84 7.16 16 16 16h352c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16z'%3E%3C/path%3E%3C/svg%3E");
+}
+.cmtyhistory__hr span {
+    display: none;
+}
+.cmtyhistory__hr.isopen span {
+    display: flex;
+}
+.cmtyhistory__hr.isopen i {
+    display: none;
+}
+.cmtyhistory__more {
+    height: auto;
+    transition: height 0.4s ease;
+    overflow: hidden;
+    height: 0;
+}
+.cmtyhistory__quote {
+    font-style: italic;
+    margin-top: 30px;
+    padding-top: 60px;
+    background: url(../img/community/b3-quote.svg) left top no-repeat;
+}
+.cmtyhistory__avaavtor {
+    align-items: center;
+}
+.cmtyhistory__ava {
+    display: block;
+}
+.cmtyhistory__ava img {
+    display: block;
+    border-radius: 200px;
+    width: 70px;
+    height: 70px;
+}
+.cmtyhistory__avaright:not(.cmtyhistory__avaright--noimg) {
+    padding-left: 20px;
+}
+.cmtyhistory__avaname {
+    font-weight: 700;
+    line-height: 28px;
+}
+.cmtyhistory__avaproff {
+    padding-top: 0px;
+    color: #898989;
+}
+.cmtyhistory2 {
+    padding-top: 70px;
+}
+.cmtyhistory2__wrap {
+    flex-flow: row-reverse nowrap;
+}
+.cmtyhistory__year--right {
+    left: auto;
+    right: 0;
+    top: 30px;
+}
+.cmtyhistory2__right {
+    width: 50%;
+    flex-shrink: 0;
+    flex-grow: 0;
+    position: relative;
+}
+.cmtyhistory2__right img {
+    display: block;
+    margin-left: auto;
+}
+.cmtyhistory2__left {
+    padding-top: 81px;
+}
+.cmtyhistory3 {
+    padding-top: 115px;
+}
+.cmtyhistory3__left {
+    width: 49%;
+    flex-shrink: 0;
+    flex-grow: 0;
+    position: relative;
+    padding-top: 50px;
+}
+.cmtyhistory3__right {
+    width: 49%;
+    flex-shrink: 0;
+    flex-grow: 0;
+    position: relative;
+    padding-top: 70px;
+}
+.cmtyhistory4 {
+    padding-top: 100px;
+}
+.cmtyhistory5 .cmtyhistory3__left {
+    padding-top: 0;
+}
+.cmtyhistory5 .cmtyhistory3__right {
+    padding-top: 60px;
+}
+.cmty-meet {
+    margin-top: 8rem;
+    background: var(--red5);
+    padding: 145px 0 140px;
+    overflow: hidden;
+}
+.cmty-meet__main {
+    max-width: 49%;
+}
+.cmty-meet__h2 {
+    font-size: 48px;
+    line-height: 1;
+}
+.cmty-meet__text {
+    font-size: 2.4rem;
+    line-height: 3.6rem;
+}
+.cmty-meet__sub {
+    padding-top: 175px;
+    max-width: 500px;
+}
+.cmty-meet__pic {
+    position: relative;
+    width: 400px;
+    margin-left: auto;
+}
+.cmty-meet__pic img {
+    display: block;
+    position: absolute;
+    top: 35px;
+    right: 0;
+}
+.cmty-contrib {
+    padding: 130px 0 70px;
+}
+.cmty-contrib__main {
+    max-width: 510px;
+}
+.cmty-contrib__pic {
+    position: relative;
+    width: 650px;
+    flex-grow: 0;
+    margin-left: auto;
+}
+.cmty-contrib__pic img {
+    display: block;
+    width: 100%;
+    margin-top: -30px;
+}
+.cmty-committers {
+    padding-bottom: 70px;
+}
+.cmty-committers__small {
+    display: block;
+    color: #9c9c9c;
+}
+.committers__wrap {
+    padding-top: 40px;
+    justify-content: space-between;
+}
+.committers__left, .committers__right {
+    width: calc(50% - 15px);
+    flex-grow: 0;
+    flex-shrink: 0;
+}
+.committer {
+    height: 6rem;
+    border-bottom: 1px solid #e5e5e5;
+    align-items: center;
+    padding: 0 2rem 0 2rem;
+}
+.committer__name {
+    max-width: 60%;
+    flex-grow: 0;
+    overflow: hidden;
+    margin-right: auto;
+}
+.committer__github {
+    display: block;
+    width: 30px;
+    margin: 0 10px;
+}
+.committer__apache {
+    display: block;
+    width: 30px;
+    margin: 0 5px 0 15px;
+}
+.committer__github img, .committer__apache img {
+    display: block;
+}
+.committers__morelink {
+    margin-top: 30px;
+    display: block;
+    margin-left: 20px;
+}
+.cmty-pm {
+    padding-top: 80px;
+    padding-bottom: 105px;
+}
+.cmty-pm__wrap {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    grid-auto-rows: 266px;
+    grid-gap: 30px;
+}
+.cmty-pmitem {
+    border: 1px solid var(--grey2);
+    box-sizing: border-box;
+    border-radius: 10px;
+    display: block;
+    position: relative;
+    padding: 40px 30px;
+}
+.cmty-pmitem__proff {
+    top: 15px;
+    right: 25px;
+    text-transform: uppercase;
+    height: 42px;
+    display: flex;
+    flex-flow: row nowrap;
+    align-items: center;
+    justify-content: center;
+    position: absolute;
+    font-size: 15px;
+}
+.cmty-pmitem__proff img {
+    margin-right: 6px;
+    width: 17px;
+    height: 17px;
+    display: block;
+}
+.cmty-pmitem__name {
+    font-weight: 400;
+    max-width: 80%;
+    min-height: 72px;
+}
+.cmty-pmitem__work {
+    color: #9c9c9c;
+    white-space: nowrap;
+    overflow: hidden;
+    display: block;
+}
+.cmty-pmitem__links {
+    position: absolute;
+    bottom: 45px;
+    left: 35px;
+}
+.cmty-pmitem__links img {
+    display: block;
+    width: 30px;
+    height: auto;
+    height: 30px;
+    object-fit: contain;
+}
+.cmty-pmitem__github {
+    margin-right: 20px;
+}
+.cmty-pmitem__apache {
+    margin-right: 20px;
+}
+.cmty-pm__more .jsOpenerWrap {
+    padding-top: 30px;
+}
+.cmty-pm__morelink {
+    display: block;
+    width: 80px;
+    text-align: center;
+    text-align: center;
+    margin: 30px auto 0;
+}
+.cmty-startcont {
+    background: #e8f2fa;
+    padding: 90px 0 90px;
+}
+.cmty-startcont__wrap {
+    align-items: stretch;
+}
+.cmty-startcont__main {
+    display: flex;
+    flex-flow: column nowrap;
+    align-items: stretch;
+    justify-content: flex-start;
+    max-width: 540px;
+    padding-top: 65px;
+}
+.cmty-startcont__pic {
+    margin-left: auto;
+    flex-grow: 0;
+}
+.cmty-startcont__pic img {
+    width: 614px;
+    display: block;
+}
+.cmty-docs {
+    padding: 130px 0 90px;
+}
+.cmty-docs__wrap {
+    justify-content: space-between;
+    align-items: stretch;
+}
+.cmty-docblock, .tplbox {
+    background-color: #fafdff;
+    border: 1px solid var(--grey2);
+    box-sizing: border-box;
+    border-radius: 10px;
+    padding: 40px 50px;
+    position: relative;
+}
+.cmty-docblock {
+    width: calc(50% - 15px);
+    min-height: 450px;
+}
+.cmty-docblock::before, .tplbox::before {
+    position: absolute;
+    border-radius: 0px 30px 30px 0px;
+    width: 12px;
+    height: 60px;
+    background: var(--blue);
+    content: "";
+    display: block;
+    left: 0;
+    top: 35px;
+}
+.cmty-docblock__icon, .tplbox__icon {
+    position: absolute;
+    width: 34px;
+    height: 41px;
+    display: block;
+    left: 50px;
+    top: 44px;
+}
+.cmty-docblock__icon img {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+}
+.cmty-docblock__title {
+    font-weight: 400;
+    padding-top: 75px;
+}
+.cmty-docblock__list {
+    padding-top: 30px;
+}
+.cmty-docblock__list li {
+    margin-bottom: 5px;
+    margin-bottom: 10px;
+    position: relative;
+    padding-left: 21px;
+}
+.cmty-docblock__list li::before {
+    content: "";
+    display: block;
+    position: absolute;
+    left: 0;
+    top: 1.2rem;
+    height: 1px;
+    width: 15px;
+    background: #000;
+}
+.cmty-docblock--bg {
+    background: url(../img/community/b9-wave.svg) right bottom no-repeat;
+    background-color: #fafdff;
+}
+.cmty-ready {
+    overflow: hidden;
+}
+.cmty-ready__wrap {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    grid-gap: 30px;
+    grid-auto-rows: auto;
+}
+.cmty-ready__item {
+    border: 1px solid var(--grey2);
+    box-sizing: border-box;
+    border-radius: 10px;
+    position: relative;
+    min-height: 240px;
+    padding: 20px 25px;
+}
+.cmty-ready__item::before {
+    position: absolute;
+    border-radius: 0px 30px 30px 0px;
+    width: 12px;
+    height: 45px;
+    background: var(--blue);
+    content: "";
+    display: block;
+    left: -1px;
+    top: 20px;
+}
+.cmty-ready__item i {
+    display: block;
+    font-style: normal;
+    font-weight: 400;
+    font-size: 40px;
+    line-height: 45px;
+    margin-bottom: 30px;
+}
+.cmty-ready__openlink {
+    color: var(--blue);
+    border-bottom: 1px dotted var(--blue);
+    position: relative;
+    display: inline;
+    cursor: pointer;
+}
+.cmty-ready__openlink::after {
+    content: "";
+    display: inline-block;
+    position: relative;
+    margin-left: 4px;
+    width: 10px;
+    height: 10px;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%230070CC' d='M441.9 167.3l-19.8-19.8c-4.7-4.7-12.3-4.7-17 0L224 328.2 42.9 147.5c-4.7-4.7-12.3-4.7-17 0L6.1 167.3c-4.7 4.7-4.7 12.3 0 17l209.4 209.4c4.7 4.7 12.3 4.7 17 0l209.4-209.4c4.7-4.7 4.7-12.3 0-17z'%3E%3C/path%3E%3C/svg%3E");
+    background-repeat: no-repeat;
+    background-size: contain;
+    transition: transform 0.4s ease;
+}
+.cmty-ready__openlink.isopen::after {
+    transform: rotate(180deg);
+}
+.cmty-ready__hider {
+    margin-top: 1rem;
+    transition: height 0.4s ease;
+    overflow: hidden;
+    height: 0;
+    font-size: 1.5rem;
+}
+.cmty-ready__bottom {
+    padding-top: 80px;
+    padding-bottom: 80px;
+}
+.cmty-ready__botttl {
+    width: 25%;
+    flex-shrink: 0;
+    flex-grow: 0;
+    padding-right: 22px;
+}
+.cmty-ready__botlinks {
+    font-weight: 400;
+}
+.cmty-ready__botlinks a {
+    display: inline-block;
+    margin-bottom: 1rem;
+}
+.cmty-ready__screens {
+    flex-basis: 740px;
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-auto-rows: auto;
+    grid-gap: 10px;
+    flex-grow: 0;
+    flex-shrink: 0;
+}
+.cmty-ready__screens img, .cmty-ready__screens a {
+    display: block;
+    width: 100%;
+    height: auto;
+}
+.cmty-ready__more {
+    display: flex;
+    flex-flow: column nowrap;
+    align-items: stretch;
+    justify-content: center;
+    align-self: stretch;
+    background: url(../img/community/b11-stat-2.png) no-repeat;
+    background-size: contain;
+    flex-grow: 1;
+    flex-shrink: 1;
+}
+.cmty-ready__more a {
+    display: block;
+    margin: auto;
+}
+.cmty-red {
+    padding-top: 90px;
+}
+.cmty-red__wrap {
+    padding-top: 54px;
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-auto-rows: 450px;
+    grid-gap: 3rem;
+}
+.cmty-redblock {
+    width: 100%;
+    background: #fff7f7;
+    padding-top: 105px;
+    padding-left: 60px;
+}
+.cmty-redblock .tplbox__icon {
+    left: 60px;
+}
+.cmty-redblock .h4 {
+    font-weight: 400;
+}
+.cmty-redblock::before {
+    background: var(--red);
+}
+.cmty-red__wrap--bg {
+    background-image: url(../img/community/b12-lines.svg);
+    background-repeat: no-repeat;
+    background-position: right bottom;
+}
+.cmty-redblock__questimg {
+    width: 48px;
+    height: 48px;
+}
+.cmty-redstart {
+    padding-top: 9rem;
+    padding-bottom: 4rem;
+}
+.cmty-redstart__wrap {
+    display: grid;
+    grid-template-columns: 2fr 3fr;
+    grid-auto-rows: auto;
+    grid-gap: 18px;
+}
+.cmty-redstep {
+    border: 1px solid var(--grey2);
+    box-sizing: border-box;
+    border-radius: 10px;
+    position: relative;
+    padding: 35px 35px;
+    background: #fff;
+    z-index: 10;
+}
+.cmty-redstep--1 {
+    grid-row: span 2;
+    max-width: 433px;
+    padding-top: 101px;
+    position: relative;
+}
+.cmty-redstep--1::after {
+    content: "";
+    display: block;
+    position: absolute;
+    top: 50%;
+    transform: translateY(-60%);
+    left: 100%;
+    width: 115px;
+    height: 165px;
+    background: url(../img/community/b13-lines.svg) no-repeat;
+    background-size: contain;
+}
+.cmty-redstep--2, .cmty-redstep--3 {
+    min-height: 150px;
+    width: 728px;
+    max-width: 100%;
+    margin-left: auto;
+    background: url(../img/community/b13-bg-squares.svg) #fff right bottom no-repeat;
+    background-size: 140px;
+    padding: 33px 210px 20px 115px;
+}
+.cmty-redstep--3 {
+    background-image: url(../img/community/b13-bg-roundes.svg);
+    background-size: 105px;
+    padding-right: 140px;
+}
+.cmty-redstep::before {
+    position: absolute;
+    border-radius: 0px 30px 30px 0px;
+    width: 13px;
+    height: 43px;
+    background: var(--red);
+    content: "";
+    display: block;
+    left: -1px;
+    top: 35px;
+}
+.cmty-redstep i {
+    font-size: 40px;
+    position: absolute;
+    left: 37px;
+    top: 36px;
+    line-height: 43px;
+}
+.cmty-redstep__h3 {
+    font-size: 16px;
+    line-height: 1;
+    padding-bottom: 8px;
+}
+.cmty-redstart__bottom {
+    padding-top: 8rem;
+    padding-bottom: 8px;
+    align-items: flex-start;
+}
+.cmty-redstart__left {
+    width: 50%;
+    flex-shrink: 0;
+    flex-grow: 0;
+}
+.cmty-redstart__grey {
+    color: var(--grey4)
+}
+.cmty-redstart__botright {
+    width: 40%;
+    border: 1px solid #ededed;
+    box-sizing: border-box;
+    border-radius: 10px;
+    margin-left: auto;
+    display: flex;
+    flex-flow: column nowrap;
+    align-items: center;
+    justify-content: center;
+    padding: 3rem 3rem 2rem;
+    background: #fff;
+}
+.cmty-redstart__botright a {
+    margin-top: 2rem;
+}
+.cmty-redstart__botpic {
+    display: block;
+    width: 100%;
+    margin: auto;
+    height: auto;
+    border-radius: 1rem;
+}
+.cmty-redstart__iframe {
+    width: 100%;
+    height: 415px;
+    display: block;
+    border: none;
+}
+.cmty-ask {
+    margin-top: 12rem;
+    background: #f4f4f4;
+    padding: 140px 0 110px;
+    overflow: hidden;
+}
+.cmty-ask__title {
+    font-weight: 400;
+}
+.cmty-ask__wrap {
+    align-items: flex-start;
+}
+.cmty-ask__bg {
+    margin-left: auto;
+    flex-shrink: 0;
+    flex-basis: 529px;
+    height: auto;
+    flex-shrink: 1;
+    flex-grow: 0;
+}
+.faq {
+    padding-top: 13rem;
+    padding-bottom: 8rem;
+}
+.faqblock {
+    padding-bottom: 115px;
+}
+.faqblock:last-child {
+    padding-bottom: 0;
+}
+.faqblock__title {
+    width: calc(42% - 15px);
+    flex-shrink: 0;
+    position: relative;
+    padding-left: 70px;
+}
+.faqblock__title--simple {
+    padding-left: 0;
+}
+.faqblock__title img {
+    display: block;
+    position: absolute;
+    left: 0;
+    top: 50%;
+    transform: translateY(-50%);
+    width: 48px;
+    height: auto;
+}
+.faqblock__right {
+    flex-grow: 1;
+    padding-top: 10px;
+    max-width: 540px;
+}
+.faqblock__right h4 {
+    font-size: initial;
+    line-height: 1;
+    font-weight: 700;
+    padding-bottom: 10px;
+}
+.faqblock__buttons {
+    align-items: stretch;
+}
+.faqblock__button {
+    height: 40px;
+    display: inline-flex;
+    flex-flow: row nowrap;
+    align-items: center;
+    justify-content: center;
+    border: 1px solid #2d2d2d;
+    box-sizing: border-box;
+    border-radius: 10px;
+    margin-right: 24px;
+    padding: 0 16px;
+    color: #000;
+    text-decoration: none !important;
+}
+.faqblock__button:hover {
+    color: #fff;
+    background: #2d2d2d;
+    text-decoration: none;
+}
+.faqblock__button img {
+    display: block;
+    margin-right: 8px;
+    flex-shrink: 0;
+    width: 22px;
+}
+.faqblock__button:hover img {
+    filter: grayscale(1) invert(1);
+}
+img.faqblock__eicon {
+    margin-right: 6px;
+    transform: translateY(1px);
+}
+img.faqblock__stackicon {
+    margin-right: 14px;
+    width: 20px;
+}
\ No newline at end of file
diff --git a/public/css/frontpage.css b/public/css/frontpage.css
index b0d6855..42e1f50 100644
--- a/public/css/frontpage.css
+++ b/public/css/frontpage.css
@@ -1,6 +1,11 @@
 .fronttop{
     overflow: hidden;
-    background: url(../img/frontpage/hero.svg) var(--dark) right top no-repeat;
+    background: url(../img/frontpage/hero.svg) var(--dark) calc(50% + 405px) top no-repeat;
+}
+@media (min-width:1600px){
+    .fronttop{
+        background-position: right top;
+    }
 }
 .fronttop .hdr{
     background: none;
@@ -8,6 +13,7 @@
 .fronthero {
     background: none;
     padding-bottom: 19rem;
+    padding-top: 9rem;
 }
 .fronthero__button{
     width: 190px;
@@ -23,7 +29,7 @@
 .fronttopcards {
     align-items: stretch;
     justify-content: space-between;
-    transform: translateY(-65px);
+    transform: translateY(-60px);
 }
 .frontcard {
     width: calc(50% - 15px);
@@ -40,6 +46,7 @@
     align-items: center;
 }
 .frontcard__iconwrap {
+    flex-shrink: 0;
     width: 7rem;
     height: 7rem;
     display: flex;
@@ -71,16 +78,16 @@
 
 
 .forntcodes {
-    padding-top: calc(14rem - 65px);
+    padding-top: calc(15rem - 65px);
     padding-bottom: 10rem;
 }
 .forntcodes__menu {
-    padding-top: 2.5rem;
+    padding-top: 3.2rem;
     width: 30rem;
     flex-shrink: 0;
 }
 .forntcodes__menu li:not(:last-child){
-    margin-bottom: 4rem;
+    margin-bottom: 4.3rem;
 }
 .forntcodes__menu ul a{
     display: block;
@@ -124,10 +131,15 @@
 .forntcodes__tabwraps {
     position: relative;
     min-width: 0;
+    flex-grow: 1;
+    max-width: 866px;
 }
 .forntcodes__tab {
     display: none;
 }
+.forntcodes__tab>p{
+    max-width: 750px;
+}
 .forntcodes__tab.active{
     display: block;
 }
@@ -168,7 +180,16 @@
     grid-auto-rows: auto;
     grid-gap: 3rem;
 }
-
+.frontsimplecard{
+    padding: 4rem 3.5rem 13rem;
+}
+.frontsimplecard .cardsimple__title{
+    padding-bottom: 2rem;
+}
+.frontsimplecard .cardsimple__bottom{
+    left: 3.5rem;
+    bottom: 3.5rem;
+}
 
 
 
@@ -226,6 +247,20 @@
 .ctrl--next img{
     transform: rotate(180deg);
 }
+
+@media (max-width:1439px){
+    .jsFrontVideosSwiper {
+        margin-left: 20px;
+        margin-right: 20px;
+    }
+    .ctrl--prev{
+        left: -30px;
+    }
+    .ctrl--next{
+        right: -30px;
+    }
+}
+
 .frontstories__pag{
     position: absolute;
     width: 100%;
@@ -241,7 +276,7 @@
     display: none;
 }
 .swiper-pagination-bullet{
-    width: 40px;
+    width: 20px;
     border-radius: 0;
     opacity: 1;
     background: var(--grey2);
@@ -363,7 +398,7 @@
     line-height: 1.3;
 }
 .frontresourse__wrap {
-    padding-top: 9rem;
+    padding-top: 10rem;
     justify-content: space-between;
 }
 .frontresourse__col {
@@ -414,13 +449,299 @@
     margin-top: 6rem;
 }
 .toolingend--front .toolingend__main{
-    padding-bottom: 1rem;
+    min-height: auto;
+    padding: 6rem 0 6rem 8rem;
 }
 .toolingend--front .button{
     padding-left: 4rem;
     padding-right: 4rem;
 }
 .toolingend--front .toolingend__action{
-    margin-right: 8rem;
     margin-left: auto;
-}
\ No newline at end of file
+    font-size: 20px;
+    padding-right: 8rem;
+    margin-right: 0;
+}
+.toolingend--front .button{
+    font-size: 20px;
+    height: 60px;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+@media (max-width:1199px){
+    .fronttop{
+        background-position-x: calc(50% + 260px);
+    }
+    .frontcard__prises{
+        align-items: flex-start;
+        margin-bottom: -2rem;
+    }
+    .frontcard__price{
+        flex-flow: column nowrap;
+        align-items: flex-start;
+        justify-content: flex-start;
+    }
+    .frontcard__iconwrap{
+        width: 6rem;
+        height: 6rem;
+        margin-bottom: 1rem;
+    }
+    .frontcard__iconwrap img{
+        width: 60%;
+        height: 60%;
+    }
+    .frontconfs__wrap{
+        grid-gap: 15px;
+    }
+    .frontconfcard{
+        padding-left: 15px;
+        padding-right: 15px;
+    }
+    .frontresitem__icon{
+        left: 2rem;
+    }
+    .frontresitem__text{
+        font-size: 15px;
+    }
+    .toolingend--front .toolingend__main{
+        padding-left: 3rem;
+    }
+    .toolingend--front .toolingend__action{
+        padding-right: 3rem;
+    }
+} /* END MEDIA 1199px */
+
+
+
+
+
+
+
+
+
+
+@media (max-width:992px){
+    .forntcodes__menu{
+        width: 25rem;
+    }
+    .frontconfs__wrap{
+        grid-gap: 3rem;
+        grid-template-columns: 1fr;
+    }
+    .frontnewcards__wrap{
+        grid-gap: 3rem;
+        grid-template-columns: 1fr;
+    }
+    .frontresourse{
+        padding-bottom: 0;
+    }
+    .frontresourse__wrap{
+        flex-flow: column nowrap;
+    }
+    .frontresourse__col{
+        width: 100%;
+    }
+    .frontresourse__col:first-child{
+        padding-bottom: 6rem;
+    }
+    .frontresourse__col .capstext{
+        padding-bottom: 2rem;
+    }
+    .toolingend--front{
+        padding-bottom: 5rem;
+    }
+    .toolingend--front .container{
+        padding: 5rem;
+        border-radius: 1rem;
+    }
+    .toolingend--front .toolingend__main{
+        padding: 0;
+    }
+    .toolingend--front .toolingend__action{
+        margin-left: 0;
+    }
+} /* END MEDIA 992px */
+
+
+
+
+
+
+
+
+
+@media (max-width:767px){
+    .fronthero{
+        padding-top: 7rem;
+        padding-bottom: 17rem;
+    }
+    .fronthero .innerhero__pre{
+        line-height: 1.8;
+        max-width: 80%;
+    }
+    .fronthero .h1{
+        font-size: 6rem;
+    }
+    .fronthero .innerhero__action {
+        padding-top: 3rem;
+    }
+    .fronthero__button{
+        font-size: 16px;
+    }
+    .fronttopcards{
+        flex-flow: column nowrap;
+        align-items: stretch;
+    }
+    .frontcard{
+        width: 100%;
+        padding: 3rem;
+    }
+    .frontcard:first-child{
+        border-radius: 1rem 1rem 0 0;
+        border-bottom: 1px solid var(--grey3);
+    }
+    .frontcard:last-child{
+        border-radius: 0 0 1rem 1rem;
+    }
+    .frontcard__prises{
+        margin-bottom: 0;
+    }
+    .frontcard__network img{
+        width: 6rem;
+        height: 6rem;
+    }
+    .frontcard__title.pt-3{
+        padding-top: 2rem;
+    }
+    .forntcodes{
+        padding-top: 0;
+        padding-bottom: 7rem;
+    }
+    .forntcodes br,
+    .frontconfs br,
+    .frontresourse br{
+        display: none;
+    }
+    .forntcodes__wrap {
+        flex-flow: column nowrap;
+    }
+    .forntcodes__menu{
+        width: 100%;
+    }
+    .forntcodes__menu li:not(:last-child){
+        margin-bottom: 2rem;
+    }
+    .forntcodes__menu a.active::before{
+        height: 3rem;
+        width: 3px;
+        margin-top: -1px;
+    }
+    .forntcodes__menu ul a.active{
+        padding-left: 2rem;
+        color:#000 !important;
+    }
+    .forntcodes__menumore{
+        display: none;
+    }
+    .forntcodes__tabwraps{
+        padding-top: 5rem;
+        width: 100%;
+        overflow: hidden;
+    }
+    .forntcodes__tabwraps .nativecode__link{
+        padding-left: 3rem;
+        padding-right: 3rem;
+        width: auto;
+    }
+    .forntcodes__bottom{
+        padding-top: 3rem;
+    }
+    .forntcodes__bottom .button{
+        font-size: 16px;
+    }
+    .frontnewcards{
+        padding-top: 7rem;
+        padding-bottom: 0;
+    }
+    .frontnewcards__wrap{
+        padding-top: 2rem;
+    }
+    .frontsimplecard{
+        padding: 3rem;
+    }
+    .frontsimplecard .cardsimple__bottom{
+        position: relative;
+        left: auto;
+        bottom: auto;
+    }
+    .frontstories{
+        padding-bottom: 0;
+    }
+    .frontstories__checkers{
+        padding-top:3rem;
+        grid-template-columns: 1fr;
+        grid-gap: 10px;
+    }
+    .frontstories__checkers li:nth-child(3){
+        grid-column: auto;
+    }
+    .ctrl--prev{
+        left: -7px;
+    }
+    .ctrl--next{
+        right: -7px;
+    }
+    .jsFrontVideosSwiper{
+        margin-left: 30px;
+        margin-right: 30px;
+    }
+    .frontstories__bottom{
+        padding-top: 3rem;
+    }
+    .frontconfs__wrap{
+        padding-top: 3rem;
+    }
+    .frontconfcard{
+        padding: 3rem 2rem;
+    }
+    .frontconfcard__bottom{
+        position: relative;
+        left: auto;
+        bottom: auto;
+        padding-left: 0;
+        padding-right: 0;
+        padding-bottom: 0;
+        padding-top: 3rem;
+    }
+    .fronteventsbanner{
+        padding-bottom: 0;
+    }
+    .frontresourse__wrap{
+        padding-top: 3rem;
+    }
+    .toolingend--front .container{
+        border-radius: 0;
+    }
+    .toolingend--front .button{
+        font-size: 17px;
+        width: 100%;
+    }
+    .toolingend--front .toolingend__action{
+        padding-right: 0;
+        padding-top: 4rem;
+    }
+} /* END MEDIA 767px */
\ No newline at end of file
diff --git a/public/css/media.css b/public/css/media.css
index 5b43635..166d438 100644
--- a/public/css/media.css
+++ b/public/css/media.css
@@ -3,7 +3,7 @@
 }
 
 /* === === === === === === === === COMMUNITY PAGE === === === === === === === === */
-.cmtyhero__wrap{
+.hdr__wrap{
     padding: 0 15px;
     height: 80px;
 }
@@ -415,7 +415,7 @@
     .hdr__dark .hdr__burger img{
         filter: invert(1);
     }
-    .cmtyhero__wrap{
+    .hdr__wrap{
         height: 65px;
     }
     .hdr__logo{
diff --git a/public/css/site.css b/public/css/site.css
index 4e22efd..c63ef87 100644
--- a/public/css/site.css
+++ b/public/css/site.css
@@ -20,12 +20,15 @@
 
 .hdr {
   border-bottom: 1px solid var(--grey3);
+  position: relative;
 }
-.cmtyhero__wrap {
+.hdr__wrap{
   padding: 0 45px;
   height: 96px;
   align-items: center;
   position: relative;
+  position: relative;
+  z-index: 120;
 }
 .hdr__logo {
   display: block;
@@ -52,6 +55,9 @@
   width: 100%;
   height: auto;
 }
+.hdr__logo--white{
+  display: none;
+}
 .hdr__button {
   margin-left: auto;
   white-space: nowrap;
@@ -60,12 +66,19 @@
 .hdrmenu {
   position: absolute;
   z-index: 10;
-  top: 50%;
-  transform: translate(-50%, -50%);
+  top: 0;
+  height: 100%;
+  transform: translateX(-50%);
   left: 50%;
 }
+.hdrmenu>ul{
+  align-items: stretch;
+  height: 100%;
+}
 .hdrmenu li {
-  padding: 0 4rem;
+  padding: 0 1rem;
+  display: flex;
+  flex-flow: column nowrap;
 }
 .hdrmenu a {
   color: #000;
@@ -73,12 +86,56 @@
   line-height: 1.5;
   text-decoration: none;
   white-space: nowrap;
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  padding: 0 2rem;
+  position: relative;
+}
+a.hdrmenu--expanded:hover::before,
+a.hdrmenu--expanded.active::before{
+  content: "";
+  display: block;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  border-radius: 3px;
+  height: 3px;
+  background: #fff;
+}
+.hdr__white .hdrmenu a:hover::before,
+.hdr.opened .hdrmenu a:hover::before,
+.hdr__white .hdrmenu a.active::before,
+.hdr.opened .hdrmenu a.active::before{
+  background: var(--dark);
+}
+.hdrmenu--expanded::after{
+  margin-left: 6px;
+  content:"";
+  display: block;
+  width: 12px;
+  height: 9px;
+  position: relative;
+  background-image: url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 0L11.1962 9L0.803848 9L6 0Z' fill='%236E6E6E'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-size: contain;
+  transform: rotate(180deg);
+  transition: transform 0.25s ease;
+}
+.hdrmenu--expanded:hover::after{
+  filter:brightness(0);
+}
+.hdrmenu--expanded.active::after{
+  transform: rotate(0);
 }
 .hdrmenu__current {
   font-weight: 700;
 }
 .hdrmenu a:hover {
-  color: var(--blue2);
+  color: #000;
 }
 .hdr__blue,
 .hdr__dark{
@@ -88,25 +145,248 @@
 .hdr__dark{
   background: var(--dark);
 }
-.hdr__blue .hdrmenu a,
-.hdr__dark .hdrmenu a{
+.hdr:not(.hdr__white):not(.opened) .hdrmenu a{
   color: #fff;
 }
-.hdr__blue .hdrmenu a:hover,
-.hdr__dark .hdrmenu a:hover{
+.hdr:not(.hdr__white):not(.opened) .hdrmenu a:hover{
   color: #f2f2f2;
 }
-.hdr__blue .hdr__button {
+.hdr:not(.hdr__white):not(.opened) .hdr__button{
   background: #fff;
   color: var(--blue);
 }
-.hdr__blue .hdr__button:hover {
+.hdr:not(.hdr__white):not(.opened) .hdr__button:hover{
   background: var(--blue4);
 }
 .hdr__grey {
   background: #f1f1f1;
 }
 
+.hdr:not(.opened):not(.hdr__white) .hdr__logo--black{
+  display: none;
+}
+.hdr:not(.opened):not(.hdr__white) .hdr__logo--white{
+  display: block;
+}
+.hdr:not(.opened):not(.hdr__white) .hdrmenu--expanded::after{
+  filter: brightness(0) invert(1);
+}
+
+
+.hdr.opened .hdr__wrap{
+  background: #fff;
+}
+
+body .hdr.opened .hdr__wrap{
+  background: #fff;
+}
+
+
+.dropmenu{
+  display: block;
+  position: absolute;
+  left: 0;
+  top: 100%;
+  width: 100%;
+  background: #fff;
+  z-index: 100;
+  opacity: 1;
+  height: 0;
+  overflow: hidden;
+  transition: height 0.2s ease;
+}
+.dropmenu__back{
+  position: fixed;
+  pointer-events: none;
+  z-index: 98;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background:#000;
+  opacity: 0;
+  transition: opacity 0.2s ease;
+}
+.dropmenu.active{
+  height: 360px;
+  opacity: 1;
+}
+.dropmenu__back.active{
+  opacity: 0.4;
+  pointer-events: auto;
+}
+.dropmenu__panel{
+  box-shadow: inset 0 0 0 1px var(--grey3);
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 360px;
+  background: #fff;
+  padding: 48px 0 0px;
+  opacity: 0;
+  transform: translateY(-10px);
+  transition: opacity 0.3s ease, transform 0.3s ease;
+  pointer-events: none;
+}
+.dropmenu__panel.active{
+  opacity: 1;
+  pointer-events: auto;
+  transform: translateY(0px);
+}
+
+.dropmenu1__grid{
+  display: grid;
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: stretch;
+}
+.dropmenu--left{
+  padding-right: 30px;
+  width: 245px;
+  flex-shrink: 0;
+}
+.dropmenu__box{
+  position: relative;
+  min-height: 240px;
+  padding-top: 5rem;
+}
+.dropmenu__iconitem{
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: center;
+  justify-content: flex-start;
+  padding: 10px 15px;
+  border-radius: 1rem;
+  color:#000 !important;
+}
+.dropmenu__iconitem img{
+  display: block;
+  max-width: 20px;
+  max-height: 20px;
+  object-fit: contain;
+}
+.dropmenu__iconitem span{
+  display: block;
+  padding-left: 10px;
+}
+.dropmenu__iconitem:hover{
+  text-decoration: none;
+  background: var(--blue4);
+}
+.dropmenu__box .capstext{
+  color:var(--grey4);
+  position: absolute;
+  top: 0;
+  left: 0;
+  font-size: 12px;
+  line-height: 18px;
+}
+.dropmenu1__center{
+  flex-grow: 1;
+  border-left: 1px solid var(--grey2);
+  border-right: 1px solid var(--grey2);
+  display: grid;
+  grid-template-columns: max-content max-content;
+  padding: 0 20px 15px;
+  grid-gap: 0 30px;
+}
+.dropmenu1__center .dropmenu__iconitem{
+  min-width: 250px;
+}
+.dropmenu1__right{
+  position: relative;
+  padding-top: 4rem;
+  margin-left: 75px;
+  width: 240px;
+  flex-shrink: 0;
+}
+.dropmenu__redbutton{
+  height: 60px;
+  padding: 0 30px;
+  width: 100%;
+  max-width: 240px;
+  display: inline-flex;
+  flex-flow: row nowrap;
+  align-items: center;
+  justify-content: center;
+  background: var(--red5);
+  border-radius: 1rem;
+  white-space: nowrap;
+  color:#000;
+  transition: background 0.3s ease;
+}
+.dropmenu__redbutton img{
+  flex-shrink: 0;
+  margin-right: 5px;
+}
+.dropmenu__redbutton span{
+  display: block;
+  position: relative;
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: center;
+}
+.dropmenu__redbutton span::after{
+  content:"";
+  display: block;
+  margin-left: 9px;
+  width: 14px;
+  height: 13px;
+  background: url(../img/menu/icon-arrow.svg) no-repeat;
+  background-size: contain;
+  transition: transform 0.3s ease;
+}
+.dropmenu__redbutton:hover{
+  text-decoration: none;
+  color:#fff;
+  background: var(--red);
+}
+.dropmenu__redbutton:hover img{
+  filter: brightness(0) invert(1);
+}
+.dropmenu__redbutton:hover span::after{
+  filter: brightness(0) invert(1);
+  transform: translateX(3px);
+}
+
+
+.dropmenu2__grid{
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: stretch;
+  justify-content: space-between;
+}
+.dropmenu2__col{
+  border-right:1px solid var(--grey2);
+  width: 25%;
+  flex-grow: 1;
+  flex-shrink: 1;
+  margin-left: 20px;
+  padding-right: 34px;
+  min-height: 240px;
+}
+.dropmenu2__col:first-child{
+  margin-left: 0;
+}
+.dropmenu2__col.dropmenu1__right{
+  text-align: right;
+  border:none;
+  padding-right: 0;
+}
+.panelmorelinkwrap{
+  text-align: center;
+  padding-top: 25px;
+}
+.panellink{
+  color:#000;
+  display: inline-block;
+}
+.panellink:hover{
+  color:#000;
+}
+
+
 .hdrfloat {
   position: fixed;
   top: 0;
@@ -132,50 +412,7 @@
   }
 }
 
-.cmtyhero {
-  overflow: hidden;
-  height: calc(100vh - 96px);
-  display: flex;
-  flex-flow: column nowrap;
-  align-items: center;
-  justify-content: center;
-  min-height: 670px;
-  max-height: 800px;
-}
-.cmtyhero__img {
-  position: absolute;
-  right: 0px;
-  top: 50%;
-  transform: translateY(-50%);
-  width: 500px;
-  height: auto;
-  pointer-events: none;
-}
-.cmtyhero__main {
-  position: relative;
-  z-index: 10;
-  color: var(--dark);
-  display: flex;
-  flex-flow: column nowrap;
-  align-items: flex-start;
-  justify-content: flex-start;
-}
-.cmtyhero__h1 {
-  max-width: 725px;
-  font-size: 6rem;
-  line-height: 7rem;
-}
-.cmtyhero__text {
-  padding-top: 5rem;
-  max-width: 575px;
-  font-size: 2.4rem;
-  line-height: 3.6rem;
-}
-.cmtyhero__sub {
-  padding-top: 16rem;
-  font-size: 1.6rem;
-  line-height: 2.4rem;
-}
+
 
 .cmtynavblock {
   background: #fff;
@@ -231,821 +468,8 @@
   border-radius: 3px;
 }
 
-.cmtyhistory {
-  padding-top: 11rem;
-  padding-bottom: 8rem;
-}
-.cmtyhistory1__title {
-  font-weight: 700;
-  font-size: 32px;
-  line-height: 1;
-}
-.cmtyhistory1__wrap {
-  padding-top: 10rem;
-}
-.cmtyhistory1__left {
-  width: 49%;
-  flex-shrink: 0;
-  flex-grow: 0;
-  position: relative;
-}
-.cmtyhistory1__left img {
-  margin-top: 50px;
-  margin-right: 112px;
-  display: block;
-  width: 335px;
-  max-width: 90%;
-  margin-left: auto;
-}
-.cmtyhistory__year {
-  position: absolute;
-  z-index: 10;
-  top: 8px;
-  left: 8px;
-  font-size: 4.8rem;
-  line-height: 1;
-  white-space: nowrap;
-}
-.cmtyhistory1__right {
-  flex-grow: 1;
-}
-.cmtyhistory1__h3 {
-  font-weight: 400;
-}
-.cmtyhistory__hr {
-  cursor: pointer;
-  margin-top: 35px;
-  margin-bottom: 35px;
-  height: 1px;
-  position: relative;
-  background: #e6e6e6;
-}
-.cmtyhistory__hr i,
-.cmtyhistory__hr span {
-  display: flex;
-  flex-flow: column nowrap;
-  align-items: center;
-  justify-content: center;
-  position: absolute;
-  left: 50%;
-  top: 0;
-  width: 30px;
-  height: 30px;
-  border-radius: 30px;
-  background-color: var(--grey2);
-  margin-top: -15px;
-  margin-left: -15px;
-  font-size: 20px;
-  z-index: 5;
-  user-select: none;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='%23000' d='M368 224H224V80c0-8.84-7.16-16-16-16h-32c-8.84 0-16 7.16-16 16v144H16c-8.84 0-16 7.16-16 16v32c0 8.84 7.16 16 16 16h144v144c0 8.84 7.16 16 16 16h32c8.84 0 16-7.16 16-16V288h144c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16z'%3E%3C/path%3E%3C/svg%3E");
-  background-repeat: no-repeat;
-  background-position: 50% 50%;
-  background-size: 12px;
-}
-.cmtyhistory__hr span {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='currentColor' d='M368 224H16c-8.84 0-16 7.16-16 16v32c0 8.84 7.16 16 16 16h352c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16z'%3E%3C/path%3E%3C/svg%3E");
-}
-.cmtyhistory__hr span {
-  display: none;
-}
-.cmtyhistory__hr.isopen span {
-  display: flex;
-}
-.cmtyhistory__hr.isopen i {
-  display: none;
-}
-.cmtyhistory__more {
-  height: auto;
-  transition: height 0.4s ease;
-  overflow: hidden;
-  height: 0;
-}
-.cmtyhistory__quote {
-  font-style: italic;
-  margin-top: 30px;
-  padding-top: 60px;
-  background: url(../img/community/b3-quote.svg) left top no-repeat;
-}
-.cmtyhistory__avaavtor {
-  align-items: center;
-}
-.cmtyhistory__ava {
-  display: block;
-}
-.cmtyhistory__ava img {
-  display: block;
-  border-radius: 200px;
-  width: 70px;
-  height: 70px;
-}
-.cmtyhistory__avaright:not(.cmtyhistory__avaright--noimg) {
-  padding-left: 20px;
-}
-.cmtyhistory__avaname {
-  font-weight: 700;
-  line-height: 28px;
-}
-.cmtyhistory__avaproff {
-  padding-top: 0px;
-  color: #898989;
-}
-.cmtyhistory2 {
-  padding-top: 70px;
-}
-.cmtyhistory2__wrap {
-  flex-flow: row-reverse nowrap;
-}
-.cmtyhistory__year--right {
-  left: auto;
-  right: 0;
-  top: 30px;
-}
-.cmtyhistory2__right {
-  width: 50%;
-  flex-shrink: 0;
-  flex-grow: 0;
-  position: relative;
-}
-.cmtyhistory2__right img {
-  display: block;
-  margin-left: auto;
-}
-.cmtyhistory2__left {
-  padding-top: 81px;
-}
-.cmtyhistory3 {
-  padding-top: 115px;
-}
-.cmtyhistory3__left {
-  width: 49%;
-  flex-shrink: 0;
-  flex-grow: 0;
-  position: relative;
-  padding-top: 50px;
-}
-.cmtyhistory3__right {
-  width: 49%;
-  flex-shrink: 0;
-  flex-grow: 0;
-  position: relative;
-  padding-top: 70px;
-}
-.cmtyhistory4 {
-  padding-top: 100px;
-}
-.cmtyhistory5 .cmtyhistory3__left {
-  padding-top: 0;
-}
-.cmtyhistory5 .cmtyhistory3__right {
-  padding-top: 60px;
-}
 
-.cmty-meet {
-  margin-top: 8rem;
-  background: var(--red5);
-  padding: 145px 0 140px;
-  overflow: hidden;
-}
-.cmty-meet__main {
-  max-width: 49%;
-}
-.cmty-meet__h2 {
-  font-size: 48px;
-  line-height: 1;
-}
-.cmty-meet__text {
-  font-size: 2.4rem;
-  line-height: 3.6rem;
-}
-.cmty-meet__sub {
-  padding-top: 175px;
-  max-width: 500px;
-}
-.cmty-meet__pic {
-  position: relative;
-  width: 400px;
-  margin-left: auto;
-}
-.cmty-meet__pic img {
-  display: block;
-  position: absolute;
-  top: 35px;
-  right: 0;
-}
 
-.cmty-contrib {
-  padding: 130px 0 70px;
-}
-.cmty-contrib__main {
-  max-width: 510px;
-}
-.cmty-contrib__pic {
-  position: relative;
-  width: 650px;
-  flex-grow: 0;
-  margin-left: auto;
-}
-.cmty-contrib__pic img {
-  display: block;
-  width: 100%;
-  margin-top: -30px;
-}
-
-.cmty-committers {
-  padding-bottom: 70px;
-}
-.cmty-committers__small {
-  display: block;
-  color: #9c9c9c;
-}
-.committers__wrap {
-  padding-top: 40px;
-  justify-content: space-between;
-}
-.committers__left,
-.committers__right {
-  width: calc(50% - 15px);
-  flex-grow: 0;
-  flex-shrink: 0;
-}
-.committer {
-  height: 6rem;
-  border-bottom: 1px solid #e5e5e5;
-  align-items: center;
-  padding: 0 2rem 0 2rem;
-}
-.committer__name {
-  max-width: 60%;
-  flex-grow: 0;
-  overflow: hidden;
-  margin-right: auto;
-}
-.committer__github {
-  display: block;
-  width: 30px;
-  margin: 0 10px;
-}
-.committer__apache {
-  display: block;
-  width: 30px;
-  margin: 0 5px 0 15px;
-}
-.committer__github img,
-.committer__apache img {
-  display: block;
-}
-.committers__morelink {
-  margin-top: 30px;
-  display: block;
-  margin-left: 20px;
-}
-
-.cmty-pm {
-  padding-top: 80px;
-  padding-bottom: 105px;
-}
-.cmty-pm__wrap {
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  grid-auto-rows: 266px;
-  grid-gap: 30px;
-}
-.cmty-pmitem {
-  border: 1px solid var(--grey2);
-  box-sizing: border-box;
-  border-radius: 10px;
-  display: block;
-  position: relative;
-  padding: 40px 30px;
-}
-.cmty-pmitem__proff {
-  top: 15px;
-  right: 25px;
-  text-transform: uppercase;
-  height: 42px;
-  display: flex;
-  flex-flow: row nowrap;
-  align-items: center;
-  justify-content: center;
-  position: absolute;
-  font-size: 15px;
-}
-.cmty-pmitem__proff img {
-  margin-right: 6px;
-  width: 17px;
-  height: 17px;
-  display: block;
-}
-.cmty-pmitem__name {
-  font-weight: 400;
-  max-width: 80%;
-  min-height: 72px;
-}
-.cmty-pmitem__work {
-  color: #9c9c9c;
-  white-space: nowrap;
-  overflow: hidden;
-  display: block;
-}
-.cmty-pmitem__links {
-  position: absolute;
-  bottom: 45px;
-  left: 35px;
-}
-.cmty-pmitem__links img {
-  display: block;
-  width: 30px;
-  height: auto;
-  height: 30px;
-  object-fit: contain;
-}
-.cmty-pmitem__github {
-  margin-right: 20px;
-}
-.cmty-pmitem__apache {
-  margin-right: 20px;
-}
-.cmty-pm__more .jsOpenerWrap {
-  padding-top: 30px;
-}
-.cmty-pm__morelink {
-  display: block;
-  width: 80px;
-  text-align: center;
-  text-align: center;
-  margin: 30px auto 0;
-}
-
-.cmty-startcont {
-  background: #e8f2fa;
-  padding: 90px 0 90px;
-}
-.cmty-startcont__wrap {
-  align-items: stretch;
-}
-.cmty-startcont__main {
-  display: flex;
-  flex-flow: column nowrap;
-  align-items: stretch;
-  justify-content: flex-start;
-  max-width: 540px;
-  padding-top: 65px;
-}
-.cmty-startcont__pic {
-  margin-left: auto;
-  flex-grow: 0;
-}
-.cmty-startcont__pic img {
-  width: 614px;
-  display: block;
-}
-
-.cmty-docs {
-  padding: 130px 0 90px;
-}
-.cmty-docs__wrap {
-  justify-content: space-between;
-  align-items: stretch;
-}
-.cmty-docblock,
-.tplbox {
-  background-color: #fafdff;
-  border: 1px solid var(--grey2);
-  box-sizing: border-box;
-  border-radius: 10px;
-  padding: 40px 50px;
-  position: relative;
-}
-.cmty-docblock {
-  width: calc(50% - 15px);
-  min-height: 450px;
-}
-.cmty-docblock::before,
-.tplbox::before {
-  position: absolute;
-  border-radius: 0px 30px 30px 0px;
-  width: 12px;
-  height: 60px;
-  background: var(--blue);
-  content: "";
-  display: block;
-  left: 0;
-  top: 35px;
-}
-.cmty-docblock__icon,
-.tplbox__icon {
-  position: absolute;
-  width: 34px;
-  height: 41px;
-  display: block;
-  left: 50px;
-  top: 44px;
-}
-.cmty-docblock__icon img {
-  display: block;
-  width: 100%;
-  height: 100%;
-  object-fit: contain;
-}
-.cmty-docblock__title {
-  font-weight: 400;
-  padding-top: 75px;
-}
-.cmty-docblock__list {
-  padding-top: 30px;
-}
-.cmty-docblock__list li {
-  margin-bottom: 5px;
-  margin-bottom: 10px;
-  position: relative;
-  padding-left: 21px;
-}
-.cmty-docblock__list li::before {
-  content: "";
-  display: block;
-  position: absolute;
-  left: 0;
-  top: 1.2rem;
-  height: 1px;
-  width: 15px;
-  background: #000;
-}
-.cmty-docblock--bg {
-  background: url(../img/community/b9-wave.svg) right bottom no-repeat;
-  background-color: #fafdff;
-}
-
-.cmty-ready {
-  overflow: hidden;
-}
-.cmty-ready__wrap {
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  grid-gap: 30px;
-  grid-auto-rows: auto;
-}
-.cmty-ready__item {
-  border: 1px solid var(--grey2);
-  box-sizing: border-box;
-  border-radius: 10px;
-  position: relative;
-  min-height: 240px;
-  padding: 20px 25px;
-}
-.cmty-ready__item::before {
-  position: absolute;
-  border-radius: 0px 30px 30px 0px;
-  width: 12px;
-  height: 45px;
-  background: var(--blue);
-  content: "";
-  display: block;
-  left: -1px;
-  top: 20px;
-}
-.cmty-ready__item i {
-  display: block;
-  font-style: normal;
-  font-weight: 400;
-  font-size: 40px;
-  line-height: 45px;
-  margin-bottom: 30px;
-}
-.cmty-ready__openlink {
-  color: var(--blue);
-  border-bottom: 1px dotted var(--blue);
-  position: relative;
-  display: inline;
-  cursor: pointer;
-}
-.cmty-ready__openlink::after {
-  content: "";
-  display: inline-block;
-  position: relative;
-  margin-left: 4px;
-  width: 10px;
-  height: 10px;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%230070CC' d='M441.9 167.3l-19.8-19.8c-4.7-4.7-12.3-4.7-17 0L224 328.2 42.9 147.5c-4.7-4.7-12.3-4.7-17 0L6.1 167.3c-4.7 4.7-4.7 12.3 0 17l209.4 209.4c4.7 4.7 12.3 4.7 17 0l209.4-209.4c4.7-4.7 4.7-12.3 0-17z'%3E%3C/path%3E%3C/svg%3E");
-  background-repeat: no-repeat;
-  background-size: contain;
-  transition: transform 0.4s ease;
-}
-.cmty-ready__openlink.isopen::after {
-  transform: rotate(180deg);
-}
-.cmty-ready__hider {
-  margin-top: 1rem;
-  transition: height 0.4s ease;
-  overflow: hidden;
-  height: 0;
-  font-size: 1.5rem;
-}
-
-.cmty-ready__bottom {
-  padding-top: 80px;
-  padding-bottom: 80px;
-}
-.cmty-ready__botttl {
-  width: 25%;
-  flex-shrink: 0;
-  flex-grow: 0;
-  padding-right: 22px;
-}
-.cmty-ready__botlinks {
-  font-weight: 400;
-}
-.cmty-ready__botlinks a {
-  display: inline-block;
-  margin-bottom: 1rem;
-}
-.cmty-ready__screens {
-  flex-basis: 740px;
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  grid-auto-rows: auto;
-  grid-gap: 10px;
-  flex-grow: 0;
-  flex-shrink: 0;
-}
-.cmty-ready__screens img,
-.cmty-ready__screens a {
-  display: block;
-  width: 100%;
-  height: auto;
-}
-.cmty-ready__more {
-  display: flex;
-  flex-flow: column nowrap;
-  align-items: stretch;
-  justify-content: center;
-  align-self: stretch;
-  background: url(../img/community/b11-stat-2.png) no-repeat;
-  background-size: contain;
-  flex-grow: 1;
-  flex-shrink: 1;
-}
-.cmty-ready__more a {
-  display: block;
-  margin: auto;
-}
-
-.cmty-red {
-  padding-top: 90px;
-}
-.cmty-red__wrap {
-  padding-top: 54px;
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  grid-auto-rows: 450px;
-  grid-gap: 3rem;
-}
-.cmty-redblock {
-  width: 100%;
-  background: #fff7f7;
-  padding-top: 105px;
-  padding-left: 60px;
-}
-.cmty-redblock .tplbox__icon {
-  left: 60px;
-}
-.cmty-redblock .h4 {
-  font-weight: 400;
-}
-.cmty-redblock::before {
-  background: var(--red);
-}
-.cmty-red__wrap--bg {
-  background-image: url(../img/community/b12-lines.svg);
-  background-repeat: no-repeat;
-  background-position: right bottom;
-}
-.cmty-redblock__questimg {
-  width: 48px;
-  height: 48px;
-}
-
-.cmty-redstart {
-  padding-top: 9rem;
-  padding-bottom: 4rem;
-}
-.cmty-redstart__title {
-}
-.cmty-redstart__wrap {
-  display: grid;
-  grid-template-columns: 2fr 3fr;
-  grid-auto-rows: auto;
-  grid-gap: 18px;
-}
-.cmty-redstep {
-  border: 1px solid var(--grey2);
-  box-sizing: border-box;
-  border-radius: 10px;
-  position: relative;
-  padding: 35px 35px;
-  background: #fff;
-  z-index: 10;
-}
-.cmty-redstep--1 {
-  grid-row: span 2;
-  max-width: 433px;
-  padding-top: 101px;
-  position: relative;
-}
-.cmty-redstep--1::after {
-  content: "";
-  display: block;
-  position: absolute;
-  top: 50%;
-  transform: translateY(-60%);
-  left: 100%;
-  width: 115px;
-  height: 165px;
-  background: url(../img/community/b13-lines.svg) no-repeat;
-  background-size: contain;
-}
-.cmty-redstep--2,
-.cmty-redstep--3 {
-  min-height: 150px;
-  width: 728px;
-  max-width: 100%;
-  margin-left: auto;
-  background: url(../img/community/b13-bg-squares.svg) #fff right bottom
-    no-repeat;
-  background-size: 140px;
-  padding: 33px 210px 20px 115px;
-}
-.cmty-redstep--3 {
-  background-image: url(../img/community/b13-bg-roundes.svg);
-  background-size: 105px;
-  padding-right: 140px;
-}
-.cmty-redstep::before {
-  position: absolute;
-  border-radius: 0px 30px 30px 0px;
-  width: 13px;
-  height: 43px;
-  background: var(--red);
-  content: "";
-  display: block;
-  left: -1px;
-  top: 35px;
-}
-.cmty-redstep i {
-  font-size: 40px;
-  position: absolute;
-  left: 37px;
-  top: 36px;
-  line-height: 43px;
-}
-.cmty-redstep__h3 {
-  font-size: 16px;
-  line-height: 1;
-  padding-bottom: 8px;
-}
-
-.cmty-redstart__bottom {
-  padding-top: 8rem;
-  padding-bottom: 8px;
-  align-items: center;
-}
-.cmty-redstart__left{
-  width: 50%;
-  flex-shrink: 0;
-  flex-grow: 0;
-}
-.cmty-redstart__grey {
-  color:var(--grey4)
-}
-.cmty-redstart__botright {
-  width: 40%;
-  border: 1px solid #ededed;
-  box-sizing: border-box;
-  border-radius: 10px;
-  margin-left: auto;
-  display: flex;
-  flex-flow: column nowrap;
-  align-items: center;
-  justify-content: center;
-  padding: 3rem 3rem 2rem;
-  background: #fff;
-}
-.cmty-redstart__botright a{
-  margin-top: 2rem;
-}
-.cmty-redstart__botpic {
-  display: block;
-  width: 100%;
-  margin: auto;
-  height: auto;
-  border-radius: 1rem;
-}
-.cmty-redstart__iframe {
-  width: 100%;
-  height: 415px;
-  display: block;
-  border: none;
-}
-
-.cmty-ask {
-  margin-top: 12rem;
-  background: #f4f4f4;
-  padding: 140px 0 110px;
-  overflow: hidden;
-}
-.cmty-ask__title {
-  font-weight: 400;
-}
-.cmty-ask__wrap {
-  align-items: flex-start;
-}
-.cmty-ask__bg {
-  margin-left: auto;
-  flex-shrink: 0;
-  flex-basis: 529px;
-  height: auto;
-  flex-shrink: 1;
-  flex-grow: 0;
-}
-
-.faq {
-  padding-top: 13rem;
-  padding-bottom: 8rem;
-}
-.faqblock {
-  padding-bottom: 115px;
-}
-.faqblock:last-child {
-  padding-bottom: 0;
-}
-.faqblock__title {
-  width: calc(42% - 15px);
-  flex-shrink: 0;
-  position: relative;
-  padding-left: 70px;
-}
-.faqblock__title--simple {
-  padding-left: 0;
-}
-.faqblock__title img {
-  display: block;
-  position: absolute;
-  left: 0;
-  top: 50%;
-  transform: translateY(-50%);
-  width: 48px;
-  height: auto;
-}
-.faqblock__right {
-  flex-grow: 1;
-  padding-top: 10px;
-  max-width: 540px;
-}
-.faqblock__right h4 {
-  font-size: initial;
-  line-height: 1;
-  font-weight: 700;
-  padding-bottom: 10px;
-}
-.faqblock__buttons {
-  align-items: stretch;
-}
-.faqblock__button {
-  height: 40px;
-  display: inline-flex;
-  flex-flow: row nowrap;
-  align-items: center;
-  justify-content: center;
-  border: 1px solid #2d2d2d;
-  box-sizing: border-box;
-  border-radius: 10px;
-  margin-right: 24px;
-  padding: 0 16px;
-  color: #000;
-  text-decoration: none !important;
-}
-.faqblock__button:hover {
-  color: #fff;
-  background: #2d2d2d;
-  text-decoration: none;
-}
-.faqblock__button img {
-  display: block;
-  margin-right: 8px;
-  flex-shrink: 0;
-  width: 22px;
-}
-.faqblock__button:hover img {
-  filter: grayscale(1) invert(1);
-}
-img.faqblock__eicon {
-  margin-right: 6px;
-  transform: translateY(1px);
-}
-img.faqblock__stackicon {
-  margin-right: 14px;
-  width: 20px;
-}
 
 /* === === === === === === === === INNERPAGE BLOCKS === === === === === === === === */
 .innerhero {
@@ -1083,6 +507,9 @@
   letter-spacing: 2px;
   text-transform: uppercase;
 }
+.with-apache{
+  font-weight: normal;
+}
 .innerhero__descr {
   font-weight: 400;
   opacity: 0.8;
diff --git a/public/css/usecases.css b/public/css/usecases.css
index e7b6b7c..81ca5f8 100644
--- a/public/css/usecases.css
+++ b/public/css/usecases.css
@@ -79,9 +79,9 @@
 /* === === === === === === === === POWERED BY === === === === === === === === */
 .grayhero {
     background: #f1f1f1;
-    height: calc(100vh - 96px);
+    /* height: calc(100vh - 96px);
     min-height: 500px;
-    max-height: 750px;
+    max-height: 750px; */
     display: flex;
     flex-flow: column nowrap;
     align-items: stretch;
@@ -163,6 +163,7 @@
 }
 .poweredvideos {
     padding-top: 13rem;
+    padding-bottom: 7rem;
 }
 .poweredvideos__grid,
 .poweredvideos__more{
@@ -170,8 +171,16 @@
     grid-template-columns: 1fr 1fr;
     grid-auto-rows: auto;
     grid-gap: 10rem 3rem;
-    justify-content: space-between;
 }
+.poweredvideos .comvideo:nth-child(2n){
+    margin-left: auto;
+}
+@media (min-width:1199px) {
+    .poweredvideos .comvideo__screen[data-youtube]::after{
+        background-size: 6rem;
+    } 
+}
+
 .poweredvideos__more{
     padding-bottom: 13px;
 }
diff --git a/public/download.html b/public/download.html
index 98a7456..cfa210f 100644
--- a/public/download.html
+++ b/public/download.html
@@ -8,14 +8,14 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/download.css" />
     <link rel="stylesheet" href="../js/vendor/highlight/default.min.css" />
     <link rel="stylesheet" href="../js/vendor/highlight/night-owl.css" />
     <script src="../js/vendor/highlight/highlight.min.js"></script>
     <script src="../js/vendor/highlight/xml.min.js"></script>
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -54,35 +54,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero innerhero--download">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
diff --git a/public/events-video.html b/public/events-video.html
index 9fd7edc..f16911d 100644
--- a/public/events-video.html
+++ b/public/events-video.html
@@ -8,9 +8,9 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
+    <link rel="stylesheet" href="../css/events.css" />
     <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
     <link rel="icon" type="image/png" href="/img/favicon.png" />
-    <link rel="stylesheet" href="../css/events.css" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -48,36 +48,191 @@
       </div>
     </div>
     <!-- MOBILE MENU END -->
-    <header class="hdr">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
+    <header class="hdr hdr__white">
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="eventhero">
       <div class="container">
         <div class="eventhero__main">
diff --git a/public/events.html b/public/events.html
index 7724a04..08bac8a 100644
--- a/public/events.html
+++ b/public/events.html
@@ -8,9 +8,9 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
+    <link rel="stylesheet" href="../css/events.css" />
     <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
     <link rel="icon" type="image/png" href="/img/favicon.png" />
-    <link rel="stylesheet" href="../css/events.css" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -48,36 +48,191 @@
       </div>
     </div>
     <!-- MOBILE MENU END -->
-    <header class="hdr">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
+    <header class="hdr hdr__white">
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="eventhero">
       <div class="container">
         <div class="eventhero__main">
@@ -163,7 +318,7 @@
       </div>
     </section>
     <!-- /.event-planet-->
-    <section class="event-virtual container">
+    <section class="event-virtual container" id="virtual">
       <div class="eventvirt flexi">
         <div class="eventvirt__left">
           <h3 class="h4">Virtual Apache Ignite Meetup</h3>
diff --git a/public/faq.html b/public/faq.html
index e68f570..2031000 100644
--- a/public/faq.html
+++ b/public/faq.html
@@ -8,10 +8,10 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/faq.css" />
     <link rel="stylesheet" href="../css/tooling.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -50,35 +50,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero innerhero--faq">
       <div class="container innerhero__cont">
         <div class="innerhero__main innerhero__main--long">
diff --git a/public/features/acid-transactions.html b/public/features/acid-transactions.html
index 842b19d..275a1db 100644
--- a/public/features/acid-transactions.html
+++ b/public/features/acid-transactions.html
@@ -8,10 +8,10 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/acid-transactions.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -50,40 +50,195 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
+          <div class="innerhero__pre pb-5">Apache Ignite</div>
           <h1 class="h1 innerhero__h1">Distributed ACID <br />Transactions</h1>
-          <div class="pt-2 h3">with Apache Ignite</div>
           <div class="innerhero__descr pt-4 h5">Classical ACID transactions that let you update distributed data <br />consistently, durably and with in-memory speed</div>
           <div class="innerhero__action"><a class="button innerhero__button" href="https://ignite.apache.org/docs/latest/index">Start Coding</a></div>
         </div>
diff --git a/public/features/compute-apis.html b/public/features/compute-apis.html
index 7cea957..9fbcd03 100644
--- a/public/features/compute-apis.html
+++ b/public/features/compute-apis.html
@@ -8,8 +8,6 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../js/vendor/highlight/night-owl.css" />
@@ -17,6 +15,8 @@
     <script src="../js/vendor/highlight/java.min.js"></script>
     <script src="../js/vendor/highlight/xml.min.js"></script>
     <script src="../js/vendor/highlight/csharp.min.js"></script>
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -55,35 +55,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -281,7 +436,7 @@
         <article class="nativebotblock nativebotblock--learn">
           <h3 class="h4 nativebotblock__title"><img class="nativebotblock__icon" src="/img/features/native-docs.svg" alt="" /><span>Want to Learn More?</span></h3>
           <p class="nativebotblock__text">Learn more about high-performance computing use cases and see how it works in practice</p>
-          <a class="nativebotblock__link arrowlink" href="https://ignite.apache.org/use-cases/high-performance-computing.html" target="_blank">High-Performance Computing Use-Cases</a>
+          <a class="nativebotblock__link arrowlink" href="/use-cases/high-performance-computing.html" target="_blank">High-Performance Computing Use-Cases</a>
         </article>
       </div>
     </section>
diff --git a/public/features/distributed-key-value-store.html b/public/features/distributed-key-value-store.html
index 79777c8..7579522 100644
--- a/public/features/distributed-key-value-store.html
+++ b/public/features/distributed-key-value-store.html
@@ -8,10 +8,10 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/key-value-api.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -50,35 +50,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero innerhero--keyvalue">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -186,7 +341,7 @@
         <article class="nativebotblock nativebotblock--learn">
           <h3 class="h4 nativebotblock__title"><img class="nativebotblock__icon" src="/img/features/native-docs.svg" alt="" /><span>Want to Learn More?</span></h3>
           <p class="nativebotblock__text">Check out how Apache Ignite can be configured <br />and used as a standard key-value store</p>
-          <a class="nativebotblock__link arrowlink" href="/use-cases/key-value-store.html" target="_blank">Key-Value Store</a>
+          <a class="nativebotblock__link arrowlink" href="/use-cases/key-value-store.html">Key-Value Store</a>
         </article>
       </div>
     </section>
diff --git a/public/features/index.html b/public/features/index.html
index c77ba7a..615e0d9 100644
--- a/public/features/index.html
+++ b/public/features/index.html
@@ -8,9 +8,9 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
+    <link rel="stylesheet" href="../css/features.css" />
     <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
     <link rel="icon" type="image/png" href="/img/favicon.png" />
-    <link rel="stylesheet" href="../css/features.css" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -49,35 +49,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
diff --git a/public/features/machinelearning.html b/public/features/machinelearning.html
index 7f5a6ce..4ab62e6 100644
--- a/public/features/machinelearning.html
+++ b/public/features/machinelearning.html
@@ -8,11 +8,11 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../css/machinelearning.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -51,35 +51,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
diff --git a/public/features/multilanguage.html b/public/features/multilanguage.html
index ca99ac1..91c9523 100644
--- a/public/features/multilanguage.html
+++ b/public/features/multilanguage.html
@@ -8,11 +8,11 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../css/multilanguage.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -51,35 +51,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main innherhero__lang">
@@ -127,7 +282,7 @@
         <article class="nativebotblock nativebotblock--learn">
           <h3 class="h4 nativebotblock__title"><img class="nativebotblock__icon" src="/img/features/native-docs.svg" alt="" /><span>Want to Learn More?</span></h3>
           <p class="nativebotblock__text">Check out how to run Ignite with Java, .NET/C#, C++, Python, Node.JS, SQL, PHP, or REST API</p>
-          <a class="nativebotblock__link arrowlink" href="#" target="_blank">Multi-language guide</a>
+          <a class="nativebotblock__link arrowlink" href="https://ignite.apache.org/docs/latest/quick-start/java" target="_blank">Multi-Language Guide</a>
         </article>
       </div>
     </section>
diff --git a/public/features/servicegrid.html b/public/features/servicegrid.html
index 8c2473f..a5e6f33 100644
--- a/public/features/servicegrid.html
+++ b/public/features/servicegrid.html
@@ -8,8 +8,6 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/service.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
@@ -18,6 +16,8 @@
     <script src="../js/vendor/highlight/java.min.js"></script>
     <script src="../js/vendor/highlight/xml.min.js"></script>
     <script src="../js/vendor/highlight/csharp.min.js"></script>
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -56,35 +56,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -115,7 +270,7 @@
         <h2 class="h4 blockheader__left">Use Contemporary Powerful Languages</h2>
         <div class="blockheader__right service-subtextvideo fz20"><p>Microservices APIs supported by Java and С#/.NET</p></div>
       </header>
-      <div class="nativecode__tabctrls flexi"><a class="nativecode__link active" href="#" data-tablink="nativeTabJava">Java</a><a class="nativecode__link" href="#" data-tablink="nativeTabNET">C#/.NET</a></div>
+      <div class="nativecode__tabctrls flexi"><a class="nativecode__link active" href="#" data-tablink="nativeTabJava">Java</a></div>
       <div class="nativecode__tabs">
         <div class="nativecode__tab active" data-tab="nativeTabJava">
           <pre class="nativecode__codebox"> <code class="java">Ignite ignite = Ignition.start();
@@ -127,14 +282,6 @@
 services.deployClusterSingleton("myCounterService", new MyCounterServiceImpl());
 </code></pre>
         </div>
-        <div class="nativecode__tab" data-tab="nativeTabNET">
-          <pre class="nativecode__codebox"> <code class="csharp">// Broadcast the task to server nodes only.
-var compute = ignite.GetCluster().ForServers().GetCompute();
-
-// Each remote server node will execute the custom PrintNodeIdAction task.
-compute.Broadcast(new PrintNodeIdAction());
-</code></pre>
-        </div>
       </div>
     </section>
     <!-- /.nativecode-->
diff --git a/public/features/sql.html b/public/features/sql.html
index a0ba697..e0deb0a 100644
--- a/public/features/sql.html
+++ b/public/features/sql.html
@@ -8,11 +8,11 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../css/sql.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -51,35 +51,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
diff --git a/public/features/streaming.html b/public/features/streaming.html
index 8ff7952..d111ab8 100644
--- a/public/features/streaming.html
+++ b/public/features/streaming.html
@@ -8,11 +8,11 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../css/streaming.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -51,35 +51,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
diff --git a/public/features/tooling.html b/public/features/tooling.html
index 3d105a2..451293b 100644
--- a/public/features/tooling.html
+++ b/public/features/tooling.html
@@ -8,9 +8,9 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
+    <link rel="stylesheet" href="../css/tooling.css" />
     <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
     <link rel="icon" type="image/png" href="/img/favicon.png" />
-    <link rel="stylesheet" href="../css/tooling.css" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -49,35 +49,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a class="hdrmenu__current" href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero innerhero--tooling">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
diff --git a/public/img/menu/icon-arrow.svg b/public/img/menu/icon-arrow.svg
new file mode 100644
index 0000000..6faf60c
--- /dev/null
+++ b/public/img/menu/icon-arrow.svg
@@ -0,0 +1,4 @@
+<svg width="14" height="13" viewBox="0 0 14 13" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 6.29988C0 5.85805 0.358172 5.49988 0.8 5.49988H12.8C13.2418 5.49988 13.6 5.85805 13.6 6.29988C13.6 6.74171 13.2418 7.09988 12.8 7.09988H0.8C0.358172 7.09988 0 6.74171 0 6.29988Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.21022 0.259425C6.50877 -0.0662702 7.01483 -0.0882725 7.34052 0.210281L13.3405 5.71028C13.5058 5.86181 13.5999 6.07576 13.5999 6.3C13.5999 6.52425 13.5058 6.7382 13.3405 6.88973L7.34052 12.3897C7.01483 12.6883 6.50877 12.6663 6.21022 12.3406C5.91167 12.0149 5.93367 11.5088 6.25936 11.2103L11.616 6.3L6.25936 1.38973C5.93367 1.09117 5.91167 0.58512 6.21022 0.259425Z" fill="black"/>
+</svg>
diff --git a/public/img/menu/icon-calendar.svg b/public/img/menu/icon-calendar.svg
new file mode 100644
index 0000000..8314b12
--- /dev/null
+++ b/public/img/menu/icon-calendar.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M15.1875 1.59375H11.9062V0.34375C11.9062 0.257812 11.8359 0.1875 11.75 0.1875H10.6562C10.5703 0.1875 10.5 0.257812 10.5 0.34375V1.59375H5.5V0.34375C5.5 0.257812 5.42969 0.1875 5.34375 0.1875H4.25C4.16406 0.1875 4.09375 0.257812 4.09375 0.34375V1.59375H0.8125C0.466797 1.59375 0.1875 1.87305 0.1875 2.21875V15.1875C0.1875 15.5332 0.466797 15.8125 0.8125 15.8125H15.1875C15.5332 15.8125 15.8125 15.5332 15.8125 15.1875V2.21875C15.8125 1.87305 15.5332 1.59375 15.1875 1.59375ZM14.4062 14.4062H1.59375V6.98438H14.4062V14.4062ZM1.59375 5.65625V3H4.09375V3.9375C4.09375 4.02344 4.16406 4.09375 4.25 4.09375H5.34375C5.42969 4.09375 5.5 4.02344 5.5 3.9375V3H10.5V3.9375C10.5 4.02344 10.5703 4.09375 10.6562 4.09375H11.75C11.8359 4.09375 11.9062 4.02344 11.9062 3.9375V3H14.4062V5.65625H1.59375Z" fill="#0070CC"/>
+</svg>
diff --git a/public/img/menu/icon-clip.svg b/public/img/menu/icon-clip.svg
new file mode 100644
index 0000000..da7c30e
--- /dev/null
+++ b/public/img/menu/icon-clip.svg
@@ -0,0 +1,3 @@
+<svg width="12" height="19" viewBox="0 0 12 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 6.29711V12.6356C1 13.8824 1.49528 15.0781 2.37689 15.9597C3.2585 16.8413 4.45422 17.3366 5.701 17.3366C6.94778 17.3366 8.1435 16.8413 9.02511 15.9597C9.90672 15.0781 10.402 13.8824 10.402 12.6356V4.80063C10.402 3.96944 10.0718 3.17229 9.48407 2.58455C8.89633 1.99681 8.09919 1.66663 7.268 1.66663C6.43681 1.66663 5.63967 1.99681 5.05193 2.58455C4.46419 3.17229 4.134 3.96944 4.134 4.80063V11.9947C4.134 12.2005 4.17453 12.4043 4.25328 12.5944C4.33203 12.7845 4.44745 12.9573 4.59296 13.1028C4.73847 13.2483 4.91122 13.3637 5.10133 13.4424C5.29145 13.5212 5.49522 13.5617 5.701 13.5617V13.5617C6.11659 13.5617 6.51517 13.3966 6.80904 13.1028C7.1029 12.8089 7.268 12.4103 7.268 11.9947V6.36763" stroke="#0070CC" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/public/img/menu/icon-comment.svg b/public/img/menu/icon-comment.svg
new file mode 100644
index 0000000..6084443
--- /dev/null
+++ b/public/img/menu/icon-comment.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.33374 6.66508C5.33374 6.48827 5.40398 6.3187 5.529 6.19368C5.65402 6.06865 5.82358 5.99841 6.00039 5.99841H10.0003C10.1771 5.99841 10.3466 6.06865 10.4717 6.19368C10.5967 6.3187 10.6669 6.48827 10.6669 6.66508C10.6669 6.84189 10.5967 7.01146 10.4717 7.13648C10.3466 7.26151 10.1771 7.33175 10.0003 7.33175H6.00039C5.82358 7.33175 5.65402 7.26151 5.529 7.13648C5.40398 7.01146 5.33374 6.84189 5.33374 6.66508Z" fill="#0070CC"/>
+<path d="M6.00039 8.66504C5.82358 8.66504 5.65402 8.73528 5.529 8.8603C5.40398 8.98532 5.33374 9.15489 5.33374 9.33171C5.33374 9.50852 5.40398 9.67809 5.529 9.80311C5.65402 9.92813 5.82358 9.99837 6.00039 9.99837H8.66698C8.84378 9.99837 9.01335 9.92813 9.13837 9.80311C9.26339 9.67809 9.33362 9.50852 9.33362 9.33171C9.33362 9.15489 9.26339 8.98532 9.13837 8.8603C9.01335 8.73528 8.84378 8.66504 8.66698 8.66504H6.00039Z" fill="#0070CC"/>
+<path d="M0.000460341 7.99845C0.00080054 6.23718 0.582344 4.52525 1.65488 3.12823C2.72741 1.7312 4.23098 0.727174 5.93234 0.271898C7.6337 -0.183378 9.43775 -0.0644547 11.0646 0.61022C12.6915 1.2849 14.0503 2.47761 14.9301 4.00334C15.81 5.52906 16.1618 7.30252 15.931 9.0486C15.7001 10.7947 14.8995 12.4158 13.6534 13.6604C12.4072 14.905 10.7852 15.7036 9.03887 15.9323C7.29256 16.1609 5.51959 15.8069 3.99501 14.9251L0.877768 15.9651C0.762601 16.0036 0.63912 16.0098 0.520651 15.9832C0.402182 15.9566 0.293224 15.8982 0.205537 15.8142C0.117851 15.7302 0.0547647 15.6239 0.0230878 15.5067C-0.00858905 15.3895 -0.00765368 15.2658 0.025793 15.1491L0.975098 11.8278C0.333806 10.6534 -0.00138381 9.33649 0.000460341 7.99845ZM8.00022 1.33179C6.82317 1.33172 5.66707 1.6433 4.64946 2.23486C3.63185 2.82643 2.789 3.67689 2.2066 4.69979C1.62419 5.72269 1.32299 6.88156 1.33361 8.0586C1.34423 9.23564 1.66629 10.3889 2.26706 11.4011C2.31328 11.4793 2.34304 11.5661 2.3545 11.6562C2.36597 11.7463 2.3589 11.8378 2.33372 11.9251L1.65508 14.2984L3.86568 13.5624C3.95956 13.5311 4.05924 13.5211 4.15749 13.5331C4.25573 13.5451 4.35007 13.5788 4.43366 13.6318C5.30733 14.1847 6.29763 14.5268 7.32628 14.6311C8.35494 14.7354 9.39375 14.599 10.3606 14.2327C11.3275 13.8663 12.1959 13.2801 12.8972 12.5204C13.5985 11.7606 14.1134 10.8482 14.4014 9.85512C14.6893 8.86207 14.7424 7.81565 14.5563 6.79858C14.3702 5.78151 13.9501 4.82167 13.3292 3.99491C12.7083 3.16816 11.9036 2.49717 10.9787 2.03497C10.0538 1.57277 9.03415 1.33203 8.00022 1.33179Z" fill="#0070CC"/>
+</svg>
diff --git a/public/img/menu/icon-cube.svg b/public/img/menu/icon-cube.svg
new file mode 100644
index 0000000..63bc70f
--- /dev/null
+++ b/public/img/menu/icon-cube.svg
@@ -0,0 +1,3 @@
+<svg width="18" height="20" viewBox="0 0 18 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.447 2.1069C9.3082 2.03754 9.15516 2.00143 9 2.00143C8.84484 2.00143 8.6918 2.03754 8.553 2.1069L3.236 4.7649L9 7.6469L14.764 4.7649L9.447 2.1069ZM16 6.3829L10 9.3829V17.1469L15.447 14.4229C15.6131 14.3399 15.7528 14.2123 15.8504 14.0544C15.9481 13.8965 15.9999 13.7146 16 13.5289V6.3829ZM8 17.1469V9.3829L2 6.3829V13.5289C2.0001 13.7146 2.05188 13.8965 2.14955 14.0544C2.24722 14.2123 2.38692 14.3399 2.553 14.4229L8 17.1469ZM7.658 0.316898C8.07466 0.108498 8.53413 0 9 0C9.46587 0 9.92534 0.108498 10.342 0.316898L17.447 3.8709C17.6131 3.95389 17.7528 4.08148 17.8504 4.23937C17.9481 4.39727 17.9999 4.57924 18 4.7649V13.5289C18 14.0859 17.8449 14.632 17.552 15.1059C17.2592 15.5797 16.8402 15.9627 16.342 16.2119L9.447 19.6589C9.3082 19.7283 9.15516 19.7644 9 19.7644C8.84484 19.7644 8.6918 19.7283 8.553 19.6589L1.658 16.2119C1.15979 15.9627 0.740804 15.5797 0.447969 15.1059C0.155134 14.632 1.8928e-05 14.0859 0 13.5289V4.7649C9.91486e-05 4.57924 0.0518831 4.39727 0.149552 4.23937C0.247222 4.08148 0.386919 3.95389 0.553 3.8709L7.658 0.317898V0.316898Z" fill="#0070CC"/>
+</svg>
diff --git a/public/img/menu/icon-db.svg b/public/img/menu/icon-db.svg
new file mode 100644
index 0000000..e3add3f
--- /dev/null
+++ b/public/img/menu/icon-db.svg
@@ -0,0 +1,3 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 9.8C1 9.8 3.6664 12.2 9 12.2C14.3336 12.2 17 9.8 17 9.8M1 5C1 5 3.6664 7.4 9 7.4C14.3336 7.4 17 5 17 5M1 3.4616C1 3.4616 2.3336 1 9 1C15.6664 1 17 3.4616 17 3.4616V14.5384C17 14.5384 15.6664 17 9 17C2.3336 17 1 14.5384 1 14.5384V3.4616Z" stroke="#0070CC" stroke-width="2"/>
+</svg>
diff --git a/public/img/menu/icon-folder.svg b/public/img/menu/icon-folder.svg
new file mode 100644
index 0000000..c3a59b7
--- /dev/null
+++ b/public/img/menu/icon-folder.svg
@@ -0,0 +1,3 @@
+<svg width="20" height="16" viewBox="0 0 20 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18.3299 7.04407H16.6667V5.16907C16.6667 4.13391 15.9201 3.29407 15 3.29407H9.44444L7.22222 0.794067H1.66667C0.746528 0.794067 0 1.63391 0 2.66907V13.9191C0 14.9542 0.746528 15.7941 1.66667 15.7941H15.5556C16.1285 15.7941 16.6632 15.462 16.9688 14.9113L19.7431 9.91126C20.4375 8.66516 19.6389 7.04407 18.3299 7.04407ZM1.66667 2.90344C1.66667 2.77454 1.76042 2.66907 1.875 2.66907H6.53125L8.75347 5.16907H14.7917C14.9062 5.16907 15 5.27454 15 5.40344V7.04407H5.27778C4.69444 7.04407 4.15278 7.38782 3.85069 7.95032L1.66667 12.0206V2.90344ZM15.5556 13.9191H2.5L5.18056 8.91907H18.3333L15.5556 13.9191Z" fill="#0070CC"/>
+</svg>
diff --git a/public/img/menu/icon-puzzle.svg b/public/img/menu/icon-puzzle.svg
new file mode 100644
index 0000000..9784178
--- /dev/null
+++ b/public/img/menu/icon-puzzle.svg
@@ -0,0 +1,3 @@
+<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.9755 1C5.78426 1 4.8187 1.96653 4.8187 3.15893C4.8187 3.74857 5.05461 4.28331 5.43737 4.67295H1.00001V8.27116C1.39552 7.81379 1.98027 7.52375 2.63201 7.52375C3.82324 7.52375 4.78881 8.49027 4.78881 9.68266C4.78881 10.8751 3.82324 11.8416 2.632 11.8416C1.98027 11.8416 1.39552 11.5515 1 11.0942V16.2H5.66134C5.16843 15.8043 4.8528 15.1968 4.8528 14.5151C4.8528 13.3227 5.81837 12.3562 7.00961 12.3562C8.20083 12.3562 9.16639 13.3227 9.16639 14.5151C9.16639 15.1968 8.85076 15.8043 8.35785 16.2H12.5157V11.69C12.9062 12.0819 13.4465 12.3242 14.0432 12.3242C15.2344 12.3242 16.2 11.3577 16.2 10.1653C16.2 8.97283 15.2344 8.00635 14.0432 8.00635C13.4465 8.00635 12.9062 8.2486 12.5157 8.64057V4.67294H8.51363C8.89651 4.28328 9.1323 3.74864 9.1323 3.15892C9.1323 1.96652 8.16672 1 6.9755 1Z" stroke="#0070CC" stroke-width="1.3" stroke-linejoin="round"/>
+</svg>
diff --git a/public/img/menu/icon-question.svg b/public/img/menu/icon-question.svg
new file mode 100644
index 0000000..e94f714
--- /dev/null
+++ b/public/img/menu/icon-question.svg
@@ -0,0 +1,3 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 9C18 11.3869 17.0518 13.6761 15.364 15.364C13.6761 17.0518 11.3869 18 9 18C6.61305 18 4.32387 17.0518 2.63604 15.364C0.948212 13.6761 0 11.3869 0 9C0 6.61305 0.948212 4.32387 2.63604 2.63604C4.32387 0.948212 6.61305 0 9 0C11.3869 0 13.6761 0.948212 15.364 2.63604C17.0518 4.32387 18 6.61305 18 9ZM6.183 6.78713H7.11112C7.26638 6.78713 7.39012 6.66 7.41037 6.50588C7.51162 5.76788 8.01787 5.23013 8.92013 5.23013C9.69187 5.23013 10.3984 5.616 10.3984 6.54413C10.3984 7.2585 9.97762 7.587 9.31275 8.0865C8.55562 8.63663 7.956 9.279 7.99875 10.3219L8.00212 10.566C8.00331 10.6398 8.03346 10.7102 8.08608 10.762C8.13869 10.8137 8.20956 10.8428 8.28337 10.8427H9.19575C9.27034 10.8427 9.34188 10.8131 9.39462 10.7604C9.44737 10.7076 9.477 10.6361 9.477 10.5615V10.4434C9.477 9.63562 9.78413 9.4005 10.6132 8.77162C11.2984 8.25075 12.0128 7.6725 12.0128 6.45863C12.0128 4.75875 10.5773 3.9375 9.00562 3.9375C7.58025 3.9375 6.01875 4.60125 5.91188 6.50925C5.91034 6.54558 5.91624 6.58184 5.92924 6.61581C5.94223 6.64977 5.96203 6.68072 5.98742 6.70674C6.01282 6.73277 6.04327 6.75333 6.0769 6.76715C6.11054 6.78097 6.14664 6.78777 6.183 6.78713ZM8.79862 14.0355C9.48487 14.0355 9.95625 13.5922 9.95625 12.9926C9.95625 12.3716 9.48375 11.9351 8.79862 11.9351C8.14163 11.9351 7.6635 12.3716 7.6635 12.9926C7.6635 13.5922 8.14163 14.0355 8.79975 14.0355H8.79862Z" fill="#0070CC"/>
+</svg>
diff --git a/public/img/menu/icon-red-rocket.svg b/public/img/menu/icon-red-rocket.svg
new file mode 100644
index 0000000..e45544e
--- /dev/null
+++ b/public/img/menu/icon-red-rocket.svg
@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15.7649 1.3847C16.6033 1.23591 17.4057 1.20317 18.0572 1.36209C18.2036 1.39725 18.3371 1.47317 18.4421 1.58109C18.546 1.68776 18.6178 1.82134 18.6496 1.96665C18.8026 2.63743 18.7708 3.44668 18.6216 4.29144C18.4705 5.14691 18.1912 6.08101 17.8133 7.01867C17.0601 8.88716 15.8913 10.8282 14.4826 12.2295C14.0686 12.646 13.6249 13.0318 13.1551 13.3837C13.1859 14.1506 13.0984 14.9442 12.7858 15.6615L12.7855 15.6622C12.2791 16.8206 11.3667 17.5479 10.4879 17.9995C9.61162 18.4499 8.73091 18.6468 8.20827 18.7308C8.06047 18.7547 7.90915 18.7442 7.76601 18.7003C7.62288 18.6564 7.49176 18.5801 7.38279 18.4775C7.27382 18.3748 7.18992 18.2484 7.13757 18.1082C7.08522 17.9679 7.06583 17.8175 7.08089 17.6685C7.08107 17.6667 7.08125 17.6649 7.08145 17.6632L7.35677 15.1546C7.32888 15.1518 7.30101 15.1489 7.27316 15.1458C6.96639 15.1142 6.68003 14.9772 6.46285 14.7582C6.46235 14.7577 6.46185 14.7572 6.46136 14.7567L5.24032 13.5356C5.23982 13.5351 5.23932 13.5346 5.23881 13.5341C5.01989 13.3171 4.88292 13.0309 4.85117 12.7243C4.84791 12.695 4.84483 12.6657 4.84192 12.6364L2.33108 12.912L2.32849 12.9123L2.32656 12.9125C2.1774 12.9278 2.02673 12.9085 1.88622 12.8562C1.74571 12.8038 1.61914 12.7198 1.51632 12.6107C1.4135 12.5016 1.33718 12.3703 1.29328 12.2269C1.24938 12.0835 1.23909 11.932 1.26319 11.784L1.26337 11.7829C1.34919 11.2619 1.547 10.3825 1.998 9.50677C2.45017 8.62876 3.17725 7.71699 4.33475 7.20805L4.3364 7.20732C5.05401 6.89427 5.85183 6.80692 6.62351 6.84061C6.97549 6.37254 7.36097 5.93042 7.77696 5.51776C9.1823 4.11375 11.1527 2.9454 13.0335 2.19279C13.9774 1.81505 14.9146 1.53561 15.7649 1.3847ZM13.4979 3.35332C11.7291 4.06112 9.91566 5.14774 8.65973 6.40276L8.65807 6.40441C8.20949 6.8493 7.80047 7.33237 7.43562 7.84815C7.3069 8.03011 7.09103 8.12976 6.86906 8.10967C6.10828 8.04084 5.40449 8.1054 4.83712 8.35266C4.02277 8.71097 3.47702 9.36503 3.10929 10.0791C2.82601 10.6291 2.66049 11.1925 2.56524 11.6288L5.36147 11.3218C5.53705 11.3025 5.71258 11.3585 5.84466 11.4757C5.97674 11.593 6.05302 11.7607 6.05464 11.9373C6.05664 12.155 6.06971 12.3724 6.0938 12.5887C6.09404 12.5909 6.09427 12.5931 6.09449 12.5953C6.09645 12.6147 6.10512 12.6329 6.11902 12.6466L6.12161 12.6492L7.34778 13.8754L7.35033 13.8779C7.36407 13.8918 7.38224 13.9005 7.40169 13.9024C7.40403 13.9027 7.40637 13.9029 7.40871 13.9032C7.62369 13.9272 7.83976 13.9402 8.05607 13.9423C8.23263 13.944 8.40023 14.0204 8.51743 14.1524C8.63464 14.2845 8.69052 14.46 8.67125 14.6355L8.36457 17.4298C8.80077 17.3358 9.36547 17.171 9.91649 16.8878C10.631 16.5206 11.2843 15.9752 11.64 15.1619C11.8879 14.5929 11.9524 13.8923 11.8871 13.1338C11.868 12.9123 11.968 12.6973 12.1497 12.5693C12.6669 12.2048 13.1513 11.7959 13.5973 11.3471L13.5999 11.3444C14.8618 10.0896 15.9477 8.3035 16.6539 6.55137C17.0057 5.67843 17.2573 4.82857 17.3907 4.07397C17.4987 3.4623 17.5244 2.93936 17.478 2.52757C17.0901 2.48383 16.585 2.50869 15.9834 2.61547C15.233 2.74864 14.3788 3.00079 13.4979 3.35332ZM8.00962 17.4967C8.00937 17.4967 8.00913 17.4967 8.00888 17.4968L8.00945 17.4967C8.0095 17.4967 8.00956 17.4967 8.00962 17.4967ZM12.8457 6.12406C12.6394 6.12406 12.4377 6.18523 12.2662 6.29984C12.0947 6.41446 11.961 6.57736 11.8821 6.76795C11.8032 6.95854 11.7825 7.16826 11.8228 7.37059C11.863 7.57291 11.9624 7.75875 12.1083 7.9046L11.6663 8.34672L12.1088 7.90512C12.2055 8.00202 12.3204 8.0789 12.4468 8.13135C12.5732 8.1838 12.7088 8.2108 12.8457 8.2108C12.9826 8.2108 13.1181 8.1838 13.2446 8.13135C13.371 8.0789 13.4859 8.00202 13.5826 7.90512L13.5831 7.9046C13.729 7.75875 13.8283 7.57291 13.8686 7.37059C13.9089 7.16826 13.8882 6.95854 13.8093 6.76795C13.7304 6.57736 13.5967 6.41446 13.4252 6.29984C13.2536 6.18523 13.052 6.12406 12.8457 6.12406ZM11.2243 8.78839C10.9037 8.46776 10.6853 8.05927 10.5968 7.61455C10.5083 7.16975 10.5537 6.70868 10.7272 6.28966C10.9007 5.87065 11.1946 5.5125 11.5717 5.26053C11.9488 5.00855 12.3922 4.87406 12.8457 4.87406C13.2992 4.87406 13.7426 5.00855 14.1196 5.26053C14.4967 5.5125 14.7906 5.87065 14.9642 6.28966C15.1377 6.70868 15.1831 7.16975 15.0946 7.61455C15.0061 8.05912 14.7878 8.46749 14.4674 8.78806C14.2546 9.00132 14.0018 9.17051 13.7235 9.28595C13.4453 9.40138 13.147 9.4608 12.8457 9.4608C12.5444 9.4608 12.2461 9.40138 11.9678 9.28595C11.6897 9.17057 11.437 9.00149 11.2243 8.78839Z" fill="#ED1C24"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.90316 13.6739C4.94521 14.0165 4.70157 14.3283 4.35896 14.3704C4.10813 14.4012 3.87475 14.5148 3.6958 14.6932C3.63576 14.7538 3.53883 14.9199 3.44315 15.2331C3.35349 15.5267 3.28637 15.8757 3.23753 16.2221C3.20707 16.4381 3.18455 16.647 3.168 16.8321C3.35324 16.8155 3.56227 16.7929 3.77844 16.7624C4.12486 16.7136 4.47387 16.6464 4.76719 16.5567C5.08107 16.4606 5.24644 16.3635 5.30598 16.3039L5.30704 16.3029C5.48583 16.1249 5.59941 15.8918 5.62945 15.6413C5.67055 15.2985 5.98169 15.054 6.32442 15.0951C6.66714 15.1362 6.91165 15.4474 6.87055 15.7901C6.80708 16.3195 6.56713 16.812 6.18944 17.1883C5.90467 17.4728 5.49223 17.6421 5.13282 17.752C4.75257 17.8683 4.33261 17.9466 3.9531 18.0002C3.57074 18.0541 3.2134 18.0851 2.95266 18.1027C2.82184 18.1115 2.71427 18.117 2.63871 18.1203C2.60091 18.122 2.57106 18.1231 2.55025 18.1238C2.53984 18.1242 2.53168 18.1244 2.52592 18.1246L2.51908 18.1248L2.51611 18.1249C2.51602 18.1249 2.51593 18.1249 2.5 17.5001C1.8752 17.4841 1.87521 17.484 1.87521 17.4839L1.87529 17.481L1.87548 17.4741C1.87566 17.4684 1.87591 17.4602 1.87627 17.4498C1.87698 17.429 1.87809 17.3992 1.87975 17.3614C1.88306 17.2859 1.88856 17.1784 1.89736 17.0476C1.9149 16.787 1.94587 16.4298 1.99978 16.0476C2.05328 15.6681 2.13152 15.2483 2.24767 14.868C2.35758 14.5081 2.52669 14.0955 2.81082 13.8104L2.81188 13.8094C3.18807 13.4337 3.67898 13.1945 4.20666 13.1297C4.54927 13.0877 4.8611 13.3313 4.90316 13.6739ZM2.5 17.5001L1.8752 17.4841C1.87084 17.6554 1.93694 17.8209 2.05806 17.942C2.17917 18.0631 2.34469 18.1292 2.51593 18.1249L2.5 17.5001Z" fill="#ED1C24"/>
+</svg>
diff --git a/public/img/menu/icon-resources.svg b/public/img/menu/icon-resources.svg
new file mode 100644
index 0000000..90afb52
--- /dev/null
+++ b/public/img/menu/icon-resources.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.66667 0H4.44444V16H2.66667V0ZM0 0H1.77778V16H0V0ZM5.33333 0H7.11111V16H5.33333V0ZM13.3884 15.8151L7.85689 0.801778L9.52533 0.186667L15.0569 15.2L13.3884 15.8151Z" fill="#0070CC"/>
+</svg>
diff --git a/public/img/poweredby/videos/007.png b/public/img/poweredby/videos/007.png
index ea5bca7..5a62549c 100644
--- a/public/img/poweredby/videos/007.png
+++ b/public/img/poweredby/videos/007.png
Binary files differ
diff --git a/public/img/poweredby/videos/009.png b/public/img/poweredby/videos/009.png
index e5d39b3..46522bb 100644
--- a/public/img/poweredby/videos/009.png
+++ b/public/img/poweredby/videos/009.png
Binary files differ
diff --git a/public/img/poweredby/videos/010.png b/public/img/poweredby/videos/010.png
index 3657bf9..115edae 100644
--- a/public/img/poweredby/videos/010.png
+++ b/public/img/poweredby/videos/010.png
Binary files differ
diff --git a/public/img/poweredby/videos/011.png b/public/img/poweredby/videos/011.png
index 4daf5f7..231e77e 100644
--- a/public/img/poweredby/videos/011.png
+++ b/public/img/poweredby/videos/011.png
Binary files differ
diff --git a/public/img/poweredby/videos/012.png b/public/img/poweredby/videos/012.png
index e98c63c..f08a2be 100644
--- a/public/img/poweredby/videos/012.png
+++ b/public/img/poweredby/videos/012.png
Binary files differ
diff --git a/public/img/poweredby/videos/013.png b/public/img/poweredby/videos/013.png
index ca6d485..6442d70 100644
--- a/public/img/poweredby/videos/013.png
+++ b/public/img/poweredby/videos/013.png
Binary files differ
diff --git a/public/img/poweredby/videos/014.png b/public/img/poweredby/videos/014.png
index 5da0579..0f42106 100644
--- a/public/img/poweredby/videos/014.png
+++ b/public/img/poweredby/videos/014.png
Binary files differ
diff --git a/public/img/poweredby/videos/015.png b/public/img/poweredby/videos/015.png
index d9913d7..200f052 100644
--- a/public/img/poweredby/videos/015.png
+++ b/public/img/poweredby/videos/015.png
Binary files differ
diff --git a/public/img/poweredby/videos/016.png b/public/img/poweredby/videos/016.png
index 87d9024..af57107 100644
--- a/public/img/poweredby/videos/016.png
+++ b/public/img/poweredby/videos/016.png
Binary files differ
diff --git a/public/img/poweredby/videos/017.png b/public/img/poweredby/videos/017.png
index 7c1719b..f4ded5e 100644
--- a/public/img/poweredby/videos/017.png
+++ b/public/img/poweredby/videos/017.png
Binary files differ
diff --git a/public/img/poweredby/videos/018.png b/public/img/poweredby/videos/018.png
index 37c0755..a1c6092 100644
--- a/public/img/poweredby/videos/018.png
+++ b/public/img/poweredby/videos/018.png
Binary files differ
diff --git a/public/img/poweredby/videos/019.png b/public/img/poweredby/videos/019.png
index fec2961..f92bc9e 100644
--- a/public/img/poweredby/videos/019.png
+++ b/public/img/poweredby/videos/019.png
Binary files differ
diff --git a/public/img/poweredby/videos/020.png b/public/img/poweredby/videos/020.png
index c598b54..2a56ab7 100644
--- a/public/img/poweredby/videos/020.png
+++ b/public/img/poweredby/videos/020.png
Binary files differ
diff --git a/public/img/poweredby/videos/021.png b/public/img/poweredby/videos/021.png
index c7269ba..91f132f 100644
--- a/public/img/poweredby/videos/021.png
+++ b/public/img/poweredby/videos/021.png
Binary files differ
diff --git a/public/img/poweredby/videos/022.png b/public/img/poweredby/videos/022.png
index 308d61f..dd0b793 100644
--- a/public/img/poweredby/videos/022.png
+++ b/public/img/poweredby/videos/022.png
Binary files differ
diff --git a/public/img/poweredby/videos/023.png b/public/img/poweredby/videos/023.png
index 489d5e1..8841ee6 100644
--- a/public/img/poweredby/videos/023.png
+++ b/public/img/poweredby/videos/023.png
Binary files differ
diff --git a/public/img/poweredby/videos/024.png b/public/img/poweredby/videos/024.png
index 912d928..4ae9240 100644
--- a/public/img/poweredby/videos/024.png
+++ b/public/img/poweredby/videos/024.png
Binary files differ
diff --git a/public/img/poweredby/videos/025.png b/public/img/poweredby/videos/025.png
new file mode 100644
index 0000000..f0bddaf
--- /dev/null
+++ b/public/img/poweredby/videos/025.png
Binary files differ
diff --git a/public/index.html b/public/index.html
index 25df94c..bc209a6 100644
--- a/public/index.html
+++ b/public/index.html
@@ -8,8 +8,6 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="../js/vendor/highlight/default.min.css" />
     <link rel="stylesheet" href="../js/vendor/highlight/night-owl.css" />
@@ -19,6 +17,8 @@
     <link rel="stylesheet" href="../css/frontpage.css" />
     <script src="../js/vendor/highlight/highlight.min.js"></script>
     <script src="../js/vendor/swiper/swiper-bundle.min.js"></script>
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <div class="fronttop">
@@ -58,42 +58,197 @@
       </div>
       <!-- MOBILE MENU END -->
       <header class="hdr hdr__dark">
-        <div class="cmtyhero__wrap flexi">
-          <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+        <div class="hdr__wrap flexi">
+          <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+          ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
           ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
           <nav class="hdrmenu">
             <ul class="flexi">
-              <li><a class="hdrmenu__current" href="/">Get started</a></li>
-              <li><a href="/features">Features</a></li>
-              <li><a href="/community.html">Community</a></li>
-              <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-              <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+              <li><a class="hdrmenu__current hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+              <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+              <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+              <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+              <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
             </ul>
           </nav>
+          <div class="dropmenu">
+            <div class="dropmenu__panel" data-menupanel="getStarted">
+              <div class="container dropmenu1__grid">
+                <div class="dropmenu__box dropmenu--left">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu1__center">
+                  <div class="dropmenu__box">
+                    <p class="capstext">USE CASES</p>
+                    <ul class="dropmenu__menu">
+                      <li>
+                        <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                      </li>
+                      <li>
+                        <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                      </li>
+                      <li>
+                        <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                      </li>
+                      <li>
+                        <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                      </li>
+                    </ul>
+                  </div>
+                  <div class="dropmenu__box">
+                    <ul class="dropmenu__menu">
+                      <li>
+                        <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                      </li>
+                      <li>
+                        <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                      </li>
+                      <li>
+                        <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                      </li>
+                      <li>
+                        <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                      </li>
+                    </ul>
+                  </div>
+                </div>
+                <div class="dropmenu1__right">
+                  <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+                </div>
+              </div>
+              <!-- /.dropmenu1__grid-->
+            </div>
+            <!-- /.dropmenu__panel-->
+            <div class="dropmenu__panel" data-menupanel="features">
+              <div class="container dropmenu2__grid">
+                <div class="dropmenu2__col dropmenu__box">
+                  <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu2__col dropmenu__box">
+                  <div class="capstext">Essentail Developer <br />APIs</div>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu2__col dropmenu__box">
+                  <div class="capstext">High-Performance <br />Computing APIs</div>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu2__col dropmenu__box">
+                  <div class="capstext">Real Streaming APIs</div>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu1__right dropmenu2__col">
+                  <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+                </div>
+              </div>
+              <!-- /.dropmenu2__grid-->
+              <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+            </div>
+            <!-- /.dropmenu__panel-2-->
+            <div class="dropmenu__panel" data-menupanel="community">
+              <div class="container dropmenu1__grid dropmenu3__grid">
+                <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu1__center">
+                  <div class="dropmenu__box">
+                    <p class="capstext">Events</p>
+                    <ul class="dropmenu__menu">
+                      <li>
+                        <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                      </li>
+                      <li>
+                        <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                      </li>
+                    </ul>
+                  </div>
+                  <div class="dropmenu__box">
+                    <ul class="dropmenu__menu">
+                      <li>
+                        <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                      </li>
+                      <li>
+                        <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                      </li>
+                    </ul>
+                  </div>
+                </div>
+                <div class="dropmenu1__right">
+                  <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+                </div>
+              </div>
+              <!-- /.dropmenu1__grid-->
+            </div>
+            <!-- /.dropmenu__panel-->
+          </div>
+          <!-- /.dropmeu-->
         </div>
       </header>
-      <header class="hdrfloat">
-        <div class="cmtyhero__wrap flexi">
-          <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-          ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-          <nav class="hdrmenu">
-            <ul class="flexi">
-              <li><a class="hdrmenu__current" href="/">Get started</a></li>
-              <li><a href="/features">Features</a></li>
-              <li><a href="/community.html">Community</a></li>
-              <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-              <li><a href="/docs.html">Docs</a></li>
-            </ul>
-          </nav>
-        </div>
-      </header>
+      <div class="dropmenu__back"></div>
       <section class="innerhero fronthero">
         <div class="container innerhero__cont">
           <div class="innerhero__main innerhero__main--long">
-            <div class="innerhero__pre pb-4">Scale Across Memory And Disk With No Compromises</div>
+            <div class="innerhero__pre pb-3">Scale Across Memory And Disk With No Compromises</div>
             <h1 class="h1 innerhero__h1 innerhero__mega">Open-Source <br />Distributed Database</h1>
-            <div class="innerhero__h2 h4 pt-2">For High-Performance Computing <br />With In-Memory Speed and On-Disk Scale</div>
-            <div class="innerhero__action pt-4"><a class="button fronthero__button" href="https://ignite.apache.org/docs/latest/index">Start Coding</a></div>
+            <div class="innerhero__h2 h4 pt-2">For High-Performance Computing <br />With In-Memory Speed And On-Disk Scale</div>
+            <div class="innerhero__action pt-5"><a class="button fronthero__button" href="https://ignite.apache.org/docs/latest/index">Start Coding</a></div>
           </div>
         </div>
       </section>
@@ -193,7 +348,7 @@
 </code></pre>
                   </div>
                 </div>
-                <div class="forntcodes__bottom"><a class="button" href="https://ignite.apache.org/docs/latest/memory-architecture">Learn more about multi-tier storage</a></div>
+                <div class="forntcodes__bottom"><a class="button" href="https://ignite.apache.org/docs/latest/memory-architecture">Learn More About Multi-Tier Storage</a></div>
               </div>
               <!-- /.forntcodes__innertabs-->
             </div>
@@ -215,7 +370,7 @@
 ORDER BY max_pop DESC LIMIT 3;</code></pre>
                   </div>
                 </div>
-                <div class="forntcodes__bottom"><a class="button" href="https://ignite.apache.org/docs/latest/SQL/sql-introduction">Start Using SQL</a></div>
+                <div class="forntcodes__bottom"><a class="button" href="https://ignite.apache.org/docs/latest/SQL/sql-introduction">Learn More About Distributed SQL</a></div>
               </div>
               <!-- /.forntcodes__innertabs-->
             </div>
@@ -262,7 +417,7 @@
             </div>
             <!-- /.forntcodes__tab3 (END ACID Transactions)-->
             <div class="forntcodes__tab" data-ftab="frontcode-4">
-              <p class="forntcodes__tabtitle fz20 pb-1">Co-located Compute in Java, Scala, Kotlin, C#, C++</p>
+              <p class="forntcodes__tabtitle fz20 pb-1">Compute APIs In Java, Scala, Kotlin, C#, C++</p>
               <p>
                 With traditional databases, for in-place calculations, you use stored procedures that are written in a language such as PL/SQL. With Ignite, you use modern JVM languages, C# or C++ to develop and execute custom tasks across
                 your distributed database:
@@ -286,7 +441,7 @@
 compute.Broadcast(new PrintNodeIdAction());</code></pre>
                   </div>
                 </div>
-                <div class="forntcodes__bottom"><a class="button" href="https://ignite.apache.org/docs/latest/distributed-computing/distributed-computing">Start Using Compute APIs</a></div>
+                <div class="forntcodes__bottom"><a class="button" href="https://ignite.apache.org/docs/latest/distributed-computing/distributed-computing">Learn More About Compute APIs</a></div>
               </div>
               <!-- /.forntcodes__innertabs-->
             </div>
@@ -314,7 +469,7 @@
 double prediction = knnMdl.predict(observation);</code></pre>
                   </div>
                 </div>
-                <div class="forntcodes__bottom"><a class="button" href="https://ignite.apache.org/docs/latest/machine-learning/machine-learning">Start Using Ignite Machine Learning</a></div>
+                <div class="forntcodes__bottom"><a class="button" href="https://ignite.apache.org/docs/latest/machine-learning/machine-learning">Learn More About Machine Learning</a></div>
               </div>
               <!-- /.forntcodes__innertabs-->
             </div>
@@ -351,7 +506,7 @@
 var handle = cache.QueryContinuous(query);</code></pre>
                   </div>
                 </div>
-                <div class="forntcodes__bottom"><a class="button" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries">Start Using Continuous Queries</a></div>
+                <div class="forntcodes__bottom"><a class="button" href="/use-cases/#usecase2">Learn More About Continuous Queries</a></div>
               </div>
               <!-- /.forntcodes__innertabs-->
             </div>
@@ -365,19 +520,19 @@
     <section class="frontnewcards container">
       <h3 class="h3">New to Ignite? <br />Three Primary Usage Scenarios</h3>
       <div class="frontnewcards__wrap pt-5">
-        <article class="usecasecard cardsimple">
+        <article class="frontsimplecard cardsimple">
           <h4 class="cardsimple__title">Applications Acceleration <br />& Scale Out</h4>
           <div class="cardsimple__text cardsimple__text--long">
             Accelerate your existing applications by&nbsp;100x using Ignite as&nbsp;an&nbsp;in-memory cache or&nbsp;in-memory data grid that is&nbsp;deployed over one or&nbsp;more external databases.
           </div>
-          <div class="cardsimple__bottom"><a class="cardsimple__button button button--shadow" href="/use-cases/in-memory-data-grid.html">Learn more</a></div>
+          <div class="cardsimple__bottom"><a class="cardsimple__button button button--shadow" href="/use-cases/#usecase2">Learn more</a></div>
         </article>
-        <article class="usecasecard cardsimple">
+        <article class="frontsimplecard cardsimple">
           <h4 class="cardsimple__title">Distributed Database For <br />HTAP Workloads</h4>
           <div class="cardsimple__text cardsimple__text--long">Build applications that support transactional and&nbsp;analytical workloads by&nbsp;using Ignite as&nbsp;a&nbsp;database that scales beyond available memory capacity.</div>
-          <div class="cardsimple__bottom"><a class="cardsimple__button button button--shadow" href="/use-cases/in-memory-database.html">Learn more</a></div>
+          <div class="cardsimple__bottom"><a class="cardsimple__button button button--shadow" href="/use-cases/#database">Learn more</a></div>
         </article>
-        <article class="usecasecard cardsimple">
+        <article class="frontsimplecard cardsimple">
           <h4 class="cardsimple__title">Digital Integration Hub<br />&nbsp;</h4>
           <div class="cardsimple__text cardsimple__text--long">Create an&nbsp;advanced platform architecture that aggregates multiple back-end systems and databases into a&nbsp;low-latency and shared data store.</div>
           <div class="cardsimple__bottom"><a class="cardsimple__button button button--shadow" href="/use-cases/digital-integration-hub.html">Learn more</a></div>
@@ -404,7 +559,7 @@
               <article class="comvideo">
                 <div class="comvideo__box">
                   <a class="comvideo__screen" href="https://www.youtube.com/watch?v=3FFexcYIpmA" data-youtube="data-youtube"
-                    ><span class="comvideo__txt comvideo__txt--medium">Leveraging In&nbsp;Memory Compute Grids With Core Systems Of&nbsp;Record</span><img src="/img/poweredby/videos/001.png" alt=""
+                    ><span class="comvideo__txt comvideo__txt--small">Leveraging In&nbsp;Memory Compute Grids With Core Systems Of&nbsp;Record</span><img src="/img/poweredby/videos/001.png" alt=""
                   /></a>
                 </div>
                 <div class="comvideo__descr pt-1"></div>
@@ -414,7 +569,7 @@
               <article class="comvideo">
                 <div class="comvideo__box">
                   <a class="comvideo__screen" href="https://www.youtube.com/watch?v=Mhtt2QL_qCQ" data-youtube="data-youtube"
-                    ><span class="comvideo__txt comvideo__txt--black comvideo__txt--medium">How To&nbsp;Use Apache Ignite To&nbsp;Rescue The Backend Of&nbsp;A&nbsp;Bank</span><img src="/img/poweredby/videos/002.png" alt=""
+                    ><span class="comvideo__txt comvideo__txt--black comvideo__txt--small">How To&nbsp;Use Apache Ignite To&nbsp;Rescue The Backend Of&nbsp;A&nbsp;Bank</span><img src="/img/poweredby/videos/002.png" alt=""
                   /></a>
                 </div>
                 <div class="comvideo__descr pt-1"></div>
@@ -424,7 +579,67 @@
               <article class="comvideo">
                 <div class="comvideo__box">
                   <a class="comvideo__screen" href="https://www.youtube.com/watch?v=z28rthKIrDk" data-youtube="data-youtube"
-                    ><span class="comvideo__txt comvideo__txt--medium">S9D Using Apache Ignite As&nbsp;A&nbsp;Part Of&nbsp;Real Time Campaigning</span><img src="/img/poweredby/videos/003.png" alt=""
+                    ><span class="comvideo__txt comvideo__txt--small">S9D Using Apache Ignite As&nbsp;A&nbsp;Part Of&nbsp;Real Time Campaigning</span><img src="/img/poweredby/videos/003.png" alt=""
+                  /></a>
+                </div>
+                <div class="comvideo__descr pt-1"></div>
+              </article>
+            </div>
+            <div class="swiper-slide">
+              <article class="comvideo">
+                <div class="comvideo__box">
+                  <a class="comvideo__screen" href="https://techblog.yahoo.co.jp/oss/yahoo_shopping_purchases_ignite/" target="_blank"
+                    ><span class="comvideo__txt comvideo__txt--small">In-Memory Computing Patterns For High Volume, Real Time Applications</span><img src="/img/poweredby/videos/005.png" alt=""
+                  /></a>
+                </div>
+                <div class="comvideo__descr pt-1"></div>
+              </article>
+            </div>
+            <div class="swiper-slide">
+              <article class="comvideo">
+                <div class="comvideo__box">
+                  <a class="comvideo__screen" href="https://www.youtube.com/watch?v=EdFOKJIjRSg" data-youtube="data-youtube"
+                    ><span class="comvideo__txt comvideo__txt--small">Fitness + In Memory Computing = Getting Ahead Of The Game</span><img src="/img/poweredby/videos/008.png" alt=""
+                  /></a>
+                </div>
+                <div class="comvideo__descr pt-1"></div>
+              </article>
+            </div>
+            <div class="swiper-slide">
+              <article class="comvideo">
+                <div class="comvideo__box">
+                  <a class="comvideo__screen" href="https://www.youtube.com/watch?v=jF9T2cJB6t0" data-youtube="data-youtube"
+                    ><span class="comvideo__txt comvideo__txt--black comvideo__txt--small">High Performance Exposure Management With Apache Ignite</span><img src="/img/poweredby/videos/009.png" alt=""
+                  /></a>
+                </div>
+                <div class="comvideo__descr pt-1"></div>
+              </article>
+            </div>
+            <div class="swiper-slide">
+              <article class="comvideo">
+                <div class="comvideo__box">
+                  <a class="comvideo__screen" href="https://www.youtube.com/watch?v=_mnZQ3JDcn8" data-youtube="data-youtube"
+                    ><span class="comvideo__txt comvideo__txt--black comvideo__txt--small">Ignite Success Story: How Ignite Fuels The High Throughput Messaging In&nbsp;Sentienz Akiro</span><img src="/img/poweredby/videos/014.png" alt=""
+                  /></a>
+                </div>
+                <div class="comvideo__descr pt-1"></div>
+              </article>
+            </div>
+            <div class="swiper-slide">
+              <article class="comvideo">
+                <div class="comvideo__box">
+                  <a class="comvideo__screen" href="https://techblog.yahoo.co.jp/oss/yahoo_shopping_purchases_ignite/" target="_blank"
+                    ><span class="comvideo__txt comvideo__txt--small">&laquo;Recent Purchases&raquo; With Apache Ignite</span><img src="/img/poweredby/videos/004.png" alt=""
+                  /></a>
+                </div>
+                <div class="comvideo__descr pt-1"></div>
+              </article>
+            </div>
+            <div class="swiper-slide">
+              <article class="comvideo">
+                <div class="comvideo__box">
+                  <a class="comvideo__screen" href="https://www.youtube.com/watch?v=CPmwnjDJ1Sk" data-youtube="data-youtube"
+                    ><span class="comvideo__txt comvideo__txt--small">Embracing The Service Consumption Shift In&nbsp;Banking</span><img src="/img/poweredby/videos/006.png" alt=""
                   /></a>
                 </div>
                 <div class="comvideo__descr pt-1"></div>
@@ -440,7 +655,7 @@
     <section class="frontconfs container">
       <h3 class="h3">Join The Community At Events <br />And Meetups Worldwide</h3>
       <div class="frontconfs__wrap">
-        <a class="frontconfcard frontconfcard--red" href="/events.html#online"
+        <a class="frontconfcard frontconfcard--red" href="/events.html#virtual"
           ><div class="frontconfs__iconwrap pb-3"><img src="/img/frontpage/events/001.svg" alt="" /></div>
           <h4 class="h5 frontconfcard__title pb-2">Ignite Virtual Meetup</h4>
           <p>Experts and practitioners make <strong>online-talks and presentations</strong> and share their Apache Ignite experience.</p>
@@ -457,7 +672,7 @@
             <p class="capstext">Online</p>
             <div class="frontconfcard__cal">Annually</div>
           </div></a
-        ><a class="frontconfcard" href="/events.html#offline"
+        ><a class="frontconfcard" href="/events.html#upcoming"
           ><div class="frontconfs__iconwrap pb-3"><img src="/img/frontpage/events/003.svg" alt="" /></div>
           <h4 class="h5 frontconfcard__title pb-2">Other Events</h4>
           <p>Join us for <strong>conferences, presentations, and webinars</strong> to learn more about in-memory computing technologies.</p>
@@ -499,7 +714,7 @@
           </div>
         </div>
         <div class="frontresourse__col">
-          <div class="capstext pb-5">Technical resources</div>
+          <div class="capstext pb-5">Learning resources</div>
           <div class="frontresitem flexi frontresitem--red">
             <div class="frontresitem__icon"><img src="/img/frontpage/res-videos.svg" alt="" /></div>
             <div class="frontresitem__text">Dozens of essential videos and webinar <br />recordings</div>
@@ -514,14 +729,15 @@
           </div>
         </div>
       </div>
+      <div class="frontconfs__bottom pt-5"><a class="button button--shadow" href="/resources.html">View all resources</a></div>
     </section>
     <section class="toolingend toolingend--front">
       <div class="container flexi">
         <div class="toolingend__main">
           <h2 class="toolingend__title h3">Ready To Start?</h2>
-          <p class="fz20 pt-1x">Discover our quick start guides and build your first <br />application in 5-10 minutes</p>
+          <p class="h5 pt-2">Discover our quick start guides and build your first <br />application in 5-10 minutes</p>
         </div>
-        <div class="toolingend__action"><a class="button" href="#">Discover Quick Start Guide</a></div>
+        <div class="toolingend__action"><a class="button" href="https://ignite.apache.org/docs/latest/" target="_blank">Discover Quick Start Guide</a></div>
       </div>
     </section>
     <a class="scrollTop" href="#"
diff --git a/public/js/main.js b/public/js/main.js
index ae60fa4..0fb4203 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -71,6 +71,44 @@
 })();
 
 
+
+
+function topmeny(){
+    let dropMenu = document.querySelector('.dropmenu');
+    let dropBack = document.querySelector('.dropmenu__back');
+    let hdr = document.querySelector('.hdr');
+    if(!dropMenu) return;
+
+    document.addEventListener('mouseover', (e) => {
+        e.preventDefault();
+        let item = e.target.closest('a[data-panel].hdrmenu--expanded');
+        if(item && item.dataset.panel !== ""){
+            document.querySelectorAll('.dropmenu__panel').forEach(el => {
+                el.classList.toggle('active', el.dataset.menupanel === item.dataset.panel);
+            });
+            document.querySelectorAll('.hdrmenu--expanded.active').forEach(el => {
+                el.classList.remove('active');
+            })
+
+            hdr && hdr.classList.add('opened');
+            item.classList.add('active');
+            dropMenu.classList.add('active');
+            dropBack.classList.add('active');
+        }
+        let shadow = e.target.closest('.dropmenu__back');
+        if(shadow){
+            dropMenu.classList.remove('active');
+            dropBack.classList.remove('active');
+            document.querySelectorAll('.hdrmenu--expanded.active').forEach(el => {
+                el.classList.remove('active');
+            });
+            hdr && hdr.classList.remove('opened');
+        } 
+    });
+}
+topmeny();
+
+
 // const jsNavBlock = document.querySelector('.jsNavBlock');
 // const startNavBlockCoord = jsNavBlock.getBoundingClientRect().y + window.pageYOffset;
 // console.log(startNavBlockCoord);
@@ -357,7 +395,7 @@
 
 let jsMainSlider = new Swiper('.jsFrontVideosSwiper', {
     autoHeight: false,
-    loop: true,
+    loop: false,
     spaceBetween: 30,
     slidesPerView: 'auto',
     pagination: {
diff --git a/public/ls.html b/public/ls.html
index bf6d798..2e7637b 100644
--- a/public/ls.html
+++ b/public/ls.html
@@ -47,36 +47,191 @@
       </div>
     </div>
     <!-- MOBILE MENU END -->
-    <header class="hdr">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
+    <header class="hdr hdr__white">
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a class="hdrmenu__current" href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a class="hdrmenu__current" href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="temppages container pt-5">
       <h2 class="pt-5">Pages List</h2>
       <ul class="dashlist pt-4 pb-5">
diff --git a/public/resources.html b/public/resources.html
index 121e77c..6bb0ae3 100644
--- a/public/resources.html
+++ b/public/resources.html
@@ -8,9 +8,10 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
+    <link rel="stylesheet" href="../css/communnity.css" />
+    <link rel="stylesheet" href="../css/resources.css" />
     <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
     <link rel="icon" type="image/png" href="/img/favicon.png" />
-    <link rel="stylesheet" href="../css/resources.css" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -48,36 +49,191 @@
       </div>
     </div>
     <!-- MOBILE MENU END -->
-    <header class="hdr hdr__grey">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
+    <header class="hdr hdr__grey hdr__white">
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <!--Миксин для блока с видео-->
     <section class="reshero">
       <div class="container">
diff --git a/public/test.html b/public/test.html
index 260c0b4..64635bd 100644
--- a/public/test.html
+++ b/public/test.html
@@ -12,140 +12,178 @@
     <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
-    <!-- MOBILE MENU START -->
-    <div class="hystmodal" id="jsMenuModal" aria-hidden="true">
-      <div class="hystmodal__wrap">
-        <div class="hystmodal__window mobmenu" role="dialog" aria-modal="true">
-          <button data-hystclose class="hystmodal__close">Close</button>
-          <div class="mobmenu__wrap">
-            <a href="/" class="mobmenu__logo"><img src="/img/logo.svg" alt="Логотип" /></a>
-            <div class="mobmenu__menu">
-              <div class="mobmenu__h1 berlin">Navigation</div>
-              <ul>
-                <li>
-                  <a href="/">Get started</a>
-                </li>
-                <li>
-                  <a href="/features/">Features</a>
-                </li>
-                <li>
-                  <a href="/community.html">Community</a>
-                </li>
-                <li>
-                  <a href="/use-cases/provenusecases.html">Powered by</a>
-                </li>
-                <li>
-                  <a href="https://ignite.apache.org/docs/latest/">Docs</a>
-                </li>
-              </ul>
-            </div>
-            <!-- //mobmenu__menu -->
-          </div>
-          <!-- //mobmenu__wrap -->
-        </div>
-        <!-- //mobmenu -->
-      </div>
-    </div>
-    <!-- MOBILE MENU END -->
     <header class="hdr">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a class="hdrmenu__current" href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu__current hdrmenu--expanded" href="/test" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="#"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="#"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="#">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="#"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a class="hdrmenu__current" href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
-    <section class="temppages container pt-5">
-      <h2 class="pt-5">Committers List</h2>
-      <p>здесь будет вывод</p>
-      <p>Alexander Shapkin</p>
-      <p>Alexey Goncharuk</p>
-      <p>Alexey Kuznetsov</p>
-      <p>Alexey Plehanov</p>
-      <p>Alexey Scherbakov</p>
-      <p>Alexey Zinoviev</p>
-      <p>Andrey Alexandrov</p>
-      <p>Andrey Gura</p>
-      <p>Andrey Novikov</p>
-      <p>Andrew Mashenkov</p>
-      <p>Anton Vinogradov</p>
-      <p>Artem Budnikov</p>
-      <p>Branko Čibej</p>
-      <p>Denis Magda</p>
-      <p>Dmitriy Govorukhin</p>
-      <p>Dmitriy Pavlov</p>
-      <p>Dmitriy Setrakyan</p>
-      <p>Evans Ye</p>
-      <p>Evgeny Stanilovsky</p>
-      <p>Gianfranco Murador</p>
-      <p>Henry Saputra</p>
-      <p>Igor Rudyak</p>
-      <p>Igor Sapego</p>
-      <p>Igor Seliverstov</p>
-      <p>Ilya Kasnacheev</p>
-      <p>Ilya Lantukh</p>
-      <p>Ilya Sterin</p>
-      <p>Irina Vasilinets</p>
-      <p>Ivan Bessonov</p>
-      <p>Ivan Daschinsky</p>
-      <p>Ivan Pavlukhin</p>
-      <p>Ivan Rakov</p>
-      <p>Konstantin Boudnik</p>
-      <p>Konstantin Orlov</p>
-      <p>Kseniya Romanova</p>
-      <p>Maxim Muzafarov</p>
-      <p>Mauricio Stekl</p>
-      <p>Michael Stack</p>
-      <p>Nikita Amelchev</p>
-      <p>Nikita Ivanov</p>
-      <p>Nikita Safonov</p>
-      <p>Nikolai Izhikov</p>
-      <p>Nikolai Tikhonov</p>
-      <p>Ognen Duzlevski</p>
-      <p>Pavel Tupitsyn</p>
-      <p>Pavel Kovalenko</p>
-      <p>Peter Ivanov</p>
-      <p>Raúl Kripalani</p>
-      <p>Roman Shaposhnik</p>
-      <p>Roman Shtykh</p>
-      <p>Saikat Maitra</p>
-      <p>Semyon Boikov</p>
-      <p>Sergey Chugunov</p>
-      <p>Sergey Evdokimov</p>
-      <p>Sergey Khisamov</p>
-      <p>Sergey Vladykin</p>
-      <p>Sergey Stronchinsky</p>
-      <p>Taras Ledkov</p>
-      <p>Valentin Kulichenko</p>
-      <p>Vladimir Ozerov</p>
-      <p>Vladisav Jelisavcic</p>
-      <p>Vyacheslav Daradur</p>
-      <p>Vyacheslav Koptilin</p>
-      <p>Yakov Zhdanov</p>
-      <p>Yury Babak</p>
-    </section>
+    <div class="dropmenu__back"></div>
+    <h1 class="h1">TEST</h1>
     <a class="scrollTop" href="#"
       ><svg class="feather feather-chevron-up" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
         <polyline points="18 15 12 9 6 15"></polyline></svg
diff --git a/public/use-cases/digital-integration-hub.html b/public/use-cases/digital-integration-hub.html
index 1b94a9a..153a560 100644
--- a/public/use-cases/digital-integration-hub.html
+++ b/public/use-cases/digital-integration-hub.html
@@ -8,11 +8,11 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../css/digital-hub.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -51,35 +51,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main innerhero__mainhub">
@@ -267,7 +422,7 @@
         <article class="nativebotblock nativebotblock--learn">
           <h3 class="h4 nativebotblock__title"><img class="nativebotblock__icon" src="/img/features/native-docs.svg" alt="" /><span>Want to Learn More?</span></h3>
           <p class="nativebotblock__text">Run our digital integration hub sample application</p>
-          <a class="nativebotblock__link arrowlink" href="https://cwiki.apache.org/confluence/display/IGNITE/Ignite+Persistent+Store+-+under+the+hood" target="_blank">Download the sample project</a>
+          <a class="nativebotblock__link arrowlink" href="https://github.com/GridGain-Demos/gridgain-dih-demo" target="_blank">Download The Sample Project</a>
         </article>
       </div>
     </section>
diff --git a/public/use-cases/hadoop-acceleration.html b/public/use-cases/hadoop-acceleration.html
index ee1e344..fb38062 100644
--- a/public/use-cases/hadoop-acceleration.html
+++ b/public/use-cases/hadoop-acceleration.html
@@ -8,12 +8,12 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../css/digital-hub.css" />
     <link rel="stylesheet" href="../css/hadoop.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -52,35 +52,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -90,8 +245,7 @@
           </h1>
           <div class="innerhero__descr pt-2 h5">
             Achieve the performance acceleration of Hadoop-based<br />
-            application with Ignite as a high-performance data access<br />
-            layer
+            application with Ignite as a high-performance data access layer
           </div>
           <div class="innerhero__action"><a class="button innerhero__button" href="https://ignite.apache.org/docs/latest/index">Start Coding</a></div>
         </div>
@@ -134,8 +288,8 @@
             <h2 class="doop3__h2 h5">There are 3 basic steps:</h2>
             <div class="fz20 doop3__number">01</div>
             <p class="doop3__subtext">
-              Depending on the data volume and available memory capacity, you can enable<a href="https://ignite.apache.org/arch/native-persistence.html" target="_blank"> Ignite native persistence</a> to store historical data sets on disk
-              while dedicating a memory space for operational records.
+              Depending on the data volume and available memory capacity, you can enable<a href="/arch/native-persistence.html" target="_blank"> Ignite native persistence</a> to store historical data sets on disk while dedicating a memory
+              space for operational records.
             </p>
             <p class="doop3__subtext pt-1">You can continue to use Hadoop as storage for less frequently used data or for long-running and ad-hoc analytical queries.</p>
             <div class="fz20 doop3__number">02</div>
@@ -145,8 +299,8 @@
             <div class="fz20 doop3__number">03</div>
             <p class="doop3__subtext">Consider using Apache Spark DataFrames APIs if an application needs to run federated or cross-database queries across Ignite and Hadoop clusters.</p>
             <p class="doop3__subtext pt-1">
-              Ignite is <a href="https://ignite.apache.org/use-cases/spark-acceleration.html" target="_blank">integrated with Spark</a>, which natively supports Hive/Hadoop. Cross-database queries should be considered only for a limited
-              number of scenarios when neither Ignite nor Hadoop contains the entire data set.
+              Ignite is <a href="/use-cases/spark-acceleration.html" target="_blank">integrated with Spark</a>, which natively supports Hive/Hadoop. Cross-database queries should be considered only for a limited number of scenarios when
+              neither Ignite nor Hadoop contains the entire data set.
             </p>
           </div>
           <img class="doop3__image" src="/img/usecases/hadoop/image.svg" alt="image" />
@@ -226,7 +380,7 @@
         <article class="nativebotblock nativebotblock--learn">
           <h3 class="h4 nativebotblock__title"><img class="nativebotblock__icon" src="/img/features/native-docs.svg" alt="" /><span>Want to Learn More?</span></h3>
           <p class="nativebotblock__text">Read the Apache Spark acceleration article</p>
-          <a class="nativebotblock__link arrowlink" href="https://ignite.apache.org/use-cases/spark-acceleration.html" target="_blank">Apache Spark Acceleration</a>
+          <a class="nativebotblock__link arrowlink" href="/use-cases/spark-acceleration.html">Apache Spark Acceleration Article</a>
         </article>
       </div>
     </section>
diff --git a/public/use-cases/high-performance-computing.html b/public/use-cases/high-performance-computing.html
index 66f1712..9b1a81d 100644
--- a/public/use-cases/high-performance-computing.html
+++ b/public/use-cases/high-performance-computing.html
@@ -8,10 +8,10 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/high-performance-computing.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -50,35 +50,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
diff --git a/public/use-cases/in-memory-cache.html b/public/use-cases/in-memory-cache.html
index 2e922d5..0850dea 100644
--- a/public/use-cases/in-memory-cache.html
+++ b/public/use-cases/in-memory-cache.html
@@ -8,10 +8,10 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/in-memory-cache.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -50,40 +50,194 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main innerhero__main--long">
-          <div class="innerhero__pre pb-5">Apache Ignite</div>
-          <h1 class="h1 innerhero__h1">Distributed <br />In-Memory Cache</h1>
+          <h1 class="h1 innerhero__h1">Distributed <br />In-Memory Cache<br /><span class="with-apache">With Apache Ignite</span></h1>
           <div class="innerhero__descr pt-2 h5">
             Improve the performance and scalability of&nbsp;your applications, <br />
             databases, and microservices with Apache Ignite
diff --git a/public/use-cases/in-memory-data-grid.html b/public/use-cases/in-memory-data-grid.html
index 51427ea..420d3b9 100644
--- a/public/use-cases/in-memory-data-grid.html
+++ b/public/use-cases/in-memory-data-grid.html
@@ -8,13 +8,13 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../css/digital-hub.css" />
     <link rel="stylesheet" href="../css/database.css" />
     <link rel="stylesheet" href="../css/datagrid.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -53,35 +53,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -219,7 +374,7 @@
         <div class="grid5__blocks flexi">
           <article class="native2item grid5__item"><p class="grid5__text">Increase the performance and scalability of real-time applications and external databases.</p></article>
           <article class="native2item grid5__item">
-            <p class="grid5__text">Support <a href="https://ignite.apache.org/use-cases/high-performance-computing.html" target="_blank"> high-performance computing.</a></p>
+            <p class="grid5__text">Support <a href="/use-cases/high-performance-computing.html"> high-performance computing.</a></p>
           </article>
           <article class="native2item grid5__item"><p class="grid5__text">Cache data that is scattered across databases.</p></article>
         </div>
@@ -272,7 +427,7 @@
         <article class="nativebotblock nativebotblock--learn">
           <h3 class="h4 nativebotblock__title"><img class="nativebotblock__icon" src="/img/features/native-docs.svg" alt="" /><span>Want to View More Use-Cases?</span></h3>
           <p class="nativebotblock__text">Read the In-Memory Database article</p>
-          <a class="nativebotblock__link arrowlink" href="https://ignite.apache.org/use-cases/in-memory-database.html" target="_blank">In-Memory Database</a>
+          <a class="nativebotblock__link arrowlink" href="/use-cases/in-memory-database.html">In-Memory Database</a>
         </article>
       </div>
     </section>
diff --git a/public/use-cases/in-memory-database.html b/public/use-cases/in-memory-database.html
index 332b20a..075042e 100644
--- a/public/use-cases/in-memory-database.html
+++ b/public/use-cases/in-memory-database.html
@@ -8,12 +8,12 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../css/digital-hub.css" />
     <link rel="stylesheet" href="../css/database.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -52,35 +52,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -280,7 +435,7 @@
         <article class="nativebotblock nativebotblock--learn">
           <h3 class="h4 nativebotblock__title"><img class="nativebotblock__icon" src="/img/features/native-docs.svg" alt="" /><span>Want to View More Use-Cases?</span></h3>
           <p class="nativebotblock__text">Read the In-Memory Cache article</p>
-          <a class="nativebotblock__link arrowlink" href="https://ignite.apache.org/use-cases/in-memory-cache.html" target="_blank">In-Memory Cache</a>
+          <a class="nativebotblock__link arrowlink" href="/use-cases/in-memory-cache.html">In-Memory Cache Article</a>
         </article>
       </div>
     </section>
diff --git a/public/use-cases/index.html b/public/use-cases/index.html
index e2a110e..2ca681f 100644
--- a/public/use-cases/index.html
+++ b/public/use-cases/index.html
@@ -8,9 +8,9 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
+    <link rel="stylesheet" href="../css/usecases.css" />
     <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
     <link rel="icon" type="image/png" href="/img/favicon.png" />
-    <link rel="stylesheet" href="../css/usecases.css" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -49,35 +49,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -128,7 +283,7 @@
       </div>
     </section>
     <!-- /.usecase2-->
-    <section class="usecase3">
+    <section class="usecase3" id="database">
       <div class="container">
         <div class="blockheader usecase3__block flexi">
           <h2 class="h4 blockheader__left">Distributed Database For HTAP Workloads</h2>
diff --git a/public/use-cases/key-value-store.html b/public/use-cases/key-value-store.html
index b1229e5..b9b51b1 100644
--- a/public/use-cases/key-value-store.html
+++ b/public/use-cases/key-value-store.html
@@ -8,14 +8,14 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
-    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
-    <link rel="icon" type="image/png" href="/img/favicon.png" />
     <link rel="stylesheet" href="../css/native-persistence.css" />
     <link rel="stylesheet" href="../css/compute-apis.css" />
     <link rel="stylesheet" href="../css/digital-hub.css" />
     <link rel="stylesheet" href="../css/datagrid.css" />
     <link rel="stylesheet" href="../css/hadoop.css" />
     <link rel="stylesheet" href="../css/key-value-store.css" />
+    <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
+    <link rel="icon" type="image/png" href="/img/favicon.png" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -54,35 +54,190 @@
     </div>
     <!-- MOBILE MENU END -->
     <header class="hdr hdr__blue">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo-white.svg" alt="" /></a
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+          <div class="dropmenu__panel" data-menupanel="features">
+            <div class="container dropmenu2__grid">
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Distributed <br />Multi-Tiered Storage</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/multi-tier-storage.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Multi-Tier Storage</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/arch/native-persistence.html"><img src="/img/menu/icon-db.svg" alt="" /><span>Native Persistence</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Essentail Developer <br />APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/sql.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Distributed SQL</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/distributed-key-value-store.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Key-Value APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/acid-transactions.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>ACID Transactions</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">High-Performance <br />Computing APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/compute-apis.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Compute APIs</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/servicegrid.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Services</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/machinelearning.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Machine Learning</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu2__col dropmenu__box">
+                <div class="capstext">Real Streaming APIs</div>
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/features/streaming.html"><img src="/img/menu/icon-cube.svg" alt="" /><span>Streaming</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/messaging"><img src="/img/menu/icon-cube.svg" alt="" /><span>Messaging</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="https://ignite.apache.org/docs/latest/key-value-api/continuous-queries"><img src="/img/menu/icon-cube.svg" alt="" /><span>Continuous Queries</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__right dropmenu2__col">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu2__grid-->
+            <div class="panelmorelinkwrap"><a class="panellink" href="/features/">View all</a></div>
+          </div>
+          <!-- /.dropmenu__panel-2-->
+          <div class="dropmenu__panel" data-menupanel="community">
+            <div class="container dropmenu1__grid dropmenu3__grid">
+              <div class="dropmenu__box dropmenu--left dropmenu3--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/"><img src="/img/menu/icon-clip.svg" alt="" /><span>Apache Ignite Story</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-comment.svg" alt="" /><span>Meet The Community</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/community.html"><img src="/img/menu/icon-puzzle.svg" alt="" /><span>Start Contributing</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>Ask A Question</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">Events</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#summit"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Apache Ignite Summit</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#meetups"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Meetups</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#upcoming"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Upcoming Events</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/events.html#past"><img src="/img/menu/icon-calendar.svg" alt="" /><span>Past Events</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/icon-red-rocket.svg" alt="" /><span>Quick Start Guide</span></a>
+              </div>
+            </div>
+            <!-- /.dropmenu1__grid-->
+          </div>
+          <!-- /.dropmenu__panel-->
+        </div>
+        <!-- /.dropmeu-->
       </div>
     </header>
-    <header class="hdrfloat">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
-        ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
-        <nav class="hdrmenu">
-          <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="/docs.html">Docs</a></li>
-          </ul>
-        </nav>
-      </div>
-    </header>
+    <div class="dropmenu__back"></div>
     <section class="innerhero">
       <div class="container innerhero__cont">
         <div class="innerhero__main">
@@ -181,7 +336,7 @@
         <article class="nativebotblock nativebotblock--learn">
           <h3 class="h4 nativebotblock__title"><img class="nativebotblock__icon" src="/img/features/native-docs.svg" alt="" /><span>Want to Learn More?</span></h3>
           <p class="nativebotblock__text">Check out Ignite key-value APIs article</p>
-          <a class="nativebotblock__link arrowlink" href="/features/distributed-key-value-store.html" target="_blank">Key-Value APIs</a>
+          <a class="nativebotblock__link arrowlink" href="/features/distributed-key-value-store.html">Key-Value APIs Article</a>
         </article>
       </div>
     </section>
diff --git a/public/use-cases/provenusecases.html b/public/use-cases/provenusecases.html
index 2014451..9da4916 100644
--- a/public/use-cases/provenusecases.html
+++ b/public/use-cases/provenusecases.html
@@ -8,9 +8,9 @@
     <link rel="stylesheet" href="/js/vendor/swiper/swiper-bundle.min.css" />
     <link rel="stylesheet" href="/css/utils.css" />
     <link rel="stylesheet" href="/css/site.css" />
+    <link rel="stylesheet" href="../css/usecases.css" />
     <link rel="stylesheet" href="/css/media.css" media="only screen and (max-width:1199px)" />
     <link rel="icon" type="image/png" href="/img/favicon.png" />
-    <link rel="stylesheet" href="../css/usecases.css" />
   </head>
   <body>
     <!-- MOBILE MENU START -->
@@ -48,36 +48,191 @@
       </div>
     </div>
     <!-- MOBILE MENU END -->
-    <header class="hdr hdr__grey">
-      <div class="cmtyhero__wrap flexi">
-        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button><a class="hdr__logo" href="/"><img class="hdr__logoimg" src="/img/logo.svg" alt="" /></a
+    <header class="hdr hdr__grey hdr__white">
+      <div class="hdr__wrap flexi">
+        <button class="hdr__burger" data-menumodal="#jsMenuModal"><img src="/img/menu.svg" alt="" /></button
+        ><a class="hdr__logo" href="/"><img class="hdr__logoimg hdr__logo--white" src="/img/logo-white.svg" alt="" /><img class="hdr__logoimg hdr__logo--black" src="/img/logo.svg" alt="" /></a
         ><a class="button hdr__button" href="/download.html">Download Ignite 2.11 </a>
         <nav class="hdrmenu">
           <ul class="flexi">
-            <li><a href="/">Get started</a></li>
-            <li><a href="/features">Features</a></li>
-            <li><a href="/community.html">Community</a></li>
-            <li><a class="hdrmenu__current" href="/use-cases/provenusecases.html">Powered by</a></li>
-            <li><a href="///ignite.apache.org/docs/latest/">Docs</a></li>
+            <li><a class="hdrmenu--expanded" href="/" data-panel="getStarted">Get started</a></li>
+            <li><a class="hdrmenu--expanded" href="/features" data-panel="features">Features</a></li>
+            <li><a class="hdrmenu--expanded" href="/community.html" data-panel="community">Community</a></li>
+            <li><a class="hdrmenu__current" href="/use-cases/provenusecases.html" data-panel="">Powered by</a></li>
+            <li><a href="///ignite.apache.org/docs/latest/" data-panel="">Docs</a></li>
           </ul>
         </nav>
+        <div class="dropmenu">
+          <div class="dropmenu__panel" data-menupanel="getStarted">
+            <div class="container dropmenu1__grid">
+              <div class="dropmenu__box dropmenu--left">
+                <ul class="dropmenu__menu">
+                  <li>
+                    <a class="dropmenu__iconitem" href="/resources.html"><img src="/img/menu/icon-resources.svg" alt="" /><span>Resources</span></a>
+                  </li>
+                  <li>
+                    <a class="dropmenu__iconitem" href="/faq.html"><img src="/img/menu/icon-question.svg" alt="" /><span>FAQ</span></a>
+                  </li>
+                </ul>
+              </div>
+              <div class="dropmenu1__center">
+                <div class="dropmenu__box">
+                  <p class="capstext">USE CASES</p>
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-cache.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Cache</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-data-grid.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Data Grid</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/in-memory-database.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>In-Memory Database</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/key-value-store.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Key-Value Store</span></a>
+                    </li>
+                  </ul>
+                </div>
+                <div class="dropmenu__box">
+                  <ul class="dropmenu__menu">
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/high-performance-computing.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>High-Performance Computing</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/digital-integration-hub.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Digital Integration Hub</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/spark-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Spark Acceleration</span></a>
+                    </li>
+                    <li>
+                      <a class="dropmenu__iconitem" href="/use-cases/hadoop-acceleration.html"><img src="/img/menu/icon-folder.svg" alt="" /><span>Hadoop Acceleration</span></a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+              <div class="dropmenu1__right">
+                <a class="dropmenu__redbutton" href="https://ignite.apache.org/docs/latest/"> <img src="/img/menu/i