diff --git a/src/components/landing/Screenshots.js b/src/components/landing/Screenshots.js
index 8866b430..f4a5ed4d 100644
--- a/src/components/landing/Screenshots.js
+++ b/src/components/landing/Screenshots.js
@@ -8,60 +8,50 @@ const Screenshots = () => {
     query {
       screen1: file(relativePath: { eq: "screenshots/screen-1.png" }) {
         childImageSharp {
-          fluid(maxWidth: 800) {
-            ...GatsbyImageSharpFluid
+          original {
+            src
           }
-          fixed(width: 300) {
+          fixed(width: 320) {
             ...GatsbyImageSharpFixed
           }
         }
       }
       screen2: file(relativePath: { eq: "screenshots/screen-2.png" }) {
         childImageSharp {
-          fluid(maxWidth: 800) {
-            ...GatsbyImageSharpFluid
+          original {
+            src
           }
-          fixed(width: 300) {
+          fixed(width: 320) {
             ...GatsbyImageSharpFixed
           }
         }
       }
       screen3: file(relativePath: { eq: "screenshots/screen-3.png" }) {
         childImageSharp {
-          fluid(maxWidth: 800) {
-            ...GatsbyImageSharpFluid
+          original {
+            src
           }
-          fixed(width: 300) {
+          fixed(width: 320) {
             ...GatsbyImageSharpFixed
           }
         }
       }
       screen4: file(relativePath: { eq: "screenshots/screen-4.png" }) {
         childImageSharp {
-          fluid(maxWidth: 800) {
-            ...GatsbyImageSharpFluid
+          original {
+            src
           }
-          fixed(width: 300) {
+          fixed(width: 320) {
             ...GatsbyImageSharpFixed
           }
         }
       }
       screen5: file(relativePath: { eq: "screenshots/screen-5.png" }) {
         childImageSharp {
-          fluid(maxWidth: 800) {
-            ...GatsbyImageSharpFluid
+          original {
+            src
           }
-          fixed(width: 300) {
-            ...GatsbyImageSharpFixed
-          }
-        }
-      }
-      screen6: file(relativePath: { eq: "screenshots/screen-6.png" }) {
-        childImageSharp {
-          fluid(maxWidth: 800) {
-            ...GatsbyImageSharpFluid
-          }
-          fixed(width: 300) {
+          fixed(width: 320) {
             ...GatsbyImageSharpFixed
           }
         }
@@ -79,8 +69,8 @@ const Screenshots = () => {
             target="_blank"
             rel="noreferrer"
             className={styles.screenshot}
-            key={screenshots[x].childImageSharp.fluid.src}
-            href={screenshots[x].childImageSharp.fluid.src}
+            key={screenshots[x].childImageSharp.original.src}
+            href={screenshots[x].childImageSharp.original.src}
           >
             <span className="sr-only">Reactive Resume Screenshot</span>
             <GatsbyImage
diff --git a/src/pages/index.js b/src/pages/index.js
index 9d874050..36eee1dc 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -2,9 +2,13 @@ import { Link } from '@reach/router';
 import React, { memo } from 'react';
 import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
+import { FaUserSecret } from 'react-icons/fa';
+import { GiWalkingBoot } from 'react-icons/gi';
+import { IoIosRocket } from 'react-icons/io';
+import { RiRefreshLine } from 'react-icons/ri';
 import Hero from '../components/landing/Hero';
-import Wrapper from '../components/shared/Wrapper';
 import Screenshots from '../components/landing/Screenshots';
+import Wrapper from '../components/shared/Wrapper';
 
 const Home = () => {
   const { t } = useTranslation();
@@ -30,8 +34,11 @@ const Home = () => {
 
         <Screenshots />
 
-        <div className="pt-8">
-          <Feature title="Create a resume that’s worthy of who you are.">
+        <div className="pt-8 grid lg:grid-cols-2 lg:col-gap-10">
+          <Feature
+            icon={IoIosRocket}
+            title="Create a resume that’s worthy of who you are."
+          >
             Keep up with the latest trends in resume design without having to
             start from scratch. With new templates being designed every week and
             having made it that easy to design your own templates and submit
@@ -39,7 +46,10 @@ const Home = () => {
             friend’s resume again.
           </Feature>
 
-          <Feature title="Updating your resume shouldn’t be a chore.">
+          <Feature
+            icon={RiRefreshLine}
+            title="Updating your resume shouldn’t be a chore."
+          >
             The biggest problem I’ve faced was when I had to update my resume
             when I learned a new skill or found a new job. The ever-shifting
             layouts and inconsistency with design over a number of years made it
@@ -47,7 +57,10 @@ const Home = () => {
             easy as few clicks.
           </Feature>
 
-          <Feature title="Kickstarting your career shouldn’t come at a cost.">
+          <Feature
+            icon={GiWalkingBoot}
+            title="Kickstarting your career shouldn’t come at a cost."
+          >
             There are brilliant alternatives to this app like Novoresume and
             Zety , but they come at a cost, mainly because of the time the
             developers and the marketing they had to incur to make the product.
@@ -56,7 +69,10 @@ const Home = () => {
             a resume to bootstrap their career.
           </Feature>
 
-          <Feature title="Your data is your data, none of my data.">
+          <Feature
+            icon={FaUserSecret}
+            title="Your data is your data, none of my data."
+          >
             You must be thinking, if you&apos;re not paying for the product,
             then you are the product. Or, at least your data is?{' '}
             <strong>Well, this is the exception</strong>. Your data is your own,
@@ -112,10 +128,13 @@ const Home = () => {
   );
 };
 
-const Feature = ({ title, children }) => {
+const Feature = ({ icon: Icon, title, children }) => {
   return (
     <div className="mt-16">
-      <div className="text-3xl">{title}</div>
+      <div className="flex items-center">
+        <Icon size="18px" className="text-primary-900 mr-4" />
+        <div className="text-3xl">{title}</div>
+      </div>
       <p className="mt-6 text-lg leading-loose">{children}</p>
     </div>
   );
diff --git a/static/images/screenshots/screen-1.png b/static/images/screenshots/screen-1.png
index 53a1696e..25754e55 100644
Binary files a/static/images/screenshots/screen-1.png and b/static/images/screenshots/screen-1.png differ
diff --git a/static/images/screenshots/screen-2.png b/static/images/screenshots/screen-2.png
index 20bf967b..892d7e74 100644
Binary files a/static/images/screenshots/screen-2.png and b/static/images/screenshots/screen-2.png differ
diff --git a/static/images/screenshots/screen-3.png b/static/images/screenshots/screen-3.png
index 1842c4f1..0d91df38 100644
Binary files a/static/images/screenshots/screen-3.png and b/static/images/screenshots/screen-3.png differ
diff --git a/static/images/screenshots/screen-4.png b/static/images/screenshots/screen-4.png
index 2fdbc612..f41eb693 100644
Binary files a/static/images/screenshots/screen-4.png and b/static/images/screenshots/screen-4.png differ
diff --git a/static/images/screenshots/screen-5.png b/static/images/screenshots/screen-5.png
index 5f4f685e..8cb01a8f 100644
Binary files a/static/images/screenshots/screen-5.png and b/static/images/screenshots/screen-5.png differ
diff --git a/static/images/screenshots/screen-6.png b/static/images/screenshots/screen-6.png
deleted file mode 100644
index 101c7dc9..00000000
Binary files a/static/images/screenshots/screen-6.png and /dev/null differ