diff --git a/spn/index.html b/spn/index.html
index e1c0535..ef1acfc 100644
--- a/spn/index.html
+++ b/spn/index.html
@@ -11,39 +11,75 @@ layout: page
         from current speeds and features
     </span>
 </a>
-<header class="header-one-container-reverse mb-64 mt-36">
-  <div class="header-one-left pl-12">
-      <h1 class="header-one-left-title lg:max-w-md">
-          Safing Privacy Network
-      </h1>
-      <p class="header-one-left-desc">
-          With the SPN you protect all your connections from mass
-          surveillance. Prevent all Internet Service Providers
-          from collecting and selling your private activities.
-      </p>
-      <div class="col-container w-full text-center lg:w-max lg:text-left">
-        <a class="btn-primary" href="#pricing">Get started</a>
-        <a class="btn-tertiary" href="{{ site.portmaster_url }}">Built into the Portmaster</a>
-      </div>
-  </div>
-  <div class="header-one-right">
-    <span style="font-size: 12rem; font-weight: 800; margin-top: -5rem; margin-left: 6rem; z-index: -1;" class="absolute transform scale-50 lg:scale-125">
-        <img src="{{ site.img_url }}shapes/circle-md.png" alt="">
-    </span>
-    <div class="card">
-       <div class="rounded-2xl overflow-hidden">
-            <video class="max-w-2xl" preload="auto"
-            src="{{ site.assets_server_url }}spn/feature-tour.mp4"
-            poster="{{ site.assets_server_url }}spn/feature-tour-poster.png"
-            controls>
-            </video>
-       </div>
-                    <div class="card-package most-popular card-shadow">
+<header class="header-two-container mb-64 mt-20">
+    <div class="header-two-top">
+        <div class="alert max-w-md bg-transparent mx-auto">
+            <i class="icon-add text-xl" style="color: rgba(46, 98, 255, 1);"></i>
+            <span style="color: rgba(0, 0, 0, 0.6);" class="text-md">Portmaster Add-on</span>
+        </div>
+        <h1 class="header-two-top-title" style="margin-top: 0.3rem;">
+            It's Time to <span class="text-safing-blue-600">Ditch VPN's</span>
+        </h1>
+        <p class="header-two-top-desc" style="max-width: 650px;">
+            Stop paying for out-dated technology that was never intended to protect your privacy.
+            Get peace of mind with the SPN. Built from scratch and designed to truly protect your privacy 
+            from mass surveillance.
+        </p>
+    </div>
+    <div class="header-two-bottom" style="margin-top: 3.5rem;">
+        <div class="element-x-center max-w-sm md:max-w-4xl">
+            <div class="package-billing">
+                <div class="package-billing-line-left"></div>
+                <span class="package-billing-center">Billing: <span class="text-safing-blue-600">One-Time Payment</span></span>
+                <div class="package-billing-line-right"></div>
+            </div>
+            <div class="grid md:grid-cols-2 space-y-3 space-x-3 mt-12 justify-center justify-items-center">
+                <div>
+                    <div class="card-package most-popular card-shadow">
+                        <div class="card-package-most-popular">
+                            <span>Most Popular</span>
+                        </div>
+                        <div class="card-package-top">
+                            <div class="flex">
+                                <span class="card-package-top-title">Per Month</span>
+                                <span tooltip="Comparaed to Beta Prices" class="ml-auto bg-safing-gray-100 text-center rounded-full px-5 py-1 inline-flex text-sm">Save 39%</span>
+                            </div>
+                            <span class="card-package-top-amount">
+                                9.90€
+                            </span>
+                        </div>
+                        <div class="card-package-middle space-y-4">
+                            <span class="card-package-middle-includes-feature"> Use SPN for 1-Month </span>
+                        </div>
+                        <div class="card-package-bottom">
+                            <a class="btn-secondary w-full justify-center" href="https://account.safing.io/plans/1/subscribe">Buy Package</a>
+                        </div>
+                    </div>
+                    <span class="element-x-center-max mt-4 text-sm">Billing does <strong>NOT</strong> auto-renew</span>
+                </div>
+                <div>
+                    <div class="card-package">
+                        <div class="card-package-top">
+                            <div class="flex">
+                                <span class="card-package-top-title">Per Year</span>
+                                <span tooltip="Comparaed to Beta Prices" class="ml-auto bg-safing-gray-100 text-center rounded-full px-5 py-1 inline-flex text-sm">Save 63%</span>
+                            </div>
+                            <span class="card-package-top-amount">
+                                99.00€
+                            </span>
+                        </div>
+                        <div class="card-package-middle space-y-4">
+                            <span class="card-package-middle-includes-feature"> Use SPN for 1-Year </span>
+                        </div>
+                        <div class="card-package-bottom">
+                            <a class="btn-secondary w-full justify-center" href="https://account.safing.io/plans/1/subscribe">Buy Package</a>
+                        </div>
+                    </div>
+                    <span class="element-x-center-max mt-4 text-sm">Billing does <strong>NOT</strong> auto-renew</span>
+                </div>
+            </div>
+        </div>
     </div>
-    <span style="font-size: 12rem; font-weight: 800; margin-top: -4.5rem; margin-left: -3rem; z-index: -1;" class="absolute transform scale-50 lg:scale-125">
-        <img src="{{ site.img_url }}shapes/circle-sm.png" alt="">
-    </span>
-  </div>
 </header>
 <section class="general-layout">
     <div class="intro-container mt-32">