diff --git a/claims/claim-utils/claimResultSearchForm.component.html b/claims/claim-utils/claimResultSearchForm.component.html
index 72baca83..df6e0eec 100644
--- a/claims/claim-utils/claimResultSearchForm.component.html
+++ b/claims/claim-utils/claimResultSearchForm.component.html
@@ -29,7 +29,7 @@
 
         <div *ngIf="activeTab == 'crossref'" id="crossref" >
           <div  class="uk-margin-top" >
-            <div *ngIf="crossrefStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+            <div *ngIf="crossrefStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
             <div *ngIf="crossrefStatus != errorCodes.LOADING && crossrefResults.length == 0" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
             <div *ngIf="crossrefStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
             <div *ngIf="crossrefStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
@@ -46,7 +46,7 @@
         </div>
         <div   *ngIf="activeTab == 'openairePub'" id="openairePubs" class="uk-animation-fade" >
           <div class = "uk-margin-top">
-            <div *ngIf="openairePubsStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+            <div *ngIf="openairePubsStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
             <div *ngIf="openairePubsStatus == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
             <div *ngIf="openairePubsStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
             <div *ngIf="openairePubsStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
@@ -62,7 +62,7 @@
        </div>
         <div  *ngIf="activeTab == 'orcid'" id="orcid" class="uk-animation-fade">
           <div class="uk-margin-top" >
-            <div *ngIf="orcidStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+            <div *ngIf="orcidStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
             <div *ngIf="orcidStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
             <div *ngIf="orcidStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
             <div *ngIf="orcidStatus == errorCodes.NONE && (!authorIds ||authorIds.length == 0)" class = "uk-alert uk-alert-primary " > No results found  </div>
@@ -96,7 +96,7 @@
            </div>
          </div>
          <div  *ngIf="activeTab == 'datacite'" id="datacite" class="uk-animation-fade">
-           <div *ngIf="dataciteStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+           <div *ngIf="dataciteStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
            <div *ngIf="dataciteStatus == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
            <div *ngIf="dataciteStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
            <div *ngIf="dataciteStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
@@ -112,7 +112,7 @@
             </div>
           </div>
           <div  *ngIf="activeTab == 'openaireData'" id="openaireData" class="uk-animation-fade">
-            <div *ngIf="openaireDataStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+            <div *ngIf="openaireDataStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
             <div *ngIf="openaireDataStatus == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
             <div *ngIf="openaireDataStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
             <div *ngIf="openaireDataStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
@@ -128,7 +128,7 @@
            </div>
       </div>
       <div  *ngIf="activeTab == 'openaireSoftware'" id="openaireSoftware" class="uk-animation-fade">
-        <div *ngIf="openaireSoftwareStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+        <div *ngIf="openaireSoftwareStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
         <div *ngIf="openaireSoftwareStatus == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
         <div *ngIf="openaireSoftwareStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
         <div *ngIf="openaireSoftwareStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
diff --git a/deposit/datasets/depositBySubjectResult.component.html b/deposit/datasets/depositBySubjectResult.component.html
index c99b3667..d4dda194 100644
--- a/deposit/datasets/depositBySubjectResult.component.html
+++ b/deposit/datasets/depositBySubjectResult.component.html
@@ -30,7 +30,7 @@
             <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
             <div class="uk-width-expand">
               <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING"
-                    class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
+                    class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" >
               </div>
 
 
diff --git a/deposit/depositResult.component.ts b/deposit/depositResult.component.ts
index 09939a0f..053121c9 100644
--- a/deposit/depositResult.component.ts
+++ b/deposit/depositResult.component.ts
@@ -29,7 +29,7 @@ import {PiwikService} from '../utils/piwik/piwik.service';
               <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
               <div class="uk-width-expand">
                 <div *ngIf="status == errorCodes.LOADING || (status == errorCodes.LOADING && fetchDataproviders.searchUtils.status == errorCodes.LOADING)"
