Add animated menu cards

html/styles/introduction.css

@@ -21,6 +21,47 @@ hr {
     animation: blink 800ms infinite;
 }
 
+.card-list
+{
+    display: flex;
+    flex-direction: row;
+    justify-content: start;
+    gap: 15px;
+    min-width: 375px;
+    height: 75%;
+    overflow: scroll;
+    padding: 0 20px 0 20px;
+}
+
+.card {
+    display: flex;
+    flex-direction: column;
+    justify-content: start;
+    align-items: center;
+
+    height: 350px;
+    width: 275px;
+
+    background: white;
+    border-radius: 16px;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
+
+    padding: 15px;
+
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+    will-change: transform;
+}
+
+.card:hover {
+    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
+}
+
+.card p
+{
+    opacity: 0.65;
+}
+
+
 @keyframes blink {
     from { opacity: 0; }
     to { opacity: 1; }