diff --git a/src/components/css/App.css b/src/components/css/App.css
index 91b8dcc..cffe44f 100644
--- a/src/components/css/App.css
+++ b/src/components/css/App.css
@@ -30,6 +30,15 @@ html, body {
     height:100%;
 }
 
+.btn {
+    border-style: solid;
+    border-color: #837483;
+    border-radius: 5px;
+    border-width: 1px;
+    background-color: #373747;
+    padding: 6px;
+}
+
 @media only screen and (max-width: 600px) {
     .App {
         flex-direction: column-reverse;
diff --git a/src/components/subcomponents/Topic.js b/src/components/subcomponents/Topic.js
index d53f3f6..1b2bcdd 100644
--- a/src/components/subcomponents/Topic.js
+++ b/src/components/subcomponents/Topic.js
@@ -23,6 +23,7 @@ const Card = (props) => {
                 <div className="children">
                     {props.children}
                 </div>
+                <Link className="btn" to={props.link}>Learn More</Link>
             </div>
         </div>
     );