align video

src/components/custom/VideoPanel.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="lg:py-12 lg:flex lg:justify-center flex flex-col">
-    <div class="bg-white lg:flex lg:max-w-5xl lg:rounded-lg">
+    <div class="bg-white lg:flex lg:rounded-lg lg:px-40">
       <div class="lg:w-1/2">
         <div class="aspect-w-16 aspect-h-9">
           <iframe
@@ -13,8 +13,12 @@
           ></iframe>
         </div>
       </div>
-      <div class="py-6 px-6 max-w-xl lg:max-w-5xl lg:w-1/2">
+      <div class="py-6 px-6 lg:w-1/2">
-        <h2 class="text-2xl text-gray-700 font-bold">{{ card.title }}</h2>
+        <h2
+          class="text-4xl leading-tight mb-6 font-bold font-heading uppercase"
+        >
+          {{ card.title }}
+        </h2>
         <div class="mt-4 text-gray-700" v-html="card.content"></div>
       </div>
     </div>

src/pages/Index.vue

@@ -19,8 +19,6 @@
         :src="$page.markdownPage.solution_image2.src"
       />  -->
 
-      <VideoPanel :card="$page.markdownPage.videoPanel" />
-
       <!-- <g-image
         class="m-auto w-2/4 lg:mt-20"
         v-if="$page.markdownPage.solution_image3"
@@ -56,6 +54,8 @@
         :cta="$page.markdownPage.cta5"
       /> -->
     </div>
+    <VideoPanel :card="$page.markdownPage.videoPanel" />
+
     <Map v-if="$page.markdownPage.stats" :section="$page.markdownPage.stats" />
     <div class="container sm:pxi-0 mx-auto overflow-x-hidden py-5">
       <Features
@@ -356,10 +356,6 @@
           content
           button
           link
-          btn1 
-          link1
-          btn2
-          link2
           image
         }
     }