fix responsive style

documentation/docs/components/landing-page.tsx

@@ -54,7 +54,7 @@ export const LandingPage = () => {
   };
 
   return (
-    <Box maxWidth={1200} margin={"0 auto"}>
+    <Box margin={"0 auto"}>
       <Typography variant="h2" mb={6}>
         Nym Docs
       </Typography>
@@ -78,7 +78,7 @@ export const LandingPage = () => {
             sx={{
               borderBottom: {
                 xs: index < 3 ? "1px solid #262626" : "none",
-                md: index === 0 || index === 1 ? "1px solid #262626" : "none",
+                lg: index === 0 || index === 1 ? "1px solid #262626" : "none",
               },
               borderRight: {
                 md: index === 0 || index === 2 ? "1px solid #262626" : "none",
@@ -90,8 +90,8 @@ export const LandingPage = () => {
                 <Image
                   src={square.icon}
                   alt={square.text}
-                  width={180}
-                  height={134}
+                  width={isDesktop ? 180 : isTablet ? 140 : 180}
+                  height={isDesktop ? 134 : isTablet ? 90 : 134}
                 />
                 <Box
                   display={"flex"}

documentation/docs/pages/styles.css

@@ -22,7 +22,7 @@ div.nextra-code-block > div {
 }
 
 .nextra-toc {
-  width: 370px !important;
+  width: 300px !important;
   padding-right: 0px;
   padding-left: 0px;
   text-align: right;