diff --git a/src/modules/form/components/DynamicGroup.tsx b/src/modules/form/components/DynamicGroup.tsx
index 07c870989..c5dfeb89d 100644
--- a/src/modules/form/components/DynamicGroup.tsx
+++ b/src/modules/form/components/DynamicGroup.tsx
@@ -1,5 +1,4 @@
-import { Box, Grid, lighten } from '@mui/material';
-import { ReactNode } from 'react';
+import { Grid, lighten } from '@mui/material';
 
 import { GroupItemComponentProps } from '../types';
 
@@ -14,27 +13,6 @@ import TableGroup from './group/TableGroup';
 import Signature from '@/modules/form/components/group/Signature';
 import { Component } from '@/types/gqlTypes';
 
-export const InfoGroup = ({
-  children,
-}: {
-  children: ReactNode;
-  nestingLevel?: number;
-}) => (
-  <Box
-    sx={{
-      backgroundColor: (theme) => lighten(theme.palette.grey[100], 0.2),
-      borderRadius: 1,
-      width: 'fit-content',
-      px: 0.5,
-      // use box shadow to "extend" background color beyond div. doing this so we dont mess with the height
-      boxShadow: (theme) =>
-        `0 2px 0 6px ${lighten(theme.palette.grey[100], 0.2)}`,
-    }}
-  >
-    {children}
-  </Box>
-);
-
 interface Props extends GroupItemComponentProps {
   clientId?: string;
   debug?: (ids?: string[]) => void;
@@ -75,9 +53,18 @@ const DynamicGroup: React.FC<Props> = ({ debug, ...props }) => {
       return <Signature key={props.item.linkId} {...props} />;
     case Component.InfoGroup:
       return (
-        <InfoGroup nestingLevel={props.nestingLevel}>
-          <QuestionGroup key={props.item.linkId} {...props} />
-        </InfoGroup>
+        <QuestionGroup
+          key={props.item.linkId}
+          {...props}
+          sx={{
+            backgroundColor: (theme) => lighten(theme.palette.grey[100], 0.2),
+            borderRadius: 1,
+            px: 0.5,
+            // use box shadow to "extend" background color beyond div. doing this so we dont mess with the height
+            boxShadow: (theme) =>
+              `0 2px 0 6px ${lighten(theme.palette.grey[100], 0.2)}`,
+          }}
+        />
       );
     case Component.Table:
       return <TableGroup key={props.item.linkId} {...props} />;
diff --git a/src/modules/form/components/group/QuestionGroup.tsx b/src/modules/form/components/group/QuestionGroup.tsx
index 5d3327449..249728a14 100644
--- a/src/modules/form/components/group/QuestionGroup.tsx
+++ b/src/modules/form/components/group/QuestionGroup.tsx
@@ -1,4 +1,4 @@
-import { Box, Grid, Typography } from '@mui/material';
+import { Box, Grid, SxProps, Theme, Typography } from '@mui/material';
 
 import { GroupItemComponentProps } from '../../types';
 
@@ -9,7 +9,8 @@ const QuestionGroup = ({
   nestingLevel,
   renderChildItem,
   viewOnly = false,
-}: GroupItemComponentProps) => {
+  sx,
+}: GroupItemComponentProps & { sx?: SxProps<Theme> }) => {
   const wrappedChildren = (
     <Grid container direction='column' sx={{ mt: 0 }} gap={3}>
       {renderChildItem &&
@@ -27,7 +28,7 @@ const QuestionGroup = ({
 
   if (nestingLevel >= 1) {
     return (
-      <Grid item xs>
+      <Grid item xs sx={sx}>
         <Box
           sx={
             isConditionalGroup
@@ -52,7 +53,7 @@ const QuestionGroup = ({
   }
 
   return (
-    <Grid item xs>
+    <Grid item xs sx={sx}>
       {label && <Typography sx={{ mb: 2 }}>{label}</Typography>}
       {wrappedChildren}
     </Grid>