diff --git a/Archive.zip b/Archive.zip
new file mode 100644
index 0000000..a71c09f
Binary files /dev/null and b/Archive.zip differ
diff --git a/layout/common/navbar.ftl b/layout/common/navbar.ftl
index cb52a9e..2a6c056 100644
--- a/layout/common/navbar.ftl
+++ b/layout/common/navbar.ftl
@@ -1,7 +1,7 @@
 <#macro navbar layout>
-    <nav class="navbar navbar-main">
-        <div class="container">
-            <div class="navbar-brand is-flex-center">
+    <nav class="navbar navbar-main has-background-white is-fixed-top is-paddingless " style="box-shadow: none !important;">
+        <div class="container ">
+            <div class="navbar-brand transparent">
                 <a class="navbar-item navbar-logo" href="${context!}">
                     <#if options.blog_logo?? && options.blog_logo!=''>
                         <img src="${options.blog_logo!}" alt="${options.blog_title!}" height="28">
@@ -9,44 +9,55 @@
                         ${options.blog_title!}
                     </#if>
                 </a>
+                <span class="navbar-burger burger" data-target="navMenu">
+                                <span></span>
+                                <span></span>
+                                <span></span>
+                            </span>
             </div>
-            <div class="navbar-menu">
-                <@menuTag method="tree">
-                    <#if menus?? && menus?size gt 0>
-                        <#if settings.tree_menu_enable!false>
-                            <div class="navbar-start">
-                                <#list menus?sort_by('priority') as menu>
-                                    <#if menu.children?? && menu.children?size gt 0>
-                                        <div class="navbar-item has-dropdown is-hoverable">
-                                            <a class="sub-menu">
-                                                ${menu.name!}
-                                            </a>
-                                            <div class="navbar-dropdown is-boxed">
-                                                <#list menu.children as child>
-                                                    <a class="navbar-item"
-                                                       href="${child.url!}">
-                                                        ${child.name!}
-                                                    </a>
-                                                </#list>
+            <div id="navMenu" class="navbar-menu transparent">
+                <div class="navbar-start transparent">
 
-                                            </div>
-                                        </div>
-                                    <#else>
-                                        <a class="navbar-item" href="${menu.url}"
-                                           target="${menu.target!}">${menu.name}</a>
-                                    </#if>
-                                </#list>
-                            </div>
-                        <#else>
-                            <#if menus?? && menus?size gt 0>
+                    <@menuTag method="tree">
+                        <#if menus?? && menus?size gt 0>
+                            <#if settings.tree_menu_enable!false>
                                 <div class="navbar-start">
                                     <#list menus?sort_by('priority') as menu>
-                                        <a class="navbar-item" href="${menu.url}" target="${menu.target!}">${menu.name}</a>
+                                        <#if menu.children?? && menu.children?size gt 0>
+                                            <div class="navbar-item has-dropdown is-hoverable">
+                                                <a class="sub-menu">
+                                                    ${menu.name!}
+                                                </a>
+                                                <div class="navbar-dropdown is-boxed">
+                                                    <#list menu.children as child>
+                                                        <a class="navbar-item"
+                                                           href="${child.url!}">
+                                                            ${child.name!}
+                                                        </a>
+                                                    </#list>
+
+                                                </div>
+                                            </div>
+                                        <#else>
+                                            <a class="navbar-item" href="${menu.url}"
+                                               target="${menu.target!}">${menu.name}</a>
+                                        </#if>
                                     </#list>
+
                                 </div>
-                            </#if>                        </#if>
-                    </#if>
-                </@menuTag>
+                            <#else>
+                                <#if menus?? && menus?size gt 0>
+                                    <div class="navbar-start">
+                                        <#list menus?sort_by('priority') as menu>
+                                            <a class="navbar-item" href="${menu.url}"
+                                               target="${menu.target!}">${menu.name}</a>
+                                        </#list>
+                                    </div>
+                                </#if>                        </#if>
+                        </#if>
+                    </@menuTag>
+
+                </div>
                 <div class="navbar-end">
                     <#--                ${settings.links_top!}-->
                     <a class="navbar-item search" title="夜间模式" href="javascript:alert('开发中，敬请期待');">
@@ -57,21 +68,17 @@
                     </a>
                 </div>
             </div>
-        </div>
     </nav>
     <style>
-        .navbar-dropdown {
-            /*background-color: #fff;*/
-            /*border-bottom-left-radius: 6px;*/
-            /*border-bottom-right-radius: 6px;*/
-            /*border-top: 2px solid #dbdbdb;*/
-            /*box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);*/
-            /*font-size: .875rem;*/
-            /*min-width: 100%;*/
-            /*position: absolute;*/
-            /*top: 100%;*/
-            /*z-index: 20;*/
-            /*width: 120px;*/
-        }
     </style>
