diff --git a/main.css b/main.css
index 54482b11..235f02b7 100644
--- a/main.css
+++ b/main.css
@@ -18,6 +18,7 @@ body {
 	background-color:#3d3f3e;
 	margin:0px;
 	padding:0px;
+  overflow: hidden;
 }
 
 a {
@@ -108,7 +109,12 @@ input[type="number"]::-webkit-inner-spin-button {
 #main-wrapper {
     padding: 0px 0px 0 0px; /*   padding: 5px 5px 0 5px; */
     height: calc(100% - 7px);
-
+}
+.margin-top {
+  margin-top: 20px;
+}
+.margin-bottom {
+  margin-bottom: 20px;
 }
 
 .headerbar {
@@ -990,6 +996,61 @@ dialog {
 	padding-bottom:15px;
 }
 
+.content_wrapper {
+  /* leave 20px side padding always */
+  /*padding: 0 20px 0 20px;
+    for testing: */
+  padding: 20px;
+}
+
+.content_toolbar {
+  /*  content toolbar panel */
+  width: 100%;
+  height: 30px;
+  background: silver;
+  padding: 10px 0;
+  overflow: hidden;
+}
+
+.content_toolbar .btn {
+  /*  common styles for content toolbar buttons */
+  display: block;
+  float: right;
+  margin-right: 10px;
+  height: 28px;
+  line-height: 28px;
+  padding: 0 15px 0 15px;
+  text-align: center;
+  font-weight: bold;
+  border: 1px solid silver;
+  background-color: #ececec;
+}
+
+.toolbar_scroll_bottom .content_wrapper {
+  /*  content wrapper in view with toolbar in scroll bottom
+      leave 50px space for the toolbar
+      */
+  height: 100%;
+  margin: 0 0 -50px;
+}
+
+.toolbar_fixed_bottom .content_wrapper {
+  /*  content wrapper in view with toolbar fixed over bottom edge
+      leave 50px space for the toolbar
+      */
+  height: calc(100% - 50px);
+  overflow-y: auto;
+}
+
+.toolbar_fixed_bottom .content_toolbar {
+  position: absolute;
+  bottom: 0;
+}
+
+
+
+
+
 /* Colums  START> */
 
 .cf_column {
@@ -1394,12 +1455,9 @@ dialog {
 /* fixing padding for all Tabs*/
 
 .tab-setup, .tab-landing, .tab-adjustments, .tab-auxiliary, .tab-cli, .tab-configuration, .tab-dataflash, .tab-firmware_flasher, .tab-gps, .tab-help, .tab-led-strip, .tab-logging, .tab-modes, .tab-motors, .tab-pid_tuning, .tab-ports, .tab-receiver, .tab-sensors, .tab-servos {
-	padding:20px;
-	float:left;
-	width:calc(100% - 40px);
-	height:calc(100% - 40px) !important;
-	position:absolute !important;
-	}
+  height: 100%;
+  position: relative;
+}
 
 
 /* fixing logging tab*/
@@ -1443,18 +1501,17 @@ dialog {
 	color:#fff;
 	font-size: 10px;
 	}
-	
-	
+
+
 @media only screen and (max-width: 1055px), only screen and (max-device-width: 1055px) {
 
-	
+
 .tab_title {
 	font-size:16px;
 	line-height:18px;
-	height:24px;
 	font-family: 'open_sanslight', Arial;
 	margin-bottom:10px;
-	display:;
+  margin-top: 20px;
 	}
 
 .cf_doc_version_bt a {
@@ -1463,7 +1520,7 @@ dialog {
 	font-size:9px;
 	line-height:15px;
 	}
-		
+
 #content {
     height:calc(100% - 151px); /*  (port picker 105px, log CLOSED 25px, status bar: 20px + padding) - was: calc(100% - 171px)*/
 }
@@ -1475,13 +1532,8 @@ body {
 	}
 
 .tab-setup, .tab-landing, .tab-adjustments, .tab-auxiliary, .tab-cli, .tab-configuration, .tab-dataflash, .tab-firmware_flasher, .tab-gps, .tab-help, .tab-led-strip, .tab-logging, .tab-modes, .tab-motors, .tab-pid_tuning, .tab-ports, .tab-receiver, .tab-sensors, .tab-servos {
-	padding:10px;
-	float:left;
-	width:calc(100% - 20px);
-	height:calc(100% - 20px) !important;
-	position:absolute !important;
 	}
-	
+
 .cf_table td {
 	padding-top:2px;
 	padding-bottom:2px;
@@ -1494,7 +1546,7 @@ body {
 .default_btn a {
  	font-size:12px;
 }
-	
+
 #tabs li a {
 	font-family: 'open_sansregular', Arial;
 	font-size:12px;
@@ -1521,7 +1573,7 @@ body {
 	padding-bottom:0px;
 	margin-bottom:5px;
 	}
-	
+
 .spacer_box_title {
     padding-left: 10px;
     padding-right: 10px;
@@ -1529,7 +1581,7 @@ body {
     margin-bottom: 0px;
 }
 
-	
+
 input {
 	font-size:11px !important;
 }
@@ -1545,4 +1597,4 @@ input {
 }
 
 
-	}
\ No newline at end of file
+	}
diff --git a/tabs/adjustments.html b/tabs/adjustments.html
index 1cdf3436..54517ce0 100644
--- a/tabs/adjustments.html
+++ b/tabs/adjustments.html
@@ -1,4 +1,5 @@
-<div class="tab-adjustments">
+<div class="tab-adjustments toolbar_fixed_bottom">
+<div class="content_wrapper">
     <div class="help">
         <p i18n="adjustmentsHelp"></p>
         <p i18n="adjustmentsExamples"></p>
@@ -27,10 +28,10 @@
         <tbody>
         </tbody>
     </table>
-    
-    <div class="buttons">
-        <a class="save" href="#" i18n="adjustmentsSave"></a>
-    </div>
+</div>
+<div class="content_toolbar">
+    <div class="btn save_btn"><a class="save" href="#" i18n="adjustmentsSave"></a></div>
+</div>
 </div>
 
 <div id="tab-adjustments-templates">
diff --git a/tabs/auxiliary.html b/tabs/auxiliary.html
index 498dfeb2..8da9b2b1 100644
--- a/tabs/auxiliary.html
+++ b/tabs/auxiliary.html
@@ -1,4 +1,5 @@
-<div class="tab-auxiliary">
+<div class="tab-auxiliary toolbar_fixed_bottom">
+<div class="content_wrapper">
     <div class="help">
     <p i18n="auxiliaryHelp"></p>
     </div>
@@ -6,9 +7,10 @@
         <tbody>
         </tbody>
     </table>
-    <div class="buttons">
-        <a class="save" href="#" i18n="auxiliaryButtonSave"></a>
-    </div>
+</div>
+<div class="content_toolbar">
+    <div class="btn save_btn"><a class="save" href="#" i18n="auxiliaryButtonSave"></a></div>
+</div>
 </div>
 
 <div id="tab-auxiliary-templates">
diff --git a/tabs/configuration.html b/tabs/configuration.html
index 53a7d82a..47b21800 100644
--- a/tabs/configuration.html
+++ b/tabs/configuration.html
@@ -1,4 +1,5 @@
-<div class="tab-configuration">
+<div class="tab-configuration toolbar_fixed_bottom">
+<div class="content_wrapper">
   <div class="tab_title" i18n="tabConfiguration">Configuration</div>
   <div class="cf_doc_version_bt">
     <a id="button-documentation" href="https://github.com/cleanflight/cleanflight/releases" target="_blank"></a>
@@ -425,7 +426,8 @@
     </div>
   </div>
   <div class="clear-both"></div>
-  <div class="fixed_band">
-    <div class="save_btn"><a class="save" href="#" i18n="configurationButtonSave"></a></div>
-  </div>
-</div>
\ No newline at end of file
+</div>
+<div class="content_toolbar">
+  <div class="btn save_btn"><a class="save" href="#" i18n="configurationButtonSave"></a></div>
+</div>
+</div>
diff --git a/tabs/dataflash.html b/tabs/dataflash.html
index 7948e8f8..706478ca 100644
--- a/tabs/dataflash.html
+++ b/tabs/dataflash.html
@@ -1,34 +1,35 @@
 <div id="content-watermark"></div>
-<div class="tab-dataflash">
+<div class="tab-dataflash toolbar_fixed_bottom">
+<div class="content_wrapper">
     <div class="require-dataflash">
         <div class="note" i18n="dataflashNote">
         </div>
-        
+
         <dialog class="dataflash-confirm-erase">
             <h3 i18n="dataflashConfirmEraseTitle"></h3>
             <div class="dataflash-confirm-erase-note" i18n="dataflashConfirmEraseNote">
             </div>
-            
+
             <div class="dataflash-erase-progress">
                 <div class="data-loading">
                     <p>Erase in progress, please wait...</p>
                 </div>
             </div>
-            
+
             <div class="buttons">
                 <a href="#" class="erase-flash-cancel" i18n="dataflashButtonEraseCancel"></a>
                 <a href="#" class="erase-flash-confirm" i18n="dataflashButtonEraseConfirm"></a>
             </div>
         </dialog>
-        
+
         <dialog class="dataflash-saving">
             <h3 i18n="dataflashSavingTitle"></h3>
             <div class="dataflash-saving-before">
                 <div i18n="dataflashSavingNote">
                 </div>
-                
+
                 <progress value="0" min="0" max="100"></progress>
-                
+
                 <div class="buttons">
                     <a href="#" class="save-flash-cancel" i18n="dataflashButtonSaveCancel"></a>
                 </div>
@@ -36,13 +37,13 @@
             <div class="dataflash-saving-after">
                 <div i18n="dataflashSavingNoteAfter">
                 </div>
-                
+
                 <div class="buttons">
                     <a href="#" class="save-flash-dismiss" i18n="dataflashButtonSaveDismiss"></a>
                 </div>
             </div>
         </dialog>
-    
+
         <h3>Dataflash contents</h3>
         <ul class="dataflash-contents">
             <li class="dataflash-used">
@@ -56,12 +57,12 @@
                 </div>
             </li>
         </ul>
-        
-        <div class="buttons">
-            <a href="#" class="erase-flash" i18n="dataflashButtonErase"></a>
-            <a href="#" class="save-flash" i18n="dataflashButtonSaveFile"></a>
-        </div>
     </div>
     <div class="note require-no-dataflash">
     </div>
-</div>
\ No newline at end of file
+  </div>
+<div class="content_toolbar">
+    <div class="btn erase_btn"><a class="erase-flash" href="#" i18n="dataflashButtonErase"></a></div>
+    <div class="btn save_btn"><a class="save-flash" href="#" i18n="dataflashButtonSaveFile"></a></div>
+</div>
+</div>
diff --git a/tabs/firmware_flasher.html b/tabs/firmware_flasher.html
index 4fa8551d..8e8fd1da 100755
--- a/tabs/firmware_flasher.html
+++ b/tabs/firmware_flasher.html
@@ -1,4 +1,5 @@
-<div class="tab-firmware_flasher">
+<div class="tab-firmware_flasher toolbar_fixed_bottom">
+<div class="content_wrapper">
   <div class="options">
     <div class="option releases">
       <select name="release">
@@ -85,9 +86,15 @@
     <progress class="progress" value="0" min="0" max="100"></progress>
     <span class="progressLabel" i18n="firmwareFlasherLoadFirmwareFile"></span>
   </div>
-  <div class="buttons">
+  <!--div class="buttons">
     <a class="load_file" href="#" i18n="firmwareFlasherButtonLoadLocal"></a>
     <a class="load_remote_file locked" href="#" i18n="firmwareFlasherButtonLoadOnline"></a>
     <a class="flash_firmware locked" href="#" i18n="firmwareFlasherFlashFirmware"></a>
-  </div>
-</div>
\ No newline at end of file
+  </div-->
+</div>
+<div class="content_toolbar">
+  <div class="btn"><a class="load_file" href="#" i18n="firmwareFlasherButtonLoadLocal"></a></div>
+  <div class="btn"><a class="load_remote_file locked" href="#" i18n="firmwareFlasherButtonLoadOnline"></a></div>
+  <div class="btn"><a class="flash_firmware locked" href="#" i18n="firmwareFlasherFlashFirmware"></a></div>
+</div>
+</div>
diff --git a/tabs/help.html b/tabs/help.html
index b5270ff0..55b94742 100644
--- a/tabs/help.html
+++ b/tabs/help.html
@@ -1,4 +1,5 @@
 <div class="tab-help">
+<div class="content_wrapper">
     <div class="left">
         <div class="section documentation">
             <div class="title" i18n="defaultDocumentationHead"></div>
@@ -12,6 +13,6 @@
                 <p i18n="defaultSupport"></p>
             </div>
         </div>
-        
     </div>
-</div>
\ No newline at end of file
+</div>
+</div>
diff --git a/tabs/landing.html b/tabs/landing.html
index b50bcf8b..05f64c78 100644
--- a/tabs/landing.html
+++ b/tabs/landing.html
@@ -1,4 +1,5 @@
 <div class="tab-landing">
+<div class="content_wrapper">
     <div class="section optional_permissions">
         <div class="title" i18n="default_optional_permissions_head"></div>
         <p i18n="default_optional_permissions_text"></p>
@@ -22,7 +23,7 @@
         </div>
     </div>
     <div class="row contributing_and_sponsors">
-        <div class="left">             
+        <div class="left">
 
             <div class="section contributing">
                 <div class="title" i18n="defaultContributingHead"></div>
@@ -64,4 +65,5 @@
             </div>
         </div>
     </div>
-</div>
\ No newline at end of file
+</div>
+</div>
diff --git a/tabs/logging.html b/tabs/logging.html
index 035ce8fd..a5f6eed5 100755
--- a/tabs/logging.html
+++ b/tabs/logging.html
@@ -1,5 +1,6 @@
 <div id="content-watermark"></div>
-<div class="tab-logging">
+<div class="tab-logging toolbar_fixed_bottom">
+<div class="content_wrapper">
     <div class="note" i18n="loggingNote">
     </div>
     <div class="properties">
@@ -33,9 +34,10 @@
             <dt i18n="loggingLogSize"></dt><dd class="size">0 Bytes</dd>
         </dl>
     </div>
-    <div class="buttons">
-        <a href="#" class="back" i18n="loggingBack"></a>
-        <a href="#" class="logging" i18n="loggingStart"></a>
-        <a href="#" class="log_file" i18n="loggingButtonLogFile"></a>
-    </div>
-</div>
\ No newline at end of file
+</div>
+<div class="content_toolbar">
+  <div class="btn back_btn"><a class="back" href="#" i18n="loggingBack"></a></div>
+  <div class="btn logging_btn"><a class="logging" href="#" i18n="loggingStart"></a></div>
+  <div class="btn file_btn"><a class="log_file" href="#" i18n="loggingButtonLogFile"></a></div>
+</div>
+</div>
diff --git a/tabs/modes.html b/tabs/modes.html
index 7edabe59..777478d4 100644
--- a/tabs/modes.html
+++ b/tabs/modes.html
@@ -1,4 +1,5 @@
-<div class="tab-modes">
+<div class="tab-modes toolbar_fixed_bottom">
+<div class="content_wrapper">
     <table class="boxes">
         <tr class="heads">
             <th style="width: 18%"></th>
@@ -7,7 +8,8 @@
             <th i18n="auxiliaryName"></th>
         </tr>
     </table>
-    <div class="buttons">
-        <a class="update" href="#" i18n="auxiliaryButtonSave"></a>
-    </div>
+</div>
+<div class="content_toolbar">
+    <div class="btn save_btn"><a class="update" href="#" i18n="auxiliaryButtonSave"></a></div>
+</div>
 </div>
diff --git a/tabs/pid_tuning.html b/tabs/pid_tuning.html
index 34730cac..032feb70 100755
--- a/tabs/pid_tuning.html
+++ b/tabs/pid_tuning.html
@@ -1,4 +1,5 @@
-<div class="tab-pid_tuning">
+<div class="tab-pid_tuning toolbar_fixed_bottom">
+<div class="content_wrapper">
   <div class="tab_title" i18n="tabPidTuning">Ports</div>
   <div class="cf_doc_version_bt">
     <a id="button-documentation" href="https://github.com/cleanflight/cleanflight/releases" target="_blank"></a>
@@ -178,9 +179,9 @@
     </div>
   </form>
   <div class="clear-both"></div>
-  <div class="fixed_band">
-    <div class="save_btn"><a class="update" href="#" i18n="pidTuningButtonSave"></a>
-      <a class="refresh" href="#" i18n="pidTuningButtonRefresh"></a>
-    </div>
-  </div>
-</div>
\ No newline at end of file
+</div>
+<div class="content_toolbar">
+  <div class="btn save_btn"><a class="update" href="#" i18n="pidTuningButtonSave"></a></div>
+  <div class="btn refresh_btn"><a class="refresh" href="#" i18n="pidTuningButtonRefresh"></a></div>
+</div>
+</div>
diff --git a/tabs/ports.html b/tabs/ports.html
index 70df8361..a1e90f26 100644
--- a/tabs/ports.html
+++ b/tabs/ports.html
@@ -1,4 +1,5 @@
-<div class="tab-ports">
+<div class="tab-ports toolbar_fixed_bottom">
+<div class="content_wrapper">
   <div class="tab_title" i18n="tabPorts">Ports</div>
   <div class="cf_doc_version_bt">
     <a id="button-documentation" href="https://github.com/cleanflight/cleanflight/releases" target="_blank"></a>
@@ -28,9 +29,10 @@
   </div>
   <div class="note require-upgrade" i18n="portsFirmwareUpgradeRequired">
   </div>
-  <div class="fixed_band" style="position:fixed; bottom:0px; width:100%;">
-    <div class="save_btn"><a class="save" href="#" i18n="configurationButtonSave"></a></div>
-  </div>
+</div>
+<div class="content_toolbar">
+  <div class="btn save_btn"><a class="save" href="#" i18n="configurationButtonSave"></a></div>
+</div>
 </div>
 <div id="tab-ports-templates">
   <table class="ports">
@@ -66,4 +68,4 @@
       </tr>
     </tbody>
   </table>
-</div>
\ No newline at end of file
+</div>
diff --git a/tabs/receiver.html b/tabs/receiver.html
index 1f9ee207..fa9facec 100644
--- a/tabs/receiver.html
+++ b/tabs/receiver.html
@@ -1,5 +1,6 @@
 <div id="content-watermark"></div>
-<div class="tab-receiver">
+<div class="tab-receiver toolbar_fixed_bottom">
+<div class="content_wrapper">
     <div class="help">
         <p i18n="receiverHelp"></p>
     </div>
@@ -83,9 +84,10 @@
         <g class="axis x" transform="translate(40, 180)"></g>
         <g class="axis y" transform="translate(40, 10)"></g>
     </svg>
-    <div class="buttons">
-        <a class="update" href="#" i18n="receiverButtonSave"></a>
-        <a class="refresh" href="#" i18n="receiverButtonRefresh"></a>
-        <a class="sticks" href="#" i18n="receiverButtonSticks"></a>
-    </div>
+</div>
+<div class="content_toolbar">
+  <div class="btn update_btn"><a class="update" href="#" i18n="receiverButtonSave"></a></div>
+  <div class="btn refresh_btn"><a class="refresh" href="#" i18n="receiverButtonRefresh"></a></div>
+  <div class="btn sticks_btn"><a class="sticks" href="#" i18n="receiverButtonSticks"></a></div>
+</div>
 </div>