diff --git a/packages/modules/src/modules/banners/choiceCardsButtonsBanner/components/ChoiceCards.tsx b/packages/modules/src/modules/banners/choiceCardsButtonsBanner/components/ChoiceCards.tsx
index 40e2dca16..e3cf8dbdc 100644
--- a/packages/modules/src/modules/banners/choiceCardsButtonsBanner/components/ChoiceCards.tsx
+++ b/packages/modules/src/modules/banners/choiceCardsButtonsBanner/components/ChoiceCards.tsx
@@ -31,10 +31,11 @@ interface ChoiceCardProps {
     numArticles?: number;
     content?: BannerTextContent;
     cssCtaOverides?: SerializedStyles;
+    verticalPosAdjust?: number;
 }
 
 const styles = {
-    container: css`
+    container: (verticalPosAdjust?: number) => css`
         // This position: relative is necessary to stop it jumping to the top of the page when a button is clicked
         position: relative;
         margin: ${space[3]}px 0 ${space[5]}px;
@@ -53,13 +54,13 @@ const styles = {
         }
 
         ${from.tablet} {
-            margin: 108px 0 ${space[5]}px;
+            margin: ${verticalPosAdjust ?? 108}px 0 ${space[5]}px;
         }
 
         ${from.desktop} {
             min-height: 208px;
             max-width: 380px;
-            margin-top: 120px;
+            margin-top: ${verticalPosAdjust ?? 120}px;
         }
     `,
     bannerFrequenciesGroupOverrides: css`
@@ -139,6 +140,7 @@ export const ChoiceCards: React.FC<ChoiceCardProps> = ({
     numArticles,
     getCtaText,
     cssCtaOverides,
+    verticalPosAdjust,
 }: ChoiceCardProps) => {
     if (!selection || !amounts) {
         return <></>;
@@ -166,7 +168,7 @@ export const ChoiceCards: React.FC<ChoiceCardProps> = ({
     }, [hasBeenSeen, submitComponentEvent]);
 
     return (
-        <div ref={setNode} css={styles.container}>
+        <div ref={setNode} css={styles.container(verticalPosAdjust)}>
             <ChoiceCardGroup
                 name="contribution-frequency"
                 columns={3}
diff --git a/packages/modules/src/modules/banners/momentTemplate/MomentTemplateBanner.tsx b/packages/modules/src/modules/banners/momentTemplate/MomentTemplateBanner.tsx
index e43d83a9e..5bb297dd4 100644
--- a/packages/modules/src/modules/banners/momentTemplate/MomentTemplateBanner.tsx
+++ b/packages/modules/src/modules/banners/momentTemplate/MomentTemplateBanner.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { css } from '@emotion/react';
 import { neutral, space } from '@guardian/src-foundations';
 import { Container } from '@guardian/src-layout';
@@ -30,6 +30,11 @@ export function getMomentTemplateBanner(
     const hasBannerAndHeaderVisuals =
         !!templateSettings.imageSettings && !!templateSettings.headerSettings?.image;
 
+    function getHeightHeader(id: string) {
+        const element = document.getElementById(id);
+        return (element?.offsetHeight || 0) + space[6];
+    }
+
     function MomentTemplateBanner({
         content,
         onCloseClick,
@@ -44,6 +49,16 @@ export function getMomentTemplateBanner(
         submitComponentEvent,
         tracking,
     }: BannerRenderProps): JSX.Element {
+        const [headerHeight, setHeaderHeight] = useState<number>();
+        useEffect(() => {
+            function handleResize() {
+                setHeaderHeight(getHeightHeader('headerContainer'));
+            }
+            window.addEventListener('resize', handleResize);
+            handleResize();
+            return () => window.removeEventListener('resize', handleResize);
+        }, []);
+
         const { isReminderActive, onReminderCtaClick, mobileReminderRef } = useReminder(
             reminderTracking,
         );
@@ -103,6 +118,7 @@ export function getMomentTemplateBanner(
                                     numArticles={numArticles}
                                     content={content}
                                     getCtaText={getCtaText}
+                                    verticalPosAdjust={headerHeight}
                                 />
                             )}
                         </div>
@@ -116,6 +132,7 @@ export function getMomentTemplateBanner(
                                     SecondaryCtaType.ContributionsReminder,
                                 templateSettings.choiceCards,
                             )}
+                            id="headerContainer"
                         >
                             <MomentTemplateBannerHeader
                                 heading={content.mainContent.heading}
@@ -266,8 +283,6 @@ const styles = {
         display: block; // choice cards visible below mobileMedium
 
         ${from.tablet} {
-            display: flex;
-            align-items: center;
             width: 350px;
         }
     `