diff --git a/src/app/utilities/compose-packages/ComposePackages.html b/src/app/utilities/compose-packages/ComposePackages.html
index 0d66e0f..1067054 100644
--- a/src/app/utilities/compose-packages/ComposePackages.html
+++ b/src/app/utilities/compose-packages/ComposePackages.html
@@ -23,7 +23,7 @@
     </button>
   </div>
   <div class="modal-body">
-    <div class="form-group row">
+    <div class="form-group row mb-3">
       <label class="col-sm-12 col-form-label mandatory-label" [ngClass]="{'text-danger': packagesForm.invalid === true && submitted === true}">{{'MANDATORYCHECK' | translate}}</label>
       <label class="col-sm-6 col-form-label">{{'PACKAGE' | translate}} {{'NAME' | translate}}*</label>
       <div class="col-sm-6">
diff --git a/src/app/utilities/confirmation-topology/ConfirmationTopologyComponent.html b/src/app/utilities/confirmation-topology/ConfirmationTopologyComponent.html
index 92a2726..3594a37 100644
--- a/src/app/utilities/confirmation-topology/ConfirmationTopologyComponent.html
+++ b/src/app/utilities/confirmation-topology/ConfirmationTopologyComponent.html
@@ -50,7 +50,7 @@
       <i class="fas fa-times-circle text-danger"></i>
     </button>
   </div>
-  <div class="modal-body">
+  <div class="modal-body ms-2">
     <span *ngIf="topologyType === 'Delete'">{{'DELETECONFIRMPOPUPMESSAGE' | translate}} <b>{{ topologyname }}</b> ?</span>
     <ul *ngIf="topologyType === 'Info'">
       <li>
diff --git a/src/app/utilities/edit-packages/EditPackagesComponent.html b/src/app/utilities/edit-packages/EditPackagesComponent.html
index f099af1..30ae5e0 100644
--- a/src/app/utilities/edit-packages/EditPackagesComponent.html
+++ b/src/app/utilities/edit-packages/EditPackagesComponent.html
@@ -15,34 +15,34 @@
 
 Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
 -->
-<div class="form-group row">
-  <div class="d-flex align-items-center header-style">{{'EDIT' | translate}}&nbsp;<span
+<div class="form-group row mb-3">
+  <div class="d-flex align-items-center header-style p-0">{{'EDIT' | translate}}&nbsp;<span
       class="text-uppercase">{{pacakgeType}}&nbsp;</span>{{'DESCRIPTOR' | translate}}</div>
 </div>
 <form *ngIf="defaults[mode]">
-  <div class="row">
+  <div class="row mb-2">
     <div class="col-2">
       <div class="form-group">
-        <select class="form-control custom-select" name="state" [(ngModel)]="mode" (ngModelChange)="changeMode()">
+        <select class="form-control select" name="state" [(ngModel)]="mode" (ngModelChange)="changeMode()">
           <option *ngFor="let types of fileTypes;" [value]="types.value">
             {{types.viewValue}}</option>
         </select>
       </div>
     </div>
     <div class="col-4">
-      <div class="btn-group-toggle mb-1 mr-1 float-left">
+      <div class="btn-group-toggle mb-1 me-1 float-start">
         <label class="btn btn-light" [class.active]="readOnly">
-          <input type="checkbox" [(ngModel)]="readOnly" name="readOnly" autocomplete="off">
+          <input class="checkbox d-none" type="checkbox" [(ngModel)]="readOnly" name="readOnly" autocomplete="off">
           {{'READONLYMODE' | translate}} ({{'CURRENTLY' | translate}} {{ (readOnly ? 'ON' : 'OFF') | translate }})
         </label>
       </div>
     </div>
-    <div class="col-6 text-right">
-      <button type="button" class="btn btn-primary mr-2" routerLink="/packages/{{navigatePath}}/compose/{{paramsID}}"
+    <div class="col-6 text-end">
+      <button type="button" class="btn btn-primary me-2" routerLink="/packages/{{navigatePath}}/compose/{{paramsID}}"
         [hidden]="navigatePath==='netslice'">
         <i class="fa fa-sitemap" aria-hidden="true"></i>&nbsp;{{'SHOWGRAPH' | translate}}
       </button>
