diff --git a/src/assets/scss/base/flex.scss b/src/assets/scss/base/flex.scss
index c56990cd..9f0e2745 100644
--- a/src/assets/scss/base/flex.scss
+++ b/src/assets/scss/base/flex.scss
@@ -22,6 +22,15 @@
   }
 }
 
+.flex-col {
+  align-items: center;
+  flex-direction: column;
+
+  @media (min-width: $mobile-max) {
+    flex-direction: row;
+  }
+}
+
 .flex-wrap-sm {
   @media (max-width: $mobile-max) {
 
diff --git a/src/assets/scss/components/footer.scss b/src/assets/scss/components/footer.scss
index aa9fa928..7f079bed 100644
--- a/src/assets/scss/components/footer.scss
+++ b/src/assets/scss/components/footer.scss
@@ -23,6 +23,7 @@ footer {
     align-items: flex-start;
     display: flex;
     margin: $l;
+    min-height: 9remq;
 
     @media (max-width: $mobile-max) {
       display: inline;
@@ -42,6 +43,8 @@ footer {
       padding: 0;
 
       @media (max-width: $mobile-max) {
+        min-width: 9rem;
+
         a {
           margin: 0;
         }
@@ -49,6 +52,10 @@ footer {
     }
   }
 
+  .color-gray {
+    color: $light-gray;
+  }
+
   @media (max-width: $mobile-max) {
     margin-bottom: 80px;
   }
diff --git a/src/components/Footer.js b/src/components/Footer.js
index e05b2da8..704c3ad9 100644
--- a/src/components/Footer.js
+++ b/src/components/Footer.js
@@ -4,7 +4,7 @@ import links from '../utils/Links.store'
 const Footer = () => {
   return (
     <footer>
-      <div className='container flex flex-wrap'>
+      <div className='container flex flex-col flex-wrap'>
         {links.map((ele, i) => {
           return <FooterBlock {...ele} key={i} />
         })}
@@ -20,6 +20,7 @@ const FooterBlock = ({ img, title, links }) => {
       <div className='footer-block-list'>
         {links?.map((ele, index) => (
           <a
+            className='color-gray'
             key={index}
             href={ele.href}
             data-types-category={ele.category}