diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
index 312857a..4f77091 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
@@ -141,7 +141,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                 $rootScope.disableSubMenu = "";
                 $rootScope.CloseAnnotationTool();
                 $rootScope.CloseListManager();
-                angular.element('#modal-settings').modal('hide');
+                angular.element('#modal-settings').css('display','none');
                 if ($location.url() == "/lab-exercises") {
 
                     $rootScope.menuLabExer = 0;
@@ -345,9 +345,13 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
         $rootScope.ShowSettingWindow = function () {
             if ($(".annotationTollbar").css("display") == "block") {
                 // alert("already open");
+                $('#modal-settings').css("display", "none");
+                $("#modelsettingsbackground").css("display", "none");
             }
             else {
-                $('#modal-settings').modal('toggle');
+              
+                $('#modal-settings').css("display", "block");
+                $("#modelsettingsbackground").css("display", "block");
             }
 
         }
@@ -2382,16 +2386,27 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
 
             $rootScope.setEthncitySettings($rootScope.globalSetting.ethnicity);
             $rootScope.setModestySettings($rootScope.globalSetting.modesty);
-            $('#modal-settings').modal('hide');
+         
+            $('#modal-settings').css("display", "none");
+            $("#modelsettingsbackground").css("display", "none");
         }
 
         $rootScope.UpdateAndCloseSetting = function (setting) {
 
             $rootScope.UpdateSetting(setting);
-            $('#modal-settings').modal('hide');
+         
+            $('#modal-settings').css("display", "none");
+            $("#modelsettingsbackground").css("display", "none");
 
         };
 
+
+        $rootScope.CloseSettingPopup = function () {
+            $('#modal-settings').css("display", "none");
+            $("#modelsettingsbackground").css("display", "none");
+        }
+
+
         $rootScope.UpdateSetting = function (setting) {
             var isReloadingViewRequired = false;
             //1.
@@ -2448,7 +2463,9 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                   }
                 }
                 else {
-                    $('#modal-settings').modal('hide');
+                    
+                    $('#modal-settings').css("display", "none");
+                    $("#modelsettingsbackground").css("display", "none");
                 }
 
         };
diff --git a/400-SOURCECODE/AIAHTML5.Web/index.html b/400-SOURCECODE/AIAHTML5.Web/index.html
index 0a9973b..d078cbd 100644
--- a/400-SOURCECODE/AIAHTML5.Web/index.html
+++ b/400-SOURCECODE/AIAHTML5.Web/index.html
@@ -398,1392 +398,1395 @@
         </div>
 
         <!--Settings modal-->
-        <div class="modal fade" id="modal-settings" tabindex="-1" role="dialog" aria-labelledby="myModalLabel2">
-            <div class="modal-dialog modal-sm" role="document">
-                <form>
-                    <div ng-init="loadsettings()" class="modal-content" id="setting-modal-dark">
-                        <div class="modal-header annotation-modal-header">
-                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-                            <h4 class="modal-title" id="myModalLabel2">Settings</h4>
-                        </div>
-                        <div class="modal-body">
-                            <div class="paddTop15">
-                                <!-- Nav tabs -->
-                                <ul class="nav nav-tabs" role="tablist">
-                                    <li role="presentation" ng-class="{'active':SettingsTab==1}"><a role="tab" class="padd5" ng-click="SetSettingActiveTab(1)">Appearance</a></li>
-                                    <li role="presentation" ng-class="{'active':SettingsTab==2}"><a role="tab" class="padd5" ng-click="SetSettingActiveTab(2)">Lexicons</a></li>
-                                    <li role="presentation" ng-class="{'active':SettingsTab==3}"><a role="tab" class="padd5" ng-click="SetSettingActiveTab(3)">Dissectible</a></li>
-
-                                </ul>
-                                <!-- Tab panes -->
-                                <div class="tab-content">
-                                    <div role="tabpanel" ng-class="{'tab-pane active' : SettingsTab === 1,'tab-pane' : SettingsTab !==1 }" id="appearance">
-                                        <div class="row">
-                                            <div class="col-sm-12">
-                                                <div class="well well-sm no-margin-btm">
-                                                    <h5>System Font</h5>
-                                                    <div class="form-group">
-                                                        <label for="SystemFont" class="font13">Sample</label>
-                                                        <input type="text" class="form-control" id="SystemFont" value="AaBbYyZz" disabled>
+        <!--<div id="modal-settings" style="z-index: 1000000000; background: white;width: 302px;position:absolute;left:40%;right:0;top:70px;">-->
+        <div id="modelsettingsbackground" style="background-color: black; bottom: 0; display: none; height: 100%; left: 0; opacity: 0.5; position: fixed; right: 0; top: 0; width: 100%; z-index: 12000000;"></div>    
+        <div id="modal-settings" style="display:none;z-index: 1000000000;height:auto;width: 300px;position:absolute;left:40%;right:0;top:70px;">
+                <div role="document">
+                    <form>
+                        <div ng-init="loadsettings()" class="modal-content" id="setting-modal-dark">
+                            <div class="modal-header annotation-modal-header">
+                                <button type="button" class="close" data-dismiss="modal" ng-click="CloseSettingPopup()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+                                <h4 class="modal-title" id="myModalLabel2">Settings</h4>
+                            </div>
+                            <div class="modal-body">
+                                <div class="paddTop15">
+                                    <!-- Nav tabs -->
+                                    <ul class="nav nav-tabs" role="tablist">
+                                        <li role="presentation" ng-class="{'active':SettingsTab==1}"><a role="tab" class="padd5" ng-click="SetSettingActiveTab(1)">Appearance</a></li>
+                                        <li role="presentation" ng-class="{'active':SettingsTab==2}"><a role="tab" class="padd5" ng-click="SetSettingActiveTab(2)">Lexicons</a></li>
+                                        <li role="presentation" ng-class="{'active':SettingsTab==3}"><a role="tab" class="padd5" ng-click="SetSettingActiveTab(3)">Dissectible</a></li>
+
+                                    </ul>
+                                    <!-- Tab panes -->
+                                    <div class="tab-content">
+                                        <div role="tabpanel" ng-class="{'tab-pane active' : SettingsTab === 1,'tab-pane' : SettingsTab !==1 }" id="appearance">
+                                            <div class="row">
+                                                <div class="col-sm-12">
+                                                    <div class="well well-sm no-margin-btm">
+                                                        <h5>System Font</h5>
+                                                        <div class="form-group">
+                                                            <label for="SystemFont" class="font13">Sample</label>
+                                                            <input type="text" class="form-control" id="SystemFont" value="AaBbYyZz" disabled>
+                                                        </div>
+                                                        <button class="btn btn-success btn-sm" data-toggle="modal" data-target="#modal-change">Change</button>
+                                                        <button class="btn btn-success btn-sm">Default</button>
                                                     </div>
-                                                    <button class="btn btn-success btn-sm" data-toggle="modal" data-target="#modal-change">Change</button>
-                                                    <button class="btn btn-success btn-sm">Default</button>
                                                 </div>
                                             </div>
                                         </div>
-                                    </div>
-                                    <div role="tabpanel" ng-class="{'tab-pane active' : SettingsTab === 2,'tab-pane' : SettingsTab !==2 }" id="lexicons">
-                                        <div class="row paddingTopBtm10">
-                                            <div class="col-sm-6">
-                                                <div class="form-group">
-                                                    <label for="SystemFont" class="font13">Primary Lexicon</label>
-                                                    <input type="text" class="form-control" value="English" disabled>
-                                                    <button class="btn btn-sm btn-success btn-block marginTop5">Change</button>
-                                                </div>
+                                        <div role="tabpanel" ng-class="{'tab-pane active' : SettingsTab === 2,'tab-pane' : SettingsTab !==2 }" id="lexicons">
+                                            <div class="row paddingTopBtm10">
+                                                <div class="col-sm-6">
+                                                    <div class="form-group">
+                                                        <label for="SystemFont" class="font13">Primary Lexicon</label>
+                                                        <input type="text" class="form-control" value="English" disabled>
+                                                        <button class="btn btn-sm btn-success btn-block marginTop5">Change</button>
+                                                    </div>
 
-                                                <div class="form-group">
-                                                    <label for="SystemFont" class="font13">Secondary Lexicon</label>
-                                                    <textarea class="form-control" rows="3"></textarea>
-                                                </div>
-                                                <div class="form-group">
-                                                    <button class="btn btn-sm btn-success" disabled>Add</button>
-                                                    <button class="btn btn-sm btn-success">Remove</button>
+                                                    <div class="form-group">
+                                                        <label for="SystemFont" class="font13">Secondary Lexicon</label>
+                                                        <textarea class="form-control" rows="3"></textarea>
+                                                    </div>
+                                                    <div class="form-group">
+                                                        <button class="btn btn-sm btn-success" disabled>Add</button>
+                                                        <button class="btn btn-sm btn-success">Remove</button>
+                                                    </div>
                                                 </div>
-                                            </div>
-                                            <div class="col-sm-6">
-                                                <div class="form-group">
-                                                    <label for="SystemFont" class="font13">Available Lexicon</label>
-                                                    <select multiple class="form-control" size="8">
-                                                        <option selected value="1">English</option>
-                                                        <option>French</option>
-                                                        <option>German</option>
-                                                        <option>Hungarian</option>
-                                                        <option>Italian</option>
-                                                        <option>Japanese (Kanji)</option>
-                                                        <option>Japanese (Yomi)</option>
-                                                        <option>Portuguese</option>
-                                                        <option>Spanish</option>
-                                                        <option>Swedish</option>
-                                                    </select>
+                                                <div class="col-sm-6">
+                                                    <div class="form-group">
+                                                        <label for="SystemFont" class="font13">Available Lexicon</label>
+                                                        <select multiple class="form-control" size="8">
+                                                            <option selected value="1">English</option>
+                                                            <option>French</option>
+                                                            <option>German</option>
+                                                            <option>Hungarian</option>
+                                                            <option>Italian</option>
+                                                            <option>Japanese (Kanji)</option>
+                                                            <option>Japanese (Yomi)</option>
+                                                            <option>Portuguese</option>
+                                                            <option>Spanish</option>
+                                                            <option>Swedish</option>
+                                                        </select>
+                                                    </div>
+                                                    <p class="font11"><strong>Note :</strong> Some languages require special system fonts to display correctly</p>
                                                 </div>
-                                                <p class="font11"><strong>Note :</strong> Some languages require special system fonts to display correctly</p>
+                                                <div class="clearfix"></div>
                                             </div>
-                                            <div class="clearfix"></div>
                                         </div>
-                                    </div>
-                                    <div role="tabpanel" id="dissectible" ng-class="{'tab-pane active' : SettingsTab === 3,'tab-pane' : SettingsTab !==3 }">
-                                        <div class="">
-                                            <div class="col-sm-12">
-                                                <h5 class="bolder font13 no-margin-top">Skin Tones</h5>
-                                                <div class="skin-tones">
-                                                    <div align="center">
-                                                        <div class="col-sm-5">
-                                                            <button id="btnEthnicW" class="thumbnail skinmarginbtm6" ng-model="formsetting.ethnicity" ng-click="ChangeEthnicity(formsetting,'W')">
-                                                                <img src="~/../content/images/common/skin1.jpg" alt="">
-                                                            </button>
-                                                        </div>
-                                                        <div class="col-sm-5">
-                                                            <button id="btnEthnicB" class="thumbnail skinmarginbtm6" ng-model="formsetting.ethnicity" ng-click="ChangeEthnicity(formsetting,'B')">
-                                                                <img src="~/../content/images/common/skin2.jpg" alt="">
-                                                            </button>
-                                                        </div>
-                                                        <div class="col-sm-5">
-                                                            <button id="btnEthnicL" class="thumbnail skinmarginbtm6" ng-model="formsetting.ethnicity" ng-click="ChangeEthnicity(formsetting,'A')">
-                                                                <img src="~/../content/images/common/skin3.jpg" alt="">
-                                                            </button>
-                                                        </div>
-                                                        <div class="col-sm-5">
-                                                            <button id="btnEthnicA" class="thumbnail skinmarginbtm6" ng-model="formsetting.ethnicity" ng-click="ChangeEthnicity(formsetting,'L')">
-                                                                <img src="~/../content/images/common/skin4.jpg" alt="">
-                                                            </button>
+                                        <div role="tabpanel" id="dissectible" ng-class="{'tab-pane active' : SettingsTab === 3,'tab-pane' : SettingsTab !==3 }">
+                                            <div class="">
+                                                <div class="col-sm-12">
+                                                    <h5 class="bolder font13 no-margin-top">Skin Tones</h5>
+                                                    <div class="skin-tones">
+                                                        <div align="center">
+                                                            <div class="col-sm-5">
+                                                                <button id="btnEthnicW" class="thumbnail skinmarginbtm6" ng-model="formsetting.ethnicity" ng-click="ChangeEthnicity(formsetting,'W')">
+                                                                    <img src="~/../content/images/common/skin1.jpg" alt="">
+                                                                </button>
+                                                            </div>
+                                                            <div class="col-sm-5">
+                                                                <button id="btnEthnicB" class="thumbnail skinmarginbtm6" ng-model="formsetting.ethnicity" ng-click="ChangeEthnicity(formsetting,'B')">
+                                                                    <img src="~/../content/images/common/skin2.jpg" alt="">
+                                                                </button>
+                                                            </div>
+                                                            <div class="col-sm-5">
+                                                                <button id="btnEthnicL" class="thumbnail skinmarginbtm6" ng-model="formsetting.ethnicity" ng-click="ChangeEthnicity(formsetting,'A')">
+                                                                    <img src="~/../content/images/common/skin3.jpg" alt="">
+                                                                </button>
+                                                            </div>
+                                                            <div class="col-sm-5">
+                                                                <button id="btnEthnicA" class="thumbnail skinmarginbtm6" ng-model="formsetting.ethnicity" ng-click="ChangeEthnicity(formsetting,'L')">
+                                                                    <img src="~/../content/images/common/skin4.jpg" alt="">
+                                                                </button>
+                                                            </div>
                                                         </div>
                                                     </div>
-                                                </div>
 
