From d7853b05e45c3f11140e5410613a571f474bd1be Mon Sep 17 00:00:00 2001
From: ehab-hassan <hassane@codescalers.com>
Date: Sun, 23 May 2021 17:27:24 +0200
Subject: [PATCH] update css

---
 content/page/home/stats/index.md                 |  2 +-
 content/page/home/videoPanel/index.md            |  4 +++-
 src/components/custom/VideoPanel.vue             | 16 ++++++++++++----
 .../marketing/sections/cta-sections/StateMap.vue | 10 +++++-----
 src/pages/Index.vue                              |  4 ++++
 5 files changed, 25 insertions(+), 11 deletions(-)

diff --git a/content/page/home/stats/index.md b/content/page/home/stats/index.md
index 9912bf20e..82910126a 100644
--- a/content/page/home/stats/index.md
+++ b/content/page/home/stats/index.md
@@ -10,5 +10,5 @@ btn2: What is Internet Capacity?
 link2: https://threefold.io/info/threefold#/threefold__farming_hardware_overview?id=plug-amp-farm-3nodes
 ---
 
-The ThreeFold Grid is formed by a global network of independent Farmers – people  <br />
+The ThreeFold Grid is formed by a global network of independent Farmers – people 
 and organizations who expand the Internet capacity to where it is needed the most.
diff --git a/content/page/home/videoPanel/index.md b/content/page/home/videoPanel/index.md
index 2bf255b59..719895dc4 100644
--- a/content/page/home/videoPanel/index.md
+++ b/content/page/home/videoPanel/index.md
@@ -3,4 +3,6 @@ id: home_videoPanel
 video: https://www.youtube.com/embed/5DtVU66Z74s
 title:  More than an Internet, a new paradigm
 ---
-ThreeFold started from the ground up to build secure and sustainable peer-to-peer Internet infrastructure and technologies that can scale anywhere and empower you, your business and your community with data sovereignty.
+ThreeFold started from the ground up to build secure and sustainable peer-to-peer Internet 
+infrastructure and technologies that can scale anywhere and empower you, your business
+and your community with data sovereignty.
diff --git a/src/components/custom/VideoPanel.vue b/src/components/custom/VideoPanel.vue
index f4d7621ff..4b493ee72 100644
--- a/src/components/custom/VideoPanel.vue
+++ b/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:rounded-lg lg:px-40">
+  <div class="video_bg lg:py-12 lg:flex lg:justify-center flex flex-col">
+    <div class="lg:flex lg:rounded-lg lg:px-40">
       <div class="lg:w-1/2">
         <div class="aspect-w-16 aspect-h-9">
           <iframe
@@ -13,7 +13,7 @@
           ></iframe>
         </div>
       </div>
-      <div class="py-6 px-6 lg:w-1/2">
+      <div class="px-6 lg:w-1/2">
         <h2
           class="text-4xl leading-tight mb-6 font-bold font-heading uppercase"
         >
@@ -29,4 +29,12 @@
 export default {
   props: ["card"],
 };
-</script>
\ No newline at end of file
+</script>
+<style scoped>
+
+.video_bg{
+
+background-color: #ebfefd;
+}
+
+</style>
\ No newline at end of file
diff --git a/src/components/marketing/sections/cta-sections/StateMap.vue b/src/components/marketing/sections/cta-sections/StateMap.vue
index 9b2f2e6f1..a3506c363 100644
--- a/src/components/marketing/sections/cta-sections/StateMap.vue
+++ b/src/components/marketing/sections/cta-sections/StateMap.vue
@@ -1,5 +1,5 @@
 <template>
-  <section class="py-12 px-2">
+  <section class="px-2">
     <div class="flex flex-wrap blue p-12 text-center lg:text-left -mx-2">
       <div
         class="lg:w-1/4 light-blue text-center rounded-lg py-20 mt-10 lg:mt-0 order-1 lg:order-none"
@@ -31,19 +31,19 @@
         </div>
       </div>
       <div
-        class="lg:w-3/4 text-center rounded lg:pr-10 mt-10 lg:mt-0 order-1 lg:order-none"
+        class="lg:w-3/4 text-center rounded lg:px-6 mt-10 lg:mt-0 order-1 lg:order-none"
       >
         <h2
-          class="text-4xl mb-6 leading-tight text-center text-white font-normal font-heading"
+          class="text-4xl text-white leading-tight mb-6 font-bold font-heading uppercase"
         >
           {{ section.title }}
         </h2>
         <div
-          class="text-2xl font-light text-white leading-relaxed"
+          class="text-white mt-4 "
           v-html="section.content"
         ></div>
         <g-image :src="img(section.image)" :alt="section.title" />
-            <div class="mx-auto mt-4">
+            <div class="mx-auto mt-10">
       <g-link
         class="inline-block green text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
         :to="section.link1"
diff --git a/src/pages/Index.vue b/src/pages/Index.vue
index 097198302..199ad2f5d 100644
--- a/src/pages/Index.vue
+++ b/src/pages/Index.vue
@@ -305,6 +305,10 @@
           content
           button
           link
+          btn1
+          btn2
+          link1
+          link2
           image
         }
     }