diff --git a/components/Navigation.tsx b/components/Navigation.tsx
index b959c9c..2de9856 100644
--- a/components/Navigation.tsx
+++ b/components/Navigation.tsx
@@ -255,66 +255,67 @@ const Navigation = () => {
                         </Flex>
                       </DialogDescription>
                     </Flex>
-
-                    <Flex
-                      css={{
-                        display: "grid",
-                        gridTemplateColumns: "1fr",
-                        gridTemplateRows: "max-content",
-                        flex: 1,
-                        p: "$7",
-                        gap: "$3",
-                        alignItems: "flex-start",
-                        flexWrap: "wrap",
-                        backgroundColor: "$mauve1",
-                        "@md": {
-                          gridTemplateColumns: "1fr 1fr 1fr",
+                    <div>
+                      <Flex
+                        css={{
+                          display: "grid",
+                          gridTemplateColumns: "1fr",
                           gridTemplateRows: "max-content",
-                        },
-                      }}
-                    >
-                      <PanelBox
-                        as="a"
-                        href={`/develop/${templateFileIds.starter}`}
+                          flex: 1,
+                          p: "$7",
+                          gap: "$3",
+                          alignItems: "normal",
+                          flexWrap: "wrap",
+                          backgroundColor: "$mauve1",
+                          "@md": {
+                            gridTemplateColumns: "1fr 1fr 1fr",
+                            gridTemplateRows: "max-content",
+                          },
+                        }}
                       >
-                        <Heading>Starter</Heading>
-                        <Text>
-                          Just a basic starter with essential imports
-                        </Text>
-                      </PanelBox>
-                      <PanelBox
-                        as="a"
-                        href={`/develop/${templateFileIds.firewall}`}
-                      >
-                        <Heading>Firewall</Heading>
-                        <Text>
-                          This Hook essentially checks a blacklist of accounts
-                        </Text>
-                      </PanelBox>
-                      <PanelBox
-                        as="a"
-                        href={`/develop/${templateFileIds.notary}`}
-                      >
-                        <Heading>Notary</Heading>
-                        <Text>
-                          Collecting signatures for multi-sign transactions
-                        </Text>
-                      </PanelBox>
-                      <PanelBox
-                        as="a"
-                        href={`/develop/${templateFileIds.carbon}`}
-                      >
-                        <Heading>Carbon</Heading>
-                        <Text>Send a percentage of sum to an address</Text>
-                      </PanelBox>
-                      <PanelBox
-                        as="a"
-                        href={`/develop/${templateFileIds.peggy}`}
-                      >
-                        <Heading>Peggy</Heading>
-                        <Text>An oracle based stable coin hook</Text>
-                      </PanelBox>
-                    </Flex>
+                        <PanelBox
+                          as="a"
+                          href={`/develop/${templateFileIds.starter}`}
+                        >
+                          <Heading>Starter</Heading>
+                          <Text>
+                            Just a basic starter with essential imports
+                          </Text>
+                        </PanelBox>
+                        <PanelBox
+                          as="a"
+                          href={`/develop/${templateFileIds.firewall}`}
+                        >
+                          <Heading>Firewall</Heading>
+                          <Text>
+                            This Hook essentially checks a blacklist of accounts
+                          </Text>
+                        </PanelBox>
+                        <PanelBox
+                          as="a"
+                          href={`/develop/${templateFileIds.notary}`}
+                        >
+                          <Heading>Notary</Heading>
+                          <Text>
+                            Collecting signatures for multi-sign transactions
+                          </Text>
+                        </PanelBox>
+                        <PanelBox
+                          as="a"
+                          href={`/develop/${templateFileIds.carbon}`}
+                        >
+                          <Heading>Carbon</Heading>
+                          <Text>Send a percentage of sum to an address</Text>
+                        </PanelBox>
+                        <PanelBox
+                          as="a"
+                          href={`/develop/${templateFileIds.peggy}`}
+                        >
+                          <Heading>Peggy</Heading>
+                          <Text>An oracle based stable coin hook</Text>
+                        </PanelBox>
+                      </Flex>
+                    </div>
                   </Flex>
                   <DialogClose asChild>
                     <Box