-                                            </div>
-                                        </div>
-                                        <div class="">
-                                            <div class="col-sm-6">
-                                                <h5 class="font13 bolder">Modesty Setting</h5>
-                                                <img src="~/../content/images/common/adam-leaf.png" alt="" class="pull-left marginR5">
-                                                <div class="radio">
-                                                    <label>
-                                                        <input type="radio" ng-checked="isModestyOn" ng-model="formsetting.modesty" value="Y" name="modestyRadios" id="modon" ng-click="ChangeModesty(formsetting,'Y')">
-                                                        <span class="">On</span>
-                                                    </label>
-                                                </div>
-                                                <div class="radio">
-                                                    <label>
-                                                        <input type="radio" ng-checked="isModestyOff" ng-model="formsetting.modesty" value="N" name="modestyRadios" id="modoff" ng-click="ChangeModesty(formsetting,'N')">
-                                                        <span class="">Off</span>
-                                                    </label>
                                                 </div>
                                             </div>
-                                            <div class="col-sm-6">
-                                                <h5 class="font13 bolder">Annotation</h5>
-                                                <div class="checkbox no-margin">
-                                                    <!--Settings > The entire highlighted part should be active-->
-                                                    <label class="font11 no-margin-btm">
-                                                        <input type="checkbox" value="" checked>
-                                                        Erase Annotations when changing layers
-                                                    </label>
+                                            <div class="">
+                                                <div class="col-sm-6">
+                                                    <h5 class="font13 bolder">Modesty Setting</h5>
+                                                    <img src="~/../content/images/common/adam-leaf.png" alt="" class="pull-left marginR5">
+                                                    <div class="radio">
+                                                        <label>
+                                                            <input type="radio" ng-checked="isModestyOn" ng-model="formsetting.modesty" value="Y" name="modestyRadios" id="modon" ng-click="ChangeModesty(formsetting,'Y')">
+                                                            <span class="">On</span>
+                                                        </label>
+                                                    </div>
+                                                    <div class="radio">
+                                                        <label>
+                                                            <input type="radio" ng-checked="isModestyOff" ng-model="formsetting.modesty" value="N" name="modestyRadios" id="modoff" ng-click="ChangeModesty(formsetting,'N')">
+                                                            <span class="">Off</span>
+                                                        </label>
+                                                    </div>
+                                                </div>
+                                                <div class="col-sm-6">
+                                                    <h5 class="font13 bolder">Annotation</h5>
+                                                    <div class="checkbox no-margin">
+                                                        <!--Settings > The entire highlighted part should be active-->
+                                                        <label class="font11 no-margin-btm">
+                                                            <input type="checkbox" value="" checked>
+                                                            Erase Annotations when changing layers
+                                                        </label>
+                                                    </div>
                                                 </div>
                                             </div>
                                         </div>
                                     </div>
                                 </div>
                             </div>
+                            <div class="modal-footer">
+                                <button type="button" class="btn btn-primary" ng-click="UpdateAndCloseSetting(formsetting)">OK</button>
+                                <!--<button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>-->
+                                <button type="button" class="btn btn-primary" ng-click="CloseSetting()">Cancel</button>
+                                <button type="button" class="btn btn-primary" ng-click="UpdateSetting(formsetting)">Apply</button>
+                            </div>
                         </div>
-                        <div class="modal-footer">
-                            <button type="button" class="btn btn-primary" ng-click="UpdateAndCloseSetting(formsetting)">OK</button>
-                            <!--<button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>-->
-                            <button type="button" class="btn btn-primary" ng-click="CloseSetting()">Cancel</button>
-                            <button type="button" class="btn btn-primary" ng-click="UpdateSetting(formsetting)">Apply</button>
-                        </div>
-                    </div>
-                </form>
+                    </form>
+                </div>
             </div>
-        </div>
-
-        <!--Annotation Modal-->
-        <div class="annotationTollbar" style="width: 300px;position: fixed; top: 80px; right: 20px; display: none; z-index: 1200000;">
-            <div class="annotationbar">
-                <div class="modal-content">
-                    <div class="modal-header annotation-modal-header">
-                        <button type="button" class="close" aria-label="Close" ng-click="CloseAnnotationTool()"><span aria-hidden="true">&times;</span></button>
-                        <h4 class="modal-title" id="myModalLabel">Annotation</h4>
-                    </div>
-                    <div class="modal-body" id="AnnotaionPopupDiv">
-                        <div class="row">
-                            <div class="col-sm-12">
-                                <h5>Mode</h5>
 
-                                <div class="btn-group btn-group-justified" role="group" aria-label="...">
-                                    <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">
-                                        <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>
+            <!--Annotation Modal-->
+            <div class="annotationTollbar" style="width: 300px;position: fixed; top: 80px; right: 20px; display: none; z-index: 1200000;">
+                <div class="annotationbar">
+                    <div class="modal-content">
+                        <div class="modal-header annotation-modal-header">
+                            <button type="button" class="close" aria-label="Close" ng-click="CloseAnnotationTool()"><span aria-hidden="true">&times;</span></button>
+                            <h4 class="modal-title" id="myModalLabel">Annotation</h4>
+                        </div>
+                        <div class="modal-body" id="AnnotaionPopupDiv">
+                            <div class="row">
+                                <div class="col-sm-12">
+                                    <h5>Mode</h5>
 
-                            </div>
-                            <div class="col-sm-12">
-                                <h5>Tools</h5>
-                                <div class="well well-popup">
-                                    <div class="" aria-label="...">
-                                        <div class="" role="group" align="center">
-                                            <div id="cursor-block" style="display: none; font-size:13px;"></div>
-                                            <button type="button" class="btn btn-black-annotation btn-xs mrgnBtm5 btnCursor" ng-mouseover="mouseMoveToolTip(75, 60, 120, 'Select Cursor(s)')" ng-mouseleave="mouseOutToolTip()" ng-click="Cursor()"><img src="content/images/icon-identity.png" alt="" title=""></button>
-                                        <button type="button" class="btn btn-black-annotation btn-xs mrgnBtm5 btn-annotation btn-annotation-pin" ng-mouseover="mouseMoveToolTip(75, 100, 120, 'Draw Pin')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawPin($event)"><img src="content/images/draw-pin.png" alt="" title=""></button>
-                                            <button type="button" class="btn btn-black-annotation btn-xs mrgnBtm5 btn-annotation btn-annotation-arrow" ng-mouseover="mouseMoveToolTip(75, 120, 120, 'Draw Arrow')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawArrow($event)"><img src="content/images/draw-arrow.png" alt="" title=""></button>
-                                            <button type="button" class="btn btn-black-annotation btn-xs mrgnBtm5 btn-annotation btn-annotation-Text" ng-mouseover="mouseMoveToolTip(75, 140, 120, 'Draw Text')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawText($event)"><img src="content/images/draw-text.png" alt="" title=""></button>
+                                    <div class="btn-group btn-group-justified" role="group" aria-label="...">
+                                        <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="" role="group" align="center">
-                                        <button type="button" class="btn btn-black-annotation btn-xs btn-annotation btn-annotation-line" ng-mouseover="mouseMoveToolTip(95, 60, 120, 'Draw Line')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawLine($event)"><img src="content/images/draw-line.png" alt="" title=""></button>
-                                            <button type="button" class="btn btn-black-annotation btn-xs btn-annotation btn-annotation-rectangle" ng-mouseover="mouseMoveToolTip(95, 100, 120, 'Draw Rectangle')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawRectangle($event)"><img src="content/images/draw-rec.png" alt="" title=""></button>
-                                            <button type="button" class="btn btn-black-annotation btn-xs btn-annotation btn-annotation-circle" ng-mouseover="mouseMoveToolTip(95, 120, 120, 'Draw Circle')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawCircle($event)"><img src="content/images/draw-cir.png" alt="" title=""></button>
-                                        <!--<button type="button" class="btn btn-black-annotation btn-xs btn-annotation" ng-mouseover="mouseMoveToolTip(95, 140, 120, 'Draw Polygon')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawPolygon($event)"><img src="content/images/draw-poly.png" alt="" title=""></button>-->
+                                        <div class="btn-group" role="group">
+                                            <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>
+
                                 </div>
-                            <div class="well-popup well blankshapediv" ng-mouseover="mouseMoveToolTip(200, 170, 120, 'Edit Style')" ng-mouseleave="mouseOutToolTip()">
-                                    <!--#7931-->
+                                <div class="col-sm-12">
+                                    <h5>Tools</h5>
+                                    <div class="well well-popup">
+                                        <div class="" aria-label="...">
+                                            <div class="" role="group" align="center">
+                                                <div id="cursor-block" style="display: none; font-size:13px;"></div>
+                                                <button type="button" class="btn btn-black-annotation btn-xs mrgnBtm5 btnCursor" ng-mouseover="mouseMoveToolTip(75, 60, 120, 'Select Cursor(s)')" ng-mouseleave="mouseOutToolTip()" ng-click="Cursor()"><img src="content/images/icon-identity.png" alt="" title=""></button>
+                                                <button type="button" class="btn btn-black-annotation btn-xs mrgnBtm5 btn-annotation btn-annotation-pin" ng-mouseover="mouseMoveToolTip(75, 100, 120, 'Draw Pin')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawPin($event)"><img src="content/images/draw-pin.png" alt="" title=""></button>
+                                                <button type="button" class="btn btn-black-annotation btn-xs mrgnBtm5 btn-annotation btn-annotation-arrow" ng-mouseover="mouseMoveToolTip(75, 120, 120, 'Draw Arrow')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawArrow($event)"><img src="content/images/draw-arrow.png" alt="" title=""></button>
+                                                <button type="button" class="btn btn-black-annotation btn-xs mrgnBtm5 btn-annotation btn-annotation-Text" ng-mouseover="mouseMoveToolTip(75, 140, 120, 'Draw Text')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawText($event)"><img src="content/images/draw-text.png" alt="" title=""></button>
+                                            </div>
+                                            <div class="" role="group" align="center">
+                                                <button type="button" class="btn btn-black-annotation btn-xs btn-annotation btn-annotation-line" ng-mouseover="mouseMoveToolTip(95, 60, 120, 'Draw Line')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawLine($event)"><img src="content/images/draw-line.png" alt="" title=""></button>
+                                                <button type="button" class="btn btn-black-annotation btn-xs btn-annotation btn-annotation-rectangle" ng-mouseover="mouseMoveToolTip(95, 100, 120, 'Draw Rectangle')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawRectangle($event)"><img src="content/images/draw-rec.png" alt="" title=""></button>
+                                                <button type="button" class="btn btn-black-annotation btn-xs btn-annotation btn-annotation-circle" ng-mouseover="mouseMoveToolTip(95, 120, 120, 'Draw Circle')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawCircle($event)"><img src="content/images/draw-cir.png" alt="" title=""></button>
+                                                <!--<button type="button" class="btn btn-black-annotation btn-xs btn-annotation" ng-mouseover="mouseMoveToolTip(95, 140, 120, 'Draw Polygon')" ng-mouseleave="mouseOutToolTip()" ng-click="DrawPolygon($event)"><img src="content/images/draw-poly.png" alt="" title=""></button>-->
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="well-popup well blankshapediv" ng-mouseover="mouseMoveToolTip(200, 170, 120, 'Edit Style')" ng-mouseleave="mouseOutToolTip()">
+                                        <!--#7931-->
 
-                                    <div id="edit-block" style="display: none; font-size: 13px;">Edit Shape Style</div>
-                                <div id="previewBorder" class="outlinediv" ng-mouseover="mouseMoveToolTip(170, 170, 120, 'Edit Style')" ng-mouseleave="mouseOutToolTip()">
-                                    <div id="shapeStyleDiv" style="background-color: #ffffff;" class="fullcolordiv" ng-click="disableAnnotationtoolOnListManager||enableAnnotationToolBar()">
+                                        <div id="edit-block" style="display: none; font-size: 13px;">Edit Shape Style</div>
+                                        <div id="previewBorder" class="outlinediv" ng-mouseover="mouseMoveToolTip(170, 170, 120, 'Edit Style')" ng-mouseleave="mouseOutToolTip()">
+                                            <div id="shapeStyleDiv" style="background-color: #ffffff;" class="fullcolordiv" ng-click="disableAnnotationtoolOnListManager||enableAnnotationToolBar()">
 
-                                        </div>
+                                            </div>
 
+                                        </div>
                                     </div>
