diff --git a/website/components/learn-nomad/index.jsx b/website/components/learn-nomad/index.jsx
index c77f56e3e..e858e98b8 100644
--- a/website/components/learn-nomad/index.jsx
+++ b/website/components/learn-nomad/index.jsx
@@ -3,9 +3,10 @@ import Button from '@hashicorp/react-button'
 export default function LearnNomad({ items }) {
   return (
     <div className="g-learn-nomad">
-      <div className="g-grid-container">
+      <div className="g-grid-container learn-container">
         <div className="column-container">
-          <div className="column info">
+          {/* need this wrapper to flex center the .column-content */}
+          <div>
             <div className="column-content">
               <h2 className="g-type-display-2">
                 Learn the latest Nomad skills
@@ -27,7 +28,7 @@ export default function LearnNomad({ items }) {
                 target="_blank"
                 rel="noopener noreferrer"
               >
-                <div className="column course">
+                <div className="course">
                   <div className="image">
                     <div className="g-type-label-strong time">{item.time}</div>
                     <img src={item.image} alt={item.title} />
diff --git a/website/components/learn-nomad/style.css b/website/components/learn-nomad/style.css
index 2a8f70359..d287eb978 100644
--- a/website/components/learn-nomad/style.css
+++ b/website/components/learn-nomad/style.css
@@ -11,7 +11,7 @@
     padding-bottom: 64px;
   }
 
-  & .g-grid-container {
+  & .learn-container {
     @media (max-width: 1200px) {
       display: flex;
       flex-wrap: wrap;
diff --git a/website/components/mini-cta/style.css b/website/components/mini-cta/style.css
index 989864123..8df309254 100644
--- a/website/components/mini-cta/style.css
+++ b/website/components/mini-cta/style.css
@@ -2,6 +2,7 @@
   background: var(--gray-7);
   text-align: center;
   padding-bottom: 64px;
+  padding-top: 48px;
 
   & hr {
     width: 64px;