diff --git a/assets/main.scss b/assets/main.scss
index e152edd..c7b17b4 100644
--- a/assets/main.scss
+++ b/assets/main.scss
@@ -77,7 +77,7 @@ a[href^="#"] {
 }
 
 .footer {
-    @apply px-2 py-4 bg-slate-200 text-zinc-800;
+    @apply px-2 py-4 bg-slate-200 text-zinc-800 pt-12;
 
     .container {
         @apply gap-4
@@ -89,6 +89,12 @@ a[href^="#"] {
         svg {
             @apply my-0 mx-auto;
         }
+
+        &:after {
+            content: '';
+            @apply block lg:hidden mr-auto ml-auto mt-5 h-[2px] max-w-44 mx-4 align-middle bg-gradient-to-r from-transparent via-zinc-800 via-50% to-transparent;
+
+        }
     }
 
     &-text {
@@ -118,6 +124,7 @@ a[href^="#"] {
 
         &-big {
             @apply text-3xl order-1 w-full text-center;
+
             .footer-icon-text {
                 @apply no-underline;
             }
@@ -127,8 +134,9 @@ a[href^="#"] {
             @apply underline;
         }
     }
+
     &_two {
-        @apply xl:bg-slate-200 py-16 text-sm text-zinc-500;
+        @apply xl:bg-slate-200 py-16 lg:py-8 text-sm text-zinc-500;
     }
 }
 
diff --git a/components/footer.vue b/components/footer.vue
index c618299..7797b2f 100644
--- a/components/footer.vue
+++ b/components/footer.vue
@@ -18,12 +18,12 @@ const { data: social_networkData } = await apiFetch<ApiSocial_networkType[]>(`so
     <div>
         <div class="footer" id="contacts">
             <div class="container">
-                <div class="col-span-3">
+                <div class="col-span-12 lg:col-span-6 xl:col-span-3 mb-12 lg:mb-0">
                     <div class="k-logo">
                         <k_logo />
                     </div>
                 </div>
-                <div class="col-span-6">
+                <div class="col-span-12 lg:col-span-6 xl:col-span-6 mb-12 lg:mb-0">
                     <template v-for="item in footerData">
                         <div class="footer-text" v-if="!item.small_text">
                             <template v-for="p in item.text.split('\n')">
@@ -32,7 +32,7 @@ const { data: social_networkData } = await apiFetch<ApiSocial_networkType[]>(`so
                         </div>
                     </template>
                 </div>
-                <div class="col-span-3">
+                <div class="col-span-12 xl:col-span-3">
                     <div class="footer-text footer-text-social" v-if="social_networkData">
                         <template v-for="item in social_networkData">
                             <a :class="['footer-icon', { 'footer-icon-big': !item.icon }]" :href="item.link"