-                                </div>
-                                <div class="well well-popup">
-                                    <div class="" role="group" aria-label="...">
-                                        <div>
-                                        <a href="#canvasPaint" data-size="1" data-color="#fff" id="annotationpaintbrushsize" ng-mouseover="mouseMoveToolTip(270, 50, 120, 'Paint')" ng-mouseleave="mouseOutToolTip()" class="btn btn-black-annotation btn-xs pull-left btn-annotation btn-annotation-brush" role="button" data-placement="top" style="margin-right:1%;" ng-click="paintBrush()"><i class="fa fa-paint-brush"></i></a>
-                                        <button type="button" class="btn btn-black-annotation btn-xs pull-left btn-annotation btn-annotation-erase" data-placement="top" ng-click="EraseDrawing()" ng-mouseover="mouseMoveToolTip(270, 70, 120, 'Erase')" ng-mouseleave="mouseOutToolTip()"><i class="fa fa-eraser"></i></button>&nbsp;
-                                        <div style="width: 80px; margin: 0px 0px 0px 4px; display: inline-block;float:left;">
-                                            <div style="width: 58px; float: left;" ng-mouseover="mouseMoveToolTip(270, 100, 120, 'Brush Size')" ng-mouseleave="mouseOutToolTip()">
-                                                <input type="text" id="btnBrushSize" class="form-control" value="1" style="height:32px;border-radius:0;" oninput="Brushsize(this)">
-                                            </div>
-                                            <div style="width: 22px; float: left;">
-                                                <div style="width: 100%; float: left; height: 16px;">
-                                                    <button type="button" id="btnBrushSizeIncrement" ng-mouseover="mouseMoveToolTip(270, 100, 120, 'Brush Size')" ng-mouseleave="mouseOutToolTip()" class="btn btn-default" style="padding:0 5px;border-radius:0;font-size: 10px;vertical-align:top;">
+                                    <div class="well well-popup">
+                                        <div class="" role="group" aria-label="...">
+                                            <div>
+                                                <a href="#canvasPaint" data-size="1" data-color="#fff" id="annotationpaintbrushsize" ng-mouseover="mouseMoveToolTip(270, 50, 120, 'Paint')" ng-mouseleave="mouseOutToolTip()" class="btn btn-black-annotation btn-xs pull-left btn-annotation btn-annotation-brush" role="button" data-placement="top" style="margin-right:1%;" ng-click="paintBrush()"><i class="fa fa-paint-brush"></i></a>
+                                                <button type="button" class="btn btn-black-annotation btn-xs pull-left btn-annotation btn-annotation-erase" data-placement="top" ng-click="EraseDrawing()" ng-mouseover="mouseMoveToolTip(270, 70, 120, 'Erase')" ng-mouseleave="mouseOutToolTip()"><i class="fa fa-eraser"></i></button>&nbsp;
+                                                <div style="width: 80px; margin: 0px 0px 0px 4px; display: inline-block;float:left;">
+                                                    <div style="width: 58px; float: left;" ng-mouseover="mouseMoveToolTip(270, 100, 120, 'Brush Size')" ng-mouseleave="mouseOutToolTip()">
+                                                        <input type="text" id="btnBrushSize" class="form-control" value="1" style="height:32px;border-radius:0;" oninput="Brushsize(this)">
+                                                    </div>
+                                                    <div style="width: 22px; float: left;">
+                                                        <div style="width: 100%; float: left; height: 16px;">
+                                                            <button type="button" id="btnBrushSizeIncrement" ng-mouseover="mouseMoveToolTip(270, 100, 120, 'Brush Size')" ng-mouseleave="mouseOutToolTip()" class="btn btn-default" style="padding:0 5px;border-radius:0;font-size: 10px;vertical-align:top;">
+
+                                                                <img style="width:10px;height:10px;" src="~/../content/images/DA/angle-up.png">
+                                                            </button>
+                                                        </div>
+                                                        <div style="width: 100%; float: left; height: 16px;">
+                                                            <button type="button" id="btnBrushSizeDecrease" ng-mouseover="mouseMoveToolTip(270, 100, 120, 'Brush Size')" ng-mouseleave="mouseOutToolTip()" class="btn btn-default" style="padding:0 5px;border-radius:0;font-size: 10px;vertical-align:top;">
+                                                                <img style="width:10px;height:10px;" src="~/../content/images/DA/angle-down.png">
+                                                            </button>
+                                                        </div>
+                                                    </div>
 
-                                                        <img style="width:10px;height:10px;" src="~/../content/images/DA/angle-up.png">
-                                                    </button>
                                                 </div>
-                                                <div style="width: 100%; float: left; height: 16px;">
-                                                    <button type="button" id="btnBrushSizeDecrease" ng-mouseover="mouseMoveToolTip(270, 100, 120, 'Brush Size')" ng-mouseleave="mouseOutToolTip()" class="btn btn-default" style="padding:0 5px;border-radius:0;font-size: 10px;vertical-align:top;">
-                                                        <img style="width:10px;height:10px;" src="~/../content/images/DA/angle-down.png">
-                                                    </button>
+
+                                                <div class="pull-left" style="width:45%; margin-left:2%;margin-top:5px;">
+                                                    <div id="slider-range-min-2" ng-mouseover="mouseMoveToolTip(270, 170, 120, 'Brush Size')" ng-mouseleave="mouseOutToolTip()"></div>
                                                 </div>
+                                                <div class="clearfix"></div>
                                             </div>
 
                                         </div>
 
-                                        <div class="pull-left" style="width:45%; margin-left:2%;margin-top:5px;">
-                                            <div id="slider-range-min-2" ng-mouseover="mouseMoveToolTip(270, 170, 120, 'Brush Size')" ng-mouseleave="mouseOutToolTip()"></div>
-                                        </div>
-                                        <div class="clearfix"></div>
-                                    </div>
 
                                     </div>
 
-
                                 </div>
-
                             </div>
                         </div>
-                    </div>
 
+                    </div>
                 </div>
             </div>
-        </div>
-
-        <!--Modal For Annotation Text Box-->
-    <div id="annotationTextModal" style="display:none;z-index: 1000000000;width:500px;height:241px;padding-right:0!important;position:fixed;left:0;right:0;top:0px;bottom:0;margin:auto;">
-
-        <div class="modal-content">
-            <div class="modal-header" style="background-color: #808D43;padding:10px;border-bottom:0;">
-                <!--<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>-->
-                <h4 class="modal-title" id="myModalLabel" style="font-weight:bold;">Enter Text to be put in a box</h4>
-            </div>
-            <div class="modal-body">
-                <div class="col-xs-12" style="padding:20px 0;">
-                    <div class="form-inline">
-                        <!--Annotation: Text in different font style is same.-->
-                        <select class="form-control" id="selected-font-family"></select>
-                        <select class="form-control" id="selected-font-size">
-                            <option>14</option>
-                            <option>16</option>
-                            <option>18</option>
-                            <option>20</option>
-                            <option>22</option>
-                            <option>24</option>
-                            <option>26</option>
-                            <option>28</option>
-                            <option>36</option>
-                            <option>48</option>
-                            <option>72</option>
-                        </select>
-                        <span style="vertical-align:middle;">
-                            <span id="text-bold" class="Edittext-btn-css">
-                                <i aria-hidden="true" class="fa fa-bold" style="color: #fff"></i>
-                            </span>
-                            <span id="text-italic" class="Edittext-btn-css">
-                                <i class="fa fa-italic" aria-hidden="true" style="color: #fff"></i>
-
-                            </span>
-                            <span id="text-underline" class="underline-btn-css">
-                                <i class="fa fa-underline" aria-hidden="true" style="color: #fff"></i>
-                            </span>
-                        </span>
 
-                        <div class="form-group" id="font-color" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
+            <!--Modal For Annotation Text Box-->
+            <div id="annotationTextModal" style="display:none;z-index: 1000000000;width:500px;height:241px;padding-right:0!important;position:fixed;left:0;right:0;top:0px;bottom:0;margin:auto;">
 
-                            <input type="text" id="saturation-demo" class="form-control demo" data-control="saturation" style="display:none;" value="#0088cc">
-                        </div>
+                <div class="modal-content">
+                    <div class="modal-header" style="background-color: #808D43;padding:10px;border-bottom:0;">
+                        <!--<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>-->
+                        <h4 class="modal-title" id="myModalLabel" style="font-weight:bold;">Enter Text to be put in a box</h4>
+                    </div>
+                    <div class="modal-body">
+                        <div class="col-xs-12" style="padding:20px 0;">
+                            <div class="form-inline">
+                                <!--Annotation: Text in different font style is same.-->
+                                <select class="form-control" id="selected-font-family"></select>
+                                <select class="form-control" id="selected-font-size">
+                                    <option>14</option>
+                                    <option>16</option>
+                                    <option>18</option>
+                                    <option>20</option>
+                                    <option>22</option>
+                                    <option>24</option>
+                                    <option>26</option>
+                                    <option>28</option>
+                                    <option>36</option>
+                                    <option>48</option>
+                                    <option>72</option>
+                                </select>
+                                <span style="vertical-align:middle;">
+                                    <span id="text-bold" class="Edittext-btn-css">
+                                        <i aria-hidden="true" class="fa fa-bold" style="color: #fff"></i>
+                                    </span>
+                                    <span id="text-italic" class="Edittext-btn-css">
+                                        <i class="fa fa-italic" aria-hidden="true" style="color: #fff"></i>
+
+                                    </span>
+                                    <span id="text-underline" class="underline-btn-css">
+                                        <i class="fa fa-underline" aria-hidden="true" style="color: #fff"></i>
+                                    </span>
+                                </span>
+
+                                <div class="form-group" id="font-color" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
+
+                                    <input type="text" id="saturation-demo" class="form-control demo" data-control="saturation" style="display:none;" value="#0088cc">
+                                </div>
 
-                        <span style="vertical-align:middle;">
-                            <span id="text-left" class="Edittext-btn-css">
-                                <i aria-hidden="true" class="fa fa-align-left" style="color: #fff"></i>
-                            </span>
-                            <span id="text-center" class="Edittext-btn-css">
-                                <i class="fa fa-align-center" aria-hidden="true" style="color: #fff"></i>
+                                <span style="vertical-align:middle;">
+                                    <span id="text-left" class="Edittext-btn-css">
+                                        <i aria-hidden="true" class="fa fa-align-left" style="color: #fff"></i>
+                                    </span>
+                                    <span id="text-center" class="Edittext-btn-css">
+                                        <i class="fa fa-align-center" aria-hidden="true" style="color: #fff"></i>
 
 
-                            </span>
-                            <span id="text-right" class="underline-btn-css">
-                                <i class="fa fa-align-right" aria-hidden="true" style="color: #fff"></i>
+                                    </span>
+                                    <span id="text-right" class="underline-btn-css">
+                                        <i class="fa fa-align-right" aria-hidden="true" style="color: #fff"></i>
 
 
-                            </span>
-                        </span>
+                                    </span>
+                                </span>
 
 
+                            </div>
+                        </div>
+                        <textarea class="form-control" id="text_area" rows="3" style="font-family: 'Verdana, sans-serif';font-size:14px; font-weight: normal; font-style: normal; color: #000; text-align: left; text-decoration: none;"></textarea>
+                    </div>
+                    <div class="modal-footer">
+                        <!--<button type="button" class="btn btn-default" ng-click="closeModal()" data-dismiss="modal">Close</button>-->
+                        <button type="button" class="btn btn-default" ng-click="closeModal()" id="closeEditText" data-dismiss="modal">Close</button>
+                        <button type="button" id="saveBtn" class="btn btn-primary" data-dismiss="modal" ng-click="saveText()">Save</button>
                     </div>
                 </div>
-                <textarea class="form-control" id="text_area" rows="3" style="font-family: 'Verdana, sans-serif';font-size:14px; font-weight: normal; font-style: normal; color: #000; text-align: left; text-decoration: none;"></textarea>
-            </div>
-            <div class="modal-footer">
-                <!--<button type="button" class="btn btn-default" ng-click="closeModal()" data-dismiss="modal">Close</button>-->
-                <button type="button" class="btn btn-default" ng-click="closeModal()" id="closeEditText" data-dismiss="modal">Close</button>
-                <button type="button" id="saveBtn" class="btn btn-primary" data-dismiss="modal" ng-click="saveText()">Save</button>
-            </div>
-        </div>
 
-        </div>
+            </div>
 
 
 
 
-        <!--List manager-->
-        <!--List manager-->
-        <style>
-            #listManager {
-                background: #fff;
-                border-radius: 3px;
-                border: 1px solid #ededed;
-                -webkit-box-shadow: 0px 0px 2px 1px rgba(173,173,173,1);
-                -moz-box-shadow: 0px 0px 2px 1px rgba(173,173,173,1);
-                box-shadow: 0px 0px 2px 1px rgba(173,173,173,1);
-                width: 350px;
-                position: absolute;
-                top: 170px;
-                left: 140px;
-                display: none;
-            z-index: 110000;
-            }
-
-                #listManager .annotation-modal-header {
-                    background: #818f44;
-                    padding: 2px 10px;
+            <!--List manager-->
+            <!--List manager-->
+            <style>
+                #listManager {
+                    background: #fff;
+                    border-radius: 3px;
+                    border: 1px solid #ededed;
+                    -webkit-box-shadow: 0px 0px 2px 1px rgba(173,173,173,1);
+                    -moz-box-shadow: 0px 0px 2px 1px rgba(173,173,173,1);
+                    box-shadow: 0px 0px 2px 1px rgba(173,173,173,1);
+                    width: 350px;
+                    position: absolute;
+                    top: 170px;
+                    left: 140px;
+                    display: none;
+                    z-index: 110000;
                 }
 
-                    #listManager .annotation-modal-header h4 {
-                        color: #fff;
-                        font-size: 15px;
-                        line-height: 20px;
+                    #listManager .annotation-modal-header {
+                        background: #818f44;
+                        padding: 2px 10px;
                     }
 
-                #listManager .modal-header .close {
-                    color: #fff;
-                    margin: 0;
-                    opacity: 10;
-                    text-shadow: none;
-                }
+                        #listManager .annotation-modal-header h4 {
+                            color: #fff;
+                            font-size: 15px;
+                            line-height: 20px;
+                        }
 
-                #listManager .modal-footer {
-                    padding: 5px 10px;
-                }
-        </style>
-        <div id="listManager" style="">
-            <div class="modal-header annotation-modal-header">
-                <button type="button" class="close" aria-label="Close" ng-click="CloseListManager()"><span aria-hidden="true">&times;</span></button>
-                <h4 class="modal-title" id="myModalLabel">List Manager</h4>
-            </div>
-            <div class="modal-body">
-                <div class="row paddingTopBtm10">
-                    <div class="col-sm-12" ng-init="FillListManager()">
+                    #listManager .modal-header .close {
+                        color: #fff;
+                        margin: 0;
+                        opacity: 10;
+                        text-shadow: none;
+                    }
 
-                        <div class="form-group">
-                            <label for="sel1">Window</label>
-                            <select class="form-control" id="viewName" disabled>
-                                <!--<option>Male Lateral</option>-->
+                    #listManager .modal-footer {
+                        padding: 5px 10px;
+                    }
+            </style>
+            <div id="listManager" style="">
+                <div class="modal-header annotation-modal-header">
+                    <button type="button" class="close" aria-label="Close" ng-click="CloseListManager()"><span aria-hidden="true">&times;</span></button>
+                    <h4 class="modal-title" id="myModalLabel">List Manager</h4>
+                </div>
+                <div class="modal-body">
+                    <div class="row paddingTopBtm10">
+                        <div class="col-sm-12" ng-init="FillListManager()">
 
-                            </select>
-                        </div>
-                        <div style="">
                             <div class="form-group">
+                                <label for="sel1">Window</label>
+                                <select class="form-control" id="viewName" disabled>
+                                    <!--<option>Male Lateral</option>-->
+
+                                </select>
+                            </div>
+                            <div style="">
+                                <div class="form-group">
                                 <div ng-click="restrictBodySystemList()" class="btn btn-success btn-block" style="padding:3px 12px;">
                                     <i class=" fa fa-caret-right restrict-carret-icon"></i>  <span>Restrict List to</span>
+                                    </div>
                                 </div>
-                            </div>
 
                             <div id="restrictListDiv" style="display:none;">
 