-                      class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
+                      class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" >
                 </div>
 
 
diff --git a/landingPages/dataProvider/dataProvider.component.html b/landingPages/dataProvider/dataProvider.component.html
index c5020e2b..82a14f24 100644
--- a/landingPages/dataProvider/dataProvider.component.html
+++ b/landingPages/dataProvider/dataProvider.component.html
@@ -5,7 +5,7 @@
 <div class="uk-container uk-margin-top datasource">
     <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
     <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
-    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
 
     <div *ngIf="dataProviderInfo != null" uk-grid class="uk-grid-large">
 
@@ -186,7 +186,7 @@
                           <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE || fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE"
                                 class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
                           <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING || fetchDatasets.searchUtils.status == errorCodes.LOADING"
-                                class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                                class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
 
                           <errorMessages [status]="[fetchPublications.searchUtils.status, fetchDatasets.searchUtils.status]" [type]="'statistics'"></errorMessages>
 
diff --git a/landingPages/dataProvider/datasetsTab.component.ts b/landingPages/dataProvider/datasetsTab.component.ts
index 47ae975a..89e0e288 100644
--- a/landingPages/dataProvider/datasetsTab.component.ts
+++ b/landingPages/dataProvider/datasetsTab.component.ts
@@ -7,7 +7,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
 @Component({
     selector: 'datasetsTab',
     template: `
-        <!--div *ngIf="fetchDatasets.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+        <!--div *ngIf="fetchDatasets.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
         <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No research data available</div>
         <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
         <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service temprorarily unavailable. Please try again later.</div>
diff --git a/landingPages/dataProvider/datasourcesTab.component.ts b/landingPages/dataProvider/datasourcesTab.component.ts
index ee95de3f..f82c2dac 100644
--- a/landingPages/dataProvider/datasourcesTab.component.ts
+++ b/landingPages/dataProvider/datasourcesTab.component.ts
@@ -7,7 +7,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
 @Component({
     selector: 'datasourcesTab',
     template: `
-        <!--div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+        <!--div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
         <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No content providers available</div>
         <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
         <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service temprorarily unavailable. Please try again later.</div>
diff --git a/landingPages/dataProvider/projectsTab.component.ts b/landingPages/dataProvider/projectsTab.component.ts
index b7e87017..609b9854 100644
--- a/landingPages/dataProvider/projectsTab.component.ts
+++ b/landingPages/dataProvider/projectsTab.component.ts
@@ -11,7 +11,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
         <!--div *ngIf="fetchProjects.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No projects available</div>
         <div *ngIf="fetchProjects.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
         <div *ngIf="fetchProjects.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
-        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
         <errorMessages [status]="[fetchProjects.searchUtils.status]" [type]="'projects'"></errorMessages>
 
         <!--div *ngIf="fetchProjects.searchUtils.totalResults == 0" class = "uk-alert">
diff --git a/landingPages/dataProvider/publicationsTab.component.ts b/landingPages/dataProvider/publicationsTab.component.ts
index 6b302812..2d97609e 100644
--- a/landingPages/dataProvider/publicationsTab.component.ts
+++ b/landingPages/dataProvider/publicationsTab.component.ts
@@ -10,7 +10,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
         <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No publications available</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>
-        <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+        <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
         <!--errorMessages [status]="[fetchPublications.searchUtils.status]" [type]="'publications'"></errorMessages>
 {{fetchPublications.searchUtils.status}}-->
         <!--div *ngIf="fetchPublications.searchUtils.totalResults == 0" class = "uk-alert">
diff --git a/landingPages/dataProvider/relatedDatasourcesTab.component.ts b/landingPages/dataProvider/relatedDatasourcesTab.component.ts
index 26f59ac2..14e08776 100644
--- a/landingPages/dataProvider/relatedDatasourcesTab.component.ts
+++ b/landingPages/dataProvider/relatedDatasourcesTab.component.ts
@@ -24,7 +24,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
           Service not available
         </div-->
         <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING || fetchDatasets.searchUtils.status == errorCodes.LOADING || loading"
-              class="uk-animation-fade uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
+              class="uk-animation-fade uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" >
         </div-->
 
         <errorMessages [status]="[fetchPublications.searchUtils.status, fetchDatasets.searchUtils.status]" [type]="'related content providers'"></errorMessages>
diff --git a/landingPages/dataProvider/softwareTab.component.ts b/landingPages/dataProvider/softwareTab.component.ts
index bc0bfa4a..abc61bf1 100644
--- a/landingPages/dataProvider/softwareTab.component.ts
+++ b/landingPages/dataProvider/softwareTab.component.ts
@@ -7,7 +7,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
 @Component({
     selector: 'softwareTab',
     template: `
-        <!--div *ngIf="fetchDatasets.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+        <!--div *ngIf="fetchDatasets.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
         <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No research data available</div>
         <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
         <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service temprorarily unavailable. Please try again later.</div>
diff --git a/landingPages/dataProvider/statisticsTab.component.ts b/landingPages/dataProvider/statisticsTab.component.ts
index 2fa2b673..8af715af 100644
--- a/landingPages/dataProvider/statisticsTab.component.ts
+++ b/landingPages/dataProvider/statisticsTab.component.ts
@@ -14,7 +14,7 @@ import { ErrorCodes} from '../../utils/properties/errorCodes';
       <div *ngIf="searchPublicationsComponent.searchUtils.status == errorCodes.NOT_AVAILABLE || DatasetsComponent.searchUtils.status == errorCodes.NOT_AVAILABLE"
             class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
       <div *ngIf="searchPublicationsComponent.searchUtils.status == errorCodes.LOADING || DatasetsComponent.searchUtils.status == errorCodes.LOADING"
-            class="uk-animation-fade  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+            class="uk-animation-fade  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
       <errorMessages [status]="[searchPublicationsComponent.searchUtils.status, DatasetsComponent.searchUtils.status]" [type]="'statistics'"></errorMessages>
 
       <!--div *ngIf="searchPublicationsComponent.searchUtils.totalResults == 0 && searchDatasetsComponent.searchUtils.totalResults == 0" class = "uk-alert">
diff --git a/landingPages/dataset/dataset.component.html b/landingPages/dataset/dataset.component.html
index 5e6f82c2..300d056d 100644
--- a/landingPages/dataset/dataset.component.html
+++ b/landingPages/dataset/dataset.component.html
@@ -6,7 +6,7 @@
 
     <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
     <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
-    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
 
     <div *ngIf="datasetInfo != null" uk-grid class="uk-grid-large">
         <div class="uk-width-expand@m uk-width-1-1@s">
diff --git a/landingPages/htmlProjectReport/htmlProjectReport.component.ts b/landingPages/htmlProjectReport/htmlProjectReport.component.ts
index 23d34776..4dd4f82c 100644
--- a/landingPages/htmlProjectReport/htmlProjectReport.component.ts
+++ b/landingPages/htmlProjectReport/htmlProjectReport.component.ts
@@ -21,7 +21,7 @@ declare var UIkit: any;
 
       <div class="uk-container uk-margin-top">
           <div *ngIf="warningMessage" class="uk-alert uk-alert-warning" role="alert">{{warningMessage}}</div>
-          <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+          <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
 
           <div *ngIf="!showLoading && !warningMessage">
             <h1 *ngIf="header1">{{header1}}</h1>
diff --git a/landingPages/landing-utils/metrics.component.ts b/landingPages/landing-utils/metrics.component.ts
index b1ab1d8c..40391a17 100644
--- a/landingPages/landing-utils/metrics.component.ts
+++ b/landingPages/landing-utils/metrics.component.ts
@@ -27,7 +27,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
         Metrics are currently unavailable
     </div-->
 
-    <!--div *ngIf="status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+    <!--div *ngIf="status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
     <div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
     <div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
     <div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service temprorarily unavailable. Please try again later.</div>
diff --git a/landingPages/landing-utils/searchingProjectsInTab.component.ts b/landingPages/landing-utils/searchingProjectsInTab.component.ts
index bf0d3879..0122804b 100644
--- a/landingPages/landing-utils/searchingProjectsInTab.component.ts
+++ b/landingPages/landing-utils/searchingProjectsInTab.component.ts
@@ -18,7 +18,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
         <!--div *ngIf="fetchProjects.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No projects available</div>
         <div *ngIf="fetchProjects.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
         <div *ngIf="fetchProjects.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
-        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
         <errorMessages [status]="[fetchProjects.searchUtils.status]" [type]="'projects'"></errorMessages>
 
         <div *ngIf="fetchProjects.searchUtils.totalResults > 0">
diff --git a/landingPages/landing-utils/tabTable.component.ts b/landingPages/landing-utils/tabTable.component.ts
index 7ed62215..26a7d152 100644
--- a/landingPages/landing-utils/tabTable.component.ts
+++ b/landingPages/landing-utils/tabTable.component.ts
@@ -22,10 +22,12 @@ import{EnvProperties} from '../../utils/properties/env-properties';
                 <tr *ngFor="let item of info.slice((page-1)*pageSize, page*pageSize)" class="{{item['class']}}">
                     <td *ngIf="item != undefined">
                         <!--span *ngIf="item['class'] == 'dataset'" class="glyphicon glyphicon-star" aria-hidden="true"-->
-                        <img *ngIf="item['class'] == 'publication'" class= "entityIcon" src="assets/publication.png" alt="(Publication)">
-                        <img *ngIf="item['class'] == 'dataset'" class= "entityIcon" src="assets/dataset.png" alt="(Dataset)">
-                        <img *ngIf="item['class'] == 'software'" class= "entityIcon" src="assets/dataset.png" alt="(Software)">
-
+                         <span *ngIf="item['class'] == 'publication'" class="uk-icon" title = "Publication"><svg height="20" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><rect fill="none" height="16" stroke="#000" width="12" x="3.5" y="2.5"></rect><polyline fill="none" points="5 0.5 17.5 0.5 17.5 17" stroke="#000"></polyline></svg></span>
+                         <span class="uk-icon"  *ngIf="item['class'] == 'dataset'" title = "Research data" ><svg height="20" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><ellipse cx="10" cy="4.64" fill="none" rx="7.5" ry="3.14" stroke="#000"></ellipse><path d="M17.5,8.11 C17.5,9.85 14.14,11.25 10,11.25 C5.86,11.25 2.5,9.84 2.5,8.11" fill="none" stroke="#000"></path><path d="M17.5,11.25 C17.5,12.99 14.14,14.39 10,14.39 C5.86,14.39 2.5,12.98 2.5,11.25" fill="none" stroke="#000"></path><path d="M17.49,4.64 L17.5,14.36 C17.5,16.1 14.14,17.5 10,17.5 C5.86,17.5 2.5,16.09 2.5,14.36 L2.5,4.64" fill="none" stroke="#000"></path></svg></span>
+                         <span class="uk-icon" c>
+                          <svg height="20" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"> <circle cx="9.997" cy="10" fill="none" r="3.31" stroke="#000"></circle> <path d="M18.488,12.285 L16.205,16.237 C15.322,15.496 14.185,15.281 13.303,15.791 C12.428,16.289 12.047,17.373 12.246,18.5 L7.735,18.5 C7.938,17.374 7.553,16.299 6.684,15.791 C5.801,15.27 4.655,15.492 3.773,16.237 L1.5,12.285 C2.573,11.871 3.317,10.999 3.317,9.991 C3.305,8.98 2.573,8.121 1.5,7.716 L3.765,3.784 C4.645,4.516 5.794,4.738 6.687,4.232 C7.555,3.722 7.939,2.637 7.735,1.5 L12.263,1.5 C12.072,2.637 12.441,3.71 13.314,4.22 C14.206,4.73 15.343,4.516 16.225,3.794 L18.487,7.714 C17.404,8.117 16.661,8.988 16.67,10.009 C16.672,11.018 17.415,11.88 18.488,12.285 L18.488,12.285 Z" fill="none" stroke="#000"></path></svg>
+                        </span>
+                        <span class="uk-icon"  *ngIf="item['class'] == 'other'" title = "Other" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <rect fill="none" stroke="#000" x="3.5" y="1.5" width="13" height="17"></rect></svg></span>
                         <!--/span-->
                         <!--a *ngIf="item['url'] != '' && item['name'] != ''" href="{{item['url']}}"-->
                         <a *ngIf="item['id'] != '' && item['name'] != '' && item['class'] == 'dataset'"
diff --git a/landingPages/organization/organization.component.html b/landingPages/organization/organization.component.html
index 734c2202..a186b43b 100644
--- a/landingPages/organization/organization.component.html
+++ b/landingPages/organization/organization.component.html
@@ -5,7 +5,7 @@
 <div class="uk-container uk-margin-top organization">
     <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
     <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
-    <div [style.display]="showLoading ? 'inline' : 'none'"class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+    <div [style.display]="showLoading ? 'inline' : 'none'"class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
 
     <div *ngIf="organizationInfo != null" uk-grid class="uk-grid-large">
         <div class="uk-width-3-4@l uk-width-3-4@xl uk-width-3-4@m uk-width-1-1@s">
@@ -90,7 +90,7 @@
                     <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No publications available</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>
-                    <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                    <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
                     <errorMessages [status]="[fetchPublications.searchUtils.status]" [type]="'publications'"></errorMessages>
 
                     <div *ngIf="fetchPublications.searchUtils.totalResults > 0">
@@ -119,7 +119,7 @@
                     <!--div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No content providers available</div>
                     <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
                     <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
-                    <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                    <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
                     <errorMessages [status]="[fetchDataproviders.searchUtils.status]" [type]="'content providers'"></errorMessages>
 
                     <div *ngIf="fetchDataproviders.searchUtils.totalResults > 0">
diff --git a/landingPages/project/project.component.html b/landingPages/project/project.component.html
index f2610a3a..66f2fae0 100644
--- a/landingPages/project/project.component.html
+++ b/landingPages/project/project.component.html
@@ -5,7 +5,7 @@
 <div id="project" class="uk-container uk-margin-top project">
     <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning uk-margin-large-top" role="alert">{{warningMessage}}</div>
     <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
-    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
 
     <div *ngIf="projectInfo != null" uk-grid class="uk-grid-large">
         <div class="uk-width-3-4@l uk-width-3-4@xl uk-width-3-4@m uk-width-1-1@s">
@@ -181,7 +181,7 @@
                     <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No publications available</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>
-                    <div*ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                    <div*ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
                     <errorMessages [status]="[fetchPublications.searchUtils.status]" [type]="'publications'"></errorMessages>
 
                     <div *ngIf="fetchPublications.searchUtils.totalResults > 0">
@@ -205,7 +205,7 @@
                     <!--div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No research data available</div>
                     <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
                     <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
-                    <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                    <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
                     <errorMessages [status]="[fetchDatasets.searchUtils.status]" [type]="'research data'"></errorMessages>
 
                     <div *ngIf="fetchDatasets.searchUtils.totalResults > 0">
@@ -250,7 +250,7 @@
                   <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE || fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE"
                         class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
                   <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING || fetchDatasets.searchUtils.status == errorCodes.LOADING"
-                        class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                        class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
                   <errorMessages [status]="[fetchPublications.searchUtils.status, fetchDatasets.searchUtils.status]" [type]="'statistics'"></errorMessages>
 
                   <div *ngIf="statsClicked && (fetchPublications.searchUtils.totalResults != 0 || fetchDatasets.searchUtils.totalResults != 0)">
diff --git a/landingPages/publication/publication.component.html b/landingPages/publication/publication.component.html
index 2d77713a..ed2016ce 100644
--- a/landingPages/publication/publication.component.html
+++ b/landingPages/publication/publication.component.html
@@ -5,7 +5,7 @@
 <div class="uk-container uk-margin-top publication">
     <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
     <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
-    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
 
     <div  *ngIf="publicationInfo != null"  uk-grid class="uk-grid-large">
         <div class="uk-width-expand@m uk-width-1-1@s">
diff --git a/landingPages/software/software.component.html b/landingPages/software/software.component.html
index 4489a1e1..ee1795a5 100644
--- a/landingPages/software/software.component.html
+++ b/landingPages/software/software.component.html
@@ -6,7 +6,7 @@
 
     <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
     <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
-    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
 
     <div *ngIf="softwareInfo != null" uk-grid class="uk-grid-large">
         <div class="uk-width-expand@m uk-width-1-1@s">
diff --git a/searchPages/searchUtils/browseEntities.component.ts b/searchPages/searchUtils/browseEntities.component.ts
index d15c0e32..f2e82bec 100644
--- a/searchPages/searchUtils/browseEntities.component.ts
+++ b/searchPages/searchUtils/browseEntities.component.ts
@@ -15,7 +15,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
     selector: 'browse-entities',
     template: `
 <div>
-  <!--div *ngIf="status == errorCodes.LOADING" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+  <!--div *ngIf="status == errorCodes.LOADING" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
   <div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No Results found</div>
   <div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
   <div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service temprorarily unavailable. Please try again later.</div>
diff --git a/searchPages/searchUtils/searchResult.component.html b/searchPages/searchUtils/searchResult.component.html
index d668d53c..b9756068 100644
--- a/searchPages/searchUtils/searchResult.component.html
+++ b/searchPages/searchUtils/searchResult.component.html
@@ -3,7 +3,7 @@
   <div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
   <div *ngIf="status == errorCodes.OUT_OF_BOUND" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">Requested page out of bounds</div>
   <div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
-  <div *ngIf="status == errorCodes.LOADING && showLoading"   class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+  <div *ngIf="status == errorCodes.LOADING && showLoading"   class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div-->
   <errorMessages [status]="[status]" [type]="'results'"></errorMessages>
 
     <li *ngFor="let result of results" class="uk-animation-fade">
diff --git a/sharedComponents/bottom.component.html b/sharedComponents/bottom.component.html
index 81d7d1b6..0cf2a987 100644
--- a/sharedComponents/bottom.component.html
+++ b/sharedComponents/bottom.component.html
@@ -26,7 +26,7 @@
 
            </div>
            <div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-left">
-              <img src="assets/common/ec_logo_inv_small.png" class="el-image" alt="European Commission">
+              <img [src]="assetsPath + 'common/ec_logo_inv_small.png'" class="el-image" alt="European Commission">
            </div>
         </div>
         <div *ngIf="showMenu"  class="uk-width-expand@m uk-light">
@@ -61,17 +61,17 @@
      <div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid="">
         <div class="uk-width-1-1@m uk-first-column">
            <div *ngIf="showDnet" class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-center">
-              <img src="assets/common/Logo_Horizontal_white_small.png" class="el-image" alt="OpenAIRE">
+              <img [src]="assetsPath + 'common/Logo_Horizontal_white_small.png'" class="el-image" alt="OpenAIRE">
            </div>
            <div *ngIf="showDnet" class="footer-license uk-margin uk-margin-remove-bottom uk-text-center uk-text-lead">
-              <div><a href="http://creativecommons.org/licenses/by/4.0/" rel="license"><img src="assets/common/80x15.png" alt="Creative" style="height: auto; max-width: 100%; vertical-align: middle;"></a>&nbsp;UNLESS OTHERWISE INDICATED, ALL MATERIALS CREATED BY THE OPENAIRE CONSORTIUM ARE LICENSED UNDER A&nbsp;<a href="http://creativecommons.org/licenses/by/4.0/" rel="license">CREATIVE COMMONS ATTRIBUTION 4.0 INTERNATIONAL LICENSE</a>.</div>
+              <div><a href="http://creativecommons.org/licenses/by/4.0/" rel="license"><img [src]="assetsPath + 'common/80x15.png'" alt="Creative" style="height: auto; max-width: 100%; vertical-align: middle;"></a>&nbsp;UNLESS OTHERWISE INDICATED, ALL MATERIALS CREATED BY THE OPENAIRE CONSORTIUM ARE LICENSED UNDER A&nbsp;<a href="http://creativecommons.org/licenses/by/4.0/" rel="license">CREATIVE COMMONS ATTRIBUTION 4.0 INTERNATIONAL LICENSE</a>.</div>
               <div>OPENAIRE IS POWERED BY&nbsp;<a href="http://www.d-net.research-infrastructures.eu/">D-NET</a>.</div>
            </div>
            <div *ngIf="showOpenaire" class="footer-license uk-margin uk-margin-remove-bottom uk-text-center uk-text-lead">
               <div>POWERED BY&nbsp;
                 <br>
                 <a href="https://www.openaire.eu/">
-                <img src="assets/common/Logo_Horizontal_white_small.png" class="el-image" alt="OpenAIRE"></a>
+                <img [src]="assetsPath + 'common/Logo_Horizontal_white_small.png'" class="el-image" alt="OpenAIRE"></a>
               </div>
            </div>
            <div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-right">
diff --git a/sharedComponents/bottom.component.ts b/sharedComponents/bottom.component.ts
index 3ef55ec2..e68cf626 100644
--- a/sharedComponents/bottom.component.ts
+++ b/sharedComponents/bottom.component.ts
@@ -11,4 +11,5 @@ export class BottomComponent {
 @Input() showOpenaire:boolean = false;
 @Input() showMenu:boolean = true;
 @Input() showDnet:boolean = true;
+@Input() assetsPath:string ='assets/common-assets/';
 }
diff --git a/sharedComponents/navigationBar.component.ts b/sharedComponents/navigationBar.component.ts
index ff92d854..719887cc 100644
--- a/sharedComponents/navigationBar.component.ts
+++ b/sharedComponents/navigationBar.component.ts
@@ -13,7 +13,7 @@ import{MenuItem,RootMenuItem} from './menu';
 export class NavigationBarComponent {
   @Input() portal:string = "connect";
   @Input() onlyTop ;
-  @Input() logoPath:string = "assets/";
+  @Input() logoPath:string = "assets/common-assets/";
   @Input() userMenu;
   @Input() logInUrl;
   @Input() logOutUrl;
diff --git a/utils/errorMessages.component.ts b/utils/errorMessages.component.ts
index c7d33f56..d1cd9bc4 100644
--- a/utils/errorMessages.component.ts
+++ b/utils/errorMessages.component.ts
@@ -4,7 +4,7 @@ import {ErrorCodes} from './properties/errorCodes';
 @Component({
     selector: 'errorMessages',
     template: `
-      <div *ngIf="status.some(checkErroCode(errorCodes.LOADING))" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+      <div *ngIf="status.some(checkErroCode(errorCodes.LOADING))" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>
       <div *ngIf="status.every(checkErroCode(errorCodes.NONE))"   class="uk-animation-fade uk-alert uk-alert-primary" role="alert">No {{type}} available</div>
       <div *ngIf="status.every(checkErroCode(errorCodes.ERROR)) ||
                   (status.some(checkErroCode(errorCodes.ERROR)) && (!status.every(checkErroCode(errorCodes.DONE)) || !status.every(checkErroCode(errorCodes.LOADING))))"