touching up css - removing !importants and fixing positions

frontend/src/components/header/index.js

@@ -68,7 +68,7 @@ const StyledAvatarWrapper = styled.div`
 
 const StyledTooltipWrapper = styled.div`
   position: absolute;
-  left: ${remcalc(-40)};
+  right: ${remcalc-18};
   bottom: ${remcalc(-180)};
 `;
 

frontend/src/components/navigation/org.js

@@ -37,7 +37,7 @@ const StyledNav = styled.div`
 
   & ul {
     height: ${remcalc(60)};
-    margin: 0px 0px 0px 0px !important;
+    margin: 0;
   }
 `;
 
@@ -45,14 +45,14 @@ const StyledNav = styled.div`
 const NavigationLinkContainer = styled.div`
   position: relative;
   padding: ${remcalc(11)} ${remcalc(12)} ${remcalc(12)};
-  color: #646464;
+  color: ${colors.base.secondaryDark};
   border: ${remcalc(1)} solid ${colors.base.greyDark};
   height: ${remcalc(24)};
   background-color: #f2f2f2;
 
   &.active {
-    background-color: #fafafa;
-    border-bottom: solid ${remcalc(1)} #fafafa;
+    background-color: ${colors.base.grey};
+    border-bottom: solid ${remcalc(1)} ${colors.base.grey};
   }
 `;
 
@@ -61,7 +61,7 @@ const OrgImage = styled.div`
 `;
 
 const OrgAvatar = styled(Avatar)`
-  display: block !important;
+  display: block;
 `;
 
 const OrgName = styled.span`
@@ -75,7 +75,7 @@ const NavLi = styled.li`
   padding-left: ${remcalc(3)};
 
   & a {
-    text-decoration: none !important;
+    text-decoration: none;
   }
 `;
 

frontend/src/components/section/index.js

@@ -5,6 +5,7 @@ const Styled = require('styled-components');
 const Li = require('@ui/components/horizontal-list/li');
 const NavLink = require('@ui/components/nav-link');
 const constants = require('@ui/shared/constants');
+const fns = require('@ui/shared/functions');
 const PropTypes = require('@root/prop-types');
 const Ul = require('@ui/components/horizontal-list/ul');
 const Breadcrumb = require('@components/breadcrumb');
@@ -21,6 +22,10 @@ const {
   breakpoints,
 } = constants;
 
+const {
+  remcalc,
+} = fns;
+
 const StyledHorizontalList = styled(Ul)`
   padding: 0;
 `;
@@ -29,6 +34,10 @@ const StyledHorizontalListItem = styled(Li)`
   ${breakpoints.smallOnly`
     display: block;
   `}
+  
+  & + li {
+    margin-left: ${remcalc(21)};
+  }
 `;
 
 const Section = (props) => {