diff --git a/src/atlasViewer/atlasViewer.component.ts b/src/atlasViewer/atlasViewer.component.ts
index 825e873c8d3a91f398f0ccf020de984e0e15dd8a..4742ee05d6d0a51047c5455bf30e110c815fcf62 100644
--- a/src/atlasViewer/atlasViewer.component.ts
+++ b/src/atlasViewer/atlasViewer.component.ts
@@ -12,6 +12,7 @@ import { ModalUnit } from "./modalUnit/modalUnit.component";
 import { AtlasViewerURLService } from "./atlasViewer.urlService.service";
 import { AtlasViewerAPIServices } from "./atlasViewer.apiService.service";
 
+import '@angular/material/prebuilt-themes/indigo-pink.css'
 import '../res/css/extra_styles.css'
 import { NehubaContainer } from "../ui/nehubaContainer/nehubaContainer.component";
 import { colorAnimation } from "./atlasViewer.animation"
diff --git a/src/index.html b/src/index.html
index 3cd64e66e8db5f00b99f0cdf2a6a97b985fc9a92..467e979f0b14b8f6bbaedae248b488a4f72745d6 100644
--- a/src/index.html
+++ b/src/index.html
@@ -8,7 +8,7 @@
   <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
   <link rel = "stylesheet" href = "extra_styles.css">
   <link rel = "stylesheet" href = "plugin_styles.css">
-  <link rel = "stylesheet" href = "../node_modules/@angular/material/prebuilt-themes/indigo-pink.css">
+  <link rel = "stylesheet" href = "indigo-pink.css">
 
   <title>Interactive Atlas Viewer</title>
 </head>
diff --git a/webpack.staticassets.js b/webpack.staticassets.js
index 6523e83f2a2128ce581bfaaac5f0755308807f92..cad3e8a0d4b3861ba397d125e8c1f3276dacb1b5 100644
--- a/webpack.staticassets.js
+++ b/webpack.staticassets.js
@@ -36,6 +36,15 @@ module.exports = {
             context : 'src'
           }
         }]
+      },
+      {
+        test: /indigo-pink\.css/,
+        use: {
+          loader: 'file-loader',
+          options: {
+            name: '[name].[ext]'
+          }
+        }
       }
     ]
   },