diff --git a/src/app/@theme/styles/_material-dark.scss b/src/app/@theme/styles/_material-dark.scss
new file mode 100644
index 00000000..181e3219
--- /dev/null
+++ b/src/app/@theme/styles/_material-dark.scss
@@ -0,0 +1,370 @@
+/**
+ * @license
+ * Copyright Akveo. All Rights Reserved.
+ * Licensed under the MIT License. See License.txt in the project root for license information.
+ */
+
+ @import '~@nebular/theme/styles/core/functions';
+ @import '~@nebular/theme/styles/core/mixins';
+
+$theme: (
+  color-primary-100: #fff2f7,
+  color-primary-200: #ffd4e3,
+  color-primary-300: #fc9abc,
+  color-primary-400: #f24681,
+  color-primary-500: #e91d63,
+  color-primary-600: #c71451,
+  color-primary-700: #a80d43,
+  color-primary-800: #870935,
+  color-primary-900: #70062a,
+
+  color-primary-transparent-100: rgba(233, 29, 99, 0.08),
+  color-primary-transparent-200: rgba(233, 29, 99, 0.16),
+  color-primary-transparent-300: rgba(233, 29, 99, 0.24),
+  color-primary-transparent-400: rgba(233, 29, 99, 0.32),
+  color-primary-transparent-500: rgba(233, 29, 99, 0.4),
+  color-primary-transparent-600: rgba(233, 29, 99, 0.48),
+
+  color-success-100: #edfbd1,
+  color-success-200: #d7f7a6,
+  color-success-300: #b4e775,
+  color-success-400: #8fcf50,
+  color-success-500: #60af20,
+  color-success-600: #499617,
+  color-success-700: #357d10,
+  color-success-800: #24650a,
+  color-success-900: #175306,
+
+  color-success-transparent-100: rgba(96, 175, 32, 0.08),
+  color-success-transparent-200: rgba(96, 175, 32, 0.16),
+  color-success-transparent-300: rgba(96, 175, 32, 0.24),
+  color-success-transparent-400: rgba(96, 175, 32, 0.32),
+  color-success-transparent-500: rgba(96, 175, 32, 0.4),
+  color-success-transparent-600: rgba(96, 175, 32, 0.48),
+
+  color-info-100: #ccf7fe,
+  color-info-200: #99e9fd,
+  color-info-300: #66d3f9,
+  color-info-400: #40bbf4,
+  color-info-500: #0495ee,
+  color-info-600: #0273cc,
+  color-info-700: #0256ab,
+  color-info-800: #013d8a,
+  color-info-900: #002b72,
+
+  color-info-transparent-100: rgba(4, 149, 238, 0.08),
+  color-info-transparent-200: rgba(4, 149, 238, 0.16),
+  color-info-transparent-300: rgba(4, 149, 238, 0.24),
+  color-info-transparent-400: rgba(4, 149, 238, 0.32),
+  color-info-transparent-500: rgba(4, 149, 238, 0.4),
+  color-info-transparent-600: rgba(4, 149, 238, 0.48),
+
+  color-warning-100: #fff3cd,
+  color-warning-200: #ffe49b,
+  color-warning-300: #ffd169,
+  color-warning-400: #ffbe43,
+  color-warning-500: #ff9f05,
+  color-warning-600: #db8003,
+  color-warning-700: #b76302,
+  color-warning-800: #934a01,
+  color-warning-900: #7a3800,
+
+  color-warning-transparent-100: rgba(255, 159, 5, 0.08),
+  color-warning-transparent-200: rgba(255, 159, 5, 0.16),
+  color-warning-transparent-300: rgba(255, 159, 5, 0.24),
+  color-warning-transparent-400: rgba(255, 159, 5, 0.32),
+  color-warning-transparent-500: rgba(255, 159, 5, 0.4),
+  color-warning-transparent-600: rgba(255, 159, 5, 0.48),
+
+  color-danger-100: #fbd2c8,
+  color-danger-200: #f79e94,
+  color-danger-300: #e75d5c,
+  color-danger-400: #cf3341,
+  color-danger-500: #b00020,
+  color-danger-600: #970029,
+  color-danger-700: #7e002e,
+  color-danger-800: #66002f,
+  color-danger-900: #54002f,
+
+  color-danger-transparent-100: rgba(176, 0, 32, 0.08),
+  color-danger-transparent-200: rgba(176, 0, 32, 0.16),
+  color-danger-transparent-300: rgba(176, 0, 32, 0.24),
+  color-danger-transparent-400: rgba(176, 0, 32, 0.32),
+  color-danger-transparent-500: rgba(176, 0, 32, 0.4),
+  color-danger-transparent-600: rgba(176, 0, 32, 0.48),
+
+  color-basic-100: #ffffff,
+  color-basic-200: #f5f5f5,
+  color-basic-300: #f5f5f5,
+  color-basic-400: #d4d4d4,
+  color-basic-500: #b3b3b3,
+  color-basic-600: #808080,
+  color-basic-700: #4a4a4a,
+  color-basic-800: #383838,
+  color-basic-900: #292929,
+  color-basic-1000: #1f1f1f,
+  color-basic-1100: #141414,
+
+  color-basic-transparent-100: rgba(128, 128, 128, 0.08),
+  color-basic-transparent-200: rgba(128, 128, 128, 0.16),
+  color-basic-transparent-300: rgba(128, 128, 128, 0.24),
+  color-basic-transparent-400: rgba(128, 128, 128, 0.32),
+  color-basic-transparent-500: rgba(128, 128, 128, 0.4),
+  color-basic-transparent-600: rgba(128, 128, 128, 0.48),
+
+  color-basic-control-transparent-100: rgba(255, 255, 255, 0.08),
+  color-basic-control-transparent-200: rgba(255, 255, 255, 0.16),
+  color-basic-control-transparent-300: rgba(255, 255, 255, 0.24),
+  color-basic-control-transparent-400: rgba(255, 255, 255, 0.32),
+  color-basic-control-transparent-500: rgba(255, 255, 255, 0.4),
+  color-basic-control-transparent-600: rgba(255, 255, 255, 0.48),
+
+  color-basic-focus: color-basic-400,
+  color-basic-hover: color-basic-200,
+  color-basic-default: color-basic-300,
+  color-basic-active: color-basic-400,
+  color-basic-disabled: color-basic-transparent-300,
+  color-basic-focus-border: color-basic-500,
+  color-basic-hover-border: color-basic-hover,
+  color-basic-default-border: color-basic-default,
+  color-basic-active-border: color-basic-active,
+  color-basic-disabled-border: color-basic-disabled,
+
+  color-basic-transparent-focus: color-basic-transparent-300,
+  color-basic-transparent-hover: color-basic-transparent-200,
+  color-basic-transparent-default: color-basic-transparent-100,
+  color-basic-transparent-active: color-basic-transparent-300,
+  color-basic-transparent-disabled: color-basic-transparent-200,
+  color-basic-transparent-focus-border: color-basic-500,
+  color-basic-transparent-hover-border: color-basic-500,
+  color-basic-transparent-default-border: color-basic-500,
+  color-basic-transparent-active-border: color-basic-500,
+  color-basic-transparent-disabled-border: color-basic-transparent-300,
+
+  color-primary-focus: color-primary-600,
+  color-primary-hover: color-primary-400,
+  color-primary-default: color-primary-500,
+  color-primary-active: color-primary-600,
+  color-primary-disabled: color-basic-transparent-300,
+  color-primary-focus-border: color-primary-700,
+  color-primary-hover-border: color-primary-hover,
+  color-primary-default-border: color-primary-default,
+  color-primary-active-border: color-primary-active,
+  color-primary-disabled-border: color-primary-disabled,
+
+  color-primary-transparent-focus: color-primary-transparent-300,
+  color-primary-transparent-hover: color-primary-transparent-200,
+  color-primary-transparent-default: color-primary-transparent-100,
+  color-primary-transparent-active: color-primary-transparent-300,
+  color-primary-transparent-disabled: color-basic-transparent-200,
+  color-primary-transparent-focus-border: color-primary-500,
+  color-primary-transparent-hover-border: color-primary-500,
+  color-primary-transparent-default-border: color-primary-500,
+  color-primary-transparent-active-border: color-primary-500,
+  color-primary-transparent-disabled-border: color-basic-transparent-300,
+
+  color-success-focus: color-success-600,
+  color-success-hover: color-success-400,
+  color-success-default: color-success-500,
+  color-success-active: color-success-600,
+  color-success-disabled: color-basic-transparent-300,
+  color-success-focus-border: color-success-700,
+  color-success-hover-border: color-success-hover,
+  color-success-default-border: color-success-default,
+  color-success-active-border: color-success-active,
+  color-success-disabled-border: color-success-disabled,
+
+  color-success-transparent-focus: color-success-transparent-300,
+  color-success-transparent-hover: color-success-transparent-200,
+  color-success-transparent-default: color-success-transparent-100,
+  color-success-transparent-active: color-success-transparent-300,
+  color-success-transparent-disabled: color-basic-transparent-200,
+  color-success-transparent-focus-border: color-success-500,
+  color-success-transparent-hover-border: color-success-500,
+  color-success-transparent-default-border: color-success-500,
+  color-success-transparent-active-border: color-success-500,
+  color-success-transparent-disabled-border: color-basic-transparent-300,
+
+  color-info-focus: color-info-600,
+  color-info-hover: color-info-400,
+  color-info-default: color-info-500,
+  color-info-active: color-info-600,
+  color-info-disabled: color-basic-transparent-300,
+  color-info-focus-border: color-info-700,
+  color-info-hover-border: color-info-hover,
+  color-info-default-border: color-info-default,
+  color-info-active-border: color-info-active,
+  color-info-disabled-border: color-info-disabled,
+
+  color-info-transparent-focus: color-info-transparent-300,
+  color-info-transparent-hover: color-info-transparent-200,
+  color-info-transparent-default: color-info-transparent-100,
+  color-info-transparent-active: color-info-transparent-300,
+  color-info-transparent-disabled: color-basic-transparent-200,
+  color-info-transparent-focus-border: color-info-500,
+  color-info-transparent-hover-border: color-info-500,
+  color-info-transparent-default-border: color-info-500,
+  color-info-transparent-active-border: color-info-500,
+  color-info-transparent-disabled-border: color-basic-transparent-300,
+
+  color-warning-focus: color-warning-600,
+  color-warning-hover: color-warning-400,
+  color-warning-default: color-warning-500,
+  color-warning-active: color-warning-600,
+  color-warning-disabled: color-basic-transparent-300,
+  color-warning-focus-border: color-warning-700,
+  color-warning-hover-border: color-warning-hover,
+  color-warning-default-border: color-warning-default,
+  color-warning-active-border: color-warning-active,
+  color-warning-disabled-border: color-warning-disabled,
+
+  color-warning-transparent-focus: color-warning-transparent-300,
+  color-warning-transparent-hover: color-warning-transparent-200,
+  color-warning-transparent-default: color-warning-transparent-100,
+  color-warning-transparent-active: color-warning-transparent-300,
+  color-warning-transparent-disabled: color-basic-transparent-200,
+  color-warning-transparent-focus-border: color-warning-500,
+  color-warning-transparent-hover-border: color-warning-500,
+  color-warning-transparent-default-border: color-warning-500,
+  color-warning-transparent-active-border: color-warning-500,
+  color-warning-transparent-disabled-border: color-basic-transparent-300,
+
+  color-danger-focus: color-danger-600,
+  color-danger-hover: color-danger-400,
+  color-danger-default: color-danger-500,
+  color-danger-active: color-danger-600,
+  color-danger-disabled: color-basic-transparent-300,
+  color-danger-focus-border: color-danger-700,
+  color-danger-hover-border: color-danger-hover,
+  color-danger-default-border: color-danger-default,
+  color-danger-active-border: color-danger-active,
+  color-danger-disabled-border: color-danger-disabled,
+
+  color-danger-transparent-focus: color-danger-transparent-300,
+  color-danger-transparent-hover: color-danger-transparent-200,
+  color-danger-transparent-default: color-danger-transparent-100,
+  color-danger-transparent-active: color-danger-transparent-300,
+  color-danger-transparent-disabled: color-basic-transparent-200,
+  color-danger-transparent-focus-border: color-danger-500,
+  color-danger-transparent-hover-border: color-danger-500,
+  color-danger-transparent-default-border: color-danger-500,
+  color-danger-transparent-active-border: color-danger-500,
+  color-danger-transparent-disabled-border: color-basic-transparent-300,
+
+  color-control-focus: color-basic-300,
+  color-control-hover: color-basic-200,
+  color-control-default: color-basic-100,
+  color-control-active: color-basic-300,
+  color-control-disabled: color-basic-transparent-300,
+  color-control-focus-border: color-basic-500,
+  color-control-hover-border: color-control-hover,
+  color-control-default-border: color-control-default,
+  color-control-active-border: color-control-active,
+  color-control-disabled-border: color-control-disabled,
+
+  color-control-transparent-focus: color-basic-control-transparent-300,
+  color-control-transparent-hover: color-basic-control-transparent-200,
+  color-control-transparent-default: color-basic-control-transparent-100,
+  color-control-transparent-active: color-basic-control-transparent-300,
+  color-control-transparent-disabled: color-basic-transparent-200,
+  color-control-transparent-focus-border: color-basic-100,
+  color-control-transparent-hover-border: color-basic-100,
+  color-control-transparent-default-border: color-basic-100,
+  color-control-transparent-active-border: color-basic-100,
+  color-control-transparent-disabled-border: color-basic-transparent-300,
+
+  background-basic-color-1: color-basic-800,
+  background-basic-color-2: color-basic-900,
+  background-basic-color-3: color-basic-1000,
+  background-basic-color-4: color-basic-1100,
+
+  background-alternative-color-1: color-basic-100,
+  background-alternative-color-2: color-basic-200,
+  background-alternative-color-3: color-basic-300,
+  background-alternative-color-4: color-basic-400,
+
+  border-basic-color-1: color-basic-800,
+  border-basic-color-2: color-basic-900,
+  border-basic-color-3: color-basic-1000,
+  border-basic-color-4: color-basic-1100,
+  border-basic-color-5: color-basic-1100,
+
+  border-alternative-color-1: color-basic-100,
+  border-alternative-color-2: color-basic-200,
+  border-alternative-color-3: color-basic-300,
+  border-alternative-color-4: color-basic-400,
+  border-alternative-color-5: color-basic-500,
+
+  border-primary-color-1: color-primary-500,
+  border-primary-color-2: color-primary-600,
+  border-primary-color-3: color-primary-700,
+  border-primary-color-4: color-primary-800,
+  border-primary-color-5: color-primary-900,
+
+  border-success-color-1: color-success-500,
+  border-success-color-2: color-success-600,
+  border-success-color-3: color-success-700,
+  border-success-color-4: color-success-800,
+  border-success-color-5: color-success-900,
+
+  border-info-color-1: color-info-500,
+  border-info-color-2: color-info-600,
+  border-info-color-3: color-info-700,
+  border-info-color-4: color-info-800,
+  border-info-color-5: color-info-900,
+
+  border-warning-color-1: color-warning-500,
+  border-warning-color-2: color-warning-600,
+  border-warning-color-3: color-warning-700,
+  border-warning-color-4: color-warning-800,
+  border-warning-color-5: color-warning-900,
+
+  border-danger-color-1: color-danger-500,
+  border-danger-color-2: color-danger-600,
+  border-danger-color-3: color-danger-700,
+  border-danger-color-4: color-danger-800,
+  border-danger-color-5: color-danger-900,
+
+  text-basic-color: color-basic-100,
+  text-alternate-color: color-basic-900,
+  text-control-color: color-basic-100,
+  text-disabled-color: color-basic-transparent-600,
+  text-hint-color: color-basic-600,
+
+  text-primary-color: color-primary-default,
+  text-primary-focus-color: color-primary-focus,
+  text-primary-hover-color: color-primary-hover,
+  text-primary-active-color: color-primary-active,
+  text-primary-disabled-color: color-primary-400,
+
+  text-success-color: color-success-default,
+  text-success-focus-color: color-success-focus,
+  text-success-hover-color: color-success-hover,
+  text-success-active-color: color-success-active,
+  text-success-disabled-color: color-success-400,
+
+  text-info-color: color-info-default,
+  text-info-focus-color: color-info-focus,
+  text-info-hover-color: color-info-hover,
+  text-info-active-color: color-info-active,
+  text-info-disabled-color: color-info-400,
+
+  text-warning-color: color-warning-default,
+  text-warning-focus-color: color-warning-focus,
+  text-warning-hover-color: color-warning-hover,
+  text-warning-active-color: color-warning-active,
+  text-warning-disabled-color: color-warning-400,
+
+  text-danger-color: color-danger-default,
+  text-danger-focus-color: color-danger-focus,
+  text-danger-hover-color: color-danger-hover,
+  text-danger-active-color: color-danger-active,
+  text-danger-disabled-color: color-danger-400,
+
+  shadow: '0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2)',
+  outline-color: color-basic-700,
+
+  font-family-primary: unquote('Roboto, sans-serif')
+);
+
+$nb-themes: nb-register-theme($theme, material-dark, dark);
diff --git a/src/app/@theme/styles/_material-light.scss b/src/app/@theme/styles/_material-light.scss
new file mode 100644
index 00000000..6f677190
--- /dev/null
+++ b/src/app/@theme/styles/_material-light.scss
@@ -0,0 +1,370 @@
+/**
+ * @license
+ * Copyright Akveo. All Rights Reserved.
+ * Licensed under the MIT License. See License.txt in the project root for license information.
+ */
+
+@import '~@nebular/theme/styles/core/functions';
+@import '~@nebular/theme/styles/core/mixins';
+
+$theme: (
+  color-primary-100: #e8cbfe,
+  color-primary-200: #ce97fd,
+  color-primary-300: #ae63f9,
+  color-primary-400: #903df4,
+  color-primary-500: #6200ee,
+  color-primary-600: #4b00cc,
+  color-primary-700: #3800ab,
+  color-primary-800: #27008a,
+  color-primary-900: #1b0072,
+
+  color-primary-transparent-100: rgba(98, 0, 238, 0.08),
+  color-primary-transparent-200: rgba(98, 0, 238, 0.16),
+  color-primary-transparent-300: rgba(98, 0, 238, 0.24),
+  color-primary-transparent-400: rgba(98, 0, 238, 0.32),
+  color-primary-transparent-500: rgba(98, 0, 238, 0.4),
+  color-primary-transparent-600: rgba(98, 0, 238, 0.48),
+
+  color-success-100: #edfbd1,
+  color-success-200: #d7f7a6,
+  color-success-300: #b4e775,
+  color-success-400: #8fcf50,
+  color-success-500: #60af20,
+  color-success-600: #499617,
+  color-success-700: #357d10,
+  color-success-800: #24650a,
+  color-success-900: #175306,
+
+  color-success-transparent-100: rgba(96, 175, 32, 0.08),
+  color-success-transparent-200: rgba(96, 175, 32, 0.16),
+  color-success-transparent-300: rgba(96, 175, 32, 0.24),
+  color-success-transparent-400: rgba(96, 175, 32, 0.32),
+  color-success-transparent-500: rgba(96, 175, 32, 0.4),
+  color-success-transparent-600: rgba(96, 175, 32, 0.48),
+
+  color-info-100: #ccf7fe,
+  color-info-200: #99e9fd,
+  color-info-300: #66d3f9,
+  color-info-400: #40bbf4,
+  color-info-500: #0495ee,
+  color-info-600: #0273cc,
+  color-info-700: #0256ab,
+  color-info-800: #013d8a,
+  color-info-900: #002b72,
+
+  color-info-transparent-100: rgba(4, 149, 238, 0.08),
+  color-info-transparent-200: rgba(4, 149, 238, 0.16),
+  color-info-transparent-300: rgba(4, 149, 238, 0.24),
+  color-info-transparent-400: rgba(4, 149, 238, 0.32),
+  color-info-transparent-500: rgba(4, 149, 238, 0.4),
+  color-info-transparent-600: rgba(4, 149, 238, 0.48),
+
+  color-warning-100: #fff3cd,
+  color-warning-200: #ffe49b,
+  color-warning-300: #ffd169,
+  color-warning-400: #ffbe43,
+  color-warning-500: #ff9f05,
+  color-warning-600: #db8003,
+  color-warning-700: #b76302,
+  color-warning-800: #934a01,
+  color-warning-900: #7a3800,
+
+  color-warning-transparent-100: rgba(255, 159, 5, 0.08),
+  color-warning-transparent-200: rgba(255, 159, 5, 0.16),
+  color-warning-transparent-300: rgba(255, 159, 5, 0.24),
+  color-warning-transparent-400: rgba(255, 159, 5, 0.32),
+  color-warning-transparent-500: rgba(255, 159, 5, 0.4),
+  color-warning-transparent-600: rgba(255, 159, 5, 0.48),
+
+  color-danger-100: #fbd2c8,
+  color-danger-200: #f79e94,
+  color-danger-300: #e75d5c,
+  color-danger-400: #cf3341,
+  color-danger-500: #b00020,
+  color-danger-600: #970029,
+  color-danger-700: #7e002e,
+  color-danger-800: #66002f,
+  color-danger-900: #54002f,
+
+  color-danger-transparent-100: rgba(176, 0, 32, 0.08),
+  color-danger-transparent-200: rgba(176, 0, 32, 0.16),
+  color-danger-transparent-300: rgba(176, 0, 32, 0.24),
+  color-danger-transparent-400: rgba(176, 0, 32, 0.32),
+  color-danger-transparent-500: rgba(176, 0, 32, 0.4),
+  color-danger-transparent-600: rgba(176, 0, 32, 0.48),
+
+  color-basic-100: #ffffff,
+  color-basic-200: #f5f5f5,
+  color-basic-300: #ebebeb,
+  color-basic-400: #e0e0e0,
+  color-basic-500: #b3b3b3,
+  color-basic-600: #838383,
+  color-basic-700: #636363,
+  color-basic-800: #424242,
+  color-basic-900: #242424,
+  color-basic-1000: #1b1b1b,
+  color-basic-1100: #000000,
+
+  color-basic-transparent-100: rgba(131, 131, 131, 0.08),
+  color-basic-transparent-200: rgba(131, 131, 131, 0.16),
+  color-basic-transparent-300: rgba(131, 131, 131, 0.24),
+  color-basic-transparent-400: rgba(131, 131, 131, 0.32),
+  color-basic-transparent-500: rgba(131, 131, 131, 0.4),
+  color-basic-transparent-600: rgba(131, 131, 131, 0.48),
+
+  color-basic-control-transparent-100: rgba(255, 255, 255, 0.08),
+  color-basic-control-transparent-200: rgba(255, 255, 255, 0.16),
+  color-basic-control-transparent-300: rgba(255, 255, 255, 0.24),
+  color-basic-control-transparent-400: rgba(255, 255, 255, 0.32),
+  color-basic-control-transparent-500: rgba(255, 255, 255, 0.4),
+  color-basic-control-transparent-600: rgba(255, 255, 255, 0.48),
+
+  color-basic-focus: color-basic-400,
+  color-basic-hover: color-basic-200,
+  color-basic-default: color-basic-300,
+  color-basic-active: color-basic-400,
+  color-basic-disabled: color-basic-transparent-300,
+  color-basic-focus-border: color-basic-500,
+  color-basic-hover-border: color-basic-hover,
+  color-basic-default-border: color-basic-default,
+  color-basic-active-border: color-basic-active,
+  color-basic-disabled-border: color-basic-disabled,
+
+  color-basic-transparent-focus: color-basic-transparent-300,
+  color-basic-transparent-hover: color-basic-transparent-200,
+  color-basic-transparent-default: color-basic-transparent-100,
+  color-basic-transparent-active: color-basic-transparent-300,
+  color-basic-transparent-disabled: color-basic-transparent-200,
+  color-basic-transparent-focus-border: color-basic-500,
+  color-basic-transparent-hover-border: color-basic-500,
+  color-basic-transparent-default-border: color-basic-500,
+  color-basic-transparent-active-border: color-basic-500,
+  color-basic-transparent-disabled-border: color-basic-transparent-300,
+
+  color-primary-focus: color-primary-600,
+  color-primary-hover: color-primary-400,
+  color-primary-default: color-primary-500,
+  color-primary-active: color-primary-600,
+  color-primary-disabled: color-basic-transparent-300,
+  color-primary-focus-border: color-primary-700,
+  color-primary-hover-border: color-primary-hover,
+  color-primary-default-border: color-primary-default,
+  color-primary-active-border: color-primary-active,
+  color-primary-disabled-border: color-primary-disabled,
+
+  color-primary-transparent-focus: color-primary-transparent-300,
+  color-primary-transparent-hover: color-primary-transparent-200,
+  color-primary-transparent-default: color-primary-transparent-100,
+  color-primary-transparent-active: color-primary-transparent-300,
+  color-primary-transparent-disabled: color-basic-transparent-200,
+  color-primary-transparent-focus-border: color-primary-500,
+  color-primary-transparent-hover-border: color-primary-500,
+  color-primary-transparent-default-border: color-primary-500,
+  color-primary-transparent-active-border: color-primary-500,
+  color-primary-transparent-disabled-border: color-basic-transparent-300,
+
+  color-success-focus: color-success-600,
+  color-success-hover: color-success-400,
+  color-success-default: color-success-500,
+  color-success-active: color-success-600,
+  color-success-disabled: color-basic-transparent-300,
+  color-success-focus-border: color-success-700,
+  color-success-hover-border: color-success-hover,
+  color-success-default-border: color-success-default,
+  color-success-active-border: color-success-active,
+  color-success-disabled-border: color-success-disabled,
+
+  color-success-transparent-focus: color-success-transparent-300,
+  color-success-transparent-hover: color-success-transparent-200,
+  color-success-transparent-default: color-success-transparent-100,
+  color-success-transparent-active: color-success-transparent-300,
+  color-success-transparent-disabled: color-basic-transparent-200,
+  color-success-transparent-focus-border: color-success-500,
+  color-success-transparent-hover-border: color-success-500,
+  color-success-transparent-default-border: color-success-500,
+  color-success-transparent-active-border: color-success-500,
+  color-success-transparent-disabled-border: color-basic-transparent-300,
+
+  color-info-focus: color-info-600,
+  color-info-hover: color-info-400,
+  color-info-default: color-info-500,
+  color-info-active: color-info-600,
+  color-info-disabled: color-basic-transparent-300,
+  color-info-focus-border: color-info-700,
+  color-info-hover-border: color-info-hover,
+  color-info-default-border: color-info-default,
+  color-info-active-border: color-info-active,
+  color-info-disabled-border: color-info-disabled,
+
+  color-info-transparent-focus: color-info-transparent-300,
+  color-info-transparent-hover: color-info-transparent-200,
+  color-info-transparent-default: color-info-transparent-100,
+  color-info-transparent-active: color-info-transparent-300,
+  color-info-transparent-disabled: color-basic-transparent-200,
+  color-info-transparent-focus-border: color-info-500,
+  color-info-transparent-hover-border: color-info-500,
+  color-info-transparent-default-border: color-info-500,
+  color-info-transparent-active-border: color-info-500,
+  color-info-transparent-disabled-border: color-basic-transparent-300,
+
+  color-warning-focus: color-warning-600,
+  color-warning-hover: color-warning-400,
+  color-warning-default: color-warning-500,
+  color-warning-active: color-warning-600,
+  color-warning-disabled: color-basic-transparent-300,
+  color-warning-focus-border: color-warning-700,
+  color-warning-hover-border: color-warning-hover,
+  color-warning-default-border: color-warning-default,
+  color-warning-active-border: color-warning-active,
+  color-warning-disabled-border: color-warning-disabled,
+
+  color-warning-transparent-focus: color-warning-transparent-300,
+  color-warning-transparent-hover: color-warning-transparent-200,
+  color-warning-transparent-default: color-warning-transparent-100,
+  color-warning-transparent-active: color-warning-transparent-300,
+  color-warning-transparent-disabled: color-basic-transparent-200,
+  color-warning-transparent-focus-border: color-warning-500,
+  color-warning-transparent-hover-border: color-warning-500,
+  color-warning-transparent-default-border: color-warning-500,
+  color-warning-transparent-active-border: color-warning-500,
+  color-warning-transparent-disabled-border: color-basic-transparent-300,
+
+  color-danger-focus: color-danger-600,
+  color-danger-hover: color-danger-400,
+  color-danger-default: color-danger-500,
+  color-danger-active: color-danger-600,
+  color-danger-disabled: color-basic-transparent-300,
+  color-danger-focus-border: color-danger-700,
+  color-danger-hover-border: color-danger-hover,
+  color-danger-default-border: color-danger-default,
+  color-danger-active-border: color-danger-active,
+  color-danger-disabled-border: color-danger-disabled,
+
+  color-danger-transparent-focus: color-danger-transparent-300,
+  color-danger-transparent-hover: color-danger-transparent-200,
+  color-danger-transparent-default: color-danger-transparent-100,
+  color-danger-transparent-active: color-danger-transparent-300,
+  color-danger-transparent-disabled: color-basic-transparent-200,
+  color-danger-transparent-focus-border: color-danger-500,
+  color-danger-transparent-hover-border: color-danger-500,
+  color-danger-transparent-default-border: color-danger-500,
+  color-danger-transparent-active-border: color-danger-500,
+  color-danger-transparent-disabled-border: color-basic-transparent-300,
+
+  color-control-focus: color-basic-300,
+  color-control-hover: color-basic-200,
+  color-control-default: color-basic-100,
+  color-control-active: color-basic-300,
+  color-control-disabled: color-basic-transparent-300,
+  color-control-focus-border: color-basic-500,
+  color-control-hover-border: color-control-hover,
+  color-control-default-border: color-control-default,
+  color-control-active-border: color-control-active,
+  color-control-disabled-border: color-control-disabled,
+
+  color-control-transparent-focus: color-basic-control-transparent-300,
+  color-control-transparent-hover: color-basic-control-transparent-200,
+  color-control-transparent-default: color-basic-control-transparent-100,
+  color-control-transparent-active: color-basic-control-transparent-300,
+  color-control-transparent-disabled: color-basic-transparent-200,
+  color-control-transparent-focus-border: color-basic-100,
+  color-control-transparent-hover-border: color-basic-100,
+  color-control-transparent-default-border: color-basic-100,
+  color-control-transparent-active-border: color-basic-100,
+  color-control-transparent-disabled-border: color-basic-transparent-300,
+
+  background-basic-color-1: color-basic-100,
+  background-basic-color-2: color-basic-200,
+  background-basic-color-3: color-basic-300,
+  background-basic-color-4: color-basic-400,
+
+  background-alternative-color-1: color-basic-800,
+  background-alternative-color-2: color-basic-900,
+  background-alternative-color-3: color-basic-1000,
+  background-alternative-color-4: color-basic-1100,
+
+  border-basic-color-1: color-basic-100,
+  border-basic-color-2: color-basic-200,
+  border-basic-color-3: color-basic-300,
+  border-basic-color-4: color-basic-400,
+  border-basic-color-5: color-basic-500,
+
+  border-alternative-color-1: color-basic-800,
+  border-alternative-color-2: color-basic-900,
+  border-alternative-color-3: color-basic-1000,
+  border-alternative-color-4: color-basic-1100,
+  border-alternative-color-5: color-basic-1100,
+
+  border-primary-color-1: color-primary-500,
+  border-primary-color-2: color-primary-600,
+  border-primary-color-3: color-primary-700,
+  border-primary-color-4: color-primary-800,
+  border-primary-color-5: color-primary-900,
+
+  border-success-color-1: color-success-500,
+  border-success-color-2: color-success-600,
+  border-success-color-3: color-success-700,
+  border-success-color-4: color-success-800,
+  border-success-color-5: color-success-900,
+
+  border-info-color-1: color-info-500,
+  border-info-color-2: color-info-600,
+  border-info-color-3: color-info-700,
+  border-info-color-4: color-info-800,
+  border-info-color-5: color-info-900,
+
+  border-warning-color-1: color-warning-500,
+  border-warning-color-2: color-warning-600,
+  border-warning-color-3: color-warning-700,
+  border-warning-color-4: color-warning-800,
+  border-warning-color-5: color-warning-900,
+
+  border-danger-color-1: color-danger-500,
+  border-danger-color-2: color-danger-600,
+  border-danger-color-3: color-danger-700,
+  border-danger-color-4: color-danger-800,
+  border-danger-color-5: color-danger-900,
+
+  text-basic-color: color-basic-800,
+  text-alternate-color: color-basic-100,
+  text-control-color: color-basic-100,
+  text-disabled-color: color-basic-transparent-600,
+  text-hint-color: color-basic-600,
+
+  text-primary-color: color-primary-default,
+  text-primary-focus-color: color-primary-focus,
+  text-primary-hover-color: color-primary-hover,
+  text-primary-active-color: color-primary-active,
+  text-primary-disabled-color: color-primary-400,
+
+  text-success-color: color-success-default,
+  text-success-focus-color: color-success-focus,
+  text-success-hover-color: color-success-hover,
+  text-success-active-color: color-success-active,
+  text-success-disabled-color: color-success-400,
+
+  text-info-color: color-info-default,
+  text-info-focus-color: color-info-focus,
+  text-info-hover-color: color-info-hover,
+  text-info-active-color: color-info-active,
+  text-info-disabled-color: color-info-400,
+
+  text-warning-color: color-warning-default,
+  text-warning-focus-color: color-warning-focus,
+  text-warning-hover-color: color-warning-hover,
+  text-warning-active-color: color-warning-active,
+  text-warning-disabled-color: color-warning-400,
+
+  text-danger-color: color-danger-default,
+  text-danger-focus-color: color-danger-focus,
+  text-danger-hover-color: color-danger-hover,
+  text-danger-active-color: color-danger-active,
+  text-danger-disabled-color: color-danger-400,
+
+  shadow: '0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2)',
+  outline-color: color-basic-transparent-200,
+
+  font-family-primary: unquote('Roboto, sans-serif')
+);
+
+$nb-themes: nb-register-theme($theme, material-light, default);
diff --git a/src/app/@theme/styles/theme.material-dark.ts b/src/app/@theme/styles/theme.material-dark.ts
index 1837e05f..bd4f19f2 100644
--- a/src/app/@theme/styles/theme.material-dark.ts
+++ b/src/app/@theme/styles/theme.material-dark.ts
@@ -1,4 +1,51 @@
-import { NbJSThemeOptions, MATERIAL_DARK_THEME as baseTheme } from '@nebular/theme';
+import { NbJSThemeOptions } from '@nebular/theme';
+
+const palette = {
+  primary: '#e91d63',
+  success: '#60af20',
+  info: '#0495ee',
+  warning: '#ff9f05',
+  danger: '#b00020',
+};
+
+export const baseTheme: NbJSThemeOptions = {
+  name: 'material-dark',
+  base: 'dark',
+  variables: {
+    fontMain: 'Roboto, sans-serif',
+    fontSecondary: 'Roboto, sans-serif',
+
+    bg: '#383838',
+    bg2: '#292929',
+    bg3: '#1f1f1f',
+    bg4: '#141414',
+
+    border: '#383838',
+    border2: '#292929',
+    border3: '#1f1f1f',
+    border4: '#141414',
+    border5: '#141414',
+
+    fg: '#808080',
+    fgHeading: '#1a2138', // ?
+    fgText: '#1a2138', // ?
+    fgHighlight: palette.primary,
+    layoutBg: '#1f1f1f',
+    separator: '#1f1f1f',
+
+    primary: palette.primary,
+    success: palette.success,
+    info: palette.info,
+    warning: palette.warning,
+    danger: palette.danger,
+
+    primaryLight: '#f24681',
+    successLight: '#8fcf50',
+    infoLight: '#40bbf4',
+    warningLight: '#ffbe43',
+    dangerLight: '#cf3341',
+  },
+};
 
 const baseThemeVariables = baseTheme.variables;
 
