diff --git a/package-lock.json b/package-lock.json
index ee6c27d..c60e67c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -18,8 +18,10 @@
         "react": "^18.2.0",
         "react-currency-input-field": "^3.6.9",
         "react-dom": "^18.2.0",
+        "react-indiana-drag-scroll": "^3.0.3-alpha",
         "react-input-range": "^1.3.0",
         "react-number-format": "^5.1.2",
+        "react-redux": "^8.0.5",
         "react-scripts": "5.0.1",
         "react-slider": "^2.0.4",
         "react-use-draggable-scroll": "^0.2.3",
@@ -3869,8 +3871,6 @@
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
       "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "@types/react": "*",
         "hoist-non-react-statics": "^3.3.0"
@@ -4278,9 +4278,7 @@
     "node_modules/@types/use-sync-external-store": {
       "version": "0.0.3",
       "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz",
-      "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA==",
-      "optional": true,
-      "peer": true
+      "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA=="
     },
     "node_modules/@types/ws": {
       "version": "8.5.3",
@@ -8719,8 +8717,6 @@
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
       "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "react-is": "^16.7.0"
       }
@@ -8728,9 +8724,7 @@
     "node_modules/hoist-non-react-statics/node_modules/react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
-      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
-      "optional": true,
-      "peer": true
+      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
     },
     "node_modules/hoopy": {
       "version": "0.1.4",
@@ -14395,6 +14389,19 @@
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.11.tgz",
       "integrity": "sha512-/6UZ2qgEyH2aqzYZgQPxEnz33NJ2gNsnHA2o5+o4wW9bLM/JYQitNP9xPhsXwC08hMMovfGe/8retsdDsczPRg=="
     },
+    "node_modules/react-indiana-drag-scroll": {
+      "version": "3.0.3-alpha",
+      "resolved": "https://registry.npmjs.org/react-indiana-drag-scroll/-/react-indiana-drag-scroll-3.0.3-alpha.tgz",
+      "integrity": "sha512-Bo8Ium/CGs0oIYzk4wVDphuhrf2QRvLKTLO/+21M+czF1EQEII4w1UqoFs4lIGd84YpVL8UDXIcy2m9yzsFuRQ==",
+      "engines": {
+        "node": ">=8",
+        "npm": ">=5"
+      },
+      "peerDependencies": {
+        "react": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0",
+        "react-dom": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
     "node_modules/react-input-range": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/react-input-range/-/react-input-range-1.3.0.tgz",
@@ -14429,8 +14436,6 @@
       "version": "8.0.5",
       "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-8.0.5.tgz",
       "integrity": "sha512-Q2f6fCKxPFpkXt1qNRZdEDLlScsDWyrgSj0mliK59qU6W5gvBiKkdMEG2lJzhd1rCctf0hb6EtePPLZ2e0m1uw==",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "@babel/runtime": "^7.12.1",
         "@types/hoist-non-react-statics": "^3.3.1",
@@ -14468,9 +14473,7 @@
     "node_modules/react-redux/node_modules/react-is": {
       "version": "18.2.0",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
-      "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==",
-      "optional": true,
-      "peer": true
+      "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
     },
     "node_modules/react-refresh": {
       "version": "0.11.0",
@@ -16199,9 +16202,9 @@
       }
     },
     "node_modules/typescript": {
-      "version": "4.9.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.3.tgz",
-      "integrity": "sha512-CIfGzTelbKNEnLpLdGFgdyKhG23CKdKgQPOBc+OUNrkJ2vr+KSzsSV5kq5iWhEQbok+quxgGzrAtGWCyU7tHnA==",
+      "version": "4.9.5",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz",
+      "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
       "peer": true,
       "bin": {
         "tsc": "bin/tsc",
@@ -16359,8 +16362,6 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz",
       "integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==",
-      "optional": true,
-      "peer": true,
       "peerDependencies": {
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
       }
@@ -20011,8 +20012,6 @@
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
       "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
-      "optional": true,
-      "peer": true,
       "requires": {
         "@types/react": "*",
         "hoist-non-react-statics": "^3.3.0"
@@ -20367,9 +20366,7 @@
     "@types/use-sync-external-store": {
       "version": "0.0.3",
       "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz",
-      "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA==",
-      "optional": true,
-      "peer": true
+      "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA=="
     },
     "@types/ws": {
       "version": "8.5.3",
@@ -23607,8 +23604,6 @@
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
       "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
-      "optional": true,
-      "peer": true,
       "requires": {
         "react-is": "^16.7.0"
       },
@@ -23616,9 +23611,7 @@
         "react-is": {
           "version": "16.13.1",
           "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
-          "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
-          "optional": true,
-          "peer": true
+          "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
         }
       }
     },
@@ -27527,6 +27520,12 @@
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.11.tgz",
       "integrity": "sha512-/6UZ2qgEyH2aqzYZgQPxEnz33NJ2gNsnHA2o5+o4wW9bLM/JYQitNP9xPhsXwC08hMMovfGe/8retsdDsczPRg=="
     },
+    "react-indiana-drag-scroll": {
+      "version": "3.0.3-alpha",
+      "resolved": "https://registry.npmjs.org/react-indiana-drag-scroll/-/react-indiana-drag-scroll-3.0.3-alpha.tgz",
+      "integrity": "sha512-Bo8Ium/CGs0oIYzk4wVDphuhrf2QRvLKTLO/+21M+czF1EQEII4w1UqoFs4lIGd84YpVL8UDXIcy2m9yzsFuRQ==",
+      "requires": {}
+    },
     "react-input-range": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/react-input-range/-/react-input-range-1.3.0.tgz",
@@ -27553,8 +27552,6 @@
       "version": "8.0.5",
       "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-8.0.5.tgz",
       "integrity": "sha512-Q2f6fCKxPFpkXt1qNRZdEDLlScsDWyrgSj0mliK59qU6W5gvBiKkdMEG2lJzhd1rCctf0hb6EtePPLZ2e0m1uw==",
-      "optional": true,
-      "peer": true,
       "requires": {
         "@babel/runtime": "^7.12.1",
         "@types/hoist-non-react-statics": "^3.3.1",
@@ -27567,9 +27564,7 @@
         "react-is": {
           "version": "18.2.0",
           "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
-          "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==",
-          "optional": true,
-          "peer": true
+          "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
         }
       }
     },
@@ -28853,9 +28848,9 @@
       }
     },
     "typescript": {
-      "version": "4.9.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.3.tgz",
-      "integrity": "sha512-CIfGzTelbKNEnLpLdGFgdyKhG23CKdKgQPOBc+OUNrkJ2vr+KSzsSV5kq5iWhEQbok+quxgGzrAtGWCyU7tHnA==",
+      "version": "4.9.5",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz",
+      "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
       "peer": true
     },
     "unbox-primitive": {
@@ -28957,8 +28952,6 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz",
       "integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==",
-      "optional": true,
-      "peer": true,
       "requires": {}
     },
     "util-deprecate": {
diff --git a/package.json b/package.json
index bd5120f..ab41fc9 100644
--- a/package.json
+++ b/package.json
@@ -13,8 +13,10 @@
     "react": "^18.2.0",
     "react-currency-input-field": "^3.6.9",
     "react-dom": "^18.2.0",
+    "react-indiana-drag-scroll": "^3.0.3-alpha",
     "react-input-range": "^1.3.0",
     "react-number-format": "^5.1.2",
+    "react-redux": "^8.0.5",
     "react-scripts": "5.0.1",
     "react-slider": "^2.0.4",
     "react-use-draggable-scroll": "^0.2.3",
diff --git a/src/components/DraggableGallery/DraggableGallery.js b/src/components/DraggableGallery/DraggableGallery.js
index d547c5b..f756b34 100644
--- a/src/components/DraggableGallery/DraggableGallery.js
+++ b/src/components/DraggableGallery/DraggableGallery.js
@@ -1,18 +1,10 @@
 import "./DraggableGallery.css";
-
 import { Gallery } from "./components/Gallery/Gallery";
-import { useDraggable } from "react-use-draggable-scroll";
-import { useRef } from "react";
+import { ScrollContainer } from "react-indiana-drag-scroll";
+import "react-indiana-drag-scroll/dist/style.css";
 
 export const DraggableGallery = () => {
   const arrayLegend = ["Тип", "Площадь", "Стоимость", "Этаж", "Cрок Сдачи"];
-  const ref = useRef();
-
-  const { events } = useDraggable(ref, {
-    safeDisplacement: 20, // specify the drag sensitivity
-  });
-
-  console.log(events)
 
   return (
     <div className="legend-layout">
@@ -26,9 +18,13 @@ export const DraggableGallery = () => {
           ))}
         </div>
       </div>
-      <div ref={ref} {...events} className="gallery">
+      <ScrollContainer
+        hideScrollbars={false}
+        mouseScroll={{ ignoreElements: ".card-button-container" }}
+        className="gallery"
+      >
         <Gallery></Gallery>
-      </div>
+      </ScrollContainer>
     </div>
   );
 };
