Merge branch 'styling' into develop

styles.css

@@ -236,7 +236,7 @@ h7 {
 @media only screen and (min-width: 1024px) {
 
     /* Arrow */
-    .clicked > a:after, .clicked > a:before {
+    .site-nav .clicked > a:after, .clicked > a:before {
         left: 100%;
         top: 50%;
         border: solid transparent;
@@ -248,14 +248,14 @@ h7 {
         pointer-events: none;
     }
 
-    .clicked > a:after {
+    .site-nav .clicked > a:after {
         border-color: rgba(241, 242, 242, 0);
         border-left-color: #7dc0f0;
         border-width: 20px;
         margin-top: -20px;
     }
 
-    .clicked > a:before {
+    .site-nav .clicked > a:before {
         border-color: rgba(255, 255, 255, 0);
         border-left-color: #ffffff;
         border-width: 28px;
@@ -269,14 +269,12 @@ h7 {
     }
 }
 
-/* OPA > 1 > 15my */
-
 /* First items first (BIG) */
 
 .site-nav .first-item > a {
     color: #283461;
     font-weight: bold;
-    padding: 20px 32px;
+    padding: 26px 32px;
     /* margin-top: 5px; */
     border-bottom: 6px solid white;
     display: inline-block;
@@ -297,6 +295,21 @@ h7 {
     padding-top: 20px;
 }
 
+.site-nav .last-item.clicked a {
+  padding: 24px;
+  font-weight: bold;
+}
+
+.site-nav .last-item > a:after, .site-nav .last-item > a:before {
+  display: none;
+}
+
+.site-nav .last-item.clicked > a span:before {
+  display: inline;
+  content: "✓";
+  margin-right: 8px;
+}
+
 /* Wrapper */
 
 #ms-wrapper {
@@ -329,7 +342,7 @@ h7 {
   }
   .site-nav .flyout-alt.clicked > a {
     border-bottom: 6px solid white;
-    border-top: 6px solid white;
+    /* border-top: 6px solid white; */
   }
   .clicked > a:after, .clicked > a:before {
     top: 100%;
@@ -366,7 +379,10 @@ h7 {
   h7 {
     padding-top: 16px;
     padding-left: 24px;
-    padding-bottom: 8px;
-      cursor: pointer;
+    padding-bottom: 16px;
+    cursor: pointer;
+  }
+  .site-nav .first-item > a {
+    padding: 16px 32px;
   }
 }