diff --git a/portal-2/src/app/landingPages/dataProvider/dataProvider.component.html b/portal-2/src/app/landingPages/dataProvider/dataProvider.component.html
index c75ad966..2ae1306d 100644
--- a/portal-2/src/app/landingPages/dataProvider/dataProvider.component.html
+++ b/portal-2/src/app/landingPages/dataProvider/dataProvider.component.html
@@ -66,7 +66,8 @@
             </tabs-->
             <div *ngIf="showTabs">
                 <ul *ngIf="dataProviderInfo.tabs != undefined" class="uk-tab uk-visible@m" uk-tab="connect: #tab-content">
-                    <li *ngFor="let tab of dataProviderInfo.tabs; let i=index" id="{{dataProviderInfo.tabs[i].content}}">
+                    <li *ngFor="let tab of dataProviderInfo.tabs; let i=index" id="{{dataProviderInfo.tabs[i].content}}"
+                        [class]="activeTab==tab.name?'uk-active':''">
                         <a
                             (click)="search(tab.content, 1, 10); activeTab=tab.name">
                                 {{tab.name}}
@@ -101,7 +102,8 @@
                 </button>
 
                 <ul *ngIf="dataProviderInfo.tabs != undefined" id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
-                    <li *ngFor="let tab of dataProviderInfo.tabs; let i=index" id="{{dataProviderInfo.tabs[i].content}}">
+                    <li *ngFor="let tab of dataProviderInfo.tabs; let i=index" id="{{dataProviderInfo.tabs[i].content}}"
+                        [class]="activeTab==tab.name?'uk-active':''">
                         <a
                             (click)="search(tab.content, 1, 10); activeTab=tab.name">
                                 {{tab.name}}
@@ -131,36 +133,44 @@
                     </li>
                 </ul>
 
-                <ul *ngIf="dataProviderInfo.tabs != undefined" id="tab-content" class="uk-switcher uk-margin custom-tab-content">
+                <!--ul *ngIf="dataProviderInfo.tabs != undefined" id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+                <div *ngIf="dataProviderInfo.tabs != undefined" class="uk-margin custom-tab-content">
 
-                    <li class="uk-animation-fade" *ngFor="let tab of dataProviderInfo.tabs; let i=index">
-                        <publicationsTab *ngIf="  tab.content=='publicationsTab'"
+                    <!--div class="uk-animation-fade" *ngFor="let tab of dataProviderInfo.tabs; let i=index"-->
+                    <div class="uk-animation-fade">
+                        <!--*ngIf="tab.content=='publicationsTab'"-->
+                        <publicationsTab *ngIf="activeTab=='Publications'"
                                          [paramsForSearchLink]="paramsForSearchLink"
                                          [fetchPublications] = "fetchPublications">
                         </publicationsTab>
-                        <datasetsTab *ngIf="  tab.content=='datasetsTab'"
+                        <!--*ngIf="tab.content=='datasetsTab'"-->
+                        <datasetsTab *ngIf="activeTab=='Research Data'"
                                      [paramsForSearchLink]="paramsForSearchLink"
                                      [fetchDatasets]="fetchDatasets">
                         </datasetsTab>
-
-                        <projectsTab *ngIf="  tab.content=='projectsTab'"
+                        <!--*ngIf="  tab.content=='projectsTab'"-->
+                        <projectsTab *ngIf="activeTab=='Projects'"
                                      [paramsForSearchLink]="paramsForSearchLink"
                                      [fetchProjects]="fetchProjects">
                         </projectsTab>
-                        <datasourcesTab *ngIf="  tab.content=='datasourcesTab'"
+                        <!--*ngIf="  tab.content=='datasourcesTab'"-->
+                        <datasourcesTab *ngIf="activeTab=='Datasources'"
                                         [paramsForSearchLink]="paramsForSearchLink"
                                         [fetchDataproviders]="fetchDataproviders">
                         </datasourcesTab>
-                        <organizationsTab *ngIf="  tab.content=='organizationsTab'"
+                        <!--*ngIf="  tab.content=='organizationsTab'"-->
+                        <organizationsTab *ngIf="activeTab=='Organizations'"
                                           [organizations]="dataProviderInfo.organizations">
                         </organizationsTab>
-                        <relatedDatasourcesTab *ngIf="  tab.content=='relatedDatasourcesTab'"
+                        <!--*ngIf="  tab.content=='relatedDatasourcesTab'"-->
+                        <relatedDatasourcesTab *ngIf="activeTab=='Related Data Providers'"
                             [dataproviderId]="id"
                             [fetchResults]="fetchResultsAggregators"
                             [type]="relatedDataprovidersResultsType">
                         </relatedDatasourcesTab>
 
