Adjust media furniture layout

Author: frederickobrien

dotcom-rendering/src/layouts/StandardLayout.tsx

@@ -336,6 +336,18 @@ export const StandardLayout = (props: WebProps | AppProps) => {
 							area="main-media"
 							layoutType={layoutType}
 							element="div"
+							customCss={
+								isMedia
+									? css`
+											${from.desktop} {
+												${grid.between(
+													'centre-column-start',
+													'right-column-start',
+												)};
+											}
+									  `
+									: undefined
+							}
 						>
 							<div css={!isMedia && maxWidth}>
 								<MainMedia
@@ -404,6 +416,18 @@ export const StandardLayout = (props: WebProps | AppProps) => {
 							area="standfirst"
 							layoutType={layoutType}
 							element="div"
+							customCss={
+								isMedia
+									? css`
+											${from.desktop} {
+												${grid.between(
+													'centre-column-start',
+													'right-column-start',
+												)};
+											}
+									  `
+									: undefined
+							}
 						>
 							<Standfirst
 								format={format}
@@ -532,6 +556,18 @@ export const StandardLayout = (props: WebProps | AppProps) => {
 							area="body"
 							layoutType={layoutType}
 							element="div"
+							customCss={
+								isMedia
+									? css`
+											${from.desktop} {
+												${grid.between(
+													'centre-column-start',
+													'right-column-start',
+												)};
+											}
+									  `
+									: undefined
+							}
 						>
 							{/* Only show Listen to Article button on App landscape views */}
 							{isApps && (