From 78a9310b70e70383a2386c64dd67bfbca53193c8 Mon Sep 17 00:00:00 2001
From: Ian Weller <ian@gaslightmedia.com>
Date: Thu, 12 Jan 2017 12:26:57 -0500
Subject: [PATCH] fixing tablet view topbar nav

I removed the 8% left and right padding on the anchors in a media query
and replaced it with .5em.  It seems to not be causing and issue as I do
cross browser testing.
---
 css/app.css       | 4 ++--
 scss/_topbar.scss | 8 ++++----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/css/app.css b/css/app.css
index 7f90357..8935bd3 100644
--- a/css/app.css
+++ b/css/app.css
@@ -6401,7 +6401,7 @@ header.main {
       line-height: 4.1875rem; }
     @media screen and (max-width: 963px) {
       .top-bar-section ul li:not(.has-form):not(.active) > a:not(.button) {
-        padding: 0 8%; } }
+        padding: 0 .5em; } }
     @media screen and (max-width: 840px) {
       .top-bar-section ul li:not(.has-form):not(.active) > a:not(.button) {
         font-size: 137.5%; } }
@@ -6417,7 +6417,7 @@ header.main {
       background: #044a70; }
     @media screen and (max-width: 963px) {
       .top-bar-section ul li.active:not(.has-form) > a:not(.button) {
-        padding: 0 8%; } }
+        padding: 0 .5em; } }
     @media screen and (max-width: 840px) {
       .top-bar-section ul li.active:not(.has-form) > a:not(.button) {
         font-size: 137.5%; } }
diff --git a/scss/_topbar.scss b/scss/_topbar.scss
index 39736d0..7841557 100644
--- a/scss/_topbar.scss
+++ b/scss/_topbar.scss
@@ -96,7 +96,7 @@
                         line-height: rem-calc(67);
                     }
                     @media screen and (max-width: 963px) {
-                        padding: 0 8%;
+                        padding: 0 .5em;
                     }
                     @media screen and (max-width: 840px) {
                         font-size: 137.5%;
@@ -104,8 +104,8 @@
                     @media screen and (max-width: 773px) {
                         font-size: 112.5%;
                     }
-                    }
                 }
+            }
             &.active:not(.has-form){
                 &:hover {
                     max-height: rem-calc(71);
@@ -120,7 +120,7 @@
                         background: $d-blue;
                     }
                     @media screen and (max-width: 963px) {
-                        padding: 0 8%;
+                        padding: 0 .5em;
                     }
                     @media screen and (max-width: 840px) {
                         font-size: 137.5%;
@@ -128,8 +128,8 @@
                     @media screen and (max-width: 773px) {
                         font-size: 112.5%;
                     }
-                    }
                 }
+            }
             &.has-dropdown {
                 &:hover {
                     max-height: rem-calc(69);
-- 
2.17.1