Google Maps section

pages/index.tsx

@@ -129,7 +129,16 @@ export default function Index() {
 
         <section className={styles.sectionContainer}>
           <OpenHours />
+          <iframe
+            className={styles.googleMaps}
+            src='https://maps.google.com/maps?q=Velkuantie%20988%2C%20Livonsaari%2C%20Finland&t=m&z=13&output=embed&iwloc=near'
+            allowFullScreen={false}
+            loading='lazy'
+            referrerPolicy='no-referrer-when-downgrade'
+          ></iframe>
         </section>
+
+        <span className={styles.separator} />
       </div>
     </div>
   );

styles/Index.module.scss

@@ -16,13 +16,13 @@
   display: flex;
   align-items: center;
   flex-direction: column;
-  max-width: 50%;
 }
 
 .sectionContainer {
   display: flex;
   flex-direction: column;
   align-items: center;
+  width: 100%;
 }
 
 .address {
@@ -120,3 +120,10 @@
 .instagramText {
   margin-bottom: 0;
 }
+
+.googleMaps {
+  border: 0;
+  width: 100%;
+  height: 30rem;
+  margin: 5% 20% 0% 20%;
+}