Card 9 & 10 (Grid + nth-child + Position)

Author: ManzDev

src/index.pcss

@@ -92,3 +92,31 @@
     bottom: 20%;
   }
 }
+
+[data-card="9"],
+[data-card="10"] {
+  display: grid;
+  grid-template-rows: repeat(4, 25%);
+  grid-template-columns: 50% 50%;
+  justify-items: center;
+  align-items: center;
+  position: relative;
+
+  & .item:nth-child(1) {
+    position: absolute;
+  }
+}
+
+[data-card="10"] {
+  position: relative;
+
+  & .item:nth-child(1) {
+    position: absolute;
+    top: 15%;
+  }
+
+  & .item:nth-child(10) {
+    position: absolute;
+    bottom: 15%;
+  }
+}