Merge pull request i8ramin#2 from jpbellona/master

CSS change for Firefox browser

Author: i8ramin

fb-menu.css

@@ -2,13 +2,15 @@
     margin: 0; padding: 0;
     box-sizing: border-box;
     -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
 }
 
 html {
     overflow: hidden;
     font-family: Helvetica;
     font-size: 100%;
     -webkit-text-size-adjust: 100%;
+    -moz-text-size-adjust: 100%;
 }
 body {
     font-family: Helvetica, sans-serif;
@@ -18,6 +20,7 @@ body {
 body.menu-open #page {
     position: fixed;
     -webkit-transform: translate3d(260px, 0, 0);
+    -moz-transform: translate3d(260px, 0, 0);
 }
 
 #close-mask {
@@ -38,14 +41,18 @@ body.menu-open #page {
     min-width: 320px;
     background-color: #fff;
     -webkit-transition: -webkit-transform 200ms ease-in;
+    -moz-transition: -moz-transform 200ms ease-in;
 }
     #page > header {
         height: 43px;
         line-height: 43px;
         background: -webkit-gradient( linear, left top, left bottom, from(#738ABA), to(#2C4987) );
+        background: -moz-linear-gradient(top, #738ABA 0%, #2C4987 100%);
         border-color: #111A33;
+        box-shadow: inset 0 1px 1px -1px white, 0 1px 5px rgba(0,0,0,.5);
         -webkit-box-shadow: inset 0 1px 1px -1px white, 0 1px 5px rgba(0,0,0,.5);
         -webkit-transition: left 200ms ease-in;
+        -moz-transition: left 200ms ease-in;
     }
     #page > header .trigger {
         position: absolute;
@@ -121,8 +128,10 @@ body.menu-open #page {
 
 #composer {
     display: -webkit-box;
+    display: -moz-box;
     display: box;
     box-orient: horizontal;
+    -moz-box-orient: horizontal;
     padding: 7px 4px;
     background-color: #F2F2F2;
     border-bottom: 1px solid #CCC;
@@ -131,6 +140,7 @@ body.menu-open #page {
     display: block;
     margin: 0 4px;
     -webkit-box-flex: 1;
+    -moz-box-flex: 1;
     box-flex: 1;
     -webkit-border-radius: 3px;
     border-radius: 3px;
@@ -139,7 +149,9 @@ body.menu-open #page {
     border: 1px solid;
     border-color: #9599A1 #A8ABB4 #ACB1BB;
     -webkit-box-shadow: inset 0 1px 1px rgba(43, 48, 60, .18), 0 1px 0 white;
+    box-shadow: inset 0 1px 1px rgba(43, 48, 60, .18), 0 1px 0 white;
     background: -webkit-gradient( linear, left top, left bottom, from(#FDFEFE), to(#F0F1F2) );
+    background: -moz-linear-gradient(top, #FDFEFE 0%, #F0F1F2 100%);
     -webkit-background-clip: padding-box;
     font-weight: bold;
     font-size: 12px;
@@ -166,6 +178,7 @@ body.menu-open #page {
         width: 260px;
         height: 43px;
         background-image: -webkit-gradient( linear, left top, left bottom, from(#434B5B), to(#242B39));
+        background-image: -moz-linear-gradient(top, #434B5B 0%, #242B39 100%);
         border-bottom: 1px solid #000;
         border-top: 1px solid #5F6673;  
         color: #fff;
@@ -177,9 +190,12 @@ body.menu-open #page {
         width: 100%;
         padding: 2px 8px 0 10px;
         background: -webkit-gradient( linear, 0 0, 0 100%, from(#414A5A), to(#4C5464));
+        background: -moz-linear-gradient(top, #414A5A 0%, #4C5464 100%);
         color: #AAB2C0;
         border: 1px solid #222936;
+        border-radius: 15px;
         -webkit-border-radius: 15px;
+        box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, .5), 0 1px 2px -1px rgba(255, 255, 255, .4);
         -webkit-box-shadow: inset 0 1px 2px -1px rgba(0, 0, 0, .5), 0 1px 2px -1px rgba(255, 255, 255, .4);
         height: 27px;
         outline: none;
@@ -190,6 +206,10 @@ body.menu-open #page {
         color: #AAB2C0;
         font-weight: normal;
     }
+    #menu #search::input-placeholder {
+        color: #AAB2C0;
+        font-weight: normal;
+    }
 
     #menu .scrollable {
         position: absolute;
@@ -201,8 +221,10 @@ body.menu-open #page {
     #menu .separator {
         background: #434B5C;
         background: -webkit-gradient( linear, left top, left bottom, from(#434B5C), to(#394152) );
+        background: -moz-linear-gradient(top, #434B5C 0%, #394152 100%);
         border-bottom: 1px solid #242A37;
         border-top: none;
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
         -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
         color: #7A8292;
         padding: 4px 0 4px 8px;
@@ -220,6 +242,7 @@ body.menu-open #page {
         padding: 3px 0 3px 8px;     
         background-color: #32394A;
         border-bottom: 1px solid #242A37;
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
         -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
         font-size: 16px;
         color: #C4CCDA;
@@ -240,7 +263,9 @@ body.menu-open #page {
         top: 15px;
         background: #3E485E;
         background: -webkit-gradient( linear, left top, left bottom, color-stop(0, #3E485E), color-stop(1, #323A4D));
+        background: -moz-linear-gradient( left top, left bottom, color-stop(0, #3E485E), color-stop(1, #323A4D));
         border-top: 1px solid #505A63;
+        box-shadow: 0 1px 2px rgba(0, 0, 0, .4);
         -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);
         color: #BFC5D2;
         padding: 1px 3px 3px 4px;