google map heaer remove

container/Contact/GoogleMap.js

@@ -3,16 +3,19 @@ import React from "react";
 const GoogleMap = () => {
 const GoogleMap = () => {
   return (
   return (
     <div className="maps my-map-container">
     <div className="maps my-map-container">
-     
+      <div className="iframe-wrapper">
         <iframe
         <iframe
           src="https://www.google.com/maps/d/u/0/embed?mid=1-Y3WcCdJ8YQ9m2K72Fi9VvyxN_Kccc8&ehbc=2E312F&noprof=1"
           src="https://www.google.com/maps/d/u/0/embed?mid=1-Y3WcCdJ8YQ9m2K72Fi9VvyxN_Kccc8&ehbc=2E312F&noprof=1"
           width="100%"
           width="100%"
-        height="480"
+          height="680"
           style={{ border: 0 }}
           style={{ border: 0 }}
           allowFullScreen
           allowFullScreen
           loading="lazy"
           loading="lazy"
           referrerPolicy="no-referrer-when-downgrade"
           referrerPolicy="no-referrer-when-downgrade"
         ></iframe>
         ></iframe>
+        {/* overlay to hide header */}
+        <div className="iframe-header-mask"></div>
+      </div>
     </div>
     </div>
   );
   );
 };
 };

styles/styles.css

@@ -10030,3 +10030,17 @@ ul.pagination.custom-pagination {
 .variant_cfo_section .custom-card:hover .Description p {
 .variant_cfo_section .custom-card:hover .Description p {
   color: #fff !important;
   color: #fff !important;
 }
 }
+.iframe-wrapper {
+  position: relative;
+}
+
+.iframe-header-mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 60px; 
+  background-color: white; 
+  z-index: 10;
+  pointer-events: none; 
+}