diff --git a/styles/card.css b/styles/card.css
index 000885e..3e0d00d 100644
--- a/styles/card.css
+++ b/styles/card.css
@@ -15,4 +15,10 @@
   margin: 1rem;
   /* height: calc(10rem - 6em);
   width: calc(20rem - 6em); */
+}
+
+#main {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
 }
\ No newline at end of file
diff --git a/views/cards.html b/views/cards.html
index b4f2f82..351e787 100644
--- a/views/cards.html
+++ b/views/cards.html
@@ -51,91 +51,93 @@
     </defs>
   </svg>
 
-  <div class="card">
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#squiggle" fill="#008002" mask="url(#mask-stripe)"></use>
-      <use href="#squiggle" stroke="#008002" fill="none" stroke-width="18"></use>
-    </svg>
-
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#squiggle" fill="#008002" mask="url(#mask-stripe)"></use>
-      <use href="#squiggle" stroke="#008002" fill="none" stroke-width="18"></use>
-    </svg>
-
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#squiggle" fill="#008002" mask="url(#mask-stripe)"></use>
-      <use href="#squiggle" stroke="#008002" fill="none" stroke-width="18"></use>
-    </svg>
-  </div>
-
-  <div class="card">
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#triangle" fill="#0000FF" mask="url(#mask-stripe)"></use>
-      <use href="#triangle" stroke="#0000FF" fill="none" stroke-width="18"></use>
-    </svg>
-
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#triangle" fill="#0000FF" mask="url(#mask-stripe)"></use>
-      <use href="#triangle" stroke="#0000FF" fill="none" stroke-width="18"></use>
-    </svg>
-
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#triangle" fill="#0000FF" mask="url(#mask-stripe)"></use>
-      <use href="#triangle" stroke="#0000FF" fill="none" stroke-width="18"></use>
-    </svg>
-  </div>
-
-  <div class="card">
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#star" fill="#FFA500" mask="url(#mask-stripe)"></use>
-      <use href="#star" stroke="#FFA500" fill="none" stroke-width="18"></use>
-    </svg>
-
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#star" fill="#FFA500" mask="url(#mask-stripe)"></use>
-      <use href="#star" stroke="#FFA500" fill="none" stroke-width="18"></use>
-    </svg>
-
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#star" fill="#FFA500" mask="url(#mask-stripe)"></use>
-      <use href="#star" stroke="#FFA500" fill="none" stroke-width="18"></use>
-    </svg>
-  </div>
-
-  <div class="card">
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#star" fill="#FFA500" mask="url(#mask-stripe)"></use>
-      <use href="#star" stroke="#FFA500" fill="none" stroke-width="18"></use>
-    </svg>
-
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#diamond" fill="#ff0101" mask="url(#mask-stripe)"></use>
-      <use href="#diamond" stroke="#ff0101" fill="none" stroke-width="18"></use>
-    </svg>
-
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#oval" fill="#800080" mask="url(#mask-stripe)"></use>
-      <use href="#oval" stroke="#800080" fill="none" stroke-width="18"></use>
-    </svg>
-  </div>
-
-  <div class="card">
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#diamond" fill="#ff0101" mask="url(#mask-stripe)"></use>
-      <use href="#diamond" stroke="#ff0101" fill="none" stroke-width="18"></use>
-    </svg>
-
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#diamond" fill="#ff0101" mask="url(#mask-stripe)"></use>
-      <use href="#diamond" stroke="#ff0101" fill="none" stroke-width="18"></use>
-    </svg>
-  </div>
-
-  <div class="card">
-    <svg class="item" height="160" width="80" viewBox="0 0 200 400">
-      <use href="#oval" fill="#800080" mask="url(#mask-stripe)"></use>
-      <use href="#oval" stroke="#800080" fill="none" stroke-width="18"></use>
-    </svg>
+  <div id="main">
+    <div class="card">
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#squiggle" fill="#008002" mask="url(#mask-stripe)"></use>
+        <use href="#squiggle" stroke="#008002" fill="none" stroke-width="18"></use>
+      </svg>
+
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#squiggle" fill="#008002" mask="url(#mask-stripe)"></use>
+        <use href="#squiggle" stroke="#008002" fill="none" stroke-width="18"></use>
+      </svg>
+
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#squiggle" fill="#008002" mask="url(#mask-stripe)"></use>
+        <use href="#squiggle" stroke="#008002" fill="none" stroke-width="18"></use>
+      </svg>
+    </div>
+
+    <div class="card">
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#triangle" fill="#0000FF" mask="url(#mask-stripe)"></use>
+        <use href="#triangle" stroke="#0000FF" fill="none" stroke-width="18"></use>
+      </svg>
+
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#triangle" fill="#0000FF" mask="url(#mask-stripe)"></use>
+        <use href="#triangle" stroke="#0000FF" fill="none" stroke-width="18"></use>
+      </svg>
+
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#triangle" fill="#0000FF" mask="url(#mask-stripe)"></use>
+        <use href="#triangle" stroke="#0000FF" fill="none" stroke-width="18"></use>
+      </svg>
+    </div>
+
+    <div class="card">
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#star" fill="#FFA500" mask="url(#mask-stripe)"></use>
+        <use href="#star" stroke="#FFA500" fill="none" stroke-width="18"></use>
+      </svg>
+
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#star" fill="#FFA500" mask="url(#mask-stripe)"></use>
+        <use href="#star" stroke="#FFA500" fill="none" stroke-width="18"></use>
+      </svg>
+
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#star" fill="#FFA500" mask="url(#mask-stripe)"></use>
+        <use href="#star" stroke="#FFA500" fill="none" stroke-width="18"></use>
+      </svg>
+    </div>
+
+    <div class="card">
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#star" fill="#FFA500" mask="url(#mask-stripe)"></use>
+        <use href="#star" stroke="#FFA500" fill="none" stroke-width="18"></use>
+      </svg>
+
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#diamond" fill="#ff0000" mask="url(#mask-stripe)"></use>
+        <use href="#diamond" stroke="#ff0000" fill="none" stroke-width="18"></use>
+      </svg>
+
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#oval" fill="#800080" mask="url(#mask-stripe)"></use>
+        <use href="#oval" stroke="#800080" fill="none" stroke-width="18"></use>
+      </svg>
+    </div>
+
+    <div class="card">
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#diamond" fill="#ff0101" mask="url(#mask-stripe)"></use>
+        <use href="#diamond" stroke="#ff0101" fill="none" stroke-width="18"></use>
+      </svg>
+
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#diamond" fill="#ff0101" mask="url(#mask-stripe)"></use>
+        <use href="#diamond" stroke="#ff0101" fill="none" stroke-width="18"></use>
+      </svg>
+    </div>
+
+    <div class="card">
+      <svg class="item" height="160" width="80" viewBox="0 0 200 400">
+        <use href="#oval" fill="#800080" mask="url(#mask-stripe)"></use>
+        <use href="#oval" stroke="#800080" fill="none" stroke-width="18"></use>
+      </svg>
+    </div>
   </div>
 
 </body>