diff --git a/app/modules/web/themes/material-dark/css/LICENSE b/app/modules/web/themes/material-dark/css/LICENSE
new file mode 100644
index 000000000..9faf10865
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/LICENSE
@@ -0,0 +1,212 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright 2015 Google Inc
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
+
+   All code in any directories or sub-directories that end with *.html or
+   *.css is licensed under the Creative Commons Attribution International
+   4.0 License, which full text can be found here:
+   https://creativecommons.org/licenses/by/4.0/legalcode.
+
+   As an exception to this license, all html or css that is generated by
+   the software at the direction of the user is copyright the user. The
+   user has full ownership and control over such content, including
+   whether and how they wish to license it.
diff --git a/app/modules/web/themes/material-dark/css/Roboto_300.woff2 b/app/modules/web/themes/material-dark/css/Roboto_300.woff2
new file mode 100644
index 000000000..c34c12806
Binary files /dev/null and b/app/modules/web/themes/material-dark/css/Roboto_300.woff2 differ
diff --git a/app/modules/web/themes/material-dark/css/Roboto_400.woff2 b/app/modules/web/themes/material-dark/css/Roboto_400.woff2
new file mode 100644
index 000000000..120796bb7
Binary files /dev/null and b/app/modules/web/themes/material-dark/css/Roboto_400.woff2 differ
diff --git a/app/modules/web/themes/material-dark/css/Roboto_500.woff2 b/app/modules/web/themes/material-dark/css/Roboto_500.woff2
new file mode 100644
index 000000000..5f96609d8
Binary files /dev/null and b/app/modules/web/themes/material-dark/css/Roboto_500.woff2 differ
diff --git a/app/modules/web/themes/material-dark/css/Roboto_600.woff2 b/app/modules/web/themes/material-dark/css/Roboto_600.woff2
new file mode 100644
index 000000000..11cde5d04
Binary files /dev/null and b/app/modules/web/themes/material-dark/css/Roboto_600.woff2 differ
diff --git a/app/modules/web/themes/material-dark/css/_base.scss b/app/modules/web/themes/material-dark/css/_base.scss
new file mode 100644
index 000000000..9bb336fb1
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/_base.scss
@@ -0,0 +1,92 @@
+$font-stack: "Roboto Regular", Verdana, Tahoma, sans-serif;
+$font-stack-mono: Consolas, "Andale Mono WT", "Andale Mono", "Bitstream Vera Sans Mono", "Nimbus Mono L", Monaco, "Courier New", monospace;
+$color-teal-bg: #e0f2f1;
+$color-teal-fg: #26a69a;
+$color-red-bg: #ffebee;
+$color-red-fg: #ef5350;
+$color-amber-bg: #fff8e1;
+$color-amber-fg: #ffca28;
+$color-indigo-bg: #e8eaf6;
+$color-indigo-fg: #5c6bc0;
+$color-indigo-fg-accent: #536dfe;
+$color-bluegrey-bg: #eceff1;
+$color-bluegrey-fg: #607d8b;
+$color-blue-bg: #e3f2fd;
+$color-blue-fg: #2196f3;
+$color-grey: #555;
+$public-path: 'public';
+
+@mixin box-shadow() {
+  -webkit-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+  -moz-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.14);
+}
+
+@mixin box-shadow-top() {
+  -webkit-box-shadow: 0 -3px 2px -2px rgba(0, 0, 0, 0.14);
+  -moz-box-shadow: 0 -3px 2px -2px rgba(0, 0, 0, 0.14);
+  box-shadow: 0 -3px 2px -2px rgba(0, 0, 0, 0.14);
+}
+
+@mixin box-shadow-top-white() {
+  -webkit-box-shadow: 0 -3px 2px -2px rgba(255, 255, 255, 0.25);
+  -moz-box-shadow: 0 -3px 2px -2px rgba(255, 255, 255, 0.25);
+  box-shadow: 0 -3px 2px -2px rgba(255, 255, 255, 0.25);
+}
+
+@mixin shadow-full() {
+  -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
+  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
+}
+
+@mixin border-radius($radius) {
+  border-radius: $radius !important;
+  -moz-border-radius: $radius !important;
+  -webkit-border-radius: $radius !important;
+}
+
+@mixin color-red() {
+  color: $color-red-fg;
+  background-color: $color-red-bg;
+  border: 1px solid $color-red-fg;
+}
+
+@mixin color-teal() {
+  color: $color-teal-fg;
+  background-color: $color-teal-bg;
+  border: 1px solid $color-teal-fg;
+}
+
+@mixin color-amber() {
+  color: $color-amber-fg;
+  background-color: $color-amber-bg;
+  border: 1px solid $color-amber-fg;
+}
+
+@mixin color-blue() {
+  color: $color-blue-fg;
+  background-color: $color-blue-bg;
+  border: 1px solid $color-blue-fg;
+}
+
+@mixin fit-ccntent() {
+  width: -webkit-min-content;
+  width: -moz-min-content;
+  width: min-content;
+}
+
+@mixin flexbox() {
+  display: -webkit-box;
+  display: -moz-box;
+  display: -ms-flexbox;
+  display: -webkit-flex;
+  display: flex;
+}
+
+@mixin flex($values) {
+  -webkit-box-flex: $values;
+  -moz-box-flex:  $values;
+  -webkit-flex:  $values;
+  -ms-flex:  $values;
+  flex:  $values;
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/_elements.scss b/app/modules/web/themes/material-dark/css/_elements.scss
new file mode 100644
index 000000000..6ce9a5ebc
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/_elements.scss
@@ -0,0 +1,148 @@
+html, body {
+  margin: 0;
+  padding: 0;
+  text-align: left;
+  background-color: #f5f5f5;
+  color: #555;
+  font-size: 12px;
+  font-weight: normal;
+  box-sizing: border-box;
+  max-width: 100%;
+}
+
+* {
+  font-family: $font-stack;
+  box-sizing: inherit;
+  &:before, &:after {
+    box-sizing: inherit;
+  }
+}
+
+table {
+  font-size: 11px;
+  border-spacing: 0;
+  th {
+    border-bottom: 2px solid transparent;
+    vertical-align: middle;
+    .icon {
+      width: 24px;
+      height: 24px;
+    }
+  }
+  tr {
+    &.odd {
+      background-color: #f9f9f9;
+    }
+    &.even > td, &.odd > td {
+      border-bottom: 1px solid #d9d9d9 !important;
+    }
+    &.even:hover, &.odd:hover {
+      background-color: #e8ff99;
+    }
+    height: 20px;
+  }
+  td {
+    padding: 3px;
+    &.txtCliente {
+      font-weight: bold;
+      text-align: center;
+    }
+  }
+}
+
+form {
+  font-size: 11px;
+  margin: 0;
+}
+
+input.inputImg, img.inputImg {
+  background-color: transparent !important;
+  width: 24px !important;
+  height: 24px !important;
+  border: 0;
+  vertical-align: middle;
+  margin: 0 0.5em;
+}
+
+input {
+  &.txtFile {
+    width: 200px;
+  }
+  &.txtLong {
+    width: 300px;
+  }
+}
+
+textarea {
+  width: 350px;
+}
+
+select.files {
+  width: 250px;
+}
+
+input.spinner {
+  width: 5em;
+}
+
+img {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  cursor: pointer;
+  &.inputImgMini {
+    background-color: transparent !important;
+    width: 16px !important;
+    height: 16px !important;
+    margin: 0 5px 0 5px;
+    border: 0;
+    vertical-align: middle;
+  }
+}
+
+i {
+  cursor: pointer;
+}
+
+form .form-field {
+  display: flex;
+  justify-content: space-between;
+  > {
+    label {
+      min-width: 12em;
+      padding: .5em 0;
+      font-size: 16px;
+      align-self: center;
+    }
+    div {
+      width: 100%;
+      align-self: center;
+    }
+  }
+}
+
+a {
+  text-decoration: none;
+  color: $color-indigo-fg-accent;
+  &:visited {
+    text-decoration: none;
+    color: $color-indigo-fg-accent;
+  }
+  &:hover, &:active, &:focus {
+    text-decoration: none;
+    /*color: rgba(83, 109, 254, .6);*/
+    cursor: pointer;
+  }
+}
+
+pre, code, samp, kbd {
+  font-family: $font-stack-mono;
+  font-size: 1em;
+  direction: ltr;
+  text-align: left;
+  background-color: #fbfaf9;
+  color: #333;
+  box-shadow: inset 0 0 .3em #ccc;
+  border-radius: 2px;
+}
+
diff --git a/app/modules/web/themes/material-dark/css/_login.scss b/app/modules/web/themes/material-dark/css/_login.scss
new file mode 100644
index 000000000..0877a68db
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/_login.scss
@@ -0,0 +1,75 @@
+#box-pub-noheader {
+  #box-login {
+    position: relative;
+    min-height: 14em;
+    #box-buttons {
+      position: absolute;
+      top: 2em;
+      right: 2em;
+    }
+    #box-actions {
+      width: 100%;
+      text-align: right;
+      a {
+        color: #c9c9c9;
+      }
+    }
+  }
+  #box-updated {
+    width: 350px;
+    margin: 3em auto;
+    font-size: 14px;
+    text-align: center;
+    padding: 0.5em;
+    @include color-teal();
+  }
+  #demo-info {
+    padding: .5em;
+    margin: 3em auto 0 auto;
+    color: #c9c9c9;
+    border-top: 1px solid #d9d9d9;
+    border-bottom: 1px solid #d9d9d9;
+    ul {
+      display: flex;
+      justify-content: space-around;
+      list-style: none;
+      li {
+        > span {
+          padding: 0 1em;
+        }
+      }
+    }
+  }
+}
+
+@media screen and (max-width: 600px) {
+  #box-pub-noheader {
+    #box-login {
+      #box-buttons {
+        position: relative;
+        top: 0;
+        right: 0;
+        text-align: right;
+      }
+      #box-actions {
+        margin-top: 1em;
+      }
+    }
+    #demo-info {
+      ul {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        list-style: none;
+        li {
+          width: 11em;
+          text-align: left;
+          > span {
+            padding: 0 1em;
+          }
+        }
+      }
+    }
+  }
+}
+
diff --git a/app/modules/web/themes/material-dark/css/_noheader.scss b/app/modules/web/themes/material-dark/css/_noheader.scss
new file mode 100644
index 000000000..e2b0fb71e
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/_noheader.scss
@@ -0,0 +1,99 @@
+@mixin background-logo-outline() {
+  background: transparent url($public-path + "/images/logo_full_nobg_outline.png") no-repeat top center;
+  background-size: 75% auto;
+}
+
+body.login,
+body.logout,
+body.userpassreset {
+  background: $color-bluegrey-fg;
+  #wrap {
+    background: transparent;
+  }
+  #container {
+    padding-top: 5%;
+  }
+  footer {
+    background: #78909C;
+    a {
+      color: #f2f2f2;
+    }
+  }
+}
+
+#box-pub-noheader {
+  @include background-logo-outline;
+  width: 40em;
+  min-height: 20em;
+  margin: 0 auto;
+  > div {
+    width: 100%;
+    padding: 1em;
+    margin: 0 auto;
+  }
+  .box-spacer {
+    height: 15em;
+    background-color: transparent;
+  }
+  .box-header {
+    width: 100%;
+    color: #f2f2f2;
+    font-size: 16px;
+    font-weight: bold;
+    text-align: center;
+    margin: 1em 0;
+    letter-spacing: .1em;
+    padding: 0.2em 0;
+  }
+  .box-form {
+    @include shadow-full();
+    background-color: #f2f2f2;
+    form {
+      fieldset#box-data {
+        height: 100%;
+        min-height: 14em;
+        text-align: left;
+        background-color: transparent;
+        legend {
+          width: 100%;
+          color: $color-bluegrey-fg;
+          font-size: 14px;
+          font-weight: bold;
+          text-align: center;
+          margin: 1em 0;
+          letter-spacing: .1em;
+          padding: 0.2em 0;
+        }
+        .form-control > i {
+          margin-right: .5em;
+          opacity: .5;
+        }
+        .extra-hidden {
+          display: none;
+        }
+        margin-bottom: 2em;
+      }
+    }
+    div#box-buttons {
+      margin-top: 2em;
+      text-align: center;
+    }
+  }
+}
+
+@media screen and (max-width: 600px) {
+  #box-pub-noheader {
+    width: 25em;
+    .box-spacer {
+      height: 10em;
+    }
+    form {
+      fieldset#box-data {
+        .mdl-textfield {
+          width: 100%;
+        }
+      }
+    }
+  }
+}
+
diff --git a/app/modules/web/themes/material-dark/css/fonts.css b/app/modules/web/themes/material-dark/css/fonts.css
new file mode 100644
index 000000000..7f82ff0db
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/fonts.css
@@ -0,0 +1,26 @@
+/* Fuente Roboto */
+@font-face {
+    font-family: 'Roboto Light';
+    font-style: normal;
+    font-weight: 300;
+    src: local('Roboto Light'), local('Roboto-Light'), url('app/modules/web/themes/material-blue/css/Roboto_300.woff2') format('woff2');
+}
+@font-face {
+    font-family: 'Roboto Regular';
+    font-style: normal;
+    font-weight: 400;
+    /*src: local('Roboto'), local('Roboto-Regular'), url('app/modules/web/themes/material-blue/css/Roboto_400.woff2') format('woff2');*/
+    src: url('app/modules/web/themes/material-blue/css/Roboto_400.woff2') format('woff2');
+}
+@font-face {
+    font-family: 'Roboto Medium';
+    font-style: normal;
+    font-weight: 500;
+    src: local('Roboto Medium'), local('Roboto-Medium'), url('app/modules/web/themes/material-blue/css/Roboto_500.woff2') format('woff2');
+}
+@font-face {
+    font-family: 'Roboto Bold';
+    font-style: normal;
+    font-weight: 700;
+    src: local('Roboto Bold'), local('Roboto-Bold'), url('app/modules/web/themes/material-blue/css/Roboto_600.woff2') format('woff2');
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/fonts.min.css b/app/modules/web/themes/material-dark/css/fonts.min.css
new file mode 100644
index 000000000..530b2ba00
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/fonts.min.css
@@ -0,0 +1,27 @@
+@font-face {
+    font-family: 'Roboto Light';
+    font-style: normal;
+    font-weight: 300;
+    src: local('Roboto Light'), local('Roboto-Light'), url('app/modules/web/themes/material-blue/css/Roboto_300.woff2') format('woff2')
+}
+
+@font-face {
+    font-family: 'Roboto Regular';
+    font-style: normal;
+    font-weight: 400;
+    src: url('app/modules/web/themes/material-blue/css/Roboto_400.woff2') format('woff2')
+}
+
+@font-face {
+    font-family: 'Roboto Medium';
+    font-style: normal;
+    font-weight: 500;
+    src: local('Roboto Medium'), local('Roboto-Medium'), url('app/modules/web/themes/material-blue/css/Roboto_500.woff2') format('woff2')
+}
+
+@font-face {
+    font-family: 'Roboto Bold';
+    font-style: normal;
+    font-weight: 700;
+    src: local('Roboto Bold'), local('Roboto-Bold'), url('app/modules/web/themes/material-blue/css/Roboto_600.woff2') format('woff2')
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/material-custom.css b/app/modules/web/themes/material-dark/css/material-custom.css
new file mode 100644
index 000000000..a8044247d
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/material-custom.css
@@ -0,0 +1,192 @@
+/* Personalización de MDL */
+.mdl-button {
+    margin: 0 .3em;
+}
+
+.fg-blue20 {
+    color: rgba(83, 109, 254, .2)
+}
+
+.fg-blue40 {
+    color: rgba(83, 109, 254, .4)
+}
+
+.fg-blue60 {
+    color: rgba(83, 109, 254, .6)
+}
+
+.fg-blue80 {
+    color: rgba(83, 109, 254, .8)
+}
+
+.fg-blue100 {
+    color: rgb(83, 109, 254)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue20 {
+    background-color: rgba(83, 109, 254, .2)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue40 {
+    background-color: rgba(83, 109, 254, .4)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue60 {
+    background-color: rgba(83, 109, 254, .6)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue80 {
+    background-color: rgba(83, 109, 254, .8)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue100 {
+    background-color: rgb(83, 109, 254)
+}
+
+.fg-orange20 {
+    color: rgba(255, 193, 7, .2)
+}
+
+.fg-orange40 {
+    color: rgba(255, 193, 7, .4)
+}
+
+.fg-orange60 {
+    color: rgba(255, 193, 7, .6)
+}
+
+.fg-orange80 {
+    color: rgba(255, 193, 7, .8)
+}
+
+.fg-orange100 {
+    color: rgba(255, 193, 7, 1)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange20 {
+    background-color: rgba(255, 193, 7, .2)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange40 {
+    background-color: rgba(255, 193, 7, .4)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange60 {
+    background-color: rgba(255, 193, 7, .6)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange80 {
+    background-color: rgba(255, 193, 7, .8)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange100 {
+    background-color: rgba(255, 193, 7, 1)
+}
+
+.fg-red20 {
+    color: rgba(244, 67, 54, .2)
+}
+
+.fg-red40 {
+    color: rgba(244, 67, 54, .4)
+}
+
+.fg-red60 {
+    color: rgba(244, 67, 54, .6)
+}
+
+.fg-red80 {
+    color: rgba(244, 67, 54, .8)
+}
+
+.fg-red100 {
+    color: rgb(244, 67, 54)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red20 {
+    background-color: rgba(244, 67, 54, .2)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red40 {
+    background-color: rgba(244, 67, 54, .4)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red60 {
+    background-color: rgba(244, 67, 54, .6)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red80 {
+    background-color: rgba(244, 67, 54, .8)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red100 {
+    background-color: rgb(244, 67, 54)
+}
+
+.fg-green20 {
+    color: rgba(0, 150, 136, .2)
+}
+
+.fg-green40 {
+    color: rgba(0, 150, 136, .4)
+}
+
+.fg-green60 {
+    color: rgba(0, 150, 136, .6)
+}
+
+.fg-green80 {
+    color: rgba(0, 150, 136, .8)
+}
+
+.fg-green100 {
+    color: rgb(0, 150, 136)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green20 {
+    background-color: rgba(0, 150, 136, 0.2)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green40 {
+    background-color: rgba(0, 150, 136, 0.4)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green60 {
+    background-color: rgba(0, 150, 136, .6)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green80 {
+    background-color: rgba(0, 150, 136, .8)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green100 {
+    background-color: rgb(0, 150, 136)
+}
+
+.mdl-tooltip {
+    text-align: justify;
+    max-width: 400px;
+}
+
+.mdl-switch--inline {
+    display: inline;
+    margin: 0 1em;
+}
+
+label.mdl-switch {
+    margin: .5em 0;
+}
+
+.mdl-switch__box {
+    width: 48px;
+}
+
+.mdl-list__item--two-line {
+    height: auto;
+    min-height: 72px;
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content {
+    height: auto;
+    min-height: 36px;
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/material-custom.min.css b/app/modules/web/themes/material-dark/css/material-custom.min.css
new file mode 100644
index 000000000..ff0343505
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/material-custom.min.css
@@ -0,0 +1,191 @@
+.mdl-button {
+    margin: 0 .3em
+}
+
+.fg-blue20 {
+    color: rgba(83, 109, 254, .2)
+}
+
+.fg-blue40 {
+    color: rgba(83, 109, 254, .4)
+}
+
+.fg-blue60 {
+    color: rgba(83, 109, 254, .6)
+}
+
+.fg-blue80 {
+    color: rgba(83, 109, 254, .8)
+}
+
+.fg-blue100 {
+    color: #536dfe
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue20 {
+    background-color: rgba(83, 109, 254, .2)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue40 {
+    background-color: rgba(83, 109, 254, .4)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue60 {
+    background-color: rgba(83, 109, 254, .6)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue80 {
+    background-color: rgba(83, 109, 254, .8)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-blue100 {
+    background-color: #536dfe
+}
+
+.fg-orange20 {
+    color: rgba(255, 193, 7, .2)
+}
+
+.fg-orange40 {
+    color: rgba(255, 193, 7, .4)
+}
+
+.fg-orange60 {
+    color: rgba(255, 193, 7, .6)
+}
+
+.fg-orange80 {
+    color: rgba(255, 193, 7, .8)
+}
+
+.fg-orange100 {
+    color: rgba(255, 193, 7, 1)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange20 {
+    background-color: rgba(255, 193, 7, .2)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange40 {
+    background-color: rgba(255, 193, 7, .4)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange60 {
+    background-color: rgba(255, 193, 7, .6)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange80 {
+    background-color: rgba(255, 193, 7, .8)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-orange100 {
+    background-color: rgba(255, 193, 7, 1)
+}
+
+.fg-red20 {
+    color: rgba(244, 67, 54, .2)
+}
+
+.fg-red40 {
+    color: rgba(244, 67, 54, .4)
+}
+
+.fg-red60 {
+    color: rgba(244, 67, 54, .6)
+}
+
+.fg-red80 {
+    color: rgba(244, 67, 54, .8)
+}
+
+.fg-red100 {
+    color: #f44336
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red20 {
+    background-color: rgba(244, 67, 54, .2)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red40 {
+    background-color: rgba(244, 67, 54, .4)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red60 {
+    background-color: rgba(244, 67, 54, .6)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red80 {
+    background-color: rgba(244, 67, 54, .8)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-red100 {
+    background-color: #f44336
+}
+
+.fg-green20 {
+    color: rgba(0, 150, 136, .2)
+}
+
+.fg-green40 {
+    color: rgba(0, 150, 136, .4)
+}
+
+.fg-green60 {
+    color: rgba(0, 150, 136, .6)
+}
+
+.fg-green80 {
+    color: rgba(0, 150, 136, .8)
+}
+
+.fg-green100 {
+    color: #009688
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green20 {
+    background-color: rgba(0, 150, 136, 0.2)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green40 {
+    background-color: rgba(0, 150, 136, 0.4)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green60 {
+    background-color: rgba(0, 150, 136, .6)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green80 {
+    background-color: rgba(0, 150, 136, .8)
+}
+
+.mdl-button--fab.mdl-button--colored.bg-green100 {
+    background-color: #009688
+}
+
+.mdl-tooltip {
+    text-align: justify;
+    max-width: 400px
+}
+
+.mdl-switch--inline {
+    display: inline;
+    margin: 0 1em
+}
+
+label.mdl-switch {
+    margin: .5em 0
+}
+
+.mdl-switch__box {
+    width: 48px
+}
+
+.mdl-list__item--two-line {
+    height: auto;
+    min-height: 72px
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content {
+    height: auto;
+    min-height: 36px
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/material.min.css b/app/modules/web/themes/material-dark/css/material.min.css
new file mode 100644
index 000000000..b3566fb39
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/material.min.css
@@ -0,0 +1,7783 @@
+/**
+ * material-design-lite - Material Design Components in CSS, JS and HTML
+ * @version v1.2.0
+ * @license Apache-2.0
+ * @copyright 2015 Google, Inc.
+ * @link https://github.com/google/material-design-lite
+ */
+
+@charset "UTF-8";
+html {
+    color: rgba(0, 0, 0, .87)
+}
+
+::-moz-selection {
+    background: #b3d4fc;
+    text-shadow: none
+}
+
+::selection {
+    background: #b3d4fc;
+    text-shadow: none
+}
+
+hr {
+    display: block;
+    height: 1px;
+    border: 0;
+    border-top: 1px solid #ccc;
+    margin: 1em 0;
+    padding: 0
+}
+
+audio,
+canvas,
+iframe,
+img,
+svg,
+video {
+    vertical-align: middle
+}
+
+fieldset {
+    border: 0;
+    margin: 0;
+    padding: 0
+}
+
+textarea {
+    resize: vertical
+}
+
+.browserupgrade {
+    margin: .2em 0;
+    background: #ccc;
+    color: #000;
+    padding: .2em 0
+}
+
+.hidden {
+    display: none!important
+}
+
+.visuallyhidden {
+    border: 0;
+    clip: rect(0 0 0 0);
+    height: 1px;
+    margin: -1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px
+}
+
+.visuallyhidden.focusable:active,
+.visuallyhidden.focusable:focus {
+    clip: auto;
+    height: auto;
+    margin: 0;
+    overflow: visible;
+    position: static;
+    width: auto
+}
+
+.invisible {
+    visibility: hidden
+}
+
+.clearfix:before,
+.clearfix:after {
+    content: " ";
+    display: table
+}
+
+.clearfix:after {
+    clear: both
+}
+
+@media print {
+    *,
+    *:before,
+    *:after,
+    *:first-letter {
+        background: transparent!important;
+        color: #000!important;
+        box-shadow: none!important
+    }
+    a,
+    a:visited {
+        text-decoration: underline
+    }
+    a[href]:after {
+        content: " (" attr(href)")"
+    }
+    abbr[title]:after {
+        content: " (" attr(title)")"
+    }
+    a[href^="#"]:after,
+    a[href^="javascript:"]:after {
+        content: ""
+    }
+    pre,
+    blockquote {
+        border: 1px solid #999;
+        page-break-inside: avoid
+    }
+    thead {
+        display: table-header-group
+    }
+    tr,
+    img {
+        page-break-inside: avoid
+    }
+    img {
+        max-width: 100%!important
+    }
+    p,
+    h2,
+    h3 {
+        orphans: 3;
+        widows: 3
+    }
+    h2,
+    h3 {
+        page-break-after: avoid
+    }
+}
+
+a,
+.mdl-accordion,
+.mdl-button,
+.mdl-card,
+.mdl-checkbox,
+.mdl-dropdown-menu,
+.mdl-icon-toggle,
+.mdl-item,
+.mdl-radio,
+.mdl-slider,
+.mdl-switch,
+.mdl-tabs__tab {
+    -webkit-tap-highlight-color: transparent;
+    -webkit-tap-highlight-color: rgba(255, 255, 255, 0)
+}
+
+html {
+    width: 100%;
+    height: 100%;
+    -ms-touch-action: manipulation;
+    touch-action: manipulation
+}
+
+body {
+    width: 100%;
+    min-height: 100%
+}
+
+main {
+    display: block
+}
+
+*[hidden] {
+    display: none!important
+}
+
+html,
+body {
+    font-family: "Helvetica", "Arial", sans-serif;
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 20px
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p {
+    padding: 0
+}
+
+h1 small,
+h2 small,
+h3 small,
+h4 small,
+h5 small,
+h6 small {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-weight: 400;
+    line-height: 1.35;
+    letter-spacing: -.02em;
+    opacity: .54;
+    font-size: .6em
+}
+
+h1 {
+    font-size: 56px;
+    line-height: 1.35;
+    letter-spacing: -.02em;
+    margin: 24px 0
+}
+
+h1,
+h2 {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-weight: 400
+}
+
+h2 {
+    font-size: 45px;
+    line-height: 48px
+}
+
+h2,
+h3 {
+    margin: 24px 0
+}
+
+h3 {
+    font-size: 34px;
+    line-height: 40px
+}
+
+h3,
+h4 {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-weight: 400
+}
+
+h4 {
+    font-size: 24px;
+    line-height: 32px;
+    -moz-osx-font-smoothing: grayscale;
+    margin: 24px 0 16px
+}
+
+h5 {
+    font-size: 20px;
+    font-weight: 500;
+    line-height: 1;
+    letter-spacing: .02em
+}
+
+h5,
+h6 {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    margin: 24px 0 16px
+}
+
+h6 {
+    font-size: 16px;
+    letter-spacing: .04em
+}
+
+h6,
+p {
+    font-weight: 400;
+    line-height: 24px
+}
+
+p {
+    font-size: 14px;
+    letter-spacing: 0;
+    margin: 0 0 16px
+}
+
+a {
+    color: rgb(83, 109, 254);
+    font-weight: 500
+}
+
+blockquote {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    position: relative;
+    font-size: 24px;
+    font-weight: 300;
+    font-style: italic;
+    line-height: 1.35;
+    letter-spacing: .08em
+}
+
+blockquote:before {
+    position: absolute;
+    left: -.5em;
+    content: '“'
+}
+
+blockquote:after {
+    content: '”';
+    margin-left: -.05em
+}
+
+mark {
+    background-color: #f4ff81
+}
+
+dt {
+    font-weight: 700
+}
+
+address {
+    font-size: 12px;
+    line-height: 1;
+    font-style: normal
+}
+
+address,
+ul,
+ol {
+    font-weight: 400;
+    letter-spacing: 0
+}
+
+ul,
+ol {
+    font-size: 14px;
+    line-height: 24px
+}
+
+.mdl-typography--display-4,
+.mdl-typography--display-4-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 112px;
+    font-weight: 300;
+    line-height: 1;
+    letter-spacing: -.04em
+}
+
+.mdl-typography--display-4-color-contrast {
+    opacity: .54
+}
+
+.mdl-typography--display-3,
+.mdl-typography--display-3-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 56px;
+    font-weight: 400;
+    line-height: 1.35;
+    letter-spacing: -.02em
+}
+
+.mdl-typography--display-3-color-contrast {
+    opacity: .54
+}
+
+.mdl-typography--display-2,
+.mdl-typography--display-2-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 45px;
+    font-weight: 400;
+    line-height: 48px
+}
+
+.mdl-typography--display-2-color-contrast {
+    opacity: .54
+}
+
+.mdl-typography--display-1,
+.mdl-typography--display-1-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 34px;
+    font-weight: 400;
+    line-height: 40px
+}
+
+.mdl-typography--display-1-color-contrast {
+    opacity: .54
+}
+
+.mdl-typography--headline,
+.mdl-typography--headline-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 24px;
+    font-weight: 400;
+    line-height: 32px;
+    -moz-osx-font-smoothing: grayscale
+}
+
+.mdl-typography--headline-color-contrast {
+    opacity: .87
+}
+
+.mdl-typography--title,
+.mdl-typography--title-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 20px;
+    font-weight: 500;
+    line-height: 1;
+    letter-spacing: .02em
+}
+
+.mdl-typography--title-color-contrast {
+    opacity: .87
+}
+
+.mdl-typography--subhead,
+.mdl-typography--subhead-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 16px;
+    font-weight: 400;
+    line-height: 24px;
+    letter-spacing: .04em
+}
+
+.mdl-typography--subhead-color-contrast {
+    opacity: .87
+}
+
+.mdl-typography--body-2,
+.mdl-typography--body-2-color-contrast {
+    font-size: 14px;
+    font-weight: 700;
+    line-height: 24px;
+    letter-spacing: 0
+}
+
+.mdl-typography--body-2-color-contrast {
+    opacity: .87
+}
+
+.mdl-typography--body-1,
+.mdl-typography--body-1-color-contrast {
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 24px;
+    letter-spacing: 0
+}
+
+.mdl-typography--body-1-color-contrast {
+    opacity: .87
+}
+
+.mdl-typography--body-2-force-preferred-font,
+.mdl-typography--body-2-force-preferred-font-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 24px;
+    letter-spacing: 0
+}
+
+.mdl-typography--body-2-force-preferred-font-color-contrast {
+    opacity: .87
+}
+
+.mdl-typography--body-1-force-preferred-font,
+.mdl-typography--body-1-force-preferred-font-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 24px;
+    letter-spacing: 0
+}
+
+.mdl-typography--body-1-force-preferred-font-color-contrast {
+    opacity: .87
+}
+
+.mdl-typography--caption,
+.mdl-typography--caption-force-preferred-font {
+    font-size: 12px;
+    font-weight: 400;
+    line-height: 1;
+    letter-spacing: 0
+}
+
+.mdl-typography--caption-force-preferred-font {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif
+}
+
+.mdl-typography--caption-color-contrast,
+.mdl-typography--caption-force-preferred-font-color-contrast {
+    font-size: 12px;
+    font-weight: 400;
+    line-height: 1;
+    letter-spacing: 0;
+    opacity: .54
+}
+
+.mdl-typography--caption-force-preferred-font-color-contrast,
+.mdl-typography--menu {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif
+}
+
+.mdl-typography--menu {
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 1;
+    letter-spacing: 0
+}
+
+.mdl-typography--menu-color-contrast {
+    opacity: .87
+}
+
+.mdl-typography--menu-color-contrast,
+.mdl-typography--button,
+.mdl-typography--button-color-contrast {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 1;
+    letter-spacing: 0
+}
+
+.mdl-typography--button,
+.mdl-typography--button-color-contrast {
+    text-transform: uppercase
+}
+
+.mdl-typography--button-color-contrast {
+    opacity: .87
+}
+
+.mdl-typography--text-left {
+    text-align: left
+}
+
+.mdl-typography--text-right {
+    text-align: right
+}
+
+.mdl-typography--text-center {
+    text-align: center
+}
+
+.mdl-typography--text-justify {
+    text-align: justify
+}
+
+.mdl-typography--text-nowrap {
+    white-space: nowrap
+}
+
+.mdl-typography--text-lowercase {
+    text-transform: lowercase
+}
+
+.mdl-typography--text-uppercase {
+    text-transform: uppercase
+}
+
+.mdl-typography--text-capitalize {
+    text-transform: capitalize
+}
+
+.mdl-typography--font-thin {
+    font-weight: 200!important
+}
+
+.mdl-typography--font-light {
+    font-weight: 300!important
+}
+
+.mdl-typography--font-regular {
+    font-weight: 400!important
+}
+
+.mdl-typography--font-medium {
+    font-weight: 500!important
+}
+
+.mdl-typography--font-bold {
+    font-weight: 700!important
+}
+
+.mdl-typography--font-black {
+    font-weight: 900!important
+}
+
+.material-icons {
+    font-family: 'Material Icons';
+    font-weight: 400;
+    font-style: normal;
+    font-size: 24px;
+    line-height: 1;
+    letter-spacing: normal;
+    text-transform: none;
+    display: inline-block;
+    word-wrap: normal;
+    -moz-font-feature-settings: 'liga';
+    font-feature-settings: 'liga';
+    -webkit-font-feature-settings: 'liga';
+    -webkit-font-smoothing: antialiased;
+    color: #c9c9c9;
+}
+
+.material-icons.md-dark.md-inactive {
+    color: #c9c9c9;
+}
+
+.mdl-color-text--red {
+    color: #f44336 !important
+}
+
+.mdl-color--red {
+    background-color: #f44336 !important
+}
+
+.mdl-color-text--red-50 {
+    color: #ffebee !important
+}
+
+.mdl-color--red-50 {
+    background-color: #ffebee !important
+}
+
+.mdl-color-text--red-100 {
+    color: #ffcdd2 !important
+}
+
+.mdl-color--red-100 {
+    background-color: #ffcdd2 !important
+}
+
+.mdl-color-text--red-200 {
+    color: #ef9a9a !important
+}
+
+.mdl-color--red-200 {
+    background-color: #ef9a9a !important
+}
+
+.mdl-color-text--red-300 {
+    color: #e57373 !important
+}
+
+.mdl-color--red-300 {
+    background-color: #e57373 !important
+}
+
+.mdl-color-text--red-400 {
+    color: #ef5350 !important
+}
+
+.mdl-color--red-400 {
+    background-color: #ef5350 !important
+}
+
+.mdl-color-text--red-500 {
+    color: #f44336 !important
+}
+
+.mdl-color--red-500 {
+    background-color: #f44336 !important
+}
+
+.mdl-color-text--red-600 {
+    color: #e53935 !important
+}
+
+.mdl-color--red-600 {
+    background-color: #e53935 !important
+}
+
+.mdl-color-text--red-700 {
+    color: #d32f2f !important
+}
+
+.mdl-color--red-700 {
+    background-color: #d32f2f !important
+}
+
+.mdl-color-text--red-800 {
+    color: #c62828 !important
+}
+
+.mdl-color--red-800 {
+    background-color: #c62828 !important
+}
+
+.mdl-color-text--red-900 {
+    color: #b71c1c !important
+}
+
+.mdl-color--red-900 {
+    background-color: #b71c1c !important
+}
+
+.mdl-color-text--red-A100 {
+    color: #ff8a80 !important
+}
+
+.mdl-color--red-A100 {
+    background-color: #ff8a80 !important
+}
+
+.mdl-color-text--red-A200 {
+    color: #ff5252 !important
+}
+
+.mdl-color--red-A200 {
+    background-color: #ff5252 !important
+}
+
+.mdl-color-text--red-A400 {
+    color: #ff1744 !important
+}
+
+.mdl-color--red-A400 {
+    background-color: #ff1744 !important
+}
+
+.mdl-color-text--red-A700 {
+    color: #d50000 !important
+}
+
+.mdl-color--red-A700 {
+    background-color: #d50000 !important
+}
+
+.mdl-color-text--pink {
+    color: #e91e63 !important
+}
+
+.mdl-color--pink {
+    background-color: #e91e63 !important
+}
+
+.mdl-color-text--pink-50 {
+    color: #fce4ec !important
+}
+
+.mdl-color--pink-50 {
+    background-color: #fce4ec !important
+}
+
+.mdl-color-text--pink-100 {
+    color: #f8bbd0 !important
+}
+
+.mdl-color--pink-100 {
+    background-color: #f8bbd0 !important
+}
+
+.mdl-color-text--pink-200 {
+    color: #f48fb1 !important
+}
+
+.mdl-color--pink-200 {
+    background-color: #f48fb1 !important
+}
+
+.mdl-color-text--pink-300 {
+    color: #f06292 !important
+}
+
+.mdl-color--pink-300 {
+    background-color: #f06292 !important
+}
+
+.mdl-color-text--pink-400 {
+    color: #ec407a !important
+}
+
+.mdl-color--pink-400 {
+    background-color: #ec407a !important
+}
+
+.mdl-color-text--pink-500 {
+    color: #e91e63 !important
+}
+
+.mdl-color--pink-500 {
+    background-color: #e91e63 !important
+}
+
+.mdl-color-text--pink-600 {
+    color: #d81b60 !important
+}
+
+.mdl-color--pink-600 {
+    background-color: #d81b60 !important
+}
+
+.mdl-color-text--pink-700 {
+    color: #c2185b !important
+}
+
+.mdl-color--pink-700 {
+    background-color: #c2185b !important
+}
+
+.mdl-color-text--pink-800 {
+    color: #ad1457 !important
+}
+
+.mdl-color--pink-800 {
+    background-color: #ad1457 !important
+}
+
+.mdl-color-text--pink-900 {
+    color: #880e4f !important
+}
+
+.mdl-color--pink-900 {
+    background-color: #880e4f !important
+}
+
+.mdl-color-text--pink-A100 {
+    color: #ff80ab !important
+}
+
+.mdl-color--pink-A100 {
+    background-color: #ff80ab !important
+}
+
+.mdl-color-text--pink-A200 {
+    color: #ff4081 !important
+}
+
+.mdl-color--pink-A200 {
+    background-color: #ff4081 !important
+}
+
+.mdl-color-text--pink-A400 {
+    color: #f50057 !important
+}
+
+.mdl-color--pink-A400 {
+    background-color: #f50057 !important
+}
+
+.mdl-color-text--pink-A700 {
+    color: #c51162 !important
+}
+
+.mdl-color--pink-A700 {
+    background-color: #c51162 !important
+}
+
+.mdl-color-text--purple {
+    color: #9c27b0 !important
+}
+
+.mdl-color--purple {
+    background-color: #9c27b0 !important
+}
+
+.mdl-color-text--purple-50 {
+    color: #f3e5f5 !important
+}
+
+.mdl-color--purple-50 {
+    background-color: #f3e5f5 !important
+}
+
+.mdl-color-text--purple-100 {
+    color: #e1bee7 !important
+}
+
+.mdl-color--purple-100 {
+    background-color: #e1bee7 !important
+}
+
+.mdl-color-text--purple-200 {
+    color: #ce93d8 !important
+}
+
+.mdl-color--purple-200 {
+    background-color: #ce93d8 !important
+}
+
+.mdl-color-text--purple-300 {
+    color: #ba68c8 !important
+}
+
+.mdl-color--purple-300 {
+    background-color: #ba68c8 !important
+}
+
+.mdl-color-text--purple-400 {
+    color: #ab47bc !important
+}
+
+.mdl-color--purple-400 {
+    background-color: #ab47bc !important
+}
+
+.mdl-color-text--purple-500 {
+    color: #9c27b0 !important
+}
+
+.mdl-color--purple-500 {
+    background-color: #9c27b0 !important
+}
+
+.mdl-color-text--purple-600 {
+    color: #8e24aa !important
+}
+
+.mdl-color--purple-600 {
+    background-color: #8e24aa !important
+}
+
+.mdl-color-text--purple-700 {
+    color: #7b1fa2 !important
+}
+
+.mdl-color--purple-700 {
+    background-color: #7b1fa2 !important
+}
+
+.mdl-color-text--purple-800 {
+    color: #6a1b9a !important
+}
+
+.mdl-color--purple-800 {
+    background-color: #6a1b9a !important
+}
+
+.mdl-color-text--purple-900 {
+    color: #4a148c !important
+}
+
+.mdl-color--purple-900 {
+    background-color: #4a148c !important
+}
+
+.mdl-color-text--purple-A100 {
+    color: #ea80fc !important
+}
+
+.mdl-color--purple-A100 {
+    background-color: #ea80fc !important
+}
+
+.mdl-color-text--purple-A200 {
+    color: #e040fb !important
+}
+
+.mdl-color--purple-A200 {
+    background-color: #e040fb !important
+}
+
+.mdl-color-text--purple-A400 {
+    color: #d500f9 !important
+}
+
+.mdl-color--purple-A400 {
+    background-color: #d500f9 !important
+}
+
+.mdl-color-text--purple-A700 {
+    color: #a0f !important
+}
+
+.mdl-color--purple-A700 {
+    background-color: #a0f !important
+}
+
+.mdl-color-text--deep-purple {
+    color: #673ab7 !important
+}
+
+.mdl-color--deep-purple {
+    background-color: #673ab7 !important
+}
+
+.mdl-color-text--deep-purple-50 {
+    color: #ede7f6 !important
+}
+
+.mdl-color--deep-purple-50 {
+    background-color: #ede7f6 !important
+}
+
+.mdl-color-text--deep-purple-100 {
+    color: #d1c4e9 !important
+}
+
+.mdl-color--deep-purple-100 {
+    background-color: #d1c4e9 !important
+}
+
+.mdl-color-text--deep-purple-200 {
+    color: #b39ddb !important
+}
+
+.mdl-color--deep-purple-200 {
+    background-color: #b39ddb !important
+}
+
+.mdl-color-text--deep-purple-300 {
+    color: #9575cd !important
+}
+
+.mdl-color--deep-purple-300 {
+    background-color: #9575cd !important
+}
+
+.mdl-color-text--deep-purple-400 {
+    color: #7e57c2 !important
+}
+
+.mdl-color--deep-purple-400 {
+    background-color: #7e57c2 !important
+}
+
+.mdl-color-text--deep-purple-500 {
+    color: #673ab7 !important
+}
+
+.mdl-color--deep-purple-500 {
+    background-color: #673ab7 !important
+}
+
+.mdl-color-text--deep-purple-600 {
+    color: #5e35b1 !important
+}
+
+.mdl-color--deep-purple-600 {
+    background-color: #5e35b1 !important
+}
+
+.mdl-color-text--deep-purple-700 {
+    color: #512da8 !important
+}
+
+.mdl-color--deep-purple-700 {
+    background-color: #512da8 !important
+}
+
+.mdl-color-text--deep-purple-800 {
+    color: #4527a0 !important
+}
+
+.mdl-color--deep-purple-800 {
+    background-color: #4527a0 !important
+}
+
+.mdl-color-text--deep-purple-900 {
+    color: #311b92 !important
+}
+
+.mdl-color--deep-purple-900 {
+    background-color: #311b92 !important
+}
+
+.mdl-color-text--deep-purple-A100 {
+    color: #b388ff !important
+}
+
+.mdl-color--deep-purple-A100 {
+    background-color: #b388ff !important
+}
+
+.mdl-color-text--deep-purple-A200 {
+    color: #7c4dff !important
+}
+
+.mdl-color--deep-purple-A200 {
+    background-color: #7c4dff !important
+}
+
+.mdl-color-text--deep-purple-A400 {
+    color: #651fff !important
+}
+
+.mdl-color--deep-purple-A400 {
+    background-color: #651fff !important
+}
+
+.mdl-color-text--deep-purple-A700 {
+    color: #6200ea !important
+}
+
+.mdl-color--deep-purple-A700 {
+    background-color: #6200ea !important
+}
+
+.mdl-color-text--indigo {
+    color: #3f51b5 !important
+}
+
+.mdl-color--indigo {
+    background-color: #3f51b5 !important
+}
+
+.mdl-color-text--indigo-50 {
+    color: #e8eaf6 !important
+}
+
+.mdl-color--indigo-50 {
+    background-color: #e8eaf6 !important
+}
+
+.mdl-color-text--indigo-100 {
+    color: #c5cae9 !important
+}
+
+.mdl-color--indigo-100 {
+    background-color: #c5cae9 !important
+}
+
+.mdl-color-text--indigo-200 {
+    color: #9fa8da !important
+}
+
+.mdl-color--indigo-200 {
+    background-color: #9fa8da !important
+}
+
+.mdl-color-text--indigo-300 {
+    color: #7986cb !important
+}
+
+.mdl-color--indigo-300 {
+    background-color: #7986cb !important
+}
+
+.mdl-color-text--indigo-400 {
+    color: #5c6bc0 !important
+}
+
+.mdl-color--indigo-400 {
+    background-color: #161B22 !important
+}
+
+.mdl-color-text--indigo-500 {
+    color: #3f51b5 !important
+}
+
+.mdl-color--indigo-500 {
+    background-color: #3f51b5 !important
+}
+
+.mdl-color-text--indigo-600 {
+    color: #3949ab !important
+}
+
+.mdl-color--indigo-600 {
+    background-color: #3949ab !important
+}
+
+.mdl-color-text--indigo-700 {
+    color: #303f9f !important
+}
+
+.mdl-color--indigo-700 {
+    background-color: #303f9f !important
+}
+
+.mdl-color-text--indigo-800 {
+    color: #283593 !important
+}
+
+.mdl-color--indigo-800 {
+    background-color: #283593 !important
+}
+
+.mdl-color-text--indigo-900 {
+    color: #1a237e !important
+}
+
+.mdl-color--indigo-900 {
+    background-color: #1a237e !important
+}
+
+.mdl-color-text--indigo-A100 {
+    color: #8c9eff !important
+}
+
+.mdl-color--indigo-A100 {
+    background-color: #8c9eff !important
+}
+
+.mdl-color-text--indigo-A200 {
+    color: #536dfe !important
+}
+
+.mdl-color--indigo-A200 {
+    background-color: #536dfe !important
+}
+
+.mdl-color-text--indigo-A400 {
+    color: #3d5afe !important
+}
+
+.mdl-color--indigo-A400 {
+    background-color: #3d5afe !important
+}
+
+.mdl-color-text--indigo-A700 {
+    color: #304ffe !important
+}
+
+.mdl-color--indigo-A700 {
+    background-color: #304ffe !important
+}
+
+.mdl-color-text--blue {
+    color: #2196f3 !important
+}
+
+.mdl-color--blue {
+    background-color: #2196f3 !important
+}
+
+.mdl-color-text--blue-50 {
+    color: #e3f2fd !important
+}
+
+.mdl-color--blue-50 {
+    background-color: #e3f2fd !important
+}
+
+.mdl-color-text--blue-100 {
+    color: #bbdefb !important
+}
+
+.mdl-color--blue-100 {
+    background-color: #bbdefb !important
+}
+
+.mdl-color-text--blue-200 {
+    color: #90caf9 !important
+}
+
+.mdl-color--blue-200 {
+    background-color: #90caf9 !important
+}
+
+.mdl-color-text--blue-300 {
+    color: #64b5f6 !important
+}
+
+.mdl-color--blue-300 {
+    background-color: #64b5f6 !important
+}
+
+.mdl-color-text--blue-400 {
+    color: #42a5f5 !important
+}
+
+.mdl-color--blue-400 {
+    background-color: #42a5f5 !important
+}
+
+.mdl-color-text--blue-500 {
+    color: #2196f3 !important
+}
+
+.mdl-color--blue-500 {
+    background-color: #2196f3 !important
+}
+
+.mdl-color-text--blue-600 {
+    color: #1e88e5 !important
+}
+
+.mdl-color--blue-600 {
+    background-color: #1e88e5 !important
+}
+
+.mdl-color-text--blue-700 {
+    color: #1976d2 !important
+}
+
+.mdl-color--blue-700 {
+    background-color: #1976d2 !important
+}
+
+.mdl-color-text--blue-800 {
+    color: #1565c0 !important
+}
+
+.mdl-color--blue-800 {
+    background-color: #1565c0 !important
+}
+
+.mdl-color-text--blue-900 {
+    color: #0d47a1 !important
+}
+
+.mdl-color--blue-900 {
+    background-color: #0d47a1 !important
+}
+
+.mdl-color-text--blue-A100 {
+    color: #82b1ff !important
+}
+
+.mdl-color--blue-A100 {
+    background-color: #82b1ff !important
+}
+
+.mdl-color-text--blue-A200 {
+    color: #448aff !important
+}
+
+.mdl-color--blue-A200 {
+    background-color: #448aff !important
+}
+
+.mdl-color-text--blue-A400 {
+    color: #2979ff !important
+}
+
+.mdl-color--blue-A400 {
+    background-color: #2979ff !important
+}
+
+.mdl-color-text--blue-A700 {
+    color: #2962ff !important
+}
+
+.mdl-color--blue-A700 {
+    background-color: #2962ff !important
+}
+
+.mdl-color-text--light-blue {
+    color: #03a9f4 !important
+}
+
+.mdl-color--light-blue {
+    background-color: #03a9f4 !important
+}
+
+.mdl-color-text--light-blue-50 {
+    color: #e1f5fe !important
+}
+
+.mdl-color--light-blue-50 {
+    background-color: #e1f5fe !important
+}
+
+.mdl-color-text--light-blue-100 {
+    color: #b3e5fc !important
+}
+
+.mdl-color--light-blue-100 {
+    background-color: #b3e5fc !important
+}
+
+.mdl-color-text--light-blue-200 {
+    color: #81d4fa !important
+}
+
+.mdl-color--light-blue-200 {
+    background-color: #81d4fa !important
+}
+
+.mdl-color-text--light-blue-300 {
+    color: #4fc3f7 !important
+}
+
+.mdl-color--light-blue-300 {
+    background-color: #4fc3f7 !important
+}
+
+.mdl-color-text--light-blue-400 {
+    color: #29b6f6 !important
+}
+
+.mdl-color--light-blue-400 {
+    background-color: #29b6f6 !important
+}
+
+.mdl-color-text--light-blue-500 {
+    color: #03a9f4 !important
+}
+
+.mdl-color--light-blue-500 {
+    background-color: #03a9f4 !important
+}
+
+.mdl-color-text--light-blue-600 {
+    color: #039be5 !important
+}
+
+.mdl-color--light-blue-600 {
+    background-color: #039be5 !important
+}
+
+.mdl-color-text--light-blue-700 {
+    color: #0288d1 !important
+}
+
+.mdl-color--light-blue-700 {
+    background-color: #0288d1 !important
+}
+
+.mdl-color-text--light-blue-800 {
+    color: #0277bd !important
+}
+
+.mdl-color--light-blue-800 {
+    background-color: #0277bd !important
+}
+
+.mdl-color-text--light-blue-900 {
+    color: #01579b !important
+}
+
+.mdl-color--light-blue-900 {
+    background-color: #01579b !important
+}
+
+.mdl-color-text--light-blue-A100 {
+    color: #80d8ff !important
+}
+
+.mdl-color--light-blue-A100 {
+    background-color: #80d8ff !important
+}
+
+.mdl-color-text--light-blue-A200 {
+    color: #40c4ff !important
+}
+
+.mdl-color--light-blue-A200 {
+    background-color: #40c4ff !important
+}
+
+.mdl-color-text--light-blue-A400 {
+    color: #00b0ff !important
+}
+
+.mdl-color--light-blue-A400 {
+    background-color: #00b0ff !important
+}
+
+.mdl-color-text--light-blue-A700 {
+    color: #0091ea !important
+}
+
+.mdl-color--light-blue-A700 {
+    background-color: #0091ea !important
+}
+
+.mdl-color-text--cyan {
+    color: #00bcd4 !important
+}
+
+.mdl-color--cyan {
+    background-color: #00bcd4 !important
+}
+
+.mdl-color-text--cyan-50 {
+    color: #e0f7fa !important
+}
+
+.mdl-color--cyan-50 {
+    background-color: #e0f7fa !important
+}
+
+.mdl-color-text--cyan-100 {
+    color: #b2ebf2 !important
+}
+
+.mdl-color--cyan-100 {
+    background-color: #b2ebf2 !important
+}
+
+.mdl-color-text--cyan-200 {
+    color: #80deea !important
+}
+
+.mdl-color--cyan-200 {
+    background-color: #80deea !important
+}
+
+.mdl-color-text--cyan-300 {
+    color: #4dd0e1 !important
+}
+
+.mdl-color--cyan-300 {
+    background-color: #4dd0e1 !important
+}
+
+.mdl-color-text--cyan-400 {
+    color: #26c6da !important
+}
+
+.mdl-color--cyan-400 {
+    background-color: #26c6da !important
+}
+
+.mdl-color-text--cyan-500 {
+    color: #00bcd4 !important
+}
+
+.mdl-color--cyan-500 {
+    background-color: #00bcd4 !important
+}
+
+.mdl-color-text--cyan-600 {
+    color: #00acc1 !important
+}
+
+.mdl-color--cyan-600 {
+    background-color: #00acc1 !important
+}
+
+.mdl-color-text--cyan-700 {
+    color: #0097a7 !important
+}
+
+.mdl-color--cyan-700 {
+    background-color: #0097a7 !important
+}
+
+.mdl-color-text--cyan-800 {
+    color: #00838f !important
+}
+
+.mdl-color--cyan-800 {
+    background-color: #00838f !important
+}
+
+.mdl-color-text--cyan-900 {
+    color: #006064 !important
+}
+
+.mdl-color--cyan-900 {
+    background-color: #006064 !important
+}
+
+.mdl-color-text--cyan-A100 {
+    color: #84ffff !important
+}
+
+.mdl-color--cyan-A100 {
+    background-color: #84ffff !important
+}
+
+.mdl-color-text--cyan-A200 {
+    color: #18ffff !important
+}
+
+.mdl-color--cyan-A200 {
+    background-color: #18ffff !important
+}
+
+.mdl-color-text--cyan-A400 {
+    color: #00e5ff !important
+}
+
+.mdl-color--cyan-A400 {
+    background-color: #00e5ff !important
+}
+
+.mdl-color-text--cyan-A700 {
+    color: #00b8d4 !important
+}
+
+.mdl-color--cyan-A700 {
+    background-color: #00b8d4 !important
+}
+
+.mdl-color-text--teal {
+    color: #009688 !important
+}
+
+.mdl-color--teal {
+    background-color: #009688 !important
+}
+
+.mdl-color-text--teal-50 {
+    color: #e0f2f1 !important
+}
+
+.mdl-color--teal-50 {
+    background-color: #e0f2f1 !important
+}
+
+.mdl-color-text--teal-100 {
+    color: #b2dfdb !important
+}
+
+.mdl-color--teal-100 {
+    background-color: #b2dfdb !important
+}
+
+.mdl-color-text--teal-200 {
+    color: #80cbc4 !important
+}
+
+.mdl-color--teal-200 {
+    background-color: #80cbc4 !important
+}
+
+.mdl-color-text--teal-300 {
+    color: #4db6ac !important
+}
+
+.mdl-color--teal-300 {
+    background-color: #4db6ac !important
+}
+
+.mdl-color-text--teal-400 {
+    color: #26a69a !important
+}
+
+.mdl-color--teal-400 {
+    background-color: #26a69a !important
+}
+
+.mdl-color-text--teal-500 {
+    color: #009688 !important
+}
+
+.mdl-color--teal-500 {
+    background-color: #009688 !important
+}
+
+.mdl-color-text--teal-600 {
+    color: #00897b !important
+}
+
+.mdl-color--teal-600 {
+    background-color: #00897b !important
+}
+
+.mdl-color-text--teal-700 {
+    color: #00796b !important
+}
+
+.mdl-color--teal-700 {
+    background-color: #00796b !important
+}
+
+.mdl-color-text--teal-800 {
+    color: #00695c !important
+}
+
+.mdl-color--teal-800 {
+    background-color: #00695c !important
+}
+
+.mdl-color-text--teal-900 {
+    color: #004d40 !important
+}
+
+.mdl-color--teal-900 {
+    background-color: #004d40 !important
+}
+
+.mdl-color-text--teal-A100 {
+    color: #a7ffeb !important
+}
+
+.mdl-color--teal-A100 {
+    background-color: #a7ffeb !important
+}
+
+.mdl-color-text--teal-A200 {
+    color: #64ffda !important
+}
+
+.mdl-color--teal-A200 {
+    background-color: #64ffda !important
+}
+
+.mdl-color-text--teal-A400 {
+    color: #1de9b6 !important
+}
+
+.mdl-color--teal-A400 {
+    background-color: #1de9b6 !important
+}
+
+.mdl-color-text--teal-A700 {
+    color: #00bfa5 !important
+}
+
+.mdl-color--teal-A700 {
+    background-color: #00bfa5 !important
+}
+
+.mdl-color-text--green {
+    color: #4caf50 !important
+}
+
+.mdl-color--green {
+    background-color: #4caf50 !important
+}
+
+.mdl-color-text--green-50 {
+    color: #e8f5e9 !important
+}
+
+.mdl-color--green-50 {
+    background-color: #e8f5e9 !important
+}
+
+.mdl-color-text--green-100 {
+    color: #c8e6c9 !important
+}
+
+.mdl-color--green-100 {
+    background-color: #c8e6c9 !important
+}
+
+.mdl-color-text--green-200 {
+    color: #a5d6a7 !important
+}
+
+.mdl-color--green-200 {
+    background-color: #a5d6a7 !important
+}
+
+.mdl-color-text--green-300 {
+    color: #81c784 !important
+}
+
+.mdl-color--green-300 {
+    background-color: #81c784 !important
+}
+
+.mdl-color-text--green-400 {
+    color: #66bb6a !important
+}
+
+.mdl-color--green-400 {
+    background-color: #66bb6a !important
+}
+
+.mdl-color-text--green-500 {
+    color: #4caf50 !important
+}
+
+.mdl-color--green-500 {
+    background-color: #4caf50 !important
+}
+
+.mdl-color-text--green-600 {
+    color: #43a047 !important
+}
+
+.mdl-color--green-600 {
+    background-color: #43a047 !important
+}
+
+.mdl-color-text--green-700 {
+    color: #388e3c !important
+}
+
+.mdl-color--green-700 {
+    background-color: #388e3c !important
+}
+
+.mdl-color-text--green-800 {
+    color: #2e7d32 !important
+}
+
+.mdl-color--green-800 {
+    background-color: #2e7d32 !important
+}
+
+.mdl-color-text--green-900 {
+    color: #1b5e20 !important
+}
+
+.mdl-color--green-900 {
+    background-color: #1b5e20 !important
+}
+
+.mdl-color-text--green-A100 {
+    color: #b9f6ca !important
+}
+
+.mdl-color--green-A100 {
+    background-color: #b9f6ca !important
+}
+
+.mdl-color-text--green-A200 {
+    color: #69f0ae !important
+}
+
+.mdl-color--green-A200 {
+    background-color: #69f0ae !important
+}
+
+.mdl-color-text--green-A400 {
+    color: #00e676 !important
+}
+
+.mdl-color--green-A400 {
+    background-color: #00e676 !important
+}
+
+.mdl-color-text--green-A700 {
+    color: #00c853 !important
+}
+
+.mdl-color--green-A700 {
+    background-color: #00c853 !important
+}
+
+.mdl-color-text--light-green {
+    color: #8bc34a !important
+}
+
+.mdl-color--light-green {
+    background-color: #8bc34a !important
+}
+
+.mdl-color-text--light-green-50 {
+    color: #f1f8e9 !important
+}
+
+.mdl-color--light-green-50 {
+    background-color: #f1f8e9 !important
+}
+
+.mdl-color-text--light-green-100 {
+    color: #dcedc8 !important
+}
+
+.mdl-color--light-green-100 {
+    background-color: #dcedc8 !important
+}
+
+.mdl-color-text--light-green-200 {
+    color: #c5e1a5 !important
+}
+
+.mdl-color--light-green-200 {
+    background-color: #c5e1a5 !important
+}
+
+.mdl-color-text--light-green-300 {
+    color: #aed581 !important
+}
+
+.mdl-color--light-green-300 {
+    background-color: #aed581 !important
+}
+
+.mdl-color-text--light-green-400 {
+    color: #9ccc65 !important
+}
+
+.mdl-color--light-green-400 {
+    background-color: #9ccc65 !important
+}
+
+.mdl-color-text--light-green-500 {
+    color: #8bc34a !important
+}
+
+.mdl-color--light-green-500 {
+    background-color: #8bc34a !important
+}
+
+.mdl-color-text--light-green-600 {
+    color: #7cb342 !important
+}
+
+.mdl-color--light-green-600 {
+    background-color: #7cb342 !important
+}
+
+.mdl-color-text--light-green-700 {
+    color: #689f38 !important
+}
+
+.mdl-color--light-green-700 {
+    background-color: #689f38 !important
+}
+
+.mdl-color-text--light-green-800 {
+    color: #558b2f !important
+}
+
+.mdl-color--light-green-800 {
+    background-color: #558b2f !important
+}
+
+.mdl-color-text--light-green-900 {
+    color: #33691e !important
+}
+
+.mdl-color--light-green-900 {
+    background-color: #33691e !important
+}
+
+.mdl-color-text--light-green-A100 {
+    color: #ccff90 !important
+}
+
+.mdl-color--light-green-A100 {
+    background-color: #ccff90 !important
+}
+
+.mdl-color-text--light-green-A200 {
+    color: #b2ff59 !important
+}
+
+.mdl-color--light-green-A200 {
+    background-color: #b2ff59 !important
+}
+
+.mdl-color-text--light-green-A400 {
+    color: #76ff03 !important
+}
+
+.mdl-color--light-green-A400 {
+    background-color: #76ff03 !important
+}
+
+.mdl-color-text--light-green-A700 {
+    color: #64dd17 !important
+}
+
+.mdl-color--light-green-A700 {
+    background-color: #64dd17 !important
+}
+
+.mdl-color-text--lime {
+    color: #cddc39 !important
+}
+
+.mdl-color--lime {
+    background-color: #cddc39 !important
+}
+
+.mdl-color-text--lime-50 {
+    color: #f9fbe7 !important
+}
+
+.mdl-color--lime-50 {
+    background-color: #f9fbe7 !important
+}
+
+.mdl-color-text--lime-100 {
+    color: #f0f4c3 !important
+}
+
+.mdl-color--lime-100 {
+    background-color: #f0f4c3 !important
+}
+
+.mdl-color-text--lime-200 {
+    color: #e6ee9c !important
+}
+
+.mdl-color--lime-200 {
+    background-color: #e6ee9c !important
+}
+
+.mdl-color-text--lime-300 {
+    color: #dce775 !important
+}
+
+.mdl-color--lime-300 {
+    background-color: #dce775 !important
+}
+
+.mdl-color-text--lime-400 {
+    color: #d4e157 !important
+}
+
+.mdl-color--lime-400 {
+    background-color: #d4e157 !important
+}
+
+.mdl-color-text--lime-500 {
+    color: #cddc39 !important
+}
+
+.mdl-color--lime-500 {
+    background-color: #cddc39 !important
+}
+
+.mdl-color-text--lime-600 {
+    color: #c0ca33 !important
+}
+
+.mdl-color--lime-600 {
+    background-color: #c0ca33 !important
+}
+
+.mdl-color-text--lime-700 {
+    color: #afb42b !important
+}
+
+.mdl-color--lime-700 {
+    background-color: #afb42b !important
+}
+
+.mdl-color-text--lime-800 {
+    color: #9e9d24 !important
+}
+
+.mdl-color--lime-800 {
+    background-color: #9e9d24 !important
+}
+
+.mdl-color-text--lime-900 {
+    color: #827717 !important
+}
+
+.mdl-color--lime-900 {
+    background-color: #827717 !important
+}
+
+.mdl-color-text--lime-A100 {
+    color: #f4ff81 !important
+}
+
+.mdl-color--lime-A100 {
+    background-color: #f4ff81 !important
+}
+
+.mdl-color-text--lime-A200 {
+    color: #eeff41 !important
+}
+
+.mdl-color--lime-A200 {
+    background-color: #eeff41 !important
+}
+
+.mdl-color-text--lime-A400 {
+    color: #c6ff00 !important
+}
+
+.mdl-color--lime-A400 {
+    background-color: #c6ff00 !important
+}
+
+.mdl-color-text--lime-A700 {
+    color: #aeea00 !important
+}
+
+.mdl-color--lime-A700 {
+    background-color: #aeea00 !important
+}
+
+.mdl-color-text--yellow {
+    color: #ffeb3b !important
+}
+
+.mdl-color--yellow {
+    background-color: #ffeb3b !important
+}
+
+.mdl-color-text--yellow-50 {
+    color: #fffde7 !important
+}
+
+.mdl-color--yellow-50 {
+    background-color: #fffde7 !important
+}
+
+.mdl-color-text--yellow-100 {
+    color: #fff9c4 !important
+}
+
+.mdl-color--yellow-100 {
+    background-color: #fff9c4 !important
+}
+
+.mdl-color-text--yellow-200 {
+    color: #fff59d !important
+}
+
+.mdl-color--yellow-200 {
+    background-color: #fff59d !important
+}
+
+.mdl-color-text--yellow-300 {
+    color: #fff176 !important
+}
+
+.mdl-color--yellow-300 {
+    background-color: #fff176 !important
+}
+
+.mdl-color-text--yellow-400 {
+    color: #ffee58 !important
+}
+
+.mdl-color--yellow-400 {
+    background-color: #ffee58 !important
+}
+
+.mdl-color-text--yellow-500 {
+    color: #ffeb3b !important
+}
+
+.mdl-color--yellow-500 {
+    background-color: #ffeb3b !important
+}
+
+.mdl-color-text--yellow-600 {
+    color: #fdd835 !important
+}
+
+.mdl-color--yellow-600 {
+    background-color: #fdd835 !important
+}
+
+.mdl-color-text--yellow-700 {
+    color: #fbc02d !important
+}
+
+.mdl-color--yellow-700 {
+    background-color: #fbc02d !important
+}
+
+.mdl-color-text--yellow-800 {
+    color: #f9a825 !important
+}
+
+.mdl-color--yellow-800 {
+    background-color: #f9a825 !important
+}
+
+.mdl-color-text--yellow-900 {
+    color: #f57f17 !important
+}
+
+.mdl-color--yellow-900 {
+    background-color: #f57f17 !important
+}
+
+.mdl-color-text--yellow-A100 {
+    color: #ffff8d !important
+}
+
+.mdl-color--yellow-A100 {
+    background-color: #ffff8d !important
+}
+
+.mdl-color-text--yellow-A200 {
+    color: #ff0 !important
+}
+
+.mdl-color--yellow-A200 {
+    background-color: #ff0 !important
+}
+
+.mdl-color-text--yellow-A400 {
+    color: #ffea00 !important
+}
+
+.mdl-color--yellow-A400 {
+    background-color: #ffea00 !important
+}
+
+.mdl-color-text--yellow-A700 {
+    color: #ffd600 !important
+}
+
+.mdl-color--yellow-A700 {
+    background-color: #ffd600 !important
+}
+
+.mdl-color-text--amber {
+    color: #ffc107 !important
+}
+
+.mdl-color--amber {
+    background-color: #0D1117 !important;
+    color: #ffc107;
+}
+
+.mdl-color-text--amber-50 {
+    color: #fff8e1 !important
+}
+
+.mdl-color--amber-50 {
+    background-color: #fff8e1 !important
+}
+
+.mdl-color-text--amber-100 {
+    color: #ffecb3 !important
+}
+
+.mdl-color--amber-100 {
+    background-color: #ffecb3 !important
+}
+
+.mdl-color-text--amber-200 {
+    color: #ffe082 !important
+}
+
+.mdl-color--amber-200 {
+    background-color: #ffe082 !important
+}
+
+.mdl-color-text--amber-300 {
+    color: #ffd54f !important
+}
+
+.mdl-color--amber-300 {
+    background-color: #ffd54f !important
+}
+
+.mdl-color-text--amber-400 {
+    color: #ffca28 !important
+}
+
+.mdl-color--amber-400 {
+    background-color: #ffca28 !important
+}
+
+.mdl-color-text--amber-500 {
+    color: #ffc107 !important
+}
+
+.mdl-color--amber-500 {
+    background-color: #ffc107 !important
+}
+
+.mdl-color-text--amber-600 {
+    color: #ffb300 !important
+}
+
+.mdl-color--amber-600 {
+    background-color: #ffb300 !important
+}
+
+.mdl-color-text--amber-700 {
+    color: #ffa000 !important
+}
+
+.mdl-color--amber-700 {
+    background-color: #ffa000 !important
+}
+
+.mdl-color-text--amber-800 {
+    color: #ff8f00 !important
+}
+
+.mdl-color--amber-800 {
+    background-color: #ff8f00 !important
+}
+
+.mdl-color-text--amber-900 {
+    color: #ff6f00 !important
+}
+
+.mdl-color--amber-900 {
+    background-color: #ff6f00 !important
+}
+
+.mdl-color-text--amber-A100 {
+    color: #ffe57f !important
+}
+
+.mdl-color--amber-A100 {
+    background-color: #ffe57f !important
+}
+
+.mdl-color-text--amber-A200 {
+    color: #ffd740 !important
+}
+
+.mdl-color--amber-A200 {
+    color: #ffd740 !important
+}
+
+.mdl-color-text--amber-A400 {
+    color: #ffc400 !important
+}
+
+.mdl-color--amber-A400 {
+    background-color: #ffc400 !important
+}
+
+.mdl-color-text--amber-A700 {
+    color: #ffab00 !important
+}
+
+.mdl-color--amber-A700 {
+    background-color: #ffab00 !important
+}
+
+.mdl-color-text--orange {
+    color: #ff9800 !important
+}
+
+.mdl-color--orange {
+    background-color: #ff9800 !important
+}
+
+.mdl-color-text--orange-50 {
+    color: #fff3e0 !important
+}
+
+.mdl-color--orange-50 {
+    background-color: #fff3e0 !important
+}
+
+.mdl-color-text--orange-100 {
+    color: #ffe0b2 !important
+}
+
+.mdl-color--orange-100 {
+    background-color: #ffe0b2 !important
+}
+
+.mdl-color-text--orange-200 {
+    color: #ffcc80 !important
+}
+
+.mdl-color--orange-200 {
+    background-color: #ffcc80 !important
+}
+
+.mdl-color-text--orange-300 {
+    color: #ffb74d !important
+}
+
+.mdl-color--orange-300 {
+    background-color: #ffb74d !important
+}
+
+.mdl-color-text--orange-400 {
+    color: #ffa726 !important
+}
+
+.mdl-color--orange-400 {
+    background-color: #ffa726 !important
+}
+
+.mdl-color-text--orange-500 {
+    color: #ff9800 !important
+}
+
+.mdl-color--orange-500 {
+    background-color: #ff9800 !important
+}
+
+.mdl-color-text--orange-600 {
+    color: #fb8c00 !important
+}
+
+.mdl-color--orange-600 {
+    background-color: #fb8c00 !important
+}
+
+.mdl-color-text--orange-700 {
+    color: #f57c00 !important
+}
+
+.mdl-color--orange-700 {
+    background-color: #f57c00 !important
+}
+
+.mdl-color-text--orange-800 {
+    color: #ef6c00 !important
+}
+
+.mdl-color--orange-800 {
+    background-color: #ef6c00 !important
+}
+
+.mdl-color-text--orange-900 {
+    color: #e65100 !important
+}
+
+.mdl-color--orange-900 {
+    background-color: #e65100 !important
+}
+
+.mdl-color-text--orange-A100 {
+    color: #ffd180 !important
+}
+
+.mdl-color--orange-A100 {
+    background-color: #ffd180 !important
+}
+
+.mdl-color-text--orange-A200 {
+    color: #ffab40 !important
+}
+
+.mdl-color--orange-A200 {
+    background-color: #ffab40 !important
+}
+
+.mdl-color-text--orange-A400 {
+    color: #ff9100 !important
+}
+
+.mdl-color--orange-A400 {
+    background-color: #ff9100 !important
+}
+
+.mdl-color-text--orange-A700 {
+    color: #ff6d00 !important
+}
+
+.mdl-color--orange-A700 {
+    background-color: #ff6d00 !important
+}
+
+.mdl-color-text--deep-orange {
+    color: #ff5722 !important
+}
+
+.mdl-color--deep-orange {
+    background-color: #ff5722 !important
+}
+
+.mdl-color-text--deep-orange-50 {
+    color: #fbe9e7 !important
+}
+
+.mdl-color--deep-orange-50 {
+    background-color: #fbe9e7 !important
+}
+
+.mdl-color-text--deep-orange-100 {
+    color: #ffccbc !important
+}
+
+.mdl-color--deep-orange-100 {
+    background-color: #ffccbc !important
+}
+
+.mdl-color-text--deep-orange-200 {
+    color: #ffab91 !important
+}
+
+.mdl-color--deep-orange-200 {
+    background-color: #ffab91 !important
+}
+
+.mdl-color-text--deep-orange-300 {
+    color: #ff8a65 !important
+}
+
+.mdl-color--deep-orange-300 {
+    background-color: #ff8a65 !important
+}
+
+.mdl-color-text--deep-orange-400 {
+    color: #ff7043 !important
+}
+
+.mdl-color--deep-orange-400 {
+    background-color: #ff7043 !important
+}
+
+.mdl-color-text--deep-orange-500 {
+    color: #ff5722 !important
+}
+
+.mdl-color--deep-orange-500 {
+    background-color: #ff5722 !important
+}
+
+.mdl-color-text--deep-orange-600 {
+    color: #f4511e !important
+}
+
+.mdl-color--deep-orange-600 {
+    background-color: #f4511e !important
+}
+
+.mdl-color-text--deep-orange-700 {
+    color: #e64a19 !important
+}
+
+.mdl-color--deep-orange-700 {
+    background-color: #e64a19 !important
+}
+
+.mdl-color-text--deep-orange-800 {
+    color: #d84315 !important
+}
+
+.mdl-color--deep-orange-800 {
+    background-color: #d84315 !important
+}
+
+.mdl-color-text--deep-orange-900 {
+    color: #bf360c !important
+}
+
+.mdl-color--deep-orange-900 {
+    background-color: #bf360c !important
+}
+
+.mdl-color-text--deep-orange-A100 {
+    color: #ff9e80 !important
+}
+
+.mdl-color--deep-orange-A100 {
+    background-color: #ff9e80 !important
+}
+
+.mdl-color-text--deep-orange-A200 {
+    color: #ff6e40 !important
+}
+
+.mdl-color--deep-orange-A200 {
+    background-color: #ff6e40 !important
+}
+
+.mdl-color-text--deep-orange-A400 {
+    color: #ff3d00 !important
+}
+
+.mdl-color--deep-orange-A400 {
+    background-color: #ff3d00 !important
+}
+
+.mdl-color-text--deep-orange-A700 {
+    color: #dd2c00 !important
+}
+
+.mdl-color--deep-orange-A700 {
+    background-color: #dd2c00 !important
+}
+
+.mdl-color-text--brown {
+    color: #795548 !important
+}
+
+.mdl-color--brown {
+    background-color: #795548 !important
+}
+
+.mdl-color-text--brown-50 {
+    color: #efebe9 !important
+}
+
+.mdl-color--brown-50 {
+    background-color: #efebe9 !important
+}
+
+.mdl-color-text--brown-100 {
+    color: #d7ccc8 !important
+}
+
+.mdl-color--brown-100 {
+    background-color: #d7ccc8 !important
+}
+
+.mdl-color-text--brown-200 {
+    color: #bcaaa4 !important
+}
+
+.mdl-color--brown-200 {
+    background-color: #bcaaa4 !important
+}
+
+.mdl-color-text--brown-300 {
+    color: #a1887f !important
+}
+
+.mdl-color--brown-300 {
+    background-color: #a1887f !important
+}
+
+.mdl-color-text--brown-400 {
+    color: #8d6e63 !important
+}
+
+.mdl-color--brown-400 {
+    background-color: #8d6e63 !important
+}
+
+.mdl-color-text--brown-500 {
+    color: #795548 !important
+}
+
+.mdl-color--brown-500 {
+    background-color: #795548 !important
+}
+
+.mdl-color-text--brown-600 {
+    color: #6d4c41 !important
+}
+
+.mdl-color--brown-600 {
+    background-color: #6d4c41 !important
+}
+
+.mdl-color-text--brown-700 {
+    color: #5d4037 !important
+}
+
+.mdl-color--brown-700 {
+    background-color: #5d4037 !important
+}
+
+.mdl-color-text--brown-800 {
+    color: #4e342e !important
+}
+
+.mdl-color--brown-800 {
+    background-color: #4e342e !important
+}
+
+.mdl-color-text--brown-900 {
+    color: #3e2723 !important
+}
+
+.mdl-color--brown-900 {
+    background-color: #3e2723 !important
+}
+
+.mdl-color-text--grey {
+    color: #9e9e9e !important
+}
+
+.mdl-color--grey {
+    background-color: #9e9e9e !important
+}
+
+.mdl-color-text--grey-50 {
+    color: #fafafa !important
+}
+
+.mdl-color--grey-50 {
+    background-color: #fafafa !important
+}
+
+.mdl-color-text--grey-100 {
+    color: #f5f5f5 !important
+}
+
+.mdl-color--grey-100 {
+    background-color: #f5f5f5 !important
+}
+
+.mdl-color-text--grey-200 {
+    color: #eee !important
+}
+
+.mdl-color--grey-200 {
+    background-color: #eee !important
+}
+
+.mdl-color-text--grey-300 {
+    color: #e0e0e0 !important
+}
+
+.mdl-color--grey-300 {
+    background-color: #e0e0e0 !important
+}
+
+.mdl-color-text--grey-400 {
+    color: #bdbdbd !important
+}
+
+.mdl-color--grey-400 {
+    background-color: #bdbdbd !important
+}
+
+.mdl-color-text--grey-500 {
+    color: #9e9e9e !important
+}
+
+.mdl-color--grey-500 {
+    background-color: #9e9e9e !important
+}
+
+.mdl-color-text--grey-600 {
+    color: #757575 !important
+}
+
+.mdl-color--grey-600 {
+    background-color: #757575 !important
+}
+
+.mdl-color-text--grey-700 {
+    color: #616161 !important
+}
+
+.mdl-color--grey-700 {
+    background-color: #616161 !important
+}
+
+.mdl-color-text--grey-800 {
+    color: #424242 !important
+}
+
+.mdl-color--grey-800 {
+    background-color: #424242 !important
+}
+
+.mdl-color-text--grey-900 {
+    color: #212121 !important
+}
+
+.mdl-color--grey-900 {
+    background-color: #212121 !important
+}
+
+.mdl-color-text--blue-grey {
+    color: #607d8b !important
+}
+
+.mdl-color--blue-grey {
+    background-color: #607d8b !important
+}
+
+.mdl-color-text--blue-grey-50 {
+    color: #eceff1 !important
+}
+
+.mdl-color--blue-grey-50 {
+    background-color: #eceff1 !important
+}
+
+.mdl-color-text--blue-grey-100 {
+    color: #cfd8dc !important
+}
+
+.mdl-color--blue-grey-100 {
+    background-color: #cfd8dc !important
+}
+
+.mdl-color-text--blue-grey-200 {
+    color: #b0bec5 !important
+}
+
+.mdl-color--blue-grey-200 {
+    background-color: #b0bec5 !important
+}
+
+.mdl-color-text--blue-grey-300 {
+    color: #90a4ae !important
+}
+
+.mdl-color--blue-grey-300 {
+    background-color: #90a4ae !important
+}
+
+.mdl-color-text--blue-grey-400 {
+    color: #78909c !important
+}
+
+.mdl-color--blue-grey-400 {
+    background-color: #78909c !important
+}
+
+.mdl-color-text--blue-grey-500 {
+    color: #607d8b !important
+}
+
+.mdl-color--blue-grey-500 {
+    background-color: #607d8b !important
+}
+
+.mdl-color-text--blue-grey-600 {
+    color: #546e7a !important
+}
+
+.mdl-color--blue-grey-600 {
+    background-color: #546e7a !important
+}
+
+.mdl-color-text--blue-grey-700 {
+    color: #455a64 !important
+}
+
+.mdl-color--blue-grey-700 {
+    background-color: #455a64 !important
+}
+
+.mdl-color-text--blue-grey-800 {
+    color: #37474f !important
+}
+
+.mdl-color--blue-grey-800 {
+    background-color: #37474f !important
+}
+
+.mdl-color-text--blue-grey-900 {
+    color: #263238 !important
+}
+
+.mdl-color--blue-grey-900 {
+    background-color: #263238 !important
+}
+
+.mdl-color--black {
+    background-color: #000 !important
+}
+
+.mdl-color-text--black {
+    color: #000 !important
+}
+
+.mdl-color--white {
+    background-color: #fff !important
+}
+
+.mdl-color-text--white {
+    color: #fff !important
+}
+
+.mdl-color--primary {
+    background-color: rgb(96, 125, 139)!important
+}
+
+.mdl-color--primary-contrast {
+    background-color: rgb(255, 255, 255)!important
+}
+
+.mdl-color--primary-dark {
+    background-color: rgb(69, 90, 100)!important
+}
+
+.mdl-color--accent {
+    background-color: rgb(83, 109, 254)!important
+}
+
+.mdl-color--accent-contrast {
+    background-color: rgb(255, 255, 255)!important
+}
+
+.mdl-color-text--primary {
+    color: rgb(96, 125, 139)!important
+}
+
+.mdl-color-text--primary-contrast {
+    color: rgb(255, 255, 255)!important
+}
+
+.mdl-color-text--primary-dark {
+    color: rgb(69, 90, 100)!important
+}
+
+.mdl-color-text--accent {
+    color: rgb(83, 109, 254)!important
+}
+
+.mdl-color-text--accent-contrast {
+    color: rgb(255, 255, 255)!important
+}
+
+.mdl-ripple {
+    background: #000;
+    border-radius: 50%;
+    height: 50px;
+    left: 0;
+    opacity: 0;
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    -webkit-transform: translate(-50%, -50%);
+    transform: translate(-50%, -50%);
+    width: 50px;
+    overflow: hidden
+}
+
+.mdl-ripple.is-animating {
+    transition: transform .3s cubic-bezier(0, 0, .2, 1), width .3s cubic-bezier(0, 0, .2, 1), height .3s cubic-bezier(0, 0, .2, 1), opacity .6s cubic-bezier(0, 0, .2, 1);
+    transition: transform .3s cubic-bezier(0, 0, .2, 1), width .3s cubic-bezier(0, 0, .2, 1), height .3s cubic-bezier(0, 0, .2, 1), opacity .6s cubic-bezier(0, 0, .2, 1), -webkit-transform .3s cubic-bezier(0, 0, .2, 1)
+}
+
+.mdl-ripple.is-visible {
+    opacity: .3
+}
+
+.mdl-animation--default,
+.mdl-animation--fast-out-slow-in {
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
+}
+
+.mdl-animation--linear-out-slow-in {
+    transition-timing-function: cubic-bezier(0, 0, .2, 1)
+}
+
+.mdl-animation--fast-out-linear-in {
+    transition-timing-function: cubic-bezier(.4, 0, 1, 1)
+}
+
+.mdl-badge {
+    position: relative;
+    white-space: nowrap;
+    margin-right: 24px
+}
+
+.mdl-badge:not([data-badge]) {
+    margin-right: auto
+}
+
+.mdl-badge[data-badge]:after {
+    content: attr(data-badge);
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+    -webkit-flex-wrap: wrap;
+    -ms-flex-wrap: wrap;
+    flex-wrap: wrap;
+    -webkit-justify-content: center;
+    -ms-flex-pack: center;
+    justify-content: center;
+    -webkit-align-content: center;
+    -ms-flex-line-pack: center;
+    align-content: center;
+    -webkit-align-items: center;
+    -ms-flex-align: center;
+    align-items: center;
+    position: absolute;
+    top: -11px;
+    right: -24px;
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-weight: 600;
+    font-size: 12px;
+    width: 22px;
+    height: 22px;
+    border-radius: 50%;
+    background: rgb(83, 109, 254);
+    color: rgb(255, 255, 255)
+}
+
+.mdl-button .mdl-badge[data-badge]:after {
+    top: -10px;
+    right: -5px
+}
+
+.mdl-badge.mdl-badge--no-background[data-badge]:after {
+    color: rgb(83, 109, 254);
+    background: rgba(255, 255, 255, .2);
+    box-shadow: 0 0 1px gray
+}
+
+.mdl-badge.mdl-badge--overlap {
+    margin-right: 10px
+}
+
+.mdl-badge.mdl-badge--overlap:after {
+    right: -10px
+}
+
+.mdl-button {
+    background: 0 0;
+    border: none;
+    border-radius: 2px;
+    color: #c9c9c9;
+    position: relative;
+    height: 36px;
+    margin: 0;
+    min-width: 64px;
+    padding: 0 16px;
+    display: inline-block;
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 14px;
+    font-weight: 500;
+    text-transform: uppercase;
+    letter-spacing: 0;
+    overflow: hidden;
+    will-change: box-shadow;
+    transition: box-shadow .2s cubic-bezier(.4, 0, 1, 1), background-color .2s cubic-bezier(.4, 0, .2, 1), color .2s cubic-bezier(.4, 0, .2, 1);
+    outline: none;
+    cursor: pointer;
+    text-decoration: none;
+    text-align: center;
+    line-height: 36px;
+    vertical-align: middle
+}
+
+.mdl-button::-moz-focus-inner {
+    border: 0
+}
+
+.mdl-button:hover {
+    background-color: rgba(158, 158, 158, .2)
+}
+
+.mdl-button:focus:not(:active) {
+    background-color: rgba(0, 0, 0, .12)
+}
+
+.mdl-button:active {
+    background-color: rgba(158, 158, 158, .4)
+}
+
+.mdl-button.mdl-button--colored {
+    color: rgb(96, 125, 139)
+}
+
+.mdl-button.mdl-button--colored:focus:not(:active) {
+    background-color: rgba(0, 0, 0, .12)
+}
+
+input.mdl-button[type="submit"] {
+    -webkit-appearance: none
+}
+
+.mdl-button--raised {
+    background: rgba(158, 158, 158, .2);
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12)
+}
+
+.mdl-button--raised:active {
+    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12), 0 2px 4px -1px rgba(0, 0, 0, .2);
+    background-color: rgba(158, 158, 158, .4)
+}
+
+.mdl-button--raised:focus:not(:active) {
+    box-shadow: 0 0 8px rgba(0, 0, 0, .18), 0 8px 16px rgba(0, 0, 0, .36);
+    background-color: rgba(158, 158, 158, .4)
+}
+
+.mdl-button--raised.mdl-button--colored {
+    background: rgb(96, 125, 139);
+    color: rgb(255, 255, 255)
+}
+
+.mdl-button--raised.mdl-button--colored:hover {
+    background-color: rgb(96, 125, 139)
+}
+
+.mdl-button--raised.mdl-button--colored:active {
+    background-color: rgb(96, 125, 139)
+}
+
+.mdl-button--raised.mdl-button--colored:focus:not(:active) {
+    background-color: rgb(96, 125, 139)
+}
+
+.mdl-button--raised.mdl-button--colored .mdl-ripple {
+    background: rgb(255, 255, 255)
+}
+
+.mdl-button--fab {
+    border-radius: 50%;
+    font-size: 24px;
+    height: 56px;
+    margin: auto;
+    min-width: 56px;
+    width: 56px;
+    padding: 0;
+    overflow: hidden;
+    background: rgba(158, 158, 158, .2);
+    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, .12), 0 1px 1px 0 rgba(0, 0, 0, .24);
+    position: relative;
+    line-height: normal
+}
+
+.mdl-button--fab .material-icons {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    -webkit-transform: translate(-12px, -12px);
+    transform: translate(-12px, -12px);
+    line-height: 24px;
+    width: 24px
+}
+
+.mdl-button--fab.mdl-button--mini-fab {
+    height: 40px;
+    min-width: 40px;
+    width: 40px
+}
+
+.mdl-button--fab .mdl-button__ripple-container {
+    border-radius: 50%;
+    -webkit-mask-image: -webkit-radial-gradient(circle, #fff, #000)
+}
+
+.mdl-button--fab:active {
+    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12), 0 2px 4px -1px rgba(0, 0, 0, .2);
+    background-color: rgba(158, 158, 158, .4)
+}
+
+.mdl-button--fab:focus:not(:active) {
+    box-shadow: 0 0 8px rgba(0, 0, 0, .18), 0 8px 16px rgba(0, 0, 0, .36);
+    background-color: rgba(158, 158, 158, .4)
+}
+
+.mdl-button--fab.mdl-button--colored {
+    background: rgb(83, 109, 254);
+    color: rgb(255, 255, 255)
+}
+
+.mdl-button--fab.mdl-button--colored:hover {
+    background-color: rgb(83, 109, 254)
+}
+
+.mdl-button--fab.mdl-button--colored:focus:not(:active) {
+    background-color: rgb(83, 109, 254)
+}
+
+.mdl-button--fab.mdl-button--colored:active {
+    background-color: rgb(83, 109, 254)
+}
+
+.mdl-button--fab.mdl-button--colored .mdl-ripple {
+    background: rgb(255, 255, 255)
+}
+
+.mdl-button--icon {
+    border-radius: 50%;
+    font-size: 24px;
+    height: 32px;
+    margin-left: 0;
+    margin-right: 0;
+    min-width: 32px;
+    width: 32px;
+    padding: 0;
+    overflow: hidden;
+    color: inherit;
+    line-height: normal
+}
+
+.mdl-button--icon .material-icons {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    -webkit-transform: translate(-12px, -12px);
+    transform: translate(-12px, -12px);
+    line-height: 24px;
+    width: 24px
+}
+
+.mdl-button--icon.mdl-button--mini-icon {
+    height: 24px;
+    min-width: 24px;
+    width: 24px
+}
+
+.mdl-button--icon.mdl-button--mini-icon .material-icons {
+    top: 0;
+    left: 0
+}
+
+.mdl-button--icon .mdl-button__ripple-container {
+    border-radius: 50%;
+    -webkit-mask-image: -webkit-radial-gradient(circle, #fff, #000)
+}
+
+.mdl-button__ripple-container {
+    display: block;
+    height: 100%;
+    left: 0;
+    position: absolute;
+    top: 0;
+    width: 100%;
+    z-index: 0;
+    overflow: hidden
+}
+
+.mdl-button[disabled] .mdl-button__ripple-container .mdl-ripple,
+.mdl-button.mdl-button--disabled .mdl-button__ripple-container .mdl-ripple {
+    background-color: transparent
+}
+
+.mdl-button--primary.mdl-button--primary {
+    color: rgb(96, 125, 139)
+}
+
+.mdl-button--primary.mdl-button--primary .mdl-ripple {
+    background: rgb(255, 255, 255)
+}
+
+.mdl-button--primary.mdl-button--primary.mdl-button--raised,
+.mdl-button--primary.mdl-button--primary.mdl-button--fab {
+    color: rgb(255, 255, 255);
+    background-color: rgb(96, 125, 139)
+}
+
+.mdl-button--accent.mdl-button--accent {
+    color: rgb(83, 109, 254)
+}
+
+.mdl-button--accent.mdl-button--accent .mdl-ripple {
+    background: rgb(255, 255, 255)
+}
+
+.mdl-button--accent.mdl-button--accent.mdl-button--raised,
+.mdl-button--accent.mdl-button--accent.mdl-button--fab {
+    color: rgb(255, 255, 255);
+    background-color: rgb(83, 109, 254)
+}
+
+.mdl-button[disabled][disabled],
+.mdl-button.mdl-button--disabled.mdl-button--disabled {
+    color: rgba(0, 0, 0, .26);
+    cursor: default;
+    background-color: transparent
+}
+
+.mdl-button--fab[disabled][disabled],
+.mdl-button--fab.mdl-button--disabled.mdl-button--disabled {
+    background-color: rgba(0, 0, 0, .12);
+    color: rgba(0, 0, 0, .26)
+}
+
+.mdl-button--raised[disabled][disabled],
+.mdl-button--raised.mdl-button--disabled.mdl-button--disabled {
+    background-color: rgba(0, 0, 0, .12);
+    color: rgba(0, 0, 0, .26);
+    box-shadow: none
+}
+
+.mdl-button--colored[disabled][disabled],
+.mdl-button--colored.mdl-button--disabled.mdl-button--disabled {
+    color: rgba(0, 0, 0, .26)
+}
+
+.mdl-button .material-icons {
+    vertical-align: middle
+}
+
+.mdl-card {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    font-size: 16px;
+    font-weight: 400;
+    min-height: 200px;
+    overflow: hidden;
+    width: 330px;
+    z-index: 1;
+    position: relative;
+    background: #161B22;
+    border-radius: 2px;
+    box-sizing: border-box
+}
+
+.mdl-card__media {
+    background-color: rgb(83, 109, 254);
+    background-repeat: repeat;
+    background-position: 50% 50%;
+    background-size: cover;
+    background-origin: padding-box;
+    background-attachment: scroll;
+    box-sizing: border-box
+}
+
+.mdl-card__title {
+    -webkit-align-items: center;
+    -ms-flex-align: center;
+    align-items: center;
+    color: #000;
+    display: block;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-justify-content: stretch;
+    -ms-flex-pack: stretch;
+    justify-content: stretch;
+    line-height: normal;
+    padding: 16px;
+    -webkit-perspective-origin: 165px 56px;
+    perspective-origin: 165px 56px;
+    -webkit-transform-origin: 165px 56px;
+    transform-origin: 165px 56px;
+    box-sizing: border-box
+}
+
+.mdl-card__title.mdl-card--border {
+    border-bottom: 1px solid rgba(0, 0, 0, .1)
+}
+
+.mdl-card__title-text {
+    -webkit-align-self: flex-end;
+    -ms-flex-item-align: end;
+    align-self: flex-end;
+    color: inherit;
+    display: block;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    font-size: 24px;
+    font-weight: 300;
+    line-height: normal;
+    overflow: hidden;
+    -webkit-transform-origin: 149px 48px;
+    transform-origin: 149px 48px;
+    margin: 0
+}
+
+.mdl-card__subtitle-text {
+    font-size: 14px;
+    color: rgba(0, 0, 0, .54);
+    margin: 0
+}
+
+.mdl-card__supporting-text {
+    color: rgba(0, 0, 0, .54);
+    font-size: 1rem;
+    line-height: 18px;
+    overflow: hidden;
+    padding: 16px;
+    width: 90%
+}
+
+.mdl-card__actions {
+    font-size: 16px;
+    line-height: normal;
+    width: 100%;
+    background-color: transparent;
+    padding: 8px;
+    box-sizing: border-box
+}
+
+.mdl-card__actions.mdl-card--border {
+    border-top: 1px solid rgba(0, 0, 0, .1)
+}
+
+.mdl-card--expand {
+    -webkit-flex-grow: 1;
+    -ms-flex-positive: 1;
+    flex-grow: 1
+}
+
+.mdl-card__menu {
+    position: absolute;
+    right: 16px;
+    top: 16px
+}
+
+.mdl-checkbox {
+    position: relative;
+    z-index: 1;
+    vertical-align: middle;
+    display: inline-block;
+    box-sizing: border-box;
+    width: 100%;
+    height: 24px;
+    margin: 0;
+    padding: 0
+}
+
+.mdl-checkbox.is-upgraded {
+    padding-left: 24px
+}
+
+.mdl-checkbox__input {
+    line-height: 24px
+}
+
+.mdl-checkbox.is-upgraded .mdl-checkbox__input {
+    position: absolute;
+    width: 0;
+    height: 0;
+    margin: 0;
+    padding: 0;
+    opacity: 0;
+    -ms-appearance: none;
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    appearance: none;
+    border: none
+}
+
+.mdl-checkbox__box-outline {
+    position: absolute;
+    top: 3px;
+    left: 0;
+    display: inline-block;
+    box-sizing: border-box;
+    width: 16px;
+    height: 16px;
+    margin: 0;
+    cursor: pointer;
+    overflow: hidden;
+    border: 2px solid rgba(0, 0, 0, .54);
+    border-radius: 2px;
+    z-index: 2
+}
+
+.mdl-checkbox.is-checked .mdl-checkbox__box-outline {
+    border: 2px solid rgb(96, 125, 139)
+}
+
+fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline,
+.mdl-checkbox.is-disabled .mdl-checkbox__box-outline {
+    border: 2px solid rgba(0, 0, 0, .26);
+    cursor: auto
+}
+
+.mdl-checkbox__focus-helper {
+    position: absolute;
+    top: 3px;
+    left: 0;
+    display: inline-block;
+    box-sizing: border-box;
+    width: 16px;
+    height: 16px;
+    border-radius: 50%;
+    background-color: transparent
+}
+
+.mdl-checkbox.is-focused .mdl-checkbox__focus-helper {
+    box-shadow: 0 0 0 8px rgba(0, 0, 0, .1);
+    background-color: rgba(0, 0, 0, .1)
+}
+
+.mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper {
+    box-shadow: 0 0 0 8px rgba(96, 125, 139, .26);
+    background-color: rgba(96, 125, 139, .26)
+}
+
+.mdl-checkbox__tick-outline {
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+    -webkit-mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==");
+    mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==");
+    background: 0 0;
+    transition-duration: .28s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+    transition-property: background
+}
+
+.mdl-checkbox.is-checked .mdl-checkbox__tick-outline {
+    background: rgb(96, 125, 139)url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K")
+}
+
+fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline,
+.mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline {
+    background: rgba(0, 0, 0, .26)url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K")
+}
+
+.mdl-checkbox__label {
+    position: relative;
+    cursor: pointer;
+    font-size: 16px;
+    line-height: 24px;
+    margin: 0;
+    color: #c9c9c9;
+}
+
+fieldset[disabled] .mdl-checkbox .mdl-checkbox__label,
+.mdl-checkbox.is-disabled .mdl-checkbox__label {
+    color: rgba(0, 0, 0, .26);
+    cursor: auto
+}
+
+.mdl-checkbox__ripple-container {
+    position: absolute;
+    z-index: 2;
+    top: -6px;
+    left: -10px;
+    box-sizing: border-box;
+    width: 36px;
+    height: 36px;
+    border-radius: 50%;
+    cursor: pointer;
+    overflow: hidden;
+    -webkit-mask-image: -webkit-radial-gradient(circle, #fff, #000)
+}
+
+.mdl-checkbox__ripple-container .mdl-ripple {
+    background: rgb(96, 125, 139)
+}
+
+fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container,
+.mdl-checkbox.is-disabled .mdl-checkbox__ripple-container {
+    cursor: auto
+}
+
+fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple,
+.mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple {
+    background: 0 0
+}
+
+.mdl-chip {
+    height: 32px;
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    line-height: 32px;
+    padding: 0 12px;
+    border: 0;
+    border-radius: 16px;
+    background-color: #dedede;
+    display: inline-block;
+    color: rgba(0, 0, 0, .87);
+    margin: 2px 0;
+    font-size: 0;
+    white-space: nowrap
+}
+
+.mdl-chip__text {
+    font-size: 13px;
+    vertical-align: middle;
+    display: inline-block
+}
+
+.mdl-chip__action {
+    height: 24px;
+    width: 24px;
+    background: 0 0;
+    opacity: .54;
+    cursor: pointer;
+    padding: 0;
+    margin: 0 0 0 4px;
+    font-size: 13px;
+    text-decoration: none;
+    color: rgba(0, 0, 0, .87);
+    border: none;
+    outline: none
+}
+
+.mdl-chip__action,
+.mdl-chip__contact {
+    display: inline-block;
+    vertical-align: middle;
+    overflow: hidden;
+    text-align: center
+}
+
+.mdl-chip__contact {
+    height: 32px;
+    width: 32px;
+    border-radius: 16px;
+    margin-right: 8px;
+    font-size: 18px;
+    line-height: 32px
+}
+
+.mdl-chip:focus {
+    outline: 0;
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12)
+}
+
+.mdl-chip:active {
+    background-color: #d6d6d6
+}
+
+.mdl-chip--deletable {
+    padding-right: 4px
+}
+
+.mdl-chip--contact {
+    padding-left: 0
+}
+
+.mdl-data-table {
+    position: relative;
+    border: 1px solid #161B22;
+    border-collapse: collapse;
+    white-space: nowrap;
+    font-size: 13px;
+    background-color: #161B22;
+}
+
+.mdl-data-table thead {
+    padding-bottom: 3px
+}
+
+.mdl-data-table thead .mdl-data-table__select {
+    margin-top: 0
+}
+
+.mdl-data-table tbody tr {
+    position: relative;
+    height: 48px;
+    transition-duration: .28s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+    transition-property: background-color
+}
+
+.mdl-data-table tbody tr.is-selected {
+    background-color: #0D1117
+}
+
+.mdl-data-table tbody tr:hover {
+    background-color: #0D1117;
+}
+
+.mdl-data-table td {
+    text-align: right
+}
+
+.mdl-data-table th {
+    padding: 0 18px 12px 18px;
+    text-align: right
+}
+
+.mdl-data-table td:first-of-type,
+.mdl-data-table th:first-of-type {
+    padding-left: 24px
+}
+
+.mdl-data-table td:last-of-type,
+.mdl-data-table th:last-of-type {
+    padding-right: 24px
+}
+
+.mdl-data-table td {
+    position: relative;
+    height: 48px;
+    border-top: 1px solid rgba(0, 0, 0, .12);
+    border-bottom: 1px solid rgba(0, 0, 0, .12);
+    padding: 12px 18px;
+    box-sizing: border-box;
+    color: #c9c9c9;
+}
+
+.mdl-data-table td,
+.mdl-data-table td .mdl-data-table__select {
+    vertical-align: middle
+}
+
+.mdl-data-table th {
+    position: relative;
+    vertical-align: bottom;
+    text-overflow: ellipsis;
+    font-weight: 700;
+    line-height: 24px;
+    letter-spacing: 0;
+    height: 48px;
+    font-size: 12px;
+    color: rgba(0, 0, 0, .54);
+    padding-bottom: 8px;
+    box-sizing: border-box
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-ascending,
+.mdl-data-table th.mdl-data-table__header--sorted-descending {
+    color: rgba(0, 0, 0, .87)
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-ascending:before,
+.mdl-data-table th.mdl-data-table__header--sorted-descending:before {
+    font-family: 'Material Icons';
+    font-weight: 400;
+    font-style: normal;
+    line-height: 1;
+    letter-spacing: normal;
+    text-transform: none;
+    display: inline-block;
+    word-wrap: normal;
+    -moz-font-feature-settings: 'liga';
+    font-feature-settings: 'liga';
+    -webkit-font-feature-settings: 'liga';
+    -webkit-font-smoothing: antialiased;
+    font-size: 16px;
+    content: "\e5d8";
+    margin-right: 5px;
+    vertical-align: sub
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover,
+.mdl-data-table th.mdl-data-table__header--sorted-descending:hover {
+    cursor: pointer
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before,
+.mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before {
+    color: rgba(0, 0, 0, .26)
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-descending:before {
+    content: "\e5db"
+}
+
+.mdl-data-table__select {
+    width: 16px
+}
+
+.mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric {
+    text-align: left
+}
+
+.mdl-dialog {
+    border: none;
+    box-shadow: 0 9px 46px 8px rgba(0, 0, 0, .14), 0 11px 15px -7px rgba(0, 0, 0, .12), 0 24px 38px 3px rgba(0, 0, 0, .2);
+    width: 280px
+}
+
+.mdl-dialog__title {
+    padding: 24px 24px 0;
+    margin: 0;
+    font-size: 2.5rem
+}
+
+.mdl-dialog__actions {
+    padding: 8px 8px 8px 24px;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: row-reverse;
+    -ms-flex-direction: row-reverse;
+    flex-direction: row-reverse;
+    -webkit-flex-wrap: wrap;
+    -ms-flex-wrap: wrap;
+    flex-wrap: wrap
+}
+
+.mdl-dialog__actions>* {
+    margin-right: 8px;
+    height: 36px
+}
+
+.mdl-dialog__actions>*:first-child {
+    margin-right: 0
+}
+
+.mdl-dialog__actions--full-width {
+    padding: 0 0 8px
+}
+
+.mdl-dialog__actions--full-width>* {
+    height: 48px;
+    -webkit-flex: 0 0 100%;
+    -ms-flex: 0 0 100%;
+    flex: 0 0 100%;
+    padding-right: 16px;
+    margin-right: 0;
+    text-align: right
+}
+
+.mdl-dialog__content {
+    padding: 20px 24px 24px;
+    color: rgba(0, 0, 0, .54)
+}
+
+.mdl-mega-footer {
+    padding: 16px 40px;
+    color: #9e9e9e;
+    background-color: #424242
+}
+
+.mdl-mega-footer--top-section:after,
+.mdl-mega-footer--middle-section:after,
+.mdl-mega-footer--bottom-section:after,
+.mdl-mega-footer__top-section:after,
+.mdl-mega-footer__middle-section:after,
+.mdl-mega-footer__bottom-section:after {
+    content: '';
+    display: block;
+    clear: both
+}
+
+.mdl-mega-footer--left-section,
+.mdl-mega-footer__left-section,
+.mdl-mega-footer--right-section,
+.mdl-mega-footer__right-section {
+    margin-bottom: 16px
+}
+
+.mdl-mega-footer--right-section a,
+.mdl-mega-footer__right-section a {
+    display: block;
+    margin-bottom: 16px;
+    color: inherit;
+    text-decoration: none
+}
+
+@media screen and (min-width:760px) {
+    .mdl-mega-footer--left-section,
+    .mdl-mega-footer__left-section {
+        float: left
+    }
+    .mdl-mega-footer--right-section,
+    .mdl-mega-footer__right-section {
+        float: right
+    }
+    .mdl-mega-footer--right-section a,
+    .mdl-mega-footer__right-section a {
+        display: inline-block;
+        margin-left: 16px;
+        line-height: 36px;
+        vertical-align: middle
+    }
+}
+
+.mdl-mega-footer--social-btn,
+.mdl-mega-footer__social-btn {
+    width: 36px;
+    height: 36px;
+    padding: 0;
+    margin: 0;
+    background-color: #9e9e9e;
+    border: none
+}
+
+.mdl-mega-footer--drop-down-section,
+.mdl-mega-footer__drop-down-section {
+    display: block;
+    position: relative
+}
+
+@media screen and (min-width:760px) {
+    .mdl-mega-footer--drop-down-section,
+    .mdl-mega-footer__drop-down-section {
+        width: 33%
+    }
+    .mdl-mega-footer--drop-down-section:nth-child(1),
+    .mdl-mega-footer--drop-down-section:nth-child(2),
+    .mdl-mega-footer__drop-down-section:nth-child(1),
+    .mdl-mega-footer__drop-down-section:nth-child(2) {
+        float: left
+    }
+    .mdl-mega-footer--drop-down-section:nth-child(3),
+    .mdl-mega-footer__drop-down-section:nth-child(3) {
+        float: right
+    }
+    .mdl-mega-footer--drop-down-section:nth-child(3):after,
+    .mdl-mega-footer__drop-down-section:nth-child(3):after {
+        clear: right
+    }
+    .mdl-mega-footer--drop-down-section:nth-child(4),
+    .mdl-mega-footer__drop-down-section:nth-child(4) {
+        clear: right;
+        float: right
+    }
+    .mdl-mega-footer--middle-section:after,
+    .mdl-mega-footer__middle-section:after {
+        content: '';
+        display: block;
+        clear: both
+    }
+    .mdl-mega-footer--bottom-section,
+    .mdl-mega-footer__bottom-section {
+        padding-top: 0
+    }
+}
+
+@media screen and (min-width:1024px) {
+    .mdl-mega-footer--drop-down-section,
+    .mdl-mega-footer--drop-down-section:nth-child(3),
+    .mdl-mega-footer--drop-down-section:nth-child(4),
+    .mdl-mega-footer__drop-down-section,
+    .mdl-mega-footer__drop-down-section:nth-child(3),
+    .mdl-mega-footer__drop-down-section:nth-child(4) {
+        width: 24%;
+        float: left
+    }
+}
+
+.mdl-mega-footer--heading-checkbox,
+.mdl-mega-footer__heading-checkbox {
+    position: absolute;
+    width: 100%;
+    height: 55.8px;
+    padding: 32px;
+    margin: -16px 0 0;
+    cursor: pointer;
+    z-index: 1;
+    opacity: 0
+}
+
+.mdl-mega-footer--heading-checkbox+.mdl-mega-footer--heading:after,
+.mdl-mega-footer--heading-checkbox+.mdl-mega-footer__heading:after,
+.mdl-mega-footer__heading-checkbox+.mdl-mega-footer--heading:after,
+.mdl-mega-footer__heading-checkbox+.mdl-mega-footer__heading:after {
+    font-family: 'Material Icons';
+    content: '\E5CE'
+}
+
+.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer--link-list,
+.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer__link-list,
+.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list,
+.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list,
+.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer--link-list,
+.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer__link-list,
+.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list,
+.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list {
+    display: none
+}
+
+.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading:after,
+.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading:after,
+.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading:after,
+.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading:after {
+    font-family: 'Material Icons';
+    content: '\E5CF'
+}
+
+.mdl-mega-footer--heading,
+.mdl-mega-footer__heading {
+    position: relative;
+    width: 100%;
+    padding-right: 39.8px;
+    margin-bottom: 16px;
+    box-sizing: border-box;
+    font-size: 14px;
+    line-height: 23.8px;
+    font-weight: 500;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    color: #e0e0e0
+}
+
+.mdl-mega-footer--heading:after,
+.mdl-mega-footer__heading:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    right: 0;
+    display: block;
+    width: 23.8px;
+    height: 23.8px;
+    background-size: cover
+}
+
+.mdl-mega-footer--link-list,
+.mdl-mega-footer__link-list {
+    list-style: none;
+    padding: 0;
+    margin: 0 0 32px
+}
+
+.mdl-mega-footer--link-list:after,
+.mdl-mega-footer__link-list:after {
+    clear: both;
+    display: block;
+    content: ''
+}
+
+.mdl-mega-footer--link-list li,
+.mdl-mega-footer__link-list li {
+    font-size: 14px;
+    font-weight: 400;
+    letter-spacing: 0;
+    line-height: 20px
+}
+
+.mdl-mega-footer--link-list a,
+.mdl-mega-footer__link-list a {
+    color: inherit;
+    text-decoration: none;
+    white-space: nowrap
+}
+
+@media screen and (min-width:760px) {
+    .mdl-mega-footer--heading-checkbox,
+    .mdl-mega-footer__heading-checkbox {
+        display: none
+    }
+    .mdl-mega-footer--heading-checkbox+.mdl-mega-footer--heading:after,
+    .mdl-mega-footer--heading-checkbox+.mdl-mega-footer__heading:after,
+    .mdl-mega-footer__heading-checkbox+.mdl-mega-footer--heading:after,
+    .mdl-mega-footer__heading-checkbox+.mdl-mega-footer__heading:after {
+        content: ''
+    }
+    .mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer--link-list,
+    .mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer__link-list,
+    .mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list,
+    .mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list,
+    .mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer--link-list,
+    .mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer__link-list,
+    .mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list,
+    .mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list {
+        display: block
+    }
+    .mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading:after,
+    .mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading:after,
+    .mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading:after,
+    .mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading:after {
+        content: ''
+    }
+}
+
+.mdl-mega-footer--bottom-section,
+.mdl-mega-footer__bottom-section {
+    padding-top: 16px;
+    margin-bottom: 16px
+}
+
+.mdl-logo {
+    margin-bottom: 16px;
+    color: #fff
+}
+
+.mdl-mega-footer--bottom-section .mdl-mega-footer--link-list li,
+.mdl-mega-footer__bottom-section .mdl-mega-footer__link-list li {
+    float: left;
+    margin-bottom: 0;
+    margin-right: 16px
+}
+
+@media screen and (min-width:760px) {
+    .mdl-logo {
+        float: left;
+        margin-bottom: 0;
+        margin-right: 16px
+    }
+}
+
+.mdl-mini-footer {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-flow: row wrap;
+    -ms-flex-flow: row wrap;
+    flex-flow: row wrap;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    padding: 32px 16px;
+    color: #9e9e9e;
+    background-color: #424242
+}
+
+.mdl-mini-footer:after {
+    content: '';
+    display: block
+}
+
+.mdl-mini-footer .mdl-logo {
+    line-height: 36px
+}
+
+.mdl-mini-footer--link-list,
+.mdl-mini-footer__link-list {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-flow: row nowrap;
+    -ms-flex-flow: row nowrap;
+    flex-flow: row nowrap;
+    list-style: none;
+    margin: 0;
+    padding: 0
+}
+
+.mdl-mini-footer--link-list li,
+.mdl-mini-footer__link-list li {
+    margin-bottom: 0;
+    margin-right: 16px
+}
+
+@media screen and (min-width:760px) {
+    .mdl-mini-footer--link-list li,
+    .mdl-mini-footer__link-list li {
+        line-height: 36px
+    }
+}
+
+.mdl-mini-footer--link-list a,
+.mdl-mini-footer__link-list a {
+    color: inherit;
+    text-decoration: none;
+    white-space: nowrap
+}
+
+.mdl-mini-footer--left-section,
+.mdl-mini-footer__left-section {
+    display: inline-block;
+    -webkit-order: 0;
+    -ms-flex-order: 0;
+    order: 0
+}
+
+.mdl-mini-footer--right-section,
+.mdl-mini-footer__right-section {
+    display: inline-block;
+    -webkit-order: 1;
+    -ms-flex-order: 1;
+    order: 1
+}
+
+.mdl-mini-footer--social-btn,
+.mdl-mini-footer__social-btn {
+    width: 36px;
+    height: 36px;
+    padding: 0;
+    margin: 0;
+    background-color: #9e9e9e;
+    border: none
+}
+
+.mdl-icon-toggle {
+    position: relative;
+    z-index: 1;
+    vertical-align: middle;
+    display: inline-block;
+    height: 32px;
+    margin: 0;
+    padding: 0
+}
+
+.mdl-icon-toggle__input {
+    line-height: 32px
+}
+
+.mdl-icon-toggle.is-upgraded .mdl-icon-toggle__input {
+    position: absolute;
+    width: 0;
+    height: 0;
+    margin: 0;
+    padding: 0;
+    opacity: 0;
+    -ms-appearance: none;
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    appearance: none;
+    border: none
+}
+
+.mdl-icon-toggle__label {
+    display: inline-block;
+    position: relative;
+    cursor: pointer;
+    height: 32px;
+    width: 32px;
+    min-width: 32px;
+    color: #616161;
+    border-radius: 50%;
+    padding: 0;
+    margin-left: 0;
+    margin-right: 0;
+    text-align: center;
+    background-color: transparent;
+    will-change: background-color;
+    transition: background-color .2s cubic-bezier(.4, 0, .2, 1), color .2s cubic-bezier(.4, 0, .2, 1)
+}
+
+.mdl-icon-toggle__label.material-icons {
+    line-height: 32px;
+    font-size: 24px
+}
+
+.mdl-icon-toggle.is-checked .mdl-icon-toggle__label {
+    color: rgb(96, 125, 139)
+}
+
+.mdl-icon-toggle.is-disabled .mdl-icon-toggle__label {
+    color: rgba(0, 0, 0, .26);
+    cursor: auto;
+    transition: none
+}
+
+.mdl-icon-toggle.is-focused .mdl-icon-toggle__label {
+    background-color: rgba(0, 0, 0, .12)
+}
+
+.mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label {
+    background-color: rgba(96, 125, 139, .26)
+}
+
+.mdl-icon-toggle__ripple-container {
+    position: absolute;
+    z-index: 2;
+    top: -2px;
+    left: -2px;
+    box-sizing: border-box;
+    width: 36px;
+    height: 36px;
+    border-radius: 50%;
+    cursor: pointer;
+    overflow: hidden;
+    -webkit-mask-image: -webkit-radial-gradient(circle, #fff, #000)
+}
+
+.mdl-icon-toggle__ripple-container .mdl-ripple {
+    background: #616161
+}
+
+.mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container {
+    cursor: auto
+}
+
+.mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple {
+    background: 0 0
+}
+
+.mdl-list {
+    display: block;
+    padding: 8px 0;
+    list-style: none
+}
+
+.mdl-list__item {
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 16px;
+    font-weight: 400;
+    letter-spacing: .04em;
+    line-height: 1;
+    min-height: 48px;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+    -webkit-flex-wrap: nowrap;
+    -ms-flex-wrap: nowrap;
+    flex-wrap: nowrap;
+    padding: 16px;
+    cursor: default;
+    color: #c9c9c9;
+    overflow: hidden
+}
+
+.mdl-list__item,
+.mdl-list__item .mdl-list__item-primary-content {
+    box-sizing: border-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -ms-flex-align: center;
+    align-items: center
+}
+
+.mdl-list__item .mdl-list__item-primary-content {
+    -webkit-order: 0;
+    -ms-flex-order: 0;
+    order: 0;
+    -webkit-flex-grow: 2;
+    -ms-flex-positive: 2;
+    flex-grow: 2;
+    text-decoration: none
+}
+
+.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-icon {
+    margin-right: 32px
+}
+
+.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-avatar {
+    margin-right: 16px
+}
+
+.mdl-list__item .mdl-list__item-secondary-content {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-flow: column;
+    -ms-flex-flow: column;
+    flex-flow: column;
+    -webkit-align-items: flex-end;
+    -ms-flex-align: end;
+    align-items: flex-end;
+    margin-left: 16px
+}
+
+.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-action label {
+    display: inline
+}
+
+.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-info {
+    font-size: 12px;
+    font-weight: 400;
+    line-height: 1;
+    letter-spacing: 0;
+    color: rgba(0, 0, 0, .54)
+}
+
+.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-sub-header {
+    padding: 0 0 0 16px
+}
+
+.mdl-list__item-icon,
+.mdl-list__item-icon.material-icons {
+    height: 24px;
+    width: 24px;
+    font-size: 24px;
+    box-sizing: border-box;
+    color: #757575
+}
+
+.mdl-list__item-avatar,
+.mdl-list__item-avatar.material-icons {
+    height: 40px;
+    width: 40px;
+    box-sizing: border-box;
+    border-radius: 50%;
+    background-color: #757575;
+    font-size: 40px;
+    color: #fff
+}
+
+.mdl-list__item--two-line {
+    height: 72px
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content {
+    height: 36px;
+    line-height: 20px;
+    display: block
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-avatar {
+    float: left
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-icon {
+    float: left;
+    margin-top: 6px
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-secondary-content {
+    height: 36px
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-sub-title {
+    font-size: 14px;
+    font-weight: 400;
+    letter-spacing: 0;
+    line-height: 18px;
+    color: #555555;
+    display: block;
+    padding: 0
+}
+
+.mdl-list__item--three-line {
+    height: 88px
+}
+
+.mdl-list__item--three-line .mdl-list__item-primary-content {
+    height: 52px;
+    line-height: 20px;
+    display: block
+}
+
+.mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-avatar,
+.mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-icon {
+    float: left
+}
+
+.mdl-list__item--three-line .mdl-list__item-secondary-content {
+    height: 52px
+}
+
+.mdl-list__item--three-line .mdl-list__item-text-body {
+    font-size: 14px;
+    font-weight: 400;
+    letter-spacing: 0;
+    line-height: 18px;
+    height: 52px;
+    color: rgba(0, 0, 0, .54);
+    display: block;
+    padding: 0
+}
+
+.mdl-menu__container {
+    display: block;
+    margin: 0;
+    padding: 0;
+    border: none;
+    position: absolute;
+    overflow: visible;
+    height: 0;
+    width: 0;
+    visibility: hidden;
+    z-index: -1
+}
+
+.mdl-menu__container.is-visible,
+.mdl-menu__container.is-animating {
+    z-index: 999;
+    visibility: visible
+}
+
+.mdl-menu__outline {
+    display: block;
+    background: #0D1117;
+    margin: 0;
+    padding: 0;
+    border: none;
+    border-radius: 2px;
+    position: absolute;
+    top: 0;
+    left: 0;
+    overflow: hidden;
+    opacity: 0;
+    -webkit-transform: scale(0);
+    transform: scale(0);
+    -webkit-transform-origin: 0 0;
+    transform-origin: 0 0;
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
+    will-change: transform;
+    transition: transform .3s cubic-bezier(.4, 0, .2, 1), opacity .2s cubic-bezier(.4, 0, .2, 1);
+    transition: transform .3s cubic-bezier(.4, 0, .2, 1), opacity .2s cubic-bezier(.4, 0, .2, 1), -webkit-transform .3s cubic-bezier(.4, 0, .2, 1);
+    z-index: -1
+}
+
+.mdl-menu__container.is-visible .mdl-menu__outline {
+    opacity: 1;
+    -webkit-transform: scale(1);
+    transform: scale(1);
+    z-index: 999
+}
+
+.mdl-menu__outline.mdl-menu--bottom-right {
+    -webkit-transform-origin: 100% 0;
+    transform-origin: 100% 0
+}
+
+.mdl-menu__outline.mdl-menu--top-left {
+    -webkit-transform-origin: 0 100%;
+    transform-origin: 0 100%
+}
+
+.mdl-menu__outline.mdl-menu--top-right {
+    -webkit-transform-origin: 100% 100%;
+    transform-origin: 100% 100%
+}
+
+.mdl-menu {
+    position: absolute;
+    list-style: none;
+    top: 0;
+    left: 0;
+    height: auto;
+    width: auto;
+    min-width: 124px;
+    padding: 8px 0;
+    margin: 0;
+    opacity: 0;
+    clip: rect(0 0 0 0);
+    z-index: -1
+}
+
+.mdl-menu__container.is-visible .mdl-menu {
+    opacity: 1;
+    z-index: 999
+}
+
+.mdl-menu.is-animating {
+    transition: opacity .2s cubic-bezier(.4, 0, .2, 1), clip .3s cubic-bezier(.4, 0, .2, 1)
+}
+
+.mdl-menu.mdl-menu--bottom-right {
+    left: auto;
+    right: 0
+}
+
+.mdl-menu.mdl-menu--top-left {
+    top: auto;
+    bottom: 0
+}
+
+.mdl-menu.mdl-menu--top-right {
+    top: auto;
+    left: auto;
+    bottom: 0;
+    right: 0
+}
+
+.mdl-menu.mdl-menu--unaligned {
+    top: auto;
+    left: auto
+}
+
+.mdl-menu__item {
+    display: block;
+    border: none;
+    color: #c9c9c9;
+    background-color: transparent;
+    text-align: left;
+    margin: 0;
+    padding: 0 16px;
+    outline-color: #bdbdbd;
+    position: relative;
+    overflow: hidden;
+    font-size: 14px;
+    font-weight: 400;
+    letter-spacing: 0;
+    text-decoration: none;
+    cursor: pointer;
+    height: 48px;
+    line-height: 48px;
+    white-space: nowrap;
+    opacity: 0;
+    transition: opacity .2s cubic-bezier(.4, 0, .2, 1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none
+}
+
+.mdl-menu__container.is-visible .mdl-menu__item {
+    opacity: 1
+}
+
+.mdl-menu__item::-moz-focus-inner {
+    border: 0
+}
+
+.mdl-menu__item--full-bleed-divider {
+    border-bottom: 1px solid rgba(0, 0, 0, .12)
+}
+
+.mdl-menu__item[disabled],
+.mdl-menu__item[data-mdl-disabled] {
+    color: #bdbdbd;
+    background-color: transparent;
+    cursor: auto
+}
+
+.mdl-menu__item[disabled]:hover,
+.mdl-menu__item[data-mdl-disabled]:hover {
+    background-color: transparent
+}
+
+.mdl-menu__item[disabled]:focus,
+.mdl-menu__item[data-mdl-disabled]:focus {
+    background-color: transparent
+}
+
+.mdl-menu__item[disabled] .mdl-ripple,
+.mdl-menu__item[data-mdl-disabled] .mdl-ripple {
+    background: 0 0
+}
+
+.mdl-menu__item:hover {
+    background-color: #161B22;
+}
+
+.mdl-menu__item:focus {
+    outline: none;
+    background-color: #161B22;
+}
+
+.mdl-menu__item:active {
+    background-color: #161B22;
+}
+
+.mdl-menu__item--ripple-container {
+    display: block;
+    height: 100%;
+    left: 0;
+    position: absolute;
+    top: 0;
+    width: 100%;
+    z-index: 0;
+    overflow: hidden
+}
+
+.mdl-progress {
+    display: block;
+    position: relative;
+    height: 4px;
+    width: 500px;
+    max-width: 100%
+}
+
+.mdl-progress>.bar {
+    display: block;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    width: 0%;
+    transition: width .2s cubic-bezier(.4, 0, .2, 1)
+}
+
+.mdl-progress>.progressbar {
+    background-color: rgb(96, 125, 139);
+    z-index: 1;
+    left: 0
+}
+
+.mdl-progress>.bufferbar {
+    background-image: linear-gradient(to right, rgba(255, 255, 255, .7), rgba(255, 255, 255, .7)), linear-gradient(to right, rgb(96, 125, 139), rgb(96, 125, 139));
+    z-index: 0;
+    left: 0
+}
+
+.mdl-progress>.auxbar {
+    right: 0
+}
+
+@supports (-webkit-appearance:none) {
+    .mdl-progress:not(.mdl-progress--indeterminate):not(.mdl-progress--indeterminate)>.auxbar,
+    .mdl-progress:not(.mdl-progress__indeterminate):not(.mdl-progress__indeterminate)>.auxbar {
+        background-image: linear-gradient(to right, rgba(255, 255, 255, .7), rgba(255, 255, 255, .7)), linear-gradient(to right, rgb(96, 125, 139), rgb(96, 125, 139));
+        -webkit-mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=");
+        mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=")
+    }
+}
+
+.mdl-progress:not(.mdl-progress--indeterminate)>.auxbar,
+.mdl-progress:not(.mdl-progress__indeterminate)>.auxbar {
+    background-image: linear-gradient(to right, rgba(255, 255, 255, .9), rgba(255, 255, 255, .9)), linear-gradient(to right, rgb(96, 125, 139), rgb(96, 125, 139))
+}
+
+.mdl-progress.mdl-progress--indeterminate>.bar1,
+.mdl-progress.mdl-progress__indeterminate>.bar1 {
+    -webkit-animation-name: indeterminate1;
+    animation-name: indeterminate1
+}
+
+.mdl-progress.mdl-progress--indeterminate>.bar1,
+.mdl-progress.mdl-progress__indeterminate>.bar1,
+.mdl-progress.mdl-progress--indeterminate>.bar3,
+.mdl-progress.mdl-progress__indeterminate>.bar3 {
+    background-color: rgb(96, 125, 139);
+    -webkit-animation-duration: 2s;
+    animation-duration: 2s;
+    -webkit-animation-iteration-count: infinite;
+    animation-iteration-count: infinite;
+    -webkit-animation-timing-function: linear;
+    animation-timing-function: linear
+}
+
+.mdl-progress.mdl-progress--indeterminate>.bar3,
+.mdl-progress.mdl-progress__indeterminate>.bar3 {
+    background-image: none;
+    -webkit-animation-name: indeterminate2;
+    animation-name: indeterminate2
+}
+
+@-webkit-keyframes indeterminate1 {
+    0% {
+        left: 0%;
+        width: 0%
+    }
+    50% {
+        left: 25%;
+        width: 75%
+    }
+    75% {
+        left: 100%;
+        width: 0%
+    }
+}
+
+@keyframes indeterminate1 {
+    0% {
+        left: 0%;
+        width: 0%
+    }
+    50% {
+        left: 25%;
+        width: 75%
+    }
+    75% {
+        left: 100%;
+        width: 0%
+    }
+}
+
+@-webkit-keyframes indeterminate2 {
+    0%,
+    50% {
+        left: 0%;
+        width: 0%
+    }
+    75% {
+        left: 0%;
+        width: 25%
+    }
+    100% {
+        left: 100%;
+        width: 0%
+    }
+}
+
+@keyframes indeterminate2 {
+    0%,
+    50% {
+        left: 0%;
+        width: 0%
+    }
+    75% {
+        left: 0%;
+        width: 25%
+    }
+    100% {
+        left: 100%;
+        width: 0%
+    }
+}
+
+.mdl-navigation {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-wrap: nowrap;
+    -ms-flex-wrap: nowrap;
+    flex-wrap: nowrap;
+    box-sizing: border-box
+}
+
+.mdl-navigation__link {
+    color: #424242;
+    text-decoration: none;
+    margin: 0;
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 24px;
+    letter-spacing: 0;
+    opacity: .87
+}
+
+.mdl-navigation__link .material-icons {
+    vertical-align: middle
+}
+
+.mdl-layout {
+    width: 100%;
+    height: 100%;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    overflow-y: auto;
+    overflow-x: hidden;
+    position: relative;
+    -webkit-overflow-scrolling: touch
+}
+
+.mdl-layout.is-small-screen .mdl-layout--large-screen-only {
+    display: none
+}
+
+.mdl-layout:not(.is-small-screen) .mdl-layout--small-screen-only {
+    display: none
+}
+
+.mdl-layout__container {
+    position: absolute;
+    width: 100%;
+    height: 100%
+}
+
+.mdl-layout__title,
+.mdl-layout-title {
+    display: block;
+    position: relative;
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 20px;
+    line-height: 1;
+    letter-spacing: .02em;
+    font-weight: 400;
+    box-sizing: border-box
+}
+
+.mdl-layout-spacer {
+    -webkit-flex-grow: 1;
+    -ms-flex-positive: 1;
+    flex-grow: 1
+}
+
+.mdl-layout__drawer {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-flex-wrap: nowrap;
+    -ms-flex-wrap: nowrap;
+    flex-wrap: nowrap;
+    width: 240px;
+    height: 100%;
+    max-height: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
+    box-sizing: border-box;
+    border-right: 1px solid #e0e0e0;
+    background: #161B22;
+    -webkit-transform: translateX(-250px);
+    transform: translateX(-250px);
+    -webkit-transform-style: preserve-3d;
+    transform-style: preserve-3d;
+    will-change: transform;
+    transition-duration: .2s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+    transition-property: transform;
+    transition-property: transform, -webkit-transform;
+    color: #424242;
+    overflow: visible;
+    overflow-y: auto;
+    z-index: 5
+}
+
+.mdl-layout__drawer.is-visible {
+    -webkit-transform: translateX(0);
+    transform: translateX(0)
+}
+
+.mdl-layout__drawer.is-visible~.mdl-layout__content.mdl-layout__content {
+    overflow: hidden
+}
+
+.mdl-layout__drawer>* {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0
+}
+
+.mdl-layout__drawer>.mdl-layout__title,
+.mdl-layout__drawer>.mdl-layout-title {
+    line-height: 64px;
+    padding-left: 40px
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__drawer>.mdl-layout__title,
+    .mdl-layout__drawer>.mdl-layout-title {
+        line-height: 56px;
+        padding-left: 16px;
+        color: #c9c9c9;
+    }
+}
+
+.mdl-layout__drawer .mdl-navigation {
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: stretch;
+    -ms-flex-align: stretch;
+    -ms-grid-row-align: stretch;
+    align-items: stretch;
+    padding-top: 16px
+}
+
+.mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
+    display: block;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    padding: 16px 40px;
+    margin: 0;
+    color: #757575
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
+        padding: 16px
+    }
+}
+
+.mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover {
+    background-color: #0D1117
+}
+
+.mdl-layout__drawer .mdl-navigation .mdl-navigation__link--current {
+    background-color: #e0e0e0;
+    color: #000
+}
+
+@media screen and (min-width:1025px) {
+    .mdl-layout--fixed-drawer>.mdl-layout__drawer {
+        -webkit-transform: translateX(0);
+        transform: translateX(0)
+    }
+}
+
+.mdl-layout__drawer-button {
+    display: block;
+    position: absolute;
+    height: 48px;
+    width: 48px;
+    border: 0;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    overflow: hidden;
+    text-align: center;
+    cursor: pointer;
+    font-size: 26px;
+    line-height: 56px;
+    font-family: Helvetica, Arial, sans-serif;
+    margin: 10px 12px;
+    top: 0;
+    left: 0;
+    color: rgb(255, 255, 255);
+    z-index: 4
+}
+
+.mdl-layout__header .mdl-layout__drawer-button {
+    position: absolute;
+    color: rgb(255, 255, 255);
+    background-color: inherit
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__header .mdl-layout__drawer-button {
+        margin: 4px
+    }
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__drawer-button {
+        margin: 4px;
+        color: rgba(0, 0, 0, .5)
+    }
+}
+
+@media screen and (min-width:1025px) {
+    .mdl-layout__drawer-button {
+        line-height: 64px
+    }
+    .mdl-layout--no-desktop-drawer-button .mdl-layout__drawer-button,
+    .mdl-layout--fixed-drawer>.mdl-layout__drawer-button,
+    .mdl-layout--no-drawer-button .mdl-layout__drawer-button {
+        display: none
+    }
+}
+
+.mdl-layout__header {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-flex-wrap: nowrap;
+    -ms-flex-wrap: nowrap;
+    flex-wrap: nowrap;
+    -webkit-justify-content: flex-start;
+    -ms-flex-pack: start;
+    justify-content: flex-start;
+    box-sizing: border-box;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    border: none;
+    min-height: 64px;
+    max-height: 1000px;
+    z-index: 3;
+    background-color: rgb(96, 125, 139);
+    color: rgb(255, 255, 255);
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
+    transition-duration: .2s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+    transition-property: max-height, box-shadow
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__header {
+        min-height: 56px
+    }
+}
+
+.mdl-layout--fixed-drawer.is-upgraded:not(.is-small-screen)>.mdl-layout__header {
+    margin-left: 240px;
+    width: calc(100% - 240px)
+}
+
+@media screen and (min-width:1025px) {
+    .mdl-layout--fixed-drawer>.mdl-layout__header .mdl-layout__header-row {
+        padding-left: 40px
+    }
+}
+
+.mdl-layout__header>.mdl-layout-icon {
+    position: absolute;
+    left: 40px;
+    top: 16px;
+    height: 32px;
+    width: 32px;
+    overflow: hidden;
+    z-index: 3;
+    display: block
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__header>.mdl-layout-icon {
+        left: 16px;
+        top: 12px
+    }
+}
+
+.mdl-layout.has-drawer .mdl-layout__header>.mdl-layout-icon {
+    display: none
+}
+
+.mdl-layout__header.is-compact {
+    max-height: 64px
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__header.is-compact {
+        max-height: 56px
+    }
+}
+
+.mdl-layout__header.is-compact.has-tabs {
+    height: 112px
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__header.is-compact.has-tabs {
+        min-height: 104px
+    }
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__header {
+        display: none
+    }
+    .mdl-layout--fixed-header>.mdl-layout__header {
+        display: -webkit-flex;
+        display: -ms-flexbox;
+        display: flex
+    }
+}
+
+.mdl-layout__header--transparent.mdl-layout__header--transparent {
+    background-color: transparent;
+    box-shadow: none
+}
+
+.mdl-layout__header--seamed,
+.mdl-layout__header--scroll {
+    box-shadow: none
+}
+
+.mdl-layout__header--waterfall {
+    box-shadow: none;
+    overflow: hidden
+}
+
+.mdl-layout__header--waterfall.is-casting-shadow {
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12)
+}
+
+.mdl-layout__header--waterfall.mdl-layout__header--waterfall-hide-top {
+    -webkit-justify-content: flex-end;
+    -ms-flex-pack: end;
+    justify-content: flex-end
+}
+
+.mdl-layout__header-row {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+    -webkit-flex-wrap: nowrap;
+    -ms-flex-wrap: nowrap;
+    flex-wrap: nowrap;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    box-sizing: border-box;
+    -webkit-align-self: stretch;
+    -ms-flex-item-align: stretch;
+    align-self: stretch;
+    -webkit-align-items: center;
+    -ms-flex-align: center;
+    align-items: center;
+    height: 64px;
+    margin: 0;
+    padding: 0 40px 0 80px
+}
+
+.mdl-layout--no-drawer-button .mdl-layout__header-row {
+    padding-left: 40px
+}
+
+@media screen and (min-width:1025px) {
+    .mdl-layout--no-desktop-drawer-button .mdl-layout__header-row {
+        padding-left: 40px
+    }
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__header-row {
+        height: 56px;
+        padding: 0 16px 0 72px
+    }
+    .mdl-layout--no-drawer-button .mdl-layout__header-row {
+        padding-left: 16px
+    }
+}
+
+.mdl-layout__header-row>* {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0
+}
+
+.mdl-layout__header--scroll .mdl-layout__header-row {
+    width: 100%
+}
+
+.mdl-layout__header-row .mdl-navigation {
+    margin: 0;
+    padding: 0;
+    height: 64px;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+    -webkit-align-items: center;
+    -ms-flex-align: center;
+    -ms-grid-row-align: center;
+    align-items: center
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__header-row .mdl-navigation {
+        height: 56px
+    }
+}
+
+.mdl-layout__header-row .mdl-navigation__link {
+    display: block;
+    color: rgb(255, 255, 255);
+    line-height: 64px;
+    padding: 0 24px
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__header-row .mdl-navigation__link {
+        line-height: 56px;
+        padding: 0 16px
+    }
+}
+
+.mdl-layout__obfuscator {
+    background-color: transparent;
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+    z-index: 4;
+    visibility: hidden;
+    transition-property: background-color;
+    transition-duration: .2s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
+}
+
+.mdl-layout__obfuscator.is-visible {
+    background-color: rgba(0, 0, 0, .5);
+    visibility: visible
+}
+
+@supports (pointer-events:auto) {
+    .mdl-layout__obfuscator {
+        background-color: rgba(0, 0, 0, .5);
+        opacity: 0;
+        transition-property: opacity;
+        visibility: visible;
+        pointer-events: none
+    }
+    .mdl-layout__obfuscator.is-visible {
+        pointer-events: auto;
+        opacity: 1
+    }
+}
+
+.mdl-layout__content {
+    -ms-flex: 0 1 auto;
+    position: relative;
+    display: inline-block;
+    overflow-y: auto;
+    overflow-x: hidden;
+    -webkit-flex-grow: 1;
+    -ms-flex-positive: 1;
+    flex-grow: 1;
+    z-index: 1;
+    -webkit-overflow-scrolling: touch
+}
+
+.mdl-layout--fixed-drawer>.mdl-layout__content {
+    margin-left: 240px
+}
+
+.mdl-layout__container.has-scrolling-header .mdl-layout__content {
+    overflow: visible
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout--fixed-drawer>.mdl-layout__content {
+        margin-left: 0
+    }
+    .mdl-layout__container.has-scrolling-header .mdl-layout__content {
+        overflow-y: auto;
+        overflow-x: hidden
+    }
+}
+
+.mdl-layout__tab-bar {
+    height: 96px;
+    margin: 0;
+    width: calc(100% - 112px);
+    padding: 0 0 0 56px;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    background-color: rgb(96, 125, 139);
+    overflow-y: hidden;
+    overflow-x: scroll
+}
+
+.mdl-layout__tab-bar::-webkit-scrollbar {
+    display: none
+}
+
+.mdl-layout--no-drawer-button .mdl-layout__tab-bar {
+    padding-left: 16px;
+    width: calc(100% - 32px)
+}
+
+@media screen and (min-width:1025px) {
+    .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar {
+        padding-left: 16px;
+        width: calc(100% - 32px)
+    }
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__tab-bar {
+        width: calc(100% - 60px);
+        padding: 0 0 0 60px
+    }
+    .mdl-layout--no-drawer-button .mdl-layout__tab-bar {
+        width: calc(100% - 8px);
+        padding-left: 4px
+    }
+}
+
+.mdl-layout--fixed-tabs .mdl-layout__tab-bar {
+    padding: 0;
+    overflow: hidden;
+    width: 100%
+}
+
+.mdl-layout__tab-bar-container {
+    position: relative;
+    height: 48px;
+    width: 100%;
+    border: none;
+    margin: 0;
+    z-index: 2;
+    -webkit-flex-grow: 0;
+    -ms-flex-positive: 0;
+    flex-grow: 0;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    overflow: hidden
+}
+
+.mdl-layout__container>.mdl-layout__tab-bar-container {
+    position: absolute;
+    top: 0;
+    left: 0
+}
+
+.mdl-layout__tab-bar-button {
+    display: inline-block;
+    position: absolute;
+    top: 0;
+    height: 48px;
+    width: 56px;
+    z-index: 4;
+    text-align: center;
+    background-color: rgb(96, 125, 139);
+    color: transparent;
+    cursor: pointer;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none
+}
+
+.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button,
+.mdl-layout--no-drawer-button .mdl-layout__tab-bar-button {
+    width: 16px
+}
+
+.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button .material-icons,
+.mdl-layout--no-drawer-button .mdl-layout__tab-bar-button .material-icons {
+    position: relative;
+    left: -4px
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__tab-bar-button {
+        width: 60px
+    }
+}
+
+.mdl-layout--fixed-tabs .mdl-layout__tab-bar-button {
+    display: none
+}
+
+.mdl-layout__tab-bar-button .material-icons {
+    line-height: 48px
+}
+
+.mdl-layout__tab-bar-button.is-active {
+    color: rgb(255, 255, 255)
+}
+
+.mdl-layout__tab-bar-left-button {
+    left: 0
+}
+
+.mdl-layout__tab-bar-right-button {
+    right: 0
+}
+
+.mdl-layout__tab {
+    margin: 0;
+    border: none;
+    padding: 0 24px;
+    float: left;
+    position: relative;
+    display: block;
+    -webkit-flex-grow: 0;
+    -ms-flex-positive: 0;
+    flex-grow: 0;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    text-decoration: none;
+    height: 48px;
+    line-height: 48px;
+    text-align: center;
+    font-weight: 500;
+    font-size: 14px;
+    text-transform: uppercase;
+    color: rgba(255, 255, 255, .6);
+    overflow: hidden
+}
+
+@media screen and (max-width:1024px) {
+    .mdl-layout__tab {
+        padding: 0 12px
+    }
+}
+
+.mdl-layout--fixed-tabs .mdl-layout__tab {
+    float: none;
+    -webkit-flex-grow: 1;
+    -ms-flex-positive: 1;
+    flex-grow: 1;
+    padding: 0
+}
+
+.mdl-layout.is-upgraded .mdl-layout__tab.is-active {
+    color: rgb(255, 255, 255)
+}
+
+.mdl-layout.is-upgraded .mdl-layout__tab.is-active::after {
+    height: 2px;
+    width: 100%;
+    display: block;
+    content: " ";
+    bottom: 0;
+    left: 0;
+    position: absolute;
+    background: rgb(83, 109, 254);
+    -webkit-animation: border-expand .2s cubic-bezier(.4, 0, .4, 1).01s alternate forwards;
+    animation: border-expand .2s cubic-bezier(.4, 0, .4, 1).01s alternate forwards;
+    transition: all 1s cubic-bezier(.4, 0, 1, 1)
+}
+
+.mdl-layout__tab .mdl-layout__tab-ripple-container {
+    display: block;
+    position: absolute;
+    height: 100%;
+    width: 100%;
+    left: 0;
+    top: 0;
+    z-index: 1;
+    overflow: hidden
+}
+
+.mdl-layout__tab .mdl-layout__tab-ripple-container .mdl-ripple {
+    background-color: rgb(255, 255, 255)
+}
+
+.mdl-layout__tab-panel {
+    display: block
+}
+
+.mdl-layout.is-upgraded .mdl-layout__tab-panel {
+    display: none
+}
+
+.mdl-layout.is-upgraded .mdl-layout__tab-panel.is-active {
+    display: block
+}
+
+.mdl-radio {
+    position: relative;
+    font-size: 16px;
+    line-height: 24px;
+    display: inline-block;
+    box-sizing: border-box;
+    margin: 0;
+    padding-left: 0
+}
+
+.mdl-radio.is-upgraded {
+    padding-left: 24px
+}
+
+.mdl-radio__button {
+    line-height: 24px
+}
+
+.mdl-radio.is-upgraded .mdl-radio__button {
+    position: absolute;
+    width: 0;
+    height: 0;
+    margin: 0;
+    padding: 0;
+    opacity: 0;
+    -ms-appearance: none;
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    appearance: none;
+    border: none
+}
+
+.mdl-radio__outer-circle {
+    position: absolute;
+    top: 4px;
+    left: 0;
+    display: inline-block;
+    box-sizing: border-box;
+    width: 16px;
+    height: 16px;
+    margin: 0;
+    cursor: pointer;
+    border: 2px solid rgba(0, 0, 0, .54);
+    border-radius: 50%;
+    z-index: 2
+}
+
+.mdl-radio.is-checked .mdl-radio__outer-circle {
+    border: 2px solid rgb(96, 125, 139)
+}
+
+.mdl-radio__outer-circle fieldset[disabled] .mdl-radio,
+.mdl-radio.is-disabled .mdl-radio__outer-circle {
+    border: 2px solid rgba(0, 0, 0, .26);
+    cursor: auto
+}
+
+.mdl-radio__inner-circle {
+    position: absolute;
+    z-index: 1;
+    margin: 0;
+    top: 8px;
+    left: 4px;
+    box-sizing: border-box;
+    width: 8px;
+    height: 8px;
+    cursor: pointer;
+    transition-duration: .28s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+    transition-property: transform;
+    transition-property: transform, -webkit-transform;
+    -webkit-transform: scale3d(0, 0, 0);
+    transform: scale3d(0, 0, 0);
+    border-radius: 50%;
+    background: rgb(96, 125, 139)
+}
+
+.mdl-radio.is-checked .mdl-radio__inner-circle {
+    -webkit-transform: scale3d(1, 1, 1);
+    transform: scale3d(1, 1, 1)
+}
+
+fieldset[disabled] .mdl-radio .mdl-radio__inner-circle,
+.mdl-radio.is-disabled .mdl-radio__inner-circle {
+    background: rgba(0, 0, 0, .26);
+    cursor: auto
+}
+
+.mdl-radio.is-focused .mdl-radio__inner-circle {
+    box-shadow: 0 0 0 10px rgba(0, 0, 0, .1)
+}
+
+.mdl-radio__label {
+    cursor: pointer
+}
+
+fieldset[disabled] .mdl-radio .mdl-radio__label,
+.mdl-radio.is-disabled .mdl-radio__label {
+    color: rgba(0, 0, 0, .26);
+    cursor: auto
+}
+
+.mdl-radio__ripple-container {
+    position: absolute;
+    z-index: 2;
+    top: -9px;
+    left: -13px;
+    box-sizing: border-box;
+    width: 42px;
+    height: 42px;
+    border-radius: 50%;
+    cursor: pointer;
+    overflow: hidden;
+    -webkit-mask-image: -webkit-radial-gradient(circle, #fff, #000)
+}
+
+.mdl-radio__ripple-container .mdl-ripple {
+    background: rgb(96, 125, 139)
+}
+
+fieldset[disabled] .mdl-radio .mdl-radio__ripple-container,
+.mdl-radio.is-disabled .mdl-radio__ripple-container {
+    cursor: auto
+}
+
+fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple,
+.mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple {
+    background: 0 0
+}
+
+_:-ms-input-placeholder,
+:root .mdl-slider.mdl-slider.is-upgraded {
+    -ms-appearance: none;
+    height: 32px;
+    margin: 0
+}
+
+.mdl-slider {
+    width: calc(100% - 40px);
+    margin: 0 20px
+}
+
+.mdl-slider.is-upgraded {
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
+    height: 2px;
+    background: 0 0;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    outline: 0;
+    padding: 0;
+    color: rgb(96, 125, 139);
+    -webkit-align-self: center;
+    -ms-flex-item-align: center;
+    align-self: center;
+    z-index: 1;
+    cursor: pointer
+}
+
+.mdl-slider.is-upgraded::-moz-focus-outer {
+    border: 0
+}
+
+.mdl-slider.is-upgraded::-ms-tooltip {
+    display: none
+}
+
+.mdl-slider.is-upgraded::-webkit-slider-runnable-track {
+    background: 0 0
+}
+
+.mdl-slider.is-upgraded::-moz-range-track {
+    background: 0 0;
+    border: none
+}
+
+.mdl-slider.is-upgraded::-ms-track {
+    background: 0 0;
+    color: transparent;
+    height: 2px;
+    width: 100%;
+    border: none
+}
+
+.mdl-slider.is-upgraded::-ms-fill-lower {
+    padding: 0;
+    background: linear-gradient(to right, transparent, transparent 16px, rgb(96, 125, 139)16px, rgb(96, 125, 139)0)
+}
+
+.mdl-slider.is-upgraded::-ms-fill-upper {
+    padding: 0;
+    background: linear-gradient(to left, transparent, transparent 16px, rgba(0, 0, 0, .26)16px, rgba(0, 0, 0, .26)0)
+}
+
+.mdl-slider.is-upgraded::-webkit-slider-thumb {
+    -webkit-appearance: none;
+    width: 12px;
+    height: 12px;
+    box-sizing: border-box;
+    border-radius: 50%;
+    background: rgb(96, 125, 139);
+    border: none;
+    transition: transform .18s cubic-bezier(.4, 0, .2, 1), border .18s cubic-bezier(.4, 0, .2, 1), box-shadow .18s cubic-bezier(.4, 0, .2, 1), background .28s cubic-bezier(.4, 0, .2, 1);
+    transition: transform .18s cubic-bezier(.4, 0, .2, 1), border .18s cubic-bezier(.4, 0, .2, 1), box-shadow .18s cubic-bezier(.4, 0, .2, 1), background .28s cubic-bezier(.4, 0, .2, 1), -webkit-transform .18s cubic-bezier(.4, 0, .2, 1)
+}
+
+.mdl-slider.is-upgraded::-moz-range-thumb {
+    -moz-appearance: none;
+    width: 12px;
+    height: 12px;
+    box-sizing: border-box;
+    border-radius: 50%;
+    background-image: none;
+    background: rgb(96, 125, 139);
+    border: none
+}
+
+.mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb {
+    box-shadow: 0 0 0 10px rgba(96, 125, 139, .26)
+}
+
+.mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb {
+    box-shadow: 0 0 0 10px rgba(96, 125, 139, .26)
+}
+
+.mdl-slider.is-upgraded:active::-webkit-slider-thumb {
+    background-image: none;
+    background: rgb(96, 125, 139);
+    -webkit-transform: scale(1.5);
+    transform: scale(1.5)
+}
+
+.mdl-slider.is-upgraded:active::-moz-range-thumb {
+    background-image: none;
+    background: rgb(96, 125, 139);
+    transform: scale(1.5)
+}
+
+.mdl-slider.is-upgraded::-ms-thumb {
+    width: 32px;
+    height: 32px;
+    border: none;
+    border-radius: 50%;
+    background: rgb(96, 125, 139);
+    transform: scale(.375);
+    transition: transform .18s cubic-bezier(.4, 0, .2, 1), background .28s cubic-bezier(.4, 0, .2, 1);
+    transition: transform .18s cubic-bezier(.4, 0, .2, 1), background .28s cubic-bezier(.4, 0, .2, 1), -webkit-transform .18s cubic-bezier(.4, 0, .2, 1)
+}
+
+.mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb {
+    background: radial-gradient(circle closest-side, rgb(96, 125, 139)0%, rgb(96, 125, 139)37.5%, rgba(96, 125, 139, .26)37.5%, rgba(96, 125, 139, .26)100%);
+    transform: scale(1)
+}
+
+.mdl-slider.is-upgraded:active::-ms-thumb {
+    background: rgb(96, 125, 139);
+    transform: scale(.5625)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb {
+    border: 2px solid rgba(0, 0, 0, .26);
+    background: 0 0
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb {
+    border: 2px solid rgba(0, 0, 0, .26);
+    background: 0 0
+}
+
+.mdl-slider.is-upgraded.is-lowest-value+.mdl-slider__background-flex>.mdl-slider__background-upper {
+    left: 6px
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb {
+    box-shadow: 0 0 0 10px rgba(0, 0, 0, .12);
+    background: rgba(0, 0, 0, .12)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb {
+    box-shadow: 0 0 0 10px rgba(0, 0, 0, .12);
+    background: rgba(0, 0, 0, .12)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb {
+    border: 1.6px solid rgba(0, 0, 0, .26);
+    -webkit-transform: scale(1.5);
+    transform: scale(1.5)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active+.mdl-slider__background-flex>.mdl-slider__background-upper {
+    left: 9px
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb {
+    border: 1.5px solid rgba(0, 0, 0, .26);
+    transform: scale(1.5)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-ms-thumb {
+    background: radial-gradient(circle closest-side, transparent 0%, transparent 66.67%, rgba(0, 0, 0, .26)66.67%, rgba(0, 0, 0, .26)100%)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb {
+    background: radial-gradient(circle closest-side, rgba(0, 0, 0, .12)0%, rgba(0, 0, 0, .12)25%, rgba(0, 0, 0, .26)25%, rgba(0, 0, 0, .26)37.5%, rgba(0, 0, 0, .12)37.5%, rgba(0, 0, 0, .12)100%);
+    transform: scale(1)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb {
+    transform: scale(.5625);
+    background: radial-gradient(circle closest-side, transparent 0%, transparent 77.78%, rgba(0, 0, 0, .26)77.78%, rgba(0, 0, 0, .26)100%)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower {
+    background: 0 0
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-ms-fill-upper {
+    margin-left: 6px
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active::-ms-fill-upper {
+    margin-left: 9px
+}
+
+.mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb,
+.mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb,
+.mdl-slider.is-upgraded:disabled::-webkit-slider-thumb {
+    -webkit-transform: scale(.667);
+    transform: scale(.667);
+    background: rgba(0, 0, 0, .26)
+}
+
+.mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb,
+.mdl-slider.is-upgraded:disabled:active::-moz-range-thumb,
+.mdl-slider.is-upgraded:disabled::-moz-range-thumb {
+    transform: scale(.667);
+    background: rgba(0, 0, 0, .26)
+}
+
+.mdl-slider.is-upgraded:disabled+.mdl-slider__background-flex>.mdl-slider__background-lower {
+    background-color: rgba(0, 0, 0, .26);
+    left: -6px
+}
+
+.mdl-slider.is-upgraded:disabled+.mdl-slider__background-flex>.mdl-slider__background-upper {
+    left: 6px
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb,
+.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb,
+.mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb {
+    border: 3px solid rgba(0, 0, 0, .26);
+    background: 0 0;
+    -webkit-transform: scale(.667);
+    transform: scale(.667)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb,
+.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb,
+.mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb {
+    border: 3px solid rgba(0, 0, 0, .26);
+    background: 0 0;
+    transform: scale(.667)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:active+.mdl-slider__background-flex>.mdl-slider__background-upper {
+    left: 6px
+}
+
+.mdl-slider.is-upgraded:disabled:focus::-ms-thumb,
+.mdl-slider.is-upgraded:disabled:active::-ms-thumb,
+.mdl-slider.is-upgraded:disabled::-ms-thumb {
+    transform: scale(.25);
+    background: rgba(0, 0, 0, .26)
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb,
+.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb,
+.mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb {
+    transform: scale(.25);
+    background: radial-gradient(circle closest-side, transparent 0%, transparent 50%, rgba(0, 0, 0, .26)50%, rgba(0, 0, 0, .26)100%)
+}
+
+.mdl-slider.is-upgraded:disabled::-ms-fill-lower {
+    margin-right: 6px;
+    background: linear-gradient(to right, transparent, transparent 25px, rgba(0, 0, 0, .26)25px, rgba(0, 0, 0, .26)0)
+}
+
+.mdl-slider.is-upgraded:disabled::-ms-fill-upper {
+    margin-left: 6px
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-fill-upper {
+    margin-left: 6px
+}
+
+.mdl-slider__ie-container {
+    height: 18px;
+    overflow: visible;
+    border: none;
+    margin: none;
+    padding: none
+}
+
+.mdl-slider__container {
+    height: 18px;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row
+}
+
+.mdl-slider__container,
+.mdl-slider__background-flex {
+    background: 0 0;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex
+}
+
+.mdl-slider__background-flex {
+    position: absolute;
+    height: 2px;
+    width: calc(100% - 52px);
+    top: 50%;
+    left: 0;
+    margin: 0 26px;
+    overflow: hidden;
+    border: 0;
+    padding: 0;
+    -webkit-transform: translate(0, -1px);
+    transform: translate(0, -1px)
+}
+
+.mdl-slider__background-lower {
+    background: rgb(96, 125, 139)
+}
+
+.mdl-slider__background-lower,
+.mdl-slider__background-upper {
+    -webkit-flex: 0;
+    -ms-flex: 0;
+    flex: 0;
+    position: relative;
+    border: 0;
+    padding: 0
+}
+
+.mdl-slider__background-upper {
+    background: rgba(0, 0, 0, .26);
+    transition: left .18s cubic-bezier(.4, 0, .2, 1)
+}
+
+.mdl-snackbar {
+    position: fixed;
+    bottom: 0;
+    left: 50%;
+    cursor: default;
+    background-color: #323232;
+    z-index: 3;
+    display: block;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    will-change: transform;
+    -webkit-transform: translate(0, 80px);
+    transform: translate(0, 80px);
+    transition: transform .25s cubic-bezier(.4, 0, 1, 1);
+    transition: transform .25s cubic-bezier(.4, 0, 1, 1), -webkit-transform .25s cubic-bezier(.4, 0, 1, 1);
+    pointer-events: none
+}
+
+@media (max-width:479px) {
+    .mdl-snackbar {
+        width: 100%;
+        left: 0;
+        min-height: 48px;
+        max-height: 80px
+    }
+}
+
+@media (min-width:480px) {
+    .mdl-snackbar {
+        min-width: 288px;
+        max-width: 568px;
+        border-radius: 2px;
+        -webkit-transform: translate(-50%, 80px);
+        transform: translate(-50%, 80px)
+    }
+}
+
+.mdl-snackbar--active {
+    -webkit-transform: translate(0, 0);
+    transform: translate(0, 0);
+    pointer-events: auto;
+    transition: transform .25s cubic-bezier(0, 0, .2, 1);
+    transition: transform .25s cubic-bezier(0, 0, .2, 1), -webkit-transform .25s cubic-bezier(0, 0, .2, 1)
+}
+
+@media (min-width:480px) {
+    .mdl-snackbar--active {
+        -webkit-transform: translate(-50%, 0);
+        transform: translate(-50%, 0)
+    }
+}
+
+.mdl-snackbar__text {
+    padding: 14px 12px 14px 24px;
+    vertical-align: middle;
+    color: #fff;
+    float: left
+}
+
+.mdl-snackbar__action {
+    background: 0 0;
+    border: none;
+    color: rgb(83, 109, 254);
+    float: right;
+    padding: 14px 24px 14px 12px;
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-size: 14px;
+    font-weight: 500;
+    text-transform: uppercase;
+    line-height: 1;
+    letter-spacing: 0;
+    overflow: hidden;
+    outline: none;
+    opacity: 0;
+    pointer-events: none;
+    cursor: pointer;
+    text-decoration: none;
+    text-align: center;
+    -webkit-align-self: center;
+    -ms-flex-item-align: center;
+    align-self: center
+}
+
+.mdl-snackbar__action::-moz-focus-inner {
+    border: 0
+}
+
+.mdl-snackbar__action:not([aria-hidden]) {
+    opacity: 1;
+    pointer-events: auto
+}
+
+.mdl-spinner {
+    display: inline-block;
+    position: relative;
+    width: 28px;
+    height: 28px
+}
+
+.mdl-spinner:not(.is-upgraded).is-active:after {
+    content: "Loading..."
+}
+
+.mdl-spinner.is-upgraded.is-active {
+    -webkit-animation: mdl-spinner__container-rotate 1568.23529412ms linear infinite;
+    animation: mdl-spinner__container-rotate 1568.23529412ms linear infinite
+}
+
+@-webkit-keyframes mdl-spinner__container-rotate {
+    to {
+        -webkit-transform: rotate(360deg);
+        transform: rotate(360deg)
+    }
+}
+
+@keyframes mdl-spinner__container-rotate {
+    to {
+        -webkit-transform: rotate(360deg);
+        transform: rotate(360deg)
+    }
+}
+
+.mdl-spinner__layer {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    opacity: 0
+}
+
+.mdl-spinner__layer-1 {
+    border-color: #42a5f5
+}
+
+.mdl-spinner--single-color .mdl-spinner__layer-1 {
+    border-color: rgb(96, 125, 139)
+}
+
+.mdl-spinner.is-active .mdl-spinner__layer-1 {
+    -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4, 0, .2, 1)infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(.4, 0, .2, 1)infinite both;
+    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4, 0, .2, 1)infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(.4, 0, .2, 1)infinite both
+}
+
+.mdl-spinner__layer-2 {
+    border-color: #f44336
+}
+
+.mdl-spinner--single-color .mdl-spinner__layer-2 {
+    border-color: rgb(96, 125, 139)
+}
+
+.mdl-spinner.is-active .mdl-spinner__layer-2 {
+    -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4, 0, .2, 1)infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(.4, 0, .2, 1)infinite both;
+    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4, 0, .2, 1)infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(.4, 0, .2, 1)infinite both
+}
+
+.mdl-spinner__layer-3 {
+    border-color: #fdd835
+}
+
+.mdl-spinner--single-color .mdl-spinner__layer-3 {
+    border-color: rgb(96, 125, 139)
+}
+
+.mdl-spinner.is-active .mdl-spinner__layer-3 {
+    -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4, 0, .2, 1)infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(.4, 0, .2, 1)infinite both;
+    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4, 0, .2, 1)infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(.4, 0, .2, 1)infinite both
+}
+
+.mdl-spinner__layer-4 {
+    border-color: #4caf50
+}
+
+.mdl-spinner--single-color .mdl-spinner__layer-4 {
+    border-color: rgb(96, 125, 139)
+}
+
+.mdl-spinner.is-active .mdl-spinner__layer-4 {
+    -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4, 0, .2, 1)infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(.4, 0, .2, 1)infinite both;
+    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4, 0, .2, 1)infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(.4, 0, .2, 1)infinite both
+}
+
+@-webkit-keyframes mdl-spinner__fill-unfill-rotate {
+    12.5% {
+        -webkit-transform: rotate(135deg);
+        transform: rotate(135deg)
+    }
+    25% {
+        -webkit-transform: rotate(270deg);
+        transform: rotate(270deg)
+    }
+    37.5% {
+        -webkit-transform: rotate(405deg);
+        transform: rotate(405deg)
+    }
+    50% {
+        -webkit-transform: rotate(540deg);
+        transform: rotate(540deg)
+    }
+    62.5% {
+        -webkit-transform: rotate(675deg);
+        transform: rotate(675deg)
+    }
+    75% {
+        -webkit-transform: rotate(810deg);
+        transform: rotate(810deg)
+    }
+    87.5% {
+        -webkit-transform: rotate(945deg);
+        transform: rotate(945deg)
+    }
+    to {
+        -webkit-transform: rotate(1080deg);
+        transform: rotate(1080deg)
+    }
+}
+
+@keyframes mdl-spinner__fill-unfill-rotate {
+    12.5% {
+        -webkit-transform: rotate(135deg);
+        transform: rotate(135deg)
+    }
+    25% {
+        -webkit-transform: rotate(270deg);
+        transform: rotate(270deg)
+    }
+    37.5% {
+        -webkit-transform: rotate(405deg);
+        transform: rotate(405deg)
+    }
+    50% {
+        -webkit-transform: rotate(540deg);
+        transform: rotate(540deg)
+    }
+    62.5% {
+        -webkit-transform: rotate(675deg);
+        transform: rotate(675deg)
+    }
+    75% {
+        -webkit-transform: rotate(810deg);
+        transform: rotate(810deg)
+    }
+    87.5% {
+        -webkit-transform: rotate(945deg);
+        transform: rotate(945deg)
+    }
+    to {
+        -webkit-transform: rotate(1080deg);
+        transform: rotate(1080deg)
+    }
+}
+
+@-webkit-keyframes mdl-spinner__layer-1-fade-in-out {
+    from,
+    25% {
+        opacity: .99
+    }
+    26%,
+    89% {
+        opacity: 0
+    }
+    90%,
+    100% {
+        opacity: .99
+    }
+}
+
+@keyframes mdl-spinner__layer-1-fade-in-out {
+    from,
+    25% {
+        opacity: .99
+    }
+    26%,
+    89% {
+        opacity: 0
+    }
+    90%,
+    100% {
+        opacity: .99
+    }
+}
+
+@-webkit-keyframes mdl-spinner__layer-2-fade-in-out {
+    from,
+    15% {
+        opacity: 0
+    }
+    25%,
+    50% {
+        opacity: .99
+    }
+    51% {
+        opacity: 0
+    }
+}
+
+@keyframes mdl-spinner__layer-2-fade-in-out {
+    from,
+    15% {
+        opacity: 0
+    }
+    25%,
+    50% {
+        opacity: .99
+    }
+    51% {
+        opacity: 0
+    }
+}
+
+@-webkit-keyframes mdl-spinner__layer-3-fade-in-out {
+    from,
+    40% {
+        opacity: 0
+    }
+    50%,
+    75% {
+        opacity: .99
+    }
+    76% {
+        opacity: 0
+    }
+}
+
+@keyframes mdl-spinner__layer-3-fade-in-out {
+    from,
+    40% {
+        opacity: 0
+    }
+    50%,
+    75% {
+        opacity: .99
+    }
+    76% {
+        opacity: 0
+    }
+}
+
+@-webkit-keyframes mdl-spinner__layer-4-fade-in-out {
+    from,
+    65% {
+        opacity: 0
+    }
+    75%,
+    90% {
+        opacity: .99
+    }
+    100% {
+        opacity: 0
+    }
+}
+
+@keyframes mdl-spinner__layer-4-fade-in-out {
+    from,
+    65% {
+        opacity: 0
+    }
+    75%,
+    90% {
+        opacity: .99
+    }
+    100% {
+        opacity: 0
+    }
+}
+
+.mdl-spinner__gap-patch {
+    position: absolute;
+    box-sizing: border-box;
+    top: 0;
+    left: 45%;
+    width: 10%;
+    height: 100%;
+    overflow: hidden;
+    border-color: inherit
+}
+
+.mdl-spinner__gap-patch .mdl-spinner__circle {
+    width: 1000%;
+    left: -450%
+}
+
+.mdl-spinner__circle-clipper {
+    display: inline-block;
+    position: relative;
+    width: 50%;
+    height: 100%;
+    overflow: hidden;
+    border-color: inherit
+}
+
+.mdl-spinner__circle-clipper .mdl-spinner__circle {
+    width: 200%
+}
+
+.mdl-spinner__circle {
+    box-sizing: border-box;
+    height: 100%;
+    border-width: 3px;
+    border-style: solid;
+    border-color: inherit;
+    border-bottom-color: transparent!important;
+    border-radius: 50%;
+    -webkit-animation: none;
+    animation: none;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0
+}
+
+.mdl-spinner__left .mdl-spinner__circle {
+    border-right-color: transparent!important;
+    -webkit-transform: rotate(129deg);
+    transform: rotate(129deg)
+}
+
+.mdl-spinner.is-active .mdl-spinner__left .mdl-spinner__circle {
+    -webkit-animation: mdl-spinner__left-spin 1333ms cubic-bezier(.4, 0, .2, 1)infinite both;
+    animation: mdl-spinner__left-spin 1333ms cubic-bezier(.4, 0, .2, 1)infinite both
+}
+
+.mdl-spinner__right .mdl-spinner__circle {
+    left: -100%;
+    border-left-color: transparent!important;
+    -webkit-transform: rotate(-129deg);
+    transform: rotate(-129deg)
+}
+
+.mdl-spinner.is-active .mdl-spinner__right .mdl-spinner__circle {
+    -webkit-animation: mdl-spinner__right-spin 1333ms cubic-bezier(.4, 0, .2, 1)infinite both;
+    animation: mdl-spinner__right-spin 1333ms cubic-bezier(.4, 0, .2, 1)infinite both
+}
+
+@-webkit-keyframes mdl-spinner__left-spin {
+    from {
+        -webkit-transform: rotate(130deg);
+        transform: rotate(130deg)
+    }
+    50% {
+        -webkit-transform: rotate(-5deg);
+        transform: rotate(-5deg)
+    }
+    to {
+        -webkit-transform: rotate(130deg);
+        transform: rotate(130deg)
+    }
+}
+
+@keyframes mdl-spinner__left-spin {
+    from {
+        -webkit-transform: rotate(130deg);
+        transform: rotate(130deg)
+    }
+    50% {
+        -webkit-transform: rotate(-5deg);
+        transform: rotate(-5deg)
+    }
+    to {
+        -webkit-transform: rotate(130deg);
+        transform: rotate(130deg)
+    }
+}
+
+@-webkit-keyframes mdl-spinner__right-spin {
+    from {
+        -webkit-transform: rotate(-130deg);
+        transform: rotate(-130deg)
+    }
+    50% {
+        -webkit-transform: rotate(5deg);
+        transform: rotate(5deg)
+    }
+    to {
+        -webkit-transform: rotate(-130deg);
+        transform: rotate(-130deg)
+    }
+}
+
+@keyframes mdl-spinner__right-spin {
+    from {
+        -webkit-transform: rotate(-130deg);
+        transform: rotate(-130deg)
+    }
+    50% {
+        -webkit-transform: rotate(5deg);
+        transform: rotate(5deg)
+    }
+    to {
+        -webkit-transform: rotate(-130deg);
+        transform: rotate(-130deg)
+    }
+}
+
+.mdl-switch {
+    position: relative;
+    z-index: 1;
+    vertical-align: middle;
+    display: inline-block;
+    box-sizing: border-box;
+    width: 100%;
+    height: 24px;
+    margin: 0;
+    padding: 0;
+    overflow: visible;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none
+}
+
+.mdl-switch.is-upgraded {
+    padding-left: 28px
+}
+
+.mdl-switch__input {
+    line-height: 24px
+}
+
+.mdl-switch.is-upgraded .mdl-switch__input {
+    position: absolute;
+    width: 0;
+    height: 0;
+    margin: 0;
+    padding: 0;
+    opacity: 0;
+    -ms-appearance: none;
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    appearance: none;
+    border: none
+}
+
+.mdl-switch__track {
+    background: rgba(0, 0, 0, .26);
+    position: absolute;
+    left: 0;
+    top: 5px;
+    height: 14px;
+    width: 36px;
+    border-radius: 14px;
+    cursor: pointer
+}
+
+.mdl-switch.is-checked .mdl-switch__track {
+    background: rgba(96, 125, 139, .5)
+}
+
+.mdl-switch__track fieldset[disabled] .mdl-switch,
+.mdl-switch.is-disabled .mdl-switch__track {
+    background: rgba(0, 0, 0, .12);
+    cursor: auto
+}
+
+.mdl-switch__thumb {
+    background: #c9c9c9;
+    position: absolute;
+    left: 0;
+    top: 2px;
+    height: 20px;
+    width: 20px;
+    border-radius: 50%;
+    cursor: pointer;
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
+    transition-duration: .28s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+    transition-property: left
+}
+
+.mdl-switch.is-checked .mdl-switch__thumb {
+    background: rgb(96, 125, 139);
+    left: 16px;
+    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px 8px 0 rgba(0, 0, 0, .12)
+}
+
+.mdl-switch__thumb fieldset[disabled] .mdl-switch,
+.mdl-switch.is-disabled .mdl-switch__thumb {
+    background: #bdbdbd;
+    cursor: auto
+}
+
+.mdl-switch__focus-helper {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    -webkit-transform: translate(-4px, -4px);
+    transform: translate(-4px, -4px);
+    display: inline-block;
+    box-sizing: border-box;
+    width: 8px;
+    height: 8px;
+    border-radius: 50%;
+    background-color: transparent
+}
+
+.mdl-switch.is-focused .mdl-switch__focus-helper {
+    box-shadow: 0 0 0 20px rgba(0, 0, 0, .1);
+    background-color: rgba(0, 0, 0, .1)
+}
+
+.mdl-switch.is-focused.is-checked .mdl-switch__focus-helper {
+    box-shadow: 0 0 0 20px rgba(96, 125, 139, .26);
+    background-color: rgba(96, 125, 139, .26)
+}
+
+.mdl-switch__label {
+    position: relative;
+    cursor: pointer;
+    font-size: 16px;
+    line-height: 24px;
+    margin: 0;
+    left: 24px
+}
+
+.mdl-switch__label fieldset[disabled] .mdl-switch,
+.mdl-switch.is-disabled .mdl-switch__label {
+    color: #bdbdbd;
+    cursor: auto
+}
+
+.mdl-switch__ripple-container {
+    position: absolute;
+    z-index: 2;
+    top: -12px;
+    left: -14px;
+    box-sizing: border-box;
+    width: 48px;
+    height: 48px;
+    border-radius: 50%;
+    cursor: pointer;
+    overflow: hidden;
+    -webkit-mask-image: -webkit-radial-gradient(circle, #fff, #000);
+    transition-duration: .4s;
+    transition-timing-function: step-end;
+    transition-property: left
+}
+
+.mdl-switch__ripple-container .mdl-ripple {
+    background: rgb(96, 125, 139)
+}
+
+.mdl-switch__ripple-container fieldset[disabled] .mdl-switch,
+.mdl-switch.is-disabled .mdl-switch__ripple-container {
+    cursor: auto
+}
+
+fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple,
+.mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple {
+    background: 0 0
+}
+
+.mdl-switch.is-checked .mdl-switch__ripple-container {
+    left: 2px
+}
+
+.mdl-tabs {
+    display: block;
+    width: 100%
+}
+
+.mdl-tabs__tab-bar {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+    -webkit-justify-content: center;
+    -ms-flex-pack: center;
+    justify-content: center;
+    -webkit-align-content: space-between;
+    -ms-flex-line-pack: justify;
+    align-content: space-between;
+    -webkit-align-items: flex-start;
+    -ms-flex-align: start;
+    align-items: flex-start;
+    height: 48px;
+    padding: 0;
+    margin: 0;
+    border-bottom: 1px solid #0D1117;
+    background: #161B22;
+}
+
+.mdl-tabs__tab {
+    margin: 0;
+    border: none;
+    padding: 0 24px;
+    float: left;
+    position: relative;
+    display: block;
+    text-decoration: none;
+    height: 48px;
+    line-height: 48px;
+    text-align: center;
+    font-weight: 500;
+    font-size: 14px;
+    text-transform: uppercase;
+    color: #595B60;
+    overflow: hidden
+}
+
+.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active {
+    color: #5C6BC0
+}
+
+.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after {
+    height: 2px;
+    width: 100%;
+    display: block;
+    content: " ";
+    bottom: 0;
+    left: 0;
+    position: absolute;
+    background: rgb(96, 125, 139);
+    -webkit-animation: border-expand .2s cubic-bezier(.4, 0, .4, 1).01s alternate forwards;
+    animation: border-expand .2s cubic-bezier(.4, 0, .4, 1).01s alternate forwards;
+    transition: all 1s cubic-bezier(.4, 0, 1, 1)
+}
+
+.mdl-tabs__tab .mdl-tabs__ripple-container {
+    display: block;
+    position: absolute;
+    height: 100%;
+    width: 100%;
+    left: 0;
+    top: 0;
+    z-index: 1;
+    overflow: hidden
+}
+
+.mdl-tabs__tab .mdl-tabs__ripple-container .mdl-ripple {
+    background: rgb(96, 125, 139)
+}
+
+.mdl-tabs__panel {
+    display: block
+}
+
+.mdl-tabs.is-upgraded .mdl-tabs__panel {
+    display: none
+}
+
+.mdl-tabs.is-upgraded .mdl-tabs__panel.is-active {
+    display: block
+}
+
+@-webkit-keyframes border-expand {
+    0% {
+        opacity: 0;
+        width: 0
+    }
+    100% {
+        opacity: 1;
+        width: 100%
+    }
+}
+
+@keyframes border-expand {
+    0% {
+        opacity: 0;
+        width: 0
+    }
+    100% {
+        opacity: 1;
+        width: 100%
+    }
+}
+
+.mdl-textfield {
+    position: relative;
+    font-size: 16px;
+    display: inline-block;
+    box-sizing: border-box;
+    width: 300px;
+    max-width: 100%;
+    margin: 0;
+    padding: 20px 0
+}
+
+.mdl-textfield .mdl-button {
+    position: absolute;
+    bottom: 20px
+}
+
+.mdl-textfield--align-right {
+    text-align: right
+}
+
+.mdl-textfield--full-width {
+    width: 100%
+}
+
+.mdl-textfield--expandable {
+    min-width: 32px;
+    width: auto;
+    min-height: 32px
+}
+
+.mdl-textfield--expandable .mdl-button--icon {
+    top: 16px
+}
+
+.mdl-textfield__input {
+    border: none;
+    border-bottom: 1px solid rgba(0, 0, 0, .12);
+    display: block;
+    font-size: 16px;
+    font-family: "Helvetica", "Arial", sans-serif;
+    margin: 0;
+    padding: 4px 0;
+    width: 100%;
+    background: 0 0;
+    text-align: left;
+    color: #c9c9c9;
+}
+
+.mdl-textfield__input[type="number"] {
+    -moz-appearance: textfield
+}
+
+.mdl-textfield__input[type="number"]::-webkit-inner-spin-button,
+.mdl-textfield__input[type="number"]::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+    margin: 0
+}
+
+.mdl-textfield.is-focused .mdl-textfield__input {
+    outline: none
+}
+
+.mdl-textfield.is-invalid .mdl-textfield__input {
+    border-color: #d50000;
+    box-shadow: none
+}
+
+fieldset[disabled] .mdl-textfield .mdl-textfield__input,
+.mdl-textfield.is-disabled .mdl-textfield__input {
+    background-color: transparent;
+    border-bottom: 1px dotted rgba(0, 0, 0, .12);
+    color: rgba(0, 0, 0, .26)
+}
+
+.mdl-textfield textarea.mdl-textfield__input {
+    display: block
+}
+
+.mdl-textfield__label {
+    bottom: 0;
+    color: #c9c9c9;
+    font-size: 16px;
+    left: 0;
+    right: 0;
+    pointer-events: none;
+    position: absolute;
+    display: block;
+    top: 24px;
+    width: 100%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-align: left
+}
+
+.mdl-textfield.is-dirty .mdl-textfield__label,
+.mdl-textfield.has-placeholder .mdl-textfield__label {
+    visibility: hidden
+}
+
+.mdl-textfield--floating-label .mdl-textfield__label {
+    transition-duration: .2s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
+}
+
+.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
+    transition: none
+}
+
+fieldset[disabled] .mdl-textfield .mdl-textfield__label,
+.mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {
+    color: #555555;
+}
+
+.mdl-textfield--floating-label.is-focused .mdl-textfield__label,
+.mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
+.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
+    color: rgb(96, 125, 139);
+    font-size: 12px;
+    top: 4px;
+    visibility: visible
+}
+
+.mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder .mdl-textfield__label,
+.mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label,
+.mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder .mdl-textfield__label {
+    top: -16px
+}
+
+.mdl-textfield--floating-label.is-invalid .mdl-textfield__label {
+    color: #d50000;
+    font-size: 12px
+}
+
+.mdl-textfield__label:after {
+    background-color: rgb(96, 125, 139);
+    bottom: 20px;
+    content: '';
+    height: 2px;
+    left: 45%;
+    position: absolute;
+    transition-duration: .2s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+    visibility: hidden;
+    width: 10px
+}
+
+.mdl-textfield.is-focused .mdl-textfield__label:after {
+    left: 0;
+    visibility: visible;
+    width: 100%
+}
+
+.mdl-textfield.is-invalid .mdl-textfield__label:after {
+    background-color: #d50000
+}
+
+.mdl-textfield__error {
+    color: #d50000;
+    position: absolute;
+    font-size: 12px;
+    margin-top: 3px;
+    visibility: hidden;
+    display: block
+}
+
+.mdl-textfield.is-invalid .mdl-textfield__error {
+    visibility: visible
+}
+
+.mdl-textfield__expandable-holder {
+    display: inline-block;
+    position: relative;
+    margin-left: 32px;
+    transition-duration: .2s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+    display: inline-block;
+    max-width: .1px
+}
+
+.mdl-textfield.is-focused .mdl-textfield__expandable-holder,
+.mdl-textfield.is-dirty .mdl-textfield__expandable-holder {
+    max-width: 600px
+}
+
+.mdl-textfield__expandable-holder .mdl-textfield__label:after {
+    bottom: 0
+}
+
+.mdl-tooltip {
+    -webkit-transform: scale(0);
+    transform: scale(0);
+    -webkit-transform-origin: top center;
+    transform-origin: top center;
+    z-index: 999;
+    background: rgba(97, 97, 97, .9);
+    border-radius: 2px;
+    color: #fff;
+    display: inline-block;
+    font-size: 10px;
+    font-weight: 500;
+    line-height: 14px;
+    max-width: 170px;
+    position: fixed;
+    top: -500px;
+    left: -500px;
+    padding: 8px;
+    text-align: center
+}
+
+.mdl-tooltip.is-active {
+    -webkit-animation: pulse 200ms cubic-bezier(0, 0, .2, 1)forwards;
+    animation: pulse 200ms cubic-bezier(0, 0, .2, 1)forwards
+}
+
+.mdl-tooltip--large {
+    line-height: 14px;
+    font-size: 14px;
+    padding: 16px
+}
+
+@-webkit-keyframes pulse {
+    0% {
+        -webkit-transform: scale(0);
+        transform: scale(0);
+        opacity: 0
+    }
+    50% {
+        -webkit-transform: scale(.99);
+        transform: scale(.99)
+    }
+    100% {
+        -webkit-transform: scale(1);
+        transform: scale(1);
+        opacity: 1;
+        visibility: visible
+    }
+}
+
+@keyframes pulse {
+    0% {
+        -webkit-transform: scale(0);
+        transform: scale(0);
+        opacity: 0
+    }
+    50% {
+        -webkit-transform: scale(.99);
+        transform: scale(.99)
+    }
+    100% {
+        -webkit-transform: scale(1);
+        transform: scale(1);
+        opacity: 1;
+        visibility: visible
+    }
+}
+
+.mdl-shadow--2dp {
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12)
+}
+
+.mdl-shadow--3dp {
+    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px 8px 0 rgba(0, 0, 0, .12)
+}
+
+.mdl-shadow--4dp {
+    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12), 0 2px 4px -1px rgba(0, 0, 0, .2)
+}
+
+.mdl-shadow--6dp {
+    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12), 0 3px 5px -1px rgba(0, 0, 0, .2)
+}
+
+.mdl-shadow--8dp {
+    box-shadow: 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12), 0 5px 5px -3px rgba(0, 0, 0, .2)
+}
+
+.mdl-shadow--16dp {
+    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2)
+}
+
+.mdl-shadow--24dp {
+    box-shadow: 0 9px 46px 8px rgba(0, 0, 0, .14), 0 11px 15px -7px rgba(0, 0, 0, .12), 0 24px 38px 3px rgba(0, 0, 0, .2)
+}
+
+.mdl-grid {
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-flow: row wrap;
+    -ms-flex-flow: row wrap;
+    flex-flow: row wrap;
+    margin: 0 auto;
+    -webkit-align-items: stretch;
+    -ms-flex-align: stretch;
+    align-items: stretch
+}
+
+.mdl-grid.mdl-grid--no-spacing {
+    padding: 0
+}
+
+.mdl-cell {
+    box-sizing: border-box
+}
+
+.mdl-cell--top {
+    -webkit-align-self: flex-start;
+    -ms-flex-item-align: start;
+    align-self: flex-start
+}
+
+.mdl-cell--middle {
+    -webkit-align-self: center;
+    -ms-flex-item-align: center;
+    align-self: center
+}
+
+.mdl-cell--bottom {
+    -webkit-align-self: flex-end;
+    -ms-flex-item-align: end;
+    align-self: flex-end
+}
+
+.mdl-cell--stretch {
+    -webkit-align-self: stretch;
+    -ms-flex-item-align: stretch;
+    align-self: stretch
+}
+
+.mdl-grid.mdl-grid--no-spacing>.mdl-cell {
+    margin: 0
+}
+
+.mdl-cell--order-1 {
+    -webkit-order: 1;
+    -ms-flex-order: 1;
+    order: 1
+}
+
+.mdl-cell--order-2 {
+    -webkit-order: 2;
+    -ms-flex-order: 2;
+    order: 2
+}
+
+.mdl-cell--order-3 {
+    -webkit-order: 3;
+    -ms-flex-order: 3;
+    order: 3
+}
+
+.mdl-cell--order-4 {
+    -webkit-order: 4;
+    -ms-flex-order: 4;
+    order: 4
+}
+
+.mdl-cell--order-5 {
+    -webkit-order: 5;
+    -ms-flex-order: 5;
+    order: 5
+}
+
+.mdl-cell--order-6 {
+    -webkit-order: 6;
+    -ms-flex-order: 6;
+    order: 6
+}
+
+.mdl-cell--order-7 {
+    -webkit-order: 7;
+    -ms-flex-order: 7;
+    order: 7
+}
+
+.mdl-cell--order-8 {
+    -webkit-order: 8;
+    -ms-flex-order: 8;
+    order: 8
+}
+
+.mdl-cell--order-9 {
+    -webkit-order: 9;
+    -ms-flex-order: 9;
+    order: 9
+}
+
+.mdl-cell--order-10 {
+    -webkit-order: 10;
+    -ms-flex-order: 10;
+    order: 10
+}
+
+.mdl-cell--order-11 {
+    -webkit-order: 11;
+    -ms-flex-order: 11;
+    order: 11
+}
+
+.mdl-cell--order-12 {
+    -webkit-order: 12;
+    -ms-flex-order: 12;
+    order: 12
+}
+
+@media (max-width:479px) {
+    .mdl-grid {
+        padding: 8px
+    }
+    .mdl-cell {
+        margin: 8px;
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell {
+        width: 100%
+    }
+    .mdl-cell--hide-phone {
+        display: none!important
+    }
+    .mdl-cell--order-1-phone.mdl-cell--order-1-phone {
+        -webkit-order: 1;
+        -ms-flex-order: 1;
+        order: 1
+    }
+    .mdl-cell--order-2-phone.mdl-cell--order-2-phone {
+        -webkit-order: 2;
+        -ms-flex-order: 2;
+        order: 2
+    }
+    .mdl-cell--order-3-phone.mdl-cell--order-3-phone {
+        -webkit-order: 3;
+        -ms-flex-order: 3;
+        order: 3
+    }
+    .mdl-cell--order-4-phone.mdl-cell--order-4-phone {
+        -webkit-order: 4;
+        -ms-flex-order: 4;
+        order: 4
+    }
+    .mdl-cell--order-5-phone.mdl-cell--order-5-phone {
+        -webkit-order: 5;
+        -ms-flex-order: 5;
+        order: 5
+    }
+    .mdl-cell--order-6-phone.mdl-cell--order-6-phone {
+        -webkit-order: 6;
+        -ms-flex-order: 6;
+        order: 6
+    }
+    .mdl-cell--order-7-phone.mdl-cell--order-7-phone {
+        -webkit-order: 7;
+        -ms-flex-order: 7;
+        order: 7
+    }
+    .mdl-cell--order-8-phone.mdl-cell--order-8-phone {
+        -webkit-order: 8;
+        -ms-flex-order: 8;
+        order: 8
+    }
+    .mdl-cell--order-9-phone.mdl-cell--order-9-phone {
+        -webkit-order: 9;
+        -ms-flex-order: 9;
+        order: 9
+    }
+    .mdl-cell--order-10-phone.mdl-cell--order-10-phone {
+        -webkit-order: 10;
+        -ms-flex-order: 10;
+        order: 10
+    }
+    .mdl-cell--order-11-phone.mdl-cell--order-11-phone {
+        -webkit-order: 11;
+        -ms-flex-order: 11;
+        order: 11
+    }
+    .mdl-cell--order-12-phone.mdl-cell--order-12-phone {
+        -webkit-order: 12;
+        -ms-flex-order: 12;
+        order: 12
+    }
+    .mdl-cell--1-col,
+    .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
+        width: calc(25% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--1-col,
+    .mdl-grid--no-spacing>.mdl-cell--1-col-phone.mdl-cell--1-col-phone {
+        width: 25%
+    }
+    .mdl-cell--2-col,
+    .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
+        width: calc(50% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--2-col,
+    .mdl-grid--no-spacing>.mdl-cell--2-col-phone.mdl-cell--2-col-phone {
+        width: 50%
+    }
+    .mdl-cell--3-col,
+    .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
+        width: calc(75% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--3-col,
+    .mdl-grid--no-spacing>.mdl-cell--3-col-phone.mdl-cell--3-col-phone {
+        width: 75%
+    }
+    .mdl-cell--4-col,
+    .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--4-col,
+    .mdl-grid--no-spacing>.mdl-cell--4-col-phone.mdl-cell--4-col-phone {
+        width: 100%
+    }
+    .mdl-cell--5-col,
+    .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--5-col,
+    .mdl-grid--no-spacing>.mdl-cell--5-col-phone.mdl-cell--5-col-phone {
+        width: 100%
+    }
+    .mdl-cell--6-col,
+    .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--6-col,
+    .mdl-grid--no-spacing>.mdl-cell--6-col-phone.mdl-cell--6-col-phone {
+        width: 100%
+    }
+    .mdl-cell--7-col,
+    .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--7-col,
+    .mdl-grid--no-spacing>.mdl-cell--7-col-phone.mdl-cell--7-col-phone {
+        width: 100%
+    }
+    .mdl-cell--8-col,
+    .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--8-col,
+    .mdl-grid--no-spacing>.mdl-cell--8-col-phone.mdl-cell--8-col-phone {
+        width: 100%
+    }
+    .mdl-cell--9-col,
+    .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--9-col,
+    .mdl-grid--no-spacing>.mdl-cell--9-col-phone.mdl-cell--9-col-phone {
+        width: 100%
+    }
+    .mdl-cell--10-col,
+    .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--10-col,
+    .mdl-grid--no-spacing>.mdl-cell--10-col-phone.mdl-cell--10-col-phone {
+        width: 100%
+    }
+    .mdl-cell--11-col,
+    .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--11-col,
+    .mdl-grid--no-spacing>.mdl-cell--11-col-phone.mdl-cell--11-col-phone {
+        width: 100%
+    }
+    .mdl-cell--12-col,
+    .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--12-col,
+    .mdl-grid--no-spacing>.mdl-cell--12-col-phone.mdl-cell--12-col-phone {
+        width: 100%
+    }
+    .mdl-cell--1-offset,
+    .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
+        margin-left: calc(25% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
+        margin-left: 25%
+    }
+    .mdl-cell--2-offset,
+    .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
+        margin-left: calc(50% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
+        margin-left: 50%
+    }
+    .mdl-cell--3-offset,
+    .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
+        margin-left: calc(75% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
+        margin-left: 75%
+    }
+}
+
+@media (min-width:480px) and (max-width:839px) {
+    .mdl-grid {
+        padding: 8px
+    }
+    .mdl-cell {
+        margin: 8px;
+        width: calc(50% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell {
+        width: 50%
+    }
+    .mdl-cell--hide-tablet {
+        display: none!important
+    }
+    .mdl-cell--order-1-tablet.mdl-cell--order-1-tablet {
+        -webkit-order: 1;
+        -ms-flex-order: 1;
+        order: 1
+    }
+    .mdl-cell--order-2-tablet.mdl-cell--order-2-tablet {
+        -webkit-order: 2;
+        -ms-flex-order: 2;
+        order: 2
+    }
+    .mdl-cell--order-3-tablet.mdl-cell--order-3-tablet {
+        -webkit-order: 3;
+        -ms-flex-order: 3;
+        order: 3
+    }
+    .mdl-cell--order-4-tablet.mdl-cell--order-4-tablet {
+        -webkit-order: 4;
+        -ms-flex-order: 4;
+        order: 4
+    }
+    .mdl-cell--order-5-tablet.mdl-cell--order-5-tablet {
+        -webkit-order: 5;
+        -ms-flex-order: 5;
+        order: 5
+    }
+    .mdl-cell--order-6-tablet.mdl-cell--order-6-tablet {
+        -webkit-order: 6;
+        -ms-flex-order: 6;
+        order: 6
+    }
+    .mdl-cell--order-7-tablet.mdl-cell--order-7-tablet {
+        -webkit-order: 7;
+        -ms-flex-order: 7;
+        order: 7
+    }
+    .mdl-cell--order-8-tablet.mdl-cell--order-8-tablet {
+        -webkit-order: 8;
+        -ms-flex-order: 8;
+        order: 8
+    }
+    .mdl-cell--order-9-tablet.mdl-cell--order-9-tablet {
+        -webkit-order: 9;
+        -ms-flex-order: 9;
+        order: 9
+    }
+    .mdl-cell--order-10-tablet.mdl-cell--order-10-tablet {
+        -webkit-order: 10;
+        -ms-flex-order: 10;
+        order: 10
+    }
+    .mdl-cell--order-11-tablet.mdl-cell--order-11-tablet {
+        -webkit-order: 11;
+        -ms-flex-order: 11;
+        order: 11
+    }
+    .mdl-cell--order-12-tablet.mdl-cell--order-12-tablet {
+        -webkit-order: 12;
+        -ms-flex-order: 12;
+        order: 12
+    }
+    .mdl-cell--1-col,
+    .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
+        width: calc(12.5% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--1-col,
+    .mdl-grid--no-spacing>.mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
+        width: 12.5%
+    }
+    .mdl-cell--2-col,
+    .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
+        width: calc(25% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--2-col,
+    .mdl-grid--no-spacing>.mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
+        width: 25%
+    }
+    .mdl-cell--3-col,
+    .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
+        width: calc(37.5% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--3-col,
+    .mdl-grid--no-spacing>.mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
+        width: 37.5%
+    }
+    .mdl-cell--4-col,
+    .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
+        width: calc(50% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--4-col,
+    .mdl-grid--no-spacing>.mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
+        width: 50%
+    }
+    .mdl-cell--5-col,
+    .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
+        width: calc(62.5% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--5-col,
+    .mdl-grid--no-spacing>.mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
+        width: 62.5%
+    }
+    .mdl-cell--6-col,
+    .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
+        width: calc(75% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--6-col,
+    .mdl-grid--no-spacing>.mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
+        width: 75%
+    }
+    .mdl-cell--7-col,
+    .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
+        width: calc(87.5% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--7-col,
+    .mdl-grid--no-spacing>.mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
+        width: 87.5%
+    }
+    .mdl-cell--8-col,
+    .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--8-col,
+    .mdl-grid--no-spacing>.mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
+        width: 100%
+    }
+    .mdl-cell--9-col,
+    .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--9-col,
+    .mdl-grid--no-spacing>.mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
+        width: 100%
+    }
+    .mdl-cell--10-col,
+    .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--10-col,
+    .mdl-grid--no-spacing>.mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
+        width: 100%
+    }
+    .mdl-cell--11-col,
+    .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--11-col,
+    .mdl-grid--no-spacing>.mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
+        width: 100%
+    }
+    .mdl-cell--12-col,
+    .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--12-col,
+    .mdl-grid--no-spacing>.mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
+        width: 100%
+    }
+    .mdl-cell--1-offset,
+    .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
+        margin-left: calc(12.5% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
+        margin-left: 12.5%
+    }
+    .mdl-cell--2-offset,
+    .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
+        margin-left: calc(25% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
+        margin-left: 25%
+    }
+    .mdl-cell--3-offset,
+    .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
+        margin-left: calc(37.5% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
+        margin-left: 37.5%
+    }
+    .mdl-cell--4-offset,
+    .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
+        margin-left: calc(50% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
+        margin-left: 50%
+    }
+    .mdl-cell--5-offset,
+    .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
+        margin-left: calc(62.5% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
+        margin-left: 62.5%
+    }
+    .mdl-cell--6-offset,
+    .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
+        margin-left: calc(75% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
+        margin-left: 75%
+    }
+    .mdl-cell--7-offset,
+    .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
+        margin-left: calc(87.5% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
+        margin-left: 87.5%
+    }
+}
+
+@media (min-width:840px) {
+    .mdl-grid {
+        padding: 8px
+    }
+    .mdl-cell {
+        margin: 8px;
+        width: calc(33.3333333333% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell {
+        width: 33.3333333333%
+    }
+    .mdl-cell--hide-desktop {
+        display: none!important
+    }
+    .mdl-cell--order-1-desktop.mdl-cell--order-1-desktop {
+        -webkit-order: 1;
+        -ms-flex-order: 1;
+        order: 1
+    }
+    .mdl-cell--order-2-desktop.mdl-cell--order-2-desktop {
+        -webkit-order: 2;
+        -ms-flex-order: 2;
+        order: 2
+    }
+    .mdl-cell--order-3-desktop.mdl-cell--order-3-desktop {
+        -webkit-order: 3;
+        -ms-flex-order: 3;
+        order: 3
+    }
+    .mdl-cell--order-4-desktop.mdl-cell--order-4-desktop {
+        -webkit-order: 4;
+        -ms-flex-order: 4;
+        order: 4
+    }
+    .mdl-cell--order-5-desktop.mdl-cell--order-5-desktop {
+        -webkit-order: 5;
+        -ms-flex-order: 5;
+        order: 5
+    }
+    .mdl-cell--order-6-desktop.mdl-cell--order-6-desktop {
+        -webkit-order: 6;
+        -ms-flex-order: 6;
+        order: 6
+    }
+    .mdl-cell--order-7-desktop.mdl-cell--order-7-desktop {
+        -webkit-order: 7;
+        -ms-flex-order: 7;
+        order: 7
+    }
+    .mdl-cell--order-8-desktop.mdl-cell--order-8-desktop {
+        -webkit-order: 8;
+        -ms-flex-order: 8;
+        order: 8
+    }
+    .mdl-cell--order-9-desktop.mdl-cell--order-9-desktop {
+        -webkit-order: 9;
+        -ms-flex-order: 9;
+        order: 9
+    }
+    .mdl-cell--order-10-desktop.mdl-cell--order-10-desktop {
+        -webkit-order: 10;
+        -ms-flex-order: 10;
+        order: 10
+    }
+    .mdl-cell--order-11-desktop.mdl-cell--order-11-desktop {
+        -webkit-order: 11;
+        -ms-flex-order: 11;
+        order: 11
+    }
+    .mdl-cell--order-12-desktop.mdl-cell--order-12-desktop {
+        -webkit-order: 12;
+        -ms-flex-order: 12;
+        order: 12
+    }
+    .mdl-cell--1-col,
+    .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
+        width: calc(8.3333333333% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--1-col,
+    .mdl-grid--no-spacing>.mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
+        width: 8.3333333333%
+    }
+    .mdl-cell--2-col,
+    .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
+        width: calc(16.6666666667% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--2-col,
+    .mdl-grid--no-spacing>.mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
+        width: 16.6666666667%
+    }
+    .mdl-cell--3-col,
+    .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
+        width: calc(25% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--3-col,
+    .mdl-grid--no-spacing>.mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
+        width: 25%
+    }
+    .mdl-cell--4-col,
+    .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
+        width: calc(33.3333333333% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--4-col,
+    .mdl-grid--no-spacing>.mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
+        width: 33.3333333333%
+    }
+    .mdl-cell--5-col,
+    .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
+        width: calc(41.6666666667% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--5-col,
+    .mdl-grid--no-spacing>.mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
+        width: 41.6666666667%
+    }
+    .mdl-cell--6-col,
+    .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
+        width: calc(50% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--6-col,
+    .mdl-grid--no-spacing>.mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
+        width: 50%
+    }
+    .mdl-cell--7-col,
+    .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
+        width: calc(58.3333333333% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--7-col,
+    .mdl-grid--no-spacing>.mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
+        width: 58.3333333333%
+    }
+    .mdl-cell--8-col,
+    .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
+        width: calc(66.6666666667% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--8-col,
+    .mdl-grid--no-spacing>.mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
+        width: 66.6666666667%
+    }
+    .mdl-cell--9-col,
+    .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
+        width: calc(75% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--9-col,
+    .mdl-grid--no-spacing>.mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
+        width: 75%
+    }
+    .mdl-cell--10-col,
+    .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
+        width: calc(83.3333333333% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--10-col,
+    .mdl-grid--no-spacing>.mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
+        width: 83.3333333333%
+    }
+    .mdl-cell--11-col,
+    .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
+        width: calc(91.6666666667% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--11-col,
+    .mdl-grid--no-spacing>.mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
+        width: 91.6666666667%
+    }
+    .mdl-cell--12-col,
+    .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
+        width: calc(100% - 16px)
+    }
+    .mdl-grid--no-spacing>.mdl-cell--12-col,
+    .mdl-grid--no-spacing>.mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
+        width: 100%
+    }
+    .mdl-cell--1-offset,
+    .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
+        margin-left: calc(8.3333333333% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
+        margin-left: 8.3333333333%
+    }
+    .mdl-cell--2-offset,
+    .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
+        margin-left: calc(16.6666666667% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
+        margin-left: 16.6666666667%
+    }
+    .mdl-cell--3-offset,
+    .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
+        margin-left: calc(25% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
+        margin-left: 25%
+    }
+    .mdl-cell--4-offset,
+    .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
+        margin-left: calc(33.3333333333% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
+        margin-left: 33.3333333333%
+    }
+    .mdl-cell--5-offset,
+    .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
+        margin-left: calc(41.6666666667% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
+        margin-left: 41.6666666667%
+    }
+    .mdl-cell--6-offset,
+    .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
+        margin-left: calc(50% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
+        margin-left: 50%
+    }
+    .mdl-cell--7-offset,
+    .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
+        margin-left: calc(58.3333333333% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
+        margin-left: 58.3333333333%
+    }
+    .mdl-cell--8-offset,
+    .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
+        margin-left: calc(66.6666666667% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--8-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
+        margin-left: 66.6666666667%
+    }
+    .mdl-cell--9-offset,
+    .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
+        margin-left: calc(75% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--9-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
+        margin-left: 75%
+    }
+    .mdl-cell--10-offset,
+    .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
+        margin-left: calc(83.3333333333% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--10-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
+        margin-left: 83.3333333333%
+    }
+    .mdl-cell--11-offset,
+    .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
+        margin-left: calc(91.6666666667% + 8px)
+    }
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--11-offset,
+    .mdl-grid.mdl-grid--no-spacing>.mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
+        margin-left: 91.6666666667%
+    }
+}
+
+body {
+    margin: 0
+}
+
+.styleguide-demo h1 {
+    margin: 48px 24px 0
+}
+
+.styleguide-demo h1:after {
+    content: '';
+    display: block;
+    width: 100%;
+    border-bottom: 1px solid rgba(0, 0, 0, .5);
+    margin-top: 24px
+}
+
+.styleguide-demo {
+    opacity: 0;
+    transition: opacity .6s ease
+}
+
+.styleguide-masthead {
+    height: 256px;
+    background: #212121;
+    padding: 115px 16px 0
+}
+
+.styleguide-container {
+    position: relative;
+    max-width: 960px;
+    width: 100%
+}
+
+.styleguide-title {
+    color: #fff;
+    bottom: auto;
+    position: relative;
+    font-size: 56px;
+    font-weight: 300;
+    line-height: 1;
+    letter-spacing: -.02em
+}
+
+.styleguide-title:after {
+    border-bottom: 0
+}
+
+.styleguide-title span {
+    font-weight: 300
+}
+
+.mdl-styleguide .mdl-layout__drawer .mdl-navigation__link {
+    padding: 10px 24px
+}
+
+.demosLoaded .styleguide-demo {
+    opacity: 1
+}
+
+iframe {
+    display: block;
+    width: 100%;
+    border: none
+}
+
+iframe.heightSet {
+    overflow: hidden
+}
+
+.demo-wrapper {
+    margin: 24px
+}
+
+.demo-wrapper iframe {
+    border: 1px solid rgba(0, 0, 0, .5)
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/mdl-datetimepicker.css b/app/modules/web/themes/material-dark/css/mdl-datetimepicker.css
new file mode 100644
index 000000000..7cf71451a
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/mdl-datetimepicker.css
@@ -0,0 +1,178 @@
+.dtp {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.2);
+  z-index: 2000;
+  font-size: 15px;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none; }
+
+.dtp > .dtp-content {
+  background: #fff;
+  max-width: 300px;
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
+  max-height: 520px;
+  position: relative;
+  left: 50%; }
+
+.dtp > .dtp-content > .dtp-date-view > header.dtp-header {
+  background: #607d8b;
+  color: #eceff1;
+  text-align: center;
+  padding: 0.3em; }
+
+.dtp div.dtp-date, .dtp div.dtp-time {
+  background: #607d8b;
+  text-align: center;
+  color: #eceff1;
+  padding: 10px; }
+
+.dtp div.dtp-date > div {
+  padding: 0;
+  margin: 0; }
+
+.dtp div.dtp-actual-month {
+  font-size: 1.5em; }
+
+.dtp div.dtp-actual-num {
+  font-size: 3em;
+  line-height: 0.9; }
+
+.dtp div.dtp-actual-maxtime {
+  font-size: 3em;
+  line-height: 0.9; }
+
+.dtp div.dtp-actual-year {
+  font-size: 1.5em;
+  color: #fff; }
+
+.dtp div.dtp-picker {
+  padding: 1em;
+  text-align: center; }
+
+.dtp div.dtp-picker-month, .dtp div.dtp-actual-time {
+  font-weight: 500;
+  text-align: center; }
+
+.dtp div.dtp-picker-month {
+  padding-bottom: 20px !important;
+  text-transform: uppercase !important; }
+
+.dtp .dtp-close {
+  position: absolute;
+  top: 0.5em;
+  right: 1em; }
+
+.dtp .dtp-close > a {
+  color: #fff; }
+
+.dtp .dtp-close > a > i {
+  font-size: 1em; }
+
+.dtp table.dtp-picker-days {
+  margin: 0;
+  min-height: 251px; }
+
+.dtp table.dtp-picker-days, .dtp table.dtp-picker-days tr, .dtp table.dtp-picker-days tr > td {
+  border: none; }
+
+.dtp table.dtp-picker-days tr > td {
+  font-weight: 700;
+  text-align: center;
+  padding: 0.5em; }
+
+.dtp table.dtp-picker-days tr > td > span.dtp-select-day {
+  color: #BDBDBD !important;
+  padding: 0.4em 0.5em 0.5em 0.6em; }
+
+.dtp table.dtp-picker-days tr > td > a, .dtp .dtp-picker-time > a {
+  color: #212121;
+  text-decoration: none;
+  padding: 0.4em;
+  border-radius: 5px !important; }
+
+.dtp table.dtp-picker-days tr > td > a.selected {
+  background: #607d8b;
+  color: #eceff1; }
+
+.dtp table.dtp-picker-days tr > th {
+  color: #757575;
+  text-align: center;
+  font-weight: 700;
+  padding: 0.4em 0.3em; }
+
+.dtp .p10 > a {
+  color: #fff;
+  text-decoration: none; }
+
+.dtp .p10 {
+  width: 10%;
+  display: inline-block; }
+
+.dtp .p20 {
+  width: 20%;
+  display: inline-block; }
+
+.dtp .p60 {
+  width: 60%;
+  display: inline-block; }
+
+.dtp .p80 {
+  width: 80%;
+  display: inline-block; }
+
+.dtp a.dtp-meridien-am, .dtp a.dtp-meridien-pm {
+  position: relative;
+  top: 10px;
+  color: #212121;
+  font-weight: 500;
+  padding: 0.7em 0.5em;
+  border-radius: 50% !important;
+  text-decoration: none;
+  background: #eee;
+  font-size: 1em; }
+
+.dtp .dtp-actual-meridien a.selected {
+  background: #607d8b;
+  color: #eceff1; }
+
+.dtp .dtp-picker-time > .dtp-select-hour {
+  cursor: pointer; }
+
+.dtp .dtp-picker-time > .dtp-select-minute {
+  cursor: pointer; }
+
+.dtp .dtp-buttons {
+  padding: 0 1em 1em 1em;
+  text-align: right; }
+
+/*.dtp .dtp-buttons .btn-flat {*/
+/*border: none;*/
+/*padding: .5em;*/
+/*color: #fff;*/
+/*background-color: #607D8B;*/
+/*}*/
+.dtp.hidden, .dtp .hidden {
+  display: none; }
+
+.dtp .invisible {
+  visibility: hidden; }
+
+.dtp .left {
+  float: left; }
+
+.dtp .right {
+  float: right; }
+
+.dtp .clearfix {
+  clear: both; }
+
+.dtp .center {
+  text-align: center; }
+
+/*# sourceMappingURL=mdl-datetimepicker.css.map */
diff --git a/app/modules/web/themes/material-dark/css/mdl-datetimepicker.css.map b/app/modules/web/themes/material-dark/css/mdl-datetimepicker.css.map
new file mode 100644
index 000000000..84efad5c8
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/mdl-datetimepicker.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "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",
+"sources": ["mdl-datetimepicker.scss","_base.scss"],
+"names": [],
+"file": "mdl-datetimepicker.css"
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/mdl-datetimepicker.min.css b/app/modules/web/themes/material-dark/css/mdl-datetimepicker.min.css
new file mode 100644
index 000000000..c40b29b71
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/mdl-datetimepicker.min.css
@@ -0,0 +1,215 @@
+.dtp {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.2);
+    z-index: 2000;
+    font-size: 15px;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none
+}
+
+.dtp>.dtp-content {
+    background: #fff;
+    max-width: 300px;
+    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
+    max-height: 520px;
+    position: relative;
+    left: 50%
+}
+
+.dtp>.dtp-content>.dtp-date-view>header.dtp-header {
+    background: #607d8b;
+    color: #eceff1;
+    text-align: center;
+    padding: .3em
+}
+
+.dtp div.dtp-date,
+.dtp div.dtp-time {
+    background: #607d8b;
+    text-align: center;
+    color: #eceff1;
+    padding: 10px
+}
+
+.dtp div.dtp-date>div {
+    padding: 0;
+    margin: 0
+}
+
+.dtp div.dtp-actual-month {
+    font-size: 1.5em
+}
+
+.dtp div.dtp-actual-num {
+    font-size: 3em;
+    line-height: .9
+}
+
+.dtp div.dtp-actual-maxtime {
+    font-size: 3em;
+    line-height: .9
+}
+
+.dtp div.dtp-actual-year {
+    font-size: 1.5em;
+    color: #fff
+}
+
+.dtp div.dtp-picker {
+    padding: 1em;
+    text-align: center
+}
+
+.dtp div.dtp-picker-month,
+.dtp div.dtp-actual-time {
+    font-weight: 500;
+    text-align: center
+}
+
+.dtp div.dtp-picker-month {
+    padding-bottom: 20px !important;
+    text-transform: uppercase !important
+}
+
+.dtp .dtp-close {
+    position: absolute;
+    top: .5em;
+    right: 1em
+}
+
+.dtp .dtp-close>a {
+    color: #fff
+}
+
+.dtp .dtp-close>a>i {
+    font-size: 1em
+}
+
+.dtp table.dtp-picker-days {
+    margin: 0;
+    min-height: 251px
+}
+
+.dtp table.dtp-picker-days,
+.dtp table.dtp-picker-days tr,
+.dtp table.dtp-picker-days tr>td {
+    border: 0
+}
+
+.dtp table.dtp-picker-days tr>td {
+    font-weight: 700;
+    text-align: center;
+    padding: .5em
+}
+
+.dtp table.dtp-picker-days tr>td>span.dtp-select-day {
+    color: #bdbdbd !important;
+    padding: .4em .5em .5em .6em
+}
+
+.dtp table.dtp-picker-days tr>td>a,
+.dtp .dtp-picker-time>a {
+    color: #212121;
+    text-decoration: none;
+    padding: .4em;
+    border-radius: 5px !important
+}
+
+.dtp table.dtp-picker-days tr>td>a.selected {
+    background: #607d8b;
+    color: #eceff1
+}
+
+.dtp table.dtp-picker-days tr>th {
+    color: #757575;
+    text-align: center;
+    font-weight: 700;
+    padding: .4em .3em
+}
+
+.dtp .p10>a {
+    color: #fff;
+    text-decoration: none
+}
+
+.dtp .p10 {
+    width: 10%;
+    display: inline-block
+}
+
+.dtp .p20 {
+    width: 20%;
+    display: inline-block
+}
+
+.dtp .p60 {
+    width: 60%;
+    display: inline-block
+}
+
+.dtp .p80 {
+    width: 80%;
+    display: inline-block
+}
+
+.dtp a.dtp-meridien-am,
+.dtp a.dtp-meridien-pm {
+    position: relative;
+    top: 10px;
+    color: #212121;
+    font-weight: 500;
+    padding: .7em .5em;
+    border-radius: 50% !important;
+    text-decoration: none;
+    background: #eee;
+    font-size: 1em
+}
+
+.dtp .dtp-actual-meridien a.selected {
+    background: #607d8b;
+    color: #eceff1
+}
+
+.dtp .dtp-picker-time>.dtp-select-hour {
+    cursor: pointer
+}
+
+.dtp .dtp-picker-time>.dtp-select-minute {
+    cursor: pointer
+}
+
+.dtp .dtp-buttons {
+    padding: 0 1em 1em 1em;
+    text-align: right
+}
+
+.dtp.hidden,
+.dtp .hidden {
+    display: none
+}
+
+.dtp .invisible {
+    visibility: hidden
+}
+
+.dtp .left {
+    float: left
+}
+
+.dtp .right {
+    float: right
+}
+
+.dtp .clearfix {
+    clear: both
+}
+
+.dtp .center {
+    text-align: center
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/mdl-datetimepicker.scss b/app/modules/web/themes/material-dark/css/mdl-datetimepicker.scss
new file mode 100644
index 000000000..6894f9c96
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/mdl-datetimepicker.scss
@@ -0,0 +1,218 @@
+@import "base";
+
+.dtp {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.2);
+  z-index: 2000;
+  font-size: 15px;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+.dtp > .dtp-content {
+  background: #fff;
+  max-width: 300px;
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
+  max-height: 520px;
+  position: relative;
+  left: 50%;
+}
+
+.dtp > .dtp-content > .dtp-date-view > header.dtp-header {
+  background: $color-bluegrey-fg;
+  color: $color-bluegrey-bg;
+  text-align: center;
+  padding: 0.3em;
+}
+
+.dtp div.dtp-date, .dtp div.dtp-time {
+  background: $color-bluegrey-fg;
+  text-align: center;
+  color: $color-bluegrey-bg;
+  padding: 10px;
+}
+
+.dtp div.dtp-date > div {
+  padding: 0;
+  margin: 0;
+}
+
+.dtp div.dtp-actual-month {
+  font-size: 1.5em;
+}
+
+.dtp div.dtp-actual-num {
+  font-size: 3em;
+  line-height: 0.9;
+}
+
+.dtp div.dtp-actual-maxtime {
+  font-size: 3em;
+  line-height: 0.9;
+}
+
+.dtp div.dtp-actual-year {
+  font-size: 1.5em;
+  color: #fff;
+}
+
+.dtp div.dtp-picker {
+  padding: 1em;
+  text-align: center;
+}
+
+.dtp div.dtp-picker-month, .dtp div.dtp-actual-time {
+  font-weight: 500;
+  text-align: center;
+}
+
+.dtp div.dtp-picker-month {
+  padding-bottom: 20px !important;
+  text-transform: uppercase !important;
+}
+
+.dtp .dtp-close {
+  position: absolute;
+  top: 0.5em;
+  right: 1em;
+}
+
+.dtp .dtp-close > a {
+  color: #fff;
+}
+
+.dtp .dtp-close > a > i {
+  font-size: 1em;
+}
+
+.dtp table.dtp-picker-days {
+  margin: 0;
+  min-height: 251px;
+}
+
+.dtp table.dtp-picker-days, .dtp table.dtp-picker-days tr, .dtp table.dtp-picker-days tr > td {
+  border: none;
+}
+
+.dtp table.dtp-picker-days tr > td {
+  font-weight: 700;
+  text-align: center;
+  padding: 0.5em;
+}
+
+.dtp table.dtp-picker-days tr > td > span.dtp-select-day {
+  color: #BDBDBD !important;
+  padding: 0.4em 0.5em 0.5em 0.6em;
+}
+
+.dtp table.dtp-picker-days tr > td > a, .dtp .dtp-picker-time > a {
+  color: #212121;
+  text-decoration: none;
+  padding: 0.4em;
+  border-radius: 5px !important;
+}
+
+.dtp table.dtp-picker-days tr > td > a.selected {
+  background: $color-bluegrey-fg;
+  color: $color-bluegrey-bg;
+}
+
+.dtp table.dtp-picker-days tr > th {
+  color: #757575;
+  text-align: center;
+  font-weight: 700;
+  padding: 0.4em 0.3em;
+}
+
+.dtp .p10 > a {
+  color: #fff;
+  text-decoration: none;
+}
+
+.dtp .p10 {
+  width: 10%;
+  display: inline-block;
+}
+
+.dtp .p20 {
+  width: 20%;
+  display: inline-block;
+}
+
+.dtp .p60 {
+  width: 60%;
+  display: inline-block;
+}
+
+.dtp .p80 {
+  width: 80%;
+  display: inline-block;
+}
+
+.dtp a.dtp-meridien-am, .dtp a.dtp-meridien-pm {
+  position: relative;
+  top: 10px;
+  color: #212121;
+  font-weight: 500;
+  padding: 0.7em 0.5em;
+  border-radius: 50% !important;
+  text-decoration: none;
+  background: #eee;
+  font-size: 1em;
+}
+
+.dtp .dtp-actual-meridien a.selected {
+  background: $color-bluegrey-fg;
+  color: $color-bluegrey-bg;
+}
+
+.dtp .dtp-picker-time > .dtp-select-hour {
+  cursor: pointer;
+}
+
+.dtp .dtp-picker-time > .dtp-select-minute {
+  cursor: pointer;
+}
+
+.dtp .dtp-buttons {
+  padding: 0 1em 1em 1em;
+  text-align: right;
+}
+
+/*.dtp .dtp-buttons .btn-flat {*/
+/*border: none;*/
+/*padding: .5em;*/
+/*color: #fff;*/
+/*background-color: #607D8B;*/
+/*}*/
+
+.dtp.hidden, .dtp .hidden {
+  display: none;
+}
+
+.dtp .invisible {
+  visibility: hidden;
+}
+
+.dtp .left {
+  float: left;
+}
+
+.dtp .right {
+  float: right;
+}
+
+.dtp .clearfix {
+  clear: both;
+}
+
+.dtp .center {
+  text-align: center;
+}
+
diff --git a/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.css b/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.css
new file mode 100644
index 000000000..0ecad7d84
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.css
@@ -0,0 +1,53 @@
+.dialog-container,
+.loading-container {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  overflow: scroll;
+  background: rgba(0, 0, 0, 0.4);
+  z-index: 9999;
+  opacity: 0;
+  -webkit-transition: opacity 400ms ease-in;
+  -moz-transition: opacity 400ms ease-in;
+  transition: opacity 400ms ease-in; }
+
+.dialog-container > div {
+  position: relative;
+  width: 90%;
+  max-width: 500px;
+  min-height: 25px;
+  margin: 10% auto;
+  z-index: 9999;
+  padding-bottom: 1em; }
+
+.dialog-container > div > * {
+  padding: 0 1em; }
+
+.dialog-container header {
+  font-size: 20px;
+  font-weight: 500;
+  letter-spacing: 0.02em;
+  line-height: 1;
+  background-color: #607d8b;
+  color: #eceff1;
+  padding: .5em;
+  text-align: center; }
+
+.dialog-button-bar {
+  text-align: right;
+  margin-top: 8px; }
+
+.loading-container > div {
+  position: relative;
+  width: 50px;
+  height: 50px;
+  margin: 10% auto;
+  z-index: 9999; }
+
+.loading-container > div > div {
+  width: 100%;
+  height: 100%; }
+
+/*# sourceMappingURL=mdl-jquery-modal-dialog.css.map */
diff --git a/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.css.map b/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.css.map
new file mode 100644
index 000000000..32b3f0a2c
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AAEA;kBACmB;EACjB,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,CAAC;EACN,KAAK,EAAE,CAAC;EACR,MAAM,EAAE,CAAC;EACT,IAAI,EAAE,CAAC;EACP,QAAQ,EAAE,MAAM;EAChB,UAAU,EAAE,kBAAkB;EAC9B,OAAO,EAAE,IAAI;EACb,OAAO,EAAE,CAAC;EACV,kBAAkB,EAAE,qBAAqB;EACzC,eAAe,EAAE,qBAAqB;EACtC,UAAU,EAAE,qBAAqB;;AAGnC,uBAAwB;EACtB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,GAAG;EACV,SAAS,EAAE,KAAK;EAChB,UAAU,EAAE,IAAI;EAChB,MAAM,EAAE,QAAQ;EAChB,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,GAAG;;AAGrB,2BAA4B;EAC1B,OAAO,EAAE,KAAK;;AAGhB,wBAAyB;EACvB,SAAS,EAAE,IAAI;EACf,WAAW,EAAE,GAAG;EAChB,cAAc,EAAE,MAAM;EACtB,WAAW,EAAE,CAAC;EACd,gBAAgB,ECzBE,OAAO;ED0BzB,KAAK,EC3Ba,OAAO;ED4BzB,OAAO,EAAE,IAAI;EACb,UAAU,EAAE,MAAM;;AAGpB,kBAAmB;EACjB,UAAU,EAAE,KAAK;EACjB,UAAU,EAAE,GAAG;;AAGjB,wBAAyB;EACvB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,MAAM,EAAE,QAAQ;EAChB,OAAO,EAAE,IAAI;;AAGf,8BAA+B;EAC7B,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI",
+"sources": ["mdl-jquery-modal-dialog.scss","_base.scss"],
+"names": [],
+"file": "mdl-jquery-modal-dialog.css"
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.min.css b/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.min.css
new file mode 100644
index 000000000..90c091bf1
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.min.css
@@ -0,0 +1,58 @@
+.dialog-container,
+.loading-container {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    overflow: scroll;
+    background: rgba(0, 0, 0, 0.4);
+    z-index: 9999;
+    opacity: 0;
+    -webkit-transition: opacity 400ms ease-in;
+    -moz-transition: opacity 400ms ease-in;
+    transition: opacity 400ms ease-in
+}
+
+.dialog-container>div {
+    position: relative;
+    width: 90%;
+    max-width: 500px;
+    min-height: 25px;
+    margin: 10% auto;
+    z-index: 9999;
+    padding-bottom: 1em
+}
+
+.dialog-container>div>* {
+    padding: 0 1em
+}
+
+.dialog-container header {
+    font-size: 20px;
+    font-weight: 500;
+    letter-spacing: .02em;
+    line-height: 1;
+    background-color: #0D1117;
+    color: #c9c9c9;
+    padding: .5em;
+    text-align: center
+}
+
+.dialog-button-bar {
+    text-align: right;
+    margin-top: 8px
+}
+
+.loading-container>div {
+    position: relative;
+    width: 50px;
+    height: 50px;
+    margin: 10% auto;
+    z-index: 9999
+}
+
+.loading-container>div>div {
+    width: 100%;
+    height: 100%
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.scss b/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.scss
new file mode 100644
index 000000000..64fd02579
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/mdl-jquery-modal-dialog.scss
@@ -0,0 +1,61 @@
+@import "base";
+
+.dialog-container,
+.loading-container {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  overflow: scroll;
+  background: rgba(0, 0, 0, 0.4);
+  z-index: 9999;
+  opacity: 0;
+  -webkit-transition: opacity 400ms ease-in;
+  -moz-transition: opacity 400ms ease-in;
+  transition: opacity 400ms ease-in;
+}
+
+.dialog-container > div {
+  position: relative;
+  width: 90%;
+  max-width: 500px;
+  min-height: 25px;
+  margin: 10% auto;
+  z-index: 9999;
+  padding-bottom: 1em;
+}
+
+.dialog-container > div > * {
+  padding: 0 1em;
+}
+
+.dialog-container header {
+  font-size: 20px;
+  font-weight: 500;
+  letter-spacing: 0.02em;
+  line-height: 1;
+  background-color: $color-bluegrey-fg;
+  color: $color-bluegrey-bg;
+  padding: .5em;
+  text-align: center;
+}
+
+.dialog-button-bar {
+  text-align: right;
+  margin-top: 8px;
+}
+
+.loading-container > div {
+  position: relative;
+  width: 50px;
+  height: 50px;
+  margin: 10% auto;
+  z-index: 9999;
+}
+
+.loading-container > div > div {
+  width: 100%;
+  height: 100%;
+}
+
diff --git a/app/modules/web/themes/material-dark/css/search-card.css b/app/modules/web/themes/material-dark/css/search-card.css
new file mode 100644
index 000000000..eaa5c5215
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/search-card.css
@@ -0,0 +1,100 @@
+@charset "UTF-8";
+/* Estilos para mostrar la búsqueda en formato cuadrícula */
+#content #data-search {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-start;
+  text-align: center;
+  padding: 0.5em 0;
+  width: 100%;
+  margin: 0 auto; }
+  #content #data-search .account-label {
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    width: 25em;
+    min-height: 8em;
+    height: auto;
+    text-align: left;
+    margin: .5em .5em;
+    color: #696969;
+    background-color: #fcfcfc;
+    padding: 0 .5em; }
+    #content #data-search .account-label .label-row-up,
+    #content #data-search .account-label .label-row-down {
+      display: flex;
+      flex-wrap: wrap;
+      height: auto;
+      min-height: 3em;
+      width: 100%;
+      padding: 0.5em 0; }
+    #content #data-search .account-label .label-row-down {
+      height: 3em; }
+    #content #data-search .account-label .label-left {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      width: 100%;
+      height: auto; }
+    #content #data-search .account-label .label-right {
+      display: flex;
+      flex-wrap: wrap;
+      width: 100%;
+      height: auto; }
+      #content #data-search .account-label .label-right > div {
+        width: 100%; }
+    #content #data-search .account-label .label-field {
+      width: 100%;
+      min-height: 3em;
+      height: auto;
+      padding: 0 .3em; }
+    #content #data-search .account-label .field-text {
+      word-wrap: break-word; }
+      #content #data-search .account-label .field-text a {
+        color: #5c6bc0; }
+    #content #data-search .account-label .field-customer {
+      flex-grow: 2; }
+    #content #data-search .account-label .field-name {
+      padding: 0.3em 0.2em;
+      color: #b9b9b9;
+      text-align: left;
+      border-bottom: 1px solid #d9d9d9; }
+    #content #data-search .account-label .field-name-hidden {
+      display: none; }
+    #content #data-search .account-label .header .field-name {
+      color: white;
+      font-weight: bold; }
+    #content #data-search .account-label .no-link,
+    #content #data-search .account-label .no-link a {
+      color: white;
+      font-weight: bold; }
+  #content #data-search .account-info {
+    padding: .5em 0 .5em 0;
+    text-align: left;
+    opacity: 0.3;
+    min-height: 4em; }
+    #content #data-search .account-info:hover {
+      opacity: 1; }
+  #content #data-search .account-actions {
+    align-self: baseline;
+    padding: .5em 0;
+    text-align: right;
+    border-top: 1px solid #c9c9c9; }
+    #content #data-search .account-actions i {
+      opacity: .5; }
+      #content #data-search .account-actions i:hover {
+        opacity: 1; }
+  #content #data-search .account-spacer {
+    float: left;
+    clear: left;
+    height: 2em;
+    width: 20%; }
+  #content #data-search .tags-box {
+    display: inline-block; }
+    #content #data-search .tags-box span.tag {
+      cursor: pointer;
+      opacity: 0.3; }
+      #content #data-search .tags-box span.tag:hover {
+        opacity: 1; }
+
+/*# sourceMappingURL=search-card.css.map */
diff --git a/app/modules/web/themes/material-dark/css/search-card.css.map b/app/modules/web/themes/material-dark/css/search-card.css.map
new file mode 100644
index 000000000..3ef7a4be0
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/search-card.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": ";AAAA,4DAA4D;AAI1D,qBAAa;EACX,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,IAAI;EACf,eAAe,EAAE,UAAU;EAC3B,UAAU,EAAE,MAAM;EAClB,OAAO,EAAE,OAAO;EAChB,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,MAAM;EAEd,oCAAe;IACb,OAAO,EAAE,IAAI;IACb,eAAe,EAAE,aAAa;IAC9B,SAAS,EAAE,IAAI;IACf,KAAK,EAAE,IAAI;IACX,UAAU,EAAE,GAAG;IACf,MAAM,EAAE,IAAI;IACZ,UAAU,EAAE,IAAI;IAChB,MAAM,EAAE,SAAS;IACjB,KAAK,EAAE,OAAO;IACd,gBAAgB,EAAE,OAAO;IACzB,OAAO,EAAE,MAAM;IAEf;wDACgB;MACd,OAAO,EAAE,IAAI;MACb,SAAS,EAAE,IAAI;MACf,MAAM,EAAE,IAAI;MACZ,UAAU,EAAE,GAAG;MACf,KAAK,EAAE,IAAI;MACX,OAAO,EAAE,OAAO;IAGlB,oDAAgB;MACd,MAAM,EAAE,GAAG;IAGb,gDAAY;MACV,OAAO,EAAE,IAAI;MACb,SAAS,EAAE,IAAI;MACf,WAAW,EAAE,MAAM;MACnB,KAAK,EAAE,IAAI;MACX,MAAM,EAAE,IAAI;IAGd,iDAAa;MACX,OAAO,EAAE,IAAI;MACb,SAAS,EAAE,IAAI;MACf,KAAK,EAAE,IAAI;MACX,MAAM,EAAE,IAAI;MACZ,uDAAQ;QACN,KAAK,EAAE,IAAI;IAIf,iDAAa;MACX,KAAK,EAAE,IAAI;MACX,UAAU,EAAE,GAAG;MACf,MAAM,EAAE,IAAI;MACZ,OAAO,EAAE,MAAM;IAGjB,gDAAY;MACV,SAAS,EAAE,UAAU;MACrB,kDAAE;QACA,KAAK,EC3DG,OAAO;ID+DnB,oDAAgB;MACd,SAAS,EAAE,CAAC;IAGd,gDAAY;MACV,OAAO,EAAE,WAAW;MACpB,KAAK,EAAE,OAAO;MACd,UAAU,EAAE,IAAI;MAChB,aAAa,EAAE,iBACjB;IAEA,uDAAmB;MACjB,OAAO,EAAE,IAAI;IAGf,wDAAoB;MAClB,KAAK,EAAE,KAAK;MACZ,WAAW,EAAE,IAAI;IAGnB;mDACW;MACT,KAAK,EAAE,KAAK;MACZ,WAAW,EAAE,IAAI;EAIrB,mCAAc;IACZ,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,IAAI;IAChB,OAAO,EAAE,GAAG;IACZ,UAAU,EAAE,GAAG;IACf,yCAAQ;MACN,OAAO,EAAE,CAAC;EAId,sCAAiB;IACf,UAAU,EAAE,QAAQ;IACpB,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,iBAAiB;IAC7B,wCAAE;MACA,OAAO,EAAE,EAAE;MACX,8CAAQ;QACN,OAAO,EAAE,CAAC;EAKhB,qCAAgB;IACd,KAAK,EAAE,IAAI;IACX,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;EAGZ,+BAAU;IACR,OAAO,EAAE,YAAY;IAErB,wCAAS;MACP,MAAM,EAAE,OAAO;MACf,OAAO,EAAE,GAAG;MACZ,8CAAQ;QACN,OAAO,EAAE,CAAC",
+"sources": ["search-card.scss","_base.scss"],
+"names": [],
+"file": "search-card.css"
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/search-card.min.css b/app/modules/web/themes/material-dark/css/search-card.min.css
new file mode 100644
index 000000000..0953d7b29
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/search-card.min.css
@@ -0,0 +1,144 @@
+@charset "UTF-8";
+#content #data-search {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    text-align: center;
+    padding: .5em 0;
+    width: 100%;
+    margin: 0 auto
+}
+
+#content #data-search .account-label {
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    width: 25em;
+    min-height: 8em;
+    height: auto;
+    text-align: left;
+    margin: .5em .5em;
+    color: #696969;
+    background-color: #161B22;
+    padding: 0 .5em
+}
+
+#content #data-search .account-label .label-row-up,
+#content #data-search .account-label .label-row-down {
+    display: flex;
+    flex-wrap: wrap;
+    height: auto;
+    min-height: 3em;
+    width: 100%;
+    padding: .5em 0
+}
+
+#content #data-search .account-label .label-row-down {
+    height: 3em
+}
+
+#content #data-search .account-label .label-left {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    width: 100%;
+    height: auto
+}
+
+#content #data-search .account-label .label-right {
+    display: flex;
+    flex-wrap: wrap;
+    width: 100%;
+    height: auto
+}
+
+#content #data-search .account-label .label-right>div {
+    width: 100%
+}
+
+#content #data-search .account-label .label-field {
+    width: 100%;
+    min-height: 3em;
+    height: auto;
+    padding: 0 .3em
+}
+
+#content #data-search .account-label .field-text {
+    word-wrap: break-word
+}
+
+#content #data-search .account-label .field-text a {
+    color: #5c6bc0
+}
+
+#content #data-search .account-label .field-customer {
+    flex-grow: 2
+}
+
+#content #data-search .account-label .field-name {
+    padding: .3em .2em;
+    color: #b9b9b9;
+    text-align: left;
+    border-bottom: 1px solid #0D1117;
+}
+
+#content #data-search .account-label .field-name-hidden {
+    display: none
+}
+
+#content #data-search .account-label .header .field-name {
+    color: white;
+    font-weight: bold
+}
+
+#content #data-search .account-label .no-link,
+#content #data-search .account-label .no-link a {
+    color: white;
+    font-weight: bold
+}
+
+#content #data-search .account-info {
+    padding: .5em 0 .5em 0;
+    text-align: left;
+    opacity: .3;
+    min-height: 4em
+}
+
+#content #data-search .account-info:hover {
+    opacity: 1
+}
+
+#content #data-search .account-actions {
+    align-self: baseline;
+    padding: .5em 0;
+    text-align: right;
+    border-top: 1px solid #0D1117;
+}
+
+#content #data-search .account-actions i {
+    opacity: .5
+}
+
+#content #data-search .account-actions i:hover {
+    opacity: 1
+}
+
+#content #data-search .account-spacer {
+    float: left;
+    clear: left;
+    height: 2em;
+    width: 20%
+}
+
+#content #data-search .tags-box {
+    display: inline-block
+}
+
+#content #data-search .tags-box span.tag {
+    cursor: pointer;
+    opacity: .3
+}
+
+#content #data-search .tags-box span.tag:hover {
+    opacity: 1
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/search-card.scss b/app/modules/web/themes/material-dark/css/search-card.scss
new file mode 100644
index 000000000..1549b2a4e
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/search-card.scss
@@ -0,0 +1,142 @@
+/* Estilos para mostrar la búsqueda en formato cuadrícula */
+@import "base";
+
+#content {
+  #data-search {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    text-align: center;
+    padding: 0.5em 0;
+    width: 100%;
+    margin: 0 auto;
+
+    .account-label {
+      display: flex;
+      justify-content: space-between;
+      flex-wrap: wrap;
+      width: 25em;
+      min-height: 8em;
+      height: auto;
+      text-align: left;
+      margin: .5em .5em;
+      color: #696969;
+      background-color: #fcfcfc;
+      padding: 0 .5em;
+
+      .label-row-up,
+      .label-row-down {
+        display: flex;
+        flex-wrap: wrap;
+        height: auto;
+        min-height: 3em;
+        width: 100%;
+        padding: 0.5em 0;
+      }
+
+      .label-row-down {
+        height: 3em;
+      }
+
+      .label-left {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        width: 100%;
+        height: auto;
+      }
+
+      .label-right {
+        display: flex;
+        flex-wrap: wrap;
+        width: 100%;
+        height: auto;
+        & > div {
+          width: 100%;
+        }
+      }
+
+      .label-field {
+        width: 100%;
+        min-height: 3em;
+        height: auto;
+        padding: 0 .3em;
+      }
+
+      .field-text {
+        word-wrap: break-word;
+        a {
+          color: $color-indigo-fg;
+        }
+      }
+
+      .field-customer {
+        flex-grow: 2;
+      }
+
+      .field-name {
+        padding: 0.3em 0.2em;
+        color: #b9b9b9;
+        text-align: left;
+        border-bottom: 1px solid #d9d9d9
+      }
+
+      .field-name-hidden {
+        display: none;
+      }
+
+      .header .field-name {
+        color: white;
+        font-weight: bold
+      }
+
+      .no-link,
+      .no-link a {
+        color: white;
+        font-weight: bold;
+      }
+    }
+
+    .account-info {
+      padding: .5em 0 .5em 0;
+      text-align: left;
+      opacity: 0.3;
+      min-height: 4em;
+      &:hover {
+        opacity: 1;
+      }
+    }
+
+    .account-actions {
+      align-self: baseline;
+      padding: .5em 0;
+      text-align: right;
+      border-top: 1px solid #c9c9c9;
+      i {
+        opacity: .5;
+        &:hover {
+          opacity: 1;
+        }
+      }
+    }
+
+    .account-spacer {
+      float: left;
+      clear: left;
+      height: 2em;
+      width: 20%
+    }
+
+    .tags-box {
+      display: inline-block;
+
+      span.tag {
+        cursor: pointer;
+        opacity: 0.3;
+        &:hover {
+          opacity: 1;
+        }
+      }
+    }
+  }
+}
diff --git a/app/modules/web/themes/material-dark/css/search-grid.css b/app/modules/web/themes/material-dark/css/search-grid.css
new file mode 100644
index 000000000..dc62e20a4
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/search-grid.css
@@ -0,0 +1,119 @@
+@charset "UTF-8";
+/* Estilos para mostrar la búsqueda en formato cuadrícula */
+#content #data-search {
+  text-align: center;
+  padding: 0.5em 0;
+  width: 100%;
+  margin: 0 auto; }
+  #content #data-search .account-info img,
+  #content #data-search .account-actions img {
+    width: 24px;
+    height: 24px;
+    margin: 0 0.5em; }
+  #content #data-search .account-label {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    min-height: 8em;
+    height: auto;
+    text-align: left;
+    margin: 0 auto 0.5em;
+    color: #696969;
+    background-color: #fcfcfc;
+    padding: 0 .5em; }
+    #content #data-search .account-label .label-row-up,
+    #content #data-search .account-label .label-row-down {
+      display: flex;
+      min-height: 3em;
+      height: auto;
+      width: 100%;
+      padding: 0.5em 0; }
+    #content #data-search .account-label .label-row-down {
+      height: 3em; }
+    #content #data-search .account-label .label-left {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      width: 100%;
+      height: 4em; }
+    #content #data-search .account-label .label-right {
+      display: flex;
+      flex-wrap: wrap;
+      width: 18em;
+      height: 4em; }
+      #content #data-search .account-label .label-right > div {
+        width: 18em; }
+    #content #data-search .account-label .label-field {
+      width: 100%;
+      min-height: 3em;
+      height: auto;
+      padding: 0 .3em; }
+    #content #data-search .account-label .field-text {
+      word-wrap: break-word; }
+      #content #data-search .account-label .field-text a {
+        color: #5c6bc0; }
+    #content #data-search .account-label .field-customer {
+      flex-grow: 2; }
+    #content #data-search .account-label .field-name {
+      padding: 0.3em 0.2em;
+      color: #b9b9b9;
+      display: none; }
+    #content #data-search .account-label .field-name-hidden {
+      display: none; }
+    #content #data-search .account-label .header .field-name {
+      color: white;
+      font-weight: bold; }
+    #content #data-search .account-label .no-link,
+    #content #data-search .account-label .no-link a {
+      color: white;
+      font-weight: bold; }
+  #content #data-search .account-info {
+    padding: .5em 0 .5em 0;
+    text-align: left;
+    opacity: 0.3;
+    min-height: 4em; }
+    #content #data-search .account-info:hover {
+      opacity: 1; }
+  #content #data-search .account-actions {
+    align-self: baseline;
+    padding: .5em 0;
+    text-align: right;
+    border-top: 1px solid #c9c9c9; }
+  #content #data-search .account-spacer {
+    float: left;
+    clear: left;
+    height: 2em;
+    width: 20%; }
+  #content #data-search .tags-box {
+    display: inline-block; }
+    #content #data-search .tags-box span.tag {
+      cursor: pointer;
+      opacity: 0.3; }
+      #content #data-search .tags-box span.tag:hover {
+        opacity: 1; }
+
+@media screen and (max-width: 1000px) {
+  #content #data-search .account-label {
+    flex-wrap: wrap; }
+    #content #data-search .account-label .label-row-up,
+    #content #data-search .account-label .label-row-down {
+      flex-wrap: wrap;
+      height: auto; }
+    #content #data-search .account-label .label-field .field-name {
+      display: block;
+      text-align: left;
+      border-bottom: 1px solid #d9d9d9;
+      color: #607d8b; }
+    #content #data-search .account-label .label-left,
+    #content #data-search .account-label .label-right {
+      height: auto; }
+    #content #data-search .account-label .label-right,
+    #content #data-search .account-label .label-right > div {
+      width: 100%; } }
+/* Default styles first then media queries */
+/*@media screen and (min-width: 400px)  {}*/
+/*@media screen and (min-width: 600px)  {}*/
+/*@media screen and (min-width: 1000px) {}*/
+/*@media screen and (min-width: 1400px) {}*/
+
+/*# sourceMappingURL=search-grid.css.map */
diff --git a/app/modules/web/themes/material-dark/css/search-grid.css.map b/app/modules/web/themes/material-dark/css/search-grid.css.map
new file mode 100644
index 000000000..3e792bfb5
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/search-grid.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": ";AAAA,4DAA4D;AAI1D,qBAAa;EACX,UAAU,EAAE,MAAM;EAClB,OAAO,EAAE,OAAO;EAChB,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,MAAM;EAEd;4CACqB;IACnB,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,IAAI;IACZ,MAAM,EAAE,OAAO;EAGjB,oCAAe;IACb,OAAO,EAAE,IAAI;IACb,eAAe,EAAE,aAAa;IAC9B,KAAK,EAAE,IAAI;IACX,UAAU,EAAE,GAAG;IACf,MAAM,EAAE,IAAI;IACZ,UAAU,EAAE,IAAI;IAChB,MAAM,EAAE,YAAY;IACpB,KAAK,EAAE,OAAO;IACd,gBAAgB,EAAE,OAAO;IACzB,OAAO,EAAE,MAAM;IAEf;wDACgB;MACd,OAAO,EAAE,IAAI;MACb,UAAU,EAAE,GAAG;MACf,MAAM,EAAE,IAAI;MACZ,KAAK,EAAE,IAAI;MACX,OAAO,EAAE,OAAO;IAGlB,oDAAgB;MACd,MAAM,EAAE,GAAG;IAGb,gDAAY;MACV,OAAO,EAAE,IAAI;MACb,SAAS,EAAE,IAAI;MACf,WAAW,EAAE,MAAM;MACnB,KAAK,EAAE,IAAI;MACX,MAAM,EAAE,GAAG;IAGb,iDAAa;MACX,OAAO,EAAE,IAAI;MACb,SAAS,EAAE,IAAI;MACf,KAAK,EAAE,IAAI;MACX,MAAM,EAAE,GAAG;MACX,uDAAQ;QACN,KAAK,EAAE,IAAI;IAIf,iDAAa;MACX,KAAK,EAAE,IAAI;MACX,UAAU,EAAE,GAAG;MACf,MAAM,EAAE,IAAI;MACZ,OAAO,EAAE,MAAM;IAGjB,gDAAY;MACV,SAAS,EAAE,UAAU;MACrB,kDAAE;QACA,KAAK,EC7DG,OAAO;IDiEnB,oDAAgB;MACd,SAAS,EAAE,CAAC;IAGd,gDAAY;MACV,OAAO,EAAE,WAAW;MACpB,KAAK,EAAE,OAAO;MACd,OAAO,EAAE,IAAI;IAGf,uDAAmB;MACjB,OAAO,EAAE,IAAI;IAGf,wDAAoB;MAClB,KAAK,EAAE,KAAK;MACZ,WAAW,EAAE,IAAI;IAGnB;mDACW;MACT,KAAK,EAAE,KAAK;MACZ,WAAW,EAAE,IAAI;EAIrB,mCAAc;IACZ,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,IAAI;IAChB,OAAO,EAAE,GAAG;IACZ,UAAU,EAAE,GAAG;IACf,yCAAQ;MACN,OAAO,EAAE,CAAC;EAId,sCAAiB;IACf,UAAU,EAAE,QAAQ;IACpB,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,iBAAiB;EAG/B,qCAAgB;IACd,KAAK,EAAE,IAAI;IACX,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;EAGZ,+BAAU;IACR,OAAO,EAAE,YAAY;IAErB,wCAAS;MACP,MAAM,EAAE,OAAO;MACf,OAAO,EAAE,GAAG;MACZ,8CAAQ;QACN,OAAO,EAAE,CAAC;;AAOpB,qCAAsC;EAGhC,oCAAe;IACb,SAAS,EAAE,IAAI;IAEf;wDACgB;MACd,SAAS,EAAE,IAAI;MACf,MAAM,EAAE,IAAI;IAIZ,6DAAY;MACV,OAAO,EAAE,KAAK;MACd,UAAU,EAAE,IAAI;MAChB,aAAa,EAAE,iBAAiB;MAChC,KAAK,EC/IG,OAAO;IDmJnB;qDACa;MACX,MAAM,EAAE,IAAI;IAGd;2DACmB;MACjB,KAAK,EAAE,IAAI;AAOrB,6CAA6C;AAC7C,4CAA4C;AAC5C,4CAA4C;AAC5C,4CAA4C;AAC5C,4CAA4C",
+"sources": ["search-grid.scss","_base.scss"],
+"names": [],
+"file": "search-grid.css"
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/search-grid.min.css b/app/modules/web/themes/material-dark/css/search-grid.min.css
new file mode 100644
index 000000000..0e0b8b70e
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/search-grid.min.css
@@ -0,0 +1,162 @@
+@charset "UTF-8";
+#content #data-search {
+    text-align: center;
+    padding: .5em 0;
+    width: 100%;
+    margin: 0 auto
+}
+
+#content #data-search .account-info img,
+#content #data-search .account-actions img {
+    width: 24px;
+    height: 24px;
+    margin: 0 .5em
+}
+
+#content #data-search .account-label {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    min-height: 8em;
+    height: auto;
+    text-align: left;
+    margin: 0 auto .5em;
+    color: #696969;
+    background-color: #161B22;
+    padding: 0 .5em
+}
+
+#content #data-search .account-label .label-row-up,
+#content #data-search .account-label .label-row-down {
+    display: flex;
+    min-height: 3em;
+    height: auto;
+    width: 100%;
+    padding: .5em 0
+}
+
+#content #data-search .account-label .label-row-down {
+    height: 3em
+}
+
+#content #data-search .account-label .label-left {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    width: 100%;
+    height: 4em
+}
+
+#content #data-search .account-label .label-right {
+    display: flex;
+    flex-wrap: wrap;
+    width: 18em;
+    height: 4em
+}
+
+#content #data-search .account-label .label-right>div {
+    width: 18em
+}
+
+#content #data-search .account-label .label-field {
+    width: 100%;
+    min-height: 3em;
+    height: auto;
+    padding: 0 .3em
+}
+
+#content #data-search .account-label .field-text {
+    word-wrap: break-word
+}
+
+#content #data-search .account-label .field-text a {
+    color: #5c6bc0
+}
+
+#content #data-search .account-label .field-customer {
+    flex-grow: 2
+}
+
+#content #data-search .account-label .field-name {
+    padding: .3em .2em;
+    color: #b9b9b9;
+    display: none
+}
+
+#content #data-search .account-label .field-name-hidden {
+    display: none
+}
+
+#content #data-search .account-label .header .field-name {
+    color: white;
+    font-weight: bold
+}
+
+#content #data-search .account-label .no-link,
+#content #data-search .account-label .no-link a {
+    color: white;
+    font-weight: bold
+}
+
+#content #data-search .account-info {
+    padding: .5em 0 .5em 0;
+    text-align: left;
+    opacity: .3;
+    min-height: 4em
+}
+
+#content #data-search .account-info:hover {
+    opacity: 1
+}
+
+#content #data-search .account-actions {
+    align-self: baseline;
+    padding: .5em 0;
+    text-align: right;
+    border-top: 1px solid #0D1117
+}
+
+#content #data-search .account-spacer {
+    float: left;
+    clear: left;
+    height: 2em;
+    width: 20%
+}
+
+#content #data-search .tags-box {
+    display: inline-block
+}
+
+#content #data-search .tags-box span.tag {
+    cursor: pointer;
+    opacity: .3
+}
+
+#content #data-search .tags-box span.tag:hover {
+    opacity: 1
+}
+
+@media screen and (max-width:1000px) {
+    #content #data-search .account-label {
+        flex-wrap: wrap
+    }
+    #content #data-search .account-label .label-row-up,
+    #content #data-search .account-label .label-row-down {
+        flex-wrap: wrap;
+        height: auto
+    }
+    #content #data-search .account-label .label-field .field-name {
+        display: block;
+        text-align: left;
+        border-bottom: 1px solid #d9d9d9;
+        color: #607d8b
+    }
+    #content #data-search .account-label .label-left,
+    #content #data-search .account-label .label-right {
+        height: auto
+    }
+    #content #data-search .account-label .label-right,
+    #content #data-search .account-label .label-right>div {
+        width: 100%
+    }
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/search-grid.scss b/app/modules/web/themes/material-dark/css/search-grid.scss
new file mode 100644
index 000000000..0a8da08f5
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/search-grid.scss
@@ -0,0 +1,178 @@
+/* Estilos para mostrar la búsqueda en formato cuadrícula */
+@import "base";
+
+#content {
+  #data-search {
+    text-align: center;
+    padding: 0.5em 0;
+    width: 100%;
+    margin: 0 auto;
+
+    .account-info img,
+    .account-actions img {
+      width: 24px;
+      height: 24px;
+      margin: 0 0.5em;
+    }
+
+    .account-label {
+      display: flex;
+      justify-content: space-between;
+      width: 100%;
+      min-height: 8em;
+      height: auto;
+      text-align: left;
+      margin: 0 auto 0.5em;
+      color: #696969;
+      background-color: #fcfcfc;
+      padding: 0 .5em;
+
+      .label-row-up,
+      .label-row-down {
+        display: flex;
+        min-height: 3em;
+        height: auto;
+        width: 100%;
+        padding: 0.5em 0;
+      }
+
+      .label-row-down {
+        height: 3em;
+      }
+
+      .label-left {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        width: 100%;
+        height: 4em;
+      }
+
+      .label-right {
+        display: flex;
+        flex-wrap: wrap;
+        width: 18em;
+        height: 4em;
+        & > div {
+          width: 18em;
+        }
+      }
+
+      .label-field {
+        width: 100%;
+        min-height: 3em;
+        height: auto;
+        padding: 0 .3em;
+      }
+
+      .field-text {
+        word-wrap: break-word;
+        a {
+          color: $color-indigo-fg;
+        }
+      }
+
+      .field-customer {
+        flex-grow: 2;
+      }
+
+      .field-name {
+        padding: 0.3em 0.2em;
+        color: #b9b9b9;
+        display: none
+      }
+
+      .field-name-hidden {
+        display: none;
+      }
+
+      .header .field-name {
+        color: white;
+        font-weight: bold
+      }
+
+      .no-link,
+      .no-link a {
+        color: white;
+        font-weight: bold;
+      }
+    }
+
+    .account-info {
+      padding: .5em 0 .5em 0;
+      text-align: left;
+      opacity: 0.3;
+      min-height: 4em;
+      &:hover {
+        opacity: 1;
+      }
+    }
+
+    .account-actions {
+      align-self: baseline;
+      padding: .5em 0;
+      text-align: right;
+      border-top: 1px solid #c9c9c9;
+    }
+
+    .account-spacer {
+      float: left;
+      clear: left;
+      height: 2em;
+      width: 20%
+    }
+
+    .tags-box {
+      display: inline-block;
+
+      span.tag {
+        cursor: pointer;
+        opacity: 0.3;
+        &:hover {
+          opacity: 1;
+        }
+      }
+    }
+  }
+}
+
+@media screen and (max-width: 1000px) {
+  #content {
+    #data-search {
+      .account-label {
+        flex-wrap: wrap;
+
+        .label-row-up,
+        .label-row-down {
+          flex-wrap: wrap;
+          height: auto;
+        }
+
+        .label-field {
+          .field-name {
+            display: block;
+            text-align: left;
+            border-bottom: 1px solid #d9d9d9;
+            color: $color-bluegrey-fg;
+          }
+        }
+
+        .label-left,
+        .label-right {
+          height: auto;
+        }
+
+        .label-right,
+        .label-right > div {
+          width: 100%;
+        }
+      }
+    }
+  }
+}
+
+/* Default styles first then media queries */
+/*@media screen and (min-width: 400px)  {}*/
+/*@media screen and (min-width: 600px)  {}*/
+/*@media screen and (min-width: 1000px) {}*/
+/*@media screen and (min-width: 1400px) {}*/
diff --git a/app/modules/web/themes/material-dark/css/selectize-custom.css b/app/modules/web/themes/material-dark/css/selectize-custom.css
new file mode 100644
index 000000000..8f6a51317
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/selectize-custom.css
@@ -0,0 +1,406 @@
+@charset "UTF-8";
+/**
+ * selectize.bootstrap3.css (v0.12.1) - Bootstrap 3 Theme
+ * Copyright (c) 2013–2015 Brian Reavis & contributors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
+ * file except in compliance with the License. You may obtain a copy of the License at:
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
+ * ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ *
+ * @author Brian Reavis <brian@thirdroute.com>
+ */
+.selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
+  visibility: visible !important;
+  background: #f2f2f2 !important;
+  background: rgba(0, 0, 0, 0.06) !important;
+  border: 0 none !important;
+  -webkit-box-shadow: inset 0 0 12px 4px #ffffff;
+  box-shadow: inset 0 0 12px 4px #ffffff; }
+
+.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
+  content: '!';
+  visibility: hidden; }
+
+.selectize-control.plugin-drag_drop .ui-sortable-helper {
+  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); }
+
+.selectize-dropdown-header {
+  position: relative;
+  padding: 3px 12px;
+  border-bottom: 1px solid #d0d0d0;
+  background: #f8f8f8;
+  -webkit-border-radius: 4px 4px 0 0;
+  -moz-border-radius: 4px 4px 0 0;
+  border-radius: 4px 4px 0 0; }
+
+.selectize-dropdown-header-close {
+  position: absolute;
+  right: 12px;
+  top: 50%;
+  color: #333333;
+  opacity: 0.4;
+  margin-top: -12px;
+  line-height: 20px;
+  font-size: 20px !important; }
+
+.selectize-dropdown-header-close:hover {
+  color: #000000; }
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup {
+  border-right: 1px solid #f2f2f2;
+  border-top: 0 none;
+  float: left;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box; }
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
+  border-right: 0 none; }
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup:before {
+  display: none; }
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
+  border-top: 0 none; }
+
+.selectize-control.plugin-remove_button [data-value] {
+  position: relative;
+  padding-right: 24px !important; }
+
+.selectize-control.plugin-remove_button [data-value] .remove {
+  z-index: 1;
+  /* fixes ie bug (see #392) */
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  width: 17px;
+  text-align: center;
+  font-weight: bold;
+  font-size: 12px;
+  color: inherit;
+  text-decoration: none;
+  vertical-align: middle;
+  display: inline-block;
+  padding: 1px 0 0 0;
+  border-left: 1px solid transparent;
+  -webkit-border-radius: 0 2px 2px 0;
+  -moz-border-radius: 0 2px 2px 0;
+  border-radius: 0 2px 2px 0;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box; }
+
+.selectize-control.plugin-remove_button [data-value] .remove:hover {
+  background: rgba(0, 0, 0, 0.05); }
+
+.selectize-control.plugin-remove_button [data-value].active .remove {
+  border-left-color: transparent; }
+
+.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
+  background: none; }
+
+.selectize-control.plugin-remove_button .disabled [data-value] .remove {
+  border-left-color: rgba(77, 77, 77, 0); }
+
+.selectize-control {
+  position: relative;
+  padding: 20px 0; }
+
+.selectize-dropdown,
+.selectize-input,
+.selectize-input input {
+  color: #333333;
+  /*font-family: inherit;*/
+  /*font-size: inherit;*/
+  line-height: 20px;
+  -webkit-font-smoothing: inherit; }
+
+.selectize-control.single {
+  display: inline-block; }
+
+.selectize-input,
+.selectize-control.single .selectize-input.input-active {
+  background: #ffffff;
+  cursor: text;
+  display: inline-block; }
+
+.selectize-input {
+  border-bottom: 1px solid #cccccc;
+  padding: 3px 0;
+  display: inline-block;
+  width: 300px;
+  overflow: hidden;
+  position: relative;
+  z-index: 1;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-box-shadow: none;
+  box-shadow: none; }
+
+.selectize-input.has-items {
+  color: #5c6bc0;
+  font-size: 1.3em; }
+
+.selectize-control.multi .selectize-input.has-items {
+  padding: 5px 12px 2px; }
+
+.selectize-input.full,
+.selectize-input.not-full {
+  background-color: #ffffff; }
+
+.selectize-input.disabled,
+.selectize-input.disabled * {
+  cursor: default !important; }
+
+.selectize-input.focus {
+  -webkit-box-shadow: inset 0 -1px 2px rgba(0, 0, 0, 0.15);
+  box-shadow: inset 0 -1px 2px rgba(0, 0, 0, 0.15); }
+
+.selectize-input > * {
+  vertical-align: baseline;
+  display: -moz-inline-stack;
+  display: inline-block;
+  zoom: 1;
+  *display: inline; }
+
+.selectize-control.multi .selectize-input {
+  width: 95%; }
+
+.selectize-control.multi .selectize-input > div {
+  cursor: pointer;
+  margin: 0 3px 3px 0;
+  padding: 1px 3px;
+  background: #5c6bc0;
+  color: #fff;
+  border: 0 solid transparent; }
+
+.selectize-control.multi .selectize-input > div.active {
+  background: #607d8b;
+  color: #ffffff;
+  border: 0 solid transparent; }
+
+.selectize-control.multi .selectize-input.disabled > div,
+.selectize-control.multi .selectize-input.disabled > div.active {
+  color: #808080;
+  background: #ffffff;
+  border: 0 solid rgba(77, 77, 77, 0); }
+
+.selectize-input > input {
+  display: inline-block !important;
+  padding: 0 !important;
+  min-height: 0 !important;
+  max-height: none !important;
+  max-width: 100% !important;
+  margin: 0 !important;
+  text-indent: 0 !important;
+  border: 0 none !important;
+  background: none !important;
+  line-height: inherit !important;
+  -webkit-user-select: auto !important;
+  -webkit-box-shadow: none !important;
+  box-shadow: none !important;
+  font-size: 16px;
+  color: #888;
+  color: rgba(0, 0, 0, 0.5); }
+
+.selectize-input > input::-ms-clear {
+  display: none; }
+
+.selectize-input > input:focus {
+  outline: none !important; }
+
+.selectize-input::after {
+  content: ' ';
+  display: block;
+  clear: left; }
+
+.selectize-input.dropdown-active::before {
+  content: ' ';
+  display: block;
+  position: absolute;
+  background: #ffffff;
+  height: 1px;
+  bottom: 0;
+  left: 0;
+  right: 0; }
+
+.selectize-dropdown {
+  position: absolute;
+  z-index: 10;
+  border: 1px solid #d0d0d0;
+  background: #ffffff;
+  margin: -1px 0 0 0;
+  border-top: 0 none;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  -webkit-border-radius: 0 0 4px 4px;
+  -moz-border-radius: 0 0 4px 4px;
+  border-radius: 0 0 4px 4px; }
+
+.selectize-dropdown [data-selectable] {
+  cursor: pointer;
+  overflow: hidden; }
+
+.selectize-dropdown [data-selectable] .highlight {
+  background: rgba(255, 237, 40, 0.4);
+  -webkit-border-radius: 1px;
+  -moz-border-radius: 1px;
+  border-radius: 1px; }
+
+.selectize-dropdown [data-selectable],
+.selectize-dropdown .optgroup-header {
+  padding: 3px 12px; }
+
+.selectize-dropdown .optgroup:first-child .optgroup-header {
+  border-top: 0 none; }
+
+.selectize-dropdown .optgroup-header {
+  color: #777777;
+  background: #ffffff;
+  cursor: default; }
+
+.selectize-dropdown .active {
+  /*background-color: #f5f5f5;
+  color: #262626;*/
+  background-color: #5c6bc0;
+  color: #fff; }
+
+.selectize-dropdown .active.create {
+  color: #262626; }
+
+.selectize-dropdown .create {
+  color: rgba(51, 51, 51, 0.5); }
+
+.selectize-dropdown-content {
+  overflow-y: auto;
+  overflow-x: hidden;
+  max-height: 200px; }
+
+.selectize-control.single .selectize-input,
+.selectize-control.single .selectize-input input {
+  cursor: pointer; }
+
+.selectize-control.single .selectize-input.input-active,
+.selectize-control.single .selectize-input.input-active input {
+  cursor: text; }
+
+.selectize-control.single .selectize-input:after {
+  content: ' ';
+  display: block;
+  position: absolute;
+  top: 50%;
+  right: 17px;
+  margin-top: -3px;
+  width: 0;
+  height: 0;
+  border-style: solid;
+  border-width: 5px 5px 0 5px;
+  border-color: #333333 transparent transparent transparent; }
+
+.selectize-control.single .selectize-input.dropdown-active:after {
+  margin-top: -4px;
+  border-width: 0 5px 5px 5px;
+  border-color: transparent transparent #333333 transparent; }
+
+.selectize-control.rtl.single .selectize-input:after {
+  left: 17px;
+  right: auto; }
+
+.selectize-control.rtl .selectize-input > input {
+  margin: 0 4px 0 -2px !important; }
+
+.selectize-control .selectize-input.disabled {
+  background-color: #ffffff; }
+
+.selectize-dropdown,
+.selectize-dropdown.form-control {
+  height: auto;
+  padding: 0;
+  margin: 2px 0 0 0;
+  z-index: 1000;
+  background: #ffffff;
+  border: 1px solid #cccccc;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); }
+
+.selectize-dropdown .optgroup-header {
+  font-size: 12px;
+  line-height: 1.42857143; }
+
+.selectize-dropdown .optgroup:first-child:before {
+  display: none; }
+
+.selectize-dropdown .optgroup:before {
+  content: ' ';
+  display: block;
+  height: 1px;
+  margin: 9px 0;
+  overflow: hidden;
+  background-color: #e5e5e5;
+  margin-left: -12px;
+  margin-right: -12px; }
+
+.selectize-dropdown-content {
+  padding: 5px 0; }
+
+.selectize-dropdown-header {
+  padding: 6px 12px; }
+
+.selectize-input.dropdown-active::before {
+  display: none; }
+
+.selectize-input.focus {
+  /*border-color: #66afe9;*/
+  border-color: #607d8b;
+  outline: 0;
+  /*-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);*/
+  -webkit-box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.075);
+  /*box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);*/
+  box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.075); }
+
+.has-error .selectize-input {
+  border-color: #ef5350;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
+
+.has-error .selectize-input:focus {
+  border-color: #ef5350;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; }
+
+.selectize-control.multi .selectize-input.has-items {
+  padding-left: 9px;
+  padding-right: 9px; }
+
+.selectize-control.multi .selectize-input > div {
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  border-radius: 3px; }
+
+.form-control.selectize-control {
+  padding: 0;
+  height: auto;
+  border: none;
+  background: none;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0; }
+
+/*# sourceMappingURL=selectize-custom.css.map */
diff --git a/app/modules/web/themes/material-dark/css/selectize-custom.css.map b/app/modules/web/themes/material-dark/css/selectize-custom.css.map
new file mode 100644
index 000000000..b0803da99
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/selectize-custom.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "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",
+"sources": ["selectize-custom.scss","_base.scss"],
+"names": [],
+"file": "selectize-custom.css"
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/selectize-custom.min.css b/app/modules/web/themes/material-dark/css/selectize-custom.min.css
new file mode 100644
index 000000000..5ef5fb67c
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/selectize-custom.min.css
@@ -0,0 +1,447 @@
+@charset "UTF-8";
+.selectize-control.plugin-drag_drop.multi>.selectize-input>div.ui-sortable-placeholder {
+    visibility: visible !important;
+    background: #f2f2f2 !important;
+    background: rgba(0, 0, 0, 0.06) !important;
+    border: 0 none !important;
+    -webkit-box-shadow: inset 0 0 12px 4px #fff;
+    box-shadow: inset 0 0 12px 4px #fff
+}
+
+.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
+    content: '!';
+    visibility: hidden
+}
+
+.selectize-control.plugin-drag_drop .ui-sortable-helper {
+    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2)
+}
+
+.selectize-dropdown-header {
+    position: relative;
+    padding: 3px 12px;
+    border-bottom: 1px solid #161B22;
+    background: #161B22;
+    -webkit-border-radius: 4px 4px 0 0;
+    -moz-border-radius: 4px 4px 0 0;
+    border-radius: 4px 4px 0 0
+}
+
+.selectize-dropdown-header-close {
+    position: absolute;
+    right: 12px;
+    top: 50%;
+    color: #c9c9c9;
+    opacity: .4;
+    margin-top: -12px;
+    line-height: 20px;
+    font-size: 20px !important
+}
+
+.selectize-dropdown-header-close:hover {
+    color: #555555;
+}
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup {
+    border-right: 1px solid #f2f2f2;
+    border-top: 0 none;
+    float: left;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box
+}
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
+    border-right: 0 none
+}
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup:before {
+    display: none
+}
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
+    border-top: 0 none
+}
+
+.selectize-control.plugin-remove_button [data-value] {
+    position: relative;
+    padding-right: 24px !important
+}
+
+.selectize-control.plugin-remove_button [data-value] .remove {
+    z-index: 1;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    width: 17px;
+    text-align: center;
+    font-weight: bold;
+    font-size: 12px;
+    color: inherit;
+    text-decoration: none;
+    vertical-align: middle;
+    display: inline-block;
+    padding: 1px 0 0 0;
+    border-left: 1px solid transparent;
+    -webkit-border-radius: 0 2px 2px 0;
+    -moz-border-radius: 0 2px 2px 0;
+    border-radius: 0 2px 2px 0;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box
+}
+
+.selectize-control.plugin-remove_button [data-value] .remove:hover {
+    background: rgba(0, 0, 0, 0.05)
+}
+
+.selectize-control.plugin-remove_button [data-value].active .remove {
+    border-left-color: transparent
+}
+
+.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
+    background: 0
+}
+
+.selectize-control.plugin-remove_button .disabled [data-value] .remove {
+    border-left-color: rgba(77, 77, 77, 0)
+}
+
+.selectize-control {
+    position: relative;
+    padding: 20px 0
+}
+
+.selectize-dropdown,
+.selectize-input,
+.selectize-input input {
+    color: #c9c9c9;
+    line-height: 20px;
+    -webkit-font-smoothing: inherit
+}
+
+.selectize-control.single {
+    display: inline-block
+}
+
+.selectize-input,
+.selectize-control.single .selectize-input.input-active {
+    background: #161B22;
+    cursor: text;
+    display: inline-block
+}
+
+.selectize-input {
+    border-bottom: 1px solid #13181E;
+    padding: 3px 0;
+    display: inline-block;
+    width: 300px;
+    overflow: hidden;
+    position: relative;
+    z-index: 1;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    -webkit-box-shadow: none;
+    box-shadow: none
+}
+
+.selectize-input.has-items {
+    color: #5c6bc0;
+    font-size: 1.3em
+}
+
+.selectize-control.multi .selectize-input.has-items {
+    padding: 5px 12px 2px
+}
+
+.selectize-input.full,
+.selectize-input.not-full {
+    background-color: #161B22
+}
+
+.selectize-input.disabled,
+.selectize-input.disabled * {
+    cursor: default !important
+}
+
+.selectize-input.focus {
+    -webkit-box-shadow: inset 0 -1px 2px rgba(0, 0, 0, 0.15);
+    box-shadow: inset 0 -1px 2px rgba(0, 0, 0, 0.15)
+}
+
+.selectize-input>* {
+    vertical-align: baseline;
+    display: -moz-inline-stack;
+    display: inline-block;
+    zoom: 1;
+    *display: inline
+}
+
+.selectize-control.multi .selectize-input {
+    width: 95%
+}
+
+.selectize-control.multi .selectize-input>div {
+    cursor: pointer;
+    margin: 0 3px 3px 0;
+    padding: 1px 3px;
+    background: #5c6bc0;
+    color: #fff;
+    border: 0 solid transparent
+}
+
+.selectize-control.multi .selectize-input>div.active {
+    background: #607d8b;
+    color: #fff;
+    border: 0 solid transparent
+}
+
+.selectize-control.multi .selectize-input.disabled>div,
+.selectize-control.multi .selectize-input.disabled>div.active {
+    color: gray;
+    background: #fff;
+    border: 0 solid rgba(77, 77, 77, 0)
+}
+
+.selectize-input>input {
+    display: inline-block !important;
+    padding: 0 !important;
+    min-height: 0 !important;
+    max-height: none !important;
+    max-width: 100% !important;
+    margin: 0 !important;
+    text-indent: 0 !important;
+    border: 0 none !important;
+    background: none !important;
+    line-height: inherit !important;
+    -webkit-user-select: auto !important;
+    -webkit-box-shadow: none !important;
+    box-shadow: none !important;
+    font-size: 16px;
+    color: #888;
+    color: #c9c9c9
+}
+
+.selectize-input>input::-ms-clear {
+    display: none
+}
+
+.selectize-input>input:focus {
+    outline: none !important
+}
+
+.selectize-input::after {
+    content: ' ';
+    display: block;
+    clear: left
+}
+
+.selectize-input.dropdown-active::before {
+    content: ' ';
+    display: block;
+    position: absolute;
+    background: #fff;
+    height: 1px;
+    bottom: 0;
+    left: 0;
+    right: 0
+}
+
+.selectize-dropdown {
+    position: absolute;
+    z-index: 10;
+    border: 1px solid #d0d0d0;
+    background: #fff;
+    margin: -1px 0 0 0;
+    border-top: 0 none;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+    -webkit-border-radius: 0 0 4px 4px;
+    -moz-border-radius: 0 0 4px 4px;
+    border-radius: 0 0 4px 4px
+}
+
+.selectize-dropdown [data-selectable] {
+    cursor: pointer;
+    overflow: hidden
+}
+
+.selectize-dropdown [data-selectable] .highlight {
+    background: rgba(255, 237, 40, 0.4);
+    -webkit-border-radius: 1px;
+    -moz-border-radius: 1px;
+    border-radius: 1px
+}
+
+.selectize-dropdown [data-selectable],
+.selectize-dropdown .optgroup-header {
+    padding: 3px 12px
+}
+
+.selectize-dropdown .optgroup:first-child .optgroup-header {
+    border-top: 0 none
+}
+
+.selectize-dropdown .optgroup-header {
+    color: #777;
+    background: #fff;
+    cursor: default
+}
+
+.selectize-dropdown .active {
+    background-color: #5c6bc0;
+    color: #fff
+}
+
+.selectize-dropdown .active.create {
+    color: #262626
+}
+
+.selectize-dropdown .create {
+    color: rgba(51, 51, 51, 0.5)
+}
+
+.selectize-dropdown-content {
+    overflow-y: auto;
+    overflow-x: hidden;
+    max-height: 200px
+}
+
+.selectize-control.single .selectize-input,
+.selectize-control.single .selectize-input input {
+    cursor: pointer
+}
+
+.selectize-control.single .selectize-input.input-active,
+.selectize-control.single .selectize-input.input-active input {
+    cursor: text
+}
+
+.selectize-control.single .selectize-input:after {
+    content: ' ';
+    display: block;
+    position: absolute;
+    top: 50%;
+    right: 17px;
+    margin-top: -3px;
+    width: 0;
+    height: 0;
+    border-style: solid;
+    border-width: 5px 5px 0 5px;
+    border-color: #333 transparent transparent transparent
+}
+
+.selectize-control.single .selectize-input.dropdown-active:after {
+    margin-top: -4px;
+    border-width: 0 5px 5px 5px;
+    border-color: transparent transparent #333 transparent
+}
+
+.selectize-control.rtl.single .selectize-input:after {
+    left: 17px;
+    right: auto
+}
+
+.selectize-control.rtl .selectize-input>input {
+    margin: 0 4px 0 -2px !important
+}
+
+.selectize-control .selectize-input.disabled {
+    background-color: #161B22
+}
+
+.selectize-dropdown,
+.selectize-dropdown.form-control {
+    height: auto;
+    padding: 0;
+    margin: 2px 0 0 0;
+    z-index: 1000;
+    background: #161B22;
+    border: 1px solid #ccc;
+    border: 1px solid rgba(0, 0, 0, 0.15);
+    -webkit-border-radius: 4px;
+    -moz-border-radius: 4px;
+    border-radius: 4px;
+    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175)
+}
+
+.selectize-dropdown .optgroup-header {
+    font-size: 12px;
+    line-height: 1.42857143
+}
+
+.selectize-dropdown .optgroup:first-child:before {
+    display: none
+}
+
+.selectize-dropdown .optgroup:before {
+    content: ' ';
+    display: block;
+    height: 1px;
+    margin: 9px 0;
+    overflow: hidden;
+    background-color: #e5e5e5;
+    margin-left: -12px;
+    margin-right: -12px
+}
+
+.selectize-dropdown-content {
+    padding: 5px 0
+}
+
+.selectize-dropdown-header {
+    padding: 6px 12px
+}
+
+.selectize-input.dropdown-active::before {
+    display: none
+}
+
+.selectize-input.focus {
+    border-color: #607d8b;
+    outline: 0;
+    -webkit-box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.075);
+    box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.075)
+}
+
+.has-error .selectize-input {
+    border-color: #ef5350;
+    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075)
+}
+
+.has-error .selectize-input:focus {
+    border-color: #ef5350;
+    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483
+}
+
+.selectize-control.multi .selectize-input.has-items {
+    padding-left: 9px;
+    padding-right: 9px
+}
+
+.selectize-control.multi .selectize-input>div {
+    -webkit-border-radius: 3px;
+    -moz-border-radius: 3px;
+    border-radius: 3px
+}
+
+.form-control.selectize-control {
+    padding: 0;
+    height: auto;
+    border: 0;
+    background: 0;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    -webkit-border-radius: 0;
+    -moz-border-radius: 0;
+    border-radius: 0
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/selectize-custom.scss b/app/modules/web/themes/material-dark/css/selectize-custom.scss
new file mode 100644
index 000000000..14d6558ff
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/selectize-custom.scss
@@ -0,0 +1,487 @@
+/**
+ * selectize.bootstrap3.css (v0.12.1) - Bootstrap 3 Theme
+ * Copyright (c) 2013–2015 Brian Reavis & contributors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
+ * file except in compliance with the License. You may obtain a copy of the License at:
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
+ * ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ *
+ * @author Brian Reavis <brian@thirdroute.com>
+ */
+@import "base";
+
+.selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
+  visibility: visible !important;
+  background: #f2f2f2 !important;
+  background: rgba(0, 0, 0, 0.06) !important;
+  border: 0 none !important;
+  -webkit-box-shadow: inset 0 0 12px 4px #ffffff;
+  box-shadow: inset 0 0 12px 4px #ffffff;
+}
+
+.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
+  content: '!';
+  visibility: hidden;
+}
+
+.selectize-control.plugin-drag_drop .ui-sortable-helper {
+  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+}
+
+.selectize-dropdown-header {
+  position: relative;
+  padding: 3px 12px;
+  border-bottom: 1px solid #d0d0d0;
+  background: #f8f8f8;
+  -webkit-border-radius: 4px 4px 0 0;
+  -moz-border-radius: 4px 4px 0 0;
+  border-radius: 4px 4px 0 0;
+}
+
+.selectize-dropdown-header-close {
+  position: absolute;
+  right: 12px;
+  top: 50%;
+  color: #333333;
+  opacity: 0.4;
+  margin-top: -12px;
+  line-height: 20px;
+  font-size: 20px !important;
+}
+
+.selectize-dropdown-header-close:hover {
+  color: #000000;
+}
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup {
+  border-right: 1px solid #f2f2f2;
+  border-top: 0 none;
+  float: left;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
+  border-right: 0 none;
+}
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup:before {
+  display: none;
+}
+
+.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
+  border-top: 0 none;
+}
+
+.selectize-control.plugin-remove_button [data-value] {
+  position: relative;
+  padding-right: 24px !important;
+}
+
+.selectize-control.plugin-remove_button [data-value] .remove {
+  z-index: 1;
+  /* fixes ie bug (see #392) */
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  width: 17px;
+  text-align: center;
+  font-weight: bold;
+  font-size: 12px;
+  color: inherit;
+  text-decoration: none;
+  vertical-align: middle;
+  display: inline-block;
+  padding: 1px 0 0 0;
+  border-left: 1px solid rgba(0, 0, 0, 0);
+  -webkit-border-radius: 0 2px 2px 0;
+  -moz-border-radius: 0 2px 2px 0;
+  border-radius: 0 2px 2px 0;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.selectize-control.plugin-remove_button [data-value] .remove:hover {
+  background: rgba(0, 0, 0, 0.05);
+}
+
+.selectize-control.plugin-remove_button [data-value].active .remove {
+  border-left-color: rgba(0, 0, 0, 0);
+}
+
+.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
+  background: none;
+}
+
+.selectize-control.plugin-remove_button .disabled [data-value] .remove {
+  border-left-color: rgba(77, 77, 77, 0);
+}
+
+.selectize-control {
+  position: relative;
+  padding: 20px 0;
+}
+
+.selectize-dropdown,
+.selectize-input,
+.selectize-input input {
+  color: #333333;
+  /*font-family: inherit;*/
+  /*font-size: inherit;*/
+  line-height: 20px;
+  -webkit-font-smoothing: inherit;
+}
+
+.selectize-control.single {
+  display: inline-block;
+}
+
+.selectize-input,
+.selectize-control.single .selectize-input.input-active {
+  background: #ffffff;
+  cursor: text;
+  display: inline-block;
+}
+
+.selectize-input {
+  border-bottom: 1px solid #cccccc;
+  padding: 3px 0;
+  display: inline-block;
+  width: 300px;
+  overflow: hidden;
+  position: relative;
+  z-index: 1;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+  //-webkit-border-radius: 4px;
+  //-moz-border-radius: 4px;
+  //border-radius: 4px;
+}
+
+.selectize-input.has-items {
+  color: $color-indigo-fg;
+  font-size: 1.3em;
+}
+
+.selectize-control.multi .selectize-input.has-items {
+  padding: 5px 12px 2px;
+}
+
+.selectize-input.full,
+.selectize-input.not-full {
+  background-color: #ffffff;
+}
+
+.selectize-input.disabled,
+.selectize-input.disabled * {
+  cursor: default !important;
+}
+
+.selectize-input.focus {
+  -webkit-box-shadow: inset 0 -1px 2px rgba(0, 0, 0, 0.15);
+  box-shadow: inset 0 -1px 2px rgba(0, 0, 0, 0.15);
+}
+
+.selectize-input > * {
+  vertical-align: baseline;
+  display: -moz-inline-stack;
+  display: inline-block;
+  zoom: 1;
+  *display: inline;
+}
+
+.selectize-control.multi .selectize-input {
+  width: 95%;
+}
+
+.selectize-control.multi .selectize-input > div {
+  cursor: pointer;
+  margin: 0 3px 3px 0;
+  padding: 1px 3px;
+  background: $color-indigo-fg;
+  color: #fff;
+  border: 0 solid rgba(0, 0, 0, 0);
+}
+
+.selectize-control.multi .selectize-input > div.active {
+  background: $color-bluegrey-fg;
+  color: #ffffff;
+  border: 0 solid rgba(0, 0, 0, 0);
+}
+
+.selectize-control.multi .selectize-input.disabled > div,
+.selectize-control.multi .selectize-input.disabled > div.active {
+  color: #808080;
+  background: #ffffff;
+  border: 0 solid rgba(77, 77, 77, 0);
+}
+
+.selectize-input > input {
+  display: inline-block !important;
+  padding: 0 !important;
+  min-height: 0 !important;
+  max-height: none !important;
+  max-width: 100% !important;
+  margin: 0 !important;
+  text-indent: 0 !important;
+  border: 0 none !important;
+  background: none !important;
+  line-height: inherit !important;
+  -webkit-user-select: auto !important;
+  -webkit-box-shadow: none !important;
+  box-shadow: none !important;
+  font-size: 16px;
+  color: #888;
+  color: rgba(0, 0, 0, .5);
+}
+
+.selectize-input > input::-ms-clear {
+  display: none;
+}
+
+.selectize-input > input:focus {
+  outline: none !important;
+}
+
+.selectize-input::after {
+  content: ' ';
+  display: block;
+  clear: left;
+}
+
+.selectize-input.dropdown-active::before {
+  content: ' ';
+  display: block;
+  position: absolute;
+  background: #ffffff;
+  height: 1px;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
+.selectize-dropdown {
+  position: absolute;
+  z-index: 10;
+  border: 1px solid #d0d0d0;
+  background: #ffffff;
+  margin: -1px 0 0 0;
+  border-top: 0 none;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  -webkit-border-radius: 0 0 4px 4px;
+  -moz-border-radius: 0 0 4px 4px;
+  border-radius: 0 0 4px 4px;
+}
+
+.selectize-dropdown [data-selectable] {
+  cursor: pointer;
+  overflow: hidden;
+}
+
+.selectize-dropdown [data-selectable] .highlight {
+  background: rgba(255, 237, 40, 0.4);
+  -webkit-border-radius: 1px;
+  -moz-border-radius: 1px;
+  border-radius: 1px;
+}
+
+.selectize-dropdown [data-selectable],
+.selectize-dropdown .optgroup-header {
+  padding: 3px 12px;
+}
+
+.selectize-dropdown .optgroup:first-child .optgroup-header {
+  border-top: 0 none;
+}
+
+.selectize-dropdown .optgroup-header {
+  color: #777777;
+  background: #ffffff;
+  cursor: default;
+}
+
+.selectize-dropdown .active {
+  /*background-color: #f5f5f5;
+  color: #262626;*/
+  background-color: $color-indigo-fg;
+  color: #fff;
+}
+
+.selectize-dropdown .active.create {
+  color: #262626;
+}
+
+.selectize-dropdown .create {
+  color: rgba(51, 51, 51, 0.5);
+}
+
+.selectize-dropdown-content {
+  overflow-y: auto;
+  overflow-x: hidden;
+  max-height: 200px;
+}
+
+.selectize-control.single .selectize-input,
+.selectize-control.single .selectize-input input {
+  cursor: pointer;
+}
+
+.selectize-control.single .selectize-input.input-active,
+.selectize-control.single .selectize-input.input-active input {
+  cursor: text;
+}
+
+.selectize-control.single .selectize-input:after {
+  content: ' ';
+  display: block;
+  position: absolute;
+  top: 50%;
+  right: 17px;
+  margin-top: -3px;
+  width: 0;
+  height: 0;
+  border-style: solid;
+  border-width: 5px 5px 0 5px;
+  border-color: #333333 transparent transparent transparent;
+}
+
+.selectize-control.single .selectize-input.dropdown-active:after {
+  margin-top: -4px;
+  border-width: 0 5px 5px 5px;
+  border-color: transparent transparent #333333 transparent;
+}
+
+.selectize-control.rtl.single .selectize-input:after {
+  left: 17px;
+  right: auto;
+}
+
+.selectize-control.rtl .selectize-input > input {
+  margin: 0 4px 0 -2px !important;
+}
+
+.selectize-control .selectize-input.disabled {
+  //opacity: 0.5;
+  background-color: #ffffff;
+}
+
+.selectize-dropdown,
+.selectize-dropdown.form-control {
+  height: auto;
+  padding: 0;
+  margin: 2px 0 0 0;
+  z-index: 1000;
+  background: #ffffff;
+  border: 1px solid #cccccc;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+}
+
+.selectize-dropdown .optgroup-header {
+  font-size: 12px;
+  line-height: 1.42857143;
+}
+
+.selectize-dropdown .optgroup:first-child:before {
+  display: none;
+}
+
+.selectize-dropdown .optgroup:before {
+  content: ' ';
+  display: block;
+  height: 1px;
+  margin: 9px 0;
+  overflow: hidden;
+  background-color: #e5e5e5;
+  margin-left: -12px;
+  margin-right: -12px;
+}
+
+.selectize-dropdown-content {
+  padding: 5px 0;
+}
+
+.selectize-dropdown-header {
+  padding: 6px 12px;
+}
+
+.selectize-input {
+  //min-height: 30px;
+}
+
+.selectize-input.dropdown-active {
+  //-webkit-border-radius: 4px;
+  //-moz-border-radius: 4px;
+  //border-radius: 4px;
+}
+
+.selectize-input.dropdown-active::before {
+  display: none;
+}
+
+.selectize-input.focus {
+  /*border-color: #66afe9;*/
+  border-color: $color-bluegrey-fg;
+  outline: 0;
+  /*-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);*/
+  //-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 3px rgba(96, 125, 139, 0.6);
+  -webkit-box-shadow: inset 0 -1px 1px rgba(0, 0, 0, .075);
+  /*box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);*/
+  //box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 3px rgba(96, 125, 139, 0.6);
+  box-shadow: inset 0 -1px 1px rgba(0, 0, 0, .075);
+}
+
+.has-error .selectize-input {
+  border-color: $color-red-fg;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+
+.has-error .selectize-input:focus {
+  border-color: $color-red-fg;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
+}
+
+.selectize-control.multi .selectize-input.has-items {
+  padding-left: 9px;
+  padding-right: 9px;
+}
+
+.selectize-control.multi .selectize-input > div {
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  border-radius: 3px;
+}
+
+.form-control.selectize-control {
+  padding: 0;
+  height: auto;
+  border: none;
+  background: none;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0;
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/styles-wiki.css b/app/modules/web/themes/material-dark/css/styles-wiki.css
new file mode 100644
index 000000000..95b13516d
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/styles-wiki.css
@@ -0,0 +1,58 @@
+#box-popup #wikiPage {
+  text-align: left;
+  width: 100%;
+  padding: 0 1em; }
+  #box-popup #wikiPage h1, #box-popup #wikiPage h2, #box-popup #wikiPage h3, #box-popup #wikiPage h4, #box-popup #wikiPage h5, #box-popup #wikiPage h6 {
+    font-weight: bold;
+    padding: 0;
+    line-height: 1.2;
+    clear: left;
+    color: #777777;
+    border-bottom: 1px solid #777777; }
+    #box-popup #wikiPage h1 a, #box-popup #wikiPage h2 a, #box-popup #wikiPage h3 a, #box-popup #wikiPage h4 a, #box-popup #wikiPage h5 a, #box-popup #wikiPage h6 a {
+      color: #777; }
+  #box-popup #wikiPage h1 {
+    font-size: 2em;
+    margin: 0 0 .444em; }
+  #box-popup #wikiPage h2 {
+    font-size: 1.5em;
+    margin: 0 0 .666em; }
+  #box-popup #wikiPage h3 {
+    font-size: 1.125em;
+    margin: 0 0 .888em; }
+  #box-popup #wikiPage h4 {
+    font-size: 1em;
+    margin: 0 0 1em; }
+  #box-popup #wikiPage h5 {
+    font-size: .875em;
+    margin: 0 0 1.1428em; }
+  #box-popup #wikiPage h6 {
+    font-size: .75em;
+    margin: 0 0 1.333em; }
+  #box-popup #wikiPage pre {
+    overflow: auto;
+    word-wrap: normal;
+    border: 1px solid #ccc;
+    border-radius: 2px;
+    box-shadow: inset 0 0 .5em #ccc;
+    padding: .7em 1em; }
+  #box-popup #wikiPage li, #box-popup #wikiPage ol {
+    padding: 0;
+    margin: 0 0 0 1.5em; }
+  #box-popup #wikiPage ul li {
+    color: #999; }
+  #box-popup #wikiPage li .li {
+    color: #333; }
+  #box-popup #wikiPage ol li {
+    color: #666; }
+#box-popup #wikiPageInfo {
+  margin: 1em 0;
+  border-top: 1px solid #607d8b;
+  color: #607d8b; }
+  #box-popup #wikiPageInfo ul {
+    list-style: none; }
+  #box-popup #wikiPageInfo li {
+    float: left;
+    padding: .5em; }
+
+/*# sourceMappingURL=styles-wiki.css.map */
diff --git a/app/modules/web/themes/material-dark/css/styles-wiki.css.map b/app/modules/web/themes/material-dark/css/styles-wiki.css.map
new file mode 100644
index 000000000..52c08aad0
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/styles-wiki.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AAGE,oBAAU;EACR,UAAU,EAAE,IAAI;EAChB,KAAK,EAAE,IAAI;EACX,OAAO,EAAE,KAAK;EAEd,oJAAuB;IACrB,WAAW,EAAE,IAAI;IACjB,OAAO,EAAE,CAAC;IACV,WAAW,EAAE,GAAG;IAChB,KAAK,EAAE,IAAI;IACX,KAAK,EAAE,OAAO;IACd,aAAa,EAAE,iBAAiB;IAChC,gKAAE;MACA,KAAK,EAAE,IAAI;EAGf,uBAAG;IACD,SAAS,EAAE,GAAG;IACd,MAAM,EAAE,UAAU;EAGpB,uBAAG;IACD,SAAS,EAAE,KAAK;IAChB,MAAM,EAAE,UAAU;EAGpB,uBAAG;IACD,SAAS,EAAE,OAAO;IAClB,MAAM,EAAE,UAAU;EAGpB,uBAAG;IACD,SAAS,EAAE,GAAG;IACd,MAAM,EAAE,OAAO;EAGjB,uBAAG;IACD,SAAS,EAAE,MAAM;IACjB,MAAM,EAAE,YAAY;EAGtB,uBAAG;IACD,SAAS,EAAE,KAAK;IAChB,MAAM,EAAE,WAAW;EAGrB,wBAAI;IACF,QAAQ,EAAE,IAAI;IACd,SAAS,EAAE,MAAM;IACjB,MAAM,EAAE,cAAc;IACtB,aAAa,EAAE,GAAG;IAClB,UAAU,EAAE,mBAAmB;IAC/B,OAAO,EAAE,QAAQ;EAGnB,gDAAO;IACL,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,WAAW;EAGrB,0BAAM;IACJ,KAAK,EAAE,IAAI;EAGb,2BAAO;IACL,KAAK,EAAE,IAAI;EAGb,0BAAM;IACJ,KAAK,EAAE,IAAI;AAIf,wBAAc;EACZ,MAAM,EAAE,KAAK;EACb,UAAU,EAAE,iBAA4B;EACxC,KAAK,ECnEW,OAAO;EDqEvB,2BAAG;IACD,UAAU,EAAE,IAAI;EAGlB,2BAAG;IACD,KAAK,EAAE,IAAI;IACX,OAAO,EAAE,IAAI",
+"sources": ["styles-wiki.scss","_base.scss"],
+"names": [],
+"file": "styles-wiki.css"
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/styles-wiki.min.css b/app/modules/web/themes/material-dark/css/styles-wiki.min.css
new file mode 100644
index 000000000..3597a80b7
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/styles-wiki.min.css
@@ -0,0 +1 @@
+#box-popup #wikiPage{text-align:left;width:100%;padding:0 1em}#box-popup #wikiPage h1,#box-popup #wikiPage h2,#box-popup #wikiPage h3,#box-popup #wikiPage h4,#box-popup #wikiPage h5,#box-popup #wikiPage h6{font-weight:bold;padding:0;line-height:1.2;clear:left;color:#777;border-bottom:1px solid #777}#box-popup #wikiPage h1 a,#box-popup #wikiPage h2 a,#box-popup #wikiPage h3 a,#box-popup #wikiPage h4 a,#box-popup #wikiPage h5 a,#box-popup #wikiPage h6 a{color:#777}#box-popup #wikiPage h1{font-size:2em;margin:0 0 .444em}#box-popup #wikiPage h2{font-size:1.5em;margin:0 0 .666em}#box-popup #wikiPage h3{font-size:1.125em;margin:0 0 .888em}#box-popup #wikiPage h4{font-size:1em;margin:0 0 1em}#box-popup #wikiPage h5{font-size:.875em;margin:0 0 1.1428em}#box-popup #wikiPage h6{font-size:.75em;margin:0 0 1.333em}#box-popup #wikiPage pre{overflow:auto;word-wrap:normal;border:1px solid #ccc;border-radius:2px;box-shadow:inset 0 0 .5em #ccc;padding:.7em 1em}#box-popup #wikiPage li,#box-popup #wikiPage ol{padding:0;margin:0 0 0 1.5em}#box-popup #wikiPage ul li{color:#999}#box-popup #wikiPage li .li{color:#333}#box-popup #wikiPage ol li{color:#666}#box-popup #wikiPageInfo{margin:1em 0;border-top:1px solid #607d8b;color:#607d8b}#box-popup #wikiPageInfo ul{list-style:none}#box-popup #wikiPageInfo li{float:left;padding:.5em}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/styles-wiki.scss b/app/modules/web/themes/material-dark/css/styles-wiki.scss
new file mode 100644
index 000000000..90e7f257c
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/styles-wiki.scss
@@ -0,0 +1,92 @@
+@import "base";
+
+#box-popup {
+  #wikiPage {
+    text-align: left;
+    width: 100%;
+    padding: 0 1em;
+
+    h1, h2, h3, h4, h5, h6 {
+      font-weight: bold;
+      padding: 0;
+      line-height: 1.2;
+      clear: left;
+      color: #777777;
+      border-bottom: 1px solid #777777;
+      a {
+        color: #777;
+      }
+    }
+    h1 {
+      font-size: 2em;
+      margin: 0 0 .444em;
+    }
+
+    h2 {
+      font-size: 1.5em;
+      margin: 0 0 .666em;
+    }
+
+    h3 {
+      font-size: 1.125em;
+      margin: 0 0 .888em;
+    }
+
+    h4 {
+      font-size: 1em;
+      margin: 0 0 1em;
+    }
+
+    h5 {
+      font-size: .875em;
+      margin: 0 0 1.1428em;
+    }
+
+    h6 {
+      font-size: .75em;
+      margin: 0 0 1.333em;
+    }
+
+    pre {
+      overflow: auto;
+      word-wrap: normal;
+      border: 1px solid #ccc;
+      border-radius: 2px;
+      box-shadow: inset 0 0 .5em #ccc;
+      padding: .7em 1em;
+    }
+
+    li, ol {
+      padding: 0;
+      margin: 0 0 0 1.5em;
+    }
+
+    ul li {
+      color: #999;
+    }
+
+    li .li {
+      color: #333;
+    }
+
+    ol li {
+      color: #666;
+    }
+  }
+
+  #wikiPageInfo {
+    margin: 1em 0;
+    border-top: 1px solid $color-bluegrey-fg;
+    color: $color-bluegrey-fg;
+
+    ul {
+      list-style: none;
+    }
+
+    li {
+      float: left;
+      padding: .5em;
+    }
+  }
+}
+
diff --git a/app/modules/web/themes/material-dark/css/styles.css b/app/modules/web/themes/material-dark/css/styles.css
new file mode 100644
index 000000000..dcb3316cf
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/styles.css
@@ -0,0 +1,1298 @@
+html, body {
+  margin: 0;
+  padding: 0;
+  text-align: left;
+  background-color: #f5f5f5;
+  color: #555;
+  font-size: 12px;
+  font-weight: normal;
+  box-sizing: border-box;
+  max-width: 100%; }
+
+* {
+  font-family: "Roboto Regular", Verdana, Tahoma, sans-serif;
+  box-sizing: inherit; }
+  *:before, *:after {
+    box-sizing: inherit; }
+
+table {
+  font-size: 11px;
+  border-spacing: 0; }
+  table th {
+    border-bottom: 2px solid transparent;
+    vertical-align: middle; }
+    table th .icon {
+      width: 24px;
+      height: 24px; }
+  table tr {
+    height: 20px; }
+    table tr.odd {
+      background-color: #f9f9f9; }
+    table tr.even > td, table tr.odd > td {
+      border-bottom: 1px solid #d9d9d9 !important; }
+    table tr.even:hover, table tr.odd:hover {
+      background-color: #e8ff99; }
+  table td {
+    padding: 3px; }
+    table td.txtCliente {
+      font-weight: bold;
+      text-align: center; }
+
+form {
+  font-size: 11px;
+  margin: 0; }
+
+input.inputImg, img.inputImg {
+  background-color: transparent !important;
+  width: 24px !important;
+  height: 24px !important;
+  border: 0;
+  vertical-align: middle;
+  margin: 0 0.5em; }
+
+input.txtFile {
+  width: 200px; }
+input.txtLong {
+  width: 300px; }
+
+textarea {
+  width: 350px; }
+
+select.files {
+  width: 250px; }
+
+input.spinner {
+  width: 5em; }
+
+img {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  cursor: pointer; }
+  img.inputImgMini {
+    background-color: transparent !important;
+    width: 16px !important;
+    height: 16px !important;
+    margin: 0 5px 0 5px;
+    border: 0;
+    vertical-align: middle; }
+
+i {
+  cursor: pointer; }
+
+form .form-field {
+  display: flex;
+  justify-content: space-between; }
+  form .form-field > label {
+    min-width: 12em;
+    padding: .5em 0;
+    font-size: 16px;
+    align-self: center; }
+  form .form-field > div {
+    width: 100%;
+    align-self: center; }
+
+a {
+  text-decoration: none;
+  color: #536dfe; }
+  a:visited {
+    text-decoration: none;
+    color: #536dfe; }
+  a:hover, a:active, a:focus {
+    text-decoration: none;
+    /*color: rgba(83, 109, 254, .6);*/
+    cursor: pointer; }
+
+pre, code, samp, kbd {
+  font-family: Consolas, "Andale Mono WT", "Andale Mono", "Bitstream Vera Sans Mono", "Nimbus Mono L", Monaco, "Courier New", monospace;
+  font-size: 1em;
+  direction: ltr;
+  text-align: left;
+  background-color: #fbfaf9;
+  color: #333;
+  box-shadow: inset 0 0 .3em #ccc;
+  border-radius: 2px; }
+
+body.login,
+body.logout,
+body.userpassreset {
+  background: #607d8b; }
+  body.login #wrap,
+  body.logout #wrap,
+  body.userpassreset #wrap {
+    background: transparent; }
+  body.login #container,
+  body.logout #container,
+  body.userpassreset #container {
+    padding-top: 5%; }
+  body.login footer,
+  body.logout footer,
+  body.userpassreset footer {
+    background: #78909C; }
+    body.login footer a,
+    body.logout footer a,
+    body.userpassreset footer a {
+      color: #f2f2f2; }
+
+#box-pub-noheader {
+  background: transparent url("public/images/logo_full_nobg_outline.png") no-repeat top center;
+  background-size: 75% auto;
+  width: 40em;
+  min-height: 20em;
+  margin: 0 auto; }
+  #box-pub-noheader > div {
+    width: 100%;
+    padding: 1em;
+    margin: 0 auto; }
+  #box-pub-noheader .box-spacer {
+    height: 15em;
+    background-color: transparent; }
+  #box-pub-noheader .box-header {
+    width: 100%;
+    color: #f2f2f2;
+    font-size: 16px;
+    font-weight: bold;
+    text-align: center;
+    margin: 1em 0;
+    letter-spacing: .1em;
+    padding: 0.2em 0; }
+  #box-pub-noheader .box-form {
+    -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
+    background-color: #f2f2f2; }
+    #box-pub-noheader .box-form form fieldset#box-data {
+      height: 100%;
+      min-height: 14em;
+      text-align: left;
+      background-color: transparent;
+      margin-bottom: 2em; }
+      #box-pub-noheader .box-form form fieldset#box-data legend {
+        width: 100%;
+        color: #607d8b;
+        font-size: 14px;
+        font-weight: bold;
+        text-align: center;
+        margin: 1em 0;
+        letter-spacing: .1em;
+        padding: 0.2em 0; }
+      #box-pub-noheader .box-form form fieldset#box-data .form-control > i {
+        margin-right: .5em;
+        opacity: .5; }
+      #box-pub-noheader .box-form form fieldset#box-data .extra-hidden {
+        display: none; }
+    #box-pub-noheader .box-form div#box-buttons {
+      margin-top: 2em;
+      text-align: center; }
+
+@media screen and (max-width: 600px) {
+  #box-pub-noheader {
+    width: 25em; }
+    #box-pub-noheader .box-spacer {
+      height: 10em; }
+    #box-pub-noheader form fieldset#box-data .mdl-textfield {
+      width: 100%; } }
+#nojs {
+  width: 80%;
+  text-align: center;
+  vertical-align: middle;
+  margin: 10px auto;
+  padding: 3px;
+  background-color: #ef5350;
+  color: white;
+  font-weight: bold;
+  font-size: 14px; }
+
+#wrap {
+  height: auto !important;
+  min-height: 100%;
+  /*min-width: 1024px;*/
+  /*height: 100%;*/
+  width: 100%;
+  background-color: #f5f5f5;
+  padding-bottom: 5em; }
+
+#wrap-loading {
+  position: fixed;
+  z-index: 9999;
+  top: 50%;
+  left: 50%;
+  padding: 1em;
+  background-color: rgba(255, 255, 255, 0.8);
+  display: none;
+  border-radius: 5px !important;
+  -moz-border-radius: 5px !important;
+  -webkit-border-radius: 5px !important; }
+  #wrap-loading.overlay-full {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(255, 255, 255, 0.5); }
+    #wrap-loading.overlay-full #loading {
+      position: absolute;
+      top: 50%;
+      left: 50%; }
+    #wrap-loading.overlay-full #taskStatus {
+      display: none; }
+  #wrap-loading #taskStatus {
+    display: none;
+    position: absolute;
+    left: 0;
+    top: 55%;
+    width: 100%;
+    text-align: center;
+    color: white;
+    background-color: rgba(0, 0, 0, 0.5);
+    padding: 1em 0; }
+
+#container {
+  margin: auto;
+  width: 100%; }
+  #container.error, #container.install {
+    width: 100%; }
+  #container .logo {
+    height: 64px; }
+  #container #actions-bar {
+    z-index: 100;
+    display: flex;
+    justify-content: space-between;
+    position: fixed;
+    border: 0 none;
+    top: 0;
+    left: 0;
+    width: 100%;
+    padding: 1em 0;
+    background-color: transparent; }
+  #container #actions-bar-icons {
+    flex-grow: 1;
+    text-align: center; }
+  #container #actions-bar-logo {
+    display: none;
+    padding: 0 .5em; }
+    #container #actions-bar-logo img {
+      display: inline-block;
+      width: 50px;
+      opacity: 0.75; }
+  #container #content {
+    width: 95%;
+    margin: 2em auto 8em auto; }
+    #container #content.public-link {
+      width: 70%;
+      min-height: 0;
+      margin: 5em auto; }
+
+#content td.descField, #box-popup td.descField {
+  text-align: right;
+  padding-right: 20px;
+  width: 25%;
+  border-right: 1px solid #d9d9d9;
+  color: #999;
+  font-size: 12px;
+  font-weight: bold; }
+#content td.valField, #box-popup td.valField {
+  padding-left: 1em;
+  width: 100%; }
+  #content td.valField .lowres-title, #box-popup td.valField .lowres-title {
+    display: none;
+    width: 100%;
+    color: #607d8b;
+    font-size: 12px; }
+  #content td.valField .notification-description, #box-popup td.valField .notification-description {
+    font-size: 16px;
+    max-width: 100%; }
+    #content td.valField .notification-description .event-description, #content td.valField .notification-description .event-details, #box-popup td.valField .notification-description .event-description, #box-popup td.valField .notification-description .event-details {
+      padding: .5em 0; }
+    #content td.valField .notification-description .event-description, #box-popup td.valField .notification-description .event-description {
+      color: #5c6bc0;
+      border-bottom: 1px solid #e9e9e9; }
+    #content td.valField .notification-description .event-details .detail, #box-popup td.valField .notification-description .event-details .detail {
+      display: flex;
+      padding: .2em 0; }
+      #content td.valField .notification-description .event-details .detail .detail-left, #box-popup td.valField .notification-description .event-details .detail .detail-left {
+        flex: none;
+        width: 8em;
+        font-weight: bold; }
+      #content td.valField .notification-description .event-details .detail .detail-right, #box-popup td.valField .notification-description .event-details .detail .detail-right {
+        flex-grow: 1; }
+
+#content .pager {
+  display: -webkit-box;
+  display: -moz-box;
+  display: -ms-flexbox;
+  display: -webkit-flex;
+  display: flex;
+  justify-content: space-between;
+  align-content: space-between;
+  flex-wrap: wrap;
+  width: 100%;
+  margin-top: 15px;
+  padding: .5em;
+  font-size: 11px;
+  color: #999;
+  background-color: #fcfcfc; }
+  #content .pager img {
+    margin-left: 5px;
+    vertical-align: middle; }
+  #content .pager a {
+    margin-left: 5px;
+    font-size: 12px;
+    color: #999; }
+#content #title {
+  width: 100%;
+  padding: 7px;
+  background-color: #d9d9d9;
+  color: #fff;
+  font-size: 17px;
+  letter-spacing: .2em; }
+  #content #title.titleNormal {
+    background-color: #607d8b;
+    color: #fff; }
+#content .data-container {
+  width: 75%;
+  margin: 0 auto; }
+#content fieldset.data {
+  margin: 2em auto; }
+  #content fieldset.data > legend {
+    color: #607d8b;
+    padding: 0 .5em;
+    font-size: 1.5em; }
+  #content fieldset.data > div {
+    display: none; }
+    #content fieldset.data > div table {
+      width: 100%; }
+#content .data {
+  width: 100%;
+  padding: 10px;
+  margin: 0 auto;
+  background-color: #fff;
+  -webkit-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+  -moz-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.14); }
+  #content .data #history-icon {
+    position: relative;
+    top: 5em;
+    right: 2em; }
+  #content .data td {
+    text-align: left; }
+    #content .data td.descField {
+      text-align: right; }
+  #content .data select {
+    min-width: 210px; }
+  #content .data .list-wrap {
+    max-height: 10em;
+    overflow: auto;
+    padding: .5em;
+    margin: 1em 0; }
+  #content .data .dropzone {
+    width: 100%;
+    padding: 1em;
+    border: 2px dashed #26a69a;
+    text-align: center;
+    opacity: .3; }
+    #content .data .dropzone:hover {
+      opacity: 1; }
+    #content .data .dropzone img {
+      vertical-align: middle; }
+  #content .data .file-upload {
+    display: none; }
+  #content .data .account-permissions {
+    width: 100%; }
+#content .extra-info {
+  margin-top: 20px; }
+#content #tabs fieldset {
+  border: 1px solid #c9c9c9; }
+#content #tabs #frmConfig label {
+  float: left; }
+#content .tblConfig {
+  margin-bottom: 2em; }
+  #content .tblConfig td.descField {
+    width: 35%;
+    font-size: 11px;
+    font-weight: bold; }
+  #content .tblConfig td.rowHeader {
+    padding: 5px 0 5px 0;
+    background-color: #f5f5f5;
+    text-align: center;
+    font-weight: bold;
+    border-top: 15px solid #f9f9f9;
+    border-bottom: 3px solid #a9c1d7;
+    letter-spacing: .5em;
+    color: #696969; }
+  #content .tblConfig input.checkbox {
+    width: 15px;
+    text-align: left;
+    padding: 0; }
+  #content .tblConfig .option-disabled {
+    text-align: center;
+    background-color: #fff8e1;
+    color: #ffca28;
+    font-weight: bold; }
+#content h2 {
+  width: 100%;
+  height: 1.5em;
+  font-size: 18px;
+  color: white;
+  background-color: #a9c1d7;
+  margin: 0;
+  padding-top: 0.1em; }
+#content .section {
+  margin-top: 2.5em;
+  border-bottom: 1px solid #d9d9d9;
+  text-align: left;
+  font-size: 14px;
+  font-weight: bold;
+  color: #5c6bc0; }
+#content .row_even > td {
+  background-color: #f5f5f5; }
+#content .row_odd > td {
+  background-color: white; }
+#content .data-header ul {
+  list-style: none;
+  width: 100%;
+  margin: 0 0 10px 0;
+  padding: 0; }
+#content .data-header li {
+  display: inline-block;
+  padding: .2em .5em;
+  font-weight: bold;
+  letter-spacing: .2em;
+  color: #fff;
+  text-align: center; }
+  #content .data-header li a {
+    color: #777; }
+  #content .data-header li img {
+    float: right;
+    width: 24px;
+    height: 24px;
+    vertical-align: middle; }
+#content .data-header-minimal {
+  border-bottom: 1px solid #dfdfdf; }
+  #content .data-header-minimal ul {
+    display: flex;
+    flex-flow: row;
+    flex-wrap: wrap;
+    align-content: flex-start;
+    justify-content: space-around;
+    margin: 0; }
+  #content .data-header-minimal li {
+    min-width: 10em;
+    font-weight: normal;
+    letter-spacing: normal; }
+    #content .data-header-minimal li a {
+      color: #b9b9b9;
+      padding: 0.3em 0.8em; }
+  #content .data-header-minimal li.search-filter-spacer {
+    flex: 0 0 18em; }
+#content .data-table {
+  width: 100%; }
+  #content .data-table td:first-of-type,
+  #content .data-table th:first-of-type {
+    width: 5em; }
+  #content .data-table thead th {
+    background-color: #607d8b;
+    color: #fff; }
+  #content .data-table tbody td.cell-data {
+    text-align: left; }
+  #content .data-table tbody td.cell-nodata {
+    padding: 0 .5em;
+    text-align: left; }
+  #content .data-table tbody td.cell-actions {
+    text-align: right; }
+    #content .data-table tbody td.cell-actions i {
+      opacity: .5; }
+      #content .data-table tbody td.cell-actions i:hover {
+        opacity: 1; }
+#content .data-rows ul {
+  display: table;
+  list-style: none;
+  width: 100%;
+  margin: 0 0 10px 0;
+  padding: 0;
+  background-color: #fcfcfc; }
+#content .data-rows li {
+  float: left;
+  display: block;
+  padding: 1em;
+  color: #696969;
+  text-align: center;
+  min-height: 2em; }
+  #content .data-rows li.cell-nodata {
+    padding: 1em 0;
+    min-height: 2em;
+    text-align: left; }
+  #content .data-rows li.cell-actions {
+    float: right;
+    min-height: 2em;
+    padding: 1em 0;
+    text-align: left;
+    background-color: #fcfcfc;
+    width: 15em; }
+  #content .data-rows li.cell-nodata img, #content .data-rows li.cell-actions img {
+    width: 24px;
+    height: 24px;
+    margin: 0 0.5em; }
+#content #resEventLog .data {
+  width: 100%; }
+#content #resEventLog thead {
+  text-align: center; }
+#content #resEventLog tbody {
+  width: 100%;
+  height: 500px;
+  overflow: auto; }
+#content #resEventLog td {
+  border-bottom: 1px solid #d9d9d9; }
+#content #resEventLog .cell {
+  text-align: center; }
+#content #resEventLog .cell-description {
+  width: 60%; }
+#content #searchbox {
+  background-color: #fcfcfc;
+  vertical-align: middle;
+  position: relative;
+  height: auto;
+  padding: .5em 1em;
+  margin-bottom: 2em; }
+  #content #searchbox form {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    align-items: center;
+    text-align: left; }
+  #content #searchbox .search-filters > * {
+    margin: 0 .5em; }
+  #content #searchbox .search-filters .filter-buttons {
+    display: inline-block; }
+  #content #searchbox .search-filters .filter-slider {
+    width: 10em; }
+  #content #searchbox .search-filters-tags {
+    display: none;
+    flex-grow: 2; }
+#content .btn-clear {
+  opacity: .35;
+  filter: alpha(opacity=35); }
+  #content .btn-clear:hover {
+    opacity: 1;
+    filter: alpha(opacity=100); }
+#content .actions-optional {
+  display: none; }
+#content .error {
+  width: 350px;
+  padding: 15px;
+  margin: 0 auto;
+  text-align: center;
+  font-size: 16px;
+  line-height: 1.5em;
+  color: #ffca28;
+  background-color: #fff8e1;
+  border: 1px solid #ffca28; }
+
+#content .data .user-list-action,
+#content .data .profile-list-action,
+#box-popup .user-list-action,
+#box-popup .profile-list-action {
+  width: 75%;
+  margin: 0 auto; }
+#content .data .list-wrap,
+#box-popup .list-wrap {
+  max-height: 20em;
+  overflow: auto;
+  padding: .5em;
+  margin: 1em 0; }
+  #content .data .list-wrap ul,
+  #box-popup .list-wrap ul {
+    list-style-type: none;
+    margin: 0;
+    padding: 0; }
+  #content .data .list-wrap li,
+  #box-popup .list-wrap li {
+    display: flex;
+    background: #f2f2f2;
+    padding: .5em;
+    font-size: 1em;
+    margin-bottom: .5em; }
+  #content .data .list-wrap li:hover,
+  #box-popup .list-wrap li:hover {
+    background: #e8eaf6;
+    color: #000; }
+  #content .data .list-wrap div.files-item-info,
+  #box-popup .list-wrap div.files-item-info {
+    flex-grow: 2; }
+  #content .data .list-wrap div.files-item-info img,
+  #box-popup .list-wrap div.files-item-info img {
+    margin: 0 .5em; }
+  #content .data .list-wrap div.files-item-actions,
+  #box-popup .list-wrap div.files-item-actions {
+    padding: .3em 0; }
+#content .data .list-actions i,
+#box-popup .list-actions i {
+  opacity: .5; }
+  #content .data .list-actions i:hover,
+  #box-popup .list-actions i:hover {
+    opacity: 1; }
+
+#box-popup {
+  width: -webkit-min-content;
+  width: -moz-min-content;
+  width: min-content;
+  min-width: 50em;
+  margin: 5em auto;
+  padding: 0;
+  background-color: #fff; }
+  #box-popup.box-password-view {
+    width: -webkit-min-content;
+    width: -moz-min-content;
+    width: min-content;
+    min-width: 30em; }
+  #box-popup > h2 {
+    position: relative;
+    width: 100%;
+    font-size: 18px;
+    color: #fff;
+    background-color: #607d8b;
+    margin: 0;
+    padding: .5em 0;
+    line-height: 1em; }
+    #box-popup > h2 .btn-popup-close {
+      display: none;
+      position: absolute;
+      right: .5em;
+      top: .2em; }
+  #box-popup > table {
+    width: 100%;
+    padding-bottom: 1em; }
+  #box-popup select {
+    width: 220px; }
+  #box-popup #resFancyAccion {
+    display: none; }
+  #box-popup #resCheck {
+    display: inline-block;
+    width: 80%;
+    height: 4em;
+    padding: 1em 0; }
+  #box-popup.image {
+    background-color: transparent;
+    max-width: 100%;
+    margin: 0 auto;
+    border-radius: 0 !important;
+    -moz-border-radius: 0 !important;
+    -webkit-border-radius: 0 !important; }
+    #box-popup.image img {
+      width: auto;
+      margin: 0 auto; }
+    #box-popup.image > div.title {
+      background-color: #607d8b;
+      color: #fff;
+      padding: .5em; }
+  #box-popup.help {
+    min-height: 100px;
+    background-color: #f5f5f5; }
+    #box-popup.help p {
+      font-size: 14px;
+      text-align: justify;
+      line-height: 2em; }
+
+#box-complexity > div {
+  text-align: justify;
+  line-height: 1.5em;
+  margin-top: 1em; }
+
+#box-upload-files > * {
+  margin: 0 auto; }
+
+#debug {
+  float: left;
+  text-align: left; }
+
+#debuginfo {
+  width: 100%;
+  min-height: 10em;
+  padding: 1em;
+  background-color: #fff8e1;
+  text-align: left;
+  line-height: 1.5em; }
+  #debuginfo H3 {
+    text-align: center; }
+
+.popup-data {
+  width: 100%;
+  min-width: 400px;
+  border: 0;
+  text-align: left;
+  margin: 0;
+  padding: 1em .5em; }
+  .popup-data .descField {
+    min-width: 100px; }
+
+footer {
+  display: flex;
+  justify-content: space-between;
+  position: fixed;
+  bottom: 0;
+  z-index: 100;
+  width: 100%;
+  padding: .5em 0;
+  background-color: #f5f5f5;
+  color: #b9b9b9;
+  font-size: 1em;
+  -webkit-box-shadow: 0 -3px 2px -2px rgba(0, 0, 0, 0.14);
+  -moz-box-shadow: 0 -3px 2px -2px rgba(0, 0, 0, 0.14);
+  box-shadow: 0 -3px 2px -2px rgba(0, 0, 0, 0.14); }
+  footer .footer-parts {
+    display: flex;
+    justify-content: space-between; }
+  footer #footer-left {
+    width: 50%;
+    margin: 0 1em; }
+  footer #footer-right {
+    width: 50%;
+    margin: 0 1em;
+    justify-content: flex-end;
+    text-align: right; }
+  footer #updates, footer #notices {
+    min-width: 5em;
+    text-align: center;
+    cursor: pointer; }
+  footer #notices .notices-title {
+    font-weight: bold;
+    border-bottom: 1px solid #c9c9c9;
+    margin-bottom: 1em; }
+  footer #status {
+    margin: 0 1em; }
+    footer #status > div {
+      display: inline-block; }
+    footer #status .status-info {
+      padding: 0.5em; }
+  footer #session {
+    text-align: left;
+    color: #999;
+    font-size: .8em; }
+  footer a {
+    color: #b9b9b9; }
+    footer a:visited {
+      color: #b9b9b9; }
+  footer #project a:hover {
+    color: #a9c1d7;
+    border-bottom: 1px solid #a9c1d7; }
+  footer #updates a:hover {
+    color: #a9c1d7; }
+  footer img {
+    border: 0;
+    width: 16px;
+    height: 16px;
+    vertical-align: middle; }
+
+.round, .round5 {
+  border-radius: 5px !important;
+  -moz-border-radius: 5px !important;
+  -webkit-border-radius: 5px !important; }
+
+.midround {
+  border-radius: 0 0 10px 10px !important;
+  -moz-border-radius: 0 0 10px 10px !important;
+  -webkit-border-radius: 0 0 10px 10px !important; }
+
+.midroundup {
+  border-radius: 10px 10px 0 0 !important;
+  -moz-border-radius: 10px 10px 0 0 !important;
+  -webkit-border-radius: 10px 10px 0 0 !important; }
+
+.fullround {
+  border-radius: 50% !important;
+  -moz-border-radius: 50% !important;
+  -webkit-border-radius: 50% !important; }
+
+.iconMini {
+  width: 16px !important;
+  height: 16px !important;
+  vertical-align: middle; }
+
+.hide {
+  display: none !important; }
+
+.btn-checks {
+  padding: 5px;
+  margin: .2em 0;
+  width: 30em;
+  border-bottom: 1px solid #c9c9c9; }
+
+.shadow {
+  -webkit-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+  -moz-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.14); }
+
+.noRes {
+  width: 60%;
+  padding: 15px;
+  background-color: #f9f9f9;
+  color: #a9a9a9;
+  border: #c9c9c9 1px solid;
+  margin: 20px auto;
+  text-align: center;
+  font-size: 16px; }
+
+.header-grey {
+  background-color: #607d8b;
+  color: #fff;
+  min-height: 2em; }
+
+.no-background {
+  background: none !important; }
+
+.action-in-box {
+  padding: 1em;
+  text-align: right; }
+  .action-in-box ul {
+    list-style: none;
+    margin: 0;
+    padding: 0; }
+
+.tab-data {
+  margin: 2em auto 0;
+  width: 75%; }
+
+.item-actions {
+  display: flex;
+  justify-content: flex-end;
+  position: relative;
+  margin: 1em auto; }
+  .item-actions > div {
+    display: inline-block; }
+
+.tab-actions {
+  margin: 2em 0; }
+
+.item-actions > ul,
+.tab-actions > ul {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+  align-items: center;
+  list-style: none;
+  margin: 0;
+  padding: 0; }
+  .item-actions > ul > li,
+  .tab-actions > ul > li {
+    width: auto;
+    min-width: 2em;
+    margin-left: .5em; }
+    .item-actions > ul > li.datagrid-action-search,
+    .tab-actions > ul > li.datagrid-action-search {
+      min-width: 5em; }
+      .item-actions > ul > li.datagrid-action-search form,
+      .tab-actions > ul > li.datagrid-action-search form {
+        width: 100%; }
+
+h5.datagrid-header-title {
+  padding: .7em;
+  border-bottom: 1px solid #d9d9d9; }
+
+.fullWidth {
+  max-width: 100% !important; }
+
+.filter-on {
+  color: #26a69a;
+  background-color: #e0f2f1;
+  border: 1px solid #26a69a;
+  padding: .3em 1em; }
+
+.global-on {
+  color: #ffca28;
+  background-color: #fff8e1;
+  border: 1px solid #ffca28;
+  padding: .3em 1em; }
+
+.opacity50 {
+  filter: alpha(opacity=50);
+  opacity: 0.5; }
+
+.custom-combobox {
+  position: relative;
+  display: inline-block; }
+  .custom-combobox input {
+    width: 80%; }
+
+.custom-combobox-toggle {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  margin-left: -1px;
+  padding: 0;
+  *height: 1.7em;
+  *top: 0.1em; }
+
+.custom-combobox-input {
+  margin: 0;
+  padding: 0.3em; }
+
+.password-level.strongest {
+  color: #26a69a; }
+.password-level.strong {
+  color: #2196f3; }
+.password-level.good {
+  color: #ffca28; }
+.password-level.weak {
+  color: #ef5350; }
+
+#alert #alert-text {
+  margin: 15px auto;
+  font-size: 14px;
+  font-weight: bold; }
+#alert #alert-pass {
+  width: 50%;
+  padding: 10px;
+  margin: 15px auto;
+  border: 1px solid #c9c9c9;
+  color: #555;
+  font-weight: bold; }
+
+.dialog-text, .dialog-user-text, .dialog-pass-text {
+  font-family: Consolas, "Andale Mono WT", "Andale Mono", "Bitstream Vera Sans Mono", "Nimbus Mono L", Monaco, "Courier New", monospace;
+  padding: .5em;
+  text-align: center;
+  min-width: 200px; }
+
+.dialog-user-text {
+  border-bottom: #d9d9d9 1px solid;
+  color: #a9a9a9; }
+
+.dialog-pass-text {
+  border: transparent 1px solid;
+  letter-spacing: .2em; }
+
+.dialog-button {
+  width: 150px; }
+
+.dialog-buttons {
+  text-align: center;
+  padding: .5em;
+  border-top: 1px solid #c9c9c9;
+  line-height: 2.5em; }
+
+.dialog-clip-copy {
+  color: #26a69a;
+  background-color: #e0f2f1; }
+
+.btn-help {
+  cursor: pointer; }
+
+.help-box {
+  display: none;
+  background-color: #fff !important;
+  color: #607d8b; }
+  .help-box > * {
+    font-weight: bold; }
+
+.help-container ul {
+  padding: 0 .5em;
+  list-style: none; }
+  .help-container ul li {
+    padding: .5em 0; }
+.help-container .help-text {
+  text-align: justify;
+  line-height: 1.5em;
+  margin-top: 1em; }
+
+.tooltip {
+  width: 300px;
+  max-width: 300px;
+  background-color: #777;
+  color: #fff;
+  z-index: 101; }
+
+.tooltip-text {
+  padding: .5em; }
+  .tooltip-text .tooltip-header {
+    text-transform: capitalize;
+    font-weight: bold;
+    border-bottom: 1px solid #c9c9c9; }
+
+.cursor-pointer {
+  cursor: pointer; }
+
+.password-actions {
+  display: inline-block;
+  width: 12em; }
+  .password-actions > span, .password-actions i {
+    margin-right: 0.6em; }
+
+.form-control {
+  position: relative; }
+  .form-control .password-actions {
+    position: absolute;
+    right: 0;
+    padding: 20px; }
+
+.custom-input-color {
+  width: 3em;
+  height: 1em;
+  display: inline-block; }
+
+.account-pass-image {
+  height: 32px;
+  width: auto; }
+
+.select-box {
+  min-width: 300px;
+  max-width: 100%; }
+
+fieldset.warning {
+  padding: 8px;
+  border-radius: 5px;
+  color: #ef5350;
+  background-color: #ffebee;
+  border: 1px solid #ef5350; }
+  fieldset.warning legend {
+    color: #ef5350 !important; }
+  fieldset.warning a {
+    color: #ef5350 !important;
+    font-weight: bold; }
+
+#actions {
+  width: 100%;
+  /*margin: auto auto 50px;*/
+  line-height: 2em;
+  margin-bottom: 5em; }
+  #actions #logo {
+    display: flex;
+    width: 100%;
+    margin-bottom: 30px;
+    color: #607d8b;
+    align-items: center;
+    background: url("public/images/logo_full_bg.png") left no-repeat;
+    background-size: auto 150px;
+    height: 150px; }
+  #actions #page-title {
+    width: 100%;
+    color: #607d8b;
+    text-align: center; }
+    #actions #page-title h1 {
+      font-weight: bold;
+      font-size: 24px;
+      letter-spacing: 3px; }
+  #actions ul.errors {
+    max-width: 40vw;
+    margin: 0 auto;
+    list-style: none;
+    font-size: 14px;
+    text-align: left; }
+    #actions ul.errors > li {
+      margin: 1.5em auto;
+      border-radius: 3px;
+      padding: 1em 0.5em; }
+      #actions ul.errors > li.msg-critical {
+        color: #ef5350;
+        background-color: #ffebee;
+        border: 1px solid #ef5350; }
+      #actions ul.errors > li.msg-warning {
+        color: #ffca28;
+        background-color: #fff8e1;
+        border: 1px solid #ffca28;
+        color: #555; }
+      #actions ul.errors > li.msg-ok {
+        color: #26a69a;
+        background-color: #e0f2f1;
+        border: 1px solid #26a69a; }
+      #actions ul.errors > li > p.hint {
+        color: #555;
+        font-size: 12px; }
+        #actions ul.errors > li > p.hint i {
+          margin-right: .5em; }
+  #actions form {
+    width: 450px;
+    margin: 0 auto;
+    text-align: left; }
+    #actions form fieldset {
+      margin-bottom: 2em; }
+      #actions form fieldset legend {
+        width: 100%;
+        color: #fff;
+        font-size: 14px;
+        font-weight: bold;
+        text-align: center;
+        background-color: #607d8b;
+        margin: 1em 0;
+        letter-spacing: .2em;
+        padding: 0.2em 0; }
+  #actions div.buttons {
+    margin-top: 2em;
+    text-align: center; }
+
+.center {
+  text-align: center !important; }
+
+.right {
+  text-align: right !important; }
+
+.left {
+  text-align: left !important; }
+
+.opacity50 {
+  opacity: .5 !important; }
+
+.msg-option-unvailable {
+  color: #ffca28;
+  background-color: #fff8e1;
+  border: 1px solid #ffca28;
+  border: none;
+  padding: .5em;
+  text-align: center;
+  margin: 1em 0;
+  font-size: 1.5em; }
+
+div.tag-list-box {
+  margin-bottom: 1em; }
+  div.tag-list-box .tag-list-header {
+    text-align: left;
+    border-bottom: 1px solid #d9d9d9;
+    color: #607d8b;
+    font-size: 12px;
+    font-weight: bold;
+    margin-bottom: .5em; }
+  div.tag-list-box .tag-list-body .tags-list-items {
+    display: inline-block;
+    padding: .5em;
+    width: 95%;
+    height: 3em;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+    border-radius: 3px !important;
+    -moz-border-radius: 3px !important;
+    -webkit-border-radius: 3px !important; }
+  div.tag-list-box i.select-icon {
+    margin-right: .5em;
+    color: #607d8b;
+    font-size: 18px; }
+
+div.tag-list-box span.tag, div.tags-box span.tag {
+  margin: 0 3px 3px 0;
+  padding: 3px;
+  background: #5c6bc0;
+  color: #fff;
+  border: none;
+  border-radius: 3px !important;
+  -moz-border-radius: 3px !important;
+  -webkit-border-radius: 3px !important; }
+
+#box-pub-noheader #box-login {
+  position: relative;
+  min-height: 14em; }
+  #box-pub-noheader #box-login #box-buttons {
+    position: absolute;
+    top: 2em;
+    right: 2em; }
+  #box-pub-noheader #box-login #box-actions {
+    width: 100%;
+    text-align: right; }
+    #box-pub-noheader #box-login #box-actions a {
+      color: #c9c9c9; }
+#box-pub-noheader #box-updated {
+  width: 350px;
+  margin: 3em auto;
+  font-size: 14px;
+  text-align: center;
+  padding: 0.5em;
+  color: #26a69a;
+  background-color: #e0f2f1;
+  border: 1px solid #26a69a; }
+#box-pub-noheader #demo-info {
+  padding: .5em;
+  margin: 3em auto 0 auto;
+  color: #c9c9c9;
+  border-top: 1px solid #d9d9d9;
+  border-bottom: 1px solid #d9d9d9; }
+  #box-pub-noheader #demo-info ul {
+    display: flex;
+    justify-content: space-around;
+    list-style: none; }
+    #box-pub-noheader #demo-info ul li > span {
+      padding: 0 1em; }
+
+@media screen and (max-width: 600px) {
+  #box-pub-noheader #box-login #box-buttons {
+    position: relative;
+    top: 0;
+    right: 0;
+    text-align: right; }
+  #box-pub-noheader #box-login #box-actions {
+    margin-top: 1em; }
+  #box-pub-noheader #demo-info ul {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    list-style: none; }
+    #box-pub-noheader #demo-info ul li {
+      width: 11em;
+      text-align: left; }
+      #box-pub-noheader #demo-info ul li > span {
+        padding: 0 1em; } }
+/* Default styles first then media queries */
+/*@media screen and (min-width: 400px)  {}*/
+/*@media screen and (min-width: 600px)  {}*/
+/*@media screen and (min-width: 1000px) {}*/
+/*@media screen and (min-width: 1400px) {}*/
+@media screen and (max-width: 1000px) {
+  #content #searchbox .search-filters > * {
+    margin: .5em 1em .5em 0; }
+
+  footer {
+    display: none;
+    justify-content: space-between;
+    flex-wrap: wrap; }
+    footer .footer-parts {
+      justify-content: space-between;
+      flex-wrap: wrap; }
+    footer #footer-left, footer #footer-right {
+      width: 100%; }
+    footer .footer-parts > div {
+      width: 100%;
+      padding: .5em 0; } }
+@media screen and (max-width: 600px) {
+  #content input, #box-popup input {
+    width: 100%; }
+  #content .mdl-textfield, #box-popup .mdl-textfield {
+    width: 100%; }
+  #content td.descField, #box-popup td.descField {
+    display: none; }
+  #content td.valField .lowres-title, #box-popup td.valField .lowres-title {
+    display: block; }
+
+  #content #searchbox .mdl-textfield {
+    width: 90%; }
+  #content #searchbox .search-text {
+    width: 90%; }
+  #content #searchbox .search-filters .selectize-control {
+    width: 100%; }
+  #content .data-header-minimal li.search-filter-spacer {
+    display: none; }
+  #content .data-container, #content .tab-data {
+    width: 100%; }
+    #content .data-container .selectize-control, #content .tab-data .selectize-control {
+      width: 100%; }
+  #content .mdl-tabs__tab-bar {
+    flex-wrap: wrap;
+    height: auto; }
+  #content .pager {
+    flex-direction: column-reverse; }
+    #content .pager > div {
+      text-align: center;
+      width: 100%; }
+
+  #box-popup h2 > .btn-popup-close {
+    display: inline-block; }
+
+  #actions ul.errors {
+    max-width: 90vw; }
+
+  .mdl-data-table {
+    table-layout: fixed;
+    width: 100%; }
+
+  .table-responsive td, .table-responsive th {
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    -o-text-overflow: ellipsis; }
+  .table-responsive .cell-actions i {
+    display: block !important; } }
+
+/*# sourceMappingURL=styles.css.map */
diff --git a/app/modules/web/themes/material-dark/css/styles.css.map b/app/modules/web/themes/material-dark/css/styles.css.map
new file mode 100644
index 000000000..ce91de079
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/styles.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "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",
+"sources": ["_elements.scss","_base.scss","_noheader.scss","styles.scss","_login.scss"],
+"names": [],
+"file": "styles.css"
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/styles.min.css b/app/modules/web/themes/material-dark/css/styles.min.css
new file mode 100644
index 000000000..92f461594
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/styles.min.css
@@ -0,0 +1,1833 @@
+html,
+body {
+    margin: 0;
+    padding: 0;
+    text-align: left;
+    background-color: #0D1117;
+    color: #555;
+    font-size: 12px;
+    font-weight: normal;
+    box-sizing: border-box;
+    max-width: 100%
+}
+
+* {
+    font-family: "Roboto Regular", Verdana, Tahoma, sans-serif;
+    box-sizing: inherit
+}
+
+*:before,
+*:after {
+    box-sizing: inherit
+}
+
+table {
+    font-size: 11px;
+    border-spacing: 0
+}
+
+table th {
+    border-bottom: 2px solid transparent;
+    vertical-align: middle
+}
+
+table th .icon {
+    width: 24px;
+    height: 24px
+}
+
+table tr {
+    height: 20px
+}
+
+table tr.odd {
+    background-color: #f9f9f9
+}
+
+table tr.even>td,
+table tr.odd>td {
+    border-bottom: 1px solid #d9d9d9 !important
+}
+
+table tr.even:hover,
+table tr.odd:hover {
+    background-color: #e8ff99
+}
+
+table td {
+    padding: 3px
+}
+
+table td.txtCliente {
+    font-weight: bold;
+    text-align: center
+}
+
+form {
+    font-size: 11px;
+    margin: 0
+}
+
+input.inputImg,
+img.inputImg {
+    background-color: transparent !important;
+    width: 24px !important;
+    height: 24px !important;
+    border: 0;
+    vertical-align: middle;
+    margin: 0 .5em
+}
+
+input.txtFile {
+    width: 200px
+}
+
+input.txtLong {
+    width: 300px
+}
+
+textarea {
+    width: 350px
+}
+
+select.files {
+    width: 250px
+}
+
+input.spinner {
+    width: 5em
+}
+
+img {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    cursor: pointer
+}
+
+img.inputImgMini {
+    background-color: transparent !important;
+    width: 16px !important;
+    height: 16px !important;
+    margin: 0 5px 0 5px;
+    border: 0;
+    vertical-align: middle
+}
+
+i {
+    cursor: pointer
+}
+
+form .form-field {
+    display: flex;
+    justify-content: space-between
+}
+
+form .form-field>label {
+    min-width: 12em;
+    padding: .5em 0;
+    font-size: 16px;
+    align-self: center
+}
+
+form .form-field>div {
+    width: 100%;
+    align-self: center
+}
+
+a {
+    text-decoration: none;
+    color: #536dfe
+}
+
+a:visited {
+    text-decoration: none;
+    color: #536dfe
+}
+
+a:hover,
+a:active,
+a:focus {
+    text-decoration: none;
+    cursor: pointer
+}
+
+pre,
+code,
+samp,
+kbd {
+    font-family: Consolas, "Andale Mono WT", "Andale Mono", "Bitstream Vera Sans Mono", "Nimbus Mono L", Monaco, "Courier New", monospace;
+    font-size: 1em;
+    direction: ltr;
+    text-align: left;
+    background-color: #fbfaf9;
+    color: #333;
+    box-shadow: inset 0 0 .3em #ccc;
+    border-radius: 2px
+}
+
+body.login,
+body.logout,
+body.userpassreset {
+    background: #0D1117
+}
+
+body.login #wrap,
+body.logout #wrap,
+body.userpassreset #wrap {
+    background: transparent
+}
+
+body.login #container,
+body.logout #container,
+body.userpassreset #container {
+    padding-top: 5%
+}
+
+body.login footer,
+body.logout footer,
+body.userpassreset footer {
+    background: #161B22;
+}
+
+body.login footer a,
+body.logout footer a,
+body.userpassreset footer a {
+    color: #f2f2f2
+}
+
+#box-pub-noheader {
+    background: transparent url("public/images/logo_full_nobg_outline.png") no-repeat top center;
+    background-size: 75% auto;
+    width: 40em;
+    min-height: 20em;
+    margin: 0 auto
+}
+
+#box-pub-noheader>div {
+    width: 100%;
+    padding: 1em;
+    margin: 0 auto
+}
+
+#box-pub-noheader .box-spacer {
+    height: 15em;
+    background-color: transparent
+}
+
+#box-pub-noheader .box-header {
+    width: 100%;
+    color: #f2f2f2;
+    font-size: 16px;
+    font-weight: bold;
+    text-align: center;
+    margin: 1em 0;
+    letter-spacing: .1em;
+    padding: .2em 0
+}
+
+#box-pub-noheader .box-form {
+    -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
+    background-color: #161B22
+}
+
+#box-pub-noheader .box-form form fieldset#box-data {
+    height: 100%;
+    min-height: 14em;
+    text-align: left;
+    background-color: transparent;
+    margin-bottom: 2em
+}
+
+#box-pub-noheader .box-form form fieldset#box-data legend {
+    width: 100%;
+    color: #607d8b;
+    font-size: 14px;
+    font-weight: bold;
+    text-align: center;
+    margin: 1em 0;
+    letter-spacing: .1em;
+    padding: .2em 0
+}
+
+#box-pub-noheader .box-form form fieldset#box-data .form-control>i {
+    margin-right: .5em;
+    opacity: .5
+}
+
+#box-pub-noheader .box-form form fieldset#box-data .extra-hidden {
+    display: none
+}
+
+#box-pub-noheader .box-form div#box-buttons {
+    margin-top: 2em;
+    text-align: center
+}
+
+@media screen and (max-width:600px) {
+    #box-pub-noheader {
+        width: 25em
+    }
+    #box-pub-noheader .box-spacer {
+        height: 10em
+    }
+    #box-pub-noheader form fieldset#box-data .mdl-textfield {
+        width: 100%
+    }
+}
+
+#nojs {
+    width: 80%;
+    text-align: center;
+    vertical-align: middle;
+    margin: 10px auto;
+    padding: 3px;
+    background-color: #ef5350;
+    color: white;
+    font-weight: bold;
+    font-size: 14px
+}
+
+#wrap {
+    height: auto !important;
+    min-height: 100%;
+    width: 100%;
+    background-color: #0D1117;
+    padding-bottom: 5em
+}
+
+#wrap-loading {
+    position: fixed;
+    z-index: 9999;
+    top: 50%;
+    left: 50%;
+    padding: 1em;
+    background-color: #0D1117;
+    display: none;
+    border-radius: 5px !important;
+    -moz-border-radius: 5px !important;
+    -webkit-border-radius: 5px !important
+}
+
+#wrap-loading.overlay-full {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(255, 255, 255, 0.5)
+}
+
+#wrap-loading.overlay-full #loading {
+    position: absolute;
+    top: 50%;
+    left: 50%
+}
+
+#wrap-loading.overlay-full #taskStatus {
+    display: none
+}
+
+#wrap-loading #taskStatus {
+    display: none;
+    position: absolute;
+    left: 0;
+    top: 55%;
+    width: 100%;
+    text-align: center;
+    color: white;
+    background-color: rgba(0, 0, 0, 0.5);
+    padding: 1em 0
+}
+
+#container {
+    margin: auto;
+    width: 100%
+}
+
+#container.error,
+#container.install {
+    width: 100%
+}
+
+#container .logo {
+    height: 64px
+}
+
+#container #actions-bar {
+    z-index: 100;
+    display: flex;
+    justify-content: space-between;
+    position: fixed;
+    border: 0 none;
+    top: 0;
+    left: 0;
+    width: 100%;
+    padding: 1em 0;
+    background-color: transparent
+}
+
+#container #actions-bar-icons {
+    flex-grow: 1;
+    text-align: center
+}
+
+#container #actions-bar-logo {
+    display: none;
+    padding: 0 .5em
+}
+
+#container #actions-bar-logo img {
+    display: inline-block;
+    width: 50px;
+    opacity: .75
+}
+
+#container #content {
+    width: 95%;
+    margin: 2em auto 8em auto
+}
+
+#container #content.public-link {
+    width: 70%;
+    min-height: 0;
+    margin: 5em auto
+}
+
+#content td.descField,
+#box-popup td.descField {
+    text-align: right;
+    padding-right: 20px;
+    width: 25%;
+    border-right: 1px solid #13181E;
+    color: #999;
+    font-size: 12px;
+    font-weight: bold
+}
+
+#content td.valField,
+#box-popup td.valField {
+    padding-left: 1em;
+    width: 100%
+}
+
+#content td.valField .lowres-title,
+#box-popup td.valField .lowres-title {
+    display: none;
+    width: 100%;
+    color: #607d8b;
+    font-size: 12px
+}
+
+#content td.valField .notification-description,
+#box-popup td.valField .notification-description {
+    font-size: 16px;
+    max-width: 100%
+}
+
+#content td.valField .notification-description .event-description,
+#content td.valField .notification-description .event-details,
+#box-popup td.valField .notification-description .event-description,
+#box-popup td.valField .notification-description .event-details {
+    padding: .5em 0
+}
+
+#content td.valField .notification-description .event-description,
+#box-popup td.valField .notification-description .event-description {
+    color: #5c6bc0;
+    border-bottom: 1px solid #e9e9e9
+}
+
+#content td.valField .notification-description .event-details .detail,
+#box-popup td.valField .notification-description .event-details .detail {
+    display: flex;
+    padding: .2em 0
+}
+
+#content td.valField .notification-description .event-details .detail .detail-left,
+#box-popup td.valField .notification-description .event-details .detail .detail-left {
+    flex: none;
+    width: 8em;
+    font-weight: bold
+}
+
+#content td.valField .notification-description .event-details .detail .detail-right,
+#box-popup td.valField .notification-description .event-details .detail .detail-right {
+    flex-grow: 1
+}
+
+#content .pager {
+    display: -webkit-box;
+    display: -moz-box;
+    display: -ms-flexbox;
+    display: -webkit-flex;
+    display: flex;
+    justify-content: space-between;
+    align-content: space-between;
+    flex-wrap: wrap;
+    width: 100%;
+    margin-top: 15px;
+    padding: .5em;
+    font-size: 11px;
+    color: #999;
+    background-color: #161B22
+}
+
+#content .pager img {
+    margin-left: 5px;
+    vertical-align: middle
+}
+
+#content .pager a {
+    margin-left: 5px;
+    font-size: 12px;
+    color: #999
+}
+
+#content #title {
+    width: 100%;
+    padding: 7px;
+    background-color: #161B22;
+    color: #fff;
+    font-size: 17px;
+    letter-spacing: .2em
+}
+
+#content #title.titleNormal {
+    background-color: #161B22;
+    color: #c9c9c9;
+}
+
+#content .data-container {
+    width: 75%;
+    margin: 0 auto
+}
+
+#content fieldset.data {
+    margin: 2em auto
+}
+
+#content fieldset.data>legend {
+    color: #607d8b;
+    padding: 0 .5em;
+    font-size: 1.5em
+}
+
+#content fieldset.data>div {
+    display: none
+}
+
+#content fieldset.data>div table {
+    width: 100%
+}
+
+#content .data {
+    width: 100%;
+    padding: 10px;
+    margin: 0 auto;
+    background-color: #161B22;
+    -webkit-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+    -moz-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.14)
+}
+
+#content .data #history-icon {
+    position: relative;
+    top: 5em;
+    right: 2em
+}
+
+#content .data td {
+    text-align: left
+}
+
+#content .data td.descField {
+    text-align: right
+}
+
+#content .data select {
+    min-width: 210px
+}
+
+#content .data .list-wrap {
+    max-height: 10em;
+    overflow: auto;
+    padding: .5em;
+    margin: 1em 0
+}
+
+#content .data .dropzone {
+    width: 100%;
+    padding: 1em;
+    border: 2px dashed #26a69a;
+    text-align: center;
+    opacity: .3
+}
+
+#content .data .dropzone:hover {
+    opacity: 1
+}
+
+#content .data .dropzone img {
+    vertical-align: middle
+}
+
+#content .data .file-upload {
+    display: none
+}
+
+#content .data .account-permissions {
+    width: 100%
+}
+
+#content .extra-info {
+    margin-top: 20px
+}
+
+#content #tabs fieldset {
+    border: 1px solid #c9c9c9
+}
+
+#content #tabs #frmConfig label {
+    float: left
+}
+
+#content .tblConfig {
+    margin-bottom: 2em
+}
+
+#content .tblConfig td.descField {
+    width: 35%;
+    font-size: 11px;
+    font-weight: bold
+}
+
+#content .tblConfig td.rowHeader {
+    padding: 5px 0 5px 0;
+    background-color: #f5f5f5;
+    text-align: center;
+    font-weight: bold;
+    border-top: 15px solid #f9f9f9;
+    border-bottom: 3px solid #a9c1d7;
+    letter-spacing: .5em;
+    color: #696969
+}
+
+#content .tblConfig input.checkbox {
+    width: 15px;
+    text-align: left;
+    padding: 0
+}
+
+#content .tblConfig .option-disabled {
+    text-align: center;
+    background-color: #fff8e1;
+    color: #ffca28;
+    font-weight: bold
+}
+
+#content h2 {
+    width: 100%;
+    height: 1.5em;
+    font-size: 18px;
+    color: white;
+    background-color: #a9c1d7;
+    margin: 0;
+    padding-top: .1em
+}
+
+#content .section {
+    margin-top: 2.5em;
+    border-bottom: 1px solid #d9d9d9;
+    text-align: left;
+    font-size: 14px;
+    font-weight: bold;
+    color: #5c6bc0
+}
+
+#content .row_even>td {
+    background-color: #f5f5f5
+}
+
+#content .row_odd>td {
+    background-color: white
+}
+
+#content .data-header ul {
+    list-style: none;
+    width: 100%;
+    margin: 0 0 10px 0;
+    padding: 0
+}
+
+#content .data-header li {
+    display: inline-block;
+    padding: .2em .5em;
+    font-weight: bold;
+    letter-spacing: .2em;
+    color: #fff;
+    text-align: center
+}
+
+#content .data-header li a {
+    color: #777
+}
+
+#content .data-header li img {
+    float: right;
+    width: 24px;
+    height: 24px;
+    vertical-align: middle
+}
+
+#content .data-header-minimal {
+    border-bottom: 1px solid #161B22;
+}
+
+#content .data-header-minimal ul {
+    display: flex;
+    flex-flow: row;
+    flex-wrap: wrap;
+    align-content: flex-start;
+    justify-content: space-around;
+    margin: 0
+}
+
+#content .data-header-minimal li {
+    min-width: 10em;
+    font-weight: normal;
+    letter-spacing: normal
+}
+
+#content .data-header-minimal li a {
+    color: #b9b9b9;
+    padding: .3em .8em
+}
+
+#content .data-header-minimal li.search-filter-spacer {
+    flex: 0 0 18em
+}
+
+#content .data-table {
+    width: 100%
+}
+
+#content .data-table td:first-of-type,
+#content .data-table th:first-of-type {
+    width: 5em
+}
+
+#content .data-table thead th {
+    background-color: #161B22;
+    color: #c9c9c9;
+}
+
+#content .data-table tbody td.cell-data {
+    text-align: left
+}
+
+#content .data-table tbody td.cell-nodata {
+    padding: 0 .5em;
+    text-align: left
+}
+
+#content .data-table tbody td.cell-actions {
+    text-align: right
+}
+
+#content .data-table tbody td.cell-actions i {
+    opacity: .5
+}
+
+#content .data-table tbody td.cell-actions i:hover {
+    opacity: 1
+}
+
+#content .data-rows ul {
+    display: table;
+    list-style: none;
+    width: 100%;
+    margin: 0 0 10px 0;
+    padding: 0;
+    background-color: #fcfcfc
+}
+
+#content .data-rows li {
+    float: left;
+    display: block;
+    padding: 1em;
+    color: #696969;
+    text-align: center;
+    min-height: 2em
+}
+
+#content .data-rows li.cell-nodata {
+    padding: 1em 0;
+    min-height: 2em;
+    text-align: left
+}
+
+#content .data-rows li.cell-actions {
+    float: right;
+    min-height: 2em;
+    padding: 1em 0;
+    text-align: left;
+    background-color: #fcfcfc;
+    width: 15em
+}
+
+#content .data-rows li.cell-nodata img,
+#content .data-rows li.cell-actions img {
+    width: 24px;
+    height: 24px;
+    margin: 0 .5em
+}
+
+#content #resEventLog .data {
+    width: 100%
+}
+
+#content #resEventLog thead {
+    text-align: center
+}
+
+#content #resEventLog tbody {
+    width: 100%;
+    height: 500px;
+    overflow: auto
+}
+
+#content #resEventLog td {
+    border-bottom: 1px solid #d9d9d9
+}
+
+#content #resEventLog .cell {
+    text-align: center
+}
+
+#content #resEventLog .cell-description {
+    width: 60%
+}
+
+#content #searchbox {
+    background-color: #161B22;
+    vertical-align: middle;
+    position: relative;
+    height: auto;
+    padding: .5em 1em;
+    margin-bottom: 2em
+}
+
+#content #searchbox form {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    align-items: center;
+    text-align: left
+}
+
+#content #searchbox .search-filters>* {
+    margin: 0 .5em
+}
+
+#content #searchbox .search-filters .filter-buttons {
+    display: inline-block
+}
+
+#content #searchbox .search-filters .filter-slider {
+    width: 10em
+}
+
+#content #searchbox .search-filters-tags {
+    display: none;
+    flex-grow: 2
+}
+
+#content .btn-clear {
+    opacity: .35;
+    filter: alpha(opacity=35)
+}
+
+#content .btn-clear:hover {
+    opacity: 1;
+    filter: alpha(opacity=100)
+}
+
+#content .actions-optional {
+    display: none
+}
+
+#content .error {
+    width: 350px;
+    padding: 15px;
+    margin: 0 auto;
+    text-align: center;
+    font-size: 16px;
+    line-height: 1.5em;
+    color: #ffca28;
+    background-color: #fff8e1;
+    border: 1px solid #ffca28
+}
+
+#content .data .user-list-action,
+#content .data .profile-list-action,
+#box-popup .user-list-action,
+#box-popup .profile-list-action {
+    width: 75%;
+    margin: 0 auto
+}
+
+#content .data .list-wrap,
+#box-popup .list-wrap {
+    max-height: 20em;
+    overflow: auto;
+    padding: .5em;
+    margin: 1em 0
+}
+
+#content .data .list-wrap ul,
+#box-popup .list-wrap ul {
+    list-style-type: none;
+    margin: 0;
+    padding: 0
+}
+
+#content .data .list-wrap li,
+#box-popup .list-wrap li {
+    display: flex;
+    background: #161B22;
+    padding: .5em;
+    font-size: 1em;
+    margin-bottom: .5em
+}
+
+#content .data .list-wrap li:hover,
+#box-popup .list-wrap li:hover {
+    background: #0D1117;
+    color: #fff
+}
+
+#content .data .list-wrap div.files-item-info,
+#box-popup .list-wrap div.files-item-info {
+    flex-grow: 2
+}
+
+#content .data .list-wrap div.files-item-info img,
+#box-popup .list-wrap div.files-item-info img {
+    margin: 0 .5em
+}
+
+#content .data .list-wrap div.files-item-actions,
+#box-popup .list-wrap div.files-item-actions {
+    padding: .3em 0
+}
+
+#content .data .list-actions i,
+#box-popup .list-actions i {
+    opacity: .5
+}
+
+#content .data .list-actions i:hover,
+#box-popup .list-actions i:hover {
+    opacity: 1
+}
+
+#box-popup {
+    width: -webkit-min-content;
+    width: -moz-min-content;
+    width: min-content;
+    min-width: 50em;
+    margin: 5em auto;
+    padding: 0;
+    background-color: #161B22;
+}
+
+#box-popup.box-password-view {
+    width: -webkit-min-content;
+    width: -moz-min-content;
+    width: min-content;
+    min-width: 30em
+}
+
+#box-popup>h2 {
+    position: relative;
+    width: 100%;
+    font-size: 18px;
+    color: #c9c9c9;
+    background-color: #0D1117;
+    margin: 0;
+    padding: .5em 0;
+    line-height: 1em
+}
+
+#box-popup>h2 .btn-popup-close {
+    display: none;
+    position: absolute;
+    right: .5em;
+    top: .2em
+}
+
+#box-popup>table {
+    width: 100%;
+    padding-bottom: 1em
+}
+
+#box-popup select {
+    width: 220px
+}
+
+#box-popup #resFancyAccion {
+    display: none
+}
+
+#box-popup #resCheck {
+    display: inline-block;
+    width: 80%;
+    height: 4em;
+    padding: 1em 0
+}
+
+#box-popup.image {
+    background-color: transparent;
+    max-width: 100%;
+    margin: 0 auto;
+    border-radius: 0 !important;
+    -moz-border-radius: 0 !important;
+    -webkit-border-radius: 0 !important
+}
+
+#box-popup.image img {
+    width: auto;
+    margin: 0 auto
+}
+
+#box-popup.image>div.title {
+    background-color: #607d8b;
+    color: #fff;
+    padding: .5em
+}
+
+#box-popup.help {
+    min-height: 100px;
+    background-color: #f5f5f5
+}
+
+#box-popup.help p {
+    font-size: 14px;
+    text-align: justify;
+    line-height: 2em
+}
+
+#box-complexity>div {
+    text-align: justify;
+    line-height: 1.5em;
+    margin-top: 1em
+}
+
+#box-upload-files>* {
+    margin: 0 auto
+}
+
+#debug {
+    float: left;
+    text-align: left
+}
+
+#debuginfo {
+    width: 100%;
+    min-height: 10em;
+    padding: 1em;
+    background-color: #fff8e1;
+    text-align: left;
+    line-height: 1.5em
+}
+
+#debuginfo H3 {
+    text-align: center
+}
+
+.popup-data {
+    width: 100%;
+    min-width: 400px;
+    border: 0;
+    text-align: left;
+    margin: 0;
+    padding: 1em .5em
+}
+
+.popup-data .descField {
+    min-width: 100px
+}
+
+footer {
+    display: flex;
+    justify-content: space-between;
+    position: fixed;
+    bottom: 0;
+    z-index: 100;
+    width: 100%;
+    padding: .5em 0;
+    background-color: #161B22;
+    color: #b9b9b9;
+    font-size: 1em;
+    -webkit-box-shadow: 0 -3px 2px -2px rgba(0, 0, 0, 0.14);
+    -moz-box-shadow: 0 -3px 2px -2px rgba(0, 0, 0, 0.14);
+    box-shadow: 0 -3px 2px -2px rgba(0, 0, 0, 0.14)
+}
+
+footer .footer-parts {
+    display: flex;
+    justify-content: space-between
+}
+
+footer #footer-left {
+    width: 50%;
+    margin: 0 1em
+}
+
+footer #footer-right {
+    width: 50%;
+    margin: 0 1em;
+    justify-content: flex-end;
+    text-align: right
+}
+
+footer #updates,
+footer #notices {
+    min-width: 5em;
+    text-align: center;
+    cursor: pointer
+}
+
+footer #notices .notices-title {
+    font-weight: bold;
+    border-bottom: 1px solid #c9c9c9;
+    margin-bottom: 1em
+}
+
+footer #status {
+    margin: 0 1em
+}
+
+footer #status>div {
+    display: inline-block
+}
+
+footer #status .status-info {
+    padding: .5em
+}
+
+footer #session {
+    text-align: left;
+    color: #999;
+    font-size: .8em
+}
+
+footer a {
+    color: #b9b9b9
+}
+
+footer a:visited {
+    color: #b9b9b9
+}
+
+footer #project a:hover {
+    color: #a9c1d7;
+    border-bottom: 1px solid #a9c1d7
+}
+
+footer #updates a:hover {
+    color: #a9c1d7
+}
+
+footer img {
+    border: 0;
+    width: 16px;
+    height: 16px;
+    vertical-align: middle
+}
+
+.round,
+.round5 {
+    border-radius: 5px !important;
+    -moz-border-radius: 5px !important;
+    -webkit-border-radius: 5px !important
+}
+
+.midround {
+    border-radius: 0 0 10px 10px !important;
+    -moz-border-radius: 0 0 10px 10px !important;
+    -webkit-border-radius: 0 0 10px 10px !important
+}
+
+.midroundup {
+    border-radius: 10px 10px 0 0 !important;
+    -moz-border-radius: 10px 10px 0 0 !important;
+    -webkit-border-radius: 10px 10px 0 0 !important
+}
+
+.fullround {
+    border-radius: 50% !important;
+    -moz-border-radius: 50% !important;
+    -webkit-border-radius: 50% !important
+}
+
+.iconMini {
+    width: 16px !important;
+    height: 16px !important;
+    vertical-align: middle
+}
+
+.hide {
+    display: none !important
+}
+
+.btn-checks {
+    padding: 5px;
+    margin: .2em 0;
+    width: 30em;
+    border-bottom: 1px solid #c9c9c9
+}
+
+.shadow {
+    -webkit-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+    -moz-box-shadow: 2px 2px 3px -3px rgba(0, 0, 0, 0.14);
+    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.14)
+}
+
+.noRes {
+    width: 60%;
+    padding: 15px;
+    background-color: #0D1117;
+    color: #a9a9a9;
+    border: #0D1117 1px solid;
+    margin: 20px auto;
+    text-align: center;
+    font-size: 16px
+}
+
+.header-grey {
+    background-color: #607d8b;
+    color: #fff;
+    min-height: 2em
+}
+
+.no-background {
+    background: none !important
+}
+
+.action-in-box {
+    padding: 1em;
+    text-align: right
+}
+
+.action-in-box ul {
+    list-style: none;
+    margin: 0;
+    padding: 0
+}
+
+.tab-data {
+    margin: 2em auto 0;
+    width: 75%
+}
+
+.item-actions {
+    display: flex;
+    justify-content: flex-end;
+    position: relative;
+    margin: 1em auto
+}
+
+.item-actions>div {
+    display: inline-block
+}
+
+.tab-actions {
+    margin: 2em 0
+}
+
+.item-actions>ul,
+.tab-actions>ul {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-end;
+    align-items: center;
+    list-style: none;
+    margin: 0;
+    padding: 0
+}
+
+.item-actions>ul>li,
+.tab-actions>ul>li {
+    width: auto;
+    min-width: 2em;
+    margin-left: .5em
+}
+
+.item-actions>ul>li.datagrid-action-search,
+.tab-actions>ul>li.datagrid-action-search {
+    min-width: 5em
+}
+
+.item-actions>ul>li.datagrid-action-search form,
+.tab-actions>ul>li.datagrid-action-search form {
+    width: 100%
+}
+
+h5.datagrid-header-title {
+    padding: .7em;
+    border-bottom: 1px solid #161B22;
+}
+
+.fullWidth {
+    max-width: 100% !important
+}
+
+.filter-on {
+    color: #26a69a;
+    background-color: #e0f2f1;
+    border: 1px solid #26a69a;
+    padding: .3em 1em
+}
+
+.global-on {
+    color: #ffca28;
+    background-color: #fff8e1;
+    border: 1px solid #ffca28;
+    padding: .3em 1em
+}
+
+.opacity50 {
+    filter: alpha(opacity=50);
+    opacity: .5
+}
+
+.custom-combobox {
+    position: relative;
+    display: inline-block
+}
+
+.custom-combobox input {
+    width: 80%
+}
+
+.custom-combobox-toggle {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    margin-left: -1px;
+    padding: 0;
+    *height: 1.7em;
+    *top: .1em
+}
+
+.custom-combobox-input {
+    margin: 0;
+    padding: .3em
+}
+
+.password-level.strongest {
+    color: #26a69a
+}
+
+.password-level.strong {
+    color: #2196f3
+}
+
+.password-level.good {
+    color: #ffca28
+}
+
+.password-level.weak {
+    color: #ef5350
+}
+
+#alert #alert-text {
+    margin: 15px auto;
+    font-size: 14px;
+    font-weight: bold
+}
+
+#alert #alert-pass {
+    width: 50%;
+    padding: 10px;
+    margin: 15px auto;
+    border: 1px solid #c9c9c9;
+    color: #555;
+    font-weight: bold
+}
+
+.dialog-text,
+.dialog-user-text,
+.dialog-pass-text {
+    font-family: Consolas, "Andale Mono WT", "Andale Mono", "Bitstream Vera Sans Mono", "Nimbus Mono L", Monaco, "Courier New", monospace;
+    padding: .5em;
+    text-align: center;
+    min-width: 200px
+}
+
+.dialog-user-text {
+    border-bottom: #d9d9d9 1px solid;
+    color: #a9a9a9
+}
+
+.dialog-pass-text {
+    border: transparent 1px solid;
+    letter-spacing: .2em
+}
+
+.dialog-button {
+    width: 150px
+}
+
+.dialog-buttons {
+    text-align: center;
+    padding: .5em;
+    border-top: 1px solid #c9c9c9;
+    line-height: 2.5em
+}
+
+.dialog-clip-copy {
+    color: #26a69a;
+    background-color: #0D1117
+}
+
+.btn-help {
+    cursor: pointer
+}
+
+.help-box {
+    display: none;
+    background-color: #fff !important;
+    color: #607d8b
+}
+
+.help-box>* {
+    font-weight: bold
+}
+
+.help-container ul {
+    padding: 0 .5em;
+    list-style: none
+}
+
+.help-container ul li {
+    padding: .5em 0
+}
+
+.help-container .help-text {
+    text-align: justify;
+    line-height: 1.5em;
+    margin-top: 1em
+}
+
+.tooltip {
+    width: 300px;
+    max-width: 300px;
+    background-color: #777;
+    color: #fff;
+    z-index: 101
+}
+
+.tooltip-text {
+    padding: .5em
+}
+
+.tooltip-text .tooltip-header {
+    text-transform: capitalize;
+    font-weight: bold;
+    border-bottom: 1px solid #c9c9c9
+}
+
+.cursor-pointer {
+    cursor: pointer
+}
+
+.password-actions {
+    display: inline-block;
+    width: 12em
+}
+
+.password-actions>span,
+.password-actions i {
+    margin-right: .6em
+}
+
+.form-control {
+    position: relative
+}
+
+.form-control .password-actions {
+    position: absolute;
+    right: 0;
+    padding: 20px
+}
+
+.custom-input-color {
+    width: 3em;
+    height: 1em;
+    display: inline-block
+}
+
+.account-pass-image {
+    height: 32px;
+    width: auto
+}
+
+.select-box {
+    min-width: 300px;
+    max-width: 100%
+}
+
+fieldset.warning {
+    padding: 8px;
+    border-radius: 5px;
+    color: #ef5350;
+    background-color: #ffebee;
+    border: 1px solid #ef5350
+}
+
+fieldset.warning legend {
+    color: #ef5350 !important
+}
+
+fieldset.warning a {
+    color: #ef5350 !important;
+    font-weight: bold
+}
+
+#actions {
+    width: 100%;
+    line-height: 2em;
+    margin-bottom: 5em
+}
+
+#actions #logo {
+    display: flex;
+    width: 100%;
+    margin-bottom: 30px;
+    color: #607d8b;
+    align-items: center;
+    background: url("public/images/logo_full_bg.png") left no-repeat;
+    background-size: auto 150px;
+    height: 150px
+}
+
+#actions #page-title {
+    width: 100%;
+    color: #607d8b;
+    text-align: center
+}
+
+#actions #page-title h1 {
+    font-weight: bold;
+    font-size: 24px;
+    letter-spacing: 3px
+}
+
+#actions ul.errors {
+    max-width: 40vw;
+    margin: 0 auto;
+    list-style: none;
+    font-size: 14px;
+    text-align: left
+}
+
+#actions ul.errors>li {
+    margin: 1.5em auto;
+    border-radius: 3px;
+    padding: 1em .5em
+}
+
+#actions ul.errors>li.msg-critical {
+    color: #ef5350;
+    background-color: #ffebee;
+    border: 1px solid #ef5350
+}
+
+#actions ul.errors>li.msg-warning {
+    color: #ffca28;
+    background-color: #fff8e1;
+    border: 1px solid #ffca28;
+    color: #555
+}
+
+#actions ul.errors>li.msg-ok {
+    color: #26a69a;
+    background-color: #e0f2f1;
+    border: 1px solid #26a69a
+}
+
+#actions ul.errors>li>p.hint {
+    color: #555;
+    font-size: 12px
+}
+
+#actions ul.errors>li>p.hint i {
+    margin-right: .5em
+}
+
+#actions form {
+    width: 450px;
+    margin: 0 auto;
+    text-align: left
+}
+
+#actions form fieldset {
+    margin-bottom: 2em
+}
+
+#actions form fieldset legend {
+    width: 100%;
+    color: #fff;
+    font-size: 14px;
+    font-weight: bold;
+    text-align: center;
+    background-color: #607d8b;
+    margin: 1em 0;
+    letter-spacing: .2em;
+    padding: .2em 0
+}
+
+#actions div.buttons {
+    margin-top: 2em;
+    text-align: center
+}
+
+.center {
+    text-align: center !important
+}
+
+.right {
+    text-align: right !important
+}
+
+.left {
+    text-align: left !important
+}
+
+.opacity50 {
+    opacity: .5 !important
+}
+
+.msg-option-unvailable {
+    color: #ffca28;
+    background-color: #fff8e1;
+    border: 1px solid #ffca28;
+    border: 0;
+    padding: .5em;
+    text-align: center;
+    margin: 1em 0;
+    font-size: 1.5em
+}
+
+div.tag-list-box {
+    margin-bottom: 1em
+}
+
+div.tag-list-box .tag-list-header {
+    text-align: left;
+    border-bottom: 1px solid #d9d9d9;
+    color: #607d8b;
+    font-size: 12px;
+    font-weight: bold;
+    margin-bottom: .5em
+}
+
+div.tag-list-box .tag-list-body .tags-list-items {
+    display: inline-block;
+    padding: .5em;
+    width: 95%;
+    height: 3em;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+    border-radius: 3px !important;
+    -moz-border-radius: 3px !important;
+    -webkit-border-radius: 3px !important
+}
+
+div.tag-list-box i.select-icon {
+    margin-right: .5em;
+    color: #607d8b;
+    font-size: 18px
+}
+
+div.tag-list-box span.tag,
+div.tags-box span.tag {
+    margin: 0 3px 3px 0;
+    padding: 3px;
+    background: #5c6bc0;
+    color: #fff;
+    border: 0;
+    border-radius: 3px !important;
+    -moz-border-radius: 3px !important;
+    -webkit-border-radius: 3px !important
+}
+
+#box-pub-noheader #box-login {
+    position: relative;
+    min-height: 14em
+}
+
+#box-pub-noheader #box-login #box-buttons {
+    position: absolute;
+    top: 2em;
+    right: 2em
+}
+
+#box-pub-noheader #box-login #box-actions {
+    width: 100%;
+    text-align: right
+}
+
+#box-pub-noheader #box-login #box-actions a {
+    color: #c9c9c9
+}
+
+#box-pub-noheader #box-updated {
+    width: 350px;
+    margin: 3em auto;
+    font-size: 14px;
+    text-align: center;
+    padding: .5em;
+    color: #26a69a;
+    background-color: #e0f2f1;
+    border: 1px solid #26a69a
+}
+
+#box-pub-noheader #demo-info {
+    padding: .5em;
+    margin: 3em auto 0 auto;
+    color: #c9c9c9;
+    border-top: 1px solid #d9d9d9;
+    border-bottom: 1px solid #d9d9d9
+}
+
+#box-pub-noheader #demo-info ul {
+    display: flex;
+    justify-content: space-around;
+    list-style: none
+}
+
+#box-pub-noheader #demo-info ul li>span {
+    padding: 0 1em
+}
+
+@media screen and (max-width:600px) {
+    #box-pub-noheader #box-login #box-buttons {
+        position: relative;
+        top: 0;
+        right: 0;
+        text-align: right
+    }
+    #box-pub-noheader #box-login #box-actions {
+        margin-top: 1em
+    }
+    #box-pub-noheader #demo-info ul {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        list-style: none
+    }
+    #box-pub-noheader #demo-info ul li {
+        width: 11em;
+        text-align: left
+    }
+    #box-pub-noheader #demo-info ul li>span {
+        padding: 0 1em
+    }
+}
+
+@media screen and (max-width:1000px) {
+    #content #searchbox .search-filters>* {
+        margin: .5em 1em .5em 0
+    }
+    footer {
+        display: none;
+        justify-content: space-between;
+        flex-wrap: wrap
+    }
+    footer .footer-parts {
+        justify-content: space-between;
+        flex-wrap: wrap
+    }
+    footer #footer-left,
+    footer #footer-right {
+        width: 100%
+    }
+    footer .footer-parts>div {
+        width: 100%;
+        padding: .5em 0
+    }
+}
+
+@media screen and (max-width:600px) {
+    #content input,
+    #box-popup input {
+        width: 100%
+    }
+    #content .mdl-textfield,
+    #box-popup .mdl-textfield {
+        width: 100%
+    }
+    #content td.descField,
+    #box-popup td.descField {
+        display: none
+    }
+    #content td.valField .lowres-title,
+    #box-popup td.valField .lowres-title {
+        display: block
+    }
+    #content #searchbox .mdl-textfield {
+        width: 90%
+    }
+    #content #searchbox .search-text {
+        width: 90%
+    }
+    #content #searchbox .search-filters .selectize-control {
+        width: 100%
+    }
+    #content .data-header-minimal li.search-filter-spacer {
+        display: none
+    }
+    #content .data-container,
+    #content .tab-data {
+        width: 100%
+    }
+    #content .data-container .selectize-control,
+    #content .tab-data .selectize-control {
+        width: 100%
+    }
+    #content .mdl-tabs__tab-bar {
+        flex-wrap: wrap;
+        height: auto
+    }
+    #content .pager {
+        flex-direction: column-reverse
+    }
+    #content .pager>div {
+        text-align: center;
+        width: 100%
+    }
+    #box-popup h2>.btn-popup-close {
+        display: inline-block
+    }
+    #actions ul.errors {
+        max-width: 90vw
+    }
+    .mdl-data-table {
+        table-layout: fixed;
+        width: 100%
+    }
+    .table-responsive td,
+    .table-responsive th {
+        width: 100%;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        -o-text-overflow: ellipsis
+    }
+    .table-responsive .cell-actions i {
+        display: block !important
+    }
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/styles.scss b/app/modules/web/themes/material-dark/css/styles.scss
new file mode 100644
index 000000000..aab4b6872
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/styles.scss
@@ -0,0 +1,1499 @@
+@import "base";
+@import "elements";
+@import "noheader";
+
+#nojs {
+  width: 80%;
+  text-align: center;
+  vertical-align: middle;
+  margin: 10px auto;
+  padding: 3px;
+  background-color: $color-red-fg;
+  color: white;
+  font-weight: bold;
+  font-size: 14px;
+}
+
+#wrap {
+  height: auto !important;
+  min-height: 100%;
+  /*min-width: 1024px;*/
+  /*height: 100%;*/
+  width: 100%;
+  background-color: #f5f5f5;
+  padding-bottom: 5em;
+}
+
+#wrap-loading {
+  position: fixed;
+  z-index: 9999;
+  top: 50%;
+  left: 50%;
+  padding: 1em;
+  background-color: rgba(255, 255, 255, 0.8);
+  display: none;
+  @include border-radius(5px);
+
+  &.overlay-full {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(255, 255, 255, 0.5);
+
+    #loading {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+    }
+
+    #taskStatus {
+      display: none;
+    }
+  }
+
+  #taskStatus {
+    display: none;
+    position: absolute;
+    left: 0;
+    top: 55%;
+    width: 100%;
+    text-align: center;
+    color: white;
+    background-color: rgba(0, 0, 0, 0.5);
+    padding: 1em 0;
+  }
+}
+
+#container {
+  margin: auto;
+  width: 100%;
+
+  &.error, &.install {
+    width: 100%;
+  }
+
+  .logo {
+    height: 64px;
+  }
+
+  #actions-bar {
+    z-index: 100;
+    display: flex;
+    justify-content: space-between;
+    position: fixed;
+    border: 0 none;
+    top: 0;
+    left: 0;
+    width: 100%;
+    padding: 1em 0;
+    background-color: transparent;
+  }
+
+  #actions-bar-icons {
+    flex-grow: 1;
+    text-align: center;
+  }
+
+  #actions-bar-logo {
+    display: none;
+    padding: 0 .5em;
+
+    img {
+      display: inline-block;
+      width: 50px;
+      opacity: 0.75;
+    }
+  }
+
+  #content {
+    width: 95%;
+    margin: 2em auto 8em auto;
+
+    &.public-link {
+      width: 70%;
+      min-height: 0;
+      margin: 5em auto;
+    }
+  }
+}
+
+#content, #box-popup {
+  td.descField {
+    text-align: right;
+    padding-right: 20px;
+    width: 25%;
+    border-right: 1px solid #d9d9d9;
+    color: #999;
+    font-size: 12px;
+    font-weight: bold;
+  }
+
+  td.valField {
+    padding-left: 1em;
+    width: 100%;
+
+    .lowres-title {
+      display: none;
+      width: 100%;
+      color: $color-bluegrey-fg;
+      font-size: 12px;
+    }
+
+    .notification-description {
+      font-size: 16px;
+      max-width: 100%;
+
+      .event-description, .event-details {
+        padding: .5em 0;
+      }
+
+      .event-description {
+        color: $color-indigo-fg;
+        border-bottom: 1px solid #e9e9e9;
+      }
+
+      .event-details {
+        .detail {
+          display: flex;
+          padding: .2em 0;
+
+          .detail-left {
+            flex: none;
+            width: 8em;
+            font-weight: bold;
+          }
+
+          .detail-right {
+            flex-grow: 1;
+          }
+        }
+      }
+    }
+  }
+}
+
+#content {
+  .pager {
+    @include flexbox();
+    justify-content: space-between;
+    align-content: space-between;
+    flex-wrap: wrap;
+    width: 100%;
+    margin-top: 15px;
+    padding: .5em;
+    font-size: 11px;
+    color: #999;
+    background-color: #fcfcfc;
+
+    img {
+      margin-left: 5px;
+      vertical-align: middle;
+    }
+
+    a {
+      margin-left: 5px;
+      font-size: 12px;
+      color: #999;
+    }
+  }
+
+  #title {
+    width: 100%;
+    padding: 7px;
+    background-color: #d9d9d9;
+    color: #fff;
+    font-size: 17px;
+    letter-spacing: .2em;
+
+    &.titleNormal {
+      background-color: $color-bluegrey-fg;
+      color: #fff;
+    }
+  }
+
+  .data-container {
+    width: 75%;
+    margin: 0 auto;
+  }
+
+  fieldset.data {
+    margin: 2em auto;
+
+    > {
+      legend {
+        color: $color-bluegrey-fg;
+        padding: 0 .5em;
+        font-size: 1.5em;
+      }
+
+      div {
+        display: none;
+
+        table {
+          width: 100%;
+        }
+      }
+    }
+  }
+
+  .data {
+    width: 100%;
+    padding: 10px;
+    //border: 1px solid #d9d9d9;
+    margin: 0 auto;
+    background-color: #fff;
+    @include box-shadow();
+
+    #history-icon {
+      position: relative;
+      top: 5em;
+      right: 2em;
+    }
+
+    td {
+      text-align: left;
+
+      &.descField {
+        text-align: right;
+      }
+    }
+
+    select {
+      min-width: 210px;
+    }
+
+    .list-wrap {
+      max-height: 10em;
+      overflow: auto;
+      padding: .5em;
+      margin: 1em 0;
+    }
+
+    .dropzone {
+      &:hover {
+        opacity: 1;
+      }
+
+      width: 100%;
+      padding: 1em;
+      border: 2px dashed $color-teal-fg;
+      text-align: center;
+      opacity: .3;
+
+      img {
+        vertical-align: middle;
+      }
+    }
+
+    .file-upload {
+      display: none;
+    }
+
+    .account-permissions {
+      width: 100%;
+    }
+  }
+
+  .extra-info {
+    margin-top: 20px;
+  }
+
+  #tabs {
+    fieldset {
+      border: 1px solid #c9c9c9;
+    }
+
+    #frmConfig label {
+      float: left;
+    }
+  }
+
+  .tblConfig {
+    margin-bottom: 2em;
+
+    td {
+      &.descField {
+        width: 35%;
+        font-size: 11px;
+        font-weight: bold;
+      }
+
+      &.rowHeader {
+        padding: 5px 0 5px 0;
+        background-color: #f5f5f5;
+        text-align: center;
+        font-weight: bold;
+        border-top: 15px solid #f9f9f9;
+        border-bottom: 3px solid #a9c1d7;
+        letter-spacing: .5em;
+        color: #696969;
+      }
+    }
+
+    input.checkbox {
+      width: 15px;
+      text-align: left;
+      padding: 0;
+    }
+
+    .option-disabled {
+      text-align: center;
+      background-color: $color-amber-bg;
+      color: $color-amber-fg;
+      font-weight: bold;
+    }
+  }
+
+  h2 {
+    width: 100%;
+    height: 1.5em;
+    font-size: 18px;
+    color: white;
+    background-color: #a9c1d7;
+    margin: 0;
+    padding-top: 0.1em;
+  }
+
+  .section {
+    margin-top: 2.5em;
+    border-bottom: 1px solid #d9d9d9;
+    text-align: left;
+    font-size: 14px;
+    font-weight: bold;
+    color: $color-indigo-fg;
+  }
+
+  .row_even > td {
+    background-color: #f5f5f5;
+  }
+
+  .row_odd > td {
+    background-color: white;
+  }
+
+  .data-header {
+    ul {
+      list-style: none;
+      width: 100%;
+      margin: 0 0 10px 0;
+      padding: 0;
+    }
+
+    li {
+      display: inline-block;
+      padding: .2em .5em;
+      font-weight: bold;
+      letter-spacing: .2em;
+      color: #fff;
+      text-align: center;
+
+      a {
+        color: #777;
+      }
+
+      img {
+        float: right;
+        width: 24px;
+        height: 24px;
+        vertical-align: middle;
+      }
+    }
+  }
+
+  .data-header-minimal {
+    border-bottom: 1px solid #dfdfdf;
+
+    ul {
+      display: flex;
+      flex-flow: row;
+      flex-wrap: wrap;
+      align-content: flex-start;
+      justify-content: space-around;
+      margin: 0;
+    }
+
+    li {
+      min-width: 10em;
+      font-weight: normal;
+      letter-spacing: normal;
+
+      a {
+        color: #b9b9b9;
+        padding: 0.3em 0.8em;
+      }
+    }
+
+    li.search-filter-spacer {
+      flex: 0 0 18em;
+    }
+  }
+
+  .data-table {
+    width: 100%;
+
+    td:first-of-type,
+    th:first-of-type {
+      width: 5em;
+    }
+
+    thead th {
+      background-color: $color-bluegrey-fg;
+      color: #fff;
+    }
+
+    tbody td {
+      &.cell-data {
+        text-align: left;
+      }
+
+      &.cell-nodata {
+        padding: 0 .5em;
+        text-align: left;
+      }
+
+      &.cell-actions {
+        text-align: right;
+
+        i {
+          opacity: .5;
+
+          &:hover {
+            opacity: 1;
+          }
+        }
+      }
+    }
+  }
+
+  .data-rows {
+    ul {
+      display: table;
+      list-style: none;
+      width: 100%;
+      margin: 0 0 10px 0;
+      padding: 0;
+      background-color: #fcfcfc;
+    }
+
+    li {
+      float: left;
+      display: block;
+      padding: 1em;
+      color: #696969;
+      text-align: center;
+      min-height: 2em;
+
+      &.cell-nodata {
+        padding: 1em 0;
+        min-height: 2em;
+        text-align: left;
+      }
+
+      &.cell-actions {
+        float: right;
+        min-height: 2em;
+        padding: 1em 0;
+        text-align: left;
+        background-color: #fcfcfc;
+        width: 15em;
+      }
+
+      &.cell-nodata img, &.cell-actions img {
+        width: 24px;
+        height: 24px;
+        margin: 0 0.5em;
+      }
+    }
+  }
+
+  #resEventLog {
+    .data {
+      width: 100%;
+    }
+
+    thead {
+      text-align: center;
+    }
+
+    tbody {
+      width: 100%;
+      height: 500px;
+      overflow: auto;
+    }
+
+    td {
+      border-bottom: 1px solid #d9d9d9;
+    }
+
+    .cell {
+      text-align: center;
+    }
+
+    .cell-description {
+      width: 60%;
+    }
+  }
+
+  #searchbox {
+    background-color: #fcfcfc;
+    vertical-align: middle;
+    position: relative;
+    height: auto;
+    padding: .5em 1em;
+    margin-bottom: 2em;
+
+    form {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: flex-start;
+      align-items: center;
+      text-align: left;
+    }
+
+    .search-filters {
+      & > * {
+        margin: 0 .5em;
+      }
+
+      .filter-buttons {
+        display: inline-block;
+      }
+
+      .filter-slider {
+        width: 10em;
+      }
+    }
+
+    .search-filters-tags {
+      display: none;
+      flex-grow: 2;
+    }
+  }
+
+  .btn-clear {
+    opacity: .35;
+    filter: alpha(opacity=35);
+
+    &:hover {
+      opacity: 1;
+      filter: alpha(opacity=100);
+    }
+  }
+
+  .actions-optional {
+    display: none;
+  }
+
+  .error {
+    width: 350px;
+    padding: 15px;
+    margin: 0 auto;
+    text-align: center;
+    font-size: 16px;
+    line-height: 1.5em;
+    @include color-amber();
+  }
+}
+
+#content .data,
+#box-popup {
+  .user-list-action,
+  .profile-list-action {
+    width: 75%;
+    margin: 0 auto;
+  }
+
+  .list-wrap {
+    max-height: 20em;
+    overflow: auto;
+    padding: .5em;
+    margin: 1em 0;
+
+    ul {
+      list-style-type: none;
+      margin: 0;
+      padding: 0;
+    }
+
+    li {
+      display: flex;
+      background: #f2f2f2;
+      padding: .5em;
+      font-size: 1em;
+      margin-bottom: .5em;
+    }
+
+    li:hover {
+      background: #e8eaf6;
+      color: #000;
+    }
+
+    div.files-item-info {
+      flex-grow: 2;
+    }
+
+    div.files-item-info img {
+      margin: 0 .5em;
+    }
+
+    div.files-item-actions {
+      padding: .3em 0;
+    }
+  }
+
+  .list-actions {
+    i {
+      opacity: .5;
+
+      &:hover {
+        opacity: 1;
+      }
+    }
+  }
+}
+
+#box-popup {
+  @include fit-ccntent();
+  min-width: 50em;
+  margin: 5em auto;
+  padding: 0;
+  background-color: #fff;
+
+  &.box-password-view {
+    @include fit-ccntent();
+    min-width: 30em;
+    //max-width: 35em;
+  }
+
+  > {
+    h2 {
+      position: relative;
+      width: 100%;
+      font-size: 18px;
+      color: #fff;
+      background-color: $color-bluegrey-fg;
+      margin: 0;
+      padding: .5em 0;
+      line-height: 1em;
+
+      .btn-popup-close {
+        display: none;
+        position: absolute;
+        right: .5em;
+        top: .2em;
+      }
+    }
+
+    table {
+      width: 100%;
+      padding-bottom: 1em;
+    }
+  }
+
+  select {
+    width: 220px;
+  }
+
+  #resFancyAccion {
+    display: none;
+  }
+
+  #resCheck {
+    display: inline-block;
+    width: 80%;
+    height: 4em;
+    padding: 1em 0;
+  }
+
+  &.image {
+    background-color: transparent;
+    max-width: 100%;
+    margin: 0 auto;
+    @include border-radius(0);
+
+    img {
+      width: auto;
+      margin: 0 auto;
+    }
+
+    > div.title {
+      background-color: $color-bluegrey-fg;
+      color: #fff;
+      padding: .5em;
+    }
+  }
+
+  &.help {
+    min-height: 100px;
+    background-color: #f5f5f5;
+
+    p {
+      font-size: 14px;
+      text-align: justify;
+      line-height: 2em;
+    }
+  }
+}
+
+#box-complexity {
+  & > div {
+    text-align: justify;
+    line-height: 1.5em;
+    margin-top: 1em;
+  }
+}
+
+#box-upload-files > * {
+  margin: 0 auto;
+}
+
+#debug {
+  float: left;
+  text-align: left;
+}
+
+#debuginfo {
+  width: 100%;
+  min-height: 10em;
+  padding: 1em;
+  background-color: $color-amber-bg;
+  text-align: left;
+  line-height: 1.5em;
+
+  H3 {
+    text-align: center;
+  }
+}
+
+.popup-data {
+  width: 100%;
+  min-width: 400px;
+  border: 0;
+  text-align: left;
+  margin: 0;
+  padding: 1em .5em;
+
+  .descField {
+    min-width: 100px;
+  }
+}
+
+footer {
+  display: flex;
+  justify-content: space-between;
+  position: fixed;
+  bottom: 0;
+  z-index: 100;
+  width: 100%;
+  padding: .5em 0;
+  background-color: #f5f5f5;
+  color: #b9b9b9;
+  font-size: 1em;
+  @include box-shadow-top();
+
+  .footer-parts {
+    display: flex;
+    justify-content: space-between;
+  }
+
+  #footer-left {
+    width: 50%;
+    margin: 0 1em;
+  }
+
+  #footer-right {
+    width: 50%;
+    margin: 0 1em;
+    justify-content: flex-end;
+    text-align: right;
+  }
+
+  #updates, #notices {
+    min-width: 5em;
+    text-align: center;
+    cursor: pointer;
+  }
+
+  #notices .notices-title {
+    font-weight: bold;
+    border-bottom: 1px solid #c9c9c9;
+    margin-bottom: 1em;
+  }
+
+  #status {
+    margin: 0 1em;
+
+    > div {
+      display: inline-block;
+    }
+
+    .status-info {
+      padding: 0.5em;
+    }
+  }
+
+  #session {
+    text-align: left;
+    color: #999;
+    font-size: .8em;
+  }
+
+  a {
+    color: #b9b9b9;
+
+    &:visited {
+      color: #b9b9b9;
+    }
+  }
+
+  #project a:hover {
+    color: #a9c1d7;
+    border-bottom: 1px solid #a9c1d7;
+  }
+
+  #updates a:hover {
+    color: #a9c1d7;
+  }
+
+  img {
+    border: 0;
+    width: 16px;
+    height: 16px;
+    vertical-align: middle;
+  }
+}
+
+.round, .round5 {
+  @include border-radius(5px);
+}
+
+.midround {
+  border-radius: 0 0 10px 10px !important;
+  -moz-border-radius: 0 0 10px 10px !important;
+  -webkit-border-radius: 0 0 10px 10px !important;
+}
+
+.midroundup {
+  border-radius: 10px 10px 0 0 !important;
+  -moz-border-radius: 10px 10px 0 0 !important;
+  -webkit-border-radius: 10px 10px 0 0 !important;
+}
+
+.fullround {
+  @include border-radius(50%);
+}
+
+.iconMini {
+  width: 16px !important;
+  height: 16px !important;
+  vertical-align: middle;
+}
+
+.hide {
+  display: none !important;
+}
+
+.btn-checks {
+  padding: 5px;
+  margin: .2em 0;
+  width: 30em;
+  border-bottom: 1px solid #c9c9c9;
+}
+
+.shadow {
+  @include box-shadow();
+}
+
+.noRes {
+  width: 60%;
+  padding: 15px;
+  background-color: #f9f9f9;
+  color: #a9a9a9;
+  border: #c9c9c9 1px solid;
+  margin: 20px auto;
+  text-align: center;
+  font-size: 16px;
+}
+
+.header-grey {
+  background-color: $color-bluegrey-fg;
+  color: #fff;
+  min-height: 2em;
+}
+
+.no-background {
+  background: none !important;
+}
+
+.action-in-box {
+  padding: 1em;
+  text-align: right;
+
+  ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+}
+
+.tab-data {
+  margin: 2em auto 0;
+  width: 75%;
+}
+
+.item-actions {
+  display: flex;
+  justify-content: flex-end;
+  position: relative;
+  margin: 1em auto;
+
+  > div {
+    display: inline-block;
+  }
+}
+
+.tab-actions {
+  margin: 2em 0;
+}
+
+.item-actions > ul,
+.tab-actions > ul {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+  align-items: center;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+
+  & > li {
+    width: auto;
+    min-width: 2em;
+    margin-left: .5em;
+
+    &.datagrid-action-search {
+      min-width: 5em;
+
+      form {
+        width: 100%;
+      }
+    }
+  }
+}
+
+h5.datagrid-header-title {
+  padding: .7em;
+  border-bottom: 1px solid #d9d9d9;
+}
+
+.fullWidth {
+  max-width: 100% !important;
+}
+
+.filter-on {
+  @include color-teal();
+  padding: .3em 1em;
+}
+
+.global-on {
+  @include color-amber();
+  padding: .3em 1em;
+}
+
+.opacity50 {
+  filter: alpha(opacity=50);
+  opacity: 0.5;
+}
+
+.custom-combobox {
+  position: relative;
+  display: inline-block;
+
+  input {
+    width: 80%;
+  }
+}
+
+.custom-combobox-toggle {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  margin-left: -1px;
+  padding: 0;
+  *height: 1.7em;
+  *top: 0.1em;
+}
+
+.custom-combobox-input {
+  margin: 0;
+  padding: 0.3em;
+}
+
+.password-level {
+  &.strongest {
+    color: $color-teal-fg;
+  }
+
+  &.strong {
+    color: $color-blue-fg;
+  }
+
+  &.good {
+    color: $color-amber-fg;
+  }
+
+  &.weak {
+    color: $color-red-fg;
+  }
+}
+
+#alert {
+  #alert-text {
+    margin: 15px auto;
+    font-size: 14px;
+    font-weight: bold;
+  }
+
+  #alert-pass {
+    width: 50%;
+    padding: 10px;
+    margin: 15px auto;
+    border: 1px solid #c9c9c9;
+    color: #555;
+    font-weight: bold;
+  }
+}
+
+.dialog-text {
+  font-family: $font-stack-mono;
+  padding: .5em;
+  text-align: center;
+  min-width: 200px;
+}
+
+.dialog-user-text {
+  @extend .dialog-text;
+  border-bottom: #d9d9d9 1px solid;
+  color: #a9a9a9;
+}
+
+.dialog-pass-text {
+  @extend .dialog-text;
+  border: transparent 1px solid;
+  letter-spacing: .2em;
+}
+
+.dialog-button {
+  width: 150px;
+}
+
+.dialog-buttons {
+  text-align: center;
+  padding: .5em;
+  border-top: 1px solid #c9c9c9;
+  line-height: 2.5em;
+}
+
+.dialog-clip-copy {
+  color: $color-teal-fg;
+  background-color: $color-teal-bg;
+}
+
+.btn-help {
+  cursor: pointer;
+}
+
+.help-box {
+  display: none;
+  background-color: #fff !important;
+  color: $color-bluegrey-fg;
+
+  > * {
+    font-weight: bold;
+  }
+}
+
+.help-container {
+  ul {
+    padding: 0 .5em;
+    list-style: none;
+
+    li {
+      padding: .5em 0;
+    }
+  }
+
+  .help-text {
+    text-align: justify;
+    line-height: 1.5em;
+    margin-top: 1em;
+  }
+}
+
+.tooltip {
+  width: 300px;
+  max-width: 300px;
+  background-color: #777;
+  color: #fff;
+  z-index: 101;
+}
+
+.tooltip-text {
+  padding: .5em;
+
+  .tooltip-header {
+    text-transform: capitalize;
+    font-weight: bold;
+    border-bottom: 1px solid #c9c9c9;
+  }
+}
+
+.cursor-pointer {
+  cursor: pointer;
+}
+
+.password-actions {
+  display: inline-block;
+  width: 12em;
+
+  > span, i {
+    margin-right: 0.6em;
+  }
+}
+
+.form-control {
+  position: relative;
+
+  .password-actions {
+    position: absolute;
+    right: 0;
+    padding: 20px;
+  }
+}
+
+.custom-input-color {
+  width: 3em;
+  height: 1em;
+  display: inline-block;
+}
+
+.account-pass-image {
+  height: 32px;
+  width: auto;
+}
+
+.select-box {
+  min-width: 300px;
+  max-width: 100%;
+}
+
+fieldset.warning {
+  padding: 8px;
+  border-radius: 5px;
+  @include color-red();
+
+  legend {
+    color: $color-red-fg !important;
+  }
+
+  a {
+    color: $color-red-fg !important;
+    font-weight: bold;
+  }
+}
+
+#actions {
+  width: 100%;
+  /*margin: auto auto 50px;*/
+  line-height: 2em;
+  margin-bottom: 5em;
+
+  #logo {
+    display: flex;
+    width: 100%;
+    margin-bottom: 30px;
+    color: $color-bluegrey-fg;
+    align-items: center;
+    background: url($public-path + "/images/logo_full_bg.png") left no-repeat;
+    background-size: auto 150px;
+    height: 150px;
+  }
+
+  #page-title {
+    width: 100%;
+    color: $color-bluegrey-fg;
+    text-align: center;
+
+    h1 {
+      font-weight: bold;
+      font-size: 24px;
+      letter-spacing: 3px;
+    }
+  }
+
+  ul.errors {
+    max-width: 40vw;
+    margin: 0 auto;
+    list-style: none;
+    font-size: 14px;
+    text-align: left;
+
+    > li {
+      margin: 1.5em auto;
+      border-radius: 3px;
+      padding: 1em 0.5em;
+
+      &.msg-critical {
+        @include color-red();
+      }
+
+      &.msg-warning {
+        @include color-amber();
+        color: #555;
+      }
+
+      &.msg-ok {
+        @include color-teal();
+      }
+
+      > p.hint {
+        color: #555;
+        font-size: 12px;
+
+        i {
+          margin-right: .5em;
+        }
+      }
+    }
+  }
+
+  form {
+    width: 450px;
+    margin: 0 auto;
+    text-align: left;
+
+    fieldset {
+      margin-bottom: 2em;
+
+      legend {
+        width: 100%;
+        color: #fff;
+        font-size: 14px;
+        font-weight: bold;
+        text-align: center;
+        background-color: $color-bluegrey-fg;
+        margin: 1em 0;
+        letter-spacing: .2em;
+        padding: 0.2em 0;
+      }
+    }
+  }
+
+  div.buttons {
+    margin-top: 2em;
+    text-align: center;
+  }
+}
+
+.center {
+  text-align: center !important;
+}
+
+.right {
+  text-align: right !important;
+}
+
+.left {
+  text-align: left !important;
+}
+
+.opacity50 {
+  opacity: .5 !important;
+}
+
+.msg-option-unvailable {
+  @include color-amber();
+  border: none;
+  padding: .5em;
+  text-align: center;
+  margin: 1em 0;
+  font-size: 1.5em;
+}
+
+div.tag-list-box {
+  margin-bottom: 1em;
+
+  .tag-list-header {
+    text-align: left;
+    border-bottom: 1px solid #d9d9d9;
+    color: $color-bluegrey-fg;
+    font-size: 12px;
+    font-weight: bold;
+    margin-bottom: .5em;
+  }
+
+  .tag-list-body {
+    .tags-list-items {
+      display: inline-block;
+      padding: .5em;
+      width: 95%;
+      height: 3em;
+      border-bottom: 1px solid rgba(0, 0, 0, .12);
+      @include border-radius(3px);
+    }
+  }
+
+  i.select-icon {
+    margin-right: .5em;
+    color: $color-bluegrey-fg;
+    font-size: 18px;
+  }
+}
+
+div.tag-list-box, div.tags-box {
+  span.tag {
+    margin: 0 3px 3px 0;
+    padding: 3px;
+    background: $color-indigo-fg;
+    color: #fff;
+    border: none;
+    @include border-radius(3px);
+  }
+}
+
+@import "login";
+
+/* Default styles first then media queries */
+/*@media screen and (min-width: 400px)  {}*/
+/*@media screen and (min-width: 600px)  {}*/
+/*@media screen and (min-width: 1000px) {}*/
+/*@media screen and (min-width: 1400px) {}*/
+
+@media screen and (max-width: 1000px) {
+  #content {
+    #searchbox {
+      .search-filters {
+        & > * {
+          margin: .5em 1em .5em 0;
+        }
+      }
+    }
+  }
+  footer {
+    display: none;
+    justify-content: space-between;
+    flex-wrap: wrap;
+
+    .footer-parts {
+      justify-content: space-between;
+      flex-wrap: wrap;
+    }
+
+    #footer-left, #footer-right {
+      width: 100%;
+    }
+
+    .footer-parts > div {
+      width: 100%;
+      padding: .5em 0;
+    }
+  }
+}
+
+@media screen and (max-width: 600px) {
+  #content, #box-popup {
+    input {
+      width: 100%;
+    }
+
+    .mdl-textfield {
+      width: 100%;
+    }
+
+    td.descField {
+      display: none;
+    }
+
+    td.valField {
+      .lowres-title {
+        display: block;
+      }
+    }
+  }
+
+  #content {
+    #searchbox {
+      .mdl-textfield {
+        width: 90%;
+      }
+
+      .search-text {
+        width: 90%;
+      }
+
+      .search-filters {
+        .selectize-control {
+          width: 100%;
+        }
+      }
+    }
+
+    .data-header-minimal li.search-filter-spacer {
+      display: none;
+    }
+
+    .data-container, .tab-data {
+      width: 100%;
+
+      .selectize-control {
+        width: 100%;
+      }
+    }
+
+    .mdl-tabs__tab-bar {
+      flex-wrap: wrap;
+      height: auto;
+    }
+
+    .pager {
+      flex-direction: column-reverse;
+
+      > div {
+        text-align: center;
+        width: 100%;
+      }
+    }
+  }
+
+  #box-popup {
+    h2 > .btn-popup-close {
+      display: inline-block;
+    }
+  }
+
+  #actions {
+    ul.errors {
+      max-width: 90vw;
+    }
+  }
+
+  .mdl-data-table {
+    table-layout: fixed;
+    width: 100%;
+  }
+
+  .table-responsive {
+    td, th {
+      width: 100%;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      -o-text-overflow: ellipsis;
+    }
+
+    .cell-actions i {
+      display: block !important;
+    }
+  }
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/toastr.css b/app/modules/web/themes/material-dark/css/toastr.css
new file mode 100644
index 000000000..14c55a133
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/toastr.css
@@ -0,0 +1,33 @@
+#toast-container > div {
+  opacity: 1;
+  box-shadow: none;
+  filter: none; }
+
+#toast-container > div:hover {
+  box-shadow: none;
+  filter: none; }
+
+#toast-container.toast-top-center > div,
+#toast-container.toast-bottom-center > div {
+  width: 50%;
+  margin-left: auto;
+  margin-right: auto;
+  text-align: center; }
+
+.toast {
+  background-color: #030303; }
+
+.toast-success {
+  background-color: #26a69a; }
+
+.toast-error {
+  background-color: #ef5350; }
+
+.toast-info {
+  background-color: #2196f3; }
+
+.toast-warning {
+  background-color: #ffca28;
+  color: #555; }
+
+/*# sourceMappingURL=toastr.css.map */
diff --git a/app/modules/web/themes/material-dark/css/toastr.css.map b/app/modules/web/themes/material-dark/css/toastr.css.map
new file mode 100644
index 000000000..a01ec1826
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/toastr.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AAEA,sBAAuB;EACrB,OAAO,EAAE,CAAC;EACV,UAAU,EAAE,IAAI;EAChB,MAAM,EAAE,IAAI;;AAGd,4BAA6B;EAC3B,UAAU,EAAE,IAAI;EAChB,MAAM,EAAE,IAAI;;AAGd;0CAC2C;EACzC,KAAK,EAAE,GAAG;EACV,WAAW,EAAE,IAAI;EACjB,YAAY,EAAE,IAAI;EAClB,UAAU,EAAE,MAAM;;AAGpB,MAAO;EACL,gBAAgB,EAAE,OAAO;;AAE3B,cAAe;EACb,gBAAgB,ECtBF,OAAO;;ADwBvB,YAAa;EACX,gBAAgB,ECvBH,OAAO;;ADyBtB,WAAY;EACV,gBAAgB,ECjBF,OAAO;;ADmBvB,cAAe;EACb,gBAAgB,EC3BD,OAAO;ED4BtB,KAAK,ECpBM,IAAI",
+"sources": ["toastr.scss","_base.scss"],
+"names": [],
+"file": "toastr.css"
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/toastr.min.css b/app/modules/web/themes/material-dark/css/toastr.min.css
new file mode 100644
index 000000000..8933fb536
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/toastr.min.css
@@ -0,0 +1,39 @@
+#toast-container>div {
+    opacity: 1;
+    box-shadow: none;
+    filter: none
+}
+
+#toast-container>div:hover {
+    box-shadow: none;
+    filter: none
+}
+
+#toast-container.toast-top-center>div,
+#toast-container.toast-bottom-center>div {
+    width: 50%;
+    margin-left: auto;
+    margin-right: auto;
+    text-align: center
+}
+
+.toast {
+    background-color: #030303
+}
+
+.toast-success {
+    background-color: #26a69a
+}
+
+.toast-error {
+    background-color: #ef5350
+}
+
+.toast-info {
+    background-color: #2196f3
+}
+
+.toast-warning {
+    background-color: #ffca28;
+    color: #555
+}
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/css/toastr.scss b/app/modules/web/themes/material-dark/css/toastr.scss
new file mode 100644
index 000000000..2b9334ab4
--- /dev/null
+++ b/app/modules/web/themes/material-dark/css/toastr.scss
@@ -0,0 +1,37 @@
+@import "base";
+
+#toast-container > div {
+  opacity: 1;
+  box-shadow: none;
+  filter: none;
+}
+
+#toast-container > div:hover {
+  box-shadow: none;
+  filter: none;
+}
+
+#toast-container.toast-top-center > div,
+#toast-container.toast-bottom-center > div {
+  width: 50%;
+  margin-left: auto;
+  margin-right: auto;
+  text-align: center;
+}
+
+.toast {
+  background-color: #030303;
+}
+.toast-success {
+  background-color: $color-teal-fg;
+}
+.toast-error {
+  background-color: $color-red-fg;
+}
+.toast-info {
+  background-color: $color-blue-fg;
+}
+.toast-warning {
+  background-color: $color-amber-fg;
+  color: $color-grey;
+}
diff --git a/app/modules/web/themes/material-dark/inc/Icons.php b/app/modules/web/themes/material-dark/inc/Icons.php
new file mode 100644
index 000000000..a7ef8a1e7
--- /dev/null
+++ b/app/modules/web/themes/material-dark/inc/Icons.php
@@ -0,0 +1,73 @@
+<?php
+/**
+ * sysPass
+ *
+ * @author    nuxsmin
+ * @link      https://syspass.org
+ * @copyright 2012-2019, Rubén Domínguez nuxsmin@$syspass.org
+ *
+ * This file is part of sysPass.
+ *
+ * sysPass is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * sysPass is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ *  along with sysPass.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+defined('APP_ROOT') || die();
+
+use SP\Core\UI\ThemeIcons;
+use SP\Html\Assets\FontIcon;
+
+$themeIcons = new ThemeIcons();
+$themeIcons->addIcon('add', new FontIcon('add', 'mdl-color-text--indigo-A200', __u('Add')));
+$themeIcons->addIcon('view', new FontIcon('visibility', 'mdl-color-text--indigo-A200', __u('View Details')));
+$themeIcons->addIcon('viewPass', new FontIcon('lock_open', 'mdl-color-text--indigo-A200', __u('View password')));
+$themeIcons->addIcon('edit', new FontIcon('mode_edit', 'mdl-color-text--amber-A200', __u('Edit')));
+$themeIcons->addIcon('delete', new FontIcon('remove_circle', 'mdl-color-text--red-A200', __u('Delete')));
+$themeIcons->addIcon('editPass', new FontIcon('lock_outline', 'mdl-color-text--amber-A200', __u('Change Password')));
+$themeIcons->addIcon('appAdmin', new FontIcon('star', 'mdl-color-text--amber-A100', __u('Application Admin')));
+$themeIcons->addIcon('accAdmin', new FontIcon('star_half', 'mdl-color-text--amber-A100', __u('Accounts Admin')));
+$themeIcons->addIcon('ldapUser', new FontIcon('business', 'mdl-color-text--deep-purple-A100', __u('LDAP User')));
+$themeIcons->addIcon('disabled', new FontIcon('error', 'mdl-color-text--red-A100', __u('Disabled')));
+$themeIcons->addIcon('enabled', new FontIcon('check_circle', 'mdl-color-text--teal-500', __u('Enabled')));
+$themeIcons->addIcon('refresh', new FontIcon('refresh', 'mdl-color-text--teal-500', __u('Update')));
+$themeIcons->addIcon('copy', new FontIcon('content_copy', 'mdl-color-text--indigo-A200', __u('Copy')));
+$themeIcons->addIcon('clipboard', new FontIcon('content_paste', 'mdl-color-text--indigo-A200'));
+$themeIcons->addIcon('email', new FontIcon('email', 'mdl-color-text--indigo-A200', __u('Email')));
+$themeIcons->addIcon('optional', new FontIcon('settings'));
+$themeIcons->addIcon('publicLink', new FontIcon('link', 'mdl-color-text--teal-500'));
+$themeIcons->addIcon('back', new FontIcon('arrow_back', 'mdl-color-text--indigo-A200', __u('Back')));
+$themeIcons->addIcon('restore', new FontIcon('restore', 'mdl-color-text--teal-500', __u('Restore')));
+$themeIcons->addIcon('save', new FontIcon('save', 'mdl-color-text--teal-500', __u('Save')));
+$themeIcons->addIcon('help', new FontIcon('help_outline', 'mdl-color-text--primary', __u('Help')));
+$themeIcons->addIcon('clear', new FontIcon('clear_all', 'mdl-color--indigo-A200', __u('Clear')));
+$themeIcons->addIcon('play', new FontIcon('play_circle_filled', 'mdl-color-text--teal-500', __u('Perform')));
+$themeIcons->addIcon('download', new FontIcon('file_download', 'mdl-color-text--indigo-A200', __u('Download')));
+$themeIcons->addIcon('warning', new FontIcon('warning', 'mdl-color-text--amber-A100', __u('Warning')));
+$themeIcons->addIcon('check', new FontIcon('cached', 'mdl-color-text--indigo-A200', __u('Check')));
+$themeIcons->addIcon('search', new FontIcon('search', 'mdl-color-text--indigo-A200', __u('Search')));
+$themeIcons->addIcon('account', new FontIcon('account_box', 'mdl-color-text--indigo-A200'));
+$themeIcons->addIcon('group', new FontIcon('group_work', 'mdl-color-text--indigo-A200'));
+$themeIcons->addIcon('settings', new FontIcon('settings', 'mdl-color-text--indigo-A200', __u('Configuration')));
+$themeIcons->addIcon('headline', new FontIcon('view_headline', 'mdl-color-text--indigo-A200'));
+$themeIcons->addIcon('info', new FontIcon('info_outline', 'mdl-color-text--indigo-A200', __u('Information')));
+$themeIcons->addIcon('critical', new FontIcon('error_outline', 'mdl-color-text--red-A200', __u('Critical')));
+$themeIcons->addIcon('notices', new FontIcon('notifications', 'mdl-color-text--indigo-A200', __u('Notifications')));
+$themeIcons->addIcon('remove', new FontIcon('remove', 'mdl-color-text--indigo-A200', __u('Delete')));
+$themeIcons->addIcon('previous', new FontIcon('chevron_left', null, __u('Previous page')));
+$themeIcons->addIcon('next', new FontIcon('chevron_right', null, __u('Next page')));
+$themeIcons->addIcon('first', new FontIcon('first_page', null, __u('First page')));
+$themeIcons->addIcon('last', new FontIcon('last_page', null, __u('Last page')));
+$themeIcons->addIcon('up', new FontIcon('arrow_drop_up'));
+$themeIcons->addIcon('down', new FontIcon('arrow_drop_down'));
+
+return $themeIcons;
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/index.php b/app/modules/web/themes/material-dark/index.php
new file mode 100644
index 000000000..5f8813256
--- /dev/null
+++ b/app/modules/web/themes/material-dark/index.php
@@ -0,0 +1,30 @@
+<?php
+/**
+ *
+ * @author    ThigSchuch
+ * @link      https://t.me/ThigSchuch
+ *
+ */
+
+return [
+    'name' => 'Material Dark',
+    'creator' => 'ThigSchuch',
+    'version' => '3.0',
+    'targetversion' => '3.0.0',
+    'js' => [
+        'bootstrap-material-datetimepicker.min.js',
+        'material.min.js',
+        'mdl-jquery-modal-dialog.min.js',
+        'app-theme.min.js'
+    ],
+    'css' => [
+        'fonts.min.css',
+        'material.min.css',
+        'material-custom.min.css',
+        'mdl-datetimepicker.min.css',
+        'mdl-jquery-modal-dialog.min.css',
+        'selectize-custom.min.css',
+        'toastr.min.css',
+        'styles.min.css'
+    ]
+];
diff --git a/app/modules/web/themes/material-dark/js/LICENSE b/app/modules/web/themes/material-dark/js/LICENSE
new file mode 100644
index 000000000..9faf10865
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/LICENSE
@@ -0,0 +1,212 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright 2015 Google Inc
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
+
+   All code in any directories or sub-directories that end with *.html or
+   *.css is licensed under the Creative Commons Attribution International
+   4.0 License, which full text can be found here:
+   https://creativecommons.org/licenses/by/4.0/legalcode.
+
+   As an exception to this license, all html or css that is generated by
+   the software at the direction of the user is copyright the user. The
+   user has full ownership and control over such content, including
+   whether and how they wish to license it.
diff --git a/app/modules/web/themes/material-dark/js/app-theme.js b/app/modules/web/themes/material-dark/js/app-theme.js
new file mode 100644
index 000000000..c64cb20eb
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/app-theme.js
@@ -0,0 +1,538 @@
+/*
+ * sysPass
+ *
+ * @author nuxsmin
+ * @link http://syspass.org
+ * @copyright 2012-2017, Rubén Domínguez nuxsmin@$syspass.org
+ *
+ * This file is part of sysPass.
+ *
+ * sysPass is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * sysPass is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ *  along with sysPass.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+sysPass.Theme = function (log) {
+    "use strict";
+
+    const updateEvent = $.Event("theme:update");
+
+    /**
+     * Funciones a realizar en peticiones AJAX
+     *
+     * @type {{complete: ajax.complete}}
+     */
+    const ajax = {
+        complete: function () {
+            log.info("ajax:complete");
+
+            update();
+        }
+    };
+
+    /**
+     * Mostrar/Ocultar el spinner de carga
+     *
+     * @type {{show: loading.show, hide: loading.hide}}
+     */
+    const loading = {
+        elems: {
+            $wrap: $("#wrap-loading"),
+            $loading: $("#loading")
+        },
+        show: function (full) {
+            if (full !== undefined && full === true) {
+                loading.elems.$wrap.addClass("overlay-full");
+            }
+
+            loading.elems.$wrap.show();
+            loading.elems.$loading.addClass("is-active");
+        },
+        hide: function () {
+            loading.elems.$wrap.removeClass("overlay-full").hide();
+            loading.elems.$loading.removeClass("is-active");
+        },
+        upgradeFull: function () {
+            loading.elems.$wrap.addClass("overlay-full");
+        }
+    };
+
+    // Función para generar claves aleatorias.
+    const randomPassword = function ($target) {
+        sysPassApp.util.password.random(function (password, level) {
+            $target.attr("data-pass", password);
+
+            // if ($target) {
+            const $dstParent = $target.parent();
+            const $targetR = $("#" + $target.attr("id") + "_repeat");
+
+            sysPassApp.util.password.output(level, $target);
+
+            // Actualizar los componentes de MDL
+            const mdl = new MaterialTextfield();
+
+            // Poner la clave en los input y actualizar MDL
+            $dstParent.find("input:password").val(password);
+            $dstParent
+                .addClass(mdl.CssClasses_.IS_DIRTY)
+                .removeClass(mdl.CssClasses_.IS_INVALID);
+
+            // Poner la clave en el input de repetición y encriptarla
+            if ($targetR.length > 0) {
+                $targetR.val(password).parent()
+                    .addClass(mdl.CssClasses_.IS_DIRTY)
+                    .removeClass(mdl.CssClasses_.IS_INVALID);
+                sysPassApp.encryptFormValue($targetR);
+            }
+        });
+    };
+
+    // Diálogo de configuración de complejidad de clave
+    const complexityDialog = function () {
+
+        const content =
+            `<div id="box-complexity">
+                <div>
+                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="checkbox-chars">
+                        <input type="checkbox" id="checkbox-chars" class="mdl-checkbox__input" name="checkbox-chars" checked/>
+                        <span class="mdl-checkbox__label">${sysPassApp.config.LANG[63]}</span>
+                    </label>
+                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="checkbox-numbers">
+                        <input type="checkbox" id="checkbox-numbers" class="mdl-checkbox__input" name="checkbox-numbers" checked/>
+                        <span class="mdl-checkbox__label">${sysPassApp.config.LANG[35]}</span>
+                    </label>
+                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="checkbox-uppercase">
+                        <input type="checkbox" id="checkbox-uppercase" class="mdl-checkbox__input" name="checkbox-uppercase"/>
+                        <span class="mdl-checkbox__label">${sysPassApp.config.LANG[36]}</span>
+                    </label>
+                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="checkbox-symbols">
+                        <input type="checkbox" id="checkbox-symbols" class="mdl-checkbox__input" name="checkbox-symbols"/>
+                        <span class="mdl-checkbox__label">${sysPassApp.config.LANG[37]}</span>
+                    </label>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input class="mdl-textfield__input" type="number" pattern="[0-9]{1,3}" id="passlength" 
+                        name="passlength" value="${sysPassApp.util.password.config.complexity.numlength}"
+                        min="1" max="117"/>
+                        <label class="mdl-textfield__label" for="passlength">${sysPassApp.config.LANG[38]}</label>
+                    </div>
+                </div>
+            </div>
+            <datalist id="defaultLength"><option value="8"><option value="12"><option value="16"><option value="32"><option value="64"></datalist>`;
+
+        mdlDialog().show({
+            title: sysPassApp.config.LANG[29],
+            text: content,
+            negative: {
+                title: sysPassApp.config.LANG[44]
+            },
+            positive: {
+                title: sysPassApp.config.LANG[43],
+                onClick: function (e) {
+                    e.preventDefault();
+
+                    sysPassApp.util.password.config.complexity.chars = $("#checkbox-chars").is(":checked");
+                    sysPassApp.util.password.config.complexity.numbers = $("#checkbox-numbers").is(":checked");
+                    sysPassApp.util.password.config.complexity.uppercase = $("#checkbox-uppercase").is(":checked");
+                    sysPassApp.util.password.config.complexity.symbols = $("#checkbox-symbols").is(":checked");
+                    sysPassApp.util.password.config.complexity.numlength = parseInt($("#passlength").val());
+                }
+            },
+            cancelable: true,
+            contentStyle: {"max-width": "300px"},
+            onLoaded: function () {
+                $("#checkbox-chars").prop("checked", sysPassApp.util.password.config.complexity.chars);
+                $("#checkbox-numbers").prop("checked", sysPassApp.util.password.config.complexity.numbers);
+                $("#checkbox-uppercase").prop("checked", sysPassApp.util.password.config.complexity.uppercase);
+                $("#checkbox-symbols").prop("checked", sysPassApp.util.password.config.complexity.symbols);
+            }
+        });
+    };
+
+    /**
+     * Detectar los campos de clave y añadir funciones
+     */
+    const passwordDetect = function ($container) {
+        // Crear los iconos de acciones sobre claves
+        $container.find(".passwordfield__input").each(function () {
+            const $this = $(this);
+
+            if ($this.attr("data-pass-upgraded") === "true") {
+                return;
+            }
+
+            const uniqueId = sysPassApp.util.uniqueId();
+            const $thisParent = $this.parent();
+            const $form = $this.closest("form");
+            const targetId = $this.attr("id") + "-" + uniqueId;
+
+            const $passwordRepeat = $form.find("#" + $this.attr("id") + "_repeat");
+            $passwordRepeat.attr("id", targetId + "_repeat");
+
+            $this.attr("id", targetId);
+            $this.attr("data-pass", $this.val());
+
+            let btnMenu =
+                `<button id="menu-password-${targetId}" class="mdl-button mdl-js-button mdl-button--icon" type="button" title="${sysPassApp.config.LANG[27]}"><i class="material-icons">more_vert</i></button>
+                <ul class="mdl-menu mdl-js-menu" for="menu-password-${targetId}">
+                <li class="mdl-menu__item passGen"><i class="material-icons">settings</i>${sysPassApp.config.LANG[28]}</li>
+                <li class="mdl-menu__item passComplexity"><i class="material-icons">vpn_key</i>${sysPassApp.config.LANG[29]}</li>
+                <li class="mdl-menu__item reset"><i class="material-icons">refresh</i>${sysPassApp.config.LANG[30]}</li></ul>`;
+
+            $thisParent.after(`<div class="password-actions" />`);
+
+            $thisParent.next(".password-actions")
+                .prepend(`<i id='password-level-${targetId}' class="showpass material-icons clip-pass-field password-level" data-clipboard-target='${targetId}' data-level-msg= '' title="${sysPassApp.config.LANG[32]}">remove_red_eye</i>`)
+                .prepend(btnMenu);
+
+            $this.on("keyup", function () {
+                sysPassApp.util.password.checkLevel($this);
+
+                this.dataset.pass = $this.val();
+            });
+
+            const $passwordActions = $this.parent().next();
+
+            // Crear evento para generar clave aleatoria
+            $passwordActions
+                .find(".passGen")
+                .on("click", function () {
+                    randomPassword($this);
+
+                    $this.blur();
+                });
+
+            $passwordActions
+                .find(".passComplexity")
+                .on("click", function () {
+                    complexityDialog();
+                });
+
+            // Crear evento para mostrar clave generada/introducida
+            $passwordActions
+                .find(".showpass")
+                .on("mouseover", function () {
+                    if (this.dataset.levelMsg !== "") {
+                        $(this).attr("title", this.dataset.levelMsg + "\n\n" + $this[0].dataset.pass);
+                    } else {
+                        $(this).attr("title", $this[0].dataset.pass);
+                    }
+                });
+
+            // Reset de los campos de clave
+            $passwordActions
+                .find(".reset")
+                .on("click", function () {
+                    $this.val("");
+                    $this[0].dataset.pass = "";
+
+                    if ($passwordRepeat.length > 0) {
+                        $passwordRepeat.val("");
+                    }
+
+                    // Actualizar objetos de MDL
+                    componentHandler.upgradeDom();
+                });
+
+            $this.attr("data-pass-upgraded", "true");
+
+            // Actualizar objetos de MDL
+            componentHandler.upgradeDom();
+        });
+
+        // Crear los iconos de acciones sobre claves (sólo mostrar clave)
+        $container.find(".passwordfield__input-show").each(function () {
+            const $this = $(this);
+            const $icon = $("<i class=\"showpass material-icons\" title=\"" + sysPassApp.config.LANG[32] + "\">remove_red_eye</i>");
+
+            if ($this.data("clipboard") === 1) {
+                const $clip = $("<i class=\"clip-pass-icon material-icons\" title=\"" + sysPassApp.config.LANG[34] + "\" data-clipboard-target=\"#" + $this.attr("id") + "\">content_paste</i>");
+                $this.parent().after($clip).after($icon);
+            } else {
+                $this.parent().after($icon);
+            }
+
+            // Crear evento para mostrar clave generada/introducida
+            $icon.on("mouseover", function () {
+                $icon.attr("title", $this[0].dataset.pass);
+            });
+        });
+    };
+
+    /**
+     * Inicializar el selector de fecha
+     * @param $container
+     */
+    const setupDatePicker = function ($container) {
+        log.info("setupDatePicker");
+
+        const datePickerOpts = {
+            format: "YYYY-MM-DD",
+            lang: sysPassApp.config.BROWSER.LOCALE.substr(0, 2),
+            time: false,
+            cancelText: sysPassApp.config.LANG[44],
+            okText: sysPassApp.config.LANG[43],
+            clearText: sysPassApp.config.LANG[30],
+            nowText: sysPassApp.config.LANG[56],
+            minDate: new Date(),
+            triggerEvent: "dateIconClick"
+        };
+
+        const getUnixtime = function (val) {
+            return moment.tz(val, sysPassApp.config.BROWSER.TIMEZONE).format("X");
+        };
+
+        $container.find(".password-datefield__input").each(function () {
+            const $this = $(this);
+            const $parent = $this.parent();
+
+            $this.bootstrapMaterialDatePicker(datePickerOpts);
+
+            // Search for an input to set the unix timestamp from a localized date
+            const $dstUnix = $parent.find("input[name=" + $this.data('dst-unix') + "]");
+
+            if ($this.val() > 0) {
+                $dstUnix.val(getUnixtime($this.val()));
+            }
+
+            // Evento de click para el icono de calendario
+            $parent.next("i").on("click", function () {
+                $this.trigger("dateIconClick");
+            });
+
+            // Actualizar el campo oculto cuando cambie la fecha
+            $this.on("change", function () {
+                $dstUnix.val(getUnixtime($this.val()));
+            });
+        });
+    };
+
+    /**
+     * Triggers que se ejecutan en determinadas vistas
+     */
+    const viewsTriggers = {
+        main: function () {
+            const layout = document.querySelector(".mdl-layout");
+            const $drawer = $(".mdl-layout__drawer");
+
+            $drawer.find("a").click(function () {
+                layout.MaterialLayout.toggleDrawer();
+            });
+        },
+        search: function () {
+            const $frmSearch = $("#frmSearch");
+            const $resContent = $("#res-content");
+
+            $frmSearch.find("button.btn-clear").on("click", function (e) {
+                $(".icon-searchfav").find("i").removeClass("mdl-color-text--amber-A200");
+            });
+
+            $frmSearch.find(".icon-searchfav").on("click", function () {
+                const $icon = $(this).find("i");
+                const $searchfav = $frmSearch.find("input[name='searchfav']");
+
+                if ($searchfav.val() == 0) {
+                    $icon.addClass("mdl-color-text--amber-A200");
+                    $icon.attr("title", sysPassApp.config.LANG[53]);
+
+                    $searchfav.val(1);
+                } else {
+                    $icon.removeClass("mdl-color-text--amber-A200");
+                    $icon.attr("title", sysPassApp.config.LANG[52]);
+
+                    $searchfav.val(0);
+                }
+
+                $frmSearch.submit();
+            });
+
+            const checkFavorite = function ($obj) {
+                if ($obj.data("status") === "on") {
+                    $obj.addClass("mdl-color-text--amber-A100");
+                    $obj.attr("title", sysPassApp.config.LANG[50]);
+                    $obj.html("star");
+                } else {
+                    $obj.removeClass("mdl-color-text--amber-A100");
+                    $obj.attr("title", sysPassApp.config.LANG[49]);
+                    $obj.html("star_border");
+                }
+            };
+
+            const $tagsSelect = $frmSearch.find("#tags")[0];
+            const $tagsBar = $frmSearch.find(".search-filters-tags");
+            const $showFilter = $frmSearch.find("i.show-filter");
+
+            $resContent.on("click", "#data-search-header .sort-down,#data-search-header .sort-up", function () {
+                const $this = $(this);
+                $this.parent().find("a").addClass("filterOn");
+
+                sysPassApp.actions.account.sort($this);
+            }).on("click", "#search-rows i.icon-favorite", function () {
+                const $this = $(this);
+
+                sysPassApp.actions.account.saveFavorite($this, function () {
+                    checkFavorite($this);
+                });
+            }).on("click", "#search-rows span.tag", function () {
+                if ($tagsBar.is(":hidden")) {
+                    $showFilter.trigger("click");
+                }
+
+                $tagsSelect.selectize.addItem($(this).data("tag-id"), false);
+            });
+
+            $showFilter.on("click", function () {
+                const $this = $(this);
+
+                if ($tagsBar.is(":hidden")) {
+                    $tagsBar.slideDown("slow");
+                    $this.html($this.data("icon-up"));
+                } else {
+                    $tagsBar.slideUp("slow");
+                    $this.html($this.data("icon-down"));
+                }
+            });
+
+            if ($tagsSelect.selectedIndex !== -1
+                || $showFilter.data('show') === 1
+            ) {
+                $showFilter.trigger("click");
+            }
+        },
+        common: function ($container) {
+            passwordDetect($container);
+            setupDatePicker($container);
+        }
+    };
+
+    /**
+     * Función para crear el menu estático al hacer scroll
+     */
+    var setFixedMenu = function () {
+        // Stick the #nav to the top of the window
+        var $actionBar = $("#actions-bar");
+
+        if ($actionBar.length > 0) {
+            var $actionBarLogo = $actionBar.find("#actions-bar-logo");
+            var isFixed = false;
+
+            var scroll = {
+                on: function () {
+                    $actionBar.css({
+                        backgroundColor: "rgba(255, 255, 255, .75)",
+                        borderBottom: "1px solid #ccc"
+                    });
+                    $actionBarLogo.show();
+                    isFixed = true;
+                },
+                off: function () {
+                    $actionBar.css({
+                        backgroundColor: "transparent",
+                        borderBottom: "none"
+                    });
+                    $actionBarLogo.hide();
+                    isFixed = false;
+                }
+            };
+
+
+            $(window).on("scroll", function () {
+                var scrollTop = $(this).scrollTop();
+                var shouldBeFixed = scrollTop > $actionBar.height();
+
+                if (shouldBeFixed && !isFixed) {
+                    scroll.on();
+                } else if (!shouldBeFixed && isFixed) {
+                    scroll.off();
+                }
+            }).on("resize", function () {
+                // Detectar si al cargar la barra de iconos no está en la posición 0
+                if ($actionBar.offset().top > 0) {
+                    scroll.on();
+                }
+            });
+
+            // Detectar si al cargar la barra de iconos no está en la posición 0
+            if ($actionBar.offset().top > 0) {
+                scroll.on();
+            }
+        }
+    };
+
+    /**
+     * Elementos HTML del tema
+     */
+    const html = {
+        getList: function (items, icon) {
+            const $ul = $("<ul class=\"ldap-list-item mdl-list\"></ul>");
+            const $li = $("<li class=\"mdl-list__item\"></li>");
+            const $span = $("<span class=\"mdl-list__item-primary-content\"></span>");
+
+            const i = "<i class=\"material-icons mdl-list__item-icon\">" + (icon === undefined || icon === "" ? "description" : icon) + "</i>";
+
+            items.forEach(function (value) {
+                const $spanClone = $span.clone();
+                $spanClone.append(i);
+                $spanClone.append(value);
+
+                const $item = $li.clone().append($spanClone);
+                $ul.append($item);
+            });
+
+            return $ul;
+        },
+        tabs: {
+            add: function (header, index, title, isActive) {
+                const $header = $(header);
+                let active;
+
+                if (isActive === 1) {
+                    $header.parent().find("#tabs-" + index).addClass("is-active");
+                    active = "is-active";
+                }
+
+                const tab = "<a href=\"#tabs-" + index + "\" class=\"mdl-tabs__tab " + active + "\">" + title + "</a>";
+
+                $header.append(tab);
+            }
+        }
+    };
+
+    /**
+     * Triggers an update of the theme components
+     */
+    const update = function () {
+        log.info("theme:update");
+
+        // Actualizar componentes de MDL cargados con AJAX
+        componentHandler.upgradeDom();
+
+        $("body").trigger(updateEvent);
+    };
+
+    /**
+     * Initialization
+     */
+    const init = function () {
+    };
+
+    init();
+
+    return {
+        passwordDetect: passwordDetect,
+        password: randomPassword,
+        update: update,
+        viewsTriggers: viewsTriggers,
+        loading: loading,
+        ajax: ajax,
+        html: html
+    };
+};
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/js/app-theme.map b/app/modules/web/themes/material-dark/js/app-theme.map
new file mode 100644
index 000000000..f5d132dfe
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/app-theme.map
@@ -0,0 +1,8 @@
+{
+"version":3,
+"file":"app-theme.min.js",
+"lineCount":20,
+"mappings":"AAyBA,IAAI,QAAU,CAGN,MAAQ,EAHF,CCQN,aAAe,QAAQ,CAAC,CAAD,CAAQ,CAAR,CAAkB,CAAlB,CAA2B,CACpD,CAAJ,WAAqB,OAArB,GACE,CADF,CACsC,MAAA,CAAO,CAAP,CADtC,CAIA,KADA,IAAI,EAAM,CAAA,OAAV,CACS,EAAI,CAAb,CAAgB,CAAhB,CAAoB,CAApB,CAAyB,CAAA,EAAzB,CAA8B,CAC5B,IAAI,EAAQ,CAAA,CAAM,CAAN,CACZ,IAAI,CAAA,KAAA,CAAc,CAAd,CAAuB,CAAvB,CAA8B,CAA9B,CAAiC,CAAjC,CAAJ,CAA6C,MAAO,CAAC,EAAG,CAAJ,CAAO,EAAG,CAAV,CAFxB,CAI9B,MAAO,CAAC,EAAI,EAAL,CAAQ,EAAG,IAAK,EAAhB,CATiD,CDR5C,CEWd,QAAA,eAAA,CACsC,UAAlC,EAAA,MAAO,OAAA,iBAAP,CACA,MAAA,eADA,CAEA,QAAQ,CAAC,CAAD,CAAS,CAAT,CAAmB,CAAnB,CAA+B,CAErC,GAAI,CAAA,IAAJ,EAAsB,CAAA,IAAtB,CACE,KAAM,KAAI,SAAJ,CAAc,2CAAd,CAAN,CAEE,CAAJ,EAAc,KAAA,UAAd,EAAiC,CAAjC,EAA2C,MAAA,UAA3C,GACA,CAAA,CAAO,CAAP,CADA,CACmB,CAAA,MADnB,CALqC,CCV3C;OAAA,UAAA,CAAoB,QAAQ,CAAC,CAAD,CAAc,CACxC,MAAyB,WAAlB,EAAC,MAAO,OAAR,EAAiC,MAAjC,GAA4C,CAA5C,CACH,CADG,CAEe,WAAlB,EAAC,MAAO,OAAR,EAA2C,IAA3C,EAAiC,MAAjC,CAAmD,MAAnD,CAA4D,CAHxB,CAc1C,QAAA,OAAA,CAAiB,OAAA,UAAA,CAAkB,IAAlB,CCdjB,QAAA,SAAA,CAAmB,QAAQ,CAAC,CAAD,CAAS,CAAT,CAAmB,CAAnB,CAA6B,CAA7B,CAAqC,CAC9D,GAAK,CAAL,CAAA,CACI,CAAA,CAAM,OAAA,OACN,EAAA,CAAQ,CAAA,MAAA,CAAa,GAAb,CACZ,KAAS,CAAT,CAAa,CAAb,CAAgB,CAAhB,CAAoB,CAAA,OAApB,CAAmC,CAAnC,CAAsC,CAAA,EAAtC,CAA2C,CACzC,IAAI,EAAM,CAAA,CAAM,CAAN,CACJ,EAAN,GAAa,EAAb,GAAmB,CAAA,CAAI,CAAJ,CAAnB,CAA8B,EAA9B,CACA,EAAA,CAAM,CAAA,CAAI,CAAJ,CAHmC,CAKvC,CAAA,CAAW,CAAA,CAAM,CAAA,OAAN,CAAqB,CAArB,CACX,EAAA,CAAO,CAAA,CAAI,CAAJ,CACP,EAAA,CAAO,CAAA,CAAS,CAAT,CACP,EAAJ,EAAY,CAAZ,EAA4B,IAA5B,EAAoB,CAApB,EACA,OAAA,eAAA,CACI,CADJ,CACS,CADT,CACmB,CAAC,aAAc,CAAA,CAAf,CAAqB,SAAU,CAAA,CAA/B,CAAqC,MAAO,CAA5C,CADnB,CAZA,CAD8D,CCVhE;OAAA,SAAA,CAAiB,sBAAjB,CAAyC,QAAQ,CAAC,CAAD,CAAO,CACtD,MAAI,EAAJ,CAAiB,CAAjB,CAYe,QAAQ,CAAC,CAAD,CAAW,CAAX,CAAwB,CAC7C,MAAO,QAAA,aAAA,CAAqB,IAArB,CAA2B,CAA3B,CAAqC,CAArC,CAAA,EADsC,CAbO,CAAxD,CAkBG,UAlBH,CAkBe,KAlBf,CCIAA;OAAAC,MAAA,CAAgBC,QAAS,CAACC,CAAD,CAAS,CAG9B,IAAIC,EAAMD,CAAAC,IAAV,CAqBIC,EAAU,CACVC,MAAO,CACHC,MAAOC,CAAA,CAAE,eAAF,CADJ,CAEHC,SAAUD,CAAA,CAAE,UAAF,CAFP,CADG,CAKVE,KAAMA,QAAS,CAACC,CAAD,CAAO,CACLC,IAAAA,EAAb,GAAID,CAAJ,EAAmC,CAAA,CAAnC,GAA0BA,CAA1B,EACIN,CAAAC,MAAAC,MAAAM,SAAA,CAA6B,cAA7B,CAGJR,EAAAC,MAAAC,MAAAG,KAAA,EACAL,EAAAC,MAAAG,SAAAI,SAAA,CAAgC,WAAhC,CANkB,CALZ,CAaVC,KAAMA,QAAS,EAAG,CACdT,CAAAC,MAAAC,MAAAQ,YAAA,CAAgC,cAAhC,CAAAD,KAAA,EACAT,EAAAC,MAAAG,SAAAM,YAAA,CAAmC,WAAnC,CAFc,CAbR,CAiBVC,YAAaA,QAAS,EAAG,CACrBX,CAAAC,MAAAC,MAAAM,SAAA,CAA6B,cAA7B,CADqB,CAjBf,CArBd,CA4CII,EAAWA,QAAS,CAACC,CAAD,CAAU,CAC9B,IAAIC,EAAI,CAAR,CACIC,EAAQ,EADZ,CAEIC,EAAc,EAMdlB,EAAAmB,aAAAC,WAAAC,QAAJ,GACIJ,CADJ,EACa,wDADb,CAIIjB;CAAAmB,aAAAC,WAAAE,QAAJ,GACIL,CADJ,EACa,YADb,CAIIjB,EAAAmB,aAAAC,WAAAH,MAAJ,GACIA,CAEA,EAFS,4BAET,CAAIjB,CAAAmB,aAAAC,WAAAG,UAAJ,GACIN,CADJ,EACa,4BADb,CAHJ,CAQA,KAAA,CAAOD,CAAA,EAAP,EAAchB,CAAAmB,aAAAC,WAAAI,UAAd,CAAA,CACIN,CAAA,EApBOD,CAAAQ,OAAA,CAAaC,IAAAC,MAAA,CAAYD,IAAAE,OAAA,EAAZ,EAoBYX,CAAAY,OApBZ,CAoB2B,CApB3B,EAoBSC,CApBT,CAAb,CAuBXzB,EAAA,CAAE,WAAF,CAAA0B,KAAA,CAAoB,OAApB,CAA6Bb,CAA7B,CAEA,KAAIc,EAAQC,MAAA,CAAOf,CAAP,CACZlB,EAAAmB,aAAAe,WAAA,CAAiChB,CAAAW,OAE7Bd,EAAJ,EACQoB,CAmBJ,CAnBiBpB,CAAAqB,OAAA,EAmBjB,CAlBIC,CAkBJ,CAlBehC,CAAA,CAAE,GAAF,CAAQU,CAAAgB,KAAA,CAAa,IAAb,CAAR,CAA6B,GAA7B,CAkBf,CAhBA/B,CAAAsC,aAAA,CAAoBN,CAApB,CAA2BjB,CAA3B,CAgBA,CAbIwB,CAaJ,CAbU,IAAIC,iBAad,CAVAL,CAAAM,KAAA,CAAgB,gBAAhB,CAAAC,IAAA,CAAsCxB,CAAtC,CAUA,CATAiB,CAAAzB,SAAA,CAAoB6B,CAAAI,YAAAC,SAApB,CAAAhC,YAAA,CAA0D2B,CAAAI,YAAAE,WAA1D,CASA;AANsB,CAMtB,CANIR,CAAAR,OAMJ,GALIQ,CAAAK,IAAA,CAAaxB,CAAb,CAAAkB,OAAA,EAAA1B,SAAA,CAA4C6B,CAAAI,YAAAC,SAA5C,CAAAhC,YAAA,CAAkF2B,CAAAI,YAAAE,WAAlF,CACA,CAAA7C,CAAA8C,iBAAA,CAAwBT,CAAxB,CAIJ,EAAAF,CAAAM,KAAA,CAAgB,YAAhB,CAAAlC,KAAA,CAAmC,GAAnC,CApBJ,GAsBIP,CAAAsC,aAAA,CAAoBN,CAApB,CAEA,CADA3B,CAAA,CAAE,gCAAF,CAAAqC,IAAA,CAAwCxB,CAAxC,CACA,CAAAb,CAAA,CAAE,YAAF,CAAAE,KAAA,CAAqB,GAArB,CAxBJ,CAlC8B,CA5ClC,CA2GIwC,EAAmBA,QAAS,EAAG,CAE/B,IAAIC,EACA,8PADAA;AAIyChD,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAJzCF,CAQA,qPARAA,CAQyChD,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CARzCF,CAYA,mPAZAA;AAYyChD,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAZzCF,CAgBA,6OAhBAA,CAgByChD,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAhBzCF,CAoBA,4NApBAA,CAoB8DhD,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CApB9DF;AAqBA,4BAEJG,UAAA,EAAA5C,KAAA,CAAiB,CACb6C,MAAOpD,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CADM,CAEbG,KAAML,CAFO,CAGbM,SAAU,CACNF,MAAOpD,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CADD,CAHG,CAMbK,SAAU,CACNH,MAAOpD,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CADD,CAENM,QAASA,QAAS,CAACC,CAAD,CAAI,CAClBA,CAAAC,eAAA,EAEA1D,EAAAmB,aAAAC,WAAAH,MAAA,CAAuCZ,CAAA,CAAE,iBAAF,CAAAsD,GAAA,CAAwB,UAAxB,CACvC3D,EAAAmB,aAAAC,WAAAE,QAAA,CAAyCjB,CAAA,CAAE,mBAAF,CAAAsD,GAAA,CAA0B,UAA1B,CACzC3D,EAAAmB,aAAAC,WAAAG,UAAA,CAA2ClB,CAAA,CAAE,qBAAF,CAAAsD,GAAA,CAA4B,UAA5B,CAC3C3D,EAAAmB,aAAAC,WAAAC,QAAA,CAAyChB,CAAA,CAAE,mBAAF,CAAAsD,GAAA,CAA0B,UAA1B,CACzC3D,EAAAmB,aAAAC,WAAAI,UAAA;AAA2CoC,QAAA,CAASvD,CAAA,CAAE,aAAF,CAAAqC,IAAA,EAAT,CAPzB,CAFhB,CANG,CAkBbmB,WAAY,CAAA,CAlBC,CAmBbC,aAAc,CAAC,YAAa,OAAd,CAnBD,CAoBbC,SAAUA,QAAS,EAAG,CAClB1D,CAAA,CAAE,iBAAF,CAAA2D,KAAA,CAA0B,SAA1B,CAAqChE,CAAAmB,aAAAC,WAAAH,MAArC,CACAZ,EAAA,CAAE,mBAAF,CAAA2D,KAAA,CAA4B,SAA5B,CAAuChE,CAAAmB,aAAAC,WAAAE,QAAvC,CACAjB,EAAA,CAAE,qBAAF,CAAA2D,KAAA,CAA8B,SAA9B,CAAyChE,CAAAmB,aAAAC,WAAAG,UAAzC,CACAlB,EAAA,CAAE,mBAAF,CAAA2D,KAAA,CAA4B,SAA5B,CAAuChE,CAAAmB,aAAAC,WAAAC,QAAvC,CACAhB,EAAA,CAAE,aAAF,CAAAqC,IAAA,CAAqB1C,CAAAmB,aAAAC,WAAAI,UAArB,CALkB,CApBT,CAAjB,CAzB+B,CA3GnC,CAqKIyC,EAAiBA,QAAS,CAACC,CAAD,CAAa,CAEvCA,CAAAzB,KAAA,CAAgB,uBAAhB,CAAA0B,KAAA,CAA8C,QAAS,EAAG,CACtD,IAAIC;AAAQ/D,CAAA,CAAE,IAAF,CAEZ,IAAyC,MAAzC,GAAI+D,CAAArC,KAAA,CAAW,oBAAX,CAAJ,CAAA,CAIA,IAAIsC,EAAcD,CAAAhC,OAAA,EAAlB,CACIkC,EAAWF,CAAArC,KAAA,CAAW,IAAX,CADf,CAGIwC,EAAU,yBAAVA,CAAuCD,CAAvCC,CAAkD,2EAAlDA,CAAsIvE,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAAtIqB,CAAiK,oDAHrK,CAMAA,EADAA,CACAA,EADW,mDACXA,CADoED,CACpEC,CAD+E,IAC/EA,GAAW,2EAAXA,CAA6FvE,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAA7FqB,CAAwH,OAAxHA,CANA,CAOAA,EAAAA,CAAAA,EAAW,iFAAXA;AAAmGvE,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAAnGqB,CAA8H,OAA9HA,CAPA,CAQAA,EAAAA,CAAAA,EAAW,wEAAXA,CAA0FvE,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAA1FqB,CAAqH,OAArHA,CAEAF,EAAAG,MAAA,CAAkB,kCAAlB,CAEAH,EAAAI,KAAA,CAAiB,mBAAjB,CAAAC,QAAA,CACa,mCADb,CACoDJ,CADpD,CAC+D,qBAD/D,CACyFtE,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CADzF,CACoH,WADpH,CAAAwB,QAAA,CAEa,4CAFb,CAE+D1E,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAF/D,CAE0F,sBAF1F,CAAAwB,QAAA,CAGaH,CAHb,CAKAH,EAAAO,GAAA,CAAS,OAAT,CAAkB,QAAS,EAAG,CAC1B3E,CAAA4E,eAAA,CAAsBR,CAAtB,CAD0B,CAA9B,CAIIS,EAAAA,CAAmBT,CAAAhC,OAAA,EAAAqC,KAAA,EAGvBI,EAAApC,KAAA,CAAsB,UAAtB,CAAAkC,GAAA,CAAqC,OAArC;AAA8C,QAAS,EAAG,CACtD7D,CAAA,CAASsD,CAAT,CACAA,EAAAU,MAAA,EAFsD,CAA1D,CAKAD,EAAApC,KAAA,CAAsB,iBAAtB,CAAAkC,GAAA,CAA4C,OAA5C,CAAqD,QAAS,EAAG,CAC7D5B,CAAA,EAD6D,CAAjE,CAKA8B,EAAApC,KAAA,CAAsB,WAAtB,CAAAkC,GAAA,CAAsC,WAAtC,CAAmD,QAAS,EAAG,CAC3DtE,CAAA,CAAE,IAAF,CAAA0B,KAAA,CAAa,OAAb,CAAsBqC,CAAA1B,IAAA,EAAtB,CAD2D,CAA/D,CAKAmC,EAAApC,KAAA,CAAsB,QAAtB,CAAAkC,GAAA,CAAmC,OAAnC,CAA4C,QAAS,EAAG,CACpDP,CAAA1B,IAAA,CAAU,EAAV,CAEA,KAAIqC,EAAa1E,CAAA,CAAE,GAAF,CAAQiE,CAAR,CAAmB,GAAnB,CAEO,EAAxB,CAAIS,CAAAlD,OAAJ,EACIkD,CAAArC,IAAA,CAAe,EAAf,CAIJsC,iBAAAC,WAAA,EAVoD,CAAxD,CAaAb,EAAArC,KAAA,CAAW,oBAAX,CAAiC,MAAjC,CAxDA,CAHsD,CAA1D,CA+DAmC,EAAAzB,KAAA,CAAgB,4BAAhB,CAAA0B,KAAA,CAAmD,QAAS,EAAG,CAC3D,IAAIC,EAAQ/D,CAAA,CAAE,IAAF,CAAZ,CACI6E,EAAQ7E,CAAA,CAAE,4CAAF,CAAoDL,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAApD,CAA+E,sBAA/E,CAEZ,IAAgC,CAAhC,GAAIkB,CAAAe,KAAA,CAAW,WAAX,CAAJ,CAAmC,CAC/B,IAAIC;AAAQ/E,CAAA,CAAE,kDAAF,CAA0DL,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAA1D,CAAqF,4BAArF,CAAsHkB,CAAArC,KAAA,CAAW,IAAX,CAAtH,CAAyI,qBAAzI,CACZqC,EAAAhC,OAAA,EAAAoC,MAAA,CAAqBY,CAArB,CAAAZ,MAAA,CAAkCU,CAAlC,CAF+B,CAAnC,IAIId,EAAAhC,OAAA,EAAAoC,MAAA,CAAqBU,CAArB,CAIJA,EAAAP,GAAA,CAAS,WAAT,CAAsB,QAAS,EAAG,CAC9BO,CAAAnD,KAAA,CAAW,OAAX,CAAoBqC,CAAA1B,IAAA,EAApB,CAD8B,CAAlC,CAZ2D,CAA/D,CAjEuC,CArK3C,CA4PI2C,EAAkBA,QAAS,CAACnB,CAAD,CAAa,CACxCjE,CAAAqF,KAAA,CAAS,iBAAT,CAEA,KAAIC,EAAiB,CACjBC,OAAQ,YADS,CAEjBC,KAAMzF,CAAAiD,OAAA,EAAAyC,OAAAC,OAAA,CAA8B,CAA9B,CAAiC,CAAjC,CAFW,CAGjBC,KAAM,CAAA,CAHW,CAIjBC,WAAY7F,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAJK,CAKjB4C,OAAQ9F,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CALS,CAMjB6C,UAAW/F,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CANM,CAOjB8C,QAAShG,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAPQ,CAQjB+C,QAAS,IAAIC,IARI,CASjBC,aAAc,eATG,CA6BrBjC;CAAAzB,KAAA,CAAgB,4BAAhB,CAAA0B,KAAA,CAAmD,QAAS,EAAG,CAC3D,IAAIC,EAAQ/D,CAAA,CAAE,IAAF,CAEZ+D,EAAAgC,4BAAA,CAAkCb,CAAlC,CAEAnB,EAAAhC,OAAA,EAAAiE,OAAA,CAAsB,6DAAtB,CArBOC,MAAAC,GAAA,CAqB2FnC,CAAA1B,IAAAA,EArB3F,CAAe1C,CAAAiD,OAAA,EAAAuD,SAAf,CAAAhB,OAAA,CAAgD,GAAhD,CAqBP,CAAiH,MAAjH,CAGApB,EAAAhC,OAAA,EAAAqC,KAAA,CAAoB,GAApB,CAAAE,GAAA,CAA4B,OAA5B,CAAqC,QAAS,EAAG,CAC7CP,CAAAqC,QAAA,CAAc,eAAd,CAD6C,CAAjD,CAKArC,EAAAO,GAAA,CAAS,QAAT,CAAmB,QAAS,EAAG,CAxB/B,IAAI+B,CAKAA,EAAA,CAVGJ,MAAAC,GAAA,CA8BanC,CApBO1B,IAAAA,EAVpB,CAAe1C,CAAAiD,OAAA,EAAAuD,SAAf,CAAAhB,OAAA,CAAgD,GAAhD,CA8BapB,EAjBpBhC,OAAA,EAAAK,KAAA,CAAmB,uCAAnB,CAAAC,IAAA,CAAgEgE,CAAhE,CAgB+B,CAA/B,CAb2D,CAA/D,CAhCwC,CAyP5C,OAAO,CACHzC,eAAgBA,CADb,CAEHnD,SAAUA,CAFP,CAGH6F,cAtMgBA,CAChBC,KAAMA,QAAS,EAAG,CACd,IAAIC;AAASC,QAAAC,cAAA,CAAuB,aAAvB,CACC1G,EAAA2G,CAAE,qBAAFA,CAEdvE,KAAA,CAAa,GAAb,CAAAwE,MAAA,CAAwB,QAAS,EAAG,CAChCJ,CAAAK,eAAAC,aAAA,EADgC,CAApC,CAJc,CADFR,CAShBS,OAAQA,QAAS,EAAG,CAChB,IAAIC,EAAahH,CAAA,CAAE,YAAF,CAAjB,CACIiH,EAAcjH,CAAA,CAAE,cAAF,CAElBgH,EAAA5E,KAAA,CAAgB,kBAAhB,CAAAkC,GAAA,CAAuC,OAAvC,CAAgD,QAAS,CAAClB,CAAD,CAAI,CACzDpD,CAAA,CAAE,iBAAF,CAAAoC,KAAA,CAA0B,GAA1B,CAAA7B,YAAA,CAA2C,4BAA3C,CADyD,CAA7D,CAIAyG,EAAA5E,KAAA,CAAgB,iBAAhB,CAAAkC,GAAA,CAAsC,OAAtC,CAA+C,QAAS,EAAG,CACvD,IAAIO,EAAQ7E,CAAA,CAAE,IAAF,CAAAoC,KAAA,CAAa,GAAb,CAAZ,CACI8E,EAAaF,CAAA5E,KAAA,CAAgB,yBAAhB,CAEO,EAAxB,EAAI8E,CAAA7E,IAAA,EAAJ,EACIwC,CAAAxE,SAAA,CAAe,4BAAf,CAGA,CAFAwE,CAAAnD,KAAA,CAAW,OAAX,CAAoB/B,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAApB,CAEA;AAAAqE,CAAA7E,IAAA,CAAe,CAAf,CAJJ,GAMIwC,CAAAtE,YAAA,CAAkB,4BAAlB,CAGA,CAFAsE,CAAAnD,KAAA,CAAW,OAAX,CAAoB/B,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAApB,CAEA,CAAAqE,CAAA7E,IAAA,CAAe,CAAf,CATJ,CAYA2E,EAAAG,OAAA,EAhBuD,CAA3D,CA+BA,KAAIC,EAAcJ,CAAA5E,KAAA,CAAgB,OAAhB,CAAA,CAAyB,CAAzB,CAAlB,CACIiF,EAAWL,CAAA5E,KAAA,CAAgB,sBAAhB,CADf,CAEIkF,EAAcN,CAAA5E,KAAA,CAAgB,eAAhB,CAElB6E,EAAA3C,GAAA,CAAe,OAAf,CAAwB,6DAAxB,CAAuF,QAAS,EAAG,CAC/F,IAAIP,EAAQ/D,CAAA,CAAE,IAAF,CACZ+D,EAAAhC,OAAA,EAAAK,KAAA,CAAoB,GAApB,CAAA/B,SAAA,CAAkC,UAAlC,CAEAV,EAAA4H,WAAA,EAAAC,QAAAC,KAAA,CAAiC1D,CAAjC,CAJ+F,CAAnG,CAAAO,GAAA,CAKM,OALN,CAKe,8BALf,CAK+C,QAAS,EAAG,CACvD,IAAIP,EAAQ/D,CAAA,CAAE,IAAF,CAEZL,EAAA4H,WAAA,EAAAC,QAAAE,aAAA,CAAyC3D,CAAzC,CAAgD,QAAS,EAAG,CAvBhC,IAA5B,GAwBkBA,CAxBde,KAAA,CAAU,QAAV,CAAJ;CAwBkBf,CAvBd1D,SAAA,CAAc,4BAAd,CAEA,CAqBc0D,CAtBdrC,KAAA,CAAU,OAAV,CAAmB/B,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAAnB,CACA,CAqBckB,CArBd4D,KAAA,CAAU,MAAV,CAHJ,GAwBkB5D,CAnBdxD,YAAA,CAAiB,4BAAjB,CAEA,CAiBcwD,CAlBdrC,KAAA,CAAU,OAAV,CAAmB/B,CAAAiD,OAAA,EAAAC,KAAA,CAAqB,EAArB,CAAnB,CACA,CAiBckB,CAjBd4D,KAAA,CAAU,aAAV,CAPJ,CAuB4D,CAA5D,CAHuD,CAL3D,CAAArD,GAAA,CAWM,OAXN,CAWe,uBAXf,CAWwC,QAAS,EAAG,CAC5C+C,CAAA/D,GAAA,CAAY,SAAZ,CAAJ,EACIgE,CAAAlB,QAAA,CAAoB,OAApB,CAGJgB,EAAAQ,UAAAC,QAAA,CAA8B7H,CAAA,CAAE,IAAF,CAAA8E,KAAA,CAAa,QAAb,CAA9B,CALgD,CAXpD,CAmBAwC,EAAAhD,GAAA,CAAe,OAAf,CAAwB,QAAS,EAAG,CAChC,IAAIP,EAAQ/D,CAAA,CAAE,IAAF,CAERqH,EAAA/D,GAAA,CAAY,SAAZ,CAAJ,EACI+D,CAAAS,UAAA,CAAmB,MAAnB,CACA,CAAA/D,CAAA4D,KAAA,CAAW5D,CAAAe,KAAA,CAAW,SAAX,CAAX,CAFJ,GAIIuC,CAAAU,QAAA,CAAiB,MAAjB,CACA,CAAAhE,CAAA4D,KAAA,CAAW5D,CAAAe,KAAA,CAAW,WAAX,CAAX,CALJ,CAHgC,CAApC,CAYgC,EAAhC,CAAIsC,CAAAY,cAAJ;AACIV,CAAAlB,QAAA,CAAoB,OAApB,CA3EY,CATJE,CAuFhB2B,OAAQA,QAAS,CAACpE,CAAD,CAAa,CAC1BD,CAAA,CAAeC,CAAf,CACAmB,EAAA,CAAgBnB,CAAhB,CAF0B,CAvFdyC,CAmMb,CAIHzG,QAASA,CAJN,CAKHqI,KAnfOA,CACPC,SAAUA,QAAS,EAAG,CAClBvI,CAAAqF,KAAA,CAAS,eAAT,CAGAN,iBAAAC,WAAA,EAJkB,CADfsD,CA8eJ,CAMHP,KAjDOA,CACPS,QAASA,QAAS,CAACC,CAAD,CAAQ,CACtB,IAAIC,EAAMtI,CAAA,CAAE,2CAAF,CAAV,CACIuI,EAAMvI,CAAA,CAAE,kCAAF,CADV,CAEIwI,EAAQxI,CAAA,CAAE,sDAAF,CAGZqI,EAAAI,QAAA,CAAc,QAAS,CAACC,CAAD,CAAQ,CAC3B,IAAIC,EAAaH,CAAAI,MAAA,EACjBD,EAAA3C,OAAA,CAJO6C,0DAIP,CACAF,EAAA3C,OAAA,CAAkB0C,CAAlB,CAEII,EAAAA,CAAQP,CAAAK,MAAA,EAAA5C,OAAA,CAAmB2C,CAAnB,CACZL,EAAAtC,OAAA,CAAW8C,CAAX,CAN2B,CAA/B,CASA,OAAOR,EAfe,CADnBX,CAkBPoB,KAAM,CACFC,IAAKA,QAAS,CAACC,CAAD;AAASC,CAAT,CAAgBnG,CAAhB,CAAuBoG,CAAvB,CAAiC,CACvCC,CAAAA,CAAUpJ,CAAA,CAAEiJ,CAAF,CACd,KAAII,EAAS,EAEI,EAAjB,GAAIF,CAAJ,GACIC,CAAArH,OAAA,EAAAK,KAAA,CAAsB,QAAtB,CAAiC8G,CAAjC,CAAA7I,SAAA,CAAiD,WAAjD,CACA,CAAAgJ,CAAA,CAAS,WAFb,CAOAD,EAAApD,OAAA,CAFU,iBAEV,CAF+BkD,CAE/B,CAFuC,yBAEvC,CAFqEG,CAErE,CAF8E,IAE9E,CAFsFtG,CAEtF,CAF8F,MAE9F,CAX2C,CAD7C,CAlBC4E,CA2CJ,CAxfuB;",
+"sources":[" [synthetic:base] "," [synthetic:util/findinternal] "," [synthetic:util/defineproperty] "," [synthetic:util/global] "," [synthetic:util/polyfill] "," [synthetic:es6/array/find] ","app-theme.js"],
+"names":["sysPass","Theme","sysPass.Theme","Common","log","loading","elems","$wrap","$","$loading","show","full","undefined","addClass","hide","removeClass","upgradeFull","password","$target","i","chars","genPassword","passwordData","complexity","symbols","numbers","uppercase","numlength","charAt","Math","floor","random","length","min","attr","level","zxcvbn","passLength","$dstParent","parent","$targetR","outputResult","mdl","MaterialTextfield","find","val","CssClasses_","IS_DIRTY","IS_INVALID","encryptFormValue","complexityDialog","content","config","LANG","mdlDialog","title","text","negative","positive","onClick","e","preventDefault","is","parseInt","cancelable","contentStyle","onLoaded","prop","passwordDetect","$container","each","$this","$thisParent","targetId","btnMenu","after","next","prepend","on","checkPassLevel","$passwordActions","focus","$targetIdR","componentHandler","upgradeDom","$icon","data","$clip","setupDatePicker","info","datePickerOpts","format","lang","LOCALE","substr","time","cancelText","okText","clearText","nowText","minDate","Date","triggerEvent","bootstrapMaterialDatePicker","append","moment","tz","TIMEZONE","trigger","unixtime","viewsTriggers","main","layout","document","querySelector","$drawer","click","MaterialLayout","toggleDrawer","search","$frmSearch","$resContent","$searchfav","submit","$tagsSelect","$tagsBar","$showFilter","appActions","account","sort","savefavorite","html","selectize","addItem","slideDown","slideUp","selectedIndex","common","ajax","complete","getList","items","$ul","$li","$span","forEach","value","$spanClone","clone","icon","$item","tabs","add","header","index","isActive","$header","active"]
+}
diff --git a/app/modules/web/themes/material-dark/js/app-theme.min.js b/app/modules/web/themes/material-dark/js/app-theme.min.js
new file mode 100644
index 000000000..d7ac91786
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/app-theme.min.js
@@ -0,0 +1,21 @@
+var $jscomp=$jscomp||{};$jscomp.scope={};$jscomp.findInternal=function(a,e,b){a instanceof String&&(a=String(a));for(var f=a.length,g=0;g<f;g++){var k=a[g];if(e.call(b,k,g,a))return{i:g,v:k}}return{i:-1,v:void 0}};$jscomp.ASSUME_ES5=!1;$jscomp.ASSUME_NO_NATIVE_MAP=!1;$jscomp.ASSUME_NO_NATIVE_SET=!1;$jscomp.defineProperty=$jscomp.ASSUME_ES5||"function"==typeof Object.defineProperties?Object.defineProperty:function(a,e,b){a!=Array.prototype&&a!=Object.prototype&&(a[e]=b.value)};
+$jscomp.getGlobal=function(a){return"undefined"!=typeof window&&window===a?a:"undefined"!=typeof global&&null!=global?global:a};$jscomp.global=$jscomp.getGlobal(this);$jscomp.polyfill=function(a,e,b,f){if(e){b=$jscomp.global;a=a.split(".");for(f=0;f<a.length-1;f++){var g=a[f];g in b||(b[g]={});b=b[g]}a=a[a.length-1];f=b[a];e=e(f);e!=f&&null!=e&&$jscomp.defineProperty(b,a,{configurable:!0,writable:!0,value:e})}};
+$jscomp.polyfill("Array.prototype.find",function(a){return a?a:function(a,b){return $jscomp.findInternal(this,a,b).v}},"es6","es3");
+sysPass.Theme=function(a){var e=$.Event("theme:update"),b={elems:{$wrap:$("#wrap-loading"),$loading:$("#loading")},show:function(d){void 0!==d&&!0===d&&b.elems.$wrap.addClass("overlay-full");b.elems.$wrap.show();b.elems.$loading.addClass("is-active")},hide:function(){b.elems.$wrap.removeClass("overlay-full").hide();b.elems.$loading.removeClass("is-active")},upgradeFull:function(){b.elems.$wrap.addClass("overlay-full")}},f=function(d){sysPassApp.util.password.random(function(c,h){d.attr("data-pass",
+c);var a=d.parent(),b=$("#"+d.attr("id")+"_repeat");sysPassApp.util.password.output(h,d);h=new MaterialTextfield;a.find("input:password").val(c);a.addClass(h.CssClasses_.IS_DIRTY).removeClass(h.CssClasses_.IS_INVALID);0<b.length&&(b.val(c).parent().addClass(h.CssClasses_.IS_DIRTY).removeClass(h.CssClasses_.IS_INVALID),sysPassApp.encryptFormValue(b))})},g=function(){var a='<div id="box-complexity">\n                <div>\n                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="checkbox-chars">\n                        <input type="checkbox" id="checkbox-chars" class="mdl-checkbox__input" name="checkbox-chars" checked/>\n                        <span class="mdl-checkbox__label">'+
+sysPassApp.config.LANG[63]+'</span>\n                    </label>\n                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="checkbox-numbers">\n                        <input type="checkbox" id="checkbox-numbers" class="mdl-checkbox__input" name="checkbox-numbers" checked/>\n                        <span class="mdl-checkbox__label">'+sysPassApp.config.LANG[35]+'</span>\n                    </label>\n                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="checkbox-uppercase">\n                        <input type="checkbox" id="checkbox-uppercase" class="mdl-checkbox__input" name="checkbox-uppercase"/>\n                        <span class="mdl-checkbox__label">'+
+sysPassApp.config.LANG[36]+'</span>\n                    </label>\n                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="checkbox-symbols">\n                        <input type="checkbox" id="checkbox-symbols" class="mdl-checkbox__input" name="checkbox-symbols"/>\n                        <span class="mdl-checkbox__label">'+sysPassApp.config.LANG[37]+'</span>\n                    </label>\n                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">\n                        <input class="mdl-textfield__input" type="number" pattern="[0-9]{1,3}" id="passlength" \n                        name="passlength" value="'+
+sysPassApp.util.password.config.complexity.numlength+'"\n                        min="1" max="117"/>\n                        <label class="mdl-textfield__label" for="passlength">'+sysPassApp.config.LANG[38]+'</label>\n                    </div>\n                </div>\n            </div>\n            <datalist id="defaultLength"><option value="8"><option value="12"><option value="16"><option value="32"><option value="64"></datalist>';mdlDialog().show({title:sysPassApp.config.LANG[29],text:a,negative:{title:sysPassApp.config.LANG[44]},
+positive:{title:sysPassApp.config.LANG[43],onClick:function(c){c.preventDefault();sysPassApp.util.password.config.complexity.chars=$("#checkbox-chars").is(":checked");sysPassApp.util.password.config.complexity.numbers=$("#checkbox-numbers").is(":checked");sysPassApp.util.password.config.complexity.uppercase=$("#checkbox-uppercase").is(":checked");sysPassApp.util.password.config.complexity.symbols=$("#checkbox-symbols").is(":checked");sysPassApp.util.password.config.complexity.numlength=parseInt($("#passlength").val())}},
+cancelable:!0,contentStyle:{"max-width":"300px"},onLoaded:function(){$("#checkbox-chars").prop("checked",sysPassApp.util.password.config.complexity.chars);$("#checkbox-numbers").prop("checked",sysPassApp.util.password.config.complexity.numbers);$("#checkbox-uppercase").prop("checked",sysPassApp.util.password.config.complexity.uppercase);$("#checkbox-symbols").prop("checked",sysPassApp.util.password.config.complexity.symbols)}})},k=function(a){a.find(".passwordfield__input").each(function(){var c=
+$(this);if("true"!==c.attr("data-pass-upgraded")){var a=sysPassApp.util.uniqueId(),d=c.parent(),b=c.closest("form");a=c.attr("id")+"-"+a;var l=b.find("#"+c.attr("id")+"_repeat");l.attr("id",a+"_repeat");c.attr("id",a);c.attr("data-pass",c.val());b='<button id="menu-password-'+a+'" class="mdl-button mdl-js-button mdl-button--icon" type="button" title="'+sysPassApp.config.LANG[27]+'"><i class="material-icons">more_vert</i></button>\n                <ul class="mdl-menu mdl-js-menu" for="menu-password-'+
+a+'">\n                <li class="mdl-menu__item passGen"><i class="material-icons">settings</i>'+sysPassApp.config.LANG[28]+'</li>\n                <li class="mdl-menu__item passComplexity"><i class="material-icons">vpn_key</i>'+sysPassApp.config.LANG[29]+'</li>\n                <li class="mdl-menu__item reset"><i class="material-icons">refresh</i>'+sysPassApp.config.LANG[30]+"</li></ul>";d.after('<div class="password-actions" />');d.next(".password-actions").prepend("<i id='password-level-"+a+"' class=\"showpass material-icons clip-pass-field password-level\" data-clipboard-target='"+
+a+"' data-level-msg= '' title=\""+sysPassApp.config.LANG[32]+'">remove_red_eye</i>').prepend(b);c.on("keyup",function(){sysPassApp.util.password.checkLevel(c);this.dataset.pass=c.val()});d=c.parent().next();d.find(".passGen").on("click",function(){f(c);c.blur()});d.find(".passComplexity").on("click",function(){g()});d.find(".showpass").on("mouseover",function(){""!==this.dataset.levelMsg?$(this).attr("title",this.dataset.levelMsg+"\n\n"+c[0].dataset.pass):$(this).attr("title",c[0].dataset.pass)});
+d.find(".reset").on("click",function(){c.val("");c[0].dataset.pass="";0<l.length&&l.val("");componentHandler.upgradeDom()});c.attr("data-pass-upgraded","true");componentHandler.upgradeDom()}});a.find(".passwordfield__input-show").each(function(){var a=$(this),d=$('<i class="showpass material-icons" title="'+sysPassApp.config.LANG[32]+'">remove_red_eye</i>');if(1===a.data("clipboard")){var b=$('<i class="clip-pass-icon material-icons" title="'+sysPassApp.config.LANG[34]+'" data-clipboard-target="#'+
+a.attr("id")+'">content_paste</i>');a.parent().after(b).after(d)}else a.parent().after(d);d.on("mouseover",function(){d.attr("title",a[0].dataset.pass)})})},n=function(d){a.info("setupDatePicker");var c={format:"YYYY-MM-DD",lang:sysPassApp.config.BROWSER.LOCALE.substr(0,2),time:!1,cancelText:sysPassApp.config.LANG[44],okText:sysPassApp.config.LANG[43],clearText:sysPassApp.config.LANG[30],nowText:sysPassApp.config.LANG[56],minDate:new Date,triggerEvent:"dateIconClick"};d.find(".password-datefield__input").each(function(){var a=
+$(this),d=a.parent();a.bootstrapMaterialDatePicker(c);var b=d.find("input[name="+a.data("dst-unix")+"]");0<a.val()&&b.val(moment.tz(a.val(),sysPassApp.config.BROWSER.TIMEZONE).format("X"));d.next("i").on("click",function(){a.trigger("dateIconClick")});a.on("change",function(){b.val(moment.tz(a.val(),sysPassApp.config.BROWSER.TIMEZONE).format("X"))})})},m=function(){a.info("theme:update");componentHandler.upgradeDom();$("body").trigger(e)};return{passwordDetect:k,password:f,update:m,viewsTriggers:{main:function(){var a=
+document.querySelector(".mdl-layout");$(".mdl-layout__drawer").find("a").click(function(){a.MaterialLayout.toggleDrawer()})},search:function(){var a=$("#frmSearch"),c=$("#res-content");a.find("button.btn-clear").on("click",function(a){$(".icon-searchfav").find("i").removeClass("mdl-color-text--amber-A200")});a.find(".icon-searchfav").on("click",function(){var b=$(this).find("i"),c=a.find("input[name='searchfav']");0==c.val()?(b.addClass("mdl-color-text--amber-A200"),b.attr("title",sysPassApp.config.LANG[53]),
+c.val(1)):(b.removeClass("mdl-color-text--amber-A200"),b.attr("title",sysPassApp.config.LANG[52]),c.val(0));a.submit()});var b=a.find("#tags")[0],e=a.find(".search-filters-tags"),f=a.find("i.show-filter");c.on("click","#data-search-header .sort-down,#data-search-header .sort-up",function(){var a=$(this);a.parent().find("a").addClass("filterOn");sysPassApp.actions.account.sort(a)}).on("click","#search-rows i.icon-favorite",function(){var a=$(this);sysPassApp.actions.account.saveFavorite(a,function(){"on"===
+a.data("status")?(a.addClass("mdl-color-text--amber-A100"),a.attr("title",sysPassApp.config.LANG[50]),a.html("star")):(a.removeClass("mdl-color-text--amber-A100"),a.attr("title",sysPassApp.config.LANG[49]),a.html("star_border"))})}).on("click","#search-rows span.tag",function(){e.is(":hidden")&&f.trigger("click");b.selectize.addItem($(this).data("tag-id"),!1)});f.on("click",function(){var a=$(this);e.is(":hidden")?(e.slideDown("slow"),a.html(a.data("icon-up"))):(e.slideUp("slow"),a.html(a.data("icon-down")))});
+-1===b.selectedIndex&&1!==f.data("show")||f.trigger("click")},common:function(a){k(a);n(a)}},loading:b,ajax:{complete:function(){a.info("ajax:complete");m()}},html:{getList:function(a,b){var c=$('<ul class="ldap-list-item mdl-list"></ul>'),d=$('<li class="mdl-list__item"></li>'),e=$('<span class="mdl-list__item-primary-content"></span>'),f='<i class="material-icons mdl-list__item-icon">'+(void 0===b||""===b?"description":b)+"</i>";a.forEach(function(a){var b=e.clone();b.append(f);b.append(a);a=d.clone().append(b);
+c.append(a)});return c},tabs:{add:function(a,b,e,f){a=$(a);if(1===f){a.parent().find("#tabs-"+b).addClass("is-active");var c="is-active"}a.append('<a href="#tabs-'+b+'" class="mdl-tabs__tab '+c+'">'+e+"</a>")}}}}};
diff --git a/app/modules/web/themes/material-dark/js/bootstrap-material-datetimepicker.js b/app/modules/web/themes/material-dark/js/bootstrap-material-datetimepicker.js
new file mode 100644
index 000000000..904f059e9
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/bootstrap-material-datetimepicker.js
@@ -0,0 +1,1106 @@
+
+(function ($, moment) {
+    var pluginName = "bootstrapMaterialDatePicker";
+    var pluginDataName = "plugin_" + pluginName;
+
+    moment.locale('en');
+
+    function Plugin(element, options) {
+        this.currentView = 0;
+
+        this.minDate;
+        this.maxDate;
+
+        this._attachedEvents = [];
+
+        this.element = element;
+        this.$element = $(element);
+
+        this.params = {
+            date: true,
+            time: true,
+            format: 'YYYY-MM-DD',
+            minDate: null,
+            maxDate: null,
+            currentDate: null,
+            lang: 'en',
+            weekStart: 0,
+            shortTime: false,
+            clearButton: false,
+            nowButton: false,
+            cancelText: 'Cancel',
+            okText: 'OK',
+            clearText: 'Clear',
+            nowText: 'Now',
+            switchOnClick: false,
+            triggerEvent: 'focus'
+        };
+        this.params = $.fn.extend(this.params, options);
+
+        this.name = "dtp_" + this.setName();
+        this.$element.attr("data-dtp", this.name);
+
+        moment.locale(this.params.lang);
+
+        this.init();
+    }
+
+    $.fn[pluginName] = function (options, p) {
+        this.each(function () {
+            if (!$.data(this, pluginDataName)) {
+                $.data(this, pluginDataName, new Plugin(this, options));
+            } else {
+                if (typeof ($.data(this, pluginDataName)[options]) === 'function') {
+                    $.data(this, pluginDataName)[options](p);
+                }
+                if (options === 'destroy') {
+                    $.removeData(this);
+                }
+            }
+        });
+        return this;
+    };
+
+    Plugin.prototype =
+    {
+        init: function () {
+            this.initDays();
+            this.initDates();
+
+            this.initTemplate();
+
+            this.initButtons();
+
+            this._attachEvent($(window), 'resize', this._centerBox.bind(this));
+            this._attachEvent(this.$dtpElement.find('.dtp-content'), 'click', this._onElementClick.bind(this));
+            this._attachEvent(this.$dtpElement, 'click', this._onBackgroundClick.bind(this));
+            this._attachEvent(this.$dtpElement.find('.dtp-close > a'), 'click', this._onCloseClick.bind(this));
+            this._attachEvent(this.$element, this.params.triggerEvent, this._fireCalendar.bind(this));
+        },
+        initDays: function () {
+            this.days = [];
+            for (var i = this.params.weekStart; this.days.length < 7; i++) {
+                if (i > 6) {
+                    i = 0;
+                }
+                this.days.push(i.toString());
+            }
+        },
+        initDates: function () {
+            if (this.$element.val().length > 0) {
+                if (typeof (this.params.format) !== 'undefined' && this.params.format !== null) {
+                    this.currentDate = moment(this.$element.val(), this.params.format).locale(this.params.lang);
+                } else {
+                    this.currentDate = moment(this.$element.val()).locale(this.params.lang);
+                }
+            } else {
+                if (typeof (this.$element.attr('value')) !== 'undefined' && this.$element.attr('value') !== null && this.$element.attr('value') !== "") {
+                    if (typeof (this.$element.attr('value')) === 'string') {
+                        if (typeof (this.params.format) !== 'undefined' && this.params.format !== null) {
+                            this.currentDate = moment(this.$element.attr('value'), this.params.format).locale(this.params.lang);
+                        } else {
+                            this.currentDate = moment(this.$element.attr('value')).locale(this.params.lang);
+                        }
+                    }
+                } else {
+                    if (typeof (this.params.currentDate) !== 'undefined' && this.params.currentDate !== null) {
+                        if (typeof (this.params.currentDate) === 'string') {
+                            if (typeof (this.params.format) !== 'undefined' && this.params.format !== null) {
+                                this.currentDate = moment(this.params.currentDate, this.params.format).locale(this.params.lang);
+                            } else {
+                                this.currentDate = moment(this.params.currentDate).locale(this.params.lang);
+                            }
+                        } else {
+                            if (typeof (this.params.currentDate.isValid) === 'undefined' || typeof (this.params.currentDate.isValid) !== 'function') {
+                                var x = this.params.currentDate.getTime();
+                                this.currentDate = moment(x, "x").locale(this.params.lang);
+                            } else {
+                                this.currentDate = this.params.currentDate;
+                            }
+                        }
+                        this.$element.val(this.currentDate.format(this.params.format));
+                    } else
+                        this.currentDate = moment();
+                }
+            }
+
+            if (typeof (this.params.minDate) !== 'undefined' && this.params.minDate !== null) {
+                if (typeof (this.params.minDate) === 'string') {
+                    if (typeof (this.params.format) !== 'undefined' && this.params.format !== null) {
+                        this.minDate = moment(this.params.minDate, this.params.format).locale(this.params.lang);
+                    } else {
+                        this.minDate = moment(this.params.minDate).locale(this.params.lang);
+                    }
+                } else {
+                    if (typeof (this.params.minDate.isValid) === 'undefined' || typeof (this.params.minDate.isValid) !== 'function') {
+                        var x = this.params.minDate.getTime();
+                        this.minDate = moment(x, "x").locale(this.params.lang);
+                    } else {
+                        this.minDate = this.params.minDate;
+                    }
+                }
+            } else if (this.params.minDate === null) {
+                this.minDate = null;
+            }
+
+            if (typeof (this.params.maxDate) !== 'undefined' && this.params.maxDate !== null) {
+                if (typeof (this.params.maxDate) === 'string') {
+                    if (typeof (this.params.format) !== 'undefined' && this.params.format !== null) {
+                        this.maxDate = moment(this.params.maxDate, this.params.format).locale(this.params.lang);
+                    } else {
+                        this.maxDate = moment(this.params.maxDate).locale(this.params.lang);
+                    }
+                } else {
+                    if (typeof (this.params.maxDate.isValid) === 'undefined' || typeof (this.params.maxDate.isValid) !== 'function') {
+                        var x = this.params.maxDate.getTime();
+                        this.maxDate = moment(x, "x").locale(this.params.lang);
+                    } else {
+                        this.maxDate = this.params.maxDate;
+                    }
+                }
+            } else if (this.params.maxDate === null) {
+                this.maxDate = null;
+            }
+
+            if (!this.isAfterMinDate(this.currentDate)) {
+                this.currentDate = moment(this.minDate);
+            }
+            if (!this.isBeforeMaxDate(this.currentDate)) {
+                this.currentDate = moment(this.maxDate);
+            }
+        },
+        initTemplate: function () {
+            this.template = '<div class="dtp hidden" id="' + this.name + '">' +
+                '<div class="dtp-content">' +
+                '<div class="dtp-date-view">' +
+                '<header class="dtp-header">' +
+                '<div class="dtp-actual-day">Lundi</div>' +
+                '<div class="dtp-close"><a href="javascript:void(0);"><i class="material-icons">clear</i></a></div>' +
+                '</header>' +
+                '<div class="dtp-date hidden">' +
+                '<div>' +
+                '<div class="left center p10">' +
+                '<a href="javascript:void(0);" class="dtp-select-month-before"><i class="material-icons">chevron_left</i></a>' +
+                '</div>' +
+                '<div class="dtp-actual-month p80">MAR</div>' +
+                '<div class="right center p10">' +
+                '<a href="javascript:void(0);" class="dtp-select-month-after"><i class="material-icons">chevron_right</i></a>' +
+                '</div>' +
+                '<div class="clearfix"></div>' +
+                '</div>' +
+                '<div class="dtp-actual-num">13</div>' +
+                '<div>' +
+                '<div class="left center p10">' +
+                '<a href="javascript:void(0);" class="dtp-select-year-before"><i class="material-icons">chevron_left</i></a>' +
+                '</div>' +
+                '<div class="dtp-actual-year p80">2014</div>' +
+                '<div class="right center p10">' +
+                '<a href="javascript:void(0);" class="dtp-select-year-after"><i class="material-icons">chevron_right</i></a>' +
+                '</div>' +
+                '<div class="clearfix"></div>' +
+                '</div>' +
+                '</div>' +
+                '<div class="dtp-time hidden">' +
+                '<div class="dtp-actual-maxtime">23:55</div>' +
+                '</div>' +
+                '<div class="dtp-picker">' +
+                '<div class="dtp-picker-calendar"></div>' +
+                '<div class="dtp-picker-datetime hidden">' +
+                '<div class="dtp-actual-meridien">' +
+                '<div class="left p20">' +
+                '<a class="dtp-meridien-am" href="javascript:void(0);">AM</a>' +
+                '</div>' +
+                '<div class="dtp-actual-time p60"></div>' +
+                '<div class="right p20">' +
+                '<a class="dtp-meridien-pm" href="javascript:void(0);">PM</a>' +
+                '</div>' +
+                '<div class="clearfix"></div>' +
+                '</div>' +
+                '<div id="dtp-svg-clock">' +
+                '</div>' +
+                '</div>' +
+                '</div>' +
+                '</div>' +
+                '<div class="dtp-buttons">' +
+                '<button class="dtp-btn-now btn btn-flat hidden mdl-button mdl-js-button">' + this.params.nowText + '</button>' +
+                '<button class="dtp-btn-clear btn btn-flat hidden mdl-button mdl-js-button">' + this.params.clearText + '</button>' +
+                '<button class="dtp-btn-cancel btn btn-flat mdl-button mdl-js-button mdl-button--primary">' + this.params.cancelText + '</button>' +
+                '<button class="dtp-btn-ok btn btn-flat mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--primary">' + this.params.okText + '</button>' +
+                '<div class="clearfix"></div>' +
+                '</div>' +
+                '</div>' +
+                '</div>';
+
+            var $body = $("body");
+
+            if ($body.find("#" + this.name).length <= 0) {
+                $body.append(this.template);
+
+                if (this)
+                    this.dtpElement = $body.find("#" + this.name);
+                this.$dtpElement = $(this.dtpElement);
+            }
+        },
+        initButtons: function () {
+            this._attachEvent(this.$dtpElement.find('.dtp-btn-cancel'), 'click', this._onCancelClick.bind(this));
+            this._attachEvent(this.$dtpElement.find('.dtp-btn-ok'), 'click', this._onOKClick.bind(this));
+            this._attachEvent(this.$dtpElement.find('a.dtp-select-month-before'), 'click', this._onMonthBeforeClick.bind(this));
+            this._attachEvent(this.$dtpElement.find('a.dtp-select-month-after'), 'click', this._onMonthAfterClick.bind(this));
+            this._attachEvent(this.$dtpElement.find('a.dtp-select-year-before'), 'click', this._onYearBeforeClick.bind(this));
+            this._attachEvent(this.$dtpElement.find('a.dtp-select-year-after'), 'click', this._onYearAfterClick.bind(this));
+
+            if (this.params.clearButton === true) {
+                this._attachEvent(this.$dtpElement.find('.dtp-btn-clear'), 'click', this._onClearClick.bind(this));
+                this.$dtpElement.find('.dtp-btn-clear').removeClass('hidden');
+            }
+
+            if (this.params.nowButton === true) {
+                this._attachEvent(this.$dtpElement.find('.dtp-btn-now'), 'click', this._onNowClick.bind(this));
+                this.$dtpElement.find('.dtp-btn-now').removeClass('hidden');
+            }
+
+            if ((this.params.nowButton === true) && (this.params.clearButton === true)) {
+                this.$dtpElement.find('.dtp-btn-clear, .dtp-btn-now, .dtp-btn-cancel, .dtp-btn-ok').addClass('btn-xs');
+            } else if ((this.params.nowButton === true) || (this.params.clearButton === true)) {
+                this.$dtpElement.find('.dtp-btn-clear, .dtp-btn-now, .dtp-btn-cancel, .dtp-btn-ok').addClass('btn-sm');
+            }
+        },
+        initMeridienButtons: function () {
+            this.$dtpElement.find('a.dtp-meridien-am').off('click').on('click', this._onSelectAM.bind(this));
+            this.$dtpElement.find('a.dtp-meridien-pm').off('click').on('click', this._onSelectPM.bind(this));
+        },
+        initDate: function (d) {
+            this.currentView = 0;
+
+            this.$dtpElement.find('.dtp-picker-calendar').removeClass('hidden');
+            this.$dtpElement.find('.dtp-picker-datetime').addClass('hidden');
+
+            var _date = ((typeof (this.currentDate) !== 'undefined' && this.currentDate !== null) ? this.currentDate : null);
+            var _calendar = this.generateCalendar(this.currentDate);
+
+            if (typeof (_calendar.week) !== 'undefined' && typeof (_calendar.days) !== 'undefined') {
+                var _template = this.constructHTMLCalendar(_date, _calendar);
+
+                this.$dtpElement.find('a.dtp-select-day').off('click');
+                this.$dtpElement.find('.dtp-picker-calendar').html(_template);
+
+                this.$dtpElement.find('a.dtp-select-day').on('click', this._onSelectDate.bind(this));
+
+                this.toggleButtons(_date);
+            }
+
+            this._centerBox();
+            this.showDate(_date);
+        },
+        initHours: function () {
+            this.currentView = 1;
+
+            this.showTime(this.currentDate);
+            this.initMeridienButtons();
+
+            if (this.currentDate.hour() < 12) {
+                this.$dtpElement.find('a.dtp-meridien-am').click();
+            } else {
+                this.$dtpElement.find('a.dtp-meridien-pm').click();
+            }
+
+            var hFormat = ((this.params.shortTime) ? 'h' : 'H');
+
+            this.$dtpElement.find('.dtp-picker-datetime').removeClass('hidden');
+            this.$dtpElement.find('.dtp-picker-calendar').addClass('hidden');
+
+            var svgClockElement = this.createSVGClock(true);
+
+            for (var i = 0; i < 12; i++) {
+                var x = -(162 * (Math.sin(-Math.PI * 2 * (i / 12))));
+                var y = -(162 * (Math.cos(-Math.PI * 2 * (i / 12))));
+
+                var fill = ((this.currentDate.format(hFormat) == i) ? "#8BC34A" : 'transparent');
+                var color = ((this.currentDate.format(hFormat) == i) ? "#fff" : '#000');
+
+                var svgHourCircle = this.createSVGElement("circle", {
+                    'id': 'h-' + i,
+                    'class': 'dtp-select-hour',
+                    'style': 'cursor:pointer',
+                    r: '30',
+                    cx: x,
+                    cy: y,
+                    fill: fill,
+                    'data-hour': i
+                });
+
+                var svgHourText = this.createSVGElement("text", {
+                    'id': 'th-' + i,
+                    'class': 'dtp-select-hour-text',
+                    'text-anchor': 'middle',
+                    'style': 'cursor:pointer',
+                    'font-weight': 'bold',
+                    'font-size': '20',
+                    x: x,
+                    y: y + 7,
+                    fill: color,
+                    'data-hour': i
+                });
+                svgHourText.textContent = ((i === 0) ? ((this.params.shortTime) ? 12 : i) : i);
+
+                if (!this.toggleTime(i, true)) {
+                    svgHourCircle.className += " disabled";
+                    svgHourText.className += " disabled";
+                    svgHourText.setAttribute('fill', '#bdbdbd');
+                } else {
+                    svgHourCircle.addEventListener('click', this._onSelectHour.bind(this));
+                    svgHourText.addEventListener('click', this._onSelectHour.bind(this));
+                }
+
+                svgClockElement.appendChild(svgHourCircle)
+                svgClockElement.appendChild(svgHourText)
+            }
+
+            if (!this.params.shortTime) {
+                for (var i = 0; i < 12; i++) {
+                    var x = -(110 * (Math.sin(-Math.PI * 2 * (i / 12))));
+                    var y = -(110 * (Math.cos(-Math.PI * 2 * (i / 12))));
+
+                    var fill = ((this.currentDate.format(hFormat) == (i + 12)) ? "#8BC34A" : 'transparent');
+                    var color = ((this.currentDate.format(hFormat) == (i + 12)) ? "#fff" : '#000');
+
+                    var svgHourCircle = this.createSVGElement("circle", {
+                        'id': 'h-' + (i + 12),
+                        'class': 'dtp-select-hour',
+                        'style': 'cursor:pointer',
+                        r: '30',
+                        cx: x,
+                        cy: y,
+                        fill: fill,
+                        'data-hour': (i + 12)
+                    });
+
+                    var svgHourText = this.createSVGElement("text", {
+                        'id': 'th-' + (i + 12),
+                        'class': 'dtp-select-hour-text',
+                        'text-anchor': 'middle',
+                        'style': 'cursor:pointer',
+                        'font-weight': 'bold',
+                        'font-size': '22',
+                        x: x,
+                        y: y + 7,
+                        fill: color,
+                        'data-hour': (i + 12)
+                    });
+                    svgHourText.textContent = i + 12;
+
+                    if (!this.toggleTime(i + 12, true)) {
+                        svgHourCircle.className += " disabled";
+                        svgHourText.className += " disabled";
+                        svgHourText.setAttribute('fill', '#bdbdbd');
+                    } else {
+                        svgHourCircle.addEventListener('click', this._onSelectHour.bind(this));
+                        svgHourText.addEventListener('click', this._onSelectHour.bind(this));
+                    }
+
+                    svgClockElement.appendChild(svgHourCircle)
+                    svgClockElement.appendChild(svgHourText)
+                }
+
+                this.$dtpElement.find('a.dtp-meridien-am').addClass('hidden');
+                this.$dtpElement.find('a.dtp-meridien-pm').addClass('hidden');
+            }
+
+            this._centerBox();
+        },
+        initMinutes: function () {
+            this.currentView = 2;
+
+            this.showTime(this.currentDate);
+
+            this.initMeridienButtons();
+
+            if (this.currentDate.hour() < 12) {
+                this.$dtpElement.find('a.dtp-meridien-am').click();
+            } else {
+                this.$dtpElement.find('a.dtp-meridien-pm').click();
+            }
+
+            this.$dtpElement.find('.dtp-picker-calendar').addClass('hidden');
+            this.$dtpElement.find('.dtp-picker-datetime').removeClass('hidden');
+
+            var svgClockElement = this.createSVGClock(false);
+
+            for (var i = 0; i < 60; i++) {
+                var s = ((i % 5 === 0) ? 162 : 158);
+                var r = ((i % 5 === 0) ? 30 : 20);
+
+                var x = -(s * (Math.sin(-Math.PI * 2 * (i / 60))));
+                var y = -(s * (Math.cos(-Math.PI * 2 * (i / 60))));
+
+                var color = ((this.currentDate.format("m") == i) ? "#8BC34A" : 'transparent');
+
+                var svgMinuteCircle = this.createSVGElement("circle", {
+                    'id': 'm-' + i,
+                    'class': 'dtp-select-minute',
+                    'style': 'cursor:pointer',
+                    r: r,
+                    cx: x,
+                    cy: y,
+                    fill: color,
+                    'data-minute': i
+                });
+
+                if (!this.toggleTime(i, false)) {
+                    svgMinuteCircle.className += " disabled";
+                } else {
+                    svgMinuteCircle.addEventListener('click', this._onSelectMinute.bind(this));
+                }
+
+                svgClockElement.appendChild(svgMinuteCircle)
+            }
+
+            for (var i = 0; i < 60; i++) {
+                if ((i % 5) === 0) {
+                    var x = -(162 * (Math.sin(-Math.PI * 2 * (i / 60))));
+                    var y = -(162 * (Math.cos(-Math.PI * 2 * (i / 60))));
+
+                    var color = ((this.currentDate.format("m") == i) ? "#fff" : '#000');
+
+                    var svgMinuteText = this.createSVGElement("text", {
+                        'id': 'tm-' + i,
+                        'class': 'dtp-select-minute-text',
+                        'text-anchor': 'middle',
+                        'style': 'cursor:pointer',
+                        'font-weight': 'bold',
+                        'font-size': '20',
+                        x: x,
+                        y: y + 7,
+                        fill: color,
+                        'data-minute': i
+                    });
+                    svgMinuteText.textContent = i;
+
+                    if (!this.toggleTime(i, false)) {
+                        svgMinuteText.className += " disabled";
+                        svgMinuteText.setAttribute('fill', '#bdbdbd');
+                    } else {
+                        svgMinuteText.addEventListener('click', this._onSelectMinute.bind(this));
+                    }
+
+                    svgClockElement.appendChild(svgMinuteText)
+                }
+            }
+
+            this._centerBox();
+        },
+        animateHands: function () {
+            var H = this.currentDate.hour();
+            var M = this.currentDate.minute();
+
+            var hh = this.$dtpElement.find('.hour-hand');
+            hh[0].setAttribute('transform', "rotate(" + 360 * H / 12 + ")");
+
+            var mh = this.$dtpElement.find('.minute-hand');
+            mh[0].setAttribute('transform', "rotate(" + 360 * M / 60 + ")");
+        },
+        createSVGClock: function (isHour) {
+            var hl = ((this.params.shortTime) ? -120 : -90);
+
+            var svgElement = this.createSVGElement("svg", {class: 'svg-clock', viewBox: '0,0,400,400'});
+            var svgGElement = this.createSVGElement("g", {transform: 'translate(200,200) '});
+            var svgClockFace = this.createSVGElement("circle", {
+                r: '192',
+                fill: '#eee',
+                stroke: '#bdbdbd',
+                'stroke-width': 2
+            });
+            var svgClockCenter = this.createSVGElement("circle", {r: '15', fill: '#757575'});
+
+            svgGElement.appendChild(svgClockFace)
+
+            if (isHour) {
+                var svgMinuteHand = this.createSVGElement("line", {
+                    class: 'minute-hand',
+                    x1: 0,
+                    y1: 0,
+                    x2: 0,
+                    y2: -150,
+                    stroke: '#bdbdbd',
+                    'stroke-width': 2
+                });
+                var svgHourHand = this.createSVGElement("line", {
+                    class: 'hour-hand',
+                    x1: 0,
+                    y1: 0,
+                    x2: 0,
+                    y2: hl,
+                    stroke: '#8BC34A',
+                    'stroke-width': 8
+                });
+
+                svgGElement.appendChild(svgMinuteHand);
+                svgGElement.appendChild(svgHourHand);
+            } else {
+                var svgMinuteHand = this.createSVGElement("line", {
+                    class: 'minute-hand',
+                    x1: 0,
+                    y1: 0,
+                    x2: 0,
+                    y2: -150,
+                    stroke: '#8BC34A',
+                    'stroke-width': 2
+                });
+                var svgHourHand = this.createSVGElement("line", {
+                    class: 'hour-hand',
+                    x1: 0,
+                    y1: 0,
+                    x2: 0,
+                    y2: hl,
+                    stroke: '#bdbdbd',
+                    'stroke-width': 8
+                });
+
+                svgGElement.appendChild(svgHourHand);
+                svgGElement.appendChild(svgMinuteHand);
+            }
+
+            svgGElement.appendChild(svgClockCenter)
+
+            svgElement.appendChild(svgGElement)
+
+            this.$dtpElement.find("#dtp-svg-clock").empty();
+            this.$dtpElement.find("#dtp-svg-clock")[0].appendChild(svgElement);
+
+            this.animateHands();
+
+            return svgGElement;
+        },
+        createSVGElement: function (tag, attrs) {
+            var el = document.createElementNS('http://www.w3.org/2000/svg', tag);
+            for (var k in attrs) {
+                el.setAttribute(k, attrs[k]);
+            }
+            return el;
+        },
+        isAfterMinDate: function (date, checkHour, checkMinute) {
+            var _return = true;
+
+            if (typeof (this.minDate) !== 'undefined' && this.minDate !== null) {
+                var _minDate = moment(this.minDate);
+                var _date = moment(date);
+
+                if (!checkHour && !checkMinute) {
+                    _minDate.hour(0);
+                    _minDate.minute(0);
+
+                    _date.hour(0);
+                    _date.minute(0);
+                }
+
+                _minDate.second(0);
+                _date.second(0);
+                _minDate.millisecond(0);
+                _date.millisecond(0);
+
+                if (!checkMinute) {
+                    _date.minute(0);
+                    _minDate.minute(0);
+
+                    _return = (parseInt(_date.format("X")) >= parseInt(_minDate.format("X")));
+                } else {
+                    _return = (parseInt(_date.format("X")) >= parseInt(_minDate.format("X")));
+                }
+            }
+
+            return _return;
+        },
+        isBeforeMaxDate: function (date, checkTime, checkMinute) {
+            var _return = true;
+
+            if (typeof (this.maxDate) !== 'undefined' && this.maxDate !== null) {
+                var _maxDate = moment(this.maxDate);
+                var _date = moment(date);
+
+                if (!checkTime && !checkMinute) {
+                    _maxDate.hour(0);
+                    _maxDate.minute(0);
+
+                    _date.hour(0);
+                    _date.minute(0);
+                }
+
+                _maxDate.second(0);
+                _date.second(0);
+                _maxDate.millisecond(0);
+                _date.millisecond(0);
+
+                if (!checkMinute) {
+                    _date.minute(0);
+                    _maxDate.minute(0);
+
+                    _return = (parseInt(_date.format("X")) <= parseInt(_maxDate.format("X")));
+                } else {
+                    _return = (parseInt(_date.format("X")) <= parseInt(_maxDate.format("X")));
+                }
+            }
+
+            return _return;
+        },
+        rotateElement: function (el, deg) {
+            $(el).css
+            ({
+                WebkitTransform: 'rotate(' + deg + 'deg)',
+                '-moz-transform': 'rotate(' + deg + 'deg)'
+            });
+        },
+        showDate: function (date) {
+            if (date) {
+                this.$dtpElement.find('.dtp-actual-day').html(date.locale(this.params.lang).format('dddd'));
+                this.$dtpElement.find('.dtp-actual-month').html(date.locale(this.params.lang).format('MMM').toUpperCase());
+                this.$dtpElement.find('.dtp-actual-num').html(date.locale(this.params.lang).format('DD'));
+                this.$dtpElement.find('.dtp-actual-year').html(date.locale(this.params.lang).format('YYYY'));
+            }
+        },
+        showTime: function (date) {
+            if (date) {
+                var minutes = date.minute();
+                var content = ((this.params.shortTime) ? date.format('hh') : date.format('HH')) + ':' + ((minutes.toString().length == 2) ? minutes : '0' + minutes) + ((this.params.shortTime) ? ' ' + date.format('A') : '');
+
+                if (this.params.date)
+                    this.$dtpElement.find('.dtp-actual-time').html(content);
+                else {
+                    if (this.params.shortTime)
+                        this.$dtpElement.find('.dtp-actual-day').html(date.format('A'));
+                    else
+                        this.$dtpElement.find('.dtp-actual-day').html('&nbsp;');
+
+                    this.$dtpElement.find('.dtp-actual-maxtime').html(content);
+                }
+            }
+        },
+        selectDate: function (date) {
+            if (date) {
+                this.currentDate.date(date);
+
+                this.showDate(this.currentDate);
+                this.$element.trigger('dateSelected', this.currentDate);
+            }
+        },
+        generateCalendar: function (date) {
+            var _calendar = {};
+
+            if (date !== null) {
+                var startOfMonth = moment(date).locale(this.params.lang).startOf('month');
+                var endOfMonth = moment(date).locale(this.params.lang).endOf('month');
+
+                var iNumDay = startOfMonth.format('d');
+
+                _calendar.week = this.days;
+                _calendar.days = [];
+
+                for (var i = startOfMonth.date(); i <= endOfMonth.date(); i++) {
+                    if (i === startOfMonth.date()) {
+                        var iWeek = _calendar.week.indexOf(iNumDay.toString());
+                        if (iWeek > 0) {
+                            for (var x = 0; x < iWeek; x++) {
+                                _calendar.days.push(0);
+                            }
+                        }
+                    }
+                    _calendar.days.push(moment(startOfMonth).locale(this.params.lang).date(i));
+                }
+            }
+
+            return _calendar;
+        },
+        constructHTMLCalendar: function (date, calendar) {
+            var _template = "";
+
+            _template += '<div class="dtp-picker-month">' + date.locale(this.params.lang).format('MMMM YYYY') + '</div>';
+            _template += '<table class="table dtp-picker-days"><thead>';
+            for (var i = 0; i < calendar.week.length; i++) {
+                _template += '<th>' + moment(parseInt(calendar.week[i]), "d").locale(this.params.lang).format("dd").substring(0, 1) + '</th>';
+            }
+
+            _template += '</thead>';
+            _template += '<tbody><tr>';
+
+            for (var i = 0; i < calendar.days.length; i++) {
+                if (i % 7 == 0)
+                    _template += '</tr><tr>';
+                _template += '<td data-date="' + moment(calendar.days[i]).locale(this.params.lang).format("D") + '">';
+                if (calendar.days[i] != 0) {
+                    if (this.isBeforeMaxDate(moment(calendar.days[i]), false, false) === false || this.isAfterMinDate(moment(calendar.days[i]), false, false) === false) {
+                        _template += '<span class="dtp-select-day">' + moment(calendar.days[i]).locale(this.params.lang).format("DD") + '</span>';
+                    } else {
+                        if (moment(calendar.days[i]).locale(this.params.lang).format("DD") === moment(this.currentDate).locale(this.params.lang).format("DD")) {
+                            _template += '<a href="javascript:void(0);" class="dtp-select-day selected">' + moment(calendar.days[i]).locale(this.params.lang).format("DD") + '</a>';
+                        } else {
+                            _template += '<a href="javascript:void(0);" class="dtp-select-day">' + moment(calendar.days[i]).locale(this.params.lang).format("DD") + '</a>';
+                        }
+                    }
+
+                    _template += '</td>';
+                }
+            }
+            _template += '</tr></tbody></table>';
+
+            return _template;
+        },
+        setName: function () {
+            var text = "";
+            var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+
+            for (var i = 0; i < 5; i++) {
+                text += possible.charAt(Math.floor(Math.random() * possible.length));
+            }
+
+            return text;
+        },
+        isPM: function () {
+            return this.$dtpElement.find('a.dtp-meridien-pm').hasClass('selected');
+        },
+        setElementValue: function () {
+            this.$element.trigger('beforeChange', this.currentDate);
+            if (this.$element.hasClass("mdl-textfield__input")) {
+                this.$element.removeClass('empty');
+                this.$element.parent().addClass("is-dirty");
+            }
+
+            this.$element.val(moment(this.currentDate).locale(this.params.lang).format(this.params.format));
+
+            this.$element.trigger('change', this.currentDate);
+        },
+        toggleButtons: function (date) {
+            if (date && date.isValid()) {
+                var startOfMonth = moment(date).locale(this.params.lang).startOf('month');
+                var endOfMonth = moment(date).locale(this.params.lang).endOf('month');
+
+                if (!this.isAfterMinDate(startOfMonth, false, false)) {
+                    this.$dtpElement.find('a.dtp-select-month-before').addClass('invisible');
+                } else {
+                    this.$dtpElement.find('a.dtp-select-month-before').removeClass('invisible');
+                }
+
+                if (!this.isBeforeMaxDate(endOfMonth, false, false)) {
+                    this.$dtpElement.find('a.dtp-select-month-after').addClass('invisible');
+                } else {
+                    this.$dtpElement.find('a.dtp-select-month-after').removeClass('invisible');
+                }
+
+                var startOfYear = moment(date).locale(this.params.lang).startOf('year');
+                var endOfYear = moment(date).locale(this.params.lang).endOf('year');
+
+                if (!this.isAfterMinDate(startOfYear, false, false)) {
+                    this.$dtpElement.find('a.dtp-select-year-before').addClass('invisible');
+                } else {
+                    this.$dtpElement.find('a.dtp-select-year-before').removeClass('invisible');
+                }
+
+                if (!this.isBeforeMaxDate(endOfYear, false, false)) {
+                    this.$dtpElement.find('a.dtp-select-year-after').addClass('invisible');
+                } else {
+                    this.$dtpElement.find('a.dtp-select-year-after').removeClass('invisible');
+                }
+            }
+        },
+        toggleTime: function (value, isHours) {
+            var result = false;
+
+            if (isHours) {
+                var _date = moment(this.currentDate);
+                _date.hour(this.convertHours(value)).minute(0).second(0);
+
+                result = !(this.isAfterMinDate(_date, true, false) === false || this.isBeforeMaxDate(_date, true, false) === false);
+            } else {
+                var _date = moment(this.currentDate);
+                _date.minute(value).second(0);
+
+                result = !(this.isAfterMinDate(_date, true, true) === false || this.isBeforeMaxDate(_date, true, true) === false);
+            }
+
+            return result;
+        },
+        _attachEvent: function (el, ev, fn) {
+            el.on(ev, null, null, fn);
+            this._attachedEvents.push([el, ev, fn]);
+        },
+        _detachEvents: function () {
+            for (var i = this._attachedEvents.length - 1; i >= 0; i--) {
+                this._attachedEvents[i][0].off(this._attachedEvents[i][1], this._attachedEvents[i][2]);
+                this._attachedEvents.splice(i, 1);
+            }
+        },
+        _fireCalendar: function () {
+            this.currentView = 0;
+            this.$element.blur();
+
+            this.initDates();
+
+            this.show();
+
+            if (this.params.date) {
+                this.$dtpElement.find('.dtp-date').removeClass('hidden');
+                this.initDate();
+            } else {
+                if (this.params.time) {
+                    this.$dtpElement.find('.dtp-time').removeClass('hidden');
+                    this.initHours();
+                }
+            }
+        },
+        _onBackgroundClick: function (e) {
+            e.stopPropagation();
+            this.hide();
+        },
+        _onElementClick: function (e) {
+            e.stopPropagation();
+        },
+        _onKeydown: function (e) {
+            if (e.which === 27) {
+                this.hide();
+            }
+        },
+        _onCloseClick: function () {
+            this.hide();
+        },
+        _onClearClick: function () {
+            this.currentDate = null;
+            this.$element.trigger('beforeChange', this.currentDate);
+            this.hide();
+            if (typeof ($.material) !== 'undefined') {
+                this.$element.addClass('empty');
+            }
+            this.$element.val('');
+            this.$element.trigger('change', this.currentDate);
+        },
+        _onNowClick: function () {
+            this.currentDate = moment();
+
+            if (this.params.date === true) {
+                this.showDate(this.currentDate);
+
+                if (this.currentView === 0) {
+                    this.initDate();
+                }
+            }
+
+            if (this.params.time === true) {
+                this.showTime(this.currentDate);
+
+                switch (this.currentView) {
+                    case 1 :
+                        this.initHours();
+                        break;
+                    case 2 :
+                        this.initMinutes();
+                        break;
+                }
+
+                this.animateHands();
+            }
+        },
+        _onOKClick: function () {
+            switch (this.currentView) {
+                case 0:
+                    if (this.params.time === true) {
+                        this.initHours();
+                    } else {
+                        this.setElementValue();
+                        this.hide();
+                    }
+                    break;
+                case 1:
+                    this.initMinutes();
+                    break;
+                case 2:
+                    this.setElementValue();
+                    this.hide();
+                    break;
+            }
+        },
+        _onCancelClick: function () {
+            if (this.params.time) {
+                switch (this.currentView) {
+                    case 0:
+                        this.hide();
+                        break;
+                    case 1:
+                        if (this.params.date) {
+                            this.initDate();
+                        } else {
+                            this.hide();
+                        }
+                        break;
+                    case 2:
+                        this.initHours();
+                        break;
+                }
+            } else {
+                this.hide();
+            }
+        },
+        _onMonthBeforeClick: function () {
+            this.currentDate.subtract(1, 'months');
+            this.initDate(this.currentDate);
+        },
+        _onMonthAfterClick: function () {
+            this.currentDate.add(1, 'months');
+            this.initDate(this.currentDate);
+        },
+        _onYearBeforeClick: function () {
+            this.currentDate.subtract(1, 'years');
+            this.initDate(this.currentDate);
+        },
+        _onYearAfterClick: function () {
+            this.currentDate.add(1, 'years');
+            this.initDate(this.currentDate);
+        },
+        _onSelectDate: function (e) {
+            this.$dtpElement.find('a.dtp-select-day').removeClass('selected');
+            $(e.currentTarget).addClass('selected');
+
+            this.selectDate($(e.currentTarget).parent().data("date"));
+
+            if (this.params.switchOnClick === true && this.params.time === true)
+                setTimeout(this.initHours.bind(this), 200);
+
+            if (this.params.switchOnClick === true && this.params.time === false) {
+                setTimeout(this._onOKClick.bind(this), 200);
+            }
+
+        },
+        _onSelectHour: function (e) {
+            if (!$(e.target).hasClass('disabled')) {
+                var value = $(e.target).data('hour');
+                var parent = $(e.target).parent();
+
+                var h = parent.find('.dtp-select-hour');
+                for (var i = 0; i < h.length; i++) {
+                    $(h[i]).attr('fill', 'transparent');
+                }
+                var th = parent.find('.dtp-select-hour-text');
+                for (var i = 0; i < th.length; i++) {
+                    $(th[i]).attr('fill', '#000');
+                }
+
+                $(parent.find('#h-' + value)).attr('fill', '#8BC34A');
+                $(parent.find('#th-' + value)).attr('fill', '#fff');
+
+                this.currentDate.hour(parseInt(value));
+
+                if (this.params.shortTime === true && this.isPM()) {
+                    this.currentDate.add(12, 'hours');
+                }
+
+                this.showTime(this.currentDate);
+
+                this.animateHands();
+
+                if (this.params.switchOnClick === true)
+                    setTimeout(this.initMinutes.bind(this), 200);
+            }
+        },
+        _onSelectMinute: function (e) {
+            if (!$(e.target).hasClass('disabled')) {
+                var value = $(e.target).data('minute');
+                var parent = $(e.target).parent();
+
+                var m = parent.find('.dtp-select-minute');
+                for (var i = 0; i < m.length; i++) {
+                    $(m[i]).attr('fill', 'transparent');
+                }
+                var tm = parent.find('.dtp-select-minute-text');
+                for (var i = 0; i < tm.length; i++) {
+                    $(tm[i]).attr('fill', '#000');
+                }
+
+                $(parent.find('#m-' + value)).attr('fill', '#8BC34A');
+                $(parent.find('#tm-' + value)).attr('fill', '#fff');
+
+                this.currentDate.minute(parseInt(value));
+                this.showTime(this.currentDate);
+
+                this.animateHands();
+
+                if (this.params.switchOnClick === true)
+                    setTimeout(function () {
+                        this.setElementValue();
+                        this.hide();
+                    }.bind(this), 200);
+            }
+        },
+        _onSelectAM: function (e) {
+            $('.dtp-actual-meridien').find('a').removeClass('selected');
+            $(e.currentTarget).addClass('selected');
+
+            if (this.currentDate.hour() >= 12) {
+                if (this.currentDate.subtract(12, 'hours'))
+                    this.showTime(this.currentDate);
+            }
+            this.toggleTime((this.currentView === 1));
+        },
+        _onSelectPM: function (e) {
+            $('.dtp-actual-meridien').find('a').removeClass('selected');
+            $(e.currentTarget).addClass('selected');
+
+            if (this.currentDate.hour() < 12) {
+                if (this.currentDate.add(12, 'hours'))
+                    this.showTime(this.currentDate);
+            }
+            this.toggleTime((this.currentView === 1));
+        },
+        convertHours: function (h) {
+            var _return = h;
+
+            if (this.params.shortTime === true) {
+                if ((h < 12) && this.isPM()) {
+                    _return += 12;
+                }
+            }
+
+            return _return;
+        },
+        setDate: function (date) {
+            this.params.currentDate = date;
+            this.initDates();
+        },
+        setMinDate: function (date) {
+            this.params.minDate = date;
+            this.initDates();
+        },
+        setMaxDate: function (date) {
+            this.params.maxDate = date;
+            this.initDates();
+        },
+        destroy: function () {
+            this._detachEvents();
+            this.$dtpElement.remove();
+        },
+        show: function () {
+            this.$dtpElement.removeClass('hidden');
+            this._attachEvent($(window), 'keydown', this._onKeydown.bind(this));
+            this._centerBox();
+        },
+        hide: function () {
+            $(window).off('keydown', null, null, this._onKeydown.bind(this));
+            this.$dtpElement.addClass('hidden');
+        },
+        _centerBox: function () {
+            var h = (this.$dtpElement.height() - this.$dtpElement.find('.dtp-content').height()) / 2;
+            this.$dtpElement.find('.dtp-content').css('marginLeft', -(this.$dtpElement.find('.dtp-content').width() / 2) + 'px');
+            this.$dtpElement.find('.dtp-content').css('top', h + 'px');
+        },
+        enableDays: function () {
+            var enableDays = this.params.enableDays;
+            if (enableDays) {
+                $(".dtp-picker-days tbody tr td").each(function () {
+                    if (!(($.inArray($(this).index(), enableDays)) >= 0)) {
+                        $(this).find('a').css({
+                            "background": "#e3e3e3",
+                            "cursor": "no-drop",
+                            "opacity": "0.5"
+                        }).off("click");
+                    }
+                });
+            }
+        }
+
+    };
+})(jQuery, moment);
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/js/bootstrap-material-datetimepicker.map b/app/modules/web/themes/material-dark/js/bootstrap-material-datetimepicker.map
new file mode 100644
index 000000000..76f1256ca
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/bootstrap-material-datetimepicker.map
@@ -0,0 +1,8 @@
+{
+"version":3,
+"file":"bootstrap-material-datetimepicker.min.js",
+"lineCount":48,
+"mappings":"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",
+"sources":[" [synthetic:base] "," [synthetic:util/findinternal] "," [synthetic:util/defineproperty] "," [synthetic:util/global] "," [synthetic:util/polyfill] "," [synthetic:es6/array/find] ","bootstrap-material-datetimepicker.js"],
+"names":["$","moment","Plugin","element","options","currentView","minDate","maxDate","_attachedEvents","$element","params","date","time","format","currentDate","lang","weekStart","shortTime","clearButton","nowButton","cancelText","okText","clearText","nowText","switchOnClick","triggerEvent","fn","extend","name","setName","attr","locale","init","p","each","data","pluginDataName","removeData","prototype","initDays","initDates","initTemplate","initButtons","_attachEvent","window","_centerBox","bind","$dtpElement","find","_onElementClick","_onBackgroundClick","_onCloseClick","_fireCalendar","days","i","length","push","toString","val","isValid","x","getTime","isAfterMinDate","isBeforeMaxDate","template","$body","append","dtpElement","_onCancelClick","_onOKClick","_onMonthBeforeClick","_onMonthAfterClick","_onYearBeforeClick","_onYearAfterClick","_onClearClick","removeClass","_onNowClick","addClass","initMeridienButtons","off","on","_onSelectAM","_onSelectPM","initDate","d","_date","_calendar","generateCalendar","week","_template","constructHTMLCalendar","html","_onSelectDate","toggleButtons","showDate","initHours","showTime","hour","click","hFormat","svgClockElement","createSVGClock","Math","sin","PI","y","cos","fill","color","svgHourCircle","createSVGElement","r","cx","cy","svgHourText","textContent","toggleTime","addEventListener","_onSelectHour","className","setAttribute","appendChild","initMinutes","s","svgMinuteCircle","_onSelectMinute","svgMinuteText","animateHands","H","M","minute","hh","mh","isHour","hl","svgElement","class","viewBox","svgGElement","transform","svgClockFace","stroke","svgClockCenter","svgMinuteHand","x1","y1","x2","y2","svgHourHand","empty","tag","attrs","el","document","createElementNS","k","checkHour","checkMinute","_return","_minDate","second","millisecond","parseInt","checkTime","_maxDate","rotateElement","deg","css","WebkitTransform","toUpperCase","minutes","content","selectDate","trigger","startOfMonth","startOf","endOfMonth","endOf","iNumDay","iWeek","indexOf","calendar","substring","text","possible","charAt","floor","random","isPM","hasClass","setElementValue","parent","startOfYear","endOfYear","value","isHours","result","convertHours","ev","_detachEvents","splice","blur","show","e","stopPropagation","hide","_onKeydown","which","material","subtract","add","currentTarget","setTimeout","target","h","th","m","tm","setDate","setMinDate","setMaxDate","destroy","remove","height","width","enableDays","inArray","index","jQuery"]
+}
diff --git a/app/modules/web/themes/material-dark/js/bootstrap-material-datetimepicker.min.js b/app/modules/web/themes/material-dark/js/bootstrap-material-datetimepicker.min.js
new file mode 100644
index 000000000..b10fa528a
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/bootstrap-material-datetimepicker.min.js
@@ -0,0 +1,48 @@
+var $jscomp=$jscomp||{};$jscomp.scope={};$jscomp.findInternal=function(c,d,g){c instanceof String&&(c=String(c));for(var a=c.length,b=0;b<a;b++){var f=c[b];if(d.call(g,f,b,c))return{i:b,v:f}}return{i:-1,v:void 0}};$jscomp.ASSUME_ES5=!1;$jscomp.ASSUME_NO_NATIVE_MAP=!1;$jscomp.ASSUME_NO_NATIVE_SET=!1;$jscomp.defineProperty=$jscomp.ASSUME_ES5||"function"==typeof Object.defineProperties?Object.defineProperty:function(c,d,g){c!=Array.prototype&&c!=Object.prototype&&(c[d]=g.value)};
+$jscomp.getGlobal=function(c){return"undefined"!=typeof window&&window===c?c:"undefined"!=typeof global&&null!=global?global:c};$jscomp.global=$jscomp.getGlobal(this);$jscomp.polyfill=function(c,d,g,a){if(d){g=$jscomp.global;c=c.split(".");for(a=0;a<c.length-1;a++){var b=c[a];b in g||(g[b]={});g=g[b]}c=c[c.length-1];a=g[c];d=d(a);d!=a&&null!=d&&$jscomp.defineProperty(g,c,{configurable:!0,writable:!0,value:d})}};
+$jscomp.polyfill("Array.prototype.find",function(c){return c?c:function(c,g){return $jscomp.findInternal(this,c,g).v}},"es6","es3");
+(function(c,d){function g(a,b){this.currentView=0;this.minDate;this.maxDate;this._attachedEvents=[];this.element=a;this.$element=c(a);this.params={date:!0,time:!0,format:"YYYY-MM-DD",minDate:null,maxDate:null,currentDate:null,lang:"en",weekStart:0,shortTime:!1,clearButton:!1,nowButton:!1,cancelText:"Cancel",okText:"OK",clearText:"Clear",nowText:"Now",switchOnClick:!1,triggerEvent:"focus"};this.params=c.fn.extend(this.params,b);this.name="dtp_"+this.setName();this.$element.attr("data-dtp",this.name);
+d.locale(this.params.lang);this.init()}d.locale("en");c.fn.bootstrapMaterialDatePicker=function(a,b){this.each(function(){if(c.data(this,"plugin_bootstrapMaterialDatePicker")){if("function"===typeof c.data(this,"plugin_bootstrapMaterialDatePicker")[a])c.data(this,"plugin_bootstrapMaterialDatePicker")[a](b);"destroy"===a&&c.removeData(this)}else c.data(this,"plugin_bootstrapMaterialDatePicker",new g(this,a))});return this};g.prototype={init:function(){this.initDays();this.initDates();this.initTemplate();
+this.initButtons();this._attachEvent(c(window),"resize",this._centerBox.bind(this));this._attachEvent(this.$dtpElement.find(".dtp-content"),"click",this._onElementClick.bind(this));this._attachEvent(this.$dtpElement,"click",this._onBackgroundClick.bind(this));this._attachEvent(this.$dtpElement.find(".dtp-close > a"),"click",this._onCloseClick.bind(this));this._attachEvent(this.$element,this.params.triggerEvent,this._fireCalendar.bind(this))},initDays:function(){this.days=[];for(var a=this.params.weekStart;7>
+this.days.length;a++)6<a&&(a=0),this.days.push(a.toString())},initDates:function(){if(0<this.$element.val().length)this.currentDate="undefined"!==typeof this.params.format&&null!==this.params.format?d(this.$element.val(),this.params.format).locale(this.params.lang):d(this.$element.val()).locale(this.params.lang);else if("undefined"!==typeof this.$element.attr("value")&&null!==this.$element.attr("value")&&""!==this.$element.attr("value"))"string"===typeof this.$element.attr("value")&&(this.currentDate=
+"undefined"!==typeof this.params.format&&null!==this.params.format?d(this.$element.attr("value"),this.params.format).locale(this.params.lang):d(this.$element.attr("value")).locale(this.params.lang));else if("undefined"!==typeof this.params.currentDate&&null!==this.params.currentDate){if("string"===typeof this.params.currentDate)this.currentDate="undefined"!==typeof this.params.format&&null!==this.params.format?d(this.params.currentDate,this.params.format).locale(this.params.lang):d(this.params.currentDate).locale(this.params.lang);
+else if("undefined"===typeof this.params.currentDate.isValid||"function"!==typeof this.params.currentDate.isValid){var a=this.params.currentDate.getTime();this.currentDate=d(a,"x").locale(this.params.lang)}else this.currentDate=this.params.currentDate;this.$element.val(this.currentDate.format(this.params.format))}else this.currentDate=d();"undefined"!==typeof this.params.minDate&&null!==this.params.minDate?"string"===typeof this.params.minDate?this.minDate="undefined"!==typeof this.params.format&&
+null!==this.params.format?d(this.params.minDate,this.params.format).locale(this.params.lang):d(this.params.minDate).locale(this.params.lang):"undefined"===typeof this.params.minDate.isValid||"function"!==typeof this.params.minDate.isValid?(a=this.params.minDate.getTime(),this.minDate=d(a,"x").locale(this.params.lang)):this.minDate=this.params.minDate:null===this.params.minDate&&(this.minDate=null);"undefined"!==typeof this.params.maxDate&&null!==this.params.maxDate?"string"===typeof this.params.maxDate?
+this.maxDate="undefined"!==typeof this.params.format&&null!==this.params.format?d(this.params.maxDate,this.params.format).locale(this.params.lang):d(this.params.maxDate).locale(this.params.lang):"undefined"===typeof this.params.maxDate.isValid||"function"!==typeof this.params.maxDate.isValid?(a=this.params.maxDate.getTime(),this.maxDate=d(a,"x").locale(this.params.lang)):this.maxDate=this.params.maxDate:null===this.params.maxDate&&(this.maxDate=null);this.isAfterMinDate(this.currentDate)||(this.currentDate=
+d(this.minDate));this.isBeforeMaxDate(this.currentDate)||(this.currentDate=d(this.maxDate))},initTemplate:function(){this.template='<div class="dtp hidden" id="'+this.name+'"><div class="dtp-content"><div class="dtp-date-view"><header class="dtp-header"><div class="dtp-actual-day">Lundi</div><div class="dtp-close"><a href="javascript:void(0);"><i class="material-icons">clear</i></a></div></header><div class="dtp-date hidden"><div><div class="left center p10"><a href="javascript:void(0);" class="dtp-select-month-before"><i class="material-icons">chevron_left</i></a></div><div class="dtp-actual-month p80">MAR</div><div class="right center p10"><a href="javascript:void(0);" class="dtp-select-month-after"><i class="material-icons">chevron_right</i></a></div><div class="clearfix"></div></div><div class="dtp-actual-num">13</div><div><div class="left center p10"><a href="javascript:void(0);" class="dtp-select-year-before"><i class="material-icons">chevron_left</i></a></div><div class="dtp-actual-year p80">2014</div><div class="right center p10"><a href="javascript:void(0);" class="dtp-select-year-after"><i class="material-icons">chevron_right</i></a></div><div class="clearfix"></div></div></div><div class="dtp-time hidden"><div class="dtp-actual-maxtime">23:55</div></div><div class="dtp-picker"><div class="dtp-picker-calendar"></div><div class="dtp-picker-datetime hidden"><div class="dtp-actual-meridien"><div class="left p20"><a class="dtp-meridien-am" href="javascript:void(0);">AM</a></div><div class="dtp-actual-time p60"></div><div class="right p20"><a class="dtp-meridien-pm" href="javascript:void(0);">PM</a></div><div class="clearfix"></div></div><div id="dtp-svg-clock"></div></div></div></div><div class="dtp-buttons"><button class="dtp-btn-now btn btn-flat hidden mdl-button mdl-js-button">'+
+this.params.nowText+'</button><button class="dtp-btn-clear btn btn-flat hidden mdl-button mdl-js-button">'+this.params.clearText+'</button><button class="dtp-btn-cancel btn btn-flat mdl-button mdl-js-button mdl-button--primary">'+this.params.cancelText+'</button><button class="dtp-btn-ok btn btn-flat mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--primary">'+this.params.okText+'</button><div class="clearfix"></div></div></div></div>';var a=c("body");0>=a.find("#"+this.name).length&&(a.append(this.template),
+this&&(this.dtpElement=a.find("#"+this.name)),this.$dtpElement=c(this.dtpElement))},initButtons:function(){this._attachEvent(this.$dtpElement.find(".dtp-btn-cancel"),"click",this._onCancelClick.bind(this));this._attachEvent(this.$dtpElement.find(".dtp-btn-ok"),"click",this._onOKClick.bind(this));this._attachEvent(this.$dtpElement.find("a.dtp-select-month-before"),"click",this._onMonthBeforeClick.bind(this));this._attachEvent(this.$dtpElement.find("a.dtp-select-month-after"),"click",this._onMonthAfterClick.bind(this));
+this._attachEvent(this.$dtpElement.find("a.dtp-select-year-before"),"click",this._onYearBeforeClick.bind(this));this._attachEvent(this.$dtpElement.find("a.dtp-select-year-after"),"click",this._onYearAfterClick.bind(this));!0===this.params.clearButton&&(this._attachEvent(this.$dtpElement.find(".dtp-btn-clear"),"click",this._onClearClick.bind(this)),this.$dtpElement.find(".dtp-btn-clear").removeClass("hidden"));!0===this.params.nowButton&&(this._attachEvent(this.$dtpElement.find(".dtp-btn-now"),"click",
+this._onNowClick.bind(this)),this.$dtpElement.find(".dtp-btn-now").removeClass("hidden"));!0===this.params.nowButton&&!0===this.params.clearButton?this.$dtpElement.find(".dtp-btn-clear, .dtp-btn-now, .dtp-btn-cancel, .dtp-btn-ok").addClass("btn-xs"):(!0===this.params.nowButton||!0===this.params.clearButton)&&this.$dtpElement.find(".dtp-btn-clear, .dtp-btn-now, .dtp-btn-cancel, .dtp-btn-ok").addClass("btn-sm")},initMeridienButtons:function(){this.$dtpElement.find("a.dtp-meridien-am").off("click").on("click",
+this._onSelectAM.bind(this));this.$dtpElement.find("a.dtp-meridien-pm").off("click").on("click",this._onSelectPM.bind(this))},initDate:function(a){this.currentView=0;this.$dtpElement.find(".dtp-picker-calendar").removeClass("hidden");this.$dtpElement.find(".dtp-picker-datetime").addClass("hidden");a="undefined"!==typeof this.currentDate&&null!==this.currentDate?this.currentDate:null;var b=this.generateCalendar(this.currentDate);"undefined"!==typeof b.week&&"undefined"!==typeof b.days&&(b=this.constructHTMLCalendar(a,
+b),this.$dtpElement.find("a.dtp-select-day").off("click"),this.$dtpElement.find(".dtp-picker-calendar").html(b),this.$dtpElement.find("a.dtp-select-day").on("click",this._onSelectDate.bind(this)),this.toggleButtons(a));this._centerBox();this.showDate(a)},initHours:function(){this.currentView=1;this.showTime(this.currentDate);this.initMeridienButtons();12>this.currentDate.hour()?this.$dtpElement.find("a.dtp-meridien-am").click():this.$dtpElement.find("a.dtp-meridien-pm").click();var a=this.params.shortTime?
+"h":"H";this.$dtpElement.find(".dtp-picker-datetime").removeClass("hidden");this.$dtpElement.find(".dtp-picker-calendar").addClass("hidden");for(var b=this.createSVGClock(!0),f=0;12>f;f++){var e=-(162*Math.sin(f/12*-Math.PI*2)),c=-(162*Math.cos(f/12*-Math.PI*2)),d=this.currentDate.format(a)==f?"#8BC34A":"transparent",g=this.currentDate.format(a)==f?"#fff":"#000";d=this.createSVGElement("circle",{id:"h-"+f,"class":"dtp-select-hour",style:"cursor:pointer",r:"30",cx:e,cy:c,fill:d,"data-hour":f});e=this.createSVGElement("text",
+{id:"th-"+f,"class":"dtp-select-hour-text","text-anchor":"middle",style:"cursor:pointer","font-weight":"bold","font-size":"20",x:e,y:c+7,fill:g,"data-hour":f});e.textContent=0===f?this.params.shortTime?12:f:f;this.toggleTime(f,!0)?(d.addEventListener("click",this._onSelectHour.bind(this)),e.addEventListener("click",this._onSelectHour.bind(this))):(d.className+=" disabled",e.className+=" disabled",e.setAttribute("fill","#bdbdbd"));b.appendChild(d);b.appendChild(e)}if(!this.params.shortTime){for(f=
+0;12>f;f++)e=-(110*Math.sin(f/12*-Math.PI*2)),c=-(110*Math.cos(f/12*-Math.PI*2)),d=this.currentDate.format(a)==f+12?"#8BC34A":"transparent",g=this.currentDate.format(a)==f+12?"#fff":"#000",d=this.createSVGElement("circle",{id:"h-"+(f+12),"class":"dtp-select-hour",style:"cursor:pointer",r:"30",cx:e,cy:c,fill:d,"data-hour":f+12}),e=this.createSVGElement("text",{id:"th-"+(f+12),"class":"dtp-select-hour-text","text-anchor":"middle",style:"cursor:pointer","font-weight":"bold","font-size":"22",x:e,y:c+
+7,fill:g,"data-hour":f+12}),e.textContent=f+12,this.toggleTime(f+12,!0)?(d.addEventListener("click",this._onSelectHour.bind(this)),e.addEventListener("click",this._onSelectHour.bind(this))):(d.className+=" disabled",e.className+=" disabled",e.setAttribute("fill","#bdbdbd")),b.appendChild(d),b.appendChild(e);this.$dtpElement.find("a.dtp-meridien-am").addClass("hidden");this.$dtpElement.find("a.dtp-meridien-pm").addClass("hidden")}this._centerBox()},initMinutes:function(){this.currentView=2;this.showTime(this.currentDate);
+this.initMeridienButtons();12>this.currentDate.hour()?this.$dtpElement.find("a.dtp-meridien-am").click():this.$dtpElement.find("a.dtp-meridien-pm").click();this.$dtpElement.find(".dtp-picker-calendar").addClass("hidden");this.$dtpElement.find(".dtp-picker-datetime").removeClass("hidden");for(var a=this.createSVGClock(!1),b=0;60>b;b++){var f=0===b%5?162:158,e=0===b%5?30:20,c=-(f*Math.sin(b/60*-Math.PI*2));f=-(f*Math.cos(b/60*-Math.PI*2));var d=this.currentDate.format("m")==b?"#8BC34A":"transparent";
+e=this.createSVGElement("circle",{id:"m-"+b,"class":"dtp-select-minute",style:"cursor:pointer",r:e,cx:c,cy:f,fill:d,"data-minute":b});this.toggleTime(b,!1)?e.addEventListener("click",this._onSelectMinute.bind(this)):e.className+=" disabled";a.appendChild(e)}for(b=0;60>b;b++)0===b%5&&(c=-(162*Math.sin(b/60*-Math.PI*2)),f=-(162*Math.cos(b/60*-Math.PI*2)),d=this.currentDate.format("m")==b?"#fff":"#000",e=this.createSVGElement("text",{id:"tm-"+b,"class":"dtp-select-minute-text","text-anchor":"middle",
+style:"cursor:pointer","font-weight":"bold","font-size":"20",x:c,y:f+7,fill:d,"data-minute":b}),e.textContent=b,this.toggleTime(b,!1)?e.addEventListener("click",this._onSelectMinute.bind(this)):(e.className+=" disabled",e.setAttribute("fill","#bdbdbd")),a.appendChild(e));this._centerBox()},animateHands:function(){var a=this.currentDate.hour(),b=this.currentDate.minute();this.$dtpElement.find(".hour-hand")[0].setAttribute("transform","rotate("+360*a/12+")");this.$dtpElement.find(".minute-hand")[0].setAttribute("transform",
+"rotate("+360*b/60+")")},createSVGClock:function(a){var b=this.params.shortTime?-120:-90,f=this.createSVGElement("svg",{class:"svg-clock",viewBox:"0,0,400,400"}),e=this.createSVGElement("g",{transform:"translate(200,200) "}),c=this.createSVGElement("circle",{r:"192",fill:"#eee",stroke:"#bdbdbd","stroke-width":2}),d=this.createSVGElement("circle",{r:"15",fill:"#757575"});e.appendChild(c);a?(a=this.createSVGElement("line",{class:"minute-hand",x1:0,y1:0,x2:0,y2:-150,stroke:"#bdbdbd","stroke-width":2}),
+b=this.createSVGElement("line",{class:"hour-hand",x1:0,y1:0,x2:0,y2:b,stroke:"#8BC34A","stroke-width":8}),e.appendChild(a),e.appendChild(b)):(a=this.createSVGElement("line",{class:"minute-hand",x1:0,y1:0,x2:0,y2:-150,stroke:"#8BC34A","stroke-width":2}),b=this.createSVGElement("line",{class:"hour-hand",x1:0,y1:0,x2:0,y2:b,stroke:"#bdbdbd","stroke-width":8}),e.appendChild(b),e.appendChild(a));e.appendChild(d);f.appendChild(e);this.$dtpElement.find("#dtp-svg-clock").empty();this.$dtpElement.find("#dtp-svg-clock")[0].appendChild(f);
+this.animateHands();return e},createSVGElement:function(a,b){a=document.createElementNS("http://www.w3.org/2000/svg",a);for(var f in b)a.setAttribute(f,b[f]);return a},isAfterMinDate:function(a,b,f){var c=!0;"undefined"!==typeof this.minDate&&null!==this.minDate&&(c=d(this.minDate),a=d(a),b||f||(c.hour(0),c.minute(0),a.hour(0),a.minute(0)),c.second(0),a.second(0),c.millisecond(0),a.millisecond(0),f||(a.minute(0),c.minute(0)),c=parseInt(a.format("X"))>=parseInt(c.format("X")));return c},isBeforeMaxDate:function(a,
+b,c){var f=!0;"undefined"!==typeof this.maxDate&&null!==this.maxDate&&(f=d(this.maxDate),a=d(a),b||c||(f.hour(0),f.minute(0),a.hour(0),a.minute(0)),f.second(0),a.second(0),f.millisecond(0),a.millisecond(0),c||(a.minute(0),f.minute(0)),f=parseInt(a.format("X"))<=parseInt(f.format("X")));return f},rotateElement:function(a,b){c(a).css({WebkitTransform:"rotate("+b+"deg)","-moz-transform":"rotate("+b+"deg)"})},showDate:function(a){a&&(this.$dtpElement.find(".dtp-actual-day").html(a.locale(this.params.lang).format("dddd")),
+this.$dtpElement.find(".dtp-actual-month").html(a.locale(this.params.lang).format("MMM").toUpperCase()),this.$dtpElement.find(".dtp-actual-num").html(a.locale(this.params.lang).format("DD")),this.$dtpElement.find(".dtp-actual-year").html(a.locale(this.params.lang).format("YYYY")))},showTime:function(a){if(a){var b=a.minute();b=(this.params.shortTime?a.format("hh"):a.format("HH"))+":"+(2==b.toString().length?b:"0"+b)+(this.params.shortTime?" "+a.format("A"):"");this.params.date?this.$dtpElement.find(".dtp-actual-time").html(b):
+(this.params.shortTime?this.$dtpElement.find(".dtp-actual-day").html(a.format("A")):this.$dtpElement.find(".dtp-actual-day").html("&nbsp;"),this.$dtpElement.find(".dtp-actual-maxtime").html(b))}},selectDate:function(a){a&&(this.currentDate.date(a),this.showDate(this.currentDate),this.$element.trigger("dateSelected",this.currentDate))},generateCalendar:function(a){var b={};if(null!==a){var c=d(a).locale(this.params.lang).startOf("month");a=d(a).locale(this.params.lang).endOf("month");var e=c.format("d");
+b.week=this.days;b.days=[];for(var g=c.date();g<=a.date();g++){if(g===c.date()){var h=b.week.indexOf(e.toString());if(0<h)for(var k=0;k<h;k++)b.days.push(0)}b.days.push(d(c).locale(this.params.lang).date(g))}}return b},constructHTMLCalendar:function(a,b){a='<div class="dtp-picker-month">'+a.locale(this.params.lang).format("MMMM YYYY")+"</div>";a+='<table class="table dtp-picker-days"><thead>';for(var c=0;c<b.week.length;c++)a+="<th>"+d(parseInt(b.week[c]),"d").locale(this.params.lang).format("dd").substring(0,
+1)+"</th>";a+="</thead><tbody><tr>";for(c=0;c<b.days.length;c++)0==c%7&&(a+="</tr><tr>"),a+='<td data-date="'+d(b.days[c]).locale(this.params.lang).format("D")+'">',0!=b.days[c]&&(a=!1===this.isBeforeMaxDate(d(b.days[c]),!1,!1)||!1===this.isAfterMinDate(d(b.days[c]),!1,!1)?a+('<span class="dtp-select-day">'+d(b.days[c]).locale(this.params.lang).format("DD")+"</span>"):d(b.days[c]).locale(this.params.lang).format("DD")===d(this.currentDate).locale(this.params.lang).format("DD")?a+('<a href="javascript:void(0);" class="dtp-select-day selected">'+
+d(b.days[c]).locale(this.params.lang).format("DD")+"</a>"):a+('<a href="javascript:void(0);" class="dtp-select-day">'+d(b.days[c]).locale(this.params.lang).format("DD")+"</a>"),a+="</td>");return a+"</tr></tbody></table>"},setName:function(){for(var a="",b=0;5>b;b++)a+="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789".charAt(Math.floor(62*Math.random()));return a},isPM:function(){return this.$dtpElement.find("a.dtp-meridien-pm").hasClass("selected")},setElementValue:function(){this.$element.trigger("beforeChange",
+this.currentDate);this.$element.hasClass("mdl-textfield__input")&&(this.$element.removeClass("empty"),this.$element.parent().addClass("is-dirty"));this.$element.val(d(this.currentDate).locale(this.params.lang).format(this.params.format));this.$element.trigger("change",this.currentDate)},toggleButtons:function(a){if(a&&a.isValid()){var b=d(a).locale(this.params.lang).startOf("month"),c=d(a).locale(this.params.lang).endOf("month");this.isAfterMinDate(b,!1,!1)?this.$dtpElement.find("a.dtp-select-month-before").removeClass("invisible"):
+this.$dtpElement.find("a.dtp-select-month-before").addClass("invisible");this.isBeforeMaxDate(c,!1,!1)?this.$dtpElement.find("a.dtp-select-month-after").removeClass("invisible"):this.$dtpElement.find("a.dtp-select-month-after").addClass("invisible");b=d(a).locale(this.params.lang).startOf("year");a=d(a).locale(this.params.lang).endOf("year");this.isAfterMinDate(b,!1,!1)?this.$dtpElement.find("a.dtp-select-year-before").removeClass("invisible"):this.$dtpElement.find("a.dtp-select-year-before").addClass("invisible");
+this.isBeforeMaxDate(a,!1,!1)?this.$dtpElement.find("a.dtp-select-year-after").removeClass("invisible"):this.$dtpElement.find("a.dtp-select-year-after").addClass("invisible")}},toggleTime:function(a,b){b?(b=d(this.currentDate),b.hour(this.convertHours(a)).minute(0).second(0),a=!(!1===this.isAfterMinDate(b,!0,!1)||!1===this.isBeforeMaxDate(b,!0,!1))):(b=d(this.currentDate),b.minute(a).second(0),a=!(!1===this.isAfterMinDate(b,!0,!0)||!1===this.isBeforeMaxDate(b,!0,!0)));return a},_attachEvent:function(a,
+b,c){a.on(b,null,null,c);this._attachedEvents.push([a,b,c])},_detachEvents:function(){for(var a=this._attachedEvents.length-1;0<=a;a--)this._attachedEvents[a][0].off(this._attachedEvents[a][1],this._attachedEvents[a][2]),this._attachedEvents.splice(a,1)},_fireCalendar:function(){this.currentView=0;this.$element.blur();this.initDates();this.show();this.params.date?(this.$dtpElement.find(".dtp-date").removeClass("hidden"),this.initDate()):this.params.time&&(this.$dtpElement.find(".dtp-time").removeClass("hidden"),
+this.initHours())},_onBackgroundClick:function(a){a.stopPropagation();this.hide()},_onElementClick:function(a){a.stopPropagation()},_onKeydown:function(a){27===a.which&&this.hide()},_onCloseClick:function(){this.hide()},_onClearClick:function(){this.currentDate=null;this.$element.trigger("beforeChange",this.currentDate);this.hide();"undefined"!==typeof c.material&&this.$element.addClass("empty");this.$element.val("");this.$element.trigger("change",this.currentDate)},_onNowClick:function(){this.currentDate=
+d();!0===this.params.date&&(this.showDate(this.currentDate),0===this.currentView&&this.initDate());if(!0===this.params.time){this.showTime(this.currentDate);switch(this.currentView){case 1:this.initHours();break;case 2:this.initMinutes()}this.animateHands()}},_onOKClick:function(){switch(this.currentView){case 0:!0===this.params.time?this.initHours():(this.setElementValue(),this.hide());break;case 1:this.initMinutes();break;case 2:this.setElementValue(),this.hide()}},_onCancelClick:function(){if(this.params.time)switch(this.currentView){case 0:this.hide();
+break;case 1:this.params.date?this.initDate():this.hide();break;case 2:this.initHours()}else this.hide()},_onMonthBeforeClick:function(){this.currentDate.subtract(1,"months");this.initDate(this.currentDate)},_onMonthAfterClick:function(){this.currentDate.add(1,"months");this.initDate(this.currentDate)},_onYearBeforeClick:function(){this.currentDate.subtract(1,"years");this.initDate(this.currentDate)},_onYearAfterClick:function(){this.currentDate.add(1,"years");this.initDate(this.currentDate)},_onSelectDate:function(a){this.$dtpElement.find("a.dtp-select-day").removeClass("selected");
+c(a.currentTarget).addClass("selected");this.selectDate(c(a.currentTarget).parent().data("date"));!0===this.params.switchOnClick&&!0===this.params.time&&setTimeout(this.initHours.bind(this),200);!0===this.params.switchOnClick&&!1===this.params.time&&setTimeout(this._onOKClick.bind(this),200)},_onSelectHour:function(a){if(!c(a.target).hasClass("disabled")){var b=c(a.target).data("hour");a=c(a.target).parent();for(var d=a.find(".dtp-select-hour"),e=0;e<d.length;e++)c(d[e]).attr("fill","transparent");
+d=a.find(".dtp-select-hour-text");for(e=0;e<d.length;e++)c(d[e]).attr("fill","#000");c(a.find("#h-"+b)).attr("fill","#8BC34A");c(a.find("#th-"+b)).attr("fill","#fff");this.currentDate.hour(parseInt(b));!0===this.params.shortTime&&this.isPM()&&this.currentDate.add(12,"hours");this.showTime(this.currentDate);this.animateHands();!0===this.params.switchOnClick&&setTimeout(this.initMinutes.bind(this),200)}},_onSelectMinute:function(a){if(!c(a.target).hasClass("disabled")){var b=c(a.target).data("minute");
+a=c(a.target).parent();for(var d=a.find(".dtp-select-minute"),e=0;e<d.length;e++)c(d[e]).attr("fill","transparent");d=a.find(".dtp-select-minute-text");for(e=0;e<d.length;e++)c(d[e]).attr("fill","#000");c(a.find("#m-"+b)).attr("fill","#8BC34A");c(a.find("#tm-"+b)).attr("fill","#fff");this.currentDate.minute(parseInt(b));this.showTime(this.currentDate);this.animateHands();!0===this.params.switchOnClick&&setTimeout(function(){this.setElementValue();this.hide()}.bind(this),200)}},_onSelectAM:function(a){c(".dtp-actual-meridien").find("a").removeClass("selected");
+c(a.currentTarget).addClass("selected");12<=this.currentDate.hour()&&this.currentDate.subtract(12,"hours")&&this.showTime(this.currentDate);this.toggleTime(1===this.currentView)},_onSelectPM:function(a){c(".dtp-actual-meridien").find("a").removeClass("selected");c(a.currentTarget).addClass("selected");12>this.currentDate.hour()&&this.currentDate.add(12,"hours")&&this.showTime(this.currentDate);this.toggleTime(1===this.currentView)},convertHours:function(a){var b=a;!0===this.params.shortTime&&12>a&&
+this.isPM()&&(b+=12);return b},setDate:function(a){this.params.currentDate=a;this.initDates()},setMinDate:function(a){this.params.minDate=a;this.initDates()},setMaxDate:function(a){this.params.maxDate=a;this.initDates()},destroy:function(){this._detachEvents();this.$dtpElement.remove()},show:function(){this.$dtpElement.removeClass("hidden");this._attachEvent(c(window),"keydown",this._onKeydown.bind(this));this._centerBox()},hide:function(){c(window).off("keydown",null,null,this._onKeydown.bind(this));
+this.$dtpElement.addClass("hidden")},_centerBox:function(){var a=(this.$dtpElement.height()-this.$dtpElement.find(".dtp-content").height())/2;this.$dtpElement.find(".dtp-content").css("marginLeft",-(this.$dtpElement.find(".dtp-content").width()/2)+"px");this.$dtpElement.find(".dtp-content").css("top",a+"px")},enableDays:function(){var a=this.params.enableDays;a&&c(".dtp-picker-days tbody tr td").each(function(){0<=c.inArray(c(this).index(),a)||c(this).find("a").css({background:"#e3e3e3",cursor:"no-drop",
+opacity:"0.5"}).off("click")})}}})(jQuery,moment);
diff --git a/app/modules/web/themes/material-dark/js/material.js b/app/modules/web/themes/material-dark/js/material.js
new file mode 100644
index 000000000..994825a4b
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/material.js
@@ -0,0 +1,3996 @@
+;(function() {
+"use strict";
+
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * A component handler interface using the revealing module design pattern.
+ * More details on this design pattern here:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @author Jason Mayes.
+ */
+/* exported componentHandler */
+
+// Pre-defining the componentHandler interface, for closure documentation and
+// static verification.
+var componentHandler = {
+  /**
+   * Searches existing DOM for elements of our component type and upgrades them
+   * if they have not already been upgraded.
+   *
+   * @param {string=} optJsClass the programatic name of the element class we
+   * need to create a new instance of.
+   * @param {string=} optCssClass the name of the CSS class elements of this
+   * type will have.
+   */
+  upgradeDom: function(optJsClass, optCssClass) {},
+  /**
+   * Upgrades a specific element rather than all in the DOM.
+   *
+   * @param {!Element} element The element we wish to upgrade.
+   * @param {string=} optJsClass Optional name of the class we want to upgrade
+   * the element to.
+   */
+  upgradeElement: function(element, optJsClass) {},
+  /**
+   * Upgrades a specific list of elements rather than all in the DOM.
+   *
+   * @param {!Element|!Array<!Element>|!NodeList|!HTMLCollection} elements
+   * The elements we wish to upgrade.
+   */
+  upgradeElements: function(elements) {},
+  /**
+   * Upgrades all registered components found in the current DOM. This is
+   * automatically called on window load.
+   */
+  upgradeAllRegistered: function() {},
+  /**
+   * Allows user to be alerted to any upgrades that are performed for a given
+   * component type
+   *
+   * @param {string} jsClass The class name of the MDL component we wish
+   * to hook into for any upgrades performed.
+   * @param {function(!HTMLElement)} callback The function to call upon an
+   * upgrade. This function should expect 1 parameter - the HTMLElement which
+   * got upgraded.
+   */
+  registerUpgradedCallback: function(jsClass, callback) {},
+  /**
+   * Registers a class for future use and attempts to upgrade existing DOM.
+   *
+   * @param {componentHandler.ComponentConfigPublic} config the registration configuration
+   */
+  register: function(config) {},
+  /**
+   * Downgrade either a given node, an array of nodes, or a NodeList.
+   *
+   * @param {!Node|!Array<!Node>|!NodeList} nodes
+   */
+  downgradeElements: function(nodes) {}
+};
+
+componentHandler = (function() {
+  'use strict';
+
+  /** @type {!Array<componentHandler.ComponentConfig>} */
+  var registeredComponents_ = [];
+
+  /** @type {!Array<componentHandler.Component>} */
+  var createdComponents_ = [];
+
+  var componentConfigProperty_ = 'mdlComponentConfigInternal_';
+
+  /**
+   * Searches registered components for a class we are interested in using.
+   * Optionally replaces a match with passed object if specified.
+   *
+   * @param {string} name The name of a class we want to use.
+   * @param {componentHandler.ComponentConfig=} optReplace Optional object to replace match with.
+   * @return {!Object|boolean}
+   * @private
+   */
+  function findRegisteredClass_(name, optReplace) {
+    for (var i = 0; i < registeredComponents_.length; i++) {
+      if (registeredComponents_[i].className === name) {
+        if (typeof optReplace !== 'undefined') {
+          registeredComponents_[i] = optReplace;
+        }
+        return registeredComponents_[i];
+      }
+    }
+    return false;
+  }
+
+  /**
+   * Returns an array of the classNames of the upgraded classes on the element.
+   *
+   * @param {!Element} element The element to fetch data from.
+   * @return {!Array<string>}
+   * @private
+   */
+  function getUpgradedListOfElement_(element) {
+    var dataUpgraded = element.getAttribute('data-upgraded');
+    // Use `['']` as default value to conform the `,name,name...` style.
+    return dataUpgraded === null ? [''] : dataUpgraded.split(',');
+  }
+
+  /**
+   * Returns true if the given element has already been upgraded for the given
+   * class.
+   *
+   * @param {!Element} element The element we want to check.
+   * @param {string} jsClass The class to check for.
+   * @returns {boolean}
+   * @private
+   */
+  function isElementUpgraded_(element, jsClass) {
+    var upgradedList = getUpgradedListOfElement_(element);
+    return upgradedList.indexOf(jsClass) !== -1;
+  }
+
+  /**
+   * Create an event object.
+   *
+   * @param {string} eventType The type name of the event.
+   * @param {boolean} bubbles Whether the event should bubble up the DOM.
+   * @param {boolean} cancelable Whether the event can be canceled.
+   * @returns {!Event}
+   */
+  function createEvent_(eventType, bubbles, cancelable) {
+    if ('CustomEvent' in window && typeof window.CustomEvent === 'function') {
+      return new CustomEvent(eventType, {
+        bubbles: bubbles,
+        cancelable: cancelable
+      });
+    } else {
+      var ev = document.createEvent('Events');
+      ev.initEvent(eventType, bubbles, cancelable);
+      return ev;
+    }
+  }
+
+  /**
+   * Searches existing DOM for elements of our component type and upgrades them
+   * if they have not already been upgraded.
+   *
+   * @param {string=} optJsClass the programatic name of the element class we
+   * need to create a new instance of.
+   * @param {string=} optCssClass the name of the CSS class elements of this
+   * type will have.
+   */
+  function upgradeDomInternal(optJsClass, optCssClass) {
+    if (typeof optJsClass === 'undefined' &&
+        typeof optCssClass === 'undefined') {
+      for (var i = 0; i < registeredComponents_.length; i++) {
+        upgradeDomInternal(registeredComponents_[i].className,
+            registeredComponents_[i].cssClass);
+      }
+    } else {
+      var jsClass = /** @type {string} */ (optJsClass);
+      if (typeof optCssClass === 'undefined') {
+        var registeredClass = findRegisteredClass_(jsClass);
+        if (registeredClass) {
+          optCssClass = registeredClass.cssClass;
+        }
+      }
+
+      var elements = document.querySelectorAll('.' + optCssClass);
+      for (var n = 0; n < elements.length; n++) {
+        upgradeElementInternal(elements[n], jsClass);
+      }
+    }
+  }
+
+  /**
+   * Upgrades a specific element rather than all in the DOM.
+   *
+   * @param {!Element} element The element we wish to upgrade.
+   * @param {string=} optJsClass Optional name of the class we want to upgrade
+   * the element to.
+   */
+  function upgradeElementInternal(element, optJsClass) {
+    // Verify argument type.
+    if (!(typeof element === 'object' && element instanceof Element)) {
+      throw new Error('Invalid argument provided to upgrade MDL element.');
+    }
+    // Allow upgrade to be canceled by canceling emitted event.
+    var upgradingEv = createEvent_('mdl-componentupgrading', true, true);
+    element.dispatchEvent(upgradingEv);
+    if (upgradingEv.defaultPrevented) {
+      return;
+    }
+
+    var upgradedList = getUpgradedListOfElement_(element);
+    var classesToUpgrade = [];
+    // If jsClass is not provided scan the registered components to find the
+    // ones matching the element's CSS classList.
+    if (!optJsClass) {
+      var classList = element.classList;
+      registeredComponents_.forEach(function(component) {
+        // Match CSS & Not to be upgraded & Not upgraded.
+        if (classList.contains(component.cssClass) &&
+            classesToUpgrade.indexOf(component) === -1 &&
+            !isElementUpgraded_(element, component.className)) {
+          classesToUpgrade.push(component);
+        }
+      });
+    } else if (!isElementUpgraded_(element, optJsClass)) {
+      classesToUpgrade.push(findRegisteredClass_(optJsClass));
+    }
+
+    // Upgrade the element for each classes.
+    for (var i = 0, n = classesToUpgrade.length, registeredClass; i < n; i++) {
+      registeredClass = classesToUpgrade[i];
+      if (registeredClass) {
+        // Mark element as upgraded.
+        upgradedList.push(registeredClass.className);
+        element.setAttribute('data-upgraded', upgradedList.join(','));
+        var instance = new registeredClass.classConstructor(element);
+        instance[componentConfigProperty_] = registeredClass;
+        createdComponents_.push(instance);
+        // Call any callbacks the user has registered with this component type.
+        for (var j = 0, m = registeredClass.callbacks.length; j < m; j++) {
+          registeredClass.callbacks[j](element);
+        }
+
+        if (registeredClass.widget) {
+          // Assign per element instance for control over API
+          element[registeredClass.className] = instance;
+        }
+      } else {
+        throw new Error(
+          'Unable to find a registered component for the given class.');
+      }
+
+      var upgradedEv = createEvent_('mdl-componentupgraded', true, false);
+      element.dispatchEvent(upgradedEv);
+    }
+  }
+
+  /**
+   * Upgrades a specific list of elements rather than all in the DOM.
+   *
+   * @param {!Element|!Array<!Element>|!NodeList|!HTMLCollection} elements
+   * The elements we wish to upgrade.
+   */
+  function upgradeElementsInternal(elements) {
+    if (!Array.isArray(elements)) {
+      if (elements instanceof Element) {
+        elements = [elements];
+      } else {
+        elements = Array.prototype.slice.call(elements);
+      }
+    }
+    for (var i = 0, n = elements.length, element; i < n; i++) {
+      element = elements[i];
+      if (element instanceof HTMLElement) {
+        upgradeElementInternal(element);
+        if (element.children.length > 0) {
+          upgradeElementsInternal(element.children);
+        }
+      }
+    }
+  }
+
+  /**
+   * Registers a class for future use and attempts to upgrade existing DOM.
+   *
+   * @param {componentHandler.ComponentConfigPublic} config
+   */
+  function registerInternal(config) {
+    // In order to support both Closure-compiled and uncompiled code accessing
+    // this method, we need to allow for both the dot and array syntax for
+    // property access. You'll therefore see the `foo.bar || foo['bar']`
+    // pattern repeated across this method.
+    var widgetMissing = (typeof config.widget === 'undefined' &&
+        typeof config['widget'] === 'undefined');
+    var widget = true;
+
+    if (!widgetMissing) {
+      widget = config.widget || config['widget'];
+    }
+
+    var newConfig = /** @type {componentHandler.ComponentConfig} */ ({
+      classConstructor: config.constructor || config['constructor'],
+      className: config.classAsString || config['classAsString'],
+      cssClass: config.cssClass || config['cssClass'],
+      widget: widget,
+      callbacks: []
+    });
+
+    registeredComponents_.forEach(function(item) {
+      if (item.cssClass === newConfig.cssClass) {
+        throw new Error('The provided cssClass has already been registered: ' + item.cssClass);
+      }
+      if (item.className === newConfig.className) {
+        throw new Error('The provided className has already been registered');
+      }
+    });
+
+    if (config.constructor.prototype
+        .hasOwnProperty(componentConfigProperty_)) {
+      throw new Error(
+          'MDL component classes must not have ' + componentConfigProperty_ +
+          ' defined as a property.');
+    }
+
+    var found = findRegisteredClass_(config.classAsString, newConfig);
+
+    if (!found) {
+      registeredComponents_.push(newConfig);
+    }
+  }
+
+  /**
+   * Allows user to be alerted to any upgrades that are performed for a given
+   * component type
+   *
+   * @param {string} jsClass The class name of the MDL component we wish
+   * to hook into for any upgrades performed.
+   * @param {function(!HTMLElement)} callback The function to call upon an
+   * upgrade. This function should expect 1 parameter - the HTMLElement which
+   * got upgraded.
+   */
+  function registerUpgradedCallbackInternal(jsClass, callback) {
+    var regClass = findRegisteredClass_(jsClass);
+    if (regClass) {
+      regClass.callbacks.push(callback);
+    }
+  }
+
+  /**
+   * Upgrades all registered components found in the current DOM. This is
+   * automatically called on window load.
+   */
+  function upgradeAllRegisteredInternal() {
+    for (var n = 0; n < registeredComponents_.length; n++) {
+      upgradeDomInternal(registeredComponents_[n].className);
+    }
+  }
+
+  /**
+   * Check the component for the downgrade method.
+   * Execute if found.
+   * Remove component from createdComponents list.
+   *
+   * @param {?componentHandler.Component} component
+   */
+  function deconstructComponentInternal(component) {
+    if (component) {
+      var componentIndex = createdComponents_.indexOf(component);
+      createdComponents_.splice(componentIndex, 1);
+
+      var upgrades = component.element_.getAttribute('data-upgraded').split(',');
+      var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);
+      upgrades.splice(componentPlace, 1);
+      component.element_.setAttribute('data-upgraded', upgrades.join(','));
+
+      var ev = createEvent_('mdl-componentdowngraded', true, false);
+      component.element_.dispatchEvent(ev);
+    }
+  }
+
+  /**
+   * Downgrade either a given node, an array of nodes, or a NodeList.
+   *
+   * @param {!Node|!Array<!Node>|!NodeList} nodes
+   */
+  function downgradeNodesInternal(nodes) {
+    /**
+     * Auxiliary function to downgrade a single node.
+     * @param  {!Node} node the node to be downgraded
+     */
+    var downgradeNode = function(node) {
+      createdComponents_.filter(function(item) {
+        return item.element_ === node;
+      }).forEach(deconstructComponentInternal);
+    };
+    if (nodes instanceof Array || nodes instanceof NodeList) {
+      for (var n = 0; n < nodes.length; n++) {
+        downgradeNode(nodes[n]);
+      }
+    } else if (nodes instanceof Node) {
+      downgradeNode(nodes);
+    } else {
+      throw new Error('Invalid argument provided to downgrade MDL nodes.');
+    }
+  }
+
+  // Now return the functions that should be made public with their publicly
+  // facing names...
+  return {
+    upgradeDom: upgradeDomInternal,
+    upgradeElement: upgradeElementInternal,
+    upgradeElements: upgradeElementsInternal,
+    upgradeAllRegistered: upgradeAllRegisteredInternal,
+    registerUpgradedCallback: registerUpgradedCallbackInternal,
+    register: registerInternal,
+    downgradeElements: downgradeNodesInternal
+  };
+})();
+
+/**
+ * Describes the type of a registered component type managed by
+ * componentHandler. Provided for benefit of the Closure compiler.
+ *
+ * @typedef {{
+ *   constructor: Function,
+ *   classAsString: string,
+ *   cssClass: string,
+ *   widget: (string|boolean|undefined)
+ * }}
+ */
+componentHandler.ComponentConfigPublic;  // jshint ignore:line
+
+/**
+ * Describes the type of a registered component type managed by
+ * componentHandler. Provided for benefit of the Closure compiler.
+ *
+ * @typedef {{
+ *   constructor: !Function,
+ *   className: string,
+ *   cssClass: string,
+ *   widget: (string|boolean),
+ *   callbacks: !Array<function(!HTMLElement)>
+ * }}
+ */
+componentHandler.ComponentConfig;  // jshint ignore:line
+
+/**
+ * Created component (i.e., upgraded element) type as managed by
+ * componentHandler. Provided for benefit of the Closure compiler.
+ *
+ * @typedef {{
+ *   element_: !HTMLElement,
+ *   className: string,
+ *   classAsString: string,
+ *   cssClass: string,
+ *   widget: string
+ * }}
+ */
+componentHandler.Component;  // jshint ignore:line
+
+// Export all symbols, for the benefit of Closure compiler.
+// No effect on uncompiled code.
+componentHandler['upgradeDom'] = componentHandler.upgradeDom;
+componentHandler['upgradeElement'] = componentHandler.upgradeElement;
+componentHandler['upgradeElements'] = componentHandler.upgradeElements;
+componentHandler['upgradeAllRegistered'] =
+    componentHandler.upgradeAllRegistered;
+componentHandler['registerUpgradedCallback'] =
+    componentHandler.registerUpgradedCallback;
+componentHandler['register'] = componentHandler.register;
+componentHandler['downgradeElements'] = componentHandler.downgradeElements;
+window.componentHandler = componentHandler;
+window['componentHandler'] = componentHandler;
+
+window.addEventListener('load', function() {
+  'use strict';
+
+  /**
+   * Performs a "Cutting the mustard" test. If the browser supports the features
+   * tested, adds a mdl-js class to the <html> element. It then upgrades all MDL
+   * components requiring JavaScript.
+   */
+  if ('classList' in document.createElement('div') &&
+      'querySelector' in document &&
+      'addEventListener' in window && Array.prototype.forEach) {
+    document.documentElement.classList.add('mdl-js');
+    componentHandler.upgradeAllRegistered();
+  } else {
+    /**
+     * Dummy function to avoid JS errors.
+     */
+    componentHandler.upgradeElement = function() {};
+    /**
+     * Dummy function to avoid JS errors.
+     */
+    componentHandler.register = function() {};
+  }
+});
+
+// Source: https://github.com/darius/requestAnimationFrame/blob/master/requestAnimationFrame.js
+// Adapted from https://gist.github.com/paulirish/1579671 which derived from
+// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
+// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating
+// requestAnimationFrame polyfill by Erik Möller.
+// Fixes from Paul Irish, Tino Zijdel, Andrew Mao, Klemen Slavič, Darius Bacon
+// MIT license
+if (!Date.now) {
+    /**
+     * Date.now polyfill.
+     * @return {number} the current Date
+     */
+    Date.now = function () {
+        return new Date().getTime();
+    };
+    Date['now'] = Date.now;
+}
+var vendors = [
+    'webkit',
+    'moz'
+];
+for (var i = 0; i < vendors.length && !window.requestAnimationFrame; ++i) {
+    var vp = vendors[i];
+    window.requestAnimationFrame = window[vp + 'RequestAnimationFrame'];
+    window.cancelAnimationFrame = window[vp + 'CancelAnimationFrame'] || window[vp + 'CancelRequestAnimationFrame'];
+    window['requestAnimationFrame'] = window.requestAnimationFrame;
+    window['cancelAnimationFrame'] = window.cancelAnimationFrame;
+}
+if (/iP(ad|hone|od).*OS 6/.test(window.navigator.userAgent) || !window.requestAnimationFrame || !window.cancelAnimationFrame) {
+    var lastTime = 0;
+    /**
+     * requestAnimationFrame polyfill.
+     * @param  {!Function} callback the callback function.
+     */
+    window.requestAnimationFrame = function (callback) {
+        var now = Date.now();
+        var nextTime = Math.max(lastTime + 16, now);
+        return setTimeout(function () {
+            callback(lastTime = nextTime);
+        }, nextTime - now);
+    };
+    window.cancelAnimationFrame = clearTimeout;
+    window['requestAnimationFrame'] = window.requestAnimationFrame;
+    window['cancelAnimationFrame'] = window.cancelAnimationFrame;
+}
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Button MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialButton = function MaterialButton(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialButton'] = MaterialButton;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialButton.prototype.Constant_ = {};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialButton.prototype.CssClasses_ = {
+    RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+    RIPPLE_CONTAINER: 'mdl-button__ripple-container',
+    RIPPLE: 'mdl-ripple'
+};
+/**
+   * Handle blur of element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialButton.prototype.blurHandler_ = function (event) {
+    if (event) {
+        this.element_.blur();
+    }
+};
+// Public methods.
+/**
+   * Disable button.
+   *
+   * @public
+   */
+MaterialButton.prototype.disable = function () {
+    this.element_.disabled = true;
+};
+MaterialButton.prototype['disable'] = MaterialButton.prototype.disable;
+/**
+   * Enable button.
+   *
+   * @public
+   */
+MaterialButton.prototype.enable = function () {
+    this.element_.disabled = false;
+};
+MaterialButton.prototype['enable'] = MaterialButton.prototype.enable;
+/**
+   * Initialize element.
+   */
+MaterialButton.prototype.init = function () {
+    if (this.element_) {
+        if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+            var rippleContainer = document.createElement('span');
+            rippleContainer.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+            this.rippleElement_ = document.createElement('span');
+            this.rippleElement_.classList.add(this.CssClasses_.RIPPLE);
+            rippleContainer.appendChild(this.rippleElement_);
+            this.boundRippleBlurHandler = this.blurHandler_.bind(this);
+            this.rippleElement_.addEventListener('mouseup', this.boundRippleBlurHandler);
+            this.element_.appendChild(rippleContainer);
+        }
+        this.boundButtonBlurHandler = this.blurHandler_.bind(this);
+        this.element_.addEventListener('mouseup', this.boundButtonBlurHandler);
+        this.element_.addEventListener('mouseleave', this.boundButtonBlurHandler);
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialButton,
+    classAsString: 'MaterialButton',
+    cssClass: 'mdl-js-button',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Checkbox MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialCheckbox = function MaterialCheckbox(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialCheckbox'] = MaterialCheckbox;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialCheckbox.prototype.Constant_ = { TINY_TIMEOUT: 0.001 };
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialCheckbox.prototype.CssClasses_ = {
+    INPUT: 'mdl-checkbox__input',
+    BOX_OUTLINE: 'mdl-checkbox__box-outline',
+    FOCUS_HELPER: 'mdl-checkbox__focus-helper',
+    TICK_OUTLINE: 'mdl-checkbox__tick-outline',
+    RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+    RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+    RIPPLE_CONTAINER: 'mdl-checkbox__ripple-container',
+    RIPPLE_CENTER: 'mdl-ripple--center',
+    RIPPLE: 'mdl-ripple',
+    IS_FOCUSED: 'is-focused',
+    IS_DISABLED: 'is-disabled',
+    IS_CHECKED: 'is-checked',
+    IS_UPGRADED: 'is-upgraded'
+};
+/**
+   * Handle change of state.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialCheckbox.prototype.onChange_ = function (event) {
+    this.updateClasses_();
+};
+/**
+   * Handle focus of element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialCheckbox.prototype.onFocus_ = function (event) {
+    this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle lost focus of element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialCheckbox.prototype.onBlur_ = function (event) {
+    this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle mouseup.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialCheckbox.prototype.onMouseUp_ = function (event) {
+    this.blur_();
+};
+/**
+   * Handle class updates.
+   *
+   * @private
+   */
+MaterialCheckbox.prototype.updateClasses_ = function () {
+    this.checkDisabled();
+    this.checkToggleState();
+};
+/**
+   * Add blur.
+   *
+   * @private
+   */
+MaterialCheckbox.prototype.blur_ = function () {
+    // TODO: figure out why there's a focus event being fired after our blur,
+    // so that we can avoid this hack.
+    window.setTimeout(function () {
+        this.inputElement_.blur();
+    }.bind(this), this.Constant_.TINY_TIMEOUT);
+};
+// Public methods.
+/**
+   * Check the inputs toggle state and update display.
+   *
+   * @public
+   */
+MaterialCheckbox.prototype.checkToggleState = function () {
+    if (this.inputElement_.checked) {
+        this.element_.classList.add(this.CssClasses_.IS_CHECKED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_CHECKED);
+    }
+};
+MaterialCheckbox.prototype['checkToggleState'] = MaterialCheckbox.prototype.checkToggleState;
+/**
+   * Check the inputs disabled state and update display.
+   *
+   * @public
+   */
+MaterialCheckbox.prototype.checkDisabled = function () {
+    if (this.inputElement_.disabled) {
+        this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+    }
+};
+MaterialCheckbox.prototype['checkDisabled'] = MaterialCheckbox.prototype.checkDisabled;
+/**
+   * Disable checkbox.
+   *
+   * @public
+   */
+MaterialCheckbox.prototype.disable = function () {
+    this.inputElement_.disabled = true;
+    this.updateClasses_();
+};
+MaterialCheckbox.prototype['disable'] = MaterialCheckbox.prototype.disable;
+/**
+   * Enable checkbox.
+   *
+   * @public
+   */
+MaterialCheckbox.prototype.enable = function () {
+    this.inputElement_.disabled = false;
+    this.updateClasses_();
+};
+MaterialCheckbox.prototype['enable'] = MaterialCheckbox.prototype.enable;
+/**
+   * Check checkbox.
+   *
+   * @public
+   */
+MaterialCheckbox.prototype.check = function () {
+    this.inputElement_.checked = true;
+    this.updateClasses_();
+};
+MaterialCheckbox.prototype['check'] = MaterialCheckbox.prototype.check;
+/**
+   * Uncheck checkbox.
+   *
+   * @public
+   */
+MaterialCheckbox.prototype.uncheck = function () {
+    this.inputElement_.checked = false;
+    this.updateClasses_();
+};
+MaterialCheckbox.prototype['uncheck'] = MaterialCheckbox.prototype.uncheck;
+/**
+   * Initialize element.
+   */
+MaterialCheckbox.prototype.init = function () {
+    if (this.element_) {
+        this.inputElement_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);
+        var boxOutline = document.createElement('span');
+        boxOutline.classList.add(this.CssClasses_.BOX_OUTLINE);
+        var tickContainer = document.createElement('span');
+        tickContainer.classList.add(this.CssClasses_.FOCUS_HELPER);
+        var tickOutline = document.createElement('span');
+        tickOutline.classList.add(this.CssClasses_.TICK_OUTLINE);
+        boxOutline.appendChild(tickOutline);
+        this.element_.appendChild(tickContainer);
+        this.element_.appendChild(boxOutline);
+        if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+            this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+            this.rippleContainerElement_ = document.createElement('span');
+            this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+            this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT);
+            this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);
+            this.boundRippleMouseUp = this.onMouseUp_.bind(this);
+            this.rippleContainerElement_.addEventListener('mouseup', this.boundRippleMouseUp);
+            var ripple = document.createElement('span');
+            ripple.classList.add(this.CssClasses_.RIPPLE);
+            this.rippleContainerElement_.appendChild(ripple);
+            this.element_.appendChild(this.rippleContainerElement_);
+        }
+        this.boundInputOnChange = this.onChange_.bind(this);
+        this.boundInputOnFocus = this.onFocus_.bind(this);
+        this.boundInputOnBlur = this.onBlur_.bind(this);
+        this.boundElementMouseUp = this.onMouseUp_.bind(this);
+        this.inputElement_.addEventListener('change', this.boundInputOnChange);
+        this.inputElement_.addEventListener('focus', this.boundInputOnFocus);
+        this.inputElement_.addEventListener('blur', this.boundInputOnBlur);
+        this.element_.addEventListener('mouseup', this.boundElementMouseUp);
+        this.updateClasses_();
+        this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialCheckbox,
+    classAsString: 'MaterialCheckbox',
+    cssClass: 'mdl-js-checkbox',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for icon toggle MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialIconToggle = function MaterialIconToggle(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialIconToggle'] = MaterialIconToggle;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialIconToggle.prototype.Constant_ = { TINY_TIMEOUT: 0.001 };
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialIconToggle.prototype.CssClasses_ = {
+    INPUT: 'mdl-icon-toggle__input',
+    JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+    RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+    RIPPLE_CONTAINER: 'mdl-icon-toggle__ripple-container',
+    RIPPLE_CENTER: 'mdl-ripple--center',
+    RIPPLE: 'mdl-ripple',
+    IS_FOCUSED: 'is-focused',
+    IS_DISABLED: 'is-disabled',
+    IS_CHECKED: 'is-checked'
+};
+/**
+   * Handle change of state.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialIconToggle.prototype.onChange_ = function (event) {
+    this.updateClasses_();
+};
+/**
+   * Handle focus of element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialIconToggle.prototype.onFocus_ = function (event) {
+    this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle lost focus of element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialIconToggle.prototype.onBlur_ = function (event) {
+    this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle mouseup.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialIconToggle.prototype.onMouseUp_ = function (event) {
+    this.blur_();
+};
+/**
+   * Handle class updates.
+   *
+   * @private
+   */
+MaterialIconToggle.prototype.updateClasses_ = function () {
+    this.checkDisabled();
+    this.checkToggleState();
+};
+/**
+   * Add blur.
+   *
+   * @private
+   */
+MaterialIconToggle.prototype.blur_ = function () {
+    // TODO: figure out why there's a focus event being fired after our blur,
+    // so that we can avoid this hack.
+    window.setTimeout(function () {
+        this.inputElement_.blur();
+    }.bind(this), this.Constant_.TINY_TIMEOUT);
+};
+// Public methods.
+/**
+   * Check the inputs toggle state and update display.
+   *
+   * @public
+   */
+MaterialIconToggle.prototype.checkToggleState = function () {
+    if (this.inputElement_.checked) {
+        this.element_.classList.add(this.CssClasses_.IS_CHECKED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_CHECKED);
+    }
+};
+MaterialIconToggle.prototype['checkToggleState'] = MaterialIconToggle.prototype.checkToggleState;
+/**
+   * Check the inputs disabled state and update display.
+   *
+   * @public
+   */
+MaterialIconToggle.prototype.checkDisabled = function () {
+    if (this.inputElement_.disabled) {
+        this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+    }
+};
+MaterialIconToggle.prototype['checkDisabled'] = MaterialIconToggle.prototype.checkDisabled;
+/**
+   * Disable icon toggle.
+   *
+   * @public
+   */
+MaterialIconToggle.prototype.disable = function () {
+    this.inputElement_.disabled = true;
+    this.updateClasses_();
+};
+MaterialIconToggle.prototype['disable'] = MaterialIconToggle.prototype.disable;
+/**
+   * Enable icon toggle.
+   *
+   * @public
+   */
+MaterialIconToggle.prototype.enable = function () {
+    this.inputElement_.disabled = false;
+    this.updateClasses_();
+};
+MaterialIconToggle.prototype['enable'] = MaterialIconToggle.prototype.enable;
+/**
+   * Check icon toggle.
+   *
+   * @public
+   */
+MaterialIconToggle.prototype.check = function () {
+    this.inputElement_.checked = true;
+    this.updateClasses_();
+};
+MaterialIconToggle.prototype['check'] = MaterialIconToggle.prototype.check;
+/**
+   * Uncheck icon toggle.
+   *
+   * @public
+   */
+MaterialIconToggle.prototype.uncheck = function () {
+    this.inputElement_.checked = false;
+    this.updateClasses_();
+};
+MaterialIconToggle.prototype['uncheck'] = MaterialIconToggle.prototype.uncheck;
+/**
+   * Initialize element.
+   */
+MaterialIconToggle.prototype.init = function () {
+    if (this.element_) {
+        this.inputElement_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);
+        if (this.element_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {
+            this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+            this.rippleContainerElement_ = document.createElement('span');
+            this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+            this.rippleContainerElement_.classList.add(this.CssClasses_.JS_RIPPLE_EFFECT);
+            this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);
+            this.boundRippleMouseUp = this.onMouseUp_.bind(this);
+            this.rippleContainerElement_.addEventListener('mouseup', this.boundRippleMouseUp);
+            var ripple = document.createElement('span');
+            ripple.classList.add(this.CssClasses_.RIPPLE);
+            this.rippleContainerElement_.appendChild(ripple);
+            this.element_.appendChild(this.rippleContainerElement_);
+        }
+        this.boundInputOnChange = this.onChange_.bind(this);
+        this.boundInputOnFocus = this.onFocus_.bind(this);
+        this.boundInputOnBlur = this.onBlur_.bind(this);
+        this.boundElementOnMouseUp = this.onMouseUp_.bind(this);
+        this.inputElement_.addEventListener('change', this.boundInputOnChange);
+        this.inputElement_.addEventListener('focus', this.boundInputOnFocus);
+        this.inputElement_.addEventListener('blur', this.boundInputOnBlur);
+        this.element_.addEventListener('mouseup', this.boundElementOnMouseUp);
+        this.updateClasses_();
+        this.element_.classList.add('is-upgraded');
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialIconToggle,
+    classAsString: 'MaterialIconToggle',
+    cssClass: 'mdl-js-icon-toggle',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for dropdown MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialMenu = function MaterialMenu(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialMenu'] = MaterialMenu;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialMenu.prototype.Constant_ = {
+    // Total duration of the menu animation.
+    TRANSITION_DURATION_SECONDS: 0.3,
+    // The fraction of the total duration we want to use for menu item animations.
+    TRANSITION_DURATION_FRACTION: 0.8,
+    // How long the menu stays open after choosing an option (so the user can see
+    // the ripple).
+    CLOSE_TIMEOUT: 150
+};
+/**
+   * Keycodes, for code readability.
+   *
+   * @enum {number}
+   * @private
+   */
+MaterialMenu.prototype.Keycodes_ = {
+    ENTER: 13,
+    ESCAPE: 27,
+    SPACE: 32,
+    UP_ARROW: 38,
+    DOWN_ARROW: 40
+};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialMenu.prototype.CssClasses_ = {
+    CONTAINER: 'mdl-menu__container',
+    OUTLINE: 'mdl-menu__outline',
+    ITEM: 'mdl-menu__item',
+    ITEM_RIPPLE_CONTAINER: 'mdl-menu__item-ripple-container',
+    RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+    RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+    RIPPLE: 'mdl-ripple',
+    // Statuses
+    IS_UPGRADED: 'is-upgraded',
+    IS_VISIBLE: 'is-visible',
+    IS_ANIMATING: 'is-animating',
+    // Alignment options
+    BOTTOM_LEFT: 'mdl-menu--bottom-left',
+    // This is the default.
+    BOTTOM_RIGHT: 'mdl-menu--bottom-right',
+    TOP_LEFT: 'mdl-menu--top-left',
+    TOP_RIGHT: 'mdl-menu--top-right',
+    UNALIGNED: 'mdl-menu--unaligned'
+};
+/**
+   * Initialize element.
+   */
+MaterialMenu.prototype.init = function () {
+    if (this.element_) {
+        // Create container for the menu.
+        var container = document.createElement('div');
+        container.classList.add(this.CssClasses_.CONTAINER);
+        this.element_.parentElement.insertBefore(container, this.element_);
+        this.element_.parentElement.removeChild(this.element_);
+        container.appendChild(this.element_);
+        this.container_ = container;
+        // Create outline for the menu (shadow and background).
+        var outline = document.createElement('div');
+        outline.classList.add(this.CssClasses_.OUTLINE);
+        this.outline_ = outline;
+        container.insertBefore(outline, this.element_);
+        // Find the "for" element and bind events to it.
+        var forElId = this.element_.getAttribute('for') || this.element_.getAttribute('data-mdl-for');
+        var forEl = null;
+        if (forElId) {
+            forEl = document.getElementById(forElId);
+            if (forEl) {
+                this.forElement_ = forEl;
+                forEl.addEventListener('click', this.handleForClick_.bind(this));
+                forEl.addEventListener('keydown', this.handleForKeyboardEvent_.bind(this));
+            }
+        }
+        var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);
+        this.boundItemKeydown_ = this.handleItemKeyboardEvent_.bind(this);
+        this.boundItemClick_ = this.handleItemClick_.bind(this);
+        for (var i = 0; i < items.length; i++) {
+            // Add a listener to each menu item.
+            items[i].addEventListener('click', this.boundItemClick_);
+            // Add a tab index to each menu item.
+            items[i].tabIndex = '-1';
+            // Add a keyboard listener to each menu item.
+            items[i].addEventListener('keydown', this.boundItemKeydown_);
+        }
+        // Add ripple classes to each item, if the user has enabled ripples.
+        if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+            this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+            for (i = 0; i < items.length; i++) {
+                var item = items[i];
+                var rippleContainer = document.createElement('span');
+                rippleContainer.classList.add(this.CssClasses_.ITEM_RIPPLE_CONTAINER);
+                var ripple = document.createElement('span');
+                ripple.classList.add(this.CssClasses_.RIPPLE);
+                rippleContainer.appendChild(ripple);
+                item.appendChild(rippleContainer);
+                item.classList.add(this.CssClasses_.RIPPLE_EFFECT);
+            }
+        }
+        // Copy alignment classes to the container, so the outline can use them.
+        if (this.element_.classList.contains(this.CssClasses_.BOTTOM_LEFT)) {
+            this.outline_.classList.add(this.CssClasses_.BOTTOM_LEFT);
+        }
+        if (this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)) {
+            this.outline_.classList.add(this.CssClasses_.BOTTOM_RIGHT);
+        }
+        if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT)) {
+            this.outline_.classList.add(this.CssClasses_.TOP_LEFT);
+        }
+        if (this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {
+            this.outline_.classList.add(this.CssClasses_.TOP_RIGHT);
+        }
+        if (this.element_.classList.contains(this.CssClasses_.UNALIGNED)) {
+            this.outline_.classList.add(this.CssClasses_.UNALIGNED);
+        }
+        container.classList.add(this.CssClasses_.IS_UPGRADED);
+    }
+};
+/**
+   * Handles a click on the "for" element, by positioning the menu and then
+   * toggling it.
+   *
+   * @param {Event} evt The event that fired.
+   * @private
+   */
+MaterialMenu.prototype.handleForClick_ = function (evt) {
+    if (this.element_ && this.forElement_) {
+        var rect = this.forElement_.getBoundingClientRect();
+        var forRect = this.forElement_.parentElement.getBoundingClientRect();
+        if (this.element_.classList.contains(this.CssClasses_.UNALIGNED)) {
+        } else if (this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)) {
+            // Position below the "for" element, aligned to its right.
+            this.container_.style.right = forRect.right - rect.right + 'px';
+            this.container_.style.top = this.forElement_.offsetTop + this.forElement_.offsetHeight + 'px';
+        } else if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT)) {
+            // Position above the "for" element, aligned to its left.
+            this.container_.style.left = this.forElement_.offsetLeft + 'px';
+            this.container_.style.bottom = forRect.bottom - rect.top + 'px';
+        } else if (this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {
+            // Position above the "for" element, aligned to its right.
+            this.container_.style.right = forRect.right - rect.right + 'px';
+            this.container_.style.bottom = forRect.bottom - rect.top + 'px';
+        } else {
+            // Default: position below the "for" element, aligned to its left.
+            this.container_.style.left = this.forElement_.offsetLeft + 'px';
+            this.container_.style.top = this.forElement_.offsetTop + this.forElement_.offsetHeight + 'px';
+        }
+    }
+    this.toggle(evt);
+};
+/**
+   * Handles a keyboard event on the "for" element.
+   *
+   * @param {Event} evt The event that fired.
+   * @private
+   */
+MaterialMenu.prototype.handleForKeyboardEvent_ = function (evt) {
+    if (this.element_ && this.container_ && this.forElement_) {
+        var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM + ':not([disabled])');
+        if (items && items.length > 0 && this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)) {
+            if (evt.keyCode === this.Keycodes_.UP_ARROW) {
+                evt.preventDefault();
+                items[items.length - 1].focus();
+            } else if (evt.keyCode === this.Keycodes_.DOWN_ARROW) {
+                evt.preventDefault();
+                items[0].focus();
+            }
+        }
+    }
+};
+/**
+   * Handles a keyboard event on an item.
+   *
+   * @param {Event} evt The event that fired.
+   * @private
+   */
+MaterialMenu.prototype.handleItemKeyboardEvent_ = function (evt) {
+    if (this.element_ && this.container_) {
+        var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM + ':not([disabled])');
+        if (items && items.length > 0 && this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)) {
+            var currentIndex = Array.prototype.slice.call(items).indexOf(evt.target);
+            if (evt.keyCode === this.Keycodes_.UP_ARROW) {
+                evt.preventDefault();
+                if (currentIndex > 0) {
+                    items[currentIndex - 1].focus();
+                } else {
+                    items[items.length - 1].focus();
+                }
+            } else if (evt.keyCode === this.Keycodes_.DOWN_ARROW) {
+                evt.preventDefault();
+                if (items.length > currentIndex + 1) {
+                    items[currentIndex + 1].focus();
+                } else {
+                    items[0].focus();
+                }
+            } else if (evt.keyCode === this.Keycodes_.SPACE || evt.keyCode === this.Keycodes_.ENTER) {
+                evt.preventDefault();
+                // Send mousedown and mouseup to trigger ripple.
+                var e = new MouseEvent('mousedown');
+                evt.target.dispatchEvent(e);
+                e = new MouseEvent('mouseup');
+                evt.target.dispatchEvent(e);
+                // Send click.
+                evt.target.click();
+            } else if (evt.keyCode === this.Keycodes_.ESCAPE) {
+                evt.preventDefault();
+                this.hide();
+            }
+        }
+    }
+};
+/**
+   * Handles a click event on an item.
+   *
+   * @param {Event} evt The event that fired.
+   * @private
+   */
+MaterialMenu.prototype.handleItemClick_ = function (evt) {
+    if (evt.target.hasAttribute('disabled')) {
+        evt.stopPropagation();
+    } else {
+        // Wait some time before closing menu, so the user can see the ripple.
+        this.closing_ = true;
+        window.setTimeout(function (evt) {
+            this.hide();
+            this.closing_ = false;
+        }.bind(this), this.Constant_.CLOSE_TIMEOUT);
+    }
+};
+/**
+   * Calculates the initial clip (for opening the menu) or final clip (for closing
+   * it), and applies it. This allows us to animate from or to the correct point,
+   * that is, the point it's aligned to in the "for" element.
+   *
+   * @param {number} height Height of the clip rectangle
+   * @param {number} width Width of the clip rectangle
+   * @private
+   */
+MaterialMenu.prototype.applyClip_ = function (height, width) {
+    if (this.element_.classList.contains(this.CssClasses_.UNALIGNED)) {
+        // Do not clip.
+        this.element_.style.clip = '';
+    } else if (this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)) {
+        // Clip to the top right corner of the menu.
+        this.element_.style.clip = 'rect(0 ' + width + 'px ' + '0 ' + width + 'px)';
+    } else if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT)) {
+        // Clip to the bottom left corner of the menu.
+        this.element_.style.clip = 'rect(' + height + 'px 0 ' + height + 'px 0)';
+    } else if (this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {
+        // Clip to the bottom right corner of the menu.
+        this.element_.style.clip = 'rect(' + height + 'px ' + width + 'px ' + height + 'px ' + width + 'px)';
+    } else {
+        // Default: do not clip (same as clipping to the top left corner).
+        this.element_.style.clip = '';
+    }
+};
+/**
+   * Cleanup function to remove animation listeners.
+   *
+   * @param {Event} evt
+   * @private
+   */
+MaterialMenu.prototype.removeAnimationEndListener_ = function (evt) {
+    evt.target.classList.remove(MaterialMenu.prototype.CssClasses_.IS_ANIMATING);
+};
+/**
+   * Adds an event listener to clean up after the animation ends.
+   *
+   * @private
+   */
+MaterialMenu.prototype.addAnimationEndListener_ = function () {
+    this.element_.addEventListener('transitionend', this.removeAnimationEndListener_);
+    this.element_.addEventListener('webkitTransitionEnd', this.removeAnimationEndListener_);
+};
+/**
+   * Displays the menu.
+   *
+   * @public
+   */
+MaterialMenu.prototype.show = function (evt) {
+    if (this.element_ && this.container_ && this.outline_) {
+        // Measure the inner element.
+        var height = this.element_.getBoundingClientRect().height;
+        var width = this.element_.getBoundingClientRect().width;
+        // Apply the inner element's size to the container and outline.
+        this.container_.style.width = width + 'px';
+        this.container_.style.height = height + 'px';
+        this.outline_.style.width = width + 'px';
+        this.outline_.style.height = height + 'px';
+        var transitionDuration = this.Constant_.TRANSITION_DURATION_SECONDS * this.Constant_.TRANSITION_DURATION_FRACTION;
+        // Calculate transition delays for individual menu items, so that they fade
+        // in one at a time.
+        var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);
+        for (var i = 0; i < items.length; i++) {
+            var itemDelay = null;
+            if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT) || this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {
+                itemDelay = (height - items[i].offsetTop - items[i].offsetHeight) / height * transitionDuration + 's';
+            } else {
+                itemDelay = items[i].offsetTop / height * transitionDuration + 's';
+            }
+            items[i].style.transitionDelay = itemDelay;
+        }
+        // Apply the initial clip to the text before we start animating.
+        this.applyClip_(height, width);
+        // Wait for the next frame, turn on animation, and apply the final clip.
+        // Also make it visible. This triggers the transitions.
+        window.requestAnimationFrame(function () {
+            this.element_.classList.add(this.CssClasses_.IS_ANIMATING);
+            this.element_.style.clip = 'rect(0 ' + width + 'px ' + height + 'px 0)';
+            this.container_.classList.add(this.CssClasses_.IS_VISIBLE);
+        }.bind(this));
+        // Clean up after the animation is complete.
+        this.addAnimationEndListener_();
+        // Add a click listener to the document, to close the menu.
+        var callback = function (e) {
+            // Check to see if the document is processing the same event that
+            // displayed the menu in the first place. If so, do nothing.
+            // Also check to see if the menu is in the process of closing itself, and
+            // do nothing in that case.
+            // Also check if the clicked element is a menu item
+            // if so, do nothing.
+            if (e !== evt && !this.closing_ && e.target.parentNode !== this.element_) {
+                document.removeEventListener('click', callback);
+                this.hide();
+            }
+        }.bind(this);
+        document.addEventListener('click', callback);
+    }
+};
+MaterialMenu.prototype['show'] = MaterialMenu.prototype.show;
+/**
+   * Hides the menu.
+   *
+   * @public
+   */
+MaterialMenu.prototype.hide = function () {
+    if (this.element_ && this.container_ && this.outline_) {
+        var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);
+        // Remove all transition delays; menu items fade out concurrently.
+        for (var i = 0; i < items.length; i++) {
+            items[i].style.removeProperty('transition-delay');
+        }
+        // Measure the inner element.
+        var rect = this.element_.getBoundingClientRect();
+        var height = rect.height;
+        var width = rect.width;
+        // Turn on animation, and apply the final clip. Also make invisible.
+        // This triggers the transitions.
+        this.element_.classList.add(this.CssClasses_.IS_ANIMATING);
+        this.applyClip_(height, width);
+        this.container_.classList.remove(this.CssClasses_.IS_VISIBLE);
+        // Clean up after the animation is complete.
+        this.addAnimationEndListener_();
+    }
+};
+MaterialMenu.prototype['hide'] = MaterialMenu.prototype.hide;
+/**
+   * Displays or hides the menu, depending on current state.
+   *
+   * @public
+   */
+MaterialMenu.prototype.toggle = function (evt) {
+    if (this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)) {
+        this.hide();
+    } else {
+        this.show(evt);
+    }
+};
+MaterialMenu.prototype['toggle'] = MaterialMenu.prototype.toggle;
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialMenu,
+    classAsString: 'MaterialMenu',
+    cssClass: 'mdl-js-menu',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Progress MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialProgress = function MaterialProgress(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialProgress'] = MaterialProgress;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialProgress.prototype.Constant_ = {};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialProgress.prototype.CssClasses_ = { INDETERMINATE_CLASS: 'mdl-progress__indeterminate' };
+/**
+   * Set the current progress of the progressbar.
+   *
+   * @param {number} p Percentage of the progress (0-100)
+   * @public
+   */
+MaterialProgress.prototype.setProgress = function (p) {
+    if (this.element_.classList.contains(this.CssClasses_.INDETERMINATE_CLASS)) {
+        return;
+    }
+    this.progressbar_.style.width = p + '%';
+};
+MaterialProgress.prototype['setProgress'] = MaterialProgress.prototype.setProgress;
+/**
+   * Set the current progress of the buffer.
+   *
+   * @param {number} p Percentage of the buffer (0-100)
+   * @public
+   */
+MaterialProgress.prototype.setBuffer = function (p) {
+    this.bufferbar_.style.width = p + '%';
+    this.auxbar_.style.width = 100 - p + '%';
+};
+MaterialProgress.prototype['setBuffer'] = MaterialProgress.prototype.setBuffer;
+/**
+   * Initialize element.
+   */
+MaterialProgress.prototype.init = function () {
+    if (this.element_) {
+        var el = document.createElement('div');
+        el.className = 'progressbar bar bar1';
+        this.element_.appendChild(el);
+        this.progressbar_ = el;
+        el = document.createElement('div');
+        el.className = 'bufferbar bar bar2';
+        this.element_.appendChild(el);
+        this.bufferbar_ = el;
+        el = document.createElement('div');
+        el.className = 'auxbar bar bar3';
+        this.element_.appendChild(el);
+        this.auxbar_ = el;
+        this.progressbar_.style.width = '0%';
+        this.bufferbar_.style.width = '100%';
+        this.auxbar_.style.width = '0%';
+        this.element_.classList.add('is-upgraded');
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialProgress,
+    classAsString: 'MaterialProgress',
+    cssClass: 'mdl-js-progress',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Radio MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialRadio = function MaterialRadio(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialRadio'] = MaterialRadio;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialRadio.prototype.Constant_ = { TINY_TIMEOUT: 0.001 };
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialRadio.prototype.CssClasses_ = {
+    IS_FOCUSED: 'is-focused',
+    IS_DISABLED: 'is-disabled',
+    IS_CHECKED: 'is-checked',
+    IS_UPGRADED: 'is-upgraded',
+    JS_RADIO: 'mdl-js-radio',
+    RADIO_BTN: 'mdl-radio__button',
+    RADIO_OUTER_CIRCLE: 'mdl-radio__outer-circle',
+    RADIO_INNER_CIRCLE: 'mdl-radio__inner-circle',
+    RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+    RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+    RIPPLE_CONTAINER: 'mdl-radio__ripple-container',
+    RIPPLE_CENTER: 'mdl-ripple--center',
+    RIPPLE: 'mdl-ripple'
+};
+/**
+   * Handle change of state.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialRadio.prototype.onChange_ = function (event) {
+    // Since other radio buttons don't get change events, we need to look for
+    // them to update their classes.
+    var radios = document.getElementsByClassName(this.CssClasses_.JS_RADIO);
+    for (var i = 0; i < radios.length; i++) {
+        var button = radios[i].querySelector('.' + this.CssClasses_.RADIO_BTN);
+        // Different name == different group, so no point updating those.
+        if (button.getAttribute('name') === this.btnElement_.getAttribute('name')) {
+            if (typeof radios[i]['MaterialRadio'] !== 'undefined') {
+                radios[i]['MaterialRadio'].updateClasses_();
+            }
+        }
+    }
+};
+/**
+   * Handle focus.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialRadio.prototype.onFocus_ = function (event) {
+    this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle lost focus.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialRadio.prototype.onBlur_ = function (event) {
+    this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle mouseup.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialRadio.prototype.onMouseup_ = function (event) {
+    this.blur_();
+};
+/**
+   * Update classes.
+   *
+   * @private
+   */
+MaterialRadio.prototype.updateClasses_ = function () {
+    this.checkDisabled();
+    this.checkToggleState();
+};
+/**
+   * Add blur.
+   *
+   * @private
+   */
+MaterialRadio.prototype.blur_ = function () {
+    // TODO: figure out why there's a focus event being fired after our blur,
+    // so that we can avoid this hack.
+    window.setTimeout(function () {
+        this.btnElement_.blur();
+    }.bind(this), this.Constant_.TINY_TIMEOUT);
+};
+// Public methods.
+/**
+   * Check the components disabled state.
+   *
+   * @public
+   */
+MaterialRadio.prototype.checkDisabled = function () {
+    if (this.btnElement_.disabled) {
+        this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+    }
+};
+MaterialRadio.prototype['checkDisabled'] = MaterialRadio.prototype.checkDisabled;
+/**
+   * Check the components toggled state.
+   *
+   * @public
+   */
+MaterialRadio.prototype.checkToggleState = function () {
+    if (this.btnElement_.checked) {
+        this.element_.classList.add(this.CssClasses_.IS_CHECKED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_CHECKED);
+    }
+};
+MaterialRadio.prototype['checkToggleState'] = MaterialRadio.prototype.checkToggleState;
+/**
+   * Disable radio.
+   *
+   * @public
+   */
+MaterialRadio.prototype.disable = function () {
+    this.btnElement_.disabled = true;
+    this.updateClasses_();
+};
+MaterialRadio.prototype['disable'] = MaterialRadio.prototype.disable;
+/**
+   * Enable radio.
+   *
+   * @public
+   */
+MaterialRadio.prototype.enable = function () {
+    this.btnElement_.disabled = false;
+    this.updateClasses_();
+};
+MaterialRadio.prototype['enable'] = MaterialRadio.prototype.enable;
+/**
+   * Check radio.
+   *
+   * @public
+   */
+MaterialRadio.prototype.check = function () {
+    this.btnElement_.checked = true;
+    this.onChange_(null);
+};
+MaterialRadio.prototype['check'] = MaterialRadio.prototype.check;
+/**
+   * Uncheck radio.
+   *
+   * @public
+   */
+MaterialRadio.prototype.uncheck = function () {
+    this.btnElement_.checked = false;
+    this.onChange_(null);
+};
+MaterialRadio.prototype['uncheck'] = MaterialRadio.prototype.uncheck;
+/**
+   * Initialize element.
+   */
+MaterialRadio.prototype.init = function () {
+    if (this.element_) {
+        this.btnElement_ = this.element_.querySelector('.' + this.CssClasses_.RADIO_BTN);
+        this.boundChangeHandler_ = this.onChange_.bind(this);
+        this.boundFocusHandler_ = this.onChange_.bind(this);
+        this.boundBlurHandler_ = this.onBlur_.bind(this);
+        this.boundMouseUpHandler_ = this.onMouseup_.bind(this);
+        var outerCircle = document.createElement('span');
+        outerCircle.classList.add(this.CssClasses_.RADIO_OUTER_CIRCLE);
+        var innerCircle = document.createElement('span');
+        innerCircle.classList.add(this.CssClasses_.RADIO_INNER_CIRCLE);
+        this.element_.appendChild(outerCircle);
+        this.element_.appendChild(innerCircle);
+        var rippleContainer;
+        if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+            this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+            rippleContainer = document.createElement('span');
+            rippleContainer.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+            rippleContainer.classList.add(this.CssClasses_.RIPPLE_EFFECT);
+            rippleContainer.classList.add(this.CssClasses_.RIPPLE_CENTER);
+            rippleContainer.addEventListener('mouseup', this.boundMouseUpHandler_);
+            var ripple = document.createElement('span');
+            ripple.classList.add(this.CssClasses_.RIPPLE);
+            rippleContainer.appendChild(ripple);
+            this.element_.appendChild(rippleContainer);
+        }
+        this.btnElement_.addEventListener('change', this.boundChangeHandler_);
+        this.btnElement_.addEventListener('focus', this.boundFocusHandler_);
+        this.btnElement_.addEventListener('blur', this.boundBlurHandler_);
+        this.element_.addEventListener('mouseup', this.boundMouseUpHandler_);
+        this.updateClasses_();
+        this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialRadio,
+    classAsString: 'MaterialRadio',
+    cssClass: 'mdl-js-radio',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Slider MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialSlider = function MaterialSlider(element) {
+    this.element_ = element;
+    // Browser feature detection.
+    this.isIE_ = window.navigator.msPointerEnabled;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialSlider'] = MaterialSlider;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialSlider.prototype.Constant_ = {};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialSlider.prototype.CssClasses_ = {
+    IE_CONTAINER: 'mdl-slider__ie-container',
+    SLIDER_CONTAINER: 'mdl-slider__container',
+    BACKGROUND_FLEX: 'mdl-slider__background-flex',
+    BACKGROUND_LOWER: 'mdl-slider__background-lower',
+    BACKGROUND_UPPER: 'mdl-slider__background-upper',
+    IS_LOWEST_VALUE: 'is-lowest-value',
+    IS_UPGRADED: 'is-upgraded'
+};
+/**
+   * Handle input on element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialSlider.prototype.onInput_ = function (event) {
+    this.updateValueStyles_();
+};
+/**
+   * Handle change on element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialSlider.prototype.onChange_ = function (event) {
+    this.updateValueStyles_();
+};
+/**
+   * Handle mouseup on element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialSlider.prototype.onMouseUp_ = function (event) {
+    event.target.blur();
+};
+/**
+   * Handle mousedown on container element.
+   * This handler is purpose is to not require the use to click
+   * exactly on the 2px slider element, as FireFox seems to be very
+   * strict about this.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   * @suppress {missingProperties}
+   */
+MaterialSlider.prototype.onContainerMouseDown_ = function (event) {
+    // If this click is not on the parent element (but rather some child)
+    // ignore. It may still bubble up.
+    if (event.target !== this.element_.parentElement) {
+        return;
+    }
+    // Discard the original event and create a new event that
+    // is on the slider element.
+    event.preventDefault();
+    var newEvent = new MouseEvent('mousedown', {
+        target: event.target,
+        buttons: event.buttons,
+        clientX: event.clientX,
+        clientY: this.element_.getBoundingClientRect().y
+    });
+    this.element_.dispatchEvent(newEvent);
+};
+/**
+   * Handle updating of values.
+   *
+   * @private
+   */
+MaterialSlider.prototype.updateValueStyles_ = function () {
+    // Calculate and apply percentages to div structure behind slider.
+    var fraction = (this.element_.value - this.element_.min) / (this.element_.max - this.element_.min);
+    if (fraction === 0) {
+        this.element_.classList.add(this.CssClasses_.IS_LOWEST_VALUE);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_LOWEST_VALUE);
+    }
+    if (!this.isIE_) {
+        this.backgroundLower_.style.flex = fraction;
+        this.backgroundLower_.style.webkitFlex = fraction;
+        this.backgroundUpper_.style.flex = 1 - fraction;
+        this.backgroundUpper_.style.webkitFlex = 1 - fraction;
+    }
+};
+// Public methods.
+/**
+   * Disable slider.
+   *
+   * @public
+   */
+MaterialSlider.prototype.disable = function () {
+    this.element_.disabled = true;
+};
+MaterialSlider.prototype['disable'] = MaterialSlider.prototype.disable;
+/**
+   * Enable slider.
+   *
+   * @public
+   */
+MaterialSlider.prototype.enable = function () {
+    this.element_.disabled = false;
+};
+MaterialSlider.prototype['enable'] = MaterialSlider.prototype.enable;
+/**
+   * Update slider value.
+   *
+   * @param {number} value The value to which to set the control (optional).
+   * @public
+   */
+MaterialSlider.prototype.change = function (value) {
+    if (typeof value !== 'undefined') {
+        this.element_.value = value;
+    }
+    this.updateValueStyles_();
+};
+MaterialSlider.prototype['change'] = MaterialSlider.prototype.change;
+/**
+   * Initialize element.
+   */
+MaterialSlider.prototype.init = function () {
+    if (this.element_) {
+        if (this.isIE_) {
+            // Since we need to specify a very large height in IE due to
+            // implementation limitations, we add a parent here that trims it down to
+            // a reasonable size.
+            var containerIE = document.createElement('div');
+            containerIE.classList.add(this.CssClasses_.IE_CONTAINER);
+            this.element_.parentElement.insertBefore(containerIE, this.element_);
+            this.element_.parentElement.removeChild(this.element_);
+            containerIE.appendChild(this.element_);
+        } else {
+            // For non-IE browsers, we need a div structure that sits behind the
+            // slider and allows us to style the left and right sides of it with
+            // different colors.
+            var container = document.createElement('div');
+            container.classList.add(this.CssClasses_.SLIDER_CONTAINER);
+            this.element_.parentElement.insertBefore(container, this.element_);
+            this.element_.parentElement.removeChild(this.element_);
+            container.appendChild(this.element_);
+            var backgroundFlex = document.createElement('div');
+            backgroundFlex.classList.add(this.CssClasses_.BACKGROUND_FLEX);
+            container.appendChild(backgroundFlex);
+            this.backgroundLower_ = document.createElement('div');
+            this.backgroundLower_.classList.add(this.CssClasses_.BACKGROUND_LOWER);
+            backgroundFlex.appendChild(this.backgroundLower_);
+            this.backgroundUpper_ = document.createElement('div');
+            this.backgroundUpper_.classList.add(this.CssClasses_.BACKGROUND_UPPER);
+            backgroundFlex.appendChild(this.backgroundUpper_);
+        }
+        this.boundInputHandler = this.onInput_.bind(this);
+        this.boundChangeHandler = this.onChange_.bind(this);
+        this.boundMouseUpHandler = this.onMouseUp_.bind(this);
+        this.boundContainerMouseDownHandler = this.onContainerMouseDown_.bind(this);
+        this.element_.addEventListener('input', this.boundInputHandler);
+        this.element_.addEventListener('change', this.boundChangeHandler);
+        this.element_.addEventListener('mouseup', this.boundMouseUpHandler);
+        this.element_.parentElement.addEventListener('mousedown', this.boundContainerMouseDownHandler);
+        this.updateValueStyles_();
+        this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialSlider,
+    classAsString: 'MaterialSlider',
+    cssClass: 'mdl-js-slider',
+    widget: true
+});
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Snackbar MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialSnackbar = function MaterialSnackbar(element) {
+    this.element_ = element;
+    this.textElement_ = this.element_.querySelector('.' + this.cssClasses_.MESSAGE);
+    this.actionElement_ = this.element_.querySelector('.' + this.cssClasses_.ACTION);
+    if (!this.textElement_) {
+        throw new Error('There must be a message element for a snackbar.');
+    }
+    if (!this.actionElement_) {
+        throw new Error('There must be an action element for a snackbar.');
+    }
+    this.active = false;
+    this.actionHandler_ = undefined;
+    this.message_ = undefined;
+    this.actionText_ = undefined;
+    this.queuedNotifications_ = [];
+    this.setActionHidden_(true);
+};
+window['MaterialSnackbar'] = MaterialSnackbar;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialSnackbar.prototype.Constant_ = {
+    // The duration of the snackbar show/hide animation, in ms.
+    ANIMATION_LENGTH: 250
+};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialSnackbar.prototype.cssClasses_ = {
+    SNACKBAR: 'mdl-snackbar',
+    MESSAGE: 'mdl-snackbar__text',
+    ACTION: 'mdl-snackbar__action',
+    ACTIVE: 'mdl-snackbar--active'
+};
+/**
+   * Display the snackbar.
+   *
+   * @private
+   */
+MaterialSnackbar.prototype.displaySnackbar_ = function () {
+    this.element_.setAttribute('aria-hidden', 'true');
+    if (this.actionHandler_) {
+        this.actionElement_.textContent = this.actionText_;
+        this.actionElement_.addEventListener('click', this.actionHandler_);
+        this.setActionHidden_(false);
+    }
+    this.textElement_.textContent = this.message_;
+    this.element_.classList.add(this.cssClasses_.ACTIVE);
+    this.element_.setAttribute('aria-hidden', 'false');
+    setTimeout(this.cleanup_.bind(this), this.timeout_);
+};
+/**
+   * Show the snackbar.
+   *
+   * @param {Object} data The data for the notification.
+   * @public
+   */
+MaterialSnackbar.prototype.showSnackbar = function (data) {
+    if (data === undefined) {
+        throw new Error('Please provide a data object with at least a message to display.');
+    }
+    if (data['message'] === undefined) {
+        throw new Error('Please provide a message to be displayed.');
+    }
+    if (data['actionHandler'] && !data['actionText']) {
+        throw new Error('Please provide action text with the handler.');
+    }
+    if (this.active) {
+        this.queuedNotifications_.push(data);
+    } else {
+        this.active = true;
+        this.message_ = data['message'];
+        if (data['timeout']) {
+            this.timeout_ = data['timeout'];
+        } else {
+            this.timeout_ = 2750;
+        }
+        if (data['actionHandler']) {
+            this.actionHandler_ = data['actionHandler'];
+        }
+        if (data['actionText']) {
+            this.actionText_ = data['actionText'];
+        }
+        this.displaySnackbar_();
+    }
+};
+MaterialSnackbar.prototype['showSnackbar'] = MaterialSnackbar.prototype.showSnackbar;
+/**
+   * Check if the queue has items within it.
+   * If it does, display the next entry.
+   *
+   * @private
+   */
+MaterialSnackbar.prototype.checkQueue_ = function () {
+    if (this.queuedNotifications_.length > 0) {
+        this.showSnackbar(this.queuedNotifications_.shift());
+    }
+};
+/**
+   * Cleanup the snackbar event listeners and accessiblity attributes.
+   *
+   * @private
+   */
+MaterialSnackbar.prototype.cleanup_ = function () {
+    this.element_.classList.remove(this.cssClasses_.ACTIVE);
+    setTimeout(function () {
+        this.element_.setAttribute('aria-hidden', 'true');
+        this.textElement_.textContent = '';
+        if (!Boolean(this.actionElement_.getAttribute('aria-hidden'))) {
+            this.setActionHidden_(true);
+            this.actionElement_.textContent = '';
+            this.actionElement_.removeEventListener('click', this.actionHandler_);
+        }
+        this.actionHandler_ = undefined;
+        this.message_ = undefined;
+        this.actionText_ = undefined;
+        this.active = false;
+        this.checkQueue_();
+    }.bind(this), this.Constant_.ANIMATION_LENGTH);
+};
+/**
+   * Set the action handler hidden state.
+   *
+   * @param {boolean} value
+   * @private
+   */
+MaterialSnackbar.prototype.setActionHidden_ = function (value) {
+    if (value) {
+        this.actionElement_.setAttribute('aria-hidden', 'true');
+    } else {
+        this.actionElement_.removeAttribute('aria-hidden');
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialSnackbar,
+    classAsString: 'MaterialSnackbar',
+    cssClass: 'mdl-js-snackbar',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Spinner MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @param {HTMLElement} element The element that will be upgraded.
+   * @constructor
+   */
+var MaterialSpinner = function MaterialSpinner(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialSpinner'] = MaterialSpinner;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialSpinner.prototype.Constant_ = { MDL_SPINNER_LAYER_COUNT: 4 };
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialSpinner.prototype.CssClasses_ = {
+    MDL_SPINNER_LAYER: 'mdl-spinner__layer',
+    MDL_SPINNER_CIRCLE_CLIPPER: 'mdl-spinner__circle-clipper',
+    MDL_SPINNER_CIRCLE: 'mdl-spinner__circle',
+    MDL_SPINNER_GAP_PATCH: 'mdl-spinner__gap-patch',
+    MDL_SPINNER_LEFT: 'mdl-spinner__left',
+    MDL_SPINNER_RIGHT: 'mdl-spinner__right'
+};
+/**
+   * Auxiliary method to create a spinner layer.
+   *
+   * @param {number} index Index of the layer to be created.
+   * @public
+   */
+MaterialSpinner.prototype.createLayer = function (index) {
+    var layer = document.createElement('div');
+    layer.classList.add(this.CssClasses_.MDL_SPINNER_LAYER);
+    layer.classList.add(this.CssClasses_.MDL_SPINNER_LAYER + '-' + index);
+    var leftClipper = document.createElement('div');
+    leftClipper.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER);
+    leftClipper.classList.add(this.CssClasses_.MDL_SPINNER_LEFT);
+    var gapPatch = document.createElement('div');
+    gapPatch.classList.add(this.CssClasses_.MDL_SPINNER_GAP_PATCH);
+    var rightClipper = document.createElement('div');
+    rightClipper.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER);
+    rightClipper.classList.add(this.CssClasses_.MDL_SPINNER_RIGHT);
+    var circleOwners = [
+        leftClipper,
+        gapPatch,
+        rightClipper
+    ];
+    for (var i = 0; i < circleOwners.length; i++) {
+        var circle = document.createElement('div');
+        circle.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE);
+        circleOwners[i].appendChild(circle);
+    }
+    layer.appendChild(leftClipper);
+    layer.appendChild(gapPatch);
+    layer.appendChild(rightClipper);
+    this.element_.appendChild(layer);
+};
+MaterialSpinner.prototype['createLayer'] = MaterialSpinner.prototype.createLayer;
+/**
+   * Stops the spinner animation.
+   * Public method for users who need to stop the spinner for any reason.
+   *
+   * @public
+   */
+MaterialSpinner.prototype.stop = function () {
+    this.element_.classList.remove('is-active');
+};
+MaterialSpinner.prototype['stop'] = MaterialSpinner.prototype.stop;
+/**
+   * Starts the spinner animation.
+   * Public method for users who need to manually start the spinner for any reason
+   * (instead of just adding the 'is-active' class to their markup).
+   *
+   * @public
+   */
+MaterialSpinner.prototype.start = function () {
+    this.element_.classList.add('is-active');
+};
+MaterialSpinner.prototype['start'] = MaterialSpinner.prototype.start;
+/**
+   * Initialize element.
+   */
+MaterialSpinner.prototype.init = function () {
+    if (this.element_) {
+        for (var i = 1; i <= this.Constant_.MDL_SPINNER_LAYER_COUNT; i++) {
+            this.createLayer(i);
+        }
+        this.element_.classList.add('is-upgraded');
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialSpinner,
+    classAsString: 'MaterialSpinner',
+    cssClass: 'mdl-js-spinner',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Checkbox MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialSwitch = function MaterialSwitch(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialSwitch'] = MaterialSwitch;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialSwitch.prototype.Constant_ = { TINY_TIMEOUT: 0.001 };
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialSwitch.prototype.CssClasses_ = {
+    INPUT: 'mdl-switch__input',
+    TRACK: 'mdl-switch__track',
+    THUMB: 'mdl-switch__thumb',
+    FOCUS_HELPER: 'mdl-switch__focus-helper',
+    RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+    RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+    RIPPLE_CONTAINER: 'mdl-switch__ripple-container',
+    RIPPLE_CENTER: 'mdl-ripple--center',
+    RIPPLE: 'mdl-ripple',
+    IS_FOCUSED: 'is-focused',
+    IS_DISABLED: 'is-disabled',
+    IS_CHECKED: 'is-checked'
+};
+/**
+   * Handle change of state.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialSwitch.prototype.onChange_ = function (event) {
+    this.updateClasses_();
+};
+/**
+   * Handle focus of element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialSwitch.prototype.onFocus_ = function (event) {
+    this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle lost focus of element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialSwitch.prototype.onBlur_ = function (event) {
+    this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle mouseup.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialSwitch.prototype.onMouseUp_ = function (event) {
+    this.blur_();
+};
+/**
+   * Handle class updates.
+   *
+   * @private
+   */
+MaterialSwitch.prototype.updateClasses_ = function () {
+    this.checkDisabled();
+    this.checkToggleState();
+};
+/**
+   * Add blur.
+   *
+   * @private
+   */
+MaterialSwitch.prototype.blur_ = function () {
+    // TODO: figure out why there's a focus event being fired after our blur,
+    // so that we can avoid this hack.
+    window.setTimeout(function () {
+        this.inputElement_.blur();
+    }.bind(this), this.Constant_.TINY_TIMEOUT);
+};
+// Public methods.
+/**
+   * Check the components disabled state.
+   *
+   * @public
+   */
+MaterialSwitch.prototype.checkDisabled = function () {
+    if (this.inputElement_.disabled) {
+        this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+    }
+};
+MaterialSwitch.prototype['checkDisabled'] = MaterialSwitch.prototype.checkDisabled;
+/**
+   * Check the components toggled state.
+   *
+   * @public
+   */
+MaterialSwitch.prototype.checkToggleState = function () {
+    if (this.inputElement_.checked) {
+        this.element_.classList.add(this.CssClasses_.IS_CHECKED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_CHECKED);
+    }
+};
+MaterialSwitch.prototype['checkToggleState'] = MaterialSwitch.prototype.checkToggleState;
+/**
+   * Disable switch.
+   *
+   * @public
+   */
+MaterialSwitch.prototype.disable = function () {
+    this.inputElement_.disabled = true;
+    this.updateClasses_();
+};
+MaterialSwitch.prototype['disable'] = MaterialSwitch.prototype.disable;
+/**
+   * Enable switch.
+   *
+   * @public
+   */
+MaterialSwitch.prototype.enable = function () {
+    this.inputElement_.disabled = false;
+    this.updateClasses_();
+};
+MaterialSwitch.prototype['enable'] = MaterialSwitch.prototype.enable;
+/**
+   * Activate switch.
+   *
+   * @public
+   */
+MaterialSwitch.prototype.on = function () {
+    this.inputElement_.checked = true;
+    this.updateClasses_();
+};
+MaterialSwitch.prototype['on'] = MaterialSwitch.prototype.on;
+/**
+   * Deactivate switch.
+   *
+   * @public
+   */
+MaterialSwitch.prototype.off = function () {
+    this.inputElement_.checked = false;
+    this.updateClasses_();
+};
+MaterialSwitch.prototype['off'] = MaterialSwitch.prototype.off;
+/**
+   * Initialize element.
+   */
+MaterialSwitch.prototype.init = function () {
+    if (this.element_) {
+        this.inputElement_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);
+        var track = document.createElement('div');
+        track.classList.add(this.CssClasses_.TRACK);
+        var thumb = document.createElement('div');
+        thumb.classList.add(this.CssClasses_.THUMB);
+        var focusHelper = document.createElement('span');
+        focusHelper.classList.add(this.CssClasses_.FOCUS_HELPER);
+        thumb.appendChild(focusHelper);
+        this.element_.appendChild(track);
+        this.element_.appendChild(thumb);
+        this.boundMouseUpHandler = this.onMouseUp_.bind(this);
+        if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+            this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+            this.rippleContainerElement_ = document.createElement('span');
+            this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+            this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT);
+            this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);
+            this.rippleContainerElement_.addEventListener('mouseup', this.boundMouseUpHandler);
+            var ripple = document.createElement('span');
+            ripple.classList.add(this.CssClasses_.RIPPLE);
+            this.rippleContainerElement_.appendChild(ripple);
+            this.element_.appendChild(this.rippleContainerElement_);
+        }
+        this.boundChangeHandler = this.onChange_.bind(this);
+        this.boundFocusHandler = this.onFocus_.bind(this);
+        this.boundBlurHandler = this.onBlur_.bind(this);
+        this.inputElement_.addEventListener('change', this.boundChangeHandler);
+        this.inputElement_.addEventListener('focus', this.boundFocusHandler);
+        this.inputElement_.addEventListener('blur', this.boundBlurHandler);
+        this.element_.addEventListener('mouseup', this.boundMouseUpHandler);
+        this.updateClasses_();
+        this.element_.classList.add('is-upgraded');
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialSwitch,
+    classAsString: 'MaterialSwitch',
+    cssClass: 'mdl-js-switch',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Tabs MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {Element} element The element that will be upgraded.
+   */
+var MaterialTabs = function MaterialTabs(element) {
+    // Stores the HTML element.
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialTabs'] = MaterialTabs;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialTabs.prototype.Constant_ = {};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialTabs.prototype.CssClasses_ = {
+    TAB_CLASS: 'mdl-tabs__tab',
+    PANEL_CLASS: 'mdl-tabs__panel',
+    ACTIVE_CLASS: 'is-active',
+    UPGRADED_CLASS: 'is-upgraded',
+    MDL_JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+    MDL_RIPPLE_CONTAINER: 'mdl-tabs__ripple-container',
+    MDL_RIPPLE: 'mdl-ripple',
+    MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events'
+};
+/**
+   * Handle clicks to a tabs component
+   *
+   * @private
+   */
+MaterialTabs.prototype.initTabs_ = function () {
+    if (this.element_.classList.contains(this.CssClasses_.MDL_JS_RIPPLE_EFFECT)) {
+        this.element_.classList.add(this.CssClasses_.MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS);
+    }
+    // Select element tabs, document panels
+    this.tabs_ = this.element_.querySelectorAll('.' + this.CssClasses_.TAB_CLASS);
+    this.panels_ = this.element_.querySelectorAll('.' + this.CssClasses_.PANEL_CLASS);
+    // Create new tabs for each tab element
+    for (var i = 0; i < this.tabs_.length; i++) {
+        new MaterialTab(this.tabs_[i], this);
+    }
+    this.element_.classList.add(this.CssClasses_.UPGRADED_CLASS);
+};
+/**
+   * Reset tab state, dropping active classes
+   *
+   * @private
+   */
+MaterialTabs.prototype.resetTabState_ = function () {
+    for (var k = 0; k < this.tabs_.length; k++) {
+        this.tabs_[k].classList.remove(this.CssClasses_.ACTIVE_CLASS);
+    }
+};
+/**
+   * Reset panel state, droping active classes
+   *
+   * @private
+   */
+MaterialTabs.prototype.resetPanelState_ = function () {
+    for (var j = 0; j < this.panels_.length; j++) {
+        this.panels_[j].classList.remove(this.CssClasses_.ACTIVE_CLASS);
+    }
+};
+/**
+   * Initialize element.
+   */
+MaterialTabs.prototype.init = function () {
+    if (this.element_) {
+        this.initTabs_();
+    }
+};
+/**
+   * Constructor for an individual tab.
+   *
+   * @constructor
+   * @param {Element} tab The HTML element for the tab.
+   * @param {MaterialTabs} ctx The MaterialTabs object that owns the tab.
+   */
+function MaterialTab(tab, ctx) {
+    if (tab) {
+        if (ctx.element_.classList.contains(ctx.CssClasses_.MDL_JS_RIPPLE_EFFECT)) {
+            var rippleContainer = document.createElement('span');
+            rippleContainer.classList.add(ctx.CssClasses_.MDL_RIPPLE_CONTAINER);
+            rippleContainer.classList.add(ctx.CssClasses_.MDL_JS_RIPPLE_EFFECT);
+            var ripple = document.createElement('span');
+            ripple.classList.add(ctx.CssClasses_.MDL_RIPPLE);
+            rippleContainer.appendChild(ripple);
+            tab.appendChild(rippleContainer);
+        }
+        tab.addEventListener('click', function (e) {
+            if (tab.getAttribute('href').charAt(0) === '#') {
+                e.preventDefault();
+                var href = tab.href.split('#')[1];
+                var panel = ctx.element_.querySelector('#' + href);
+                ctx.resetTabState_();
+                ctx.resetPanelState_();
+                tab.classList.add(ctx.CssClasses_.ACTIVE_CLASS);
+                panel.classList.add(ctx.CssClasses_.ACTIVE_CLASS);
+            }
+        });
+    }
+}
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialTabs,
+    classAsString: 'MaterialTabs',
+    cssClass: 'mdl-js-tabs'
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Textfield MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialTextfield = function MaterialTextfield(element) {
+    this.element_ = element;
+    this.maxRows = this.Constant_.NO_MAX_ROWS;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialTextfield'] = MaterialTextfield;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialTextfield.prototype.Constant_ = {
+    NO_MAX_ROWS: -1,
+    MAX_ROWS_ATTRIBUTE: 'maxrows'
+};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialTextfield.prototype.CssClasses_ = {
+    LABEL: 'mdl-textfield__label',
+    INPUT: 'mdl-textfield__input',
+    IS_DIRTY: 'is-dirty',
+    IS_FOCUSED: 'is-focused',
+    IS_DISABLED: 'is-disabled',
+    IS_INVALID: 'is-invalid',
+    IS_UPGRADED: 'is-upgraded',
+    HAS_PLACEHOLDER: 'has-placeholder'
+};
+/**
+   * Handle input being entered.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialTextfield.prototype.onKeyDown_ = function (event) {
+    var currentRowCount = event.target.value.split('\n').length;
+    if (event.keyCode === 13) {
+        if (currentRowCount >= this.maxRows) {
+            event.preventDefault();
+        }
+    }
+};
+/**
+   * Handle focus.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialTextfield.prototype.onFocus_ = function (event) {
+    this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle lost focus.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialTextfield.prototype.onBlur_ = function (event) {
+    this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+};
+/**
+   * Handle reset event from out side.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialTextfield.prototype.onReset_ = function (event) {
+    this.updateClasses_();
+};
+/**
+   * Handle class updates.
+   *
+   * @private
+   */
+MaterialTextfield.prototype.updateClasses_ = function () {
+    this.checkDisabled();
+    this.checkValidity();
+    this.checkDirty();
+    this.checkFocus();
+};
+// Public methods.
+/**
+   * Check the disabled state and update field accordingly.
+   *
+   * @public
+   */
+MaterialTextfield.prototype.checkDisabled = function () {
+    if (this.input_.disabled) {
+        this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+    }
+};
+MaterialTextfield.prototype['checkDisabled'] = MaterialTextfield.prototype.checkDisabled;
+/**
+  * Check the focus state and update field accordingly.
+  *
+  * @public
+  */
+MaterialTextfield.prototype.checkFocus = function () {
+    if (Boolean(this.element_.querySelector(':focus'))) {
+        this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+    }
+};
+MaterialTextfield.prototype['checkFocus'] = MaterialTextfield.prototype.checkFocus;
+/**
+   * Check the validity state and update field accordingly.
+   *
+   * @public
+   */
+MaterialTextfield.prototype.checkValidity = function () {
+    if (this.input_.validity) {
+        if (this.input_.validity.valid) {
+            this.element_.classList.remove(this.CssClasses_.IS_INVALID);
+        } else {
+            this.element_.classList.add(this.CssClasses_.IS_INVALID);
+        }
+    }
+};
+MaterialTextfield.prototype['checkValidity'] = MaterialTextfield.prototype.checkValidity;
+/**
+   * Check the dirty state and update field accordingly.
+   *
+   * @public
+   */
+MaterialTextfield.prototype.checkDirty = function () {
+    if (this.input_.value && this.input_.value.length > 0) {
+        this.element_.classList.add(this.CssClasses_.IS_DIRTY);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_DIRTY);
+    }
+};
+MaterialTextfield.prototype['checkDirty'] = MaterialTextfield.prototype.checkDirty;
+/**
+   * Disable text field.
+   *
+   * @public
+   */
+MaterialTextfield.prototype.disable = function () {
+    this.input_.disabled = true;
+    this.updateClasses_();
+};
+MaterialTextfield.prototype['disable'] = MaterialTextfield.prototype.disable;
+/**
+   * Enable text field.
+   *
+   * @public
+   */
+MaterialTextfield.prototype.enable = function () {
+    this.input_.disabled = false;
+    this.updateClasses_();
+};
+MaterialTextfield.prototype['enable'] = MaterialTextfield.prototype.enable;
+/**
+   * Update text field value.
+   *
+   * @param {string} value The value to which to set the control (optional).
+   * @public
+   */
+MaterialTextfield.prototype.change = function (value) {
+    this.input_.value = value || '';
+    this.updateClasses_();
+};
+MaterialTextfield.prototype['change'] = MaterialTextfield.prototype.change;
+/**
+   * Initialize element.
+   */
+MaterialTextfield.prototype.init = function () {
+    if (this.element_) {
+        this.label_ = this.element_.querySelector('.' + this.CssClasses_.LABEL);
+        this.input_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);
+        if (this.input_) {
+            if (this.input_.hasAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE)) {
+                this.maxRows = parseInt(this.input_.getAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE), 10);
+                if (isNaN(this.maxRows)) {
+                    this.maxRows = this.Constant_.NO_MAX_ROWS;
+                }
+            }
+            if (this.input_.hasAttribute('placeholder')) {
+                this.element_.classList.add(this.CssClasses_.HAS_PLACEHOLDER);
+            }
+            this.boundUpdateClassesHandler = this.updateClasses_.bind(this);
+            this.boundFocusHandler = this.onFocus_.bind(this);
+            this.boundBlurHandler = this.onBlur_.bind(this);
+            this.boundResetHandler = this.onReset_.bind(this);
+            this.input_.addEventListener('input', this.boundUpdateClassesHandler);
+            this.input_.addEventListener('focus', this.boundFocusHandler);
+            this.input_.addEventListener('blur', this.boundBlurHandler);
+            this.input_.addEventListener('reset', this.boundResetHandler);
+            if (this.maxRows !== this.Constant_.NO_MAX_ROWS) {
+                // TODO: This should handle pasting multi line text.
+                // Currently doesn't.
+                this.boundKeyDownHandler = this.onKeyDown_.bind(this);
+                this.input_.addEventListener('keydown', this.boundKeyDownHandler);
+            }
+            var invalid = this.element_.classList.contains(this.CssClasses_.IS_INVALID);
+            this.updateClasses_();
+            this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+            if (invalid) {
+                this.element_.classList.add(this.CssClasses_.IS_INVALID);
+            }
+            if (this.input_.hasAttribute('autofocus')) {
+                this.element_.focus();
+                this.checkFocus();
+            }
+        }
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialTextfield,
+    classAsString: 'MaterialTextfield',
+    cssClass: 'mdl-js-textfield',
+    widget: true
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Tooltip MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialTooltip = function MaterialTooltip(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialTooltip'] = MaterialTooltip;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialTooltip.prototype.Constant_ = {};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialTooltip.prototype.CssClasses_ = {
+    IS_ACTIVE: 'is-active',
+    BOTTOM: 'mdl-tooltip--bottom',
+    LEFT: 'mdl-tooltip--left',
+    RIGHT: 'mdl-tooltip--right',
+    TOP: 'mdl-tooltip--top'
+};
+/**
+   * Handle mouseenter for tooltip.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialTooltip.prototype.handleMouseEnter_ = function (event) {
+    var props = event.target.getBoundingClientRect();
+    var left = props.left + props.width / 2;
+    var top = props.top + props.height / 2;
+    var marginLeft = -1 * (this.element_.offsetWidth / 2);
+    var marginTop = -1 * (this.element_.offsetHeight / 2);
+    if (this.element_.classList.contains(this.CssClasses_.LEFT) || this.element_.classList.contains(this.CssClasses_.RIGHT)) {
+        left = props.width / 2;
+        if (top + marginTop < 0) {
+            this.element_.style.top = '0';
+            this.element_.style.marginTop = '0';
+        } else {
+            this.element_.style.top = top + 'px';
+            this.element_.style.marginTop = marginTop + 'px';
+        }
+    } else {
+        if (left + marginLeft < 0) {
+            this.element_.style.left = '0';
+            this.element_.style.marginLeft = '0';
+        } else {
+            this.element_.style.left = left + 'px';
+            this.element_.style.marginLeft = marginLeft + 'px';
+        }
+    }
+    if (this.element_.classList.contains(this.CssClasses_.TOP)) {
+        this.element_.style.top = props.top - this.element_.offsetHeight - 10 + 'px';
+    } else if (this.element_.classList.contains(this.CssClasses_.RIGHT)) {
+        this.element_.style.left = props.left + props.width + 10 + 'px';
+    } else if (this.element_.classList.contains(this.CssClasses_.LEFT)) {
+        this.element_.style.left = props.left - this.element_.offsetWidth - 10 + 'px';
+    } else {
+        this.element_.style.top = props.top + props.height + 10 + 'px';
+    }
+    this.element_.classList.add(this.CssClasses_.IS_ACTIVE);
+};
+/**
+   * Hide tooltip on mouseleave or scroll
+   *
+   * @private
+   */
+MaterialTooltip.prototype.hideTooltip_ = function () {
+    this.element_.classList.remove(this.CssClasses_.IS_ACTIVE);
+};
+/**
+   * Initialize element.
+   */
+MaterialTooltip.prototype.init = function () {
+    if (this.element_) {
+        var forElId = this.element_.getAttribute('for') || this.element_.getAttribute('data-mdl-for');
+        if (forElId) {
+            this.forElement_ = document.getElementById(forElId);
+        }
+        if (this.forElement_) {
+            // It's left here because it prevents accidental text selection on Android
+            if (!this.forElement_.hasAttribute('tabindex')) {
+                this.forElement_.setAttribute('tabindex', '0');
+            }
+            this.boundMouseEnterHandler = this.handleMouseEnter_.bind(this);
+            this.boundMouseLeaveAndScrollHandler = this.hideTooltip_.bind(this);
+            this.forElement_.addEventListener('mouseenter', this.boundMouseEnterHandler, false);
+            this.forElement_.addEventListener('touchend', this.boundMouseEnterHandler, false);
+            this.forElement_.addEventListener('mouseleave', this.boundMouseLeaveAndScrollHandler, false);
+            window.addEventListener('scroll', this.boundMouseLeaveAndScrollHandler, true);
+            window.addEventListener('touchstart', this.boundMouseLeaveAndScrollHandler);
+        }
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialTooltip,
+    classAsString: 'MaterialTooltip',
+    cssClass: 'mdl-tooltip'
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Layout MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialLayout = function MaterialLayout(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialLayout'] = MaterialLayout;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialLayout.prototype.Constant_ = {
+    MAX_WIDTH: '(max-width: 1024px)',
+    TAB_SCROLL_PIXELS: 100,
+    RESIZE_TIMEOUT: 100,
+    MENU_ICON: '&#xE5D2;',
+    CHEVRON_LEFT: 'chevron_left',
+    CHEVRON_RIGHT: 'chevron_right'
+};
+/**
+   * Keycodes, for code readability.
+   *
+   * @enum {number}
+   * @private
+   */
+MaterialLayout.prototype.Keycodes_ = {
+    ENTER: 13,
+    ESCAPE: 27,
+    SPACE: 32
+};
+/**
+   * Modes.
+   *
+   * @enum {number}
+   * @private
+   */
+MaterialLayout.prototype.Mode_ = {
+    STANDARD: 0,
+    SEAMED: 1,
+    WATERFALL: 2,
+    SCROLL: 3
+};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialLayout.prototype.CssClasses_ = {
+    CONTAINER: 'mdl-layout__container',
+    HEADER: 'mdl-layout__header',
+    DRAWER: 'mdl-layout__drawer',
+    CONTENT: 'mdl-layout__content',
+    DRAWER_BTN: 'mdl-layout__drawer-button',
+    ICON: 'material-icons',
+    JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+    RIPPLE_CONTAINER: 'mdl-layout__tab-ripple-container',
+    RIPPLE: 'mdl-ripple',
+    RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+    HEADER_SEAMED: 'mdl-layout__header--seamed',
+    HEADER_WATERFALL: 'mdl-layout__header--waterfall',
+    HEADER_SCROLL: 'mdl-layout__header--scroll',
+    FIXED_HEADER: 'mdl-layout--fixed-header',
+    OBFUSCATOR: 'mdl-layout__obfuscator',
+    TAB_BAR: 'mdl-layout__tab-bar',
+    TAB_CONTAINER: 'mdl-layout__tab-bar-container',
+    TAB: 'mdl-layout__tab',
+    TAB_BAR_BUTTON: 'mdl-layout__tab-bar-button',
+    TAB_BAR_LEFT_BUTTON: 'mdl-layout__tab-bar-left-button',
+    TAB_BAR_RIGHT_BUTTON: 'mdl-layout__tab-bar-right-button',
+    TAB_MANUAL_SWITCH: 'mdl-layout__tab-manual-switch',
+    PANEL: 'mdl-layout__tab-panel',
+    HAS_DRAWER: 'has-drawer',
+    HAS_TABS: 'has-tabs',
+    HAS_SCROLLING_HEADER: 'has-scrolling-header',
+    CASTING_SHADOW: 'is-casting-shadow',
+    IS_COMPACT: 'is-compact',
+    IS_SMALL_SCREEN: 'is-small-screen',
+    IS_DRAWER_OPEN: 'is-visible',
+    IS_ACTIVE: 'is-active',
+    IS_UPGRADED: 'is-upgraded',
+    IS_ANIMATING: 'is-animating',
+    ON_LARGE_SCREEN: 'mdl-layout--large-screen-only',
+    ON_SMALL_SCREEN: 'mdl-layout--small-screen-only'
+};
+/**
+   * Handles scrolling on the content.
+   *
+   * @private
+   */
+MaterialLayout.prototype.contentScrollHandler_ = function () {
+    if (this.header_.classList.contains(this.CssClasses_.IS_ANIMATING)) {
+        return;
+    }
+    var headerVisible = !this.element_.classList.contains(this.CssClasses_.IS_SMALL_SCREEN) || this.element_.classList.contains(this.CssClasses_.FIXED_HEADER);
+    if (this.content_.scrollTop > 0 && !this.header_.classList.contains(this.CssClasses_.IS_COMPACT)) {
+        this.header_.classList.add(this.CssClasses_.CASTING_SHADOW);
+        this.header_.classList.add(this.CssClasses_.IS_COMPACT);
+        if (headerVisible) {
+            this.header_.classList.add(this.CssClasses_.IS_ANIMATING);
+        }
+    } else if (this.content_.scrollTop <= 0 && this.header_.classList.contains(this.CssClasses_.IS_COMPACT)) {
+        this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW);
+        this.header_.classList.remove(this.CssClasses_.IS_COMPACT);
+        if (headerVisible) {
+            this.header_.classList.add(this.CssClasses_.IS_ANIMATING);
+        }
+    }
+};
+/**
+   * Handles a keyboard event on the drawer.
+   *
+   * @param {Event} evt The event that fired.
+   * @private
+   */
+MaterialLayout.prototype.keyboardEventHandler_ = function (evt) {
+    // Only react when the drawer is open.
+    if (evt.keyCode === this.Keycodes_.ESCAPE && this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {
+        this.toggleDrawer();
+    }
+};
+/**
+   * Handles changes in screen size.
+   *
+   * @private
+   */
+MaterialLayout.prototype.screenSizeHandler_ = function () {
+    if (this.screenSizeMediaQuery_.matches) {
+        this.element_.classList.add(this.CssClasses_.IS_SMALL_SCREEN);
+    } else {
+        this.element_.classList.remove(this.CssClasses_.IS_SMALL_SCREEN);
+        // Collapse drawer (if any) when moving to a large screen size.
+        if (this.drawer_) {
+            this.drawer_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN);
+            this.obfuscator_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN);
+        }
+    }
+};
+/**
+   * Handles events of drawer button.
+   *
+   * @param {Event} evt The event that fired.
+   * @private
+   */
+MaterialLayout.prototype.drawerToggleHandler_ = function (evt) {
+    if (evt && evt.type === 'keydown') {
+        if (evt.keyCode === this.Keycodes_.SPACE || evt.keyCode === this.Keycodes_.ENTER) {
+            // prevent scrolling in drawer nav
+            evt.preventDefault();
+        } else {
+            // prevent other keys
+            return;
+        }
+    }
+    this.toggleDrawer();
+};
+/**
+   * Handles (un)setting the `is-animating` class
+   *
+   * @private
+   */
+MaterialLayout.prototype.headerTransitionEndHandler_ = function () {
+    this.header_.classList.remove(this.CssClasses_.IS_ANIMATING);
+};
+/**
+   * Handles expanding the header on click
+   *
+   * @private
+   */
+MaterialLayout.prototype.headerClickHandler_ = function () {
+    if (this.header_.classList.contains(this.CssClasses_.IS_COMPACT)) {
+        this.header_.classList.remove(this.CssClasses_.IS_COMPACT);
+        this.header_.classList.add(this.CssClasses_.IS_ANIMATING);
+    }
+};
+/**
+   * Reset tab state, dropping active classes
+   *
+   * @private
+   */
+MaterialLayout.prototype.resetTabState_ = function (tabBar) {
+    for (var k = 0; k < tabBar.length; k++) {
+        tabBar[k].classList.remove(this.CssClasses_.IS_ACTIVE);
+    }
+};
+/**
+   * Reset panel state, droping active classes
+   *
+   * @private
+   */
+MaterialLayout.prototype.resetPanelState_ = function (panels) {
+    for (var j = 0; j < panels.length; j++) {
+        panels[j].classList.remove(this.CssClasses_.IS_ACTIVE);
+    }
+};
+/**
+  * Toggle drawer state
+  *
+  * @public
+  */
+MaterialLayout.prototype.toggleDrawer = function () {
+    var drawerButton = this.element_.querySelector('.' + this.CssClasses_.DRAWER_BTN);
+    this.drawer_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);
+    this.obfuscator_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);
+    // Set accessibility properties.
+    if (this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {
+        this.drawer_.setAttribute('aria-hidden', 'false');
+        drawerButton.setAttribute('aria-expanded', 'true');
+    } else {
+        this.drawer_.setAttribute('aria-hidden', 'true');
+        drawerButton.setAttribute('aria-expanded', 'false');
+    }
+};
+MaterialLayout.prototype['toggleDrawer'] = MaterialLayout.prototype.toggleDrawer;
+/**
+   * Initialize element.
+   */
+MaterialLayout.prototype.init = function () {
+    if (this.element_) {
+        var container = document.createElement('div');
+        container.classList.add(this.CssClasses_.CONTAINER);
+        var focusedElement = this.element_.querySelector(':focus');
+        this.element_.parentElement.insertBefore(container, this.element_);
+        this.element_.parentElement.removeChild(this.element_);
+        container.appendChild(this.element_);
+        if (focusedElement) {
+            focusedElement.focus();
+        }
+        var directChildren = this.element_.childNodes;
+        var numChildren = directChildren.length;
+        for (var c = 0; c < numChildren; c++) {
+            var child = directChildren[c];
+            if (child.classList && child.classList.contains(this.CssClasses_.HEADER)) {
+                this.header_ = child;
+            }
+            if (child.classList && child.classList.contains(this.CssClasses_.DRAWER)) {
+                this.drawer_ = child;
+            }
+            if (child.classList && child.classList.contains(this.CssClasses_.CONTENT)) {
+                this.content_ = child;
+            }
+        }
+        window.addEventListener('pageshow', function (e) {
+            if (e.persisted) {
+                // when page is loaded from back/forward cache
+                // trigger repaint to let layout scroll in safari
+                this.element_.style.overflowY = 'hidden';
+                requestAnimationFrame(function () {
+                    this.element_.style.overflowY = '';
+                }.bind(this));
+            }
+        }.bind(this), false);
+        if (this.header_) {
+            this.tabBar_ = this.header_.querySelector('.' + this.CssClasses_.TAB_BAR);
+        }
+        var mode = this.Mode_.STANDARD;
+        if (this.header_) {
+            if (this.header_.classList.contains(this.CssClasses_.HEADER_SEAMED)) {
+                mode = this.Mode_.SEAMED;
+            } else if (this.header_.classList.contains(this.CssClasses_.HEADER_WATERFALL)) {
+                mode = this.Mode_.WATERFALL;
+                this.header_.addEventListener('transitionend', this.headerTransitionEndHandler_.bind(this));
+                this.header_.addEventListener('click', this.headerClickHandler_.bind(this));
+            } else if (this.header_.classList.contains(this.CssClasses_.HEADER_SCROLL)) {
+                mode = this.Mode_.SCROLL;
+                container.classList.add(this.CssClasses_.HAS_SCROLLING_HEADER);
+            }
+            if (mode === this.Mode_.STANDARD) {
+                this.header_.classList.add(this.CssClasses_.CASTING_SHADOW);
+                if (this.tabBar_) {
+                    this.tabBar_.classList.add(this.CssClasses_.CASTING_SHADOW);
+                }
+            } else if (mode === this.Mode_.SEAMED || mode === this.Mode_.SCROLL) {
+                this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW);
+                if (this.tabBar_) {
+                    this.tabBar_.classList.remove(this.CssClasses_.CASTING_SHADOW);
+                }
+            } else if (mode === this.Mode_.WATERFALL) {
+                // Add and remove shadows depending on scroll position.
+                // Also add/remove auxiliary class for styling of the compact version of
+                // the header.
+                this.content_.addEventListener('scroll', this.contentScrollHandler_.bind(this));
+                this.contentScrollHandler_();
+            }
+        }
+        // Add drawer toggling button to our layout, if we have an openable drawer.
+        if (this.drawer_) {
+            var drawerButton = this.element_.querySelector('.' + this.CssClasses_.DRAWER_BTN);
+            if (!drawerButton) {
+                drawerButton = document.createElement('div');
+                drawerButton.setAttribute('aria-expanded', 'false');
+                drawerButton.setAttribute('role', 'button');
+                drawerButton.setAttribute('tabindex', '0');
+                drawerButton.classList.add(this.CssClasses_.DRAWER_BTN);
+                var drawerButtonIcon = document.createElement('i');
+                drawerButtonIcon.classList.add(this.CssClasses_.ICON);
+                drawerButtonIcon.innerHTML = this.Constant_.MENU_ICON;
+                drawerButton.appendChild(drawerButtonIcon);
+            }
+            if (this.drawer_.classList.contains(this.CssClasses_.ON_LARGE_SCREEN)) {
+                //If drawer has ON_LARGE_SCREEN class then add it to the drawer toggle button as well.
+                drawerButton.classList.add(this.CssClasses_.ON_LARGE_SCREEN);
+            } else if (this.drawer_.classList.contains(this.CssClasses_.ON_SMALL_SCREEN)) {
+                //If drawer has ON_SMALL_SCREEN class then add it to the drawer toggle button as well.
+                drawerButton.classList.add(this.CssClasses_.ON_SMALL_SCREEN);
+            }
+            drawerButton.addEventListener('click', this.drawerToggleHandler_.bind(this));
+            drawerButton.addEventListener('keydown', this.drawerToggleHandler_.bind(this));
+            // Add a class if the layout has a drawer, for altering the left padding.
+            // Adds the HAS_DRAWER to the elements since this.header_ may or may
+            // not be present.
+            this.element_.classList.add(this.CssClasses_.HAS_DRAWER);
+            // If we have a fixed header, add the button to the header rather than
+            // the layout.
+            if (this.element_.classList.contains(this.CssClasses_.FIXED_HEADER)) {
+                this.header_.insertBefore(drawerButton, this.header_.firstChild);
+            } else {
+                this.element_.insertBefore(drawerButton, this.content_);
+            }
+            var obfuscator = document.createElement('div');
+            obfuscator.classList.add(this.CssClasses_.OBFUSCATOR);
+            this.element_.appendChild(obfuscator);
+            obfuscator.addEventListener('click', this.drawerToggleHandler_.bind(this));
+            this.obfuscator_ = obfuscator;
+            this.drawer_.addEventListener('keydown', this.keyboardEventHandler_.bind(this));
+            this.drawer_.setAttribute('aria-hidden', 'true');
+        }
+        // Keep an eye on screen size, and add/remove auxiliary class for styling
+        // of small screens.
+        this.screenSizeMediaQuery_ = window.matchMedia(this.Constant_.MAX_WIDTH);
+        this.screenSizeMediaQuery_.addListener(this.screenSizeHandler_.bind(this));
+        this.screenSizeHandler_();
+        // Initialize tabs, if any.
+        if (this.header_ && this.tabBar_) {
+            this.element_.classList.add(this.CssClasses_.HAS_TABS);
+            var tabContainer = document.createElement('div');
+            tabContainer.classList.add(this.CssClasses_.TAB_CONTAINER);
+            this.header_.insertBefore(tabContainer, this.tabBar_);
+            this.header_.removeChild(this.tabBar_);
+            var leftButton = document.createElement('div');
+            leftButton.classList.add(this.CssClasses_.TAB_BAR_BUTTON);
+            leftButton.classList.add(this.CssClasses_.TAB_BAR_LEFT_BUTTON);
+            var leftButtonIcon = document.createElement('i');
+            leftButtonIcon.classList.add(this.CssClasses_.ICON);
+            leftButtonIcon.textContent = this.Constant_.CHEVRON_LEFT;
+            leftButton.appendChild(leftButtonIcon);
+            leftButton.addEventListener('click', function () {
+                this.tabBar_.scrollLeft -= this.Constant_.TAB_SCROLL_PIXELS;
+            }.bind(this));
+            var rightButton = document.createElement('div');
+            rightButton.classList.add(this.CssClasses_.TAB_BAR_BUTTON);
+            rightButton.classList.add(this.CssClasses_.TAB_BAR_RIGHT_BUTTON);
+            var rightButtonIcon = document.createElement('i');
+            rightButtonIcon.classList.add(this.CssClasses_.ICON);
+            rightButtonIcon.textContent = this.Constant_.CHEVRON_RIGHT;
+            rightButton.appendChild(rightButtonIcon);
+            rightButton.addEventListener('click', function () {
+                this.tabBar_.scrollLeft += this.Constant_.TAB_SCROLL_PIXELS;
+            }.bind(this));
+            tabContainer.appendChild(leftButton);
+            tabContainer.appendChild(this.tabBar_);
+            tabContainer.appendChild(rightButton);
+            // Add and remove tab buttons depending on scroll position and total
+            // window size.
+            var tabUpdateHandler = function () {
+                if (this.tabBar_.scrollLeft > 0) {
+                    leftButton.classList.add(this.CssClasses_.IS_ACTIVE);
+                } else {
+                    leftButton.classList.remove(this.CssClasses_.IS_ACTIVE);
+                }
+                if (this.tabBar_.scrollLeft < this.tabBar_.scrollWidth - this.tabBar_.offsetWidth) {
+                    rightButton.classList.add(this.CssClasses_.IS_ACTIVE);
+                } else {
+                    rightButton.classList.remove(this.CssClasses_.IS_ACTIVE);
+                }
+            }.bind(this);
+            this.tabBar_.addEventListener('scroll', tabUpdateHandler);
+            tabUpdateHandler();
+            // Update tabs when the window resizes.
+            var windowResizeHandler = function () {
+                // Use timeouts to make sure it doesn't happen too often.
+                if (this.resizeTimeoutId_) {
+                    clearTimeout(this.resizeTimeoutId_);
+                }
+                this.resizeTimeoutId_ = setTimeout(function () {
+                    tabUpdateHandler();
+                    this.resizeTimeoutId_ = null;
+                }.bind(this), this.Constant_.RESIZE_TIMEOUT);
+            }.bind(this);
+            window.addEventListener('resize', windowResizeHandler);
+            if (this.tabBar_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {
+                this.tabBar_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+            }
+            // Select element tabs, document panels
+            var tabs = this.tabBar_.querySelectorAll('.' + this.CssClasses_.TAB);
+            var panels = this.content_.querySelectorAll('.' + this.CssClasses_.PANEL);
+            // Create new tabs for each tab element
+            for (var i = 0; i < tabs.length; i++) {
+                new MaterialLayoutTab(tabs[i], tabs, panels, this);
+            }
+        }
+        this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+    }
+};
+/**
+   * Constructor for an individual tab.
+   *
+   * @constructor
+   * @param {HTMLElement} tab The HTML element for the tab.
+   * @param {!Array<HTMLElement>} tabs Array with HTML elements for all tabs.
+   * @param {!Array<HTMLElement>} panels Array with HTML elements for all panels.
+   * @param {MaterialLayout} layout The MaterialLayout object that owns the tab.
+   */
+function MaterialLayoutTab(tab, tabs, panels, layout) {
+    /**
+     * Auxiliary method to programmatically select a tab in the UI.
+     */
+    function selectTab() {
+        var href = tab.href.split('#')[1];
+        var panel = layout.content_.querySelector('#' + href);
+        layout.resetTabState_(tabs);
+        layout.resetPanelState_(panels);
+        tab.classList.add(layout.CssClasses_.IS_ACTIVE);
+        panel.classList.add(layout.CssClasses_.IS_ACTIVE);
+    }
+    if (layout.tabBar_.classList.contains(layout.CssClasses_.JS_RIPPLE_EFFECT)) {
+        var rippleContainer = document.createElement('span');
+        rippleContainer.classList.add(layout.CssClasses_.RIPPLE_CONTAINER);
+        rippleContainer.classList.add(layout.CssClasses_.JS_RIPPLE_EFFECT);
+        var ripple = document.createElement('span');
+        ripple.classList.add(layout.CssClasses_.RIPPLE);
+        rippleContainer.appendChild(ripple);
+        tab.appendChild(rippleContainer);
+    }
+    if (!layout.tabBar_.classList.contains(layout.CssClasses_.TAB_MANUAL_SWITCH)) {
+        tab.addEventListener('click', function (e) {
+            if (tab.getAttribute('href').charAt(0) === '#') {
+                e.preventDefault();
+                selectTab();
+            }
+        });
+    }
+    tab.show = selectTab;
+}
+window['MaterialLayoutTab'] = MaterialLayoutTab;
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialLayout,
+    classAsString: 'MaterialLayout',
+    cssClass: 'mdl-js-layout'
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Data Table Card MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {Element} element The element that will be upgraded.
+   */
+var MaterialDataTable = function MaterialDataTable(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialDataTable'] = MaterialDataTable;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialDataTable.prototype.Constant_ = {};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialDataTable.prototype.CssClasses_ = {
+    DATA_TABLE: 'mdl-data-table',
+    SELECTABLE: 'mdl-data-table--selectable',
+    SELECT_ELEMENT: 'mdl-data-table__select',
+    IS_SELECTED: 'is-selected',
+    IS_UPGRADED: 'is-upgraded'
+};
+/**
+   * Generates and returns a function that toggles the selection state of a
+   * single row (or multiple rows).
+   *
+   * @param {Element} checkbox Checkbox that toggles the selection state.
+   * @param {Element} row Row to toggle when checkbox changes.
+   * @param {(Array<Object>|NodeList)=} opt_rows Rows to toggle when checkbox changes.
+   * @private
+   */
+MaterialDataTable.prototype.selectRow_ = function (checkbox, row, opt_rows) {
+    if (row) {
+        return function () {
+            if (checkbox.checked) {
+                row.classList.add(this.CssClasses_.IS_SELECTED);
+            } else {
+                row.classList.remove(this.CssClasses_.IS_SELECTED);
+            }
+        }.bind(this);
+    }
+    if (opt_rows) {
+        return function () {
+            var i;
+            var el;
+            if (checkbox.checked) {
+                for (i = 0; i < opt_rows.length; i++) {
+                    el = opt_rows[i].querySelector('td').querySelector('.mdl-checkbox');
+                    el['MaterialCheckbox'].check();
+                    opt_rows[i].classList.add(this.CssClasses_.IS_SELECTED);
+                }
+            } else {
+                for (i = 0; i < opt_rows.length; i++) {
+                    el = opt_rows[i].querySelector('td').querySelector('.mdl-checkbox');
+                    el['MaterialCheckbox'].uncheck();
+                    opt_rows[i].classList.remove(this.CssClasses_.IS_SELECTED);
+                }
+            }
+        }.bind(this);
+    }
+};
+/**
+   * Creates a checkbox for a single or or multiple rows and hooks up the
+   * event handling.
+   *
+   * @param {Element} row Row to toggle when checkbox changes.
+   * @param {(Array<Object>|NodeList)=} opt_rows Rows to toggle when checkbox changes.
+   * @private
+   */
+MaterialDataTable.prototype.createCheckbox_ = function (row, opt_rows) {
+    var label = document.createElement('label');
+    var labelClasses = [
+        'mdl-checkbox',
+        'mdl-js-checkbox',
+        'mdl-js-ripple-effect',
+        this.CssClasses_.SELECT_ELEMENT
+    ];
+    label.className = labelClasses.join(' ');
+    var checkbox = document.createElement('input');
+    checkbox.type = 'checkbox';
+    checkbox.classList.add('mdl-checkbox__input');
+    if (row) {
+        checkbox.checked = row.classList.contains(this.CssClasses_.IS_SELECTED);
+        checkbox.addEventListener('change', this.selectRow_(checkbox, row));
+    } else if (opt_rows) {
+        checkbox.addEventListener('change', this.selectRow_(checkbox, null, opt_rows));
+    }
+    label.appendChild(checkbox);
+    componentHandler.upgradeElement(label, 'MaterialCheckbox');
+    return label;
+};
+/**
+   * Initialize element.
+   */
+MaterialDataTable.prototype.init = function () {
+    if (this.element_) {
+        var firstHeader = this.element_.querySelector('th');
+        var bodyRows = Array.prototype.slice.call(this.element_.querySelectorAll('tbody tr'));
+        var footRows = Array.prototype.slice.call(this.element_.querySelectorAll('tfoot tr'));
+        var rows = bodyRows.concat(footRows);
+        if (this.element_.classList.contains(this.CssClasses_.SELECTABLE)) {
+            var th = document.createElement('th');
+            var headerCheckbox = this.createCheckbox_(null, rows);
+            th.appendChild(headerCheckbox);
+            firstHeader.parentElement.insertBefore(th, firstHeader);
+            for (var i = 0; i < rows.length; i++) {
+                var firstCell = rows[i].querySelector('td');
+                if (firstCell) {
+                    var td = document.createElement('td');
+                    if (rows[i].parentNode.nodeName.toUpperCase() === 'TBODY') {
+                        var rowCheckbox = this.createCheckbox_(rows[i]);
+                        td.appendChild(rowCheckbox);
+                    }
+                    rows[i].insertBefore(td, firstCell);
+                }
+            }
+            this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+        }
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialDataTable,
+    classAsString: 'MaterialDataTable',
+    cssClass: 'mdl-js-data-table'
+});
+/**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+   * Class constructor for Ripple MDL component.
+   * Implements MDL component design pattern defined at:
+   * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
+   * @constructor
+   * @param {HTMLElement} element The element that will be upgraded.
+   */
+var MaterialRipple = function MaterialRipple(element) {
+    this.element_ = element;
+    // Initialize instance.
+    this.init();
+};
+window['MaterialRipple'] = MaterialRipple;
+/**
+   * Store constants in one place so they can be updated easily.
+   *
+   * @enum {string | number}
+   * @private
+   */
+MaterialRipple.prototype.Constant_ = {
+    INITIAL_SCALE: 'scale(0.0001, 0.0001)',
+    INITIAL_SIZE: '1px',
+    INITIAL_OPACITY: '0.4',
+    FINAL_OPACITY: '0',
+    FINAL_SCALE: ''
+};
+/**
+   * Store strings for class names defined by this component that are used in
+   * JavaScript. This allows us to simply change it in one place should we
+   * decide to modify at a later date.
+   *
+   * @enum {string}
+   * @private
+   */
+MaterialRipple.prototype.CssClasses_ = {
+    RIPPLE_CENTER: 'mdl-ripple--center',
+    RIPPLE_EFFECT_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+    RIPPLE: 'mdl-ripple',
+    IS_ANIMATING: 'is-animating',
+    IS_VISIBLE: 'is-visible'
+};
+/**
+   * Handle mouse / finger down on element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialRipple.prototype.downHandler_ = function (event) {
+    if (!this.rippleElement_.style.width && !this.rippleElement_.style.height) {
+        var rect = this.element_.getBoundingClientRect();
+        this.boundHeight = rect.height;
+        this.boundWidth = rect.width;
+        this.rippleSize_ = Math.sqrt(rect.width * rect.width + rect.height * rect.height) * 2 + 2;
+        this.rippleElement_.style.width = this.rippleSize_ + 'px';
+        this.rippleElement_.style.height = this.rippleSize_ + 'px';
+    }
+    this.rippleElement_.classList.add(this.CssClasses_.IS_VISIBLE);
+    if (event.type === 'mousedown' && this.ignoringMouseDown_) {
+        this.ignoringMouseDown_ = false;
+    } else {
+        if (event.type === 'touchstart') {
+            this.ignoringMouseDown_ = true;
+        }
+        var frameCount = this.getFrameCount();
+        if (frameCount > 0) {
+            return;
+        }
+        this.setFrameCount(1);
+        var bound = event.currentTarget.getBoundingClientRect();
+        var x;
+        var y;
+        // Check if we are handling a keyboard click.
+        if (event.clientX === 0 && event.clientY === 0) {
+            x = Math.round(bound.width / 2);
+            y = Math.round(bound.height / 2);
+        } else {
+            var clientX = event.clientX !== undefined ? event.clientX : event.touches[0].clientX;
+            var clientY = event.clientY !== undefined ? event.clientY : event.touches[0].clientY;
+            x = Math.round(clientX - bound.left);
+            y = Math.round(clientY - bound.top);
+        }
+        this.setRippleXY(x, y);
+        this.setRippleStyles(true);
+        window.requestAnimationFrame(this.animFrameHandler.bind(this));
+    }
+};
+/**
+   * Handle mouse / finger up on element.
+   *
+   * @param {Event} event The event that fired.
+   * @private
+   */
+MaterialRipple.prototype.upHandler_ = function (event) {
+    // Don't fire for the artificial "mouseup" generated by a double-click.
+    if (event && event.detail !== 2) {
+        // Allow a repaint to occur before removing this class, so the animation
+        // shows for tap events, which seem to trigger a mouseup too soon after
+        // mousedown.
+        window.setTimeout(function () {
+            this.rippleElement_.classList.remove(this.CssClasses_.IS_VISIBLE);
+        }.bind(this), 0);
+    }
+};
+/**
+   * Initialize element.
+   */
+MaterialRipple.prototype.init = function () {
+    if (this.element_) {
+        var recentering = this.element_.classList.contains(this.CssClasses_.RIPPLE_CENTER);
+        if (!this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT_IGNORE_EVENTS)) {
+            this.rippleElement_ = this.element_.querySelector('.' + this.CssClasses_.RIPPLE);
+            this.frameCount_ = 0;
+            this.rippleSize_ = 0;
+            this.x_ = 0;
+            this.y_ = 0;
+            // Touch start produces a compat mouse down event, which would cause a
+            // second ripples. To avoid that, we use this property to ignore the first
+            // mouse down after a touch start.
+            this.ignoringMouseDown_ = false;
+            this.boundDownHandler = this.downHandler_.bind(this);
+            this.element_.addEventListener('mousedown', this.boundDownHandler);
+            this.element_.addEventListener('touchstart', this.boundDownHandler);
+            this.boundUpHandler = this.upHandler_.bind(this);
+            this.element_.addEventListener('mouseup', this.boundUpHandler);
+            this.element_.addEventListener('mouseleave', this.boundUpHandler);
+            this.element_.addEventListener('touchend', this.boundUpHandler);
+            this.element_.addEventListener('blur', this.boundUpHandler);
+            /**
+         * Getter for frameCount_.
+         * @return {number} the frame count.
+         */
+            this.getFrameCount = function () {
+                return this.frameCount_;
+            };
+            /**
+         * Setter for frameCount_.
+         * @param {number} fC the frame count.
+         */
+            this.setFrameCount = function (fC) {
+                this.frameCount_ = fC;
+            };
+            /**
+         * Getter for rippleElement_.
+         * @return {Element} the ripple element.
+         */
+            this.getRippleElement = function () {
+                return this.rippleElement_;
+            };
+            /**
+         * Sets the ripple X and Y coordinates.
+         * @param  {number} newX the new X coordinate
+         * @param  {number} newY the new Y coordinate
+         */
+            this.setRippleXY = function (newX, newY) {
+                this.x_ = newX;
+                this.y_ = newY;
+            };
+            /**
+         * Sets the ripple styles.
+         * @param  {boolean} start whether or not this is the start frame.
+         */
+            this.setRippleStyles = function (start) {
+                if (this.rippleElement_ !== null) {
+                    var transformString;
+                    var scale;
+                    var size;
+                    var offset = 'translate(' + this.x_ + 'px, ' + this.y_ + 'px)';
+                    if (start) {
+                        scale = this.Constant_.INITIAL_SCALE;
+                        size = this.Constant_.INITIAL_SIZE;
+                    } else {
+                        scale = this.Constant_.FINAL_SCALE;
+                        size = this.rippleSize_ + 'px';
+                        if (recentering) {
+                            offset = 'translate(' + this.boundWidth / 2 + 'px, ' + this.boundHeight / 2 + 'px)';
+                        }
+                    }
+                    transformString = 'translate(-50%, -50%) ' + offset + scale;
+                    this.rippleElement_.style.webkitTransform = transformString;
+                    this.rippleElement_.style.msTransform = transformString;
+                    this.rippleElement_.style.transform = transformString;
+                    if (start) {
+                        this.rippleElement_.classList.remove(this.CssClasses_.IS_ANIMATING);
+                    } else {
+                        this.rippleElement_.classList.add(this.CssClasses_.IS_ANIMATING);
+                    }
+                }
+            };
+            /**
+         * Handles an animation frame.
+         */
+            this.animFrameHandler = function () {
+                if (this.frameCount_-- > 0) {
+                    window.requestAnimationFrame(this.animFrameHandler.bind(this));
+                } else {
+                    this.setRippleStyles(false);
+                }
+            };
+        }
+    }
+};
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+componentHandler.register({
+    constructor: MaterialRipple,
+    classAsString: 'MaterialRipple',
+    cssClass: 'mdl-js-ripple-effect',
+    widget: false
+});
+}());
diff --git a/app/modules/web/themes/material-dark/js/material.map b/app/modules/web/themes/material-dark/js/material.map
new file mode 100644
index 000000000..6b0a0075b
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/material.map
@@ -0,0 +1,8 @@
+{
+"version":3,
+"file":"material.min.js",
+"lineCount":345,
+"mappings":"A;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAE,SAAQ,EAAG,CAiqFbA,QAASA,EAAW,CAACC,CAAD,CAAMC,CAAN,CAAW,CAC3B,GAAID,CAAJ,CAAS,CACL,GAAIC,CAAAC,SAAAC,UAAAC,SAAA,CAAgCH,CAAAI,YAAAC,qBAAhC,CAAJ,CAA2E,CACvE,IAAIC,EAAkBC,QAAAC,cAAA,CAAuB,MAAvB,CACtBF,EAAAJ,UAAAO,IAAA,CAA8BT,CAAAI,YAAAM,qBAA9B,CACAJ,EAAAJ,UAAAO,IAAA,CAA8BT,CAAAI,YAAAC,qBAA9B,CACA,KAAIM,EAASJ,QAAAC,cAAA,CAAuB,MAAvB,CACbG,EAAAT,UAAAO,IAAA,CAAqBT,CAAAI,YAAAQ,WAArB,CACAN,EAAAO,YAAA,CAA4BF,CAA5B,CACAZ,EAAAc,YAAA,CAAgBP,CAAhB,CAPuE,CAS3EP,CAAAe,iBAAA,CAAqB,OAArB,CAA8B,QAAS,CAACC,CAAD,CAAI,CACI,GAA3C,GAAIhB,CAAAiB,aAAA,CAAiB,MAAjB,CAAAC,OAAA,CAAgC,CAAhC,CAAJ,GACIF,CAAAG,eAAA,EAMA,CALIC,CAKJ,CALWpB,CAAAoB,KAAAC,MAAA,CAAe,GAAf,CAAA,CAAoB,CAApB,CAKX,CAJIC,CAIJ,CAJYrB,CAAAC,SAAAqB,cAAA,CAA2B,GAA3B;AAAiCH,CAAjC,CAIZ,CAHAnB,CAAAuB,eAAA,EAGA,CAFAvB,CAAAwB,iBAAA,EAEA,CADAzB,CAAAG,UAAAO,IAAA,CAAkBT,CAAAI,YAAAqB,aAAlB,CACA,CAAAJ,CAAAnB,UAAAO,IAAA,CAAoBT,CAAAI,YAAAqB,aAApB,CAPJ,CADuC,CAA3C,CAVK,CADkB,CAo1B/BC,QAASA,EAAiB,CAAC3B,CAAD,CAAM4B,CAAN,CAAYC,CAAZ,CAAoBC,CAApB,CAA4B,CAIlDC,QAASA,EAAS,EAAG,CACjB,IAAIX,EAAOpB,CAAAoB,KAAAC,MAAA,CAAe,GAAf,CAAA,CAAoB,CAApB,CAAX,CACIC,EAAQQ,CAAAE,SAAAT,cAAA,CAA8B,GAA9B,CAAoCH,CAApC,CACZU,EAAAN,eAAA,CAAsBI,CAAtB,CACAE,EAAAL,iBAAA,CAAwBI,CAAxB,CACA7B,EAAAG,UAAAO,IAAA,CAAkBoB,CAAAzB,YAAA4B,UAAlB,CACAX,EAAAnB,UAAAO,IAAA,CAAoBoB,CAAAzB,YAAA4B,UAApB,CANiB,CAQrB,GAAIH,CAAAI,QAAA/B,UAAAC,SAAA,CAAkC0B,CAAAzB,YAAA8B,iBAAlC,CAAJ,CAA4E,CACxE,IAAI5B,EAAkBC,QAAAC,cAAA,CAAuB,MAAvB,CACtBF,EAAAJ,UAAAO,IAAA,CAA8BoB,CAAAzB,YAAA+B,iBAA9B,CACA7B;CAAAJ,UAAAO,IAAA,CAA8BoB,CAAAzB,YAAA8B,iBAA9B,CACA,KAAIvB,EAASJ,QAAAC,cAAA,CAAuB,MAAvB,CACbG,EAAAT,UAAAO,IAAA,CAAqBoB,CAAAzB,YAAAgC,OAArB,CACA9B,EAAAO,YAAA,CAA4BF,CAA5B,CACAZ,EAAAc,YAAA,CAAgBP,CAAhB,CAPwE,CASvEuB,CAAAI,QAAA/B,UAAAC,SAAA,CAAkC0B,CAAAzB,YAAAiC,kBAAlC,CAAL,EACItC,CAAAe,iBAAA,CAAqB,OAArB,CAA8B,QAAS,CAACC,CAAD,CAAI,CACI,GAA3C,GAAIhB,CAAAiB,aAAA,CAAiB,MAAjB,CAAAC,OAAA,CAAgC,CAAhC,CAAJ,GACIF,CAAAG,eAAA,EACA,CAAAY,CAAA,EAFJ,CADuC,CAA3C,CAOJ/B,EAAAuC,KAAA,CAAWR,CA7BuC,CAt9GtD,IAAIS,EAAmB,CAUrBC,WAAYA,QAAQ,CAACC,CAAD,CAAaC,CAAb,CAA0B,EAVzB,CAkBrBC,eAAgBA,QAAQ,CAACC,CAAD,CAAUH,CAAV,CAAsB,EAlBzB,CAyBrBI,gBAAiBA,QAAQ,CAACC,CAAD,CAAW,EAzBf,CA8BrBC,qBAAsBA,QAAQ,EAAG,EA9BZ,CAyCrBC,yBAA0BA,QAAQ,CAACC,CAAD,CAAUC,CAAV,CAAoB,EAzCjC;AA+CrBC,SAAUA,QAAQ,CAACC,CAAD,CAAS,EA/CN,CAqDrBC,kBAAmBA,QAAQ,CAACC,CAAD,CAAQ,EArDd,CAAvB,CAwDAf,EAAoB,QAAQ,EAAG,CAoB7BgB,QAASA,EAAoB,CAACC,CAAD,CAAOC,CAAP,CAAmB,CAC9C,IAAK,IAAIC,EAAI,CAAb,CAAgBA,CAAhB,CAAoBC,CAAAC,OAApB,CAAkDF,CAAA,EAAlD,CACE,GAAIC,CAAA,CAAsBD,CAAtB,CAAAG,UAAJ,GAA2CL,CAA3C,CAIE,MAH0B,WAGnB,GAHH,MAAOC,EAGJ,GAFLE,CAAA,CAAsBD,CAAtB,CAEK,CAFsBD,CAEtB,EAAAE,CAAA,CAAsBD,CAAtB,CAGX,OAAO,CAAA,CATuC,CAmBhDI,QAASA,EAAyB,CAAClB,CAAD,CAAU,CACtCmB,CAAAA,CAAenB,CAAA5B,aAAA,CAAqB,eAArB,CAEnB,OAAwB,KAAjB,GAAA+C,CAAA,CAAwB,CAAC,EAAD,CAAxB,CAA+BA,CAAA3C,MAAA,CAAmB,GAAnB,CAHI,CAe5C4C,QAASA,EAAkB,CAACpB,CAAD,CAAUK,CAAV,CAAmB,CAE5C,MAA0C,EAA1C,GADmBa,CAAAG,CAA0BrB,CAA1BqB,CACZC,QAAA,CAAqBjB,CAArB,CAFqC,CAa9CkB,QAASA,EAAY,CAACC,CAAD,CAAYC,CAAZ,CAAqBC,CAArB,CAAiC,CACpD,GAAI,aAAJ,EAAqBC,OAArB,EAA6D,UAA7D,GAA+B,MAAOA,OAAAC,YAAtC,CACE,MAAO,KAAIA,WAAJ,CAAgBJ,CAAhB,CAA2B,CAChCC,QAASA,CADuB,CAEhCC,WAAYA,CAFoB,CAA3B,CAKP,KAAIG,EAAKlE,QAAAmE,YAAA,CAAqB,QAArB,CACTD,EAAAE,UAAA,CAAaP,CAAb,CAAwBC,CAAxB,CAAiCC,CAAjC,CACA;MAAOG,EAT2C,CAsBtDG,QAASA,EAAkB,CAACnC,CAAD,CAAaC,CAAb,CAA0B,CACnD,GAA0B,WAA1B,GAAI,MAAOD,EAAX,EAC2B,WAD3B,GACI,MAAOC,EADX,CAEE,IAAK,IAAIgB,EAAI,CAAb,CAAgBA,CAAhB,CAAoBC,CAAAC,OAApB,CAAkDF,CAAA,EAAlD,CACEkB,CAAA,CAAmBjB,CAAA,CAAsBD,CAAtB,CAAAG,UAAnB,CACIF,CAAA,CAAsBD,CAAtB,CAAAmB,SADJ,CAHJ,KAMO,CAEsB,WAA3B,GAAI,MAAOnC,EAAX,GACMoC,CADN,CACwBvB,CAAA,CAFad,CAEb,CADxB,IAGIC,CAHJ,CAGkBoC,CAAAD,SAHlB,CAQA,KADI/B,IAAAA,EAAWvC,QAAAwE,iBAAA,CAA0B,GAA1B,CAAgCrC,CAAhC,CAAXI,CACKkC,EAAI,CAAb,CAAgBA,CAAhB,CAAoBlC,CAAAc,OAApB,CAAqCoB,CAAA,EAArC,CACEC,CAAA,CAAuBnC,CAAA,CAASkC,CAAT,CAAvB,CAVmCvC,CAUnC,CAXG,CAP4C,CA8BrDwC,QAASA,EAAsB,CAACrC,CAAD,CAAUH,CAAV,CAAsB,CAEnD,GAAM,EAAmB,QAAnB,GAAA,MAAOG,EAAP,EAA+BA,CAA/B,WAAkDsC,QAAlD,CAAN,CACE,KAAUC,MAAJ,CAAU,mDAAV,CAAN,CAGF,IAAIC,EAAcjB,CAAA,CAAa,wBAAb,CAAuC,CAAA,CAAvC,CAA6C,CAAA,CAA7C,CAClBvB,EAAAyC,cAAA,CAAsBD,CAAtB,CACA,IAAIE,CAAAF,CAAAE,iBAAJ,CAAA,CAIIrB,IAAAA,EAAeH,CAAA,CAA0BlB,CAA1B,CAAfqB,CACAsB,EAAmB,EAGvB,IAAK9C,CAAL,CAUYuB,CAAA,CAAmBpB,CAAnB,CAA4BH,CAA5B,CAAL;AACL8C,CAAAC,KAAA,CAAsBjC,CAAA,CAAqBd,CAArB,CAAtB,CAXF,KAAiB,CACf,IAAIvC,EAAY0C,CAAA1C,UAChByD,EAAA8B,QAAA,CAA8B,QAAQ,CAACC,CAAD,CAAY,CAE5CxF,CAAAC,SAAA,CAAmBuF,CAAAb,SAAnB,CAAJ,EAC6C,EAD7C,GACIU,CAAArB,QAAA,CAAyBwB,CAAzB,CADJ,EAEK,CAAA1B,CAAA,CAAmBpB,CAAnB,CAA4B8C,CAAA7B,UAA5B,CAFL,EAGE0B,CAAAC,KAAA,CAAsBE,CAAtB,CAL8C,CAAlD,CAFe,CAejB,IA/BmD,IA+B1ChC,EAAI,CA/BsC,CA+BnCsB,EAAIO,CAAA3B,OA/B+B,CA+BNkB,CAA7C,CAA8DpB,CAA9D,CAAkEsB,CAAlE,CAAqEtB,CAAA,EAArE,CAA0E,CAExE,GADAoB,CACA,CADkBS,CAAA,CAAiB7B,CAAjB,CAClB,CAAqB,CAEnBO,CAAAuB,KAAA,CAAkBV,CAAAjB,UAAlB,CACAjB,EAAA+C,aAAA,CAAqB,eAArB,CAAsC1B,CAAA2B,KAAA,CAAkB,GAAlB,CAAtC,CACA,KAAIC,EAAW,IAAIf,CAAAgB,iBAAJ,CAAqClD,CAArC,CACfiD,EAAA,4BAAA,CAAqCf,CACrCiB,EAAAP,KAAA,CAAwBK,CAAxB,CAEA,KARmB,IAQVG,EAAI,CARM,CAQHC,EAAInB,CAAAoB,UAAAtC,OAApB,CAAsDoC,CAAtD,CAA0DC,CAA1D,CAA6DD,CAAA,EAA7D,CACElB,CAAAoB,UAAA,CAA0BF,CAA1B,CAAA,CAA6BpD,CAA7B,CAGEkC,EAAAqB,OAAJ,GAEEvD,CAAA,CAAQkC,CAAAjB,UAAR,CAFF,CAEuCgC,CAFvC,CAZmB,CAArB,IAiBE,MAAUV,MAAJ,CACJ,4DADI,CAAN,CAIEiB,CAAAA,CAAajC,CAAA,CAAa,uBAAb;AAAsC,CAAA,CAAtC,CAA4C,CAAA,CAA5C,CACjBvB,EAAAyC,cAAA,CAAsBe,CAAtB,CAxBwE,CAvB1E,CARmD,CAiErDC,QAASA,EAAuB,CAACvD,CAAD,CAAW,CACpCwD,KAAAC,QAAA,CAAczD,CAAd,CAAL,GAEIA,CAFJ,CACMA,CAAJ,WAAwBoC,QAAxB,CACa,CAACpC,CAAD,CADb,CAGawD,KAAAE,UAAAC,MAAAC,KAAA,CAA2B5D,CAA3B,CAJf,CAOA,KARyC,IAQhCY,EAAI,CAR4B,CAQzBsB,EAAIlC,CAAAc,OARqB,CAQJhB,CAArC,CAA8Cc,CAA9C,CAAkDsB,CAAlD,CAAqDtB,CAAA,EAArD,CACEd,CACA,CADUE,CAAA,CAASY,CAAT,CACV,CAAId,CAAJ,WAAuB+D,YAAvB,GACE1B,CAAA,CAAuBrC,CAAvB,CACA,CAA8B,CAA9B,CAAIA,CAAAgE,SAAAhD,OAAJ,EACEyC,CAAA,CAAwBzD,CAAAgE,SAAxB,CAHJ,CAVuC,CAsG3CC,QAASA,EAA4B,CAACnB,CAAD,CAAY,CAC/C,GAAIA,CAAJ,CAAe,CACb,IAAIoB,EAAiBf,CAAA7B,QAAA,CAA2BwB,CAA3B,CACrBK,EAAAgB,OAAA,CAA0BD,CAA1B,CAA0C,CAA1C,CAEIE,KAAAA,EAAWtB,CAAAzF,SAAAe,aAAA,CAAgC,eAAhC,CAAAI,MAAA,CAAuD,GAAvD,CAAX4F,CACAC,EAAiBD,CAAA9C,QAAA,CAAiBwB,CAAA,4BAAAwB,cAAjB,CACrBF,EAAAD,OAAA,CAAgBE,CAAhB,CAAgC,CAAhC,CACAvB,EAAAzF,SAAA0F,aAAA,CAAgC,eAAhC,CAAiDqB,CAAApB,KAAA,CAAc,GAAd,CAAjD,CAEInB,EAAAA,CAAKN,CAAA,CAAa,yBAAb,CAAwC,CAAA,CAAxC,CAA8C,CAAA,CAA9C,CACTuB,EAAAzF,SAAAoF,cAAA,CAAiCZ,CAAjC,CAVa,CADgC,CA9RpB;AAI7B,IAAId,EAAwB,EAA5B,CAGIoC,EAAqB,EAkUzB,OAAO,CACLvD,WAAYoC,CADP,CAELjC,eAAgBsC,CAFX,CAGLpC,gBAAiBwD,CAHZ,CAILtD,qBA5DFoE,QAAqC,EAAG,CACtC,IAAK,IAAInC,EAAI,CAAb,CAAgBA,CAAhB,CAAoBrB,CAAAC,OAApB,CAAkDoB,CAAA,EAAlD,CACEJ,CAAA,CAAmBjB,CAAA,CAAsBqB,CAAtB,CAAAnB,UAAnB,CAFoC,CAwDjC,CAKLb,yBAxEFoE,QAAyC,CAACnE,CAAD,CAAUC,CAAV,CAAoB,CAC3D,IAAImE,EAAW9D,CAAA,CAAqBN,CAArB,CACXoE,EAAJ,EACEA,CAAAnB,UAAAV,KAAA,CAAwBtC,CAAxB,CAHyD,CAmEtD,CAMLC,SA/HFmE,QAAyB,CAAClE,CAAD,CAAS,CAOhC,IAAI+C,EAAS,CAAA,CAEb,IAJ8C,WAI9C,GAJqB,MAAO/C,EAAA+C,OAI5B,EAHgC,WAGhC,GAHI,MAAO/C,EAAA,OAGX,CACE+C,CAAA,CAAS/C,CAAA+C,OAAT,EAA0B/C,CAAA,OAG5B,KAAImE,EAA6D,CAC/DzB,iBAAkB1C,CAAAoE,YAAlB1B,EAAwC1C,CAAA,YADuB,CAE/DS,UAAWT,CAAA8D,cAAXrD,EAAmCT,CAAA,cAF4B,CAG/DyB,SAAUzB,CAAAyB,SAAVA,EAA6BzB,CAAA,SAHkC,CAI/D+C,OAAQA,CAJuD,CAK/DD,UAAW,EALoD,CAQjEvC,EAAA8B,QAAA,CAA8B,QAAQ,CAACgC,CAAD,CAAO,CAC3C,GAAIA,CAAA5C,SAAJ;AAAsB0C,CAAA1C,SAAtB,CACE,KAAUM,MAAJ,CAAU,qDAAV,CAAkEsC,CAAA5C,SAAlE,CAAN,CAEF,GAAI4C,CAAA5D,UAAJ,GAAuB0D,CAAA1D,UAAvB,CACE,KAAUsB,MAAJ,CAAU,oDAAV,CAAN,CALyC,CAA7C,CASA,IAAI/B,CAAAoE,YAAAhB,UAAAkB,eAAA,CArOyBC,6BAqOzB,CAAJ,CAEE,KAAUxC,MAAJ,CACF,wFADE,CAAN,CAKU5B,CAAAqE,CAAqBxE,CAAA8D,cAArBU,CAA2CL,CAA3CK,CAEZ,EACEjE,CAAA6B,KAAA,CAA2B+B,CAA3B,CAxC8B,CAyH3B,CAOLlE,kBA9BFwE,QAA+B,CAACvE,CAAD,CAAQ,CAKrC,IAAIwE,EAAgBA,QAAQ,CAACC,CAAD,CAAO,CACjChC,CAAAiC,OAAA,CAA0B,QAAQ,CAACP,CAAD,CAAO,CACvC,MAAOA,EAAAxH,SAAP,GAAyB8H,CADc,CAAzC,CAAAtC,QAAA,CAEWoB,CAFX,CADiC,CAKnC,IAAIvD,CAAJ;AAAqBgD,KAArB,EAA8BhD,CAA9B,WAA+C2E,SAA/C,CACE,IAAK,IAAIjD,EAAI,CAAb,CAAgBA,CAAhB,CAAoB1B,CAAAM,OAApB,CAAkCoB,CAAA,EAAlC,CACE8C,CAAA,CAAcxE,CAAA,CAAM0B,CAAN,CAAd,CAFJ,KAIO,IAAI1B,CAAJ,WAAqB4E,KAArB,CACLJ,CAAA,CAAcxE,CAAd,CADK,KAGL,MAAU6B,MAAJ,CAAU,mDAAV,CAAN,CAjBmC,CAuBhC,CAzUsB,CAAZ,EA+XnB5C,EAAA,WAAA,CAAiCA,CAAAC,WACjCD,EAAA,eAAA,CAAqCA,CAAAI,eACrCJ,EAAA,gBAAA,CAAsCA,CAAAM,gBACtCN,EAAA,qBAAA,CACIA,CAAAQ,qBACJR,EAAA,yBAAA,CACIA,CAAAS,yBACJT,EAAA,SAAA,CAA+BA,CAAAY,SAC/BZ,EAAA,kBAAA,CAAwCA,CAAAc,kBACxCkB,OAAAhC,iBAAA,CAA0BA,CAC1BgC,OAAA,iBAAA,CAA6BhC,CAE7BgC,OAAAzD,iBAAA,CAAwB,MAAxB;AAAgC,QAAQ,EAAG,CAQrC,WAAJ,EAAmBP,SAAAC,cAAA,CAAuB,KAAvB,CAAnB,EACI,eADJ,EACuBD,SADvB,EAEI,kBAFJ,EAE0BgE,OAF1B,EAEoC+B,KAAAE,UAAAf,QAFpC,EAGElF,QAAA4H,gBAAAjI,UAAAO,IAAA,CAAuC,QAAvC,CACA,CAAA8B,CAAAQ,qBAAA,EAJF,GASER,CAAAI,eAIA,CAJkCyF,QAAQ,EAAG,EAI7C,CAAA7F,CAAAY,SAAA,CAA4BkF,QAAQ,EAAG,EAbzC,CARyC,CAA3C,CAgCKC,KAAAC,IAAL,GAKID,IAAAC,IAGA,CAHWC,QAAS,EAAG,CACnB,MAAOC,CAAA,IAAIH,IAAJG,SAAA,EADY,CAGvB,CAAAH,IAAA,IAAA,CAAcA,IAAAC,IARlB,CAcA,KAJA,IAAIG,EAAU,CACV,QADU,CAEV,KAFU,CAAd,CAIShF,EAAI,CAAb,CAAgBA,CAAhB,CAAoBgF,CAAA9E,OAApB,EAAuC+E,CAAApE,MAAAoE,sBAAvC,CAAqE,EAAEjF,CAAvE,CAA0E,CACtE,IAAIkF,EAAKF,CAAA,CAAQhF,CAAR,CACTa,OAAAoE,sBAAA,CAA+BpE,MAAA,CAAOqE,CAAP,CAAY,uBAAZ,CAC/BrE;MAAAsE,qBAAA,CAA8BtE,MAAA,CAAOqE,CAAP,CAAY,sBAAZ,CAA9B,EAAqErE,MAAA,CAAOqE,CAAP,CAAY,6BAAZ,CACrErE,OAAA,sBAAA,CAAkCA,MAAAoE,sBAClCpE,OAAA,qBAAA,CAAiCA,MAAAsE,qBALqC,CAO1E,GAAI,sBAAAC,KAAA,CAA4BvE,MAAAwE,UAAAC,UAA5B,CAAJ,EAAgEL,CAAApE,MAAAoE,sBAAhE,EAAiGE,CAAAtE,MAAAsE,qBAAjG,CAA8H,CAC1H,IAAII,EAAW,CAKf1E,OAAAoE,sBAAA,CAA+BO,QAAS,CAAChG,CAAD,CAAW,CAC/C,IAAIqF,EAAMD,IAAAC,IAAA,EAAV,CACIY,EAAWC,IAAAC,IAAA,CAASJ,CAAT,CAAoB,EAApB,CAAwBV,CAAxB,CACf,OAAOe,WAAA,CAAW,QAAS,EAAG,CAC1BpG,CAAA,CAAS+F,CAAT,CAAoBE,CAApB,CAD0B,CAAvB,CAEJA,CAFI,CAEOZ,CAFP,CAHwC,CAOnDhE,OAAAsE,qBAAA,CAA8BU,YAC9BhF;MAAA,sBAAA,CAAkCA,MAAAoE,sBAClCpE,OAAA,qBAAA,CAAiCA,MAAAsE,qBAfyF,CAwC1HW,CAAAA,CAAiBA,QAAuB,CAAC5G,CAAD,CAAU,CAClD,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAHkD,CAKtDlF,OAAA,eAAA,CAA2BiF,CAO3BA,EAAAhD,UAAAkD,UAAA,CAAqC,EASrCF,EAAAhD,UAAApG,YAAA,CAAuC,CACnCuJ,cAAe,sBADoB,CAEnCxH,iBAAkB,8BAFiB,CAGnCC,OAAQ,YAH2B,CAWvCoH,EAAAhD,UAAAoD,aAAA,CAAwCC,QAAS,CAACC,CAAD,CAAQ,CACjDA,CAAJ,EACI,IAAA7J,SAAA8J,KAAA,EAFiD,CAWzDP,EAAAhD,UAAAwD,QAAA,CAAmCC,QAAS,EAAG,CAC3C,IAAAhK,SAAAiK,SAAA,CAAyB,CAAA,CADkB,CAG/CV,EAAAhD,UAAA,QAAA,CAAsCgD,CAAAhD,UAAAwD,QAMtCR,EAAAhD,UAAA2D,OAAA;AAAkCC,QAAS,EAAG,CAC1C,IAAAnK,SAAAiK,SAAA,CAAyB,CAAA,CADiB,CAG9CV,EAAAhD,UAAA,OAAA,CAAqCgD,CAAAhD,UAAA2D,OAIrCX,EAAAhD,UAAAiD,KAAA,CAAgCY,QAAS,EAAG,CACxC,GAAI,IAAApK,SAAJ,CAAmB,CACf,GAAI,IAAAA,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAuJ,cAAjC,CAAJ,CAAsE,CAClE,IAAIrJ,EAAkBC,QAAAC,cAAA,CAAuB,MAAvB,CACtBF,EAAAJ,UAAAO,IAAA,CAA8B,IAAAL,YAAA+B,iBAA9B,CACA,KAAAmI,eAAA,CAAsB/J,QAAAC,cAAA,CAAuB,MAAvB,CACtB,KAAA8J,eAAApK,UAAAO,IAAA,CAAkC,IAAAL,YAAAgC,OAAlC,CACA9B,EAAAO,YAAA,CAA4B,IAAAyJ,eAA5B,CACA,KAAAC,uBAAA,CAA8B,IAAAX,aAAAY,KAAA,CAAuB,IAAvB,CAC9B,KAAAF,eAAAxJ,iBAAA,CAAqC,SAArC;AAAgD,IAAAyJ,uBAAhD,CACA,KAAAtK,SAAAY,YAAA,CAA0BP,CAA1B,CARkE,CAUtE,IAAAmK,uBAAA,CAA8B,IAAAb,aAAAY,KAAA,CAAuB,IAAvB,CAC9B,KAAAvK,SAAAa,iBAAA,CAA+B,SAA/B,CAA0C,IAAA2J,uBAA1C,CACA,KAAAxK,SAAAa,iBAAA,CAA+B,YAA/B,CAA6C,IAAA2J,uBAA7C,CAbe,CADqB,CAmB5ClI,EAAAY,SAAA,CAA0B,CACtBqE,YAAagC,CADS,CAEtBtC,cAAe,gBAFO,CAGtBrC,SAAU,eAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BIuE,EAAAA,CAAmBA,QAAyB,CAAC9H,CAAD,CAAU,CACtD,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAHsD,CAK1DlF,OAAA,iBAAA,CAA6BmG,CAO7BA,EAAAlE,UAAAkD,UAAA,CAAuC,CAAEiB,aAAc,IAAhB,CASvCD,EAAAlE,UAAApG,YAAA,CAAyC,CACrCwK,MAAO,qBAD8B;AAErCC,YAAa,2BAFwB,CAGrCC,aAAc,4BAHuB,CAIrCC,aAAc,4BAJuB,CAKrCpB,cAAe,sBALsB,CAMrCqB,qBAAsB,qCANe,CAOrC7I,iBAAkB,gCAPmB,CAQrC8I,cAAe,oBARsB,CASrC7I,OAAQ,YAT6B,CAUrC8I,WAAY,YAVyB,CAWrCC,YAAa,aAXwB,CAYrCC,WAAY,YAZyB,CAarCC,YAAa,aAbwB,CAqBzCX,EAAAlE,UAAA8E,UAAA,CAAuCC,QAAS,CAACzB,CAAD,CAAQ,CACpD,IAAA0B,eAAA,EADoD,CASxDd,EAAAlE,UAAAiF,SAAA;AAAsCC,QAAS,CAAC5B,CAAD,CAAQ,CACnD,IAAA7J,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA8K,WAA5B,CADmD,CASvDR,EAAAlE,UAAAmF,QAAA,CAAqCC,QAAS,CAAC9B,CAAD,CAAQ,CAClD,IAAA7J,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA8K,WAA/B,CADkD,CAStDR,EAAAlE,UAAAsF,WAAA,CAAwCC,QAAS,CAACjC,CAAD,CAAQ,CACrD,IAAAkC,MAAA,EADqD,CAQzDtB,EAAAlE,UAAAgF,eAAA,CAA4CS,QAAS,EAAG,CACpD,IAAAC,cAAA,EACA,KAAAC,iBAAA,EAFoD,CASxDzB,EAAAlE,UAAAwF,MAAA,CAAmCI,QAAS,EAAG,CAG3C7H,MAAA+E,WAAA,CAAkB,QAAS,EAAG,CAC1B,IAAA+C,cAAAtC,KAAA,EAD0B,CAAZS,KAAA,CAEX,IAFW,CAAlB,CAEc,IAAAd,UAAAiB,aAFd,CAH2C,CAa/CD,EAAAlE,UAAA2F,iBAAA,CAA8CG,QAAS,EAAG,CAClD,IAAAD,cAAAE,QAAJ,CACI,IAAAtM,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAgL,WAA5B,CADJ;AAGI,IAAAnL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAAgL,WAA/B,CAJkD,CAO1DV,EAAAlE,UAAA,iBAAA,CAAiDkE,CAAAlE,UAAA2F,iBAMjDzB,EAAAlE,UAAA0F,cAAA,CAA2CM,QAAS,EAAG,CAC/C,IAAAH,cAAAnC,SAAJ,CACI,IAAAjK,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA+K,YAA5B,CADJ,CAGI,IAAAlL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA+K,YAA/B,CAJ+C,CAOvDT,EAAAlE,UAAA,cAAA,CAA8CkE,CAAAlE,UAAA0F,cAM9CxB,EAAAlE,UAAAwD,QAAA,CAAqCyC,QAAS,EAAG,CAC7C,IAAAJ,cAAAnC,SAAA,CAA8B,CAAA,CAC9B,KAAAsB,eAAA,EAF6C,CAIjDd,EAAAlE,UAAA,QAAA,CAAwCkE,CAAAlE,UAAAwD,QAMxCU,EAAAlE,UAAA2D,OAAA,CAAoCuC,QAAS,EAAG,CAC5C,IAAAL,cAAAnC,SAAA;AAA8B,CAAA,CAC9B,KAAAsB,eAAA,EAF4C,CAIhDd,EAAAlE,UAAA,OAAA,CAAuCkE,CAAAlE,UAAA2D,OAMvCO,EAAAlE,UAAAmG,MAAA,CAAmCC,QAAS,EAAG,CAC3C,IAAAP,cAAAE,QAAA,CAA6B,CAAA,CAC7B,KAAAf,eAAA,EAF2C,CAI/Cd,EAAAlE,UAAA,MAAA,CAAsCkE,CAAAlE,UAAAmG,MAMtCjC,EAAAlE,UAAAqG,QAAA,CAAqCC,QAAS,EAAG,CAC7C,IAAAT,cAAAE,QAAA,CAA6B,CAAA,CAC7B,KAAAf,eAAA,EAF6C,CAIjDd,EAAAlE,UAAA,QAAA,CAAwCkE,CAAAlE,UAAAqG,QAIxCnC,EAAAlE,UAAAiD,KAAA,CAAkCsD,QAAS,EAAG,CAC1C,GAAI,IAAA9M,SAAJ,CAAmB,CACf,IAAAoM,cAAA,CAAqB,IAAApM,SAAAqB,cAAA,CAA4B,GAA5B,CAAkC,IAAAlB,YAAAwK,MAAlC,CACrB,KAAIoC,EAAazM,QAAAC,cAAA,CAAuB,MAAvB,CACjBwM,EAAA9M,UAAAO,IAAA,CAAyB,IAAAL,YAAAyK,YAAzB,CACA;IAAIoC,EAAgB1M,QAAAC,cAAA,CAAuB,MAAvB,CACpByM,EAAA/M,UAAAO,IAAA,CAA4B,IAAAL,YAAA0K,aAA5B,CACA,KAAIoC,EAAc3M,QAAAC,cAAA,CAAuB,MAAvB,CAClB0M,EAAAhN,UAAAO,IAAA,CAA0B,IAAAL,YAAA2K,aAA1B,CACAiC,EAAAnM,YAAA,CAAuBqM,CAAvB,CACA,KAAAjN,SAAAY,YAAA,CAA0BoM,CAA1B,CACA,KAAAhN,SAAAY,YAAA,CAA0BmM,CAA1B,CACI,KAAA/M,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAuJ,cAAjC,CAAJ,GACI,IAAA1J,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA4K,qBAA5B,CAUA,CATA,IAAAmC,wBASA,CAT+B5M,QAAAC,cAAA,CAAuB,MAAvB,CAS/B,CARA,IAAA2M,wBAAAjN,UAAAO,IAAA,CAA2C,IAAAL,YAAA+B,iBAA3C,CAQA;AAPA,IAAAgL,wBAAAjN,UAAAO,IAAA,CAA2C,IAAAL,YAAAuJ,cAA3C,CAOA,CANA,IAAAwD,wBAAAjN,UAAAO,IAAA,CAA2C,IAAAL,YAAA6K,cAA3C,CAMA,CALA,IAAAmC,mBAKA,CAL0B,IAAAtB,WAAAtB,KAAA,CAAqB,IAArB,CAK1B,CAJA,IAAA2C,wBAAArM,iBAAA,CAA8C,SAA9C,CAAyD,IAAAsM,mBAAzD,CAIA,CAHIzM,CAGJ,CAHaJ,QAAAC,cAAA,CAAuB,MAAvB,CAGb,CAFAG,CAAAT,UAAAO,IAAA,CAAqB,IAAAL,YAAAgC,OAArB,CAEA,CADA,IAAA+K,wBAAAtM,YAAA,CAAyCF,CAAzC,CACA,CAAA,IAAAV,SAAAY,YAAA,CAA0B,IAAAsM,wBAA1B,CAXJ,CAaA,KAAAE,mBAAA,CAA0B,IAAA/B,UAAAd,KAAA,CAAoB,IAApB,CAC1B;IAAA8C,kBAAA,CAAyB,IAAA7B,SAAAjB,KAAA,CAAmB,IAAnB,CACzB,KAAA+C,iBAAA,CAAwB,IAAA5B,QAAAnB,KAAA,CAAkB,IAAlB,CACxB,KAAAgD,oBAAA,CAA2B,IAAA1B,WAAAtB,KAAA,CAAqB,IAArB,CAC3B,KAAA6B,cAAAvL,iBAAA,CAAoC,QAApC,CAA8C,IAAAuM,mBAA9C,CACA,KAAAhB,cAAAvL,iBAAA,CAAoC,OAApC,CAA6C,IAAAwM,kBAA7C,CACA,KAAAjB,cAAAvL,iBAAA,CAAoC,MAApC,CAA4C,IAAAyM,iBAA5C,CACA,KAAAtN,SAAAa,iBAAA,CAA+B,SAA/B,CAA0C,IAAA0M,oBAA1C,CACA,KAAAhC,eAAA,EACA,KAAAvL,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAiL,YAA5B,CAjCe,CADuB,CAuC9C9I,EAAAY,SAAA,CAA0B,CACtBqE,YAAakD,CADS;AAEtBxD,cAAe,kBAFO,CAGtBrC,SAAU,iBAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BIsH,EAAAA,CAAqBA,QAA2B,CAAC7K,CAAD,CAAU,CAC1D,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAH0D,CAK9DlF,OAAA,mBAAA,CAA+BkJ,CAO/BA,EAAAjH,UAAAkD,UAAA,CAAyC,CAAEiB,aAAc,IAAhB,CASzC8C,EAAAjH,UAAApG,YAAA,CAA2C,CACvCwK,MAAO,wBADgC,CAEvC1I,iBAAkB,sBAFqB,CAGvC8I,qBAAsB,qCAHiB,CAIvC7I,iBAAkB,mCAJqB,CAKvC8I,cAAe,oBALwB,CAMvC7I,OAAQ,YAN+B,CAOvC8I,WAAY,YAP2B,CAQvCC,YAAa,aAR0B,CASvCC,WAAY,YAT2B,CAiB3CqC;CAAAjH,UAAA8E,UAAA,CAAyCoC,QAAS,CAAC5D,CAAD,CAAQ,CACtD,IAAA0B,eAAA,EADsD,CAS1DiC,EAAAjH,UAAAiF,SAAA,CAAwCkC,QAAS,CAAC7D,CAAD,CAAQ,CACrD,IAAA7J,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA8K,WAA5B,CADqD,CASzDuC,EAAAjH,UAAAmF,QAAA,CAAuCiC,QAAS,CAAC9D,CAAD,CAAQ,CACpD,IAAA7J,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA8K,WAA/B,CADoD,CASxDuC,EAAAjH,UAAAsF,WAAA,CAA0C+B,QAAS,CAAC/D,CAAD,CAAQ,CACvD,IAAAkC,MAAA,EADuD,CAQ3DyB,EAAAjH,UAAAgF,eAAA,CAA8CsC,QAAS,EAAG,CACtD,IAAA5B,cAAA,EACA,KAAAC,iBAAA,EAFsD,CAS1DsB,EAAAjH,UAAAwF,MAAA,CAAqC+B,QAAS,EAAG,CAG7CxJ,MAAA+E,WAAA,CAAkB,QAAS,EAAG,CAC1B,IAAA+C,cAAAtC,KAAA,EAD0B,CAAZS,KAAA,CAEX,IAFW,CAAlB,CAEc,IAAAd,UAAAiB,aAFd,CAH6C,CAajD8C,EAAAjH,UAAA2F,iBAAA;AAAgD6B,QAAS,EAAG,CACpD,IAAA3B,cAAAE,QAAJ,CACI,IAAAtM,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAgL,WAA5B,CADJ,CAGI,IAAAnL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAAgL,WAA/B,CAJoD,CAO5DqC,EAAAjH,UAAA,iBAAA,CAAmDiH,CAAAjH,UAAA2F,iBAMnDsB,EAAAjH,UAAA0F,cAAA,CAA6C+B,QAAS,EAAG,CACjD,IAAA5B,cAAAnC,SAAJ,CACI,IAAAjK,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA+K,YAA5B,CADJ,CAGI,IAAAlL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA+K,YAA/B,CAJiD,CAOzDsC,EAAAjH,UAAA,cAAA,CAAgDiH,CAAAjH,UAAA0F,cAMhDuB,EAAAjH,UAAAwD,QAAA,CAAuCkE,QAAS,EAAG,CAC/C,IAAA7B,cAAAnC,SAAA;AAA8B,CAAA,CAC9B,KAAAsB,eAAA,EAF+C,CAInDiC,EAAAjH,UAAA,QAAA,CAA0CiH,CAAAjH,UAAAwD,QAM1CyD,EAAAjH,UAAA2D,OAAA,CAAsCgE,QAAS,EAAG,CAC9C,IAAA9B,cAAAnC,SAAA,CAA8B,CAAA,CAC9B,KAAAsB,eAAA,EAF8C,CAIlDiC,EAAAjH,UAAA,OAAA,CAAyCiH,CAAAjH,UAAA2D,OAMzCsD,EAAAjH,UAAAmG,MAAA,CAAqCyB,QAAS,EAAG,CAC7C,IAAA/B,cAAAE,QAAA,CAA6B,CAAA,CAC7B,KAAAf,eAAA,EAF6C,CAIjDiC,EAAAjH,UAAA,MAAA,CAAwCiH,CAAAjH,UAAAmG,MAMxCc,EAAAjH,UAAAqG,QAAA,CAAuCwB,QAAS,EAAG,CAC/C,IAAAhC,cAAAE,QAAA,CAA6B,CAAA,CAC7B,KAAAf,eAAA,EAF+C,CAInDiC,EAAAjH,UAAA,QAAA,CAA0CiH,CAAAjH,UAAAqG,QAI1CY,EAAAjH,UAAAiD,KAAA,CAAoC6E,QAAS,EAAG,CAC5C,GAAI,IAAArO,SAAJ,CAAmB,CACf,IAAAoM,cAAA,CAAqB,IAAApM,SAAAqB,cAAA,CAA4B,GAA5B;AAAkC,IAAAlB,YAAAwK,MAAlC,CACrB,IAAI,IAAA3K,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA8B,iBAAjC,CAAJ,CAAyE,CACrE,IAAAjC,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA4K,qBAA5B,CACA,KAAAmC,wBAAA,CAA+B5M,QAAAC,cAAA,CAAuB,MAAvB,CAC/B,KAAA2M,wBAAAjN,UAAAO,IAAA,CAA2C,IAAAL,YAAA+B,iBAA3C,CACA,KAAAgL,wBAAAjN,UAAAO,IAAA,CAA2C,IAAAL,YAAA8B,iBAA3C,CACA,KAAAiL,wBAAAjN,UAAAO,IAAA,CAA2C,IAAAL,YAAA6K,cAA3C,CACA,KAAAmC,mBAAA,CAA0B,IAAAtB,WAAAtB,KAAA,CAAqB,IAArB,CAC1B;IAAA2C,wBAAArM,iBAAA,CAA8C,SAA9C,CAAyD,IAAAsM,mBAAzD,CACA,KAAIzM,EAASJ,QAAAC,cAAA,CAAuB,MAAvB,CACbG,EAAAT,UAAAO,IAAA,CAAqB,IAAAL,YAAAgC,OAArB,CACA,KAAA+K,wBAAAtM,YAAA,CAAyCF,CAAzC,CACA,KAAAV,SAAAY,YAAA,CAA0B,IAAAsM,wBAA1B,CAXqE,CAazE,IAAAE,mBAAA,CAA0B,IAAA/B,UAAAd,KAAA,CAAoB,IAApB,CAC1B,KAAA8C,kBAAA,CAAyB,IAAA7B,SAAAjB,KAAA,CAAmB,IAAnB,CACzB,KAAA+C,iBAAA,CAAwB,IAAA5B,QAAAnB,KAAA,CAAkB,IAAlB,CACxB,KAAA+D,sBAAA,CAA6B,IAAAzC,WAAAtB,KAAA,CAAqB,IAArB,CAC7B,KAAA6B,cAAAvL,iBAAA,CAAoC,QAApC;AAA8C,IAAAuM,mBAA9C,CACA,KAAAhB,cAAAvL,iBAAA,CAAoC,OAApC,CAA6C,IAAAwM,kBAA7C,CACA,KAAAjB,cAAAvL,iBAAA,CAAoC,MAApC,CAA4C,IAAAyM,iBAA5C,CACA,KAAAtN,SAAAa,iBAAA,CAA+B,SAA/B,CAA0C,IAAAyN,sBAA1C,CACA,KAAA/C,eAAA,EACA,KAAAvL,SAAAC,UAAAO,IAAA,CAA4B,aAA5B,CAxBe,CADyB,CA8BhD8B,EAAAY,SAAA,CAA0B,CACtBqE,YAAaiG,CADS,CAEtBvG,cAAe,oBAFO,CAGtBrC,SAAU,oBAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BA,KAAIqI,EAAeA,QAAqB,CAAC5L,CAAD,CAAU,CAC9C,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAH8C,CAKlDlF,OAAA,aAAA,CAAyBiK,CAOzBA,EAAAhI,UAAAkD,UAAA,CAAmC,CAE/B+E,4BAA6B,EAFE;AAI/BC,6BAA8B,EAJC,CAO/BC,cAAe,GAPgB,CAenCH,EAAAhI,UAAAoI,UAAA,CAAmC,CAC/BC,MAAO,EADwB,CAE/BC,OAAQ,EAFuB,CAG/BC,MAAO,EAHwB,CAI/BC,SAAU,EAJqB,CAK/BC,WAAY,EALmB,CAenCT,EAAAhI,UAAApG,YAAA,CAAqC,CACjC8O,UAAW,qBADsB,CAEjCC,QAAS,mBAFwB,CAGjCC,KAAM,gBAH2B,CAIjCC,sBAAuB,iCAJU,CAKjC1F,cAAe,sBALkB,CAMjCqB,qBAAsB,qCANW,CAOjC5I,OAAQ,YAPyB,CASjCiJ,YAAa,aAToB,CAUjCiE,WAAY,YAVqB,CAWjCC,aAAc,cAXmB,CAajCC,YAAa,uBAboB;AAejCC,aAAc,wBAfmB,CAgBjCC,SAAU,oBAhBuB,CAiBjCC,UAAW,qBAjBsB,CAkBjCC,UAAW,qBAlBsB,CAuBrCpB,EAAAhI,UAAAiD,KAAA,CAA8BoG,QAAS,EAAG,CACtC,GAAI,IAAA5P,SAAJ,CAAmB,CAEf,IAAI6P,EAAYvP,QAAAC,cAAA,CAAuB,KAAvB,CAChBsP,EAAA5P,UAAAO,IAAA,CAAwB,IAAAL,YAAA8O,UAAxB,CACA,KAAAjP,SAAA8P,cAAAC,aAAA,CAAyCF,CAAzC,CAAoD,IAAA7P,SAApD,CACA,KAAAA,SAAA8P,cAAAE,YAAA,CAAwC,IAAAhQ,SAAxC,CACA6P,EAAAjP,YAAA,CAAsB,IAAAZ,SAAtB,CACA,KAAAiQ,WAAA,CAAkBJ,CAElB,KAAIK,EAAU5P,QAAAC,cAAA,CAAuB,KAAvB,CACd2P,EAAAjQ,UAAAO,IAAA,CAAsB,IAAAL,YAAA+O,QAAtB,CACA,KAAAiB,SAAA;AAAgBD,CAChBL,EAAAE,aAAA,CAAuBG,CAAvB,CAAgC,IAAAlQ,SAAhC,CAIA,IAFIoQ,CAEJ,CAFc,IAAApQ,SAAAe,aAAA,CAA2B,KAA3B,CAEd,EAFmD,IAAAf,SAAAe,aAAA,CAA2B,cAA3B,CAEnD,CAEI,GADAsP,CACA,CADQ/P,QAAAgQ,eAAA,CAAwBF,CAAxB,CACR,CACI,IAAAG,YAEA,CAFmBF,CAEnB,CADAA,CAAAxP,iBAAA,CAAuB,OAAvB,CAAgC,IAAA2P,gBAAAjG,KAAA,CAA0B,IAA1B,CAAhC,CACA,CAAA8F,CAAAxP,iBAAA,CAAuB,SAAvB,CAAkC,IAAA4P,wBAAAlG,KAAA,CAAkC,IAAlC,CAAlC,CAGJmG,EAAAA,CAAQ,IAAA1Q,SAAA8E,iBAAA,CAA+B,GAA/B,CAAqC,IAAA3E,YAAAgP,KAArC,CACZ,KAAAwB,kBAAA,CAAyB,IAAAC,yBAAArG,KAAA,CAAmC,IAAnC,CACzB,KAAAsG,gBAAA,CAAuB,IAAAC,iBAAAvG,KAAA,CAA2B,IAA3B,CACvB,KAAK,IAAI9G,EAAI,CAAb,CAAgBA,CAAhB,CAAoBiN,CAAA/M,OAApB,CAAkCF,CAAA,EAAlC,CAEIiN,CAAA,CAAMjN,CAAN,CAAA5C,iBAAA,CAA0B,OAA1B;AAAmC,IAAAgQ,gBAAnC,CAIA,CAFAH,CAAA,CAAMjN,CAAN,CAAAsN,SAEA,CAFoB,IAEpB,CAAAL,CAAA,CAAMjN,CAAN,CAAA5C,iBAAA,CAA0B,SAA1B,CAAqC,IAAA8P,kBAArC,CAGJ,IAAI,IAAA3Q,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAuJ,cAAjC,CAAJ,CAEI,IADA,IAAA1J,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA4K,qBAA5B,CACK,CAAAtH,CAAA,CAAI,CAAT,CAAYA,CAAZ,CAAgBiN,CAAA/M,OAAhB,CAA8BF,CAAA,EAA9B,CAAmC,CAC/B,IAAI+D,EAAOkJ,CAAA,CAAMjN,CAAN,CAAX,CACIpD,EAAkBC,QAAAC,cAAA,CAAuB,MAAvB,CACtBF,EAAAJ,UAAAO,IAAA,CAA8B,IAAAL,YAAAiP,sBAA9B,CACA,KAAI1O,EAASJ,QAAAC,cAAA,CAAuB,MAAvB,CACbG,EAAAT,UAAAO,IAAA,CAAqB,IAAAL,YAAAgC,OAArB,CACA9B,EAAAO,YAAA,CAA4BF,CAA5B,CACA8G,EAAA5G,YAAA,CAAiBP,CAAjB,CACAmH,EAAAvH,UAAAO,IAAA,CAAmB,IAAAL,YAAAuJ,cAAnB,CAR+B,CAYnC,IAAA1J,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAoP,YAAjC,CAAJ;AACI,IAAAY,SAAAlQ,UAAAO,IAAA,CAA4B,IAAAL,YAAAoP,YAA5B,CAEA,KAAAvP,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAqP,aAAjC,CAAJ,EACI,IAAAW,SAAAlQ,UAAAO,IAAA,CAA4B,IAAAL,YAAAqP,aAA5B,CAEA,KAAAxP,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAsP,SAAjC,CAAJ,EACI,IAAAU,SAAAlQ,UAAAO,IAAA,CAA4B,IAAAL,YAAAsP,SAA5B,CAEA,KAAAzP,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAuP,UAAjC,CAAJ,EACI,IAAAS,SAAAlQ,UAAAO,IAAA,CAA4B,IAAAL,YAAAuP,UAA5B,CAEA,KAAA1P,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAwP,UAAjC,CAAJ,EACI,IAAAQ,SAAAlQ,UAAAO,IAAA,CAA4B,IAAAL,YAAAwP,UAA5B,CAEJE;CAAA5P,UAAAO,IAAA,CAAwB,IAAAL,YAAAiL,YAAxB,CAjEe,CADmB,CA4E1CmD,EAAAhI,UAAAiK,gBAAA,CAAyCQ,QAAS,CAACC,CAAD,CAAM,CACpD,GAAI,IAAAjR,SAAJ,EAAqB,IAAAuQ,YAArB,CAAuC,CACnC,IAAIW,EAAO,IAAAX,YAAAY,sBAAA,EAAX,CACIC,EAAU,IAAAb,YAAAT,cAAAqB,sBAAA,EACV,KAAAnR,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAwP,UAAjC,CAAJ,GACW,IAAA3P,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAqP,aAAjC,CAAJ,EAEH,IAAAS,WAAAoB,MAAAC,MACA,CAD8BF,CAAAE,MAC9B,CAD8CJ,CAAAI,MAC9C,CAD2D,IAC3D,CAAA,IAAArB,WAAAoB,MAAAE,IAAA,CAA4B,IAAAhB,YAAAiB,UAA5B,CAAyD,IAAAjB,YAAAkB,aAAzD,CAAyF,IAHtF,EAII,IAAAzR,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAsP,SAAjC,CAAJ;CAEH,IAAAQ,WAAAoB,MAAAK,KACA,CAD6B,IAAAnB,YAAAoB,WAC7B,CAD2D,IAC3D,CAAA,IAAA1B,WAAAoB,MAAAO,OAAA,CAA+BR,CAAAQ,OAA/B,CAAgDV,CAAAK,IAAhD,CAA2D,IAHxD,EAII,IAAAvR,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAuP,UAAjC,CAAJ,EAEH,IAAAO,WAAAoB,MAAAC,MACA,CAD8BF,CAAAE,MAC9B,CAD8CJ,CAAAI,MAC9C,CAD2D,IAC3D,CAAA,IAAArB,WAAAoB,MAAAO,OAAA,CAA+BR,CAAAQ,OAA/B,CAAgDV,CAAAK,IAAhD,CAA2D,IAHxD,GAMH,IAAAtB,WAAAoB,MAAAK,KACA,CAD6B,IAAAnB,YAAAoB,WAC7B,CAD2D,IAC3D,CAAA,IAAA1B,WAAAoB,MAAAE,IAAA,CAA4B,IAAAhB,YAAAiB,UAA5B,CAAyD,IAAAjB,YAAAkB,aAAzD,CAAyF,IAPtF,CATP,CAHmC,CAsBvC,IAAAI,OAAA,CAAYZ,CAAZ,CAvBoD,CA+BxD1C,EAAAhI,UAAAkK,wBAAA,CAAiDqB,QAAS,CAACb,CAAD,CAAM,CAC5D,GAAI,IAAAjR,SAAJ;AAAqB,IAAAiQ,WAArB,EAAwC,IAAAM,YAAxC,CAA0D,CACtD,IAAIG,EAAQ,IAAA1Q,SAAA8E,iBAAA,CAA+B,GAA/B,CAAqC,IAAA3E,YAAAgP,KAArC,CAA6D,kBAA7D,CACRuB,EAAJ,EAA4B,CAA5B,CAAaA,CAAA/M,OAAb,EAAiC,IAAAsM,WAAAhQ,UAAAC,SAAA,CAAmC,IAAAC,YAAAkP,WAAnC,CAAjC,GACQ4B,CAAAc,QAAJ,GAAoB,IAAApD,UAAAI,SAApB,EACIkC,CAAAhQ,eAAA,EACA,CAAAyP,CAAA,CAAMA,CAAA/M,OAAN,CAAqB,CAArB,CAAAqO,MAAA,EAFJ,EAGWf,CAAAc,QAHX,GAG2B,IAAApD,UAAAK,WAH3B,GAIIiC,CAAAhQ,eAAA,EACA,CAAAyP,CAAA,CAAM,CAAN,CAAAsB,MAAA,EALJ,CADJ,CAFsD,CADE,CAoBhEzD,EAAAhI,UAAAqK,yBAAA,CAAkDqB,QAAS,CAAChB,CAAD,CAAM,CAC7D,GAAI,IAAAjR,SAAJ,EAAqB,IAAAiQ,WAArB,CAAsC,CAClC,IAAIS,EAAQ,IAAA1Q,SAAA8E,iBAAA,CAA+B,GAA/B,CAAqC,IAAA3E,YAAAgP,KAArC;AAA6D,kBAA7D,CACZ,IAAIuB,CAAJ,EAA4B,CAA5B,CAAaA,CAAA/M,OAAb,EAAiC,IAAAsM,WAAAhQ,UAAAC,SAAA,CAAmC,IAAAC,YAAAkP,WAAnC,CAAjC,CAAkG,CAC9F,IAAI6C,EAAe7L,KAAAE,UAAAC,MAAAC,KAAA,CAA2BiK,CAA3B,CAAAzM,QAAA,CAA0CgN,CAAAkB,OAA1C,CACflB,EAAAc,QAAJ,GAAoB,IAAApD,UAAAI,SAApB,EACIkC,CAAAhQ,eAAA,EACA,CAAmB,CAAnB,CAAIiR,CAAJ,CACIxB,CAAA,CAAMwB,CAAN,CAAqB,CAArB,CAAAF,MAAA,EADJ,CAGItB,CAAA,CAAMA,CAAA/M,OAAN,CAAqB,CAArB,CAAAqO,MAAA,EALR,EAOWf,CAAAc,QAAJ,GAAoB,IAAApD,UAAAK,WAApB,EACHiC,CAAAhQ,eAAA,EACA,CAAIyP,CAAA/M,OAAJ,CAAmBuO,CAAnB,CAAkC,CAAlC,CACIxB,CAAA,CAAMwB,CAAN,CAAqB,CAArB,CAAAF,MAAA,EADJ,CAGItB,CAAA,CAAM,CAAN,CAAAsB,MAAA,EALD,EAOIf,CAAAc,QAAJ,GAAoB,IAAApD,UAAAG,MAApB,EAA4CmC,CAAAc,QAA5C,GAA4D,IAAApD,UAAAC,MAA5D,EACHqC,CAAAhQ,eAAA,EAOA,CALIH,CAKJ,CALQ,IAAIsR,UAAJ,CAAe,WAAf,CAKR,CAJAnB,CAAAkB,OAAA/M,cAAA,CAAyBtE,CAAzB,CAIA,CAHAA,CAGA,CAHI,IAAIsR,UAAJ,CAAe,SAAf,CAGJ;AAFAnB,CAAAkB,OAAA/M,cAAA,CAAyBtE,CAAzB,CAEA,CAAAmQ,CAAAkB,OAAAE,MAAA,EARG,EASIpB,CAAAc,QATJ,GASoB,IAAApD,UAAAE,OATpB,GAUHoC,CAAAhQ,eAAA,EACA,CAAA,IAAAqR,KAAA,EAXG,CAhBuF,CAFhE,CADuB,CAyCjE/D,EAAAhI,UAAAuK,iBAAA,CAA0CyB,QAAS,CAACtB,CAAD,CAAM,CACjDA,CAAAkB,OAAAK,aAAA,CAAwB,UAAxB,CAAJ,CACIvB,CAAAwB,gBAAA,EADJ,EAII,IAAAC,SACA,CADgB,CAAA,CAChB,CAAApO,MAAA+E,WAAA,CAAkB,QAAS,CAAC4H,CAAD,CAAM,CAC7B,IAAAqB,KAAA,EACA,KAAAI,SAAA,CAAgB,CAAA,CAFa,CAAfnI,KAAA,CAGX,IAHW,CAAlB,CAGc,IAAAd,UAAAiF,cAHd,CALJ,CADqD,CAqBzDH,EAAAhI,UAAAoM,WAAA,CAAoCC,QAAS,CAACC,CAAD,CAASC,CAAT,CAAgB,CACrD,IAAA9S,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAwP,UAAjC,CAAJ,CAEI,IAAA3P,SAAAqR,MAAA0B,KAFJ,CAE+B,EAF/B,CAGW,IAAA/S,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAqP,aAAjC,CAAJ;AAEH,IAAAxP,SAAAqR,MAAA0B,KAFG,CAEwB,SAFxB,CAEoCD,CAFpC,CAEoD,OAFpD,CAE2DA,CAF3D,CAEmE,KAFnE,CAGI,IAAA9S,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAsP,SAAjC,CAAJ,CAEH,IAAAzP,SAAAqR,MAAA0B,KAFG,CAEwB,OAFxB,CAEkCF,CAFlC,CAE2C,OAF3C,CAEqDA,CAFrD,CAE8D,OAF9D,CAGI,IAAA7S,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAuP,UAAjC,CAAJ,CAEH,IAAA1P,SAAAqR,MAAA0B,KAFG,CAEwB,OAFxB,CAEkCF,CAFlC,CAE2C,KAF3C,CAEmDC,CAFnD,CAE2D,KAF3D,CAEmED,CAFnE,CAE4E,KAF5E,CAEoFC,CAFpF,CAE4F,KAF5F,CAKH,IAAA9S,SAAAqR,MAAA0B,KALG,CAKwB,EAf0B,CAwB7DxE,EAAAhI,UAAAyM,4BAAA,CAAqDC,QAAS,CAAChC,CAAD,CAAM,CAChEA,CAAAkB,OAAAlS,UAAA2L,OAAA,CAA4B2C,CAAAhI,UAAApG,YAAAmP,aAA5B,CADgE,CAQpEf,EAAAhI,UAAA2M,yBAAA,CAAkDC,QAAS,EAAG,CAC1D,IAAAnT,SAAAa,iBAAA,CAA+B,eAA/B;AAAgD,IAAAmS,4BAAhD,CACA,KAAAhT,SAAAa,iBAAA,CAA+B,qBAA/B,CAAsD,IAAAmS,4BAAtD,CAF0D,CAS9DzE,EAAAhI,UAAAlE,KAAA,CAA8B+Q,QAAS,CAACnC,CAAD,CAAM,CACzC,GAAI,IAAAjR,SAAJ,EAAqB,IAAAiQ,WAArB,EAAwC,IAAAE,SAAxC,CAAuD,CAEnD,IAAI0C,EAAS,IAAA7S,SAAAmR,sBAAA,EAAA0B,OAAb,CACIC,EAAQ,IAAA9S,SAAAmR,sBAAA,EAAA2B,MAEZ,KAAA7C,WAAAoB,MAAAyB,MAAA,CAA8BA,CAA9B,CAAsC,IACtC,KAAA7C,WAAAoB,MAAAwB,OAAA,CAA+BA,CAA/B,CAAwC,IACxC,KAAA1C,SAAAkB,MAAAyB,MAAA,CAA4BA,CAA5B,CAAoC,IACpC,KAAA3C,SAAAkB,MAAAwB,OAAA,CAA6BA,CAA7B,CAAsC,IAKtC,KAJA,IAAIQ,EAAqB,IAAA5J,UAAA+E,4BAArB6E,CAAkE,IAAA5J,UAAAgF,6BAAtE;AAGIiC,EAAQ,IAAA1Q,SAAA8E,iBAAA,CAA+B,GAA/B,CAAqC,IAAA3E,YAAAgP,KAArC,CAHZ,CAIS1L,EAAI,CAAb,CAAgBA,CAAhB,CAAoBiN,CAAA/M,OAApB,CAAkCF,CAAA,EAAlC,CAAuC,CACnC,IAAI6P,EAAY,IAAhB,CAEIA,EADA,IAAAtT,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAsP,SAAjC,CAAJ,EAAmE,IAAAzP,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAuP,UAAjC,CAAnE,EACiBmD,CADjB,CAC0BnC,CAAA,CAAMjN,CAAN,CAAA+N,UAD1B,CAC+Cd,CAAA,CAAMjN,CAAN,CAAAgO,aAD/C,EACwEoB,CADxE,CACiFQ,CADjF,CACsG,GADtG,CAGgB3C,CAAA,CAAMjN,CAAN,CAAA+N,UAHhB,CAGqCqB,CAHrC,CAG8CQ,CAH9C,CAGmE,GAEnE3C,EAAA,CAAMjN,CAAN,CAAA4N,MAAAkC,gBAAA,CAAiCD,CAPE,CAUvC,IAAAX,WAAA,CAAgBE,CAAhB,CAAwBC,CAAxB,CAGAxO,OAAAoE,sBAAA,CAA6B,QAAS,EAAG,CACrC,IAAA1I,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAmP,aAA5B,CACA,KAAAtP,SAAAqR,MAAA0B,KAAA,CAA2B,SAA3B,CAAuCD,CAAvC,CAA+C,KAA/C,CAAuDD,CAAvD,CAAgE,OAChE,KAAA5C,WAAAhQ,UAAAO,IAAA,CAA8B,IAAAL,YAAAkP,WAA9B,CAHqC,CAAZ9E,KAAA,CAItB,IAJsB,CAA7B,CAMA;IAAA2I,yBAAA,EAEA,KAAIjQ,EAAW,QAAS,CAACnC,CAAD,CAAI,CAOpBA,CAAJ,GAAUmQ,CAAV,EAAkB,IAAAyB,SAAlB,EAAmC5R,CAAAqR,OAAAqB,WAAnC,GAA2D,IAAAxT,SAA3D,GACIM,QAAAmT,oBAAA,CAA6B,OAA7B,CAAsCxQ,CAAtC,CACA,CAAA,IAAAqP,KAAA,EAFJ,CAPwB,CAAb/H,KAAA,CAWR,IAXQ,CAYfjK,SAAAO,iBAAA,CAA0B,OAA1B,CAAmCoC,CAAnC,CA9CmD,CADd,CAkD7CsL,EAAAhI,UAAA,KAAA,CAAiCgI,CAAAhI,UAAAlE,KAMjCkM,EAAAhI,UAAA+L,KAAA,CAA8BoB,QAAS,EAAG,CACtC,GAAI,IAAA1T,SAAJ,EAAqB,IAAAiQ,WAArB,EAAwC,IAAAE,SAAxC,CAAuD,CAGnD,IAFA,IAAIO,EAAQ,IAAA1Q,SAAA8E,iBAAA,CAA+B,GAA/B,CAAqC,IAAA3E,YAAAgP,KAArC,CAAZ,CAES1L,EAAI,CAAb,CAAgBA,CAAhB,CAAoBiN,CAAA/M,OAApB,CAAkCF,CAAA,EAAlC,CACIiN,CAAA,CAAMjN,CAAN,CAAA4N,MAAAsC,eAAA,CAA8B,kBAA9B,CAGAzC,EAAAA,CAAO,IAAAlR,SAAAmR,sBAAA,EACP0B,EAAAA;AAAS3B,CAAA2B,OACTC,EAAAA,CAAQ5B,CAAA4B,MAGZ,KAAA9S,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAmP,aAA5B,CACA,KAAAqD,WAAA,CAAgBE,CAAhB,CAAwBC,CAAxB,CACA,KAAA7C,WAAAhQ,UAAA2L,OAAA,CAAiC,IAAAzL,YAAAkP,WAAjC,CAEA,KAAA6D,yBAAA,EAhBmD,CADjB,CAoB1C3E,EAAAhI,UAAA,KAAA,CAAiCgI,CAAAhI,UAAA+L,KAMjC/D,EAAAhI,UAAAsL,OAAA,CAAgC+B,QAAS,CAAC3C,CAAD,CAAM,CACvC,IAAAhB,WAAAhQ,UAAAC,SAAA,CAAmC,IAAAC,YAAAkP,WAAnC,CAAJ,CACI,IAAAiD,KAAA,EADJ,CAGI,IAAAjQ,KAAA,CAAU4O,CAAV,CAJuC,CAO/C1C,EAAAhI,UAAA,OAAA,CAAmCgI,CAAAhI,UAAAsL,OAGnCvP,EAAAY,SAAA,CAA0B,CACtBqE,YAAagH,CADS,CAEtBtH,cAAe,cAFO,CAGtBrC,SAAU,aAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BI2N,EAAAA,CAAmBA,QAAyB,CAAClR,CAAD,CAAU,CACtD,IAAA3C,SAAA;AAAgB2C,CAEhB,KAAA6G,KAAA,EAHsD,CAK1DlF,OAAA,iBAAA,CAA6BuP,CAO7BA,EAAAtN,UAAAkD,UAAA,CAAuC,EASvCoK,EAAAtN,UAAApG,YAAA,CAAyC,CAAE2T,oBAAqB,6BAAvB,CAOzCD,EAAAtN,UAAAwN,YAAA,CAAyCC,QAAS,CAACC,CAAD,CAAI,CAC9C,IAAAjU,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA2T,oBAAjC,CAAJ,GAGA,IAAAI,aAAA7C,MAAAyB,MAHA,CAGgCmB,CAHhC,CAGoC,GAHpC,CADkD,CAMtDJ,EAAAtN,UAAA,YAAA,CAA4CsN,CAAAtN,UAAAwN,YAO5CF,EAAAtN,UAAA4N,UAAA,CAAuCC,QAAS,CAACH,CAAD,CAAI,CAChD,IAAAI,WAAAhD,MAAAyB,MAAA,CAA8BmB,CAA9B,CAAkC,GAClC,KAAAK,QAAAjD,MAAAyB,MAAA,CAA2B,GAA3B,CAAiCmB,CAAjC,CAAqC,GAFW,CAIpDJ,EAAAtN,UAAA,UAAA,CAA0CsN,CAAAtN,UAAA4N,UAI1CN,EAAAtN,UAAAiD,KAAA;AAAkC+K,QAAS,EAAG,CAC1C,GAAI,IAAAvU,SAAJ,CAAmB,CACf,IAAIwU,EAAKlU,QAAAC,cAAA,CAAuB,KAAvB,CACTiU,EAAA5Q,UAAA,CAAe,sBACf,KAAA5D,SAAAY,YAAA,CAA0B4T,CAA1B,CACA,KAAAN,aAAA,CAAoBM,CACpBA,EAAA,CAAKlU,QAAAC,cAAA,CAAuB,KAAvB,CACLiU,EAAA5Q,UAAA,CAAe,oBACf,KAAA5D,SAAAY,YAAA,CAA0B4T,CAA1B,CACA,KAAAH,WAAA,CAAkBG,CAClBA,EAAA,CAAKlU,QAAAC,cAAA,CAAuB,KAAvB,CACLiU,EAAA5Q,UAAA,CAAe,iBACf,KAAA5D,SAAAY,YAAA,CAA0B4T,CAA1B,CACA,KAAAF,QAAA,CAAeE,CACf,KAAAN,aAAA7C,MAAAyB,MAAA,CAAgC,IAChC,KAAAuB,WAAAhD,MAAAyB,MAAA,CAA8B,MAC9B,KAAAwB,QAAAjD,MAAAyB,MAAA,CAA2B,IAC3B,KAAA9S,SAAAC,UAAAO,IAAA,CAA4B,aAA5B,CAhBe,CADuB,CAsB9C8B;CAAAY,SAAA,CAA0B,CACtBqE,YAAasM,CADS,CAEtB5M,cAAe,kBAFO,CAGtBrC,SAAU,iBAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BIuO,EAAAA,CAAgBA,QAAsB,CAAC9R,CAAD,CAAU,CAChD,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAHgD,CAKpDlF,OAAA,cAAA,CAA0BmQ,CAO1BA,EAAAlO,UAAAkD,UAAA,CAAoC,CAAEiB,aAAc,IAAhB,CASpC+J,EAAAlO,UAAApG,YAAA,CAAsC,CAClC8K,WAAY,YADsB,CAElCC,YAAa,aAFqB,CAGlCC,WAAY,YAHsB,CAIlCC,YAAa,aAJqB,CAKlCsJ,SAAU,cALwB,CAMlCC,UAAW,mBANuB,CAOlCC,mBAAoB,yBAPc,CAQlCC,mBAAoB,yBARc,CASlCnL,cAAe,sBATmB;AAUlCqB,qBAAsB,qCAVY,CAWlC7I,iBAAkB,6BAXgB,CAYlC8I,cAAe,oBAZmB,CAalC7I,OAAQ,YAb0B,CAqBtCsS,EAAAlO,UAAA8E,UAAA,CAAoCyJ,QAAS,CAACjL,CAAD,CAAQ,CAG7CkL,CAAAA,CAASzU,QAAA0U,uBAAA,CAAgC,IAAA7U,YAAAuU,SAAhC,CACb,KAAK,IAAIjR,EAAI,CAAb,CAAgBA,CAAhB,CAAoBsR,CAAApR,OAApB,CAAmCF,CAAA,EAAnC,CACiBsR,CAAA,CAAOtR,CAAP,CAAApC,cAAA4T,CAAwB,GAAxBA,CAA8B,IAAA9U,YAAAwU,UAA9BM,CAETlU,aAAA,CAAoB,MAApB,CAAJ,GAAoC,IAAAmU,YAAAnU,aAAA,CAA8B,MAA9B,CAApC,EAC8C,WAD9C,GACQ,MAAOgU,EAAA,CAAOtR,CAAP,CAAA,cADf,EAEQsR,CAAA,CAAOtR,CAAP,CAAA,cAAA8H,eAAA,EATqC,CAoBrDkJ,EAAAlO,UAAAiF,SAAA,CAAmC2J,QAAS,CAACtL,CAAD,CAAQ,CAChD,IAAA7J,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA8K,WAA5B,CADgD,CASpDwJ;CAAAlO,UAAAmF,QAAA,CAAkC0J,QAAS,CAACvL,CAAD,CAAQ,CAC/C,IAAA7J,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA8K,WAA/B,CAD+C,CASnDwJ,EAAAlO,UAAA8O,WAAA,CAAqCC,QAAS,CAACzL,CAAD,CAAQ,CAClD,IAAAkC,MAAA,EADkD,CAQtD0I,EAAAlO,UAAAgF,eAAA,CAAyCgK,QAAS,EAAG,CACjD,IAAAtJ,cAAA,EACA,KAAAC,iBAAA,EAFiD,CASrDuI,EAAAlO,UAAAwF,MAAA,CAAgCyJ,QAAS,EAAG,CAGxClR,MAAA+E,WAAA,CAAkB,QAAS,EAAG,CAC1B,IAAA6L,YAAApL,KAAA,EAD0B,CAAZS,KAAA,CAEX,IAFW,CAAlB,CAEc,IAAAd,UAAAiB,aAFd,CAHwC,CAa5C+J,EAAAlO,UAAA0F,cAAA,CAAwCwJ,QAAS,EAAG,CAC5C,IAAAP,YAAAjL,SAAJ,CACI,IAAAjK,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA+K,YAA5B,CADJ,CAGI,IAAAlL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA+K,YAA/B,CAJ4C,CAOpDuJ;CAAAlO,UAAA,cAAA,CAA2CkO,CAAAlO,UAAA0F,cAM3CwI,EAAAlO,UAAA2F,iBAAA,CAA2CwJ,QAAS,EAAG,CAC/C,IAAAR,YAAA5I,QAAJ,CACI,IAAAtM,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAgL,WAA5B,CADJ,CAGI,IAAAnL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAAgL,WAA/B,CAJ+C,CAOvDsJ,EAAAlO,UAAA,iBAAA,CAA8CkO,CAAAlO,UAAA2F,iBAM9CuI,EAAAlO,UAAAwD,QAAA,CAAkC4L,QAAS,EAAG,CAC1C,IAAAT,YAAAjL,SAAA,CAA4B,CAAA,CAC5B,KAAAsB,eAAA,EAF0C,CAI9CkJ,EAAAlO,UAAA,QAAA,CAAqCkO,CAAAlO,UAAAwD,QAMrC0K,EAAAlO,UAAA2D,OAAA,CAAiC0L,QAAS,EAAG,CACzC,IAAAV,YAAAjL,SAAA,CAA4B,CAAA,CAC5B,KAAAsB,eAAA,EAFyC,CAI7CkJ,EAAAlO,UAAA,OAAA;AAAoCkO,CAAAlO,UAAA2D,OAMpCuK,EAAAlO,UAAAmG,MAAA,CAAgCmJ,QAAS,EAAG,CACxC,IAAAX,YAAA5I,QAAA,CAA2B,CAAA,CAC3B,KAAAjB,UAAA,CAAe,IAAf,CAFwC,CAI5CoJ,EAAAlO,UAAA,MAAA,CAAmCkO,CAAAlO,UAAAmG,MAMnC+H,EAAAlO,UAAAqG,QAAA,CAAkCkJ,QAAS,EAAG,CAC1C,IAAAZ,YAAA5I,QAAA,CAA2B,CAAA,CAC3B,KAAAjB,UAAA,CAAe,IAAf,CAF0C,CAI9CoJ,EAAAlO,UAAA,QAAA,CAAqCkO,CAAAlO,UAAAqG,QAIrC6H,EAAAlO,UAAAiD,KAAA,CAA+BuM,QAAS,EAAG,CACvC,GAAI,IAAA/V,SAAJ,CAAmB,CACf,IAAAkV,YAAA,CAAmB,IAAAlV,SAAAqB,cAAA,CAA4B,GAA5B,CAAkC,IAAAlB,YAAAwU,UAAlC,CACnB,KAAAqB,oBAAA,CAA2B,IAAA3K,UAAAd,KAAA,CAAoB,IAApB,CAC3B,KAAA0L,mBAAA,CAA0B,IAAA5K,UAAAd,KAAA,CAAoB,IAApB,CAC1B,KAAA2L,kBAAA;AAAyB,IAAAxK,QAAAnB,KAAA,CAAkB,IAAlB,CACzB,KAAA4L,qBAAA,CAA4B,IAAAd,WAAA9K,KAAA,CAAqB,IAArB,CAC5B,KAAI6L,EAAc9V,QAAAC,cAAA,CAAuB,MAAvB,CAClB6V,EAAAnW,UAAAO,IAAA,CAA0B,IAAAL,YAAAyU,mBAA1B,CACA,KAAIyB,EAAc/V,QAAAC,cAAA,CAAuB,MAAvB,CAClB8V,EAAApW,UAAAO,IAAA,CAA0B,IAAAL,YAAA0U,mBAA1B,CACA,KAAA7U,SAAAY,YAAA,CAA0BwV,CAA1B,CACA,KAAApW,SAAAY,YAAA,CAA0ByV,CAA1B,CAEI,KAAArW,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAuJ,cAAjC,CAAJ,GACI,IAAA1J,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA4K,qBAA5B,CASA,CARA1K,CAQA,CARkBC,QAAAC,cAAA,CAAuB,MAAvB,CAQlB,CAPAF,CAAAJ,UAAAO,IAAA,CAA8B,IAAAL,YAAA+B,iBAA9B,CAOA;AANA7B,CAAAJ,UAAAO,IAAA,CAA8B,IAAAL,YAAAuJ,cAA9B,CAMA,CALArJ,CAAAJ,UAAAO,IAAA,CAA8B,IAAAL,YAAA6K,cAA9B,CAKA,CAJA3K,CAAAQ,iBAAA,CAAiC,SAAjC,CAA4C,IAAAsV,qBAA5C,CAIA,CAHIzV,CAGJ,CAHaJ,QAAAC,cAAA,CAAuB,MAAvB,CAGb,CAFAG,CAAAT,UAAAO,IAAA,CAAqB,IAAAL,YAAAgC,OAArB,CAEA,CADA9B,CAAAO,YAAA,CAA4BF,CAA5B,CACA,CAAA,IAAAV,SAAAY,YAAA,CAA0BP,CAA1B,CAVJ,CAYA,KAAA6U,YAAArU,iBAAA,CAAkC,QAAlC,CAA4C,IAAAmV,oBAA5C,CACA,KAAAd,YAAArU,iBAAA,CAAkC,OAAlC,CAA2C,IAAAoV,mBAA3C,CACA,KAAAf,YAAArU,iBAAA,CAAkC,MAAlC,CAA0C,IAAAqV,kBAA1C,CACA,KAAAlW,SAAAa,iBAAA,CAA+B,SAA/B;AAA0C,IAAAsV,qBAA1C,CACA,KAAA5K,eAAA,EACA,KAAAvL,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAiL,YAA5B,CA9Be,CADoB,CAoC3C9I,EAAAY,SAAA,CAA0B,CACtBqE,YAAakN,CADS,CAEtBxN,cAAe,eAFO,CAGtBrC,SAAU,cAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BIoQ,EAAAA,CAAiBA,QAAuB,CAAC3T,CAAD,CAAU,CAClD,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA4T,MAAA,CAAajS,MAAAwE,UAAA0N,iBAEb,KAAAhN,KAAA,EALkD,CAOtDlF,OAAA,eAAA,CAA2BgS,CAO3BA,EAAA/P,UAAAkD,UAAA,CAAqC,EASrC6M,EAAA/P,UAAApG,YAAA,CAAuC,CACnCsW,aAAc,0BADqB,CAEnCC,iBAAkB,uBAFiB,CAGnCC,gBAAiB,6BAHkB,CAInCC,iBAAkB,8BAJiB;AAKnCC,iBAAkB,8BALiB,CAMnCC,gBAAiB,iBANkB,CAOnC1L,YAAa,aAPsB,CAevCkL,EAAA/P,UAAAwQ,SAAA,CAAoCC,QAAS,CAACnN,CAAD,CAAQ,CACjD,IAAAoN,mBAAA,EADiD,CASrDX,EAAA/P,UAAA8E,UAAA,CAAqC6L,QAAS,CAACrN,CAAD,CAAQ,CAClD,IAAAoN,mBAAA,EADkD,CAStDX,EAAA/P,UAAAsF,WAAA,CAAsCsL,QAAS,CAACtN,CAAD,CAAQ,CACnDA,CAAAsI,OAAArI,KAAA,EADmD,CAavDwM,EAAA/P,UAAA6Q,sBAAA,CAAiDC,QAAS,CAACxN,CAAD,CAAQ,CAG1DA,CAAAsI,OAAJ,GAAqB,IAAAnS,SAAA8P,cAArB,GAKAjG,CAAA5I,eAAA,EAOA,CANIqW,CAMJ,CANe,IAAIlF,UAAJ,CAAe,WAAf,CAA4B,CACvCD,OAAQtI,CAAAsI,OAD+B,CAEvCoF,QAAS1N,CAAA0N,QAF8B,CAGvCC,QAAS3N,CAAA2N,QAH8B,CAIvCC,QAAS,IAAAzX,SAAAmR,sBAAA,EAAAuG,EAJ8B,CAA5B,CAMf;AAAA,IAAA1X,SAAAoF,cAAA,CAA4BkS,CAA5B,CAZA,CAH8D,CAsBlEhB,EAAA/P,UAAA0Q,mBAAA,CAA8CU,QAAS,EAAG,CAEtD,IAAIC,GAAY,IAAA5X,SAAA6X,MAAZD,CAAkC,IAAA5X,SAAA8X,IAAlCF,GAAwD,IAAA5X,SAAAoJ,IAAxDwO,CAA4E,IAAA5X,SAAA8X,IAA5EF,CACa,EAAjB,GAAIA,CAAJ,CACI,IAAA5X,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA2W,gBAA5B,CADJ,CAGI,IAAA9W,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA2W,gBAA/B,CAEC,KAAAP,MAAL,GACI,IAAAwB,iBAAA1G,MAAA2G,KAGA,CAHmCJ,CAGnC,CAFA,IAAAG,iBAAA1G,MAAA4G,WAEA,CAFyCL,CAEzC,CADA,IAAAM,iBAAA7G,MAAA2G,KACA,CADmC,CACnC,CADuCJ,CACvC,CAAA,IAAAM,iBAAA7G,MAAA4G,WAAA,CAAyC,CAAzC,CAA6CL,CAJjD,CARsD,CAqB1DtB,EAAA/P,UAAAwD,QAAA,CAAmCoO,QAAS,EAAG,CAC3C,IAAAnY,SAAAiK,SAAA;AAAyB,CAAA,CADkB,CAG/CqM,EAAA/P,UAAA,QAAA,CAAsC+P,CAAA/P,UAAAwD,QAMtCuM,EAAA/P,UAAA2D,OAAA,CAAkCkO,QAAS,EAAG,CAC1C,IAAApY,SAAAiK,SAAA,CAAyB,CAAA,CADiB,CAG9CqM,EAAA/P,UAAA,OAAA,CAAqC+P,CAAA/P,UAAA2D,OAOrCoM,EAAA/P,UAAA8R,OAAA,CAAkCC,QAAS,CAACT,CAAD,CAAQ,CAC1B,WAArB,GAAI,MAAOA,EAAX,GACI,IAAA7X,SAAA6X,MADJ,CAC0BA,CAD1B,CAGA,KAAAZ,mBAAA,EAJ+C,CAMnDX,EAAA/P,UAAA,OAAA,CAAqC+P,CAAA/P,UAAA8R,OAIrC/B,EAAA/P,UAAAiD,KAAA,CAAgC+O,QAAS,EAAG,CACxC,GAAI,IAAAvY,SAAJ,CAAmB,CACf,GAAI,IAAAuW,MAAJ,CAAgB,CAIZ,IAAIiC,EAAclY,QAAAC,cAAA,CAAuB,KAAvB,CAClBiY,EAAAvY,UAAAO,IAAA,CAA0B,IAAAL,YAAAsW,aAA1B,CACA,KAAAzW,SAAA8P,cAAAC,aAAA,CAAyCyI,CAAzC,CAAsD,IAAAxY,SAAtD,CACA,KAAAA,SAAA8P,cAAAE,YAAA,CAAwC,IAAAhQ,SAAxC,CACAwY;CAAA5X,YAAA,CAAwB,IAAAZ,SAAxB,CARY,CAAhB,IASO,CAIC6P,CAAAA,CAAYvP,QAAAC,cAAA,CAAuB,KAAvB,CAChBsP,EAAA5P,UAAAO,IAAA,CAAwB,IAAAL,YAAAuW,iBAAxB,CACA,KAAA1W,SAAA8P,cAAAC,aAAA,CAAyCF,CAAzC,CAAoD,IAAA7P,SAApD,CACA,KAAAA,SAAA8P,cAAAE,YAAA,CAAwC,IAAAhQ,SAAxC,CACA6P,EAAAjP,YAAA,CAAsB,IAAAZ,SAAtB,CACA,KAAIyY,EAAiBnY,QAAAC,cAAA,CAAuB,KAAvB,CACrBkY,EAAAxY,UAAAO,IAAA,CAA6B,IAAAL,YAAAwW,gBAA7B,CACA9G,EAAAjP,YAAA,CAAsB6X,CAAtB,CACA,KAAAV,iBAAA,CAAwBzX,QAAAC,cAAA,CAAuB,KAAvB,CACxB,KAAAwX,iBAAA9X,UAAAO,IAAA,CAAoC,IAAAL,YAAAyW,iBAApC,CACA6B,EAAA7X,YAAA,CAA2B,IAAAmX,iBAA3B,CACA;IAAAG,iBAAA,CAAwB5X,QAAAC,cAAA,CAAuB,KAAvB,CACxB,KAAA2X,iBAAAjY,UAAAO,IAAA,CAAoC,IAAAL,YAAA0W,iBAApC,CACA4B,EAAA7X,YAAA,CAA2B,IAAAsX,iBAA3B,CAjBG,CAmBP,IAAAQ,kBAAA,CAAyB,IAAA3B,SAAAxM,KAAA,CAAmB,IAAnB,CACzB,KAAAoO,mBAAA,CAA0B,IAAAtN,UAAAd,KAAA,CAAoB,IAApB,CAC1B,KAAAqO,oBAAA,CAA2B,IAAA/M,WAAAtB,KAAA,CAAqB,IAArB,CAC3B,KAAAsO,+BAAA,CAAsC,IAAAzB,sBAAA7M,KAAA,CAAgC,IAAhC,CACtC,KAAAvK,SAAAa,iBAAA,CAA+B,OAA/B,CAAwC,IAAA6X,kBAAxC,CACA,KAAA1Y,SAAAa,iBAAA,CAA+B,QAA/B,CAAyC,IAAA8X,mBAAzC,CACA;IAAA3Y,SAAAa,iBAAA,CAA+B,SAA/B,CAA0C,IAAA+X,oBAA1C,CACA,KAAA5Y,SAAA8P,cAAAjP,iBAAA,CAA6C,WAA7C,CAA0D,IAAAgY,+BAA1D,CACA,KAAA5B,mBAAA,EACA,KAAAjX,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAiL,YAA5B,CAtCe,CADqB,CA4C5C9I,EAAAY,SAAA,CAA0B,CACtBqE,YAAa+O,CADS,CAEtBrP,cAAe,gBAFO,CAGtBrC,SAAU,eAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA6BI4S,EAAAA,CAAmBA,QAAyB,CAACnW,CAAD,CAAU,CACtD,IAAA3C,SAAA,CAAgB2C,CAChB,KAAAoW,aAAA,CAAoB,IAAA/Y,SAAAqB,cAAA,CAA4B,GAA5B,CAAkC,IAAA2X,YAAAC,QAAlC,CACpB,KAAAC,eAAA,CAAsB,IAAAlZ,SAAAqB,cAAA,CAA4B,GAA5B,CAAkC,IAAA2X,YAAAG,OAAlC,CACtB;GAAKJ,CAAA,IAAAA,aAAL,CACI,KAAU7T,MAAJ,CAAU,iDAAV,CAAN,CAEJ,GAAKgU,CAAA,IAAAA,eAAL,CACI,KAAUhU,MAAJ,CAAU,iDAAV,CAAN,CAEJ,IAAAkU,OAAA,CAAc,CAAA,CAGd,KAAAC,YAAA,CADA,IAAAC,SACA,CAFA,IAAAC,eAEA,CAFsBC,IAAAA,EAGtB,KAAAC,qBAAA,CAA4B,EAC5B,KAAAC,iBAAA,CAAsB,CAAA,CAAtB,CAfsD,CAiB1DpV,OAAA,iBAAA,CAA6BwU,CAO7BA,EAAAvS,UAAAkD,UAAA,CAAuC,CAEnCkQ,iBAAkB,GAFiB,CAYvCb,EAAAvS,UAAAyS,YAAA,CAAyC,CACrCY,SAAU,cAD2B,CAErCX,QAAS,oBAF4B,CAGrCE,OAAQ,sBAH6B,CAIrCU,OAAQ,sBAJ6B,CAWzCf;CAAAvS,UAAAuT,iBAAA,CAA8CC,QAAS,EAAG,CACtD,IAAA/Z,SAAA0F,aAAA,CAA2B,aAA3B,CAA0C,MAA1C,CACI,KAAA6T,eAAJ,GACI,IAAAL,eAAAc,YAEA,CAFkC,IAAAX,YAElC,CADA,IAAAH,eAAArY,iBAAA,CAAqC,OAArC,CAA8C,IAAA0Y,eAA9C,CACA,CAAA,IAAAG,iBAAA,CAAsB,CAAA,CAAtB,CAHJ,CAKA,KAAAX,aAAAiB,YAAA,CAAgC,IAAAV,SAChC,KAAAtZ,SAAAC,UAAAO,IAAA,CAA4B,IAAAwY,YAAAa,OAA5B,CACA,KAAA7Z,SAAA0F,aAAA,CAA2B,aAA3B,CAA0C,OAA1C,CACA2D,WAAA,CAAW,IAAA4Q,SAAA1P,KAAA,CAAmB,IAAnB,CAAX,CAAqC,IAAA2P,SAArC,CAVsD,CAkB1DpB,EAAAvS,UAAA4T,aAAA,CAA0CC,QAAS,CAACC,CAAD,CAAO,CACtD,GAAab,IAAAA,EAAb;AAAIa,CAAJ,CACI,KAAUnV,MAAJ,CAAU,kEAAV,CAAN,CAEJ,GAAwBsU,IAAAA,EAAxB,GAAIa,CAAA,QAAJ,CACI,KAAUnV,MAAJ,CAAU,2CAAV,CAAN,CAEJ,GAAImV,CAAA,cAAJ,EAA8B,CAAAA,CAAA,WAA9B,CACI,KAAUnV,MAAJ,CAAU,8CAAV,CAAN,CAEA,IAAAkU,OAAJ,CACI,IAAAK,qBAAAlU,KAAA,CAA+B8U,CAA/B,CADJ,EAGI,IAAAjB,OAaA,CAbc,CAAA,CAad,CAZA,IAAAE,SAYA,CAZgBe,CAAA,QAYhB,CAVI,IAAAH,SAUJ,CAXIG,CAAA,QAAJ,CACoBA,CAAA,QADpB,CAGoB,IAQpB,CANIA,CAAA,cAMJ,GALI,IAAAd,eAKJ,CAL0Bc,CAAA,cAK1B,EAHIA,CAAA,WAGJ,GAFI,IAAAhB,YAEJ,CAFuBgB,CAAA,WAEvB,EAAA,IAAAP,iBAAA,EAhBJ,CAVsD,CA6B1DhB;CAAAvS,UAAA,aAAA,CAA6CuS,CAAAvS,UAAA4T,aAO7CrB,EAAAvS,UAAA+T,YAAA,CAAyCC,QAAS,EAAG,CACV,CAAvC,CAAI,IAAAd,qBAAA9V,OAAJ,EACI,IAAAwW,aAAA,CAAkB,IAAAV,qBAAAe,MAAA,EAAlB,CAF6C,CAUrD1B,EAAAvS,UAAA0T,SAAA,CAAsCQ,QAAS,EAAG,CAC9C,IAAAza,SAAAC,UAAA2L,OAAA,CAA+B,IAAAoN,YAAAa,OAA/B,CACAxQ,WAAA,CAAW,QAAS,EAAG,CACnB,IAAArJ,SAAA0F,aAAA,CAA2B,aAA3B,CAA0C,MAA1C,CACA,KAAAqT,aAAAiB,YAAA,CAAgC,EACnB,KAAAd,eAAAnY,aAAA,CAAiC,aAAjC,CAAb,GACI,IAAA2Y,iBAAA,CAAsB,CAAA,CAAtB,CAEA,CADA,IAAAR,eAAAc,YACA,CADkC,EAClC,CAAA,IAAAd,eAAAzF,oBAAA,CAAwC,OAAxC;AAAiD,IAAA8F,eAAjD,CAHJ,CAOA,KAAAF,YAAA,CADA,IAAAC,SACA,CAFA,IAAAC,eAEA,CAFsBC,IAAAA,EAGtB,KAAAJ,OAAA,CAAc,CAAA,CACd,KAAAkB,YAAA,EAZmB,CAAZ/P,KAAA,CAaJ,IAbI,CAAX,CAac,IAAAd,UAAAkQ,iBAbd,CAF8C,CAuBlDb,EAAAvS,UAAAmT,iBAAA,CAA8CgB,QAAS,CAAC7C,CAAD,CAAQ,CACvDA,CAAJ,CACI,IAAAqB,eAAAxT,aAAA,CAAiC,aAAjC,CAAgD,MAAhD,CADJ,CAGI,IAAAwT,eAAAyB,gBAAA,CAAoC,aAApC,CAJuD,CAS/DrY,EAAAY,SAAA,CAA0B,CACtBqE,YAAauR,CADS,CAEtB7R,cAAe,kBAFO,CAGtBrC,SAAU,iBAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BI0U,EAAAA,CAAkBA,QAAwB,CAACjY,CAAD,CAAU,CACpD,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAHoD,CAKxDlF,OAAA,gBAAA,CAA4BsW,CAO5BA,EAAArU,UAAAkD,UAAA,CAAsC,CAAEoR,wBAAyB,CAA3B,CAStCD;CAAArU,UAAApG,YAAA,CAAwC,CACpC2a,kBAAmB,oBADiB,CAEpCC,2BAA4B,6BAFQ,CAGpCC,mBAAoB,qBAHgB,CAIpCC,sBAAuB,wBAJa,CAKpCC,iBAAkB,mBALkB,CAMpCC,kBAAmB,oBANiB,CAcxCP,EAAArU,UAAA6U,YAAA,CAAwCC,QAAS,CAACC,CAAD,CAAQ,CACrD,IAAIC,EAAQjb,QAAAC,cAAA,CAAuB,KAAvB,CACZgb,EAAAtb,UAAAO,IAAA,CAAoB,IAAAL,YAAA2a,kBAApB,CACAS,EAAAtb,UAAAO,IAAA,CAAoB,IAAAL,YAAA2a,kBAApB,CAAyD,GAAzD,CAA+DQ,CAA/D,CACIE,EAAAA,CAAclb,QAAAC,cAAA,CAAuB,KAAvB,CAClBib,EAAAvb,UAAAO,IAAA,CAA0B,IAAAL,YAAA4a,2BAA1B,CACAS;CAAAvb,UAAAO,IAAA,CAA0B,IAAAL,YAAA+a,iBAA1B,CACA,KAAIO,EAAWnb,QAAAC,cAAA,CAAuB,KAAvB,CACfkb,EAAAxb,UAAAO,IAAA,CAAuB,IAAAL,YAAA8a,sBAAvB,CACA,KAAIS,EAAepb,QAAAC,cAAA,CAAuB,KAAvB,CACnBmb,EAAAzb,UAAAO,IAAA,CAA2B,IAAAL,YAAA4a,2BAA3B,CACAW,EAAAzb,UAAAO,IAAA,CAA2B,IAAAL,YAAAgb,kBAA3B,CAMA,KALA,IAAIQ,EAAe,CACfH,CADe,CAEfC,CAFe,CAGfC,CAHe,CAAnB,CAKSjY,EAAI,CAAb,CAAgBA,CAAhB,CAAoBkY,CAAAhY,OAApB,CAAyCF,CAAA,EAAzC,CAA8C,CAC1C,IAAImY,EAAStb,QAAAC,cAAA,CAAuB,KAAvB,CACbqb,EAAA3b,UAAAO,IAAA,CAAqB,IAAAL,YAAA6a,mBAArB,CACAW,EAAA,CAAalY,CAAb,CAAA7C,YAAA,CAA4Bgb,CAA5B,CAH0C,CAK9CL,CAAA3a,YAAA,CAAkB4a,CAAlB,CACAD,EAAA3a,YAAA,CAAkB6a,CAAlB,CACAF,EAAA3a,YAAA,CAAkB8a,CAAlB,CACA,KAAA1b,SAAAY,YAAA,CAA0B2a,CAA1B,CAzBqD,CA2BzDX;CAAArU,UAAA,YAAA,CAA2CqU,CAAArU,UAAA6U,YAO3CR,EAAArU,UAAAsV,KAAA,CAAiCC,QAAS,EAAG,CACzC,IAAA9b,SAAAC,UAAA2L,OAAA,CAA+B,WAA/B,CADyC,CAG7CgP,EAAArU,UAAA,KAAA,CAAoCqU,CAAArU,UAAAsV,KAQpCjB,EAAArU,UAAAwV,MAAA,CAAkCC,QAAS,EAAG,CAC1C,IAAAhc,SAAAC,UAAAO,IAAA,CAA4B,WAA5B,CAD0C,CAG9Coa,EAAArU,UAAA,MAAA,CAAqCqU,CAAArU,UAAAwV,MAIrCnB,EAAArU,UAAAiD,KAAA,CAAiCyS,QAAS,EAAG,CACzC,GAAI,IAAAjc,SAAJ,CAAmB,CACf,IAAK,IAAIyD,EAAI,CAAb,CAAgBA,CAAhB,EAAqB,IAAAgG,UAAAoR,wBAArB,CAA6DpX,CAAA,EAA7D,CACI,IAAA2X,YAAA,CAAiB3X,CAAjB,CAEJ,KAAAzD,SAAAC,UAAAO,IAAA,CAA4B,aAA5B,CAJe,CADsB,CAU7C8B,EAAAY,SAAA,CAA0B,CACtBqE,YAAaqT,CADS,CAEtB3T,cAAe,iBAFO,CAGtBrC,SAAU,gBAHY;AAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BIgW,EAAAA,CAAiBA,QAAuB,CAACvZ,CAAD,CAAU,CAClD,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAHkD,CAKtDlF,OAAA,eAAA,CAA2B4X,CAO3BA,EAAA3V,UAAAkD,UAAA,CAAqC,CAAEiB,aAAc,IAAhB,CASrCwR,EAAA3V,UAAApG,YAAA,CAAuC,CACnCwK,MAAO,mBAD4B,CAEnCwR,MAAO,mBAF4B,CAGnCC,MAAO,mBAH4B,CAInCvR,aAAc,0BAJqB,CAKnCnB,cAAe,sBALoB,CAMnCqB,qBAAsB,qCANa,CAOnC7I,iBAAkB,8BAPiB,CAQnC8I,cAAe,oBARoB,CASnC7I,OAAQ,YAT2B,CAUnC8I,WAAY,YAVuB,CAWnCC,YAAa,aAXsB;AAYnCC,WAAY,YAZuB,CAoBvC+Q,EAAA3V,UAAA8E,UAAA,CAAqCgR,QAAS,CAACxS,CAAD,CAAQ,CAClD,IAAA0B,eAAA,EADkD,CAStD2Q,EAAA3V,UAAAiF,SAAA,CAAoC8Q,QAAS,CAACzS,CAAD,CAAQ,CACjD,IAAA7J,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA8K,WAA5B,CADiD,CASrDiR,EAAA3V,UAAAmF,QAAA,CAAmC6Q,QAAS,CAAC1S,CAAD,CAAQ,CAChD,IAAA7J,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA8K,WAA/B,CADgD,CASpDiR,EAAA3V,UAAAsF,WAAA,CAAsC2Q,QAAS,CAAC3S,CAAD,CAAQ,CACnD,IAAAkC,MAAA,EADmD,CAQvDmQ,EAAA3V,UAAAgF,eAAA,CAA0CkR,QAAS,EAAG,CAClD,IAAAxQ,cAAA,EACA,KAAAC,iBAAA,EAFkD,CAStDgQ,EAAA3V,UAAAwF,MAAA,CAAiC2Q,QAAS,EAAG,CAGzCpY,MAAA+E,WAAA,CAAkB,QAAS,EAAG,CAC1B,IAAA+C,cAAAtC,KAAA,EAD0B,CAAZS,KAAA,CAEX,IAFW,CAAlB,CAEc,IAAAd,UAAAiB,aAFd,CAHyC,CAa7CwR;CAAA3V,UAAA0F,cAAA,CAAyC0Q,QAAS,EAAG,CAC7C,IAAAvQ,cAAAnC,SAAJ,CACI,IAAAjK,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA+K,YAA5B,CADJ,CAGI,IAAAlL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA+K,YAA/B,CAJ6C,CAOrDgR,EAAA3V,UAAA,cAAA,CAA4C2V,CAAA3V,UAAA0F,cAM5CiQ,EAAA3V,UAAA2F,iBAAA,CAA4C0Q,QAAS,EAAG,CAChD,IAAAxQ,cAAAE,QAAJ,CACI,IAAAtM,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAgL,WAA5B,CADJ,CAGI,IAAAnL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAAgL,WAA/B,CAJgD,CAOxD+Q,EAAA3V,UAAA,iBAAA,CAA+C2V,CAAA3V,UAAA2F,iBAM/CgQ,EAAA3V,UAAAwD,QAAA,CAAmC8S,QAAS,EAAG,CAC3C,IAAAzQ,cAAAnC,SAAA;AAA8B,CAAA,CAC9B,KAAAsB,eAAA,EAF2C,CAI/C2Q,EAAA3V,UAAA,QAAA,CAAsC2V,CAAA3V,UAAAwD,QAMtCmS,EAAA3V,UAAA2D,OAAA,CAAkC4S,QAAS,EAAG,CAC1C,IAAA1Q,cAAAnC,SAAA,CAA8B,CAAA,CAC9B,KAAAsB,eAAA,EAF0C,CAI9C2Q,EAAA3V,UAAA,OAAA,CAAqC2V,CAAA3V,UAAA2D,OAMrCgS,EAAA3V,UAAAwW,GAAA,CAA8BC,QAAS,EAAG,CACtC,IAAA5Q,cAAAE,QAAA,CAA6B,CAAA,CAC7B,KAAAf,eAAA,EAFsC,CAI1C2Q,EAAA3V,UAAA,GAAA,CAAiC2V,CAAA3V,UAAAwW,GAMjCb,EAAA3V,UAAA0W,IAAA,CAA+BC,QAAS,EAAG,CACvC,IAAA9Q,cAAAE,QAAA,CAA6B,CAAA,CAC7B,KAAAf,eAAA,EAFuC,CAI3C2Q,EAAA3V,UAAA,IAAA,CAAkC2V,CAAA3V,UAAA0W,IAIlCf,EAAA3V,UAAAiD,KAAA,CAAgC2T,QAAS,EAAG,CACxC,GAAI,IAAAnd,SAAJ,CAAmB,CACf,IAAAoM,cAAA,CAAqB,IAAApM,SAAAqB,cAAA,CAA4B,GAA5B;AAAkC,IAAAlB,YAAAwK,MAAlC,CACrB,KAAIyS,EAAQ9c,QAAAC,cAAA,CAAuB,KAAvB,CACZ6c,EAAAnd,UAAAO,IAAA,CAAoB,IAAAL,YAAAgc,MAApB,CACA,KAAIkB,EAAQ/c,QAAAC,cAAA,CAAuB,KAAvB,CACZ8c,EAAApd,UAAAO,IAAA,CAAoB,IAAAL,YAAAic,MAApB,CACA,KAAIkB,EAAchd,QAAAC,cAAA,CAAuB,MAAvB,CAClB+c,EAAArd,UAAAO,IAAA,CAA0B,IAAAL,YAAA0K,aAA1B,CACAwS,EAAAzc,YAAA,CAAkB0c,CAAlB,CACA,KAAAtd,SAAAY,YAAA,CAA0Bwc,CAA1B,CACA,KAAApd,SAAAY,YAAA,CAA0Byc,CAA1B,CACA,KAAAzE,oBAAA,CAA2B,IAAA/M,WAAAtB,KAAA,CAAqB,IAArB,CACvB,KAAAvK,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAuJ,cAAjC,CAAJ,GACI,IAAA1J,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA4K,qBAA5B,CASA;AARA,IAAAmC,wBAQA,CAR+B5M,QAAAC,cAAA,CAAuB,MAAvB,CAQ/B,CAPA,IAAA2M,wBAAAjN,UAAAO,IAAA,CAA2C,IAAAL,YAAA+B,iBAA3C,CAOA,CANA,IAAAgL,wBAAAjN,UAAAO,IAAA,CAA2C,IAAAL,YAAAuJ,cAA3C,CAMA,CALA,IAAAwD,wBAAAjN,UAAAO,IAAA,CAA2C,IAAAL,YAAA6K,cAA3C,CAKA,CAJA,IAAAkC,wBAAArM,iBAAA,CAA8C,SAA9C,CAAyD,IAAA+X,oBAAzD,CAIA,CAHIlY,CAGJ,CAHaJ,QAAAC,cAAA,CAAuB,MAAvB,CAGb,CAFAG,CAAAT,UAAAO,IAAA,CAAqB,IAAAL,YAAAgC,OAArB,CAEA,CADA,IAAA+K,wBAAAtM,YAAA,CAAyCF,CAAzC,CACA,CAAA,IAAAV,SAAAY,YAAA,CAA0B,IAAAsM,wBAA1B,CAVJ,CAYA;IAAAyL,mBAAA,CAA0B,IAAAtN,UAAAd,KAAA,CAAoB,IAApB,CAC1B,KAAAgT,kBAAA,CAAyB,IAAA/R,SAAAjB,KAAA,CAAmB,IAAnB,CACzB,KAAAiT,iBAAA,CAAwB,IAAA9R,QAAAnB,KAAA,CAAkB,IAAlB,CACxB,KAAA6B,cAAAvL,iBAAA,CAAoC,QAApC,CAA8C,IAAA8X,mBAA9C,CACA,KAAAvM,cAAAvL,iBAAA,CAAoC,OAApC,CAA6C,IAAA0c,kBAA7C,CACA,KAAAnR,cAAAvL,iBAAA,CAAoC,MAApC,CAA4C,IAAA2c,iBAA5C,CACA,KAAAxd,SAAAa,iBAAA,CAA+B,SAA/B,CAA0C,IAAA+X,oBAA1C,CACA,KAAArN,eAAA,EACA,KAAAvL,SAAAC,UAAAO,IAAA,CAA4B,aAA5B,CAhCe,CADqB,CAsC5C8B,EAAAY,SAAA,CAA0B,CACtBqE,YAAa2U,CADS;AAEtBjV,cAAe,gBAFO,CAGtBrC,SAAU,eAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BIuX,EAAAA,CAAeA,QAAqB,CAAC9a,CAAD,CAAU,CAE9C,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAJ8C,CAMlDlF,OAAA,aAAA,CAAyBmZ,CAOzBA,EAAAlX,UAAAkD,UAAA,CAAmC,EASnCgU,EAAAlX,UAAApG,YAAA,CAAqC,CACjCud,UAAW,eADsB,CAEjCC,YAAa,iBAFoB,CAGjCnc,aAAc,WAHmB,CAIjCoc,eAAgB,aAJiB,CAKjCxd,qBAAsB,sBALW,CAMjCK,qBAAsB,4BANW,CAOjCE,WAAY,YAPqB,CAQjCkd,mCAAoC,qCARH,CAerCJ,EAAAlX,UAAAuX,UAAA;AAAmCC,QAAS,EAAG,CACvC,IAAA/d,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAC,qBAAjC,CAAJ,EACI,IAAAJ,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA0d,mCAA5B,CAGJ,KAAAG,MAAA,CAAa,IAAAhe,SAAA8E,iBAAA,CAA+B,GAA/B,CAAqC,IAAA3E,YAAAud,UAArC,CACb,KAAAO,QAAA,CAAe,IAAAje,SAAA8E,iBAAA,CAA+B,GAA/B,CAAqC,IAAA3E,YAAAwd,YAArC,CAEf,KAAK,IAAIla,EAAI,CAAb,CAAgBA,CAAhB,CAAoB,IAAAua,MAAAra,OAApB,CAAuCF,CAAA,EAAvC,CACI,IAAI5D,CAAJ,CAAgB,IAAAme,MAAA,CAAWva,CAAX,CAAhB,CAA+B,IAA/B,CAEJ,KAAAzD,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAyd,eAA5B,CAX2C,CAkB/CH,EAAAlX,UAAAjF,eAAA,CAAwC4c,QAAS,EAAG,CAChD,IAAK,IAAIC,EAAI,CAAb,CAAgBA,CAAhB,CAAoB,IAAAH,MAAAra,OAApB,CAAuCwa,CAAA,EAAvC,CACI,IAAAH,MAAA,CAAWG,CAAX,CAAAle,UAAA2L,OAAA,CAA+B,IAAAzL,YAAAqB,aAA/B,CAF4C,CAUpDic;CAAAlX,UAAAhF,iBAAA,CAA0C6c,QAAS,EAAG,CAClD,IAAK,IAAIrY,EAAI,CAAb,CAAgBA,CAAhB,CAAoB,IAAAkY,QAAAta,OAApB,CAAyCoC,CAAA,EAAzC,CACI,IAAAkY,QAAA,CAAalY,CAAb,CAAA9F,UAAA2L,OAAA,CAAiC,IAAAzL,YAAAqB,aAAjC,CAF8C,CAQtDic,EAAAlX,UAAAiD,KAAA,CAA8B6U,QAAS,EAAG,CAClC,IAAAre,SAAJ,EACI,IAAA8d,UAAA,EAFkC,CAsC1Cxb,EAAAY,SAAA,CAA0B,CACtBqE,YAAakW,CADS,CAEtBxW,cAAe,cAFO,CAGtBrC,SAAU,aAHY,CAA1B,CA6BI0Z,EAAAA,CAAoBA,QAA0B,CAAC3b,CAAD,CAAU,CACxD,IAAA3C,SAAA,CAAgB2C,CAChB,KAAA4b,QAAA,CAAe,IAAA9U,UAAA+U,YAEf,KAAAhV,KAAA,EAJwD,CAM5DlF,OAAA,kBAAA,CAA8Bga,CAO9BA,EAAA/X,UAAAkD,UAAA,CAAwC,CACpC+U,YAAc,EADsB,CAEpCC,mBAAoB,SAFgB,CAYxCH,EAAA/X,UAAApG,YAAA,CAA0C,CACtCue,MAAO,sBAD+B;AAEtC/T,MAAO,sBAF+B,CAGtCgU,SAAU,UAH4B,CAItC1T,WAAY,YAJ0B,CAKtCC,YAAa,aALyB,CAMtC0T,WAAY,YAN0B,CAOtCxT,YAAa,aAPyB,CAQtCyT,gBAAiB,iBARqB,CAgB1CP,EAAA/X,UAAAuY,WAAA,CAAyCC,QAAS,CAAClV,CAAD,CAAQ,CACtD,IAAImV,EAAkBnV,CAAAsI,OAAA0F,MAAA1W,MAAA,CAAyB,IAAzB,CAAAwC,OACA,GAAtB,GAAIkG,CAAAkI,QAAJ,EACQiN,CADR,EAC2B,IAAAT,QAD3B,EAEQ1U,CAAA5I,eAAA,EAJ8C,CAc1Dqd,EAAA/X,UAAAiF,SAAA,CAAuCyT,QAAS,CAACpV,CAAD,CAAQ,CACpD,IAAA7J,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA8K,WAA5B,CADoD,CASxDqT,EAAA/X,UAAAmF,QAAA,CAAsCwT,QAAS,CAACrV,CAAD,CAAQ,CACnD,IAAA7J,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA8K,WAA/B,CADmD,CASvDqT,EAAA/X,UAAA4Y,SAAA;AAAuCC,QAAS,CAACvV,CAAD,CAAQ,CACpD,IAAA0B,eAAA,EADoD,CAQxD+S,EAAA/X,UAAAgF,eAAA,CAA6C8T,QAAS,EAAG,CACrD,IAAApT,cAAA,EACA,KAAAqT,cAAA,EACA,KAAAC,WAAA,EACA,KAAAC,WAAA,EAJqD,CAYzDlB,EAAA/X,UAAA0F,cAAA,CAA4CwT,QAAS,EAAG,CAChD,IAAAC,OAAAzV,SAAJ,CACI,IAAAjK,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA+K,YAA5B,CADJ,CAGI,IAAAlL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA+K,YAA/B,CAJgD,CAOxDoT,EAAA/X,UAAA,cAAA,CAA+C+X,CAAA/X,UAAA0F,cAM/CqS,EAAA/X,UAAAiZ,WAAA,CAAyCG,QAAS,EAAG,CACrC,IAAA3f,SAAAqB,cAAA,CAA4B,QAA5B,CAAZ,CACI,IAAArB,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA8K,WAA5B,CADJ;AAGI,IAAAjL,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA8K,WAA/B,CAJ6C,CAOrDqT,EAAA/X,UAAA,WAAA,CAA4C+X,CAAA/X,UAAAiZ,WAM5ClB,EAAA/X,UAAA+Y,cAAA,CAA4CM,QAAS,EAAG,CAChD,IAAAF,OAAAG,SAAJ,GACQ,IAAAH,OAAAG,SAAAC,MAAJ,CACI,IAAA9f,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAAye,WAA/B,CADJ,CAGI,IAAA5e,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAye,WAA5B,CAJR,CADoD,CASxDN,EAAA/X,UAAA,cAAA,CAA+C+X,CAAA/X,UAAA+Y,cAM/ChB,EAAA/X,UAAAgZ,WAAA,CAAyCQ,QAAS,EAAG,CAC7C,IAAAL,OAAA7H,MAAJ,EAAoD,CAApD,CAAyB,IAAA6H,OAAA7H,MAAAlU,OAAzB,CACI,IAAA3D,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAwe,SAA5B,CADJ,CAGI,IAAA3e,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAAwe,SAA/B,CAJ6C,CAOrDL;CAAA/X,UAAA,WAAA,CAA4C+X,CAAA/X,UAAAgZ,WAM5CjB,EAAA/X,UAAAwD,QAAA,CAAsCiW,QAAS,EAAG,CAC9C,IAAAN,OAAAzV,SAAA,CAAuB,CAAA,CACvB,KAAAsB,eAAA,EAF8C,CAIlD+S,EAAA/X,UAAA,QAAA,CAAyC+X,CAAA/X,UAAAwD,QAMzCuU,EAAA/X,UAAA2D,OAAA,CAAqC+V,QAAS,EAAG,CAC7C,IAAAP,OAAAzV,SAAA,CAAuB,CAAA,CACvB,KAAAsB,eAAA,EAF6C,CAIjD+S,EAAA/X,UAAA,OAAA,CAAwC+X,CAAA/X,UAAA2D,OAOxCoU,EAAA/X,UAAA8R,OAAA,CAAqC6H,QAAS,CAACrI,CAAD,CAAQ,CAClD,IAAA6H,OAAA7H,MAAA,CAAoBA,CAApB,EAA6B,EAC7B,KAAAtM,eAAA,EAFkD,CAItD+S,EAAA/X,UAAA,OAAA,CAAwC+X,CAAA/X,UAAA8R,OAIxCiG,EAAA/X,UAAAiD,KAAA,CAAmC2W,QAAS,EAAG,CAC3C,GAAI,IAAAngB,SAAJ,GACI,IAAAogB,OACAV,CADc,IAAA1f,SAAAqB,cAAA,CAA4B,GAA5B,CAAkC,IAAAlB,YAAAue,MAAlC,CACdgB;AAAA,IAAAA,OAAAA,CAAc,IAAA1f,SAAAqB,cAAA,CAA4B,GAA5B,CAAkC,IAAAlB,YAAAwK,MAAlC,CAFlB,EAGqB,CACT,IAAA+U,OAAAlN,aAAA,CAAyB,IAAA/I,UAAAgV,mBAAzB,CAAJ,GACI,IAAAF,QACA,CADe8B,QAAA,CAAS,IAAAX,OAAA3e,aAAA,CAAyB,IAAA0I,UAAAgV,mBAAzB,CAAT,CAAsE,EAAtE,CACf,CAAI6B,KAAA,CAAM,IAAA/B,QAAN,CAAJ,GACI,IAAAA,QADJ,CACmB,IAAA9U,UAAA+U,YADnB,CAFJ,CAMI,KAAAkB,OAAAlN,aAAA,CAAyB,aAAzB,CAAJ,EACI,IAAAxS,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA0e,gBAA5B,CAEJ,KAAA0B,0BAAA,CAAiC,IAAAhV,eAAAhB,KAAA,CAAyB,IAAzB,CACjC,KAAAgT,kBAAA,CAAyB,IAAA/R,SAAAjB,KAAA,CAAmB,IAAnB,CACzB,KAAAiT,iBAAA;AAAwB,IAAA9R,QAAAnB,KAAA,CAAkB,IAAlB,CACxB,KAAAiW,kBAAA,CAAyB,IAAArB,SAAA5U,KAAA,CAAmB,IAAnB,CACzB,KAAAmV,OAAA7e,iBAAA,CAA6B,OAA7B,CAAsC,IAAA0f,0BAAtC,CACA,KAAAb,OAAA7e,iBAAA,CAA6B,OAA7B,CAAsC,IAAA0c,kBAAtC,CACA,KAAAmC,OAAA7e,iBAAA,CAA6B,MAA7B,CAAqC,IAAA2c,iBAArC,CACA,KAAAkC,OAAA7e,iBAAA,CAA6B,OAA7B,CAAsC,IAAA2f,kBAAtC,CACI,KAAAjC,QAAJ,GAAqB,IAAA9U,UAAA+U,YAArB,GAGI,IAAAiC,oBACA,CAD2B,IAAA3B,WAAAvU,KAAA,CAAqB,IAArB,CAC3B,CAAA,IAAAmV,OAAA7e,iBAAA,CAA6B,SAA7B,CAAwC,IAAA4f,oBAAxC,CAJJ,CAMA,KAAIC,EAAU,IAAA1gB,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAye,WAAjC,CACd;IAAArT,eAAA,EACA,KAAAvL,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAiL,YAA5B,CACIsV,EAAJ,EACI,IAAA1gB,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAye,WAA5B,CAEA,KAAAc,OAAAlN,aAAA,CAAyB,WAAzB,CAAJ,GACI,IAAAxS,SAAAgS,MAAA,EACA,CAAA,IAAAwN,WAAA,EAFJ,CA9Ba,CAJsB,CA2C/Cld,EAAAY,SAAA,CAA0B,CACtBqE,YAAa+W,CADS,CAEtBrX,cAAe,mBAFO,CAGtBrC,SAAU,kBAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CA8BIya,EAAAA,CAAkBA,QAAwB,CAAChe,CAAD,CAAU,CACpD,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAHoD,CAKxDlF,OAAA,gBAAA,CAA4Bqc,CAO5BA,EAAApa,UAAAkD,UAAA,CAAsC,EAStCkX,EAAApa,UAAApG,YAAA,CAAwC,CACpC4B,UAAW,WADyB,CAEpC6e,OAAQ,qBAF4B,CAGpCC,KAAM,mBAH8B;AAIpCC,MAAO,oBAJ6B,CAKpCC,IAAK,kBAL+B,CAaxCJ,EAAApa,UAAAya,kBAAA,CAA8CC,QAAS,CAACpX,CAAD,CAAQ,CACvDqX,CAAAA,CAAQrX,CAAAsI,OAAAhB,sBAAA,EACZ,KAAIO,EAAOwP,CAAAxP,KAAPA,CAAoBwP,CAAApO,MAApBpB,CAAkC,CAAtC,CACIH,EAAM2P,CAAA3P,IAANA,CAAkB2P,CAAArO,OAAlBtB,CAAiC,CADrC,CAEI4P,EAAmB,IAAAnhB,SAAAohB,YAAnBD,CAA+C,CAA/CA,CAAc,EAFlB,CAGIE,EAAkB,IAAArhB,SAAAyR,aAAlB4P,CAA+C,CAA/CA,CAAa,EACb,KAAArhB,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA0gB,KAAjC,CAAJ,EAA+D,IAAA7gB,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA2gB,MAAjC,CAA/D,CAE0B,CAAtB,CAAIvP,CAAJ,CAAU8P,CAAV,EACI,IAAArhB,SAAAqR,MAAAE,IACA,CAD0B,GAC1B,CAAA,IAAAvR,SAAAqR,MAAAgQ,UAAA,CAAgC,GAFpC,GAII,IAAArhB,SAAAqR,MAAAE,IACA,CAD0BA,CAC1B,CADgC,IAChC,CAAA,IAAAvR,SAAAqR,MAAAgQ,UAAA,CAAgCA,CAAhC,CAA4C,IALhD,CAFJ,CAU4B,CAAxB,CAAI3P,CAAJ,CAAWyP,CAAX,EACI,IAAAnhB,SAAAqR,MAAAK,KACA;AAD2B,GAC3B,CAAA,IAAA1R,SAAAqR,MAAA8P,WAAA,CAAiC,GAFrC,GAII,IAAAnhB,SAAAqR,MAAAK,KACA,CAD2BA,CAC3B,CADkC,IAClC,CAAA,IAAA1R,SAAAqR,MAAA8P,WAAA,CAAiCA,CAAjC,CAA8C,IALlD,CAQA,KAAAnhB,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA4gB,IAAjC,CAAJ,CACI,IAAA/gB,SAAAqR,MAAAE,IADJ,CAC8B2P,CAAA3P,IAD9B,CAC0C,IAAAvR,SAAAyR,aAD1C,CACuE,EADvE,CAC4E,IAD5E,CAEW,IAAAzR,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA2gB,MAAjC,CAAJ,CACH,IAAA9gB,SAAAqR,MAAAK,KADG,CACwBwP,CAAAxP,KADxB,CACqCwP,CAAApO,MADrC,CACmD,EADnD,CACwD,IADxD,CAEI,IAAA9S,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA0gB,KAAjC,CAAJ,CACH,IAAA7gB,SAAAqR,MAAAK,KADG,CACwBwP,CAAAxP,KADxB,CACqC,IAAA1R,SAAAohB,YADrC,CACiE,EADjE,CACsE,IADtE,CAGH,IAAAphB,SAAAqR,MAAAE,IAHG,CAGuB2P,CAAA3P,IAHvB,CAGmC2P,CAAArO,OAHnC,CAGkD,EAHlD;AAGuD,IAE9D,KAAA7S,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA4B,UAA5B,CAjC2D,CAwC/D4e,EAAApa,UAAA+a,aAAA,CAAyCC,QAAS,EAAG,CACjD,IAAAvhB,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA4B,UAA/B,CADiD,CAMrD4e,EAAApa,UAAAiD,KAAA,CAAiCgY,QAAS,EAAG,CACzC,GAAI,IAAAxhB,SAAJ,CAAmB,CACf,IAAIoQ,EAAU,IAAApQ,SAAAe,aAAA,CAA2B,KAA3B,CAAVqP,EAA+C,IAAApQ,SAAAe,aAAA,CAA2B,cAA3B,CAC/CqP,EAAJ,GACI,IAAAG,YADJ,CACuBjQ,QAAAgQ,eAAA,CAAwBF,CAAxB,CADvB,CAGI,KAAAG,YAAJ,GAES,IAAAA,YAAAiC,aAAA,CAA8B,UAA9B,CASL,EARI,IAAAjC,YAAA7K,aAAA,CAA8B,UAA9B,CAA0C,GAA1C,CAQJ,CANA,IAAA+b,uBAMA,CAN8B,IAAAT,kBAAAzW,KAAA,CAA4B,IAA5B,CAM9B;AALA,IAAAmX,gCAKA,CALuC,IAAAJ,aAAA/W,KAAA,CAAuB,IAAvB,CAKvC,CAJA,IAAAgG,YAAA1P,iBAAA,CAAkC,YAAlC,CAAgD,IAAA4gB,uBAAhD,CAA6E,CAAA,CAA7E,CAIA,CAHA,IAAAlR,YAAA1P,iBAAA,CAAkC,UAAlC,CAA8C,IAAA4gB,uBAA9C,CAA2E,CAAA,CAA3E,CAGA,CAFA,IAAAlR,YAAA1P,iBAAA,CAAkC,YAAlC,CAAgD,IAAA6gB,gCAAhD,CAAsF,CAAA,CAAtF,CAEA,CADApd,MAAAzD,iBAAA,CAAwB,QAAxB,CAAkC,IAAA6gB,gCAAlC,CAAwE,CAAA,CAAxE,CACA,CAAApd,MAAAzD,iBAAA,CAAwB,YAAxB,CAAsC,IAAA6gB,gCAAtC,CAXJ,CALe,CADsB,CAuB7Cpf,EAAAY,SAAA,CAA0B,CACtBqE,YAAaoZ,CADS,CAEtB1Z,cAAe,iBAFO;AAGtBrC,SAAU,aAHY,CAA1B,CA6BI+c,EAAAA,CAAiBA,QAAuB,CAAChf,CAAD,CAAU,CAClD,IAAA3C,SAAA,CAAgB2C,CAEhB,KAAA6G,KAAA,EAHkD,CAKtDlF,OAAA,eAAA,CAA2Bqd,CAO3BA,EAAApb,UAAAkD,UAAA,CAAqC,CACjCmY,UAAW,qBADsB,CAEjCC,kBAAmB,GAFc,CAGjCC,eAAgB,GAHiB,CAIjCC,UAAW,UAJsB,CAKjCC,aAAc,cALmB,CAMjCC,cAAe,eANkB,CAcrCN,EAAApb,UAAAoI,UAAA,CAAqC,CACjCC,MAAO,EAD0B,CAEjCC,OAAQ,EAFyB,CAGjCC,MAAO,EAH0B,CAWrC6S,EAAApb,UAAA2b,MAAA,CAAiC,CAC7BC,SAAU,CADmB,CAE7BC,OAAQ,CAFqB,CAG7BC,UAAW,CAHkB,CAI7BC,OAAQ,CAJqB,CAcjCX,EAAApb,UAAApG,YAAA,CAAuC,CACnC8O,UAAW,uBADwB,CAEnCsT,OAAQ,oBAF2B,CAGnCC,OAAQ,oBAH2B,CAInCC,QAAS,qBAJ0B;AAKnCC,WAAY,2BALuB,CAMnCC,KAAM,gBAN6B,CAOnC1gB,iBAAkB,sBAPiB,CAQnCC,iBAAkB,kCARiB,CASnCC,OAAQ,YAT2B,CAUnC4I,qBAAsB,qCAVa,CAWnC6X,cAAe,4BAXoB,CAYnCC,iBAAkB,+BAZiB,CAanCC,cAAe,4BAboB,CAcnCC,aAAc,0BAdqB,CAenCC,WAAY,wBAfuB,CAgBnCC,QAAS,qBAhB0B,CAiBnCC,cAAe,+BAjBoB;AAkBnCC,IAAK,iBAlB8B,CAmBnCC,eAAgB,4BAnBmB,CAoBnCC,oBAAqB,iCApBc,CAqBnCC,qBAAsB,kCArBa,CAsBnClhB,kBAAmB,+BAtBgB,CAuBnCmhB,MAAO,uBAvB4B,CAwBnCC,WAAY,YAxBuB,CAyBnCC,SAAU,UAzByB,CA0BnCC,qBAAsB,sBA1Ba,CA2BnCC,eAAgB,mBA3BmB,CA4BnCC,WAAY,YA5BuB,CA6BnCC,gBAAiB,iBA7BkB,CA8BnCC,eAAgB,YA9BmB,CA+BnC/hB,UAAW,WA/BwB,CAgCnCqJ,YAAa,aAhCsB;AAiCnCkE,aAAc,cAjCqB,CAkCnCyU,gBAAiB,+BAlCkB,CAmCnCC,gBAAiB,+BAnCkB,CA0CvCrC,EAAApb,UAAA0d,sBAAA,CAAiDC,QAAS,EAAG,CACzD,GAAI,CAAA,IAAAC,QAAAlkB,UAAAC,SAAA,CAAgC,IAAAC,YAAAmP,aAAhC,CAAJ,CAAA,CAGA,IAAI8U,EAAgB,CAAC,IAAApkB,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA0jB,gBAAjC,CAAjBO,EAAuF,IAAApkB,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA4iB,aAAjC,CAC7D,EAA9B,CAAI,IAAAjhB,SAAAuiB,UAAJ,EAAoC,CAAA,IAAAF,QAAAlkB,UAAAC,SAAA,CAAgC,IAAAC,YAAAyjB,WAAhC,CAApC,EACI,IAAAO,QAAAlkB,UAAAO,IAAA,CAA2B,IAAAL,YAAAwjB,eAA3B,CAEA;AADA,IAAAQ,QAAAlkB,UAAAO,IAAA,CAA2B,IAAAL,YAAAyjB,WAA3B,CACA,CAAIQ,CAAJ,EACI,IAAAD,QAAAlkB,UAAAO,IAAA,CAA2B,IAAAL,YAAAmP,aAA3B,CAJR,EAMsC,CANtC,EAMW,IAAAxN,SAAAuiB,UANX,EAM2C,IAAAF,QAAAlkB,UAAAC,SAAA,CAAgC,IAAAC,YAAAyjB,WAAhC,CAN3C,GAOI,IAAAO,QAAAlkB,UAAA2L,OAAA,CAA8B,IAAAzL,YAAAwjB,eAA9B,CAEA,CADA,IAAAQ,QAAAlkB,UAAA2L,OAAA,CAA8B,IAAAzL,YAAAyjB,WAA9B,CACA,CAAIQ,CAAJ,EACI,IAAAD,QAAAlkB,UAAAO,IAAA,CAA2B,IAAAL,YAAAmP,aAA3B,CAVR,CAJA,CADyD,CAyB7DqS,EAAApb,UAAA+d,sBAAA,CAAiDC,QAAS,CAACtT,CAAD,CAAM,CAExDA,CAAAc,QAAJ,GAAoB,IAAApD,UAAAE,OAApB,EAA6C,IAAA2V,QAAAvkB,UAAAC,SAAA,CAAgC,IAAAC,YAAA2jB,eAAhC,CAA7C;AACI,IAAAW,aAAA,EAHwD,CAWhE9C,EAAApb,UAAAme,mBAAA,CAA8CC,QAAS,EAAG,CAClD,IAAAC,sBAAAC,QAAJ,CACI,IAAA7kB,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAA0jB,gBAA5B,CADJ,EAGI,IAAA7jB,SAAAC,UAAA2L,OAAA,CAA+B,IAAAzL,YAAA0jB,gBAA/B,CAEA,CAAI,IAAAW,QAAJ,GACI,IAAAA,QAAAvkB,UAAA2L,OAAA,CAA8B,IAAAzL,YAAA2jB,eAA9B,CACA,CAAA,IAAAgB,YAAA7kB,UAAA2L,OAAA,CAAkC,IAAAzL,YAAA2jB,eAAlC,CAFJ,CALJ,CADsD,CAkB1DnC,EAAApb,UAAAwe,qBAAA,CAAgDC,QAAS,CAAC/T,CAAD,CAAM,CAC3D,GAAIA,CAAJ,EAAwB,SAAxB,GAAWA,CAAAgU,KAAX,CACI,GAAIhU,CAAAc,QAAJ,GAAoB,IAAApD,UAAAG,MAApB,EAA4CmC,CAAAc,QAA5C,GAA4D,IAAApD,UAAAC,MAA5D,CAEIqC,CAAAhQ,eAAA,EAFJ;IAKI,OAGR,KAAAwjB,aAAA,EAV2D,CAiB/D9C,EAAApb,UAAA2e,4BAAA,CAAuDC,QAAS,EAAG,CAC/D,IAAAhB,QAAAlkB,UAAA2L,OAAA,CAA8B,IAAAzL,YAAAmP,aAA9B,CAD+D,CAQnEqS,EAAApb,UAAA6e,oBAAA,CAA+CC,QAAS,EAAG,CACnD,IAAAlB,QAAAlkB,UAAAC,SAAA,CAAgC,IAAAC,YAAAyjB,WAAhC,CAAJ,GACI,IAAAO,QAAAlkB,UAAA2L,OAAA,CAA8B,IAAAzL,YAAAyjB,WAA9B,CACA,CAAA,IAAAO,QAAAlkB,UAAAO,IAAA,CAA2B,IAAAL,YAAAmP,aAA3B,CAFJ,CADuD,CAW3DqS,EAAApb,UAAAjF,eAAA,CAA0CgkB,QAAS,CAACC,CAAD,CAAS,CACxD,IAAK,IAAIpH,EAAI,CAAb,CAAgBA,CAAhB,CAAoBoH,CAAA5hB,OAApB,CAAmCwa,CAAA,EAAnC,CACIoH,CAAA,CAAOpH,CAAP,CAAAle,UAAA2L,OAAA,CAA2B,IAAAzL,YAAA4B,UAA3B,CAFoD,CAU5D4f,EAAApb,UAAAhF,iBAAA;AAA4CikB,QAAS,CAAC7jB,CAAD,CAAS,CAC1D,IAAK,IAAIoE,EAAI,CAAb,CAAgBA,CAAhB,CAAoBpE,CAAAgC,OAApB,CAAmCoC,CAAA,EAAnC,CACIpE,CAAA,CAAOoE,CAAP,CAAA9F,UAAA2L,OAAA,CAA2B,IAAAzL,YAAA4B,UAA3B,CAFsD,CAU9D4f,EAAApb,UAAAke,aAAA,CAAwCgB,QAAS,EAAG,CAChD,IAAIC,EAAe,IAAA1lB,SAAAqB,cAAA,CAA4B,GAA5B,CAAkC,IAAAlB,YAAAuiB,WAAlC,CACnB,KAAA8B,QAAAvkB,UAAA4R,OAAA,CAA8B,IAAA1R,YAAA2jB,eAA9B,CACA,KAAAgB,YAAA7kB,UAAA4R,OAAA,CAAkC,IAAA1R,YAAA2jB,eAAlC,CAEI,KAAAU,QAAAvkB,UAAAC,SAAA,CAAgC,IAAAC,YAAA2jB,eAAhC,CAAJ,EACI,IAAAU,QAAA9e,aAAA,CAA0B,aAA1B,CAAyC,OAAzC,CACA,CAAAggB,CAAAhgB,aAAA,CAA0B,eAA1B,CAA2C,MAA3C,CAFJ,GAII,IAAA8e,QAAA9e,aAAA,CAA0B,aAA1B;AAAyC,MAAzC,CACA,CAAAggB,CAAAhgB,aAAA,CAA0B,eAA1B,CAA2C,OAA3C,CALJ,CALgD,CAapDic,EAAApb,UAAA,aAAA,CAA2Cob,CAAApb,UAAAke,aAI3C9C,EAAApb,UAAAiD,KAAA,CAAgCmc,QAAS,EAAG,CACxC,GAAI,IAAA3lB,SAAJ,CAAmB,CACf,IAAI6P,EAAYvP,QAAAC,cAAA,CAAuB,KAAvB,CAChBsP,EAAA5P,UAAAO,IAAA,CAAwB,IAAAL,YAAA8O,UAAxB,CACA,KAAI2W,EAAiB,IAAA5lB,SAAAqB,cAAA,CAA4B,QAA5B,CACrB,KAAArB,SAAA8P,cAAAC,aAAA,CAAyCF,CAAzC,CAAoD,IAAA7P,SAApD,CACA,KAAAA,SAAA8P,cAAAE,YAAA,CAAwC,IAAAhQ,SAAxC,CACA6P,EAAAjP,YAAA,CAAsB,IAAAZ,SAAtB,CACI4lB,EAAJ,EACIA,CAAA5T,MAAA,EAIJ,KAFI6T,IAAAA,EAAiB,IAAA7lB,SAAA8lB,WAAjBD,CACAE,EAAcF,CAAAliB,OADdkiB,CAEKG,EAAI,CAAb,CAAgBA,CAAhB,CAAoBD,CAApB,CAAiCC,CAAA,EAAjC,CAAsC,CAClC,IAAIC,EAAQJ,CAAA,CAAeG,CAAf,CACRC,EAAAhmB,UAAJ;AAAuBgmB,CAAAhmB,UAAAC,SAAA,CAAyB,IAAAC,YAAAoiB,OAAzB,CAAvB,GACI,IAAA4B,QADJ,CACmB8B,CADnB,CAGIA,EAAAhmB,UAAJ,EAAuBgmB,CAAAhmB,UAAAC,SAAA,CAAyB,IAAAC,YAAAqiB,OAAzB,CAAvB,GACI,IAAAgC,QADJ,CACmByB,CADnB,CAGIA,EAAAhmB,UAAJ,EAAuBgmB,CAAAhmB,UAAAC,SAAA,CAAyB,IAAAC,YAAAsiB,QAAzB,CAAvB,GACI,IAAA3gB,SADJ,CACoBmkB,CADpB,CARkC,CAYtC3hB,MAAAzD,iBAAA,CAAwB,UAAxB,CAAoC,QAAS,CAACC,CAAD,CAAI,CACzCA,CAAAolB,UAAJ,GAGI,IAAAlmB,SAAAqR,MAAA8U,UACA,CADgC,QAChC,CAAAzd,qBAAA,CAAsB,QAAS,EAAG,CAC9B,IAAA1I,SAAAqR,MAAA8U,UAAA,CAAgC,EADF,CAAZ5b,KAAA,CAEf,IAFe,CAAtB,CAJJ,CAD6C,CAAbA,KAAA,CAS7B,IAT6B,CAApC,CASc,CAAA,CATd,CAUI,KAAA4Z,QAAJ,GACI,IAAAniB,QADJ,CACmB,IAAAmiB,QAAA9iB,cAAA,CAA2B,GAA3B,CAAiC,IAAAlB,YAAA8iB,QAAjC,CADnB,CAGImD;CAAAA,CAAO,IAAAlE,MAAAC,SACP,KAAAgC,QAAJ,GACQ,IAAAA,QAAAlkB,UAAAC,SAAA,CAAgC,IAAAC,YAAAyiB,cAAhC,CAAJ,CACIwD,CADJ,CACW,IAAAlE,MAAAE,OADX,CAEW,IAAA+B,QAAAlkB,UAAAC,SAAA,CAAgC,IAAAC,YAAA0iB,iBAAhC,CAAJ,EACHuD,CAEA,CAFO,IAAAlE,MAAAG,UAEP,CADA,IAAA8B,QAAAtjB,iBAAA,CAA8B,eAA9B,CAA+C,IAAAqkB,4BAAA3a,KAAA,CAAsC,IAAtC,CAA/C,CACA,CAAA,IAAA4Z,QAAAtjB,iBAAA,CAA8B,OAA9B,CAAuC,IAAAukB,oBAAA7a,KAAA,CAA8B,IAA9B,CAAvC,CAHG,EAII,IAAA4Z,QAAAlkB,UAAAC,SAAA,CAAgC,IAAAC,YAAA2iB,cAAhC,CAJJ,GAKHsD,CACA,CADO,IAAAlE,MAAAI,OACP,CAAAzS,CAAA5P,UAAAO,IAAA,CAAwB,IAAAL,YAAAujB,qBAAxB,CANG,CAQP;AAAI0C,CAAJ,GAAa,IAAAlE,MAAAC,SAAb,EACI,IAAAgC,QAAAlkB,UAAAO,IAAA,CAA2B,IAAAL,YAAAwjB,eAA3B,CACA,CAAI,IAAA3hB,QAAJ,EACI,IAAAA,QAAA/B,UAAAO,IAAA,CAA2B,IAAAL,YAAAwjB,eAA3B,CAHR,EAKWyC,CAAJ,GAAa,IAAAlE,MAAAE,OAAb,EAAkCgE,CAAlC,GAA2C,IAAAlE,MAAAI,OAA3C,EACH,IAAA6B,QAAAlkB,UAAA2L,OAAA,CAA8B,IAAAzL,YAAAwjB,eAA9B,CACA,CAAI,IAAA3hB,QAAJ,EACI,IAAAA,QAAA/B,UAAA2L,OAAA,CAA8B,IAAAzL,YAAAwjB,eAA9B,CAHD,EAKIyC,CALJ,GAKa,IAAAlE,MAAAG,UALb,GASH,IAAAvgB,SAAAjB,iBAAA,CAA+B,QAA/B,CAAyC,IAAAojB,sBAAA1Z,KAAA,CAAgC,IAAhC,CAAzC,CACA,CAAA,IAAA0Z,sBAAA,EAVG,CAhBX,CA8BI,KAAAO,QAAJ,GACQkB,CAsCJ;AAtCmB,IAAA1lB,SAAAqB,cAAA,CAA4B,GAA5B,CAAkC,IAAAlB,YAAAuiB,WAAlC,CAsCnB,CArCKgD,CAqCL,GApCIA,CAQA,CAReplB,QAAAC,cAAA,CAAuB,KAAvB,CAQf,CAPAmlB,CAAAhgB,aAAA,CAA0B,eAA1B,CAA2C,OAA3C,CAOA,CANAggB,CAAAhgB,aAAA,CAA0B,MAA1B,CAAkC,QAAlC,CAMA,CALAggB,CAAAhgB,aAAA,CAA0B,UAA1B,CAAsC,GAAtC,CAKA,CAJAggB,CAAAzlB,UAAAO,IAAA,CAA2B,IAAAL,YAAAuiB,WAA3B,CAIA,CAHI2D,CAGJ,CAHuB/lB,QAAAC,cAAA,CAAuB,GAAvB,CAGvB,CAFA8lB,CAAApmB,UAAAO,IAAA,CAA+B,IAAAL,YAAAwiB,KAA/B,CAEA,CADA0D,CAAAC,UACA,CAD6B,IAAA7c,UAAAsY,UAC7B,CAAA2D,CAAA9kB,YAAA,CAAyBylB,CAAzB,CA4BJ,EA1BI,IAAA7B,QAAAvkB,UAAAC,SAAA,CAAgC,IAAAC,YAAA4jB,gBAAhC,CAAJ,CAEI2B,CAAAzlB,UAAAO,IAAA,CAA2B,IAAAL,YAAA4jB,gBAA3B,CAFJ,CAGW,IAAAS,QAAAvkB,UAAAC,SAAA,CAAgC,IAAAC,YAAA6jB,gBAAhC,CAHX;AAKI0B,CAAAzlB,UAAAO,IAAA,CAA2B,IAAAL,YAAA6jB,gBAA3B,CAqBJ,CAnBA0B,CAAA7kB,iBAAA,CAA8B,OAA9B,CAAuC,IAAAkkB,qBAAAxa,KAAA,CAA+B,IAA/B,CAAvC,CAmBA,CAlBAmb,CAAA7kB,iBAAA,CAA8B,SAA9B,CAAyC,IAAAkkB,qBAAAxa,KAAA,CAA+B,IAA/B,CAAzC,CAkBA,CAdA,IAAAvK,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAqjB,WAA5B,CAcA,CAXI,IAAAxjB,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA4iB,aAAjC,CAAJ,CACI,IAAAoB,QAAApU,aAAA,CAA0B2V,CAA1B,CAAwC,IAAAvB,QAAAoC,WAAxC,CADJ,CAGI,IAAAvmB,SAAA+P,aAAA,CAA2B2V,CAA3B,CAAyC,IAAA5jB,SAAzC,CAQJ,CANI0kB,CAMJ,CANiBlmB,QAAAC,cAAA,CAAuB,KAAvB,CAMjB,CALAimB,CAAAvmB,UAAAO,IAAA,CAAyB,IAAAL,YAAA6iB,WAAzB,CAKA,CAJA,IAAAhjB,SAAAY,YAAA,CAA0B4lB,CAA1B,CAIA;AAHAA,CAAA3lB,iBAAA,CAA4B,OAA5B,CAAqC,IAAAkkB,qBAAAxa,KAAA,CAA+B,IAA/B,CAArC,CAGA,CAFA,IAAAua,YAEA,CAFmB0B,CAEnB,CADA,IAAAhC,QAAA3jB,iBAAA,CAA8B,SAA9B,CAAyC,IAAAyjB,sBAAA/Z,KAAA,CAAgC,IAAhC,CAAzC,CACA,CAAA,IAAAia,QAAA9e,aAAA,CAA0B,aAA1B,CAAyC,MAAzC,CAvCJ,CA2CA,KAAAkf,sBAAA,CAA6BtgB,MAAAmiB,WAAA,CAAkB,IAAAhd,UAAAmY,UAAlB,CAC7B,KAAAgD,sBAAA8B,YAAA,CAAuC,IAAAhC,mBAAAna,KAAA,CAA6B,IAA7B,CAAvC,CACA,KAAAma,mBAAA,EAEA,IAAI,IAAAP,QAAJ,EAAoB,IAAAniB,QAApB,CAAkC,CAC9B,IAAAhC,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAsjB,SAA5B,CACIkD,EAAAA,CAAermB,QAAAC,cAAA,CAAuB,KAAvB,CACnBomB;CAAA1mB,UAAAO,IAAA,CAA2B,IAAAL,YAAA+iB,cAA3B,CACA,KAAAiB,QAAApU,aAAA,CAA0B4W,CAA1B,CAAwC,IAAA3kB,QAAxC,CACA,KAAAmiB,QAAAnU,YAAA,CAAyB,IAAAhO,QAAzB,CACA,KAAI4kB,EAAatmB,QAAAC,cAAA,CAAuB,KAAvB,CACjBqmB,EAAA3mB,UAAAO,IAAA,CAAyB,IAAAL,YAAAijB,eAAzB,CACAwD,EAAA3mB,UAAAO,IAAA,CAAyB,IAAAL,YAAAkjB,oBAAzB,CACIwD,EAAAA,CAAiBvmB,QAAAC,cAAA,CAAuB,GAAvB,CACrBsmB,EAAA5mB,UAAAO,IAAA,CAA6B,IAAAL,YAAAwiB,KAA7B,CACAkE,EAAA7M,YAAA,CAA6B,IAAAvQ,UAAAuY,aAC7B4E,EAAAhmB,YAAA,CAAuBimB,CAAvB,CACAD,EAAA/lB,iBAAA,CAA4B,OAA5B,CAAqC,QAAS,EAAG,CAC7C,IAAAmB,QAAA8kB,WAAA,EAA2B,IAAArd,UAAAoY,kBADkB,CAAZtX,KAAA,CAE9B,IAF8B,CAArC,CAGA;IAAIwc,EAAczmB,QAAAC,cAAA,CAAuB,KAAvB,CAClBwmB,EAAA9mB,UAAAO,IAAA,CAA0B,IAAAL,YAAAijB,eAA1B,CACA2D,EAAA9mB,UAAAO,IAAA,CAA0B,IAAAL,YAAAmjB,qBAA1B,CACI0D,EAAAA,CAAkB1mB,QAAAC,cAAA,CAAuB,GAAvB,CACtBymB,EAAA/mB,UAAAO,IAAA,CAA8B,IAAAL,YAAAwiB,KAA9B,CACAqE,EAAAhN,YAAA,CAA8B,IAAAvQ,UAAAwY,cAC9B8E,EAAAnmB,YAAA,CAAwBomB,CAAxB,CACAD,EAAAlmB,iBAAA,CAA6B,OAA7B,CAAsC,QAAS,EAAG,CAC9C,IAAAmB,QAAA8kB,WAAA,EAA2B,IAAArd,UAAAoY,kBADmB,CAAZtX,KAAA,CAE/B,IAF+B,CAAtC,CAGAoc,EAAA/lB,YAAA,CAAyBgmB,CAAzB,CACAD,EAAA/lB,YAAA,CAAyB,IAAAoB,QAAzB,CACA2kB,EAAA/lB,YAAA,CAAyBmmB,CAAzB,CAGA,KAAIE,EAAmB,QAAS,EAAG,CACD,CAA9B,CAAI,IAAAjlB,QAAA8kB,WAAJ,CACIF,CAAA3mB,UAAAO,IAAA,CAAyB,IAAAL,YAAA4B,UAAzB,CADJ;AAGI6kB,CAAA3mB,UAAA2L,OAAA,CAA4B,IAAAzL,YAAA4B,UAA5B,CAEA,KAAAC,QAAA8kB,WAAJ,CAA8B,IAAA9kB,QAAAklB,YAA9B,CAAyD,IAAAllB,QAAAof,YAAzD,CACI2F,CAAA9mB,UAAAO,IAAA,CAA0B,IAAAL,YAAA4B,UAA1B,CADJ,CAGIglB,CAAA9mB,UAAA2L,OAAA,CAA6B,IAAAzL,YAAA4B,UAA7B,CAT2B,CAAZwI,KAAA,CAWhB,IAXgB,CAYvB,KAAAvI,QAAAnB,iBAAA,CAA8B,QAA9B,CAAwComB,CAAxC,CACAA,EAAA,EAEIE,EAAAA,CAAsB,QAAS,EAAG,CAE9B,IAAAC,iBAAJ,EACI9d,YAAA,CAAa,IAAA8d,iBAAb,CAEJ,KAAAA,iBAAA,CAAwB/d,UAAA,CAAW,QAAS,EAAG,CAC3C4d,CAAA,EACA,KAAAG,iBAAA,CAAwB,IAFmB,CAAZ7c,KAAA,CAG5B,IAH4B,CAAX,CAGV,IAAAd,UAAAqY,eAHU,CALU,CAAZvX,KAAA,CASnB,IATmB,CAU1BjG,OAAAzD,iBAAA,CAAwB,QAAxB;AAAkCsmB,CAAlC,CACI,KAAAnlB,QAAA/B,UAAAC,SAAA,CAAgC,IAAAC,YAAA8B,iBAAhC,CAAJ,EACI,IAAAD,QAAA/B,UAAAO,IAAA,CAA2B,IAAAL,YAAA4K,qBAA3B,CAGArJ,EAAAA,CAAO,IAAAM,QAAA8C,iBAAA,CAA8B,GAA9B,CAAoC,IAAA3E,YAAAgjB,IAApC,CACPxhB,EAAAA,CAAS,IAAAG,SAAAgD,iBAAA,CAA+B,GAA/B,CAAqC,IAAA3E,YAAAojB,MAArC,CAEb,KAAS9f,CAAT,CAAa,CAAb,CAAgBA,CAAhB,CAAoB/B,CAAAiC,OAApB,CAAiCF,CAAA,EAAjC,CACI,IAAIhC,CAAJ,CAAsBC,CAAA,CAAK+B,CAAL,CAAtB,CAA+B/B,CAA/B,CAAqCC,CAArC,CAA6C,IAA7C,CAjE0B,CAoElC,IAAA3B,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAiL,YAA5B,CAvLe,CADqB,CAmO5C9G,OAAA,kBAAA,CAA8B7C,CAG9Ba,EAAAY,SAAA,CAA0B,CACtBqE,YAAaoa,CADS,CAEtB1a,cAAe,gBAFO,CAGtBrC,SAAU,eAHY,CAA1B,CA6BIyiB,EAAAA,CAAoBA,QAA0B,CAAC1kB,CAAD,CAAU,CACxD,IAAA3C,SAAA,CAAgB2C,CAEhB;IAAA6G,KAAA,EAHwD,CAK5DlF,OAAA,kBAAA,CAA8B+iB,CAO9BA,EAAA9gB,UAAAkD,UAAA,CAAwC,EASxC4d,EAAA9gB,UAAApG,YAAA,CAA0C,CACtCmnB,WAAY,gBAD0B,CAEtCC,WAAY,4BAF0B,CAGtCC,eAAgB,wBAHsB,CAItCC,YAAa,aAJyB,CAKtCrc,YAAa,aALyB,CAgB1Cic,EAAA9gB,UAAAmhB,WAAA,CAAyCC,QAAS,CAACC,CAAD,CAAWC,CAAX,CAAgBC,CAAhB,CAA0B,CACxE,GAAID,CAAJ,CACI,MAAO,SAAS,EAAG,CACXD,CAAAtb,QAAJ,CACIub,CAAA5nB,UAAAO,IAAA,CAAkB,IAAAL,YAAAsnB,YAAlB,CADJ,CAGII,CAAA5nB,UAAA2L,OAAA,CAAqB,IAAAzL,YAAAsnB,YAArB,CAJW,CAAZld,KAAA,CAMA,IANA,CAQX,IAAIud,CAAJ,CACI,MAAO,SAAS,EAAG,CACf,IAAIrkB,CAAJ,CACI+Q,CACJ,IAAIoT,CAAAtb,QAAJ,CACI,IAAK7I,CAAL,CAAS,CAAT,CAAYA,CAAZ,CAAgBqkB,CAAAnkB,OAAhB,CAAiCF,CAAA,EAAjC,CACI+Q,CAEA,CAFKsT,CAAA,CAASrkB,CAAT,CAAApC,cAAA,CAA0B,IAA1B,CAAAA,cAAA,CAA8C,eAA9C,CAEL;AADAmT,CAAA,iBAAA9H,MAAA,EACA,CAAAob,CAAA,CAASrkB,CAAT,CAAAxD,UAAAO,IAAA,CAA0B,IAAAL,YAAAsnB,YAA1B,CAJR,KAOI,KAAKhkB,CAAL,CAAS,CAAT,CAAYA,CAAZ,CAAgBqkB,CAAAnkB,OAAhB,CAAiCF,CAAA,EAAjC,CACI+Q,CAEA,CAFKsT,CAAA,CAASrkB,CAAT,CAAApC,cAAA,CAA0B,IAA1B,CAAAA,cAAA,CAA8C,eAA9C,CAEL,CADAmT,CAAA,iBAAA5H,QAAA,EACA,CAAAkb,CAAA,CAASrkB,CAAT,CAAAxD,UAAA2L,OAAA,CAA6B,IAAAzL,YAAAsnB,YAA7B,CAbO,CAAZld,KAAA,CAgBA,IAhBA,CAX6D,CAsC5E8c,EAAA9gB,UAAAwhB,gBAAA,CAA8CC,QAAS,CAACH,CAAD,CAAMC,CAAN,CAAgB,CACnE,IAAIG,EAAQ3nB,QAAAC,cAAA,CAAuB,OAAvB,CAOZ0nB,EAAArkB,UAAA,CANmBskB,CAGf,mDAHeA,CAIf,IAAA/nB,YAAAqnB,eAJeU,CAMDviB,KAAA,CAAkB,GAAlB,CAClB,KAAIiiB,EAAWtnB,QAAAC,cAAA,CAAuB,OAAvB,CACfqnB,EAAA3C,KAAA,CAAgB,UAChB2C,EAAA3nB,UAAAO,IAAA,CAAuB,qBAAvB,CACIqnB;CAAJ,EACID,CAAAtb,QACA,CADmBub,CAAA5nB,UAAAC,SAAA,CAAuB,IAAAC,YAAAsnB,YAAvB,CACnB,CAAAG,CAAA/mB,iBAAA,CAA0B,QAA1B,CAAoC,IAAA6mB,WAAA,CAAgBE,CAAhB,CAA0BC,CAA1B,CAApC,CAFJ,EAGWC,CAHX,EAIIF,CAAA/mB,iBAAA,CAA0B,QAA1B,CAAoC,IAAA6mB,WAAA,CAAgBE,CAAhB,CAA0B,IAA1B,CAAgCE,CAAhC,CAApC,CAEJG,EAAArnB,YAAA,CAAkBgnB,CAAlB,CACAtlB,EAAAI,eAAA,CAAgCulB,CAAhC,CAAuC,kBAAvC,CACA,OAAOA,EApB4D,CAyBvEZ,EAAA9gB,UAAAiD,KAAA,CAAmC2e,QAAS,EAAG,CAC3C,GAAI,IAAAnoB,SAAJ,CAAmB,CACf,IAAIooB,EAAc,IAAApoB,SAAAqB,cAAA,CAA4B,IAA5B,CAAlB,CACIgnB,EAAWhiB,KAAAE,UAAAC,MAAAC,KAAA,CAA2B,IAAAzG,SAAA8E,iBAAA,CAA+B,UAA/B,CAA3B,CADf,CAEIwjB,EAAWjiB,KAAAE,UAAAC,MAAAC,KAAA,CAA2B,IAAAzG,SAAA8E,iBAAA,CAA+B,UAA/B,CAA3B,CAFf,CAGIyjB,EAAOF,CAAAG,OAAA,CAAgBF,CAAhB,CACX,IAAI,IAAAtoB,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAonB,WAAjC,CAAJ,CAAmE,CAC3DkB,IAAAA;AAAKnoB,QAAAC,cAAA,CAAuB,IAAvB,CAALkoB,CACAC,EAAiB,IAAAX,gBAAA,CAAqB,IAArB,CAA2BQ,CAA3B,CACrBE,EAAA7nB,YAAA,CAAe8nB,CAAf,CACAN,EAAAtY,cAAAC,aAAA,CAAuC0Y,CAAvC,CAA2CL,CAA3C,CACA,KAAS3kB,CAAT,CAAa,CAAb,CAAgBA,CAAhB,CAAoB8kB,CAAA5kB,OAApB,CAAiCF,CAAA,EAAjC,CAEI,GADIklB,CACJ,CADgBJ,CAAA,CAAK9kB,CAAL,CAAApC,cAAA,CAAsB,IAAtB,CAChB,CAAe,CACPunB,CAAAA,CAAKtoB,QAAAC,cAAA,CAAuB,IAAvB,CACT,IAAkD,OAAlD,GAAIgoB,CAAA,CAAK9kB,CAAL,CAAA+P,WAAAqV,SAAAC,YAAA,EAAJ,CAA2D,CACvD,IAAIC,EAAc,IAAAhB,gBAAA,CAAqBQ,CAAA,CAAK9kB,CAAL,CAArB,CAClBmlB,EAAAhoB,YAAA,CAAemoB,CAAf,CAFuD,CAI3DR,CAAA,CAAK9kB,CAAL,CAAAsM,aAAA,CAAqB6Y,CAArB,CAAyBD,CAAzB,CANW,CASnB,IAAA3oB,SAAAC,UAAAO,IAAA,CAA4B,IAAAL,YAAAiL,YAA5B,CAhB+D,CALpD,CADwB,CA4B/C9I,EAAAY,SAAA,CAA0B,CACtBqE,YAAa8f,CADS,CAEtBpgB,cAAe,mBAFO,CAGtBrC,SAAU,mBAHY,CAA1B,CA6BIokB,EAAAA,CAAiBA,QAAuB,CAACrmB,CAAD,CAAU,CAClD,IAAA3C,SAAA;AAAgB2C,CAEhB,KAAA6G,KAAA,EAHkD,CAKtDlF,OAAA,eAAA,CAA2B0kB,CAO3BA,EAAAziB,UAAAkD,UAAA,CAAqC,CACjCwf,cAAe,uBADkB,CAEjCC,aAAc,KAFmB,CAGjCC,gBAAiB,KAHgB,CAIjCC,cAAe,GAJkB,CAKjCC,YAAa,EALoB,CAerCL,EAAAziB,UAAApG,YAAA,CAAuC,CACnC6K,cAAe,oBADoB,CAEnCse,4BAA6B,qCAFM,CAGnCnnB,OAAQ,YAH2B,CAInCmN,aAAc,cAJqB,CAKnCD,WAAY,YALuB,CAavC2Z,EAAAziB,UAAAgjB,aAAA,CAAwCC,QAAS,CAAC3f,CAAD,CAAQ,CACrD,GAAKiJ,CAAA,IAAAzI,eAAAgH,MAAAyB,MAAL,EAAyCD,CAAA,IAAAxI,eAAAgH,MAAAwB,OAAzC,CAA2E,CACvE,IAAI3B,EAAO,IAAAlR,SAAAmR,sBAAA,EACX;IAAAsY,YAAA,CAAmBvY,CAAA2B,OACnB,KAAA6W,WAAA,CAAkBxY,CAAA4B,MAClB,KAAA6W,YAAA,CAAoF,CAApF,CAAmBxgB,IAAAygB,KAAA,CAAU1Y,CAAA4B,MAAV,CAAuB5B,CAAA4B,MAAvB,CAAoC5B,CAAA2B,OAApC,CAAkD3B,CAAA2B,OAAlD,CAAnB,CAAwF,CACxF,KAAAxI,eAAAgH,MAAAyB,MAAA,CAAkC,IAAA6W,YAAlC,CAAqD,IACrD,KAAAtf,eAAAgH,MAAAwB,OAAA,CAAmC,IAAA8W,YAAnC,CAAsD,IANiB,CAQ3E,IAAAtf,eAAApK,UAAAO,IAAA,CAAkC,IAAAL,YAAAkP,WAAlC,CACA,IAAmB,WAAnB,GAAIxF,CAAAob,KAAJ,EAAkC,IAAA4E,mBAAlC,CACI,IAAAA,mBAAA,CAA0B,CAAA,CAD9B,KAOI,IAJmB,YAIf,GAJAhgB,CAAAob,KAIA,GAHA,IAAA4E,mBAGA,CAH0B,CAAA,CAG1B,EAAA,EAAa,CAAb,CADa,IAAAC,cAAAC,EACb,CAAJ,CAAA,CAGA,IAAAC,cAAA,CAAmB,CAAnB,CACIC,EAAAA,CAAQpgB,CAAAqgB,cAAA/Y,sBAAA,EAIZ;GAAsB,CAAtB,GAAItH,CAAA2N,QAAJ,EAA6C,CAA7C,GAA2B3N,CAAA4N,QAA3B,CACI0S,CACA,CADIhhB,IAAAihB,MAAA,CAAWH,CAAAnX,MAAX,CAAyB,CAAzB,CACJ,CAAA4E,CAAA,CAAIvO,IAAAihB,MAAA,CAAWH,CAAApX,OAAX,CAA0B,CAA1B,CAFR,KAGO,CAEH,IAAI4E,EAA4B+B,IAAAA,EAAlB,GAAA3P,CAAA4N,QAAA,CAA8B5N,CAAA4N,QAA9B,CAA8C5N,CAAAwgB,QAAA,CAAc,CAAd,CAAA5S,QAC5D0S,EAAA,CAAIhhB,IAAAihB,MAAA,EAF4B5Q,IAAAA,EAAlBhC,GAAA3N,CAAA2N,QAAAA,CAA8B3N,CAAA2N,QAA9BA,CAA8C3N,CAAAwgB,QAAA,CAAc,CAAd,CAAA7S,QAExD,EAAqByS,CAAAvY,KAArB,CACJgG,EAAA,CAAIvO,IAAAihB,MAAA,CAAW3S,CAAX,CAAqBwS,CAAA1Y,IAArB,CAJD,CAMP,IAAA+Y,YAAA,CAAiBH,CAAjB,CAAoBzS,CAApB,CACA,KAAA6S,gBAAA,CAAqB,CAAA,CAArB,CACAjmB,OAAAoE,sBAAA,CAA6B,IAAA8hB,iBAAAjgB,KAAA,CAA2B,IAA3B,CAA7B,CAnBA,CAjBiD,CA6CzDye,EAAAziB,UAAAkkB,WAAA,CAAsCC,QAAS,CAAC7gB,CAAD,CAAQ,CAE/CA,CAAJ,EAA8B,CAA9B,GAAaA,CAAA8gB,OAAb,EAIIrmB,MAAA+E,WAAA,CAAkB,QAAS,EAAG,CAC1B,IAAAgB,eAAApK,UAAA2L,OAAA,CAAqC,IAAAzL,YAAAkP,WAArC,CAD0B,CAAZ9E,KAAA,CAEX,IAFW,CAAlB;AAEc,CAFd,CAN+C,CAcvDye,EAAAziB,UAAAiD,KAAA,CAAgCohB,QAAS,EAAG,CACxC,GAAI,IAAA5qB,SAAJ,CAAmB,CACf,IAAI6qB,EAAc,IAAA7qB,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAA6K,cAAjC,CACb,KAAAhL,SAAAC,UAAAC,SAAA,CAAiC,IAAAC,YAAAmpB,4BAAjC,CAAL,GACI,IAAAjf,eAiFA,CAjFsB,IAAArK,SAAAqB,cAAA,CAA4B,GAA5B,CAAkC,IAAAlB,YAAAgC,OAAlC,CAiFtB,CA7EA,IAAA2oB,GA6EA,CA9EA,IAAAC,GA8EA,CA/EA,IAAApB,YA+EA,CAhFA,IAAAqB,YAgFA,CAhFmB,CAgFnB,CAzEA,IAAAnB,mBAyEA,CAzE0B,CAAA,CAyE1B,CAxEA,IAAAoB,iBAwEA,CAxEwB,IAAA1B,aAAAhf,KAAA,CAAuB,IAAvB,CAwExB,CAvEA,IAAAvK,SAAAa,iBAAA,CAA+B,WAA/B,CAA4C,IAAAoqB,iBAA5C,CAuEA,CAtEA,IAAAjrB,SAAAa,iBAAA,CAA+B,YAA/B;AAA6C,IAAAoqB,iBAA7C,CAsEA,CArEA,IAAAC,eAqEA,CArEsB,IAAAT,WAAAlgB,KAAA,CAAqB,IAArB,CAqEtB,CApEA,IAAAvK,SAAAa,iBAAA,CAA+B,SAA/B,CAA0C,IAAAqqB,eAA1C,CAoEA,CAnEA,IAAAlrB,SAAAa,iBAAA,CAA+B,YAA/B,CAA6C,IAAAqqB,eAA7C,CAmEA,CAlEA,IAAAlrB,SAAAa,iBAAA,CAA+B,UAA/B,CAA2C,IAAAqqB,eAA3C,CAkEA,CAjEA,IAAAlrB,SAAAa,iBAAA,CAA+B,MAA/B,CAAuC,IAAAqqB,eAAvC,CAiEA,CA5DA,IAAApB,cA4DA,CA5DqBqB,QAAS,EAAG,CAC7B,MAAO,KAAAH,YADsB,CA4DjC,CArDA,IAAAhB,cAqDA,CArDqBoB,QAAS,CAACC,CAAD,CAAK,CAC/B,IAAAL,YAAA,CAAmBK,CADY,CAqDnC,CA9CA,IAAAC,iBA8CA,CA9CwBC,QAAS,EAAG,CAChC,MAAO,KAAAlhB,eADyB,CA8CpC,CAtCA,IAAAigB,YAsCA;AAtCmBkB,QAAS,CAACC,CAAD,CAAOC,CAAP,CAAa,CACrC,IAAAX,GAAA,CAAUU,CACV,KAAAX,GAAA,CAAUY,CAF2B,CAsCzC,CA9BA,IAAAnB,gBA8BA,CA9BuBoB,QAAS,CAAC5P,CAAD,CAAQ,CACpC,GAA4B,IAA5B,GAAI,IAAA1R,eAAJ,CAAkC,CAC9B,IAAIuhB,CAAJ,CAGIC,EAAS,YAATA,CAAwB,IAAAd,GAAxBc,CAAkC,MAAlCA,CAA2C,IAAAf,GAA3Ce,CAAqD,KACrD9P,EAAJ,CACI+P,CADJ,CACY,IAAAriB,UAAAwf,cADZ,EAII6C,CAEA,CAFQ,IAAAriB,UAAA4f,YAER,CAAIwB,CAAJ,GACIgB,CADJ,CACa,YADb,CAC4B,IAAAnC,WAD5B,CAC8C,CAD9C,CACkD,MADlD,CAC2D,IAAAD,YAD3D,CAC8E,CAD9E,CACkF,KADlF,CANJ,CAUAmC,EAAA,CAAkB,wBAAlB,CAA6CC,CAA7C,CAAsDC,CACtD,KAAAzhB,eAAAgH,MAAA0a,gBAAA,CAA4CH,CAC5C,KAAAvhB,eAAAgH,MAAA2a,YAAA,CAAwCJ,CACxC,KAAAvhB,eAAAgH,MAAA4a,UAAA,CAAsCL,CAClC7P,EAAJ,CACI,IAAA1R,eAAApK,UAAA2L,OAAA,CAAqC,IAAAzL,YAAAmP,aAArC,CADJ;AAGI,IAAAjF,eAAApK,UAAAO,IAAA,CAAkC,IAAAL,YAAAmP,aAAlC,CAtB0B,CADE,CA8BxC,CAAA,IAAAkb,iBAAA,CAAwB0B,QAAS,EAAG,CACP,CAAzB,CAAI,IAAAlB,YAAA,EAAJ,CACI1mB,MAAAoE,sBAAA,CAA6B,IAAA8hB,iBAAAjgB,KAAA,CAA2B,IAA3B,CAA7B,CADJ,CAGI,IAAAggB,gBAAA,CAAqB,CAAA,CAArB,CAJ4B,CAlFxC,CAFe,CADqB,CAiG5CjoB,EAAAY,SAAA,CAA0B,CACtBqE,YAAayhB,CADS,CAEtB/hB,cAAe,gBAFO,CAGtBrC,SAAU,sBAHY,CAItBsB,OAAQ,CAAA,CAJc,CAA1B,CAr5Ha,CAAX,CAAA;",
+"sources":["material.js"],
+"names":["MaterialTab","tab","ctx","element_","classList","contains","CssClasses_","MDL_JS_RIPPLE_EFFECT","rippleContainer","document","createElement","add","MDL_RIPPLE_CONTAINER","ripple","MDL_RIPPLE","appendChild","addEventListener","e","getAttribute","charAt","preventDefault","href","split","panel","querySelector","resetTabState_","resetPanelState_","ACTIVE_CLASS","MaterialLayoutTab","tabs","panels","layout","selectTab","content_","IS_ACTIVE","tabBar_","JS_RIPPLE_EFFECT","RIPPLE_CONTAINER","RIPPLE","TAB_MANUAL_SWITCH","show","componentHandler","upgradeDom","optJsClass","optCssClass","upgradeElement","element","upgradeElements","elements","upgradeAllRegistered","registerUpgradedCallback","jsClass","callback","register","config","downgradeElements","nodes","findRegisteredClass_","name","optReplace","i","registeredComponents_","length","className","getUpgradedListOfElement_","dataUpgraded","isElementUpgraded_","upgradedList","indexOf","createEvent_","eventType","bubbles","cancelable","window","CustomEvent","ev","createEvent","initEvent","upgradeDomInternal","cssClass","registeredClass","querySelectorAll","n","upgradeElementInternal","Element","Error","upgradingEv","dispatchEvent","defaultPrevented","classesToUpgrade","push","forEach","component","setAttribute","join","instance","classConstructor","createdComponents_","j","m","callbacks","widget","upgradedEv","upgradeElementsInternal","Array","isArray","prototype","slice","call","HTMLElement","children","deconstructComponentInternal","componentIndex","splice","upgrades","componentPlace","classAsString","upgradeAllRegisteredInternal","registerUpgradedCallbackInternal","regClass","registerInternal","newConfig","constructor","item","hasOwnProperty","componentConfigProperty_","found","downgradeNodesInternal","downgradeNode","node","filter","NodeList","Node","documentElement","componentHandler.upgradeElement","componentHandler.register","Date","now","Date.now","getTime","vendors","requestAnimationFrame","vp","cancelAnimationFrame","test","navigator","userAgent","lastTime","window.requestAnimationFrame","nextTime","Math","max","setTimeout","clearTimeout","MaterialButton","init","Constant_","RIPPLE_EFFECT","blurHandler_","MaterialButton.prototype.blurHandler_","event","blur","disable","MaterialButton.prototype.disable","disabled","enable","MaterialButton.prototype.enable","MaterialButton.prototype.init","rippleElement_","boundRippleBlurHandler","bind","boundButtonBlurHandler","MaterialCheckbox","TINY_TIMEOUT","INPUT","BOX_OUTLINE","FOCUS_HELPER","TICK_OUTLINE","RIPPLE_IGNORE_EVENTS","RIPPLE_CENTER","IS_FOCUSED","IS_DISABLED","IS_CHECKED","IS_UPGRADED","onChange_","MaterialCheckbox.prototype.onChange_","updateClasses_","onFocus_","MaterialCheckbox.prototype.onFocus_","onBlur_","MaterialCheckbox.prototype.onBlur_","remove","onMouseUp_","MaterialCheckbox.prototype.onMouseUp_","blur_","MaterialCheckbox.prototype.updateClasses_","checkDisabled","checkToggleState","MaterialCheckbox.prototype.blur_","inputElement_","MaterialCheckbox.prototype.checkToggleState","checked","MaterialCheckbox.prototype.checkDisabled","MaterialCheckbox.prototype.disable","MaterialCheckbox.prototype.enable","check","MaterialCheckbox.prototype.check","uncheck","MaterialCheckbox.prototype.uncheck","MaterialCheckbox.prototype.init","boxOutline","tickContainer","tickOutline","rippleContainerElement_","boundRippleMouseUp","boundInputOnChange","boundInputOnFocus","boundInputOnBlur","boundElementMouseUp","MaterialIconToggle","MaterialIconToggle.prototype.onChange_","MaterialIconToggle.prototype.onFocus_","MaterialIconToggle.prototype.onBlur_","MaterialIconToggle.prototype.onMouseUp_","MaterialIconToggle.prototype.updateClasses_","MaterialIconToggle.prototype.blur_","MaterialIconToggle.prototype.checkToggleState","MaterialIconToggle.prototype.checkDisabled","MaterialIconToggle.prototype.disable","MaterialIconToggle.prototype.enable","MaterialIconToggle.prototype.check","MaterialIconToggle.prototype.uncheck","MaterialIconToggle.prototype.init","boundElementOnMouseUp","MaterialMenu","TRANSITION_DURATION_SECONDS","TRANSITION_DURATION_FRACTION","CLOSE_TIMEOUT","Keycodes_","ENTER","ESCAPE","SPACE","UP_ARROW","DOWN_ARROW","CONTAINER","OUTLINE","ITEM","ITEM_RIPPLE_CONTAINER","IS_VISIBLE","IS_ANIMATING","BOTTOM_LEFT","BOTTOM_RIGHT","TOP_LEFT","TOP_RIGHT","UNALIGNED","MaterialMenu.prototype.init","container","parentElement","insertBefore","removeChild","container_","outline","outline_","forElId","forEl","getElementById","forElement_","handleForClick_","handleForKeyboardEvent_","items","boundItemKeydown_","handleItemKeyboardEvent_","boundItemClick_","handleItemClick_","tabIndex","MaterialMenu.prototype.handleForClick_","evt","rect","getBoundingClientRect","forRect","style","right","top","offsetTop","offsetHeight","left","offsetLeft","bottom","toggle","MaterialMenu.prototype.handleForKeyboardEvent_","keyCode","focus","MaterialMenu.prototype.handleItemKeyboardEvent_","currentIndex","target","MouseEvent","click","hide","MaterialMenu.prototype.handleItemClick_","hasAttribute","stopPropagation","closing_","applyClip_","MaterialMenu.prototype.applyClip_","height","width","clip","removeAnimationEndListener_","MaterialMenu.prototype.removeAnimationEndListener_","addAnimationEndListener_","MaterialMenu.prototype.addAnimationEndListener_","MaterialMenu.prototype.show","transitionDuration","itemDelay","transitionDelay","parentNode","removeEventListener","MaterialMenu.prototype.hide","removeProperty","MaterialMenu.prototype.toggle","MaterialProgress","INDETERMINATE_CLASS","setProgress","MaterialProgress.prototype.setProgress","p","progressbar_","setBuffer","MaterialProgress.prototype.setBuffer","bufferbar_","auxbar_","MaterialProgress.prototype.init","el","MaterialRadio","JS_RADIO","RADIO_BTN","RADIO_OUTER_CIRCLE","RADIO_INNER_CIRCLE","MaterialRadio.prototype.onChange_","radios","getElementsByClassName","button","btnElement_","MaterialRadio.prototype.onFocus_","MaterialRadio.prototype.onBlur_","onMouseup_","MaterialRadio.prototype.onMouseup_","MaterialRadio.prototype.updateClasses_","MaterialRadio.prototype.blur_","MaterialRadio.prototype.checkDisabled","MaterialRadio.prototype.checkToggleState","MaterialRadio.prototype.disable","MaterialRadio.prototype.enable","MaterialRadio.prototype.check","MaterialRadio.prototype.uncheck","MaterialRadio.prototype.init","boundChangeHandler_","boundFocusHandler_","boundBlurHandler_","boundMouseUpHandler_","outerCircle","innerCircle","MaterialSlider","isIE_","msPointerEnabled","IE_CONTAINER","SLIDER_CONTAINER","BACKGROUND_FLEX","BACKGROUND_LOWER","BACKGROUND_UPPER","IS_LOWEST_VALUE","onInput_","MaterialSlider.prototype.onInput_","updateValueStyles_","MaterialSlider.prototype.onChange_","MaterialSlider.prototype.onMouseUp_","onContainerMouseDown_","MaterialSlider.prototype.onContainerMouseDown_","newEvent","buttons","clientX","clientY","y","MaterialSlider.prototype.updateValueStyles_","fraction","value","min","backgroundLower_","flex","webkitFlex","backgroundUpper_","MaterialSlider.prototype.disable","MaterialSlider.prototype.enable","change","MaterialSlider.prototype.change","MaterialSlider.prototype.init","containerIE","backgroundFlex","boundInputHandler","boundChangeHandler","boundMouseUpHandler","boundContainerMouseDownHandler","MaterialSnackbar","textElement_","cssClasses_","MESSAGE","actionElement_","ACTION","active","actionText_","message_","actionHandler_","undefined","queuedNotifications_","setActionHidden_","ANIMATION_LENGTH","SNACKBAR","ACTIVE","displaySnackbar_","MaterialSnackbar.prototype.displaySnackbar_","textContent","cleanup_","timeout_","showSnackbar","MaterialSnackbar.prototype.showSnackbar","data","checkQueue_","MaterialSnackbar.prototype.checkQueue_","shift","MaterialSnackbar.prototype.cleanup_","MaterialSnackbar.prototype.setActionHidden_","removeAttribute","MaterialSpinner","MDL_SPINNER_LAYER_COUNT","MDL_SPINNER_LAYER","MDL_SPINNER_CIRCLE_CLIPPER","MDL_SPINNER_CIRCLE","MDL_SPINNER_GAP_PATCH","MDL_SPINNER_LEFT","MDL_SPINNER_RIGHT","createLayer","MaterialSpinner.prototype.createLayer","index","layer","leftClipper","gapPatch","rightClipper","circleOwners","circle","stop","MaterialSpinner.prototype.stop","start","MaterialSpinner.prototype.start","MaterialSpinner.prototype.init","MaterialSwitch","TRACK","THUMB","MaterialSwitch.prototype.onChange_","MaterialSwitch.prototype.onFocus_","MaterialSwitch.prototype.onBlur_","MaterialSwitch.prototype.onMouseUp_","MaterialSwitch.prototype.updateClasses_","MaterialSwitch.prototype.blur_","MaterialSwitch.prototype.checkDisabled","MaterialSwitch.prototype.checkToggleState","MaterialSwitch.prototype.disable","MaterialSwitch.prototype.enable","on","MaterialSwitch.prototype.on","off","MaterialSwitch.prototype.off","MaterialSwitch.prototype.init","track","thumb","focusHelper","boundFocusHandler","boundBlurHandler","MaterialTabs","TAB_CLASS","PANEL_CLASS","UPGRADED_CLASS","MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS","initTabs_","MaterialTabs.prototype.initTabs_","tabs_","panels_","MaterialTabs.prototype.resetTabState_","k","MaterialTabs.prototype.resetPanelState_","MaterialTabs.prototype.init","MaterialTextfield","maxRows","NO_MAX_ROWS","MAX_ROWS_ATTRIBUTE","LABEL","IS_DIRTY","IS_INVALID","HAS_PLACEHOLDER","onKeyDown_","MaterialTextfield.prototype.onKeyDown_","currentRowCount","MaterialTextfield.prototype.onFocus_","MaterialTextfield.prototype.onBlur_","onReset_","MaterialTextfield.prototype.onReset_","MaterialTextfield.prototype.updateClasses_","checkValidity","checkDirty","checkFocus","MaterialTextfield.prototype.checkDisabled","input_","MaterialTextfield.prototype.checkFocus","MaterialTextfield.prototype.checkValidity","validity","valid","MaterialTextfield.prototype.checkDirty","MaterialTextfield.prototype.disable","MaterialTextfield.prototype.enable","MaterialTextfield.prototype.change","MaterialTextfield.prototype.init","label_","parseInt","isNaN","boundUpdateClassesHandler","boundResetHandler","boundKeyDownHandler","invalid","MaterialTooltip","BOTTOM","LEFT","RIGHT","TOP","handleMouseEnter_","MaterialTooltip.prototype.handleMouseEnter_","props","marginLeft","offsetWidth","marginTop","hideTooltip_","MaterialTooltip.prototype.hideTooltip_","MaterialTooltip.prototype.init","boundMouseEnterHandler","boundMouseLeaveAndScrollHandler","MaterialLayout","MAX_WIDTH","TAB_SCROLL_PIXELS","RESIZE_TIMEOUT","MENU_ICON","CHEVRON_LEFT","CHEVRON_RIGHT","Mode_","STANDARD","SEAMED","WATERFALL","SCROLL","HEADER","DRAWER","CONTENT","DRAWER_BTN","ICON","HEADER_SEAMED","HEADER_WATERFALL","HEADER_SCROLL","FIXED_HEADER","OBFUSCATOR","TAB_BAR","TAB_CONTAINER","TAB","TAB_BAR_BUTTON","TAB_BAR_LEFT_BUTTON","TAB_BAR_RIGHT_BUTTON","PANEL","HAS_DRAWER","HAS_TABS","HAS_SCROLLING_HEADER","CASTING_SHADOW","IS_COMPACT","IS_SMALL_SCREEN","IS_DRAWER_OPEN","ON_LARGE_SCREEN","ON_SMALL_SCREEN","contentScrollHandler_","MaterialLayout.prototype.contentScrollHandler_","header_","headerVisible","scrollTop","keyboardEventHandler_","MaterialLayout.prototype.keyboardEventHandler_","drawer_","toggleDrawer","screenSizeHandler_","MaterialLayout.prototype.screenSizeHandler_","screenSizeMediaQuery_","matches","obfuscator_","drawerToggleHandler_","MaterialLayout.prototype.drawerToggleHandler_","type","headerTransitionEndHandler_","MaterialLayout.prototype.headerTransitionEndHandler_","headerClickHandler_","MaterialLayout.prototype.headerClickHandler_","MaterialLayout.prototype.resetTabState_","tabBar","MaterialLayout.prototype.resetPanelState_","MaterialLayout.prototype.toggleDrawer","drawerButton","MaterialLayout.prototype.init","focusedElement","directChildren","childNodes","numChildren","c","child","persisted","overflowY","mode","drawerButtonIcon","innerHTML","firstChild","obfuscator","matchMedia","addListener","tabContainer","leftButton","leftButtonIcon","scrollLeft","rightButton","rightButtonIcon","tabUpdateHandler","scrollWidth","windowResizeHandler","resizeTimeoutId_","MaterialDataTable","DATA_TABLE","SELECTABLE","SELECT_ELEMENT","IS_SELECTED","selectRow_","MaterialDataTable.prototype.selectRow_","checkbox","row","opt_rows","createCheckbox_","MaterialDataTable.prototype.createCheckbox_","label","labelClasses","MaterialDataTable.prototype.init","firstHeader","bodyRows","footRows","rows","concat","th","headerCheckbox","firstCell","td","nodeName","toUpperCase","rowCheckbox","MaterialRipple","INITIAL_SCALE","INITIAL_SIZE","INITIAL_OPACITY","FINAL_OPACITY","FINAL_SCALE","RIPPLE_EFFECT_IGNORE_EVENTS","downHandler_","MaterialRipple.prototype.downHandler_","boundHeight","boundWidth","rippleSize_","sqrt","ignoringMouseDown_","getFrameCount","frameCount","setFrameCount","bound","currentTarget","x","round","touches","setRippleXY","setRippleStyles","animFrameHandler","upHandler_","MaterialRipple.prototype.upHandler_","detail","MaterialRipple.prototype.init","recentering","y_","x_","frameCount_","boundDownHandler","boundUpHandler","this.getFrameCount","this.setFrameCount","fC","getRippleElement","this.getRippleElement","this.setRippleXY","newX","newY","this.setRippleStyles","transformString","offset","scale","webkitTransform","msTransform","transform","this.animFrameHandler"]
+}
diff --git a/app/modules/web/themes/material-dark/js/material.min.js b/app/modules/web/themes/material-dark/js/material.min.js
new file mode 100644
index 000000000..1aef68d77
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/material.min.js
@@ -0,0 +1,135 @@
+/*
+
+ Copyright 2015 Google Inc. All Rights Reserved.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+(function(){function x(b,a){if(b){if(a.element_.classList.contains(a.CssClasses_.MDL_JS_RIPPLE_EFFECT)){var c=document.createElement("span");c.classList.add(a.CssClasses_.MDL_RIPPLE_CONTAINER);c.classList.add(a.CssClasses_.MDL_JS_RIPPLE_EFFECT);var g=document.createElement("span");g.classList.add(a.CssClasses_.MDL_RIPPLE);c.appendChild(g);b.appendChild(c)}b.addEventListener("click",function(c){"#"===b.getAttribute("href").charAt(0)&&(c.preventDefault(),c=b.href.split("#")[1],c=a.element_.querySelector("#"+
+c),a.resetTabState_(),a.resetPanelState_(),b.classList.add(a.CssClasses_.ACTIVE_CLASS),c.classList.add(a.CssClasses_.ACTIVE_CLASS))})}}function v(b,a,d,g){function c(){var c=b.href.split("#")[1];c=g.content_.querySelector("#"+c);g.resetTabState_(a);g.resetPanelState_(d);b.classList.add(g.CssClasses_.IS_ACTIVE);c.classList.add(g.CssClasses_.IS_ACTIVE)}if(g.tabBar_.classList.contains(g.CssClasses_.JS_RIPPLE_EFFECT)){var e=document.createElement("span");e.classList.add(g.CssClasses_.RIPPLE_CONTAINER);
+e.classList.add(g.CssClasses_.JS_RIPPLE_EFFECT);var f=document.createElement("span");f.classList.add(g.CssClasses_.RIPPLE);e.appendChild(f);b.appendChild(e)}g.tabBar_.classList.contains(g.CssClasses_.TAB_MANUAL_SWITCH)||b.addEventListener("click",function(a){"#"===b.getAttribute("href").charAt(0)&&(a.preventDefault(),c())});b.show=c}var e={upgradeDom:function(b,a){},upgradeElement:function(b,a){},upgradeElements:function(b){},upgradeAllRegistered:function(){},registerUpgradedCallback:function(b,a){},
+register:function(b){},downgradeElements:function(b){}};e=function(){function b(b,a){for(var c=0;c<l.length;c++)if(l[c].className===b)return"undefined"!==typeof a&&(l[c]=a),l[c];return!1}function a(b){b=b.getAttribute("data-upgraded");return null===b?[""]:b.split(",")}function d(b,c){return-1!==a(b).indexOf(c)}function g(b,a,c){if("CustomEvent"in window&&"function"===typeof window.CustomEvent)return new CustomEvent(b,{bubbles:a,cancelable:c});var d=document.createEvent("Events");d.initEvent(b,a,c);
+return d}function e(a,c){if("undefined"===typeof a&&"undefined"===typeof c)for(a=0;a<l.length;a++)e(l[a].className,l[a].cssClass);else{if("undefined"===typeof c){var d=b(a);d&&(c=d.cssClass)}c=document.querySelectorAll("."+c);for(d=0;d<c.length;d++)f(c[d],a)}}function f(c,e){if(!("object"===typeof c&&c instanceof Element))throw Error("Invalid argument provided to upgrade MDL element.");var q=g("mdl-componentupgrading",!0,!0);c.dispatchEvent(q);if(!q.defaultPrevented){q=a(c);var p=[];if(e)d(c,e)||
+p.push(b(e));else{var f=c.classList;l.forEach(function(b){f.contains(b.cssClass)&&-1===p.indexOf(b)&&!d(c,b.className)&&p.push(b)})}e=0;for(var n=p.length,m;e<n;e++){if(m=p[e]){q.push(m.className);c.setAttribute("data-upgraded",q.join(","));var h=new m.classConstructor(c);h.mdlComponentConfigInternal_=m;t.push(h);for(var k=0,r=m.callbacks.length;k<r;k++)m.callbacks[k](c);m.widget&&(c[m.className]=h)}else throw Error("Unable to find a registered component for the given class.");m=g("mdl-componentupgraded",
+!0,!1);c.dispatchEvent(m)}}}function h(b){Array.isArray(b)||(b=b instanceof Element?[b]:Array.prototype.slice.call(b));for(var a=0,c=b.length,d;a<c;a++)d=b[a],d instanceof HTMLElement&&(f(d),0<d.children.length&&h(d.children))}function k(b){if(b){var a=t.indexOf(b);t.splice(a,1);a=b.element_.getAttribute("data-upgraded").split(",");var c=a.indexOf(b.mdlComponentConfigInternal_.classAsString);a.splice(c,1);b.element_.setAttribute("data-upgraded",a.join(","));a=g("mdl-componentdowngraded",!0,!1);b.element_.dispatchEvent(a)}}
+var l=[],t=[];return{upgradeDom:e,upgradeElement:f,upgradeElements:h,upgradeAllRegistered:function(){for(var b=0;b<l.length;b++)e(l[b].className)},registerUpgradedCallback:function(a,c){(a=b(a))&&a.callbacks.push(c)},register:function(a){var c=!0;if("undefined"!==typeof a.widget||"undefined"!==typeof a.widget)c=a.widget||a.widget;var d={classConstructor:a.constructor||a.constructor,className:a.classAsString||a.classAsString,cssClass:a.cssClass||a.cssClass,widget:c,callbacks:[]};l.forEach(function(b){if(b.cssClass===
+d.cssClass)throw Error("The provided cssClass has already been registered: "+b.cssClass);if(b.className===d.className)throw Error("The provided className has already been registered");});if(a.constructor.prototype.hasOwnProperty("mdlComponentConfigInternal_"))throw Error("MDL component classes must not have mdlComponentConfigInternal_ defined as a property.");b(a.classAsString,d)||l.push(d)},downgradeElements:function(b){var a=function(b){t.filter(function(a){return a.element_===b}).forEach(k)};if(b instanceof
+Array||b instanceof NodeList)for(var c=0;c<b.length;c++)a(b[c]);else if(b instanceof Node)a(b);else throw Error("Invalid argument provided to downgrade MDL nodes.");}}}();e.upgradeDom=e.upgradeDom;e.upgradeElement=e.upgradeElement;e.upgradeElements=e.upgradeElements;e.upgradeAllRegistered=e.upgradeAllRegistered;e.registerUpgradedCallback=e.registerUpgradedCallback;e.register=e.register;e.downgradeElements=e.downgradeElements;window.componentHandler=e;window.componentHandler=e;window.addEventListener("load",
+function(){"classList"in document.createElement("div")&&"querySelector"in document&&"addEventListener"in window&&Array.prototype.forEach?(document.documentElement.classList.add("mdl-js"),e.upgradeAllRegistered()):(e.upgradeElement=function(){},e.register=function(){})});Date.now||(Date.now=function(){return(new Date).getTime()},Date.now=Date.now);for(var a=["webkit","moz"],r=0;r<a.length&&!window.requestAnimationFrame;++r){var u=a[r];window.requestAnimationFrame=window[u+"RequestAnimationFrame"];
+window.cancelAnimationFrame=window[u+"CancelAnimationFrame"]||window[u+"CancelRequestAnimationFrame"];window.requestAnimationFrame=window.requestAnimationFrame;window.cancelAnimationFrame=window.cancelAnimationFrame}if(/iP(ad|hone|od).*OS 6/.test(window.navigator.userAgent)||!window.requestAnimationFrame||!window.cancelAnimationFrame){var w=0;window.requestAnimationFrame=function(b){var a=Date.now(),d=Math.max(w+16,a);return setTimeout(function(){b(w=d)},d-a)};window.cancelAnimationFrame=clearTimeout;
+window.requestAnimationFrame=window.requestAnimationFrame;window.cancelAnimationFrame=window.cancelAnimationFrame}a=function(b){this.element_=b;this.init()};window.MaterialButton=a;a.prototype.Constant_={};a.prototype.CssClasses_={RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_CONTAINER:"mdl-button__ripple-container",RIPPLE:"mdl-ripple"};a.prototype.blurHandler_=function(b){b&&this.element_.blur()};a.prototype.disable=function(){this.element_.disabled=!0};a.prototype.disable=a.prototype.disable;a.prototype.enable=
+function(){this.element_.disabled=!1};a.prototype.enable=a.prototype.enable;a.prototype.init=function(){if(this.element_){if(this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)){var b=document.createElement("span");b.classList.add(this.CssClasses_.RIPPLE_CONTAINER);this.rippleElement_=document.createElement("span");this.rippleElement_.classList.add(this.CssClasses_.RIPPLE);b.appendChild(this.rippleElement_);this.boundRippleBlurHandler=this.blurHandler_.bind(this);this.rippleElement_.addEventListener("mouseup",
+this.boundRippleBlurHandler);this.element_.appendChild(b)}this.boundButtonBlurHandler=this.blurHandler_.bind(this);this.element_.addEventListener("mouseup",this.boundButtonBlurHandler);this.element_.addEventListener("mouseleave",this.boundButtonBlurHandler)}};e.register({constructor:a,classAsString:"MaterialButton",cssClass:"mdl-js-button",widget:!0});a=function(b){this.element_=b;this.init()};window.MaterialCheckbox=a;a.prototype.Constant_={TINY_TIMEOUT:.001};a.prototype.CssClasses_={INPUT:"mdl-checkbox__input",
+BOX_OUTLINE:"mdl-checkbox__box-outline",FOCUS_HELPER:"mdl-checkbox__focus-helper",TICK_OUTLINE:"mdl-checkbox__tick-outline",RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE_CONTAINER:"mdl-checkbox__ripple-container",RIPPLE_CENTER:"mdl-ripple--center",RIPPLE:"mdl-ripple",IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",IS_CHECKED:"is-checked",IS_UPGRADED:"is-upgraded"};a.prototype.onChange_=function(b){this.updateClasses_()};a.prototype.onFocus_=
+function(b){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)};a.prototype.onBlur_=function(b){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)};a.prototype.onMouseUp_=function(b){this.blur_()};a.prototype.updateClasses_=function(){this.checkDisabled();this.checkToggleState()};a.prototype.blur_=function(){window.setTimeout(function(){this.inputElement_.blur()}.bind(this),this.Constant_.TINY_TIMEOUT)};a.prototype.checkToggleState=function(){this.inputElement_.checked?this.element_.classList.add(this.CssClasses_.IS_CHECKED):
+this.element_.classList.remove(this.CssClasses_.IS_CHECKED)};a.prototype.checkToggleState=a.prototype.checkToggleState;a.prototype.checkDisabled=function(){this.inputElement_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)};a.prototype.checkDisabled=a.prototype.checkDisabled;a.prototype.disable=function(){this.inputElement_.disabled=!0;this.updateClasses_()};a.prototype.disable=a.prototype.disable;a.prototype.enable=function(){this.inputElement_.disabled=
+!1;this.updateClasses_()};a.prototype.enable=a.prototype.enable;a.prototype.check=function(){this.inputElement_.checked=!0;this.updateClasses_()};a.prototype.check=a.prototype.check;a.prototype.uncheck=function(){this.inputElement_.checked=!1;this.updateClasses_()};a.prototype.uncheck=a.prototype.uncheck;a.prototype.init=function(){if(this.element_){this.inputElement_=this.element_.querySelector("."+this.CssClasses_.INPUT);var b=document.createElement("span");b.classList.add(this.CssClasses_.BOX_OUTLINE);
+var a=document.createElement("span");a.classList.add(this.CssClasses_.FOCUS_HELPER);var d=document.createElement("span");d.classList.add(this.CssClasses_.TICK_OUTLINE);b.appendChild(d);this.element_.appendChild(a);this.element_.appendChild(b);this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)&&(this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS),this.rippleContainerElement_=document.createElement("span"),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER),
+this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER),this.boundRippleMouseUp=this.onMouseUp_.bind(this),this.rippleContainerElement_.addEventListener("mouseup",this.boundRippleMouseUp),b=document.createElement("span"),b.classList.add(this.CssClasses_.RIPPLE),this.rippleContainerElement_.appendChild(b),this.element_.appendChild(this.rippleContainerElement_));this.boundInputOnChange=this.onChange_.bind(this);
+this.boundInputOnFocus=this.onFocus_.bind(this);this.boundInputOnBlur=this.onBlur_.bind(this);this.boundElementMouseUp=this.onMouseUp_.bind(this);this.inputElement_.addEventListener("change",this.boundInputOnChange);this.inputElement_.addEventListener("focus",this.boundInputOnFocus);this.inputElement_.addEventListener("blur",this.boundInputOnBlur);this.element_.addEventListener("mouseup",this.boundElementMouseUp);this.updateClasses_();this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}};e.register({constructor:a,
+classAsString:"MaterialCheckbox",cssClass:"mdl-js-checkbox",widget:!0});a=function(b){this.element_=b;this.init()};window.MaterialIconToggle=a;a.prototype.Constant_={TINY_TIMEOUT:.001};a.prototype.CssClasses_={INPUT:"mdl-icon-toggle__input",JS_RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE_CONTAINER:"mdl-icon-toggle__ripple-container",RIPPLE_CENTER:"mdl-ripple--center",RIPPLE:"mdl-ripple",IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",IS_CHECKED:"is-checked"};
+a.prototype.onChange_=function(b){this.updateClasses_()};a.prototype.onFocus_=function(b){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)};a.prototype.onBlur_=function(b){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)};a.prototype.onMouseUp_=function(b){this.blur_()};a.prototype.updateClasses_=function(){this.checkDisabled();this.checkToggleState()};a.prototype.blur_=function(){window.setTimeout(function(){this.inputElement_.blur()}.bind(this),this.Constant_.TINY_TIMEOUT)};a.prototype.checkToggleState=
+function(){this.inputElement_.checked?this.element_.classList.add(this.CssClasses_.IS_CHECKED):this.element_.classList.remove(this.CssClasses_.IS_CHECKED)};a.prototype.checkToggleState=a.prototype.checkToggleState;a.prototype.checkDisabled=function(){this.inputElement_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)};a.prototype.checkDisabled=a.prototype.checkDisabled;a.prototype.disable=function(){this.inputElement_.disabled=
+!0;this.updateClasses_()};a.prototype.disable=a.prototype.disable;a.prototype.enable=function(){this.inputElement_.disabled=!1;this.updateClasses_()};a.prototype.enable=a.prototype.enable;a.prototype.check=function(){this.inputElement_.checked=!0;this.updateClasses_()};a.prototype.check=a.prototype.check;a.prototype.uncheck=function(){this.inputElement_.checked=!1;this.updateClasses_()};a.prototype.uncheck=a.prototype.uncheck;a.prototype.init=function(){if(this.element_){this.inputElement_=this.element_.querySelector("."+
+this.CssClasses_.INPUT);if(this.element_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)){this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);this.rippleContainerElement_=document.createElement("span");this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);this.rippleContainerElement_.classList.add(this.CssClasses_.JS_RIPPLE_EFFECT);this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);this.boundRippleMouseUp=this.onMouseUp_.bind(this);
+this.rippleContainerElement_.addEventListener("mouseup",this.boundRippleMouseUp);var b=document.createElement("span");b.classList.add(this.CssClasses_.RIPPLE);this.rippleContainerElement_.appendChild(b);this.element_.appendChild(this.rippleContainerElement_)}this.boundInputOnChange=this.onChange_.bind(this);this.boundInputOnFocus=this.onFocus_.bind(this);this.boundInputOnBlur=this.onBlur_.bind(this);this.boundElementOnMouseUp=this.onMouseUp_.bind(this);this.inputElement_.addEventListener("change",
+this.boundInputOnChange);this.inputElement_.addEventListener("focus",this.boundInputOnFocus);this.inputElement_.addEventListener("blur",this.boundInputOnBlur);this.element_.addEventListener("mouseup",this.boundElementOnMouseUp);this.updateClasses_();this.element_.classList.add("is-upgraded")}};e.register({constructor:a,classAsString:"MaterialIconToggle",cssClass:"mdl-js-icon-toggle",widget:!0});var f=function(b){this.element_=b;this.init()};window.MaterialMenu=f;f.prototype.Constant_={TRANSITION_DURATION_SECONDS:.3,
+TRANSITION_DURATION_FRACTION:.8,CLOSE_TIMEOUT:150};f.prototype.Keycodes_={ENTER:13,ESCAPE:27,SPACE:32,UP_ARROW:38,DOWN_ARROW:40};f.prototype.CssClasses_={CONTAINER:"mdl-menu__container",OUTLINE:"mdl-menu__outline",ITEM:"mdl-menu__item",ITEM_RIPPLE_CONTAINER:"mdl-menu__item-ripple-container",RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE:"mdl-ripple",IS_UPGRADED:"is-upgraded",IS_VISIBLE:"is-visible",IS_ANIMATING:"is-animating",BOTTOM_LEFT:"mdl-menu--bottom-left",
+BOTTOM_RIGHT:"mdl-menu--bottom-right",TOP_LEFT:"mdl-menu--top-left",TOP_RIGHT:"mdl-menu--top-right",UNALIGNED:"mdl-menu--unaligned"};f.prototype.init=function(){if(this.element_){var b=document.createElement("div");b.classList.add(this.CssClasses_.CONTAINER);this.element_.parentElement.insertBefore(b,this.element_);this.element_.parentElement.removeChild(this.element_);b.appendChild(this.element_);this.container_=b;var a=document.createElement("div");a.classList.add(this.CssClasses_.OUTLINE);this.outline_=
+a;b.insertBefore(a,this.element_);if(a=this.element_.getAttribute("for")||this.element_.getAttribute("data-mdl-for"))if(a=document.getElementById(a))this.forElement_=a,a.addEventListener("click",this.handleForClick_.bind(this)),a.addEventListener("keydown",this.handleForKeyboardEvent_.bind(this));a=this.element_.querySelectorAll("."+this.CssClasses_.ITEM);this.boundItemKeydown_=this.handleItemKeyboardEvent_.bind(this);this.boundItemClick_=this.handleItemClick_.bind(this);for(var d=0;d<a.length;d++)a[d].addEventListener("click",
+this.boundItemClick_),a[d].tabIndex="-1",a[d].addEventListener("keydown",this.boundItemKeydown_);if(this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT))for(this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS),d=0;d<a.length;d++){var g=a[d],e=document.createElement("span");e.classList.add(this.CssClasses_.ITEM_RIPPLE_CONTAINER);var f=document.createElement("span");f.classList.add(this.CssClasses_.RIPPLE);e.appendChild(f);g.appendChild(e);g.classList.add(this.CssClasses_.RIPPLE_EFFECT)}this.element_.classList.contains(this.CssClasses_.BOTTOM_LEFT)&&
+this.outline_.classList.add(this.CssClasses_.BOTTOM_LEFT);this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)&&this.outline_.classList.add(this.CssClasses_.BOTTOM_RIGHT);this.element_.classList.contains(this.CssClasses_.TOP_LEFT)&&this.outline_.classList.add(this.CssClasses_.TOP_LEFT);this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)&&this.outline_.classList.add(this.CssClasses_.TOP_RIGHT);this.element_.classList.contains(this.CssClasses_.UNALIGNED)&&this.outline_.classList.add(this.CssClasses_.UNALIGNED);
+b.classList.add(this.CssClasses_.IS_UPGRADED)}};f.prototype.handleForClick_=function(b){if(this.element_&&this.forElement_){var a=this.forElement_.getBoundingClientRect(),d=this.forElement_.parentElement.getBoundingClientRect();this.element_.classList.contains(this.CssClasses_.UNALIGNED)||(this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)?(this.container_.style.right=d.right-a.right+"px",this.container_.style.top=this.forElement_.offsetTop+this.forElement_.offsetHeight+"px"):this.element_.classList.contains(this.CssClasses_.TOP_LEFT)?
+(this.container_.style.left=this.forElement_.offsetLeft+"px",this.container_.style.bottom=d.bottom-a.top+"px"):this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)?(this.container_.style.right=d.right-a.right+"px",this.container_.style.bottom=d.bottom-a.top+"px"):(this.container_.style.left=this.forElement_.offsetLeft+"px",this.container_.style.top=this.forElement_.offsetTop+this.forElement_.offsetHeight+"px"))}this.toggle(b)};f.prototype.handleForKeyboardEvent_=function(b){if(this.element_&&
+this.container_&&this.forElement_){var a=this.element_.querySelectorAll("."+this.CssClasses_.ITEM+":not([disabled])");a&&0<a.length&&this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)&&(b.keyCode===this.Keycodes_.UP_ARROW?(b.preventDefault(),a[a.length-1].focus()):b.keyCode===this.Keycodes_.DOWN_ARROW&&(b.preventDefault(),a[0].focus()))}};f.prototype.handleItemKeyboardEvent_=function(b){if(this.element_&&this.container_){var a=this.element_.querySelectorAll("."+this.CssClasses_.ITEM+
+":not([disabled])");if(a&&0<a.length&&this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)){var d=Array.prototype.slice.call(a).indexOf(b.target);b.keyCode===this.Keycodes_.UP_ARROW?(b.preventDefault(),0<d?a[d-1].focus():a[a.length-1].focus()):b.keyCode===this.Keycodes_.DOWN_ARROW?(b.preventDefault(),a.length>d+1?a[d+1].focus():a[0].focus()):b.keyCode===this.Keycodes_.SPACE||b.keyCode===this.Keycodes_.ENTER?(b.preventDefault(),a=new MouseEvent("mousedown"),b.target.dispatchEvent(a),a=new MouseEvent("mouseup"),
+b.target.dispatchEvent(a),b.target.click()):b.keyCode===this.Keycodes_.ESCAPE&&(b.preventDefault(),this.hide())}}};f.prototype.handleItemClick_=function(b){b.target.hasAttribute("disabled")?b.stopPropagation():(this.closing_=!0,window.setTimeout(function(b){this.hide();this.closing_=!1}.bind(this),this.Constant_.CLOSE_TIMEOUT))};f.prototype.applyClip_=function(b,a){this.element_.classList.contains(this.CssClasses_.UNALIGNED)?this.element_.style.clip="":this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)?
+this.element_.style.clip="rect(0 "+a+"px 0 "+a+"px)":this.element_.classList.contains(this.CssClasses_.TOP_LEFT)?this.element_.style.clip="rect("+b+"px 0 "+b+"px 0)":this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)?this.element_.style.clip="rect("+b+"px "+a+"px "+b+"px "+a+"px)":this.element_.style.clip=""};f.prototype.removeAnimationEndListener_=function(b){b.target.classList.remove(f.prototype.CssClasses_.IS_ANIMATING)};f.prototype.addAnimationEndListener_=function(){this.element_.addEventListener("transitionend",
+this.removeAnimationEndListener_);this.element_.addEventListener("webkitTransitionEnd",this.removeAnimationEndListener_)};f.prototype.show=function(b){if(this.element_&&this.container_&&this.outline_){var a=this.element_.getBoundingClientRect().height,d=this.element_.getBoundingClientRect().width;this.container_.style.width=d+"px";this.container_.style.height=a+"px";this.outline_.style.width=d+"px";this.outline_.style.height=a+"px";for(var g=this.Constant_.TRANSITION_DURATION_SECONDS*this.Constant_.TRANSITION_DURATION_FRACTION,
+e=this.element_.querySelectorAll("."+this.CssClasses_.ITEM),f=0;f<e.length;f++){var h=null;h=this.element_.classList.contains(this.CssClasses_.TOP_LEFT)||this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)?(a-e[f].offsetTop-e[f].offsetHeight)/a*g+"s":e[f].offsetTop/a*g+"s";e[f].style.transitionDelay=h}this.applyClip_(a,d);window.requestAnimationFrame(function(){this.element_.classList.add(this.CssClasses_.IS_ANIMATING);this.element_.style.clip="rect(0 "+d+"px "+a+"px 0)";this.container_.classList.add(this.CssClasses_.IS_VISIBLE)}.bind(this));
+this.addAnimationEndListener_();var k=function(a){a===b||this.closing_||a.target.parentNode===this.element_||(document.removeEventListener("click",k),this.hide())}.bind(this);document.addEventListener("click",k)}};f.prototype.show=f.prototype.show;f.prototype.hide=function(){if(this.element_&&this.container_&&this.outline_){for(var b=this.element_.querySelectorAll("."+this.CssClasses_.ITEM),a=0;a<b.length;a++)b[a].style.removeProperty("transition-delay");a=this.element_.getBoundingClientRect();b=
+a.height;a=a.width;this.element_.classList.add(this.CssClasses_.IS_ANIMATING);this.applyClip_(b,a);this.container_.classList.remove(this.CssClasses_.IS_VISIBLE);this.addAnimationEndListener_()}};f.prototype.hide=f.prototype.hide;f.prototype.toggle=function(a){this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)?this.hide():this.show(a)};f.prototype.toggle=f.prototype.toggle;e.register({constructor:f,classAsString:"MaterialMenu",cssClass:"mdl-js-menu",widget:!0});a=function(a){this.element_=
+a;this.init()};window.MaterialProgress=a;a.prototype.Constant_={};a.prototype.CssClasses_={INDETERMINATE_CLASS:"mdl-progress__indeterminate"};a.prototype.setProgress=function(a){this.element_.classList.contains(this.CssClasses_.INDETERMINATE_CLASS)||(this.progressbar_.style.width=a+"%")};a.prototype.setProgress=a.prototype.setProgress;a.prototype.setBuffer=function(a){this.bufferbar_.style.width=a+"%";this.auxbar_.style.width=100-a+"%"};a.prototype.setBuffer=a.prototype.setBuffer;a.prototype.init=
+function(){if(this.element_){var a=document.createElement("div");a.className="progressbar bar bar1";this.element_.appendChild(a);this.progressbar_=a;a=document.createElement("div");a.className="bufferbar bar bar2";this.element_.appendChild(a);this.bufferbar_=a;a=document.createElement("div");a.className="auxbar bar bar3";this.element_.appendChild(a);this.auxbar_=a;this.progressbar_.style.width="0%";this.bufferbar_.style.width="100%";this.auxbar_.style.width="0%";this.element_.classList.add("is-upgraded")}};
+e.register({constructor:a,classAsString:"MaterialProgress",cssClass:"mdl-js-progress",widget:!0});a=function(a){this.element_=a;this.init()};window.MaterialRadio=a;a.prototype.Constant_={TINY_TIMEOUT:.001};a.prototype.CssClasses_={IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",IS_CHECKED:"is-checked",IS_UPGRADED:"is-upgraded",JS_RADIO:"mdl-js-radio",RADIO_BTN:"mdl-radio__button",RADIO_OUTER_CIRCLE:"mdl-radio__outer-circle",RADIO_INNER_CIRCLE:"mdl-radio__inner-circle",RIPPLE_EFFECT:"mdl-js-ripple-effect",
+RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE_CONTAINER:"mdl-radio__ripple-container",RIPPLE_CENTER:"mdl-ripple--center",RIPPLE:"mdl-ripple"};a.prototype.onChange_=function(a){a=document.getElementsByClassName(this.CssClasses_.JS_RADIO);for(var b=0;b<a.length;b++)a[b].querySelector("."+this.CssClasses_.RADIO_BTN).getAttribute("name")===this.btnElement_.getAttribute("name")&&"undefined"!==typeof a[b].MaterialRadio&&a[b].MaterialRadio.updateClasses_()};a.prototype.onFocus_=function(a){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)};
+a.prototype.onBlur_=function(a){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)};a.prototype.onMouseup_=function(a){this.blur_()};a.prototype.updateClasses_=function(){this.checkDisabled();this.checkToggleState()};a.prototype.blur_=function(){window.setTimeout(function(){this.btnElement_.blur()}.bind(this),this.Constant_.TINY_TIMEOUT)};a.prototype.checkDisabled=function(){this.btnElement_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)};
+a.prototype.checkDisabled=a.prototype.checkDisabled;a.prototype.checkToggleState=function(){this.btnElement_.checked?this.element_.classList.add(this.CssClasses_.IS_CHECKED):this.element_.classList.remove(this.CssClasses_.IS_CHECKED)};a.prototype.checkToggleState=a.prototype.checkToggleState;a.prototype.disable=function(){this.btnElement_.disabled=!0;this.updateClasses_()};a.prototype.disable=a.prototype.disable;a.prototype.enable=function(){this.btnElement_.disabled=!1;this.updateClasses_()};a.prototype.enable=
+a.prototype.enable;a.prototype.check=function(){this.btnElement_.checked=!0;this.onChange_(null)};a.prototype.check=a.prototype.check;a.prototype.uncheck=function(){this.btnElement_.checked=!1;this.onChange_(null)};a.prototype.uncheck=a.prototype.uncheck;a.prototype.init=function(){if(this.element_){this.btnElement_=this.element_.querySelector("."+this.CssClasses_.RADIO_BTN);this.boundChangeHandler_=this.onChange_.bind(this);this.boundFocusHandler_=this.onChange_.bind(this);this.boundBlurHandler_=
+this.onBlur_.bind(this);this.boundMouseUpHandler_=this.onMouseup_.bind(this);var a=document.createElement("span");a.classList.add(this.CssClasses_.RADIO_OUTER_CIRCLE);var c=document.createElement("span");c.classList.add(this.CssClasses_.RADIO_INNER_CIRCLE);this.element_.appendChild(a);this.element_.appendChild(c);this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)&&(this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS),a=document.createElement("span"),a.classList.add(this.CssClasses_.RIPPLE_CONTAINER),
+a.classList.add(this.CssClasses_.RIPPLE_EFFECT),a.classList.add(this.CssClasses_.RIPPLE_CENTER),a.addEventListener("mouseup",this.boundMouseUpHandler_),c=document.createElement("span"),c.classList.add(this.CssClasses_.RIPPLE),a.appendChild(c),this.element_.appendChild(a));this.btnElement_.addEventListener("change",this.boundChangeHandler_);this.btnElement_.addEventListener("focus",this.boundFocusHandler_);this.btnElement_.addEventListener("blur",this.boundBlurHandler_);this.element_.addEventListener("mouseup",
+this.boundMouseUpHandler_);this.updateClasses_();this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}};e.register({constructor:a,classAsString:"MaterialRadio",cssClass:"mdl-js-radio",widget:!0});a=function(a){this.element_=a;this.isIE_=window.navigator.msPointerEnabled;this.init()};window.MaterialSlider=a;a.prototype.Constant_={};a.prototype.CssClasses_={IE_CONTAINER:"mdl-slider__ie-container",SLIDER_CONTAINER:"mdl-slider__container",BACKGROUND_FLEX:"mdl-slider__background-flex",BACKGROUND_LOWER:"mdl-slider__background-lower",
+BACKGROUND_UPPER:"mdl-slider__background-upper",IS_LOWEST_VALUE:"is-lowest-value",IS_UPGRADED:"is-upgraded"};a.prototype.onInput_=function(a){this.updateValueStyles_()};a.prototype.onChange_=function(a){this.updateValueStyles_()};a.prototype.onMouseUp_=function(a){a.target.blur()};a.prototype.onContainerMouseDown_=function(a){a.target===this.element_.parentElement&&(a.preventDefault(),a=new MouseEvent("mousedown",{target:a.target,buttons:a.buttons,clientX:a.clientX,clientY:this.element_.getBoundingClientRect().y}),
+this.element_.dispatchEvent(a))};a.prototype.updateValueStyles_=function(){var a=(this.element_.value-this.element_.min)/(this.element_.max-this.element_.min);0===a?this.element_.classList.add(this.CssClasses_.IS_LOWEST_VALUE):this.element_.classList.remove(this.CssClasses_.IS_LOWEST_VALUE);this.isIE_||(this.backgroundLower_.style.flex=a,this.backgroundLower_.style.webkitFlex=a,this.backgroundUpper_.style.flex=1-a,this.backgroundUpper_.style.webkitFlex=1-a)};a.prototype.disable=function(){this.element_.disabled=
+!0};a.prototype.disable=a.prototype.disable;a.prototype.enable=function(){this.element_.disabled=!1};a.prototype.enable=a.prototype.enable;a.prototype.change=function(a){"undefined"!==typeof a&&(this.element_.value=a);this.updateValueStyles_()};a.prototype.change=a.prototype.change;a.prototype.init=function(){if(this.element_){if(this.isIE_){var a=document.createElement("div");a.classList.add(this.CssClasses_.IE_CONTAINER);this.element_.parentElement.insertBefore(a,this.element_);this.element_.parentElement.removeChild(this.element_);
+a.appendChild(this.element_)}else{a=document.createElement("div");a.classList.add(this.CssClasses_.SLIDER_CONTAINER);this.element_.parentElement.insertBefore(a,this.element_);this.element_.parentElement.removeChild(this.element_);a.appendChild(this.element_);var c=document.createElement("div");c.classList.add(this.CssClasses_.BACKGROUND_FLEX);a.appendChild(c);this.backgroundLower_=document.createElement("div");this.backgroundLower_.classList.add(this.CssClasses_.BACKGROUND_LOWER);c.appendChild(this.backgroundLower_);
+this.backgroundUpper_=document.createElement("div");this.backgroundUpper_.classList.add(this.CssClasses_.BACKGROUND_UPPER);c.appendChild(this.backgroundUpper_)}this.boundInputHandler=this.onInput_.bind(this);this.boundChangeHandler=this.onChange_.bind(this);this.boundMouseUpHandler=this.onMouseUp_.bind(this);this.boundContainerMouseDownHandler=this.onContainerMouseDown_.bind(this);this.element_.addEventListener("input",this.boundInputHandler);this.element_.addEventListener("change",this.boundChangeHandler);
+this.element_.addEventListener("mouseup",this.boundMouseUpHandler);this.element_.parentElement.addEventListener("mousedown",this.boundContainerMouseDownHandler);this.updateValueStyles_();this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}};e.register({constructor:a,classAsString:"MaterialSlider",cssClass:"mdl-js-slider",widget:!0});a=function(a){this.element_=a;this.textElement_=this.element_.querySelector("."+this.cssClasses_.MESSAGE);this.actionElement_=this.element_.querySelector("."+this.cssClasses_.ACTION);
+if(!this.textElement_)throw Error("There must be a message element for a snackbar.");if(!this.actionElement_)throw Error("There must be an action element for a snackbar.");this.active=!1;this.actionText_=this.message_=this.actionHandler_=void 0;this.queuedNotifications_=[];this.setActionHidden_(!0)};window.MaterialSnackbar=a;a.prototype.Constant_={ANIMATION_LENGTH:250};a.prototype.cssClasses_={SNACKBAR:"mdl-snackbar",MESSAGE:"mdl-snackbar__text",ACTION:"mdl-snackbar__action",ACTIVE:"mdl-snackbar--active"};
+a.prototype.displaySnackbar_=function(){this.element_.setAttribute("aria-hidden","true");this.actionHandler_&&(this.actionElement_.textContent=this.actionText_,this.actionElement_.addEventListener("click",this.actionHandler_),this.setActionHidden_(!1));this.textElement_.textContent=this.message_;this.element_.classList.add(this.cssClasses_.ACTIVE);this.element_.setAttribute("aria-hidden","false");setTimeout(this.cleanup_.bind(this),this.timeout_)};a.prototype.showSnackbar=function(a){if(void 0===
+a)throw Error("Please provide a data object with at least a message to display.");if(void 0===a.message)throw Error("Please provide a message to be displayed.");if(a.actionHandler&&!a.actionText)throw Error("Please provide action text with the handler.");this.active?this.queuedNotifications_.push(a):(this.active=!0,this.message_=a.message,this.timeout_=a.timeout?a.timeout:2750,a.actionHandler&&(this.actionHandler_=a.actionHandler),a.actionText&&(this.actionText_=a.actionText),this.displaySnackbar_())};
+a.prototype.showSnackbar=a.prototype.showSnackbar;a.prototype.checkQueue_=function(){0<this.queuedNotifications_.length&&this.showSnackbar(this.queuedNotifications_.shift())};a.prototype.cleanup_=function(){this.element_.classList.remove(this.cssClasses_.ACTIVE);setTimeout(function(){this.element_.setAttribute("aria-hidden","true");this.textElement_.textContent="";this.actionElement_.getAttribute("aria-hidden")||(this.setActionHidden_(!0),this.actionElement_.textContent="",this.actionElement_.removeEventListener("click",
+this.actionHandler_));this.actionText_=this.message_=this.actionHandler_=void 0;this.active=!1;this.checkQueue_()}.bind(this),this.Constant_.ANIMATION_LENGTH)};a.prototype.setActionHidden_=function(a){a?this.actionElement_.setAttribute("aria-hidden","true"):this.actionElement_.removeAttribute("aria-hidden")};e.register({constructor:a,classAsString:"MaterialSnackbar",cssClass:"mdl-js-snackbar",widget:!0});a=function(a){this.element_=a;this.init()};window.MaterialSpinner=a;a.prototype.Constant_={MDL_SPINNER_LAYER_COUNT:4};
+a.prototype.CssClasses_={MDL_SPINNER_LAYER:"mdl-spinner__layer",MDL_SPINNER_CIRCLE_CLIPPER:"mdl-spinner__circle-clipper",MDL_SPINNER_CIRCLE:"mdl-spinner__circle",MDL_SPINNER_GAP_PATCH:"mdl-spinner__gap-patch",MDL_SPINNER_LEFT:"mdl-spinner__left",MDL_SPINNER_RIGHT:"mdl-spinner__right"};a.prototype.createLayer=function(a){var b=document.createElement("div");b.classList.add(this.CssClasses_.MDL_SPINNER_LAYER);b.classList.add(this.CssClasses_.MDL_SPINNER_LAYER+"-"+a);a=document.createElement("div");a.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER);
+a.classList.add(this.CssClasses_.MDL_SPINNER_LEFT);var d=document.createElement("div");d.classList.add(this.CssClasses_.MDL_SPINNER_GAP_PATCH);var g=document.createElement("div");g.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER);g.classList.add(this.CssClasses_.MDL_SPINNER_RIGHT);for(var e=[a,d,g],f=0;f<e.length;f++){var h=document.createElement("div");h.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE);e[f].appendChild(h)}b.appendChild(a);b.appendChild(d);b.appendChild(g);this.element_.appendChild(b)};
+a.prototype.createLayer=a.prototype.createLayer;a.prototype.stop=function(){this.element_.classList.remove("is-active")};a.prototype.stop=a.prototype.stop;a.prototype.start=function(){this.element_.classList.add("is-active")};a.prototype.start=a.prototype.start;a.prototype.init=function(){if(this.element_){for(var a=1;a<=this.Constant_.MDL_SPINNER_LAYER_COUNT;a++)this.createLayer(a);this.element_.classList.add("is-upgraded")}};e.register({constructor:a,classAsString:"MaterialSpinner",cssClass:"mdl-js-spinner",
+widget:!0});a=function(a){this.element_=a;this.init()};window.MaterialSwitch=a;a.prototype.Constant_={TINY_TIMEOUT:.001};a.prototype.CssClasses_={INPUT:"mdl-switch__input",TRACK:"mdl-switch__track",THUMB:"mdl-switch__thumb",FOCUS_HELPER:"mdl-switch__focus-helper",RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE_CONTAINER:"mdl-switch__ripple-container",RIPPLE_CENTER:"mdl-ripple--center",RIPPLE:"mdl-ripple",IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",
+IS_CHECKED:"is-checked"};a.prototype.onChange_=function(a){this.updateClasses_()};a.prototype.onFocus_=function(a){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)};a.prototype.onBlur_=function(a){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)};a.prototype.onMouseUp_=function(a){this.blur_()};a.prototype.updateClasses_=function(){this.checkDisabled();this.checkToggleState()};a.prototype.blur_=function(){window.setTimeout(function(){this.inputElement_.blur()}.bind(this),this.Constant_.TINY_TIMEOUT)};
+a.prototype.checkDisabled=function(){this.inputElement_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)};a.prototype.checkDisabled=a.prototype.checkDisabled;a.prototype.checkToggleState=function(){this.inputElement_.checked?this.element_.classList.add(this.CssClasses_.IS_CHECKED):this.element_.classList.remove(this.CssClasses_.IS_CHECKED)};a.prototype.checkToggleState=a.prototype.checkToggleState;a.prototype.disable=function(){this.inputElement_.disabled=
+!0;this.updateClasses_()};a.prototype.disable=a.prototype.disable;a.prototype.enable=function(){this.inputElement_.disabled=!1;this.updateClasses_()};a.prototype.enable=a.prototype.enable;a.prototype.on=function(){this.inputElement_.checked=!0;this.updateClasses_()};a.prototype.on=a.prototype.on;a.prototype.off=function(){this.inputElement_.checked=!1;this.updateClasses_()};a.prototype.off=a.prototype.off;a.prototype.init=function(){if(this.element_){this.inputElement_=this.element_.querySelector("."+
+this.CssClasses_.INPUT);var a=document.createElement("div");a.classList.add(this.CssClasses_.TRACK);var c=document.createElement("div");c.classList.add(this.CssClasses_.THUMB);var d=document.createElement("span");d.classList.add(this.CssClasses_.FOCUS_HELPER);c.appendChild(d);this.element_.appendChild(a);this.element_.appendChild(c);this.boundMouseUpHandler=this.onMouseUp_.bind(this);this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)&&(this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS),
+this.rippleContainerElement_=document.createElement("span"),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER),this.rippleContainerElement_.addEventListener("mouseup",this.boundMouseUpHandler),a=document.createElement("span"),a.classList.add(this.CssClasses_.RIPPLE),this.rippleContainerElement_.appendChild(a),this.element_.appendChild(this.rippleContainerElement_));
+this.boundChangeHandler=this.onChange_.bind(this);this.boundFocusHandler=this.onFocus_.bind(this);this.boundBlurHandler=this.onBlur_.bind(this);this.inputElement_.addEventListener("change",this.boundChangeHandler);this.inputElement_.addEventListener("focus",this.boundFocusHandler);this.inputElement_.addEventListener("blur",this.boundBlurHandler);this.element_.addEventListener("mouseup",this.boundMouseUpHandler);this.updateClasses_();this.element_.classList.add("is-upgraded")}};e.register({constructor:a,
+classAsString:"MaterialSwitch",cssClass:"mdl-js-switch",widget:!0});a=function(a){this.element_=a;this.init()};window.MaterialTabs=a;a.prototype.Constant_={};a.prototype.CssClasses_={TAB_CLASS:"mdl-tabs__tab",PANEL_CLASS:"mdl-tabs__panel",ACTIVE_CLASS:"is-active",UPGRADED_CLASS:"is-upgraded",MDL_JS_RIPPLE_EFFECT:"mdl-js-ripple-effect",MDL_RIPPLE_CONTAINER:"mdl-tabs__ripple-container",MDL_RIPPLE:"mdl-ripple",MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events"};a.prototype.initTabs_=
+function(){this.element_.classList.contains(this.CssClasses_.MDL_JS_RIPPLE_EFFECT)&&this.element_.classList.add(this.CssClasses_.MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS);this.tabs_=this.element_.querySelectorAll("."+this.CssClasses_.TAB_CLASS);this.panels_=this.element_.querySelectorAll("."+this.CssClasses_.PANEL_CLASS);for(var a=0;a<this.tabs_.length;a++)new x(this.tabs_[a],this);this.element_.classList.add(this.CssClasses_.UPGRADED_CLASS)};a.prototype.resetTabState_=function(){for(var a=0;a<this.tabs_.length;a++)this.tabs_[a].classList.remove(this.CssClasses_.ACTIVE_CLASS)};
+a.prototype.resetPanelState_=function(){for(var a=0;a<this.panels_.length;a++)this.panels_[a].classList.remove(this.CssClasses_.ACTIVE_CLASS)};a.prototype.init=function(){this.element_&&this.initTabs_()};e.register({constructor:a,classAsString:"MaterialTabs",cssClass:"mdl-js-tabs"});a=function(a){this.element_=a;this.maxRows=this.Constant_.NO_MAX_ROWS;this.init()};window.MaterialTextfield=a;a.prototype.Constant_={NO_MAX_ROWS:-1,MAX_ROWS_ATTRIBUTE:"maxrows"};a.prototype.CssClasses_={LABEL:"mdl-textfield__label",
+INPUT:"mdl-textfield__input",IS_DIRTY:"is-dirty",IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",IS_INVALID:"is-invalid",IS_UPGRADED:"is-upgraded",HAS_PLACEHOLDER:"has-placeholder"};a.prototype.onKeyDown_=function(a){var b=a.target.value.split("\n").length;13===a.keyCode&&b>=this.maxRows&&a.preventDefault()};a.prototype.onFocus_=function(a){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)};a.prototype.onBlur_=function(a){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)};a.prototype.onReset_=
+function(a){this.updateClasses_()};a.prototype.updateClasses_=function(){this.checkDisabled();this.checkValidity();this.checkDirty();this.checkFocus()};a.prototype.checkDisabled=function(){this.input_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)};a.prototype.checkDisabled=a.prototype.checkDisabled;a.prototype.checkFocus=function(){this.element_.querySelector(":focus")?this.element_.classList.add(this.CssClasses_.IS_FOCUSED):
+this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)};a.prototype.checkFocus=a.prototype.checkFocus;a.prototype.checkValidity=function(){this.input_.validity&&(this.input_.validity.valid?this.element_.classList.remove(this.CssClasses_.IS_INVALID):this.element_.classList.add(this.CssClasses_.IS_INVALID))};a.prototype.checkValidity=a.prototype.checkValidity;a.prototype.checkDirty=function(){this.input_.value&&0<this.input_.value.length?this.element_.classList.add(this.CssClasses_.IS_DIRTY):this.element_.classList.remove(this.CssClasses_.IS_DIRTY)};
+a.prototype.checkDirty=a.prototype.checkDirty;a.prototype.disable=function(){this.input_.disabled=!0;this.updateClasses_()};a.prototype.disable=a.prototype.disable;a.prototype.enable=function(){this.input_.disabled=!1;this.updateClasses_()};a.prototype.enable=a.prototype.enable;a.prototype.change=function(a){this.input_.value=a||"";this.updateClasses_()};a.prototype.change=a.prototype.change;a.prototype.init=function(){if(this.element_&&(this.label_=this.element_.querySelector("."+this.CssClasses_.LABEL),
+this.input_=this.element_.querySelector("."+this.CssClasses_.INPUT))){this.input_.hasAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE)&&(this.maxRows=parseInt(this.input_.getAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE),10),isNaN(this.maxRows)&&(this.maxRows=this.Constant_.NO_MAX_ROWS));this.input_.hasAttribute("placeholder")&&this.element_.classList.add(this.CssClasses_.HAS_PLACEHOLDER);this.boundUpdateClassesHandler=this.updateClasses_.bind(this);this.boundFocusHandler=this.onFocus_.bind(this);this.boundBlurHandler=
+this.onBlur_.bind(this);this.boundResetHandler=this.onReset_.bind(this);this.input_.addEventListener("input",this.boundUpdateClassesHandler);this.input_.addEventListener("focus",this.boundFocusHandler);this.input_.addEventListener("blur",this.boundBlurHandler);this.input_.addEventListener("reset",this.boundResetHandler);this.maxRows!==this.Constant_.NO_MAX_ROWS&&(this.boundKeyDownHandler=this.onKeyDown_.bind(this),this.input_.addEventListener("keydown",this.boundKeyDownHandler));var a=this.element_.classList.contains(this.CssClasses_.IS_INVALID);
+this.updateClasses_();this.element_.classList.add(this.CssClasses_.IS_UPGRADED);a&&this.element_.classList.add(this.CssClasses_.IS_INVALID);this.input_.hasAttribute("autofocus")&&(this.element_.focus(),this.checkFocus())}};e.register({constructor:a,classAsString:"MaterialTextfield",cssClass:"mdl-js-textfield",widget:!0});a=function(a){this.element_=a;this.init()};window.MaterialTooltip=a;a.prototype.Constant_={};a.prototype.CssClasses_={IS_ACTIVE:"is-active",BOTTOM:"mdl-tooltip--bottom",LEFT:"mdl-tooltip--left",
+RIGHT:"mdl-tooltip--right",TOP:"mdl-tooltip--top"};a.prototype.handleMouseEnter_=function(a){a=a.target.getBoundingClientRect();var b=a.left+a.width/2,d=a.top+a.height/2,g=this.element_.offsetWidth/2*-1,e=this.element_.offsetHeight/2*-1;this.element_.classList.contains(this.CssClasses_.LEFT)||this.element_.classList.contains(this.CssClasses_.RIGHT)?0>d+e?(this.element_.style.top="0",this.element_.style.marginTop="0"):(this.element_.style.top=d+"px",this.element_.style.marginTop=e+"px"):0>b+g?(this.element_.style.left=
+"0",this.element_.style.marginLeft="0"):(this.element_.style.left=b+"px",this.element_.style.marginLeft=g+"px");this.element_.classList.contains(this.CssClasses_.TOP)?this.element_.style.top=a.top-this.element_.offsetHeight-10+"px":this.element_.classList.contains(this.CssClasses_.RIGHT)?this.element_.style.left=a.left+a.width+10+"px":this.element_.classList.contains(this.CssClasses_.LEFT)?this.element_.style.left=a.left-this.element_.offsetWidth-10+"px":this.element_.style.top=a.top+a.height+10+
+"px";this.element_.classList.add(this.CssClasses_.IS_ACTIVE)};a.prototype.hideTooltip_=function(){this.element_.classList.remove(this.CssClasses_.IS_ACTIVE)};a.prototype.init=function(){if(this.element_){var a=this.element_.getAttribute("for")||this.element_.getAttribute("data-mdl-for");a&&(this.forElement_=document.getElementById(a));this.forElement_&&(this.forElement_.hasAttribute("tabindex")||this.forElement_.setAttribute("tabindex","0"),this.boundMouseEnterHandler=this.handleMouseEnter_.bind(this),
+this.boundMouseLeaveAndScrollHandler=this.hideTooltip_.bind(this),this.forElement_.addEventListener("mouseenter",this.boundMouseEnterHandler,!1),this.forElement_.addEventListener("touchend",this.boundMouseEnterHandler,!1),this.forElement_.addEventListener("mouseleave",this.boundMouseLeaveAndScrollHandler,!1),window.addEventListener("scroll",this.boundMouseLeaveAndScrollHandler,!0),window.addEventListener("touchstart",this.boundMouseLeaveAndScrollHandler))}};e.register({constructor:a,classAsString:"MaterialTooltip",
+cssClass:"mdl-tooltip"});a=function(a){this.element_=a;this.init()};window.MaterialLayout=a;a.prototype.Constant_={MAX_WIDTH:"(max-width: 1024px)",TAB_SCROLL_PIXELS:100,RESIZE_TIMEOUT:100,MENU_ICON:"&#xE5D2;",CHEVRON_LEFT:"chevron_left",CHEVRON_RIGHT:"chevron_right"};a.prototype.Keycodes_={ENTER:13,ESCAPE:27,SPACE:32};a.prototype.Mode_={STANDARD:0,SEAMED:1,WATERFALL:2,SCROLL:3};a.prototype.CssClasses_={CONTAINER:"mdl-layout__container",HEADER:"mdl-layout__header",DRAWER:"mdl-layout__drawer",CONTENT:"mdl-layout__content",
+DRAWER_BTN:"mdl-layout__drawer-button",ICON:"material-icons",JS_RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_CONTAINER:"mdl-layout__tab-ripple-container",RIPPLE:"mdl-ripple",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",HEADER_SEAMED:"mdl-layout__header--seamed",HEADER_WATERFALL:"mdl-layout__header--waterfall",HEADER_SCROLL:"mdl-layout__header--scroll",FIXED_HEADER:"mdl-layout--fixed-header",OBFUSCATOR:"mdl-layout__obfuscator",TAB_BAR:"mdl-layout__tab-bar",TAB_CONTAINER:"mdl-layout__tab-bar-container",
+TAB:"mdl-layout__tab",TAB_BAR_BUTTON:"mdl-layout__tab-bar-button",TAB_BAR_LEFT_BUTTON:"mdl-layout__tab-bar-left-button",TAB_BAR_RIGHT_BUTTON:"mdl-layout__tab-bar-right-button",TAB_MANUAL_SWITCH:"mdl-layout__tab-manual-switch",PANEL:"mdl-layout__tab-panel",HAS_DRAWER:"has-drawer",HAS_TABS:"has-tabs",HAS_SCROLLING_HEADER:"has-scrolling-header",CASTING_SHADOW:"is-casting-shadow",IS_COMPACT:"is-compact",IS_SMALL_SCREEN:"is-small-screen",IS_DRAWER_OPEN:"is-visible",IS_ACTIVE:"is-active",IS_UPGRADED:"is-upgraded",
+IS_ANIMATING:"is-animating",ON_LARGE_SCREEN:"mdl-layout--large-screen-only",ON_SMALL_SCREEN:"mdl-layout--small-screen-only"};a.prototype.contentScrollHandler_=function(){if(!this.header_.classList.contains(this.CssClasses_.IS_ANIMATING)){var a=!this.element_.classList.contains(this.CssClasses_.IS_SMALL_SCREEN)||this.element_.classList.contains(this.CssClasses_.FIXED_HEADER);0<this.content_.scrollTop&&!this.header_.classList.contains(this.CssClasses_.IS_COMPACT)?(this.header_.classList.add(this.CssClasses_.CASTING_SHADOW),
+this.header_.classList.add(this.CssClasses_.IS_COMPACT),a&&this.header_.classList.add(this.CssClasses_.IS_ANIMATING)):0>=this.content_.scrollTop&&this.header_.classList.contains(this.CssClasses_.IS_COMPACT)&&(this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW),this.header_.classList.remove(this.CssClasses_.IS_COMPACT),a&&this.header_.classList.add(this.CssClasses_.IS_ANIMATING))}};a.prototype.keyboardEventHandler_=function(a){a.keyCode===this.Keycodes_.ESCAPE&&this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)&&
+this.toggleDrawer()};a.prototype.screenSizeHandler_=function(){this.screenSizeMediaQuery_.matches?this.element_.classList.add(this.CssClasses_.IS_SMALL_SCREEN):(this.element_.classList.remove(this.CssClasses_.IS_SMALL_SCREEN),this.drawer_&&(this.drawer_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN),this.obfuscator_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN)))};a.prototype.drawerToggleHandler_=function(a){if(a&&"keydown"===a.type)if(a.keyCode===this.Keycodes_.SPACE||a.keyCode===this.Keycodes_.ENTER)a.preventDefault();
+else return;this.toggleDrawer()};a.prototype.headerTransitionEndHandler_=function(){this.header_.classList.remove(this.CssClasses_.IS_ANIMATING)};a.prototype.headerClickHandler_=function(){this.header_.classList.contains(this.CssClasses_.IS_COMPACT)&&(this.header_.classList.remove(this.CssClasses_.IS_COMPACT),this.header_.classList.add(this.CssClasses_.IS_ANIMATING))};a.prototype.resetTabState_=function(a){for(var b=0;b<a.length;b++)a[b].classList.remove(this.CssClasses_.IS_ACTIVE)};a.prototype.resetPanelState_=
+function(a){for(var b=0;b<a.length;b++)a[b].classList.remove(this.CssClasses_.IS_ACTIVE)};a.prototype.toggleDrawer=function(){var a=this.element_.querySelector("."+this.CssClasses_.DRAWER_BTN);this.drawer_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);this.obfuscator_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)?(this.drawer_.setAttribute("aria-hidden","false"),a.setAttribute("aria-expanded","true")):(this.drawer_.setAttribute("aria-hidden",
+"true"),a.setAttribute("aria-expanded","false"))};a.prototype.toggleDrawer=a.prototype.toggleDrawer;a.prototype.init=function(){if(this.element_){var a=document.createElement("div");a.classList.add(this.CssClasses_.CONTAINER);var c=this.element_.querySelector(":focus");this.element_.parentElement.insertBefore(a,this.element_);this.element_.parentElement.removeChild(this.element_);a.appendChild(this.element_);c&&c.focus();c=this.element_.childNodes;for(var d=c.length,e=0;e<d;e++){var f=c[e];f.classList&&
+f.classList.contains(this.CssClasses_.HEADER)&&(this.header_=f);f.classList&&f.classList.contains(this.CssClasses_.DRAWER)&&(this.drawer_=f);f.classList&&f.classList.contains(this.CssClasses_.CONTENT)&&(this.content_=f)}window.addEventListener("pageshow",function(a){a.persisted&&(this.element_.style.overflowY="hidden",requestAnimationFrame(function(){this.element_.style.overflowY=""}.bind(this)))}.bind(this),!1);this.header_&&(this.tabBar_=this.header_.querySelector("."+this.CssClasses_.TAB_BAR));
+c=this.Mode_.STANDARD;this.header_&&(this.header_.classList.contains(this.CssClasses_.HEADER_SEAMED)?c=this.Mode_.SEAMED:this.header_.classList.contains(this.CssClasses_.HEADER_WATERFALL)?(c=this.Mode_.WATERFALL,this.header_.addEventListener("transitionend",this.headerTransitionEndHandler_.bind(this)),this.header_.addEventListener("click",this.headerClickHandler_.bind(this))):this.header_.classList.contains(this.CssClasses_.HEADER_SCROLL)&&(c=this.Mode_.SCROLL,a.classList.add(this.CssClasses_.HAS_SCROLLING_HEADER)),
+c===this.Mode_.STANDARD?(this.header_.classList.add(this.CssClasses_.CASTING_SHADOW),this.tabBar_&&this.tabBar_.classList.add(this.CssClasses_.CASTING_SHADOW)):c===this.Mode_.SEAMED||c===this.Mode_.SCROLL?(this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW),this.tabBar_&&this.tabBar_.classList.remove(this.CssClasses_.CASTING_SHADOW)):c===this.Mode_.WATERFALL&&(this.content_.addEventListener("scroll",this.contentScrollHandler_.bind(this)),this.contentScrollHandler_()));this.drawer_&&(a=
+this.element_.querySelector("."+this.CssClasses_.DRAWER_BTN),a||(a=document.createElement("div"),a.setAttribute("aria-expanded","false"),a.setAttribute("role","button"),a.setAttribute("tabindex","0"),a.classList.add(this.CssClasses_.DRAWER_BTN),c=document.createElement("i"),c.classList.add(this.CssClasses_.ICON),c.innerHTML=this.Constant_.MENU_ICON,a.appendChild(c)),this.drawer_.classList.contains(this.CssClasses_.ON_LARGE_SCREEN)?a.classList.add(this.CssClasses_.ON_LARGE_SCREEN):this.drawer_.classList.contains(this.CssClasses_.ON_SMALL_SCREEN)&&
+a.classList.add(this.CssClasses_.ON_SMALL_SCREEN),a.addEventListener("click",this.drawerToggleHandler_.bind(this)),a.addEventListener("keydown",this.drawerToggleHandler_.bind(this)),this.element_.classList.add(this.CssClasses_.HAS_DRAWER),this.element_.classList.contains(this.CssClasses_.FIXED_HEADER)?this.header_.insertBefore(a,this.header_.firstChild):this.element_.insertBefore(a,this.content_),a=document.createElement("div"),a.classList.add(this.CssClasses_.OBFUSCATOR),this.element_.appendChild(a),
+a.addEventListener("click",this.drawerToggleHandler_.bind(this)),this.obfuscator_=a,this.drawer_.addEventListener("keydown",this.keyboardEventHandler_.bind(this)),this.drawer_.setAttribute("aria-hidden","true"));this.screenSizeMediaQuery_=window.matchMedia(this.Constant_.MAX_WIDTH);this.screenSizeMediaQuery_.addListener(this.screenSizeHandler_.bind(this));this.screenSizeHandler_();if(this.header_&&this.tabBar_){this.element_.classList.add(this.CssClasses_.HAS_TABS);a=document.createElement("div");
+a.classList.add(this.CssClasses_.TAB_CONTAINER);this.header_.insertBefore(a,this.tabBar_);this.header_.removeChild(this.tabBar_);var n=document.createElement("div");n.classList.add(this.CssClasses_.TAB_BAR_BUTTON);n.classList.add(this.CssClasses_.TAB_BAR_LEFT_BUTTON);c=document.createElement("i");c.classList.add(this.CssClasses_.ICON);c.textContent=this.Constant_.CHEVRON_LEFT;n.appendChild(c);n.addEventListener("click",function(){this.tabBar_.scrollLeft-=this.Constant_.TAB_SCROLL_PIXELS}.bind(this));
+var h=document.createElement("div");h.classList.add(this.CssClasses_.TAB_BAR_BUTTON);h.classList.add(this.CssClasses_.TAB_BAR_RIGHT_BUTTON);c=document.createElement("i");c.classList.add(this.CssClasses_.ICON);c.textContent=this.Constant_.CHEVRON_RIGHT;h.appendChild(c);h.addEventListener("click",function(){this.tabBar_.scrollLeft+=this.Constant_.TAB_SCROLL_PIXELS}.bind(this));a.appendChild(n);a.appendChild(this.tabBar_);a.appendChild(h);var k=function(){0<this.tabBar_.scrollLeft?n.classList.add(this.CssClasses_.IS_ACTIVE):
+n.classList.remove(this.CssClasses_.IS_ACTIVE);this.tabBar_.scrollLeft<this.tabBar_.scrollWidth-this.tabBar_.offsetWidth?h.classList.add(this.CssClasses_.IS_ACTIVE):h.classList.remove(this.CssClasses_.IS_ACTIVE)}.bind(this);this.tabBar_.addEventListener("scroll",k);k();a=function(){this.resizeTimeoutId_&&clearTimeout(this.resizeTimeoutId_);this.resizeTimeoutId_=setTimeout(function(){k();this.resizeTimeoutId_=null}.bind(this),this.Constant_.RESIZE_TIMEOUT)}.bind(this);window.addEventListener("resize",
+a);this.tabBar_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)&&this.tabBar_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);a=this.tabBar_.querySelectorAll("."+this.CssClasses_.TAB);c=this.content_.querySelectorAll("."+this.CssClasses_.PANEL);for(d=0;d<a.length;d++)new v(a[d],a,c,this)}this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}};window.MaterialLayoutTab=v;e.register({constructor:a,classAsString:"MaterialLayout",cssClass:"mdl-js-layout"});a=function(a){this.element_=a;
+this.init()};window.MaterialDataTable=a;a.prototype.Constant_={};a.prototype.CssClasses_={DATA_TABLE:"mdl-data-table",SELECTABLE:"mdl-data-table--selectable",SELECT_ELEMENT:"mdl-data-table__select",IS_SELECTED:"is-selected",IS_UPGRADED:"is-upgraded"};a.prototype.selectRow_=function(a,c,d){if(c)return function(){a.checked?c.classList.add(this.CssClasses_.IS_SELECTED):c.classList.remove(this.CssClasses_.IS_SELECTED)}.bind(this);if(d)return function(){var b;if(a.checked)for(b=0;b<d.length;b++){var c=
+d[b].querySelector("td").querySelector(".mdl-checkbox");c.MaterialCheckbox.check();d[b].classList.add(this.CssClasses_.IS_SELECTED)}else for(b=0;b<d.length;b++)c=d[b].querySelector("td").querySelector(".mdl-checkbox"),c.MaterialCheckbox.uncheck(),d[b].classList.remove(this.CssClasses_.IS_SELECTED)}.bind(this)};a.prototype.createCheckbox_=function(a,c){var b=document.createElement("label");b.className=["mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect",this.CssClasses_.SELECT_ELEMENT].join(" ");var f=
+document.createElement("input");f.type="checkbox";f.classList.add("mdl-checkbox__input");a?(f.checked=a.classList.contains(this.CssClasses_.IS_SELECTED),f.addEventListener("change",this.selectRow_(f,a))):c&&f.addEventListener("change",this.selectRow_(f,null,c));b.appendChild(f);e.upgradeElement(b,"MaterialCheckbox");return b};a.prototype.init=function(){if(this.element_){var a=this.element_.querySelector("th"),c=Array.prototype.slice.call(this.element_.querySelectorAll("tbody tr")),d=Array.prototype.slice.call(this.element_.querySelectorAll("tfoot tr"));
+c=c.concat(d);if(this.element_.classList.contains(this.CssClasses_.SELECTABLE)){d=document.createElement("th");var e=this.createCheckbox_(null,c);d.appendChild(e);a.parentElement.insertBefore(d,a);for(a=0;a<c.length;a++)if(d=c[a].querySelector("td")){e=document.createElement("td");if("TBODY"===c[a].parentNode.nodeName.toUpperCase()){var f=this.createCheckbox_(c[a]);e.appendChild(f)}c[a].insertBefore(e,d)}this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}}};e.register({constructor:a,classAsString:"MaterialDataTable",
+cssClass:"mdl-js-data-table"});a=function(a){this.element_=a;this.init()};window.MaterialRipple=a;a.prototype.Constant_={INITIAL_SCALE:"scale(0.0001, 0.0001)",INITIAL_SIZE:"1px",INITIAL_OPACITY:"0.4",FINAL_OPACITY:"0",FINAL_SCALE:""};a.prototype.CssClasses_={RIPPLE_CENTER:"mdl-ripple--center",RIPPLE_EFFECT_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE:"mdl-ripple",IS_ANIMATING:"is-animating",IS_VISIBLE:"is-visible"};a.prototype.downHandler_=function(a){if(!this.rippleElement_.style.width&&
+!this.rippleElement_.style.height){var b=this.element_.getBoundingClientRect();this.boundHeight=b.height;this.boundWidth=b.width;this.rippleSize_=2*Math.sqrt(b.width*b.width+b.height*b.height)+2;this.rippleElement_.style.width=this.rippleSize_+"px";this.rippleElement_.style.height=this.rippleSize_+"px"}this.rippleElement_.classList.add(this.CssClasses_.IS_VISIBLE);if("mousedown"===a.type&&this.ignoringMouseDown_)this.ignoringMouseDown_=!1;else if("touchstart"===a.type&&(this.ignoringMouseDown_=!0),
+!(0<this.getFrameCount())){this.setFrameCount(1);b=a.currentTarget.getBoundingClientRect();if(0===a.clientX&&0===a.clientY)a=Math.round(b.width/2),b=Math.round(b.height/2);else{var d=void 0!==a.clientY?a.clientY:a.touches[0].clientY;a=Math.round((void 0!==a.clientX?a.clientX:a.touches[0].clientX)-b.left);b=Math.round(d-b.top)}this.setRippleXY(a,b);this.setRippleStyles(!0);window.requestAnimationFrame(this.animFrameHandler.bind(this))}};a.prototype.upHandler_=function(a){a&&2!==a.detail&&window.setTimeout(function(){this.rippleElement_.classList.remove(this.CssClasses_.IS_VISIBLE)}.bind(this),
+0)};a.prototype.init=function(){if(this.element_){var a=this.element_.classList.contains(this.CssClasses_.RIPPLE_CENTER);this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT_IGNORE_EVENTS)||(this.rippleElement_=this.element_.querySelector("."+this.CssClasses_.RIPPLE),this.y_=this.x_=this.rippleSize_=this.frameCount_=0,this.ignoringMouseDown_=!1,this.boundDownHandler=this.downHandler_.bind(this),this.element_.addEventListener("mousedown",this.boundDownHandler),this.element_.addEventListener("touchstart",
+this.boundDownHandler),this.boundUpHandler=this.upHandler_.bind(this),this.element_.addEventListener("mouseup",this.boundUpHandler),this.element_.addEventListener("mouseleave",this.boundUpHandler),this.element_.addEventListener("touchend",this.boundUpHandler),this.element_.addEventListener("blur",this.boundUpHandler),this.getFrameCount=function(){return this.frameCount_},this.setFrameCount=function(a){this.frameCount_=a},this.getRippleElement=function(){return this.rippleElement_},this.setRippleXY=
+function(a,b){this.x_=a;this.y_=b},this.setRippleStyles=function(b){if(null!==this.rippleElement_){var c="translate("+this.x_+"px, "+this.y_+"px)";if(b)var e=this.Constant_.INITIAL_SCALE;else e=this.Constant_.FINAL_SCALE,a&&(c="translate("+this.boundWidth/2+"px, "+this.boundHeight/2+"px)");e="translate(-50%, -50%) "+c+e;this.rippleElement_.style.webkitTransform=e;this.rippleElement_.style.msTransform=e;this.rippleElement_.style.transform=e;b?this.rippleElement_.classList.remove(this.CssClasses_.IS_ANIMATING):
+this.rippleElement_.classList.add(this.CssClasses_.IS_ANIMATING)}},this.animFrameHandler=function(){0<this.frameCount_--?window.requestAnimationFrame(this.animFrameHandler.bind(this)):this.setRippleStyles(!1)})}};e.register({constructor:a,classAsString:"MaterialRipple",cssClass:"mdl-js-ripple-effect",widget:!1})})();
diff --git a/app/modules/web/themes/material-dark/js/mdl-jquery-modal-dialog.js b/app/modules/web/themes/material-dark/js/mdl-jquery-modal-dialog.js
new file mode 100644
index 000000000..14d5193f9
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/mdl-jquery-modal-dialog.js
@@ -0,0 +1,122 @@
+const mdlDialog = function () {
+    function showDialog(options) {
+        options = $.extend({
+            id: 'orrsDiag',
+            title: null,
+            text: null,
+            neutral: false,
+            negative: false,
+            positive: false,
+            cancelable: true,
+            contentStyle: null,
+            onLoaded: false,
+            hideOther: true
+        }, options);
+
+        if (options.hideOther) {
+            // remove existing dialogs
+            $('.dialog-container').remove();
+            $(document).off("keyup.dialog");
+        }
+
+        $('<div id="' + options.id + '" class="dialog-container"><div class="mdl-card mdl-shadow--16dp" id="' + options.id + '_content"></div></div>').appendTo("body");
+        const dialog = $('#' + options.id);
+        const content = dialog.find('.mdl-card');
+        if (options.contentStyle !== null) {
+            content.css(options.contentStyle);
+        }
+
+        if (options.title !== null) {
+            $('<header>' + options.title + '</header>').appendTo(content);
+        }
+
+        if (options.text !== null) {
+            $(options.text).appendTo(content);
+        }
+
+        if (options.neutral || options.negative || options.positive) {
+            const buttonBar = $('<div class="mdl-card__actions dialog-button-bar"></div>');
+            if (options.neutral) {
+                options.neutral = $.extend({
+                    id: 'neutral',
+                    title: 'Neutral',
+                    onClick: null
+                }, options.neutral);
+                var neuButton = $('<button class="mdl-button mdl-js-button mdl-js-ripple-effect" id="' + options.neutral.id + '">' + options.neutral.title + '</button>');
+                neuButton.click(function (e) {
+                    e.preventDefault();
+                    if (options.neutral.onClick === null || !options.neutral.onClick(e)) {
+                        hideDialog(dialog);
+                    }
+                });
+                neuButton.appendTo(buttonBar);
+            }
+            if (options.negative) {
+                options.negative = $.extend({
+                    id: 'negative',
+                    title: 'Cancel',
+                    onClick: null
+                }, options.negative);
+                var negButton = $('<button class="mdl-button mdl-js-button mdl-js-ripple-effect" id="' + options.negative.id + '">' + options.negative.title + '</button>');
+                negButton.click(function (e) {
+                    e.preventDefault();
+                    if (options.negative.onClick === null || !options.negative.onClick(e)) {
+                        hideDialog(dialog);
+                    }
+                });
+                negButton.appendTo(buttonBar);
+            }
+            if (options.positive) {
+                options.positive = $.extend({
+                    id: 'positive',
+                    title: 'OK',
+                    onClick: null
+                }, options.positive);
+                var posButton = $('<button class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" id="' + options.positive.id + '">' + options.positive.title + '</button>');
+                posButton.click(function (e) {
+                    e.preventDefault();
+                    if (options.positive.onClick === null || !options.positive.onClick(e)) {
+                        hideDialog(dialog);
+                    }
+                });
+                posButton.appendTo(buttonBar);
+            }
+            buttonBar.appendTo(content);
+        }
+
+        if (options.cancelable) {
+            dialog.click(function () {
+                hideDialog(dialog);
+            });
+            $(document).on("keyup.dialog", function (e) {
+                if (e.which === 27) {
+                    hideDialog(dialog);
+                }
+            });
+            content.click(function (e) {
+                e.stopPropagation();
+            });
+        }
+        setTimeout(function () {
+            if (options.onLoaded) {
+                options.onLoaded();
+            }
+
+            componentHandler.upgradeDom();
+            dialog.css({opacity: 1});
+        }, 1);
+    }
+
+    function hideDialog(dialog) {
+        $(document).off("keyup.dialog");
+        dialog.css({opacity: 0});
+        setTimeout(function () {
+            dialog.remove();
+        }, 400);
+    }
+
+    return {
+        show: showDialog,
+        hide: hideDialog
+    };
+};
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/js/mdl-jquery-modal-dialog.map b/app/modules/web/themes/material-dark/js/mdl-jquery-modal-dialog.map
new file mode 100644
index 000000000..f3f9c38db
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/mdl-jquery-modal-dialog.map
@@ -0,0 +1,8 @@
+{
+"version":3,
+"file":"mdl-jquery-modal-dialog.min.js",
+"lineCount":7,
+"mappings":"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",
+"sources":[" [synthetic:base] "," [synthetic:util/findinternal] "," [synthetic:util/defineproperty] "," [synthetic:util/global] "," [synthetic:util/polyfill] "," [synthetic:es6/array/find] ","mdl-jquery-modal-dialog.js"],
+"names":["mdlDialog","hideDialog","dialog","$","document","off","css","opacity","setTimeout","remove","show","showDialog","options","extend","id","title","text","neutral","negative","positive","cancelable","contentStyle","onLoaded","hideOther","appendTo","content","find","buttonBar","onClick","neuButton","click","e","preventDefault","negButton","posButton","on","which","stopPropagation","componentHandler","upgradeDom","hide"]
+}
diff --git a/app/modules/web/themes/material-dark/js/mdl-jquery-modal-dialog.min.js b/app/modules/web/themes/material-dark/js/mdl-jquery-modal-dialog.min.js
new file mode 100644
index 000000000..0b159c392
--- /dev/null
+++ b/app/modules/web/themes/material-dark/js/mdl-jquery-modal-dialog.min.js
@@ -0,0 +1,8 @@
+var $jscomp=$jscomp||{};$jscomp.scope={};$jscomp.findInternal=function(b,a,d){b instanceof String&&(b=String(b));for(var c=b.length,e=0;e<c;e++){var f=b[e];if(a.call(d,f,e,b))return{i:e,v:f}}return{i:-1,v:void 0}};$jscomp.ASSUME_ES5=!1;$jscomp.ASSUME_NO_NATIVE_MAP=!1;$jscomp.ASSUME_NO_NATIVE_SET=!1;$jscomp.defineProperty=$jscomp.ASSUME_ES5||"function"==typeof Object.defineProperties?Object.defineProperty:function(b,a,d){b!=Array.prototype&&b!=Object.prototype&&(b[a]=d.value)};
+$jscomp.getGlobal=function(b){return"undefined"!=typeof window&&window===b?b:"undefined"!=typeof global&&null!=global?global:b};$jscomp.global=$jscomp.getGlobal(this);$jscomp.polyfill=function(b,a,d,c){if(a){d=$jscomp.global;b=b.split(".");for(c=0;c<b.length-1;c++){var e=b[c];e in d||(d[e]={});d=d[e]}b=b[b.length-1];c=d[b];a=a(c);a!=c&&null!=a&&$jscomp.defineProperty(d,b,{configurable:!0,writable:!0,value:a})}};
+$jscomp.polyfill("Array.prototype.find",function(b){return b?b:function(a,b){return $jscomp.findInternal(this,a,b).v}},"es6","es3");
+var mdlDialog=function(){function b(a){$(document).off("keyup.dialog");a.css({opacity:0});setTimeout(function(){a.remove()},400)}return{show:function(a){a=$.extend({id:"orrsDiag",title:null,text:null,neutral:!1,negative:!1,positive:!1,cancelable:!0,contentStyle:null,onLoaded:!1,hideOther:!0},a);a.hideOther&&($(".dialog-container").remove(),$(document).off("keyup.dialog"));$('<div id="'+a.id+'" class="dialog-container"><div class="mdl-card mdl-shadow--16dp" id="'+a.id+'_content"></div></div>').appendTo("body");
+var d=$("#"+a.id),c=d.find(".mdl-card");null!==a.contentStyle&&c.css(a.contentStyle);null!==a.title&&$("<header>"+a.title+"</header>").appendTo(c);null!==a.text&&$(a.text).appendTo(c);if(a.neutral||a.negative||a.positive){var e=$('<div class="mdl-card__actions dialog-button-bar"></div>');if(a.neutral){a.neutral=$.extend({id:"neutral",title:"Neutral",onClick:null},a.neutral);var f=$('<button class="mdl-button mdl-js-button mdl-js-ripple-effect" id="'+a.neutral.id+'">'+a.neutral.title+"</button>");
+f.click(function(c){c.preventDefault();null!==a.neutral.onClick&&a.neutral.onClick(c)||b(d)});f.appendTo(e)}a.negative&&(a.negative=$.extend({id:"negative",title:"Cancel",onClick:null},a.negative),f=$('<button class="mdl-button mdl-js-button mdl-js-ripple-effect" id="'+a.negative.id+'">'+a.negative.title+"</button>"),f.click(function(c){c.preventDefault();null!==a.negative.onClick&&a.negative.onClick(c)||b(d)}),f.appendTo(e));a.positive&&(a.positive=$.extend({id:"positive",title:"OK",onClick:null},
+a.positive),f=$('<button class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" id="'+a.positive.id+'">'+a.positive.title+"</button>"),f.click(function(c){c.preventDefault();null!==a.positive.onClick&&a.positive.onClick(c)||b(d)}),f.appendTo(e));e.appendTo(c)}a.cancelable&&(d.click(function(){b(d)}),$(document).on("keyup.dialog",function(a){27===a.which&&b(d)}),c.click(function(a){a.stopPropagation()}));setTimeout(function(){if(a.onLoaded)a.onLoaded();componentHandler.upgradeDom();
+d.css({opacity:1})},1)},hide:b}};
diff --git a/app/modules/web/themes/material-dark/views/_layouts/main.inc b/app/modules/web/themes/material-dark/views/_layouts/main.inc
new file mode 100644
index 000000000..5287ff635
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/_layouts/main.inc
@@ -0,0 +1,67 @@
+<?php
+/**
+ * @var callable $_getvar
+ * @var Template $this
+ */
+
+use SP\Mvc\View\Template;
+
+?>
+<!DOCTYPE html>
+<html lang="<?php echo $_getvar('lang'); ?>">
+<head>
+    <title><?php printf('%s :: %s', $_getvar('app_name'), $_getvar('app_desc')); ?></title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" type="image/png"
+          href="<?php echo $_getvar('logo_icon'); ?>">
+    <?php foreach ($_getvar('cssLinks') as $cssLink): ?>
+        <link rel="stylesheet" href="<?php echo $cssLink; ?>"/>
+    <?php endforeach; ?>
+</head>
+<body class="<?php echo $_getvar('page'); ?>">
+<div id="wrap">
+    <noscript>
+        <div id="nojs"><?php echo __('Javascript is needed in order to run correctly'); ?></div>
+    </noscript>
+
+    <div id="wrap-loading">
+        <div id="loading"
+             class="mdl-spinner mdl-spinner--single-color mdl-js-spinner"></div>
+        <div id="taskStatus"></div>
+    </div>
+
+    <div id="container" class="<?php echo $_getvar('page'); ?>"
+         data-page="<?php echo $_getvar('page'); ?>"
+         data-upgraded="<?php echo (int)$this->isUpgraded(); ?>">
+        <?php
+        if ($_getvar('useFixedHeader')):
+            include $this->includePartial('fixed-header');
+        elseif ($this->hashContentTemplates()):
+            foreach ($this->getContentTemplates() as $template):
+                include $template;
+            endforeach;
+        endif;
+        ?>
+    </div> <!-- Close container -->
+
+    <?php include $this->includePartial('footer'); ?>
+</div> <!-- Close wrap -->
+
+<?php foreach ($_getvar('jsLinks') as $jsLink): ?>
+    <script type="text/javascript" src="<?php echo $jsLink; ?>"></script>
+<?php endforeach; ?>
+
+<script type="text/javascript">
+    $(document).ready(function (e) {
+        "use strict";
+
+        sysPassApp.log.info("ready");
+
+        sysPassApp.sk.set("<?php echo $_getvar('sk'); ?>");
+    });
+</script>
+
+</body> <!-- Close BODY...almost done..go..go..go -->
+</html> <!-- Close HTML...ufff too much work!! :)) -->
+<!-- Insert coin . . . -->
diff --git a/app/modules/web/themes/material-dark/views/_partials/error-full.inc b/app/modules/web/themes/material-dark/views/_partials/error-full.inc
new file mode 100644
index 000000000..ffe1884bd
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/_partials/error-full.inc
@@ -0,0 +1,9 @@
+<main class="mdl-layout__content">
+    <div id="content">
+        <?php /** @var Template $this */
+
+        use SP\Mvc\View\Template;
+
+        include $this->includePartial('error'); ?>
+    </div>
+</main>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/_partials/error-list.inc b/app/modules/web/themes/material-dark/views/_partials/error-list.inc
new file mode 100644
index 000000000..1848efc22
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/_partials/error-list.inc
@@ -0,0 +1,49 @@
+<?php
+/**
+ * @var callable $_getvar
+ * @var Template $this
+ */
+
+use SP\Core\Exceptions\SPException;
+use SP\Mvc\View\Template;
+
+?>
+<?php if (count($_getvar('errors')) > 0): ?>
+    <ul class="errors round">
+        <?php foreach ($_getvar('errors') as $err): ?>
+            <?php if (is_array($err)): ?>
+                <?php if ($err['type'] === SPException::CRITICAL): ?>
+                    <li class="msg-critical">
+                        <i class="material-icons <?php echo $icons->getIconCritical()->getClass(); ?>"><?php echo $icons->getIconCritical()->getIcon(); ?></i>
+                        <strong><?php echo $err['description']; ?></strong>
+                        <?php if ($err['hint']): ?>
+                            <p class="hint">
+                                <?php echo $err['hint']; ?>
+                            </p>
+                        <?php endif; ?>
+                    </li>
+                <?php elseif ($err['type'] === SPException::WARNING): ?>
+                    <li class="msg-warning">
+                        <i class="material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></i>
+                        <strong><?php echo $err['description']; ?></strong>
+                        <?php if ($err['hint']): ?>
+                            <p class="hint">
+                                <?php echo $err['hint']; ?>
+                            </p>
+                        <?php endif; ?>
+                    </li>
+                <?php else: ?>
+                    <li class="msg-ok">
+                        <strong><?php echo $err['description']; ?></strong>
+                        <?php if ($err['hint']): ?>
+                            <i class="material-icons <?php echo $icons->getIconInfo()->getClass(); ?>"><?php echo $icons->getIconInfo()->getIcon(); ?></i>
+                            <p class="hint">
+                                <?php echo $err['hint']; ?>
+                            </p>
+                        <?php endif; ?>
+                    </li>
+                <?php endif; ?>
+            <?php endif; ?>
+        <?php endforeach; ?>
+    </ul>
+<?php endif; ?>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/_partials/error.inc b/app/modules/web/themes/material-dark/views/_partials/error.inc
new file mode 100644
index 000000000..6b5eaa504
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/_partials/error.inc
@@ -0,0 +1,23 @@
+<?php
+/**
+ * @var callable $_getvar
+ * @var Template $this
+ */
+
+use SP\Mvc\View\Template;
+
+?>
+<div id="actions" align="center">
+    <?php include $this->includePartial('error-list'); ?>
+
+    <?php if (!$_getvar('skipBackButton')): ?>
+        <div class="buttons">
+            <button id="btnBack"
+                    class="btn-back mdl-button mdl-js-button mdl-button--raised mdl-button--accent">
+                <i class="material-icons"
+                   title="<?php echo __('Back'); ?>"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+                <?php echo __('Back'); ?>
+            </button>
+        </div>
+    <?php endif; ?>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/_partials/fixed-header.inc b/app/modules/web/themes/material-dark/views/_partials/fixed-header.inc
new file mode 100644
index 000000000..f3bb3baa3
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/_partials/fixed-header.inc
@@ -0,0 +1,198 @@
+<?php
+/**
+ * @var callable $_getvar
+ * @var Template $this
+ */
+
+use SP\Html\Assets\IconInterface;
+use SP\Html\DataGrid\Action\DataGridAction;
+use SP\Mvc\View\Template;
+
+?>
+<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header mdl-layout--no-desktop-drawer-button">
+    <header class="mdl-layout__header mdl-color--indigo-400">
+        <div class="mdl-layout__header-row">
+            <!-- Title -->
+            <span class="mdl-layout-icon">
+                <img class="logo btn-menu"
+                     src="<?php echo $_getvar('logo_no_bg_color'); ?>"
+                     alt="logo"
+                     data-route="<?php echo $_getvar('homeRoute'); ?>"
+                     data-view="search"
+                     data-historyReset="1"/>
+            </span>
+
+            <?php if ($_getvar('useMenu') && $_getvar('loggedIn')): ?>
+                <!-- Add spacer, to align navigation to the right -->
+                <div class="mdl-layout-spacer"></div>
+                <!-- Navigation -->
+                <nav class="mdl-navigation mdl-layout--large-screen-only">
+                    <?php /** @var DataGridAction $action */
+                    foreach ($_getvar('actions') as $action): ?>
+                        <a id="btn-<?php echo $action->getId(); ?>"
+                           class="btn-menu mdl-navigation__link"
+                            <?php foreach ($action->getData() as $dataName => $dataValue): ?>
+                                <?php echo 'data-', $dataName, '="', $dataValue, '"'; ?>
+                            <?php endforeach; ?>>
+                            <i class="material-icons"><?php echo $action->getIcon()->getIcon(); ?></i>
+                        </a>
+                        <span for="btn-<?php echo $action->getId(); ?>"
+                              class="mdl-tooltip mdl-tooltip--bottom"><?php echo $action->getTitle(); ?></span>
+                    <?php endforeach; ?>
+
+                    <a id="notifications" class="btn-menu mdl-navigation__link"
+                       data-route="notification/index"
+                       data-historyreset="1"
+                       data-view="notifications">
+                        <i class="material-icons mdl-badge mdl-badge--overlap notifications-badge"
+                           data-badge="0"
+                           data-color-class="mdl-color-text--amber-200">notifications</i>
+                    </a>
+
+                    <span for="notifications"
+                          class="mdl-tooltip mdl-tooltip--bottom notifications-tooltip">
+                    </span>
+
+                    <!-- User's menu -->
+                    <!-- Right aligned menu below button -->
+                    <button id="users-menu-lower-right"
+                            class="mdl-button mdl-js-button mdl-button--icon">
+                        <i class="material-icons">more_vert</i>
+                    </button>
+
+                    <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
+                        for="users-menu-lower-right">
+                        <?php if ($_getvar('showPassIcon')): ?>
+                            <li id="btnUserPass"
+                                class="btn-action mdl-menu__item"
+                                data-onclick="appMgmt/show"
+                                data-action-route="user/editPass"
+                                data-item-id="<?php echo $_getvar('ctx_userId'); ?>"
+                                data-sk="<?php echo $_getvar('sk'); ?>">
+                                <i class="material-icons">lock</i>
+                                <?php echo __('Change User\'s Password'); ?>
+                            </li>
+                        <?php endif; ?>
+                        <li id="btnPrefs" class="btn-action mdl-menu__item"
+                            data-onclick="user/showSettings"
+                            data-action-route="userSettingsManager/index">
+                            <i class="material-icons">account_circle</i>
+                            <?php echo __('User preferences'); ?>
+                        </li>
+                        <li class="mdl-menu__item--full-bleed-divider"></li>
+                        <li class="btn-action mdl-menu__item"
+                            title="<?php echo __('Sign Out'); ?>"
+                            data-onclick="main/logout">
+                            <i class="material-icons">exit_to_app</i>
+                            <?php echo __('Sign Out'); ?>
+                        </li>
+                    </ul>
+                </nav>
+            <?php endif; ?>
+        </div>
+    </header>
+
+    <?php if ($_getvar('useMenu') && $_getvar('loggedIn')): ?>
+        <div class="mdl-layout__drawer">
+            <span class="mdl-layout-title"><?php echo $_getvar('app_name'); ?></span>
+            <nav class="mdl-navigation">
+                <?php /** @var DataGridAction $action */
+                foreach ($_getvar('actions') as $action): ?>
+                    <a id="btn-drawer-<?php echo $action->getId(); ?>"
+                       class="btn-menu mdl-navigation__link"
+                        <?php foreach ($action->getData() as $dataName => $dataValue): ?>
+                            <?php echo 'data-', $dataName, '="', $dataValue, '"'; ?>
+                        <?php endforeach; ?>>
+                        <i class="material-icons"><?php echo $action->getIcon()->getIcon(); ?></i>
+                        <?php echo $action->getTitle(); ?>
+                    </a>
+                <?php endforeach; ?>
+
+                <a id="notifications-drawer"
+                   class="btn-menu mdl-navigation__link"
+                   data-route="notification/index"
+                   data-historyreset="1"
+                   data-view="notifications">
+                    <i class="material-icons mdl-badge mdl-badge--overlap notifications-badge"
+                       data-badge="0"
+                       data-color-class="mdl-color-text--amber-200">notifications</i>
+                    <?php echo __('Notifications'); ?>
+                </a>
+
+                <span for="notifications-drawer"
+                      class="mdl-tooltip mdl-tooltip--bottom notifications-tooltip">
+                </span>
+
+                <span class="mdl-menu__item--full-bleed-divider"></span>
+
+                <?php if ($_getvar('showPassIcon')): ?>
+                    <a class="btn-action mdl-navigation__link"
+                       title="<?php echo __('Change User\'s Password'); ?>"
+                       data-onclick="appMgmt/show"
+                       data-action-route="user/editPass"
+                       data-item-id="<?php echo $_getvar('ctx_userId'); ?>"
+                       data-sk="<?php echo $_getvar('sk'); ?>">
+                        <i class="btn-action material-icons">security</i>
+                        <?php echo __('Change User\'s Password'); ?>
+                    </a>
+                <?php endif; ?>
+
+                <a class="btn-action mdl-navigation__link"
+                   title="<?php echo __('User preferences'); ?>"
+                   data-onclick="user/showSettings"
+                   data-action-route="userSettingsManager/index">
+                    <i class="btn-action material-icons">account_circle</i>
+                    <span id="user-name"><?php echo $_getvar('ctx_userName'); ?></span>
+                    <span for="user-name"
+                          class="mdl-tooltip mdl-tooltip--top"><?php printf('%s : %s', __('Group'), $_getvar('ctx_userGroup')); ?></span>
+                    <?php
+                    /** @var IconInterface $ctx_userType */
+                    $ctx_userType = $_getvar('ctx_userType');
+
+                    if ($ctx_userType): ?>
+                        <i id="user-type"
+                           class="material-icons"><?php echo $ctx_userType->getIcon(); ?></i>
+                        <span for="user-type"
+                              class="mdl-tooltip mdl-tooltip--top"><?php echo $ctx_userType->getTitle(); ?></span>
+                    <?php endif; ?>
+                </a>
+
+                <span class="mdl-menu__item--full-bleed-divider"></span>
+
+                <a class="btn-action mdl-navigation__link"
+                   title="<?php echo __('Sign Out'); ?>"
+                   data-onclick="main/logout">
+                    <i class="material-icons">exit_to_app</i>
+                    <?php echo __('Sign Out'); ?>
+                </a>
+
+                <span class="mdl-menu__item--full-bleed-divider"></span>
+
+                <a class="mdl-navigation__link" href="#">
+                    <?php if ($_getvar('httpsEnabled')): ?>
+                        <i class="material-icons mdl-color-text--teal-500">lock</i>
+                    <?php else: ?>
+                        <i class="material-icons mdl-color-text--red-900">lock_open</i>
+                    <?php endif; ?>
+
+                    <?php if ($_getvar('isDemo')): ?>
+                        <span class="status-info"><?php echo __('Demo'); ?></span>
+                    <?php endif; ?>
+
+                    <?php echo $_getvar('app_name'), ' ', $_getvar('app_version'); ?>
+                </a>
+            </nav>
+        </div>
+    <?php endif; ?>
+
+    <main class="mdl-layout__content">
+        <div id="content"
+             data-page="<?php echo $_getvar('contentPage', ''); ?>">
+            <?php if ($this->hashContentTemplates()):
+                foreach ($this->getContentTemplates() as $template):
+                    include $template;
+                endforeach;
+            endif; ?>
+        </div>
+    </main>
+</div> <!-- Close mdl-layout -->
diff --git a/app/modules/web/themes/material-dark/views/_partials/footer.inc b/app/modules/web/themes/material-dark/views/_partials/footer.inc
new file mode 100644
index 000000000..2567051d7
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/_partials/footer.inc
@@ -0,0 +1,83 @@
+<?php
+/**
+ * @var callable $_getvar
+ * @var Template $this
+ */
+
+use SP\Html\Assets\IconInterface;
+use SP\Mvc\View\Template;
+
+?>
+<footer>
+    <div id="footer-left" class="footer-parts">
+        <?php if ($_getvar('loadApp') === true && $_getvar('ctx_userName')): ?>
+            <div id="session">
+                <span id="user-info">
+                    <?php
+                    /** @var IconInterface $ctx_userType */
+                    $ctx_userType = $_getvar('ctx_userType');
+
+                    if ($ctx_userType): ?>
+                        <i id="user-type-footer"
+                           class="material-icons"><?php echo $ctx_userType->getIcon(); ?></i>
+                        <span for="user-type-footer"
+                              class="mdl-tooltip mdl-tooltip--top"><?php echo $ctx_userType->getTitle(); ?></span>
+                    <?php else: ?>
+                        <i class="material-icons">face</i>
+                    <?php endif; ?>
+                    <span id="user-name-footer"><?php echo $_getvar('ctx_userName'); ?></span>
+                    <span for="user-name-footer"
+                          class="mdl-tooltip mdl-tooltip--top"><?php printf('%s : %s', __('Group'), $_getvar('ctx_userGroup')); ?></span>
+                </span>
+            </div>
+        <?php endif; ?>
+    </div>
+
+    <div id="footer-right" class="footer-parts">
+        <div id="status">
+            <?php if ($_getvar('httpsEnabled')): ?>
+                <span id="secure-info" class="status-info">
+                    <i class="material-icons mdl-color-text--teal-500">https</i>
+                </span>
+                <span for="secure-info"
+                      class="mdl-tooltip mdl-tooltip--top"><?php echo 'HTTPS'; ?></span>
+            <?php else: ?>
+                <span id="secure-info" class="status-info">
+                    <i class="material-icons mdl-color-text--red-900">http</i>
+                </span>
+                <span for="secure-info"
+                      class="mdl-tooltip mdl-tooltip--top mdl-tooltip--large"><?php echo __('Tells whether the connection uses HTTPS or not.') . '<br><br>' . __('Passwords sent from forms are encrypted using PKI, the remain data don\'t.'); ?></span>
+            <?php endif; ?>
+
+            <?php if (DEBUG): ?>
+                <i class="material-icons mdl-color-text--red-900"
+                   title="Debug ON">bug_report</i>
+            <?php endif; ?>
+
+            <?php if ($_getvar('isDemo')): ?>
+                <span class="status-info">
+                    <i class="material-icons mdl-color-text--teal-500"
+                       title="<?php echo __('Demo'); ?>">play_circle_outline</i>
+                </span>
+            <?php endif; ?>
+
+            <div id="updates"></div>
+            <div id="notices"></div>
+        </div>
+
+        <div id="project">
+            <a id="app-info" href="<?php echo $_getvar('app_website_url'); ?>"
+               target="_blank">
+                <?php echo $_getvar('app_name'), ' ', $_getvar('app_version'); ?>
+            </a>
+            <span for="app-info"
+                  class="mdl-tooltip mdl-tooltip--top mdl-tooltip--large"><?php echo __('Help :: FAQ :: Changelog'); ?></span>
+            &nbsp;::&nbsp;
+            <a id="app-project" href="<?php echo $_getvar('app_blog_url'); ?>"
+               target="_blank">cygnux.org</a>
+            <span for="app-project"
+                  class="mdl-tooltip mdl-tooltip--top mdl-tooltip--large"><?php echo __('A cygnux.org project'); ?></span>
+        </div>
+        <!-- Close Project -->
+    </div>
+</footer> <!-- Close footer -->
diff --git a/app/modules/web/themes/material-dark/views/_partials/help_account_search.inc b/app/modules/web/themes/material-dark/views/_partials/help_account_search.inc
new file mode 100644
index 000000000..e17cd4c39
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/_partials/help_account_search.inc
@@ -0,0 +1,31 @@
+<div id="help-account_search"
+     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?> btn-help"
+     data-help="help-account-search"><?php echo $icons->getIconHelp()->getIcon(); ?>
+</div>
+
+<div class="mdl-tooltip" for="help-account_search">
+    <div class="tooltip-text">
+        <?php echo ucwords(__('Special parameters')); ?>
+    </div>
+</div>
+
+<div for="help-account-search" class="help-box"
+     title="<?php echo ucwords(__('Special parameters')); ?>">
+    <div class="help-container">
+        <p class="help-text"><?php echo __('You could use either one or several special parameters separated by blank spaces'); ?></p>
+        <ul>
+            <li><?php printf('<strong>user:"login"</strong> <br> %s', __('Search for accounts which \'login\' has access rights')); ?></li>
+            <li><?php printf('<strong>owner:"login"</strong> <br> %s', __('Get the accounts in which user login "login" is the owner')); ?></li>
+            <li><?php printf('<strong>group:"group_name"</strong> <br> %s', __('Search for accounts which \'group_name\' has access rights')); ?></li>
+            <li><?php printf('<strong>maingroup:"group_name"</strong> <br> %s', __('Get the accounts in which main group "group_name" is set')); ?></li>
+            <li><?php printf('<strong>file:"file_name"</strong> <br> %s', __('Search for accounts which contain a file with the name \'file_name\'')); ?></li>
+            <li><?php printf('<strong>client:"client_name"</strong> <br> %s', __('Search for accounts by client name')); ?></li>
+            <li><?php printf('<strong>category:"category_name"</strong> <br> %s', __('Search for accounts by category name')); ?></li>
+            <li><?php printf('<strong>id:"account_id"</strong> <br> %s', __('Returns the account for the given ID')); ?></li>
+            <li><?php printf('<strong>name_regex:"regex"</strong> <br> %s', __('Search for accounts name by regular expression')); ?></li>
+            <li><?php printf('<strong>is|not:expired</strong> <br> %s', __('Search for accounts with expired password')); ?></li>
+            <li><?php printf('<strong>is|not:private</strong> <br> %s', __('Get private accounts for current user')); ?></li>
+            <li><?php printf('<strong>op:and|or</strong> <br> %s', __('Operator for special parameters')); ?></li>
+        </ul>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/_partials/no_records_found.inc b/app/modules/web/themes/material-dark/views/_partials/no_records_found.inc
new file mode 100644
index 000000000..3d3888aec
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/_partials/no_records_found.inc
@@ -0,0 +1,14 @@
+<?php
+/**
+ * @var callable $_getvar
+ * @var Template $this
+ */
+
+use SP\Mvc\View\Template;
+
+?>
+<?php if ($_getvar('message')): ?>
+    <div class="noRes round"><?php echo $_getvar('message'); ?></div>
+<?php else: ?>
+    <div class="noRes round"><?php echo __('No records found'); ?></div>
+<?php endif; ?>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/account/account-editpass.inc b/app/modules/web/themes/material-dark/views/account/account-editpass.inc
new file mode 100644
index 000000000..18d3c88da
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/account-editpass.inc
@@ -0,0 +1,161 @@
+<?php
+/**
+ * @var callable       $_getvar
+ * @var ThemeIcons     $icons
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\Services\Account\AccountAcl;
+
+/** @var AccountExtData $accountData */
+$accountData = $_getvar('accountData');
+
+/** @var AccountAcl $accountAcl */
+$accountAcl = $_getvar('accountAcl');
+?>
+
+<div class="data-container">
+    <div id="title" class="titleNormal">
+        <i class="material-icons"><?php echo $_getvar('title')['icon']; ?></i>
+        <?php echo $_getvar('title')['name']; ?>
+    </div>
+
+    <form method="post" name="editpass" id="frmEditPass" class="form-action"
+          data-onsubmit="account/save"
+          data-action-route="<?php echo $_getvar('formRoute', ''); ?>"
+          data-item-id="<?php echo $_getvar('accountId', ''); ?>"
+          data-hash="">
+        <table class="data">
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="name" name="name" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getName(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="name"><?php echo __('Account name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Client'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="client" name="client" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getClientName(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="client"><?php echo __('Client'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('URL / IP'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="url" name="url" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getUrl(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="url"><?php echo __('URL / IP'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('User'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="login" name="login" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getLogin(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="login"><?php echo __('User'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Password'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="password" name="password" type="password"
+                               required
+                               class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input"
+                               maxlength="255" autocomplete="off">
+                        <label class="mdl-textfield__label"
+                               for="password"><?php echo __('Password'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Password (repeat)'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="password_repeat" name="password_repeat"
+                               type="password" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="255" autocomplete="off">
+                        <label class="mdl-textfield__label"
+                               for="password_repeat"><?php echo __('Password'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <?php if ($configData->isAccountExpireEnabled()): ?>
+                <tr>
+                    <td class="descField"><?php echo __('Password Expiry Date'); ?></td>
+                    <td class="valField">
+                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                            <input id="password_date_expire"
+                                   name="password_date_expire" type="date"
+                                   class="mdl-textfield__input mdl-color-text--indigo-400 password-datefield__input"
+                                   value="<?php echo $_getvar('accountPassDateChange'); ?>"
+                                   data-dst-unix="password_date_expire_unix">
+                            <input type='hidden'
+                                   name='password_date_expire_unix' value=""/>
+                            <label class="mdl-textfield__label"
+                                   for="password_date_expire"><?php echo __('Date'); ?></label>
+                        </div>
+                        <i class="material-icons btn-action"
+                           title="<?php echo __('Select date'); ?>">date_range</i>
+                    </td>
+                </tr>
+            <?php endif; ?>
+        </table>
+
+        <input type="hidden" name="sk" value="<?php echo $sk; ?>">
+        <input type="hidden" name="isAjax" value="1">
+
+        <div class="item-actions">
+            <ul>
+                <li>
+                    <button id="btnBack" type="button"
+                            class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                            title="<?php echo __('Back'); ?>">
+                        <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+                    </button>
+                </li>
+                <li>
+                    <button id="btnSave" name="btnSave" type="submit"
+                            form="frmEditPass"
+                            class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                            title="<?php echo __('Save'); ?>">
+                        <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+                    </button>
+                </li>
+            </ul>
+        </div>
+    </form>
+</div>
+
+<script>
+    $('input:password:visible:first').focus();
+</script>
diff --git a/app/modules/web/themes/material-dark/views/account/account-history.inc b/app/modules/web/themes/material-dark/views/account/account-history.inc
new file mode 100644
index 000000000..bee4ec23c
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/account-history.inc
@@ -0,0 +1,196 @@
+<?php
+/**
+ * @var callable       $_getvar
+ * @var ThemeIcons     $icons
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Services\Account\AccountAcl;
+
+/** @var AccountExtData $accountData */
+$accountData = $_getvar('accountData');
+
+/** @var AccountAcl $accountAcl */
+$accountAcl = $_getvar('accountAcl');
+?>
+
+<div class="data-container">
+    <div id="title" class="titleNormal">
+        <i class="material-icons"
+           title="<?php echo __('History'); ?>"><?php echo $_getvar('title')['icon']; ?></i>
+        <?php echo $_getvar('title')['name']; ?>
+    </div>
+
+    <div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
+        <div class="mdl-tabs__tab-bar">
+            <a href="#account-panel"
+               class="mdl-tabs__tab is-active"><?php echo __('Account'); ?></a>
+
+            <?php if ($accountAcl->isShowDetails()): ?>
+                <a href="#detail-panel"
+                   class="mdl-tabs__tab"><?php echo __('Details'); ?></a>
+            <?php endif; ?>
+        </div>
+
+        <div class="mdl-tabs__panel is-active" id="account-panel">
+            <form method="post" name="frmaccount" id="frmAccount"
+                  class="form-action"
+                  data-onsubmit="account/save"
+                  data-action-route="<?php echo $_getvar('formRoute', ''); ?>"
+                  data-item-id="<?php echo $_getvar('accountId', ''); ?>"
+                  data-hash="">
+                <input type="hidden" name="sk" value="<?php echo $sk; ?>">
+                <input type="hidden" name="isAjax" value="1">
+
+                <table class="data">
+                    <tr>
+                        <td class="descField"><?php echo __('Name'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="name" name="name" type="text"
+                                       required
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       maxlength="50"
+                                       value="<?php echo $accountData->getName() ?>"
+                                       tabindex="1" readonly>
+                                <label class="mdl-textfield__label"
+                                       for="name"><?php echo __('Account name'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('Client'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Client'); ?></div>
+
+                            <select id="client_id" name="client_id"
+                                    class="select-box sel-chosen-client"
+                                    tabindex="2" required disabled>
+                                <?php /** @var SelectItem $client */
+                                foreach ($_getvar('clients') as $client): ?>
+                                    <option
+                                            value="<?php echo $client->getId(); ?>" <?php echo $client->isSelected() ? 'selected' : ''; ?>><?php echo $client->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('Category'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Category'); ?></div>
+
+                            <select id="category_id" name="category_id"
+                                    class="select-box"
+                                    tabindex="3" required disabled>
+                                <option value=""><?php echo __('Select Category'); ?></option>
+                                <?php /** @var SelectItem $category */
+                                foreach ($_getvar('categories') as $category): ?>
+                                    <option
+                                            value="<?php echo $category->getId(); ?>" <?php echo $category->isSelected() ? 'selected' : ''; ?>><?php echo $category->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('URL / IP'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="url" name="url" type="text"
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       maxlength="255" tabindex="4"
+                                       value="<?php echo $accountData->getUrl(); ?>"
+                                       readonly>
+                                <label class="mdl-textfield__label"
+                                       for="name"><?php echo __('Access URL or IP'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('User'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="login" name="login" type="text"
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       maxlength="50" tabindex="5"
+                                       value="<?php echo $accountData->getLogin(); ?>"
+                                       readonly>
+                                <label class="mdl-textfield__label"
+                                       for="name"><?php echo __('Access user'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('Password Expiry Date'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="password_date_expire"
+                                       name="password_date_expire" type="date"
+                                       class="mdl-textfield__input mdl-color-text--indigo-400 password-datefield__input"
+                                       tabindex="8"
+                                       value="<?php echo $_getvar('accountPassDateChange'); ?>"
+                                       readonly>
+                                <label class="mdl-textfield__label"
+                                       for="password_date_expire"><?php echo __('Date'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('Notes'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <textarea
+                                class="mdl-textfield__input mdl-color-text--indigo-400"
+                                rows="3" id="notes"
+                                name="notes" tabindex="9"
+                                maxlength="5000"
+                                readonly><?php echo $accountData->getNotes(); ?></textarea>
+                                <label class="mdl-textfield__label"
+                                       for="notes"><?php echo __('Notes about the account'); ?></label>
+                            </div>
+                    </tr>
+                    <?php if ($accountAcl->isShowHistory()
+                        && count($_getvar('historyData', [])) > 0): ?>
+                        <tr>
+                            <td class="descField"><?php echo __('History'); ?></td>
+                            <td class="valField">
+                                <div class="lowres-title"><?php echo __('History'); ?></div>
+
+                                <select id="history_id" name="history_id"
+                                        class="select-box" tabindex="12"
+                                        data-action-route="account/viewHistory"
+                                        data-onchange="account/viewHistory">
+                                    <option value=""><?php echo __('Select date'); ?></option>
+                                    <?php /** @var SelectItem $history */
+                                    foreach ($_getvar('historyData') as $history): ?>
+                                        <option
+                                                value="<?php echo $history->getId(); ?>"
+                                            <?php echo $history->isSelected() ? 'selected' : ''; ?>><?php echo $history->getName(); ?></option>
+                                    <?php endforeach; ?>
+                                </select>
+                            </td>
+                        </tr>
+                    <?php endif; ?>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Last Modification'); ?></td>
+                        <td class="valField"><?php printf('%s (%s)', $accountData->getDateEdit(), $accountData->getUserEditName() ?: $accountData->getUserEditLogin()); ?></td>
+                    </tr>
+                </table>
+
+            </form>
+        </div>
+
+        <div class="mdl-tabs__panel" id="detail-panel">
+            <?php if ($accountAcl->isShowDetails()): include $this->includeTemplate('details'); endif; ?>
+        </div>
+
+    </div>
+
+    <?php include $this->includeTemplate('actions'); ?>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/account/account-link.inc b/app/modules/web/themes/material-dark/views/account/account-link.inc
new file mode 100644
index 000000000..a8a3eefc4
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/account-link.inc
@@ -0,0 +1,145 @@
+<?php
+/**
+ * @var callable       $_getvar
+ * @var ThemeIcons     $icons
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\Services\Account\AccountAcl;
+
+/** @var AccountExtData $accountData */
+$accountData = $_getvar('accountData');
+?>
+
+<div id="actions" class="public-link" align="center">
+    <div id="content" class="public-link">
+        <div id="title" class="titleNormal">
+            <i class="material-icons"><?php echo $_getvar('title')['icon']; ?></i>
+            <?php echo $_getvar('title')['name']; ?>
+        </div>
+        <table class="data">
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="name" name="name" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50"
+                               value="<?php echo $accountData->getName(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="name"><?php echo __('Account name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Client'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="client" name="client" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getClientName(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="client"><?php echo __('Client'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Category'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="category" name="category" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getCategoryName(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="category"><?php echo __('Category'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('URL / IP'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="url" name="url" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getUrl(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="url"><?php echo __('URL / IP'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('User'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="login" name="login" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getLogin(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="login"><?php echo __('User'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Notes'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <textarea
+                                class="mdl-textfield__input mdl-color-text--indigo-400"
+                                rows="3" id="notes"
+                                name="notes"
+                                maxlength="1000"
+                                readonly><?php echo $accountData->getNotes(); ?></textarea>
+                        <label class="mdl-textfield__label"
+                               for="notes"><?php echo __('Notes about the account'); ?></label>
+                    </div>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Password'); ?></td>
+                <td class="valField">
+                    <?php if ($_getvar('useImage')): ?>
+                        <div class="lowres-title"><?php echo __('Password'); ?></div>
+
+                        <img class="account-pass-image"
+                             src="data:image/png;base64,<?php echo $_getvar('accountPassImage'); ?>"/>
+                    <?php else: ?>
+                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                            <input id="password" name="password" type="text"
+                                   class="mdl-textfield__input mdl-color-text--indigo-400"
+                                   value="<?php echo $accountData->getPass(); ?>"
+                                   readonly>
+                            <label class="mdl-textfield__label"
+                                   for="password"><?php echo __('Password'); ?></label>
+                        </div>
+                    <?php endif; ?>
+            </tr>
+        </table>
+
+        <div class="item-actions">
+            <ul>
+                <?php if (!$_getvar('useImage')): ?>
+                    <li>
+                        <button id="btnClipPass"
+                                class="clip-pass-icon mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored mdl-color--indigo-A200"
+                                data-clipboard-target="#password"
+                                data-item-id="<?php echo $accountData->getId(); ?>"
+                                data-sk="<?php echo $_getvar('sk'); ?>"
+                                data-history="0"
+                                data-onclick="account/copypass">
+                            <i class="material-icons">content_paste</i>
+                        </button>
+                    </li>
+                <?php endif; ?>
+            </ul>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/account/account-permissions.inc b/app/modules/web/themes/material-dark/views/account/account-permissions.inc
new file mode 100644
index 000000000..8711308f6
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/account-permissions.inc
@@ -0,0 +1,261 @@
+<?php
+/**
+ * @var callable       $_getvar
+ * @var ThemeIcons     $icons
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ * @var AccountPrivate $accountPrivate
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\DataModel\ItemPreset\AccountPrivate;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Services\Account\AccountAcl;
+
+?>
+
+<div id="data-accesses">
+    <table class="data">
+        <?php if ($accountAcl->isShowPermission()): ?>
+            <tr>
+                <td class="descField"><?php echo __('Users'); ?></td>
+                <td class="valField">
+                    <div class="account-permissions">
+                        <div class="tag-list-box">
+                            <?php if (!$_getvar('isView')): ?>
+                                <select id="other_users_view"
+                                        name="other_users_view[]"
+                                        multiple="multiple"
+                                        class="select-box-tags" <?php echo $_getvar('disabled'); ?>>
+                                    <option value=""><?php echo __('Select Users'); ?></option>
+                                    <?php /** @var SelectItem $otherUser */
+                                    foreach ($_getvar('otherUsersView') as $otherUser): ?>
+                                        <?php if ($otherUser->isSkip()): continue; endif; ?>
+                                        <option
+                                                value="<?php echo $otherUser->getId(); ?>"
+                                            <?php echo $otherUser->isSelected() ? 'selected' : '' ?>><?php echo $otherUser->getName(); ?></option>
+                                    <?php endforeach; ?>
+                                </select>
+                                <i class="material-icons select-icon"
+                                   title="<?php echo __('View'); ?>"><?php echo $icons->getIconView()->getIcon(); ?></i>
+                            <?php else: ?>
+                                <div class="tag-list-body">
+                                    <i class="material-icons select-icon"
+                                       title="<?php echo __('View'); ?>"><?php echo $icons->getIconView()->getIcon(); ?></i>
+                                    <div class="tags-list-items">
+                                        <?php /** @var SelectItem $otherUser */
+                                        foreach ($_getvar('otherUsersView') as $otherUser): ?>
+                                            <?php if ($otherUser->isSelected()): ?>
+                                                <span class="tag"><?php echo $otherUser->getName(); ?></span>
+                                            <?php endif; ?>
+                                        <?php endforeach; ?>
+                                    </div>
+                                </div>
+                            <?php endif; ?>
+                        </div>
+
+                        <div class="tag-list-box">
+                            <?php if (!$_getvar('isView')): ?>
+                                <select id="other_users_edit"
+                                        name="other_users_edit[]"
+                                        multiple="multiple"
+                                        class="select-box-tags" <?php echo $_getvar('disabled'); ?>>
+                                    <option value=""><?php echo __('Select Users'); ?></option>
+                                    <?php /** @var SelectItem $otherUser */
+                                    foreach ($_getvar('otherUsersEdit') as $otherUser): ?>
+                                        <?php if ($otherUser->isSkip()): continue; endif; ?>
+                                        <option
+                                                value="<?php echo $otherUser->getId(); ?>"
+                                            <?php echo $otherUser->isSelected() ? 'selected' : '' ?>><?php echo $otherUser->getName(); ?></option>
+                                    <?php endforeach; ?>
+                                </select>
+                                <i class="material-icons select-icon"
+                                   title="<?php echo __('Edit'); ?>"><?php echo $icons->getIconEdit()->getIcon(); ?></i>
+                            <?php else: ?>
+                                <div class="tag-list-body">
+                                    <i class="material-icons select-icon"
+                                       title="<?php echo __('Edit'); ?>"><?php echo $icons->getIconEdit()->getIcon(); ?></i>
+                                    <div class="tags-list-items">
+                                        <?php /** @var SelectItem $otherUser */
+                                        foreach ($_getvar('otherUsersEdit') as $otherUser): ?>
+                                            <?php if ($otherUser->isSelected()): ?>
+                                                <span class="tag"><?php echo $otherUser->getName(); ?></span>
+                                            <?php endif; ?>
+                                        <?php endforeach; ?>
+                                    </div>
+                                </div>
+                            <?php endif; ?>
+                        </div>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Groups'); ?></td>
+                <td class="valField">
+                    <div class="account-permissions">
+                        <div class="tag-list-box">
+                            <?php if (!$_getvar('isView')): ?>
+                                <select id="other_usergroups_view"
+                                        name="other_usergroups_view[]"
+                                        multiple="multiple"
+                                        class="select-box-tags" <?php echo $_getvar('disabled'); ?>>
+                                    <option value=""><?php echo __('Select Groups'); ?></option>
+                                    <?php /** @var SelectItem $otherUserGroup */
+                                    foreach ($_getvar('otherUserGroupsView') as $otherUserGroup): ?>
+                                        <?php if ($otherUserGroup->isSkip()): continue; endif; ?>
+                                        <option
+                                                value="<?php echo $otherUserGroup->getId(); ?>"
+                                            <?php echo $otherUserGroup->isSelected() ? 'selected' : '' ?>><?php echo $otherUserGroup->getName(); ?></option>
+                                    <?php endforeach; ?>
+                                </select>
+                                <i class="material-icons select-icon"
+                                   title="<?php echo __('View'); ?>"><?php echo $icons->getIconView()->getIcon(); ?></i>
+                            <?php else: ?>
+                                <div class="tag-list-body">
+                                    <i class="material-icons select-icon"
+                                       title="<?php echo __('View'); ?>"><?php echo $icons->getIconView()->getIcon(); ?></i>
+                                    <div class="tags-list-items">
+                                        <?php /** @var SelectItem $otherUserGroup */
+                                        foreach ($_getvar('otherUserGroupsView') as $otherUserGroup): ?>
+                                            <?php if ($otherUserGroup->isSelected()): ?>
+                                                <span class="tag"><?php echo $otherUserGroup->getName(); ?></span>
+                                            <?php endif; ?>
+                                        <?php endforeach; ?>
+                                    </div>
+                                </div>
+                            <?php endif; ?>
+                        </div>
+
+                        <div class="tag-list-box">
+                            <?php if (!$_getvar('isView')): ?>
+                                <select id="other_usergroups_edit"
+                                        name="other_usergroups_edit[]"
+                                        multiple="multiple"
+                                        class="select-box-tags" <?php echo $_getvar('disabled'); ?>>
+                                    <option value=""><?php echo __('Select Groups'); ?></option>
+                                    <?php /** @var SelectItem $otherUserGroup */
+                                    foreach ($_getvar('otherUserGroupsEdit') as $otherUserGroup): ?>
+                                        <?php if ($otherUserGroup->isSkip()): continue; endif; ?>
+                                        <option
+                                                value="<?php echo $otherUserGroup->getId(); ?>"
+                                            <?php echo $otherUserGroup->isSelected() ? 'selected' : '' ?>><?php echo $otherUserGroup->getName(); ?></option>
+                                    <?php endforeach; ?>
+                                </select>
+                                <i class="material-icons select-icon"
+                                   title="<?php echo __('Edit'); ?>"><?php echo $icons->getIconEdit()->getIcon(); ?></i>
+                            <?php else: ?>
+                                <div class="tag-list-body">
+                                    <i class="material-icons select-icon"
+                                       title="<?php echo __('Edit'); ?>"><?php echo $icons->getIconEdit()->getIcon(); ?></i>
+                                    <div class="tags-list-items">
+                                        <?php /** @var SelectItem $otherUserGroup */
+                                        foreach ($_getvar('otherUserGroupsEdit') as $otherUserGroup): ?>
+                                            <?php if ($otherUserGroup->isSelected()): ?>
+                                                <span class="tag"><?php echo $otherUserGroup->getName(); ?></span>
+                                            <?php endif; ?>
+                                        <?php endforeach; ?>
+                                    </div>
+                                </div>
+                            <?php endif; ?>
+                        </div>
+                    </div>
+                </td>
+            </tr>
+
+            <?php if ($_getvar('copyAction')): // Forces an update of permissions when copying from another account ?>
+                <input type="hidden" name="other_users_view_update" value="1">
+                <input type="hidden" name="other_users_edit_update" value="1">
+                <input type="hidden" name="other_usergroups_view_update"
+                       value="1">
+                <input type="hidden" name="other_usergroups_edit_update"
+                       value="1">
+            <?php endif; ?>
+        <?php endif; ?>
+
+        <?php if (!$_getvar('isView')
+            && ($_getvar('ctx_userIsAdminApp')
+                || $_getvar('ctx_userIsAdminAcc')
+                || ($gotData && $_getvar('ctx_userId') === $accountData->getUserId()))
+        ): ?>
+            <tr>
+                <td class="descField"><?php echo __('Owner'); ?></td>
+                <td class="valField">
+                    <select id="owner_id" name="owner_id"
+                            class="select-box" <?php echo $_getvar('disabled'); ?>>
+                        <option value=""><?php echo __('Select User'); ?></option>
+                        <?php /** @var SelectItem $user */
+                        foreach ($_getvar('users') as $user): ?>
+                            <option
+                                    value="<?php echo $user->getId(); ?>"
+                                <?php echo $user->isSelected() ? 'selected' : ''; ?>><?php echo $user->getName(); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+                </td>
+            </tr>
+        <?php endif; ?>
+
+        <?php if (!$_getvar('isView')
+            && ($_getvar('ctx_userIsAdminApp')
+                || $_getvar('ctx_userIsAdminAcc')
+                || ($gotData
+                    && ($_getvar('ctx_userId') === $accountData->getUserId()
+                        || $_getvar('ctx_userGroupId') === $accountData->getUserGroupId())))
+        ): ?>
+            <tr>
+                <td class="descField"><?php echo __('Main Group'); ?></td>
+                <td class="valField">
+                    <select id="main_usergroup_id" name="main_usergroup_id"
+                            class="select-box" <?php echo $_getvar('disabled'); ?>>
+                        <option value=""><?php echo __('Select Group'); ?></option>
+                        <?php /** @var SelectItem $userGroup */
+                        foreach ($_getvar('userGroups') as $userGroup): ?>
+                            <option
+                                    value="<?php echo $userGroup->getId(); ?>"
+                                <?php echo $userGroup->isSelected() ? 'selected' : ''; ?>><?php echo $userGroup->getName(); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+                </td>
+            </tr>
+        <?php endif; ?>
+
+        <?php if ($_getvar('allowPrivate') === true):
+            $checked = ($gotData && $accountData->getIsPrivate()) || $_getvar('privateUserCheck');
+            ?>
+            <tr>
+                <td class="descField"><?php echo __('Private Account'); ?></td>
+                <td class="valField">
+                    <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                           for="private_enabled">
+                        <input name="private_enabled" type="checkbox"
+                               id="private_enabled"
+                               class="mdl-switch__input" <?php echo $checked ? 'checked' : '';
+                        echo $_getvar('disabled'); ?>/>
+                        <span class="mdl-switch__label"><?php echo __('Private'); ?></span>
+                    </label>
+                </td>
+            </tr>
+        <?php endif; ?>
+
+        <?php if ($_getvar('allowPrivateGroup') === true):
+            $checked = ($gotData && $accountData->getIsPrivateGroup()) || $_getvar('privateUserGroupCheck');
+            ?>
+            <tr>
+                <td class="descField"><?php echo __('Private Account for Group'); ?></td>
+                <td class="valField">
+                    <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                           for="private_group_enabled">
+                        <input name="private_group_enabled" type="checkbox"
+                               id="private_group_enabled"
+                               class="mdl-switch__input" <?php echo $checked ? 'checked' : '';
+                        echo $_getvar('disabled'); ?>/>
+                        <span class="mdl-switch__label"><?php echo __('Private for Group'); ?></span>
+                    </label>
+                </td>
+            </tr>
+        <?php endif; ?>
+    </table>
+</div>
+
diff --git a/app/modules/web/themes/material-dark/views/account/account-request.inc b/app/modules/web/themes/material-dark/views/account/account-request.inc
new file mode 100644
index 000000000..ce2cd94fe
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/account-request.inc
@@ -0,0 +1,93 @@
+<?php
+/**
+ * @var callable       $_getvar
+ * @var ThemeIcons     $icons
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\Services\Account\AccountAcl;
+
+/** @var AccountExtData $accountData */
+$accountData = $_getvar('accountData');
+?>
+
+<div class="data-container">
+    <div id="title"
+         class="titleNormal"><?php echo __('Request Account Modification'); ?></div>
+
+    <form method="post" name="requestmodify" id="frmRequestModify"
+          class="form-action"
+          data-onsubmit="account/request"
+          data-action-route="<?php echo $_getvar('formRoute', ''); ?>"
+          data-item-id="<?php echo $_getvar('accountId', ''); ?>"
+          data-hash="">
+        <table class="data">
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="name" name="name" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getName(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="name"><?php echo __('Account name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Client'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="client" name="client" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $accountData->getClientName(); ?>"
+                               readonly>
+                        <label class="mdl-textfield__label"
+                               for="client"><?php echo __('Client'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Request'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <textarea
+                            class="mdl-textfield__input mdl-color-text--indigo-400"
+                            rows="3" id="description"
+                            name="description" maxlength="1000"></textarea>
+                        <label class="mdl-textfield__label"
+                               for="description"><?php echo __('Request description'); ?></label>
+                    </div>
+                </td>
+            </tr>
+        </table>
+
+        <input type="hidden" name="sk" value="<?php echo $sk; ?>">
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+
+    <div class="item-actions">
+        <ul>
+            <li>
+                <button id="btnBack" type="button"
+                        class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                        title="<?php echo __('Back'); ?>">
+                    <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+                </button>
+            </li>
+            <li>
+                <button id="btnSave" form="frmRequestModify"
+                        class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                        title="<?php echo __('Send'); ?>">
+                    <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+                </button>
+            </li>
+        </ul>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/account/account.inc b/app/modules/web/themes/material-dark/views/account/account.inc
new file mode 100644
index 000000000..683232660
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/account.inc
@@ -0,0 +1,399 @@
+<?php
+/**
+ * @var callable       $_getvar
+ * @var ThemeIcons     $icons
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Services\Account\AccountAcl;
+
+$accountData = $_getvar('accountData');
+$accountAcl = $_getvar('accountAcl');
+$gotData = $_getvar('gotData', false);
+$showLinked = $gotData && count($_getvar('linkedAccounts', [])) > 0;
+$showFiles = $gotData && $configData->isFilesEnabled() && $accountAcl->isShowFiles();
+$showDetails = $gotData && $accountAcl->isShowDetails();
+$showPermissions = $accountAcl->isShowPermission()
+    || $_getvar('allowPrivate', false)
+    || $_getvar('allowPrivateGroup', false);
+$showCustomFields = count($_getvar('customFields', 0)) > 0;
+?>
+
+<div class="data-container">
+    <div id="title" class="titleNormal">
+        <i class="material-icons"><?php echo $_getvar('title')['icon']; ?></i>
+        <?php echo $_getvar('title')['name']; ?>
+    </div>
+
+    <div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
+        <div class="mdl-tabs__tab-bar">
+            <a href="#account-panel"
+               class="mdl-tabs__tab is-active"><?php echo __('Account'); ?></a>
+
+            <?php if ($showCustomFields): ?>
+                <a href="#customfield-panel"
+                   class="mdl-tabs__tab"><?php echo __('Custom Fields'); ?></a>
+            <?php endif; ?>
+
+            <?php if ($showPermissions): ?>
+                <a href="#permission-panel"
+                   class="mdl-tabs__tab"><?php echo __('Permissions'); ?></a>
+            <?php endif; ?>
+
+            <?php if ($showFiles): ?>
+                <a href="#file-panel"
+                   class="mdl-tabs__tab"><?php echo __('Files'); ?></a>
+            <?php endif; ?>
+
+            <?php if ($showDetails): ?>
+                <a href="#detail-panel"
+                   class="mdl-tabs__tab"><?php echo __('Details'); ?></a>
+            <?php endif; ?>
+
+            <?php if ($showLinked): ?>
+                <a href="#linked-panel"
+                   class="mdl-tabs__tab"><?php echo __('Links'); ?></a>
+            <?php endif; ?>
+        </div>
+
+        <form method="post" name="frmaccount" id="frmAccount"
+              class="form-action"
+              data-onsubmit="account/save"
+              data-action-route="<?php echo $_getvar('formRoute') ?: ''; ?>"
+              data-item-id="<?php echo $_getvar('accountId') ?: ''; ?>"
+              data-hash="">
+
+            <input type="hidden" name="sk" value="<?php echo $sk; ?>">
+            <input type="hidden" name="isAjax" value="1">
+
+            <div class="mdl-tabs__panel is-active" id="account-panel">
+                <table class="data">
+                    <tr>
+                        <td class="descField"><?php echo __('Name'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="name" name="name" type="text"
+                                       required
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       maxlength="100"
+                                       value="<?php echo $gotData ? htmlentities($accountData->getName()) : ''; ?>"
+                                    <?php echo $_getvar('readonly'); ?>>
+                                <label class="mdl-textfield__label"
+                                       for="name"><?php echo __('Account name'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('Client'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Client'); ?></div>
+
+                            <select id="client_id" name="client_id"
+                                    class="select-box"
+                                    required <?php echo $_getvar('disabled'); ?>>
+                                <option value=""><?php echo __('Select Client'); ?></option>
+                                <?php /** @var SelectItem $client */
+                                foreach ($_getvar('clients') as $client): ?>
+                                    <option
+                                            value="<?php echo $client->getId(); ?>" <?php echo ($gotData && $client->getId() === $accountData->getClientId()) ? 'selected' : ''; ?>><?php echo $client->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                            <?php if ($_getvar('addClientEnabled')): ?>
+                                <i class="material-icons btn-action btn-add-select"
+                                   title="<?php echo __('New Client'); ?>"
+                                   data-action-route="<?php echo $_getvar('addClientRoute'); ?>"
+                                   data-item-route="items/clients"
+                                   data-item-dst="client_id"
+                                   data-item-id="0"
+                                   data-onclick="appMgmt/show"><?php echo $icons->getIconAdd()->getIcon(); ?></i>
+                            <?php endif; ?>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('Category'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Category'); ?></div>
+
+                            <select id="category_id" name="category_id"
+                                    class="select-box"
+                                    required <?php echo $_getvar('disabled'); ?>>
+                                <option value=""><?php echo __('Select Category'); ?></option>
+                                <?php /** @var SelectItem $category */
+                                foreach ($_getvar('categories') as $category): ?>
+                                    <option
+                                            value="<?php echo $category->getId(); ?>" <?php echo ($gotData && $category->getId() === $accountData->getCategoryId()) ? 'selected' : ''; ?>><?php echo $category->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                            <?php if ($_getvar('addCategoryEnabled')): ?>
+                                <i class="material-icons btn-action btn-add-select"
+                                   title="<?php echo __('New Category'); ?>"
+                                   data-action-route="<?php echo $_getvar('addCategoryRoute'); ?>"
+                                   data-item-route="items/categories"
+                                   data-item-dst="category_id"
+                                   data-item-id="0"
+                                   data-onclick="appMgmt/show"><?php echo $icons->getIconAdd()->getIcon(); ?></i>
+                            <?php endif; ?>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('URL / IP'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="url" name="url" type="text"
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       maxlength="255"
+                                       value="<?php echo $gotData ? $accountData->getUrl() : ''; ?>" <?php echo $_getvar('readonly'); ?>>
+                                <label class="mdl-textfield__label"
+                                       for="name"><?php echo __('Access URL or IP'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('User'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="login" name="login" type="text"
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       maxlength="50"
+                                       value="<?php echo $gotData ? htmlentities($accountData->getLogin()) : ''; ?>" <?php echo $_getvar('readonly'); ?>>
+                                <label class="mdl-textfield__label"
+                                       for="name"><?php echo __('Access user'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+                    <?php if ($accountAcl->isShowPass()): ?>
+                        <tr>
+                            <td class="descField"><?php echo __('Password'); ?></td>
+                            <td class="valField">
+                                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                    <input id="password" name="password"
+                                           type="password" required
+                                           class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input"
+                                           maxlength="255"
+                                           autocomplete="off">
+                                    <label class="mdl-textfield__label"
+                                           for="password"><?php echo __('Password'); ?></label>
+                                </div>
+                            </td>
+                        </tr>
+                        <tr>
+                            <td class="descField"><?php echo __('Password (repeat)'); ?></td>
+                            <td class="valField">
+                                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                    <input id="password_repeat"
+                                           name="password_repeat"
+                                           type="password" required
+                                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                                           maxlength="255" autocomplete="off">
+                                    <label class="mdl-textfield__label"
+                                           for="password_repeat"><?php echo __('Password (repeat)'); ?></label>
+                                </div>
+                            </td>
+                        </tr>
+                        <?php if ($configData->isAccountExpireEnabled()): ?>
+                            <tr>
+                                <td class="descField"><?php echo __('Password Expiry Date'); ?></td>
+                                <td class="valField">
+                                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                        <input id="password_date_expire"
+                                               name="password_date_expire"
+                                               type="date"
+                                               class="mdl-textfield__input mdl-color-text--indigo-400 password-datefield__input"
+                                               value="<?php echo $_getvar('accountPassDateChange'); ?>"
+                                               data-dst-unix="password_date_expire_unix" <?php echo $_getvar('readonly'); ?>>
+                                        <input type='hidden'
+                                               name='password_date_expire_unix'
+                                               value=""/>
+                                        <label class="mdl-textfield__label"
+                                               for="password_date_expire"><?php echo __('Date'); ?></label>
+                                    </div>
+
+                                    <i class="material-icons btn-action"
+                                       title="<?php echo __('Select date'); ?>">date_range</i>
+                                </td>
+                            </tr>
+                        <?php endif; ?>
+                    <?php endif; ?>
+                    <tr>
+                        <td class="descField"><?php echo __('Notes'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <textarea
+                                class="mdl-textfield__input mdl-color-text--indigo-400"
+                                rows="3" id="notes"
+                                name="notes"
+                                maxlength="5000" <?php echo $_getvar('readonly'); ?>><?php echo $gotData ? htmlspecialchars($accountData->getNotes(), ENT_QUOTES) : ''; ?></textarea>
+                                <label class="mdl-textfield__label"
+                                       for="notes"><?php echo __('Notes about the account'); ?></label>
+                            </div>
+                    </tr>
+                    <tr>
+                        <td class="descField"><?php echo __('Tags'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Tags'); ?></div>
+
+                            <?php if (!$_getvar('isView')): ?>
+                                <select id="tags" name="tags[]"
+                                        multiple="multiple"
+                                        class="select-box-tags">
+                                    <option value=""><?php echo __('Select Tags'); ?></option>
+                                    <?php /** @var SelectItem $tag */
+                                    foreach ($_getvar('tags') as $tag): ?>
+                                        <option value="<?php echo $tag->getId(); ?>" <?php echo $tag->isSelected() ? 'selected' : ''; ?>><?php echo $tag->getName(); ?></option>
+                                    <?php endforeach; ?>
+                                </select>
+                                <?php if ($_getvar('addTagEnabled')): ?>
+                                    <i class="material-icons btn-action btn-add-select"
+                                       title="<?php echo __('New Tag'); ?>"
+                                       data-action-route="<?php echo $_getvar('addTagRoute'); ?>"
+                                       data-item-route="items/tags"
+                                       data-item-dst="tags"
+                                       data-item-id="0"
+                                       data-onclick="appMgmt/show"><?php echo $icons->getIconAdd()->getIcon(); ?></i>
+                                <?php endif; ?>
+                                <?php if ($_getvar('copyAction')): ?>
+                                    <input type="hidden" name="tags_update"
+                                           value="1">
+                                <?php endif; ?>
+                            <?php else: ?>
+                                <div class="tag-list-box">
+                                    <div class="tag-list-body">
+                                        <div class="tags-list-items">
+                                            <?php /** @var SelectItem $tag */
+                                            foreach ($_getvar('tags') as $tag): ?>
+                                                <?php if ($tag->isSelected()): ?>
+                                                    <span class="tag"><?php echo $tag->getName(); ?></span>
+                                                <?php endif; ?>
+                                            <?php endforeach; ?>
+                                        </div>
+                                    </div>
+                                </div>
+                            <?php endif; ?>
+                        </td>
+                    </tr>
+
+                    <?php if (!$showLinked): ?>
+                        <tr>
+                            <td class="descField"><?php echo __('Linked Account'); ?></td>
+                            <td class="valField">
+                                <div class="lowres-title"><?php echo __('Linked Account'); ?></div>
+
+                                <select id="parent_account_id"
+                                        name="parent_account_id"
+                                        class="select-box select-box-deselect" <?php echo $_getvar('disabled'); ?>
+                                        data-sk="<?php echo $_getvar('sk'); ?>"
+                                        data-action-route="items/accountsUser"
+                                        data-item-id="<?php echo $gotData ? $_getvar('accountId') : ''; ?>"
+                                        data-selected-id="<?php echo $gotData ? $accountData->getParentId() : ''; ?>">
+                                    <option value=""><?php echo __('Select Account'); ?></option>
+                                </select>
+                            </td>
+                        </tr>
+                    <?php endif; ?>
+
+                    <?php if ($accountAcl->isShowHistory()
+                        && count($_getvar('historyData', [])) > 0): ?>
+                        <tr>
+                            <td class="descField"><?php echo __('History'); ?></td>
+                            <td class="valField">
+                                <div class="lowres-title"><?php echo __('History'); ?></div>
+
+                                <select id="history_id" name="history_id"
+                                        class="select-box"
+                                        data-action-route="account/viewHistory"
+                                        data-onchange="account/viewHistory">
+                                    <option value=""><?php echo __('Select date'); ?></option>
+                                    <?php /** @var SelectItem $history */
+                                    foreach ($_getvar('historyData') as $history): ?>
+                                        <option
+                                                value="<?php echo $history->getId(); ?>"><?php echo $history->getName(); ?></option>
+                                    <?php endforeach; ?>
+                                </select>
+                            </td>
+                        </tr>
+                    <?php endif; ?>
+
+                    <?php if ($_getvar('editAction')
+                        && $_getvar('isModified', false)
+                        && $accountData->getUserEditName()): ?>
+                        <tr>
+                            <td class="descField"><?php echo __('Last Modification'); ?></td>
+                            <td class="valField"><?php printf('%s (%s)', $accountData->getDateEdit(), $accountData->getUserEditName()); ?></td>
+                        </tr>
+                    <?php endif; ?>
+
+                    <?php if ($_getvar('publicLinkShow', false) === true
+                        && $_getvar('publicLinkUrl') !== null): ?>
+                        <tr>
+                            <td class="descField"><?php echo __('Public Link'); ?></td>
+                            <td class="valField">
+                                <div class="lowres-title"><?php echo __('Public Link'); ?></div>
+
+                                <a href="<?php echo $_getvar('publicLinkUrl'); ?>"
+                                   target="_blank"
+                                   title="<?php echo __('Public Link'); ?>">
+                                    <i class="material-icons"><?php echo $icons->getIconPublicLink()->getIcon(); ?></i>
+                                </a>
+                            </td>
+                        </tr>
+                    <?php endif; ?>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Direct Link'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Direct Link'); ?></div>
+
+                            <a href="<?php echo $_getvar('deepLink'); ?>"
+                               target="_blank"
+                               title="<?php echo __('Direct Link'); ?>">
+                                <i class="material-icons"><?php echo $icons->getIconPublicLink()->getIcon(); ?></i>
+                            </a>
+                        </td>
+                    </tr>
+                </table>
+            </div>
+
+            <div class="mdl-tabs__panel" id="customfield-panel">
+                <?php if ($showCustomFields): ?>
+                    <div id="data-customfields">
+                        <table class="data">
+                            <?php include $this->includeTemplate('aux-customfields', 'common'); ?>
+                        </table>
+                    </div>
+                <?php endif; ?>
+            </div>
+
+            <div class="mdl-tabs__panel" id="permission-panel">
+                <?php if ($showPermissions):
+                    include $this->includeTemplate('account-permissions');
+                endif; ?>
+            </div>
+        </form>
+
+        <div class="mdl-tabs__panel" id="file-panel">
+            <?php if ($showFiles) :
+                include $this->includeTemplate('files');
+            endif; ?>
+        </div>
+
+        <div class="mdl-tabs__panel" id="detail-panel">
+            <?php if ($showDetails):
+                include $this->includeTemplate('details');
+            endif; ?>
+        </div>
+
+        <div class="mdl-tabs__panel" id="linked-panel">
+            <?php if ($showLinked):
+                include $this->includeTemplate('linkedAccounts');
+            endif; ?>
+        </div>
+    </div>
+
+    <?php include $this->includeTemplate('actions'); ?>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/account/actions.inc b/app/modules/web/themes/material-dark/views/account/actions.inc
new file mode 100644
index 000000000..31de3f06f
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/actions.inc
@@ -0,0 +1,56 @@
+<?php
+/**
+ * @var ThemeIcons     $icons
+ * @var callable       $_getvar
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\Html\DataGrid\Action\DataGridActionInterface;
+use SP\Services\Account\AccountAcl;
+
+?>
+
+<div class="item-actions">
+    <ul>
+        <?php /** @var DataGridActionInterface $action */
+        foreach ($_getvar('accountActions') as $action): ?>
+            <li>
+                <button id="<?php echo $action->getId(); ?>"
+                        class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $action->getClassesAsString(), ' ', $action->getIcon()->getClassButton(); ?>"
+                    <?php foreach ($action->getData() as $key => $value): echo 'data-', $key, '="', $value, '"'; endforeach; ?>
+                    <?php foreach ($action->getAttributes() as $key => $value): echo $key, '="', $value, '"'; endforeach; ?>
+                        title="<?php echo $action->getTitle(); ?>">
+                    <i class="material-icons"><?php echo $action->getIcon()->getIcon(); ?></i>
+                </button>
+            </li>
+        <?php endforeach; ?>
+    </ul>
+    <?php
+    $accountActionsMenu = $_getvar('accountActionsMenu');
+    if ($accountActionsMenu && count($accountActionsMenu) > 0): ?>
+        <div>
+            <button id="actions-menu-account"
+                    class="mdl-button mdl-js-button mdl-button--icon">
+                <i class="material-icons">more_vert</i>
+            </button>
+            <ul class="mdl-menu mdl-menu--top-right mdl-js-menu mdl-js-ripple-effect"
+                for="actions-menu-account">
+                <?php foreach ($accountActionsMenu as $action): ?>
+                    <li class="mdl-menu__item btn-action <?php echo $action->getClassesAsString(); ?>"
+                        id="<?php echo $action->getId(); ?>"
+                        <?php foreach ($action->getData() as $key => $value): echo 'data-', $key, '="', $value, '"'; endforeach; ?>
+                        <?php foreach ($action->getAttributes() as $key => $value): echo $key, '="', $value, '"'; endforeach; ?>
+                        title="<?php echo $action->getTitle(); ?>">
+                        <i class="material-icons <?php echo $action->getIcon()->getClass(); ?>"><?php echo $action->getIcon()->getIcon(); ?></i>
+                        <?php echo $action->getName(); ?>
+                    </li>
+                <?php endforeach; ?>
+            </ul>
+        </div>
+    <?php endif; ?>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/account/details.inc b/app/modules/web/themes/material-dark/views/account/details.inc
new file mode 100644
index 000000000..f2e3a0c55
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/details.inc
@@ -0,0 +1,111 @@
+<?php
+/**
+ * @var ThemeIcons     $icons
+ * @var callable       $_getvar
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\Services\Account\AccountAcl;
+
+?>
+
+<div id="data-details">
+    <table class="data">
+        <tr>
+            <td class="descField"><?php echo __('Visits'); ?></td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Visits'); ?></div>
+
+                <?php echo $accountData->getCountView() . '(' . $accountData->getCountDecrypt() . ')'; ?>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"><?php echo __('Date Added'); ?></td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Date Added'); ?></div>
+
+                <?php echo $accountData->getDateAdd() ?>
+            </td>
+        </tr>
+
+        <?php if ($_getvar('isModified') && $accountData->getUserEditName()): ?>
+            <tr>
+                <td class="descField"><?php echo __('Last Modification'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Last Modification'); ?></div>
+
+                    <?php printf('%s (%s)', $accountData->getDateEdit(), $accountData->getUserEditName()); ?>
+                </td>
+            </tr>
+        <?php endif; ?>
+
+        <tr>
+            <td class="descField"><?php echo __('Owner'); ?></td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Owner'); ?></div>
+
+                <?php echo $accountData->getUserName() ?: $accountData->getUserLogin(); ?>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"><?php echo __('Main Group'); ?></td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Main Group'); ?></div>
+
+                <?php echo $accountData->getUserGroupName(); ?>
+            </td>
+        </tr>
+
+        <?php if ($accountAcl->isModified()): ?>
+            <tr>
+                <td class="descField"><?php echo __('Date Modified'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Date Modified'); ?></div>
+
+                    <?php echo $accountData->getDateEdit(); ?>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Editor'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Editor'); ?></div>
+
+                    <?php echo $accountData->getUserEditName() ?: $accountData->getUserEditLogin(); ?>
+                </td>
+            </tr>
+        <?php endif; ?>
+
+        <tr>
+            <td class="descField"><?php echo __('Password Date'); ?></td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Password Date'); ?></div>
+
+                <?php echo $_getvar('accountPassDate'); ?>
+            </td>
+        </tr>
+
+        <?php if ($_getvar('accountPassDateChange', 0) > 0): ?>
+            <tr>
+                <td class="descField"><?php echo __('Password Expiry Date'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Password Expiry Date'); ?></div>
+
+                    <?php echo $_getvar('accountPassDateChange'); ?>
+                </td>
+            </tr>
+        <?php endif; ?>
+        <tr>
+            <td class="descField"><?php echo __('ID'); ?></td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('ID'); ?></div>
+
+                <?php echo $accountData->getId(); ?>
+            </td>
+        </tr>
+    </table>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/account/files-list.inc b/app/modules/web/themes/material-dark/views/account/files-list.inc
new file mode 100644
index 000000000..2c1e16ddd
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/files-list.inc
@@ -0,0 +1,69 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var callable   $_getvar
+ * @var ConfigData $configData
+ * @var FileData   $file
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\FileData;
+use SP\Html\Html;
+
+?>
+
+<div id="files-wrap">
+    <ul id="files-list " class="mdl-list">
+        <?php foreach ($_getvar('files') as $file):
+            $extension = mb_strtoupper($file->getExtension());
+            ?>
+            <li class="mdl-list__item">
+                <span class="mdl-list__item-primary-content"
+                      title="<?php echo $file->getName(); ?>">
+                    <i class="material-icons  mdl-list__item-icon">attachment</i>
+                    <span><?php printf('%s (%d KB)', Html::truncate($file->getName(), 50), $file->getSize() / 1024); ?></span>
+                </span>
+
+                <span class="list-actions">
+                    <?php if ($file->getThumb() !== 'no_thumb'): ?>
+                        <span title="<?php echo $file->getName(); ?>"
+                              class="btn-action"
+                              data-item-id="<?php echo $file->getId(); ?>"
+                              data-action-route="<?php echo $_getvar('fileViewRoute'); ?>"
+                              data-onclick="file/view">
+                            <img src="data:image/png;base64,<?php echo $file->getThumb(); ?>"
+                                 alt="thumbnail"/>
+                        </span>
+                    <?php endif; ?>
+
+                    <?php if ($_getvar('deleteEnabled') === 1): ?>
+                        <i class="material-icons btn-action <?php echo $icons->getIconDelete()->getClass(); ?>"
+                           title="<?php echo __('Delete File'); ?>"
+                           data-item-id="<?php echo $file->getId(); ?>"
+                           data-action-route="<?php echo $_getvar('fileDeleteRoute'); ?>"
+                           data-onclick="file/delete">
+                            <?php echo $icons->getIconDelete()->getIcon(); ?></i>
+                    <?php endif; ?>
+
+                    <i class="material-icons btn-action mdl-list__item-icon <?php echo $icons->getIconDownload()->getClass(); ?>"
+                       title="<?php echo __('Download File'); ?>"
+                       data-item-id="<?php echo $file->getId(); ?>"
+                       data-action-route="<?php echo $_getvar('fileDownloadRoute'); ?>"
+                       data-item-type="<?php echo $extension; ?>"
+                       data-onclick="file/download">
+                        <?php echo $icons->getIconDownload()->getIcon(); ?></i>
+
+                    <?php if ($extension !== 'PDF'): ?>
+                        <i class="material-icons btn-action mdl-list__item-icon <?php echo $icons->getIconView()->getClass(); ?>"
+                           title="<?php echo __('View File'); ?>"
+                           data-item-id="<?php echo $file->getId(); ?>"
+                           data-action-route="<?php echo $_getvar('fileViewRoute'); ?>"
+                           data-onclick="file/view">
+                        <?php echo $icons->getIconView()->getIcon(); ?></i>
+                    <?php endif; ?>
+                </span>
+            </li>
+        <?php endforeach; ?>
+    </ul>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/account/files.inc b/app/modules/web/themes/material-dark/views/account/files.inc
new file mode 100644
index 000000000..60c13e498
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/files.inc
@@ -0,0 +1,53 @@
+<?php
+/**
+ * @var ThemeIcons     $icons
+ * @var callable       $_getvar
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\Services\Account\AccountAcl;
+
+?>
+
+<div id="data-files">
+    <div class="data">
+        <div id="list-account-files"
+             data-action-route="<?php echo $_getvar('fileListRoute'); ?>"
+             data-item-id="<?php echo $_getvar('accountId'); ?>"
+             data-history="<?php echo $_getvar('accountIsHistory', false); ?>"
+             data-delete="<?php echo (int)$accountAcl->isShowDelete(); ?>"
+             data-sk="<?php echo $_getvar('sk'); ?>">
+        </div>
+
+        <?php if ($_getvar('editAction')): ?>
+            <div id="box-upload-files">
+                <div id="drop-account-files"
+                     class="round active-tooltip dropzone"
+                     data-files-ext="<?php echo $_getvar('filesAllowedExts'); ?>"
+                     data-item-id="<?php echo $_getvar('accountId'); ?>"
+                     data-sk="<?php echo $_getvar('sk'); ?>"
+                     data-action-route="<?php echo $_getvar('fileUploadRoute'); ?>"
+                     data-delete="<?php echo (int)$accountAcl->isShowDelete(); ?>">
+                    <i class="material-icons md-60 mdl-color-text--teal-500">cloud_upload</i>
+                </div>
+                <form method="post" enctype="multipart/form-data"
+                      name="upload_form" class="file-upload"
+                      id="fileUploadForm">
+                    <input type="file" id="inFile" multiple name="inFile"/>
+                </form>
+                <div class="mdl-tooltip" for="drop-account-files">
+                    <?php printf(
+                        __('Drop files here (max. 5) or click to select')
+                        . '<br><br>'
+                        . __('Maximum file size: %d MB'),
+                        $_getvar('maxFileSize')); ?>
+                </div>
+            </div>
+        <?php endif; ?>
+    </div>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/account/linkedAccounts.inc b/app/modules/web/themes/material-dark/views/account/linkedAccounts.inc
new file mode 100644
index 000000000..b210811f4
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/linkedAccounts.inc
@@ -0,0 +1,43 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var callable   $_getvar
+ * @var ConfigData $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+
+?>
+
+<div id="data-linkedAccounts">
+    <div class="data">
+        <ul class="mdl-list">
+            <?php foreach ($_getvar('linkedAccounts') as $account): ?>
+                <li class="mdl-list__item">
+                    <span class="btn-action mdl-list__item-primary-content">
+                        <i class="material-icons mdl-list__item-icon">layers</i>
+                        <?php printf('%s (%s)', $account->name, $account->clientName); ?>
+                    </span>
+                    <span class="list-actions">
+                        <i class="material-icons btn-action mdl-list__item-icon <?php echo $icons->getIconEdit()->getClass(); ?>"
+                           title="<?php echo __('Edit Account'); ?>"
+                           data-action-route="account/edit"
+                           data-item-id="<?php echo $account->id; ?>"
+                           data-onclick="account/edit"
+                           data-action-sk="<?php echo $_getvar('sk'); ?>">
+                            <?php echo $icons->getIconEdit()->getIcon(); ?></i>
+
+                        <i class="material-icons btn-action mdl-list__item-icon <?php echo $icons->getIconView()->getClass(); ?>"
+                           title="<?php echo __('Account Details'); ?>"
+                           data-action-route="account/view"
+                           data-item-id="<?php echo $account->id; ?>"
+                           data-onclick="account/view"
+                           data-action-sk="<?php echo $_getvar('sk'); ?>">
+                        <?php echo $icons->getIconView()->getIcon(); ?></i>
+                    </span>
+                </li>
+            <?php endforeach; ?>
+        </ul>
+    </div>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/account/search-header.inc b/app/modules/web/themes/material-dark/views/account/search-header.inc
new file mode 100644
index 000000000..8d31a0c14
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/search-header.inc
@@ -0,0 +1,54 @@
+<?php
+/**
+ * @var ThemeIcons        $icons
+ * @var callable          $_getvar
+ * @var ConfigData        $configData
+ * @var AccountSearchItem $account
+ * @var DataGridTab       $data
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Html\DataGrid\DataGridTab;
+use SP\Services\Account\AccountSearchItem;
+
+if (!isset($data)) {
+    $data = $_getvar('data');
+}
+?>
+
+<div id="data-search-header" class="data-header data-header-minimal">
+    <ul>
+        <?php foreach ($data->getHeader()->getSortFields() as $field): ?>
+            <li>
+                <a id="btn-order-<?php echo $field->getSortKey(); ?>"
+                   class="round <?php echo ($data->getPager()->getSortKey() == $field->getSortKey()) ? 'filterOn' : ''; ?>">
+                    <?php echo $field->getName(); ?>
+                </a>
+                <span for="btn-order-<?php echo $field->getSortKey(); ?>"
+                      class="mdl-tooltip mdl-tooltip--bottom"><?php echo $field->getTitle(); ?></span>
+                <?php
+                $classDown = ($data->getPager()->getSortKey() == $field->getSortKey()
+                    && $data->getPager()->getSortOrder() === 0) ? 'mdl-color--amber-A200' : 'md-dark md-inactive';
+                $classUp = ($data->getPager()->getSortKey() == $field->getSortKey()
+                    && $data->getPager()->getSortOrder() === 1) ? 'mdl-color--amber-A200' : 'md-dark md-inactive';
+                ?>
+                <div
+                        class="icon material-icons sort-down cursor-pointer <?php echo $classDown; ?>"
+                        data-start="<?php echo $data->getPager()->getLimitStart(); ?>"
+                        data-key="<?php echo $field->getSortKey(); ?>"
+                        data-dir="0">
+                    <?php echo $field->getIconDown()->getIcon(); ?>
+                </div>
+                <div
+                        class="icon material-icons sort-up cursor-pointer <?php echo $classUp; ?>"
+                        data-start="<?php echo $data->getPager()->getLimitStart(); ?>"
+                        data-key="<?php echo $field->getSortKey(); ?>"
+                        data-dir="1">
+                    <?php echo $field->getIconUp()->getIcon(); ?>
+                </div>
+            </li>
+        <?php endforeach; ?>
+        <li class="search-filter-spacer"></li>
+    </ul>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/account/search-index.inc b/app/modules/web/themes/material-dark/views/account/search-index.inc
new file mode 100644
index 000000000..e76a4eee1
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/search-index.inc
@@ -0,0 +1,46 @@
+<?php
+/**
+ * @var ThemeIcons        $icons
+ * @var callable          $_getvar
+ * @var ConfigData        $configData
+ * @var AccountSearchItem $account
+ * @var DataGrid          $data
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Html\DataGrid\DataGrid;
+use SP\Services\Account\AccountSearchItem;
+
+if (!isset($data)) {
+    $data = $_getvar('data');
+}
+?>
+
+<div id="res-content">
+    <?php if ($data->getData()->getDataCount() === 0): ?>
+        <div class="noRes round"><?php echo __('No records found'); ?></div>
+    <?php else: ?>
+        <!-- Data Header-->
+        <div id="search-header">
+            <?php include $data->getDataHeaderTemplate(); ?>
+        </div>
+
+        <?php if (AccountSearchItem::$topNavbar): ?>
+            <!-- Data Pager -->
+            <div id="search-pager-top">
+                <?php include $data->getDataPagerTemplate(); ?>
+            </div>
+        <?php endif; ?>
+
+        <!-- Data Rows-->
+        <div id="search-rows">
+            <?php include $data->getDataRowTemplate(); ?>
+        </div>
+
+        <!-- Data Pager -->
+        <div id="search-pager-bottom">
+            <?php include $data->getDataPagerTemplate(); ?>
+        </div>
+    <?php endif; ?>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/account/search-rows.inc b/app/modules/web/themes/material-dark/views/account/search-rows.inc
new file mode 100644
index 000000000..7bfe1cabe
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/search-rows.inc
@@ -0,0 +1,288 @@
+<?php
+/**
+ * @var ThemeIcons         $icons
+ * @var callable           $_getvar
+ * @var ConfigData         $configData
+ * @var AccountSearchItem  $account
+ * @var DataGridTab        $data
+ * @var DataGridActionBase $actionMenu
+ * @var DataGridActionBase $action
+ * @var AccountSearchItem  $accountSearchItem
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\Acl\ActionsInterface;
+use SP\Core\UI\ThemeIcons;
+use SP\Html\DataGrid\Action\DataGridActionBase;
+use SP\Html\DataGrid\DataGridTab;
+use SP\Services\Account\AccountSearchItem;
+use SP\Util\DateUtil;
+
+if (!isset($data)) {
+    $data = $_getvar('data');
+}
+
+$wikiFilter = $_getvar('wikiFilter');
+$favoriteRouteOn = $_getvar('favoriteRouteOn');
+$favoriteRouteOff = $_getvar('favoriteRouteOff');
+?>
+
+<div id="data-search">
+    <?php foreach ($data->getData()->getData() as $index => $accountSearchItem):
+        if ($index === 'count'): continue; endif;
+        $accountSearchData = $accountSearchItem->getAccountSearchVData();
+        ?>
+
+        <div class="account-label round shadow">
+            <div class="label-left">
+                <div class="label-row-up">
+                    <div class="field-customer label-field">
+                        <div class="field-name-hidden"><?php echo __('Client'); ?></div>
+                        <?php if (null !== $accountSearchItem->getClientLink()): ?>
+                            <a href="<?php echo $accountSearchItem->getClientLink(); ?>"
+                               target="blank"
+                               title="<?php echo __('Search in Wiki'); ?>">
+                                <span class="mdl-chip mdl-chip--contact">
+                                    <span style="background-color: <?php echo $accountSearchItem->getColor(); ?>;"
+                                          class="mdl-chip__contact mdl-color-text--white"><?php echo mb_ucfirst($accountSearchData->getClientName()); ?></span>
+                                    <span class="mdl-chip__text"
+                                          title="<?php echo $accountSearchData->getClientName(); ?>"><?php echo $accountSearchItem->getShortClientName(); ?></span>
+                                </span>
+                            </a>
+                        <?php else: ?>
+                            <span class="mdl-chip mdl-chip--contact">
+                                <span style="background-color: <?php echo $accountSearchItem->getColor(); ?>;"
+                                      class="mdl-chip__contact mdl-color-text--white"><?php echo mb_ucfirst($accountSearchData->getClientName()); ?></span>
+                                <span class="mdl-chip__text"
+                                      title="<?php echo $accountSearchData->getClientName(); ?>"><?php echo $accountSearchItem->getShortClientName(); ?></span>
+                            </span>
+                        <?php endif; ?>
+                    </div>
+
+                    <div class="field-account field-text label-field">
+                        <div class="field-name"><?php echo __('Name'); ?></div>
+                        <?php if ($accountSearchItem->isShow()
+                            && $accountSearchItem::$accountLink
+                            && $accountSearchItem->getLink()): ?>
+                            <a title="<?php echo __('Account Details'); ?>"
+                               class="btn-action"
+                               data-action-route="<?php echo $_getvar('viewAccountRoute'); ?>"
+                               data-item-id="<?php echo $accountSearchData->getId(); ?>"
+                               data-onclick="account/view"><?php echo $accountSearchData->getName(); ?></a>
+                        <?php else: ?>
+                            <div class="field-text">
+                                <?php echo $accountSearchData->getName(); ?>
+                            </div>
+                        <?php endif; ?>
+                    </div>
+
+                    <div class="field-category field-text label-field">
+                        <div class="field-name"><?php echo __('Category'); ?></div>
+                        <div class="field-text"><?php echo $accountSearchData->getCategoryName(); ?></div>
+                    </div>
+
+                    <?php if ($accountSearchItem->isShow()): ?>
+                        <div class="field-user field-text label-field">
+                            <div class="field-name"><?php echo __('User'); ?></div>
+                            <div class="field-text"><?php echo $accountSearchItem->getShortLogin(); ?></div>
+                        </div>
+
+                        <div class="field-url field-text label-field">
+                            <div class="field-name"><?php echo __('URL / IP'); ?></div>
+                            <?php if ($accountSearchItem->isUrlIslink()): ?>
+                                <a href="<?php echo $accountSearchData->getUrl(); ?>"
+                                   target="_blank"
+                                   title="<?php printf(__('Open link to: %s'), $accountSearchData->getUrl()); ?>"><?php echo $accountSearchItem->getShortUrl(); ?></a>
+                            <?php else: ?>
+                                <div class="field-text"><?php echo $accountSearchItem->getShortUrl(); ?></div>
+                            <?php endif; ?>
+                        </div>
+                    <?php else: ?>
+                        <div class="field-user field-text label-field"></div>
+                        <div class="field-url field-text label-field"></div>
+                    <?php endif; ?>
+                </div>
+                <div class="label-row-down">
+                    <div class="tags-box">
+                        <?php foreach ($accountSearchItem->getTags() as $tag): ?>
+                            <span class="tag"
+                                  data-tag-id="<?php echo $tag->id; ?>"><?php echo $tag->name; ?></span>
+                        <?php endforeach; ?>
+                    </div>
+                </div>
+            </div>
+            <div class="label-right">
+                <div class="account-info">
+                    <?php if ($accountSearchItem->isShow()): ?>
+                        <?php if ($accountSearchItem->isPasswordExpired()): ?>
+                            <i id="icon-expired-<?php echo $accountSearchData->getId(); ?>"
+                               class="material-icons <?php echo $icons->getIconWarning()->getClass(); ?>">
+                                <?php echo $icons->getIconWarning()->getIcon(); ?></i>
+                            <span
+                                    for="icon-expired-<?php echo $accountSearchData->getId(); ?>"
+                                    class="mdl-tooltip mdl-tooltip--top"><?php echo __('Password Expired'); ?></span>
+                        <?php endif; ?>
+
+                        <?php if ($accountSearchData->getIsPrivate() === 1): ?>
+                            <i id="icon-private-<?php echo $accountSearchData->getId(); ?>"
+                               class="material-icons">lock</i>
+                            <span
+                                    for="icon-private-<?php echo $accountSearchData->getId(); ?>"
+                                    class="mdl-tooltip mdl-tooltip--top"><?php echo __('Private Account'); ?></span>
+                        <?php elseif ($accountSearchData->getIsPrivateGroup() === 1): ?>
+                            <i id="icon-private-<?php echo $accountSearchData->getId(); ?>"
+                               class="material-icons">lock_open</i>
+                            <span
+                                    for="icon-private-<?php echo $accountSearchData->getId(); ?>"
+                                    class="mdl-tooltip mdl-tooltip--top"><?php echo __('Private Account (Group)'); ?></span>
+                        <?php else: ?>
+                            <i id="accesses-<?php echo $accountSearchData->getId(); ?>"
+                               class="material-icons">face</i>
+
+                            <div class="mdl-tooltip mdl-tooltip--top"
+                                 for="accesses-<?php echo $accountSearchData->getId(); ?>">
+                                <div class="tooltip-text">
+                                    <p class="tooltip-header"><?php echo __('Permissions'); ?></p>
+                                    <p>
+                                        <?php echo implode('<br>', $accountSearchItem->getAccesses()); ?>
+                                    </p>
+                                </div>
+                            </div>
+                        <?php endif; ?>
+
+                        <?php if ($accountSearchItem->isFavorite()): ?>
+                            <i id="btn-favorite-<?php echo $accountSearchData->getId(); ?>"
+                               class="material-icons icon-favorite mdl-color-text--amber-A100"
+                               data-action-route-on="<?php echo $favoriteRouteOn; ?>"
+                               data-action-route-off="<?php echo $favoriteRouteOff; ?>"
+                               data-item-id="<?php echo $accountSearchData->getId(); ?>"
+                               data-status="<?php echo 'on'; ?>">star</i>
+                            <span
+                                    for="btn-favorite-<?php echo $accountSearchData->getId(); ?>"
+                                    class="mdl-tooltip mdl-tooltip--top"><?php echo __('Delete Favorite'); ?></span>
+                        <?php else: ?>
+                            <i id="btn-favorite-<?php echo $accountSearchData->getId(); ?>"
+                               class="material-icons icon-favorite"
+                               data-action-route-on="<?php echo $favoriteRouteOn; ?>"
+                               data-action-route-off="<?php echo $favoriteRouteOff; ?>"
+                               data-item-id="<?php echo $accountSearchData->getId(); ?>"
+                               data-status="<?php echo 'off'; ?>">star_border</i>
+                            <span
+                                    for="btn-favorite-<?php echo $accountSearchData->getId(); ?>"
+                                    class="mdl-tooltip mdl-tooltip--top"><?php echo __('Mark as Favorite'); ?></span>
+                        <?php endif; ?>
+
+                        <?php if ($accountSearchData->getNotes() !== ''): ?>
+                            <i id="notes-<?php echo $accountSearchData->getId(); ?>"
+                               class="material-icons">speaker_notes</i>
+                            <div class="mdl-tooltip mdl-tooltip--top"
+                                 for="notes-<?php echo $accountSearchData->getId(); ?>">
+                                <div class="tooltip-text">
+                                    <p class="tooltip-header"><?php echo __('Notes'); ?></p>
+                                    <p>
+                                        <?php echo $accountSearchItem->getShortNotes(); ?>
+                                    </p>
+                                </div>
+                            </div>
+                        <?php endif; ?>
+
+                        <?php if ($accountSearchItem->getNumFiles() > 0): ?>
+                            <i id="attachments-<?php echo $accountSearchData->getId(); ?>"
+                               class="material-icons">attach_file</i>
+                            <div class="mdl-tooltip mdl-tooltip--top"
+                                 for="attachments-<?php echo $accountSearchData->getId(); ?>">
+                                <div class="tooltip-text">
+                                    <?php printf('%s: %d', __('Attachments'), $accountSearchItem->getNumFiles()); ?>
+                                </div>
+                            </div>
+                        <?php endif; ?>
+
+                        <?php if (null !== $accountSearchItem->getPublicLink()): ?>
+                            <i id="publiclink-<?php echo $accountSearchData->getId(); ?>"
+                               class="material-icons"><?php echo $icons->getIconPublicLink()->getIcon(); ?></i>
+                            <div class="mdl-tooltip mdl-tooltip--top"
+                                 for="publiclink-<?php echo $accountSearchData->getId(); ?>">
+                                <div class="tooltip-text">
+                                    <p class="tooltip-header"><?php echo __('Public Link'); ?></p>
+                                    <p>
+                                        <?php printf('%s: %s', __('Expiry Date'), DateUtil::getDateFromUnix($accountSearchData->getPublicLinkDateExpire())); ?>
+                                        <br>
+                                        <?php printf('%s: %s', __('Visits'), $accountSearchData->getPublicLinkTotalCountViews()); ?>
+                                    </p>
+                                </div>
+                            </div>
+                        <?php endif; ?>
+
+                        <?php if ($wikiFilter
+                            && $accountSearchItem->isWikiMatch($wikiFilter)): ?>
+                            <?php if (AccountSearchItem::$dokuWikiEnabled): ?>
+                                <a href="<?php echo $_getvar('wikiPageUrl'), $accountSearchData->getName(); ?>"
+                                   target="_blank">
+                                    <i class="material-icons"
+                                       title="<?php echo __('Link to Wiki'); ?>">library_books</i>
+                                </a>
+                                <i class="btn-action material-icons fg-green100"
+                                   title="<?php echo __('View at Wiki'); ?>"
+                                   data-action-route="<?php echo ActionsInterface::WIKI_VIEW; ?>"
+                                   data-pagename="<?php echo $accountSearchData->getName(); ?>"
+                                   data-onclick="wiki/show">library_books</i>
+                            <?php else: ?>
+                                <a href="<?php echo $_getvar('wikiPageUrl'), $accountSearchData->getName(); ?>"
+                                   target="_blank">
+                                    <i class="material-icons"
+                                       title="<?php echo __('Link to Wiki'); ?>">library_books</i>
+                                </a>
+                            <?php endif; ?>
+                        <?php endif; ?>
+                    <?php endif; ?>
+                </div>
+
+
+                <?php if ($accountSearchItem->isShow()
+                    || $accountSearchItem->isShowRequest()): ?>
+                    <div class="account-actions">
+                        <?php foreach ($data->getDataActionsFiltered($accountSearchItem) as $action):
+                            $actionUid = uniqid('btn-action-', true);
+                            ?>
+                            <i id="<?php echo $actionUid; ?>"
+                               class="btn-action material-icons <?php echo $action->getClassesAsString(), ' ', $action->getIcon()->getClass(); ?>"
+                               data-item-id="<?php echo $accountSearchData->getId(); ?>"
+                               data-parent-id="<?php echo $accountSearchData->getParentId(); ?>"
+                                <?php foreach ($action->getData() as $dataName => $dataValue): printf('data-%s="%s"', $dataName, $dataValue); endforeach; ?>>
+                                <?php echo $action->getIcon()->getIcon(); ?></i>
+                            <span
+                                    for="<?php echo $actionUid; ?>"
+                                    class="mdl-tooltip mdl-tooltip--bottom"><?php echo $action->getTitle(); ?></span>
+                        <?php endforeach; ?>
+
+                        <?php if ($data->getDataActionsMenuCount()):
+                            $actionsMenu = $data->getDataActionsMenuFiltered($accountSearchItem);
+                            if (count($actionsMenu) > 0):
+                                $actionMenuUid = uniqid('actions-menu-lower-right-', true);
+                                ?>
+                                <button id="<?php echo $actionMenuUid; ?>"
+                                        class="mdl-button mdl-js-button mdl-button--icon">
+                                    <i class="material-icons">more_vert</i>
+                                </button>
+                                <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
+                                    for="<?php echo $actionMenuUid; ?>">
+
+                                    <?php foreach ($actionsMenu as $actionMenu): ?>
+                                        <li class="btn-action mdl-menu__item <?php echo $actionMenu->getClassesAsString(); ?>"
+                                            data-item-id="<?php echo $accountSearchData->getId(); ?>"
+                                            data-parent-id="<?php echo $accountSearchData->getParentId(); ?>"
+                                            <?php foreach ($actionMenu->getData() as $dataName => $dataValue): printf('data-%s="%s"', $dataName, $dataValue); endforeach; ?>>
+                                            <i class="material-icons <?php echo $actionMenu->getIcon()->getClass(); ?>"
+                                               title="<?php echo $actionMenu->getTitle(); ?>"><?php echo $actionMenu->getIcon()->getIcon(); ?></i>
+                                            <?php echo $actionMenu->getName(); ?>
+                                        </li>
+                                    <?php endforeach; ?>
+                                </ul>
+                            <?php endif; ?>
+                        <?php endif; ?>
+                    </div>
+                <?php endif; ?>
+            </div>
+        </div>
+    <?php endforeach; ?>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/account/search-searchbox.inc b/app/modules/web/themes/material-dark/views/account/search-searchbox.inc
new file mode 100644
index 000000000..0e3524d96
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/search-searchbox.inc
@@ -0,0 +1,156 @@
+<?php
+/**
+ * @var ThemeIcons        $icons
+ * @var callable          $_getvar
+ * @var ConfigData        $configData
+ * @var AccountSearchItem $account
+ * @var DataGrid          $data
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Html\DataGrid\DataGrid;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Services\Account\AccountSearchItem;
+
+if (!isset($data)) {
+    $data = $_getvar('data');
+}
+
+$searchFavorites = $_getvar('searchFavorites');
+$pager = $data->getPager();
+?>
+<div id="searchbox" class="round5 shadow">
+    <form method="post" name="frmSearch" id="frmSearch" class="form-action"
+          data-onsubmit="account/search"
+          data-action-route="<?php echo $_getvar('searchRoute'); ?>">
+        <div class="search-text">
+            <div class="mdl-textfield mdl-js-textfield">
+                <input class="mdl-textfield__input mdl-color-text--indigo-400"
+                       type="text" id="search"
+                       name="search"
+                       value="<?php echo $_getvar('searchTxt'); ?>"/>
+                <label class="mdl-textfield__label"
+                       for="search"><?php echo __('Text to search for'); ?></label>
+            </div>
+
+            <?php include $this->includePartial('help_account_search'); ?>
+        </div>
+
+        <div class="search-filters">
+            <select id="client" name="client"
+                    class="select-box select-box-deselect" tabindex="3">
+                <option value=""><?php echo __('Select Client'); ?></option>
+                <?php /** @var SelectItem $client */
+                foreach ($_getvar('clients') as $client): ?>
+                    <option
+                            value="<?php echo $client->getId(); ?>" <?php echo $client->isSelected() ? 'selected' : ''; ?>><?php echo $client->getName(); ?></option>
+                <?php endforeach; ?>
+            </select>
+
+            <select id="category" name="category"
+                    class="select-box select-box-deselect" tabindex="4">
+                <option value=""><?php echo __('Select Category'); ?></option>
+                <?php /** @var SelectItem $category */
+                foreach ($_getvar('categories') as $category): ?>
+                    <option
+                            value="<?php echo $category->getId(); ?>" <?php echo $category->isSelected() ? 'selected' : ''; ?>><?php echo $category->getName(); ?></option>
+                <?php endforeach; ?>
+            </select>
+        </div>
+
+        <div class="search-filters">
+
+            <div class="filter-buttons">
+                <?php if ($_getvar('showGlobalSearch')
+                    && !$_getvar('isAdmin')):
+                    ?>
+                    <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect mdl-switch--inline"
+                           for="globalSearch"
+                           title="<?php echo __('Global search'); ?>">
+                        <input type="checkbox" id="globalSearch"
+                               class="mdl-switch__input mdl-color-text--indigo-400"
+                               name="chkgsearch" tabindex="2"
+                            <?php echo $_getvar('searchGlobal') ? 'checked="checked"' : ''; ?>/>
+                        <span class="mdl-switch__label"
+                              title="<?php echo __('Global search'); ?>"></span>
+                    </label>
+                    <input type="hidden" name="gsearch"
+                           value="<?php echo $_getvar('searchGlobal'); ?>">
+                <?php endif; ?>
+            </div>
+
+            <div class="filter-buttons">
+                <?php if ($searchFavorites === true): ?>
+                    <button type="button" id="btn-favorite"
+                            class="icon-searchfav mdl-button mdl-js-button mdl-button--icon"
+                            tabindex="5">
+                        <i class="material-icons mdl-color-text--amber-A200"
+                           title="<?php echo __('Display All'); ?>">star</i>
+                    </button>
+                <?php else: ?>
+                    <button type="button" id="btn-favorite"
+                            class="icon-searchfav mdl-button mdl-js-button mdl-button--icon"
+                            tabindex="5">
+                        <i class="material-icons"
+                           title="<?php echo __('Show Favorites'); ?>">star</i>
+                    </button>
+                <?php endif; ?>
+
+                <span for="btn-favorite"
+                      class="mdl-tooltip mdl-tooltip--bottom"><?php echo __('Favorites Filtering'); ?></span>
+
+                <button type="reset" id="btn-reset"
+                        class="btn-clear mdl-button mdl-js-button mdl-button--icon"
+                        tabindex="6">
+                    <i class="material-icons"><?php echo $icons->getIconClear()->getIcon(); ?></i>
+                </button>
+                <span for="btn-reset"
+                      class="mdl-tooltip mdl-tooltip--bottom"><?php echo $icons->getIconClear()->getTitle(); ?></span>
+            </div>
+
+            <div class="filter-buttons filter-slider">
+                <span id="txt-slider"></span>
+                <input id="rpp" name="rpp" class="mdl-slider mdl-js-slider"
+                       type="range"
+                       min="3" step="3"
+                       value="<?php echo $pager->getLimitCount(); ?>"
+                       tabindex="7"/>
+                <span for="rpp"
+                      class="mdl-tooltip mdl-tooltip--bottom"><?php echo __('Accounts per page'); ?></span>
+            </div>
+            <i id="btn-filters" class="material-icons show-filter"
+               data-state="0"
+               data-show="<?php echo AccountSearchItem::$showTags; ?>"
+               data-icon-down="<?php echo $icons->getIconAdd()->getIcon(); ?>"
+               data-icon-up="<?php echo $icons->getIconRemove()->getIcon(); ?>"><?php echo $icons->getIconAdd()->getIcon(); ?></i>
+            <span for="btn-filters"
+                  class="mdl-tooltip mdl-tooltip--bottom"><?php echo __('More Filters'); ?></span>
+        </div>
+
+        <div class="search-filters-tags">
+            <select id="tags" name="tags[]" class="select-box" multiple
+                    tabindex="8">
+                <option value=""><?php echo __('Select Tag'); ?></option>
+                <?php /** @var SelectItem $tag */
+                foreach ($_getvar('tags') as $tag): ?>
+                    <option
+                            value="<?php echo $tag->getId(); ?>" <?php echo $tag->isSelected() ? 'selected' : ''; ?>><?php echo $tag->getName(); ?></option>
+                <?php endforeach; ?>
+            </select>
+        </div>
+
+        <input type="submit" style="visibility: hidden"/>
+
+        <input type="hidden" name="start"
+               value="<?php echo $pager->getLimitStart(); ?>">
+        <input type="hidden" name="skey"
+               value="<?php echo $pager->getSortKey(); ?>"/>
+        <input type="hidden" name="sorder"
+               value="<?php echo $pager->getSortOrder(); ?>"/>
+        <input type="hidden" name="searchfav"
+               value="<?php echo $searchFavorites; ?>"/>
+        <input type="hidden" name="sk" value="<?php echo $_getvar('sk'); ?>">
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/account/viewpass.inc b/app/modules/web/themes/material-dark/views/account/viewpass.inc
new file mode 100644
index 000000000..4d5af0890
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/account/viewpass.inc
@@ -0,0 +1,63 @@
+<?php
+/**
+ * @var callable       $_getvar
+ * @var ThemeIcons     $icons
+ * @var AccountExtData $accountData
+ * @var AccountAcl     $accountAcl
+ * @var ConfigData     $configData
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AccountExtData;
+use SP\Services\Account\AccountAcl;
+
+?>
+<div id="box-popup" class="box-password-view">
+    <h2 class="center"><?php echo $_getvar('header'); ?>&nbsp;
+        <?php if ($_getvar('isLinked')): ?>
+            <i title="<?php echo __('Linked Account'); ?>"
+               class="material-icons"><?php echo $icons->getIconPublicLink()->getIcon(); ?></i>
+        <?php endif; ?>
+    </h2>
+    <table>
+        <tbody>
+        <tr>
+            <?php if (!$_getvar('isImage')): ?>
+                <td class="dialog-text dialog-user-text"><?php echo wordwrap($_getvar('login'), 50, PHP_EOL, true); ?></td>
+                <td class="dialog-button right">
+                    <button class="dialog-clip-button mdl-button mdl-js-button mdl-js-ripple-effect"
+                            title="<?php echo __('Copy Username'); ?>"
+                            data-clipboard-target=".dialog-user-text">
+                        <?php echo __('User'); ?>
+                        <i class="material-icons"><?php echo $icons->getIconClipboard()->getIcon(); ?></i>
+                    </button>
+                </td>
+            <?php else: ?>
+                <td class="dialog-user-text">
+                    <img src="data:image/png;base64,<?php echo $_getvar('login'); ?>"/>
+                </td>
+                <td>&nbsp;</td>
+            <?php endif; ?>
+        </tr>
+        <tr>
+            <?php if (!$_getvar('isImage')): ?>
+                <td class="dialog-text dialog-pass-text"><?php echo wordwrap($_getvar('pass'), 50, PHP_EOL, true); ?></td>
+                <td class="dialog-button right">
+                    <button class="dialog-clip-button mdl-button mdl-js-button mdl-js-ripple-effect"
+                            title="<?php echo __('Copy Password'); ?>"
+                            data-clipboard-target=".dialog-pass-text">
+                        <?php echo __('Password'); ?>
+                        <i class="material-icons"><?php echo $icons->getIconClipboard()->getIcon(); ?></i>
+                    </button>
+                </td>
+            <?php else: ?>
+                <td class="dialog-pass-text">
+                    <img src="data:image/png;base64,<?php echo $_getvar('pass'); ?>"/>
+                </td>
+                <td>&nbsp;</td>
+            <?php endif; ?>
+        </tr>
+        </tbody>
+    </table>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/common/aux-customfields.inc b/app/modules/web/themes/material-dark/views/common/aux-customfields.inc
new file mode 100644
index 000000000..98c2b51cb
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/common/aux-customfields.inc
@@ -0,0 +1,87 @@
+<?php
+/**
+ * @var ThemeIcons        $icons
+ * @var CustomFieldItem[] $customFields
+ * @var callable          $_getvar
+ * @var Template          $this
+ */
+
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+use SP\Services\CustomField\CustomFieldItem;
+
+$customFields = $_getvar('customFields');
+
+foreach ($customFields as $index => $field):?>
+    <tr>
+        <td class="descField">
+            <?php echo $field->definitionName; ?>
+            <?php if ($field->isEncrypted && $field->isValueEncrypted === true): ?>
+                <i class="icon material-icons mdl-color-text--teal-500"
+                   title="<?php echo __('Encrypted'); ?>">
+                    lock_outline
+                </i>
+            <?php elseif ($field->isEncrypted && $field->isValueEncrypted === false): ?>
+                <i class="icon material-icons mdl-color-text--amber-500"
+                   title="<?php echo __('Data will be encrypted after saving'); ?>">
+                    lock_outline
+                </i>
+            <?php elseif ($field->isEncrypted === 0 && $field->isValueEncrypted === true): ?>
+                <i class="icon material-icons mdl-color-text--red-500"
+                   title="<?php echo __('Data will be unencrypted after saving'); ?>">
+                    lock_open
+                </i>
+            <?php endif; ?>
+
+            <?php if ($field->help): ?>
+                <div id="help-<?php echo $field->formId; ?>"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>">
+                    <?php echo $icons->getIconHelp()->getIcon(); ?>
+                </div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-<?php echo $field->formId; ?>">
+                    <p><?php echo $field->help; ?></p>
+                </div>
+            <?php endif; ?>
+        </td>
+        <td class="valField">
+            <?php if ($field->typeName === 'color' && $_getvar('isView')): ?>
+                <span class="round custom-input-color"
+                      style="background-color: <?php echo $field->value; ?>;"></span>
+            <?php elseif ($field->typeName === 'password'): ?>
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="<?php echo $field->formId; ?>"
+                           name="customfield[<?php echo $field->definitionId; ?>]"
+                           type="password"
+                           class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__no-pki <?php echo $_getvar('isView') ? 'passwordfield__input-show' : 'passwordfield__input'; ?>"
+                           data-clipboard="1"
+                           maxlength="500"
+                           value="<?php echo !$_getvar('showViewCustomPass') && !empty($field->value) ? '***' : htmlspecialchars($field->value, ENT_QUOTES); ?>" <?php echo $field->required ? 'required' : ''; ?> <?php echo $_getvar('readonly'); ?>>
+                    <label class="mdl-textfield__label"
+                           for="<?php echo $field->formId; ?>"><?php echo $field->definitionName; ?></label>
+                </div>
+            <?php elseif ($field->typeName === 'textarea'): ?>
+                <div class="mdl-textfield mdl-js-textfield">
+                    <textarea
+                            class="mdl-textfield__input mdl-color-text--indigo-400"
+                            type="text" rows="3"
+                            name="customfield[<?php echo $field->definitionId; ?>]"
+                            id="<?php echo $field->formId; ?>" <?php echo $_getvar('readonly'); ?>><?php echo htmlspecialchars($field->value, ENT_QUOTES); ?></textarea>
+                    <label class="mdl-textfield__label"
+                           for="<?php echo $field->formId; ?>"><?php echo $field->definitionName; ?></label>
+                </div>
+            <?php else: ?>
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="<?php echo $field->formId; ?>"
+                           name="customfield[<?php echo $field->definitionId; ?>]"
+                           type="<?php echo $field->typeName; ?>"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="500"
+                           value="<?php echo htmlspecialchars($field->value, ENT_QUOTES); ?>" <?php echo $field->required ? 'required' : ''; ?> <?php echo $_getvar('readonly'); ?>>
+                    <label class="mdl-textfield__label"
+                           for="<?php echo $field->formId; ?>"><?php echo $field->definitionName; ?></label>
+                </div>
+            <?php endif; ?>
+        </td>
+    </tr>
+<?php endforeach; ?>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/common/datatabs.inc b/app/modules/web/themes/material-dark/views/common/datatabs.inc
new file mode 100644
index 000000000..51835299c
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/common/datatabs.inc
@@ -0,0 +1,35 @@
+<?php
+/**
+ * @var DataTab[]  $tabs
+ * @var ThemeIcons $icons
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\DataTab;
+use SP\Mvc\View\Template;
+
+$tabs = $_getvar('tabs');
+?>
+
+<!-- Start Tabs-->
+<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
+    <div id="tabsHeader" class="mdl-tabs__tab-bar"></div>
+
+    <?php foreach ($tabs as $index => $tab): ?>
+        <div id="tabs-<?php echo $index; ?>"
+             class="mdl-tabs__panel"
+             data-tab-route="<?php echo $_getvar('tabsRoute'); ?>"
+             data-tab-index="<?php echo $index; ?>">
+            <div class="tab-data">
+                <?php echo $tab->render(); ?>
+            </div>
+        </div>
+
+        <script type="text/javascript">
+            sysPassApp.theme.html.tabs.add("#tabsHeader", <?php echo $index; ?>, "<?php echo $tab->getTitle(); ?>", <?php echo $index === $_getvar('activeTab') ? 1 : 0; ?>);
+        </script>
+    <?php endforeach; ?>
+</div>
+<!-- End Tabs-->
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/common/debug.inc b/app/modules/web/themes/material-dark/views/common/debug.inc
new file mode 100644
index 000000000..3c96adda9
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/common/debug.inc
@@ -0,0 +1,23 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+<div ID='debuginfo' class='round'>
+    <h3>DEBUG INFO</h3>
+    <ul>
+        <li>RENDER -> <?php echo $_getvar('time'); ?> sec</li>
+        <li>MEM -> Init: <?php echo $_getvar('memInit'); ?> KB -
+            End: <?php echo $_getvar('memEnd'); ?> KB -
+            Total: <?php echo $_getvar('memEnd') - $_getvar('memInit'); ?> KB
+        </li>
+        <li>SESSION:
+            <pre><?php echo print_r($_SESSION, true) ?></pre>
+        </li>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/common/errorfancy.inc b/app/modules/web/themes/material-dark/views/common/errorfancy.inc
new file mode 100644
index 000000000..2c1aa68c3
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/common/errorfancy.inc
@@ -0,0 +1,3 @@
+<div id="fancyView" class="msgError">
+    <?php include $this->includeTemplate('error-list', 'main'); ?>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/config/accounts.inc b/app/modules/web/themes/material-dark/views/config/accounts.inc
new file mode 100644
index 000000000..279a2b520
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/accounts.inc
@@ -0,0 +1,412 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+
+<?php if ($_getvar('gdIsAvailable') !== true): ?>
+    <div class="msg-option-unvailable">
+        <?php printf(__('The \'%s\' extension is unavailable'), 'gd'); ?>
+        <i id="help-gd"
+           class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+        <div class="mdl-tooltip mdl-tooltip--large" for="help-gd">
+            <p>
+                <?php echo __('This extension is needed to display passwords as images'); ?>
+            </p>
+        </div>
+    </div>
+<?php endif; ?>
+
+<form method="post" name="frmAccounts" id="frmAccounts" class="form-action"
+      data-onsubmit="config/save"
+      data-action-route="configAccount/save"
+      data-hash="">
+
+    <div id="title" class="titleNormal">
+        <i class="material-icons">search</i>
+        <?php echo __('Searching'); ?>
+    </div>
+
+    <table id="tblAccounts" class="data tblConfig">
+        <tr>
+            <td class="descField">
+                <?php echo __('Results per page'); ?>
+                <div id="help-account_count"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-account_count">
+                    <p>
+                        <?php echo __('Number of results per page to display when performing a search.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="account_count" name="account_count" type="number"
+                           step="6"
+                           pattern="[0-9]{1,5}"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="5"
+                           value="<?php echo $configData->getAccountCount(); ?>"
+                           required/>
+                    <label class="mdl-textfield__label"
+                           for="account_count"><?php echo __('Results per page'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-accounts-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="account_expire_enabled">
+                                <input type="checkbox"
+                                       id="account_expire_enabled"
+                                       class="mdl-switch__input"
+                                       name="account_expire_enabled" <?php echo $configData->isAccountExpireEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Accounts password expiry'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Enables the accounts password expiry date.'); ?></span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Password expiry time'); ?>
+                <div id="help-account_expire_time"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-account_expire_time">
+                    <p>
+                        <?php echo __('Number of days for account\'s password expiry date.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="account_expire_time" name="account_expire_time"
+                           type="number"
+                           pattern="[0-9]{1,3}"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           value="<?php echo $configData->getAccountExpireTime() / 24 / 3600; ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="account_expire_time"><?php echo __('Expire time (days)'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-accounts-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="account_link_enabled">
+                                <input type="checkbox" id="account_link_enabled"
+                                       class="mdl-switch__input"
+                                       name="account_link_enabled" <?php echo $configData->isAccountLink() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Account name as link'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Enables to use the account name as a link to account details.'); ?></span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="account_globalsearch_enabled">
+                                <input type="checkbox"
+                                       id="account_globalsearch_enabled"
+                                       class="mdl-switch__input"
+                                       name="account_globalsearch_enabled" <?php echo $configData->isGlobalSearch() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Global searches'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Allows the users to do searches that includes all accounts, they won\'t be able to display the account details if they don\'t have permission.'); ?></span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="account_passtoimage_enabled">
+                                <input type="checkbox"
+                                       id="account_passtoimage_enabled"
+                                       class="mdl-switch__input"
+                                       name="account_passtoimage_enabled" <?php echo $configData->isAccountPassToImage() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Image to show password'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Generate an image with a text of the account password.'); ?>
+                                <br>
+                                <?php echo __('Useful for environments where copying a password to clipboard is a security risk.'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="account_resultsascards_enabled">
+                                <input type="checkbox"
+                                       id="account_resultsascards_enabled"
+                                       class="mdl-switch__input"
+                                       name="account_resultsascards_enabled" <?php echo $configData->isResultsAsCards() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Results like Cards'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Displays account\'s search results on a card like format.'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="account_fullgroup_access_enabled">
+                                <input type="checkbox"
+                                       id="account_fullgroup_access_enabled"
+                                       class="mdl-switch__input"
+                                       name="account_fullgroup_access_enabled" <?php echo $configData->isAccountFullGroupAccess() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Secondary Groups Access'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Grants access to users that are included in secondary groups.'); ?>
+                                <br>
+                                <?php echo __('By default, user in a secondary group is granted if the secondary group is set as user\'s main group.'); ?>
+                            </span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+    </table>
+
+    <div id="title" class="titleNormal">
+        <i class="material-icons">link</i>
+        <?php echo __('Public Links'); ?>
+    </div>
+
+    <table id="tblFiles" class="data tblConfig round">
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-publiclinks-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="publiclinks_enabled">
+                                <input type="checkbox" id="publiclinks_enabled"
+                                       class="mdl-switch__input"
+                                       name="publiclinks_enabled" <?php echo $configData->isPublinksEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Enable Public Links'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Enables the ability to create public links to view an account\'s details'); ?>
+                                <br>
+                                <?php echo __('Linked accounts will be visible by anyone that have the link.'); ?>
+                                <br>
+                                <?php echo __('In order to create links, users must have activated the option on their profiles.'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="publiclinks_image_enabled">
+                                <input type="checkbox"
+                                       id="publiclinks_image_enabled"
+                                       class="mdl-switch__input"
+                                       name="publiclinks_image_enabled" <?php echo $configData->isPublinksImageEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Use an image for password'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('The account password is shown as image.'); ?>
+                            </span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Expire time'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="publiclinks_maxtime" name="publiclinks_maxtime"
+                           type="number" step="5"
+                           pattern="[0-9]{1,5}"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="5"
+                           value="<?php echo $configData->getPublinksMaxTime() / 60; ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="publiclinks_maxtime"><?php echo __('Expire time (minutes)'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Maximum visits'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="publiclinks_maxviews" name="publiclinks_maxviews"
+                           type="number" step="1"
+                           pattern="[0-9]{1,5}"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="5"
+                           value="<?php echo $configData->getPublinksMaxViews(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="publiclinks_maxviews"><?php echo __('Maximum visits'); ?></label>
+                </div>
+            </td>
+        </tr>
+    </table>
+
+    <div id="title" class="titleNormal">
+        <i class="material-icons">attachment</i>
+        <?php echo __('Files'); ?>
+    </div>
+
+    <table id="tblFiles" class="data tblConfig">
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-accounts-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="files_enabled">
+                                <input type="checkbox" id="files_enabled"
+                                       class="mdl-switch__input"
+                                       name="files_enabled" <?php echo $configData->isFilesEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Files management'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Enables the uploading and downloading of accounts files.'); ?></span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Allowed MIME types'); ?>
+                <div id="help-files_allowed_mimetypes"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-files_allowed_mimetypes">
+                    <p>
+                        <?php echo __('Allowed file MIME types for uploading.'); ?>
+                    </p>
+                    <p>
+                        <?php echo __('In order to add more MIME types, you need to add them into mime.xml file within the config directory.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Allowed MIME types'); ?></div>
+
+                <select id="files_allowed_mimetypes"
+                        name="files_allowed_mimetypes[]"
+                        multiple="multiple" class="select-box"
+                        data-create="true">
+                    <?php /** @var SelectItem $mimeType */
+                    foreach ($_getvar('mimeTypes') as $mimeType): ?>
+                        <option
+                                value="<?php echo $mimeType->getName(); ?>"
+                            <?php echo $mimeType->isSelected() ? 'selected' : '' ?>><?php echo $mimeType->getName(); ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Maximum file size'); ?>
+                <div id="help-files_allowed_size"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-files_allowed_size">
+                    <p>
+                        <?php echo __('Sets the maximum file size for uploading.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Absolute maximum is 16MB.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="files_allowed_size" name="files_allowed_size"
+                           type="number" step="512"
+                           pattern="[0-9]{1,5}"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="5"
+                           value="<?php echo $configData->getFilesAllowedSize(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="files_allowed_size"><?php echo __('Maximum file size in kilobytes'); ?></label>
+                </div>
+            </td>
+        </tr>
+    </table>
+</form>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button form="frmAccounts"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/config/backup.inc b/app/modules/web/themes/material-dark/views/config/backup.inc
new file mode 100644
index 000000000..d248d914e
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/backup.inc
@@ -0,0 +1,217 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var callable   $_getRoute
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+
+<?php if ($_getvar('pharIsAvailable') !== true): ?>
+    <div class="msg-option-unvailable">
+        <?php printf(__('The \'%s\' extension is unavailable'), 'phar'); ?>
+        <i id="help-phar"
+           class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+        <div class="mdl-tooltip mdl-tooltip--large" for="help-phar">
+            <p>
+                <?php echo __('This extension is needed to build the application\'s backup files'); ?>
+            </p>
+        </div>
+    </div>
+<?php endif; ?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">backup</i>
+    <?php echo __('Backup'); ?>
+</div>
+
+<table class="data">
+    <tr>
+        <td class="descField">
+            <?php echo __('Result'); ?>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Result'); ?></div>
+
+            <?php echo $_getvar('lastBackupTime'); ?>
+        </td>
+    </tr>
+    <?php if ($_getvar('ctx_userIsAdminApp')): ?>
+        <tr>
+            <td class="descField">
+                <?php echo __('Download Current'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Download Current'); ?></div>
+
+                <?php if ($_getvar('hasBackup')): ?>
+                    <a href="<?php echo $_getRoute('configBackup/downloadBackupDb'); ?>"
+                       class="download" target="_blank">
+
+                        <button type="button" class="mdl-button mdl-js-button">
+                            <?php echo __('DB Backup'); ?>
+                        </button>
+                    </a>
+
+                    <a href="<?php echo $_getRoute('configBackup/downloadBackupApp'); ?>"
+                       class="download" target="_blank">
+                        <button type="button" class="mdl-button mdl-js-button">
+                            <?php echo __('sysPass Backup'); ?>
+                        </button>
+                    </a>
+                <?php else: echo __('There aren\'t any backups available'); ?>
+                <?php endif; ?>
+            </td>
+        </tr>
+    <?php endif; ?>
+</table>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="help_backup_button" type="button"
+                    class="btn-help mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored"
+                    title="<?php echo $icons->getIconHelp()->getTitle(); ?>"
+                    data-help="help-backup">
+                <i class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+            </button>
+
+            <div for="help-backup" class="help-box"
+                 title="<?php echo __('Backup') ?>">
+                <div class="help-container">
+                    <p class="help-text"><?php echo __('The backup allows you to save and download sysPass database and application files including its configuration.'); ?></p>
+
+                    <p class="help-text"><?php echo __('With this method it\'s possible to either save all sysPass data in another place or use it to make the application portable.'); ?></p>
+                </div>
+            </div>
+        </li>
+        <li>
+
+            <button type="button"
+                    class="btn-action mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconPlay()->getClassButton(); ?>"
+                    data-onclick="config/backup"
+                    data-action-route="configBackup/fileBackup"
+                    title="<?php echo $icons->getIconPlay()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">import_export</i>
+    <?php echo __('Export Accounts'); ?>
+</div>
+
+<form method="post" name="frmExport" id="frmExport" class="form-action"
+      data-onsubmit="config/export"
+      data-action-route="configBackup/xmlExport">
+    <table class="data">
+        <tr>
+            <td class="descField">
+                <?php echo __('Result'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Result'); ?></div>
+
+                <?php echo $_getvar('lastExportTime'); ?>
+            </td>
+        </tr>
+        <?php if ($_getvar('ctx_userIsAdminApp') || $_getvar('isDemo')): ?>
+            <tr>
+                <td class="descField">
+                    <?php echo __('Download Current'); ?>
+                </td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Download Current'); ?></div>
+
+                    <?php if ($_getvar('hasExport')): ?>
+                        <a href="<?php echo $_getRoute('configBackup/downloadExport'); ?>"
+                           class="download" target="_blank">
+                            <button type="button"
+                                    class="mdl-button mdl-js-button">
+                                XML <?php echo $_getvar('siteName'); ?>
+                            </button>
+                        </a>
+                    <?php else: echo __('No export file found'); ?>
+                    <?php endif; ?>
+                </td>
+            </tr>
+        <?php endif; ?>
+        <tr>
+            <td class="descField">
+                <?php echo __('Export Password'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="export-password" name="exportPwd" type="password"
+                           class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input"
+                           maxlength="255"/>
+                    <label class="mdl-textfield__label"
+                           for="exportPwd"><?php echo __('Export Password'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Export Password (repeat)'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="export-password_repeat" name="exportPwdR"
+                           type="password"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="255"/>
+                    <label class="mdl-textfield__label"
+                           for="exportPwdR"><?php echo __('Export Password (repeat)'); ?></label>
+                </div>
+            </td>
+        </tr>
+    </table>
+</form>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button id="help_export_button" type="button"
+                    class="btn-help mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored"
+                    title="<?php echo $icons->getIconHelp()->getTitle(); ?>"
+                    data-help="help-export">
+                <i class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+            </button>
+
+            <div for="help-export" class="help-box"
+                 title="<?php echo __('Export Accounts'); ?>">
+                <div class="help-container">
+                    <p class="help-text"><?php echo __('The accounts export allows you to save the accounts and their data in XML format to be imported in another sysPass instance.'); ?></p>
+
+                    <p class="help-text"><?php echo __('Exported items are accounts, clients, categories and tags.'); ?></p>
+
+                    <p class="help-text"><?php echo __('Accounts\' password are exported in an encrypted way for better security.'); ?></p>
+
+                    <p class="help-text"><?php echo __('It\'s possible to set an export password to save all the encrypted data in the XML file.'); ?></p>
+                </div>
+            </div>
+        </li>
+        <li>
+            <button form="frmExport"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconPlay()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconPlay()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/config/encryption.inc b/app/modules/web/themes/material-dark/views/config/encryption.inc
new file mode 100644
index 000000000..9d172a63d
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/encryption.inc
@@ -0,0 +1,363 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+$disabled = $configData->isMaintenance() ? '' : 'disabled';
+?>
+
+<form method="post" name="frmCrypt" id="frmCrypt" class="form-action"
+      data-onsubmit="config/masterpass"
+      data-action-route="configEncryption/save"
+      data-hash="">
+
+    <div id="title" class="titleNormal">
+        <i class="material-icons">enhanced_encryption</i>
+        <?php echo __('Master Password'); ?>
+    </div>
+
+    <table class="data tblConfig round">
+        <?php if ($_getvar('lastUpdateMPass') > 0): ?>
+            <tr>
+                <td class="descField">
+                    <?php echo __('Last change'); ?>
+                </td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Last change'); ?></div>
+
+                    <?php echo date('r', $_getvar('lastUpdateMPass')); ?>
+                </td>
+            </tr>
+        <?php endif; ?>
+        <tr>
+            <td class="descField">
+                <?php echo __('Current Master Password'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="current_masterpass" name="current_masterpass"
+                           type="password"
+                           class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input-show"
+                           maxlength="255" required <?php echo $disabled; ?> />
+                    <label class="mdl-textfield__label"
+                           for="current_masterpass"><?php echo __('Current Master Password'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('New Master Password'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="new_masterpass" name="new_masterpass"
+                           type="password"
+                           class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input"
+                           maxlength="255" required <?php echo $disabled; ?> />
+                    <label class="mdl-textfield__label"
+                           for="new_masterpass"><?php echo __('New Master Password'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('New Master Password (repeat)'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="new_masterpass_repeat"
+                           name="new_masterpass_repeat" type="password"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="255" required <?php echo $disabled; ?> />
+                    <label class="mdl-textfield__label"
+                           for="new_masterpass_repeat"><?php echo __('New Master Password (repeat)'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <?php if (!$configData->isMaintenance()): ?>
+                    <div
+                            class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></div>
+                    <?php echo __('Maintenance mode not enabled'); ?>. <?php echo __('Please, enable it to avoid unwanted behavior from other sessions'); ?>
+                    <br>
+                <?php endif; ?>
+                <div
+                        class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></div>
+                <?php echo __('You should save the new password on a secure place'); ?>
+                <br>
+                <div
+                        class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></div>
+                <?php echo __('All accounts passwords will be encrypted again.'); ?>
+                <br>
+                <div
+                        class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></div>
+                <?php echo __('Users will need to enter the new Master Password.'); ?>
+                <br>
+                <div
+                        class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></div>
+                <strong><?php printf(__('It will be updated %s accounts. This process could take some time long.'), $_getvar('numAccounts')); ?></strong>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-masterpass-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="no_account_change">
+                                <input type="checkbox" id="no_account_change"
+                                       class="mdl-switch__input"
+                                       name="no_account_change"/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Do not modify accounts'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Sets a new Master Password without re-encrypting the accounts.'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="confirm_masterpass_change">
+                                <input type="checkbox"
+                                       id="confirm_masterpass_change"
+                                       class="mdl-switch__input"
+                                       name="confirm_masterpass_change"/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Confirm change'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Confirm the master password change after you have been read all the above warnings.'); ?>
+                            </span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+    </table>
+
+    <?php if ($_getvar('taskId')): ?>
+        <input type="hidden" name="taskId"
+               value="<?php echo $_getvar('taskId'); ?>">
+        <input type="hidden" name="lock" value="masterpass">
+    <?php endif; ?>
+</form>
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="help_mpass_button" type="button"
+                    class="btn-help mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored"
+                    title="<?php echo $icons->getIconHelp()->getTitle(); ?>"
+                    data-help="help-mpass">
+                <i class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+            </button>
+
+            <div for="help-mpass" class="help-box"
+                 title="<?php echo __('Master Password'); ?>">
+                <div class="help-container">
+                    <p class="help-text"><?php echo __('The Master Password is used to encrypt sysPass accounts passwords and keep them safe.'); ?></p>
+
+                    <p class="help-text"><?php echo __('It\'s advisable to change it from time to time and use a complex password that includes numbers, letters and symbols.'); ?></p>
+
+                    <p class="help-text"><?php printf(__('You could get more info on: %s'), '<a target="_blank" href="https://doc.syspass.org">https://doc.syspass.org</a>'); ?></p>
+                </div>
+            </div>
+        </li>
+        <?php if ($_getvar('ctx_userIsAdminApp')): ?>
+            <li>
+                <button type="button"
+                        class="btn-action mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconCheck()->getClassButton(); ?>"
+                        data-onclick="config/refreshMpass"
+                        data-action-route="configEncryption/refresh"
+                        title="<?php echo __('Update master password hash'); ?>">
+                    <i class="material-icons"><?php echo $icons->getIconRefresh()->getIcon(); ?></i>
+                </button>
+            </li>
+        <?php endif; ?>
+
+        <?php if ($configData->isMaintenance() && $_getvar('numAccounts') > 0): ?>
+            <li>
+                <button form="frmCrypt"
+                        class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconPlay()->getClassButton(); ?>"
+                        title="<?php echo $icons->getIconPlay()->getTitle(); ?>">
+                    <i class="material-icons"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+                </button>
+            </li>
+        <?php endif; ?>
+    </ul>
+</div>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">enhanced_encryption</i>
+    <?php echo __('Temporary Password'); ?>
+</div>
+
+<form method="post" name="frmTempMasterPass" id="frmTempMasterPass"
+      class="form-action"
+      data-onsubmit="config/save"
+      data-action-route="configEncryption/saveTemp">
+    <table class="data tblConfig">
+        <tr>
+            <td class="descField">
+                <?php echo __('Last change'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Last change'); ?></div>
+
+                <?php echo ($_getvar('tempMasterPassTime') > 0) ? date('r', $_getvar('tempMasterPassTime')) : __('Not generated'); ?>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Valid until'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Valid until'); ?></div>
+
+                <?php
+                $tempMasterMaxTime = $_getvar('tempMasterMaxTime');
+                if (time() > $tempMasterMaxTime): ?>
+                    <span style="color: red"><?php echo date('r', $tempMasterMaxTime); ?></span>
+                <?php elseif ($tempMasterMaxTime > 0): echo date('r', $tempMasterMaxTime); ?>
+                <?php else: echo __('Not generated'); ?>
+                <?php endif; ?>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Attempts'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Attempts'); ?></div>
+
+                <?php echo $_getvar('tempMasterAttempts'); ?>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Life (s)'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="temporary_masterpass_maxtime"
+                           name="temporary_masterpass_maxtime" type="number"
+                           step="600"
+                           pattern="[0-9]{2,6}"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           value="3600"
+                           required/>
+                    <label class="mdl-textfield__label"
+                           for="temporary_masterpass_maxtime"><?php echo __('Life (s)'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-masterpass-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="temporary_masterpass_email">
+                                <input type="checkbox"
+                                       id="temporary_masterpass_email"
+                                       class="mdl-switch__input"
+                                       name="temporary_masterpass_email" <?php echo !$configData->isMailEnabled() ? 'disabled' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Send email'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Sends an email to all users or only to those whose group is selected.'); ?>
+                            </span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Group'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Group'); ?></div>
+
+                <select id="temporary_masterpass_group"
+                        name="temporary_masterpass_group"
+                        class="select-box select-box-deselect" <?php echo !$configData->isMailEnabled() ? 'disabled' : ''; ?>>
+                    <option value=""><?php echo __('Select Group'); ?></option>
+                    <?php /** @var SelectItem $userGroup */
+                    foreach ($_getvar('userGroups') as $userGroup): ?>
+                        <option
+                                value="<?php echo $userGroup->getId(); ?>"><?php echo $userGroup->getName(); ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </td>
+        </tr>
+        <?php if (!empty($_getvar('tempMasterPass'))): ?>
+            <tr>
+                <td class="descField">
+                    <?php echo __('Password'); ?>
+                </td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Password'); ?></div>
+
+                    <?php echo $_getvar('tempMasterPass'); ?>
+                </td>
+            </tr>
+        <?php endif; ?>
+    </table>
+</form>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button id="help_tmpass_button"
+                    class="btn-help mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored"
+                    title="<?php echo $icons->getIconHelp()->getTitle(); ?>"
+                    data-help="help-tmpass">
+                <i class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+            </button>
+
+
+            <div for="help-tmpass" class="help-box"
+                 title="<?php echo __('Temporary Password'); ?>">
+                <div class="help-container">
+                    <p class="help-text"><?php echo __('The temporary password is used as a Master Password for the users that need to enter it during login. By this way there is no need to tell them the real Master Password.'); ?></p>
+                </div>
+            </div>
+        </li>
+        <li>
+            <button form="frmTempMasterPass"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconPlay()->getClassButton(); ?>"
+                    title="<?php echo __('Generate'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/config/general-auth.inc b/app/modules/web/themes/material-dark/views/config/general-auth.inc
new file mode 100644
index 000000000..b212f0a63
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/general-auth.inc
@@ -0,0 +1,135 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">verified_user</i>
+    <?php echo __('Authentication'); ?>
+</div>
+
+<table id="tblAuth" class="data tblConfig">
+    <tr>
+        <td class="descField"></td>
+        <td class="valField">
+            <ul class="config-auth-list-action mdl-list">
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="authbasic_enabled">
+                            <input type="checkbox" id="authbasic_enabled"
+                                   class="mdl-switch__input"
+                                   name="authbasic_enabled" <?php echo $configData->isAuthBasicEnabled() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Use Auth Basic'); ?></span>
+                        <span class="mdl-list__item-sub-title"><?php echo __('Use Auth Basic for authorizing accesses to the application'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="authbasicautologin_enabled">
+                            <input type="checkbox"
+                                   id="authbasicautologin_enabled"
+                                   class="mdl-switch__input"
+                                   name="authbasicautologin_enabled" <?php echo $configData->isAuthBasicAutoLoginEnabled() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Use Auth Basic SSO'); ?></span>
+                        <span class="mdl-list__item-sub-title"><?php echo __('Use auto-login through Auth Basic'); ?></span>
+                    </span>
+                </li>
+            </ul>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Domain'); ?>
+            <div id="help-domain"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large" for="help-domain">
+                <p>
+                    <?php echo __('The domain will be added to sysPass user name for checking against the Auth Basic one.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="authbasic_domain" name="authbasic_domain" type="text"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       maxlength="128"
+                       value="<?php echo $configData->getAuthBasicDomain(); ?>">
+                <label class="mdl-textfield__label"
+                       for="authbasic_domain"><?php echo __('Domain name'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Default Group'); ?>
+            <div id="help-sso_defaultgroup"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large"
+                 for="help-sso_defaultgroup">
+                <p>
+                    <?php echo __('Sets the default users group for newly created SSO users'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Default Group'); ?></div>
+
+            <select id="sso_defaultgroup" name="sso_defaultgroup"
+                    class="select-box sel-chosen-usergroup">
+                <option value=""><?php echo __('Select Group'); ?></option>
+                <?php /** @var SelectItem $userGroup */
+                foreach ($_getvar('userGroups') as $userGroup): ?>
+                    <option
+                            value="<?php echo $userGroup->getId(); ?>" <?php echo $userGroup->getId() === $configData->getSsoDefaultGroup() ? 'selected' : ''; ?>><?php echo $userGroup->getName(); ?></option>
+                <?php endforeach; ?>
+            </select>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Default Profile'); ?>
+            <div id="help-sso_defaultprofile"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large"
+                 for="help-sso_defaultprofile">
+                <p>
+                    <?php echo __('Sets the default profile for the newly created SSO users.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Default Profile'); ?></div>
+
+            <select id="sso_defaultprofile" name="sso_defaultprofile"
+                    class="select-box sel-chosen-profile">
+                <option value=""><?php echo __('Select User'); ?></option>
+                <?php /** @var SelectItem $userProfile */
+                foreach ($_getvar('userProfiles') as $userProfile): ?>
+                    <option
+                            value="<?php echo $userProfile->getId(); ?>" <?php echo ($userProfile->getId() === $configData->getSsoDefaultProfile()) ? 'selected' : ''; ?>><?php echo $userProfile->getName(); ?></option>
+                <?php endforeach; ?>
+            </select>
+        </td>
+    </tr>
+</table>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/config/general-events.inc b/app/modules/web/themes/material-dark/views/config/general-events.inc
new file mode 100644
index 000000000..025172c18
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/general-events.inc
@@ -0,0 +1,126 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">view_headline</i>
+    <?php echo __('Events'); ?>
+</div>
+
+<table id="tblEvents" class="data tblConfig">
+    <tr>
+        <td class="descField"></td>
+        <td class="valField">
+            <ul class="config-events-list-action mdl-list">
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="log_enabled">
+                            <input type="checkbox" id="log_enabled"
+                                   class="mdl-switch__input"
+                                   name="log_enabled" <?php echo $configData->isLogEnabled() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Enable event log'); ?></span>
+                        <span class="mdl-list__item-sub-title"><?php echo __('Saves the actions done by the application.'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="syslog_enabled">
+                            <input type="checkbox" id="syslog_enabled"
+                                   class="mdl-switch__input"
+                                   name="syslog_enabled" <?php echo $configData->isSyslogEnabled() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Enable Syslog'); ?></span>
+                        <span class="mdl-list__item-sub-title"></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="remotesyslog_enabled">
+                            <input type="checkbox" id="remotesyslog_enabled"
+                                   class="mdl-switch__input"
+                                   name="remotesyslog_enabled" <?php echo $configData->isSyslogRemoteEnabled() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Enable Remote Syslog'); ?></span>
+                        <span class="mdl-list__item-sub-title"></span>
+                    </span>
+                </li>
+
+            </ul>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Server'); ?>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="remotesyslog_server" name="remotesyslog_server"
+                       type="text"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       value="<?php echo $configData->getSyslogServer(); ?>"/>
+                <label class="mdl-textfield__label"
+                       for="remotesyslog_server"><?php echo __('Hostname or IP address'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Port'); ?>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="remotesyslog_port" name="remotesyslog_port"
+                       type="number"
+                       pattern="[0-9]{1-5}" step="1" max="65535"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       value="<?php echo $configData->getSyslogPort(); ?>"/>
+                <label class="mdl-textfield__label"
+                       for="remotesyslog_port"><?php echo __('Port'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Events'); ?>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Events'); ?></div>
+
+            <select id="log_events" name="log_events[]" multiple="multiple"
+                    class="select-box" data-create="true">
+                <?php /** @var SelectItem $logEvent */
+                foreach ($_getvar('logEvents') as $logEvent): ?>
+                    <option
+                            value="<?php echo $logEvent->getName(); ?>"
+                        <?php echo $logEvent->isSelected() ? 'selected' : '' ?>><?php echo $logEvent->getName(); ?></option>
+                <?php endforeach; ?>
+            </select>
+        </td>
+    </tr>
+</table>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/config/general-proxy.inc b/app/modules/web/themes/material-dark/views/config/general-proxy.inc
new file mode 100644
index 000000000..d8213754e
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/general-proxy.inc
@@ -0,0 +1,105 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">device_hub</i>
+    <?php echo __('Proxy'); ?>
+</div>
+
+<table id="tblProxy" class="data tblConfig">
+    <tr>
+        <td class="descField"></td>
+        <td class="valField">
+            <ul class="config-proxy-list-action mdl-list">
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="proxy_enabled">
+                            <input type="checkbox" id="proxy_enabled"
+                                   class="mdl-switch__input"
+                                   name="proxy_enabled" <?php echo $configData->isProxyEnabled() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Use Proxy'); ?></span>
+                        <span class="mdl-list__item-sub-title"><?php echo __('Use a proxy server for checking out for updates and notifications.'); ?></span>
+                    </span>
+                </li>
+            </ul>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Server'); ?>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="proxy_server" name="proxy_server" type="text"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       maxlength="128"
+                       value="<?php echo $configData->getProxyServer(); ?>">
+                <label class="mdl-textfield__label"
+                       for="proxy_server"><?php echo __('Proxy server'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Port'); ?>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="proxy_port" name="proxy_port" type="number"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       pattern="[0-9]{1,5}"
+                       maxlength="128"
+                       value="<?php echo $configData->getProxyPort(); ?>">
+                <label class="mdl-textfield__label"
+                       for="proxy_port"><?php echo __('Proxy server port'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('User'); ?>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="proxy_user" name="proxy_user" type="text"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       maxlength="128"
+                       value="<?php echo $configData->getProxyUser(); ?>">
+                <label class="mdl-textfield__label"
+                       for="proxy_user"><?php echo __('Proxy server user'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Password'); ?>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="proxy_pass" name="proxy_pass" type="password"
+                       class="mdl-textfield__input passwordfield__input mdl-color-text--indigo-400"
+                       maxlength="128"
+                       value="<?php echo $configData->getProxyPass() ? '***' : ''; ?>">
+                <label class="mdl-textfield__label"
+                       for="proxy_pass"><?php echo __('Proxy server password'); ?></label>
+            </div>
+        </td>
+    </tr>
+
+</table>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/config/general-site.inc b/app/modules/web/themes/material-dark/views/config/general-site.inc
new file mode 100644
index 000000000..c35b9565b
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/general-site.inc
@@ -0,0 +1,232 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+
+<?php if (!$_getvar('curlIsAvailable')): ?>
+    <div class="msg-option-unvailable">
+        <?php printf(__('The \'%s\' extension is unavailable'), 'curl'); ?>
+        <i id="help-curl"
+           class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+        <div class="mdl-tooltip mdl-tooltip--large" for="help-curl">
+            <p>
+                <?php echo __('This extension is needed to check for sysPass updates and notices'); ?>
+            </p>
+        </div>
+    </div>
+<?php endif; ?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">home</i>
+    <?php echo __('Site'); ?>
+</div>
+
+<table id="tblSite" class="data tblConfig">
+    <tr>
+        <td class="descField">
+            <?php echo __('Language'); ?>
+            <div id="help-sitelang"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large" for="help-sitelang">
+                <p>
+                    <?php echo __('Sets the global app language. You can set a per user language on preferences.'); ?>
+                </p>
+
+                <p>
+                    <?php echo __('To improve/add translations, you can get involved at https://poeditor.com/join/project/fmlsBuugyv'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Language'); ?></div>
+
+            <select name="sitelang" id="sel-sitelang" size="1"
+                    class="select-box sel-chosen-ns">
+                <?php /** @var SelectItem $lang */
+                foreach ($_getvar('langs') as $lang): ?>
+                    <option
+                            value='<?php echo $lang->getId(); ?>' <?php echo $lang->isSelected() ? 'selected' : ''; ?>><?php echo $lang->getName(); ?></option>
+                <?php endforeach; ?>
+            </select>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Visual Theme'); ?>
+            <div id="help-sitetheme"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large" for="help-sitetheme">
+                <p>
+                    <?php echo __('Sets the global application visual theme. You can set a per user visual theme on preferences.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Visual Theme'); ?></div>
+
+            <select name="sitetheme" id="sel-sitetheme" size="1"
+                    class="select-box sel-chosen-ns">
+                <?php /** @var SelectItem $theme */
+                foreach ($_getvar('themes') as $theme): ?>
+                    <option
+                            value='<?php echo $theme->getId(); ?>' <?php echo $theme->isSelected() ? 'selected' : ""; ?>><?php echo $theme->getName(); ?></option>
+                <?php endforeach; ?>
+            </select>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Session timeout (s)'); ?>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="session_timeout" name="session_timeout" type="number"
+                       min="0" step="300"
+                       pattern="[0-9]{2,4}"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       maxlength="5"
+                       value="<?php echo $configData->getSessionTimeout(); ?>"
+                       required/>
+                <label class="mdl-textfield__label"
+                       for="session_timeout"><?php echo __('Session timeout (s)'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Application URL'); ?>
+            <div id="help-app_url"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large" for="help-app_url">
+                <p>
+                    <?php echo __('Sets the application URL when accessing through a reverse proxy or load balancer.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="app_url" name="app_url" type="url"
+                       pattern="^https?://.*"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       value="<?php echo $configData->getApplicationUrl(); ?>"/>
+                <label class="mdl-textfield__label"
+                       for="app_url"><?php echo __('Application URL'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField"></td>
+        <td class="valField">
+            <ul class="config-site-list-action mdl-list">
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="https_enabled">
+                            <input type="checkbox" id="https_enabled"
+                                   class="mdl-switch__input"
+                                   name="https_enabled" <?php echo $configData->isHttpsEnabled() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Force HTTPS'); ?></span>
+                        <span class="mdl-list__item-sub-title"><?php echo __('It forces the use of HTTPS on all the connections'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="debug_enabled">
+                            <input type="checkbox" id="debug_enabled"
+                                   class="mdl-switch__input"
+                                   name="debug_enabled" <?php echo $configData->isDebug() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Enable debug'); ?></span>
+                        <span class="mdl-list__item-sub-title"><?php echo __('Displays some information about application configuration and performance.'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="maintenance_enabled">
+                            <input type="checkbox" id="maintenance_enabled"
+                                   class="mdl-switch__input"
+                                   name="maintenance_enabled" <?php echo $configData->isMaintenance() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Maintenance mode'); ?></span>
+                        <span class="mdl-list__item-sub-title"><?php echo __('In this mode nobody can log into the application. To disable it, you need to either modify the configuration file or unset on the site tab.'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="check_updates_enabled">
+                            <input type="checkbox" id="check_updates_enabled"
+                                   class="mdl-switch__input"
+                                   name="check_updates_enabled" <?php echo $configData->isCheckUpdates() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Check for updates'); ?></span>
+                        <span class="mdl-list__item-sub-title"><?php echo __('Check for application updates (only for administrators).'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="check_notices_enabled">
+                            <input type="checkbox" id="check_notices_enabled"
+                                   class="mdl-switch__input"
+                                   name="check_notices_enabled" <?php echo $configData->isChecknotices() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Check for notifications'); ?></span>
+                        <span class="mdl-list__item-sub-title"><?php echo __('Check if there are either sysPass security or warning notices (only for administrators).'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="encrypt_session_enabled">
+                            <input type="checkbox" id="encrypt_session_enabled"
+                                   class="mdl-switch__input"
+                                   name="encrypt_session_enabled" <?php echo $configData->isEncryptSession() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Encrypt Session'); ?></span>
+                        <span class="mdl-list__item-sub-title">
+                            <?php echo __('Encrypt PHP session data'); ?>
+                            <?php echo __('This feature increases the PHP sessions security, because the stored data won\'t be readable.'); ?>
+                        </span>
+                    </span>
+                </li>
+            </ul>
+        </td>
+    </tr>
+</table>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/config/general.inc b/app/modules/web/themes/material-dark/views/config/general.inc
new file mode 100644
index 000000000..845f862b6
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/general.inc
@@ -0,0 +1,44 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+<form method="post" name="frmConfig" id="frmConfig" class="form-action"
+      data-onsubmit="config/save"
+      data-action-route="configGeneral/save"
+      data-hash="">
+
+    <?php include $this->includeTemplate('general-site'); ?>
+    <?php include $this->includeTemplate('general-events'); ?>
+    <?php include $this->includeTemplate('general-proxy'); ?>
+    <?php include $this->includeTemplate('general-auth'); ?>
+
+    <input type="hidden" name="sk" value="<?php echo $sk; ?>">
+</form>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button form="frmConfig"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/config/import.inc b/app/modules/web/themes/material-dark/views/config/import.inc
new file mode 100644
index 000000000..ad5d04feb
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/import.inc
@@ -0,0 +1,212 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">import_export</i>
+    <?php echo __('CSV/XML Import'); ?>
+</div>
+
+<table class="data tblConfig">
+    <tr>
+        <td class="descField">
+            <?php echo __('Default User'); ?>
+            <div id="help-import_defaultuser"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large"
+                 for="help-import_defaultuser">
+                <p>
+                    <?php echo __('Sets the default user for the accounts imported.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Default User'); ?></div>
+
+            <select id="import_defaultuser" name="import_defaultuser"
+                    class="select-box sel-chosen-user" required>
+                <option value=""><?php echo __('Select User'); ?></option>
+                <?php /** @var SelectItem $user */
+                foreach ($_getvar('users') as $user): ?>
+                    <option
+                            value="<?php echo $user->getId(); ?>" <?php echo $user->isSelected() ? 'selected' : ''; ?>>
+                        <?php echo $user->getName(); ?>
+                    </option>
+                <?php endforeach; ?>
+            </select>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Default Group'); ?>
+            <div id="help-import_defaultgroup"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large"
+                 for="help-import_defaultgroup">
+                <p>
+                    <?php echo __('Sets the default group for the accounts imported.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Default Group'); ?></div>
+
+            <select id="import_defaultgroup" name="import_defaultgroup"
+                    class="select-box sel-chosen-usergroup" required>
+                <option value=""><?php echo __('Select Group'); ?></option>
+                <?php /** @var SelectItem $userGroup */
+                foreach ($_getvar('userGroups') as $userGroup): ?>
+                    <option
+                            value="<?php echo $userGroup->getId(); ?>" <?php echo $userGroup->isSelected() ? 'selected' : ''; ?>>
+                        <?php echo $userGroup->getName(); ?>
+                    </option>
+                <?php endforeach; ?>
+            </select>
+        </td>
+    </tr>
+    <tr>
+        <td class="valField" colspan="2">
+            <div class="lowres-title"><?php echo __('File'); ?></div>
+
+            <div id="drop-import-files" class="round active-tooltip dropzone"
+                 title="<?php echo __('Drop files here or click to select'); ?>"
+                 data-action-route="configImport/import">
+                <i class="material-icons md-60 mdl-color-text--teal-500">cloud_upload</i>
+            </div>
+            <form method="post" enctype="multipart/form-data" name="upload_form"
+                  id="fileUploadForm">
+                <input type="file" id="inFile" multiple name="inFile"/>
+            </form>
+        </td>
+    </tr>
+</table>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button id="help_import_button"
+                    class="btn-help mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored"
+                    title="<?php echo $icons->getIconHelp()->getTitle(); ?>"
+                    data-help="help-import">
+                <i class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+            </button>
+
+            <div for="help-import" class="help-box"
+                 title="<?php echo __('CSV/XML Import'); ?>">
+                <div class="help-container">
+                    <p class="help-text"><?php echo __('Allows to import Accounts, Categories and Clients from XML or CSV files.'); ?></p>
+
+                    <p class="help-text"><?php echo __('Supported XML file formats are: sysPass, KeePass and KeePassX'); ?></p>
+
+                    <p class="help-text"><?php echo __('Drag & Drop the file into the import zone or click over the arrow.'); ?></p>
+
+                    <p class="help-text"><?php echo __('For KeePass or KeePassX files, client name will be KeePass or KeePassX and category name like groups name.'); ?></p>
+
+                    <p class="help-text"><?php echo __('The CSV import file requires the following format:'); ?></p>
+
+                    <p class="help-text"><?php echo __('"account_name";"client";"category";"url";"user";"password";"notes"'); ?></p>
+
+                    <p class="help-text"><?php echo __('In all cases, if the client or category do not exist they will be created automatically.'); ?></p>
+                </div>
+            </div>
+        </li>
+    </ul>
+</div>
+
+<div id="title" class="titleNormal">
+    <?php echo __('XML'); ?>
+</div>
+
+<table class="data tblConfig">
+    <tr>
+        <td class="descField">
+            <?php echo __('Import Password'); ?>
+            <div id="help-import_pwd"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large" for="help-import_pwd">
+                <p>
+                    <?php echo __('It\'s only needed for sysPass XML files that have been encrypted.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="importPwd" name="importPwd" type="password"
+                       class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input-show"
+                       maxlength="255"/>
+                <label class="mdl-textfield__label"
+                       for="importPwd"><?php echo __('Import Password'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Master Password'); ?>
+            <div id="help-import_masterpwd"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large"
+                 for="help-import_masterpwd">
+                <p>
+                    <?php echo __('It\'s only needed for sysPass XML files that have been encrypted with a different master password from the current one.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="importMasterPwd" name="importMasterPwd"
+                       type="password"
+                       class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input-show"
+                       maxlength="255"/>
+                <label class="mdl-textfield__label"
+                       for="importMasterPwd"><?php echo __('Master Password'); ?></label>
+            </div>
+        </td>
+    </tr>
+</table>
+
+<div id="title" class="titleNormal">
+    <?php echo __('CSV'); ?>
+</div>
+
+<table class="data tblConfig">
+    <tr>
+        <td class="descField">
+            <?php echo __('CSV delimiter'); ?>
+            <div id="help-import_csvdelimiter"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large"
+                 for="help-import_csvdelimiter">
+                <p>
+                    <?php echo __('It\'s only needed for CSV files.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="csvDelimiter" name="csvDelimiter" type="text"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       maxlength="1" value=";"/>
+                <label class="mdl-textfield__label"
+                       for="csvDelimiter"><?php echo __('CSV delimiter'); ?></label>
+            </div>
+        </td>
+    </tr>
+</table>
diff --git a/app/modules/web/themes/material-dark/views/config/info.inc b/app/modules/web/themes/material-dark/views/config/info.inc
new file mode 100644
index 000000000..3e08c8de8
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/info.inc
@@ -0,0 +1,210 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">info</i>
+    <?php use SP\Config\ConfigData;
+    use SP\Core\UI\ThemeIcons;
+    use SP\Html\Html;
+    use SP\Mvc\View\Template;
+    use SP\Plugin\PluginInterface;
+    use SP\Services\Install\Installer;
+    use SP\Util\VersionUtil;
+
+    echo __('Application Information'); ?>
+</div>
+
+<table class="data">
+    <tr>
+        <td class="descField">
+            <?php echo __('sysPass version'); ?>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('sysPass version'); ?></div>
+
+            <?php printf('%s (%s)', Installer::VERSION_TEXT, Html::strongText(VersionUtil::getVersionStringNormalized())); ?>
+            <br>
+            <?php printf('Config: %s', $configData->getConfigVersion()); ?>
+            <br>
+            <?php printf('App: %s', $configData->getAppVersion()); ?>
+            <br>
+            <?php printf('DB: %s', $configData->getDatabaseVersion()); ?>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Database'); ?>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Database'); ?></div>
+
+            <?php foreach ($_getvar('dbInfo') as $infoattr => $infoval): ?>
+                <?php printf('%s : %s', Html::strongText($infoattr), $infoval); ?>
+                <br>
+            <?php endforeach; ?>
+            <?php printf('%s: %s', Html::strongText(__('Name')), (!$_getvar('isDemo')) ? $_getvar('dbName') : '***'); ?>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('PHP'); ?>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('PHP'); ?></div>
+
+            <?php printf('%s: %s', Html::strongText(__('Version')), phpversion()); ?>
+            <br>
+            <?php printf('%s: %s', Html::strongText(__('Extensions')), implode(', ', get_loaded_extensions())); ?>
+            <br>
+            <?php
+            if (!empty($_getvar('missingExtensions'))) {
+                printf('%s: %s', Html::strongText(__('Unavailable extensions')), implode(', ', $_getvar('missingExtensions')));
+                echo '<br>';
+            }
+            ?>
+            <?php printf('%s: %d KB', Html::strongText(__('Used Memory')), (memory_get_usage(true) / 1024)); ?>
+            <br>
+            <?php printf('%s: %s', Html::strongText(__('User')), (!$_getvar('isDemo')) ? get_current_user() : '***'); ?>
+            <br>
+            <?php printf('%s: %d MB/s', Html::strongText(__('Download rate')), $_getvar('downloadRate')); ?>
+            <?php if (function_exists('opcache_get_status') && version_compare(PHP_VERSION, '5.6.0', '>=')): ?>
+                <br>
+                <?php echo Html::strongText(__('OP Cache')); ?>
+                <?php foreach (opcache_get_status(false)['opcache_statistics'] as $key => $value): ?>
+                    <br><?php printf('%s : %s', $key, $value); ?>
+                <?php endforeach; ?>
+            <?php endif; ?>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Server'); ?>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Server'); ?></div>
+
+            <?php echo (!$_getvar('isDemo')) ? Html::strongText($_SERVER['SERVER_SOFTWARE']) : '***'; ?>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Configuration Backup'); ?>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Configuration Backup'); ?></div>
+
+            <?php echo $_getvar('configBackupDate'); ?>
+
+            <?php if ($_getvar('downloadLog')): ?>
+                <div>
+                    <a href="<?php echo $_getRoute('configGeneral/downloadConfigBackup/json'); ?>"
+                       class="download" target="_blank">
+
+                        <button type="button" class="mdl-button mdl-js-button">
+                            <?php printf(__('Download %s'), 'JSON'); ?>
+                        </button>
+                    </a>
+                </div>
+            <?php endif; ?>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Language'); ?>
+            <div id="help-infolang"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large" for="help-infolang">
+                <p>
+                    <?php echo __('Tells whether the language is available or not.'); ?>
+                </p>
+
+                <p>
+                    <?php echo __('If it is not installed, you would need install the right operating system locales. More info at Wiki.'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Language'); ?></div>
+
+            <?php echo $_getvar('locale'); ?>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Encrypted Session'); ?>
+            <div id="help-infosession"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+            <div class="mdl-tooltip mdl-tooltip--large" for="help-infosession">
+                <p>
+                    <?php echo __('Tells whether the session data are encrypted in the server side or not'); ?>
+                </p>
+            </div>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Encrypted Session'); ?></div>
+
+            <?php echo $_getvar('securedSession') ? __('Yes') : __('No'); ?>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField">
+            <?php echo __('Loaded Plugins'); ?>
+        </td>
+        <td class="valField">
+            <div class="lowres-title"><?php echo __('Loaded Plugins'); ?></div>
+
+            <ul class="mdl-list">
+                <?php /** @var PluginInterface $plugin */
+                foreach ($_getvar('plugins') as $name => $plugin): ?>
+                    <li class="mdl-list__item">
+                                <span class="mdl-list__item-primary-content">
+                                <i class="material-icons mdl-list__item-icon">extension</i>
+                                    <?php echo $name; ?>
+                                    <br>
+                                    <?php printf('Version: %s', implode('.', $plugin->getVersion())); ?>
+                                    <br>
+                                    <?php printf('Autor: %s', $plugin->getAuthor()); ?>
+                                </span>
+                    </li>
+                <?php endforeach; ?>
+            </ul>
+        </td>
+    </tr>
+
+    <?php if ($_getvar('downloadLog')): ?>
+        <tr>
+            <td class="descField">
+                <?php echo __('Log file'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Log file'); ?></div>
+
+                <a href="<?php echo $_getRoute('configGeneral/downloadLog'); ?>"
+                   class="download" target="_blank">
+
+                    <button type="button" class="mdl-button mdl-js-button">
+                        <?php printf(__('Download %s'), basename(LOG_FILE)); ?>
+                    </button>
+                </a>
+            </td>
+        </tr>
+    <?php endif; ?>
+</table>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/config/ldap.inc b/app/modules/web/themes/material-dark/views/config/ldap.inc
new file mode 100644
index 000000000..80e1f2343
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/ldap.inc
@@ -0,0 +1,508 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+
+<?php if (!$_getvar('ldapIsAvailable')): ?>
+    <div class="msg-option-unvailable">
+        <?php printf(__('The \'%s\' extension is unavailable'), 'ldap'); ?>
+        <i id="help-ldap"
+           class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+        <div class="mdl-tooltip mdl-tooltip--large" for="help-ldap">
+            <p>
+                <?php echo __('This extension is needed to connect to the LDAP server'); ?>
+            </p>
+        </div>
+    </div>
+<?php endif; ?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">business</i>
+    <?php echo __('Configuration'); ?>
+</div>
+
+<form method="post" name="frmLdap" id="frmLdap" class="form-action"
+      data-onsubmit="config/save"
+      data-action-route="configLdap/save"
+      data-hash="">
+    <table id="tblLdap" class="data tblConfig">
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-ldap-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="ldap_enabled">
+                                <input type="checkbox" id="ldap_enabled"
+                                       class="mdl-switch__input"
+                                       name="ldap_enabled" <?php echo $configData->isLdapEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                                <span><?php echo __('Enable LDAP'); ?></span>
+                                <span class="mdl-list__item-sub-title">
+                                    <?php echo __('Enables authentication against an LDAP server.'); ?>
+                                    <br>
+                                    <?php echo __('This method will use MySQL as fallback.'); ?>
+                                </span>
+                            </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="ldap_tls_enabled">
+                                <input type="checkbox" id="ldap_tls_enabled"
+                                       class="mdl-switch__input"
+                                       name="ldap_tls_enabled" <?php echo $configData->isLdapTlsEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                                <span>TLS</span>
+                                <span class="mdl-list__item-sub-title">
+                                    <?php echo __('Enables the connection over TLS'); ?>
+                                </span>
+                            </span>
+                    </li>
+
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"><?php echo __('Server Type'); ?></td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Server Type'); ?></div>
+
+                <select id="ldap_defaultgroup" name="ldap_server_type"
+                        class="select-box sel-chosen-usergroup" required>
+                    <option value=""><?php echo __('Server Type'); ?></option>
+                    <?php /** @var SelectItem $serverType */
+                    foreach ($_getvar('serverTypes') as $serverType): ?>
+                        <option
+                                value="<?php echo $serverType->getId(); ?>" <?php echo $serverType->isSelected() ? 'selected' : ''; ?>><?php echo $serverType->getName(); ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Server'); ?>
+                <div id="help-ldap_server"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_server">
+                    <p>
+                        <?php echo __('Hostname or IP address of LDAP server.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Examples:'); ?>
+                    </p>
+
+                    <ul>
+                        <li>ldap.example.org</li>
+                        <li>ldap://ldap.example.org</li>
+                        <li>ldaps://ldap.example.org</li>
+                    </ul>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="ldap_server" name="ldap_server" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getLdapServer(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="ldap_server"><?php echo __('Server'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Bind User'); ?>
+                <div id="help-ldap_binduser"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_binduser">
+                    <p>
+                        <?php echo __('User to connect to LDAP service.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Examples:'); ?>
+                    </p>
+
+                    <ul>
+                        <li>cn=syspass,ou=Users,dc=syspass,o=org</li>
+                        <li>syspass</li>
+                    </ul>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="ldap_binduser" name="ldap_binduser" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getLdapBindUser(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="ldap_binduser"><?php echo __('User'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Bind Password'); ?>
+                <div id="help-ldap_bindpass"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_bindpass">
+                    <p>
+                        <?php echo __('LDAP connection user\'s password'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="ldap_bindpass" name="ldap_bindpass"
+                           type="password"
+                           class="mdl-textfield__input passwordfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getLdapBindPass() ? '***' : ''; ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="ldap_bindpass"><?php echo __('Password'); ?></label>
+
+                </div>
+                <?php if ($configData->getLdapBindPass()): ?>
+                    <div id="help-ldap_password"
+                         class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></div>
+                    <div class="mdl-tooltip mdl-tooltip--large"
+                         for="help-ldap_password">
+                        <p>
+                            <?php echo __('This isn\'t the real LDAP password. You should set the real one before checking or importing LDAP objects'); ?>
+                        </p>
+                    </div>
+                <?php endif; ?>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Search base'); ?>
+                <div id="help-ldap_base"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_base">
+                    <p>
+                        <?php echo __('LDAP base to perform the LDAP users search.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Examples:'); ?>
+                    </p>
+
+                    <ul>
+                        <li>cn=Users,dc=example,dc=org</li>
+                        <li>ou=AdminUsers,dc=example,o=org</li>
+                    </ul>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="ldap_base" name="ldap_base" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getLdapBase(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="ldap_base"><?php echo __('Search base'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Group'); ?>
+                <div id="help-ldap_group"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_group">
+                    <p>
+                        <?php echo __('LDAP group which user must belong to for granting to log in.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('This group needs to be placed in the LDAP search base.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Examples:'); ?>
+                    </p>
+
+                    <ul>
+                        <li>cn=GRP_SPUSERS,cn=Users,dc=example,dc=org</li>
+                        <li>GRP_SPUSERS</li>
+                    </ul>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="ldap_group" name="ldap_group" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getLdapGroup(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="ldap_group"><?php echo __('Group'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Default Group'); ?>
+                <div id="help-ldap_defaultgroup"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_defaultgroup">
+                    <p>
+                        <?php echo __('Sets the default users group for newly created LDAP users'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Default Group'); ?></div>
+
+                <select id="ldap_defaultgroup" name="ldap_defaultgroup"
+                        class="select-box sel-chosen-usergroup" required>
+                    <option value=""><?php echo __('Select Group'); ?></option>
+                    <?php /** @var SelectItem $userGroup */
+                    foreach ($_getvar('userGroups') as $userGroup): ?>
+                        <option
+                                value="<?php echo $userGroup->getId(); ?>" <?php echo $userGroup->getId() === $configData->getLdapDefaultGroup() ? 'selected' : ''; ?>><?php echo $userGroup->getName(); ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Default Profile'); ?>
+                <div id="help-ldap_defaultprofile"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_defaultprofile">
+                    <p>
+                        <?php echo __('Sets the default profile for the newly created LDAP users.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Default Profile'); ?></div>
+
+                <select id="ldap_defaultprofile" name="ldap_defaultprofile"
+                        class="select-box sel-chosen-profile" required>
+                    <option value=""><?php echo __('Select User'); ?></option>
+                    <?php /** @var SelectItem $userProfile */
+                    foreach ($_getvar('userProfiles') as $userProfile): ?>
+                        <option
+                                value="<?php echo $userProfile->getId(); ?>" <?php echo ($userProfile->getId() === $configData->getLdapDefaultProfile()) ? 'selected' : ''; ?>><?php echo $userProfile->getName(); ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </td>
+        </tr>
+    </table>
+
+
+    <div class="tab-actions">
+        <ul>
+            <li>
+                <button id="btnBack" type="button"
+                        class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                        title="<?php echo __('Back'); ?>">
+                    <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+                </button>
+            </li>
+            <li>
+                <button type="button"
+                        class="btn-action mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconCheck()->getClassButton(); ?>"
+                        data-onclick="ldap/check"
+                        data-action-route="configLdap/check"
+                        data-src="#frmLdap"
+                        title="<?php echo $icons->getIconCheck()->getTitle(); ?>">
+                    <i class="material-icons"><?php echo $icons->getIconCheck()->getIcon(); ?></i>
+                </button>
+            </li>
+            <li>
+                <button form="frmLdap"
+                        class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                        title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                    <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+                </button>
+            </li>
+        </ul>
+    </div>
+
+    <div id="title" class="titleNormal">
+        <i class="material-icons">import_export</i>
+        <?php echo __('Import'); ?>
+    </div>
+
+    <table id="tblLdap" class="data tblConfig">
+        <tr>
+            <td class="descField">
+                <?php echo __('Login Attribute'); ?>
+                <div id="help-ldap_login_attribute"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_login_attribute">
+                    <p>
+                        <?php echo __('Defines the attribute for the user\'s login when importing.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Login Attribute'); ?></div>
+
+                <select id="ldap_login_attribute" name="ldap_login_attribute"
+                        class="select-box" required>
+                    <option value="samaccountname" selected>sAMAccountName
+                    </option>
+                    <option value="userprincipalname">userPrincipalName</option>
+                    <option value="uid">uid</option>
+                    <option value="login">login</option>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Name Attribute'); ?>
+                <div id="help-ldap_username_attribute"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_username_attribute">
+                    <p>
+                        <?php echo __('Defines the attribute for the user\'s name when importing.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Name Attribute'); ?></div>
+
+                <select id="ldap_username_attribute"
+                        name="ldap_username_attribute"
+                        class="select-box" required>
+                    <option value="displayname" selected>displayName</option>
+                    <option value="fullname">fullName</option>
+                    <option value="cn">cn</option>
+                    <option value="name">name</option>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-ldap-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="ldap_import_groups">
+                                <input type="checkbox" id="ldap_import_groups"
+                                       class="mdl-switch__input"
+                                       name="ldap_import_groups"/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                                <span><?php echo __('Import Groups'); ?></span>
+                                <span class="mdl-list__item-sub-title"></span>
+                            </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Group Name Attribute'); ?>
+                <div id="help-ldap_groupname_attribute"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_groupname_attribute">
+                    <p>
+                        <?php echo __('Defines the attribute for the user group name when importing.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Group Name Attribute'); ?></div>
+
+                <select id="ldap_groupname_attribute"
+                        name="ldap_groupname_attribute"
+                        class="select-box" required>
+                    <option value="cn">cn</option>
+                    <option value="name">name</option>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Filter'); ?>
+                <div id="help-ldap_import_filter"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-ldap_import_filter">
+                    <p>
+                        <?php echo __('Filter for importing LDAP users or groups.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="ldap_import_filter" name="ldap_import_filter"
+                           type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"/>
+                    <label class="mdl-textfield__label"
+                           for="ldap_import_filter"><?php echo __('Filter'); ?></label>
+                </div>
+            </td>
+        </tr>
+    </table>
+
+    <div class="tab-actions">
+        <ul>
+            <li>
+                <button id="btnBack" type="button"
+                        class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                        title="<?php echo __('Back'); ?>">
+                    <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+                </button>
+            </li>
+            <li>
+                <button type="button"
+                        class="btn-action mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconCheck()->getClassButton(); ?>"
+                        data-onclick="ldap/check"
+                        data-action-route="configLdap/checkImport"
+                        data-src="#frmLdap"
+                        title="<?php echo $icons->getIconCheck()->getTitle(); ?>">
+                    <i class="material-icons"><?php echo $icons->getIconCheck()->getIcon(); ?></i>
+                </button>
+            </li>
+            <li>
+                <button type="button"
+                        class="btn-action mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored"
+                        data-onclick="ldap/import"
+                        data-action-route="configLdap/import"
+                        data-src="#frmLdap"
+                        title="<?php echo __('Import users from LDAP'); ?>">
+                    <i class="material-icons">get_app</i>
+                </button>
+            </li>
+        </ul>
+    </div>
+</form>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/config/mail.inc b/app/modules/web/themes/material-dark/views/config/mail.inc
new file mode 100644
index 000000000..496abf3cc
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/mail.inc
@@ -0,0 +1,243 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">mail</i>
+    <?php echo __('Mail'); ?>
+</div>
+
+<form method="post" name="frmMail" id="frmMail" class="form-action"
+      data-onsubmit="config/save"
+      data-action-route="configMail/save"
+      data-hash="">
+    <table id="tblMail" class="data tblConfig">
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-mail-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="mail_enabled">
+                                <input type="checkbox" id="mail_enabled"
+                                       class="mdl-switch__input"
+                                       name="mail_enabled" <?php echo $configData->isMailEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Enable email notifications'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Enable email notifications'); ?></span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="mail_requests_enabled">
+                                <input type="checkbox"
+                                       id="mail_requests_enabled"
+                                       class="mdl-switch__input"
+                                       name="mail_requests_enabled" <?php echo $configData->isMailRequestsEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Enable requests by email'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Allows users to request for either modifications to existing accounts or access to accounts which they have no rights on.'); ?>
+                            </span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Server'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="mail_server" name="mail_server" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getMailServer(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="mail_server"><?php echo __('Server'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Port'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="mail_port" name="mail_port" type="number"
+                           pattern="[0-9]{1,5}"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="5"
+                           value="<?php echo $configData->getMailPort(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="mail_port"><?php echo __('Port'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-mail-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="mail_auth_enabled">
+                                <input type="checkbox" id="mail_auth_enabled"
+                                       class="mdl-switch__input"
+                                       name="mail_auth_enabled" <?php echo $configData->isMailAuthenabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Enable Authentication'); ?></span>
+                            <span class="mdl-list__item-sub-title"></span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('User'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="mail_user" name="mail_user" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="50"
+                           value="<?php echo $configData->getMailUser(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="mail_user"><?php echo __('User'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Password'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="mail_pass" name="mail_pass" type="password"
+                           class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input"
+                           maxlength="128"
+                           value="<?php echo $configData->getMailPass() ? '***' : ''; ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="mail_pass"><?php echo __('Password'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Security'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Security'); ?></div>
+
+                <select name="mail_security" id="sel-mailsecurity" size="1"
+                        class="select-box select-box-deselect">
+                    <option value=""><?php echo __('Disabled'); ?></option>
+                    <?php foreach ($_getvar('mailSecurity') as $security): ?>
+                        <option
+                                value="<?php echo $security; ?>" <?php echo ($configData->getMailSecurity() === $security) ? 'selected' : ''; ?>><?php echo $security; ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Sender email address'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="mail_from" name="mail_from" type="email"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getMailFrom(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="mail_from"><?php echo __('Sender email address'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Recipients'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Recipients'); ?></div>
+
+                <input type="text" name="mail_recipients" id="mail_recipients"
+                       class="select-items-tag"
+                       value="<?php echo implode(',', $configData->getMailRecipients()); ?>"/>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Events'); ?>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Events'); ?></div>
+
+                <select id="mail_events" name="mail_events[]"
+                        multiple="multiple" class="select-box"
+                        data-create="true">
+                    <?php /** @var SelectItem $mailEvent */
+                    foreach ($_getvar('mailEvents') as $mailEvent): ?>
+                        <option
+                                value="<?php echo $mailEvent->getName(); ?>"
+                            <?php echo $mailEvent->isSelected() ? 'selected' : '' ?>><?php echo $mailEvent->getName(); ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </td>
+        </tr>
+    </table>
+</form>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button type="button"
+                    class="btn-action mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconCheck()->getClassButton(); ?>"
+                    data-onclick="config/mailCheck"
+                    data-action-route="configMail/check"
+                    data-src="#frmMail"
+                    title="<?php echo $icons->getIconCheck()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconCheck()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button form="frmMail"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/config/wiki-dokuwiki.inc b/app/modules/web/themes/material-dark/views/config/wiki-dokuwiki.inc
new file mode 100644
index 000000000..fb815e563
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/wiki-dokuwiki.inc
@@ -0,0 +1,220 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+
+<?php if (!$_getvar('curlIsAvailable')): ?>
+    <div class="msg-option-unvailable">
+        <?php printf(__('The \'%s\' extension is unavailable'), 'curl'); ?>
+        <i id="help-curl"
+           class="material-icons"><?php echo $icons->getIconHelp()->getIcon(); ?></i>
+        <div class="mdl-tooltip mdl-tooltip--large" for="help-curl">
+            <p>
+                <?php echo __('This extension is needed to connect with DokuWiki'); ?>
+            </p>
+        </div>
+    </div>
+<?php endif; ?>
+
+<form method="post" name="frmDokuWiki" id="frmDokuWiki" class="form-action"
+      data-onsubmit="config/save"
+      data-action-route="configDokuWiki/save"
+      data-hash="">
+
+    <div id="title" class="titleNormal">
+        <i class="material-icons">folder</i>
+        <?php echo __('DokuWiki API'); ?>
+    </div>
+
+    <table id="tblDokuWiki" class="data tblConfig">
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-wiki-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="dokuwiki_enabled">
+                                <input type="checkbox" id="dokuwiki_enabled"
+                                       class="mdl-switch__input"
+                                       name="dokuwiki_enabled" <?php echo $configData->isDokuwikiEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Enable DokuWiki API'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Enables DokuWiki XML-RPC API for Wiki links.'); ?>
+                                <br>
+                                <?php echo __('In order to get this feature working, you should enable Wiki links for accounts filtering'); ?>
+                            </span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+
+        <tr>
+            <td class="descField">
+                <?php echo __('API URL'); ?>
+                <div id="help-dokuwiki_url"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-dokuwiki_url">
+                    <p>
+                        <?php echo __('DokuWiki API URL'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Example:'); ?>
+                    <ul>
+                        <li>http://wiki.syspass.org/lib/exe/xmlrpc.php</li>
+                    </ul>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="dokuwiki_url" name="dokuwiki_url" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="255"
+                           value="<?php echo $configData->getDokuwikiUrl(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="dokuwiki_url"><?php echo __('API URL'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Base URL'); ?>
+                <div id="help-dokuwiki_urlbase"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-dokuwiki_urlbase">
+                    <p>
+                        <?php echo __('DokuWiki base URL'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Example:'); ?>
+                    <ul>
+                        <li>http://wiki.syspass.org/dokuwiki</li>
+                    </ul>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="dokuwiki_urlbase" name="dokuwiki_urlbase"
+                           type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="255"
+                           value="<?php echo $configData->getDokuwikiUrlBase(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="dokuwiki_urlbase"><?php echo __('Base URL'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('User'); ?>
+                <div id="help-dokuwiki_user"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-dokuwiki_user">
+                    <p>
+                        <?php echo __('User for connecting to the DokuWiki API.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="dokuwiki_user" name="dokuwiki_user" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getDokuwikiUser(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="dokuwiki_user"><?php echo __('User'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Password'); ?>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="dokuwiki_pass" name="dokuwiki_pass"
+                           type="password"
+                           class="mdl-textfield__input passwordfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getDokuwikiPass(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="dokuwiki_pass"><?php echo __('Password'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Namespace'); ?>
+                <div id="help-dokuwiki_namespace"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-dokuwiki_namespace">
+                    <p>
+                        <?php echo __('Namespace used to search pages.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="dokuwiki_namespace" name="dokuwiki_namespace"
+                           type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="128"
+                           value="<?php echo $configData->getDokuwikiNamespace(); ?>"/>
+                    <label class="mdl-textfield__label"
+                           for="dokuwiki_namespace"><?php echo __('Namespace'); ?></label>
+                </div>
+            </td>
+        </tr>
+    </table>
+</form>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button type="button"
+                    class="btn-action mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconCheck()->getClassButton(); ?>"
+                    data-onclick="checks/wiki"
+                    data-action-route="configWiki/checkDokuwiki"
+                    data-src="#frmWiki"
+                    title="<?php echo $icons->getIconCheck()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconCheck()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button form="frmWiki"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/config/wiki.inc b/app/modules/web/themes/material-dark/views/config/wiki.inc
new file mode 100644
index 000000000..307488055
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/config/wiki.inc
@@ -0,0 +1,161 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+
+<form method="post" name="frmWiki" id="frmWiki" class="form-action"
+      data-onsubmit="config/save"
+      data-action-route="configWiki/save"
+      data-hash="">
+
+    <div id="title" class="titleNormal">
+        <i class="material-icons">folder</i>
+        <?php echo __('Wiki'); ?>
+    </div>
+
+    <table id="tblWiki" class="data tblConfig">
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="config-wiki-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="wiki_enabled">
+                                <input type="checkbox" id="wiki_enabled"
+                                       class="mdl-switch__input"
+                                       name="wiki_enabled" <?php echo $configData->isWikiEnabled() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Enable Wiki links'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Enables the option to add a link to search for results in an external Wiki.'); ?></span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Wiki search URL'); ?>
+                <div id="help-wiki_searchurl"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-wiki_searchurl">
+                    <p>
+                        <?php echo __('URL that Wiki uses for making an entry searching.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('The client\'s name is used as parameter.'); ?>
+                    </p>
+
+                    <p>
+                        <?php __('Example:'); ?>
+                    </p>
+
+                    <p>
+                        https://wiki.example.org/search.php?phrase=
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="wiki_searchurl" name="wiki_searchurl" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="255"
+                           value="<?php echo $configData->getWikiSearchurl(); ?>">
+                    <label class="mdl-textfield__label"
+                           for="wiki_searchurl"><?php echo __('Wiki search URL'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Wiki page URL'); ?>
+                <div id="help-wiki_pageurl"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-wiki_pageurl">
+                    <p>
+                        <?php echo __('URL that Wiki uses for accessing to the entry details.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Account\'s name is used as parameter of Wiki search variable.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Example:'); ?>
+                    </p>
+
+                    <p>
+                        https://wiki.example.org/show.php?name=
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="wiki_pageurl" name="wiki_pageurl" type="text"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="255"
+                           value="<?php echo $configData->getWikiPageurl(); ?>">
+                    <label class="mdl-textfield__label"
+                           for="wiki_pageurl"><?php echo __('Wiki page URL'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Account name prefix'); ?>
+                <div id="help-wikifilter"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-wikifilter">
+                    <p>
+                        <?php echo __('Prefix to determine which accounts have a link to the Wiki.'); ?>
+                    </p>
+
+                    <p>
+                        <?php echo __('Examples:') . ' serv- | srv- | vm-'; ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Account name prefix'); ?></div>
+
+                <input type="text" name="wiki_filter" id="wikifilter"
+                       value="<?php echo implode(',', $configData->getWikiFilter()); ?>"/>
+            </td>
+        </tr>
+    </table>
+</form>
+
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button form="frmWiki"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/error/error-database.inc b/app/modules/web/themes/material-dark/views/error/error-database.inc
new file mode 100644
index 000000000..32e9c4352
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/error/error-database.inc
@@ -0,0 +1,28 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var Template   $this
+ */
+
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+<div id="actions" align="center">
+    <?php include $this->includePartial('error-list'); ?>
+
+    <div class="buttons">
+        <button id="btnBack"
+                class="btn-back mdl-button mdl-js-button mdl-button--raised mdl-button--colored">
+            <i class="material-icons"
+               title="<?php echo __('Back'); ?>"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            <?php echo __('Back'); ?>
+        </button>
+        <a class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored"
+           href="index.php?r=install">
+            <?php echo __('Install'); ?>
+            <i class="material-icons"
+               title="<?php echo __('Install'); ?>"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+        </a>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/error/error-maintenance.inc b/app/modules/web/themes/material-dark/views/error/error-maintenance.inc
new file mode 100644
index 000000000..55c648f02
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/error/error-maintenance.inc
@@ -0,0 +1,22 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var Template   $this
+ */
+
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+<div id="actions" align="center">
+    <?php include $this->includePartial('error-list'); ?>
+
+    <div class="buttons">
+        <button id="btnBack"
+                class="btn-back mdl-button mdl-js-button mdl-button--raised mdl-button--colored">
+            <i class="material-icons"
+               title="<?php echo __('Back'); ?>"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            <?php echo __('Back'); ?>
+        </button>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/eventlog/datagrid-rows.inc b/app/modules/web/themes/material-dark/views/eventlog/datagrid-rows.inc
new file mode 100644
index 000000000..d94a98ba4
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/eventlog/datagrid-rows.inc
@@ -0,0 +1,30 @@
+<?php
+/**
+ * @var SP\Html\DataGrid\DataGridTab $data
+ * @var ThemeIcons                   $icons
+ * @var ConfigData                   $configData
+ * @var callable                     $_getvar
+ * @var Template                     $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+$data = $_getvar('data');
+?>
+
+    <!-- Rows -->
+<?php if ($data->getData()->getDataCount() > 0):
+    foreach ($data->getData()->getData() as $dataIndex => $dataItem):
+        if ($dataIndex === 'count'): continue; endif; ?>
+
+        <tr data-item-id="<?php echo $dataItem->{$data->getData()->getDataRowSourceId()}; ?>">
+            <?php foreach ($data->getData()->getDataRowSources() as $rowSrc): ?>
+                <?php $value = $rowSrc['isMethod'] === true && method_exists($dataItem, $rowSrc['name']) ? $dataItem->{$rowSrc['name']}() : $dataItem->{$rowSrc['name']}; ?>
+                <?php $value = $rowSrc['filter'] !== null && $rowSrc['filter'] ? $rowSrc['filter']($value) : $value; ?>
+                <td class="cell-data"><?php echo $value !== '' ? $value : '&nbsp;'; // Fix height ?></td>
+            <?php endforeach; ?>
+        </tr>
+    <?php endforeach; ?>
+<?php endif; ?>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/eventlog/index.inc b/app/modules/web/themes/material-dark/views/eventlog/index.inc
new file mode 100644
index 000000000..a309e5468
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/eventlog/index.inc
@@ -0,0 +1,6 @@
+<h5 class="datagrid-header-title"><?php use SP\Mvc\View\Template;
+
+    echo __('Event Log'); ?></h5>
+<?php
+/** @var Template $this */
+include $this->includeTemplate('datagrid-grid', 'grid');
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/grid/datagrid-grid.inc b/app/modules/web/themes/material-dark/views/grid/datagrid-grid.inc
new file mode 100644
index 000000000..f9f6820c1
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/grid/datagrid-grid.inc
@@ -0,0 +1,141 @@
+<?php
+/**
+ * @var DataGridAction|DataGridActionSearch $action
+ * @var SP\Html\DataGrid\DataGridTab        $data
+ * @var ThemeIcons                          $icons
+ * @var ConfigData                          $configData
+ * @var callable                            $_getvar
+ * @var Template                            $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Html\DataGrid\Action\DataGridAction;
+use SP\Html\DataGrid\Action\DataGridActionSearch;
+use SP\Html\DataGrid\Action\DataGridActionType;
+use SP\Mvc\View\Template;
+
+if (!isset($data)) {
+    $data = $_getvar('data');
+}
+
+$index = isset($index) ? $index : 0;
+?>
+
+<div class="tab-actions">
+    <ul>
+        <?php foreach ($data->getDataActions() as $action):
+            if ($action->getType() === DataGridActionType::MENUBAR_ITEM):
+                ?>
+                <li>
+                    <button
+                            id="btn-add-<?php echo $action->getId(); ?>"
+                            type="button"
+                            class="btn-action mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored mdl-color--indigo-A200 mdl-js-ripple-effect"
+                            data-nextaction="<?php echo $data->getOnCloseAction(); ?>"
+                            data-onclick="<?php echo $action->getOnClick(); ?>"
+                        <?php foreach ($action->getData() as $dataName => $dataValue): echo 'data-', $dataName, '=', '"', $dataValue, '"'; endforeach; ?>>
+                        <i class="material-icons"><?php echo $action->getIcon()->getIcon(); ?></i>
+                    </button>
+                    <span for="btn-add-<?php echo $action->getId(); ?>"
+                          class="mdl-tooltip mdl-tooltip--bottom"
+                          title="<?php echo $action->getTitle(); ?>"><?php echo $action->getName(); ?></span>
+                </li>
+            <?php elseif ($action->getType() === DataGridActionType::SEARCH_ITEM): ?>
+                <li class="datagrid-action-search">
+                    <form method="post" id="<?php echo $action->getName(); ?>"
+                          name="<?php echo $action->getName(); ?>"
+                          class="form-action"
+                          data-target="#data-table-<?php echo $data->getId(); ?>"
+                          data-onsubmit="<?php echo $action->getOnSubmit(); ?>"
+                        <?php foreach ($action->getData() as $dataName => $dataValue): echo 'data-', $dataName, '=', '"', $dataValue, '"'; endforeach; ?>>
+
+                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--expandable">
+                            <label class="mdl-button mdl-js-button mdl-button--icon"
+                                   id="btn-search-<?php echo $index; ?>"
+                                   for="search-<?php echo $index; ?>">
+                                <i class="material-icons">search</i>
+                            </label>
+                            <span for="btn-search-<?php echo $index; ?>"
+                                  class="mdl-tooltip mdl-tooltip--bottom"><?php echo $action->getTitle(); ?></span>
+
+                            <div class="mdl-textfield__expandable-holder">
+                                <input class="mdl-textfield__input" type="text"
+                                       id="search-<?php echo $index; ?>"
+                                       name="search"/>
+                                <label class="mdl-textfield__label"
+                                       for="search-<?php echo $index; ?>"><?php echo $action->getTitle(); ?></label>
+                            </div>
+                        </div>
+
+                        <button type="reset"
+                                id="btn-reset-<?php echo $index; ?>"
+                                class="btn-clear mdl-button mdl-js-button mdl-button--icon">
+                            <i class="material-icons"><?php echo $icons->getIconClear()->getIcon(); ?></i>
+                        </button>
+
+                        <span for="btn-reset-<?php echo $index; ?>"
+                              class="mdl-tooltip mdl-tooltip--bottom"><?php echo $icons->getIconClear()->getTitle(); ?></span>
+
+                        <input type="hidden" name="sk"
+                               value="<?php echo $sk; ?>">
+                        <input type="hidden" name="activetab"
+                               value="<?php echo $index; ?>">
+                        <input type="hidden" name="start" value="0">
+                        <input type="hidden" name="count"
+                               value="<?php echo $data->getPager()->getLimitCount(); ?>">
+                        <input type="hidden" name="isAjax" value="1">
+                    </form>
+                </li>
+            <?php elseif ($action->getType() === DataGridActionType::HELP_ITEM): ?>
+                <li>
+                    <?php include $this->includePartial('help_account_search'); ?>
+                </li>
+            <?php
+            endif;
+        endforeach; ?>
+
+        <li>
+            <button type="button" id="btn-back-<?php echo $index; ?>"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconBack()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+            <span for="btn-back-<?php echo $index; ?>"
+                  class="mdl-tooltip mdl-tooltip--bottom"><?php echo $icons->getIconBack()->getTitle(); ?></span>
+        </li>
+
+        <?php if ($data->getDataActionsMenuCount() > 0): ?>
+            <li>
+                <button id="menu-<?php echo $data->getId(); ?>-menu-lower-right"
+                        class="mdl-button mdl-js-button mdl-button--icon">
+                    <i class="material-icons">more_vert</i>
+                </button>
+
+                <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
+                    for="menu-<?php echo $data->getId(); ?>-menu-lower-right">
+                    <?php foreach ($data->getDataActionsMenu() as $action): ?>
+                        <li class="btn-action mdl-menu__item"
+                            title="<?php echo $action->getTitle(); ?>"
+                            <?php if ($action->isSelection()): ?>
+                                data-selection="#data-table-<?php echo $data->getId(); ?>"
+                            <?php endif; ?>
+                            data-onclick="<?php echo $action->getOnClick(); ?>"
+                            <?php foreach ($action->getData() as $dataName => $dataValue): echo 'data-', $dataName, '=', '"', $dataValue, '"'; endforeach; ?>>
+                            <i class="material-icons <?php echo $action->getIcon()->getClass(); ?>"><?php echo $action->getIcon()->getIcon(); ?></i>
+                            <?php echo $action->getName(); ?>
+                        </li>
+                    <?php endforeach; ?>
+                </ul>
+            </li>
+        <?php endif; ?>
+    </ul>
+</div>
+
+<div id="data-table-<?php echo $data->getId(); ?>">
+    <?php if ($data->getDataTableTemplate()): ?>
+        <?php include $data->getDataTableTemplate(); ?>
+    <?php else: ?>
+        <?php include __DIR__ . DIRECTORY_SEPARATOR . 'datagrid-table.inc'; ?>
+    <?php endif; ?>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/grid/datagrid-nav-full.inc b/app/modules/web/themes/material-dark/views/grid/datagrid-nav-full.inc
new file mode 100644
index 000000000..d47c4e2fb
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/grid/datagrid-nav-full.inc
@@ -0,0 +1,76 @@
+<?php
+/**
+ * @var SP\Html\DataGrid\DataGridInterface $data
+ * @var Template                           $this
+ * @var callable                           $_getvar
+ */
+
+use SP\Mvc\View\Template;
+
+if (!isset($data)) {
+    $data = $_getvar('data');
+}
+
+$pager = $data->getPager();
+?>
+<div class="pager round5 shadow">
+    <div class="pager-left">
+        <?php echo $data->getData()->getDataCount(); ?>
+        @ <?php echo $data->getTime(); ?>s
+        <?php if ($pager->getFilterOn()): ?>
+            <span class="filter-on round"><?php echo __('Filter ON'); ?></span>
+        <?php endif; ?>
+    </div>
+    <div class="pager-right">
+        <?php if ($pager->getLimitStart() > 1): ?>
+            <i id="btn-pager-first"
+               class="btn-action-pager material-icons <?php echo $pager->getIconFirst()->getClass(); ?>"
+               data-action-id="<?php echo $pager->getSourceAction()->getId(); ?>"
+               data-action-form="<?php echo $pager->getSourceAction()->getName(); ?>"
+               data-start="<?php echo $pager->getFirst(); ?>"
+               data-count="<?php echo $pager->getLimitCount(); ?>"
+               data-onclick="<?php echo $pager->getOnClick(); ?>"><?php echo $pager->getIconFirst()->getIcon(); ?></i>
+            <span
+                    for="btn-pager-first"
+                    class="mdl-tooltip mdl-tooltip--top"><?php echo $pager->getIconFirst()->getTitle(); ?></span>
+
+            <i id="btn-pager-prev"
+               class="btn-action-pager material-icons <?php echo $pager->getIconPrev()->getClass(); ?>"
+               data-action-id="<?php echo $pager->getSourceAction()->getId(); ?>"
+               data-action-form="<?php echo $pager->getSourceAction()->getName(); ?>"
+               data-start="<?php echo $pager->getPrev(); ?>"
+               data-count="<?php echo $pager->getLimitCount(); ?>"
+               data-onclick="<?php echo $pager->getOnClick(); ?>"><?php echo $pager->getIconPrev()->getIcon(); ?></i>
+
+            <span
+                    for="btn-pager-prev"
+                    class="mdl-tooltip mdl-tooltip--top"><?php echo $pager->getIconPrev()->getTitle(); ?></span>
+        <?php endif; ?>
+        &nbsp;
+        <?php printf('%d / %d (%d)', $pager->getFirstPage(), $pager->getLastPage(), $pager->getLimitCount()); ?>
+        &nbsp;
+        <?php if ($pager->getLimitStart() < $pager->getTotalRows() && $pager->getFirstPage() != $pager->getLastPage()): ?>
+            <i id="btn-pager-next"
+               class="btn-action-pager material-icons <?php echo $pager->getIconNext()->getClass(); ?>"
+               data-action-id="<?php echo $pager->getSourceAction()->getId(); ?>"
+               data-action-form="<?php echo $pager->getSourceAction()->getName(); ?>"
+               data-start="<?php echo $pager->getNext(); ?>"
+               data-count="<?php echo $pager->getLimitCount(); ?>"
+               data-onclick="<?php echo $pager->getOnClick(); ?>"><?php echo $pager->getIconNext()->getIcon(); ?></i>
+
+            <span
+                    for="btn-pager-next"
+                    class="mdl-tooltip mdl-tooltip--top"><?php echo $pager->getIconNext()->getTitle(); ?></span>
+            <i id="btn-pager-last"
+               class="btn-action-pager material-icons <?php echo $pager->getIconLast()->getClass(); ?>"
+               data-action-id="<?php echo $pager->getSourceAction()->getId(); ?>"
+               data-action-form="<?php echo $pager->getSourceAction()->getName(); ?>"
+               data-start="<?php echo $pager->getLast(); ?>"
+               data-count="<?php echo $pager->getLimitCount(); ?>"
+               data-onclick="<?php echo $pager->getOnClick(); ?>"><?php echo $pager->getIconLast()->getIcon(); ?></i>
+            <span
+                    for="btn-pager-last"
+                    class="mdl-tooltip mdl-tooltip--top"><?php echo $pager->getIconLast()->getTitle(); ?></span>
+        <?php endif; ?>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/grid/datagrid-rows.inc b/app/modules/web/themes/material-dark/views/grid/datagrid-rows.inc
new file mode 100644
index 000000000..2b9212bbf
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/grid/datagrid-rows.inc
@@ -0,0 +1,102 @@
+<?php
+/**
+ * @var SP\Html\DataGrid\DataGridTab $data
+ * @var Template                     $this
+ * @var callable                     $_getvar
+ */
+
+use SP\Html\Html;
+use SP\Mvc\View\Template;
+
+if (!isset($data)) {
+    $data = $_getvar('data');
+}
+?>
+
+    <!-- Rows -->
+<?php if ($data->getData()->getDataCount() > 0):
+    $numFields = count($data->getData()->getDataRowSources());
+    foreach ($data->getData()->getData() as $dataIndex => $dataItem):
+        $itemId = $dataItem->{$data->getData()->getDataRowSourceId()};
+        ?>
+        <tr data-item-id="<?php echo $itemId; ?>">
+            <?php foreach ($data->getData()->getDataRowSources() as $rowSrc): ?>
+                <?php
+                if ($rowSrc['isMethod'] === true
+                    && method_exists($dataItem, $rowSrc['name'])
+                ):
+                    $value = $dataItem->{$rowSrc['name']}();
+                else:
+                    $value = $dataItem->{$rowSrc['name']};
+                endif;
+
+                if ($rowSrc['filter'] !== null):
+                    $value = $rowSrc['filter']($value);
+                endif;
+
+                if ($value !== ''):
+                    if ($rowSrc['truncate'] === true):
+                        $value = Html::truncate($value, 150 / $numFields);
+                    endif;
+                else:
+                    $value = '&nbsp;';
+                endif;
+                ?>
+                <td class="cell-data"><?php echo $value; ?></td>
+            <?php endforeach; ?>
+
+            <?php
+            $rowIcons = $data->getData()->getDataRowSourcesWithIcon();
+
+            if (count($rowIcons) > 0): ?>
+                <td class="cell-nodata">
+                    <?php foreach ($rowIcons as $rowSrcIcon): ?>
+                        <?php if ($dataItem->{$rowSrcIcon['field']} == $rowSrcIcon['value']): ?>
+                            <i class="material-icons <?php echo $rowSrcIcon['icon']->getClass(); ?>"
+                               title="<?php echo $rowSrcIcon['icon']->getTitle(); ?>"><?php echo $rowSrcIcon['icon']->getIcon(); ?></i>
+                        <?php endif; ?>
+                    <?php endforeach; ?>
+                </td>
+            <?php endif; ?>
+
+            <?php if ($data->getDataActionsCount() > 0): ?>
+                <td class="cell-actions">
+                    <div>
+                        <?php foreach ($data->getDataActions() as $action):
+                            if (!$action->isSkip()):
+                                $actionUid = uniqid('btn-action-', true);
+                                $filter = $action->getFilterRowSource();
+
+                                if ($filter !== null):
+                                    /** @var array $filter */
+                                    foreach ($filter as $f):
+                                        if ($dataItem->{$f['field']} == $f['value']):
+                                            continue 2;
+                                        endif;
+                                    endforeach;
+                                endif;
+
+                                if ($action->getRuntimeData() !== null) :
+                                    $nodeData = array_merge($action->getData(), $action->getRuntimeData()($dataItem));
+                                else:
+                                    $nodeData = $action->getData();
+                                endif;
+                                ?>
+                                <i id="<?php echo $actionUid; ?>"
+                                   class="btn-action material-icons <?php echo $action->getIcon()->getClass(); ?>"
+                                   data-item-id="<?php echo $itemId; ?>"
+                                   data-onclick="<?php echo $action->getOnClick(); ?>"
+                                    <?php foreach ($nodeData as $dataName => $dataValue):
+                                        echo 'data-', $dataName, '=', '"', $dataValue, '"';
+                                    endforeach; ?>><?php echo $action->getIcon()->getIcon(); ?></i>
+                                <span
+                                        for="<?php echo $actionUid; ?>"
+                                        class="mdl-tooltip mdl-tooltip--top"><?php echo $action->getTitle(); ?></span>
+                            <?php endif; ?>
+                        <?php endforeach; ?>
+                    </div>
+                </td>
+            <?php endif; ?>
+        </tr>
+    <?php endforeach; ?>
+<?php endif; ?>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/grid/datagrid-table-simple.inc b/app/modules/web/themes/material-dark/views/grid/datagrid-table-simple.inc
new file mode 100644
index 000000000..201f1b0b8
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/grid/datagrid-table-simple.inc
@@ -0,0 +1,33 @@
+<?php
+/**
+ * @var DataGridTab                         $data
+ * @var Template                            $this
+ * @var DataGridAction|DataGridActionSearch $action
+ */
+
+use SP\Html\DataGrid\Action\DataGridAction;
+use SP\Html\DataGrid\Action\DataGridActionSearch;
+use SP\Html\DataGrid\DataGridTab;
+use SP\Mvc\View\Template;
+
+if (!isset($data)) {
+    $data = $_getvar('data');
+}
+?>
+
+    <table class="mdl-data-table mdl-js-data-table table-responsive data-table">
+        <thead>
+        <tr>
+            <?php foreach ($data->getHeader()->getHeaders() as $header): ?>
+                <th class="mdl-data-table__cell--non-numeric"><?php echo $header; ?></th>
+            <?php endforeach; ?>
+        </tr>
+        </thead>
+
+        <tbody id="data-rows-<?php echo $data->getId(); ?>">
+        <?php include $data->getDataRowTemplate(); ?>
+        </tbody>
+    </table>
+
+    <!-- Pager -->
+<?php include $data->getDataPagerTemplate(); ?>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/grid/datagrid-table.inc b/app/modules/web/themes/material-dark/views/grid/datagrid-table.inc
new file mode 100644
index 000000000..e46c3bc1a
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/grid/datagrid-table.inc
@@ -0,0 +1,37 @@
+<?php
+/**
+ * @var DataGridTab                         $data
+ * @var Template                            $this
+ * @var DataGridAction|DataGridActionSearch $action
+ * @var callable                            $_getvar
+ */
+
+use SP\Html\DataGrid\Action\DataGridAction;
+use SP\Html\DataGrid\Action\DataGridActionSearch;
+use SP\Html\DataGrid\DataGridTab;
+use SP\Mvc\View\Template;
+
+if (!isset($data)) {
+    $data = $_getvar('data');
+}
+?>
+    <table class="mdl-data-table mdl-js-data-table mdl-data-table--selectable table-responsive data-table">
+        <thead>
+        <tr>
+            <?php foreach ($data->getHeader()->getHeaders() as $header): ?>
+                <th class="mdl-data-table__cell--non-numeric"><?php echo $header; ?></th>
+            <?php endforeach; ?>
+
+            <?php if ($data->getDataActionsCount() > 0): ?>
+                <th class="mdl-data-table__cell--non-numeric">&nbsp;</th>
+            <?php endif; ?>
+        </tr>
+        </thead>
+
+        <tbody id="data-rows-<?php echo $data->getId(); ?>">
+        <?php include $data->getDataRowTemplate(); ?>
+        </tbody>
+    </table>
+
+    <!-- Pager -->
+<?php include $data->getDataPagerTemplate(); ?>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/grid/datatabs-grid.inc b/app/modules/web/themes/material-dark/views/grid/datatabs-grid.inc
new file mode 100644
index 000000000..46dd77257
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/grid/datatabs-grid.inc
@@ -0,0 +1,33 @@
+<?php
+/**
+ * @var SP\Html\DataGrid\DataGridTab $data
+ * @var ThemeIcons                   $icons
+ * @var ConfigData                   $configData
+ * @var callable                     $_getvar
+ * @var Template                     $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+$tabs = $_getvar('tabs');
+?>
+<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
+    <div id="tabsHeader" class="mdl-tabs__tab-bar"></div>
+
+    <?php foreach ($tabs as $index => $data): ?>
+        <div id="tabs-<?php echo $index; ?>"
+             class="mdl-tabs__panel"
+             data-tab-route="<?php echo $_getvar('tabsRoute'); ?>"
+             data-tab-index="<?php echo $index; ?>">
+
+            <?php include __DIR__ . DIRECTORY_SEPARATOR . 'datagrid-grid.inc'; ?>
+        </div>
+
+        <script type="text/javascript">
+            sysPassApp.theme.html.tabs.add("#tabsHeader", <?php echo $index; ?>, "<?php echo $data->getTitle(); ?>", <?php echo $index === $_getvar('activeTab') ? 1 : 0; ?>);
+        </script>
+    <?php endforeach; ?>
+</div>
+<!-- End Tabs-->
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/install/index.inc b/app/modules/web/themes/material-dark/views/install/index.inc
new file mode 100644
index 000000000..9bfa22d90
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/install/index.inc
@@ -0,0 +1,190 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+<div id="actions" class="installer" align="center">
+    <div id="page-title">
+        <h1><?php printf(__('Installation %s'), $_getvar('app_version')); ?></h1>
+    </div>
+
+    <?php include $this->includePartial('error-list'); ?>
+
+    <form id="frmInstall" class="form-action" data-onsubmit="main/install"
+          data-route="install/install">
+        <input type="hidden" name="install" value="true"/>
+        <input type="hidden" name="isAjax" value="1"/>
+
+        <fieldset id="adminaccount">
+            <legend><?php echo __('sysPass Admin'); ?></legend>
+
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="adminlogin" name="adminlogin" type="text" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       value="admin" maxlength="80" autocomplete="off"
+                       tabindex="0"
+                       autofocus>
+                <label class="mdl-textfield__label"
+                       for="adminlogin"><?php echo __('sysPass admin user'); ?></label>
+            </div>
+
+            <div id="help-login"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>">
+                <?php echo $icons->getIconHelp()->getIcon(); ?>
+            </div>
+            <div class="mdl-tooltip" for="help-login">
+                <?php echo __('sysPass administrator\'s login'); ?>
+            </div>
+
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="adminpass" name="adminpass" type="password" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input"
+                       value="" maxlength="255" autocomplete="off">
+                <label class="mdl-textfield__label"
+                       for="adminlogin"><?php echo __('Password'); ?></label>
+            </div>
+        </fieldset>
+
+        <fieldset id="masterpwd">
+            <legend><?php echo __('Master Password'); ?></legend>
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="masterpassword" name="masterpassword" type="password"
+                       required
+                       class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input"
+                       value="" maxlength="255" autocomplete="off">
+                <label class="mdl-textfield__label"
+                       for="masterpassword"><?php echo __('Master Password'); ?></label>
+            </div>
+
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="masterpasswordR" name="masterpasswordr"
+                       type="password" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       value="" maxlength="255" autocomplete="off">
+                <label class="mdl-textfield__label"
+                       for="masterpasswordR"><?php echo __('Password (repeat)'); ?></label>
+            </div>
+        </fieldset>
+
+        <fieldset id='databaseField'>
+            <legend><?php echo __('DB Configuration'), ' (MySQL)'; ?></legend>
+
+            <input type='hidden' id='hasMySQL' value='true'/>
+            <input type="hidden" id="dbtype" name="dbtype" value="mysql"/>
+
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="dbuser" name="dbuser" type="text" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       value="root" autocomplete="off" autofocus>
+                <label class="mdl-textfield__label"
+                       for="dbuser"><?php echo __('DB access user'); ?></label>
+            </div>
+
+            <div id="help-dblogin"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>">
+                <?php echo $icons->getIconHelp()->getIcon(); ?>
+            </div>
+            <div class="mdl-tooltip" for="help-dblogin">
+                <?php echo __('An user with MySQL admin rights'); ?>
+            </div>
+
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="dbpass" name="dbpass" type="password" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input-show"
+                       value="" autocomplete="off" autofocus>
+                <label class="mdl-textfield__label"
+                       for="dbpass"><?php echo __('DB access password'); ?></label>
+            </div>
+
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="dbname" name="dbname" type="text" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       value="syspass" autocomplete="off" autofocus
+                       pattern="[0-9a-zA-Z$_-]+">
+                <label class="mdl-textfield__label"
+                       for="dbuser"><?php echo __('sysPass database name'); ?></label>
+            </div>
+
+            <div id="help-dbname"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>">
+                <?php echo $icons->getIconHelp()->getIcon(); ?>
+            </div>
+            <div class="mdl-tooltip" for="help-dbname">
+                <?php echo __('sysPass database name'); ?>
+            </div>
+
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="dbhost" name="dbhost" type="text" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       value="localhost" autocomplete="off" autofocus
+                       pattern="([0-9a-zA-Z._-]+|([0-9]{1,3}.)+)(:[0-9]{1,5})?|unix:.*">
+                <label class="mdl-textfield__label"
+                       for="dbhost"><?php echo __('sysPass database server'); ?></label>
+            </div>
+
+            <div id="help-dbhost"
+                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>">
+                <?php echo $icons->getIconHelp()->getIcon(); ?>
+            </div>
+            <div class="mdl-tooltip" for="help-dbhost">
+                <?php echo __('Server name to install sysPass database'); ?>
+            </div>
+        </fieldset>
+
+        <fieldset id="site">
+            <legend><?php echo __('General'); ?></legend>
+
+            <div class="form-field">
+                <label for="sel-sitelang"><?php echo __('Language'); ?></label>
+                <select name="sitelang" id="sel-sitelang" size="1"
+                        class="select-box"
+                        title="<?php echo __('Language'); ?>">
+                    <?php /** @var SelectItem $lang */
+                    foreach ($_getvar('langs') as $lang): ?>
+                        <option value="<?php echo $lang->getId(); ?>" <?php echo $lang->isSelected() ? 'selected' : ''; ?>><?php echo $lang->getName(); ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </div>
+
+            <div class="form-field">
+                <label for="hostingmode">
+                    <?php echo __('Hosting Mode'); ?>
+                    <div id="help-hostingmode"
+                         class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>">
+                        <?php echo $icons->getIconHelp()->getIcon(); ?>
+                    </div>
+
+                    <div class="mdl-tooltip" for="help-hostingmode">
+                        <?php echo __('It does not create or verify the user\'s permissions on the DB'); ?>
+                    </div>
+                </label>
+
+                <div>
+                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"
+                           for="hostingmode">
+                        <input type="checkbox" id="hostingmode"
+                               class="mdl-checkbox__input" name="hostingmode">
+                    </label>
+                </div>
+            </div>
+        </fieldset>
+
+        <div class="buttons">
+            <button class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent"
+                    type="submit">
+                <?php echo __('Install'); ?>
+                <i class="material-icons"
+                   title="<?php echo __('Install'); ?>"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+            </button>
+        </div>
+    </form>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/account_bulkedit.inc b/app/modules/web/themes/material-dark/views/itemshow/account_bulkedit.inc
new file mode 100644
index 000000000..0b5ce7136
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/account_bulkedit.inc
@@ -0,0 +1,309 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ * @var SelectItem $client
+ * @var SelectItem $category
+ * @var SelectItem $user
+ * @var SelectItem $userGroup
+ * @var SelectItem $tag
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
+        <div class="mdl-tabs__tab-bar">
+            <a href="#general-panel"
+               class="mdl-tabs__tab is-active"><?php echo __('General'); ?></a>
+            <a href="#permission-panel"
+               class="mdl-tabs__tab"><?php echo __('Permissions'); ?></a>
+            <a href="#other-panel"
+               class="mdl-tabs__tab"><?php echo __('Others'); ?></a>
+        </div>
+
+        <form method="post" name="frmAccountBulkEdit" id="frmAccountBulkEdit"
+              class="form-action"
+              data-onsubmit="appMgmt/save"
+              data-action-route="<?php echo $_getvar('route', ''); ?>"
+              data-hash="">
+
+            <div class="mdl-tabs__panel is-active" id="general-panel">
+                <table class="popup-data">
+                    <tbody>
+                    <tr>
+                        <td class="descField"><?php echo __('Client'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Client'); ?></div>
+
+                            <select id="client_id" name="client_id"
+                                    class="select-box">
+                                <option value=""><?php echo __('Select Client'); ?></option>
+                                <?php foreach ($_getvar('clients') as $client): ?>
+                                    <option
+                                            value="<?php echo $client->getId(); ?>"><?php echo $client->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Category'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Category'); ?></div>
+
+                            <select id="category_id" name="category_id"
+                                    class="select-box">
+                                <option value=""><?php echo __('Select Category'); ?></option>
+                                <?php foreach ($_getvar('categories') as $category): ?>
+                                    <option
+                                            value="<?php echo $category->getId(); ?>"><?php echo $category->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Creator'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Creator'); ?></div>
+
+                            <select id="owner_id" name="owner_id"
+                                    class="select-box">
+                                <option value=""><?php echo __('Select User'); ?></option>
+                                <?php foreach ($_getvar('users') as $user): ?>
+                                    <option
+                                            value="<?php echo $user->getId(); ?>"><?php echo $user->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Main Group'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Main Group'); ?></div>
+
+                            <select id="main_usergroup_id"
+                                    name="main_usergroup_id" class="select-box">
+                                <option value=""><?php echo __('Select Group'); ?></option>
+                                <?php foreach ($_getvar('userGroups') as $group): ?>
+                                    <option
+                                            value="<?php echo $group->getId(); ?>"><?php echo $group->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Tags'); ?></td>
+                        <td class="valField">
+                            <select id="tags" name="tags[]" multiple="multiple"
+                                    class="select-box-tags">
+                                <option value=""><?php echo __('Select Tags'); ?></option>
+                                <?php foreach ($_getvar('tags') as $tag): ?>
+                                    <option value="<?php echo $tag->getId(); ?>"><?php echo $tag->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+                    </tbody>
+                </table>
+            </div>
+
+            <div class="mdl-tabs__panel" id="permission-panel">
+                <table class="popup-data">
+                    <tbody>
+                    <tr>
+                        <td class="descField"><?php echo __('Users'); ?></td>
+                        <td class="valField">
+                            <div class="account-permissions">
+                                <div class="tag-list-box">
+                                    <select id="other_users_view"
+                                            name="other_users_view[]"
+                                            multiple="multiple"
+                                            class="select-box-tags">
+                                        <option value=""><?php echo __('Select Users'); ?></option>
+                                        <?php foreach ($_getvar('users') as $user): ?>
+                                            <option
+                                                    value="<?php echo $user->getId(); ?>"><?php echo $user->getName(); ?></option>
+                                        <?php endforeach; ?>
+                                    </select>
+
+                                    <i class="material-icons select-icon"
+                                       title="<?php echo __('View'); ?>"><?php echo $icons->getIconView()->getIcon(); ?></i>
+                                </div>
+
+                                <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"
+                                       for="clear_permission_users_view">
+                                    <input type="checkbox"
+                                           id="clear_permission_users_view"
+                                           class="mdl-checkbox__input"
+                                           name="clear_permission_users_view">
+                                    <span class="mdl-checkbox__label"><?php echo __('Delete'); ?></span>
+                                </label>
+
+                                <div class="tag-list-box">
+                                    <select id="other_users_edit"
+                                            name="other_users_edit[]"
+                                            multiple="multiple"
+                                            class="select-box-tags">
+                                        <option value=""><?php echo __('Select Users'); ?></option>
+                                        <?php foreach ($_getvar('users') as $user): ?>
+                                            <option
+                                                    value="<?php echo $user->getId(); ?>"><?php echo $user->getName(); ?></option>
+                                        <?php endforeach; ?>
+                                    </select>
+
+                                    <i class="material-icons select-icon"
+                                       title="<?php echo __('Edit'); ?>"><?php echo $icons->getIconEdit()->getIcon(); ?></i>
+                                </div>
+
+                                <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"
+                                       for="clear_permission_users_edit">
+                                    <input type="checkbox"
+                                           id="clear_permission_users_edit"
+                                           class="mdl-checkbox__input"
+                                           name="clear_permission_users_edit">
+                                    <span class="mdl-checkbox__label"><?php echo __('Delete'); ?></span>
+                                </label>
+                            </div>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Groups'); ?></td>
+                        <td class="valField">
+                            <div class="account-permissions">
+                                <div class="tag-list-box">
+                                    <select id="other_usergroups_view"
+                                            name="other_usergroups_view[]"
+                                            multiple="multiple"
+                                            class="select-box-tags">
+                                        <option value=""><?php echo __('Select Groups'); ?></option>
+                                        <?php foreach ($_getvar('userGroups') as $userGroup): ?>
+                                            <option
+                                                    value="<?php echo $userGroup->getId(); ?>"><?php echo $userGroup->getName(); ?></option>
+                                        <?php endforeach; ?>
+                                    </select>
+
+                                    <i class="material-icons select-icon"
+                                       title="<?php echo __('View'); ?>"><?php echo $icons->getIconView()->getIcon(); ?></i>
+                                </div>
+
+                                <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"
+                                       for="clear_permission_usergroups_view">
+                                    <input type="checkbox"
+                                           id="clear_permission_usergroups_view"
+                                           class="mdl-checkbox__input"
+                                           name="clear_permission_usergroups_view">
+                                    <span class="mdl-checkbox__label"><?php echo __('Delete'); ?></span>
+                                </label>
+
+                                <div class="tag-list-box">
+                                    <select id="other_usergroups_edit"
+                                            name="other_usergroups_edit[]"
+                                            multiple="multiple"
+                                            class="select-box-tags">
+                                        <option value=""><?php echo __('Select Groups'); ?></option>
+                                        <?php foreach ($_getvar('userGroups') as $userGroup): ?>
+                                            <option
+                                                    value="<?php echo $userGroup->getId(); ?>"><?php echo $userGroup->getName(); ?></option>
+                                        <?php endforeach; ?>
+                                    </select>
+
+                                    <i class="material-icons select-icon"
+                                       title="<?php echo __('Edit'); ?>"><?php echo $icons->getIconEdit()->getIcon(); ?></i>
+                                </div>
+
+                                <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"
+                                       for="clear_permission_usergroups_edit">
+                                    <input type="checkbox"
+                                           id="clear_permission_usergroups_edit"
+                                           class="mdl-checkbox__input"
+                                           name="clear_permission_usergroups_edit">
+                                    <span class="mdl-checkbox__label"><?php echo __('Delete'); ?></span>
+                                </label>
+                            </div>
+                        </td>
+                    </tr>
+                    </tbody>
+                </table>
+            </div>
+
+            <div class="mdl-tabs__panel" id="other-panel">
+                <table class="popup-data">
+                    <tbody>
+                    <tr>
+                        <td></td>
+                        <td>
+                            <ul class="other-list-action mdl-list">
+                                <li class="mdl-list__item mdl-list__item--two-line">
+                                    <div class="mdl-switch__box">
+                                        <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"
+                                               for="delete_history">
+                                            <input type="checkbox"
+                                                   id="delete_history"
+                                                   class="mdl-checkbox__input"
+                                                   name="delete_history">
+                                        </label>
+                                    </div>
+
+                                    <span class="mdl-list__item-primary-content">
+                                        <span><?php echo __('Delete History'); ?></span>
+                                        <span class="mdl-list__item-sub-title">
+                                            <?php echo __('Delete History'); ?>
+                                        </span>
+                                    </span>
+                                </li>
+                            </ul>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Password Expiry Date'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="password_date_expire"
+                                       name="password_date_expire" type="date"
+                                       class="mdl-textfield__input mdl-color-text--indigo-400 password-datefield__input"
+                                       data-dst-unix="password_date_expire_unix">
+                                <input type='hidden'
+                                       name='password_date_expire_unix'
+                                       value=""/>
+                                <label class="mdl-textfield__label"
+                                       for="password_date_expire"><?php echo __('Date'); ?></label>
+                            </div>
+                            <i class="material-icons btn-action"
+                               title="<?php echo __('Select date'); ?>">date_range</i>
+                        </td>
+                    </tr>
+
+                    </tbody>
+                </table>
+            </div>
+
+            <input type="hidden" name="itemsId"
+                   value="<?php echo implode(',', $_getvar('itemsId')); ?>">
+            <input type="hidden" name="isAjax" value="1">
+        </form>
+    </div>
+
+    <div class="action-in-box">
+        <button form="frmAccountBulkEdit"
+                class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+            <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+        </button>
+    </div>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/auth_token.inc b/app/modules/web/themes/material-dark/views/itemshow/auth_token.inc
new file mode 100644
index 000000000..baebb8ee4
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/auth_token.inc
@@ -0,0 +1,108 @@
+<?php
+/**
+ * @var  AuthTokenData $authToken
+ * @var ThemeIcons     $icons
+ * @var ConfigData     $configData
+ * @var callable       $_getvar
+ * @var Template       $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\AuthTokenData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+$authToken = $_getvar('authToken');
+?>
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="frmTokens" id="frmTokens" class="form-action"
+          data-onsubmit="appMgmt/save"
+          data-action-route="<?php echo $_getvar('route', ''); ?>"
+          data-hash="">
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('User'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('User'); ?></div>
+
+                    <select id="selUsers" name="users" class="select-box"
+                            required <?php echo $_getvar('disabled'); ?>>
+                        <option value=""><?php echo __('Select User'); ?></option>
+                        <?php /** @var SelectItem $user */
+                        foreach ($_getvar('users') as $user): ?>
+                            <option value="<?php echo $user->getId(); ?>" <?php echo $user->isSelected() ? 'selected' : ''; ?>><?php printf('%s (%s)', $user->getName(), $user->getItemProperty('login')); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Action'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Action'); ?></div>
+
+                    <select id="selActions" name="actions"
+                            class="select-box"
+                            required <?php echo $_getvar('disabled'); ?>>
+                        <option value=""><?php echo __('Select Action'); ?></option>
+                        <?php /** @var SelectItem $action */
+                        foreach ($_getvar('actions') as $action): ?>
+                            <option value="<?php echo $action->getId(); ?>" <?php echo $action->isSelected() ? 'selected' : ''; ?>><?php echo $action->getName(); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+                </td>
+            </tr>
+            <?php if (!$_getvar('isView')): ?>
+                <tr>
+                    <td class="descField"><?php echo __('Password'); ?></td>
+                    <td class="valField">
+                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                            <input id="pass" name="pass" type="password"
+                                   class="mdl-textfield__input passwordfield__input mdl-color-text--indigo-400"
+                                   maxlength="50">
+                            <label class="mdl-textfield__label"
+                                   for="pass"><?php echo __('Password'); ?></label>
+                        </div>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="descField"><?php echo __('Options'); ?></td>
+                    <td class="valField">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="refreshtoken"
+                               title="<?php echo __('Refresh Authorization'); ?>">
+                            <input type="checkbox" id="refreshtoken"
+                                   class="mdl-switch__input mdl-color-text--indigo-400"
+                                   name="refreshtoken"/>
+                            <span class="mdl-switch__label"><?php echo __('Refresh Authorization'); ?></span>
+                        </label>
+                    </td>
+                </tr>
+            <?php else: ?>
+                <tr>
+                    <td class="descField"><?php echo __('Token'); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('Token'); ?></div>
+
+                        <?php echo $authToken->getToken(); ?>
+                    </td>
+                </tr>
+            <?php endif; ?>
+            </tbody>
+        </table>
+
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+    <div class="action-in-box">
+        <button
+                class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                form="frmTokens"
+                title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+            <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+        </button>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/itemshow/category.inc b/app/modules/web/themes/material-dark/views/itemshow/category.inc
new file mode 100644
index 000000000..5b6485b69
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/category.inc
@@ -0,0 +1,70 @@
+<?php
+/**
+ * @var  CategoryData $category
+ * @var ThemeIcons    $icons
+ * @var ConfigData    $configData
+ * @var callable      $_getvar
+ * @var Template      $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\CategoryData;
+use SP\Mvc\View\Template;
+
+$category = $_getvar('category');
+?>
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="frmCategories" id="frmCategories"
+          class="form-action"
+          data-onsubmit="appMgmt/save"
+          data-action-route="<?php echo $_getvar('route', ''); ?>"
+          data-hash="">
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="name" name="name" type="text" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50"
+                               value="<?php echo $category->getName(); ?>">
+                        <label class="mdl-textfield__label"
+                               for="name"><?php echo __('Category name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Description'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="description" name="description" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50"
+                               value="<?php echo $category->getDescription(); ?>">
+                        <label class="mdl-textfield__label"
+                               for="description"><?php echo __('Category description'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <?php if ($_getvar('customFields')): ?>
+                <?php include $this->includeTemplate('aux-customfields', 'common'); ?>
+            <?php endif; ?>
+            </tbody>
+        </table>
+
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+    <div class="action-in-box">
+        <button
+                class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                form="frmCategories"
+                title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+            <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+        </button>
+    </div>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/client.inc b/app/modules/web/themes/material-dark/views/itemshow/client.inc
new file mode 100644
index 000000000..e994fb321
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/client.inc
@@ -0,0 +1,97 @@
+<?php
+/**
+ * @var ClientData $client
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\ClientData;
+use SP\Mvc\View\Template;
+
+$client = $_getvar('client');
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="frmClients" id="frmClients" class="form-action"
+          data-onsubmit="appMgmt/save"
+          data-action-route="<?php echo $_getvar('route', ''); ?>"
+          data-hash="">
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="name" name="name" type="text" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50"
+                               value="<?php echo $client->getName(); ?>">
+                        <label class="mdl-textfield__label"
+                               for="name"><?php echo __('Client name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+
+            <tr>
+                <td class="descField"><?php echo __('Description'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="description" name="description" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50"
+                               value="<?php echo $client->getDescription(); ?>">
+                        <label class="mdl-textfield__label"
+                               for="description"><?php echo __('Client description'); ?></label>
+                    </div>
+                </td>
+            </tr>
+
+            <tr>
+                <td class="descField">
+                    <div id="help-isglobal"
+                         class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                    <div class="mdl-tooltip mdl-tooltip--large"
+                         for="help-isglobal">
+                        <p>
+                            <?php echo __('Sets whether the client is visible by all users'); ?>
+                        </p>
+                        <p>
+                            <?php echo __('By default, clients assigned to accounts only will be visible by users who are granted to access to the accounts.'); ?>
+                        </p>
+                    </div>
+                </td>
+                <td class="valField">
+                    <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                           for="isglobal">
+                        <input type="checkbox" id="isglobal"
+                               class="mdl-switch__input mdl-color-text--indigo-400"
+                               name="isglobal" <?php echo $client->getIsGlobal() ? 'checked' : ' '; ?>/>
+                        <span class="mdl-switch__label"><?php echo __('Global'); ?></span>
+                    </label>
+                </td>
+            </tr>
+
+            <?php if ($_getvar('customFields')): ?>
+                <?php include $this->includeTemplate('aux-customfields', 'common'); ?>
+            <?php endif; ?>
+            </tbody>
+        </table>
+
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+    <div class="action-in-box">
+        <button
+                class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                form="frmClients"
+                title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+            <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+        </button>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/itemshow/custom_field.inc b/app/modules/web/themes/material-dark/views/itemshow/custom_field.inc
new file mode 100644
index 000000000..a857f6d1c
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/custom_field.inc
@@ -0,0 +1,123 @@
+<?php
+/**
+ * @var CustomFieldDefinitionData $field
+ * @var ThemeIcons                $icons
+ * @var ConfigData                $configData
+ * @var callable                  $_getvar
+ * @var Template                  $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\CustomFieldDefinitionData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+$field = $_getvar('field');
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="frmCustomFields" id="frmCustomFields"
+          class="form-action"
+          data-onsubmit="appMgmt/save"
+          data-action-route="<?php echo $_getvar('route', ''); ?>"
+          data-hash="">
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="name" name="name" type="text" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50"
+                               value="<?php echo $field->getName(); ?>">
+                        <label class="mdl-textfield__label"
+                               for="name"><?php echo __('Field name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Type'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Type'); ?></div>
+
+                    <select name="type" id="sel-type" size="1"
+                            class="select-box">
+                        <?php /** @var SelectItem $type */
+                        foreach ($_getvar('types') as $type): ?>
+                            <option
+                                    value='<?php echo $type->getId(); ?>' <?php echo ($type->getId() === $field->getTypeId()) ? 'selected' : ''; ?>><?php echo __($type->getItemProperty('text')); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Module'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Module'); ?></div>
+
+                    <select name="module" id="sel-module" size="1"
+                            class="select-box">
+                        <?php /** @var SelectItem $module */
+                        foreach ($_getvar('modules') as $module): ?>
+                            <option
+                                    value='<?php echo $module->getId(); ?>' <?php echo $module->isSelected() ? 'selected' : ''; ?>><?php echo $module->getName(); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Help Text'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="help" name="help" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $field->getHelp(); ?>">
+                        <label class="mdl-textfield__label"
+                               for="help"><?php echo __('Field\'s help'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"></td>
+                <td class="valField">
+                    <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                           for="required">
+                        <input type="checkbox" id="required"
+                               class="mdl-switch__input mdl-color-text--indigo-400"
+                               name="required"
+                            <?php echo $field->getRequired() ? 'checked' : ''; ?>/>
+                        <span class="mdl-switch__label"><?php echo __('Required'); ?></span>
+                    </label>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"></td>
+                <td class="valField">
+                    <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                           for="encrypted">
+                        <input type="checkbox" id="encrypted"
+                               class="mdl-switch__input mdl-color-text--indigo-400"
+                               name="encrypted" <?php echo $field->getisEncrypted() ? 'checked' : ''; ?>/>
+                        <span class="mdl-switch__label"><?php echo __('Encrypted'); ?></span>
+                    </label>
+                </td>
+            </tr>
+            </tbody>
+        </table>
+
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+    <div class="action-in-box">
+        <button
+                class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                form="frmCustomFields"
+                title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+            <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+        </button>
+    </div>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/file.inc b/app/modules/web/themes/material-dark/views/itemshow/file.inc
new file mode 100644
index 000000000..5e7bcb59a
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/file.inc
@@ -0,0 +1,24 @@
+<?php
+/**
+ * @var FileData   $fileData
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\FileData;
+use SP\Mvc\View\Template;
+
+$fileData = $_getvar('fileData');
+?>
+
+<?php if ($_getvar('isImage')): ?>
+    <img src="data:'<?php echo $fileData->getType(); ?>;base64, <?php echo $_getvar('data'); ?>"
+         border="0"/>
+    <div class="title"><?php echo $fileData->getName(); ?></div>
+<?php else: ?>
+    <pre><?php echo $_getvar('data'); ?></pre>
+<?php endif; ?>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/itemshow/item_preset-password.inc b/app/modules/web/themes/material-dark/views/itemshow/item_preset-password.inc
new file mode 100644
index 000000000..c0ae6302b
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/item_preset-password.inc
@@ -0,0 +1,178 @@
+<?php
+/**
+ * @var Password   $password
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\ItemPreset\Password;
+use SP\Mvc\View\Template;
+
+$password = $_getvar('password');
+?>
+
+<table class="popup-data">
+    <tbody>
+    <tr>
+        <td class="descField"><?php echo __('Length'); ?></td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="timeout" name="length" type="number"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       min="1" max="100"
+                       value="<?php echo $password->getLength() ?: 1; ?>"/>
+                <label class="mdl-textfield__label"
+                       for="length"><?php echo __('Length'); ?></label>
+            </div>
+        </td>
+    </tr>
+
+    <tr>
+        <td class="descField"><?php echo __('Accounts password expiry'); ?></td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="expire_time" name="expire_time" type="number"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       min="0"
+                       value="<?php echo $password->getExpireTime() ? $password->getExpireTime() / $_getvar('expireTimeMultiplier') : 1; ?>"/>
+                <label class="mdl-textfield__label"
+                       for="expire_time"><?php echo __('Expire time (days)'); ?></label>
+            </div>
+        </td>
+    </tr>
+
+    <tr>
+        <td class="descField"><?php echo __('Score'); ?></td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="score" name="score" type="number"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       min="0" max="5"
+                       value="<?php echo $password->getScore(); ?>"
+                       disabled="disabled" readonly/>
+                <label class="mdl-textfield__label"
+                       for="score"><?php echo __('Score'); ?></label>
+            </div>
+        </td>
+    </tr>
+
+    <tr>
+        <td class="descField"><?php echo __('Regular Expression'); ?></td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="regex" name="regex" type="text"
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       value="<?php echo htmlentities($password->getRegex()); ?>"/>
+                <label class="mdl-textfield__label"
+                       for="regex"><?php echo __('Regular Expression'); ?></label>
+            </div>
+        </td>
+    </tr>
+
+    <tr>
+        <td class="descField"></td>
+        <td class="valField">
+            <ul class="password-list-action mdl-list">
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="use_numbers_enabled">
+                            <input type="checkbox" id="use_numbers_enabled"
+                                   class="mdl-switch__input"
+                                   name="use_numbers_enabled" <?php echo $password->isUseNumbers() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Include Numbers'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="use_letters_enabled">
+                            <input type="checkbox" id="use_letters_enabled"
+                                   class="mdl-switch__input"
+                                   name="use_letters_enabled" <?php echo $password->isUseLetters() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Include Letters'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="use_symbols_enabled">
+                            <input type="checkbox" id="use_symbols_enabled"
+                                   class="mdl-switch__input"
+                                   name="use_symbols_enabled" <?php echo $password->isUseSymbols() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Include Symbols'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="use_upper_enabled">
+                            <input type="checkbox" id="use_upper_enabled"
+                                   class="mdl-switch__input"
+                                   name="use_upper_enabled" <?php echo $password->isUseUpper() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Include Uppercase'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="use_lower_enabled">
+                            <input type="checkbox" id="use_lower_enabled"
+                                   class="mdl-switch__input"
+                                   name="use_lower_enabled" <?php echo $password->isUseLower() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Include Lowercase'); ?></span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="use_image_enabled">
+                            <input type="checkbox" id="use_image_enabled"
+                                   class="mdl-switch__input"
+                                   name="use_image_enabled" <?php echo $password->isUseImage() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Image to show password'); ?></span>
+                        <span class="mdl-list__item-sub-title">
+                            <?php echo __('Generate an image with a text of the account password.'); ?>
+                            <br>
+                            <?php echo __('Useful for environments where copying a password to clipboard is a security risk.'); ?>
+                        </span>
+                    </span>
+                </li>
+            </ul>
+        </td>
+    </tr>
+    </tbody>
+</table>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/itemshow/item_preset-permission.inc b/app/modules/web/themes/material-dark/views/itemshow/item_preset-permission.inc
new file mode 100644
index 000000000..7a796a55c
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/item_preset-permission.inc
@@ -0,0 +1,103 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+?>
+<table class="popup-data">
+    <tbody>
+    <tr>
+        <td class="descField"><?php echo __('Users'); ?></td>
+        <td class="valField">
+            <div class="account-permissions">
+                <div class="tag-list-box">
+                    <select id="users_view" name="users_view[]"
+                            multiple="multiple"
+                            class="select-box-tags">
+                        <option value=""><?php echo __('Select Users'); ?></option>
+                        <?php /** @var SelectItem $user */
+                        foreach ($_getvar('usersView') as $user): ?>
+                            <?php if ($user->isSkip()): continue; endif; ?>
+                            <option
+                                    value="<?php echo $user->getId(); ?>"
+                                <?php echo $user->isSelected() ? 'selected' : '' ?>><?php echo $user->getName(); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+
+                    <i class="material-icons select-icon"
+                       title="<?php echo __('View'); ?>"><?php echo $icons->getIconView()->getIcon(); ?></i>
+                </div>
+
+                <div class="tag-list-box">
+                    <select id="users_edit" name="users_edit[]"
+                            multiple="multiple"
+                            class="select-box-tags">
+                        <option value=""><?php echo __('Select Users'); ?></option>
+                        <?php /** @var SelectItem $user */
+                        foreach ($_getvar('usersEdit') as $user): ?>
+                            <?php if ($user->isSkip()): continue; endif; ?>
+                            <option
+                                    value="<?php echo $user->getId(); ?>"
+                                <?php echo $user->isSelected() ? 'selected' : '' ?>><?php echo $user->getName(); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+
+                    <i class="material-icons select-icon"
+                       title="<?php echo __('Edit'); ?>"><?php echo $icons->getIconEdit()->getIcon(); ?></i>
+                </div>
+            </div>
+        </td>
+    </tr>
+
+    <tr>
+        <td class="descField"><?php echo __('Groups'); ?></td>
+        <td class="valField">
+            <div class="account-permissions">
+                <div class="tag-list-box">
+                    <select id="user_groups_view" name="user_groups_view[]"
+                            multiple="multiple"
+                            class="select-box-tags">
+                        <option value=""><?php echo __('Select Groups'); ?></option>
+                        <?php /** @var SelectItem $userGroup */
+                        foreach ($_getvar('userGroupsView') as $userGroup): ?>
+                            <?php if ($userGroup->isSkip()): continue; endif; ?>
+                            <option
+                                    value="<?php echo $userGroup->getId(); ?>"
+                                <?php echo $userGroup->isSelected() ? 'selected' : '' ?>><?php echo $userGroup->getName(); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+
+                    <i class="material-icons select-icon"
+                       title="<?php echo __('View'); ?>"><?php echo $icons->getIconView()->getIcon(); ?></i>
+                </div>
+
+                <div class="tag-list-box">
+                    <select id="user_groups_edit" name="user_groups_edit[]"
+                            multiple="multiple"
+                            class="select-box-tags">
+                        <option value=""><?php echo __('Select Groups'); ?></option>
+                        <?php /** @var SelectItem $userGroup */
+                        foreach ($_getvar('userGroupsEdit') as $userGroup): ?>
+                            <?php if ($userGroup->isSkip()): continue; endif; ?>
+                            <option
+                                    value="<?php echo $userGroup->getId(); ?>"
+                                <?php echo $userGroup->isSelected() ? 'selected' : '' ?>><?php echo $userGroup->getName(); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+
+                    <i class="material-icons select-icon"
+                       title="<?php echo __('Edit'); ?>"><?php echo $icons->getIconEdit()->getIcon(); ?></i>
+                </div>
+            </div>
+        </td>
+    </tr>
+    </tbody>
+</table>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/itemshow/item_preset-private.inc b/app/modules/web/themes/material-dark/views/itemshow/item_preset-private.inc
new file mode 100644
index 000000000..1c3d5cca6
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/item_preset-private.inc
@@ -0,0 +1,67 @@
+<?php
+/**
+ * @var AccountPrivate $private
+ * @var ThemeIcons     $icons
+ * @var ConfigData     $configData
+ * @var callable       $_getvar
+ * @var Template       $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\ItemPreset\AccountPrivate;
+use SP\Mvc\View\Template;
+
+$private = $_getvar('private');
+?>
+
+<table class="popup-data">
+    <tbody>
+    <tr>
+        <td class="descField"></td>
+        <td class="valField">
+            <ul class="private-account-list-action mdl-list">
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="private_user_enabled">
+                            <input type="checkbox" id="private_user_enabled"
+                                   class="mdl-switch__input"
+                                   name="private_user_enabled" <?php echo $private->isPrivateUser() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Private Account'); ?></span>
+                        <span class="mdl-list__item-sub-title">
+                            <?php echo __('Accounts will be only visible by the user.'); ?>
+                            <br>
+                            <?php echo __('Administrators won\'t be able to display the accounts.'); ?>
+                        </span>
+                    </span>
+                </li>
+
+                <li class="mdl-list__item mdl-list__item--two-line">
+                    <div class="mdl-switch__box">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="private_group_enabled">
+                            <input type="checkbox" id="private_group_enabled"
+                                   class="mdl-switch__input"
+                                   name="private_group_enabled" <?php echo $private->isPrivateGroup() ? 'checked' : ''; ?>/>
+                        </label>
+                    </div>
+
+                    <span class="mdl-list__item-primary-content">
+                        <span><?php echo __('Private Account for Group'); ?></span>
+                        <span class="mdl-list__item-sub-title">
+                            <?php echo __('Accounts will be only visible by the user and users belonging to the main group.'); ?>
+                            <br>
+                            <?php echo __('Administrators won\'t be able to display the accounts.'); ?>
+                        </span>
+                    </span>
+                </li>
+            </ul>
+        </td>
+    </tr>
+    </tbody>
+</table>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/itemshow/item_preset-session_timeout.inc b/app/modules/web/themes/material-dark/views/itemshow/item_preset-session_timeout.inc
new file mode 100644
index 000000000..be7060a85
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/item_preset-session_timeout.inc
@@ -0,0 +1,47 @@
+<?php
+/**
+ * @var SessionTimeout $sessionTimeout
+ * @var ThemeIcons     $icons
+ * @var ConfigData     $configData
+ * @var callable       $_getvar
+ * @var Template       $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\ItemPreset\SessionTimeout;
+use SP\Mvc\View\Template;
+
+$sessionTimeout = $_getvar('sessionTimeout');
+?>
+
+<table class="popup-data">
+    <tbody>
+    <tr>
+        <td class="descField"><?php echo __('IP Address'); ?></td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="ip_address" name="ip_address" type="text" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       maxlength="33"
+                       value="<?php printf('%s/%s', $sessionTimeout->getAddress(), $sessionTimeout->getMask()); ?>">
+                <label class="mdl-textfield__label"
+                       for="ip_address"><?php echo __('IP Address'); ?></label>
+            </div>
+        </td>
+    </tr>
+    <tr>
+        <td class="descField"><?php echo __('Timeout'); ?></td>
+        <td class="valField">
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="timeout" name="timeout" type="number" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       min="0" max="604800"
+                       value="<?php echo $sessionTimeout->getTimeout(); ?>">
+                <label class="mdl-textfield__label"
+                       for="ip_address"><?php echo __('Timeout'); ?></label>
+            </div>
+        </td>
+    </tr>
+    </tbody>
+</table>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/itemshow/item_preset.inc b/app/modules/web/themes/material-dark/views/itemshow/item_preset.inc
new file mode 100644
index 000000000..f952107bf
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/item_preset.inc
@@ -0,0 +1,171 @@
+<?php
+/**
+ * @var ItemPresetData $preset
+ * @var ThemeIcons     $icons
+ * @var ConfigData     $configData
+ * @var callable       $_getvar
+ * @var Template       $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\ItemPresetData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+$preset = $_getvar('preset');
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
+        <div class="mdl-tabs__tab-bar">
+            <a href="#general-panel"
+               class="mdl-tabs__tab is-active"><?php echo __('General'); ?></a>
+            <a href="#presets-panel"
+               class="mdl-tabs__tab"><?php echo $_getvar('presetName'); ?></a>
+        </div>
+
+        <form method="post" name="frmItemPreset" id="frmItemPreset"
+              class="form-action"
+              data-onsubmit="appMgmt/save"
+              data-action-route="<?php echo $_getvar('route', ''); ?>"
+              data-hash="">
+
+            <div class="mdl-tabs__panel is-active" id="general-panel">
+                <table class="popup-data">
+                    <tbody>
+                    <tr>
+                        <td class="descField"><?php echo __('User'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('User'); ?></div>
+
+                            <select id="selUser" name="user_id"
+                                    class="select-box select-box-deselect"
+                                    title="<?php echo __('User'); ?>" <?php echo $_getvar('disabled'); ?>>
+                                <option value=""><?php echo __('Select User'); ?></option>
+                                <?php /** @var SelectItem $user */
+                                foreach ($_getvar('users') as $user): ?>
+                                    <option
+                                            value="<?php echo $user->getId(); ?>" <?php echo $user->isSelected() ? 'selected' : ''; ?>><?php echo $user->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Group'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Group'); ?></div>
+
+                            <select id="selUserGroup" name="user_group_id"
+                                    class="select-box select-box-deselect"
+                                    title="<?php echo __('Group'); ?>" <?php echo $_getvar('disabled'); ?>>
+                                <option value=""><?php echo __('Select Group'); ?></option>
+                                <?php /** @var SelectItem $userGroup */
+                                foreach ($_getvar('userGroups') as $userGroup): ?>
+                                    <option
+                                            value="<?php echo $userGroup->getId(); ?>" <?php echo $userGroup->isSelected() ? 'selected' : ''; ?>><?php echo $userGroup->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Profile'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Profile'); ?></div>
+
+                            <select id="selUserProfile" name="user_profile_id"
+                                    class="select-box select-box-deselect"
+                                    title="<?php echo __('Profile'); ?>" <?php echo $_getvar('disabled'); ?>>
+                                <option value=""><?php echo __('Select Profile'); ?></option>
+                                <?php /** @var SelectItem $userProfile */
+                                foreach ($_getvar('userProfiles') as $userProfile): ?>
+                                    <option
+                                            value="<?php echo $userProfile->getId(); ?>" <?php echo $userProfile->isSelected() ? 'selected' : ''; ?>><?php echo $userProfile->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField">
+                            <?php echo __('Priority'); ?>
+
+                            <div id="help-priority"
+                                 class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                            <div class="mdl-tooltip mdl-tooltip--large"
+                                 for="help-priority">
+                                <p>
+                                    <?php echo __('Assignment priority if values match with others assigned by user, group or profile.'); ?>
+                                </p>
+                            </div>
+                        </td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="priority" name="priority"
+                                       type="number" step="1"
+                                       pattern="[0-9]{1,3}"
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       maxlength="3" min="0" max="128"
+                                       value="<?php echo $preset->getPriority(); ?>"/>
+                                <label class="mdl-textfield__label"
+                                       for="priority"><?php echo __('Assignment Priority'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"></td>
+                        <td class="valField">
+                            <ul class="mdl-list">
+                                <li class="mdl-list__item mdl-list__item--two-line">
+                                    <div class="mdl-switch__box">
+                                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                               for="fixed_enabled">
+                                            <input type="checkbox"
+                                                   id="fixed_enabled"
+                                                   class="mdl-switch__input"
+                                                   name="fixed_enabled" <?php echo $preset->getFixed() ? 'checked' : ''; ?>/>
+                                        </label>
+                                    </div>
+
+                                    <span class="mdl-list__item-primary-content">
+                                <span><?php echo __('Forced'); ?></span>
+                                <span class="mdl-list__item-sub-title">
+                                    <?php echo __('Enforces the values to be set either on creating or updating an item.'); ?>
+                                    <br>
+                                    <?php echo __('Values will be merged with the existing ones.'); ?>
+                                </span>
+                            </span>
+                                </li>
+                            </ul>
+                        </td>
+                    </tr>
+                    </tbody>
+                </table>
+            </div>
+
+            <div class="mdl-tabs__panel" id="presets-panel">
+                <?php if ($_getvar('typeTemplate')) : include $this->includeTemplate($_getvar('typeTemplate'), 'itemshow'); endif; ?>
+            </div>
+
+
+            <input type="hidden" name="type"
+                   value="<?php echo $preset->getType(); ?>">
+            <input type="hidden" name="isAjax" value="1">
+        </form>
+    </div
+    >
+    <div class="action-in-box">
+        <button
+                class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                form="frmItemPreset"
+                title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+            <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+        </button>
+    </div>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/public_link.inc b/app/modules/web/themes/material-dark/views/itemshow/public_link.inc
new file mode 100644
index 000000000..c9ace8145
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/public_link.inc
@@ -0,0 +1,144 @@
+<?php
+/**
+ * @var PublicLinkListData $publicLink
+ * @var ThemeIcons         $icons
+ * @var ConfigData         $configData
+ * @var callable           $_getvar
+ * @var Template           $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\PublicLinkListData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+$publicLink = $_getvar('publicLink');
+?>
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+    <form method="post" name="frmPublickLink" id="frmPublickLink"
+          class="form-action"
+          data-onsubmit="appMgmt/save"
+          data-action-route="<?php echo $_getvar('route', ''); ?>"
+          data-hash="">
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('Account'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Account'); ?></div>
+
+                    <select id="accountId" name="accountId"
+                            class="select-box" <?php echo $_getvar('disabled'); ?>>
+                        <option value=""><?php echo __('Select Account'); ?></option>
+                        <?php /** @var SelectItem $account */
+                        foreach ($_getvar('accounts') as $account): ?>
+                            <option
+                                    value="<?php echo $account->getId(); ?>" <?php echo $account->isSelected() ? 'selected' : ''; ?>><?php printf('%s (%s)', $account->getName(), $account->getItemProperty('clientName')); ?></option>
+                        <?php endforeach; ?>
+                    </select>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Notify'); ?></td>
+                <td class="valField">
+                    <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                           for="notify"
+                           title="<?php echo __('Notify'); ?>">
+                        <input type="checkbox" id="notify"
+                               class="mdl-switch__input mdl-color-text--indigo-400"
+                               name="notify" <?php echo $_getvar('isView') && $publicLink->isNotify() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                        <span class="mdl-switch__label"><?php echo __('Notify'); ?></span>
+                    </label>
+                </td>
+            </tr>
+            <?php if ($_getvar('isView')): ?>
+                <tr>
+                    <td class="descField"><?php echo __('Creation Date'); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('Creation Date'); ?></div>
+
+                        <?php echo $publicLink->getDateAddFormat(); ?>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="descField"><?php echo __('Expiry Date '); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('Expiry Date '); ?></div>
+
+                        <?php echo $publicLink->getDateExpireFormat(); ?>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="descField"><?php echo __('User'); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('User'); ?></div>
+
+                        <?php echo $publicLink->getUserLogin(); ?>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="descField"><?php echo __('Visits'); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('Visits'); ?></div>
+
+                        <?php echo $publicLink->getCountViewsString(); ?>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="descField"><?php echo __('Hash'); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('Hash'); ?></div>
+
+                        <?php echo $publicLink->getHash(); ?>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="descField"><?php echo __('URL'); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('URL'); ?></div>
+
+                        <a href="<?php echo $_getvar('publicLinkURL'); ?>"
+                           target="_blank"><?php echo $_getvar('publicLinkURL'); ?></a>
+                    </td>
+                </tr>
+                <?php if (is_array($_getvar('usageInfo'))): ?>
+                    <tr>
+                        <td class="descField"><?php echo __('Use'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Use'); ?></div>
+
+                            <div class="list-wrap">
+                                <ul class="mdl-list">
+                                    <?php foreach ($_getvar('usageInfo') as $useInfo): ?>
+                                        <li class="mdl-list__item">
+                                <span class="mdl-list__item-primary-content">
+                                <i class="material-icons mdl-list__item-icon">access_time</i>
+                                    <?php printf('%s - %s', $_getvar('isDemo') ? '*.*.*.*' : $useInfo['who'], date('Y-m-d H:i', $useInfo['time'])); ?>
+                                </span>
+                                        </li>
+                                    <?php endforeach; ?>
+                                </ul>
+                            </div>
+                        </td>
+                    </tr>
+                <?php endif; ?>
+            <?php endif; ?>
+            </tbody>
+        </table>
+
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+
+    <?php if (!$_getvar('isView')): ?>
+        <div class="action-in-box">
+            <button form="frmPublickLink"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </div>
+    <?php endif; ?>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/results.inc b/app/modules/web/themes/material-dark/views/itemshow/results.inc
new file mode 100644
index 000000000..8120d5c6e
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/results.inc
@@ -0,0 +1,27 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+    <table class="popup-data">
+        <tbody>
+        <tr id="ldap-results">
+            <td class="valField">
+                <div class="lowres-title"><?php echo $_getvar('header'); ?></div>
+                <div class="list-wrap"></div>
+            </td>
+        </tr>
+        </tbody>
+    </table>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/tag.inc b/app/modules/web/themes/material-dark/views/itemshow/tag.inc
new file mode 100644
index 000000000..36da664ec
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/tag.inc
@@ -0,0 +1,53 @@
+<?php
+/**
+ * @var TagData    $tag
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\TagData;
+use SP\Mvc\View\Template;
+
+$tag = $_getvar('tag');
+?>
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="frmTags" id="frmTags" class="form-action"
+          data-onsubmit="appMgmt/save"
+          data-action-route="<?php echo $_getvar('route', ''); ?>"
+          data-hash="">
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="name" name="name" type="text" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50"
+                               value="<?php echo $tag->getName(); ?>">
+                        <label class="mdl-textfield__label"
+                               for="name"><?php echo __('Tag name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            </tbody>
+        </table>
+
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+    <div class="action-in-box">
+        <button
+                class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                form="frmTags"
+                title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+            <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+        </button>
+    </div>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/user.inc b/app/modules/web/themes/material-dark/views/itemshow/user.inc
new file mode 100644
index 000000000..3ce26a59b
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/user.inc
@@ -0,0 +1,371 @@
+<?php
+/**
+ * @var UserData   $user
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\UserData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+$user = $_getvar('user');
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
+        <div class="mdl-tabs__tab-bar">
+            <a href="#user-panel"
+               class="mdl-tabs__tab is-active"><?php echo __('User'); ?></a>
+            <a href="#options-panel"
+               class="mdl-tabs__tab"><?php echo __('Options'); ?></a>
+
+            <?php if ($_getvar('isView')): ?>
+                <a href="#details-panel"
+                   class="mdl-tabs__tab"><?php echo __('Details'); ?></a>
+            <?php endif; ?>
+        </div>
+
+        <form method="post" name="frmUsers" id="frmUsers" class="form-action"
+              data-onsubmit="appMgmt/save"
+              data-action-route="<?php echo $_getvar('route', ''); ?>"
+              data-hash="">
+
+            <div class="mdl-tabs__panel is-active" id="user-panel">
+                <table class="popup-data">
+                    <tbody>
+                    <tr>
+                        <td class="descField"><?php echo __('Name') ?></td>
+                        <td class="valField">
+
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="name" name="name" type="text"
+                                       required
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       value="<?php echo $user->getName(); ?>"
+                                       maxlength="80" <?php echo $_getvar('readonly'); ?>>
+                                <label class="mdl-textfield__label"
+                                       for="name"><?php echo __('Full username'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Login'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="login" name="login" type="text"
+                                       required
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       value="<?php echo $user->getLogin(); ?>"
+                                       maxlength="80" <?php echo $user->isLdap() ? 'readonly' : $_getvar('readonly'); ?>>
+                                <label class="mdl-textfield__label"
+                                       for="login"><?php echo __('Session login'); ?></label>
+                            </div>
+                            <?php if ($user->isLdap()): ?>
+                                <i class="material-icons <?php echo $icons->getIconLdapUser()->getClass(); ?>"
+                                   title="<?php echo $icons->getIconLdapUser()->getTitle(); ?>"><?php echo $icons->getIconLdapUser()->getIcon(); ?></i>
+                            <?php endif; ?>
+                        </td>
+                    </tr>
+
+                    <?php if ($_getvar('isUseSSO')): ?>
+                        <tr>
+                            <td class="descField"><?php echo __('SSO Login '); ?></td>
+                            <td class="valField">
+                                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                    <input id="login_sso" name="login_sso"
+                                           type="text"
+                                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                                           value="<?php echo $user->getSsoLogin(); ?>"
+                                           maxlength="100" <?php echo $_getvar('readonly'); ?>>
+                                    <label class="mdl-textfield__label"
+                                           for="login_sso"><?php echo __('Session login with SSO'); ?></label>
+                                </div>
+                            </td>
+                        </tr>
+                    <?php endif; ?>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Email'); ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                <input id="email" name="email" type="email"
+                                       required
+                                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                                       value="<?php echo $user->getEmail(); ?>"
+                                       maxlength="50" <?php echo $_getvar('readonly'); ?>>
+                                <label class="mdl-textfield__label"
+                                       for="email"><?php echo __('Email address'); ?></label>
+                            </div
+                        </td>
+
+                    </tr>
+
+                    <?php if ($_getvar('createAction')): ?>
+                        <tr>
+                            <td class="descField"><?php echo __('Password'); ?></td>
+                            <td class="valField">
+                                <div class="form-control">
+                                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                        <input id="password" name="password"
+                                               type="password" required
+                                               class="mdl-textfield__input passwordfield__input mdl-color-text--indigo-400"
+                                               maxlength="50">
+                                        <label class="mdl-textfield__label"
+                                               for="password"><?php echo __('Password'); ?></label>
+                                    </div>
+                                </div>
+                            </td>
+                        </tr>
+
+                        <tr>
+                            <td class="descField"><?php echo __('Password (repeat)'); ?></td>
+                            <td class="valField">
+                                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                                    <input id="password_repeat"
+                                           name="password_repeat"
+                                           type="password" required
+                                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                                           maxlength="50">
+                                    <label class="mdl-textfield__label"
+                                           for="password_repeat"><?php echo __('Password (repeat)'); ?></label>
+                                </div>
+                            </td>
+                        </tr>
+                    <?php endif; ?>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Profile'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Profile'); ?></div>
+
+                            <select id="userprofile_id" name="userprofile_id"
+                                    class="select-box"
+                                    required <?php echo $_getvar('disabled'); ?>>
+                                <option value=""><?php echo __('Select Profile'); ?></option>
+                                <?php /** @var SelectItem $profile */
+                                foreach ($_getvar('profiles') as $profile): ?>
+                                    <option
+                                            value="<?php echo $profile->getId(); ?>" <?php echo ($profile->getId() === $user->getUserProfileId()) ? 'selected' : ''; ?>><?php echo $profile->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Group'); ?></td>
+                        <td class="valField">
+                            <div class="lowres-title"><?php echo __('Group'); ?></div>
+
+                            <select id="usergroup_id" name="usergroup_id"
+                                    class="select-box"
+                                    required <?php echo $_getvar('disabled'); ?>>
+                                <option value=""><?php echo __('Select Group'); ?></option>
+                                <?php /** @var SelectItem $group */
+                                foreach ($_getvar('groups') as $group): ?>
+                                    <option
+                                            value="<?php echo $group->getId(); ?>" <?php echo ($group->getId() === $user->getUserGroupId()) ? 'selected' : ''; ?>><?php echo $group->getName(); ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <td class="descField"><?php echo __('Notes') ?></td>
+                        <td class="valField">
+                            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <textarea class="mdl-textfield__input" rows="3"
+                                  id="notes" name="notes"
+                                  maxlength="1000" <?php echo $_getvar('readonly'); ?>><?php echo htmlspecialchars($user->getNotes(), ENT_QUOTES); ?></textarea>
+                                <label class="mdl-textfield__label"
+                                       for="notes"><?php echo __('Notes'); ?></label>
+                            </div>
+                        </td>
+                    </tr>
+
+                    <?php if ($_getvar('customFields')): ?>
+                        <?php include $this->includeTemplate('aux-customfields', 'common'); ?>
+                    <?php endif; ?>
+
+                    </tbody>
+                </table>
+            </div>
+
+            <div class="mdl-tabs__panel" id="options-panel">
+                <table class="popup-data">
+                    <tbody>
+                    <tr>
+                        <td>
+                            <ul class="user-list-action mdl-list">
+                                <?php if ($_getvar('ctx_userIsAdminApp') || $_getvar('isDemo')): ?>
+                                    <li class="mdl-list__item mdl-list__item--two-line">
+                                        <div class="mdl-switch__box">
+                                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                                   for="adminapp_enabled">
+                                                <input type="checkbox"
+                                                       id="adminapp_enabled"
+                                                       class="mdl-switch__input"
+                                                       name="adminapp_enabled" <?php echo $user->isAdminApp() ? 'checked' : ' '; ?> <?php echo $_getvar('disabled'); ?>/>
+                                            </label>
+                                        </div>
+
+                                        <span class="mdl-list__item-primary-content">
+                                            <span><?php echo __('Application Admin'); ?></span>
+                                            <span class="mdl-list__item-sub-title">
+                                                <?php echo __('Application administrator'); ?>
+                                            </span>
+                                        </span>
+                                    </li>
+
+                                    <li class="mdl-list__item mdl-list__item--two-line">
+                                        <div class="mdl-switch__box">
+                                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                                   for="adminacc_enabled">
+                                                <input type="checkbox"
+                                                       id="adminacc_enabled"
+                                                       class="mdl-switch__input"
+                                                       name="adminacc_enabled" <?php echo $user->isAdminAcc() ? 'checked' : ' '; ?> <?php echo $_getvar('disabled'); ?>/>
+                                            </label>
+                                        </div>
+
+                                        <span class="mdl-list__item-primary-content">
+                                            <span><?php echo __('Accounts Admin'); ?></span>
+                                            <span class="mdl-list__item-sub-title">
+                                                <?php echo __('Accounts administrator'); ?>
+                                            </span>
+                                        </span>
+                                    </li>
+                                <?php endif; ?>
+
+                                <?php if ($_getvar('mailEnabled')): ?>
+                                    <li class="mdl-list__item mdl-list__item--two-line">
+                                        <div class="mdl-switch__box">
+                                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                                   for="changepass_enabled">
+                                                <input type="checkbox"
+                                                       id="changepass_enabled"
+                                                       class="mdl-switch__input"
+                                                       name="changepass_enabled" <?php echo $user->isChangePass() ? 'checked' : ' '; ?> <?php echo $_getvar('disabled'); ?>/>
+                                            </label>
+                                        </div>
+
+                                        <span class="mdl-list__item-primary-content">
+                                            <span><?php echo __('Password Change'); ?></span>
+                                            <span class="mdl-list__item-sub-title">
+                                                <?php echo __('Force password change'); ?>
+                                            </span>
+                                        </span>
+                                    </li>
+                                <?php endif; ?>
+
+                                <li class="mdl-list__item mdl-list__item--two-line">
+                                    <div class="mdl-switch__box">
+                                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                               for="disabled">
+                                            <input type="checkbox" id="disabled"
+                                                   class="mdl-switch__input"
+                                                   name="disabled" <?php echo $user->isDisabled() ? 'checked' : ' '; ?> <?php echo $_getvar('disabled'); ?>/>
+                                        </label>
+                                    </div>
+
+                                    <span class="mdl-list__item-primary-content">
+                                        <span><?php echo __('Disabled'); ?></span>
+                                        <span class="mdl-list__item-sub-title"></span>
+                                    </span>
+                                </li>
+                            </ul>
+                        </td>
+                    </tr>
+                    </tbody>
+                </table>
+            </div>
+
+            <?php if ($_getvar('isView')): ?>
+                <div class="mdl-tabs__panel" id="details-panel">
+                    <table class="popup-data">
+                        <tbody>
+                        <tr>
+                            <td class="descField"><?php echo __('Entries'); ?></td>
+                            <td class="valField">
+                                <div class="lowres-title"><?php echo __('Entries'); ?></div>
+
+                                <?php echo $user->getLoginCount(); ?>
+                            </td>
+                        </tr>
+
+                        <tr>
+                            <td class="descField"><?php echo __('Last Access'); ?></td>
+                            <td class="valField">
+                                <div class="lowres-title"><?php echo __('Last Access'); ?></div>
+
+                                <?php echo $user->getLastLogin(); ?>
+                            </td>
+                        </tr>
+
+                        <tr>
+                            <td class="descField"><?php echo __('Last Modification'); ?></td>
+                            <td class="valField">
+                                <div class="lowres-title"><?php echo __('Last Modification'); ?></div>
+
+                                <?php echo $user->getLastUpdate(); ?>
+                            </td>
+                        </tr>
+
+                        <tr>
+                            <td class="descField"><?php echo __('Master Password Date'); ?></td>
+                            <td class="valField">
+                                <div class="lowres-title"><?php echo __('Master Password Date'); ?></div>
+
+                                <?php echo gmdate('Y-m-d H:i:s', $user->getLastUpdateMPass()); ?>
+                            </td>
+                        </tr>
+
+                        <tr>
+                            <td class="descField"><?php echo __('Used in'); ?></td>
+                            <td class="valField">
+                                <div class="lowres-title"><?php echo __('Used in'); ?></div>
+                                <div class="list-wrap">
+                                    <ul class="mdl-list">
+                                        <?php foreach ($_getvar('usage') as $item): ?>
+                                            <li class="mdl-list__item mdl-list__item"
+                                                title="<?php echo $item->ref; ?>">
+                                                <span class="mdl-list__item-primary-content">
+                                                <i class="material-icons mdl-list__item-icon"><?php echo $item->icon; ?></i>
+                                                    <?php printf('%s: %s', $item->ref, $item->name ?: $item->id); ?>
+                                                </span>
+                                            </li>
+                                        <?php endforeach; ?>
+                                    </ul>
+                                </div>
+                            </td>
+                        </tr>
+
+                        </tbody>
+                    </table>
+                </div>
+            <?php endif; ?>
+
+            <input type="hidden" name="isLdap"
+                   value="<?php echo $user->isLdap(); ?>"/>
+            <input type="hidden" name="isAjax" value="1">
+        </form>
+    </div>
+
+    <?php if (!$_getvar('isView')): ?>
+        <div class="action-in-box">
+            <button form="frmUsers"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </div>
+    <?php endif; ?>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/user_group.inc b/app/modules/web/themes/material-dark/views/itemshow/user_group.inc
new file mode 100644
index 000000000..427bc44b4
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/user_group.inc
@@ -0,0 +1,139 @@
+<?php
+/**
+ * @var UserToUserGroupData $groupUsers
+ * @var UserGroupData       $group
+ * @var ThemeIcons          $icons
+ * @var ConfigData          $configData
+ * @var callable            $_getvar
+ * @var Template            $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\UserGroupData;
+use SP\DataModel\UserToUserGroupData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+$group = $_getvar('group');
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="frmGroups" id="frmGroups" class="form-action"
+          data-onsubmit="appMgmt/save"
+          data-action-route="<?php echo $_getvar('route', ''); ?>"
+          data-hash="">
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="name" name="name" type="text" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50"
+                               value="<?php echo $group->getName(); ?>">
+                        <label class="mdl-textfield__label"
+                               for="name"><?php echo __('Group name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+
+            <tr>
+                <td class="descField"><?php echo __('Description'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="description" name="description" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50"
+                               value="<?php echo $group->getDescription(); ?>">
+                        <label class="mdl-textfield__label"
+                               for="description"><?php echo __('Group description'); ?></label>
+                    </div>
+                </td>
+            </tr>
+
+            <tr>
+                <td class="descField"><?php echo __('Users'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Users'); ?></div>
+
+                    <?php if (!$_getvar('isView')): ?>
+                        <select id="selUsers" name="users[]" multiple="multiple"
+                                class="select-box"
+                                title="<?php echo __('Users'); ?>" <?php echo $_getvar('disabled'); ?>>
+                            <option value=""><?php echo __('Select Users'); ?></option>
+                            <?php /** @var SelectItem $user */
+                            foreach ($_getvar('users') as $user): ?>
+                                <option
+                                        value="<?php echo $user->getId(); ?>" <?php echo $user->isSelected() ? 'selected' : ''; ?>><?php echo $user->getName(); ?></option>
+                            <?php endforeach; ?>
+                        </select>
+                    <?php else: ?>
+                        <div class="tag-list-box">
+                            <div class="tag-list-body">
+                                <div class="tags-list-items">
+                                    <?php /** @var SelectItem $user */
+                                    foreach ($_getvar('users') as $user): ?>
+                                        <?php if ($user->isSelected()): ?>
+                                            <span class="tag"><?php echo $user->getName(); ?></span>
+                                        <?php endif; ?>
+                                    <?php endforeach; ?>
+                                </div>
+                            </div>
+                        </div>
+                    <?php endif; ?>
+                </td>
+            </tr>
+
+            <?php if ($_getvar('customFields')): ?>
+                <?php include $this->includeTemplate('aux-customfields', 'common'); ?>
+            <?php endif; ?>
+
+            <?php if ($_getvar('usedBy')): ?>
+                <tr>
+                    <td class="descField"><?php echo __('Used by'); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('Used by'); ?></div>
+                        <div class="list-wrap">
+                            <ul class="mdl-list">
+                                <?php /** @var stdClass $user */
+                                foreach ($_getvar('usedBy') as $user): ?>
+                                    <li class="mdl-list__item mdl-list__item">
+                                        <span class="mdl-list__item-primary-content">
+                                            <i class="material-icons mdl-list__item-icon"
+                                               title="<?php echo __('User'); ?>">person</i>
+                                            <?php if ($user->ref === 'UserGroup'): ?>
+                                                <?php printf('%s (%s)*', $user->name, $user->login); ?>
+                                            <?php else: ?>
+                                                <?php printf('%s (%s)', $user->name, $user->login); ?>
+                                            <?php endif; ?>
+                                        </span>
+                                    </li>
+                                <?php endforeach; ?>
+                            </ul>
+                        </div>
+                        <div><?php echo __('(*) Listed in group'); ?></div>
+                    </td>
+                </tr>
+            <?php endif; ?>
+
+            </tbody>
+        </table>
+
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+    <?php if (!$_getvar('isView')): ?>
+        <div class="action-in-box">
+            <button
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    form="frmGroups"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </div>
+    <?php endif; ?>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/itemshow/user_pass.inc b/app/modules/web/themes/material-dark/views/itemshow/user_pass.inc
new file mode 100644
index 000000000..4650104a5
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/user_pass.inc
@@ -0,0 +1,90 @@
+<?php
+/**
+ * @var UserData   $user
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\UserData;
+use SP\Mvc\View\Template;
+
+$user = $_getvar('user');
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="updUsrPass" id="frmUpdUsrPass" class="form-action"
+          data-onsubmit="user/savePassword"
+          data-action-route="<?php echo $_getvar('route', ''); ?>"
+          data-hash="">
+        <table class="popup-data">
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield">
+                        <input id="name" name="name" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $user->getName(); ?>" readonly
+                               disabled/>
+                    </div>
+                </td>
+            </tr>
+
+            <tr>
+                <td class="descField"><?php echo __('Login'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield">
+                        <input id="login" name="login" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $user->getLogin(); ?>"
+                               readonly disabled/>
+                    </div>
+                </td>
+            </tr>
+
+            <tr>
+                <td class="descField"><?php echo __('Password'); ?></td>
+                <td class="valField">
+                    <div class="form-control">
+                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                            <input id="password" name="password" type="password"
+                                   required
+                                   class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input"
+                                   maxlength="50">
+                            <label class="mdl-textfield__label"
+                                   for="password"><?php echo __('Password'); ?></label>
+                        </div>
+                    </div>
+                </td>
+            </tr>
+
+            <tr>
+                <td class="descField"><?php echo __('Password (repeat)'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="password_repeat" name="password_repeat"
+                               type="password" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="50">
+                        <label class="mdl-textfield__label"
+                               for="password_repeat"><?php echo __('Password (repeat)'); ?></label>
+                    </div>
+                </td>
+            </tr>
+        </table>
+    </form>
+
+    <div class="action-in-box">
+        <button form="frmUpdUsrPass"
+                class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+            <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+        </button>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/itemshow/user_profile.inc b/app/modules/web/themes/material-dark/views/itemshow/user_profile.inc
new file mode 100644
index 000000000..aee7f2f9b
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/itemshow/user_profile.inc
@@ -0,0 +1,627 @@
+<?php
+/**
+ * @var ProfileData     $profileData
+ * @var UserProfileData $profile
+ * @var ThemeIcons      $icons
+ * @var ConfigData      $configData
+ * @var callable        $_getvar
+ * @var Template        $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\ProfileData;
+use SP\DataModel\UserProfileData;
+use SP\Mvc\View\Template;
+
+$profile = $_getvar('profile');
+$profileData = $_getvar('profileData');
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="frmProfile" id="frmProfile" class="form-action"
+          data-onsubmit="appMgmt/save"
+          data-action-route="<?php echo $_getvar('route', ''); ?>"
+          data-hash="">
+
+        <div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
+            <div class="mdl-tabs__tab-bar">
+                <a href="#account-panel"
+                   class="mdl-tabs__tab is-active"><?php echo __('Accounts'); ?></a>
+                <a href="#management-panel"
+                   class="mdl-tabs__tab"><?php echo __('Management'); ?></a>
+                <a href="#config-panel"
+                   class="mdl-tabs__tab"><?php echo __('Configuration'); ?></a>
+                <a href="#other-panel"
+                   class="mdl-tabs__tab"><?php echo __('Others'); ?></a>
+            </div>
+
+            <div class="mdl-tabs__panel is-active" id="account-panel">
+                <ul class="profile-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Add'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Create new account'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accadd">
+                                <input type="checkbox" id="profile_accadd"
+                                       class="mdl-switch__input"
+                                       name="profile_accadd" <?php echo $profileData->isAccAdd() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('View'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('View account details'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accview">
+                                <input type="checkbox" id="profile_accview"
+                                       class="mdl-switch__input"
+                                       name="profile_accview" <?php echo $profileData->isAccView() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('View password'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('View account password'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accviewpass">
+                            <input type="checkbox" id="profile_accviewpass"
+                                   class="mdl-switch__input"
+                                   name="profile_accviewpass" <?php echo $profileData->isAccViewPass() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('View History'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('View account history'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accviewhistory">
+                                <input type="checkbox"
+                                       id="profile_accviewhistory"
+                                       class="mdl-switch__input"
+                                       name="profile_accviewhistory" <?php echo $profileData->isAccViewHistory() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Edit'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Edit account'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accedit">
+                                <input type="checkbox" id="profile_accedit"
+                                       class="mdl-switch__input"
+                                       name="profile_accedit" <?php echo $profileData->isAccEdit() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Edit Password'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Edit account password'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_acceditpass">
+                                <input type="checkbox" id="profile_acceditpass"
+                                       class="mdl-switch__input"
+                                       name="profile_acceditpass" <?php echo $profileData->isAccEditPass() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Delete'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Remove account'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accdel">
+                                <input type="checkbox" id="profile_accdel"
+                                       class="mdl-switch__input"
+                                       name="profile_accdel" <?php echo $profileData->isAccDelete() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Files'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('View account files'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accfiles">
+                                <input type="checkbox" id="profile_accfiles"
+                                       class="mdl-switch__input"
+                                       name="profile_accfiles" <?php echo $profileData->isAccFiles() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Share Link'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Share link to account'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accpublinks">
+                                <input type="checkbox" id="profile_accpublinks"
+                                       class="mdl-switch__input"
+                                       name="profile_accpublinks" <?php echo $profileData->isAccPublicLinks() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Private'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Create private account'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accprivate">
+                                <input type="checkbox" id="profile_accprivate"
+                                       class="mdl-switch__input"
+                                       name="profile_accprivate" <?php echo $profileData->isAccPrivate() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Private for Group'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Create private account for group'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accprivategroup">
+                                <input type="checkbox"
+                                       id="profile_accprivategroup"
+                                       class="mdl-switch__input"
+                                       name="profile_accprivategroup" <?php echo $profileData->isAccPrivateGroup() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Permissions'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Assign permissions'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accpermissions">
+                                <input type="checkbox"
+                                       id="profile_accpermissions"
+                                       class="mdl-switch__input"
+                                       name="profile_accpermissions" <?php echo $profileData->isAccPermission() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Global search'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Global search'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accglobalsearch">
+                                <input type="checkbox"
+                                       id="profile_accglobalsearch"
+                                       class="mdl-switch__input"
+                                       name="profile_accglobalsearch" <?php echo $profileData->isAccGlobalSearch() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+                </ul>
+            </div>
+
+            <div class="mdl-tabs__panel" id="management-panel">
+                <ul class="profile-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Users'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Users management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_users">
+                                <input type="checkbox" id="profile_users"
+                                       class="mdl-switch__input"
+                                       name="profile_users" <?php echo $profileData->isMgmUsers() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Groups'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Groups management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_groups">
+                                <input type="checkbox" id="profile_groups"
+                                       class="mdl-switch__input"
+                                       name="profile_groups" <?php echo $profileData->isMgmGroups() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Profiles'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Profiles management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_profiles">
+                                <input type="checkbox" id="profile_profiles"
+                                       class="mdl-switch__input"
+                                       name="profile_profiles" <?php echo $profileData->isMgmProfiles() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Categories'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Categories management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_categories">
+                                <input type="checkbox" id="profile_categories"
+                                       class="mdl-switch__input"
+                                       name="profile_categories" <?php echo $profileData->isMgmCategories() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Tags'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Tags management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_tags">
+                                <input type="checkbox" id="profile_tags"
+                                       class="mdl-switch__input"
+                                       name="profile_tags" <?php echo $profileData->isMgmTags() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Clients'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Customers management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_customers">
+                                <input type="checkbox" id="profile_customers"
+                                       class="mdl-switch__input"
+                                       name="profile_customers" <?php echo $profileData->isMgmCustomers() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Custom Fields'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Custom fields management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_customfields">
+                                <input type="checkbox" id="profile_customfields"
+                                       class="mdl-switch__input"
+                                       name="profile_customfields" <?php echo $profileData->isMgmCustomFields() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('API Authorizations'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('API authorizations management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_apitokens">
+                                <input type="checkbox" id="profile_apitokens"
+                                       class="mdl-switch__input"
+                                       name="profile_apitokens" <?php echo $profileData->isMgmApiTokens() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Public Links'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Links management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_publinks">
+                                <input type="checkbox" id="profile_publinks"
+                                       class="mdl-switch__input"
+                                       name="profile_publinks" <?php echo $profileData->isMgmPublicLinks() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Accounts'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Accounts management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_accounts">
+                                <input type="checkbox" id="profile_accounts"
+                                       class="mdl-switch__input"
+                                       name="profile_accounts" <?php echo $profileData->isMgmAccounts() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Files'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Files management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_files">
+                                <input type="checkbox" id="profile_files"
+                                       class="mdl-switch__input"
+                                       name="profile_files" <?php echo $profileData->isMgmFiles() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Default Values'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Default Values Management'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_items_preset">
+                                <input type="checkbox" id="profile_items_preset"
+                                       class="mdl-switch__input"
+                                       name="profile_items_preset" <?php echo $profileData->isMgmItemsPreset() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+                </ul>
+            </div>
+
+            <div class="mdl-tabs__panel" id="config-panel">
+                <ul class="profile-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('General'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('General Configuration'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_config">
+                                <input type="checkbox" id="profile_config"
+                                       class="mdl-switch__input"
+                                       name="profile_config" <?php echo $profileData->isConfigGeneral() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Encryption'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Encryption options'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_configmpw">
+                                <input type="checkbox" id="profile_configmpw"
+                                       class="mdl-switch__input"
+                                       name="profile_configmpw" <?php echo $profileData->isConfigEncryption() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Backup'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Make a backup and export'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_configback">
+                                <input type="checkbox" id="profile_configback"
+                                       class="mdl-switch__input"
+                                       name="profile_configback" <?php echo $profileData->isConfigBackup() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Import'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('Make accounts import'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_configimport">
+                                <input type="checkbox" id="profile_configimport"
+                                       class="mdl-switch__input"
+                                       name="profile_configimport" <?php echo $profileData->isConfigImport() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+                </ul>
+            </div>
+
+            <div class="mdl-tabs__panel" id="other-panel">
+                <ul class="profile-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                            <i class="material-icons  mdl-list__item-icon">vpn_key</i>
+                            <span><?php echo __('Event Log'); ?></span>
+                            <span class="mdl-list__item-sub-title"><?php echo __('View event log'); ?></span>
+                        </span>
+
+                        <span class="mdl-list__item-secondary-action">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="profile_eventlog">
+                                <input type="checkbox" id="profile_eventlog"
+                                       class="mdl-switch__input"
+                                       name="profile_eventlog" <?php echo $profileData->isEvl() ? 'CHECKED' : ''; ?> <?php echo $_getvar('disabled'); ?>/>
+                            </label>
+                        </span>
+                    </li>
+                </ul>
+            </div>
+        </div>
+
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="profile_name" name="profile_name" type="text"
+                               required
+                               class="mdl-textfield__input"
+                               value="<?php echo $profile->getName(); ?>"
+                               maxlength="50" <?php echo $_getvar('readonly'); ?>>
+                        <label class="mdl-textfield__label"
+                               for="profile_name"><?php echo __('Profile name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+
+            <?php if ($_getvar('isView')): ?>
+                <tr>
+                    <td class="descField"><?php echo __('Used by'); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('Used by'); ?></div>
+                        <div class="list-wrap">
+                            <ul class="mdl-list">
+                                <?php foreach ($_getvar('usedBy') as $user): ?>
+                                    <li class="mdl-list__item mdl-list__item">
+                                        <span class="mdl-list__item-primary-content">
+                                        <i class="material-icons mdl-list__item-icon">person</i>
+                                            <?php echo $user->login; ?>
+                                        </span>
+                                    </li>
+                                <?php endforeach; ?>
+                            </ul>
+                        </div>
+                    </td>
+                </tr>
+
+            <?php endif; ?>
+
+            </tbody>
+        </table>
+
+        <input type="hidden" name="isAjax" value="1">
+    </form>
+
+    <?php if (!$_getvar('isView')): ?>
+        <div class="action-in-box">
+            <button form="frmProfile"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </div>
+    <?php endif; ?>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/login/index.inc b/app/modules/web/themes/material-dark/views/login/index.inc
new file mode 100644
index 000000000..545710668
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/login/index.inc
@@ -0,0 +1,117 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+
+<div id="box-pub-noheader">
+    <div class="box-spacer"></div>
+    <div id="box-login" class="box-form round">
+        <form method="post" name="frmLogin" id="frmLogin" class="form-action"
+              data-onsubmit="main/login"
+              data-route="login/login">
+            <fieldset id="box-data">
+                <div class="form-control">
+                    <i class="material-icons">perm_identity</i>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="user" name="user" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="80" autocomplete="off" autofocus>
+                        <label class="mdl-textfield__label"
+                               for="user"><?php echo __('User'); ?></label>
+                    </div>
+                </div>
+
+                <div class="form-control">
+                    <i class="material-icons">vpn_key</i>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="pass" name="pass" type="password"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="255" autocomplete="off">
+                        <label class="mdl-textfield__label"
+                               for="pass"><?php echo __('Password'); ?></label>
+                    </div>
+                </div>
+
+                <div id="soldpass" class="extra-hidden form-control">
+                    <i class="material-icons">vpn_key</i>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="oldpass" name="oldpass" type="password"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="255" autocomplete="off">
+                        <label class="mdl-textfield__label"
+                               for="oldpass"><?php echo __('Previous Password'); ?></label>
+                    </div>
+                </div>
+
+                <div id="smpass" class="extra-hidden form-control">
+                    <i class="material-icons">vpn_key</i>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="mpass" name="mpass" type="password"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               maxlength="255" autocomplete="off">
+                        <label class="mdl-textfield__label"
+                               for="mpass"><?php echo __('Master Password'); ?></label>
+                    </div>
+                </div>
+
+                <?php if ($_getvar('from') && $_getvar('from_hash')): ?>
+                    <input type="hidden" name="from"
+                           value="<?php echo $_getvar('from'); ?>"/>
+                    <input type="hidden" name="h"
+                           value="<?php echo $_getvar('from_hash'); ?>"/>
+                <?php endif; ?>
+
+                <input type="hidden" name="login" value="1"/>
+                <input type="hidden" name="isAjax" value="1"/>
+                <input type="hidden" name="sk" value="<?php echo $sk; ?>">
+            </fieldset>
+            <div id="box-buttons">
+                <button id="btnLogin" type="submit" form="frmLogin"
+                        class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--colored mdl-color--indigo-400"
+                        title="<?php echo __('Sign in'); ?>">
+                    <i class="material-icons">play_arrow</i>
+                </button>
+            </div>
+        </form>
+
+        <!-- Close boxData -->
+        <?php if ($_getvar('mailEnabled')): ?>
+            <div id="box-actions">
+                <a href="index.php?r=userPassReset"><?php echo __('Forgot password?'); ?></a>
+            </div>
+        <?php endif; ?>
+    </div><!-- Close boxLogin -->
+
+    <?php if ($_getvar('updated')): ?>
+        <div id="box-updated"
+             class="round5"><?php echo __('Application successfully updated'); ?></div>
+    <?php endif; ?>
+
+    <?php if ($_getvar('isDemo')): ?>
+        <div id="demo-info">
+            <ul>
+                <li title="<?php echo __('User'); ?>">
+                    <i class="material-icons">perm_identity</i>
+                    <span>demo</span>
+                </li>
+                <li title="<?php echo __('Password'); ?>">
+                    <i class="material-icons">vpn_key</i>
+                    <span>syspass</span>
+                </li>
+                <li title="<?php echo __('Master Password'); ?>">
+                    <i class="material-icons">vpn_key</i>
+                    <span>12345678900</span>
+                </li>
+            </ul>
+        </div>
+    <?php endif; ?>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/login/logout.inc b/app/modules/web/themes/material-dark/views/login/logout.inc
new file mode 100644
index 000000000..398b0f253
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/login/logout.inc
@@ -0,0 +1,2 @@
+<div id="box-pub-noheader">
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/main/update.inc b/app/modules/web/themes/material-dark/views/main/update.inc
new file mode 100644
index 000000000..489a764ed
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/main/update.inc
@@ -0,0 +1,50 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+
+<?php if ($_getvar('numNotices', 0) > 0): ?>
+    <a href="https://github.com/nuxsmin/sysPass/labels/Notices" target="_blank">
+        <div id="notices-info"
+             class="material-icons mdl-badge mdl-badge--overlap mdl-color-text--amber-200"
+             data-badge="<?php echo $_getvar('numNotices'); ?>">feedback
+        </div>
+    </a>
+    <span for="notices-info"
+          class="mdl-tooltip mdl-tooltip--top"><?php echo $_getvar('noticesTitle'); ?></span>
+<?php endif; ?>
+
+<?php if ($_getvar('hasUpdates')): ?>
+    <a id="link-updates" href="<?php echo $_getvar('url'); ?>" target="_blank">
+        <?php echo $_getvar('title'); ?>
+        &nbsp;&nbsp;
+        <div id="help-hasupdates"
+             class="icon material-icons mdl-color-text--indigo-200">
+            cloud_download
+        </div>
+    </a>
+    <span for="link-updates"
+          class="mdl-tooltip mdl-tooltip--top"><?php echo $_getvar('description'); ?></span>
+<?php elseif ($_getvar('updateStatus') === true): ?>
+    <div id="updates-info" class="icon material-icons mdl-color-text--teal-200">
+        check_circle
+    </div>
+    <span for="updates-info"
+          class="mdl-tooltip mdl-tooltip--top"><?php echo __('Updated'); ?></span>
+<?php elseif ($_getvar('updateStatus') === false): ?>
+    <div id="updates-info"
+         class="icon material-icons mdl-color-text--amber-200">
+        warning
+    </div>
+    <span for="updates-info"
+          class="mdl-tooltip mdl-tooltip--top"><?php echo __('Error while checking for updates'); ?></span>
+<?php endif; ?>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/main/upgrade.inc b/app/modules/web/themes/material-dark/views/main/upgrade.inc
new file mode 100644
index 000000000..59ae0f9d7
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/main/upgrade.inc
@@ -0,0 +1,205 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+?>
+<main class="mdl-layout__content">
+    <div id="actions" class="upgrade">
+        <div id="page-title">
+            <h1><?php use SP\Config\ConfigData;
+                use SP\Core\UI\ThemeIcons;
+                use SP\Mvc\View\Template;
+                use SP\Util\VersionUtil;
+
+                printf(__('Update %s'), $_getvar('upgradeVersion')); ?></h1>
+        </div>
+
+        <form id="frmUpgrade" method="get" class="form-action"
+              data-onsubmit="main/upgrade">
+            <fieldset>
+                <?php if ($_getvar('type') === 'db'): ?>
+                    <legend><?php echo __('DB Update'); ?></legend>
+                <?php elseif ($_getvar('type') === 'app'): ?>
+                    <legend><?php echo __('Application Update'); ?></legend>
+                <?php endif; ?>
+
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="h" name="h" type="text" required
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           autocomplete="off" autofocus>
+                    <label class="mdl-textfield__label"
+                           for="h"><?php echo __('Security Code'); ?></label>
+                </div>
+
+                <div id="help-code"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>">
+                    <?php echo $icons->getIconHelp()->getIcon(); ?>
+                </div>
+                <div class="mdl-tooltip mdl-tooltip--large" for="help-code">
+                    <?php echo __('This code is set in sysPass config file within the tag name "upgradekey"'); ?>
+                </div>
+
+                <?php if (VersionUtil::checkVersion($_getvar('version'), '130.16011001')
+                    && count($_getvar('constraints')) > 0):
+                    ?>
+                    <div>
+                        <ul class="errors">
+                            <li class="msg-warning">
+                                <i class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></i>
+                                <?php echo __('Some orphaned items have been found. Please, modify those items or enter the default IDs for them.'); ?>
+                                <br>
+                                <?php echo __('If items IDs are not set, they will be created.'); ?>
+                            </li>
+                        </ul>
+                    </div>
+                    <div>
+                        <ul class="errors">
+                            <?php foreach ($_getvar('constraints') as $msg): ?>
+                                <li class="msg-warning"><?php echo $msg; ?></li>
+                            <?php endforeach; ?>
+                        </ul>
+                    </div>
+
+                    <?php
+                    $checkConstraints = $_getvar('checkConstraints');
+
+                    if ($checkConstraints->accounts_user > 0
+                        || $checkConstraints->accounts_useredit > 0
+                        || $checkConstraints->accountshistory_user > 0
+                        || $checkConstraints->accountshistory_useredit > 0
+                    ): ?>
+                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                            <input id="userid" name="userid" type="number"
+                                   class="mdl-textfield__input mdl-color-text--indigo-400"
+                                   autocomplete="off" min="0" max="1000"
+                                   value="0">
+                            <label class="mdl-textfield__label"
+                                   for="userid"><?php echo __('Enter a valid user ID for the accounts'); ?></label>
+                        </div>
+                    <?php endif; ?>
+
+                    <?php if ($checkConstraints->accounts_category > 0
+                    || $checkConstraints->accountshistory_category > 0): ?>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="categoryid" name="categoryid" type="number"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               autocomplete="off" min="0" max="1000" value="0">
+                        <label class="mdl-textfield__label"
+                               for="categoryid"><?php echo __('Enter a valid category ID for the accounts'); ?></label>
+                    </div>
+                <?php endif; ?>
+
+                    <?php if ($checkConstraints->accounts_customer > 0
+                    || $checkConstraints->accountshistory_customer > 0): ?>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="customerid" name="customerid" type="number"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               autocomplete="off" min="0" max="1000" value="0">
+                        <label class="mdl-textfield__label"
+                               for="customerid"><?php echo __('Enter a valid client ID for the accounts'); ?></label>
+                    </div>
+                <?php endif; ?>
+
+                    <?php if ($checkConstraints->users_group > 0
+                    || $checkConstraints->accounts_group > 0
+                    || $checkConstraints->accountshistory_group > 0): ?>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="groupid" name="groupid" type="number"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               autocomplete="off" min="0" max="1000" value="0">
+                        <label class="mdl-textfield__label"
+                               for="groupid"><?php echo __('Enter a valid group ID for the users'); ?></label>
+                    </div>
+                <?php endif; ?>
+
+                    <?php if ($checkConstraints->users_profile > 0): ?>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="profileid" name="profileid" type="number"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               autocomplete="off" min="0" max="1000" value="0">
+                        <label class="mdl-textfield__label"
+                               for="profileid"><?php echo __('Enter a valid profile ID for the users'); ?></label>
+                    </div>
+                <?php endif; ?>
+                <?php endif; ?>
+
+                <?php if (VersionUtil::checkVersion($_getvar('version'), '210.17022601')): ?>
+                    <div>
+                        <ul class="errors">
+                            <li class="msg-warning">
+                                <i class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></i>
+                                <?php echo __('This update uses a new encryption schema, so it will be needed to reencrypt the whole encrypted data.'); ?>
+                                <br>
+                                <strong><?php printf(__('It will be updated %s accounts. This process could take some time long.'), $_getvar('numAccounts')); ?></strong>
+                                <br>
+                                <?php printf(__('You could get more info on: %s'), '<a target="_blank" href="https://doc.syspass.org">https://doc.syspass.org</a>'); ?>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="masterkey" name="masterkey" type="password"
+                               class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input-show"
+                               maxlength="255" required/>
+                        <label class="mdl-textfield__label"
+                               for="masterkey"><?php echo __('Current Master Password'); ?></label>
+                    </div>
+
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="userlogin" name="userlogin" type="text"
+                               required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               autocomplete="off">
+                        <label class="mdl-textfield__label"
+                               for="userlogin"><?php echo __('Enter a valid user login'); ?></label>
+                    </div>
+
+                    <?php if ($_getvar('numAccounts') >= 500): ?>
+                        <input type="hidden" name="useTask" value="1">
+                        <input type="hidden" name="taskId"
+                               value="<?php echo $_getvar('taskId'); ?>">
+                        <input type="hidden" name="lock" value="upgrade">
+                    <?php endif; ?>
+                <?php endif; ?>
+
+                <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"
+                       for="chkConfirm">
+                    <input type="checkbox" id="chkConfirm"
+                           class="mdl-checkbox__input" name="chkConfirm">
+                    <span class="mdl-checkbox__label"><?php echo __('I\'ve done a full sysPass backup'); ?></span>
+                </label>
+
+                <input type="hidden" name="a"
+                       value="<?php echo $_getvar('action'); ?>">
+                <input type="hidden" name="type"
+                       value="<?php echo $_getvar('type'); ?>">
+                <input type="hidden" name="version"
+                       value="<?php echo $_getvar('version'); ?>">
+                <input type="hidden" name="upgrade" value="1">
+                <input type="hidden" name="isAjax" value="1">
+            </fieldset>
+
+            <div>
+                <ul class="errors">
+                    <li class="msg-warning">
+                        <i class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></i>
+                        <?php echo __('Please, wait while the process is running'); ?>
+                    </li>
+                </ul>
+            </div>
+
+            <div class="buttons">
+                <button id="btnChange"
+                        class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent"
+                        type="submit">
+                    <?php echo __('Update'); ?>
+                    <i class="material-icons"
+                       title="<?php echo __('Start Update'); ?>"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+                </button>
+            </div>
+        </form>
+    </div>
+</main>
diff --git a/app/modules/web/themes/material-dark/views/notification/index.inc b/app/modules/web/themes/material-dark/views/notification/index.inc
new file mode 100644
index 000000000..b188e3e8e
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/notification/index.inc
@@ -0,0 +1,6 @@
+<h5 class="datagrid-header-title"><?php use SP\Mvc\View\Template;
+
+    echo __('Notifications'); ?></h5>
+<?php
+/** @var Template $this */
+include $this->includeTemplate('datagrid-grid', 'grid');
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/notification/notification.inc b/app/modules/web/themes/material-dark/views/notification/notification.inc
new file mode 100644
index 000000000..78552b330
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/notification/notification.inc
@@ -0,0 +1,156 @@
+<?php
+/**
+ * @var  NotificationData $notification
+ * @var ThemeIcons        $icons
+ * @var ConfigData        $configData
+ * @var callable          $_getvar
+ * @var Template          $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\NotificationData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+use SP\Util\DateUtil;
+
+$notification = $_getvar('notification');
+?>
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="frmNotices" id="frmNotices" class="form-action"
+          data-onsubmit="notification/save"
+          data-route="<?php echo $_getvar('route', ''); ?>"
+          data-action-next="<?php echo $_getvar('nextAction'); ?>"
+          data-hash="">
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('Type'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="notification_type" name="notification_type"
+                               type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $notification->getType(); ?>" <?php echo $_getvar('disabled'); ?>>
+                        <label class="mdl-textfield__label"
+                               for="notification_type"><?php echo __('Type'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Component'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="notification_component"
+                               name="notification_component" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $notification->getComponent(); ?>" <?php echo $_getvar('disabled'); ?>>
+                        <label class="mdl-textfield__label"
+                               for="notification_component"><?php echo __('Component'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <?php if ($_getvar('isView')): ?>
+                <tr>
+                    <td class="descField"><?php echo __('Date'); ?></td>
+                    <td class="valField">
+                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                            <input id="notification_date"
+                                   name="notification_date" type="text"
+                                   class="mdl-textfield__input mdl-color-text--indigo-400"
+                                   value="<?php echo DateUtil::getDateFromUnix($notification->getDate()); ?>" <?php echo $_getvar('disabled'); ?>>
+                            <label class="mdl-textfield__label"
+                                   for="notification_date"><?php echo __('Date'); ?></label>
+                        </div>
+                    </td>
+                </tr>
+            <?php endif; ?>
+            <tr>
+                <td class="descField"><?php echo __('Description'); ?></td>
+                <td class="valField">
+                    <?php if ($_getvar('isView') === false): ?>
+                        <div class="mdl-textfield mdl-js-textfield">
+                            <textarea
+                                    class="mdl-textfield__input mdl-color-text--indigo-400"
+                                    type="text" rows="3"
+                                    id="notification_description"
+                                    name="notification_description" <?php echo $_getvar('readonly'); ?>><?php echo $notification->getDescription(); ?></textarea>
+                            <label class="mdl-textfield__label"
+                                   for="notification_description"><?php echo __('Description'); ?></label>
+                        </div>
+                    <?php else: ?>
+                        <div class="notification-description">
+                            <?php echo $notification->getDescription(); ?>
+                        </div>
+                    <?php endif; ?>
+                </td>
+            </tr>
+
+            <?php if (!$_getvar('isView') && $_getvar('ctx_userIsAdminApp')): ?>
+                <tr>
+                    <td class="descField"><?php echo __('User'); ?></td>
+                    <td class="valField">
+                        <div class="lowres-title"><?php echo __('User'); ?></div>
+
+                        <select id="notification_user" name="notification_user"
+                                class="select-box select-box-deselect" <?php echo $_getvar('disabled'); ?>>
+                            <option value=""><?php echo __('Select User'); ?></option>
+                            <?php /** @var SelectItem $user */
+                            foreach ($_getvar('users') as $user): ?>
+                                <option
+                                        value="<?php echo $user->getId(); ?>" <?php echo $user->isSelected() ? 'selected' : ''; ?>><?php echo $user->getName(); ?></option>
+                            <?php endforeach; ?>
+                        </select>
+                    </td>
+                </tr>
+
+                <tr>
+                    <td class="descField"><?php echo __('Options'); ?></td>
+                    <td class="valField checkbox">
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="notification_sticky"
+                               title="<?php echo __('Global notification'); ?>">
+                            <input type="checkbox" id="notification_sticky"
+                                   class="mdl-switch__input mdl-color-text--indigo-400"
+                                   name="notification_sticky" <?php echo $notification->isSticky() ? 'checked' : ' '; ?> <?php echo $_getvar('disabled'); ?>/>
+                            <span class="mdl-switch__label"><?php echo __('Global'); ?></span>
+                        </label>
+
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="notification_onlyadmin"
+                               title="<?php echo __('Only for application administrators'); ?>">
+                            <input type="checkbox" id="notification_onlyadmin"
+                                   class="mdl-switch__input mdl-color-text--indigo-400"
+                                   name="notification_onlyadmin" <?php echo $notification->isOnlyAdmin() ? 'checked' : ' '; ?> <?php echo $_getvar('disabled'); ?>/>
+                            <span class="mdl-switch__label"><?php echo __('Only Admins'); ?></span>
+                        </label>
+
+                        <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                               for="notification_checkout"
+                               title="<?php echo __('Read'); ?>">
+                            <input type="checkbox" id="notification_checkout"
+                                   class="mdl-switch__input mdl-color-text--indigo-400"
+                                   name="notification_checkout" <?php echo $notification->isChecked() ? 'checked' : ' '; ?> <?php echo $_getvar('disabled'); ?>/>
+                            <span class="mdl-switch__label"><?php echo __('Read'); ?></span>
+                        </label>
+                    </td>
+                </tr>
+            <?php endif; ?>
+
+            </tbody>
+        </table>
+    </form>
+    <?php if (!$_getvar('isView')): ?>
+        <div class="action-in-box">
+            <button
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    form="frmNotices"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </div>
+    <?php endif; ?>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/plugin/index.inc b/app/modules/web/themes/material-dark/views/plugin/index.inc
new file mode 100644
index 000000000..49c701fb6
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/plugin/index.inc
@@ -0,0 +1,6 @@
+<h5 class="datagrid-header-title"><?php use SP\Mvc\View\Template;
+
+    echo __('Plugins'); ?></h5>
+<?php
+/** @var Template $this */
+include $this->includeTemplate('datagrid-grid', 'grid');
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/plugin/plugin.inc b/app/modules/web/themes/material-dark/views/plugin/plugin.inc
new file mode 100644
index 000000000..d4ddff1ce
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/plugin/plugin.inc
@@ -0,0 +1,98 @@
+<?php
+/**
+ * @var  PluginModel     $plugin
+ * @var  PluginInterface $pluginInfo
+ * @var ThemeIcons       $icons
+ * @var ConfigData       $configData
+ * @var callable         $_getvar
+ * @var Template         $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+use SP\Plugin\PluginInterface;
+use SP\Repositories\Plugin\PluginModel;
+
+$plugin = $_getvar('plugin');
+$pluginInfo = $_getvar('pluginInfo');
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo $_getvar('header'); ?><i
+                class="btn-popup-close material-icons">close</i></h2>
+
+    <form method="post" name="frmCategories" id="frmPlugins">
+        <table class="popup-data">
+            <tbody>
+            <tr>
+                <td class="descField"><?php echo __('Name'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="name" name="name" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $plugin->getName(); ?>" <?php echo $_getvar('readonly'); ?>>
+                        <label class="mdl-textfield__label"
+                               for="name"><?php echo __('Plugin name'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Version'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="version" name="version" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo implode('.', $pluginInfo->getVersion()); ?>" <?php echo $_getvar('readonly'); ?>>
+                        <label class="mdl-textfield__label"
+                               for="version"><?php echo __('Plugin version'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Compatible Version'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="compatible_version" name="compatible_version"
+                               type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo implode('.', $pluginInfo->getCompatibleVersion()); ?>" <?php echo $_getvar('readonly'); ?>>
+                        <label class="mdl-textfield__label"
+                               for="compatible_version"><?php echo __('sysPass compatible version'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Author'); ?></td>
+                <td class="valField">
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="author" name="author" type="text"
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="<?php echo $pluginInfo->getAuthor(); ?>" <?php echo $_getvar('readonly'); ?>>
+                        <label class="mdl-textfield__label"
+                               for="author"><?php echo __('Plugin author'); ?></label>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td class="descField"><?php echo __('Events'); ?></td>
+                <td class="valField">
+                    <div class="lowres-title"><?php echo __('Events'); ?></div>
+
+                    <div class="list-wrap">
+                        <ul class="mdl-list">
+                            <?php foreach ($pluginInfo->getEvents() as $event): ?>
+                                <li class="mdl-list__item">
+                                <span class="mdl-list__item-primary-content">
+                                <i class="material-icons mdl-list__item-icon">flash_on</i>
+                                    <?php echo $event; ?>
+                                </span>
+                                </li>
+                            <?php endforeach; ?>
+                        </ul>
+                    </div>
+                </td>
+            </tr>
+        </table>
+    </form>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/upgrade/index.inc b/app/modules/web/themes/material-dark/views/upgrade/index.inc
new file mode 100644
index 000000000..08b74bea6
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/upgrade/index.inc
@@ -0,0 +1,64 @@
+<?php
+/**
+ * @var Template   $this
+ * @var ThemeIcons $icons
+ */
+
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+<div id="actions" class="installer" align="center">
+    <ul class="errors round">
+        <li class="msg-warning">
+            <i class="material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></i>
+            <strong><?php echo __('The application needs to be updated'); ?></strong>
+            <p class="hint">
+                <?php echo __('Please contact to the administrator'); ?>
+            </p>
+            <p class="hint">
+                <?php echo __('Please enter the security code to start the upgrade'); ?>
+            </p>
+        </li>
+    </ul>
+
+    <form id="frmUpgrade" method="get" class="form-action"
+          data-onsubmit="main/upgrade"
+          data-action-route="upgrade/upgrade">
+        <fieldset>
+            <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                <input id="key" name="key" type="text" required
+                       class="mdl-textfield__input mdl-color-text--indigo-400"
+                       autocomplete="off" autofocus>
+                <label class="mdl-textfield__label"
+                       for="key"><?php echo __('Security Code'); ?></label>
+            </div>
+
+            <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"
+                   for="chkConfirm">
+                <input type="checkbox" id="chkConfirm"
+                       class="mdl-checkbox__input" name="chkConfirm" required>
+                <span class="mdl-checkbox__label"><?php echo __('I\'ve done a full sysPass backup'); ?></span>
+            </label>
+        </fieldset>
+
+        <div>
+            <ul class="errors">
+                <li class="msg-warning">
+                    <i class="icon material-icons <?php echo $icons->getIconWarning()->getClass(); ?>"><?php echo $icons->getIconWarning()->getIcon(); ?></i>
+                    <?php echo __('Please, wait while the process is running'); ?>
+                </li>
+            </ul>
+        </div>
+
+        <div class="buttons">
+            <button id="btnChange"
+                    class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent"
+                    type="submit">
+                <?php echo __('Update'); ?>
+                <i class="material-icons"
+                   title="<?php echo __('Start Update'); ?>"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+            </button>
+        </div>
+    </form>
+</div>
\ No newline at end of file
diff --git a/app/modules/web/themes/material-dark/views/userpassreset/request.inc b/app/modules/web/themes/material-dark/views/userpassreset/request.inc
new file mode 100644
index 000000000..b84088034
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/userpassreset/request.inc
@@ -0,0 +1,56 @@
+<?php /** @var $icons ThemeIcons */
+
+use SP\Core\UI\ThemeIcons; ?>
+
+<div id="box-pub-noheader">
+    <div class="box-spacer"></div>
+    <div class="box-header">
+        <?php echo __('Request Password Change'); ?>
+    </div>
+    <div id="box-passreset" class="box-form round">
+        <form id="frmPassReset" action="" method="post" class="form-action"
+              data-onsubmit="user/passreset"
+              data-action-route="userPassReset/saveRequest">
+            <fieldset id="box-data">
+                <div class="form-control">
+                    <i class="material-icons">perm_identity</i>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="login" name="login" type="text" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               autocomplete="off" autofocus>
+                        <label class="mdl-textfield__label"
+                               for="login"><?php echo __('User'); ?></label>
+                    </div>
+                </div>
+                <div class="form-control">
+                    <i class="material-icons">email</i>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="email" name="email" type="email" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               autocomplete="off">
+                        <label class="mdl-textfield__label"
+                               for="email"><?php echo __('User\'s Email'); ?></label>
+                    </div>
+                </div>
+                <input type="hidden" name="isAjax" value="1">
+                <input type="hidden" name="sk" value="<?php echo $sk; ?>">
+            </fieldset>
+
+            <div id="box-buttons">
+                <button id="btnBack" type="button"
+                        class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent">
+                    <i class="material-icons"
+                       title="<?php echo __('Go back to login'); ?>"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+                    <?php echo __('Back'); ?>
+                </button>
+
+                <button id="btnRequest"
+                        class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent">
+                    <?php echo __('Request'); ?>
+                    <i class="material-icons"
+                       title="<?php echo __('Request'); ?>"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+                </button>
+            </div>
+        </form>
+    </div>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/userpassreset/reset.inc b/app/modules/web/themes/material-dark/views/userpassreset/reset.inc
new file mode 100644
index 000000000..47bc32012
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/userpassreset/reset.inc
@@ -0,0 +1,72 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+?>
+
+<div id="box-pub-noheader">
+    <div class="box-spacer"></div>
+    <div class="box-header">
+        <?php echo __('Request Password Change'); ?>
+    </div>
+    <div id="box-passreset" class="box-form round">
+        <form id="frmUserPassReset" action="" method="post" class="form-action"
+              data-onsubmit="user/passreset"
+              data-action-route="userPassReset/saveReset">
+            <fieldset id="box-data">
+                <div class="form-control">
+                    <i class="material-icons">vpn_key</i>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="password" name="password" type="password"
+                               required
+                               class="mdl-textfield__input mdl-color-text--indigo-400 passwordfield__input"
+                               value="" maxlength="255"
+                               autocomplete="off">
+                        <label class="mdl-textfield__label"
+                               for="password"><?php echo __('Password'); ?></label>
+                    </div>
+                </div>
+                <div class="form-control">
+                    <i class="material-icons">vpn_key</i>
+                    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                        <input id="password_repeat" name="password_repeat"
+                               type="password" required
+                               class="mdl-textfield__input mdl-color-text--indigo-400"
+                               value="" maxlength="255"
+                               autocomplete="off">
+                        <label class="mdl-textfield__label"
+                               for="password_repeat"><?php echo __('Password (repeat)'); ?></label>
+                    </div>
+                </div>
+                <input type="hidden" name="hash"
+                       value="<?php echo $_getvar('hash'); ?>">
+                <input type="hidden" name="sk" value="<?php echo $sk; ?>">
+                <input type="hidden" name="isAjax" value="1">
+            </fieldset>
+
+            <div id="box-buttons">
+                <button id="btnBack" type="button"
+                        class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent">
+                    <i class="material-icons"
+                       title="<?php echo __('Go back to login'); ?>"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+                    <?php echo __('Back'); ?>
+                </button>
+
+                <button id="btnChange"
+                        class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent">
+                    <?php echo __('Change'); ?>
+                    <i class="material-icons"
+                       title="<?php echo __('Change'); ?>"><?php echo $icons->getIconPlay()->getIcon(); ?></i>
+                </button>
+            </div>
+        </form>
+    </div>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/usersettings/general.inc b/app/modules/web/themes/material-dark/views/usersettings/general.inc
new file mode 100644
index 000000000..0af01f1b3
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/usersettings/general.inc
@@ -0,0 +1,243 @@
+<?php
+/**
+ * @var UserPreferencesData $userPreferences
+ * @var ThemeIcons          $icons
+ * @var ConfigData          $configData
+ * @var callable            $_getvar
+ * @var Template            $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\DataModel\UserPreferencesData;
+use SP\Mvc\View\Components\SelectItem;
+use SP\Mvc\View\Template;
+
+$userPreferences = $_getvar('userPreferences');
+?>
+
+<div id="title" class="titleNormal">
+    <i class="material-icons">home</i>
+    <?php echo __('Site'); ?>
+</div>
+
+<form method="post" name="frmPreferences" id="frmPreferences"
+      class="form-action"
+      data-onsubmit="user/saveSettings"
+      data-action-route="<?php echo $_getvar('route'); ?>"
+      data-reload="1"
+      data-hash="">
+
+    <table id="tblSite" class="data tblConfig round">
+        <tr>
+            <td class="descField"><?php echo __('Language'); ?></td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Language'); ?></div>
+
+                <select name="userlang" id="sel-userlang" size="1"
+                        class="select-box sel-chosen-ns">
+                    <?php /** @var SelectItem $lang */
+                    foreach ($_getvar('langs') as $langName => $lang): ?>
+                        <option
+                                value='<?php echo $lang->getId(); ?>' <?php echo $lang->isSelected() ? 'selected' : ""; ?>><?php echo $lang->getName(); ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"><?php echo __('Visual Theme'); ?></td>
+            <td class="valField">
+                <div class="lowres-title"><?php echo __('Visual Theme'); ?></div>
+
+                <select name="usertheme" id="sel-usertheme" size="1"
+                        class="select-box sel-chosen-ns">
+                    <?php /** @var SelectItem $theme */
+                    foreach ($_getvar('themes') as $theme): ?>
+                        <option
+                                value='<?php echo $theme->getId(); ?>' <?php echo $theme->isSelected() ? 'selected' : ""; ?>><?php echo $theme->getName(); ?></option>
+                    <?php endforeach; ?>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField">
+                <?php echo __('Results per page'); ?>
+                <div id="help-account_count"
+                     class="icon material-icons <?php echo $icons->getIconHelp()->getClass(); ?>"><?php echo $icons->getIconHelp()->getIcon(); ?></div>
+                <div class="mdl-tooltip mdl-tooltip--large"
+                     for="help-account_count">
+                    <p>
+                        <?php echo __('Number of results per page to display when performing a search.'); ?>
+                    </p>
+                </div>
+            </td>
+            <td class="valField">
+                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+                    <input id="resultsperpage" name="resultsperpage"
+                           type="number" step="6"
+                           pattern="[0-9]{1,5}"
+                           class="mdl-textfield__input mdl-color-text--indigo-400"
+                           maxlength="5"
+                           value="<?php echo $userPreferences->getResultsPerPage(); ?>"
+                           required/>
+                    <label class="mdl-textfield__label"
+                           for="resultsperpage"><?php echo __('Results per page'); ?></label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td class="descField"></td>
+            <td class="valField">
+                <ul class="usersettings-general-list-action mdl-list">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="account_link">
+                                <input type="checkbox" id="account_link"
+                                       class="mdl-switch__input"
+                                       name="account_link" <?php echo $userPreferences->isAccountLink() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Account name as link'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Enables to use the account name as a link to account details.'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="sort_views">
+                                <input type="checkbox" id="sort_views"
+                                       class="mdl-switch__input"
+                                       name="sort_views" <?php echo $userPreferences->isSortViews() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Sort search results by views'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Sorts accounts search results by the number of account\'s views'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="top_navbar">
+                                <input type="checkbox" id="top_navbar"
+                                       class="mdl-switch__input"
+                                       name="top_navbar" <?php echo $userPreferences->isTopNavbar() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Navigation bar on top'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Displays a navigation bar on top of the search results.'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="optional_actions">
+                                <input type="checkbox" id="optional_actions"
+                                       class="mdl-switch__input"
+                                       name="optional_actions" <?php echo $userPreferences->isOptionalActions() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Show Hidden Actions'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Always display hidden actions on the accounts search page.'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="resultsascards">
+                                <input type="checkbox" id="resultsascards"
+                                       class="mdl-switch__input"
+                                       name="resultsascards" <?php echo $userPreferences->isResultsAsCards() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Results like Cards'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Displays account\'s search results on a card like format.'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="check_notifications">
+                                <input type="checkbox" id="check_notifications"
+                                       class="mdl-switch__input"
+                                       name="check_notifications" <?php echo $userPreferences->isCheckNotifications() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('In-App Notifications'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Enables the active In-App notifications polling'); ?>
+                            </span>
+                        </span>
+                    </li>
+
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <div class="mdl-switch__box">
+                            <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect"
+                                   for="show_account_search_filters">
+                                <input type="checkbox"
+                                       id="show_account_search_filters"
+                                       class="mdl-switch__input"
+                                       name="show_account_search_filters" <?php echo $userPreferences->isShowAccountSearchFilters() ? 'checked' : ''; ?>/>
+                            </label>
+                        </div>
+
+                        <span class="mdl-list__item-primary-content">
+                            <span><?php echo __('Show Filters'); ?></span>
+                            <span class="mdl-list__item-sub-title">
+                                <?php echo __('Displays the additional filters selection on the accounts search.'); ?>
+                            </span>
+                        </span>
+                    </li>
+                </ul>
+            </td>
+        </tr>
+    </table>
+
+    <input type="hidden" name="isAjax" value="1"/>
+    <input type="hidden" name="sk" value="<?php echo $sk; ?>">
+</form>
+<div class="tab-actions">
+    <ul>
+        <li>
+            <button id="btnBack" type="button"
+                    class="btn-back mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconBack()->getClassButton(); ?>"
+                    title="<?php echo __('Back'); ?>">
+                <i class="material-icons"><?php echo $icons->getIconBack()->getIcon(); ?></i>
+            </button>
+        </li>
+        <li>
+            <button form="frmPreferences"
+                    class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored <?php echo $icons->getIconSave()->getClassButton(); ?>"
+                    title="<?php echo $icons->getIconSave()->getTitle(); ?>">
+                <i class="material-icons"><?php echo $icons->getIconSave()->getIcon(); ?></i>
+            </button>
+        </li>
+    </ul>
+</div>
diff --git a/app/modules/web/themes/material-dark/views/wiki/wikipage.inc b/app/modules/web/themes/material-dark/views/wiki/wikipage.inc
new file mode 100644
index 000000000..e932255e6
--- /dev/null
+++ b/app/modules/web/themes/material-dark/views/wiki/wikipage.inc
@@ -0,0 +1,47 @@
+<?php
+/**
+ * @var ThemeIcons $icons
+ * @var ConfigData $configData
+ * @var callable   $_getvar
+ * @var Template   $this
+ */
+
+use SP\Config\ConfigData;
+use SP\Core\UI\ThemeIcons;
+use SP\Mvc\View\Template;
+
+$header = $_getvar('header');
+$pageData = $_getvar('pageData');
+$pageSearch = $_getvar('pageSearch', []);
+$pageInfo = $_getvar('pageInfo');
+?>
+
+<div id="box-popup">
+    <h2 class="center"><?php echo (is_array($header) && !empty($header[0])) ? $header[0] : __('View Wiki'); ?></h2>
+
+    <div id="wikiPage">
+        <?php if (is_array($pageData) && !empty($pageData[0])): ?>
+            <?php echo $pageData[0]; ?>
+        <?php elseif (count($pageSearch) > 0): ?>
+            <h1><?php echo __('Page not found'); ?></h1>
+            <hr>
+            <?php printf(__('Search results of \'%s\''), $_getvar('pageName')); ?>
+            <ul>
+                <?php foreach ($pageSearch as $result): ?>
+                    <li><?php printf('%s: <a href="%s" target="_blank">%s</a>', __('Page'), $_getvar('wikiUrlBase') . '/' . $result['id'], $result['id']); ?></li>
+                <?php endforeach; ?>
+            </ul>
+        <?php else: ?>
+            <h1><?php echo __('Page not found'); ?></h1>
+        <?php endif; ?>
+    </div>
+    <div id="wikiPageInfo">
+        <?php if ($pageInfo): ?>
+            <ul>
+                <li><?php printf('%s: <a href="%s" target="_blank">%s</a>', __('Page'), $_getvar('wikiUrlBase') . $pageInfo['name'], $pageInfo['name']); ?></li>
+                <li><?php printf('%s: %s', __('Date'), $pageInfo['lastModified']); ?></li>
+                <li><?php printf('%s: %s', __('Author'), $pageInfo['author']); ?></li>
+            </ul>
+        <?php endif; ?>
+    </div>
+</div>