diff --git a/packages/epo-react-lib/src/styles/css/global/global-styles.css b/packages/epo-react-lib/src/styles/css/global/global-styles.css
index 9143c4f8..454cb273 100644
--- a/packages/epo-react-lib/src/styles/css/global/global-styles.css
+++ b/packages/epo-react-lib/src/styles/css/global/global-styles.css
@@ -1,6 +1,9 @@
+html {
+  font-size: var(--size-font-16-20);
+}
+
 body {
   color: var(--color-font-primary);
-  font-size: var(--size-font-16-20);
   font-family: var(--font-stack-base);
   line-height: var(--size-leading-base);
 }
diff --git a/packages/epo-react-lib/src/styles/globalStyles.ts b/packages/epo-react-lib/src/styles/globalStyles.ts
index 1b36cc7b..79acf510 100644
--- a/packages/epo-react-lib/src/styles/globalStyles.ts
+++ b/packages/epo-react-lib/src/styles/globalStyles.ts
@@ -48,14 +48,16 @@ const createCSSGlobalSizes = () => {
 
 const GlobalStyles = createGlobalStyle<{ includeFonts?: boolean }>`
 ${({ includeFonts = true }) => (includeFonts ? baseFont : "")}
-  body {
-    font-family: var(--FONT_STACK_BASE);
+  html {
     font-size: ${calculateClamp({
       minSize: parseInt(FONT_SIZE_BASE_MOBILE),
       maxSize: parseInt(FONT_SIZE_BASE_DESKTOP),
       minWidth: 320,
       maxWidth: 1240,
     })};
+  }  
+  body {  
+    font-family: var(--FONT_STACK_BASE);
     line-height: var(--LINE_HEIGHT_BASE);
   }
   :root {