responsive

src/app/components/contacts/contact-form/contact-form.component.scss

@@ -44,6 +44,8 @@ span {
   align-items: center;
 }
 
+/*------------- RESPONSIVE -------------*/
+
 @media screen and (max-width: 800px) {
   .name {
     flex-direction: column;

src/app/components/contacts/contacts.component.scss

@@ -143,6 +143,7 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+
 /*------------- RESPONSIVE -------------*/
 
 @media screen and (max-width: 1150px) {

src/app/shared/components/buttons/form-btn/form-btn.component.scss

@@ -1,8 +1,7 @@
 .btn-submit {
   width: fit-content;
-  height: 56px;
   padding: 12px;
-  margin: 12px 12px;
+  margin: 12px;
   border-radius: 10px;
   border: 1px solid var(--black) !important;
   background-color: var(--light-gray);
@@ -27,7 +26,6 @@
 
 .btn-clear {
   width: fit-content;
-  height: 56px;
   padding: 12px;
   margin: 12px;
   border-radius: 10px;
@@ -47,7 +45,6 @@
 
 .btn-delete {
   width: fit-content;
-  height: 56px;
   padding: 12px;
   margin: 12px;
   border-radius: 10px;
@@ -87,3 +84,16 @@
 .input-container:hover .background-image {
   filter: var(--filter);
 }
+
+/*------------- RESPONSIVE -------------*/
+
+@media screen and (max-width: 400px) {
+  .btn-submit,
+  .btn-clear,
+  .btn-delete {
+    padding: 8px;
+    margin: 6px;
+    font-size: 18px;
+    font-weight: 400;
+  }
+}