diff --git a/docusaurus.config.js b/docusaurus.config.js
index 4fa8aeb..7598211 100644
--- a/docusaurus.config.js
+++ b/docusaurus.config.js
@@ -37,16 +37,15 @@ const config = {
           sidebarPath: require.resolve('./sidebars.js'),
           // Please change this to your repo.
           // Remove this to remove the "edit this page" links.
-          editUrl:
-            'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
-        },
-        blog: {
-          showReadingTime: true,
-          // Please change this to your repo.
-          // Remove this to remove the "edit this page" links.
-          editUrl:
-            'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
+          // editUrl: '',
         },
+        // blog: {
+        //   showReadingTime: true,
+        //   // Please change this to your repo.
+        //   // Remove this to remove the "edit this page" links.
+        //   editUrl:
+        //     'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
+        // },
         theme: {
           customCss: require.resolve('./src/css/custom.scss'),
         },
diff --git a/src/components/mdx/ExternalReferenceCard/ExternalReferenceCard.tsx b/src/components/mdx/ExternalReferenceCard/ExternalReferenceCard.tsx
index f32b570..526b4a0 100644
--- a/src/components/mdx/ExternalReferenceCard/ExternalReferenceCard.tsx
+++ b/src/components/mdx/ExternalReferenceCard/ExternalReferenceCard.tsx
@@ -34,8 +34,8 @@ export const ExternalReferenceCard = (props: TProps): JSX.Element => {
     <div className={clsx('alert', styles.exref)}>
       <div className={styles.exrefContainer}>
         <div>{icon}</div>
-        <div>{children}</div>
-        <div>
+        <div className={styles.exrefText}>{children}</div>
+        <div className={styles.exrefButton}>
           <LinkButtonWithIcon
             icon={<IconArrowRightCircle />}
             linkProps={{ href: linkUrl, target: '_black' }}
diff --git a/src/components/mdx/ExternalReferenceCard/style.module.scss b/src/components/mdx/ExternalReferenceCard/style.module.scss
index 0d6aa79..4ad70bb 100644
--- a/src/components/mdx/ExternalReferenceCard/style.module.scss
+++ b/src/components/mdx/ExternalReferenceCard/style.module.scss
@@ -16,3 +16,28 @@
     }
   }
 }
+
+@media (max-width: 576px) {
+  .exrefContainer {
+    flex-direction: column;
+    align-items: flex-start !important;
+    > *:first-child {
+      width: 30px;
+    }
+    > *:first-child svg {
+      width: 100%;
+      height: 100%;
+      opacity: 0.5 !important;
+    }
+
+    .exrefText {
+      font-size: var(--ifm-h3-font-size);
+      padding-right: 40px;
+      margin-bottom: calc(2 * var(--ifm-paragraph-margin-bottom));
+    }
+
+    .exrefButton {
+      width: 100%;
+    }
+  }
+}
diff --git a/src/components/mdx/FeatureList/style.module.scss b/src/components/mdx/FeatureList/style.module.scss
index 1e3dad3..91ba786 100644
--- a/src/components/mdx/FeatureList/style.module.scss
+++ b/src/components/mdx/FeatureList/style.module.scss
@@ -3,8 +3,8 @@
     display: grid;
     grid-auto-rows: 200px;
     grid-template-columns: 1fr 1fr;
-    grid-column-gap: calc(0.7 * var(--ifm-global-spacing));
-    grid-row-gap: calc(0.6 * var(--ifm-global-spacing));
+    grid-column-gap: var(--ifm-spacing-horizontal);
+    grid-row-gap: var(--ifm-spacing-vertical);
 
     &.n_1 > *:nth-child(n + 1),
     &.n_3 > *:nth-child(n + 3) {
@@ -12,3 +12,19 @@
     }
   }
 }
+@media (max-width: 576px) {
+  .FeatureListContainer {
+    grid-template-columns: 1fr !important;
+    grid-auto-rows: calc(
+      90vw - calc(2 * var(--ifm-spacing-horizontal))
+    ) !important;
+
+    > * {
+      grid-column: 1/1 !important;
+    }
+
+    h4 {
+      max-width: 170px;
+    }
+  }
+}
diff --git a/src/components/mdx/Hero/Hero.tsx b/src/components/mdx/Hero/Hero.tsx
index 6268b34..bb8f0af 100644
--- a/src/components/mdx/Hero/Hero.tsx
+++ b/src/components/mdx/Hero/Hero.tsx
@@ -28,7 +28,7 @@ export const Hero = (props: TProps): JSX.Element => {
         <div>
           <div>
             <h1 className={clsx('hero__title', styles.heroTitle)}>{title}</h1>
-            <p className={clsx('hero_subtitle', 'sub4', styles.heroSubtitle)}>
+            <p className={clsx('hero_subtitle', styles.heroSubtitle)}>
               {subtitle}
             </p>
           </div>
diff --git a/src/components/mdx/Hero/style.module.scss b/src/components/mdx/Hero/style.module.scss
index b23adc3..f747b03 100644
--- a/src/components/mdx/Hero/style.module.scss
+++ b/src/components/mdx/Hero/style.module.scss
@@ -1,7 +1,9 @@
 .Hero {
   .HeroContainer {
     position: relative;
-    padding: var(--ifm-spacing-vertical) var(--ifm-spacing-horizontal);
+    padding: var(--ifm-alert-padding-horizontal)
+      var(--ifm-alert-padding-horizontal);
+
     border-radius: var(--ifm-global-radius);
 
     height: 320px;
@@ -25,8 +27,26 @@
     .heroTitle {
       margin: 0;
     }
-
     .heroSubtitle {
+      font-size: var(--ifm-h4-font-size);
+      color: var(--ifm-color-gray-400);
     }
   }
 }
+
+@media (max-width: 996px) {
+  .HeroContainer {
+    height: 420px !important;
+  }
+
+  button {
+    width: 100%;
+  }
+
+  .heroSubtitle {
+    font-size: var(--ifm-h3-font-size) !important;
+    line-height: 1.6rem;
+    margin-bottom: calc(1.5 * var(--ifm-paragraph-margin-bottom));
+    padding-right: 40px;
+  }
+}
diff --git a/src/components/mdx/TeamList/style.module.scss b/src/components/mdx/TeamList/style.module.scss
index fdfc09f..5f92c65 100644
--- a/src/components/mdx/TeamList/style.module.scss
+++ b/src/components/mdx/TeamList/style.module.scss
@@ -52,3 +52,33 @@
     }
   }
 }
