diff --git a/angular.json b/angular.json
index e1f4787..94528eb 100644
--- a/angular.json
+++ b/angular.json
@@ -48,7 +48,7 @@
             "styles": [
               "src/styles.css",
               "node_modules/bootstrap/dist/css/bootstrap.min.css",
-              "fontawesome-5.15.2/css/fontawesome.min.css",
+              "fontawesome-5.15.2/css/all.min.css",
               "fonts/FMIconFont/style.css",
               "node_modules/cesium/Build/Cesium/Widgets/widgets.css",
               "node_modules/ol/ol.css"
diff --git a/projects/common-map/src/fm-map/components/aol/layer-list/layer-list.component.html b/projects/common-map/src/fm-map/components/aol/layer-list/layer-list.component.html
index b1b0624..5b86864 100644
--- a/projects/common-map/src/fm-map/components/aol/layer-list/layer-list.component.html
+++ b/projects/common-map/src/fm-map/components/aol/layer-list/layer-list.component.html
@@ -13,7 +13,7 @@
             </span>
             <a href="#" title="Zoom to extent" class="btn btn-light btn-sm" (click)="handleZoomToExtent($event,itemLayer)"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
             <span *ngIf="firstLayer(itemLayer)"><a href="#" title="Toggle legend" class="btn btn-light btn-sm" (click)="itemLayer.legendVisible=toggleLegend($event,itemLayer.legendVisible)"><i class="fa fa-bar-chart" aria-hidden="true"></i></a></span>
-            <span class="float-right"><a href="#" title="Remove overlay" class="btn btn-light btn-sm" (click)="handleDelete($event,itemLayer)"><i class="fa fa-minus" aria-hidden="true"></i></a></span>
+            <span class="float-right"><a href="#" title="Remove overlay" class="btn btn-light btn-sm" (click)="handleDelete($event,itemLayer)"><i class="fas fa-layer-minus" aria-hidden="true"></i></a></span>
           </div>
           <div *ngIf="itemLayer.legendVisible">
             <div class="card legend">
diff --git a/projects/common-map/src/fm-map/components/layer-switcher/layer-switcher.component.html b/projects/common-map/src/fm-map/components/layer-switcher/layer-switcher.component.html
index 0c43ffd..bc178ba 100644
--- a/projects/common-map/src/fm-map/components/layer-switcher/layer-switcher.component.html
+++ b/projects/common-map/src/fm-map/components/layer-switcher/layer-switcher.component.html
@@ -1,20 +1,20 @@
 <div class="btn btn-outline-secondary layer-switcher" (click)="handleClick($event)">
-  <i class="fa fa-map-o"></i>  
+  <i class="fal fa-layer-group"></i>  
   <div class="layers hidden" [ngClass]="{'hidden':!(showLayerSwitcher|async)}" (click)="$event.stopPropagation();">
     <div class="card layers-card m-1">
       <div class="card-header">
         <span i18n>Layers</span>
-        <i class="float-right fa fa-close" (click)="close($event)"></i>
+        <i class="float-right fas fa-times" (click)="close($event)"></i>
       </div>
       <ul class="navbar-nav">
         <li class="nav-item py-0">
-          <span><i class="fa fa-map-o" aria-hidden="true"></i>&nbsp;<span i18n>Base maps</span></span>
+          <span><i class="fal fa-layer-group" aria-hidden="true"></i>&nbsp;<span i18n>Base maps</span></span>
           <div  class="mb-4">
             <fm-map-layer-list [baseLayers]="true" [itemLayers]="baseLayers|async" [selectedLayer]="selectedBaseLayer|async" (onSelectLayer)="handleSelectBaseLayer($event)"></fm-map-layer-list>
           </div>
         </li>
         <li class="nav-item py-0">
-          <span><i class="fa fa-map-o" aria-hidden="true"></i>&nbsp;<span i18n>Overlays</span></span>
+          <span><i class="fal fa-layer-group" aria-hidden="true"></i>&nbsp;<span i18n>Overlays</span></span>
           <div class="mb-4">
             <fm-map-layer-list [itemLayers]="overlayLayers|async" [selectedLayer]="selectedOverlayLayer|async" (onDelete)="handleOnDelete($event)" (onToggleVisibility)="handleOnToggleVisibility($event)" (onSetOpacity)="handleOnSetOpacity($event)" (onZoomToExtent)="handleZoomToExtent($event)" (onSelectLayer)="handleSelectOverlayLayer($event)"></fm-map-layer-list>
           </div>
diff --git a/projects/common-map/src/fm-map/components/map-search/map-search.component.html b/projects/common-map/src/fm-map/components/map-search/map-search.component.html
index f90acf6..1d287ed 100644
--- a/projects/common-map/src/fm-map/components/map-search/map-search.component.html
+++ b/projects/common-map/src/fm-map/components/map-search/map-search.component.html
@@ -13,7 +13,7 @@
         <input #searchText class="form-control" type="text" (focus)="handleFocus($event)" [ngModel]="searchTextLocal" name="searchTextLocal" (ngModelChange)="handleChange($event)" [ngbTypeahead]="search" [resultTemplate]="rt" [inputFormatter]="formatter" (selectItem)="handleSelect($event)" placeholder="Search" i18n-placeholder />
         <div class="input-group-append">
           <button type="submit" class="btn btn-outline-secondary" [disabled]="disabled"><i class="fa fa-search"></i></button>
-          <button type="button" class="clear btn btn-outline-secondary" [disabled]="!clearEnabled" (click)="handleClearClick($event)"><i class="fa fa-remove"></i></button>
+          <button type="button" class="clear btn btn-outline-secondary" [disabled]="!clearEnabled" (click)="handleClearClick($event)"><i class="fas fa-times"></i></button>
         </div>
       </div>
       <div class="options">
diff --git a/projects/common-map/src/fm-map/components/selected-item-geotiff/selected-item-geotiff.component.html b/projects/common-map/src/fm-map/components/selected-item-geotiff/selected-item-geotiff.component.html
index e31ce00..cf88938 100644
--- a/projects/common-map/src/fm-map/components/selected-item-geotiff/selected-item-geotiff.component.html
+++ b/projects/common-map/src/fm-map/components/selected-item-geotiff/selected-item-geotiff.component.html
@@ -22,8 +22,8 @@
         <ul class="p-0 mt-2">
           <li *ngIf="item.isEditable"><a href="#" class="mt-1 mr-1" (click)="handleOnEdit(item)"><i class="fa fa-pencil" aria-hidden="true" i18n-title title="Edit"></i>&nbsp;<span i18n>Edit</span></a></li>
           <ng-container *ngIf="itemTypeService.isLayer(item)">
-            <li *ngIf="!getItemLayer(item,itemLayer.layerIndex)"><a   href="#" (click)="handleAddAsLayer(item,itemLayer.layerIndex)"><i class="fa fa-eye" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Add as overlay</span></a></li>
-            <li *ngIf="getItemLayer(item,itemLayer.layerIndex)"><a  href="#" (click)="handleRemoveLayer(item,itemLayer.layerIndex)"><i class="fa fa-eye" aria-hidden="true" i18n-title title="Remove overlay"></i>&nbsp;<span i18n>Remove overlay</span></a></li>
+            <li *ngIf="!getItemLayer(item,itemLayer.layerIndex)"><a   href="#" (click)="handleAddAsLayer(item,itemLayer.layerIndex)"><i class="fas fa-layer-plus" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Add as overlay</span></a></li>
+            <li *ngIf="getItemLayer(item,itemLayer.layerIndex)"><a  href="#" (click)="handleRemoveLayer(item,itemLayer.layerIndex)"><i class="fas fa-layer-minus" aria-hidden="true" i18n-title title="Remove overlay"></i>&nbsp;<span i18n>Remove overlay</span></a></li>
           </ng-container>
         </ul>
       </div>
diff --git a/projects/common-map/src/fm-map/components/selected-item-shape/selected-item-shape.component.html b/projects/common-map/src/fm-map/components/selected-item-shape/selected-item-shape.component.html
index a9292e1..f1da0c0 100644
--- a/projects/common-map/src/fm-map/components/selected-item-shape/selected-item-shape.component.html
+++ b/projects/common-map/src/fm-map/components/selected-item-shape/selected-item-shape.component.html
@@ -21,8 +21,8 @@
         <ul class="p-0 mt-2">
           <li *ngIf="item.isEditable"><a href="#" class="mt-1 mr-1" (click)="handleOnEdit(item)" ><i class="fa fa-pencil" aria-hidden="true" i18n-title title="Edit"></i>&nbsp;<span i18n>Edit</span></a></li>
           <ng-container *ngIf="itemTypeService.isLayer(item)">
-            <li *ngIf="!getItemLayer(item,itemLayer.layerIndex)"><a   href="#" (click)="handleAddAsLayer(item,itemLayer.layerIndex)" ><i class="fa fa-eye" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Add as overlay</span></a></li>
-            <li *ngIf="getItemLayer(item,itemLayer.layerIndex)"><a  href="#" (click)="handleRemoveLayer(item,itemLayer.layerIndex)" ><i class="fa fa-eye" aria-hidden="true" i18n-title title="Remove overlay"></i>&nbsp;<span i18n>Remove overlay</span></a></li>
+            <li *ngIf="!getItemLayer(item,itemLayer.layerIndex)"><a   href="#" (click)="handleAddAsLayer(item,itemLayer.layerIndex)" ><i class="fas fa-layer-olus" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Add as overlay</span></a></li>
+            <li *ngIf="getItemLayer(item,itemLayer.layerIndex)"><a  href="#" (click)="handleRemoveLayer(item,itemLayer.layerIndex)" ><i class="fas fa-layer-minus" aria-hidden="true" i18n-title title="Remove overlay"></i>&nbsp;<span i18n>Remove overlay</span></a></li>
           </ng-container>
         </ul>
       </div>
diff --git a/projects/common-map/src/fm-map/components/selected-item-temporal/selected-item-temporal.component.html b/projects/common-map/src/fm-map/components/selected-item-temporal/selected-item-temporal.component.html
index aa205a3..89a5276 100644
--- a/projects/common-map/src/fm-map/components/selected-item-temporal/selected-item-temporal.component.html
+++ b/projects/common-map/src/fm-map/components/selected-item-temporal/selected-item-temporal.component.html
@@ -37,8 +37,8 @@
         <ul class="p-0 mt-2">
           <li *ngIf="item.isEditable"><a href="#" class="mt-1 mr-1" (click)="handleOnEdit(item)"><i class="fa fa-pencil" aria-hidden="true" i18n-title title="Edit"></i>&nbsp;<span i18n>Edit</span></a></li>
           <ng-container *ngIf="itemTypeService.isLayer(item)">
-            <li *ngIf="!getItemLayer(item,itemLayer.layerIndex)"><a   href="#" (click)="handleAddAsLayer(item,itemLayer.layerIndex)"><i class="fa fa-eye" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Add as overlay</span></a></li>
-            <li *ngIf="getItemLayer(item,itemLayer.layerIndex)"><a  href="#" (click)="handleRemoveLayer(item,itemLayer.layerIndex)"><i class="fa fa-eye" aria-hidden="true" i18n-title title="Remove overlay"></i>&nbsp;<span i18n>Remove overlay</span></a></li>
+            <li *ngIf="!getItemLayer(item,itemLayer.layerIndex)"><a   href="#" (click)="handleAddAsLayer(item,itemLayer.layerIndex)"><i class="fas fa-layer-plus" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Add as overlay</span></a></li>
+            <li *ngIf="getItemLayer(item,itemLayer.layerIndex)"><a  href="#" (click)="handleRemoveLayer(item,itemLayer.layerIndex)"><i class="fas fa-layer-minus" aria-hidden="true" i18n-title title="Remove overlay"></i>&nbsp;<span i18n>Remove overlay</span></a></li>
           </ng-container>
           <li><a href="#" (click)="handleGoToChart(item)"><i class="fa fa-line-chart" aria-hidden="true" i18m-title title="Show chart"></i>&nbsp;<span i18n>Show chart</span></a></li>
         </ul>
diff --git a/projects/common-map/src/fm-map/components/selected-item/selected-item.component.html b/projects/common-map/src/fm-map/components/selected-item/selected-item.component.html
index ac6c764..3e33097 100644
--- a/projects/common-map/src/fm-map/components/selected-item/selected-item.component.html
+++ b/projects/common-map/src/fm-map/components/selected-item/selected-item.component.html
@@ -14,8 +14,8 @@
           <li *ngIf="itemTypeService.hasViewer(item)"><a href="#" (click)="handleOnView(item)" class="btn btn-outline-secondary"><i class="fa fa-eye" aria-hidden="true" title="View"></i>&nbsp;<span i18n>View</span></a></li>
           <li *ngIf="item.isEditable"><a href="#" (click)="handleOnEdit(item)"><i class="fa fa-pencil" aria-hidden="true" title="Edit"></i> <span i18n>Edit</span></a></li>
           <ng-container *ngIf="itemTypeService.isLayer(item)">
-            <li *ngIf="!getItemLayer(item)"><a href="#" (click)="handleAddAsLayer(item)"><i class="fa fa-eye" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Add as overlay</span></a></li>
-            <li  *ngIf="getItemLayer(item)"><a href="#" (click)="handleRemoveLayer(item)"><i class="fa fa-eye" aria-hidden="true" i18n-title title="Remove overlay"></i>&nbsp;<span i18n>Remove overlay</span></a></li>
+            <li *ngIf="!getItemLayer(item)"><a href="#" (click)="handleAddAsLayer(item)"><i class="fas fa-layer-plus" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Add as overlay</span></a></li>
+            <li  *ngIf="getItemLayer(item)"><a href="#" (click)="handleRemoveLayer(item)"><i class="fas fa-layer-minus" aria-hidden="true" i18n-title title="Remove overlay"></i>&nbsp;<span i18n>Remove overlay</span></a></li>
           </ng-container>
         </ul>
       </div>            
diff --git a/src/app/landingpage/landingpage.component.html b/src/app/landingpage/landingpage.component.html
index c380b5b..5d5d7de 100644
--- a/src/app/landingpage/landingpage.component.html
+++ b/src/app/landingpage/landingpage.component.html
@@ -128,9 +128,9 @@
             </div>
             <div class="col-lg-6 my-auto h-100 text-center text-lg-right">
                 <ul class="list-inline mb-0">
-                    <li class="list-inline-item"><a href="#"><i class="fa fa-facebook fa-2x fa-fw"></i></a></li>
-                    <li class="list-inline-item"><a href="#"><i class="fa fa-twitter fa-2x fa-fw"></i></a></li>
-                    <li class="list-inline-item"><a href="#"><i class="fa fa-instagram fa-2x fa-fw"></i></a></li>
+                    <li class="list-inline-item"><a href="#"><i class="fab fa-facebook-f fa-2x fa-fw"></i></a></li>
+                    <li class="list-inline-item"><a href="#"><i class="fab fa-twitter fa-2x fa-fw"></i></a></li>
+                    <li class="list-inline-item"><a href="#"><i class="fab fa-instagram fa-2x fa-fw"></i></a></li>
                 </ul>
             </div>
         </div>
diff --git a/src/app/menu/menu.component.html b/src/app/menu/menu.component.html
index 91f4de7..bdf6379 100644
--- a/src/app/menu/menu.component.html
+++ b/src/app/menu/menu.component.html
@@ -2,11 +2,11 @@
     <div class="card menu-card">
         <div class="d-flex flex-row flex-wrap">
           <div class="shortcut-icon" (click)="handlePredefinedQuery($event,{itemType:'vnd.farmmaps.itemtype.croppingscheme'})">
-            <div class="icon rounded-circle farm-icon"><i class="fm fm-farm" aria-hidden="true"></i></div>
+            <div class="icon rounded-circle farm-icon"><i class="far fa-farm" aria-hidden="true"></i></div>
             <div class="caption" i18n>Farms</div>
           </div>   
           <div class="shortcut-icon" (click)="handlePredefinedQuery($event,{itemType:'vnd.farmmaps.itemtype.layer'})">
-            <div class="icon rounded-circle thematic-maps-icon"><i class="fa fa-map" aria-hidden="true"></i></div>
+            <div class="icon rounded-circle thematic-maps-icon"><i class="far fa-map" aria-hidden="true"></i></div>
             <div class="caption" i18n>Thematic maps</div>
           </div>   
         </div>       
diff --git a/src/app/menu/menu.component.scss b/src/app/menu/menu.component.scss
index 52d93b6..ddc3ef1 100644
--- a/src/app/menu/menu.component.scss
+++ b/src/app/menu/menu.component.scss
@@ -1,39 +1,39 @@
-.menu-card {
-    padding-left:7px;
-    padding-right:7px;
-    margin-bottom:7px;
-  }
-
-  .shortcut-icon {
-    display: inline-block;
-    text-align: center;
-    margin: 0.5rem;
-    cursor:pointer;
-  }
-  
-  .shortcut-icon > .icon {
-    width: 3rem;
-    height: 3rem;
-    background-color: #731e64;
-    display: inline-block;
-    text-align: center;
-    line-height: 3rem;
-    color: #ffffff;
-    font-size: 2rem;
-  }
-  
-  .shortcut-icon > .caption {
-    text-align: center;
-    width: 4rem;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    color: theme-color();
-  }
-  
-  .shortcut-icon > .farm-icon {
-    background-color: #731E64;
-  }
-  
-  .shortcut-icon > .trijntje-icon {
-    background-color: #FAA33F;
+.menu-card {
+    padding-left:7px;
+    padding-right:7px;
+    margin-bottom:7px;
+  }
+
+  .shortcut-icon {
+    display: inline-block;
+    text-align: center;
+    margin: 0.5rem;
+    cursor:pointer;
+  }
+  
+  .shortcut-icon > .icon {
+    width: 3rem;
+    height: 3rem;
+    background-color: #731e64;
+    display: inline-block;
+    text-align: center;
+    line-height: 3rem;
+    color: #ffffff;
+    font-size: 1.5rem;
+  }
+  
+  .shortcut-icon > .caption {
+    text-align: center;
+    width: 4rem;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    color: theme-color();
+  }
+  
+  .shortcut-icon > .farm-icon {
+    background-color: #731E64;
+  }
+  
+  .shortcut-icon > .trijntje-icon {
+    background-color: #FAA33F;
   }
\ No newline at end of file