diff --git a/src/index.html b/src/index.html
index 9c999545..562bcc04 100644
--- a/src/index.html
+++ b/src/index.html
@@ -18,6 +18,12 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="icon" type="image/x-icon" href="assets/favicon.ico">
 
+  <!-- 
+    angular/angular-cli has an issue with handling imports with leading ~ (like: @import '~https://url.url';)
+    #Ref. https://github.com/angular/angular-cli/issues/9181
+    /* @TODO: make Material Icons self hosted */
+    //-->
+  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 
   <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700" type="text/css">
   <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto+Slab:400,700" type="text/css">
diff --git a/src/styles.css b/src/styles.css
index 5723d03e..f817859b 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -1,6 +1,3 @@
-/* @TODO: make icons self hosted */
-@import '~https://fonts.googleapis.com/icon?family=Material+Icons';
-
 img.logo-header {
   width: 50px;
 }