diff --git a/sharedComponents/navigationBar.component.html b/sharedComponents/navigationBar.component.html
index 8790ed5f..0a7750ab 100644
--- a/sharedComponents/navigationBar.component.html
+++ b/sharedComponents/navigationBar.component.html
@@ -77,11 +77,12 @@
                   <li class="uk-nav-header uk-parent " *ngIf="showHomeMenuItem && getCurrentRoute()!='/'">
                     <a routerLinkActive="uk-link" routerLink="/">Home</a>
                   </li>
-                  <li class="uk-nav-header uk-parent"
+                  <li class="uk-nav-header uk-parent" [class.uk-active]="isTheActiveMenu(menu)"
                       *ngIf="isAtleastOneEnabled(menu.rootItem.entitiesRequired,showEntity) && isAtleastOneEnabled(menu.rootItem.routeRequired, showPage)">
                     <!--a routerLinkActive="uk-link" routerLink="{{menu.rootItem.route}}"  [queryParams]=menu.rootItem.params class="uk-offcanvas-close custom-offcanvas-close">{{menu.rootItem.title}}</a-->
                     <a *ngIf="menu.rootItem.route.length > 0 && isEnabled([menu.rootItem.route], showPage) || !menu.rootItem.routeRequired "
                        routerLinkActive="uk-link" routerLink="{{menu.rootItem.route}}"
+                       [routerLinkActiveOptions]="{exact: true}"
                        [queryParams]="menu.rootItem.params" [fragment]="menu.rootItem.fragment"
                        class="uk-offcanvas-close custom-offcanvas-close">{{menu.rootItem.title}}</a>
                     <a *ngIf="menu.rootItem.route.length == 0 && menu.rootItem.url.length > 0"
@@ -92,7 +93,7 @@
 
                     <ul class="uk-nav-sub">
                       <ng-container *ngFor="let submenu of menu.items">
-                        <li *ngIf="isEnabled(submenu.entitiesRequired,showEntity) && isEnabled(submenu.routeRequired, showPage)  && (submenu.route.length > 0 || submenu.url.length > 0)">
+                        <li [class.uk-active]="isTheActiveMenuItem(submenu)" *ngIf="isEnabled(submenu.entitiesRequired,showEntity) && isEnabled(submenu.routeRequired, showPage)  && (submenu.route.length > 0 || submenu.url.length > 0)">
                           <a *ngIf="submenu.route.length > 0" routerLinkActive="uk-link"
                              routerLink="{{submenu.route}}" [queryParams]=submenu.params [fragment]="submenu.fragment"
                              class="uk-offcanvas-close custom-offcanvas-close">{{submenu.title}}</a>
@@ -202,7 +203,7 @@
                 <a routerLinkActive="uk-link" routerLink="/">Home</a>
               </li>
               <ng-container *ngFor="let menu of menuItems">
-                <li [class]="(isTheActiveMenu(menu)?'uk-active':'')+' uk-parent'"
+                <li class="uk-parent" [class.uk-active]="isTheActiveMenu(menu)"
                     *ngIf="isAtleastOneEnabled(menu.rootItem.entitiesRequired,showEntity) && isAtleastOneEnabled(menu.rootItem.routeRequired, showPage)">
                   <!--a routerLinkActive="uk-link" routerLink="{{menu.rootItem.route}}"   [queryParams]=menu.rootItem.params class="" aria-expanded="false">{{menu.rootItem.title}}</a-->
                   <a *ngIf="menu.rootItem.route.length > 0 && (isEnabled([menu.rootItem.route], showPage) || !menu.rootItem.routeRequired )"
@@ -213,8 +214,6 @@
                      href="{{menu.rootItem.url}}" target="_blank" aria-expanded="false">{{menu.rootItem.title}}</a>
                   <a *ngIf="(menu.rootItem.route.length == 0 && menu.rootItem.url.length == 0) || ( menu.rootItem.route.length >0 && menu.rootItem.routeRequired && !isEnabled([menu.rootItem.route], showPage) && isAtleastOneEnabled(menu.rootItem.routeRequired, showPage)) "
                      class="uk-offcanvas-close custom-offcanvas-close">{{menu.rootItem.title}}</a>
-
-
                   <div *ngIf="menu.items.length > 0" class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left"
                        style="top: 80px; left: 0px;" id="{{menu.rootItem.id}}" uk-toggle>
                     <div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
@@ -223,7 +222,7 @@
                           <ng-container *ngFor="let submenu of menu.items">
                             <li *ngIf="isEnabled(submenu.entitiesRequired,showEntity) &&
                             isEnabled(submenu.routeRequired, showPage) && (submenu.route.length > 0 ||
-                            submenu.url.length > 0)" [class.uk-active]="isTheActiveSubMenu(submenu)">
+                            submenu.url.length > 0)" [class.uk-active]="isTheActiveMenuItem(submenu)">
                               <a *ngIf="submenu.route.length > 0" routerLinkActive="uk-link"
                                  routerLink="{{submenu.route}}" [queryParams]="submenu.params"
                                  [fragment]="submenu.fragment">{{submenu.title}}</a>