-                                <div class="well well-sm marginTopBtm10">
-                                    <div class="form-horizontal">
-                                        <div class="form-group">
-                                            <label class="col-sm-4 control-label" for="System">System</label>
-                                            <div class="col-sm-8">
-                                                <select id="bodySystems" class="form-control" onchange="if (typeof (this.selectedIndex) != 'undefined') refreshTermListOnSystem(this.options[this.selectedIndex].id)"></select>
+                                    <div class="well well-sm marginTopBtm10">
+                                        <div class="form-horizontal">
+                                            <div class="form-group">
+                                                <label class="col-sm-4 control-label" for="System">System</label>
+                                                <div class="col-sm-8">
+                                                    <select id="bodySystems" class="form-control" onchange="if (typeof (this.selectedIndex) != 'undefined') refreshTermListOnSystem(this.options[this.selectedIndex].id)"></select>
+                                                </div>
+                                            </div>
+                                            <div class="form-group">
+                                                <label class="col-sm-4 control-label" for="inputPassword3">Area</label>
+                                                <div class="col-sm-8">
+                                                    <select class="form-control" disabled>
+                                                        <option value="1" selected="">Entire View</option>
+                                                    </select>
                                             </div>
-                                        </div>
-                                        <div class="form-group">
-                                            <label class="col-sm-4 control-label" for="inputPassword3">Area</label>
-                                            <div class="col-sm-8">
-                                                <select class="form-control" disabled>
-                                                    <option value="1" selected="">Entire View</option>
-                                                </select>
                                             </div>
                                         </div>
                                     </div>
-                                </div>
 
 
-                            </div>
+                                </div>
 
-                            <!--DA > List Manager > Multiple structure selection should not be available.-->
-                            <div class="form-group">
-                                <select id="termList" class="form-control" size="10" onclick="if (typeof (this.selectedIndex) != 'undefined') onListManagerTermSelection(this.options[this.selectedIndex].id)"></select>
-                            </div>
+                                <!--DA > List Manager > Multiple structure selection should not be available.-->
+                                <div class="form-group">
+                                    <select id="termList" class="form-control" size="10" onclick="if (typeof (this.selectedIndex) != 'undefined') onListManagerTermSelection(this.options[this.selectedIndex].id)"></select>
+                                </div>
 
-                        </div>
-                        <div style="clear:both;"></div>
+                            </div>
+                            <div style="clear:both;"></div>
 
 
 
 
+                        </div>
                     </div>
-                </div>
 
+                </div>
+                <div class="modal-footer" id="totalTerms">
+                    <!--<span class="pull-left marginTop5">424 Structures</span>-->
+                    <button data-dismiss="modal" class="btn btn-primary" type="button"><i class="fa fa-arrow-circle-right"></i></button>
+                </div>
             </div>
-            <div class="modal-footer" id="totalTerms">
-                <!--<span class="pull-left marginTop5">424 Structures</span>-->
-                <button data-dismiss="modal" class="btn btn-primary" type="button"><i class="fa fa-arrow-circle-right"></i></button>
-            </div>
-        </div>
 
-        <!--background disable div-->
+            <!--background disable div-->
 
-        <div id="modelbackground"></div>
+            <div id="modelbackground"></div>
 
 
-        <!--Edit Shape Modal-->
+            <!--Edit Shape Modal-->
 
 
-    <div class="modeleditstyle" id="modeleditstyle" style="z-index: 1000000000; background: white;width: 302px;position:absolute;left:40%;right:0;top:70px;">
-            <div class="modal-content">
-                <div class="modal-header annotation-modal-header">
-                    <h4 class="modal-title" id="myModalLabel33">Edit Shape Style</h4>
-                </div>
-                <div class="modal-body">
-                    <div class="marginTopBtm10">
-                        <div class="well well-sm no-margin-btm">
-                            <div class="row">
-                                <div class="col-sm-12">
-                                    <div class="checkbox no-margin">
-                                        <label>
-                                            <input id="fill-option" type="checkbox" checked onclick="enableDisableFillOption()"> Fill Option
-                                        </label>
+            <div class="modeleditstyle" id="modeleditstyle" style="z-index: 1000000000; background: white;width: 302px;position:absolute;left:40%;right:0;top:70px;">
+                <div class="modal-content">
+                    <div class="modal-header annotation-modal-header">
+                        <h4 class="modal-title" id="myModalLabel33">Edit Shape Style</h4>
+                    </div>
+                    <div class="modal-body">
+                        <div class="marginTopBtm10">
+                            <div class="well well-sm no-margin-btm">
+                                <div class="row">
+                                    <div class="col-sm-12">
+                                        <div class="checkbox no-margin">
+                                            <label>
+                                                <input id="fill-option" type="checkbox" checked onclick="enableDisableFillOption()"> Fill Option
+                                            </label>
+                                        </div>
                                     </div>
-                                </div>
-                                <div class="col-sm-6 enableDisableOpacity">
-                                <!--<div class="radio">
-                                        <label>
-                                            <input type="radio" name="filloption" id="filloption1" value="filloption1">
-                                            <span class="">Texture</span>
-                                            <img id="editstyleTexture" src="~/../content/images/common/annotation-tool-bar/pattern-picker.png" alt="" class="pattern-picker" data-toggle="modal" data-target="#pattern">
-                                        </label>
-                                </div>-->
-                                    <div class="radio">
-                                        <label>
-                                            <input type="radio" name="filloption" id="filloption2" value="filloption2" checked style="margin-top:8px;">
-
-
-                                            <div id="editstylebackgroundcolor" class="form-group" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
-                                                <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
-                                                <input type="text" class="form-control outerBackgroundColor" data-control="saturation" style="display:none;" value="#0088cc">
-                                            </div>
+                                    <div class="col-sm-6 enableDisableOpacity">
+                                        <!--<div class="radio">
+                                            <label>
+                                                <input type="radio" name="filloption" id="filloption1" value="filloption1">
+                                                <span class="">Texture</span>
+                                                <img id="editstyleTexture" src="~/../content/images/common/annotation-tool-bar/pattern-picker.png" alt="" class="pattern-picker" data-toggle="modal" data-target="#pattern">
+                                            </label>
+                                    </div>-->
+                                        <div class="radio">
+                                            <label>
+                                                <input type="radio" name="filloption" id="filloption2" value="filloption2" checked style="margin-top:8px;">
+
+
+                                                <div id="editstylebackgroundcolor" class="form-group" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
+                                                    <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
+                                                    <input type="text" class="form-control outerBackgroundColor" data-control="saturation" style="display:none;" value="#0088cc">
+                                                </div>
 
 
-                                        </label>
-                                    </div>
-                                </div>
-                                <div class="col-sm-6 no-padding marginTop10 enableDisableOpacity">
-                                    <div class="row">
-                                        <label class="pull-left" style="font-weight:normal;">Scale</label>
-                                        <div id="edit-slider-3" class="pull-left" style="width:62%; margin-left:3%; margin-top:2%;">
-                                            <div id="slider-range-min-3"></div>
+                                            </label>
                                         </div>
                                     </div>
+                                    <div class="col-sm-6 no-padding marginTop10 enableDisableOpacity">
+                                        <div class="row">
+                                            <label class="pull-left" style="font-weight:normal;">Scale</label>
+                                            <div id="edit-slider-3" class="pull-left" style="width:62%; margin-left:3%; margin-top:2%;">
+                                                <div id="slider-range-min-3"></div>
+                                            </div>
+                                        </div>
 
-                                    <div class="row">
-                                        <label class="pull-left" style="font-weight:normal;">Opacity</label>
-                                        <div id="edit-slider-4" class="pull-left" style="width:53%; margin-left:3%; margin-top:2%;">
-                                            <div id="slider-range-min-4"></div>
+                                        <div class="row">
+                                            <label class="pull-left" style="font-weight:normal;">Opacity</label>
+                                            <div id="edit-slider-4" class="pull-left" style="width:53%; margin-left:3%; margin-top:2%;">
+                                                <div id="slider-range-min-4"></div>
+                                            </div>
                                         </div>
-                                    </div>
 
-                                    <div class="clearfix"></div>
+                                        <div class="clearfix"></div>
 
 
+                                    </div>
                                 </div>
-                            </div>
 
+                            </div>
                         </div>
-                    </div>
-                    <div class="marginTopBtm10">
-                        <div class="well well-sm no-margin-btm">
-                            <div class="row">
-                                <div class="col-sm-12">
-                                    <div class="checkbox no-margin">
-                                        <label>
-                                            <input id="Outline-Option" onclick="enableDisableOutline()" type="checkbox" checked> Outline Option
-                                        </label>
+                        <div class="marginTopBtm10">
+                            <div class="well well-sm no-margin-btm">
+                                <div class="row">
+                                    <div class="col-sm-12">
+                                        <div class="checkbox no-margin">
+                                            <label>
+                                                <input id="Outline-Option" onclick="enableDisableOutline()" type="checkbox" checked> Outline Option
+                                            </label>
+                                        </div>
                                     </div>
-                                </div>
-                                <div class="col-sm-6 setEnableDisableForEditShapeStyle">
-                                    <label class="marginTop5">
-                                        <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
-                                        <div class="form-group" id="outlineColor" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
+                                    <div class="col-sm-6 setEnableDisableForEditShapeStyle">
+                                        <label class="marginTop5">
+                                            <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
+                                            <div class="form-group" id="outlineColor" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
 
-                                            <input type="text" class="form-control borderColorCanvasPreview" data-control="saturation" style="display:none;" value="#0088cc">
-                                        </div>
+                                                <input type="text" class="form-control borderColorCanvasPreview" data-control="saturation" style="display:none;" value="#0088cc">
+                                            </div>
 
 
-                                    </label>
-                                </div>
+                                        </label>
+                                    </div>
 
-                                <div class="col-sm-6 setEnableDisableForEditShapeStyle">
-                                    <div class="form-horizontal">
-                                        <div class="form-group">
-                                            <label class="col-sm-3 control-label" style=" font-weight:normal; padding-top:9px;">Size</label>
-                                            <div class="col-sm-9 marginTop5">
-                                                <select id="borderWidthCanvasElement" class="form-control input-sm">
-                                                    <option value="1">1</option>
-                                                    <option value="2">2</option>
-                                                    <option value="3">3</option>
-                                                    <option value="4">4</option>
-                                                    <option value="5">5</option>
-                                                </select>
+                                    <div class="col-sm-6 setEnableDisableForEditShapeStyle">
+                                        <div class="form-horizontal">
+                                            <div class="form-group">
+                                                <label class="col-sm-3 control-label" style=" font-weight:normal; padding-top:9px;">Size</label>
+                                                <div class="col-sm-9 marginTop5">
+                                                    <select id="borderWidthCanvasElement" class="form-control input-sm">
+                                                        <option value="1">1</option>
+                                                        <option value="2">2</option>
+                                                        <option value="3">3</option>
+                                                        <option value="4">4</option>
+                                                        <option value="5">5</option>
+                                                    </select>
+                                                </div>
                                             </div>
                                         </div>
                                     </div>
-                                </div>
 
+                                </div>
                             </div>
                         </div>
-                    </div>
 
-                    <div class="marginTopBtm10">
+                        <div class="marginTopBtm10">
 
-                        <div class="well well-sm no-margin-btm blankshapediv">
-                        <div class="outlinediv" id="outlinedivId" style="border: 1px solid #000000;">
-                            <div id="imgOpacity" style="background-color: #ffffff" class="fullcolordiv imgopacity">
+                            <div class="well well-sm no-margin-btm blankshapediv">
+                                <div class="outlinediv" id="outlinedivId" style="border: 1px solid #000000;">
+                                    <div id="imgOpacity" style="background-color: #ffffff" class="fullcolordiv imgopacity">
+                                    </div>
+                                </div>
                             </div>
+
                         </div>
                     </div>
-
+                    <div class="modal-footer">
+                        <button id="btnShapeStyle" type="button" class="btn btn-primary btn-sm" ng-click="setPropertiesForShapes('imgOpacity')">
+                            OK
+                        </button>
+                        <button type="button" class="btn btn-primary btn-sm" data-dismiss="modal" ng-click="disableAnnotationToolBar()">Cancel</button>
                     </div>
                 </div>
-                <div class="modal-footer">
-                <button id="btnShapeStyle" type="button" class="btn btn-primary btn-sm" ng-click="setPropertiesForShapes('imgOpacity')">
-                        OK
-                    </button>
-                    <button type="button" class="btn btn-primary btn-sm" data-dismiss="modal" ng-click="disableAnnotationToolBar()">Cancel</button>
-                </div>
             </div>
-        </div>
 
-    <!--Export Image Modal-->
-    <div class="modal fade export-image ui-draggable in" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" style="display: none;">
-        <div class="modal-dialog modal-sm" role="document">
-            <div class="modal-content">
-                <div class="modal-header annotation-modal-header ui-draggable-handle">
-                    <button type="button" class="close" data-dismiss="modal" ng-click="CloseExportImageWindow()" aria-label="Close"><span aria-hidden="true">×</span></button>
-                    <h4 class="modal-title" id="">Save As</h4>
-                </div>
-                <div class="modal-body">
-                    <div class="row paddTopbtm15">
-                        <div class="col-sm-12">
-                            <div class="form-group">
-                                <label for="filename">Filename:</label>
-                                <div class="input-group">
-                                    <input type="text" class="form-control" id="filename" placeholder="" ng-model="filename">
-                                    <div class="input-group-addon">.jpg</div>
+            <!--Export Image Modal-->
+            <div class="modal fade export-image ui-draggable in" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" style="display: none;">
+                <div class="modal-dialog modal-sm" role="document">
+                    <div class="modal-content">
+                        <div class="modal-header annotation-modal-header ui-draggable-handle">
+                            <button type="button" class="close" data-dismiss="modal" ng-click="CloseExportImageWindow()" aria-label="Close"><span aria-hidden="true">×</span></button>
+                            <h4 class="modal-title" id="">Save As</h4>
+                        </div>
+                        <div class="modal-body">
+                            <div class="row paddTopbtm15">
+                                <div class="col-sm-12">
+                                    <div class="form-group">
+                                        <label for="filename">Filename:</label>
+                                        <div class="input-group">
+                                            <input type="text" class="form-control" id="filename" placeholder="" ng-model="filename">
+                                            <div class="input-group-addon">.jpg</div>
+                                        </div>
+                                    </div>
                                 </div>
                             </div>
