diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
index feee7f4..d6de654 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
@@ -120,13 +120,16 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", 
             $rootScope.isAnnotationWindowOpen = true;
             $(".annotationTollbar").css("display", "block");
             $rootScope.$broadcast('annotationToolEvent', true);
-
+            $("#canvasPaint").css("display", "none");
+            $("#canvas").css("display", "none");
         }
 
         $rootScope.CloseAnnotationTool = function () {
             console.log('close')
             $(".annotationTollbar").css("display", "none");
             $rootScope.isAnnotationWindowClose = true;
+            $("#canvasPaint").css("display", "none");
+            $("#canvas").css("display", "none");
         }
 
         $rootScope.OnIdentifyClick = function () {
@@ -188,6 +191,8 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", 
         }
 
         $rootScope.DrawRectangle = function (e) {
+            $("#canvasPaint").css("display", "block");
+            $("#canvas").css("display", "block");
             $rootScope.switchCanvas();
             $rootScope.shapeType = "Rectangle";
             $('.btnCursor').removeClass('activebtncolor');
@@ -197,6 +202,8 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", 
         $rootScope.paintBrush = function () {
             //      debugger;
             //  $('.btnCursor').addClass('activebtncolor');
+            $("#canvasPaint").css("display", "block");
+            $("#canvas").css("display", "block");
             $rootScope.switchCanvasToPaintCanvas();
             $rootScope.shapeType = "FreeStylePaint";
             var a = $("#amount-2").val();
@@ -230,6 +237,8 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", 
         }
 
         $rootScope.DrawCircle = function (e) {
+            $("#canvasPaint").css("display", "block");
+            $("#canvas").css("display", "block");
             $rootScope.switchCanvas();
             $rootScope.shapeType = "Circle";
             $('.btnCursor').removeClass('activebtncolor');
@@ -238,6 +247,8 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", 
         }
 
         $rootScope.DrawArrow = function (e) {
+            $("#canvasPaint").css("display", "block");
+            $("#canvas").css("display", "block");
             $rootScope.switchCanvas();
             $rootScope.shapeType = "Arrow";
             $('.btnCursor').removeClass('activebtncolor');
@@ -245,6 +256,8 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", 
             $(".btn-annotation-arrow").addClass("activebtncolor");
         }
         $rootScope.DrawText = function () {
+            $("#canvasPaint").css("display", "block");
+            $("#canvas").css("display", "block");
             $rootScope.switchCanvas();
 
             $rootScope.shapeType = "TextArea";
@@ -256,6 +269,8 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", 
         }
 
         $rootScope.DrawPolygon = function () {
+            $("#canvasPaint").css("display", "block");
+            $("#canvas").css("display", "block");
             $rootScope.shapeType = "DrawPolygon";
 
         }
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/widget/TopMenu.html b/400-SOURCECODE/AIAHTML5.Web/app/widget/TopMenu.html
index 594a5e5..31a5072 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/widget/TopMenu.html
+++ b/400-SOURCECODE/AIAHTML5.Web/app/widget/TopMenu.html
@@ -29,7 +29,7 @@
                 <!--<li><a href="#" ng-click="ShowListManager()">List Manager</a></li>-->
                
                 <li><a href="#" ng-click="ShowListManager()">List Manager</a></li>
-                <li><a href="#">Annotation Toolbar</a></li>
+                <li><a href="#" ng-click="ShowAnnotationWindow()">Annotation Toolbar</a></li>
                 <li><a href="#">Add to Existing Curriculum</a></li>
                 <li><a data-toggle="modal" data-target="#modal-settings" class="cursor-pointer">Settings</a></li>
                 <li role="separator" class="divider"></li>
diff --git a/400-SOURCECODE/AIAHTML5.Web/index.html b/400-SOURCECODE/AIAHTML5.Web/index.html
index 4b4da9e..9437662 100644
--- a/400-SOURCECODE/AIAHTML5.Web/index.html
+++ b/400-SOURCECODE/AIAHTML5.Web/index.html
@@ -56,6 +56,24 @@
                 border-color: #1B92D0 !important;
                 color: #ffffff !important;
             }*/
+
+        .custom-tooltip-annotation {
+            background-color: #fff;
+            border: 0 none;
+            color: #000;
+            left: -52px;
+            opacity: 0.9;
+            padding: 3px 0;
+            position: absolute;
+            text-align: center;
+            top: 41px;
+            width: 120px;
+            display: none;
+            z-index: 10000;
+            border: 1px solid #000;
+            color: #000;
+            border-radius: 0;
+        }
     </style>
 
 
@@ -396,11 +414,13 @@
                             <h5>Mode</h5>
 
                             <div class="btn-group btn-group-justified" role="group" aria-label="...">
-                                <div class="btn-group" role="group">
-                                    <button type="button" class="btn btn-sm btn-success" ng-click="OnIdentifyClick()">Identify</button>
+                                <div class="btn-group" role="group" tooltip>
+                                    <div id="identify-block"  style="display: none; font-size:13px;">Identify Mode</div>
+                                    <button id="OnIdentify" type="button"  class="btn btn-sm btn-success" ng-click="OnIdentifyClick()">Identify</button>
                                 </div>
                                 <div class="btn-group" role="group">
-                                    <button type="button" class="btn btn-sm btn-success" ng-click="DrawingMode()">Draw</button>
+                                    <div id="draw-block"  style="display: none; font-size: 13px;">Draw Mode</div>
+                                    <button id="DrawMode" type="button" ng-click="DrawingMode()" class="btn btn-sm btn-success">Draw</button>
                                 </div>
                             </div>
 
@@ -1326,7 +1346,32 @@
 
 
 
+    <script>
+        $(function () {
+           
+
+            $("#OnIdentify").on('mouseover', function () {
+                $("#identify-block").addClass("custom-tooltip-annotation");
+                $(".custom-tooltip-annotation").css('display', 'block');
+            }).on('mouseout', function () {
+               // $("#identify-block").removeClass("custom-tooltip-annotation");
+                $(".custom-tooltip-annotation").css('display', 'none');
+                $("#identify-block").removeClass("custom-tooltip-annotation");
+            });
+
+         
+            $("#DrawMode").on('mouseover', function () {
+                $("#draw-block").addClass("custom-tooltip-annotation");
+                $(".custom-tooltip-annotation").css('display', 'block');
+          
+            }).on('mouseout', function () {
+               
+                $(".custom-tooltip-annotation").css('display', 'none');
+                $("#draw-block").removeClass("custom-tooltip-annotation");
+            });
 
+        });
+    </script>