diff --git a/src/components/DraggableGallery/components/Gallery/Card/Card.js b/src/components/DraggableGallery/components/Gallery/Card/Card.js
index f036c5e..704b167 100644
--- a/src/components/DraggableGallery/components/Gallery/Card/Card.js
+++ b/src/components/DraggableGallery/components/Gallery/Card/Card.js
@@ -11,12 +11,12 @@ export const Card = ({ card }) => {
   const dragControls = useDragControls();
   const pointArray = Array(6).fill(0);
   const onDrag = (e) => {
-      dragControls.start(e, { snapToCursor: true });
+    dragControls.start(e, { snapToCursor: true });
   };
 
   return (
     <Reorder.Item value={card} dragListener={false} dragControls={dragControls}>
-      <div className="card">
+      <div  className="card">
         <div className="card-image-container">
           <img className="card-image" src={card.img} alt="планнировка"></img>
         </div>
@@ -41,7 +41,7 @@ export const Card = ({ card }) => {
         </div>
       </div>
       <motion.div className="card-button-container">
-        <div onClick={(e) => onDrag(e)} className="drag-button">
+        <div id='88' onPointerDown={(e) => onDrag(e)} className="drag-button">
           {pointArray.map((i, index) => (
             <div key={Math.random(index)} className="point"></div>
           ))}
diff --git a/src/components/DraggableGallery/components/Gallery/Gallery.js b/src/components/DraggableGallery/components/Gallery/Gallery.js
index d9281b8..8587fde 100644
--- a/src/components/DraggableGallery/components/Gallery/Gallery.js
+++ b/src/components/DraggableGallery/components/Gallery/Gallery.js
@@ -1,6 +1,6 @@
 import "./Gallery.css";
 import plan from "./planFlat.png";
-import { Reorder, useDragControls } from "framer-motion";
+import { Reorder } from "framer-motion";
 import { useState } from "react";
 import { Card } from "./Card/Card";
 
@@ -77,7 +77,7 @@ export const Gallery = ({}) => {
       className="list"
       axis="x"
       values={cards}
-      layoutScroll={true}
+      layoutScroll
       onReorder={setCards}
     >
       {cards.map((card, index) => (