Fixing some things in the configurator tab

and some media-query updates

js/libraries/switchery/dist/switchery.css

@@ -17,6 +17,7 @@
   position: relative;
   vertical-align: middle;
   width: 45px;
+  z-index:1000;
 
   -moz-user-select: none;
   -khtml-user-select: none;

main.css

@@ -1430,7 +1430,7 @@ dialog {
 	}
 	
 	
-@media only screen and (max-height: 710px), only screen and (max-device-height: 710px) {
+@media only screen and (max-width: 1055px), only screen and (max-device-width: 1055px) {
 
 	
 .tab_title {
@@ -1476,7 +1476,24 @@ body {
 	margin-bottom:7px;
 }
 
-
+.default_btn a {
+ 	font-size:11px;
+}
 	
+#tabs li a {
+	font-family: 'open_sansregular', Arial;
+	font-size:12px;
+	padding-left:33px;
+	padding-top:6px;
+	padding-bottom:2px;
+}
+
+.tab_container {
+	width:185px;
+}
+
+input {
+	font-size:11px !important;
+}
 	
 	}

tabs/configuration.css

@@ -35,7 +35,7 @@
 
 .tab-configuration table tr td:first-child {
     text-align: left;
-    width:50px;
+    width:55px;
 }
 .tab-configuration table td {
     padding: 5px 3px;
@@ -58,31 +58,19 @@
 }
 .tab-configuration .leftWrapper {
     float: left;
- width: calc(50% - 20px);
+	width: calc(50% - 20px);
-  0 10px 20px 0px
+	}
-}
 .tab-configuration .rightWrapper {
     float: left;
     width: calc(50% - 0px);
     margin: 0 0 10px 20px;
 }
-.tab-configuration .mixerPreview {
-    width: 180px;
-    height: 180px;
-}
-.tab-configuration .mixerPreview img {
-    display: block;
 
-    width: 100%;
-    height: 100%;
-}
 .tab-configuration select.mixerList {
-    width: 170px;
+    width: 100%;
     height: 20px;
     margin-top: 5px;
-
     font-weight: bold;
-
     border: 1px solid silver;
 }
 .tab-configuration dl.features dt {
@@ -106,17 +94,20 @@
     clear: left;
 }
 .tab-configuration .number input {
-    width: 48px;
+    width: 50px;
+    padding-left: 3px;
     height: 20px;
     line-height: 20px;
-    text-align: right;
+    text-align: left;
     border: 1px solid silver;
 	border-radius:3px;
 	margin-right:11px;
+	font-size:12px;
+	font-weight:normal;
 }
 
 .tab-configuration .number input.disabled {
-    width: 39px;
+    width: 43px;
     padding: 0px 5px;
     background-color: #ececec;
 }
