diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
index ec91638..f47496c 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
@@ -6800,7 +6800,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
                         $("#text_area").val('');
                         $("#text_area").css({ " font-family": "'Verdana, sans-serif'", "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
-
+                        $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": "#000000" });
+                        // $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
 
                         $("#text-italic").removeClass("ActiveFormattingButtonClass");
 
@@ -6849,7 +6850,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
                 $("#annotationTextModal").modal("toggle");
                 $('.btnCursor').trigger('click');
-
+                $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": "#000000" });
+               // $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
                 $("#text_area").val('');
 
                 $("#text_area").css({ " font-family": 'Verdana, sans-serif', "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
@@ -7011,8 +7013,9 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                           $("#text_area").css("color", $rootScope.TextPropertyArray[_rectLayerOnSaveSplitInt].FontColor);
                           $("#text_area").css("font-family", $rootScope.TextPropertyArray[_rectLayerOnSaveSplitInt].FontFamily);
                           $("#text_area").css("text-decoration", $rootScope.TextPropertyArray[_rectLayerOnSaveSplitInt].TextDecoration);
-
-
+                          $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": $rootScope.TextPropertyArray[_rectLayerOnSaveSplitInt].FontColor });
+                        //  $(".ActiveDefaultColorAnnotation").css({ "background-color": $rootScope.TextPropertyArray[_rectLayerOnSaveSplitInt].FontColor + "!important" });
+                        //  $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
 
 
                           //adding text text decoration active class in text edit pop-up
@@ -7132,7 +7135,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             $("#text_area").val('');
             $("#text_area").css({ " font-family": "'Verdana, sans-serif'", "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
 
-
+            $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": "#000000" });
             $("#text-italic").removeClass("ActiveFormattingButtonClass");
 
             $("#text-bold").removeClass("ActiveFormattingButtonClass");
@@ -7255,8 +7258,9 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                           $("#text_area").css("color", _modifiedFontColor);
                           $("#text_area").css("font-family", _modifiedFontFamily);
                           $("#text_area").css("text-decoration", _modifiedFontDecoration);
-
-
+                          $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": _modifiedFontColor });
+                        //  $(".ActiveDefaultColorAnnotation").css({ "background-color": _modifiedFontColor + "!important" });
+                        //  $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
 
                           //adding text text decoration active class in text edit pop-up
                           if (_modifiedFontDecoration == "underline") {
diff --git a/400-SOURCECODE/AIAHTML5.Web/index.html b/400-SOURCECODE/AIAHTML5.Web/index.html
index d0ebf19..6f840f5 100644
--- a/400-SOURCECODE/AIAHTML5.Web/index.html
+++ b/400-SOURCECODE/AIAHTML5.Web/index.html
@@ -42,7 +42,9 @@
     <!--Annotation Toolbar: Jcanvas-->
     <style>
 
-
+        /*.ActiveDefaultColorAnnotation {
+            background-color: #000000!important;
+        }*/
         .ActiveFormattingButtonClass {
             background-color: #1B92D0 !important;
         }
@@ -1199,12 +1201,14 @@
     <script type="text/javascript">
         $(function () {
             var colpick = $('.demo').each(function () {
+
                 $(this).minicolors({
                     control: $(this).attr('data-control') || 'hue',
                     inline: $(this).attr('data-inline') === 'true',
                     letterCase: 'lowercase',
                     opacity: false,
                     change: function (hex, opacity) {
+                        $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").removeClass("ActiveDefaultColorAnnotation");
                         if (!hex) return;
                         if (opacity) hex += ', ' + opacity;
                         try {
@@ -1338,6 +1342,8 @@
 
     <script>
         $(document).ready(function () {
+            //  $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
+            $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": "#000000" });
             var borderWidth = 1;
             var borderColor = "#000";
             $("#borderWidthCanvasElement").change(function () {
@@ -1353,9 +1359,10 @@
                 }
             });
 
+            
 
             $('.borderColorCanvasPreview').each(function () {
-
+             //   $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
                 $(this).minicolors({
                     control: $(this).attr('data-control') || 'hue',
                     defaultValue: $(this).attr('data-defaultValue') || '',
@@ -1371,8 +1378,8 @@
                         if (opacity) value += ', ' + opacity;
                         if (typeof console === 'object') {
                             console.log(value);
-
-                            borderColor = value;
+                           
+                           borderColor = value;
                             $("#imgOpacity").parent().css("border", borderWidth + "px" + " " + "solid" + borderColor);
 
 
@@ -1381,12 +1388,12 @@
                     theme: 'bootstrap'
                 });
 
+             
             });
 
 
-
             $('.outerBackgroundColor').each(function () {
-
+           
                 $(this).minicolors({
                     control: $(this).attr('data-control') || 'hue',
                     defaultValue: $(this).attr('data-defaultValue') || '',