-                        <div *ngIf="  tab.content=='statisticsTab' && statsClicked">
+                        <!-- *ngIf="  tab.content=='statisticsTab' && statsClicked"-->
+                        <div *ngIf="activeTab=='Statistics' && statsClicked">
                           <!--div *ngIf="fetchPublications.searchUtils.totalResults == 0 && fetchDatasets.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary">
                               There are no statistics
                           </div-->
@@ -198,17 +208,18 @@
                           </div>
                         </div>
 
-                        <metrics *ngIf="  tab.content=='metricsTab'" [pageViews]="pageViews"
+                        <!--*ngIf="  tab.content=='metricsTab'"-->
+                        <metrics *ngIf="activeTab=='Metrics'" [pageViews]="pageViews"
                             [id]="datasourceId" [type]="'datasources'" [name]="dataProviderInfo.title['name']" (metricsResults)="metricsResults($event)">
                         </metrics>
-                        <i-frame *ngIf="  tab.content=='metricsTab' && metricsClicked && totalViews > 0"
+                        <i-frame *ngIf="activeTab=='Metrics' && metricsClicked && totalViews > 0"
                             [url]=viewsFrameUrl width="100%" height="250">
                         </i-frame>
-                        <i-frame *ngIf="  tab.content=='metricsTab' && metricsClicked && totalDownloads > 0"
+                        <i-frame *ngIf="activeTab=='Metrics' && metricsClicked && totalDownloads > 0"
                             [url]=downloadsFrameUrl width="100%" height="250">
                         </i-frame>
-                    </li>
-                </ul>
+                    </div>
+                <!--/ul-->
                 </div>
 
         </div>
diff --git a/portal-2/src/app/landingPages/dataProvider/dataProvider.module.ts b/portal-2/src/app/landingPages/dataProvider/dataProvider.module.ts
index 47d43f11..ee4b8ad7 100644
--- a/portal-2/src/app/landingPages/dataProvider/dataProvider.module.ts
+++ b/portal-2/src/app/landingPages/dataProvider/dataProvider.module.ts
@@ -8,6 +8,7 @@ import {IFrameModule} from '../../utils/iframe.module';
 import {TabResultModule } from '../../searchPages/searchUtils/tabResult.module';
 import {MetricsModule} from '../metrics.module';
 import { LandingModule } from '../landing.module';
+import {PagingModule} from '../../utils/paging.module';
 
 import {PublicationsTabComponent} from './publicationsTab.component';
 import {DatasetsTabComponent} from './datasetsTab.component';