@@ -153,7 +144,7 @@
 }
 .tab-configuration .current .checkbox div {
     float: left;
-    width: 60px;
+    width: 66px;
 }
 .tab-configuration .current .checkbox div input {
     margin: 0px;
@@ -164,13 +155,14 @@
 
 .tab-configuration .disarm .checkbox {
     margin-top: 2px;
+    margin-right:5px;
 }
 .tab-configuration .disarm .checkbox div {
     margin-bottom: 0px;
     margin-top: 0px;
+
 }
 .tab-configuration .disarm .checkbox div input {
-    display:;
     margin:0px;
     float: left;
 
@@ -215,7 +207,7 @@ margin:0px
 
 .tab-configuration .disarm .checkbox { 
 float:left;
-padding-left:3px; 
+padding-left:0px; 
 margin-top: -5px; 
 padding-bottom:5px;
 border-bottom: 1px solid #ddd;
@@ -265,8 +257,8 @@ padding-bottom:0px;
 
 .tab-configuration .numberspacer {
 float:left; 
-width:60px; 
+width:65px; 
-height:20px;
+height:21px;
 }
 
 .tab-configuration thead {
@@ -300,19 +292,21 @@ height:20px;
 	
 	
 	.tab-configuration .mixer .gui_box, .tab-configuration .motorstop .gui_box   {
-	min-height:285px;
+	min-height:287px;
 		float:left;
 
 	}
 
-	.tab-configuration .current .gui_box {
+	.tab-configuration .mixer .gui_box {
+	}
+	
+		.tab-configuration .current .gui_box {
 	min-height:223px;
 	float:left;
-
 	}
 	
 		.tab-configuration .gps .gui_box {
-	min-height:358px;
+	min-height:352px;
 		float:left;
 
 	}
@@ -323,9 +317,6 @@ height:20px;
 	}
 	
 	
-.tab-configuration table tr td:first-child {
-	width:20px;}
-	
 
 .tab-configuration .other tr:last-child td{
     border-bottom:0px;
@@ -335,22 +326,19 @@ height:20px;
 }
 
 .tab-configuration .mixerPreview {
-	height:217px; 
+	max-width:230px; 
-	width:217px; 
 	background-color: #eeeeee;
 	text-align: center;
 	float:left;
 	border-radius:5px;
-	margin-right:15px;
 	margin-top:5px;
-	margin-left:5px;
 	}
 	
 .tab-configuration .mixerPreview img {
-    width: 80%;
+    width: 90%;
-    margin-top:10%;
+    height: 90%;
-    margin-left:10%;
+	padding:5%;
-    height: 80%;
+
     }
     
 .tab-configuration .rxMode tr:last-child td{
@@ -361,13 +349,25 @@ height:20px;
 }
 
 .tab-configuration .gui_box  {
-font-style: bold;
+	font-style: bold;
-font-family: 'open_sanssemibold', Arial;
+	font-family: 'open_sanssemibold', Arial;
 }
 
 .tab-configuration .gui_box span {
-font-style: italic;
+	font-style: italic;
 	font-family: 'open_sansregular', Arial;
+	line-height:19px;
+	color:#7d7d7d;
+}
+
+
+
+@media only screen and (max-width: 1055px), only screen and (max-device-width: 1055px) {
+
+
+.tab-configuration .gui_box span {
+	line-height:15px;
+}
+
 
-color:#7d7d7d;
 }

tabs/configuration.html

@@ -15,12 +15,14 @@
         <div class="helpicon"></div>
       </div>
       <div class="spacer_box">
-        <div class="mixerPreview">
+        <div class="mixerPreview twothird">
           <img src="./resources/motor_order/custom.svg" />
         </div>
+        <div class="half" style="width:calc(33% - 10px); margin-left:10px;">
         <select class="mixerList">
           <!-- list generated here -->
         </select>
+        </div>
       </div>
     </div>
   </div>
@@ -46,11 +48,10 @@
         <!--   -->
         <div class="disarm">
           <div class="checkbox">
-            <label>
+             <div style="float:left; height:20px; margin-right:15px; margin-left:3px;">
-              <div style="float:left; width:57px; height:20px;">
                 <input type="checkbox" name="disarmkillswitch" id="toggle"/>
-              </div>
+              </div><label for="disarmkillswitch">
-              <div class="freelabel" i18n="configurationDisarmKillSwitch"></div>
+              <span class="freelabel" i18n="configurationDisarmKillSwitch"></span>
             </label>
           </div>
           <div class="number disarmdelay" style="display:none; margin-bottom:5px;">
@@ -290,10 +291,9 @@
           </label>
         </div>
         <div class="checkbox">
-          <label>
             <div class="numberspacer">
               <input type="checkbox" name="multiwiicurrentoutput" id="toggle"/>
-            </div>
+            </div><label>
             <span i18n="configurationBatteryMultiwiiCurrent"></span>
           </label>
         </div>

tabs/configuration.js

@@ -120,7 +120,7 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
             var row_e;
             
             if (features[i].mode === 'group') {
-                row_e = $('<tr><td><input class="feature" id="feature-'
+                row_e = $('<tr><td style="width: 15px;"><input style="width: 13px;" class="feature" id="feature-'
                         + i
                         + '" value="'
                         + features[i].bit

tabs/setup.css

@@ -198,7 +198,7 @@ margin-bottom:10px;
 	}
 	
 
-@media only screen and (max-height: 710px), only screen and (max-device-height: 710px) {
+@media only screen and (max-width: 1055px), only screen and (max-device-width: 1055px) {
 
 
 #interactive_block  {