diff --git a/src/app/@theme/styles/theme.material-light.ts b/src/app/@theme/styles/theme.material-light.ts
index 0a335674..a2a97a1a 100644
--- a/src/app/@theme/styles/theme.material-light.ts
+++ b/src/app/@theme/styles/theme.material-light.ts
@@ -1,4 +1,51 @@
-import { NbJSThemeOptions, MATERIAL_LIGHT_THEME as baseTheme } from '@nebular/theme';
+import { NbJSThemeOptions } from '@nebular/theme';
+
+const palette = {
+  primary: '#6200ee',
+  success: '#60af20',
+  info: '#0495ee',
+  warning: '#ff9f05',
+  danger: '#b00020',
+};
+
+export const baseTheme: NbJSThemeOptions = {
+  name: 'material-light',
+  base: 'default',
+  variables: {
+    fontMain: 'Roboto, sans-serif',
+    fontSecondary: 'Roboto, sans-serif',
+
+    bg: '#ffffff',
+    bg2: '#f5f5f5',
+    bg3: '#ebebeb',
+    bg4: '#e0e0e0',
+
+    border: '#ffffff',
+    border2: '#f5f5f5',
+    border3: '#ebebeb',
+    border4: '#e0e0e0',
+    border5: '#b3b3b3',
+
+    fg: '#838383',
+    fgHeading: '#1a2138', // ?
+    fgText: '#1a2138', // ?
+    fgHighlight: palette.primary,
+    layoutBg: '#ebebeb',
+    separator: '#ebebeb',
+
+    primary: palette.primary,
+    success: palette.success,
+    info: palette.info,
+    warning: palette.warning,
+    danger: palette.danger,
+
+    primaryLight: '#903df4',
+    successLight: '#8fcf50',
+    infoLight: '#40bbf4',
+    warningLight: '#ffbe43',
+    dangerLight: '#cf3341',
+  },
+};
 
 const baseThemeVariables = baseTheme.variables;
 
diff --git a/src/app/@theme/styles/themes.scss b/src/app/@theme/styles/themes.scss
index 65ac9946..6e60d197 100644
--- a/src/app/@theme/styles/themes.scss
+++ b/src/app/@theme/styles/themes.scss
@@ -2,6 +2,9 @@
 @import '~@nebular/theme/styles/theming';
 // @nebular out of the box themes
 @import '~@nebular/theme/styles/themes';
+// material themes
+@import './material-dark';
+@import './material-light';
 
 $nb-themes: nb-register-theme((
   layout-padding-top: 2.25rem,