diff --git a/assets/main.scss b/assets/main.scss
index 40a2c3e..e365143 100644
--- a/assets/main.scss
+++ b/assets/main.scss
@@ -31,7 +31,7 @@ body {
 }
 
 .logo {
-    @apply w-full py-4 col-span-4 xl:col-span-2;
+    @apply w-full py-4 col-span-8 xl:col-span-2;
 
     a {
         @apply flex items-center gap-2;
@@ -86,7 +86,7 @@ body {
     }
 
     &-toggle {
-        @apply flex xl:hidden col-span-8 justify-end;
+        @apply flex xl:hidden col-span-4 justify-end;
 
         >span {
             @apply cursor-pointer text-zinc-600 hover:text-ioprim-900 transition-colors;
@@ -208,11 +208,15 @@ a[href^="#"] {
     @apply col-span-12 md:col-span-6 xl:col-span-4 grid grid-cols-4 items-center px-4;
 
     &-image {
-        @apply rounded-full size-20 bg-slate-300 overflow-hidden col-span-1;
+        @apply max-w-full max-h-full aspect-square overflow-hidden col-span-1 pr-4;
+
+        img{
+            @apply rounded-full bg-slate-300
+        }
     }
 
     &-content {
-        @apply col-span-3 text-end italic;
+        @apply col-span-3 text-end italic text-sm lg:text-base;
     }
 
     &-title {
@@ -228,7 +232,7 @@ a[href^="#"] {
     }
 
     &-close {
-        @apply absolute right-4 top-4 text-4xl opacity-50;
+        @apply absolute right-3 top-3 text-4xl opacity-50;
     }
 
     &-status {
@@ -244,7 +248,7 @@ a[href^="#"] {
     }
 
     h2 {
-        @apply px-4;
+        @apply px-6 text-2xl text-center;
     }
 
     form {
diff --git a/components/calcValues.vue b/components/calcValues.vue
index e317ab0..ff1ed06 100644
--- a/components/calcValues.vue
+++ b/components/calcValues.vue
@@ -146,7 +146,7 @@ const goal = (target: string, params: object) => {
 <template>
     <div class="container relative py-4">
         <form class="form">
-            <div class="col-span-12 lg:col-span-6">
+            <div class="col-span-12 sm:col-span-6">
                 <div class="form-row">
                     <div class="form-item w-full">
                         <label for="length">Длина ламельного блока, мм</label>
@@ -162,7 +162,7 @@ const goal = (target: string, params: object) => {
                     </div>
                 </div>
             </div>
-            <div class="col-span-12 lg:col-span-6">
+            <div class="col-span-12 sm:col-span-6">
                 <div class="form-row">
                     <div class="form-item">
                         <label for="lamelle_color">Цвет ламелей</label>
@@ -185,14 +185,14 @@ const goal = (target: string, params: object) => {
                         <input type="number" id="total_length" v-bind="parametric.total_length"
                             v-model="form_state.total_length" :ref="form_refs.total_length" />
                     </div>
-                    <div class="form-item w-full lg:w-2/4">
+                    <div class="form-item xl:w-2/4 text-sm xl:text-base">
                         <p v-if="form_state.extra_section" class="text-ioprim">
                             Внимание! Дополнительная секция приводит к увеличению стоимости.
                             Рекомендуем вам изменить длину забора или длину секции!
                         </p>
                     </div>
                 </div>
-                <div class="form-row min-h-12">
+                <div class="form-row min-h-12 mt-2 xl:mt-0">
                     <div class="form-item form-item_checkbox">
                         <input id="auto_length" type="checkbox" v-model="form_state.auto_length" />
                         <label for="auto_length">Автоматический подбор секции</label>
@@ -208,30 +208,30 @@ const goal = (target: string, params: object) => {
                     <div class="grid grid-cols-6">
                         <div class="col-span-4 calc_table-maincell">Секции</div>
                         <div class="col-span-2 calc_table-maincell">{{ section_count }}</div>
-                        <div class="col-span-6 xl:col-span-4">
+                        <div class="col-span-6 sm:col-span-4">
                             Ламели, RAL {{ lamelle_color }}, {{ getColorNameFromRal(lamelle_color)?.toLowerCase() }}
                         </div>
-                        <div class="col-span-3 xl:col-span-1">{{ section_count * lamelles_count }}</div>
-                        <div class="col-span-3 xl:col-span-1">
+                        <div class="col-span-3 sm:col-span-1">{{ section_count * lamelles_count }}</div>
+                        <div class="col-span-3 sm:col-span-1">
                             {{ `${parseFloat(form_state.length.toString()).toFixed(2)}\xa0мм` }}</div>
                         <template v-if="!form_state.remove_pillar">
-                            <div class="col-span-6 xl:col-span-4">Столбы, RAL {{ pillar_color }}, {{
+                            <div class="col-span-6 sm:col-span-4">Столбы, RAL {{ pillar_color }}, {{
                                 getColorNameFromRal(pillar_color)?.toLowerCase() }}</div>
-                            <div class="col-span-3 xl:col-span-1">
+                            <div class="col-span-3 sm:col-span-1">
                                 {{ section_count + ~~(!!form_state.extra_section) + 1 }}
                             </div>
-                            <div class="col-span-3 xl:col-span-1">
+                            <div class="col-span-3 sm:col-span-1">
                                 {{ `${parseFloat(form_state.fence_length.toString()).toFixed(2)}\xa0мм` }}
                             </div>
                         </template>
                         <template v-if="form_state.extra_section">
                             <div class="col-span-4 calc_table-maincell">Секции</div>
                             <div class="col-span-2 calc_table-maincell">1</div>
-                            <div class="col-span-6 xl:col-span-4">
+                            <div class="col-span-6 sm:col-span-4">
                                 Ламели, RAL {{ lamelle_color }}, {{ getColorNameFromRal(lamelle_color)?.toLowerCase() }}
                             </div>
-                            <div class="col-span-3 xl:col-span-1">{{ 1 * lamelles_count }}</div>
-                            <div class="col-span-3 xl:col-span-1">{{
+                            <div class="col-span-3 sm:col-span-1">{{ 1 * lamelles_count }}</div>
+                            <div class="col-span-3 sm:col-span-1">{{
                                 `${parseFloat(form_state.extra_section.toString()).toFixed(2)}\xa0мм` }}</div>
                         </template>
                     </div>