+
+                        </div>
+                        <div class="modal-footer">
+                            <div class="row">
+                                <input type="file" id="file1" style="display:none">
+                                <!--<a href="data:application/xml;charset=utf-8,your code here" download="filename.html">Save</a-->>
+                                <div class="col-sm-12"><button id="btnSaveEI" class="btn btn-primary" type="button">Ok</button></div> <!--onclick="makeScreenshot();"--><!--ng-click="dialogs.saveAs()"--><!--ng-click="ShowAlert()"-->
+                            </div>
                         </div>
-                    </div>
 
-                </div>
-                <div class="modal-footer">
-                    <div class="row">
-                        <input type="file" id="file1" style="display:none">
-                        <!--<a href="data:application/xml;charset=utf-8,your code here" download="filename.html">Save</a-->>
-                        <div class="col-sm-12"><button id="btnSaveEI" class="btn btn-primary" type="button">Ok</button></div> <!--onclick="makeScreenshot();"--><!--ng-click="dialogs.saveAs()"--><!--ng-click="ShowAlert()"-->
                     </div>
                 </div>
-
             </div>
-        </div>
-    </div>
 
-    <!--Print Active Viewer-->
-    <div class="print-box portrait-box" id="printBox" style="display: none;">
-        <div id="printDivContent">
-            <div class="">
-                <div class="col-sm-6" style="top: 10px; position: absolute; left: 10px;">
-                    <span class="pull-left font12 span-font" id="spnModule"></span>
-                </div>
-                <div class="col-sm-6" style="top: 10px; position: absolute; right: 10px;">
-                    <span class="pull-right font12 span-font" id="spnBodyViewTitle"></span>
-                </div>
-            </div>
-            <div class=" mar-top-25" align="center" id="dvPortrait" style="text-align: center;">
-                <img src="" alt="" class="logo-image" id="snipImage" style="width: 100%;" />
-            </div>
-            <div>
-                <div class="col-sm-8" style="position: absolute; bottom: 20px;">
-                    <span class="pull-left marginTop10 font12 span-font">Copyright 2016 A.D.A.M., Inc. All Rights Reserved</span>
-                </div>
-                <div class="col-sm-4" style="position: absolute; bottom: 20px; right: 10px;">
-                    <span class="pull-right marginTop10 bgnone no-margin">
-                        <img class="logo-image" src="content/images/adam-logo-small.png" alt="">
-                    </span>
+            <!--Print Active Viewer-->
+            <div class="print-box portrait-box" id="printBox" style="display: none;">
+                <div id="printDivContent">
+                    <div class="">
+                        <div class="col-sm-6" style="top: 10px; position: absolute; left: 10px;">
+                            <span class="pull-left font12 span-font" id="spnModule"></span>
+                        </div>
+                        <div class="col-sm-6" style="top: 10px; position: absolute; right: 10px;">
+                            <span class="pull-right font12 span-font" id="spnBodyViewTitle"></span>
+                        </div>
+                    </div>
+                    <div class=" mar-top-25" align="center" id="dvPortrait" style="text-align: center;">
+                        <img src="" alt="" class="logo-image" id="snipImage" style="width: 100%;" />
+                    </div>
+                    <div>
+                        <div class="col-sm-8" style="position: absolute; bottom: 20px;">
+                            <span class="pull-left marginTop10 font12 span-font">Copyright 2016 A.D.A.M., Inc. All Rights Reserved</span>
+                        </div>
+                        <div class="col-sm-4" style="position: absolute; bottom: 20px; right: 10px;">
+                            <span class="pull-right marginTop10 bgnone no-margin">
+                                <img class="logo-image" src="content/images/adam-logo-small.png" alt="">
+                            </span>
+                        </div>
+                    </div>
+                    <div class="clearfix"></div>
                 </div>
             </div>
-            <div class="clearfix"></div>
-        </div>
-    </div>
 
-    <!--Print Preview Modal-->
-    <div id="dvPrintPreview" style="display: none;"></div>
+            <!--Print Preview Modal-->
+            <div id="dvPrintPreview" style="display: none;"></div>
 
-    <!--<div class="modal fade" id="editshapestyle" tabindex="-1" role="dialog" aria-labelledby="myModalLabel33" style="z-index:1000000000;width:302px;margin-left:auto;margin-right:auto;overflow:hidden;height:460px;">
-        <div class="modal-dialog modal-sm" role="document">
-            <div class="modal-content">
-                <div class="modal-header annotation-modal-header">
-                    <h4 class="modal-title" id="myModalLabel33">Edit Shape Style</h4>
-                </div>
-                <div class="modal-body">
-                    <div class="marginTopBtm10">
-                        <div class="well well-sm no-margin-btm">
-                            <div class="row">
-                                <div class="col-sm-12">
-                                    <div class="checkbox no-margin">
-                                        <label>
-                                            <input id="fill-option" type="checkbox" checked onclick="enableDisableFillOption()"> Fill Option
-                                        </label>
-                                    </div>
-                                </div>
-                                <div class="col-sm-6 enableDisableOpacity">
-                                    <div class="radio">
-                                        <label>
-                                            <input type="radio" name="filloption" id="filloption1" value="filloption1">
-                                            <span class="">Texture</span>
-                                            <img id="editstyleTexture" src="~/../content/images/common/annotation-tool-bar/pattern-picker.png" alt="" class="pattern-picker" data-toggle="modal" data-target="#pattern">
-                                        </label>
+            <!--<div class="modal fade" id="editshapestyle" tabindex="-1" role="dialog" aria-labelledby="myModalLabel33" style="z-index:1000000000;width:302px;margin-left:auto;margin-right:auto;overflow:hidden;height:460px;">
+            <div class="modal-dialog modal-sm" role="document">
+                <div class="modal-content">
+                    <div class="modal-header annotation-modal-header">
+                        <h4 class="modal-title" id="myModalLabel33">Edit Shape Style</h4>
+                    </div>
+                    <div class="modal-body">
+                        <div class="marginTopBtm10">
+                            <div class="well well-sm no-margin-btm">
+                                <div class="row">
+                                    <div class="col-sm-12">
+                                        <div class="checkbox no-margin">
+                                            <label>
+                                                <input id="fill-option" type="checkbox" checked onclick="enableDisableFillOption()"> Fill Option
+                                            </label>
+                                        </div>
                                     </div>
-                                    <div class="radio">
-                                        <label>
-                                            <input type="radio" name="filloption" id="filloption2" value="filloption2" checked style="margin-top:8px;">
+                                    <div class="col-sm-6 enableDisableOpacity">
+                                        <div class="radio">
+                                            <label>
+                                                <input type="radio" name="filloption" id="filloption1" value="filloption1">
+                                                <span class="">Texture</span>
+                                                <img id="editstyleTexture" src="~/../content/images/common/annotation-tool-bar/pattern-picker.png" alt="" class="pattern-picker" data-toggle="modal" data-target="#pattern">
+                                            </label>
+                                        </div>
+                                        <div class="radio">
+                                            <label>
+                                                <input type="radio" name="filloption" id="filloption2" value="filloption2" checked style="margin-top:8px;">
 
 
-                                            <div id="editstylebackgroundcolor" class="form-group" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
-                                                <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
-                                                <input type="text" class="form-control outerBackgroundColor" data-control="saturation" style="display:none;" value="#0088cc">
-                                            </div>
+                                                <div id="editstylebackgroundcolor" class="form-group" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
+                                                    <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
+                                                    <input type="text" class="form-control outerBackgroundColor" data-control="saturation" style="display:none;" value="#0088cc">
+                                                </div>
 
 
 
-                                        </label>
+                                            </label>
+                                        </div>
                                     </div>
-                                </div>
-                                <div class="col-sm-6 no-padding marginTop10 enableDisableOpacity">
-                                    <div class="row">
-                                        <label class="pull-left" style="font-weight:normal;">Scale</label>
-                                        <div id="edit-slider-3" class="pull-left" style="width:62%; margin-left:3%; margin-top:2%;">
-                                            <div id="slider-range-min-3"></div>
+                                    <div class="col-sm-6 no-padding marginTop10 enableDisableOpacity">
+                                        <div class="row">
+                                            <label class="pull-left" style="font-weight:normal;">Scale</label>
+                                            <div id="edit-slider-3" class="pull-left" style="width:62%; margin-left:3%; margin-top:2%;">
+                                                <div id="slider-range-min-3"></div>
 
+                                            </div>
                                         </div>
-                                    </div>
 
-                                    <div class="row">
-                                        <label class="pull-left" style="font-weight:normal;">Opacity</label>
-                                        <div id="edit-slider-4" class="pull-left" style="width:53%; margin-left:3%; margin-top:2%;">
-                                            <div id="slider-range-min-4"></div>
+                                        <div class="row">
+                                            <label class="pull-left" style="font-weight:normal;">Opacity</label>
+                                            <div id="edit-slider-4" class="pull-left" style="width:53%; margin-left:3%; margin-top:2%;">
+                                                <div id="slider-range-min-4"></div>
+                                            </div>
                                         </div>
-                                    </div>
 
-                                    <div class="clearfix"></div>
+                                        <div class="clearfix"></div>
 
 
+                                    </div>
                                 </div>
-                            </div>
 
+                            </div>
                         </div>
-                    </div>
-                    <div class="marginTopBtm10">
-                        <div class="well well-sm no-margin-btm">
-                            <div class="row">
-                                <div class="col-sm-12">
-                                    <div class="checkbox no-margin">
-                                        <label>
-                                            <input id="Outline-Option" onclick="enableDisableOutline()" type="checkbox" checked> Outline Option
-                                        </label>
+                        <div class="marginTopBtm10">
+                            <div class="well well-sm no-margin-btm">
+                                <div class="row">
+                                    <div class="col-sm-12">
+                                        <div class="checkbox no-margin">
+                                            <label>
+                                                <input id="Outline-Option" onclick="enableDisableOutline()" type="checkbox" checked> Outline Option
+                                            </label>
+                                        </div>
                                     </div>
-                                </div>
-                                <div class="col-sm-6 setEnableDisableForEditShapeStyle">
-                                    <label class="marginTop5">
-                                        <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
-                                        <div class="form-group" id="outlineColor" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
+                                    <div class="col-sm-6 setEnableDisableForEditShapeStyle">
+                                        <label class="marginTop5">
+                                            <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
+                                            <div class="form-group" id="outlineColor" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
 
-                                            <input type="text" class="form-control borderColorCanvasPreview" data-control="saturation" style="display:none;" value="#0088cc">
-                                        </div>
+                                                <input type="text" class="form-control borderColorCanvasPreview" data-control="saturation" style="display:none;" value="#0088cc">
+                                            </div>
 
 
-                                    </label>
-                                </div>
+                                        </label>
+                                    </div>
 
-                                <div class="col-sm-6 setEnableDisableForEditShapeStyle">
-                                    <div class="form-horizontal">
-                                        <div class="form-group">
-                                            <label class="col-sm-3 control-label" style=" font-weight:normal; padding-top:9px;">Size</label>
-                                            <div class="col-sm-9 marginTop5">
-                                                <select id="borderWidthCanvasElement" class="form-control input-sm">
-                                                    <option value="1">1</option>
-                                                    <option value="2">2</option>
-                                                    <option value="3">3</option>
-                                                    <option value="4">4</option>
-                                                    <option value="5">5</option>
-                                                </select>
+                                    <div class="col-sm-6 setEnableDisableForEditShapeStyle">
+                                        <div class="form-horizontal">
+                                            <div class="form-group">
+                                                <label class="col-sm-3 control-label" style=" font-weight:normal; padding-top:9px;">Size</label>
+                                                <div class="col-sm-9 marginTop5">
+                                                    <select id="borderWidthCanvasElement" class="form-control input-sm">
+                                                        <option value="1">1</option>
+                                                        <option value="2">2</option>
+                                                        <option value="3">3</option>
+                                                        <option value="4">4</option>
+                                                        <option value="5">5</option>
+                                                    </select>
+                                                </div>
                                             </div>
                                         </div>
                                     </div>
+
                                 </div>
+                            </div>
+                        </div>
 
+                        <div class="marginTopBtm10">
+                            <div class="well well-sm no-margin-btm">
+                                <img id="imgOpacity" class="img-rounded img-responsive imgopacity" alt="..." src="content/images/blank-shape.jpg">
                             </div>
                         </div>
                     </div>
+                    <div class="modal-footer">
+                        <button type="button" class="btn btn-primary btn-sm" ng-click="setPropertiesForShapes('imgOpacity')">
 
-                    <div class="marginTopBtm10">
-                        <div class="well well-sm no-margin-btm">
-                            <img id="imgOpacity" class="img-rounded img-responsive imgopacity" alt="..." src="content/images/blank-shape.jpg">
-                        </div>
+                            OK
+                        </button>
+                        <button type="button" class="btn btn-primary btn-sm" data-dismiss="modal" ng-click="disableAnnotationToolBar()">Cancel</button>
                     </div>
                 </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-primary btn-sm" ng-click="setPropertiesForShapes('imgOpacity')">
-    
-                        OK
-                    </button>
-                    <button type="button" class="btn btn-primary btn-sm" data-dismiss="modal" ng-click="disableAnnotationToolBar()">Cancel</button>
-                </div>
             </div>
