diff --git a/publisher/src/components/MetricConfiguration/Configuration.tsx b/publisher/src/components/MetricConfiguration/Configuration.tsx
index 966bb4f01..6e6b1b7ab 100644
--- a/publisher/src/components/MetricConfiguration/Configuration.tsx
+++ b/publisher/src/components/MetricConfiguration/Configuration.tsx
@@ -236,6 +236,7 @@ export const Configuration: React.FC<MetricConfigurationProps> = observer(
                       RACE_ETHNICITY_DISAGGREGATION_KEY
                     ]?.enabled
                   )}
+                  onClick={() => setActiveDimensionKey(activeDimensionKeys[0])}
                 />
               ) : (
                 activeDimensionKeys?.map((dimensionKey) => {
diff --git a/publisher/src/components/MetricConfiguration/RaceEthnicities.styles.tsx b/publisher/src/components/MetricConfiguration/RaceEthnicities.styles.tsx
index 7de558b13..bf7a1b62d 100644
--- a/publisher/src/components/MetricConfiguration/RaceEthnicities.styles.tsx
+++ b/publisher/src/components/MetricConfiguration/RaceEthnicities.styles.tsx
@@ -66,11 +66,17 @@ export const CalloutBox = styled.div`
   border-radius: 2px;
   border: 1px solid ${palette.solid.blue};
   box-shadow: 0px 2px 4px rgba(0, 115, 229, 0.25);
+  transition: box-shadow 0.3s ease;
 
   svg {
     position: absolute;
     right: 20px;
   }
+
+  &:hover {
+    cursor: pointer;
+    box-shadow: 0px 0px 0px rgba(0, 115, 229, 0.25);
+  }
 `;
 
 export const GridHeaderContainer = styled.div`
diff --git a/publisher/src/components/MetricConfiguration/RaceEthnicitiesGrid.tsx b/publisher/src/components/MetricConfiguration/RaceEthnicitiesGrid.tsx
index 892002a5c..3dfee980f 100644
--- a/publisher/src/components/MetricConfiguration/RaceEthnicitiesGrid.tsx
+++ b/publisher/src/components/MetricConfiguration/RaceEthnicitiesGrid.tsx
@@ -36,50 +36,52 @@ import {
   RaceEthnicitiesTable,
 } from ".";
 
-export const RaceEthnicitiesGrid: React.FC<{ disaggregationEnabled: boolean }> =
-  observer(({ disaggregationEnabled }) => {
-    const { metricConfigStore } = useStore();
-    const { ethnicitiesByRace } = metricConfigStore;
+export const RaceEthnicitiesGrid: React.FC<{
+  disaggregationEnabled: boolean;
+  onClick: () => void;
+}> = observer(({ disaggregationEnabled, onClick }) => {
+  const { metricConfigStore } = useStore();
+  const { ethnicitiesByRace } = metricConfigStore;
 
-    return (
-      <RaceEthnicitiesBreakdownContainer
-        disaggregationEnabled={disaggregationEnabled}
-      >
-        <CalloutBox>
-          <Description>
-            Answer the questions on the <span>Race and Ethnicity</span> form;
-            the grid below will reflect your responses.
-          </Description>
-          <RightArrowIcon />
-        </CalloutBox>
+  return (
+    <RaceEthnicitiesBreakdownContainer
+      disaggregationEnabled={disaggregationEnabled}
+    >
+      <CalloutBox onClick={onClick}>
+        <Description>
+          Answer the questions on the <span>Race and Ethnicity</span> form; the
+          grid below will reflect your responses.
+        </Description>
+        <RightArrowIcon />
+      </CalloutBox>
 
-        <GridHeaderContainer>
-          <GridRaceHeader>Race</GridRaceHeader>
-          <GridEthnicitiesHeader>
-            <EthnicityLabel>
-              Ethnicity <RightArrowIcon />
-            </EthnicityLabel>
-            <Ethnicity>Hispanic</Ethnicity>
-            <Ethnicity>Not Hispanic</Ethnicity>
-            <Ethnicity>Unknown</Ethnicity>
-          </GridEthnicitiesHeader>
-        </GridHeaderContainer>
+      <GridHeaderContainer>
+        <GridRaceHeader>Race</GridRaceHeader>
+        <GridEthnicitiesHeader>
+          <EthnicityLabel>
+            Ethnicity <RightArrowIcon />
+          </EthnicityLabel>
+          <Ethnicity>Hispanic</Ethnicity>
+          <Ethnicity>Not Hispanic</Ethnicity>
+          <Ethnicity>Unknown</Ethnicity>
+        </GridEthnicitiesHeader>
+      </GridHeaderContainer>
 
-        <RaceEthnicitiesTable>
-          {Object.entries(ethnicitiesByRace).map(([race, ethnicities]) => (
-            <RaceEthnicitiesRow key={race}>
-              <RaceCell>{race}</RaceCell>
-              <EthnicitiesRow>
-                {Object.values(ethnicities).map((ethnicity) => (
-                  <EthnicityCell
-                    key={ethnicity.key}
-                    enabled={ethnicity.enabled}
-                  />
-                ))}
-              </EthnicitiesRow>
-            </RaceEthnicitiesRow>
-          ))}
-        </RaceEthnicitiesTable>
-      </RaceEthnicitiesBreakdownContainer>
-    );
-  });
+      <RaceEthnicitiesTable>
+        {Object.entries(ethnicitiesByRace).map(([race, ethnicities]) => (
+          <RaceEthnicitiesRow key={race}>
+            <RaceCell>{race}</RaceCell>
+            <EthnicitiesRow>
+              {Object.values(ethnicities).map((ethnicity) => (
+                <EthnicityCell
+                  key={ethnicity.key}
+                  enabled={ethnicity.enabled}
+                />
+              ))}
+            </EthnicitiesRow>
+          </RaceEthnicitiesRow>
+        ))}
+      </RaceEthnicitiesTable>
+    </RaceEthnicitiesBreakdownContainer>
+  );
+});