+    <script>
+        (function () {
+            var burger = document.querySelector('.burger');
+            var menu = document.querySelector('#' + burger.dataset.target);
+            burger.addEventListener('click', function () {
+                burger.classList.toggle('is-active');
+                menu.classList.toggle('is-active');
+            });
+        })();
+    </script>
 </#macro>
diff --git a/source/css/style.css b/source/css/style.css
index 63c3b3c..90bda95 100644
--- a/source/css/style.css
+++ b/source/css/style.css
@@ -8,7 +8,7 @@ body {
   background-color: #f7f7f7;
 }
 .section {
-  padding: 2rem 1.5rem;
+  padding: 6rem 1.5rem;
 }
 body,
 button,
@@ -36,7 +36,7 @@ textarea {
 }
 @media screen and (max-width: 768px) {
   .section {
-    padding: 1.5rem 1rem;
+    padding: 5.5rem 1rem;
   }
 }
 @media screen and (min-width: 769px) {
@@ -100,30 +100,7 @@ img.thumbnail {
 .navbar-main {
   box-shadow: 0 4px 10px rgba(0,0,0,0.05);
 }
-.navbar-main .navbar-menu,
-.navbar-main .navbar-start,
-.navbar-main .navbar-end {
-  align-items: stretch;
-  display: flex;
-  padding: 0;
-  flex-shrink: 0;
-}
-.navbar-main .navbar-menu {
-  flex-grow: 1;
-  flex-shrink: 0;
-}
-.navbar-main .navbar-start {
-  justify-content: flex-start;
-  margin-right: auto;
-  font-size: 15px;
-}
-.navbar-main .navbar-end {
-  justify-content: flex-end;
-  margin-left: auto;
-}
 .navbar-main .navbar-item {
-  display: flex;
-  align-items: center;
   padding: 1.25rem 0.75rem;
   padding-right: 1.5rem;
 }
@@ -138,24 +115,13 @@ img.thumbnail {
 }
 .navbar-main .navbar-item .sub-menu {
   color: #4a4a4a;
+  padding-top: 3px;
 }
 .navbar-main .navbar-item .sub-menu:after {
   content: '\2022';
   position: absolute;
   color: #3273dc;
 }
-@media screen and (max-width: 1087px) {
-  .navbar-main .navbar-menu {
-    justify-content: center;
-    box-shadow: none;
-  }
-  .navbar-main .navbar-start {
-    margin-right: 0;
-  }
-  .navbar-main .navbar-end {
-    margin-left: 0;
-  }
-}
 .footer {
   background: #fff;
 }
diff --git a/source/css/style.styl b/source/css/style.styl
index 723db8a..0990982 100644
--- a/source/css/style.styl
+++ b/source/css/style.styl
@@ -16,7 +16,7 @@ body
     background-color: #f7f7f7
 
 .section
-    padding: 2rem 1.5rem
+    padding: 6rem 1.5rem
 
 body, button, input, select, textarea
     font-family: family-sans
@@ -36,7 +36,7 @@ body, button, input, select, textarea
 
 @media screen and (max-width: screen-tablet - 1)
     .section
-        padding: 1.5rem 1rem
+        padding: 5.5rem 1rem
 
 @media screen and (min-width: screen-tablet)
     .column-main,
@@ -104,57 +104,25 @@ img.thumbnail
 
 .navbar-main
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05)
-    .navbar-menu,
-    .navbar-start,
-    .navbar-end
-        align-items: stretch
-        display: flex
-        padding: 0
-        flex-shrink: 0
-    .navbar-menu
-        flex-grow: 1
-        flex-shrink: 0
-    .navbar-start
-        justify-content: flex-start
-        margin-right: auto
-        font-size:15px
-    .navbar-end
-        justify-content: flex-end
-        margin-left: auto
     .navbar-item
-        display: flex
-        align-items: center
         padding: 1.25rem 0.75rem
         padding-right: 1.5rem
         &.is-active
             color: hsl(217, 71%, 53%)
             background-color: transparent
-        //&.is-active:after
-        //    content: '*';
-        //    position: absolute;
-        //    top: 40px;
-        //    left: 20px;
         .navbar-dropdown
             border-radius: 2px
             box-shadow 0 8px 8px rgba(10,10,10,.1)
             font-weight: 500
         .sub-menu {
             color: #4a4a4a
+            padding-top: 3px;
         }
         .sub-menu:after
             content '\2022'
             position absolute
             color: #3273dc
 
-    @media screen and (max-width: screen-desktop - 1)
-        .navbar-menu
-            justify-content: center
-            box-shadow: none
-        .navbar-start
-            margin-right: 0
-        .navbar-end
-            margin-left: 0
-
 .footer
     background: white
     .field