diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
index 8f4bdd1..e0b234b 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
@@ -8465,7 +8465,14 @@ AIA.controller("DAController", ["$scope", "$rootScope", "$compile", "$http", "$l
 
         //body highlight options functinality
         $scope.LoadBodySystemData = function () {
-
+            event.stopPropagation();
+            $("#structureDropdown").toggle();
+            $("#genderChangeId").css("display", "none");
+            $("#viewID").css("display", "none");
+            var $ua = navigator.userAgent;
+            if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
+                $(".custom-tooltip").toggle();
+            }
             var currentBodyViewId = $rootScope.voId;
             var systemListHtml = '<ul class="dropdown-menu" aria-labelledby="dropdownMenu2"><li><a href="#" title="Current Structure">Current Structure</a></li>  <li role="separator" class="divider"></li>'
             var systemList = $rootScope.CommonData.DACommonData.BodySystems.Item;
@@ -8493,8 +8500,21 @@ AIA.controller("DAController", ["$scope", "$rootScope", "$compile", "$http", "$l
 
         }
 
-        $scope.HighlightBodyByBodySystem = function (event) {
+        angular.element(document).click(function () {
+            $("#structureDropdown").css("display", "none");
+            $("#genderChangeId").css("display", "none");
+            $("#viewID").css("display", "none");
+            var $ua = navigator.userAgent;
+            if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
+                $(".custom-tooltip").css("display","none");
+                $(".custom-tooltip1").css("display","none");
+                $(".custom-tooltip2").css("display","none");
+            }
+          
+        });
 
+        $scope.HighlightBodyByBodySystem = function (event) {
+            $("#structureDropdown").toggle();
             $scope.DisableUI();
 
             //if listanager is visisble then close it
@@ -9872,3 +9892,26 @@ function onListManagerTermSelection(id, isTermListOptionClicked) {
 
 }
 
+function genderChange(){
+    event.stopPropagation();
+    $("#structureDropdown").css("display", "none");
+    $("#viewID").css("display", "none");
+    $("#genderChangeId").toggle();
+    var $ua = navigator.userAgent;
+    if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
+        $(".custom-tooltip1").toggle();
+    }
+}
+
+
+function viewChange() {
+    event.stopPropagation();
+    $("#structureDropdown").css("display", "none");
+    $("#genderChangeId").css("display", "none");
+    $("#viewID").toggle();
+    var $ua = navigator.userAgent;
+    if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
+        $(".custom-tooltip2").toggle();
+    }
+   
+}
\ No newline at end of file
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
index 83913fe..ab6ba4d 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
@@ -1815,6 +1815,20 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
         }
     }
 
