diff --git a/assets/javascripts/app.js b/assets/javascripts/app.js
index 1ffdc53..96393ac 100644
--- a/assets/javascripts/app.js
+++ b/assets/javascripts/app.js
@@ -435,8 +435,8 @@
       $('.outdropdowns').before($('.header-nav'));
       orbit.ClickMenuHandler();
     }else{
-      $('.outdropdowns').after($('.header-nav'));
-      $('.navbar-header').before($('.modules-menu'));
+      $('.outdropdowns').before($('.header-nav'));
+      $('.navbar-header').after($('.modules-menu'));
     }
 
     // 自適應網頁使用，當使用者改變瀏覽器寬度時呼叫orbit.nav.setDropdown函數
@@ -455,12 +455,12 @@
       },500 )} else {
         resizeTimer = setTimeout(function(){
           if( $('.mobile-menu .modules-menu').length > 0 ) {
-            $('.navbar-header').before($('.modules-menu'));
+            $('.navbar-header').after($('.modules-menu'));
           }
           orbit.removeDropdown();
         }, 500);
-              $('.outdropdowns').after($('.header-nav'));
-              $('.navbar-header').before($('.modules-menu'));
+        $('.outdropdowns').before($('.header-nav'));
+        $('.navbar-header').after($('.modules-menu'));
       }
     });
     // if($(window).width()<769){
diff --git a/assets/stylesheets/template/layout/content.scss b/assets/stylesheets/template/layout/content.scss
index c2c8b53..9226046 100644
--- a/assets/stylesheets/template/layout/content.scss
+++ b/assets/stylesheets/template/layout/content.scss
@@ -503,7 +503,7 @@ body{
 .internal-page{
   background-color: #fff;
   .kenjohn {
-      flex-wrap:wrap-reverse;
+      //flex-wrap:wrap-reverse;
       display: flex;
       .navbar-header{
         display: flex!important;
@@ -537,7 +537,7 @@ body{
     @media(min-width: 769px){
       .dropdowns{
         display: flex;
-        flex-direction: row-reverse;
+        //flex-direction: row-reverse;
       }
     }
 
diff --git a/assets/stylesheets/template/layout/header.scss b/assets/stylesheets/template/layout/header.scss
index 61d80b5..ab1e7c0 100644
--- a/assets/stylesheets/template/layout/header.scss
+++ b/assets/stylesheets/template/layout/header.scss
@@ -363,7 +363,8 @@ a#content{
   top: 0;
 }
 .navFixed,.navRel {
-    flex-wrap:wrap-reverse;
+    //flex-wrap:wrap-reverse;
+    flex-direction: column;
     display: flex;
     .navbar-header{
       display: flex!important;
@@ -395,7 +396,7 @@ a#content{
   @media(min-width: 769px){
     .dropdowns{
       display: flex;
-      flex-direction: row-reverse;
+      //flex-direction: row-reverse;
     }
   }
 
diff --git a/home/header.html.erb b/home/header.html.erb
index fe895d1..ad7edbe 100644
--- a/home/header.html.erb
+++ b/home/header.html.erb
@@ -19,29 +19,29 @@
 </div>
 <header class="navbar layout-header no-print" role="navigation">
   <div class="kenjohn">
+    <div class="header-nav container" >
+      <a id="accesskey_top" accesskey="U" title="accesskey top" href="#" title="Toolbar">:::</a>
+      {{header-data}}
+    </div>
     <div class="outdropdowns">
-        <div class="container dropdowns">
-          <div class="collapse navbar-collapse modules-menu" id="layout-navigation">
-          <a id="accesskey_menu" title="accesskey menu" accesskey="M" href="#" title="Main menu">:::</a>
-            <%= render_menu %>
-          </div>
-          <div class="navbar-header">
-            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#layout-navigation">
-              <span class="sr-only">Toggle navigation</span>
-              <span class="icon-bar icon-bar-top"></span>
-              <span class="icon-bar icon-bar-middle"></span>
-              <span class="icon-bar icon-bar-bottom"></span>
-            </button>
+      <div class="container dropdowns">
+        <div class="navbar-header">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#layout-navigation">
+            <span class="sr-only">Toggle navigation</span>
+            <span class="icon-bar icon-bar-top"></span>
+            <span class="icon-bar icon-bar-middle"></span>
+            <span class="icon-bar icon-bar-bottom"></span>
+          </button>
           <a title="{{site_title_1}}" class="navbar-brand" href="{{home_link_1}}"><img class="site-logo" src="{{logo_url_1}}" alt="site-logo"></a>
           <script>$(document).ready(function(){var url =$('.site-logo').eq(0).attr('src');if(url == "/assets/default-site-logo.png"){$('.navbar-brand').eq(0).remove();};if($('.navbar-brand').length == 2){$('.site-logo').css('height','auto')};$('.site-logo').eq(0).css('margin-right',0);$('.navbar-brand').css('padding-right',0)})</script>
-            <a title="{{site_title}}" class="navbar-brand" href="{{home_link}}"><img class="site-logo" src="{{logo_url}}" alt="site-logo"> {{site_name}}</a>
-          </div>
+          <a title="{{site_title}}" class="navbar-brand" href="{{home_link}}"><img class="site-logo" src="{{logo_url}}" alt="site-logo"> {{site_name}}</a>
         </div>
+        <div class="collapse navbar-collapse modules-menu" id="layout-navigation">
+          <a id="accesskey_menu" title="accesskey menu" accesskey="M" href="#" title="Main menu">:::</a>
+          <%= render_menu %>
+        </div>
+      </div>
     </div>
-        <div class="header-nav container" >
-        <a id="accesskey_top" accesskey="U" title="accesskey top" href="#" title="Toolbar">:::</a>
-          {{header-data}}
-        </div>
-        </div>
-    <section class="header-banner no-print single-child-datapp" data-pp="300"></section>
+  </div>
+  <section class="header-banner no-print single-child-datapp" data-pp="300"></section>
 </header>
diff --git a/modules/ad_banner/_ad_banner_widget2_video.html.erb b/modules/ad_banner/_ad_banner_widget2_video.html.erb
index b679956..95ec2a7 100644
--- a/modules/ad_banner/_ad_banner_widget2_video.html.erb
+++ b/modules/ad_banner/_ad_banner_widget2_video.html.erb
@@ -46,9 +46,9 @@
     }else{
       var audio_div;
       if ($self.hasClass('have-audio')){
-        audio_div = $('<div class="jarallax-video-audio"><i class="fas fa-volume-up"></i></div>');
+        audio_div = $('<button class="jarallax-video-audio"><i class="fas fa-volume-up"></i></button>');
       }else{
-        audio_div = $('<div class="jarallax-video-audio"><i class="fas fa-volume-mute"></i></div>');
+        audio_div = $('<button class="jarallax-video-audio"><i class="fas fa-volume-mute"></i></button>');
       }
       audio_div.click(function(event) {
         var currentTime = new Date();
@@ -249,7 +249,7 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
       top: 50%;
     }
   }
-  .jarallax-video-audio:hover{
+  .jarallax-video-audio:hover,.jarallax-video-audio:focus{
     color: #FFC500;
     transition: all 0.6s ease;
   }