fixed entrees menu : translation and order

sites/all/themes/custom/edlptheme/assets/styles/app.scss

@@ -54,7 +54,11 @@
   }
 }
 
-
+@mixin btn {
+  padding: 3px;
+  background-color: white;
+  border-radius: 3px;
+}
 // .layout-container{
 //   pointer-events: none;
 // }
@@ -79,7 +83,7 @@ header[role="banner"]{
       width:$w; height:$w * 0.22;
       margin-top: 0.15em;
       background-image: url(../img/logo.svg);
-      background-color: white;
+      // background-color: white;
       background-repeat:no-repeat;
       background-size: contain;
       white-space: nowrap;
@@ -87,6 +91,12 @@ header[role="banner"]{
       overflow: hidden;
     }
   }
+  opacity: 1;
+  transition: opacity 0.7s ease-in-out;
+
+  .audio-player-visible &{
+    opacity: 0;
+  }
 }
 
 #block-mainnavigation{
@@ -104,6 +114,7 @@ header[role="banner"]{
         text-decoration: none;
         text-transform: uppercase;
         margin-left: 1em;
+        @include btn;
         &:before{
           content: "";
           display:inline-block;
@@ -141,6 +152,7 @@ header[role="banner"]{
         text-decoration: none;
         text-transform: capitalize;
         margin-left: 0.8em;
+        @include btn;
         &:before{
           content: "";
           display:inline-block;
@@ -497,8 +509,8 @@ main[role="main"]{
 #audio-player{
   position: absolute;
   top:0; left:0;
-  padding-left:1.2em;
-  background-color: white;
+  padding-left:0.7em;
+  // background-color: white;
   height:100%; min-width:300px;
   z-index: 20;
   opacity: 0;
@@ -518,11 +530,14 @@ main[role="main"]{
     max-height: 100%;
     // outline: 1px solid green;
     white-space: normal;
+    @include btn;
   }
   .btns{
     @include audio_controls;
   }
   .time-line-container{
+    // height:50%;
+    background:transparent;
     .time-line{
       position: relative;
       width:70px; height:1px;
@@ -1408,6 +1423,7 @@ footer{
         }
         a{
           font-size: 0.756em;
+          @include btn;
           &:before{
             content: "";
             display:inline-block;
@@ -1442,6 +1458,7 @@ footer{
           margin-left: 1em;
         }
         a{
+          @include btn;
           &:before{
             content: "";
             display:inline-block;
@@ -1511,7 +1528,7 @@ footer{
         a{
           // outline: 1px solid blue;
           pointer-events: all;
-          background-color: #fff;
+          @include btn;
           padding-right: 0.4em;
           &:before{
             content: "";
@@ -1563,7 +1580,8 @@ footer{
             // outline: 1px solid blue;
             pointer-events: all;
             // background-color: #fff;
-            background-color: rgba(255,255,255, 0.6);
+            // background-color: rgba(255,255,255, 0.6);
+            @include btn;
             padding-right: 0.4em;
             color:black;
             transition: color 0.3s ease-in-out;
@@ -1739,7 +1757,9 @@ footer{
   @mixin iconlinkblock($bgimgurl) {
     pointer-events: all;
     margin-left: 0.5em;
+    // @include btn;
     a{
+      box-sizing: border-box;
       $wh:$icons_w;
       display: block;
       width:$wh; height:$wh;
@@ -1772,12 +1792,14 @@ footer{
     margin-bottom: 1em;
     pointer-events: all;
     margin-left: 0.2em;
-    // outline: 1px solid blue;
     $wh:$icons_w;
     position: relative;
+    // box-sizing: border-box;
     width:$wh; height: $wh;
-    // background-color: blue;
     h2{
+      box-sizing: content-box;
+      // @include btn;
+      // padding:0;
       position: relative;
       width:$wh; height:$wh;
       background-image: url(../img/studio.svg);