@@ -31,7 +32,9 @@ import {FreeGuard} from'../../login/freeGuard.guard';
 @NgModule({
   imports:
   [CommonModule, FormsModule, RouterModule,DataProviderRoutingModule,
-    TabResultModule, IFrameModule, MetricsModule, LandingModule, DataProvidersServiceModule, DatasetsServiceModule, ProjectsServiceModule, PublicationsServiceModule],
+    TabResultModule, IFrameModule, MetricsModule, LandingModule,
+    DataProvidersServiceModule, DatasetsServiceModule, ProjectsServiceModule, PublicationsServiceModule,
+    PagingModule],
   declarations:
   [PublicationsTabComponent, DatasetsTabComponent, StatisticsTabComponent, ProjectsTabComponent, DatasourcesTabComponent, OrganizationsTabComponent,
     RelatedDatasourcesTabComponent, DataProviderComponent
diff --git a/portal-2/src/app/landingPages/dataset/dataset.component.html b/portal-2/src/app/landingPages/dataset/dataset.component.html
index 6440148c..378597d2 100644
--- a/portal-2/src/app/landingPages/dataset/dataset.component.html
+++ b/portal-2/src/app/landingPages/dataset/dataset.component.html
@@ -60,7 +60,8 @@
             </div-->
 
             <ul class="uk-tab uk-visible@m" uk-tab="connect: #tab-content">
-                <li (click)="activeTab='Related Research Results'">
+                <li (click)="activeTab='Related Research Results'"
+                    [class]="activeTab == 'Related Research Results'?'uk-active':''">
                      <a>
                          Related Research Results
                          <span class="uk-badge uk-badge-notification">
@@ -69,7 +70,8 @@
                      </a>
                  </li>
 
-                <li (click)="activeTab='Similar Research Results'">
+                <li (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
                     <a>
                         Similar Research Results
                         <span *ngIf="!datasetInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
@@ -79,7 +81,8 @@
                     </a>
                 </li>
 
-                <li (click)="metricsClicked=true; activeTab='Metrics'">
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
                     <a>
                         Metrics  <i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
   <path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
@@ -93,7 +96,8 @@
             </button>
 
             <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
-              <li (click)="activeTab='Related Research Results'">
+              <li (click)="activeTab='Related Research Results'"
+                  [class]="activeTab == 'Related Research Results'?'uk-active':''">
                      <a>
                          Related Research Results
                          <span class="uk-badge uk-badge-notification">
@@ -102,7 +106,8 @@
                      </a>
                  </li>
 
-                <li (click)="activeTab='Similar Research Results'">
+                <li (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
                     <a>
                         Similar Research Results
                         <span *ngIf="!datasetInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
@@ -112,7 +117,8 @@
                     </a>
                 </li>
 
-                <li (click)="metricsClicked=true; activeTab='Metrics'">
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
                     <a>
                         Metrics<i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
 <path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
@@ -121,8 +127,9 @@
                 </li>
             </ul>
 
-            <ul id="tab-content" class="uk-switcher uk-margin custom-tab-content">
-                <li class="uk-animation-fade">
+            <!--ul id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+            <div class="uk-margin custom-tab-content">
+                <div *ngIf="activeTab=='Related Research Results'" class="uk-animation-fade">
                     <div *ngIf="!datasetInfo.relatedResearchResults" class = "uk-alert  uk-alert-primary" >
                         There are no related research results
                     </div>
@@ -133,17 +140,17 @@
                             <tabTable [info]="datasetInfo.relatedResearchResults.get(provenanceaction)"></tabTable>
                         </div>
                     </div>
-                </li>
+                </div>
 
-                <li class="uk-animation-fade">
+                <div *ngIf="activeTab=='Similar Research Results'" class="uk-animation-fade">
                     <div  *ngIf="!datasetInfo.similarResearchResults"  class = "uk-alert  uk-alert-primary" >
                         There are no similar research results
                     </div>
                     <div *ngIf="datasetInfo.similarResearchResults">
                         <tabTable [info]="datasetInfo.similarResearchResults"></tabTable>
                     </div>
-                </li>
-                <li class="uk-animation-fade">
+                </div>
+                <div *ngIf="activeTab=='Metrics'" class="uk-animation-fade">
                   <!-- Page Views: {{pageViews}} -->
                     <metrics [pageViews]="pageViews"
                         [id]="datasetId" [type]="'results'" (metricsResults)="metricsResults($event)">
@@ -154,8 +161,9 @@
                     <i-frame *ngIf="metricsClicked && totalDownloads > 0"
                         [url]=downloadsFrameUrl width="100%" height="250">
                     </i-frame>
-                </li>
-            </ul>
+                </div>
+            <!--/ul-->
+          </div>
         </div>
 
         <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
diff --git a/portal-2/src/app/landingPages/organization/organization.component.html b/portal-2/src/app/landingPages/organization/organization.component.html
index 7b01a791..c645ab5b 100644
--- a/portal-2/src/app/landingPages/organization/organization.component.html
+++ b/portal-2/src/app/landingPages/organization/organization.component.html
@@ -15,7 +15,7 @@
             <span *ngIf="organizationInfo.country" class="uk-label custom-label label-grey " title="Country">{{organizationInfo.country}}</span>
 
             <ul class="uk-tab uk-visible@m" uk-tab="connect: #tab-content">
-              <li (click)="activeTab='Publications'">
+              <li (click)="activeTab='Publications'" [class]="activeTab == 'Publications'?'uk-active':''">
                   <a>
                       Publications
                       <span class="uk-badge uk-badge-notification">
@@ -23,7 +23,8 @@
                       </span>
                   </a>
               </li>
-                <li (click)="activeTab='Projects'; projectsClicked=true;">
+                <li (click)="activeTab='Projects'; projectsClicked=true;"
+                    [class]="activeTab == 'Projects'?'uk-active':''">
                     <a>
                         Projects
                         <span class="uk-badge uk-badge-notification">
@@ -32,7 +33,8 @@
                         </span>
                     </a>
                 </li>
-                <li (click)="activeTab='Data Providers'; searchDataprovidersInit()">
+                <li (click)="activeTab='Data Providers'; searchDataprovidersInit()"
+                    [class]="activeTab == 'Data Providers'?'uk-active':''">
                     <a>
                         Data Providers
                         <!--span *ngIf="organizationInfo.dataProviders == undefined" class="badge">0</span>
@@ -51,7 +53,7 @@
             </button>
 
             <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
-              <li (click)="activeTab='Publications'">
+              <li (click)="activeTab='Publications'" [class]="activeTab == 'Publications'?'uk-active':''">
                   <a>
                       Publications
                       <span class="uk-badge uk-badge-notification">
@@ -59,7 +61,8 @@
                       </span>
                   </a>
               </li>
-                <li (click)="activeTab='Projects'; projectsClicked=true;">
+                <li (click)="activeTab='Projects'; projectsClicked=true;"
+                    [class]="activeTab == 'Projects'?'uk-active':''">
                     <a>
                         Projects
                         <span class="uk-badge uk-badge-notification">
@@ -67,7 +70,8 @@
                         </span>
                     </a>
                 </li>
-                <li (click)="activeTab='Data Providers'; searchDataprovidersInit()">
+                <li (click)="activeTab='Data Providers'; searchDataprovidersInit()"
+                    [class]="activeTab == 'Data Providers'?'uk-active':''">
                     <a>
                         Data Providers
                         <span class="uk-badge uk-badge-notification">
@@ -77,8 +81,10 @@
                 </li>
             </ul>
 
-            <ul id="tab-content" class="uk-switcher uk-margin custom-tab-content">
-                <li class="uk-animation-fade">
+            <!--ul id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+            <div class="uk-margin custom-tab-content">
+
+                <div *ngIf="activeTab=='Publications'" class="uk-animation-fade">
                     <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">There are no publications</div>
                     <div *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
                     <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
@@ -96,12 +102,12 @@
                                         type="publication" urlParam="articleId">
                         </tab-result>
                     </div>
-                </li>
-                <li class="uk-animation-fade">
+                </div>
+                <div *ngIf="activeTab=='Projects'" class="uk-animation-fade">
                   <searchingProjectsTab *ngIf="projectsClicked" [(fetchProjects)]="fetchProjects" [organizationId]="organizationId"></searchingProjectsTab>
-                </li>
+                </div>
 
-                <li class="uk-animation-fade">
+                <div *ngIf="activeTab=='Data Providers'" class="uk-animation-fade">
                     <!--showDataProviders [dataProviders]="organizationInfo.dataProviders"></showDataProviders-->
                     <!--div *ngIf="fetchDataproviders.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary">
                         There are no dataproviders
@@ -128,8 +134,9 @@
                                         type="dataprovider" urlParam="datasourceId">
                         </tab-result>
                     </div>
-                </li>
-            </ul>
+                </div>
+            <!--/ul-->
+          </div>
         </div>
 
         <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
diff --git a/portal-2/src/app/landingPages/project/project.component.html b/portal-2/src/app/landingPages/project/project.component.html
index 27f29e95..bd399767 100644
--- a/portal-2/src/app/landingPages/project/project.component.html
+++ b/portal-2/src/app/landingPages/project/project.component.html
@@ -27,7 +27,7 @@
               <li  *ngIf="projectInfo.funding"><span class="uk-text-bold">Funding:</span> {{projectInfo.funding}}</li>
               <li  *ngIf="projectInfo.startDate"><span class="uk-text-bold">Start Date:</span> {{projectInfo.startDate}}</li>
               <li  *ngIf="projectInfo.endDate"><span class="uk-text-bold">End Date:</span> {{projectInfo.endDate}}</li>
-              <li  *ngIf="projectInfo.openAccessMandate != undefined && !projectInfo.openAccessMandate "><span class="uk-text-bold">Open Access mandate:</span> no</li>              
+              <li  *ngIf="projectInfo.openAccessMandate != undefined && !projectInfo.openAccessMandate "><span class="uk-text-bold">Open Access mandate:</span> no</li>
               <li *ngIf="projectInfo.organizations && projectInfo.organizations.length > 0"><span class="uk-text-bold">Organizations:</span>
 
                 <span class="list-horizontal-line">
@@ -52,7 +52,7 @@
               </li>
             </ul>
             <ul class="uk-tab uk-visible@m" uk-tab="connect: #tab-content">
-                <li (click)="activeTab='Publications'">
+                <li (click)="activeTab='Publications'" [class]="activeTab == 'Publications'?'uk-active':''">
                     <a>
                         Publications
                         <span class="uk-badge uk-badge-notification">
@@ -60,7 +60,8 @@
                         </span>
                     </a>
                 </li>
-                <li (click)="activeTab='Research Data'; searchDatasetsInit()">
+                <li (click)="activeTab='Research Data'; searchDatasetsInit()"
+                    [class]="activeTab == 'Research Data'?'uk-active':''">
                     <a>
                         Research Data
                         <span class="uk-badge uk-badge-notification">
@@ -68,7 +69,8 @@
                         </span>
                     </a>
                 </li>
-                <li (click)="activeTab='Statistics'; statsClicked=true">
+                <li (click)="activeTab='Statistics'; statsClicked=true"
+                    [class]="activeTab == 'Statistics'?'uk-active':''">
                     <a>
                         Statistics
                         <i class="icon-pie-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 32"  style="fill:currentColor;">
@@ -76,7 +78,8 @@
 </svg></i>
                     </a>
                 </li>
-                <li (click)="activeTab='Metrics'; metricsClicked=true">
+                <li (click)="activeTab='Metrics'; metricsClicked=true"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
                     <a>
                         Metrics
                         <i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
@@ -91,7 +94,7 @@
             </button>
 
             <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
-              <li (click)="activeTab='Publications'">
+              <li (click)="activeTab='Publications'" [class]="activeTab == 'Publications'?'uk-active':''">
                   <a>
                       Publications
                       <span class="uk-badge uk-badge-notification">
@@ -99,7 +102,8 @@
                       </span>
                   </a>
               </li>
-              <li (click)="searchDatasetsInit(); activeTab='Research Data'">
+              <li (click)="searchDatasetsInit(); activeTab='Research Data'"
+                  [class]="activeTab == 'Research Data'?'uk-active':''">
                   <a>
                       Research Data
                       <span class="uk-badge uk-badge-notification">
@@ -107,7 +111,8 @@
                       </span>
                   </a>
               </li>
-              <li (click)="statsClicked=true; activeTab='Statistics'">
+              <li (click)="statsClicked=true; activeTab='Statistics'"
+                  [class]="activeTab == 'Statistics'?'uk-active':''">
                   <a>
                       Statistics
                       <i class="icon-pie-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 32"  style="fill:currentColor;">
@@ -115,7 +120,8 @@
 </svg></i>
                   </a>
               </li>
-              <li (click)="metricsClicked=true; activeTab='Metrics'">
+              <li (click)="metricsClicked=true; activeTab='Metrics'"
+                  [class]="activeTab == 'Metrics'?'uk-active':''">
                   <a>
                       Metrics
                       <i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
@@ -125,8 +131,10 @@
               </li>
             </ul>
 
-            <ul id="tab-content" class="uk-switcher uk-margin custom-tab-content">
-                <li class="uk-animation-fade">
+            <!--ul id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+            <div class="uk-margin custom-tab-content">
+
+                <div *ngIf="activeTab=='Publications'" class="uk-animation-fade">
                     <!--div *ngIf="fetchPublications.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary" >
                         There are no publications
                     </div-->
@@ -148,9 +156,9 @@
                                         type="publication" urlParam="articleId">
                         </tab-result>
                     </div>
-                </li>
+                </div>
 
-                <li class="uk-animation-fade">
+                <div *ngIf="activeTab == 'Research Data'" class="uk-animation-fade">
                     <!--div *ngIf="fetchDatasets.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary">
                         There are no research data
                     </div-->
@@ -173,8 +181,8 @@
                                         type="dataset" urlParam="datasetId">
                         </tab-result>
                     </div>
-                </li>
-                <li class="uk-animation-fade">
+                </div>
+                <div *ngIf="activeTab == 'Statistics'" class="uk-animation-fade">
                   <!--div *ngIf="fetchPublications.searchUtils.totalResults == 0 && fetchDatasets.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary">
                       There are no statistics
                   </div-->
@@ -198,8 +206,8 @@
                         <i-frame  [url]=chartDatasourcesUrl width="800" height="350"></i-frame>
                       </div>
                   </div>
-                </li>
-                <li class="uk-animation-fade">
+                </div>
+                <div *ngIf="activeTab=='Metrics'" class="uk-animation-fade">
 
                     <metrics [pageViews]="pageViews"
                         [id]="projectId" [type]="'projects'" [name]="projectName" (metricsResults)="metricsResults($event)">
@@ -211,8 +219,9 @@
                     <i-frame *ngIf="metricsClicked && totalDownloads > 0"
                         [url]=downloadsFrameUrl width="100%" height="250">
                     </i-frame>
-                </li>
-            </ul>
+                </div>
+            <!--/ul-->
+          </div>
         </div>
 
         <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
diff --git a/portal-2/src/app/landingPages/publication/publication.component.html b/portal-2/src/app/landingPages/publication/publication.component.html
index f7089ff4..b5161a56 100644
--- a/portal-2/src/app/landingPages/publication/publication.component.html
+++ b/portal-2/src/app/landingPages/publication/publication.component.html
@@ -73,7 +73,8 @@
             </div-->
 
             <ul class="uk-tab uk-visible@xl" uk-tab="connect: #tab-content">
-                <li *ngIf="publicationInfo.references" (click)="activeTab='References'">
+                <li *ngIf="publicationInfo.references" (click)="activeTab='References'"
+                    [class]="activeTab == 'References'?'uk-active':''">
                     <a>
                         References
                         <span *ngIf="!publicationInfo.references" class="uk-badge uk-badge-notification">0</span>
@@ -82,7 +83,8 @@
                         </span>
                     </a>
                 </li>
-                <li *ngIf="publicationInfo.relatedResearchResults" (click)="activeTab='Related Research Results'">
+                <li *ngIf="publicationInfo.relatedResearchResults" (click)="activeTab='Related Research Results'"
+                    [class]="activeTab == 'Related Research Results'?'uk-active':''">
                     <a>
                         Related Research Results
                         <span class="uk-badge uk-badge-notification">
@@ -90,7 +92,8 @@
                         </span>
                     </a>
                 </li>
-                <li *ngIf="publicationInfo.similarResearchResults" (click)="activeTab='Similar Research Results'">
+                <li *ngIf="publicationInfo.similarResearchResults" (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
                     <a>
                         Similar Research Results
                         <span *ngIf="!publicationInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
@@ -99,7 +102,8 @@
                         </span>
                     </a>
                 </li>
-                <li *ngIf="publicationInfo.organizations" (click)="activeTab='Related Organizations'">
+                <li *ngIf="publicationInfo.organizations" (click)="activeTab='Related Organizations'"
+                    [class]="activeTab == 'Related Organizations'?'uk-active':''">
                     <a>
                         Related Organizations
                         <span *ngIf="!publicationInfo.organizations" class="uk-badge uk-badge-notification">0</span>
@@ -108,19 +112,22 @@
                         </span>
                     </a>
                 </li>
-                <li *ngIf="publicationInfo.bioentities" (click)="activeTab='Bioentities'">
+                <li *ngIf="publicationInfo.bioentities" (click)="activeTab='Bioentities'"
+                    [class]="activeTab == 'Bioentities'?'uk-active':''">
                     <a>
                         Bioentities
                         <span class="uk-badge uk-badge-notification">{{bioentitiesNum}}</span>
                     </a>
                 </li>
-                <li *ngIf="publicationInfo.software" (click)="activeTab='Software'">
+                <li *ngIf="publicationInfo.software" (click)="activeTab='Software'"
+                    [class]="activeTab == 'Software'?'uk-active':''">
                     <a>
                         Software
                         <span class="uk-badge uk-badge-notification">{{publicationInfo.software.length}}</span>
                     </a>
                 </li>
-                <li (click)="metricsClicked=true; activeTab='Metrics'">
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
                     <a>
                         Metrics
                         <i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
@@ -136,7 +143,8 @@
             </button>
 
             <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@xl" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
-                <li *ngIf="publicationInfo.references" (click)="activeTab='References'">
+                <li *ngIf="publicationInfo.references" (click)="activeTab='References'"
+                    [class]="activeTab == 'References'?'uk-active':''">
                   <a>
                     References
                     <span *ngIf="!publicationInfo.references" class="uk-badge uk-badge-notification">0</span>
@@ -145,7 +153,8 @@
                     </span>
                   </a>
                 </li>
-                <li *ngIf="publicationInfo.relatedResearchResults" (click)="activeTab='Related Research Results'">
+                <li *ngIf="publicationInfo.relatedResearchResults" (click)="activeTab='Related Research Results'"
+                    [class]="activeTab == 'Related Research Results'?'uk-active':''">
                   <a>
                     Related Research Results
                     <span class="uk-badge uk-badge-notification">
@@ -153,7 +162,8 @@
                     </span>
                   </a>
                 </li>
-                <li *ngIf="publicationInfo.similarResearchResults" (click)="activeTab='Similar Research Results'">
+                <li *ngIf="publicationInfo.similarResearchResults" (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
                   <a>
                     Similar Research Results
                     <span *ngIf="!publicationInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
@@ -162,7 +172,8 @@
                     </span>
                   </a>
                 </li>
-                <li *ngIf="publicationInfo.organizations" (click)="activeTab='Related Organizations'">
+                <li *ngIf="publicationInfo.organizations" (click)="activeTab='Related Organizations'"
+                    [class]="activeTab == 'Related Organizations'?'uk-active':''">
                   <a>
                     Related Organizations
                     <span *ngIf="!publicationInfo.organizations" class="uk-badge uk-badge-notification">0</span>
@@ -171,19 +182,22 @@
                     </span>
                   </a>
                 </li>
-                <li *ngIf="publicationInfo.bioentities" (click)="activeTab='Bioentities'">
+                <li *ngIf="publicationInfo.bioentities" (click)="activeTab='Bioentities'"
+                    [class]="activeTab == 'Bioentities'?'uk-active':''">
                   <a>
                     Bioentities
                     <span class="uk-badge uk-badge-notification">{{bioentitiesNum}}</span>
                   </a>
                 </li>
-                <li *ngIf="publicationInfo.software" (click)="activeTab='Software'">
+                <li *ngIf="publicationInfo.software" (click)="activeTab='Software'"
+                    [class]="activeTab == 'Software'?'uk-active':''">
                   <a>
                     Software
                     <span class="uk-badge uk-badge-notification">{{publicationInfo.software.length}}</span>
                   </a>
                 </li>
-                <li (click)="metricsClicked=true; activeTab='Metrics'">
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
                   <a>
                     Metrics<i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
 <path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
@@ -192,8 +206,9 @@
                 </li>
             </ul>
 
-            <ul id="tab-content" class="uk-switcher uk-margin custom-tab-content">
-                <li *ngIf="publicationInfo.references" class="uk-animation-fade">
+            <!--ul id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+            <div class="uk-margin custom-tab-content">
+                <div *ngIf="activeTab == 'References'" class="uk-animation-fade">
                     <div *ngIf="!publicationInfo.references" class = "uk-alert  uk-alert-primary" >
                         There are no references
                     </div>
@@ -235,9 +250,9 @@
                         <!--tabPaging [showAll]="showAllReferences" [length]="publicationInfo.references.length" (changeShowAll)="showChange($event)"></tabPaging-->
 
                     </div>
-                </li>
+                </div>
 
-                <li *ngIf="publicationInfo.relatedResearchResults" class="uk-animation-fade">
+                <div *ngIf="activeTab == 'Related Research Results'" class="uk-animation-fade">
                     <div *ngIf="!publicationInfo.relatedResearchResults" class = "uk-alert  uk-alert-primary">
                         There are no related research results
                     </div>
@@ -248,10 +263,10 @@
                             <tabTable [info]="publicationInfo.relatedResearchResults.get(provenanceaction)"></tabTable>
                         </div>
                     </div>
-                </li>
+                </div>
 
 
-                <li *ngIf="publicationInfo.similarResearchResults" class="uk-animation-fade">
+                <div *ngIf="activeTab == 'Similar Research Results'" class="uk-animation-fade">
                     <div *ngIf="!publicationInfo.similarResearchResults" class = "uk-alert  uk-alert-primary">
                         There are no similar research results
                     </div>
@@ -259,9 +274,9 @@
 
                         <tabTable [info]="publicationInfo.similarResearchResults"></tabTable>
                     </div>
-                </li>
+                </div>
 
-                <li *ngIf="publicationInfo.organizations" class="uk-animation-fade">
+                <div *ngIf="activeTab == 'Organizations'" class="uk-animation-fade">
                     <div *ngIf="!publicationInfo.organizations" class = "uk-alert  uk-alert-primary">
                         There are no related organizations
                     </div>
@@ -314,9 +329,9 @@
 
 
                     </div>
-                </li>
+                </div>
 
-                <li *ngIf="publicationInfo.bioentities" class="uk-animation-fade">
+                <div *ngIf="activeTab=='Bioentities'" class="uk-animation-fade">
                     <div *ngIf="publicationInfo.bioentities && bioentitiesNum > pageSize" class="uk-margin-bottom">
                       {{bioentitiesNum}} bioentities, page {{bioentitiesPage}} of {{totalPages(bioentitiesNum)}}
                       <paging-no-load class="uk-float-right" [currentPage]="bioentitiesPage" [totalResults]="bioentitiesNum" [size]="pageSize" (pageChange)="updateBioentitiesPage($event)"></paging-no-load>
@@ -349,8 +364,8 @@
                           <!--/ng-container-->
                         </tbody>
                     </table>
-                </li>
-                <li *ngIf="publicationInfo.software" class="uk-animation-fade">
+                </div>
+                <div *ngIf="activeTab == 'Software'" class="uk-animation-fade">
                     <div *ngIf="publicationInfo.software && publicationInfo.software.length > pageSize" class="uk-margin-bottom">
                       {{publicationInfo.software.length}} software results, page {{softwarePage}} of {{totalPages(publicationInfo.software.length)}}
                       <paging-no-load class="uk-float-right" [currentPage]="softwarePage" [totalResults]="publicationInfo.software.length" [size]="pageSize" (pageChange)="updateSoftwarePage($event)"></paging-no-load>
@@ -374,8 +389,8 @@
                             </tr>
                         </tbody>
                     </table>
-                </li>
-                <li class="uk-animation-fade">
+                </div>
+                <div *ngIf="activeTab == 'Metrics'" class="uk-animation-fade">
                   <!-- Page Views: {{pageViews}} -->
                     <metrics [pageViews]="pageViews"
                         [id]="articleId" [type]="'results'" (metricsResults)="metricsResults($event)">
@@ -387,8 +402,9 @@
                     <i-frame *ngIf="metricsClicked && totalDownloads>0"
                         [url]=downloadsFrameUrl width="100%" height="250">
                     </i-frame>
-                </li>
-            </ul>
+                </div>
+            <!--/ul-->
+          </div>
         </div>
 
         <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
diff --git a/portal-2/src/app/searchPages/find/search.component.ts b/portal-2/src/app/searchPages/find/search.component.ts
index 39e63635..47121dc3 100644
--- a/portal-2/src/app/searchPages/find/search.component.ts
+++ b/portal-2/src/app/searchPages/find/search.component.ts
@@ -107,35 +107,35 @@ import {PiwikService} from '../../utils/piwik/piwik.service';
         </div-->
         <div  class=" uk-margin-small-top uk-container">
             <ul class=" uk-tab uk-visible@m" uk-tab="animation: uk-animation-fade">
-                    <li (click)="searchPublications()"  >
+                    <li (click)="searchPublications()" [class]="activeTab == 'publications'?'uk-active':''">
                        <a>
                            Publications
                            <span   [class]="(fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchPublications.searchUtils.totalResults :'')}}</span>
 
                        </a>
                    </li>
-                   <li (click)="searchDatasets()">
+                   <li (click)="searchDatasets()" [class]="activeTab == 'datasets'?'uk-active':''">
                        <a>
                            Datasets
                            <span   [class]="(fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchDatasets.searchUtils.totalResults :'')}}</span>
 
                        </a>
                    </li>
-                   <li (click)="searchProjects()"  >
+                   <li (click)="searchProjects()" [class]="activeTab == 'projects'?'uk-active':''">
                        <a>
                            Projects
                            <span   [class]="(fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchProjects.searchUtils.totalResults :'')}}</span>
 
                        </a>
                    </li>
-                   <li (click)="searchDataProviders()" >
+                   <li (click)="searchDataProviders()" [class]="activeTab == 'dataproviders'?'uk-active':''">
                        <a>
                            Data Providers
                            <span   [class]="(fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchDataproviders.searchUtils.totalResults :'')}}</span>
 
                        </a>
                    </li>
-                   <li (click)="searchOrganizations()" >
+                   <li (click)="searchOrganizations()" [class]="activeTab == 'organizations'?'uk-active':''">
                        <a>
                            Organizations
                            <span   [class]="(fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchOrganizations.searchUtils.totalResults :'')}}</span>
@@ -148,35 +148,35 @@ import {PiwikService} from '../../utils/piwik/piwik.service';
                 </button>
 
                 <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #searchtabs; animation: uk-animation-fade" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
-                    <li (click)="searchPublications()"  >
+                    <li (click)="searchPublications()" [class]="activeTab == 'publications'?'uk-active':''">
                        <a>
                            Publications
                            <span *ngIf = "fetchPublications.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
                            <span *ngIf = "fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0"  class="uk-badge uk-badge-notification">{{((keyword.length > 0)? fetchPublications.searchUtils.totalResults :'')}}</span>
                        </a>
                    </li>
-                   <li (click)="searchDatasets()">
+                   <li (click)="searchDatasets()" [class]="activeTab == 'datasets'?'uk-active':''">
                        <a>
                            Datasets
                            <span *ngIf = "fetchDatasets.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
                            <span *ngIf = "fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0"  class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchDatasets.searchUtils.totalResults :'')}}</span>
                        </a>
                    </li>
-                   <li (click)="searchProjects()"  >
+                   <li (click)="searchProjects()" [class]="activeTab == 'projects'?'uk-active':''">
                        <a>
                            Projects
                            <span *ngIf = "fetchProjects.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
                            <span *ngIf = "fetchProjects.searchUtils.status != errorCodes.LOADING  && keyword.length > 0"  class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchProjects.searchUtils.totalResults :'')}}</span>
                        </a>
                    </li>
-                   <li (click)="searchDataProviders()" >
+                   <li (click)="searchDataProviders()" [class]="activeTab == 'dataproviders'?'uk-active':''">
                        <a>
                            Data Providers
                            <span *ngIf = "fetchDataproviders.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
                            <span *ngIf = "fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0"  class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchDataproviders.searchUtils.totalResults :'')}}</span>
                        </a>
                    </li>
-                   <li (click)="searchOrganizations()" >
+                   <li (click)="searchOrganizations()" [class]="activeTab == 'organizations'?'uk-active':''">
                        <a>
                            Organizations
                            <span *ngIf = "fetchOrganizations.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>