-      <button type="button" class="btn btn-primary mr-2" (click)="update(true)" [hidden]="navigatePath==='netslice'">
+      <button type="button" class="btn btn-primary me-2" (click)="update(true)" [hidden]="navigatePath==='netslice'">
         <i class="fa fa-save" aria-hidden="true"></i>&nbsp;{{'UPDATESHOWGRAPH' | translate}}
       </button>
       <button type="button" class="btn btn-primary" (click)="update(false)">
diff --git a/src/app/utilities/edit-packages/EditPackagesComponent.scss b/src/app/utilities/edit-packages/EditPackagesComponent.scss
index 5a9c483..3844392 100644
--- a/src/app/utilities/edit-packages/EditPackagesComponent.scss
+++ b/src/app/utilities/edit-packages/EditPackagesComponent.scss
@@ -15,6 +15,34 @@
 
  Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
 */
-.ngx-codemirror {
-    font-size: 14px;
+@use "sass:math";
+@import "/src/assets/scss/mixins/mixin.scss";
+@import "/src/assets/scss/variable.scss";
+.btn.active {
+    color: $gray-900;
+    background-color: $paleblue;
+    border-color: $paleblue;
+}
+.btn-light:hover {
+    color: $gray-900;
+    background-color: $paleblue;
+    border-color: $paleblue;
+}
+select.form-control {
+    background-color: $white !important;
+    padding: 0.375rem 1.75rem 0.375rem 0.75rem;
+    @include flexbox(inline-block, null, null, null, null, null);
+    vertical-align: middle;
+    background: $white
+        url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E")
+        no-repeat right 0.75rem center;
+    background-size: 8px 10px;
+    @include border(all, 1, solid, $gray-200);
+    @include roundedCorners(2);
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
+    &::-ms-expand {
+        visibility: hidden;
+    }
 }
\ No newline at end of file
diff --git a/src/app/utilities/healing/HealingComponent.html b/src/app/utilities/healing/HealingComponent.html
index ad22db6..84c413a 100644
--- a/src/app/utilities/healing/HealingComponent.html
+++ b/src/app/utilities/healing/HealingComponent.html
@@ -23,7 +23,7 @@
 </div>
 <form [formGroup]="healingForm" (ngSubmit)="manualHealingTrigger()" autocomplete="off">
     <div class="modal-body">
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <label class="col-sm-12 col-form-label mandatory-label"
                 [ngClass]="{'text-danger': healingForm.invalid === true && submitted === true}">
                 {{'MANDATORYCHECK' | translate}}
@@ -39,7 +39,7 @@
                 <small class="form-text text-muted" *ngIf="selectedvnfId !== ''">vnfd-id : {{ selectedvnfId }}</small>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="memberVnfIndex"> {{'DAY1OPERATION' | translate}}</label>
             </div>
@@ -49,8 +49,8 @@
                 </ng-select>
             </div>
         </div>
-        <div class="form-group row p-2 bg-light text-white justify-content-end">
-            <div class="col-5">
+        <div class="form-group row p-2 bg-light text-white justify-content-end" mb-3>
+            <div class="col-5 text-end">
                 <button class="button-xs" type="button" class="btn btn-primary" (click)="addVdu()">
                     <i class="fas fa-plus-circle"></i>{{'SELECTVDU' | translate}}</button>
             </div>
@@ -60,34 +60,34 @@
                 <div class="form-group row" [formGroupName]="i">
                     <div class="card bg-light">
                         <div class="card-body">
-                            <div class="form-group row">
-                                <label class="col-sm-3 col-md-3 col-form-label" for="vduId_{{i}}">{{'VDUID' |
+                            <div class="form-group row mb-3">
+                                <label class="col-sm-3 col-md-3 col-form-label ps-0" for="vduId_{{i}}">{{'VDUID' |
                                     translate}}</label>
-                                <div class="col-sm-8 col-md-8">
+                                <div class="col-sm-8 col-md-8 ps-1">
                                     <ng-select (change)="getCountIndex($event.VDU)"
                                         placeholder="{{'SELECT' | translate}}" [items]="vduId" bindLabel="VDU"
                                         bindValue="VDU" formControlName="vduId" id="vduId_{{i}}"
                                         [ngClass]="{ 'is-invalid': submitted && params.controls.vduId.errors }">
                                     </ng-select>
                                 </div>
-                                <label class="col-sm-3 col-md-3 col-form-label" for="countIndex_{{i}}">{{'COUNTINDEX' |
+                                <label class="col-sm-3 col-md-3 col-form-label ps-0" for="countIndex_{{i}}">{{'COUNTINDEX' |
                                     translate}}</label>
-                                <div class="col-sm-8 col-md-8">
+                                <div class="col-sm-8 col-md-8 ps-1">
                                     <ng-select placeholder="{{'SELECT' | translate}}" [items]="countIndex"
                                         bindLabel="count-index" bindValue="count-index" formControlName="countIndex"
                                         id="countIndex_{{i}}"
                                         [ngClass]="{ 'is-invalid': submitted && params.controls.countIndex.errors }">
                                     </ng-select>
                                 </div>
-                                <label class="col-sm-3 col-md-3 col-form-label" for="runDay1_{{i}}">{{'DAY1OPERATION' |
+                                <label class="col-sm-3 col-md-3 col-form-label ps-0" for="runDay1_{{i}}">{{'DAY1OPERATION' |
                                     translate}}</label>
-                                <div class="col-sm-8 col-md-8">
+                                <div class="col-sm-8 col-md-8 ps-1">
                                     <ng-select formControlName="runDay1" [clearable]="false" placeholder="{{'DAY1OPERATION' |
                                 translate}}" [items]="day1Operation" bindLabel="name" bindValue="id">
                                     </ng-select>
                                 </div>
                                 <div class="col-sm-1">
-                                    <button class="button-xs" type="button" class="close" (click)="removeMapping(i)"
+                                    <button class="button-xs" type="button" class="remove-mapping close" (click)="removeMapping(i)"
                                         placement="right" ngbTooltip="{{ 'CANCEL' | translate }}">
                                         <i class="fas fa-minus-circle text-danger"></i>
                                     </button>
diff --git a/src/app/utilities/healing/HealingComponent.scss b/src/app/utilities/healing/HealingComponent.scss
index f7fbc0a..a801a0a 100644
--- a/src/app/utilities/healing/HealingComponent.scss
+++ b/src/app/utilities/healing/HealingComponent.scss
@@ -15,3 +15,9 @@
 
  Author: SANDHYA JS (sandhya.j@tataelxsi.co.in)
 */
+.remove-mapping {
+   top: 50px;
+}
+.modal-body .row {
+   margin-bottom: 1px;
+ }
diff --git a/src/app/utilities/healing/HealingComponent.ts b/src/app/utilities/healing/HealingComponent.ts
index b3a1072..6360c48 100644
--- a/src/app/utilities/healing/HealingComponent.ts
+++ b/src/app/utilities/healing/HealingComponent.ts
@@ -18,7 +18,6 @@
 /**
  * @file Healing Component
  */
-import { isNullOrUndefined } from 'util';
 import { HttpHeaders } from '@angular/common/http';
 import { Component, Injector, Input, OnInit } from '@angular/core';
 import { AbstractControl, FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -29,7 +28,7 @@
 import { environment } from 'environment';
 import { VDUMAP, VDUMAPPINGS } from 'NSInstanceModel';
 import { RestService } from 'RestService';
-import { SharedService } from 'SharedService';
+import { SharedService, isNullOrUndefined } from 'SharedService';
 import { InstanceData, VDUR, VNFInstanceDetails } from 'VNFInstanceModel';
 /**
  * Creating component
diff --git a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts
index 08e5e97..1582bc4 100644
--- a/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts
+++ b/src/app/utilities/ns-instances-action/NSInstancesActionComponent.ts
@@ -18,7 +18,6 @@
 /**
  * @file NS InstancesAction Component
  */
-import { isNullOrUndefined } from 'util';
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Injector } from '@angular/core';
 import { Router } from '@angular/router';
 import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
@@ -35,7 +34,7 @@
 import { RestService } from 'RestService';
 import { forkJoin, Observable } from 'rxjs';
 import { ScalingComponent } from 'ScalingComponent';
-import { SharedService } from 'SharedService';
+import { SharedService, isNullOrUndefined } from 'SharedService';
 import { ShowInfoComponent } from 'ShowInfoComponent';
 import { StartStopRebuildComponent } from 'StartStopRebuildComponent';
 import { VerticalScalingComponent } from 'VerticalScalingComponent';
diff --git a/src/app/utilities/ns-update/NsUpdateComponent.html b/src/app/utilities/ns-update/NsUpdateComponent.html
index 2c98599..337c283 100644
--- a/src/app/utilities/ns-update/NsUpdateComponent.html
+++ b/src/app/utilities/ns-update/NsUpdateComponent.html
@@ -23,7 +23,7 @@
 </div>
 <form [formGroup]="nsUpdateForm" (ngSubmit)="triggerNsUpdate()" autocomplete="off">
     <div class="modal-body">
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <label class="col-sm-12 col-form-label mandatory-label"
                 [ngClass]="{'text-danger': nsUpdateForm.invalid === true && submitted === true}">
                 {{'MANDATORYCHECK' | translate}}
@@ -37,19 +37,19 @@
                     [ngClass]="{ 'is-invalid': submitted && f.updateType.errors }"></ng-select>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="memberVnfIndex"> {{'MEMBERVNFINDEX' | translate}} *</label>
             </div>
             <div class="col-sm-6">
-                <ng-select formControlName="memberVnfIndex" [clearable]="false" [(ngModel)]="memberIndexValue" (change) = 'getSelectedVNF($event.vnfinstanceId)'
-                    placeholder="{{'SELECTMEMBERVNFINDEX' | translate}}" [items]="memberTypes" bindLabel="id"
-                    bindValue="id" [ngClass]="{ 'is-invalid': submitted && f.memberVnfIndex.errors }">
+                <ng-select formControlName="memberVnfIndex" [clearable]="false" [(ngModel)]="memberIndexValue" (change)='getSelectedVNF($event.vnfinstanceId)'
+                    placeholder="{{'SELECTMEMBERVNFINDEX' | translate}}" [items]="memberTypes"
+                    bindLabel="id" bindValue="id" [ngClass]="{ 'is-invalid': submitted && f.memberVnfIndex.errors }">
                 </ng-select>
                 <small class="form-text text-muted" *ngIf="selectedvnfId !== ''">vnfd : {{ selectedvnfId }}</small>
             </div>
         </div>
-        <div class="form-group row" *ngIf="!vnfdIdShow">
+        <div class="form-group row mb-3" *ngIf="!vnfdIdShow">
             <div class="col-sm-6">
                 <label for="vnfdId"> {{'VNFDNAME' | translate}} *</label>
             </div>
diff --git a/src/app/utilities/ns-update/NsUpdateComponent.ts b/src/app/utilities/ns-update/NsUpdateComponent.ts
index 7efba70..724bba3 100644
--- a/src/app/utilities/ns-update/NsUpdateComponent.ts
+++ b/src/app/utilities/ns-update/NsUpdateComponent.ts
@@ -18,7 +18,6 @@
 /**
  * @file Ns Update Component
  */
-import { isNullOrUndefined } from 'util';
 import { HttpHeaders } from '@angular/common/http';
 import { Component, Injector, Input, OnInit } from '@angular/core';
 import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -29,7 +28,7 @@
 import { environment } from 'environment';
 import { NSUPDATE, TERMINATEVNF } from 'NSInstanceModel';
 import { RestService } from 'RestService';
-import { SharedService } from 'SharedService';
+import { SharedService, isNullOrUndefined } from 'SharedService';
 import { VNFD } from 'VNFDModel';
 import { InstanceData, VNFInstanceDetails } from 'VNFInstanceModel';
 import { WarningComponent } from 'WarningComponent';
diff --git a/src/app/utilities/page-per-row/PagePerRow.html b/src/app/utilities/page-per-row/PagePerRow.html
index a63ebb4..1bab5d5 100644
--- a/src/app/utilities/page-per-row/PagePerRow.html
+++ b/src/app/utilities/page-per-row/PagePerRow.html
@@ -16,7 +16,7 @@
 Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
 -->
 <div class="page-per-row">
-  <label class="mr-2 mt-2">
+  <label class="me-2">
     <b>{{'ENTRIES' | translate}}</b>
   </label>
   <select class="form-control custom-select" (change)="onSelectRow($event.target.value)">
diff --git a/src/app/utilities/projects-action/ProjectsActionComponent.html b/src/app/utilities/projects-action/ProjectsActionComponent.html
index 3f193c2..6f0ab70 100644
--- a/src/app/utilities/projects-action/ProjectsActionComponent.html
+++ b/src/app/utilities/projects-action/ProjectsActionComponent.html
@@ -20,7 +20,7 @@
         <button type="button" class="btn btn-primary dropdown-toggle action-button" ngbDropdownToggle>
             {{'ACTION' | translate}}
         </button>
-        <div class="dropdown-menu list-action-dropdown" ngbDropdownMenu>
+        <div class="dropdown-menu list-action-dropdown mt-1" ngbDropdownMenu>
             <button type="button" class="btn btn-primary dropdown-item" (click)="projectEdit()" placement="left"
                 container="body" ngbTooltip="{{'EDIT' | translate}}">
                 <i class="fa fa-edit icons"></i> {{'EDIT' | translate}}
diff --git a/src/app/utilities/roles-action/RolesActionComponent.html b/src/app/utilities/roles-action/RolesActionComponent.html
index 522ba83..1487a7c 100644
--- a/src/app/utilities/roles-action/RolesActionComponent.html
+++ b/src/app/utilities/roles-action/RolesActionComponent.html
@@ -20,7 +20,7 @@
       <button type="button" class="btn btn-primary dropdown-toggle action-button" ngbDropdownToggle>
           {{'ACTION' | translate}}
       </button>
-      <div class="dropdown-menu list-action-dropdown" ngbDropdownMenu>
+      <div class="dropdown-menu list-action-dropdown mt-1" ngbDropdownMenu>
           <button type="button" class="btn btn-primary dropdown-item" (click)="editRole()" placement="left"
               container="body" ngbTooltip="{{'EDIT' | translate}}">
               <i class="fa fa-edit icons"></i> {{'EDIT' | translate}}
diff --git a/src/app/utilities/scaling/ScalingComponent.html b/src/app/utilities/scaling/ScalingComponent.html
index 10d5a16..fa6b960 100644
--- a/src/app/utilities/scaling/ScalingComponent.html
+++ b/src/app/utilities/scaling/ScalingComponent.html
@@ -23,7 +23,7 @@
 </div>
 <form [formGroup]="scalingForm" (ngSubmit)="manualScalingTrigger()" autocomplete="off">
     <div class="modal-body">
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <label class="col-sm-12 col-form-label mandatory-label"
                 [ngClass]="{'text-danger': scalingForm.invalid === true && submitted === true}">
                 {{'MANDATORYCHECK' | translate}}
@@ -37,7 +37,7 @@
                 <small class="form-text text-muted" *ngIf="selectedVNFID !== ''">vnfd-id : {{ selectedVNFID }}</small>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-12">
                 <ng-select formControlName="scalingname" [clearable]="false" placeholder="Select scaling-aspect *"
                     [items]="scalingGroup" bindLabel="name" bindValue="id"
@@ -45,7 +45,7 @@
                 </ng-select>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-12">
                 <ng-select formControlName="scaleType" [clearable]="false" placeholder="Select Scale Type *"
                     [items]="scaleTypes" bindLabel="name" bindValue="id"
diff --git a/src/app/utilities/scaling/ScalingComponent.ts b/src/app/utilities/scaling/ScalingComponent.ts
index be15660..46a257d 100644
--- a/src/app/utilities/scaling/ScalingComponent.ts
+++ b/src/app/utilities/scaling/ScalingComponent.ts
@@ -18,7 +18,6 @@
 /**
  * @file Scaling Component
  */
-import { isNullOrUndefined } from 'util';
 import { HttpHeaders } from '@angular/common/http';
 import { Component, Injector, Input, OnInit } from '@angular/core';
 import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -28,7 +27,7 @@
 import { APIURLHEADER, ERRORDATA, MODALCLOSERESPONSEDATA, URLPARAMS } from 'CommonModel';
 import { environment } from 'environment';
 import { RestService } from 'RestService';
-import { SharedService } from 'SharedService';
+import { SharedService, isNullOrUndefined } from 'SharedService';
 import { DF, SCALING, VNFD } from 'VNFDModel';
 import { InstanceData, VNFInstanceDetails } from 'VNFInstanceModel';
 /**
diff --git a/src/app/utilities/start-stop-rebuild/StartStopRebuildComponent.ts b/src/app/utilities/start-stop-rebuild/StartStopRebuildComponent.ts
index 9940129..aed0444 100644
--- a/src/app/utilities/start-stop-rebuild/StartStopRebuildComponent.ts
+++ b/src/app/utilities/start-stop-rebuild/StartStopRebuildComponent.ts
@@ -18,7 +18,6 @@
 /**
  * @file StartStopRebuild Component
  */
-import { isNullOrUndefined } from 'util';
 import { HttpHeaders } from '@angular/common/http';
 import { Component, Injector, Input, OnInit } from '@angular/core';
 import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -28,7 +27,7 @@
 import { environment } from 'environment';
 import { StartStopRebuild } from 'NSInstanceModel';
 import { RestService } from 'RestService';
-import { SharedService } from 'SharedService';
+import { SharedService, isNullOrUndefined } from 'SharedService';
 import { DF, VNFD } from 'VNFDModel';
 import { InstanceData, VDUR, VNFInstanceDetails } from 'VNFInstanceModel';
 
diff --git a/src/app/utilities/users-action/UsersActionComponent.html b/src/app/utilities/users-action/UsersActionComponent.html
index c108655..69bf2ab 100644
--- a/src/app/utilities/users-action/UsersActionComponent.html
+++ b/src/app/utilities/users-action/UsersActionComponent.html
@@ -20,7 +20,7 @@
         <button type="button" class="btn btn-primary dropdown-toggle action-button" ngbDropdownToggle>
             {{'ACTION' | translate}}
         </button>
-        <div class="dropdown-menu list-action-dropdown" ngbDropdownMenu>
+        <div class="dropdown-menu list-action-dropdown mt-1" ngbDropdownMenu>
             <button *ngIf="isAdminShow" type="button" class="btn btn-primary dropdown-item" (click)="editUserModal('editPassword')"
                 placement="left" container="body" ngbTooltip="{{'PAGE.USERS.EDITCREDENTIALS' | translate}}">
                 <i class="fa fa-edit icons"></i> {{'PAGE.USERS.EDITCREDENTIALS' | translate}}
diff --git a/src/app/utilities/users-action/UsersActionComponent.ts b/src/app/utilities/users-action/UsersActionComponent.ts
index 799779d..a7b4c24 100644
--- a/src/app/utilities/users-action/UsersActionComponent.ts
+++ b/src/app/utilities/users-action/UsersActionComponent.ts
@@ -18,7 +18,6 @@
 /**
  * @file Users Action Component
  */
-import { isNullOrUndefined } from 'util';
 import { Component, Injector } from '@angular/core';
 import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
 import { TranslateService } from '@ngx-translate/core';
@@ -26,7 +25,7 @@
 import { MODALCLOSERESPONSEDATA } from 'CommonModel';
 import { DeleteComponent } from 'DeleteComponent';
 import { ProjectRoleComponent } from 'ProjectRoleComponent';
-import { SharedService } from 'SharedService';
+import { SharedService, isNullOrUndefined } from 'SharedService';
 import { UserData } from 'UserModel';
 import { WarningComponent } from 'WarningComponent';
 /**
diff --git a/src/app/utilities/vertical-scaling/VerticalScalingComponent.html b/src/app/utilities/vertical-scaling/VerticalScalingComponent.html
index 5525871..eddf226 100644
--- a/src/app/utilities/vertical-scaling/VerticalScalingComponent.html
+++ b/src/app/utilities/vertical-scaling/VerticalScalingComponent.html
@@ -23,7 +23,7 @@
 </div>
 <form [formGroup]="scalingForm" (ngSubmit)="triggerVerticalScaling()" autocomplete="off">
     <div class="modal-body">
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <label class="col-sm-12 col-form-label mandatory-label"
                 [ngClass]="{'text-danger': scalingForm.invalid === true && submitted === true}">
                 {{'MANDATORYCHECK' | translate}}
@@ -39,7 +39,7 @@
                 <small class="form-text text-muted" *ngIf="selectedvnfId !== ''">vnfd-id : {{ selectedvnfId }}</small>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="vdu-id"> {{'VDUID' | translate}} *</label>
             </div>
@@ -50,7 +50,7 @@
                 </ng-select>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="count-index"> {{'COUNTINDEX' | translate}} *</label>
             </div>
@@ -62,7 +62,7 @@
                 </ng-select>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="memoryMB"> {{'MEMORYMB' | translate}} *</label>
             </div>
@@ -72,7 +72,7 @@
                     [ngClass]="{ 'is-invalid': submitted && f.virtualMemory.errors }">
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="storageGB"> {{'STORAGEGB' | translate}} *</label>
             </div>
@@ -82,7 +82,7 @@
                     [ngClass]="{ 'is-invalid': submitted && f.sizeOfStorage.errors }">
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="vcpucount"> {{'VCPUCOUNT' | translate}} *</label>
             </div>
diff --git a/src/app/utilities/vertical-scaling/VerticalScalingComponent.ts b/src/app/utilities/vertical-scaling/VerticalScalingComponent.ts
index 7b4c087..36ec2fc 100644
--- a/src/app/utilities/vertical-scaling/VerticalScalingComponent.ts
+++ b/src/app/utilities/vertical-scaling/VerticalScalingComponent.ts
@@ -18,7 +18,6 @@
 /**
  * @file VerticalScaling Component
  */
-import { isNullOrUndefined } from 'util';
 import { HttpHeaders } from '@angular/common/http';
 import { Component, Injector, Input, OnInit } from '@angular/core';
 import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -30,7 +29,7 @@
 import { environment } from 'environment';
 import { VerticalScaling } from 'NSInstanceModel';
 import { RestService } from 'RestService';
-import { SharedService } from 'SharedService';
+import { SharedService, isNullOrUndefined } from 'SharedService';
 import { InstanceData, VDUR, VNFInstanceDetails } from 'VNFInstanceModel';
 
 /**
diff --git a/src/app/utilities/vim-accounts-action/VimAccountsActionComponent.html b/src/app/utilities/vim-accounts-action/VimAccountsActionComponent.html
index 1286116..071c341 100644
--- a/src/app/utilities/vim-accounts-action/VimAccountsActionComponent.html
+++ b/src/app/utilities/vim-accounts-action/VimAccountsActionComponent.html
@@ -18,7 +18,7 @@
 <div class="btn-group list action" role="group">
     <ng-template #popTitle>
         <span class="text-primary"><strong>{{'PAGE.DASHBOARD.RUNNINGINSTANCES' | translate}}</strong></span>
-        <button class="button-xs close" type="button" (click)="p.close()">
+        <button class="button-xs close-instances" type="button" (click)="p.close()">
             <i class="fas fa-times-circle text-danger"></i>
         </button>
     </ng-template>
@@ -33,7 +33,7 @@
     </ng-template>
     <ng-template #graphTitle>
         <span class="text-primary"><strong>{{'PAGE.VIMDETAILS.VIMRESOURCES' | translate}}</strong></span>
-        <button class="button-xs close" type="button" (click)="chart.close()">
+        <button class="chart button-xs close" type="button" (click)="chart.close()">
             <i class="fas fa-times-circle text-danger"></i>
         </button>
     </ng-template>
diff --git a/src/app/utilities/vim-accounts-action/VimAccountsActionComponent.scss b/src/app/utilities/vim-accounts-action/VimAccountsActionComponent.scss
index 021d205..12b851d 100644
--- a/src/app/utilities/vim-accounts-action/VimAccountsActionComponent.scss
+++ b/src/app/utilities/vim-accounts-action/VimAccountsActionComponent.scss
@@ -14,4 +14,25 @@
  limitations under the License.
 
  Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
-*/
\ No newline at end of file
+*/
+.chart {
+   opacity: 1;
+   background-color: transparent;
+   border: 0;
+   position: absolute;
+   right: 10px;
+   top: 4px;
+   font-size: 1.31rem;
+}
+.list-group-item {
+   background-color: white;
+}
+.close-instances {
+   opacity: 1;
+   background-color: transparent;
+   border: 0;
+   position: absolute;
+   right: 10px;
+   bottom: 62px;
+   font-size: 1.31rem;
+}
\ No newline at end of file
diff --git a/src/app/utilities/vm-migration/VmMigrationComponent.html b/src/app/utilities/vm-migration/VmMigrationComponent.html
index fa1cd14..ee2078f 100644
--- a/src/app/utilities/vm-migration/VmMigrationComponent.html
+++ b/src/app/utilities/vm-migration/VmMigrationComponent.html
@@ -23,7 +23,7 @@
 </div>
 <form [formGroup]="migrationForm" (ngSubmit)="triggerMigration()" autocomplete="off">
     <div class="modal-body">
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <label class="col-sm-12 col-form-label mandatory-label"
                 [ngClass]="{'text-danger': migrationForm.invalid === true && submitted === true}">
                 {{'MANDATORYCHECK' | translate}}
@@ -39,7 +39,7 @@
                 <small class="form-text text-muted" *ngIf="selectedvnfId !== ''">vnfd-id : {{ selectedvnfId }}</small>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="vduid"> {{'VDUID' | translate}}</label>
             </div>
@@ -50,7 +50,7 @@
                 </ng-select>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="countIndex"> {{'COUNTINDEX' | translate}}</label>
             </div>
@@ -62,7 +62,7 @@
                 </ng-select>
             </div>
         </div>
-        <div class="form-group row">
+        <div class="form-group row mb-3">
             <div class="col-sm-6">
                 <label for="migrateToHost"> {{'MIGRATETOHOST' | translate}}</label>
             </div>
diff --git a/src/app/utilities/vm-migration/VmMigrationComponent.ts b/src/app/utilities/vm-migration/VmMigrationComponent.ts
index b629497..27f60e1 100644
--- a/src/app/utilities/vm-migration/VmMigrationComponent.ts
+++ b/src/app/utilities/vm-migration/VmMigrationComponent.ts
@@ -18,7 +18,6 @@
 /**
  * @file Vm Migration Component
  */
-import { isNullOrUndefined } from 'util';
 import { HttpHeaders } from '@angular/common/http';
 import { Component, Injector, Input, OnInit } from '@angular/core';
 import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -28,7 +27,7 @@
 import { environment } from 'environment';
 import { VMMIGRATION } from 'NSInstanceModel';
 import { RestService } from 'RestService';
-import { SharedService } from 'SharedService';
+import { SharedService, isNullOrUndefined } from 'SharedService';
 import { InstanceData, VDUR, VNFInstanceDetails } from 'VNFInstanceModel';
 
 /**
diff --git a/src/app/utilities/warning/WarningComponent.html b/src/app/utilities/warning/WarningComponent.html
index 92adccb..84ec4af 100644
--- a/src/app/utilities/warning/WarningComponent.html
+++ b/src/app/utilities/warning/WarningComponent.html
@@ -28,7 +28,7 @@
 </div>
 <div class="modal-footer">
     <button (click)="closeModal('close')" class="btn btn-danger">{{'CANCEL' | translate }}</button>
-    <button *ngIf="!action" (click)="closeModal('done')" class="btn btn-success">{{submitMessage}}</button>
-    <button *ngIf="action" (click)="onSubmit()" class="btn btn-success">{{submitMessage}}</button>
+    <button class="btn btn-success text-white"
+        (click)="!action ? closeModal('done') : onSubmit()">{{submitMessage}}</button>
 </div>
 <app-loader [waitingMessage]="message" *ngIf="isLoad"></app-loader>
\ No newline at end of file