-        </div>
-    </div>-->
-
-    <script>
-
-        function enableDisableFillOption() {
-            //debugger;
-            if (document.getElementById('fill-option').checked) {
-                // $('#imgOpacity').attr("background-color");
-                //$('#imgOpacity').css({"background-color"})
-                //$("#filloption1").css({ "pointer-events": "auto" });
-                //$("#filloption12").css({ "pointer-events": "auto" });
-
-                var x = $("#editstylebackgroundcolor span.minicolors-swatch-color").css('background-color');
-                $("#imgOpacity").css("background-color", x);
-                $("#edit-slider-3").css({ "pointer-events": "auto" });
-                $("#edit-slider-4").css({ "pointer-events": "auto" });
-                $("#editstylebackgroundcolor").css({ "pointer-events": "auto" });
-                $("#editstyleTexture").css({ "pointer-events": "auto" });
-                $(".enableDisableOpacity label").css({ "cursor": "pointer" });
-                $(".enableDisableOpacity").css({ "opacity": "1" })
-                document.getElementById("filloption1").disabled = false;
-                document.getElementById("filloption2").disabled = false;
-                document.getElementById("filloption1").style.cursor = "default";
-                document.getElementById("filloption2").style.cursor = "default";
-
-
-
-            }
-            else {
-                $('#imgOpacity').css("background-color", "transparent");
-                //$("#filloption1").css({ "pointer-events": "none" });
-                //$("#filloption2").css({ "pointer-events": "none" });
-                $("#edit-slider-3").css({ "pointer-events": "none" });
-                $("#edit-slider-4").css({ "pointer-events": "none" });
-                $("#editstylebackgroundcolor").css({ "pointer-events": "none" });
-                $("#editstyleTexture").css({ "pointer-events": "none" });
-                $(".enableDisableOpacity label").css({ "cursor": "default" });
-                $(".enableDisableOpacity").css({ "opacity": ".5" })
-                document.getElementById("filloption1").disabled = true;
-                document.getElementById("filloption2").disabled = true;
-                document.getElementById("filloption1").style.cursor = "default";
-                document.getElementById("filloption2").style.cursor = "default";
-
-
-
-            }
+        </div>-->
 
-        }
-        function enableDisableOutline() {
-
-            if (document.getElementById('Outline-Option').checked) {
-                var x = $("#outlineColor span.minicolors-swatch-color").css('background-color');
-                $(".marginTopBtm10 div.outlinediv").css("border-color", x);
-                //   var borderWidth = $("#outlineColor span.minicolors-swatch-color").css('border-width');
-                // $("#imgOpacity").css("border-width", borderWidth);
-
-                $("#borderWidthCanvasElement").css({ "pointer-events": "auto" });
-                $("#outlineColor").css({ "pointer-events": "auto" });
-                $(".setEnableDisableForEditShapeStyle").css({ "opacity": "1" })
-            }
-            else {
-                $('.marginTopBtm10 div.outlinediv').css("border-color", "transparent");
-                $("#borderWidthCanvasElement").css({ "pointer-events": "none" });
-                $("#outlineColor").css({ "pointer-events": "none" });
-                $(".setEnableDisableForEditShapeStyle").css({ "opacity": ".5" })
-            }
-        }
+            <script>
 
-    </script>
+                function enableDisableFillOption() {
+                    //debugger;
+                    if (document.getElementById('fill-option').checked) {
+                        // $('#imgOpacity').attr("background-color");
+                        //$('#imgOpacity').css({"background-color"})
+                        //$("#filloption1").css({ "pointer-events": "auto" });
+                        //$("#filloption12").css({ "pointer-events": "auto" });
 
-      <script>
-        function Brushsize(object) {
+                        var x = $("#editstylebackgroundcolor span.minicolors-swatch-color").css('background-color');
+                        $("#imgOpacity").css("background-color", x);
+                        $("#edit-slider-3").css({ "pointer-events": "auto" });
+                        $("#edit-slider-4").css({ "pointer-events": "auto" });
+                        $("#editstylebackgroundcolor").css({ "pointer-events": "auto" });
+                        $("#editstyleTexture").css({ "pointer-events": "auto" });
+                        $(".enableDisableOpacity label").css({ "cursor": "pointer" });
+                        $(".enableDisableOpacity").css({ "opacity": "1" })
+                        document.getElementById("filloption1").disabled = false;
+                        document.getElementById("filloption2").disabled = false;
+                        document.getElementById("filloption1").style.cursor = "default";
+                        document.getElementById("filloption2").style.cursor = "default";
 
-            object.value = object.value.replace(/[^0-9]/g, '');
-            if (parseInt(object.value) <= 0) {
-                object.value = 1;
-            }
-            if (parseInt(object.value) >= 1 && parseInt(object.value) <= 60) {
-                object.value = object.value;
-            }
-            if (parseInt(object.value) > 60) {
-                object.value = object.value.slice(0, 1);
 
-            }
 
-        }
-    </script>
-
-
-    <!--<script src="libs/jquery/1.11.3/jquery.min.js"></script>-->
-    <script src="libs/jquery/2.1.3/jquery.min.js"></script>
-    <script src="libs/jquery/1.11.4/jquery-ui.js"></script>
-    <script src="libs/jquery/jquery_plugin/jquery.mCustomScrollbar.concat.min.js"></script>
-    <script src="themes/default/scripts/bootstrap/3.3.5/bootstrap.js"></script>
-    <script src="libs/angular/1.4.9/angular.min.js"></script>
-    <script src="libs/angular/1.4.9/angular-route.min.js"></script>
-    <script src="libs/angular/1.4.9/angular-sanitize.min.js"></script>
-    <script src="libs/angular/1.4.9/ngStorage.js"></script>
-    <script src="content/js/custom/custom.js"></script>
-    <!--Annotation Toolbar : jcanvas Library-->
-
-    <script src="libs/jcanvas/jcanvas.min.js"></script>
-    <script src="libs/jcanvas/jcanvas.handle.min.js"></script>
-
-    <script src="libs/jinqJs.js"></script>
-    <script src="libs/jquery/jquery_plugin/jsPanel/jspanel/jquery.jspanel.js"></script>
-    <script src="libs/video_4_12_11/video_4_12_11.js"></script>
-    <script src="libs/jquery/jquery_plugin/SpeechBubble/bubble.js"></script>
-    <script src="libs/jquery/jquery_plugin/slider-pips/jquery-ui-slider-pips.js"></script>
-    <!--<script src="libs/jquery/jquery_plugin/jsPanel/jspanel/jquery.jspanel.min.js"></script>-->
-    <script src="app/main/AIA.js"></script>
-    <script src="app/main/Link.js"></script>
-    <script src="content/scripts/js/custom/custom.js"></script>
-    <script src="app/filters/ColorMatrixFilter.js"></script>
-    <script src="app/utility/Matrix.js"></script>
-    <script src="app/utility/Point.js"></script>
-    <script src="app/utility/Rectangle.js"></script>
-    <script src="app/utility/BitmapData.js"></script>
-    <script src="app/utility/Paint.js"></script>
-    <script src="app/controllers/DAController.js"></script>
-    <script src="app/controllers/CIController.js"></script>
-    <script src="app/controllers/CAController.js"></script>
-    <script src="app/controllers/3dAController.js"></script>
-    <script src="app/controllers/CurrBuildController.js"></script>
-    <script src="app/controllers/AnatTestController.js"></script>
-    <script src="app/controllers/LabExercController.js"></script>
-    <script src="app/controllers/ADAMImgController.js"></script>
-    <script src="app/controllers/AODController.js"></script>
-    <script src="app/controllers/HomeController.js"></script>
-    <script src="app/controllers/LinkController.js"></script>
-    <script src="app/services/AuthenticationService.js"></script>
-
-    <script src="app/services/DataService.js"></script>
-    <script src="libs/jquery/jquery_plugin/jqueryui.js"></script>
-
-    <script src="libs/jquery/jquery_plugin/color-picker/jquery.minicolors.min.js"></script>
-    <!--<script src="libs/colorpicker/jquery.minicolors.min.js"></script>-->
-    <!--<script src="libs/color-picker/jquery.minicolors.min.js"></script>-->
-
-    <script src="libs/sketch.js"></script>
-
-    <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>-->
-    <script src="libs/html2canvas.js"></script>
-    <script src="libs/FileSaver.js"></script>
-    <!--<script type="text/javascript">
-        $(function () {
-            $('#canvas').sketch();
-        });
-    </script>-->
-    <script>
-        $(function () {
-            $("#slider-range-min-2").slider({
-                range: "min",
-                min: 1,
-                max: 60,
-                value: 1,
-                slide: function (event, ui) {
-
-                    $("#btnBrushSize").val(ui.value);
-
-                },
-                stop: function (event, ui) {
-
-                    $("#paintLine").attr("data-size", ui.value);
+                    }
+                    else {
+                        $('#imgOpacity').css("background-color", "transparent");
+                        //$("#filloption1").css({ "pointer-events": "none" });
+                        //$("#filloption2").css({ "pointer-events": "none" });
+                        $("#edit-slider-3").css({ "pointer-events": "none" });
+                        $("#edit-slider-4").css({ "pointer-events": "none" });
+                        $("#editstylebackgroundcolor").css({ "pointer-events": "none" });
+                        $("#editstyleTexture").css({ "pointer-events": "none" });
+                        $(".enableDisableOpacity label").css({ "cursor": "default" });
+                        $(".enableDisableOpacity").css({ "opacity": ".5" })
+                        document.getElementById("filloption1").disabled = true;
+                        document.getElementById("filloption2").disabled = true;
+                        document.getElementById("filloption1").style.cursor = "default";
+                        document.getElementById("filloption2").style.cursor = "default";
 
-                }
 
-            });
 
+                    }
 
-            $("#btnBrushSize").keydown(function () {
-                var brushSizevalue = this.value;
-                $("#slider-range-min-2").slider("value", parseInt(brushSizevalue));
-            });
-            $("#btnBrushSize").keyup(function () {
-                var brushSizevalue = this.value;
-                $("#slider-range-min-2").slider("value", parseInt(brushSizevalue));
-            });
-            $("#btnBrushSizeIncrement").click(function () {
-                var brushIncrementVar = $("#btnBrushSize").val();
-                if (brushIncrementVar >= 60) {
-                    $("#slider-range-min-2").slider("value", 60);
-                }
-                else if (brushIncrementVar == "") {
-                    var brushIncrementedValue = 1;
-                    $("#btnBrushSize").val(brushIncrementedValue);
-                    $("#slider-range-min-2").slider("value", parseInt(brushIncrementedValue));
-                }
-                else {
-                    var brushIncrementedValue = parseInt(brushIncrementVar) + 1;
-                    $("#btnBrushSize").val(brushIncrementedValue);
-                    $("#slider-range-min-2").slider("value", parseInt(brushIncrementedValue));
                 }
-            });
-            $("#btnBrushSizeDecrease").click(function () {
-                var brushDecreaseVar = $("#btnBrushSize").val();
-                if (brushDecreaseVar == "") {
-                    var brushDecrementedValue = 1;
-                    $("#btnBrushSize").val(brushDecrementedValue);
-                    $("#slider-range-min-2").slider("value", parseInt(brushDecrementedValue));
-                }
-                else if (brushDecreaseVar <= 1) {
-                    $("#slider-range-min-2").slider("value", 1);
+                function enableDisableOutline() {
+
+                    if (document.getElementById('Outline-Option').checked) {
+                        var x = $("#outlineColor span.minicolors-swatch-color").css('background-color');
+                        $(".marginTopBtm10 div.outlinediv").css("border-color", x);
+                        //   var borderWidth = $("#outlineColor span.minicolors-swatch-color").css('border-width');
+                        // $("#imgOpacity").css("border-width", borderWidth);
+
+                        $("#borderWidthCanvasElement").css({ "pointer-events": "auto" });
+                        $("#outlineColor").css({ "pointer-events": "auto" });
+                        $(".setEnableDisableForEditShapeStyle").css({ "opacity": "1" })
+                    }
+                    else {
+                        $('.marginTopBtm10 div.outlinediv').css("border-color", "transparent");
+                        $("#borderWidthCanvasElement").css({ "pointer-events": "none" });
+                        $("#outlineColor").css({ "pointer-events": "none" });
+                        $(".setEnableDisableForEditShapeStyle").css({ "opacity": ".5" })
+                    }
                 }
-                else {
-                    var brushDecrementedValue = parseInt(brushDecreaseVar) - 1;
-                    $("#btnBrushSize").val(brushDecrementedValue);
-                    $("#slider-range-min-2").slider("value", parseInt(brushDecrementedValue));
+
+            </script>
+
+      <script>
+                function Brushsize(object) {
+
+                    object.value = object.value.replace(/[^0-9]/g, '');
+                    if (parseInt(object.value) <= 0) {
+                        object.value = 1;
+                    }
+                    if (parseInt(object.value) >= 1 && parseInt(object.value) <= 60) {
+                        object.value = object.value;
+                    }
+                    if (parseInt(object.value) > 60) {
+                        object.value = object.value.slice(0, 1);
+
+                    }
+
                 }
+            </script>
+
+
+            <!--<script src="libs/jquery/1.11.3/jquery.min.js"></script>-->
+            <script src="libs/jquery/2.1.3/jquery.min.js"></script>
+            <script src="libs/jquery/1.11.4/jquery-ui.js"></script>
+            <script src="libs/jquery/jquery_plugin/jquery.mCustomScrollbar.concat.min.js"></script>
+            <script src="themes/default/scripts/bootstrap/3.3.5/bootstrap.js"></script>
+            <script src="libs/angular/1.4.9/angular.min.js"></script>
+            <script src="libs/angular/1.4.9/angular-route.min.js"></script>
+            <script src="libs/angular/1.4.9/angular-sanitize.min.js"></script>
+            <script src="libs/angular/1.4.9/ngStorage.js"></script>
+            <script src="content/js/custom/custom.js"></script>
+            <!--Annotation Toolbar : jcanvas Library-->
+
+            <script src="libs/jcanvas/jcanvas.min.js"></script>
+            <script src="libs/jcanvas/jcanvas.handle.min.js"></script>
+
+            <script src="libs/jinqJs.js"></script>
+            <script src="libs/jquery/jquery_plugin/jsPanel/jspanel/jquery.jspanel.js"></script>
+            <script src="libs/video_4_12_11/video_4_12_11.js"></script>
+            <script src="libs/jquery/jquery_plugin/SpeechBubble/bubble.js"></script>
+            <script src="libs/jquery/jquery_plugin/slider-pips/jquery-ui-slider-pips.js"></script>
+            <!--<script src="libs/jquery/jquery_plugin/jsPanel/jspanel/jquery.jspanel.min.js"></script>-->
+            <script src="app/main/AIA.js"></script>
+            <script src="app/main/Link.js"></script>
+            <script src="content/scripts/js/custom/custom.js"></script>
+            <script src="app/filters/ColorMatrixFilter.js"></script>
+            <script src="app/utility/Matrix.js"></script>
+            <script src="app/utility/Point.js"></script>
+            <script src="app/utility/Rectangle.js"></script>
+            <script src="app/utility/BitmapData.js"></script>
+            <script src="app/utility/Paint.js"></script>
+            <script src="app/controllers/DAController.js"></script>
+            <script src="app/controllers/CIController.js"></script>
+            <script src="app/controllers/CAController.js"></script>
+            <script src="app/controllers/3dAController.js"></script>
+            <script src="app/controllers/CurrBuildController.js"></script>
+            <script src="app/controllers/AnatTestController.js"></script>
+            <script src="app/controllers/LabExercController.js"></script>
+            <script src="app/controllers/ADAMImgController.js"></script>
+            <script src="app/controllers/AODController.js"></script>
+            <script src="app/controllers/HomeController.js"></script>
+            <script src="app/controllers/LinkController.js"></script>
+            <script src="app/services/AuthenticationService.js"></script>
+
+            <script src="app/services/DataService.js"></script>
+            <script src="libs/jquery/jquery_plugin/jqueryui.js"></script>
+
+            <script src="libs/jquery/jquery_plugin/color-picker/jquery.minicolors.min.js"></script>
+            <!--<script src="libs/colorpicker/jquery.minicolors.min.js"></script>-->
+            <!--<script src="libs/color-picker/jquery.minicolors.min.js"></script>-->
+
+            <script src="libs/sketch.js"></script>
+
+            <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>-->
+            <script src="libs/html2canvas.js"></script>
+            <script src="libs/FileSaver.js"></script>
+            <!--<script type="text/javascript">
+            $(function () {
+                $('#canvas').sketch();
             });
-            $("#btnBrushSize").val($("#slider-range-min-2").slider("value"));
+        </script>-->
+            <script>
+                $(function () {
+                    $("#slider-range-min-2").slider({
+                        range: "min",
+                        min: 1,
+                        max: 60,
+                        value: 1,
+                        slide: function (event, ui) {
 
+                            $("#btnBrushSize").val(ui.value);
 
+                        },
+                        stop: function (event, ui) {
 
+                            $("#paintLine").attr("data-size", ui.value);
 
+                        }
 
-            //$("#slider-range-min-2").on("slidestart", function (event, ui) {
+                    });
+
+
+                    $("#btnBrushSize").keydown(function () {
+                        var brushSizevalue = this.value;
+                        $("#slider-range-min-2").slider("value", parseInt(brushSizevalue));
+                    });
+                    $("#btnBrushSize").keyup(function () {
+                        var brushSizevalue = this.value;
+                        $("#slider-range-min-2").slider("value", parseInt(brushSizevalue));
+                    });
+                    $("#btnBrushSizeIncrement").click(function () {
+                        var brushIncrementVar = $("#btnBrushSize").val();
+                        if (brushIncrementVar >= 60) {
+                            $("#slider-range-min-2").slider("value", 60);
+                        }
+                        else if (brushIncrementVar == "") {
+                            var brushIncrementedValue = 1;
+                            $("#btnBrushSize").val(brushIncrementedValue);
+                            $("#slider-range-min-2").slider("value", parseInt(brushIncrementedValue));
+                        }
+                        else {
+                            var brushIncrementedValue = parseInt(brushIncrementVar) + 1;
+                            $("#btnBrushSize").val(brushIncrementedValue);
+                            $("#slider-range-min-2").slider("value", parseInt(brushIncrementedValue));
+                        }
+                    });
+                    $("#btnBrushSizeDecrease").click(function () {
+                        var brushDecreaseVar = $("#btnBrushSize").val();
+                        if (brushDecreaseVar == "") {
+                            var brushDecrementedValue = 1;
+                            $("#btnBrushSize").val(brushDecrementedValue);
+                            $("#slider-range-min-2").slider("value", parseInt(brushDecrementedValue));
+                        }
+                        else if (brushDecreaseVar <= 1) {
+                            $("#slider-range-min-2").slider("value", 1);
+                        }
+                        else {
+                            var brushDecrementedValue = parseInt(brushDecreaseVar) - 1;
+                            $("#btnBrushSize").val(brushDecrementedValue);
+                            $("#slider-range-min-2").slider("value", parseInt(brushDecrementedValue));
+                        }
+                    });
+                    $("#btnBrushSize").val($("#slider-range-min-2").slider("value"));
 
-            //    $('.btnCursor').trigger('click');
-            //    $(".btn-annotation").removeClass("activebtncolor");
-            //    $('.btnCursor').addClass('activebtncolor');
-            //  //  ctx.clearRect(0, 0, canvasPaint.width, canvasPaint.height);
 
 
-            //});
-            //  $("#slider-range-min-2").on("slidechange", function (event, ui) { alert("ssasa"); });
 
 
-            $(function () {
-                $('[data-toggle="tooltip"]').tooltip();
-            })
-        });
-    </script>
-    <script>
-        (function ($) {
-            $(window).load(function () {
-                $(".sidebar").mCustomScrollbar({
-                    autoHideScrollbar: true,
-                    //theme:"rounded"
-                });
+                    //$("#slider-range-min-2").on("slidestart", function (event, ui) {
 
-            });
-        })(jQuery);
-    </script>
-    <script>
-        $(function () {
-            $(".modal").draggable();
-            $(".annotationTollbar").draggable();
-            $(".modeleditstyle").draggable();
-            $("#annotationTextModal").draggable();
-        });
-    </script>
-
-    <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 {
-                            console.log(hex);
-                            $("#text_area").css("color", hex);
-                        } catch (e) { }
-                        $(this).select();
-                    },
-                    theme: 'bootstrap'
+                    //    $('.btnCursor').trigger('click');
+                    //    $(".btn-annotation").removeClass("activebtncolor");
+                    //    $('.btnCursor').addClass('activebtncolor');
+                    //  //  ctx.clearRect(0, 0, canvasPaint.width, canvasPaint.height);
+
+
+                    //});
+                    //  $("#slider-range-min-2").on("slidechange", function (event, ui) { alert("ssasa"); });
+
+
+                    $(function () {
+                        $('[data-toggle="tooltip"]').tooltip();
+                    })
                 });
-            });
+            </script>
+            <script>
+                (function ($) {
+                    $(window).load(function () {
+                        $(".sidebar").mCustomScrollbar({
+                            autoHideScrollbar: true,
+                            //theme:"rounded"
+                        });
+
+                    });
+                })(jQuery);
+            </script>
+            <script>
+                $(function () {
+                    $(".modal").draggable();
+                    $(".annotationTollbar").draggable();
+                    $(".modeleditstyle").draggable();
+                    $("#annotationTextModal").draggable();
+                    $("#modal-settings").draggable();
+                });
+            </script>
+
+            <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 {
+                                    console.log(hex);
+                                    $("#text_area").css("color", hex);
+                                } catch (e) { }
+                                $(this).select();
+                            },
+                            theme: 'bootstrap'
+                        });
+                    });
+
+                    var $inlinehex = $('#inlinecolorhex h3 small');
+                    //alert($inlinehex);
+                    $('#inlinecolors').minicolors({
+                        inline: true,
+                        theme: 'bootstrap',
+                        change: function (hex) {
+                            if (!hex) return;
+
+                            $inlinehex.html(hex);
+                        }
+                    });
+                });
+            </script>
 
