diff --git a/src/components/Site/Site.scss b/src/components/Site/Site.scss
index 395e4a9a9996..f278b6d453c2 100644
--- a/src/components/Site/Site.scss
+++ b/src/components/Site/Site.scss
@@ -14,7 +14,18 @@
     flex: 1 1 auto;
     position: relative;
     display: flex;
-    margin-top: 110px;
+
+    @media (min-width: 1525px) {
+      margin-top: 110px;
+    }
+
+    @media (max-width: 1524px) {
+      margin-top: 350px;
+    }
+
+    @media (max-width: 641px) {
+      margin-top: 350px;
+    }
 
     @media print {
       margin-top: 0px;
diff --git a/src/components/Sponsors/Sponsors.jsx b/src/components/Sponsors/Sponsors.jsx
index a98f292237eb..e980f963f36b 100644
--- a/src/components/Sponsors/Sponsors.jsx
+++ b/src/components/Sponsors/Sponsors.jsx
@@ -8,27 +8,27 @@ const Sponsors = () => {
   return (
     <div className="sponsors">
       <div className="sponsors__content">
-        <div className="sponsors__link-wrapper">
-          <Link to="https://www.ag-grid.com/?utm_source=webpack&utm_medium=banner&utm_campaign=sponsorship">
-            <img
-              className="agGridLogo"
-              src={AGLogo}
-              alt="ag grid"
-              width={220}
-              loading="lazy"
-            />
-          </Link>
-        </div>
-        <div className="sponsors__link-wrapper">
-          <Link to="https://charts.ag-grid.com/?utm_source=webpack&utm_medium=banner&utm_campaign=sponsorship">
-            <img
-              className="agChartsLogo"
-              src={AGChartsLogo}
-              alt="ag charts"
-              width={220}
-              loading="lazy"
-            />
-          </Link>
+        <div className="sponsors__buttons__wrapper">
+          <div className="sponsors__link-wrapper">
+            <Link to="https://www.ag-grid.com/?utm_source=webpack&utm_medium=banner&utm_campaign=sponsorship">
+              <img
+                className="agGridLogo"
+                src={AGLogo}
+                alt="ag grid"
+                loading="lazy"
+              />
+            </Link>
+          </div>
+          <div className="sponsors__link-wrapper">
+            <Link to="https://charts.ag-grid.com/?utm_source=webpack&utm_medium=banner&utm_campaign=sponsorship">
+              <img
+                className="agChartsLogo"
+                src={AGChartsLogo}
+                alt="ag charts"
+                loading="lazy"
+              />
+            </Link>
+          </div>
         </div>
         <div className="sponsors__link-wrapper-2">
           <Link to="https://www.ag-grid.com/?utm_source=webpack&utm_medium=banner&utm_campaign=sponsorship">
diff --git a/src/components/Sponsors/Sponsors.scss b/src/components/Sponsors/Sponsors.scss
index a096325f29c2..6aaabbbe9d6a 100644
--- a/src/components/Sponsors/Sponsors.scss
+++ b/src/components/Sponsors/Sponsors.scss
@@ -10,6 +10,8 @@ $link-wrapper-radius: 8px;
 $link-wrapper-margin: 8px;
 $tagline-font-size: 2em;
 $footer-font-size: 1.7em;
+$tagline-font-size-mobile: 1.4em;
+$footer-font-size-mobile: 1.2em;
 
 [data-theme='dark'] {
   .agGridLogo {
@@ -48,57 +50,191 @@ $footer-font-size: 1.7em;
   }
 }
 
-.sponsors {
-  position: absolute;
-  height: 100%;
-  width: 250px;
-  margin-left: -250px;
-  margin-right: 8px;
-
-  &__link-wrapper {
-    box-shadow: $link-wrapper-shadow;
-    border-radius: $link-wrapper-radius;
-    margin: $link-wrapper-margin;
-    transition: transform 0.2s;
-    &:hover {
-      background-color: getColor(concrete);
-      transform: scale(1.05);
-    }
+@media (max-width: 642px) {
+  .agGridLogo {
+    height: 50px;
   }
-  &__tagline,
-  &__footer {
-    margin: 1rem 0;
-    text-align: center;
-    color: $sponsor-text-color-light;
+
+  .agChartsLogo {
+    height: 50px;
   }
-  &__tagline {
-    font-size: $tagline-font-size;
+
+  .sponsors {
+    position: absolute;
+    height: auto;
+    width: 100%;
+    margin-top: -275px;
+
+    &__link-wrapper {
+      box-shadow: $link-wrapper-shadow;
+      border-radius: $link-wrapper-radius;
+      margin: $link-wrapper-margin;
+      transition: transform 0.2s;
+      &:hover {
+        background-color: getColor(concrete);
+        transform: scale(1.05);
+      }
+    }
+    &__tagline,
+    &__footer {
+      margin: 1rem 0;
+      text-align: center;
+      color: $sponsor-text-color-light;
+    }
+    &__tagline {
+      font-size: $tagline-font-size-mobile;
+    }
+    &__footer {
+      font-size: $footer-font-size-mobile;
+      font-style: italic;
+    }
+    &__content {
+      position: sticky;
+      display: flex;
+      margin: 1.5em 0;
+      top: 6em;
+      padding-bottom: 16px;
+      flex-wrap: wrap;
+      justify-content: center;
+      align-items: flex-start;
+      overflow: hidden;
+      transition: background-color 250ms;
+    }
+    &__img {
+      &__wrapper {
+        display: none;
+      }
+    }
+  }
+}
+
+@media (min-width: 642px) and (max-width: 1524px) {
+  .agGridLogo {
+    height: 50px;
   }
-  &__footer {
-    font-size: $footer-font-size;
-    font-style: italic;
+
+  .agChartsLogo {
+    height: 50px;
   }
-  &__content {
-    position: sticky;
-    display: none;
-    margin: 1.5em 0;
-    top: 6em;
-    padding: 0 1.5em 3em;
-    flex-wrap: wrap;
-    justify-content: center;
-    align-items: flex-start;
-    border-right: 2px solid getColor(concrete);
-    overflow: hidden;
-    transition: background-color 250ms;
-    @include break(xlarge) {
+
+  .sponsors {
+    position: absolute;
+    height: auto;
+    width: 100%;
+    margin-top: -240px;
+
+    &__buttons__wrapper {
       display: flex;
+      width: 100%;
+      flex-direction: row;
+      justify-content: center;
+    }
+    &__link-wrapper {
+      box-shadow: $link-wrapper-shadow;
+      border-radius: $link-wrapper-radius;
+      margin: $link-wrapper-margin;
+      transition: transform 0.2s;
+      &:hover {
+        background-color: getColor(concrete);
+        transform: scale(1.05);
+      }
     }
+    &__tagline,
+    &__footer {
+      margin: 1rem 0;
+      text-align: center;
+      color: $sponsor-text-color-light;
+    }
+    &__tagline {
+      font-size: $tagline-font-size-mobile;
+    }
+    &__footer {
+      font-size: $footer-font-size-mobile;
+      font-style: italic;
+    }
+    &__content {
+      position: sticky;
+      display: flex;
+      flex-direction: column;
+      margin: 1.5em 0;
+      top: 6em;
+      flex-wrap: wrap;
+      justify-content: center;
+      align-items: center;
+      border-bottom: 2px solid getColor(concrete);
+      overflow: hidden;
+      transition: background-color 250ms;
+      padding-bottom: 32px;
+    }
+    &__img {
+      background: red !important;
+      &__wrapper {
+        display: none;
+      }
+    }
+  }
+}
+
+@media (min-width: 1525px) {
+  .agGridLogo {
+    max-width: 220px;
+    height: auto;
+  }
+
+  .agChartsLogo {
+    max-width: 220px;
+    height: auto;
   }
-  &__img {
-    &__wrapper {
+
+  .sponsors {
+    position: absolute;
+    height: 100%;
+    width: 250px;
+    margin-left: -250px;
+    margin-right: 8px;
+
+    &__link-wrapper {
+      box-shadow: $link-wrapper-shadow;
+      border-radius: $link-wrapper-radius;
+      margin: $link-wrapper-margin;
+      transition: transform 0.2s;
+      &:hover {
+        background-color: getColor(concrete);
+        transform: scale(1.05);
+      }
+    }
+    &__tagline,
+    &__footer {
+      margin: 1rem 0;
+      text-align: center;
+      color: $sponsor-text-color-light;
+    }
+    &__tagline {
+      font-size: $tagline-font-size;
+    }
+    &__footer {
+      font-size: $footer-font-size;
+      font-style: italic;
+    }
+    &__content {
+      position: sticky;
       display: flex;
+      margin: 1.5em 0;
+      top: 6em;
+      padding: 0 1.5em 3em;
+      flex-wrap: wrap;
       justify-content: center;
-      width: 100%;
+      align-items: flex-start;
+      border-right: 2px solid getColor(concrete);
+      overflow: hidden;
+      transition: background-color 250ms;
+    }
+    &__img {
+      &__wrapper {
+        display: flex;
+        justify-content: center;
+        width: 100%;
+      }
     }
   }
 }