diff --git a/src/Components/Quote/QuoteCard.js b/src/Components/Quote/QuoteCard.js
index 25d7b29..bfa62bd 100644
--- a/src/Components/Quote/QuoteCard.js
+++ b/src/Components/Quote/QuoteCard.js
@@ -2,10 +2,16 @@ import React from 'react';
 import './quote.css'
 
 export default function 
-QuoteCard(props) {
-    const { name, key } = props;
+QuoteCard({ quote, game, name, key}) {
+   
 
-    return ( <div><h2>{name}</h2>
-    <h4>{key}</h4></div>
+    return ( <div class="quote-wrapper">
+        <quote>{quote}</quote>
+        <h2>{name}</h2>
+        
+        <h3>{game}</h3>
+        
+        <div></div>
+    </div>
      );
 }
diff --git a/src/Components/Quote/quote.css b/src/Components/Quote/quote.css
index a38aeb9..c9e591e 100644
--- a/src/Components/Quote/quote.css
+++ b/src/Components/Quote/quote.css
@@ -1,5 +1,17 @@
-.quotes {
+@font-face {
+    font-family: KHGummi;
+    src: url(../Assets/Fonts/KHGummi.otf);
+}
 
-    font-family: "../Assets/Fonts/KHGummi";
+quote {
+    font-family: KHGummi;
+}
+
+.quote-wrapper {
+    border: solid black 4px;
+    padding:  50;
+    background: none;
+    cursor: pointer;
+    margin: 10px 0;
+}
 
-}
\ No newline at end of file