diff --git a/landing/competitor-feature-card.css b/landing/competitor-feature-card.css
--- a/landing/competitor-feature-card.css
+++ b/landing/competitor-feature-card.css
@@ -10,46 +10,6 @@
   background-color: var(--comparison-cards-hovered);
 }
 
-.headingContainer {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 16px;
-}
-
-.headingText {
-  color: var(--white-100);
-}
-
-.comingSoonBadge {
-  background-color: var(--badge);
-  padding: 5px 10px;
-  border-radius: 16px;
-}
-
-.comingSoonText {
-  color: var(--white-100);
-  margin-left: 8px;
-}
-
-.comingSoonIcon {
-  color: var(--coming-soon-icon);
-}
-
-hr {
-  margin: 24px 0;
-  border-radius: 8px;
-  height: 1.5px;
-  background-color: var(--black-80);
-  border: none;
-}
-
-.descriptionText {
-  color: var(--white-80);
-  height: 80px;
-  margin-top: 8px;
-}
-
 .readMoreText {
   color: var(--violet-dark-100);
   margin-top: 16px;
diff --git a/landing/competitor-feature-card.react.js b/landing/competitor-feature-card.react.js
--- a/landing/competitor-feature-card.react.js
+++ b/landing/competitor-feature-card.react.js
@@ -1,14 +1,11 @@
 // @flow
 
-import { faWrench } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import classNames from 'classnames';
 import * as React from 'react';
 
-import CommLogo from './assets/comm-logo.react.js';
 import type { Competitors } from './competitor-data.js';
 import css from './competitor-feature-card.css';
-import CompetitorLogo from './competitor-logo.react.js';
+import CompetitorFeature from './competitor-feature.react.js';
 import typography from './typography.css';
 
 type Props = {
@@ -30,45 +27,20 @@
     onClick,
   } = props;
 
-  const headingClassName = classNames([typography.heading3, css.headingText]);
-  const comingSoonClassName = classNames([
-    typography.paragraph3,
-    css.comingSoonText,
-  ]);
-  const descriptionClassName = classNames([
-    typography.paragraph1,
-    css.descriptionText,
-  ]);
   const readMoreClassName = classNames([
     typography.paragraph2,
     css.readMoreText,
   ]);
 
-  let comingSoonBadge;
-  if (comingSoon) {
-    comingSoonBadge = (
-      <div className={css.comingSoonBadge}>
-        <FontAwesomeIcon
-          size="sm"
-          className={css.comingSoonIcon}
-          icon={faWrench}
-        />
-        <span className={comingSoonClassName}>Coming Soon</span>
-      </div>
-    );
-  }
-
   return (
     <a className={css.container} onClick={onClick}>
-      <div className={css.headingContainer}>
-        <p className={headingClassName}>{title}</p>
-        {comingSoonBadge}
-      </div>
-      <CompetitorLogo name={competitorID} size={30} />
-      <p className={descriptionClassName}>{competitorDescription}</p>
-      <hr />
-      <CommLogo size={30} />
-      <p className={descriptionClassName}>{commDescription}</p>
+      <CompetitorFeature
+        competitorID={competitorID}
+        title={title}
+        comingSoon={comingSoon}
+        competitorDescription={competitorDescription}
+        commDescription={commDescription}
+      />
       <p className={readMoreClassName}>Read more</p>
     </a>
   );
diff --git a/landing/competitor-feature-card.css b/landing/competitor-feature.css
copy from landing/competitor-feature-card.css
copy to landing/competitor-feature.css
--- a/landing/competitor-feature-card.css
+++ b/landing/competitor-feature.css
@@ -1,13 +1,7 @@
 .container {
-  max-width: 432px;
-  background-color: var(--comparison-cards);
-  padding: 32px;
-  border-radius: 16px;
-}
-
-.container:hover {
-  cursor: pointer;
-  background-color: var(--comparison-cards-hovered);
+  display: flex;
+  flex-direction: column;
+  flex: 1;
 }
 
 .headingContainer {
@@ -49,8 +43,3 @@
   height: 80px;
   margin-top: 8px;
 }
-
-.readMoreText {
-  color: var(--violet-dark-100);
-  margin-top: 16px;
-}
diff --git a/landing/competitor-feature-card.react.js b/landing/competitor-feature.react.js
copy from landing/competitor-feature-card.react.js
copy to landing/competitor-feature.react.js
--- a/landing/competitor-feature-card.react.js
+++ b/landing/competitor-feature.react.js
@@ -7,7 +7,7 @@
 
 import CommLogo from './assets/comm-logo.react.js';
 import type { Competitors } from './competitor-data.js';
-import css from './competitor-feature-card.css';
+import css from './competitor-feature.css';
 import CompetitorLogo from './competitor-logo.react.js';
 import typography from './typography.css';
 
@@ -17,17 +17,15 @@
   +comingSoon: boolean,
   +competitorDescription: string,
   +commDescription: string,
-  +onClick: () => mixed,
 };
 
-function CompetitorFeatureCard(props: Props): React.Node {
+function CompetitorFeature(props: Props): React.Node {
   const {
     competitorID,
     title,
     comingSoon,
     competitorDescription,
     commDescription,
-    onClick,
   } = props;
 
   const headingClassName = classNames([typography.heading3, css.headingText]);
@@ -39,10 +37,6 @@
     typography.paragraph1,
     css.descriptionText,
   ]);
-  const readMoreClassName = classNames([
-    typography.paragraph2,
-    css.readMoreText,
-  ]);
 
   let comingSoonBadge;
   if (comingSoon) {
@@ -59,7 +53,7 @@
   }
 
   return (
-    <a className={css.container} onClick={onClick}>
+    <div className={css.container}>
       <div className={css.headingContainer}>
         <p className={headingClassName}>{title}</p>
         {comingSoonBadge}
@@ -69,9 +63,8 @@
       <hr />
       <CommLogo size={30} />
       <p className={descriptionClassName}>{commDescription}</p>
-      <p className={readMoreClassName}>Read more</p>
-    </a>
+    </div>
   );
 }
 
-export default CompetitorFeatureCard;
+export default CompetitorFeature;