diff --git a/src/pages/index.js b/src/pages/index.js
index aaa8f88d..f8fbeef5 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,7 +1,7 @@
 import React from "react";
 import clsx from 'clsx';
 import Layout from "@theme/Layout";
-import Link from "@docusaurus/Link";
+import BrowserOnly from '@docusaurus/BrowserOnly';
 import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
 import useBaseUrl from "@docusaurus/useBaseUrl";
 import styles from "./styles.module.css";
@@ -94,21 +94,26 @@ const features = [
   {
     title: <>Upcoming Events</>,
     imageUrl: "",
-    description: (
-      <>
-        <iframe
+    description: UpcomingEvents(),
+  },
+];
+
+function UpcomingEvents() {
+  return (
+    <BrowserOnly>
+      {() => <iframe
           title="Upcoming Events Calendar"
-          src="https://calendar.google.com/calendar/embed?height=400&amp;wkst=2&amp;bgcolor=%23ffffff&amp;ctz=UTC&amp;src=cDA3bjk4Z28xMW9uYW1kMDhkMGttcTZqaHNAZ3JvdXAuY2FsZW5kYXIuZ29vZ2xlLmNvbQ&amp;color=%23039BE5&amp;title=Release%20Schedule&amp;mode=AGENDA&amp;showPrint=0&amp;showTabs=0&amp;showCalendars=0&amp;showTz=1&amp;showNav=0&amp;showDate=0&amp;showTitle=0"
+          src={`https://calendar.google.com/calendar/embed?height=400&wkst=2&bgcolor=%23ffffff&ctz=${Intl.DateTimeFormat().resolvedOptions().timeZone || "UTC"}&src=cDA3bjk4Z28xMW9uYW1kMDhkMGttcTZqaHNAZ3JvdXAuY2FsZW5kYXIuZ29vZ2xlLmNvbQ&color=%23039BE5&title=Release%20Schedule&mode=AGENDA&showPrint=0&showTabs=0&showCalendars=0&showTz=1&showNav=0&showDate=0&showTitle=0`}
           style={{ borderWidth: 0, margin: "auto" }}
           width="300"
           height="200"
           frameBorder="0"
           scrolling="no"
-        />
-      </>
-    ),
-  },
-];
+        />}
+    </BrowserOnly>
+
+  );
+}
 
 function Feature({ imageUrl, title, description }) {
   const imgUrl = useBaseUrl(imageUrl);