diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
index f4ed9fd..4462039 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
@@ -710,7 +710,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
         });
 
     }
-
+    $scope.sliderVal = 100;
     $scope.createSpeechBubbleBasedOnAnnotationLength = function (x, y, PinId) {
 
         x = x * $scope.sliderPercentValue;
@@ -796,11 +796,38 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
         $rootScope.speechBubbleDimaensions.push({ "currentX": x, "currentY": y, "id": PinId });
         speechBubbleDims.push({ currentX: x, currentY: y });
         document.getElementById('speechBubbleLine' + PinId + '').style.display = 'block';
-        document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 45 * $scope.sliderPercentValue)) + 'px';
-        document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY) - 20 * $scope.sliderPercentValue) + 'px';
+        if ($scope.sliderVal == 100) {
+          
+            document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 46)) + 'px';
+            document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY - 28)) + 'px';
+        }
+        else if ($scope.sliderVal == 85) {
+          
+            document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 44)) + 'px';
+            document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY - 26)) + 'px';
+        } else if ($scope.sliderVal == 70) {
+
+            document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 42)) + 'px';
+            document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY - 24)) + 'px';
+        }
+        else if ($scope.sliderVal == 55) {
+
+            document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 40)) + 'px';
+            document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY - 22)) + 'px';
+        }
+        else if ($scope.sliderVal == 40) {
+
+            document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 38)) + 'px';
+            document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY - 20)) + 'px';
+        }
+        else if ($scope.sliderVal == 25) {
+
+            document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 36)) + 'px';
+            document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY - 18)) + 'px';
+        }
         document.getElementById('speechBubble' + PinId + '').style.display = 'block';
-        document.getElementById('speechBubble' + PinId + '').style.left = (speechBubbleDims[0].currentX - 70 * $scope.sliderPercentValue) + 'px';
-        document.getElementById('speechBubble' + PinId + '').style.top = (speechBubbleDims[0].currentY - 58  * $scope.sliderPercentValue) + 'px';
+        document.getElementById('speechBubble' + PinId + '').style.left = (speechBubbleDims[0].currentX - 70) + 'px';
+        document.getElementById('speechBubble' + PinId + '').style.top = (speechBubbleDims[0].currentY - 58) + 'px';
 
         $('.common-drag').draggable(
         {
@@ -890,7 +917,16 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
         var f = cx;
 
         if (BoolValues == true) {
-            $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 10) + 'px', 'left': (f - 5) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' });
+            if ($scope.sliderVal == 40) {
+                $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 5) + 'px', 'left': (f - 5) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' });
+            }
+            else if ($scope.sliderVal == 25) {
+                $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 2) + 'px', 'left': (f - 2) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' });
+            }
+            else {
+                $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 10) + 'px', 'left': (f - 5) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' });
+            }
+            
         }
         else {
             $("#bord_annotation").css({ 'display': 'block', 'width': d + 'px', 'top': e + 'px', 'left': f + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' });
@@ -917,7 +953,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 layer: true,
                 name: "Pin_" + PinId,
                 groups: ["Pin_" + PinId],
-                strokeStyle: 'black',
+                strokeStyle: '#565656',
                 strokeWidth: 2,
                 visible: true,
                 x1: offsetX1 * $scope.sliderPercentValue, y1: offsetY1 * $scope.sliderPercentValue,
@@ -1515,7 +1551,7 @@ function onZoom(scope) {
     //6. Show all pins on AA opened item
 }
 
-var sliderVal = 0.0;
+
 $(document).ready(function () {
     $(".slider").slider({
         min: 25,
@@ -1525,10 +1561,12 @@ $(document).ready(function () {
         orientation: "vertical",
         slide: function (event, ui) {
           
-            sliderVal = ui.value;
+         
 
             var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope();
             scope.$apply(function () {
+                scope.sliderVal = ui.value;
+                scope.removeSpeechBubble();
                 var relativeWidth = 0;
                 var relativeHeight = 0;
 
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/views/aa/atlas-anatomy-detail.html b/400-SOURCECODE/AIAHTML5.Web/app/views/aa/atlas-anatomy-detail.html
index 3f4f3da..6c3aa72 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/views/aa/atlas-anatomy-detail.html
+++ b/400-SOURCECODE/AIAHTML5.Web/app/views/aa/atlas-anatomy-detail.html
@@ -86,7 +86,7 @@
                     </div>
                     &nbsp;
                     <!-- Single button -->
-                    <div class="btn-group">
+                    <div class="btn-group" style="vertical-align:top;">
                         <button type="button" class="btn btn-success dropdown-toggle btn-sm" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                             <i class="fa fa-arrow-circle-right"></i>
                         </button>