fixing issue with login/language buttons breaking on to two lines when the...

fixing issue with login/language buttons breaking on to two lines when the viewport is at the tablet portrait width

opentech/static_src/src/sass/components/_button.scss

@@ -27,24 +27,36 @@
     }
 
     &--narrow {
-        padding: 5px 15px;
+        padding: 5px;
         font-size: 15px;
+
+        @include media-query(tablet-landscape) {
+            padding: 5px 15px;
+        }
     }
 
     // cannot conform to BEM here in order to be able to override google button styles
     &--google-translate {
-        width: 180px;
+        width: 160px;
         margin-left: 10px;
 
+        @include media-query(tablet-landscape) {
+            width: 180px;
+        }
+
         .goog-te-gadget-simple {
             @include button(transparent, $color--white);
-            padding: 5px 15px;
+            padding: 5px;
             font-family: $font--primary;
             font-size: 15px;
             font-weight: $weight--bold;
             border: 1px solid $color--white;
             transition: background, color,  $transition;
 
+            @include media-query(tablet-landscape) {
+                padding: 5px 15px;
+            }
+
             &:hover {
                 .goog-te-menu-value {
                     span {

opentech/static_src/src/sass/components/_nav.scss

@@ -144,7 +144,7 @@
 
     &__link {
         display: inline-block;
-        padding: 20px 15px;
+        padding: 20px 10px;
         color: $color--white;
         border-bottom: 1px solid transparent;
         transition: color, border $transition;