Add css

src/app.css

@@ -0,0 +1,55 @@
+body {
+    margin: 0;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+      'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+      sans-serif;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+  
+  code {
+    font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+      monospace;
+  }
+  .card {
+    /* Add shadows to create the "card" effect */
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.137);
+    border-radius: 3%;
+    transition: 0.3s;
+    position: relative;
+    width: 300px;
+    height: 450px;
+    padding: 10px;
+    background-color: #a05236a6;
+    color: #FFFFFF;
+  }
+  
+  /* On mouse-over, add a deeper shadow */
+  .card:hover {
+    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.795);
+  }
+  
+  /* Add some padding inside the card container */
+  .container {
+    padding: 6px 16px;
+  }
+  
+  ul {
+    list-style-type: none;
+    margin: 4;
+    padding: 20px;
+    overflow: hidden;
+      display: table;
+      width: 100%;
+      list-style: none;
+  }
+  
+  li {
+    float: left;
+    display: table-cell;
+    text-align: center;
+    margin: 5px;
+  }
+  ul li div {
+    display: block;
+  }

src/app.js

@@ -1,3 +1,5 @@
+import './app.css';
+
 function Card(data) {
     return (
       <div class="card">