diff --git a/Step/wwwroot/assets/styles/base/depot.less b/Step/wwwroot/assets/styles/base/depot.less
index a1d0ff0a..2aa64249 100644
--- a/Step/wwwroot/assets/styles/base/depot.less
+++ b/Step/wwwroot/assets/styles/base/depot.less
@@ -1,5 +1,13 @@
 // out: false, sourceMap: false, main: ../style.less
 @import "colors.less";
+
+
+@keyframes selectedanimation {
+  0%   {box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);}
+  50%  {box-shadow: 0px 0px 2px 3px #1791ff;}
+  100% {box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);}
+}
+
 .depot-container {
     height: 100%;
     width: 100%;
@@ -7,22 +15,28 @@
     /* align-items: center; */
     justify-content: center;
     padding-top: 104px;
-    .depot-position section {
-        position: relative;
-        .empty, .target {
-            position: absolute;
-            top: 8px;
-            left: 8px;
-            right: 8px;
-            bottom: 8px;
+    .depot-position {
+        &.selected {
+          animation: selectedanimation 0.4s;
         }
-        .empty{
-          opacity: 0.7;
-          border: dashed 2px #878787;
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          font-size: 18px;
+        & section {
+            position: relative;
+            .empty,
+            .target {
+                position: absolute;
+                top: 8px;
+                left: 8px;
+                right: 8px;
+                bottom: 8px;
+            }
+            .empty {
+                opacity: 0.7;
+                border: dashed 2px #878787;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                font-size: 18px;
+            }
         }
     }
     .depot-box {
@@ -150,7 +164,8 @@
                     .sd-section {
                         display: flex;
                         align-items: center;
-                        margin-top: 111px;
+                        margin-top: 100px;
+                        padding-top:11px;
                         overflow-x: auto;
                         padding-bottom: 30px;
                         overflow-y: hidden;
@@ -168,6 +183,7 @@
                             flex-grow: 0;
                             height: 24px;
                             width: 24px; // margin: 16px;
+                            cursor: pointer;
                         } // .square{
                         //     /*se empty*/
                         //     border: solid 2px @color-clear-blue;
@@ -186,6 +202,17 @@
                         .selected-full {
                             background-color: @color-clear-blue;
                         }
+                        .selected {
+                            position: relative;
+                            &::before {
+                                content: "\f0d7";
+                                font-family: 'FontAwesome';
+                                position: absolute;
+                                font-size: 36px;
+                                top: -29px;
+                                color: #1791ff;
+                            }
+                        }
                         .selected-empty {
                             height: 20px;
                             width: 20px;
diff --git a/Step/wwwroot/assets/styles/base/layout.less b/Step/wwwroot/assets/styles/base/layout.less
index 9be5ac2b..f3eeb4f9 100644
--- a/Step/wwwroot/assets/styles/base/layout.less
+++ b/Step/wwwroot/assets/styles/base/layout.less
@@ -65,7 +65,7 @@
     border-radius: 20px;
     width: 8px;
     background-color: rgba(0, 0, 0, 0.3);
-    // box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
+    //box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
 }
 
 body {
@@ -170,10 +170,10 @@ body {
     }
 }
 
-img {
-    user-drag: none;
-    -webkit-user-drag: none;
-}
+// img {
+//     user-drag: none;
+//     -webkit-user-drag: none;
+// }
 
 .clearfix {
     clear: both;
diff --git a/Step/wwwroot/assets/styles/style.css b/Step/wwwroot/assets/styles/style.css
index 5aa3881d..f6e7429b 100644
--- a/Step/wwwroot/assets/styles/style.css
+++ b/Step/wwwroot/assets/styles/style.css
@@ -3427,6 +3427,17 @@ footer .container button.big:before {
   font-size: 18px;
   color: #002e6e;
 }
+@keyframes selectedanimation {
+  0% {
+    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
+  }
+  50% {
+    box-shadow: 0px 0px 2px 3px #1791ff;
+  }
+  100% {
+    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
+  }
+}
 .depot-container {
   height: 100%;
   width: 100%;
@@ -3435,6 +3446,9 @@ footer .container button.big:before {
   justify-content: center;
   padding-top: 104px;
 }
+.depot-container .depot-position.selected {
+  animation: selectedanimation 0.4s;
+}
 .depot-container .depot-position section {
   position: relative;
 }
@@ -3579,7 +3593,8 @@ footer .container button.big:before {
 .depot-container .depot-box .depot-boxbody .box-right .single-depot .sd-section {
   display: flex;
   align-items: center;
-  margin-top: 111px;
+  margin-top: 100px;
+  padding-top: 11px;
   overflow-x: auto;
   padding-bottom: 30px;
   overflow-y: hidden;
@@ -3598,6 +3613,7 @@ footer .container button.big:before {
   flex-grow: 0;
   height: 24px;
   width: 24px;
+  cursor: pointer;
 }
 .depot-container .depot-box .depot-boxbody .box-right .single-depot .square-container .empty {
   height: 20px;
@@ -3611,6 +3627,17 @@ footer .container button.big:before {
 .depot-container .depot-box .depot-boxbody .box-right .single-depot .square-container .selected-full {
   background-color: #1791ff;
 }
+.depot-container .depot-box .depot-boxbody .box-right .single-depot .square-container .selected {
+  position: relative;
+}
+.depot-container .depot-box .depot-boxbody .box-right .single-depot .square-container .selected::before {
+  content: "\f0d7";
+  font-family: 'FontAwesome';
+  position: absolute;
+  font-size: 36px;
+  top: -29px;
+  color: #1791ff;
+}
 .depot-container .depot-box .depot-boxbody .box-right .single-depot .square-container .selected-empty {
   height: 20px;
   width: 20px;
@@ -8058,10 +8085,6 @@ body {
   height: 50px;
   margin: 0 10px;
 }
-img {
-  user-drag: none;
-  -webkit-user-drag: none;
-}
 .clearfix {
   clear: both;
 }
diff --git a/Step/wwwroot/src/components/depot.ts b/Step/wwwroot/src/components/depot.ts
index 44cb3ffd..21450308 100644
--- a/Step/wwwroot/src/components/depot.ts
+++ b/Step/wwwroot/src/components/depot.ts
@@ -19,6 +19,8 @@ declare let $: any;
 export default class depot extends Vue {
   $route: any;
   $router: any;
+  BLOCKSIZE = 320;
+
   public get depot(): server.DepotModel[] { return (this.$store.state as AppModel).depot.depot; }
   // Solo le positions del mio magazzino
   public get positions(): server.MagazinesPositions[] {
@@ -30,13 +32,12 @@ export default class depot extends Vue {
   public get availableTools(): server.Tools[] { return (this.$store.state as AppModel).depot.availableTool; }
 
   public magazines: server.MagazineModel[] = (this.$store.state as AppModel).tooling.magazines;
-
   public enableModify: any = false;
 
   public searchText: string = "";
   public currentFilter: string = "";
 
-  public current
+  public currentPosition: number = 0;
 
   @Watch("searchText")
   public applyFilter(n) {
@@ -129,6 +130,15 @@ export default class depot extends Vue {
 
   public addToDepotPosition(position, toolToAdd) {
     console.log(position, toolToAdd);
+  }
 
+  public goToPosition(index) {
+
+    this.currentPosition = index;
+    var c = (this.$refs.positionslist as any);
+    var move = index * this.BLOCKSIZE;
+    if (index < this.positions.length - 2)
+      move = move - 2 * this.BLOCKSIZE;
+    c.scrollLeft = move;
   }
 }
diff --git a/Step/wwwroot/src/components/depot.vue b/Step/wwwroot/src/components/depot.vue
index debbf3ec..89a8662a 100644
--- a/Step/wwwroot/src/components/depot.vue
+++ b/Step/wwwroot/src/components/depot.vue
@@ -31,8 +31,8 @@
                           <span>{{'depot_title' | localize("Magazzino")}} {{depotId}} - Lineare</span>
                           <button class="btn" v-if="m.id == depotId + 1" v-for="m in magazines" :key="m.id" :disabled="disableFastButton()" @click="changeMagazine(m.id)"><i class="fa fa-chevron-right"></i></button>
                       </div>
-                      <div class="sd-section scrollable">
-                        <detail-card v-for="pos in positions" :key="pos.positionId" :number="pos.positionId" class="depot-position" >
+                      <div class="sd-section scrollable" ref="positionslist">
+                        <detail-card v-for="(pos, idx) in positions" :key="pos.positionId" :number="pos.positionId" class="depot-position" :class="{'selected': currentPosition == idx}">
                           <span class="empty" v-if="!toolAtPosition(pos.positionId)">{{'depot_avaiable_position' | localize("Posizione disponibile")}}</span>
                           <drop class="target" @drop="addToDepotPosition(pos.positionId, ...arguments)">
                            <drag v-if="toolAtPosition(pos.positionId)" :transfer-data="toolAtPosition(pos.positionId)">
@@ -59,7 +59,9 @@
                       </div>
                     <div class="square-container">
                       <div class="linesquare">
-                        <div class="square empty" v-for="pos in positions" :key="pos.positionId"
+                        <div class="square empty"
+                             v-for="(pos, index) in positions" :key="pos.positionId"
+                             @click="goToPosition(index)"
                              :class="{'full': toolAtPosition(pos.positionId)}"></div>
                         <!-- <div class="square" :class="{'full': true}"></div>
                         <div class="square" :class="{'empty': true}"></div>