@@ Line 1: / Line 1: @@
 Welcome to David Li's wiki.
+{{#css:
+  .main-card-container {
+    height: fit-content;
+    flex-grow:1;
+    display:flex;
+    flex-wrap: wrap;
+    padding: 1rem;
+    justify-content: space-evenly;
+    align-items: stretch;
+    align-content: stretch;
+  }
+  .main-flex-card {
+    border: 0.4rem solid #555555;
+    border-radius: 1rem;
+    padding: 0.3rem;
+    margin: 0.2rem;
+    flex-grow: 1;
+    flex-basis: 0;
+  }
+  .main-card-container h6 {
+    text-align:center
+  }
+  .main-flex-card ul {
+     width: fit-content;
+     max-width: 80%;
+     margin: auto;
+  }
+  .main-flex-card ul li {
+     width: fit-content;
+     max-width: 100%;
+  }
+}}
 <div style="display:flex;flex-direction:row;">
    <div style="flex-grow:0;">__TOC__</div>
-   <div style="margin:1rem;flex-grow:1;">
+   <div class="main-card-container">
-     <table class="wikitable" style="width:100%">
+     <div class="main-flex-card">
-       <tr>
+       <h6>Programming</h6>
-        <th style="width:25%;">Programming</th>
+      <ul>
-        <th style="width:25%;">Software and Frameworks</th>
+         <li>[[C++]]</li>
-         <th style="width:25%;">Math</th>
+        <li>[[JavaScript]]</li>
-      </tr>
+        <li>[[NodeJS]]</li>
-      <tr>
+        <li>[[Python]]</li>
-<td>
+        <li>[[Julia]]</li>
-* [[C++]]
+      </ul>
-* [[JavaScript]]
+    </div>
-* [[NodeJS]]
+    <div class="main-flex-card">
-* [[Python]]
+      <h6>Software and Libraries</h6>
-* [[Julia]]
+      <ul>
-</td>
+        <li>[[Git]]</li>
-<td>
+        <li>[[TensorFlow]]</li>
-* [[Git]]
+        <li>[[PyTorch]]</li>
-* [[TensorFlow]]
+      </ul>
-* [[PyTorch]]
+    </div>
-</td>
+    <div class="main-flex-card">
-<td>
+      <h6>Math</h6>
-* [[Parallel Algorithms]]
+      <ul>
-* [[Advanced Computer Graphics]]
+        <li>[[Parallel Algorithms]]</li>
-</td>
+        <li>[[Advanced Computer Graphics]]</li>
-       </tr>
+       </ul>
-     </table>
+     </div>
+  </div>
    </div>
 </div>