diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 71eea2a4..de8d487d 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,5 +1,5 @@
 import { Routes } from '@angular/router';
-import { Component, ViewEncapsulation, ViewContainerRef } from '@angular/core';
+import { Component, ViewContainerRef } from '@angular/core';
 
 import { GlobalState } from './global.state';
 import { BaImageLoaderService, BaThemePreloader, BaThemeSpinner } from './theme/services';
@@ -18,8 +18,6 @@ import 'style-loader!./theme/initial.scss';
  */
 @Component({
   selector: 'app',
-  // // encapsulation: ViewEncapsulation.None,
-  // styleUrls: ['./app.scss'],
   template: `
     <main [ngClass]="{'menu-collapsed': isMenuCollapsed}" baThemeRun>
       <div class="additional-bg"></div>
diff --git a/src/app/pages/dashboard/calendar/calendar.component.ts b/src/app/pages/dashboard/calendar/calendar.component.ts
index bc5cfaf2..30bbaecd 100644
--- a/src/app/pages/dashboard/calendar/calendar.component.ts
+++ b/src/app/pages/dashboard/calendar/calendar.component.ts
@@ -1,11 +1,10 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 
 import {CalendarService} from './calendar.service';
 import 'style-loader!./calendar.scss';
 
 @Component({
   selector: 'calendar',
-  // // encapsulation: ViewEncapsulation.None,
   templateUrl: './calendar.html'
 })
 export class Calendar {
diff --git a/src/app/pages/dashboard/feed/feed.component.ts b/src/app/pages/dashboard/feed/feed.component.ts
index b53479a2..244d3e77 100644
--- a/src/app/pages/dashboard/feed/feed.component.ts
+++ b/src/app/pages/dashboard/feed/feed.component.ts
@@ -1,11 +1,11 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 
 import {FeedService} from './feed.service';
 
+import 'style-loader!./feed.scss';
+
 @Component({
   selector: 'feed',
-  // // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./feed.scss'],
   templateUrl: './feed.html'
 })
 export class Feed {
diff --git a/src/app/pages/dashboard/todo/todo.component.ts b/src/app/pages/dashboard/todo/todo.component.ts
index 4bc9d93a..2daafa96 100644
--- a/src/app/pages/dashboard/todo/todo.component.ts
+++ b/src/app/pages/dashboard/todo/todo.component.ts
@@ -1,12 +1,12 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 import {BaThemeConfigProvider} from '../../../theme';
 
 import {TodoService} from './todo.service';
 
+import 'style-loader!./todo.scss';
+
 @Component({
   selector: 'todo',
-  // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./todo.scss'],
   templateUrl: './todo.html'
 })
 export class Todo {
diff --git a/src/app/pages/dashboard/trafficChart/trafficChart.component.ts b/src/app/pages/dashboard/trafficChart/trafficChart.component.ts
index 35c04369..dce1916e 100644
--- a/src/app/pages/dashboard/trafficChart/trafficChart.component.ts
+++ b/src/app/pages/dashboard/trafficChart/trafficChart.component.ts
@@ -1,13 +1,13 @@
-import {Component, ViewEncapsulation, ElementRef} from '@angular/core';
+import {Component} from '@angular/core';
 
 import './trafficChart.loader.ts';
 import {TrafficChartService} from './trafficChart.service';
 import * as Chart from 'chart.js';
 
+import 'style-loader!./trafficChart.scss';
+
 @Component({
   selector: 'traffic-chart',
-  // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./trafficChart.scss'],
   templateUrl: './trafficChart.html'
 })
 
diff --git a/src/app/pages/forms/components/inputs/inputs.component.ts b/src/app/pages/forms/components/inputs/inputs.component.ts
index 800d605b..327078ad 100644
--- a/src/app/pages/forms/components/inputs/inputs.component.ts
+++ b/src/app/pages/forms/components/inputs/inputs.component.ts
@@ -1,8 +1,7 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 
 @Component({
   selector: 'inputs',
-  // encapsulation: ViewEncapsulation.None,
   templateUrl: './inputs.html',
 })
 export class Inputs {
diff --git a/src/app/pages/forms/components/layouts/layouts.component.ts b/src/app/pages/forms/components/layouts/layouts.component.ts
index a25ed827..4dbb4139 100644
--- a/src/app/pages/forms/components/layouts/layouts.component.ts
+++ b/src/app/pages/forms/components/layouts/layouts.component.ts
@@ -1,9 +1,8 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 import { NgUploaderOptions } from 'ngx-uploader';
 
 @Component({
   selector: 'layouts',
-  // encapsulation: ViewEncapsulation.None,
   styles: [],
   templateUrl: './layouts.html',
 })
diff --git a/src/app/pages/login/login.component.ts b/src/app/pages/login/login.component.ts
index de6f4c45..92f3c65c 100644
--- a/src/app/pages/login/login.component.ts
+++ b/src/app/pages/login/login.component.ts
@@ -1,10 +1,10 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 import {FormGroup, AbstractControl, FormBuilder, Validators} from '@angular/forms';
 
+import 'style-loader!./login.scss';
+
 @Component({
   selector: 'login',
-  // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./login.scss'],
   templateUrl: './login.html',
 })
 export class Login {
diff --git a/src/app/pages/pages.component.ts b/src/app/pages/pages.component.ts
index 67f50062..382ce5eb 100644
--- a/src/app/pages/pages.component.ts
+++ b/src/app/pages/pages.component.ts
@@ -1,7 +1,6 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 @Component({
   selector: 'pages',
-  // encapsulation: ViewEncapsulation.None,
   styles: [],
   template: `
     <ba-sidebar></ba-sidebar>
diff --git a/src/app/pages/register/register.component.ts b/src/app/pages/register/register.component.ts
index b3f6e8bf..7901c5f0 100644
--- a/src/app/pages/register/register.component.ts
+++ b/src/app/pages/register/register.component.ts
@@ -2,10 +2,10 @@ import {Component, ViewEncapsulation} from '@angular/core';
 import {FormGroup, AbstractControl, FormBuilder, Validators} from '@angular/forms';
 import {EmailValidator, EqualPasswordsValidator} from '../../theme/validators';
 
+import 'style-loader!./register.scss';
+
 @Component({
   selector: 'register',
-  // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./register.scss'],
   templateUrl: './register.html',
 })
 export class Register {
diff --git a/src/app/pages/tables/components/basicTables/basicTables.component.ts b/src/app/pages/tables/components/basicTables/basicTables.component.ts
index f70af3e5..0fcdacde 100644
--- a/src/app/pages/tables/components/basicTables/basicTables.component.ts
+++ b/src/app/pages/tables/components/basicTables/basicTables.component.ts
@@ -1,9 +1,9 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
+
+import 'style-loader!./basicTables.scss';
 
 @Component({
   selector: 'basic-tables',
-  // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./basicTables.scss'],
   templateUrl: './basicTables.html'
 })
 export class BasicTables {
diff --git a/src/app/pages/ui/components/grid/grid.component.ts b/src/app/pages/ui/components/grid/grid.component.ts
index 83765d00..555e0c86 100644
--- a/src/app/pages/ui/components/grid/grid.component.ts
+++ b/src/app/pages/ui/components/grid/grid.component.ts
@@ -1,9 +1,9 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
+
+import 'style-loader!./grid.scss';
 
 @Component({
   selector: 'grid',
-  // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./grid.scss'],
   templateUrl: './grid.html',
 })
 export class Grid {
diff --git a/src/app/pages/ui/components/icons/icons.component.ts b/src/app/pages/ui/components/icons/icons.component.ts
index f51b0720..4dba6154 100644
--- a/src/app/pages/ui/components/icons/icons.component.ts
+++ b/src/app/pages/ui/components/icons/icons.component.ts
@@ -1,11 +1,11 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 
 import {IconsService} from './icons.service';
 
+import 'style-loader!./icons.scss';
+
 @Component({
   selector: 'icons',
-  // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./icons.scss'],
   templateUrl: './icons.html',
 })
 export class Icons {
diff --git a/src/app/theme/components/baAmChart/baAmChart.component.ts b/src/app/theme/components/baAmChart/baAmChart.component.ts
index 7e067aed..6f9594c1 100644
--- a/src/app/theme/components/baAmChart/baAmChart.component.ts
+++ b/src/app/theme/components/baAmChart/baAmChart.component.ts
@@ -1,15 +1,15 @@
-import {Component, ViewChild, ViewEncapsulation, Input, Output, ElementRef, EventEmitter} from '@angular/core';
+import {Component, ViewChild, Input, Output, ElementRef, EventEmitter} from '@angular/core';
 
 import {BaThemePreloader} from '../../../theme/services';
 
 import './baAmChart.loader.ts';
 import {BaAmChartThemeService} from './baAmChartTheme.service';
 
+import 'style-loader!./baAmChart.scss';
+
 @Component({
   selector: 'ba-am-chart',
   templateUrl: './baAmChart.html',
-  styleUrls: ['./baAmChart.scss'],
-  // // encapsulation: ViewEncapsulation.None,
   providers: [BaAmChartThemeService],
 })
 export class BaAmChart {
diff --git a/src/app/theme/components/baCard/baCard.component.ts b/src/app/theme/components/baCard/baCard.component.ts
index bac86833..8b464afc 100644
--- a/src/app/theme/components/baCard/baCard.component.ts
+++ b/src/app/theme/components/baCard/baCard.component.ts
@@ -1,9 +1,8 @@
-import {Component, ViewEncapsulation, ViewChild, Input} from '@angular/core';
+import {Component, Input} from '@angular/core';
 
 @Component({
   selector: 'ba-card',
   templateUrl: './baCard.html',
-  // encapsulation: ViewEncapsulation.None
 })
 export class BaCard {
   @Input() title:String;
diff --git a/src/app/theme/components/baFullCalendar/baFullCalendar.component.ts b/src/app/theme/components/baFullCalendar/baFullCalendar.component.ts
index 329a68ad..f548026e 100644
--- a/src/app/theme/components/baFullCalendar/baFullCalendar.component.ts
+++ b/src/app/theme/components/baFullCalendar/baFullCalendar.component.ts
@@ -1,11 +1,12 @@
-import {Component, ViewChild, ViewEncapsulation, Input, Output, ElementRef, EventEmitter} from '@angular/core';
+import {Component, ViewChild, Input, Output, ElementRef, EventEmitter} from '@angular/core';
 
 import './baFullCalendar.loader.ts';
 
+import 'style-loader!./baFullCalendar.scss';
+
 @Component({
   selector: 'ba-full-calendar',
   templateUrl: './baFullCalendar.html',
-  // // encapsulation: ViewEncapsulation.None,
 })
 export class BaFullCalendar {
 
diff --git a/src/app/theme/components/baMenu/baMenu.component.ts b/src/app/theme/components/baMenu/baMenu.component.ts
index f4d85cea..7eee2061 100644
--- a/src/app/theme/components/baMenu/baMenu.component.ts
+++ b/src/app/theme/components/baMenu/baMenu.component.ts
@@ -1,14 +1,14 @@
-import { Component, ViewEncapsulation, Input, Output, EventEmitter } from '@angular/core';
+import { Component, Input, Output, EventEmitter } from '@angular/core';
 import { Router, NavigationEnd } from '@angular/router';
 import { Subscription } from 'rxjs/Rx';
 
 import { BaMenuService } from '../../services';
 import { GlobalState } from '../../../global.state';
 
+import 'style-loader!./baMenu.scss';
+
 @Component({
   selector: 'ba-menu',
-  // // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./baMenu.scss'],
   templateUrl: './baMenu.html'
 })
 export class BaMenu {
diff --git a/src/app/theme/components/baMenu/components/baMenuItem/baMenuItem.component.ts b/src/app/theme/components/baMenu/components/baMenuItem/baMenuItem.component.ts
index 2d453cf3..8a949583 100644
--- a/src/app/theme/components/baMenu/components/baMenuItem/baMenuItem.component.ts
+++ b/src/app/theme/components/baMenu/components/baMenuItem/baMenuItem.component.ts
@@ -1,9 +1,9 @@
-import {Component, ViewEncapsulation, Input, Output, EventEmitter} from '@angular/core';
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+
+import 'style-loader!./baMenuItem.scss';
 
 @Component({
   selector: 'ba-menu-item',
-  // // encapsulation: ViewEncapsulation.None,
-  styleUrls: ['./baMenuItem.scss'],
   templateUrl: './baMenuItem.html'
 })
 export class BaMenuItem {
diff --git a/src/app/theme/components/baPageTop/baPageTop.component.ts b/src/app/theme/components/baPageTop/baPageTop.component.ts
index e8a3904d..663787d2 100644
--- a/src/app/theme/components/baPageTop/baPageTop.component.ts
+++ b/src/app/theme/components/baPageTop/baPageTop.component.ts
@@ -1,12 +1,12 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 
 import {GlobalState} from '../../../global.state';
 
+import 'style-loader!./baPageTop.scss';
+
 @Component({
   selector: 'ba-page-top',
-  styleUrls: ['./baPageTop.scss'],
   templateUrl: './baPageTop.html',
-  // encapsulation: ViewEncapsulation.None
 })
 export class BaPageTop {