diff --git a/projects/common-map/src/fm-map/_theme.scss b/projects/common-map/src/fm-map/_theme.scss
deleted file mode 100644
index ac853f9..0000000
--- a/projects/common-map/src/fm-map/_theme.scss
+++ /dev/null
@@ -1,2 +0,0 @@
-//$theme-colors: ( "primary": #a7ce39, "secondary": #ffc800 );
-//$theme-colors: ( "primary": #a7ce39);
\ No newline at end of file
diff --git a/projects/common-map/src/fm-map/components/aol/gps-location/gps-location.component.scss b/projects/common-map/src/fm-map/components/aol/gps-location/gps-location.component.scss
index c199d1b..20916c6 100644
--- a/projects/common-map/src/fm-map/components/aol/gps-location/gps-location.component.scss
+++ b/projects/common-map/src/fm-map/components/aol/gps-location/gps-location.component.scss
@@ -1,4 +1,3 @@
-@import "../../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 
@@ -11,25 +10,25 @@
 }
 
 .tolerance {
-  fill: theme-color();
+  fill: $primary;
   fill-opacity:0.4;
 }
 
 .border {
-  fill: white;
+  fill: $white;
 }
 
 .center {
-  fill: theme-color();
+  fill: $primary;
 }
 
 .stop1 {
-  stop-color: theme-color();
+  stop-color: $primary;
   stop-opacity:1;
 }
 
 .stop2 {
-  stop-color: theme-color();
+  stop-color:$primary;
   stop-opacity: 0;
 }
 
diff --git a/projects/common-map/src/fm-map/components/aol/pan-to-location/pan-to-location.component.scss b/projects/common-map/src/fm-map/components/aol/pan-to-location/pan-to-location.component.scss
index 60ac0b3..173ab5e 100644
--- a/projects/common-map/src/fm-map/components/aol/pan-to-location/pan-to-location.component.scss
+++ b/projects/common-map/src/fm-map/components/aol/pan-to-location/pan-to-location.component.scss
@@ -1,4 +1,3 @@
-@import "../../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 
@@ -6,7 +5,7 @@
   display:block; 
   width:2.5em;
   height:2.5em;
-  background-color: white;
+  background-color: $body-bg;
   background-size: contain;
   margin-top:0.5em;
 }
@@ -16,13 +15,13 @@
 }
 
 .pan-to {
-  fill: #333333;
+  fill: $secondary;
 }
 
 .pan-to-centered {
-  fill: theme-color()
+  fill: $primary;
 }
 
