diff --git a/components/Modals/ShortcutHelpModal.tsx b/components/Modals/ShortcutHelpModal.tsx
index a9bf7b6..9a22162 100644
--- a/components/Modals/ShortcutHelpModal.tsx
+++ b/components/Modals/ShortcutHelpModal.tsx
@@ -54,7 +54,7 @@ export default function ShortcutHelpModal() {
       {/* fixed help on bottom left */}
       <span
         onClick={handleShowModal}
-        className="hover:cursor-pointer fixed bottom-10 right-10 bg-gray-200 bg-opacity-80 py-2 px-3 rounded text-gray-500 flex flex-row items-center space-x-2"
+        className="hover:cursor-pointer z-50 backdrop-blur-md fixed bottom-10 right-10 bg-gray-200 bg-opacity-80 py-2 px-3 rounded text-gray-500 flex flex-row items-center space-x-2"
       >
         <span>Help</span>
 
diff --git a/pages/index.js b/pages/index.js
index 1632912..1bf1e7a 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -6,6 +6,9 @@ import {
   FaCalendarAlt,
   FaRocketchat,
   FaAngleRight,
+  FaCheck,
+  FaInfo,
+  FaInfoCircle,
 } from "react-icons/fa";
 import TeamVoiceLine from "../components/demo/TeamVoiceLine";
 import Announcements from "../components/demo/Announcements";
@@ -13,7 +16,7 @@ import Rooms from "../components/demo/Rooms";
 import VoiceLineConceptDemo from "../components/demo/VoiceLineConceptDemo";
 
 import MainLogo from "../components/MainLogo";
-import { Divider } from "antd";
+import { Divider, Tooltip } from "antd";
 import { useRouter } from "next/router";
 import { useState } from "react";
 import SkeletonLoader from "../components/Loading/skeletonLoader";
@@ -96,63 +99,186 @@ export default function Home() {
         </div>
 
         {/* above fold main */}
-        <div className="flex flex-row flex-wrap md:flex-nowrap md:mt-20 space-x-10">
-          <span className="flex flex-col max-w-screen-sm justify-start items-baseline backdrop-blur-xl rounded-lg p-5">
-            <span className="flex flex-row text-left md:text-6xl text-5xl space-x-5 h-[5rem] overflow-hidden">
-              <span className="font-semibold text-black py-4">No</span>
-              <span className="md:hidden flex flex-row space-x-2 py-4 text-red-600">
+        <span className="flex flex-col justify-evenly items-center backdrop-blur-xl rounded-lg p-5">
+          <span className="flex flex-row text-left md:text-6xl text-5xl space-x-5 h-[5rem] overflow-hidden">
+            <span className="font-semibold text-black py-4">No</span>
+            <span className="md:hidden flex flex-row space-x-2 py-4 text-red-600">
+              <FaSlackHash /> <span>slacking</span>
+            </span>
+            <span className="hidden flippingWords md:visible md:flex flex-col space-y-5 text-red-600 ">
+              <span className="flex flex-row space-x-2">
+                <FaRocketchat /> <span>threads</span>
+              </span>
+              <span className="flex flex-row space-x-2">
                 <FaSlackHash /> <span>slacking</span>
               </span>
-              <span className="hidden flippingWords md:visible md:flex flex-col space-y-5 text-red-600 ">
-                <span className="flex flex-row space-x-2">
-                  <FaRocketchat /> <span>threads</span>
-                </span>
-                <span className="flex flex-row space-x-2">
-                  <FaSlackHash /> <span>slacking</span>
-                </span>
-                <span className="flex flex-row space-x-2">
-                  <FaCalendarAlt /> <span>calendars</span>
-                </span>
-                <span className="flex flex-row space-x-2">
-                  <FaNewspaper /> <span>files</span>
-                </span>
-                <span className="flex flex-row space-x-2">
-                  <FaRocketchat /> <span>threads</span>
-                </span>
+              <span className="flex flex-row space-x-2">
+                <FaCalendarAlt /> <span>calendars</span>
+              </span>
+              <span className="flex flex-row space-x-2">
+                <FaNewspaper /> <span>files</span>
+              </span>
+              <span className="flex flex-row space-x-2">
+                <FaRocketchat /> <span>threads</span>
+              </span>
+            </span>
+          </span>
+
+          <span className="flex flex-row text-left md:text-6xl text-5xl space-x-5">
+            <span className="font-semibold text-black">More</span>
+            <span className="text-sky-600 font-bold">focus.</span>
+          </span>
+
+          <span className="my-10 text-xl text-center text-gray-600 w-max">
+            Minimal, voice-only collaboration tool for scrum/agile teams.
+            <br></br>
+            Skip slack and email, just talk to your team.
+          </span>
+
+          <span className="flex flex-row space-x-2">
+            <button
+              onClick={() =>
+                window.open(
+                  "mailto:usenirvana@gmail.com?subject=Interested in Nirvana for Startups",
+                  "_blank"
+                )
+              }
+              className="rounded text-teal-600 p-2 shadow-l flex flex-row items-center space-x-2"
+            >
+              Email Us
+            </button>
+            {getStartedButton}
+          </span>
+        </span>
+
+        <span className="flex w-full justify-evenly">
+          <img
+            src="/screenshots/frame_safari_dark.png"
+            className="h-[80rem] w-[85rem]"
+          />
+        </span>
+
+        <span className="flex flex-row py-32">
+          <span className="flex flex-col grow max-w-sm rounded-lg bg-gray-200 bg-opacity-25 backdrop-blur-xl p-10">
+            <span className="bg-clip-text text-transparent bg-gradient-to-r from-pink-500 to-violet-500">
+              VOICE LINE
+            </span>
+
+            <span className="text-left text-3xl text-gray-700 font-bold">
+              Move 10x faster.
+            </span>
+
+            <span className="text-left text-lg text-gray-700"></span>
+
+            <Divider />
+
+            {/* checkmarks of value add */}
+            <span className="flex flex-row items-center space-x-2">
+              <FaCheck className="text-teal-500" />
+              <span className="text-left text-lg text-gray-600">
+                {"Asynchronous."}
+              </span>
+              <Tooltip
+                title={
+                  "If you send a voice clip to someone, and they are online, they hear you instantly without changing tabs/windows."
+                }
+              >
+                <FaInfoCircle className="text-lg text-teal-500 animate-bounce" />
+              </Tooltip>
+            </span>
+
+            <span className="flex flex-row items-center space-x-2">
+              <FaCheck className="text-teal-500" />
+              <span className="text-left text-lg text-gray-600">
+                {"NO low-quality chatter."}
               </span>
             </span>
 
-            <span className="flex flex-row text-left md:text-6xl text-5xl space-x-5">
-              <span className="font-semibold text-black">More</span>
-              <span className="text-sky-600 font-bold">focus.</span>
+            <span className="flex flex-row items-center space-x-2">
+              <FaCheck className="text-teal-500" />
+              <span className="text-left text-lg text-gray-600">
+                {"Clearer communication."}{" "}
+              </span>
             </span>
 
-            <span className="my-10 text-md text-xl max-w-xl text-gray-600 w-max">
-              Voice-only collaboration tool for scrum/agile teams.
-              <br></br>
-              Skip slack and email, just talk to your team.
-            </span>
+            <Divider />
 
-            <span className="flex flex-row space-x-2">
-              <button
-                onClick={() =>
-                  window.open(
-                    "mailto:usenirvana@gmail.com?subject=Interested in Nirvana for Startups",
-                    "_blank"
-                  )
-                }
-                className="rounded text-teal-600 p-2 shadow-l flex flex-row items-center space-x-2"
-              >
-                Email Us
-              </button>
-              {getStartedButton}
+            <span className="text-left text-md text-gray-600">
+              {
+                "An experience as if your team was across the table. And it's still"
+              }
+              <span className="text-teal-600"> asynchronous.</span>
+            </span>
+            <br></br>
+            <span className="text-left text-md text-gray-600">
+              No more days of{" "}
+              <span className="text-orange-500">back and forth texting</span>{" "}
+              for complex, technical issues.
             </span>
           </span>
 
           <span className="flex flex-row justify-end relative items-baseline flex-1 md:flex hidden">
             <VoiceLineConceptDemo />
           </span>
-        </div>
+        </span>
+
+        <span className="flex flex-row py-20">
+          <span className="text-left flex flex-col grow max-w-md rounded-lg bg-gray-200 bg-opacity-25 backdrop-blur-xl p-10">
+            <span className="bg-clip-text text-transparent bg-gradient-to-r from-pink-500 to-violet-500">
+              TEAM
+            </span>
+
+            <span className="text-3xl text-gray-700 font-bold">
+              Bond & Collaborate Better.
+            </span>
+
+            <span className="text-lg text-gray-700"></span>
+
+            <Divider />
+
+            {/* checkmarks of value add */}
+            <span className="flex flex-row items-center space-x-2">
+              <FaCheck className="text-teal-500" />
+              <span className="text-lg text-gray-600">{"Asynchronous."}</span>
+              <Tooltip
+                title={
+                  "If you send a voice clip to someone, and they are online, they hear you instantly without changing tabs/windows."
+                }
+              >
+                <FaInfoCircle className="text-lg text-teal-500 animate-bounce" />
+              </Tooltip>
+            </span>
+
+            <span className="flex flex-row items-center space-x-2">
+              <FaCheck className="text-teal-500" />
+              <span className="text-lg text-gray-600">
+                {"NO low-quality chatter."}
+              </span>
+            </span>
+
+            <span className="flex flex-row items-center space-x-2">
+              <FaCheck className="text-teal-500" />
+              <span className="text-lg text-gray-600">
+                {"Clearer communication."}{" "}
+              </span>
+            </span>
+
+            <Divider />
+
+            <span className="text-md text-gray-600">
+              {
+                "An experience as if your team was across the table. And it's still"
+              }
+              <span className="text-teal-600"> asynchronous.</span>
+            </span>
+            <br></br>
+            <span className="text-md text-gray-600">
+              No more days of{" "}
+              <span className="text-orange-500">back and forth texting</span>{" "}
+              for complex, technical issues.
+            </span>
+          </span>
+        </span>
 
         {/* main mission */}
         <div className="mx-auto flex flex-col items-start max-w-screen-sm rounded-lg bg-gray-200 bg-opacity-25 backdrop-blur-xl md:mt-[40rem] mt-[5rem] p-10">
diff --git a/public/screenshots/exampleTeamDashboard.png b/public/screenshots/exampleTeamDashboard.png
new file mode 100644
index 0000000..2883b90
Binary files /dev/null and b/public/screenshots/exampleTeamDashboard.png differ
diff --git a/public/screenshots/frame_safari_dark.png b/public/screenshots/frame_safari_dark.png
new file mode 100644
index 0000000..c80bf13
Binary files /dev/null and b/public/screenshots/frame_safari_dark.png differ
diff --git a/public/screenshots/fullscreenDashExample.png b/public/screenshots/fullscreenDashExample.png
new file mode 100644
index 0000000..64c3125
Binary files /dev/null and b/public/screenshots/fullscreenDashExample.png differ