-            var $inlinehex = $('#inlinecolorhex h3 small');
-            //alert($inlinehex);
-            $('#inlinecolors').minicolors({
-                inline: true,
-                theme: 'bootstrap',
-                change: function (hex) {
-                    if (!hex) return;
 
-                    $inlinehex.html(hex);
-                }
-            });
-        });
-    </script>
+            <script type="text/javascript">
+                $(function () {
 
+                    $("#text-left").on('click', function () {
 
-    <script type="text/javascript">
-        $(function () {
+                        //Annotation: Formatting buttons color is not change when select.
 
-            $("#text-left").on('click', function () {
+                        $("#text-center").removeClass("ActiveFormattingButtonClass");
+                        $("#text-right").removeClass("ActiveFormattingButtonClass");
+                        $("#text-left").addClass("ActiveFormattingButtonClass");
+                        $("#text_area").css("text-align", "left");
 
-                //Annotation: Formatting buttons color is not change when select.
 
-                $("#text-center").removeClass("ActiveFormattingButtonClass");
-                $("#text-right").removeClass("ActiveFormattingButtonClass");
-                $("#text-left").addClass("ActiveFormattingButtonClass");
-                $("#text_area").css("text-align", "left");
+                    });
 
 
-            });
+                    $("#text-center").on('click', function () {
 
+                        //Annotation: Formatting buttons color is not change when select.
 
-            $("#text-center").on('click', function () {
+                        $("#text-right").removeClass("ActiveFormattingButtonClass");
+                        $("#text-left").removeClass("ActiveFormattingButtonClass");
+                        $("#text-center").addClass("ActiveFormattingButtonClass");
+                        $("#text_area").css("text-align", "center");
 
-                //Annotation: Formatting buttons color is not change when select.
 
-                $("#text-right").removeClass("ActiveFormattingButtonClass");
-                $("#text-left").removeClass("ActiveFormattingButtonClass");
-                $("#text-center").addClass("ActiveFormattingButtonClass");
-                $("#text_area").css("text-align", "center");
+                    });
 
 
-            });
+                    $("#text-right").on('click', function () {
 
+                        //Annotation: Formatting buttons color is not change when select.
 
-            $("#text-right").on('click', function () {
+                        $("#text-left").removeClass("ActiveFormattingButtonClass");
+                        $("#text-center").removeClass("ActiveFormattingButtonClass");
+                        $("#text-right").addClass("ActiveFormattingButtonClass");
+                        $("#text_area").css("text-align", "right");
+                    });
 
-                //Annotation: Formatting buttons color is not change when select.
 
-                $("#text-left").removeClass("ActiveFormattingButtonClass");
-                $("#text-center").removeClass("ActiveFormattingButtonClass");
-                $("#text-right").addClass("ActiveFormattingButtonClass");
-                $("#text_area").css("text-align", "right");
-            });
+                    $("#text-bold").on('click', function () {
 
+                        //Annotation: Formatting buttons color is not change when select.
+                        $("#text-bold").toggleClass("ActiveFormattingButtonClass");
 
-            $("#text-bold").on('click', function () {
+                        if ($("#text-bold").hasClass("ActiveFormattingButtonClass")) {
+                            $("#text_area").css("font-weight", "bold");
+                        }
+                        else {
+                            $("#text_area").css("font-weight", "normal");
+                        }
 
-                //Annotation: Formatting buttons color is not change when select.
-                $("#text-bold").toggleClass("ActiveFormattingButtonClass");
 
-                if ($("#text-bold").hasClass("ActiveFormattingButtonClass")) {
-                    $("#text_area").css("font-weight", "bold");
-                }
-                else {
-                    $("#text_area").css("font-weight", "normal");
-                }
+                    });
 
+                    $("#text-italic").on('click', function () {
 
-            });
+                        //Annotation: Formatting buttons color is not change when select.
+                        $("#text-italic").toggleClass("ActiveFormattingButtonClass");
+                        if ($("#text-italic").hasClass("ActiveFormattingButtonClass")) {
+                            $("#text_area").css("font-style", "italic");
+                        }
+                        else {
+                            $("#text_area").css("font-style", "normal");
+                        }
 
-            $("#text-italic").on('click', function () {
 
-                //Annotation: Formatting buttons color is not change when select.
-                $("#text-italic").toggleClass("ActiveFormattingButtonClass");
-                if ($("#text-italic").hasClass("ActiveFormattingButtonClass")) {
-                    $("#text_area").css("font-style", "italic");
-                }
-                else {
-                    $("#text_area").css("font-style", "normal");
-                }
+                    });
 
+                    $("#text-underline").on('click', function () {
 
-            });
+                        //Annotation: Formatting buttons color is not change when select.
+                        $("#text-underline").toggleClass("ActiveFormattingButtonClass");
 
-            $("#text-underline").on('click', function () {
+                        if ($("#text-underline").hasClass("ActiveFormattingButtonClass")) {
+                            $("#text_area").css("text-decoration", "underline");
+                        }
+                        else {
+                            $("#text_area").css("text-decoration", "none");
+                        }
 
-                //Annotation: Formatting buttons color is not change when select.
-                $("#text-underline").toggleClass("ActiveFormattingButtonClass");
 
-                if ($("#text-underline").hasClass("ActiveFormattingButtonClass")) {
-                    $("#text_area").css("text-decoration", "underline");
-                }
-                else {
-                    $("#text_area").css("text-decoration", "none");
-                }
+                    });
 
 
-            });
+                    $("#selected-font-size").change(function () {
 
+                        $("#text_area").css("font-size", $(this).val() + "px");
+                    });
 
-            $("#selected-font-size").change(function () {
+                    $("#selected-font-family").change(function () {
 
-                $("#text_area").css("font-size", $(this).val() + "px");
-            });
+                        $("#text_area").css("font-family", $(this).val());
 
-            $("#selected-font-family").change(function () {
+                    });
 
-                $("#text_area").css("font-family", $(this).val());
 
-            });
+                });
 
 
-        });
 
+            </script>
 
 
-    </script>
+            <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 () {
+                        borderWidth = $(this).val();
+                        borderColor = $('#outlineColor .minicolors >.minicolors-swatch > .minicolors-swatch-color').css("background-color");
 
+                        if (borderColor != null) {
+                            document.getElementById("imgOpacity").parentNode.style.border = borderWidth + "px" + " " + "solid" + " " + borderColor;
+                            //$("#imgOpacity").parent().css("border", borderWidth + "px" + " " + "solid" + borderColor);
+                        } else {
 
-    <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 () {
-                borderWidth = $(this).val();
-                borderColor = $('#outlineColor .minicolors >.minicolors-swatch > .minicolors-swatch-color').css("background-color");
+                            // $("#imgOpacity").parent().css("border", borderWidth + "px" + " " + "solid");
+                            document.getElementById("imgOpacity").parentNode.style.border = borderWidth + "px" + " " + "solid" + " " + borderColor;
 
-                if (borderColor != null) {
-                    document.getElementById("imgOpacity").parentNode.style.border = borderWidth + "px" + " " + "solid" + " " + borderColor;
-                    //$("#imgOpacity").parent().css("border", borderWidth + "px" + " " + "solid" + borderColor);
-                } else {
+                        }
+                    });
 
-                    // $("#imgOpacity").parent().css("border", borderWidth + "px" + " " + "solid");
-                    document.getElementById("imgOpacity").parentNode.style.border = borderWidth + "px" + " " + "solid" + " " + borderColor;
 
-                }
-            });
 