-.pan-to-disabled {
-  fill: #808080;
+.pan-to-centered.pan-to-disabled {
+  fill: $gray-300;
 }
\ No newline at end of file
diff --git a/projects/common-map/src/fm-map/components/feature-list-container/feature-list-container.component.scss b/projects/common-map/src/fm-map/components/feature-list-container/feature-list-container.component.scss
index b250578..9317554 100644
--- a/projects/common-map/src/fm-map/components/feature-list-container/feature-list-container.component.scss
+++ b/projects/common-map/src/fm-map/components/feature-list-container/feature-list-container.component.scss
@@ -1,19 +1,18 @@
-@import "../../_theme.scss";
-@import "~bootstrap/scss/bootstrap.scss";
-
-
-
-.row {
-  border-bottom: 1px solid gray('500');
-  user-select: none;
-}
-
-.row:hover {
-  background-color: gray('100');
-}
-
-@media screen and (min-width: 44rem)  {
-  .feature-list-container {
-    margin-top: 4rem;
-  }
-}
+@import "~bootstrap/scss/bootstrap.scss";
+
+
+
+.row {
+  border-bottom: 1px solid gray('500');
+  user-select: none;
+}
+
+.row:hover {
+  background-color: gray('100');
+}
+
+@media screen and (min-width: 44rem)  {
+  .feature-list-container {
+    margin-top: 4rem;
+  }
+}
diff --git a/projects/common-map/src/fm-map/components/feature-list-cropfield/feature-list-cropfield.component.scss b/projects/common-map/src/fm-map/components/feature-list-cropfield/feature-list-cropfield.component.scss
index 3cc014e..3706754 100644
--- a/projects/common-map/src/fm-map/components/feature-list-cropfield/feature-list-cropfield.component.scss
+++ b/projects/common-map/src/fm-map/components/feature-list-cropfield/feature-list-cropfield.component.scss
@@ -1,4 +1,3 @@
-@import "../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 fm-map-feature-list-feature-container {
diff --git a/projects/common-map/src/fm-map/components/feature-list-croppingscheme/feature-list-croppingscheme.component.scss b/projects/common-map/src/fm-map/components/feature-list-croppingscheme/feature-list-croppingscheme.component.scss
index e25dfbb..966dc09 100644
--- a/projects/common-map/src/fm-map/components/feature-list-croppingscheme/feature-list-croppingscheme.component.scss
+++ b/projects/common-map/src/fm-map/components/feature-list-croppingscheme/feature-list-croppingscheme.component.scss
@@ -1,4 +1,3 @@
-@import "../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 fm-map-feature-list-feature-container {
diff --git a/projects/common-map/src/fm-map/components/feature-list-feature-cropfield/feature-list-feature-cropfield.component.scss b/projects/common-map/src/fm-map/components/feature-list-feature-cropfield/feature-list-feature-cropfield.component.scss
index 95f4b07..da7a010 100644
--- a/projects/common-map/src/fm-map/components/feature-list-feature-cropfield/feature-list-feature-cropfield.component.scss
+++ b/projects/common-map/src/fm-map/components/feature-list-feature-cropfield/feature-list-feature-cropfield.component.scss
@@ -1,30 +1,29 @@
-@import "../../_theme.scss";
-@import "~bootstrap/scss/bootstrap.scss";
-
-
-
-.card-title {
-  font-size: 1rem;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.thumbnail > img {
-  width: 100%;
-  height: auto;
-}
-
-.thumbnail > div {
-  width: 100%;
-  font-size: 2rem;
-  text-align: center;
-  min-height: 3rem;
-  color: white;
-  padding-top: 0.5rem;
-}
-
-.col {
-  overflow: hidden;
-}
-
+@import "~bootstrap/scss/bootstrap.scss";
+
+
+
+.card-title {
+  font-size: 1rem;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.thumbnail > img {
+  width: 100%;
+  height: auto;
+}
+
+.thumbnail > div {
+  width: 100%;
+  font-size: 2rem;
+  text-align: center;
+  min-height: 3rem;
+  color: white;
+  padding-top: 0.5rem;
+}
+
+.col {
+  overflow: hidden;
+}
+
diff --git a/projects/common-map/src/fm-map/components/feature-list-feature-croppingscheme/feature-list-feature-croppingscheme.component.scss b/projects/common-map/src/fm-map/components/feature-list-feature-croppingscheme/feature-list-feature-croppingscheme.component.scss
index 95f4b07..da7a010 100644
--- a/projects/common-map/src/fm-map/components/feature-list-feature-croppingscheme/feature-list-feature-croppingscheme.component.scss
+++ b/projects/common-map/src/fm-map/components/feature-list-feature-croppingscheme/feature-list-feature-croppingscheme.component.scss
@@ -1,30 +1,29 @@
-@import "../../_theme.scss";
-@import "~bootstrap/scss/bootstrap.scss";
-
-
-
-.card-title {
-  font-size: 1rem;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.thumbnail > img {
-  width: 100%;
-  height: auto;
-}
-
-.thumbnail > div {
-  width: 100%;
-  font-size: 2rem;
-  text-align: center;
-  min-height: 3rem;
-  color: white;
-  padding-top: 0.5rem;
-}
-
-.col {
-  overflow: hidden;
-}
-
+@import "~bootstrap/scss/bootstrap.scss";
+
+
+
+.card-title {
+  font-size: 1rem;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.thumbnail > img {
+  width: 100%;
+  height: auto;
+}
+
+.thumbnail > div {
+  width: 100%;
+  font-size: 2rem;
+  text-align: center;
+  min-height: 3rem;
+  color: white;
+  padding-top: 0.5rem;
+}
+
+.col {
+  overflow: hidden;
+}
+
diff --git a/projects/common-map/src/fm-map/components/feature-list-feature/feature-list-feature.component.scss b/projects/common-map/src/fm-map/components/feature-list-feature/feature-list-feature.component.scss
index 95f4b07..da7a010 100644
--- a/projects/common-map/src/fm-map/components/feature-list-feature/feature-list-feature.component.scss
+++ b/projects/common-map/src/fm-map/components/feature-list-feature/feature-list-feature.component.scss
@@ -1,30 +1,29 @@
-@import "../../_theme.scss";
-@import "~bootstrap/scss/bootstrap.scss";
-
-
-
-.card-title {
-  font-size: 1rem;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.thumbnail > img {
-  width: 100%;
-  height: auto;
-}
-
-.thumbnail > div {
-  width: 100%;
-  font-size: 2rem;
-  text-align: center;
-  min-height: 3rem;
-  color: white;
-  padding-top: 0.5rem;
-}
-
-.col {
-  overflow: hidden;
-}
-
+@import "~bootstrap/scss/bootstrap.scss";
+
+
+
+.card-title {
+  font-size: 1rem;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.thumbnail > img {
+  width: 100%;
+  height: auto;
+}
+
+.thumbnail > div {
+  width: 100%;
+  font-size: 2rem;
+  text-align: center;
+  min-height: 3rem;
+  color: white;
+  padding-top: 0.5rem;
+}
+
+.col {
+  overflow: hidden;
+}
+
diff --git a/projects/common-map/src/fm-map/components/feature-list/feature-list.component.scss b/projects/common-map/src/fm-map/components/feature-list/feature-list.component.scss
index e2233f0..c6b4418 100644
--- a/projects/common-map/src/fm-map/components/feature-list/feature-list.component.scss
+++ b/projects/common-map/src/fm-map/components/feature-list/feature-list.component.scss
@@ -1,4 +1,3 @@
-@import "../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 fm-map-feature-list-feature-container {
diff --git a/projects/common-map/src/fm-map/components/item-list-item/item-list-item.component.scss b/projects/common-map/src/fm-map/components/item-list-item/item-list-item.component.scss
index ef6f471..ed170c3 100644
--- a/projects/common-map/src/fm-map/components/item-list-item/item-list-item.component.scss
+++ b/projects/common-map/src/fm-map/components/item-list-item/item-list-item.component.scss
@@ -1,27 +1,26 @@
-@import "../../_theme.scss";
-@import "~bootstrap/scss/bootstrap.scss";
-
-.widget {
-  padding:0.8rem;
-  height:100%;
-  width:100%;
-  color:#ffffff;
-  position:relative;
-}
-
-.icon {
-  display:block;
-   font-size:6rem;
-   text-align:center;
-}
-.title {
-  display:block;
-  position:absolute;
-  width:calc(100% - 1.6rem );
-  padding-top:0.5rem;
-  bottom:0.8rem;
-  height:2rem;
-  overflow:hidden;
-  white-space:nowrap;
-  text-overflow:ellipsis;
-}
+@import "~bootstrap/scss/bootstrap.scss";
+
+.widget {
+  padding:0.8rem;
+  height:100%;
+  width:100%;
+  color:#ffffff;
+  position:relative;
+}
+
+.icon {
+  display:block;
+   font-size:6rem;
+   text-align:center;
+}
+.title {
+  display:block;
+  position:absolute;
+  width:calc(100% - 1.6rem );
+  padding-top:0.5rem;
+  bottom:0.8rem;
+  height:2rem;
+  overflow:hidden;
+  white-space:nowrap;
+  text-overflow:ellipsis;
+}
diff --git a/projects/common-map/src/fm-map/components/item-list/item-list.component.scss b/projects/common-map/src/fm-map/components/item-list/item-list.component.scss
index 81daa71..16982ec 100644
--- a/projects/common-map/src/fm-map/components/item-list/item-list.component.scss
+++ b/projects/common-map/src/fm-map/components/item-list/item-list.component.scss
@@ -1,4 +1,3 @@
-@import "../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 .widget-container {
diff --git a/projects/common-map/src/fm-map/components/item-widget-list/item-widget-list.component.scss b/projects/common-map/src/fm-map/components/item-widget-list/item-widget-list.component.scss
index f2aec84..622a821 100644
--- a/projects/common-map/src/fm-map/components/item-widget-list/item-widget-list.component.scss
+++ b/projects/common-map/src/fm-map/components/item-widget-list/item-widget-list.component.scss
@@ -1,42 +1,41 @@
-@import "../../_theme.scss";
-@import "~bootstrap/scss/bootstrap.scss";
-
-.widget-container {
-  overflow:auto;
-  margin-bottom:1rem;
-}
-
-.widget {
-  position:relative;
-  border: 1px solid gray('500');
-  user-select: none;
-  display:inline-block;
-  width:50%;
-  overflow:hidden;
-  float:left;
-}
-
-.widget:after {
-  content: "";
-  display: block;
-  padding-bottom: 100%;
-}
-
-.content {
-  position:absolute;
-  width:100%;
-  height:100%;
-}
-
-.widget:hover {
-  background-color: gray('100');
-}
-
-.widget-container {
-  padding:1rem;
-}
-
-.item-container {
-  display:block;
-  height:100%;
-}
+@import "~bootstrap/scss/bootstrap.scss";
+
+.widget-container {
+  overflow:auto;
+  margin-bottom:1rem;
+}
+
+.widget {
+  position:relative;
+  border: 1px solid gray('500');
+  user-select: none;
+  display:inline-block;
+  width:50%;
+  overflow:hidden;
+  float:left;
+}
+
+.widget:after {
+  content: "";
+  display: block;
+  padding-bottom: 100%;
+}
+
+.content {
+  position:absolute;
+  width:100%;
+  height:100%;
+}
+
+.widget:hover {
+  background-color: gray('100');
+}
+
+.widget-container {
+  padding:1rem;
+}
+
+.item-container {
+  display:block;
+  height:100%;
+}
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 d238ae7..cd61741 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,5 +1,5 @@
 <div class="rounded-circle layer-switcher" (click)="handleClick($event)">
-  <i class="fa fa-map"></i>  
+  <i class="fa fa-map-o"></i>  
   <div class="layers hidden" [ngClass]="{'hidden':!(showLayerSwitcher|async)}" (click)="$event.stopPropagation();">
     <div class="card layers-card m-1">
       <div class="card-header" i18n>
@@ -8,13 +8,13 @@
       </div>
       <ul class="navbar-nav">
         <li class="nav-item py-0">
-          <span i18n><i class="fa fa-map" aria-hidden="true"></i> Base maps</span>
+          <span i18n><i class="fa fa-map-o" aria-hidden="true"></i> Base maps</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 i18n><i class="fa fa-map" aria-hidden="true"></i> Overlays</span>
+          <span i18n><i class="fa fa-map-o" aria-hidden="true"></i> Overlays</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/layer-switcher/layer-switcher.component.scss b/projects/common-map/src/fm-map/components/layer-switcher/layer-switcher.component.scss
index ff8f0d9..4cc0263 100644
--- a/projects/common-map/src/fm-map/components/layer-switcher/layer-switcher.component.scss
+++ b/projects/common-map/src/fm-map/components/layer-switcher/layer-switcher.component.scss
@@ -1,4 +1,3 @@
-@import "../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 
@@ -6,11 +5,12 @@
   display:block; 
   width:2.5em;
   height:2.5em;
-  background-color: white;
+  background-color: $body-bg;
   background-size: contain;
   margin-top:0.5em;
   text-align: center;
   line-height: 2.5em; 
+  color: $secondary;
 }
 
 .layers {
diff --git a/projects/common-map/src/fm-map/components/map/map.component.scss b/projects/common-map/src/fm-map/components/map/map.component.scss
index 4997c8a..f02b622 100644
--- a/projects/common-map/src/fm-map/components/map/map.component.scss
+++ b/projects/common-map/src/fm-map/components/map/map.component.scss
@@ -1,4 +1,3 @@
-@import "../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 aol-map { position:absolute;width:100%;height:100%;}
diff --git a/projects/common-map/src/fm-map/components/selected-item-container/selected-item-container.component.scss b/projects/common-map/src/fm-map/components/selected-item-container/selected-item-container.component.scss
index ea36fef..8bd6f0a 100644
--- a/projects/common-map/src/fm-map/components/selected-item-container/selected-item-container.component.scss
+++ b/projects/common-map/src/fm-map/components/selected-item-container/selected-item-container.component.scss
@@ -1,14 +1,13 @@
-@import "../../_theme.scss";
-@import "~bootstrap/scss/bootstrap.scss";
-
-
-
-.row {
-  border-bottom: 1px solid gray('500');
-  user-select: none;
-}
-
-.row:hover {
-  background-color: gray('100');
-}
-
+@import "~bootstrap/scss/bootstrap.scss";
+
+
+
+.row {
+  border-bottom: 1px solid gray('500');
+  user-select: none;
+}
+
+.row:hover {
+  background-color: gray('100');
+}
+
diff --git a/projects/common-map/src/fm-map/components/selected-item-cropfield/selected-item-cropfield.component.scss b/projects/common-map/src/fm-map/components/selected-item-cropfield/selected-item-cropfield.component.scss
index b791497..9a2f30f 100644
--- a/projects/common-map/src/fm-map/components/selected-item-cropfield/selected-item-cropfield.component.scss
+++ b/projects/common-map/src/fm-map/components/selected-item-cropfield/selected-item-cropfield.component.scss
@@ -1,4 +1,3 @@
-@import "../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 .big-icon {
diff --git a/projects/common-map/src/fm-map/components/selected-item-geotiff/selected-item-geotiff.component.scss b/projects/common-map/src/fm-map/components/selected-item-geotiff/selected-item-geotiff.component.scss
index 5321a32..0dc571f 100644
--- a/projects/common-map/src/fm-map/components/selected-item-geotiff/selected-item-geotiff.component.scss
+++ b/projects/common-map/src/fm-map/components/selected-item-geotiff/selected-item-geotiff.component.scss
@@ -1,4 +1,3 @@
-@import "../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 .big-icon {
diff --git a/projects/common-map/src/fm-map/components/selected-item-shape/selected-item-shape.component.scss b/projects/common-map/src/fm-map/components/selected-item-shape/selected-item-shape.component.scss
index 0697183..e4995c5 100644
--- a/projects/common-map/src/fm-map/components/selected-item-shape/selected-item-shape.component.scss
+++ b/projects/common-map/src/fm-map/components/selected-item-shape/selected-item-shape.component.scss
@@ -1,4 +1,3 @@
-@import "../../_theme.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 
 .big-icon {
diff --git a/projects/common-map/src/fm-map/components/selected-item/selected-item.component.scss b/projects/common-map/src/fm-map/components/selected-item/selected-item.component.scss
index 95925bb..0dd4025 100644
--- a/projects/common-map/src/fm-map/components/selected-item/selected-item.component.scss
+++ b/projects/common-map/src/fm-map/components/selected-item/selected-item.component.scss
@@ -1,14 +1,13 @@
-@import "../../theme.scss";
-@import "~bootstrap/scss/bootstrap.scss";
-
-.big-icon {
-  width: 100%;
-  color: white;
-  font-size: 9rem;
-  padding: 3rem;
-  text-align: center;
-}
-
-.card-title {
-  font-size: 1rem;
-}
+@import "~bootstrap/scss/bootstrap.scss";
+
+.big-icon {
+  width: 100%;
+  color: white;
+  font-size: 9rem;
+  padding: 3rem;
+  text-align: center;
+}
+
+.card-title {
+  font-size: 1rem;
+}
diff --git a/projects/common/src/fm/_theme.scss b/projects/common/src/fm/_theme.scss
deleted file mode 100644
index ac853f9..0000000
--- a/projects/common/src/fm/_theme.scss
+++ /dev/null
@@ -1,2 +0,0 @@
-//$theme-colors: ( "primary": #a7ce39, "secondary": #ffc800 );
-//$theme-colors: ( "primary": #a7ce39);
\ No newline at end of file
diff --git a/projects/common/src/fm/components/app/app.component.scss b/projects/common/src/fm/components/app/app.component.scss
index f9a8172..25bca4c 100644
--- a/projects/common/src/fm/components/app/app.component.scss
+++ b/projects/common/src/fm/components/app/app.component.scss
@@ -1,5 +1,3 @@
-//@import "theme.scss";
-
 /* Import Bootstrap & Fonts */
 
 @import "~bootstrap/scss/bootstrap.scss";
diff --git a/projects/common/src/fm/components/resumable-file-upload/resumable-file-upload.component.scss b/projects/common/src/fm/components/resumable-file-upload/resumable-file-upload.component.scss
index 1886f7e..3369815 100644
--- a/projects/common/src/fm/components/resumable-file-upload/resumable-file-upload.component.scss
+++ b/projects/common/src/fm/components/resumable-file-upload/resumable-file-upload.component.scss
@@ -1,113 +1,111 @@
-@import "../../theme.scss";
-
-/* Import Bootstrap & Fonts */
-
-@import "~bootstrap/scss/bootstrap.scss";
-
-div.resumable-file-upload {
-  position: fixed;
-  right: 0px;
-  bottom: 0px;
-  width: 300px;
-  max-height: 250px;
-  /*z-index:2000 !important;*/
-}
-
-div.minimized {
-    height: 0px;
-}
-
-div.closed {
-    height: 0px;
-}
-
-div.card {
-    margin-bottom: 0px;
-}
-
-div.card-block {
-    max-height: calc(250px - 41px);
-    overflow-y: auto;
-}
-
-div.minimized div.card-block {
-    height: 0px;
-}
-
-div.card-header span.fa {
-    padding-left: 5px;
-}
-
-.upload-file {
-    padding-top: 3px;
-}
-
-    .upload-file .progress-container {
-        height: 3px;
-        width: 100%;
-        margin-top:4px;
-    }
-
-        .upload-file .progress-container .progress-bar {
-            display: block;
-            background-color: color("green");
-            width: 0%;
-            height: 100%;
-        }
-
-    .upload-file.done .progress-container .progress-bar {
-        display: none;
-    }
-
-    .upload-file > div > span.file-name {
-        display: inline-block;
-        width: calc(100% - 20px);
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-        vertical-align: middle;
-    }
-
-    .upload-file > div > a.file-name {
-      display: inline-block;
-      width: calc(100% - 20px);
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      vertical-align: middle;
-  }
-
-.upload-file.busy > div > span.fa-times {
-  color: theme-color("danger");
-  width: 20px;
-  display: inline-block;
-  vertical-align: middle;
-}
-
-  .upload-file.done > div > span.fa-times {
-    display: none;
-  }
-
-  .upload-file.done > div > span.fa-check {
-    color: color("green");
-    width: 20px;
-    display: inline-block;
-    vertical-align: middle;
-  }
-
-  .upload-file > div.errormessage {
-    color: theme-color("danger");
-    display: none;
-  }
-
-  .upload-file.error > div.errormessage {
-    display: block;
-  }
-
-  .upload-file.busy > div > span.fa-check {
-    display: none;
-  }
-
-.resumable-file-upload ul {
-  padding:0px;
-}
+/* Import Bootstrap & Fonts */
+
+@import "~bootstrap/scss/bootstrap.scss";
+
+div.resumable-file-upload {
+  position: fixed;
+  right: 0px;
+  bottom: 0px;
+  width: 300px;
+  max-height: 250px;
+  /*z-index:2000 !important;*/
+}
+
+div.minimized {
+    height: 0px;
+}
+
+div.closed {
+    height: 0px;
+}
+
+div.card {
+    margin-bottom: 0px;
+}
+
+div.card-block {
+    max-height: calc(250px - 41px);
+    overflow-y: auto;
+}
+
+div.minimized div.card-block {
+    height: 0px;
+}
+
+div.card-header span.fa {
+    padding-left: 5px;
+}
+
+.upload-file {
+    padding-top: 3px;
+}
+
+    .upload-file .progress-container {
+        height: 3px;
+        width: 100%;
+        margin-top:4px;
+    }
+
+        .upload-file .progress-container .progress-bar {
+            display: block;
+            background-color: color("green");
+            width: 0%;
+            height: 100%;
+        }
+
+    .upload-file.done .progress-container .progress-bar {
+        display: none;
+    }
+
+    .upload-file > div > span.file-name {
+        display: inline-block;
+        width: calc(100% - 20px);
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        vertical-align: middle;
+    }
+
+    .upload-file > div > a.file-name {
+      display: inline-block;
+      width: calc(100% - 20px);
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      vertical-align: middle;
+  }
+
+.upload-file.busy > div > span.fa-times {
+  color: theme-color("danger");
+  width: 20px;
+  display: inline-block;
+  vertical-align: middle;
+}
+
+  .upload-file.done > div > span.fa-times {
+    display: none;
+  }
+
+  .upload-file.done > div > span.fa-check {
+    color: color("green");
+    width: 20px;
+    display: inline-block;
+    vertical-align: middle;
+  }
+
+  .upload-file > div.errormessage {
+    color: theme-color("danger");
+    display: none;
+  }
+
+  .upload-file.error > div.errormessage {
+    display: block;
+  }
+
+  .upload-file.busy > div > span.fa-check {
+    display: none;
+  }
+
+.resumable-file-upload ul {
+  padding:0px;
+}