From a7e61264f8796127f535a9d7fc181b7c537f08fe Mon Sep 17 00:00:00 2001
From: Pete Robelou <probelou@gmail.com>
Date: Fri, 29 Jan 2021 17:37:02 +0000
Subject: [PATCH] Pull request updates.

---
 src/css/component.section.css          | 1 +
 src/css/component.sub-menu.css         | 9 ++++++---
 src/css/settings.sizes.css             | 2 ++
 src/en-GB/discover/benefits/index.html | 6 +++---
 4 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/css/component.section.css b/src/css/component.section.css
index 4a0787a9a879e..0a8ffb178fcbb 100644
--- a/src/css/component.section.css
+++ b/src/css/component.section.css
@@ -5,6 +5,7 @@
   --section-gutters-y: var(--size-10);
   padding-bottom: var(--section-gutters-y);
   padding-top: var(--section-gutters-y);
+  scroll-margin-top: var(--size-scroll-top);
 }
 
 .section--full {
diff --git a/src/css/component.sub-menu.css b/src/css/component.sub-menu.css
index 11b2db6150d56..2d53a67d30441 100644
--- a/src/css/component.sub-menu.css
+++ b/src/css/component.sub-menu.css
@@ -26,15 +26,18 @@
     position: relative;
   }
 
-  .sub-menu--2 > li {
+  .sub-menu > li:nth-last-child(2):first-child,
+  .sub-menu > li:nth-last-child(2):first-child ~ li {
     flex: 1 0 var(--size-1-2);
   }
 
-  .sub-menu--3 > li {
+  .sub-menu > li:nth-last-child(3):first-child,
+  .sub-menu > li:nth-last-child(3):first-child ~ li {
     flex: 1 0 var(--size-1-3);
   }
 
-  .sub-menu--4 > li {
+  .sub-menu > li:nth-last-child(4):first-child,
+  .sub-menu > li:nth-last-child(4):first-child ~ li {
     flex: 1 0 var(--size-1-4);
   }
 
diff --git a/src/css/settings.sizes.css b/src/css/settings.sizes.css
index c5436d793372f..49796294055e8 100644
--- a/src/css/settings.sizes.css
+++ b/src/css/settings.sizes.css
@@ -63,4 +63,6 @@
   /* screen */
   --size-h-screen: 100vh;
   --size-w-screen: 100vw;
+
+  --size-scroll-top: 5.25rem; /* 84px */
 }
diff --git a/src/en-GB/discover/benefits/index.html b/src/en-GB/discover/benefits/index.html
index f0086cc1f3897..aa2c696c38019 100644
--- a/src/en-GB/discover/benefits/index.html
+++ b/src/en-GB/discover/benefits/index.html
@@ -10,7 +10,7 @@ <h1 class="h1">Benefits</h1>
     <h2 class="color-white h2">Ceph offers industry leading performance, reliablity and&nbsp;flexibility.</h2>
     <p class="color-white mb-0 p">But don’t take our word for it, the numbers below speak for themselves.</p>
   </div>
-  <ul class="sub-menu sub-menu--4 ul">
+  <ul class="sub-menu ul">
     <li>
       <a href="#performance"><img alt="" src="/assets/svgs/icon-performance-blue-red.svg" />Performance</a>
     </li>
@@ -26,8 +26,8 @@ <h2 class="color-white h2">Ceph offers industry leading performance, reliablity
   </ul>
 </section>
 
-<section class="section text-center">
-  <h2 class="h2" id="performance">Performance</h2>
+<section class="section text-center" id="performance">
+  <h2 class="h2">Performance</h2>
   <p class="p">
     Vestibulum id ligula porta felis euismod semper. Maecenas sed diam eget risus varius blandit sit amet non magna. Fusce dapibus.
   </p>