diff --git a/app/web/src/layouts/MainLayout/MainLayout.css b/app/web/src/layouts/MainLayout/MainLayout.css
index a599de1..82552f4 100644
--- a/app/web/src/layouts/MainLayout/MainLayout.css
+++ b/app/web/src/layouts/MainLayout/MainLayout.css
@@ -1,3 +1,7 @@
 .preserve-3d-for-children * {
   transform-style: preserve-3d;
 }
+.preserve-3d-for-children {
+  transform-style: preserve-3d;
+}
+
diff --git a/app/web/src/layouts/MainLayout/MainLayout.js b/app/web/src/layouts/MainLayout/MainLayout.js
index a44b427..750c4e1 100644
--- a/app/web/src/layouts/MainLayout/MainLayout.js
+++ b/app/web/src/layouts/MainLayout/MainLayout.js
@@ -71,7 +71,7 @@ const MainLayout = ({ children, shouldRemoveFooterInIde }) => {
   }, [hash, client])
   return (
     <div
-      className="h-full flex flex-col ch-scrollbar overflow-y-scroll preserve-3d-for-children overflow-x-hidden"
+      className="h-full flex flex-col ch-scrollbar overflow-y-scroll overflow-x-hidden"
       style={{ perspective: '1px', perspectiveOrigin: 'top center' }}
     >
       <header id="cadhub-main-header">
@@ -171,7 +171,7 @@ const MainLayout = ({ children, shouldRemoveFooterInIde }) => {
         open={isLoginModalOpen}
         onClose={() => setIsLoginModalOpen(false)}
       />
-      <main className="flex-grow bg-ch-gray-800">{children}</main>
+      <main className="flex-grow bg-ch-gray-800 preserve-3d-for-children">{children}</main>
       {!shouldRemoveFooterInIde && <Footer />}
     </div>
   )