+                    $('.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') || '',
+                            format: $(this).attr('data-format') || 'hex',
+                            keywords: $(this).attr('data-keywords') || '',
+                            inline: $(this).attr('data-inline') === 'true',
+                            letterCase: $(this).attr('data-letterCase') || 'lowercase',
+                            opacity: $(this).attr('data-opacity'),
+                            position: $(this).attr('data-position') || 'bottom left',
+                            swatches: $(this).attr('data-swatches') ? $(this).attr('data-swatches').split('|') : [],
+                            change: function (value, opacity) {
+                                if (!value) return;
+                                if (opacity) value += ', ' + opacity;
+                                if (typeof console === 'object') {
+                                    console.log(value);
 
+                                    borderColor = value;
+                                    //$("#imgOpacity").parent().css("border", borderWidth + "px" + " " + "solid" + borderColor);
+                                    document.getElementById("imgOpacity").parentNode.style.border = borderWidth + "px" + " " + "solid" + " " + borderColor;
 
-            $('.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') || '',
-                    format: $(this).attr('data-format') || 'hex',
-                    keywords: $(this).attr('data-keywords') || '',
-                    inline: $(this).attr('data-inline') === 'true',
-                    letterCase: $(this).attr('data-letterCase') || 'lowercase',
-                    opacity: $(this).attr('data-opacity'),
-                    position: $(this).attr('data-position') || 'bottom left',
-                    swatches: $(this).attr('data-swatches') ? $(this).attr('data-swatches').split('|') : [],
-                    change: function (value, opacity) {
-                        if (!value) return;
-                        if (opacity) value += ', ' + opacity;
-                        if (typeof console === 'object') {
-                            console.log(value);
-
-                            borderColor = value;
-                            //$("#imgOpacity").parent().css("border", borderWidth + "px" + " " + "solid" + borderColor);
-                            document.getElementById("imgOpacity").parentNode.style.border = borderWidth + "px" + " " + "solid" + " " + borderColor;
 
+                                }
+                            },
+                            theme: 'bootstrap'
+                        });
 
-                        }
-                    },
-                    theme: 'bootstrap'
-                });
 
+                    });
 
-            });
 
+                    $('.outerBackgroundColor').each(function () {
 
-            $('.outerBackgroundColor').each(function () {
-
-                $(this).minicolors({
-                    control: $(this).attr('data-control') || 'hue',
-                    defaultValue: $(this).attr('data-defaultValue') || '',
-                    format: $(this).attr('data-format') || 'hex',
-                    keywords: $(this).attr('data-keywords') || '',
-                    inline: $(this).attr('data-inline') === 'true',
-                    letterCase: $(this).attr('data-letterCase') || 'lowercase',
-                    opacity: $(this).attr('data-opacity'),
-                    position: $(this).attr('data-position') || 'bottom left',
-                    swatches: $(this).attr('data-swatches') ? $(this).attr('data-swatches').split('|') : [],
-                    change: function (value, opacity) {
-                        if (!value) return;
-                        if (opacity) value += ', ' + opacity;
-                        if (typeof console === 'object') {
-                            console.log(value);
-                            $("#imgOpacity").css("background-color", value);
+                        $(this).minicolors({
+                            control: $(this).attr('data-control') || 'hue',
+                            defaultValue: $(this).attr('data-defaultValue') || '',
+                            format: $(this).attr('data-format') || 'hex',
+                            keywords: $(this).attr('data-keywords') || '',
+                            inline: $(this).attr('data-inline') === 'true',
+                            letterCase: $(this).attr('data-letterCase') || 'lowercase',
+                            opacity: $(this).attr('data-opacity'),
+                            position: $(this).attr('data-position') || 'bottom left',
+                            swatches: $(this).attr('data-swatches') ? $(this).attr('data-swatches').split('|') : [],
+                            change: function (value, opacity) {
+                                if (!value) return;
+                                if (opacity) value += ', ' + opacity;
+                                if (typeof console === 'object') {
+                                    console.log(value);
+                                    $("#imgOpacity").css("background-color", value);
 
-                        }
-                    },
-                    theme: 'bootstrap'
-                });
+                                }
+                            },
+                            theme: 'bootstrap'
+                        });
 
-            });
+                    });
 
 
-        });
-    </script>
+                });
+            </script>
 
-    <script>
-        $(function () {
-            $("#slider-range-min-3").slider({
-                range: "min",
-                min: 0,
-                max: 100,
-                value: 20,
-                change: function (event, ui) {
+            <script>
+                $(function () {
+                    $("#slider-range-min-3").slider({
+                        range: "min",
+                        min: 0,
+                        max: 100,
+                        value: 20,
+                        change: function (event, ui) {
 
 
-                }
-            });
+                        }
+                    });
 
 
 
-        });
-    </script>
+                });
+            </script>
 
-    <script>
-        $(function () {
+            <script>
+                $(function () {
 
 
 
-            $("#slider-range-min-4").slider(
-           {
-               range: "min",
-               value: .5,
-               min: 0,
-               max: 1,
-               step: .1,
-               slide: function (event, ui) {
+                    $("#slider-range-min-4").slider(
+                   {
+                       range: "min",
+                       value: .5,
+                       min: 0,
+                       max: 1,
+                       step: .1,
+                       slide: function (event, ui) {
 
-                   $(".marginTopBtm10 .imgopacity").css("opacity", ui.value);
-                   $(".marginTopBtm10 div.outlinediv").css("opacity", ui.value);
-               }
+                           $(".marginTopBtm10 .imgopacity").css("opacity", ui.value);
+                           $(".marginTopBtm10 div.outlinediv").css("opacity", ui.value);
+                       }
 
-           }
+                   }
 
-);
+        );
 
-        });
+                });
 
 
 
-    </script>
+            </script>
 
 
 
-    <script>
-        $(function () {
+            <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");
-            });
+                    $("#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');
+                    $("#DrawMode").on('mouseover', function () {
+                        $("#draw-block").addClass("custom-tooltip-annotation");
+                        $(".custom-tooltip-annotation").css('display', 'block');
 
-            }).on('mouseout', function () {
+                    }).on('mouseout', function () {
 
-                $(".custom-tooltip-annotation").css('display', 'none');
-                $("#draw-block").removeClass("custom-tooltip-annotation");
-            });
+                        $(".custom-tooltip-annotation").css('display', 'none');
+                        $("#draw-block").removeClass("custom-tooltip-annotation");
+                    });
 
-            //#7931
-            $("#OnEdtShape").on('mouseover', function () {
-                $("#edit-block").addClass("custom-tooltip-annotation-edit");
-                $(".custom-tooltip-annotation-edit").css('display', 'block');
+                    //#7931
+                    $("#OnEdtShape").on('mouseover', function () {
+                        $("#edit-block").addClass("custom-tooltip-annotation-edit");
+                        $(".custom-tooltip-annotation-edit").css('display', 'block');
 
-            }).on('mouseout', function () {
+                    }).on('mouseout', function () {
 
-                $(".custom-tooltip-annotation-edit").css('display', 'none');
-                $("#edit-block").removeClass("custom-tooltip-annotation-edit");
-            });
+                        $(".custom-tooltip-annotation-edit").css('display', 'none');
+                        $("#edit-block").removeClass("custom-tooltip-annotation-edit");
+                    });
 
-        });
-    </script>
-    <!-- Export Image Save Click-->
-    <script>
-        $(function () {
-            $("#btnSaveEI").click(function () {
-                html2canvas($("#canvasDiv"), {
-                    onrendered: function (canvas) {
-                        theCanvas = canvas;
-                        var fileName = document.getElementById("filename").value + '.jpg';
-                        if (typeof (fileName) == "undefined" || fileName == ".jpg")
-                            fileName = "Untitled.jpg"
-                        var dataURL = canvas.toDataURL("image/jpeg");
-                        var blob = dataURItoBlob(dataURL);
-                        saveAs(blob, fileName);
-                        $("#filename").val("");
-                    }
                 });
-                $(".export-image").css("display", "none");
-            });
-        });
-        function dataURItoBlob(dataURI) {
-            var byteString = atob(dataURI.split(',')[1]);
-            var ab = new ArrayBuffer(byteString.length);
-            var ia = new Uint8Array(ab);
-            for (var i = 0; i < byteString.length; i++) {
-                ia[i] = byteString.charCodeAt(i);
-            }
-            return new Blob([ab], { type: 'image/jpeg' });
-        }
-    </script>
-    <script>
-        function ResizeImage(sizePercent) {
-            var autoWidth = 427;
-            var autoHeight = 547;
-            var dvAutoSpnFontSize = 12;
-            var imgLogoW = 77;
-            var fullWidth = 620; //$('#canvasDiv').width();
-            var fullHeight = 876; //$('#canvasDiv').height();
-
-            if (sizePercent == 0) {
-                $('#printBoxPor').width(autoWidth).height(autoHeight);//.height(dvPrintBoxPorH * sizePercent);
-                $('#printBoxLan').width(autoHeight).height(autoWidth);
-                $('#dvPortrait').width(autoWidth);
-                $('#dvLandscape').width(autoHeight);
-                $('.span-font').attr('style', 'font-size: ' + (dvAutoSpnFontSize * .65).toFixed() + 'px');
-                $(".logo-image").attr('width', imgLogoW * .65);
-            }
-
-            else if (sizePercent == 1) {
-                $('#dvPortrait').width(fullWidth * sizePercent);
-                $('#dvLandscape').width(fullHeight * sizePercent);
-                $('#printBoxPor').width(fullWidth * sizePercent).height(fullHeight * sizePercent);
-                $('#printBoxLan').width(fullHeight * sizePercent).height(fullWidth * sizePercent);
-                $('.span-font').attr('style', 'font-size: ' + dvAutoSpnFontSize + 'px');
-                $(".logo-image").attr('width', imgLogoW);
-            }
-
-            else {
-                $('#dvPortrait').width(fullWidth * sizePercent);
-                $('#dvLandscape').width(fullHeight * sizePercent);
-                $('.span-font').attr('style', 'font-size: ' + (dvAutoSpnFontSize * sizePercent).toFixed() + 'px !important');
-                $(".logo-image").attr('width', (imgLogoW * sizePercent).toFixed());
-                if (sizePercent > 1) {
-                    $('#printBoxPor').width(fullWidth * sizePercent).height(fullHeight * sizePercent);
-                    $('#printBoxLan').width(fullHeight * sizePercent).height(fullWidth * sizePercent);
+            </script>
+            <!-- Export Image Save Click-->
+            <script>
+                $(function () {
+                    $("#btnSaveEI").click(function () {
+                        html2canvas($("#canvasDiv"), {
+                            onrendered: function (canvas) {
+                                theCanvas = canvas;
+                                var fileName = document.getElementById("filename").value + '.jpg';
+                                if (typeof (fileName) == "undefined" || fileName == ".jpg")
+                                    fileName = "Untitled.jpg"
+                                var dataURL = canvas.toDataURL("image/jpeg");
+                                var blob = dataURItoBlob(dataURL);
+                                saveAs(blob, fileName);
+                                $("#filename").val("");
+                            }
+                        });
+                        $(".export-image").css("display", "none");
+                    });
+                });
+                function dataURItoBlob(dataURI) {
+                    var byteString = atob(dataURI.split(',')[1]);
+                    var ab = new ArrayBuffer(byteString.length);
+                    var ia = new Uint8Array(ab);
+                    for (var i = 0; i < byteString.length; i++) {
+                        ia[i] = byteString.charCodeAt(i);
+                    }
+                    return new Blob([ab], { type: 'image/jpeg' });
                 }
-                else {
-                    $('#printBoxPor').width(fullWidth * sizePercent).height(fullHeight * sizePercent);
-                    $('#printBoxLan').width(fullHeight * sizePercent).height(fullWidth * sizePercent);
+            </script>
+            <script>
+                function ResizeImage(sizePercent) {
+                    var autoWidth = 427;
+                    var autoHeight = 547;
+                    var dvAutoSpnFontSize = 12;
+                    var imgLogoW = 77;
+                    var fullWidth = 620; //$('#canvasDiv').width();
+                    var fullHeight = 876; //$('#canvasDiv').height();
+
+                    if (sizePercent == 0) {
+                        $('#printBoxPor').width(autoWidth).height(autoHeight);//.height(dvPrintBoxPorH * sizePercent);
+                        $('#printBoxLan').width(autoHeight).height(autoWidth);
+                        $('#dvPortrait').width(autoWidth);
+                        $('#dvLandscape').width(autoHeight);
+                        $('.span-font').attr('style', 'font-size: ' + (dvAutoSpnFontSize * .65).toFixed() + 'px');
+                        $(".logo-image").attr('width', imgLogoW * .65);
+                    }
+
+                    else if (sizePercent == 1) {
+                        $('#dvPortrait').width(fullWidth * sizePercent);
+                        $('#dvLandscape').width(fullHeight * sizePercent);
+                        $('#printBoxPor').width(fullWidth * sizePercent).height(fullHeight * sizePercent);
+                        $('#printBoxLan').width(fullHeight * sizePercent).height(fullWidth * sizePercent);
+                        $('.span-font').attr('style', 'font-size: ' + dvAutoSpnFontSize + 'px');
+                        $(".logo-image").attr('width', imgLogoW);
+                    }
+
+                    else {
+                        $('#dvPortrait').width(fullWidth * sizePercent);
+                        $('#dvLandscape').width(fullHeight * sizePercent);
+                        $('.span-font').attr('style', 'font-size: ' + (dvAutoSpnFontSize * sizePercent).toFixed() + 'px !important');
+                        $(".logo-image").attr('width', (imgLogoW * sizePercent).toFixed());
+                        if (sizePercent > 1) {
+                            $('#printBoxPor').width(fullWidth * sizePercent).height(fullHeight * sizePercent);
+                            $('#printBoxLan').width(fullHeight * sizePercent).height(fullWidth * sizePercent);
+                        }
+                        else {
+                            $('#printBoxPor').width(fullWidth * sizePercent).height(fullHeight * sizePercent);
+                            $('#printBoxLan').width(fullHeight * sizePercent).height(fullWidth * sizePercent);
+                        }
+                    }
                 }
-            }
-        }
-    </script>
+            </script>
 </body>
 </html>
\ No newline at end of file