add iframe for compressed pro video

src/assets/styles/peripheral.scss

@@ -433,17 +433,22 @@ section#contact {
   }
 }
 
-section#pro-video {
+.video-container {
-  width: 80vw;
+  width: 70vw;
-  height: 80vh;
+}
-  display: flex;
-  justify-content: center;
-  align-items: center;
 
-  .flowplayer {
+.video-wrapper {
-    width: 63vw;
+  position: relative;
-    // border-radius: 2px;
+  padding-bottom: 56.25%; /* 16:9 */
-    // border: 2px solid var(--c-gray5);
+  height: 0;
+  
+  iframe {
+    border: none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
   }
 }
 
@@ -454,6 +459,12 @@ section#pro-video {
   }
 }
 
+@media only screen and (max-width: 1100px) {
+  .video-container {
+    width: 90vw;
+  }
+}
+
 @media only screen and (max-width: 500px) {
   section {
     --width: 40ch;
@@ -485,9 +496,4 @@ section#pro-video {
       font-size: 1.7rem;
     }
   }
-
-  section#pro-video {
-    width: 90vw;;
-    height: 20vh;
-  }
 }

src/embassy-pro.njk

@@ -22,10 +22,8 @@ layout: layouts/peripheral.njk
   </div>
 </section>
 
-<section id="pro-video">
+<section class="video-container">
-  <div data-player-id="dd03b0e0-e64c-4a3b-aef5-69195ab2aa61" >
+  <div class="video-wrapper">
-    <script src="//cdn.flowplayer.com/players/21e0a777-b621-48d2-9f92-701c1e1fc844/native/flowplayer.async.js">
+    <iframe src="/assets/videos/compressed.mp4" allowfullscreen></iframe>
-      { "src": "https://customer-g9m9y1yjgqx9eniu.cloudflarestream.com/733ce92ef09cba3eeb9c4d0a06370b24/manifest/video.m3u8", "poster": "https://start9.com/thumbnail-pro.jpg", "auto_orient": true }
-    </script>
   </div>
 </section>