diff --git a/sharedComponents/navigationBar.component.ts b/sharedComponents/navigationBar.component.ts
index 736207dd..c72464e9 100644
--- a/sharedComponents/navigationBar.component.ts
+++ b/sharedComponents/navigationBar.component.ts
@@ -15,14 +15,14 @@ export interface Header {
   logoSmallUrl: string,
   position: 'left' | 'center' | 'right',
   badge: boolean
-  stickyAnimation?:boolean
+  stickyAnimation?: boolean
 }
 
 @Component({
   selector: 'navbar',
   templateUrl: 'navigationBar.component.html'
 })
-export class NavigationBarComponent implements OnInit, OnDestroy{
+export class NavigationBarComponent implements OnInit, OnDestroy {
   @Input() portal: string = 'connect';
   @Input() dark: boolean = false;
   @Input() onlyTop: boolean;
@@ -47,32 +47,26 @@ export class NavigationBarComponent implements OnInit, OnDestroy{
   keyword: string = '';
   public isAuthorized: boolean = false;
   subs: Subscription[] = [];
-
   showEntity = {};
   showPage = {};
   specialAnnouncementContent: string = null;
-  activeRouteEnabled = false;
-
-
+  
+  
   constructor(private router: Router,
               private  route: ActivatedRoute,
               private config: ConfigurationService) {
   }
-
+  
   ngOnInit() {
-    this.activeRouteEnabled = false;
-    //this.subscriptions = this.route.queryParams.subscribe(params => {
-    //console.log("params: ",params);
     this.initialize();
-    //});
   }
-
+  
   ngOnDestroy() {
     for (let sub of this.subs) {
       sub.unsubscribe();
     }
   }
-
+  
   initialize() {
     if ((['provide', 'develop']).indexOf(this.portal) != -1) {
       this.header = {
@@ -95,22 +89,21 @@ export class NavigationBarComponent implements OnInit, OnDestroy{
         badge: true
       };
     }
-    this.activeRouteEnabled = false;
     this.isAuthorized = Session.isClaimsCurator(this.user) || Session.isPortalAdministrator(this.user);
     if (this.properties.adminToolsAPIURL && this.communityId) {
       //this.config.getCommunityInformation(this.properties, this.communityId).subscribe(data => {
       this.subs.push(this.config.communityInformationState.subscribe(data => {
           if (data) {
-            if(data['entities']) {
+            if (data['entities']) {
               for (var i = 0; i < data['entities'].length; i++) {
-
+                
                 this.showEntity['' + data['entities'][i]['pid'] + ''] = data['entities'][i]['isEnabled'];
               }
             }
-            if(data['pages']) {
+            if (data['pages']) {
               for (var i = 0; i < data['pages'].length; i++) {
                 this.showPage[data['pages'][i]['route']] = data['pages'][i]['isEnabled'];
-
+                
               }
             }
           }
@@ -120,14 +113,14 @@ export class NavigationBarComponent implements OnInit, OnDestroy{
         }));
     }
   }
-
-
+  
+  
   isEnabled(required, enabled) {
     if (!required) {
       return true;
     }
-
-
+    
+    
     for (let requiredEntity of required) {
       if (typeof enabled[requiredEntity] === 'undefined' || enabled[requiredEntity] == false) {
         return false;
@@ -135,12 +128,12 @@ export class NavigationBarComponent implements OnInit, OnDestroy{
     }
     return true;
   }
-
+  
   isAtleastOneEnabled(required, enabled) {
     if (!required || required.length == 0) {
       return true;
     }
-
+    
     var count = required.length;
     for (let requiredEntity of required) {
       if (typeof enabled[requiredEntity] === 'undefined' || enabled[requiredEntity] == false) {
@@ -149,39 +142,33 @@ export class NavigationBarComponent implements OnInit, OnDestroy{
     }
     return (count > 0) ? true : false;
   }
-
+  
   private handleError(message: string, error) {
     console.error('NavigationBar (component): ' + message, error);
   }
-
-  getCurrentRoute() {
-    return this.router.url.split('?')[0];
-  }
-
+  
   isTheActiveMenu(menu: RootMenuItem): boolean {
-    let currentRoute = this.getCurrentRoute();
     if (!menu.rootItem.markAsActive) {
       return false;
     }
-    if (currentRoute == menu.rootItem.route || menu.rootItem.route == (currentRoute + "/")) {
-      this.activeRouteEnabled = true;
+    if (this.isTheActiveMenuItem(menu.rootItem)) {
       return true;
     } else if (menu.items.length > 0) {
       for (let menuItem of menu.items) {
-        if (menuItem.route == currentRoute || menuItem.route == (currentRoute + "/")) {
-          this.activeRouteEnabled = true;
+        if (this.isTheActiveMenuItem(menuItem)) {
           return true;
         }
       }
     }
     return false;
   }
-  isTheActiveSubMenu(menuItem: MenuItem): boolean {
-    let currentRoute = this.getCurrentRoute();
-    if (menuItem.route == currentRoute || menuItem.route == (currentRoute + "/") ) {
-      this.activeRouteEnabled = true;
-      return true;
-    }
-    return false;
+  
+  isTheActiveMenuItem(menuItem: MenuItem): boolean {
+    let currentRoute = {
+      route: this.router.url.split('?')[0].split('#')[0],
+      fragment: this.route.snapshot.fragment
+    };
+    return (menuItem.route == currentRoute.route || menuItem.route == (currentRoute.route + "/")) &&
+      currentRoute.fragment == menuItem.fragment;
   }
 }