+
+    angular.element(document).click(function () {
+        $("#bodySystemList").css("display","none");
+        var $ua = navigator.userAgent;
+        if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
+            $(".custom-tooltip").css("display","none");
+        }
+    });
+
+    //angulaar.element(document).click(function () {
+    //    $("#bodySystemList").css("display", "none");
+    //});
+
+
     $scope.activePinOnSliderChange = function () {
         if ($scope.activePinArray.length == 1) {
             for (var i = 0; i <= $scope.allPinDataArray.length - 1; i++) {
@@ -2061,3 +2075,11 @@ function onZoom(scope) {
 }
 
 
+function systemChange() {
+    event.stopPropagation();
+    $("#bodySystemList").toggle();
+    var $ua = navigator.userAgent;
+    if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
+        $(".custom-tooltip").toggle();
+    }
+}
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 c19cfa4..5386a06 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
@@ -1,250 +1,257 @@
-<style>
-    .canvas-annotationStyle {
-        display: none;
-        background-color: transparent;
-        z-index: 12001;
-        position: absolute;
-        left: 0;
-        right: 0;
-    }
-
-    .canvas-annotationStyle1 {
-        display: none;
-        background-color: transparent;
-        z-index: 12000;
-        position: absolute;
-        left: 0;
-        right: 0;
-    }
-
-    /*.active {
-        margin-left: 15px !important;
-    }*/
-
-    .tools1 {
-        left: -96px;
-    }
-
-    .tooltip-custom + .tooltip > .tooltip-inner {
-        background-color: #fff;
-        border: 1px solid #000;
-        color: #000;
-        border-radius: 0;
-    }
-
-    .tooltip-custom + .tooltip > .tooltip-arrow {
-        display: none;
-    }
-
-
-    .custom-tooltip {
-        background-color: #333;
-        border: 0 none;
-        color: #fff !important;
-        left: -52px;
-        /*opacity: 0.9;*/
-        padding: 7px;
-        position: absolute;
-        text-align: center;
-        top: 45px;
-        width: 120px;
-        display: none;
-        z-index: 120000;
-        border: 1px solid #000;
-        color: #000;
-        border-radius: 0;
-    }
-
-    .pad0 {
-        padding: 0;
-    }
-</style>
-<div id="aaDetailPageDiv" class="bodyWrap row" ng-controller="TileViewListController">
-
-    <!--<div class="col-sm-12 pageHeading">
-        <!--<button type="button" class="btn btn-success pull-left toggleBar btn-sm" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"> <i class="fa fa-bars"></i> </button>-->
-    <!--<div class=" pull-left toggleBar toggleHeadingButton" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"> <i class="fa fa-exchange"></i> </div>-->
-    <!--<h4 class="pull-left">1<sup>st</sup> &amp; 2<sup>nd</sup> Intercostal Spaces</h4>-->
-    <!--<div class="pull-right btn-group paddTop4 hidden-xs"> <a href="#" class="btn btn-xs btn-default"><i class="fa fa-minus"></i></a> <a href="#" class="btn btn-xs btn-default"><i class="fa fa-clone"></i></a> <a href="#" class="btn btn-xs btn-default"><i class="fa fa-close"></i></a> </div>
-    <div class="clearfix"></div>-->
-    <!--</div>-->
-    <div class="tools pull-left" style="top:44px;">
-        <div class="toggle-icon toggleBar toggleHeadingButton" id="sideBarToggle" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"></div>
-        <div class="sprit-icon">
-            <div class="col-sm-6"><button onclick="hidePins(event)" id="hidePinBtn" class="btn btn-black btn-sm tooltip-custom" data-toggle="tooltip" data-placement="bottom" title="Hide Pins"></button> </div>
-            <div class="col-sm-6"><button class="btn btn-black btn-sm pull-right tooltip-custom" id="selectedPin" onclick="showSelectedPins(event)" data-toggle="tooltip" data-placement="bottom" title="Show Selected Pins"></button></div>
-            <div class="col-sm-6"><button class="btn btn-primary btn-sm marginTop5 tooltip-custom" id="allPinBtn" onclick="showAllPins(event)" data-toggle="tooltip" data-placement="bottom" title="Show All Pins in System(s)"></button></div>
-            <div class="col-sm-6">
-                <div class="custom-tooltip">Select System</div>
-                <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu221" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"></button>
-                <ul class="dropdown-menu" aria-labelledby="dropdownMenu221" id="bodySystemList">
-                    <li><a id="0" href="#" title="Current Structure" onclick="showSelectedSystemPins(event)">All</a></li>
-                    <li role="separator" class="divider"></li>
-                    <li class="disabledSelectedSystem"><a id="1" href="#" title="Cardiovascular" onclick="showSelectedSystemPins(event)">Cardiovascular</a></li>
-                    <li class="disabledSelectedSystem"><a id="2" href="#" title="Digestive" onclick="showSelectedSystemPins(event)">Digestive</a></li>
-                    <li class="disabledSelectedSystem"><a id="3" href="#" title="Endocrine" onclick="showSelectedSystemPins(event)">Endocrine</a></li>
-                    <li class="disabledSelectedSystem"><a id="4" href="#" title="Immune" onclick="showSelectedSystemPins(event)">Immune</a></li>
-                    <li class="disabledSelectedSystem"><a id="5" href="#" title="Integumentary" onclick="showSelectedSystemPins(event)">Integumentary</a></li>
-                    <li class="disabledSelectedSystem"><a id="6" href="#" title="Lymphatic" onclick="showSelectedSystemPins(event)">Lymphatic</a></li>
-                    <li class="disabledSelectedSystem"><a id="7" href="#" title="Muscular" onclick="showSelectedSystemPins(event)">Muscular</a></li>
-                    <li class="disabledSelectedSystem"><a id="8" href="#" title="Nervous" onclick="showSelectedSystemPins(event)">Nervous</a></li>
-                    <li class="disabledSelectedSystem"><a id="9" href="#" title="Reproductive" onclick="showSelectedSystemPins(event)">Reproductive</a></li>
-                    <li class="disabledSelectedSystem"><a id="10" href="#" title="Respiratory" onclick="showSelectedSystemPins(event)">Respiratory</a></li>
-                    <li class="disabledSelectedSystem"><a id="11" href="#" title="Skeletal" onclick="showSelectedSystemPins(event)">Skeletal</a></li>
-                    <li class="disabledSelectedSystem"><a id="12" href="#" title="Urinary" onclick="showSelectedSystemPins(event)">Urinary</a></li>
-                </ul>
-               </div>
-            <div class="col-sm-12" data-toggle="tooltip" data-placement="top" title="Show/Hide Structure Name Boxes"><button onclick="showHideAnnotation(event)" class="btn btn-black btn-sm marginTop5 btn-block" id="comment-box"></button> </div>
-        </div>
-        <div class="pips-slider" style="margin-top:125px">
-            <h3>Zoom <i class="fa fa-search-plus"></i></h3>
-            <div class="slider" id="vertical-slider"></div>
-        </div>
-    </div>
-
-    <div class="main2">
-        <div class="col-sm-12 stickey-area">
-            <div class="breadcrumb">
-                <div class="">
-                    <div class="input-group col-sm-8 col-xs-7 col-md-10 pull-left">
-                        <!--<input class="form-control input-sm " type="text" placeholder="Anterior cutaneous branch of first intercostal nerve">-->
-                        <!--<select class="form-control input-sm ">
-                          <option>---Select---</option>
-                          <option selected>Anterior cutaneous branch of first intercostal nerve</option>
-                          <option>Anterior cutaneous branch of second intercostal nerve</option>
-                          <option>Anterior cutaneous branch of third intercostal nerve</option>
-                          <option>Anterior intercostal artery</option>
-                          <option>Anterior intercostal vein</option>
-                        </select>-->
-                        <!--<div class="input-group-addon btn btn-primary btn-sm"></div>-->
-                        <input type="text" class="form-control input-sm pull-left" id="selectedTermName" onclick="onSearchAA()" ondblclick="onSearchAA()" onblur="hideSearchList()" ng-model="searchFilter" placeholder=" search...">
-
-                        <div id="backdrop" ng-show="IsSearchVisible">
-                            <div id="searchListDivAA" class="col-sm-12 col-xs-12 col-md-12 col-lg-12 pull-left">
-                                <ul id="termlistfilter" class="form-control dropdown-menu" style="height:90px;width:100%;overflow-y:scroll;position:absolute;display:none;z-index:60001;"></ul>
-                            </div>
-                        </div>
-                    </div>
-                    &nbsp;
-                    <!-- Single button -->
-                    <div class="btn-group pull-left" style="vertical-align:top;">
-
-                        <button type="button" style="padding: 5px 10px 4px 10px !important;border: none;" class="btn btn-success btn-sm" onclick="onSearchAA()" onblur="hideSearchList()">
-                            <!--<img src="~/../content/images/DA/go-to.png" style="height: 30px;width:50px">-->
-                            <i class="fa fa-caret-down" style="font-size:20px;"></i>
-                        </button>
-
-
-                        <!--<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>-->
-                        <!--<ul class="dropdown-menu">
-            <li><a href="#">1<sup>st</sup> &amp; 2<sup>nd</sup> Intercostal Spaces</a></li>
-            <li role="separator" class="divider"></li>
-            <li><a href="#">All</a></li>
-        </ul>-->
-                    </div>
-                    <!--<div class="btn-group">
-                        <button type="button" class="btn btn-primary dropdown-toggle btn-sm" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" id="navigatorMan">
-                            <i class="fa fa-male"></i>
-                        </button>
-                        <ul class="dropdown-menu" style="min-width:auto;">
-                            <li><img src="{navImg}"class="img-responsive"></li>
-                        </ul>
-                    </div>-->
-
-
-                    <div class="btn-group open" id="da-body-nav">
-                        <button id="navigatorBtn" type="button" style="padding:0px 0px 10px 1px !important;background-color:rgba(255,255,255,0.0); border:none;" class="btn btn-primary dropdown-toggle btn-sm" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
-                            <img src="~/../content/images/DA/navigator-view.png" style="height:30px; width:50px" />
-                        </button>
-
-                        <div class="dropdown-menu" id="navigatorDiv" style="min-height: auto; min-width: auto; margin-left: 15px !important;">
-                            <div id="containment-wrapper" align="center" style="min-width:auto;height:119px; ">
-                                <img id="navimg" alt="" />
-                                <div id="draggable" class="draggable ui-widget-content" ng-mouseup="ScrollCanvasDiv()" ng-style="dragdivposition">
-                                </div>
-                            </div>
-
-                        </div>
-                    </div>
-
-
-                </div>
-            </div>
-        </div>
-        <!--<img id="scream" width="220" height="277" src="~/../../../content/images/noraml-pin.png" style="visibility:hidden" alt="The Scream">-->
-        <!--<img src="../../../content/images/noraml-pin.png" style="visibility:hidden" id="normal-pin"/>-->
-        <div class="col-sm-12">
-            <div class="container-fluid">
-                <div class="row">
-
-                    <div class=" col-sm-12 img-thumbnail canvasDivClass" id="canvasDiv" style="overflow: scroll;">
-                        <canvas id="canvasPaint" ng-click="FreeStylePaint($event)" width="2277" height="725" class="canvas-annotationStyle1"></canvas>
-                        <canvas id="canvas" ng-click="onDrawingCanvasClick($event)" width="2277" height="725" class="canvas-annotationStyle"></canvas>
-
-                        <img id="modItemImage" alt="" title="" style="left:0px;top:0px;position:absolute">
-                        <!--<div class="clearfix">
-
-                           <img id="modItemImage" ng-init="alert('hi')" alt="" title="" class="img-responsive">
-                        </div>
-                        <!--<div class="col-sm-1 img-thumbnail pull-right" align="center"><img src="../../content/images/1000x600.jpg" alt="" title="" class="img-responsive"></div>
-        <div class="clearfix"></div>-->
-                    </div>
-                </div>
-            </div>
-
-
-        </div>
-
-    </div>
-</div>
-<script>
-    $(window).load(function () {
-        $(".stickey-area").sticky();
-    });
-</script>
-<script>
-    $(".tooltip-custom").tooltip({
-        tooltipClass: 'customTooltip'
-    });
-</script>
-<script>
-    $(function () {
-
-        $("#dropdownMenu221").mouseover(function () {
-            $(".custom-tooltip").css("display", "block");
-        });
-        $("#dropdownMenu221").mouseout(function () {
-            $(".custom-tooltip").css("display", "none");
-        });
-    });
-</script>
-
-<script>
-    var isSideBarBtnClicked = true;
-    $(document).ready(function () {
-        $('[data-toggle="tooltip"]').tooltip();
-        $("#sideBarToggle").click(function () {
-            if (isSideBarBtnClicked == true) {
-                $(".main2").addClass("active");
-                $(".tools").addClass("tools1");
-                isSideBarBtnClicked = false;
-
-            }
-            else {
-                $(".main2").removeClass("active");
-                $(".tools").removeClass("tools1");
-                isSideBarBtnClicked = true;
-            }
-
-        });
-    });
-</script>
-
-
-<script>
-    $(function () {
-        $("#draggable").draggable();
-    });
-</script>
+<style>
+    .canvas-annotationStyle {
+        display: none;
+        background-color: transparent;
+        z-index: 12001;
+        position: absolute;
+        left: 0;
+        right: 0;
+    }
+
+    .canvas-annotationStyle1 {
+        display: none;
+        background-color: transparent;
+        z-index: 12000;
+        position: absolute;
+        left: 0;
+        right: 0;
+    }
+
+    /*.active {
+        margin-left: 15px !important;
+    }*/
+
+    .tools1 {
+        left: -96px;
+    }
+
+    .tooltip-custom + .tooltip > .tooltip-inner {
+        background-color: #fff;
+        border: 1px solid #000;
+        color: #000;
+        border-radius: 0;
+    }
+
+    .tooltip-custom + .tooltip > .tooltip-arrow {
+        display: none;
+    }
+
+
+    .custom-tooltip {
+        background-color: #333;
+        border: 0 none;
+        color: #fff !important;
+        left: -52px;
+        /*opacity: 0.9;*/
+        padding: 7px;
+        position: absolute;
+        text-align: center;
+        top: 45px;
+        width: 120px;
+        display: none;
+        z-index: 10000;
+        border: 1px solid #000;
+        color: #000;
+        border-radius: 0;
+    }
+
+    .pad0 {
+        padding: 0;
+    }
+</style>
+<div id="aaDetailPageDiv" class="bodyWrap row" ng-controller="TileViewListController">
+
+    <!--<div class="col-sm-12 pageHeading">
+        <!--<button type="button" class="btn btn-success pull-left toggleBar btn-sm" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"> <i class="fa fa-bars"></i> </button>-->
+    <!--<div class=" pull-left toggleBar toggleHeadingButton" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"> <i class="fa fa-exchange"></i> </div>-->
+    <!--<h4 class="pull-left">1<sup>st</sup> &amp; 2<sup>nd</sup> Intercostal Spaces</h4>-->
+    <!--<div class="pull-right btn-group paddTop4 hidden-xs"> <a href="#" class="btn btn-xs btn-default"><i class="fa fa-minus"></i></a> <a href="#" class="btn btn-xs btn-default"><i class="fa fa-clone"></i></a> <a href="#" class="btn btn-xs btn-default"><i class="fa fa-close"></i></a> </div>
+    <div class="clearfix"></div>-->
+    <!--</div>-->
+    <div class="tools pull-left" style="top:44px;">
+        <div class="toggle-icon toggleBar toggleHeadingButton" id="sideBarToggle" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"></div>
+        <div class="sprit-icon">
+            <div class="col-sm-6"><button onclick="hidePins(event)" id="hidePinBtn" class="btn btn-black btn-sm tooltip-custom" data-toggle="tooltip" data-placement="bottom" title="Hide Pins"></button> </div>
+            <div class="col-sm-6"><button class="btn btn-black btn-sm pull-right tooltip-custom" id="selectedPin" onclick="showSelectedPins(event)" data-toggle="tooltip" data-placement="bottom" title="Show Selected Pins"></button></div>
+            <div class="col-sm-6"><button class="btn btn-primary btn-sm marginTop5 tooltip-custom" id="allPinBtn" onclick="showAllPins(event)" data-toggle="tooltip" data-placement="bottom" title="Show All Pins in System(s)"></button></div>
+            <div class="col-sm-6">
+                <div class="custom-tooltip">Select System</div>
+                <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu221" onclick="systemChange()"></button>
+                <ul class="dropdown-menu" id="bodySystemList">
+                    <li><a id="0" href="#" title="Current Structure" onclick="showSelectedSystemPins(event)">All</a></li>
+                    <li role="separator" class="divider"></li>
+                    <li class="disabledSelectedSystem"><a id="1" href="#" title="Cardiovascular" onclick="showSelectedSystemPins(event)">Cardiovascular</a></li>
+                    <li class="disabledSelectedSystem"><a id="2" href="#" title="Digestive" onclick="showSelectedSystemPins(event)">Digestive</a></li>
+                    <li class="disabledSelectedSystem"><a id="3" href="#" title="Endocrine" onclick="showSelectedSystemPins(event)">Endocrine</a></li>
+                    <li class="disabledSelectedSystem"><a id="4" href="#" title="Immune" onclick="showSelectedSystemPins(event)">Immune</a></li>
+                    <li class="disabledSelectedSystem"><a id="5" href="#" title="Integumentary" onclick="showSelectedSystemPins(event)">Integumentary</a></li>
+                    <li class="disabledSelectedSystem"><a id="6" href="#" title="Lymphatic" onclick="showSelectedSystemPins(event)">Lymphatic</a></li>
+                    <li class="disabledSelectedSystem"><a id="7" href="#" title="Muscular" onclick="showSelectedSystemPins(event)">Muscular</a></li>
+                    <li class="disabledSelectedSystem"><a id="8" href="#" title="Nervous" onclick="showSelectedSystemPins(event)">Nervous</a></li>
+                    <li class="disabledSelectedSystem"><a id="9" href="#" title="Reproductive" onclick="showSelectedSystemPins(event)">Reproductive</a></li>
+                    <li class="disabledSelectedSystem"><a id="10" href="#" title="Respiratory" onclick="showSelectedSystemPins(event)">Respiratory</a></li>
+                    <li class="disabledSelectedSystem"><a id="11" href="#" title="Skeletal" onclick="showSelectedSystemPins(event)">Skeletal</a></li>
+                    <li class="disabledSelectedSystem"><a id="12" href="#" title="Urinary" onclick="showSelectedSystemPins(event)">Urinary</a></li>
+                </ul>
+               </div>
+            <div class="col-sm-12" data-toggle="tooltip" data-placement="top" title="Show/Hide Structure Name Boxes"><button onclick="showHideAnnotation(event)" class="btn btn-black btn-sm marginTop5 btn-block" id="comment-box"></button> </div>
+        </div>
+        <div class="pips-slider" style="margin-top:125px">
+            <h3>Zoom <i class="fa fa-search-plus"></i></h3>
+            <div class="slider" id="vertical-slider"></div>
+        </div>
+    </div>
+
+    <div class="main2">
+        <div class="col-sm-12 stickey-area">
+            <div class="breadcrumb">
+                <div class="">
+                    <div class="input-group col-sm-8 col-xs-7 col-md-10 pull-left">
+                        <!--<input class="form-control input-sm " type="text" placeholder="Anterior cutaneous branch of first intercostal nerve">-->
+                        <!--<select class="form-control input-sm ">
+                          <option>---Select---</option>
+                          <option selected>Anterior cutaneous branch of first intercostal nerve</option>
+                          <option>Anterior cutaneous branch of second intercostal nerve</option>
+                          <option>Anterior cutaneous branch of third intercostal nerve</option>
+                          <option>Anterior intercostal artery</option>
+                          <option>Anterior intercostal vein</option>
+                        </select>-->
+                        <!--<div class="input-group-addon btn btn-primary btn-sm"></div>-->
+                        <input type="text" class="form-control input-sm pull-left" id="selectedTermName" onclick="onSearchAA()" ondblclick="onSearchAA()" onblur="hideSearchList()" ng-model="searchFilter" placeholder=" search...">
+
+                        <div id="backdrop" ng-show="IsSearchVisible">
+                            <div id="searchListDivAA" class="col-sm-12 col-xs-12 col-md-12 col-lg-12 pull-left">
+                                <ul id="termlistfilter" class="form-control dropdown-menu" style="height:90px;width:100%;overflow-y:scroll;position:absolute;display:none;z-index:60001;"></ul>
+                            </div>
+                        </div>
+                    </div>
+                    &nbsp;
+                    <!-- Single button -->
+                    <div class="btn-group pull-left" style="vertical-align:top;">
+
+                        <button type="button" style="padding: 5px 10px 4px 10px !important;border: none;" class="btn btn-success btn-sm" onclick="onSearchAA()" onblur="hideSearchList()">
+                            <!--<img src="~/../content/images/DA/go-to.png" style="height: 30px;width:50px">-->
+                            <i class="fa fa-caret-down" style="font-size:20px;"></i>
+                        </button>
+
+
+                        <!--<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>-->
+                        <!--<ul class="dropdown-menu">
+            <li><a href="#">1<sup>st</sup> &amp; 2<sup>nd</sup> Intercostal Spaces</a></li>
+            <li role="separator" class="divider"></li>
+            <li><a href="#">All</a></li>
+        </ul>-->
+                    </div>
+                    <!--<div class="btn-group">
+                        <button type="button" class="btn btn-primary dropdown-toggle btn-sm" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" id="navigatorMan">
+                            <i class="fa fa-male"></i>
+                        </button>
+                        <ul class="dropdown-menu" style="min-width:auto;">
+                            <li><img src="{navImg}"class="img-responsive"></li>
+                        </ul>
+                    </div>-->
+
+
+                    <div class="btn-group open" id="da-body-nav">
+                        <button id="navigatorBtn" type="button" style="padding:0px 0px 10px 1px !important;background-color:rgba(255,255,255,0.0); border:none;" class="btn btn-primary dropdown-toggle btn-sm" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                            <img src="~/../content/images/DA/navigator-view.png" style="height:30px; width:50px" />
+                        </button>
+
+                        <div class="dropdown-menu" id="navigatorDiv" style="min-height: auto; min-width: auto; margin-left: 15px !important;">
+                            <div id="containment-wrapper" align="center" style="min-width:auto;height:119px; ">
+                                <img id="navimg" alt="" />
+                                <div id="draggable" class="draggable ui-widget-content" ng-mouseup="ScrollCanvasDiv()" ng-style="dragdivposition">
+                                </div>
+                            </div>
+
+                        </div>
+                    </div>
+
+
+                </div>
+            </div>
+        </div>
+        <!--<img id="scream" width="220" height="277" src="~/../../../content/images/noraml-pin.png" style="visibility:hidden" alt="The Scream">-->
+        <!--<img src="../../../content/images/noraml-pin.png" style="visibility:hidden" id="normal-pin"/>-->
+        <div class="col-sm-12">
+            <div class="container-fluid">
+                <div class="row">
+
+                    <div class=" col-sm-12 img-thumbnail canvasDivClass" id="canvasDiv" style="overflow: scroll;">
+                        <canvas id="canvasPaint" ng-click="FreeStylePaint($event)" width="2277" height="725" class="canvas-annotationStyle1"></canvas>
+                        <canvas id="canvas" ng-click="onDrawingCanvasClick($event)" width="2277" height="725" class="canvas-annotationStyle"></canvas>
+
+                        <img id="modItemImage" alt="" title="" style="left:0px;top:0px;position:absolute">
+                        <!--<div class="clearfix">
+
+                           <img id="modItemImage" ng-init="alert('hi')" alt="" title="" class="img-responsive">
+                        </div>
+                        <!--<div class="col-sm-1 img-thumbnail pull-right" align="center"><img src="../../content/images/1000x600.jpg" alt="" title="" class="img-responsive"></div>
+        <div class="clearfix"></div>-->
+                    </div>
+                </div>
+            </div>
+
+
+        </div>
+
+    </div>
+</div>
+<script>
+    $(window).load(function () {
+        $(".stickey-area").sticky();
+    });
+</script>
+<script>
+    $(".tooltip-custom").tooltip({
+        tooltipClass: 'customTooltip'
+    });
+</script>
+<script>
+    $(function () {
+        var $ua = navigator.userAgent;
+        if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
+
+        }
+        else
+        {
+            $("#dropdownMenu221").mouseover(function () {
+                $(".custom-tooltip").css("display", "block");
+            });
+            $("#dropdownMenu221").mouseout(function () {
+                $(".custom-tooltip").css("display", "none");
+            });
+        }
+        
+    });
+</script>
+
+<script>
+    var isSideBarBtnClicked = true;
+    $(document).ready(function () {
+        $('[data-toggle="tooltip"]').tooltip();
+        $("#sideBarToggle").click(function () {
+            if (isSideBarBtnClicked == true) {
+                $(".main2").addClass("active");
+                $(".tools").addClass("tools1");
+                isSideBarBtnClicked = false;
+
+            }
+            else {
+                $(".main2").removeClass("active");
+                $(".tools").removeClass("tools1");
+                isSideBarBtnClicked = true;
+            }
+
+        });
+    });
+</script>
+
+
+<script>
+    $(function () {
+        $("#draggable").draggable();
+    });
+</script>
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/views/da/da-view.html b/400-SOURCECODE/AIAHTML5.Web/app/views/da/da-view.html
index 1d8c561..d658e4f 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/views/da/da-view.html
+++ b/400-SOURCECODE/AIAHTML5.Web/app/views/da/da-view.html
@@ -166,8 +166,8 @@
 
                 <div class="col-xs-6 dropdown hover-tool">
                     <div class="custom-tooltip">Highlight Options</div>
-                    <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" ng-click="LoadBodySystemData()"><img src="content/images/icon-highlight.png" alt="" title=""></button>
-                    <ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
+                    <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu2" ng-click="LoadBodySystemData()"><img src="content/images/icon-highlight.png" alt="" title=""></button>
+                    <ul class="dropdown-menu" id="structureDropdown">
                         <li ng-class="CurrentStructure" ><a href="#" title="Current Structure" 
                     ng-click="removeBodySyetemSelectionClass('CurrentStructure')">Current Structure</a></li>
                      
@@ -205,8 +205,8 @@
             <div class="col-xs-12 pad0">
                 <div class="col-xs-6 hover-gender-tool" ng-init="switchGender()">
                     <div class=" custom-tooltip1">Gender</div>
-                    <button class="btn btn-black btn-sm marginTop5 dropdown-toggle" type="button" id="dropdownMenu4" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> <i class=" fa fa-intersex font16"></i></button>
-                    <ul class="dropdown-menu" aria-labelledby="dropdownMenu3">
+                    <button class="btn btn-black btn-sm marginTop5 dropdown-toggle" type="button" id="dropdownMenu4" onclick="genderChange()"> <i class=" fa fa-intersex font16"></i></button>
+                    <ul class="dropdown-menu" id="genderChangeId">
                         <li ng-class="male">
                             <!--<button type="button" id="btnMale" onclick="OnGenderChange('Male')" class="btn btn-link" >Male</button>-->
                             <a href="#" title="Male" onclick="OnGenderChange(event)">Male</a>
@@ -224,8 +224,8 @@
 
                 <div class="col-xs-6 tooltip-View-custom">
                     <div class="custom-tooltip2">View</div>
-                    <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"><img src="content/images/view.png" alt="" title=""></button>
-                    <ul class="dropdown-menu" aria-labelledby="dropdownMenu3">
+                    <button class="btn btn-black btn-sm pull-right marginTop5" type="button" id="dropdownMenu3" onclick="viewChange()"><img src="content/images/view.png" alt="" title=""></button>
+                    <ul class="dropdown-menu" id="viewID">
                         <!--<li ng-class="AnteriorView"><a href="#" title="Anterior" ng-click="OnViewChange($event)">Anterior</a></li>
                         <li ng-class="LateralView"><a href="#" title="Lateral" ng-click="OnViewChange($event)">Lateral</a></li>
                         <li ng-class="MedialView"><a href="#" title="Medial" ng-click="OnViewChange($event)">Medial</a></li>
@@ -497,7 +497,12 @@
 </script>
 <script>
     $(function () {
+        var $ua = navigator.userAgent;
+        if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
 
+        }
+        else
+        {
         $("#dropdownMenu2").mouseover(function () {
             $(".custom-tooltip").css("display", "block");
         });
@@ -518,7 +523,7 @@
         $("#dropdownMenu3").mouseout(function () {
             $(".custom-tooltip2").css("display", "none");
         });
-
+     }
        
     });
 </script>