+
+@media (max-width: 576px) {
+  .TeamListContainer {
+    grid-column-gap: calc(1 * var(--ifm-spacing-horizontal)) !important;
+    grid-row-gap: calc(1 * var(--ifm-spacing-vertical)) !important;
+  }
+
+  .memberCard {
+    grid-template-rows: 270px 110px !important;
+    grid-column-gap: calc(1 * var(--ifm-spacing-horizontal)) !important;
+    grid-row-gap: calc(1 * var(--ifm-spacing-vertical)) !important;
+  }
+
+  .memberCardCaption {
+    flex-direction: column !important;
+    gap: 10px !important;
+    .memberSocials {
+      height: 30px;
+      gap: 16px !important;
+      opacity: 0.5 !important;
+      a {
+        width: 25px;
+        svg {
+          width: 100%;
+          height: 100%;
+        }
+      }
+    }
+  }
+}
diff --git a/src/css/custom.scss b/src/css/custom.scss
index cc7fb8a..23aa753 100644
--- a/src/css/custom.scss
+++ b/src/css/custom.scss
@@ -37,6 +37,8 @@
   --ifm-color-gray-800: #1a1a1a;
   --ifm-color-gray-900: #151515;
   --ifm-color-gray-1000: var(--ifm-color-black);
+  --ifm-font-color-base-inverse: var(--ifm-color-black);
+
   /*Code block*/
   --docusaurus-highlighted-code-line-bg: var(--ifm-color-gray-100);
 
@@ -47,6 +49,8 @@
   --ifm-card-background-color: var(--ifm-color-gray-100) !important;
   --ifm-alert-foreground-color: var(--ifm-color-gray-700);
 
+  --ifm-button-background-color: var(--ifm-color-white);
+
   /*spacing and details*/
   --ifm-global-border-width: 1px;
   --ifm-global-radius: 0.6rem;
@@ -250,3 +254,34 @@ small {
 .menu_src-theme-Navbar-Content-styles-module svg {
   display: none;
 }
+
+.card {
+  padding: var(--ifm-alert-padding-vertical) var(--ifm-alert-padding-horizontal);
+}
+
+@media (max-width: 576px) {
+  :root {
+    --ifm-global-spacing: 0.5rem;
+    --ifm-spacing-vertical: var(--ifm-global-spacing);
+    --ifm-spacing-horizontal: var(--ifm-global-spacing);
+
+    --ifm-button-size-multiplier: 1.25;
+
+    --ifm-button-padding-horizontal: calc(
+      var(--ifm-button-size-multiplier) * var(--ifm-spacing-horizontal)
+    );
+    --ifm-button-padding-vertical: calc(
+      var(--ifm-button-size-multiplier) * var(--ifm-spacing-vertical)
+    );
+
+    --ifm-alert-padding-horizontal: calc(2 * var(--ifm-spacing-horizontal));
+    --ifm-alert-padding-vertical: calc(2 * var(--ifm-spacing-vertical));
+  }
+
+  .markdown > h2 {
+    --ifm-h2-font-size: 1.75rem;
+  }
+  .markdown h4 {
+    --ifm-h4-font-size: 1.25rem !important;
+  }
+}
diff --git a/src/theme/Footer/Layout/style.module.scss b/src/theme/Footer/Layout/style.module.scss
index f94311a..1016222 100644
--- a/src/theme/Footer/Layout/style.module.scss
+++ b/src/theme/Footer/Layout/style.module.scss
@@ -64,8 +64,18 @@
   }
 }
 
-@media (min-width: 997px) {
+@media (max-width: 576px) {
   .footerContentWrapper {
-    //max-width: 75% !important;
+    opacity: 0.5 !important;
+  }
+  .communityLinks {
+    gap: 20px !important;
+    a {
+      width: 30px;
+    }
+    svg {
+      width: 100% !important;
+      height: 100% !important;
+    }
   }
 }