diff --git a/400-SOURCECODE/AIAHTML5.Web/themes/default/scripts/bootstrap/3.3.5/bootstrap.js b/400-SOURCECODE/AIAHTML5.Web/themes/default/scripts/bootstrap/3.3.5/bootstrap.js
index 445615e..969c4a7 100644
--- a/400-SOURCECODE/AIAHTML5.Web/themes/default/scripts/bootstrap/3.3.5/bootstrap.js
+++ b/400-SOURCECODE/AIAHTML5.Web/themes/default/scripts/bootstrap/3.3.5/bootstrap.js
@@ -629,28 +629,13 @@ if (typeof jQuery === 'undefined') {
 
   // APPLY TO STANDARD DROPDOWN ELEMENTS
   // ===================================
-  var $ua = navigator.userAgent;
-  if (($ua.match(/(iPod|iPhone|iPad)/i))) {
-  $(document)
-       .on('click.bs.dropdown.data-api', clearMenus)
-       .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
-       .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
-       .on('touchstart.bs.dropdown.data-api', clearMenus)
-       .on('touchstart.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
-       .on('touchstart.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
-       .on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown)
-       .on('keydown.bs.dropdown.data-api', '.dropdown-menu', Dropdown.prototype.keydown)
-}
-else
-{
-        $(document)
-      .on('click.bs.dropdown.data-api', clearMenus)
-      .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
-      .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
-      .on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown)
-      .on('keydown.bs.dropdown.data-api', '.dropdown-menu', Dropdown.prototype.keydown)
-}
 
+  $(document)
+    .on('click.bs.dropdown.data-api', clearMenus)
+    .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
+    .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
+    .on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown)
+    .on('keydown.bs.dropdown.data-api', '.dropdown-menu', Dropdown.prototype.keydown)
 }(jQuery);
 
 /* ========================================================================