Merge pull request #309 from BankaiNoJutsu/master

Adding theming to Authelia. One can now build with any theme.
2024-09-14 22:47:21 +07:00 · 2019-01-08 23:42:18 +01:00 · 2019-01-08 23:42:18 +01:00 · dc2d4d43ef
commit dc2d4d43ef
parent e83af9b687 84b1194711
234 changed files with 32877 additions and 48 deletions
--- a/Gruntfile.js
+++ b/Gruntfile.js
@ -1,6 +1,7 @@
 module.exports = function (grunt) {
  const buildDir = "dist";
  const schemaDir = "server/src/lib/configuration/Configuration.schema.json"
+  var theme = grunt.option('theme') || 'default';
    
  grunt.initConfig({
    env: {
@ -14,6 +15,10 @@ module.exports = function (grunt) {
        TS_NODE_PROJECT: "server/tsconfig.json"
      }
    },
+    clean: {
+        dist: ['dist'],
+        backup: ['backup'],
+    },
    run: {
      "compile-server": {
        cmd: "./node_modules/.bin/tsc",
@ -82,27 +87,34 @@ module.exports = function (grunt) {
      }
    },
    copy: {
+        backup: {
+          files: [{
+            expand: true,
+            src: ['dist/**'],
+            dest: 'backup'
+            }]
+        },
        resources: {
            expand: true,
-        cwd: 'server/src/resources/',
+            cwd: 'themes/' + theme + '/server/src/resources',
            src: '**',
            dest: `${buildDir}/server/src/resources/`
        },
        views: {
            expand: true,
-        cwd: 'server/src/views/',
+            cwd: 'themes/' + theme + '/server/src/views',
            src: '**',
            dest: `${buildDir}/server/src/views/`
        },
        images: {
            expand: true,
-        cwd: 'client/src/img',
+            cwd: 'themes/' + theme + '/client/src/img',
            src: '**',
            dest: `${buildDir}/server/src/public_html/img/`
        },
        thirdparties: {
            expand: true,
-        cwd: 'client/src/thirdparties',
+            cwd: 'themes/' + theme + '/client/src/thirdparties',
            src: '**',
            dest: `${buildDir}/server/src/public_html/js/`
        },
@ -174,7 +186,7 @@ module.exports = function (grunt) {
    },
    concat: {
      css: {
-        src: ['client/src/css/*.css'],
+        src: ['themes/' + theme + '/client/src/css/*.css'],
        dest: `${buildDir}/server/src/public_html/css/authelia.css`
      },
    },
@ -192,10 +204,10 @@ module.exports = function (grunt) {
  grunt.loadNpmTasks('grunt-contrib-copy');
  grunt.loadNpmTasks('grunt-contrib-cssmin');
  grunt.loadNpmTasks('grunt-contrib-watch');
+  grunt.loadNpmTasks('grunt-contrib-clean');
  grunt.loadNpmTasks('grunt-run');
  grunt.loadNpmTasks('grunt-env');

-
  grunt.registerTask('compile-server', ['run:lint-server', 'run:compile-server'])
  grunt.registerTask('compile-client', ['run:lint-client', 'run:compile-client'])

@ -206,17 +218,29 @@ module.exports = function (grunt) {
  grunt.registerTask('test-int', ['run:test-cucumber', 'run:test-minimal-config', 'run:test-complete-config', 'run:test-inactivity']);

  grunt.registerTask('copy-resources', ['copy:resources', 'copy:views', 'copy:images', 'copy:thirdparties', 'concat:css']);
+  
  grunt.registerTask('generate-config-schema', ['run:generate-config-schema', 'copy:schema']);
  
  grunt.registerTask('build-client', ['compile-client', 'browserify']);
+
  grunt.registerTask('build-server', ['compile-server', 'copy-resources', 'generate-config-schema']);
  
  grunt.registerTask('build', ['build-client', 'build-server']);
-  grunt.registerTask('build-dist', ['build', 'run:minify', 'cssmin', 'run:include-minified-script']);
+  grunt.registerTask('build-dist', ['clean:backup', 'copy:backup', 'clean:dist', 'build', 'run:minify', 'cssmin', 'run:include-minified-script']);
  
  grunt.registerTask('schema', ['run:generate-config-schema'])

  grunt.registerTask('docker-build', ['run:docker-build']);
  
-  grunt.registerTask('default', ['build-dist']);
+  grunt.registerTask('check', function() {
+      if ((theme != 'default') && (theme != 'black') && (theme != 'matrix') && (theme != 'squares') && (theme != 'triangles')) {
+        grunt.warn('Valid argmuents are just "grunt" (will use default) or "grunt --theme=|default|black|matrix|squares|triangles"');
+    }
+      if (grunt.option('theme') == 'default' || 'black' || 'matrix' || 'squares' || 'triangles') {
+        grunt.log.ok();
+        grunt.log.writeln('Building "'+ theme +'" theme');
+    }
+  });
+
+  grunt.registerTask('default', ['check', 'build-dist']);
 };
--- a/example/kube/bootstrap.sh
+++ b/example/kube/bootstrap.sh
--- a/example/kube/build_and_push.sh
+++ b/example/kube/build_and_push.sh
--- a/package-lock.json
+++ b/package-lock.json
@ -2950,7 +2950,8 @@
        "ansi-regex": {
          "version": "2.1.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "aproba": {
          "version": "1.2.0",
@ -2971,12 +2972,14 @@
        "balanced-match": {
          "version": "1.0.0",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "brace-expansion": {
          "version": "1.1.11",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "balanced-match": "^1.0.0",
            "concat-map": "0.0.1"
@ -2991,17 +2994,20 @@
        "code-point-at": {
          "version": "1.1.0",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "concat-map": {
          "version": "0.0.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "console-control-strings": {
          "version": "1.1.0",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "core-util-is": {
          "version": "1.0.2",
@ -3118,7 +3124,8 @@
        "inherits": {
          "version": "2.0.3",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "ini": {
          "version": "1.3.5",
@ -3130,6 +3137,7 @@
          "version": "1.0.0",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "number-is-nan": "^1.0.0"
          }
@ -3144,6 +3152,7 @@
          "version": "3.0.4",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "brace-expansion": "^1.1.7"
          }
@ -3151,12 +3160,14 @@
        "minimist": {
          "version": "0.0.8",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "minipass": {
          "version": "2.2.4",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "safe-buffer": "^5.1.1",
            "yallist": "^3.0.0"
@ -3175,6 +3186,7 @@
          "version": "0.5.1",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "minimist": "0.0.8"
          }
@ -3255,7 +3267,8 @@
        "number-is-nan": {
          "version": "1.0.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "object-assign": {
          "version": "4.1.1",
@ -3267,6 +3280,7 @@
          "version": "1.4.0",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "wrappy": "1"
          }
@ -3352,7 +3366,8 @@
        "safe-buffer": {
          "version": "5.1.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "safer-buffer": {
          "version": "2.1.2",
@ -3388,6 +3403,7 @@
          "version": "1.0.2",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "code-point-at": "^1.0.0",
            "is-fullwidth-code-point": "^1.0.0",
@ -3407,6 +3423,7 @@
          "version": "3.0.1",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "ansi-regex": "^2.0.0"
          }
@ -3450,12 +3467,14 @@
        "wrappy": {
          "version": "1.0.2",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "yallist": {
          "version": "3.0.2",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        }
      }
    },
@ -3731,6 +3750,50 @@
        }
      }
    },
+    "grunt-contrib-clean": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/grunt-contrib-clean/-/grunt-contrib-clean-2.0.0.tgz",
+      "integrity": "sha512-g5ZD3ORk6gMa5ugZosLDQl3dZO7cI3R14U75hTM+dVLVxdMNJCPVmwf9OUt4v4eWgpKKWWoVK9DZc1amJp4nQw==",
+      "dev": true,
+      "requires": {
+        "async": "^2.6.1",
+        "rimraf": "^2.6.2"
+      },
+      "dependencies": {
+        "async": {
+          "version": "2.6.1",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.6.1.tgz",
+          "integrity": "sha512-fNEiL2+AZt6AlAw/29Cr0UDe4sRAHCpEHh54WMz+Bb7QfNcFw4h3loofyJpLeQs4Yx7yuqu/2dLgM5hKOs6HlQ==",
+          "dev": true,
+          "requires": {
+            "lodash": "^4.17.10"
+          }
+        },
+        "glob": {
+          "version": "7.1.3",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.3.tgz",
+          "integrity": "sha512-vcfuiIxogLV4DlGBHIUOwI0IbrJ8HWPc4MU7HzviGeNho/UJDfi6B5p3sHeWIQ0KGIU0Jpxi5ZHxemQfLkkAwQ==",
+          "dev": true,
+          "requires": {
+            "fs.realpath": "^1.0.0",
+            "inflight": "^1.0.4",
+            "inherits": "2",
+            "minimatch": "^3.0.4",
+            "once": "^1.3.0",
+            "path-is-absolute": "^1.0.0"
+          }
+        },
+        "rimraf": {
+          "version": "2.6.2",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.2.tgz",
+          "integrity": "sha512-lreewLK/BlghmxtfH36YYVg1i8IAce4TI7oao75I1g245+6BctqTVQiBP3YUJ9C6DQOXJmkYR9X9fCLtCOJc5w==",
+          "dev": true,
+          "requires": {
+            "glob": "^7.0.5"
+          }
+        }
+      }
+    },
    "grunt-contrib-concat": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/grunt-contrib-concat/-/grunt-contrib-concat-1.0.1.tgz",
--- a/package.json
+++ b/package.json
@ -91,6 +91,7 @@
    "cucumber": "^4.0.0",
    "grunt": "^1.0.3",
    "grunt-browserify": "^5.0.0",
+    "grunt-contrib-clean": "^2.0.0",
    "grunt-contrib-concat": "^1.0.1",
    "grunt-contrib-copy": "^1.0.0",
    "grunt-contrib-cssmin": "^2.2.0",
--- a/server/src/index.ts
+++ b/server/src/index.ts
--- a/themes/README
+++ b/themes/README
@ -0,0 +1,17 @@
+In order to build a specific Theme you need to run:
+
+grunt --theme=<themename>
+
+Available themes are: default, black, matrix, squares, triangles
+
+Ex. grunt --theme=black
+
+By default the original theme will be built.
+
+If you want to create a new theme:
+- Use the themes/default as source material
+- Make a copy in themes folder with a new name
+- Add your theme folder name on line 237,239 and 242
+- And then build as above, with your theme folder/name.
+
+That's it!
--- a/themes/black/client/src/css/.directory
+++ b/themes/black/client/src/css/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,56,41
+Version=3
+ViewMode=1
--- a/themes/black/client/src/css/00-bootstrap.min.css
+++ b/themes/black/client/src/css/00-bootstrap.min.css
--- a/themes/black/client/src/css/01-main.css
+++ b/themes/black/client/src/css/01-main.css
@ -0,0 +1,77 @@
+body {
+  /*background-image: url("//*img//*LargeTriangles.svg");*/
+  /*background-image: url("//*img//*RandomizedPattern.svg");*/
+  /*background-image: url("//*img//*background.svg");*/  
+  background-color:#000000;
+}
+canvas{
+  position:absolute;
+  top:0;
+  left:0;
+}
+.authelia-brand {
+  font-weight: bold;
+  font-style: italic;
+  color: #ffffff
+}
+.poweredby-block {
+  margin: 0px 30px;
+  margin-top: 10px;
+  padding-top: 15px;
+  border-top: 1px solid rgba(0, 0, 0, 0.15);
+
+}
+.poweredby {
+  font-size: 0.7em;
+  color: white;
+}
+/* notifications */
+.notification {
+  padding: 10px;
+  margin: 15px 0px;
+  border-radius: 6px;
+  display: none;
+  position: absolute;
+}
+.notification img {
+  width: 24px;
+  margin-right: 10px;
+}
+.notification i,
+.notification span {
+  display:table-cell;
+  vertical-align:middle;
+}
+.info {
+  border: 1px solid #9cb1ff;
+  background-color: rgb(192, 220, 255);
+}
+.success {
+  border: 1px solid #65ec7c;
+  background-color: rgb(163, 255, 157);
+}
+.error {
+  border: 1px solid #ffa3a3;
+  background-color: rgb(255, 175, 175);
+}
+.warning {
+  border: 1px solid #ffd743;
+  background-color: rgb(255, 230, 143);
+}
+.bottom-right-links {
+  text-align: right;
+  margin-top: 10px;
+  font-size: 0.8em;
+  color: white;
+}
+.header {
+  background-color: #000000;
+  color: white;
+  margin: 0px;
+}
+.body {
+  padding: 10px;
+}
+h1 {
+  font-size: 25px;
+}
--- a/themes/black/client/src/css/02-login.css
+++ b/themes/black/client/src/css/02-login.css
@ -0,0 +1,136 @@
+.form-signin
+{
+    margin: 0 auto;
+}
+
+.form-signin .form-signin-heading, .form-signin .checkbox
+{
+    margin-bottom: 10px;
+}
+
+.form-signin .checkbox
+{
+    font-weight: normal;
+}
+
+.form-signin .form-control
+{
+    position: relative;
+    font-size: 16px;
+    height: auto;
+    padding: 10px;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+.form-signin .form-control:focus
+{
+    z-index: 2;
+}
+.form-signin input[type="text"]
+{
+    margin-bottom: -1px;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+.form-signin input[type="password"]
+{
+    /* margin-bottom: 10px; */
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+}
+.account-wall
+{
+    border: 1px solid #000;
+    margin-top: 20px;
+    padding-bottom: 20px;
+    background-color: #000000;
+    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 1);
+    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 1);
+    box-shadow: 0px 2px 2px rgba(0, 0, 0, 1);
+}
+.account-wall h1
+{
+    margin-bottom: 15px;
+    margin-top: 15px;
+    font-weight: 800;
+    display: block;
+    text-align: center;
+}
+.account-wall h3
+{
+    display: block;
+    text-align: center;
+}
+.account-wall p 
+{
+    text-align: center;
+    margin: 10px;
+    color: white;
+}
+.account-wall .form-inputs 
+{
+    margin-bottom: 10px;
+    border-color: #b20c0c;
+}
+.account-wall hr {
+    border-color: #c5c5c5;
+}
+
+.header-img
+{
+    width: 96px;
+    height: 96px;
+    margin: 0 auto 10px;
+    display: block;
+    -moz-border-radius: 50%;
+    -webkit-border-radius: 50%;
+    border-radius: 50%;
+}
+
+.link
+{
+    margin-top: 10px;
+    color: white;
+}
+
+.btn-primary.totp
+{
+    background-color: rgb(102, 135, 162);
+}
+
+.btn-primary.u2f
+{
+    background-color: rgb(83, 149, 204);
+}
+
+.u2f-token {
+    text-align: center;
+}
+
+.u2f-token img {
+    width: 70px;
+}
+
+.keep-me-logged-in {
+    margin-top: 10px;
+    font-size: 0.8em;
+    color: white;
+}
+
+.keep-me-logged-in input[type=checkbox] {
+    transform: scale(0.8);
+    margin: 0;
+    margin-right: 4px;
+}
+
+.keep-me-logged-in label {
+    font-weight: 300;
+}
+
+.keep-me-logged-in input,
+.keep-me-logged-in label {
+    display: inline-block;
+    margin-bottom: 0; /* I added this after I posted my reply */
+    vertical-align: middle; /* Fixes any weird issues in Firefox and IE */
+}
--- a/themes/black/client/src/css/03-errors.css
+++ b/themes/black/client/src/css/03-errors.css
@ -0,0 +1,12 @@
+
+.error-401 .header-img {
+    border-radius: 0%;
+}
+
+.error-403 .header-img {
+    border-radius: 0%;
+}
+
+.error-404 .header-img {
+    border-radius: 0%;
+}
--- a/themes/black/client/src/css/03-password-reset-form.css
+++ b/themes/black/client/src/css/03-password-reset-form.css
@ -0,0 +1,4 @@
+
+.password-reset-form .header-img {
+    border-radius: 0%;
+}
--- a/themes/black/client/src/css/03-password-reset-request.css
+++ b/themes/black/client/src/css/03-password-reset-request.css
@ -0,0 +1,4 @@
+
+.password-reset-request .header-img {
+    border-radius: 0%;
+}
--- a/themes/black/client/src/css/03-totp-register.css
+++ b/themes/black/client/src/css/03-totp-register.css
@ -0,0 +1,22 @@
+.totp-register #secret {
+  background-color: white;
+  font-size: 0.9em;
+  font-weight: bold;
+  padding: 5px;
+  border: 1px solid #c7c7c7;
+  word-wrap: break-word;
+}
+.totp-register #qrcode img {
+  margin: 10px auto;
+}
+.totp-register .need-google-authenticator {
+  text-align: center;
+  margin-top: 20px;
+}
+.totp-register .store-badges {
+  margin-top: 5px;
+}
+.totp-register .store-badge {
+  width: 110px;
+  height: 30px;
+}
--- a/themes/black/client/src/css/03-u2f-register.css
+++ b/themes/black/client/src/css/03-u2f-register.css
@ -0,0 +1,5 @@
+
+.u2f-register img {
+    display: block;
+    margin: 20px auto;
+}
--- a/themes/black/client/src/img/RandomizedPattern.svg
+++ b/themes/black/client/src/img/RandomizedPattern.svg
@ -0,0 +1 @@
+<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='100' height='50' viewBox='0 0 100 50'><rect fill='#000000' width='50' height='25'/><defs><rect stroke='#000000' stroke-width='0.5' width='1' height='1' id='s'/><pattern id='a' width='2' height='2' patternUnits='userSpaceOnUse'><g stroke='#000000' stroke-width='0.5'><rect fill='#050505' width='1' height='1'/><rect fill='#000000' width='1' height='1' x='1' y='1'/><rect fill='#0a0a0a' width='1' height='1' y='1'/><rect fill='#0f0f0f' width='1' height='1' x='1'/></g></pattern><pattern id='b' width='5' height='11' patternUnits='userSpaceOnUse'><g fill='#141414'><use xlink:href='#s' x='2' y='0'/><use xlink:href='#s' x='4' y='1'/><use xlink:href='#s' x='1' y='2'/><use xlink:href='#s' x='2' y='4'/><use xlink:href='#s' x='4' y='6'/><use xlink:href='#s' x='0' y='8'/><use xlink:href='#s' x='3' y='9'/></g></pattern><pattern id='c' width='7' height='7' patternUnits='userSpaceOnUse'><g fill='#1a1a1a'><use xlink:href='#s' x='1' y='1'/><use xlink:href='#s' x='3' y='4'/><use xlink:href='#s' x='5' y='6'/><use xlink:href='#s' x='0' y='3'/></g></pattern><pattern id='d' width='11' height='5' patternUnits='userSpaceOnUse'><g fill='#000000'><use xlink:href='#s' x='1' y='1'/><use xlink:href='#s' x='6' y='3'/><use xlink:href='#s' x='8' y='2'/><use xlink:href='#s' x='3' y='0'/><use xlink:href='#s' x='0' y='3'/></g><g fill='#1f1f1f'><use xlink:href='#s' x='8' y='3'/><use xlink:href='#s' x='4' y='2'/><use xlink:href='#s' x='5' y='4'/><use xlink:href='#s' x='10' y='0'/></g></pattern><pattern id='e' width='47' height='23' patternUnits='userSpaceOnUse'><g fill='#000000'><use xlink:href='#s' x='2' y='5'/><use xlink:href='#s' x='23' y='13'/><use xlink:href='#s' x='4' y='18'/><use xlink:href='#s' x='35' y='9'/></g></pattern><pattern id='f' width='61' height='31' patternUnits='userSpaceOnUse'><g fill='#000000'><use xlink:href='#s' x='16' y='0'/><use xlink:href='#s' x='13' y='22'/><use xlink:href='#s' x='44' y='15'/><use xlink:href='#s' x='12' y='11'/></g></pattern></defs><rect fill='url(#a)' width='100' height='50'/><rect fill='url(#b)' width='100' height='50'/><rect fill='url(#c)' width='100' height='50'/><rect fill='url(#d)' width='100' height='50'/><rect fill='url(#e)' width='100' height='50'/><rect fill='url(#f)' width='100' height='50'/></svg>
--- a/themes/black/client/src/img/background.jpg
+++ b/themes/black/client/src/img/background.jpg
--- a/themes/black/client/src/img/icon.png
+++ b/themes/black/client/src/img/icon.png
--- a/themes/black/client/src/img/mail.png
+++ b/themes/black/client/src/img/mail.png
--- a/themes/black/client/src/img/notifications/.directory
+++ b/themes/black/client/src/img/notifications/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,57,35
+Version=3
+ViewMode=1
--- a/themes/black/client/src/img/notifications/error.png
+++ b/themes/black/client/src/img/notifications/error.png
--- a/themes/black/client/src/img/notifications/info.png
+++ b/themes/black/client/src/img/notifications/info.png
--- a/themes/black/client/src/img/notifications/success.png
+++ b/themes/black/client/src/img/notifications/success.png
--- a/themes/black/client/src/img/notifications/warning.png
+++ b/themes/black/client/src/img/notifications/warning.png
--- a/themes/black/client/src/img/padlock.png
+++ b/themes/black/client/src/img/padlock.png
--- a/themes/black/client/src/img/password_white.png
+++ b/themes/black/client/src/img/password_white.png
--- a/themes/black/client/src/img/pendrive.png
+++ b/themes/black/client/src/img/pendrive.png
--- a/themes/black/client/src/img/sharingan.png
+++ b/themes/black/client/src/img/sharingan.png
--- a/themes/black/client/src/img/stores/.directory
+++ b/themes/black/client/src/img/stores/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,57,25
+Version=3
+ViewMode=1
--- a/themes/black/client/src/img/stores/applestore-badge.svg
+++ b/themes/black/client/src/img/stores/applestore-badge.svg
@ -0,0 +1,129 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="US_UK_Download_on_the" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+	 x="0px" y="0px" width="135px" height="40px" viewBox="0 0 135 40" enable-background="new 0 0 135 40" xml:space="preserve">
+<g>
+	<path fill="#A6A6A6" d="M130.197,40H4.729C2.122,40,0,37.872,0,35.267V4.726C0,2.12,2.122,0,4.729,0h125.468
+		C132.803,0,135,2.12,135,4.726v30.541C135,37.872,132.803,40,130.197,40L130.197,40z"/>
+	<path d="M134.032,35.268c0,2.116-1.714,3.83-3.834,3.83H4.729c-2.119,0-3.839-1.714-3.839-3.83V4.725
+		c0-2.115,1.72-3.835,3.839-3.835h125.468c2.121,0,3.834,1.72,3.834,3.835L134.032,35.268L134.032,35.268z"/>
+	<g>
+		<g>
+			<path fill="#FFFFFF" d="M30.128,19.784c-0.029-3.223,2.639-4.791,2.761-4.864c-1.511-2.203-3.853-2.504-4.676-2.528
+				c-1.967-0.207-3.875,1.177-4.877,1.177c-1.022,0-2.565-1.157-4.228-1.123c-2.14,0.033-4.142,1.272-5.24,3.196
+				c-2.266,3.923-0.576,9.688,1.595,12.859c1.086,1.553,2.355,3.287,4.016,3.226c1.625-0.067,2.232-1.036,4.193-1.036
+				c1.943,0,2.513,1.036,4.207,0.997c1.744-0.028,2.842-1.56,3.89-3.127c1.255-1.78,1.759-3.533,1.779-3.623
+				C33.507,24.924,30.161,23.647,30.128,19.784z"/>
+			<path fill="#FFFFFF" d="M26.928,10.306c0.874-1.093,1.472-2.58,1.306-4.089c-1.265,0.056-2.847,0.875-3.758,1.944
+				c-0.806,0.942-1.526,2.486-1.34,3.938C24.557,12.205,26.016,11.382,26.928,10.306z"/>
+		</g>
+	</g>
+	<g>
+		<path fill="#FFFFFF" d="M53.645,31.504h-2.271l-1.244-3.909h-4.324l-1.185,3.909h-2.211l4.284-13.308h2.646L53.645,31.504z
+			 M49.755,25.955L48.63,22.48c-0.119-0.355-0.342-1.191-0.671-2.507h-0.04c-0.131,0.566-0.342,1.402-0.632,2.507l-1.105,3.475
+			H49.755z"/>
+		<path fill="#FFFFFF" d="M64.662,26.588c0,1.632-0.441,2.922-1.323,3.869c-0.79,0.843-1.771,1.264-2.942,1.264
+			c-1.264,0-2.172-0.454-2.725-1.362h-0.04v5.055h-2.132V25.067c0-1.026-0.027-2.079-0.079-3.159h1.875l0.119,1.521h0.04
+			c0.711-1.146,1.79-1.718,3.238-1.718c1.132,0,2.077,0.447,2.833,1.342C64.284,23.949,64.662,25.127,64.662,26.588z M62.49,26.666
+			c0-0.934-0.21-1.704-0.632-2.31c-0.461-0.632-1.08-0.948-1.856-0.948c-0.526,0-1.004,0.176-1.431,0.523
+			c-0.428,0.35-0.708,0.807-0.839,1.373c-0.066,0.264-0.099,0.48-0.099,0.65v1.6c0,0.698,0.214,1.287,0.642,1.768
+			s0.984,0.721,1.668,0.721c0.803,0,1.428-0.31,1.875-0.928C62.266,28.496,62.49,27.68,62.49,26.666z"/>
+		<path fill="#FFFFFF" d="M75.699,26.588c0,1.632-0.441,2.922-1.324,3.869c-0.789,0.843-1.77,1.264-2.941,1.264
+			c-1.264,0-2.172-0.454-2.724-1.362H68.67v5.055h-2.132V25.067c0-1.026-0.027-2.079-0.079-3.159h1.875l0.119,1.521h0.04
+			c0.71-1.146,1.789-1.718,3.238-1.718c1.131,0,2.076,0.447,2.834,1.342C75.32,23.949,75.699,25.127,75.699,26.588z M73.527,26.666
+			c0-0.934-0.211-1.704-0.633-2.31c-0.461-0.632-1.078-0.948-1.855-0.948c-0.527,0-1.004,0.176-1.432,0.523
+			c-0.428,0.35-0.707,0.807-0.838,1.373c-0.065,0.264-0.099,0.48-0.099,0.65v1.6c0,0.698,0.214,1.287,0.64,1.768
+			c0.428,0.48,0.984,0.721,1.67,0.721c0.803,0,1.428-0.31,1.875-0.928C73.303,28.496,73.527,27.68,73.527,26.666z"/>
+		<path fill="#FFFFFF" d="M88.039,27.772c0,1.132-0.393,2.053-1.182,2.764c-0.867,0.777-2.074,1.165-3.625,1.165
+			c-1.432,0-2.58-0.276-3.449-0.829l0.494-1.777c0.936,0.566,1.963,0.85,3.082,0.85c0.803,0,1.428-0.182,1.877-0.544
+			c0.447-0.362,0.67-0.848,0.67-1.454c0-0.54-0.184-0.995-0.553-1.364c-0.367-0.369-0.98-0.712-1.836-1.029
+			c-2.33-0.869-3.494-2.142-3.494-3.816c0-1.094,0.408-1.991,1.225-2.689c0.814-0.699,1.9-1.048,3.258-1.048
+			c1.211,0,2.217,0.211,3.02,0.632l-0.533,1.738c-0.75-0.408-1.598-0.612-2.547-0.612c-0.75,0-1.336,0.185-1.756,0.553
+			c-0.355,0.329-0.533,0.73-0.533,1.205c0,0.526,0.203,0.961,0.611,1.303c0.355,0.316,1,0.658,1.936,1.027
+			c1.145,0.461,1.986,1,2.527,1.618C87.77,26.081,88.039,26.852,88.039,27.772z"/>
+		<path fill="#FFFFFF" d="M95.088,23.508h-2.35v4.659c0,1.185,0.414,1.777,1.244,1.777c0.381,0,0.697-0.033,0.947-0.099l0.059,1.619
+			c-0.42,0.157-0.973,0.236-1.658,0.236c-0.842,0-1.5-0.257-1.975-0.77c-0.473-0.514-0.711-1.376-0.711-2.587v-4.837h-1.4v-1.6h1.4
+			v-1.757l2.094-0.632v2.389h2.35V23.508z"/>
+		<path fill="#FFFFFF" d="M105.691,26.627c0,1.475-0.422,2.686-1.264,3.633c-0.883,0.975-2.055,1.461-3.516,1.461
+			c-1.408,0-2.529-0.467-3.365-1.401s-1.254-2.113-1.254-3.534c0-1.487,0.43-2.705,1.293-3.652c0.861-0.948,2.023-1.422,3.484-1.422
+			c1.408,0,2.541,0.467,3.396,1.402C105.283,24.021,105.691,25.192,105.691,26.627z M103.479,26.696
+			c0-0.885-0.189-1.644-0.572-2.277c-0.447-0.766-1.086-1.148-1.914-1.148c-0.857,0-1.508,0.383-1.955,1.148
+			c-0.383,0.634-0.572,1.405-0.572,2.317c0,0.885,0.189,1.644,0.572,2.276c0.461,0.766,1.105,1.148,1.936,1.148
+			c0.814,0,1.453-0.39,1.914-1.168C103.281,28.347,103.479,27.58,103.479,26.696z"/>
+		<path fill="#FFFFFF" d="M112.621,23.783c-0.211-0.039-0.436-0.059-0.672-0.059c-0.75,0-1.33,0.283-1.738,0.85
+			c-0.355,0.5-0.533,1.132-0.533,1.895v5.035h-2.131l0.02-6.574c0-1.106-0.027-2.113-0.08-3.021h1.857l0.078,1.836h0.059
+			c0.225-0.631,0.58-1.139,1.066-1.52c0.475-0.343,0.988-0.514,1.541-0.514c0.197,0,0.375,0.014,0.533,0.039V23.783z"/>
+		<path fill="#FFFFFF" d="M122.156,26.252c0,0.382-0.025,0.704-0.078,0.967h-6.396c0.025,0.948,0.334,1.673,0.928,2.173
+			c0.539,0.447,1.236,0.671,2.092,0.671c0.947,0,1.811-0.151,2.588-0.454l0.334,1.48c-0.908,0.396-1.98,0.593-3.217,0.593
+			c-1.488,0-2.656-0.438-3.506-1.313c-0.848-0.875-1.273-2.05-1.273-3.524c0-1.447,0.395-2.652,1.186-3.613
+			c0.828-1.026,1.947-1.539,3.355-1.539c1.383,0,2.43,0.513,3.141,1.539C121.873,24.047,122.156,25.055,122.156,26.252z
+			 M120.123,25.699c0.014-0.632-0.125-1.178-0.414-1.639c-0.369-0.593-0.936-0.889-1.699-0.889c-0.697,0-1.264,0.289-1.697,0.869
+			c-0.355,0.461-0.566,1.014-0.631,1.658H120.123z"/>
+	</g>
+	<g>
+		<g>
+			<path fill="#FFFFFF" d="M49.05,10.009c0,1.177-0.353,2.063-1.058,2.658c-0.653,0.549-1.581,0.824-2.783,0.824
+				c-0.596,0-1.106-0.026-1.533-0.078V6.982c0.557-0.09,1.157-0.136,1.805-0.136c1.145,0,2.008,0.249,2.59,0.747
+				C48.723,8.156,49.05,8.961,49.05,10.009z M47.945,10.038c0-0.763-0.202-1.348-0.606-1.756c-0.404-0.407-0.994-0.611-1.771-0.611
+				c-0.33,0-0.611,0.022-0.844,0.068v4.889c0.129,0.02,0.365,0.029,0.708,0.029c0.802,0,1.421-0.223,1.857-0.669
+				S47.945,10.892,47.945,10.038z"/>
+			<path fill="#FFFFFF" d="M54.909,11.037c0,0.725-0.207,1.319-0.621,1.785c-0.434,0.479-1.009,0.718-1.727,0.718
+				c-0.692,0-1.243-0.229-1.654-0.689c-0.41-0.459-0.615-1.038-0.615-1.736c0-0.73,0.211-1.329,0.635-1.794s0.994-0.698,1.712-0.698
+				c0.692,0,1.248,0.229,1.669,0.688C54.708,9.757,54.909,10.333,54.909,11.037z M53.822,11.071c0-0.435-0.094-0.808-0.281-1.119
+				c-0.22-0.376-0.533-0.564-0.94-0.564c-0.421,0-0.741,0.188-0.961,0.564c-0.188,0.311-0.281,0.69-0.281,1.138
+				c0,0.435,0.094,0.808,0.281,1.119c0.227,0.376,0.543,0.564,0.951,0.564c0.4,0,0.714-0.191,0.94-0.574
+				C53.725,11.882,53.822,11.506,53.822,11.071z"/>
+			<path fill="#FFFFFF" d="M62.765,8.719l-1.475,4.714h-0.96l-0.611-2.047c-0.155-0.511-0.281-1.019-0.379-1.523h-0.019
+				c-0.091,0.518-0.217,1.025-0.379,1.523l-0.649,2.047h-0.971l-1.387-4.714h1.077l0.533,2.241c0.129,0.53,0.235,1.035,0.32,1.513
+				h0.019c0.078-0.394,0.207-0.896,0.389-1.503l0.669-2.25h0.854l0.641,2.202c0.155,0.537,0.281,1.054,0.378,1.552h0.029
+				c0.071-0.485,0.178-1.002,0.32-1.552l0.572-2.202H62.765z"/>
+			<path fill="#FFFFFF" d="M68.198,13.433H67.15v-2.7c0-0.832-0.316-1.248-0.95-1.248c-0.311,0-0.562,0.114-0.757,0.343
+				c-0.193,0.229-0.291,0.499-0.291,0.808v2.796h-1.048v-3.366c0-0.414-0.013-0.863-0.038-1.349h0.921l0.049,0.737h0.029
+				c0.122-0.229,0.304-0.418,0.543-0.569c0.284-0.176,0.602-0.265,0.95-0.265c0.44,0,0.806,0.142,1.097,0.427
+				c0.362,0.349,0.543,0.87,0.543,1.562V13.433z"/>
+			<path fill="#FFFFFF" d="M71.088,13.433h-1.047V6.556h1.047V13.433z"/>
+			<path fill="#FFFFFF" d="M77.258,11.037c0,0.725-0.207,1.319-0.621,1.785c-0.434,0.479-1.01,0.718-1.727,0.718
+				c-0.693,0-1.244-0.229-1.654-0.689c-0.41-0.459-0.615-1.038-0.615-1.736c0-0.73,0.211-1.329,0.635-1.794s0.994-0.698,1.711-0.698
+				c0.693,0,1.248,0.229,1.67,0.688C77.057,9.757,77.258,10.333,77.258,11.037z M76.17,11.071c0-0.435-0.094-0.808-0.281-1.119
+				c-0.219-0.376-0.533-0.564-0.939-0.564c-0.422,0-0.742,0.188-0.961,0.564c-0.188,0.311-0.281,0.69-0.281,1.138
+				c0,0.435,0.094,0.808,0.281,1.119c0.227,0.376,0.543,0.564,0.951,0.564c0.4,0,0.713-0.191,0.939-0.574
+				C76.074,11.882,76.17,11.506,76.17,11.071z"/>
+			<path fill="#FFFFFF" d="M82.33,13.433h-0.941l-0.078-0.543h-0.029c-0.322,0.433-0.781,0.65-1.377,0.65
+				c-0.445,0-0.805-0.143-1.076-0.427c-0.246-0.258-0.369-0.579-0.369-0.96c0-0.576,0.24-1.015,0.723-1.319
+				c0.482-0.304,1.16-0.453,2.033-0.446V10.3c0-0.621-0.326-0.931-0.979-0.931c-0.465,0-0.875,0.117-1.229,0.349l-0.213-0.688
+				c0.438-0.271,0.979-0.407,1.617-0.407c1.232,0,1.85,0.65,1.85,1.95v1.736C82.262,12.78,82.285,13.155,82.33,13.433z
+				 M81.242,11.813v-0.727c-1.156-0.02-1.734,0.297-1.734,0.95c0,0.246,0.066,0.43,0.201,0.553c0.135,0.123,0.307,0.184,0.512,0.184
+				c0.23,0,0.445-0.073,0.641-0.218c0.197-0.146,0.318-0.331,0.363-0.558C81.236,11.946,81.242,11.884,81.242,11.813z"/>
+			<path fill="#FFFFFF" d="M88.285,13.433h-0.93l-0.049-0.757h-0.029c-0.297,0.576-0.803,0.864-1.514,0.864
+				c-0.568,0-1.041-0.223-1.416-0.669s-0.562-1.025-0.562-1.736c0-0.763,0.203-1.381,0.611-1.853c0.395-0.44,0.879-0.66,1.455-0.66
+				c0.633,0,1.076,0.213,1.328,0.64h0.02V6.556h1.049v5.607C88.248,12.622,88.26,13.045,88.285,13.433z M87.199,11.445v-0.786
+				c0-0.136-0.01-0.246-0.029-0.33c-0.059-0.252-0.186-0.464-0.379-0.635c-0.195-0.171-0.43-0.257-0.701-0.257
+				c-0.391,0-0.697,0.155-0.922,0.466c-0.223,0.311-0.336,0.708-0.336,1.193c0,0.466,0.107,0.844,0.322,1.135
+				c0.227,0.31,0.533,0.465,0.916,0.465c0.344,0,0.619-0.129,0.828-0.388C87.1,12.069,87.199,11.781,87.199,11.445z"/>
+			<path fill="#FFFFFF" d="M97.248,11.037c0,0.725-0.207,1.319-0.621,1.785c-0.434,0.479-1.008,0.718-1.727,0.718
+				c-0.691,0-1.242-0.229-1.654-0.689c-0.41-0.459-0.615-1.038-0.615-1.736c0-0.73,0.211-1.329,0.635-1.794s0.994-0.698,1.713-0.698
+				c0.691,0,1.248,0.229,1.668,0.688C97.047,9.757,97.248,10.333,97.248,11.037z M96.162,11.071c0-0.435-0.094-0.808-0.281-1.119
+				c-0.221-0.376-0.533-0.564-0.941-0.564c-0.42,0-0.74,0.188-0.961,0.564c-0.188,0.311-0.281,0.69-0.281,1.138
+				c0,0.435,0.094,0.808,0.281,1.119c0.227,0.376,0.543,0.564,0.951,0.564c0.4,0,0.715-0.191,0.941-0.574
+				C96.064,11.882,96.162,11.506,96.162,11.071z"/>
+			<path fill="#FFFFFF" d="M102.883,13.433h-1.047v-2.7c0-0.832-0.316-1.248-0.951-1.248c-0.311,0-0.562,0.114-0.756,0.343
+				s-0.291,0.499-0.291,0.808v2.796h-1.049v-3.366c0-0.414-0.012-0.863-0.037-1.349h0.92l0.049,0.737h0.029
+				c0.123-0.229,0.305-0.418,0.543-0.569c0.285-0.176,0.602-0.265,0.951-0.265c0.439,0,0.805,0.142,1.096,0.427
+				c0.363,0.349,0.543,0.87,0.543,1.562V13.433z"/>
+			<path fill="#FFFFFF" d="M109.936,9.504h-1.154v2.29c0,0.582,0.205,0.873,0.611,0.873c0.188,0,0.344-0.016,0.467-0.049
+				l0.027,0.795c-0.207,0.078-0.479,0.117-0.814,0.117c-0.414,0-0.736-0.126-0.969-0.378c-0.234-0.252-0.35-0.676-0.35-1.271V9.504
+				h-0.689V8.719h0.689V7.855l1.027-0.31v1.173h1.154V9.504z"/>
+			<path fill="#FFFFFF" d="M115.484,13.433h-1.049v-2.68c0-0.845-0.316-1.268-0.949-1.268c-0.486,0-0.818,0.245-1,0.735
+				c-0.031,0.103-0.049,0.229-0.049,0.377v2.835h-1.047V6.556h1.047v2.841h0.02c0.33-0.517,0.803-0.775,1.416-0.775
+				c0.434,0,0.793,0.142,1.078,0.427c0.355,0.355,0.533,0.883,0.533,1.581V13.433z"/>
+			<path fill="#FFFFFF" d="M121.207,10.853c0,0.188-0.014,0.346-0.039,0.475h-3.143c0.014,0.466,0.164,0.821,0.455,1.067
+				c0.266,0.22,0.609,0.33,1.029,0.33c0.465,0,0.889-0.074,1.271-0.223l0.164,0.728c-0.447,0.194-0.973,0.291-1.582,0.291
+				c-0.73,0-1.305-0.215-1.721-0.645c-0.418-0.43-0.625-1.007-0.625-1.731c0-0.711,0.193-1.303,0.582-1.775
+				c0.406-0.504,0.955-0.756,1.648-0.756c0.678,0,1.193,0.252,1.541,0.756C121.068,9.77,121.207,10.265,121.207,10.853z
+				 M120.207,10.582c0.008-0.311-0.061-0.579-0.203-0.805c-0.182-0.291-0.459-0.437-0.834-0.437c-0.342,0-0.621,0.142-0.834,0.427
+				c-0.174,0.227-0.277,0.498-0.311,0.815H120.207z"/>
+		</g>
+	</g>
+</g>
+</svg>
--- a/themes/black/client/src/img/stores/googleplay-badge.svg
+++ b/themes/black/client/src/img/stores/googleplay-badge.svg
@ -0,0 +1,429 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   xml:space="preserve"
+   width="135.71649"
+   height="40.018951"
+   viewBox="0 0 135.71649 40.018951"
+   sodipodi:docname="google-play-badge.svg"><metadata
+     id="metadata8"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+     id="defs6"><linearGradient
+       x1="31.7997"
+       y1="183.2903"
+       x2="15.0173"
+       y2="166.5079"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.8,0,0,-0.8,0,161.6)"
+       spreadMethod="pad"
+       id="linearGradient50"><stop
+         style="stop-opacity:1;stop-color:#00a0ff"
+         offset="0"
+         id="stop52" /><stop
+         style="stop-opacity:1;stop-color:#00a1ff"
+         offset="0.0066"
+         id="stop54" /><stop
+         style="stop-opacity:1;stop-color:#00beff"
+         offset="0.2601"
+         id="stop56" /><stop
+         style="stop-opacity:1;stop-color:#00d2ff"
+         offset="0.5122"
+         id="stop58" /><stop
+         style="stop-opacity:1;stop-color:#00dfff"
+         offset="0.7604"
+         id="stop60" /><stop
+         style="stop-opacity:1;stop-color:#00e3ff"
+         offset="1"
+         id="stop62" /></linearGradient><linearGradient
+       x1="43.8344"
+       y1="171.9986"
+       x2="19.637501"
+       y2="171.9986"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.8,0,0,-0.8,0,161.6)"
+       spreadMethod="pad"
+       id="linearGradient68"><stop
+         style="stop-opacity:1;stop-color:#ffe000"
+         offset="0"
+         id="stop70" /><stop
+         style="stop-opacity:1;stop-color:#ffbd00"
+         offset="0.4087"
+         id="stop72" /><stop
+         style="stop-opacity:1;stop-color:#ffa500"
+         offset="0.7754"
+         id="stop74" /><stop
+         style="stop-opacity:1;stop-color:#ff9c00"
+         offset="1"
+         id="stop76" /></linearGradient><linearGradient
+       x1="34.827"
+       y1="169.7039"
+       x2="12.0687"
+       y2="146.9456"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.8,0,0,-0.8,0,161.6)"
+       spreadMethod="pad"
+       id="linearGradient82"><stop
+         style="stop-opacity:1;stop-color:#ff3a44"
+         offset="0"
+         id="stop84" /><stop
+         style="stop-opacity:1;stop-color:#c31162"
+         offset="1"
+         id="stop86" /></linearGradient><linearGradient
+       x1="17.2973"
+       y1="191.82381"
+       x2="27.4599"
+       y2="181.6613"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.8,0,0,-0.8,0,161.6)"
+       spreadMethod="pad"
+       id="linearGradient92"><stop
+         style="stop-opacity:1;stop-color:#32a071"
+         offset="0"
+         id="stop94" /><stop
+         style="stop-opacity:1;stop-color:#2da771"
+         offset="0.0685"
+         id="stop96" /><stop
+         style="stop-opacity:1;stop-color:#15cf74"
+         offset="0.4762"
+         id="stop98" /><stop
+         style="stop-opacity:1;stop-color:#06e775"
+         offset="0.8009"
+         id="stop100" /><stop
+         style="stop-opacity:1;stop-color:#00f076"
+         offset="1"
+         id="stop102" /></linearGradient><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath110"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path112"
+         inkscape:connector-curvature="0" /></clipPath><mask
+       maskUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="1"
+       height="1"
+       id="mask114"><g
+         id="g116"><g
+           clip-path="url(#clipPath110)"
+           id="g118"><path
+             d="M 0,0 124,0 124,48 0,48 0,0 Z"
+             style="fill:#000000;fill-opacity:0.2;fill-rule:nonzero;stroke:none"
+             id="path120"
+             inkscape:connector-curvature="0" /></g></g></mask><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath126"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path128"
+         inkscape:connector-curvature="0" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath130"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path132"
+         inkscape:connector-curvature="0" /></clipPath><pattern
+       patternTransform="matrix(1,0,0,-1,0,48)"
+       patternUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="124"
+       height="48"
+       id="pattern134"><g
+         id="g136" /><g
+         id="g138"><g
+           clip-path="url(#clipPath130)"
+           id="g140"><g
+             id="g142"><path
+               d="M 29.625,20.695 18.012,14.098 C 17.363,13.727 16.781,13.754 16.406,14.09 l -0.058,-0.063 0.058,-0.058 c 0.375,-0.336 0.957,-0.36 1.606,0.011 l 11.687,6.641 -0.074,0.074 z"
+               style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"
+               id="path144" /></g></g></g></pattern><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath158"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path160"
+         inkscape:connector-curvature="0" /></clipPath><mask
+       maskUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="1"
+       height="1"
+       id="mask162"><g
+         id="g164"><g
+           clip-path="url(#clipPath158)"
+           id="g166"><path
+             d="M 0,0 124,0 124,48 0,48 0,0 Z"
+             style="fill:#000000;fill-opacity:0.12000002;fill-rule:nonzero;stroke:none"
+             id="path168"
+             inkscape:connector-curvature="0" /></g></g></mask><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath174"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path176"
+         inkscape:connector-curvature="0" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath178"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path180"
+         inkscape:connector-curvature="0" /></clipPath><pattern
+       patternTransform="matrix(1,0,0,-1,0,48)"
+       patternUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="124"
+       height="48"
+       id="pattern182"><g
+         id="g184" /><g
+         id="g186"><g
+           clip-path="url(#clipPath178)"
+           id="g188"><g
+             id="g190"><path
+               d="m 16.348,14.145 c -0.235,0.246 -0.371,0.628 -0.371,1.125 l 0,-0.118 c 0,-0.496 0.136,-0.879 0.371,-1.125 l 0.058,0.063 -0.058,0.055 z"
+               style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"
+               id="path192" /></g></g></g></pattern><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath206"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path208"
+         inkscape:connector-curvature="0" /></clipPath><mask
+       maskUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="1"
+       height="1"
+       id="mask210"><g
+         id="g212"><g
+           clip-path="url(#clipPath206)"
+           id="g214"><path
+             d="M 0,0 124,0 124,48 0,48 0,0 Z"
+             style="fill:#000000;fill-opacity:0.12000002;fill-rule:nonzero;stroke:none"
+             id="path216"
+             inkscape:connector-curvature="0" /></g></g></mask><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath222"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path224"
+         inkscape:connector-curvature="0" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath226"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path228"
+         inkscape:connector-curvature="0" /></clipPath><pattern
+       patternTransform="matrix(1,0,0,-1,0,48)"
+       patternUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="124"
+       height="48"
+       id="pattern230"><g
+         id="g232" /><g
+         id="g234"><g
+           clip-path="url(#clipPath226)"
+           id="g236"><g
+             id="g238"><path
+               d="m 33.613,22.961 -3.988,-2.266 0.074,-0.074 3.914,2.223 c 0.559,0.316 0.836,0.734 0.836,1.156 -0.047,-0.379 -0.332,-0.75 -0.836,-1.039 z"
+               style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"
+               id="path240" /></g></g></g></pattern><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath254"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path256"
+         inkscape:connector-curvature="0" /></clipPath><mask
+       maskUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="1"
+       height="1"
+       id="mask258"><g
+         id="g260"><g
+           clip-path="url(#clipPath254)"
+           id="g262"><path
+             d="M 0,0 124,0 124,48 0,48 0,0 Z"
+             style="fill:#000000;fill-opacity:0.25;fill-rule:nonzero;stroke:none"
+             id="path264"
+             inkscape:connector-curvature="0" /></g></g></mask><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath270"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path272"
+         inkscape:connector-curvature="0" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath274"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path276"
+         inkscape:connector-curvature="0" /></clipPath><pattern
+       patternTransform="matrix(1,0,0,-1,0,48)"
+       patternUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="124"
+       height="48"
+       id="pattern278"><g
+         id="g280" /><g
+         id="g282"><g
+           clip-path="url(#clipPath274)"
+           id="g284"><g
+             id="g286"><path
+               d="m 18.012,33.902 15.601,-8.863 c 0.508,-0.289 0.789,-0.66 0.836,-1.039 0,0.418 -0.277,0.836 -0.836,1.156 L 18.012,34.02 c -1.117,0.632 -2.035,0.105 -2.035,-1.176 l 0,-0.114 c 0,1.278 0.918,1.805 2.035,1.172 z"
+               style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+               id="path288" /></g></g></g></pattern></defs><sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1366"
+     inkscape:window-height="705"
+     id="namedview4"
+     showgrid="false"
+     inkscape:zoom="7.6276974"
+     inkscape:cx="93.965168"
+     inkscape:cy="29.61582"
+     inkscape:window-x="-8"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g10" /><g
+     id="g10"
+     inkscape:groupmode="layer"
+     inkscape:label="google-play-badge"
+     transform="matrix(1.25,0,0,-1.25,-9.4247625,49.85025)"><g
+       id="g12"
+       transform="matrix(1.0023923,0,0,0.99072975,-0.29664807,0)"><path
+         d="M 112,8 12,8 C 9.801,8 8,9.801 8,12 l 0,24 c 0,2.199 1.801,4 4,4 l 100,0 c 2.199,0 4,-1.801 4,-4 l 0,-24 c 0,-2.199 -1.801,-4 -4,-4 z"
+         style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path14"
+         inkscape:connector-curvature="0" /><path
+         d="m 112,39.359 c 1.852,0 3.359,-1.507 3.359,-3.359 l 0,-24 c 0,-1.852 -1.507,-3.359 -3.359,-3.359 l -100,0 c -1.852,0 -3.359,1.507 -3.359,3.359 l 0,24 c 0,1.852 1.507,3.359 3.359,3.359 l 100,0 M 112,40 12,40 C 9.801,40 8,38.199 8,36 L 8,12 C 8,9.801 9.801,8 12,8 l 100,0 c 2.199,0 4,1.801 4,4 l 0,24 c 0,2.199 -1.801,4 -4,4 z"
+         style="fill:#a6a6a6;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path16"
+         inkscape:connector-curvature="0" /><g
+         id="g18"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 45.934,16.195 c 0,0.668 -0.2,1.203 -0.594,1.602 -0.453,0.473 -1.043,0.711 -1.766,0.711 -0.691,0 -1.281,-0.242 -1.765,-0.719 -0.485,-0.484 -0.727,-1.078 -0.727,-1.789 0,-0.711 0.242,-1.305 0.727,-1.785 0.484,-0.481 1.074,-0.723 1.765,-0.723 0.344,0 0.672,0.071 0.985,0.203 0.312,0.133 0.566,0.313 0.75,0.535 l -0.418,0.422 c -0.321,-0.379 -0.758,-0.566 -1.317,-0.566 -0.504,0 -0.941,0.176 -1.312,0.531 -0.367,0.356 -0.551,0.817 -0.551,1.383 0,0.566 0.184,1.031 0.551,1.387 0.371,0.351 0.808,0.531 1.312,0.531 0.535,0 0.985,-0.18 1.34,-0.535 0.234,-0.235 0.367,-0.559 0.402,-0.973 l -1.742,0 0,-0.578 2.324,0 c 0.028,0.125 0.036,0.246 0.036,0.363 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path20"
+           inkscape:connector-curvature="0" /></g><g
+         id="g22"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 49.621,14.191 -2.183,0 0,1.52 1.968,0 0,0.578 -1.968,0 0,1.52 2.183,0 0,0.589 -2.801,0 0,-4.796 2.801,0 0,0.589 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path24"
+           inkscape:connector-curvature="0" /></g><g
+         id="g26"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 52.223,18.398 -0.618,0 0,-4.207 -1.339,0 0,-0.589 3.297,0 0,0.589 -1.34,0 0,4.207 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path28"
+           inkscape:connector-curvature="0" /></g><g
+         id="g30"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 55.949,18.398 0,-4.796 0.617,0 0,4.796 -0.617,0 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path32"
+           inkscape:connector-curvature="0" /></g><g
+         id="g34"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 59.301,18.398 -0.613,0 0,-4.207 -1.344,0 0,-0.589 3.301,0 0,0.589 -1.344,0 0,4.207 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path36"
+           inkscape:connector-curvature="0" /></g><g
+         id="g38"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 66.887,17.781 c -0.473,0.485 -1.059,0.727 -1.758,0.727 -0.703,0 -1.289,-0.242 -1.762,-0.727 C 62.895,17.297 62.66,16.703 62.66,16 c 0,-0.703 0.235,-1.297 0.707,-1.781 0.473,-0.485 1.059,-0.727 1.762,-0.727 0.695,0 1.281,0.242 1.754,0.731 0.476,0.488 0.711,1.078 0.711,1.777 0,0.703 -0.235,1.297 -0.707,1.781 z m -3.063,-0.402 c 0.356,0.359 0.789,0.539 1.305,0.539 0.512,0 0.949,-0.18 1.301,-0.539 0.355,-0.359 0.535,-0.82 0.535,-1.379 0,-0.559 -0.18,-1.02 -0.535,-1.379 -0.352,-0.359 -0.789,-0.539 -1.301,-0.539 -0.516,0 -0.949,0.18 -1.305,0.539 -0.355,0.359 -0.535,0.82 -0.535,1.379 0,0.559 0.18,1.02 0.535,1.379 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path40"
+           inkscape:connector-curvature="0" /></g><g
+         id="g42"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 68.461,18.398 0,-4.796 0.75,0 2.332,3.73 0.027,0 -0.027,-0.922 0,-2.808 0.617,0 0,4.796 -0.644,0 -2.442,-3.914 -0.027,0 0.027,0.926 0,2.988 -0.613,0 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path44"
+           inkscape:connector-curvature="0" /></g><path
+         d="m 62.508,22.598 c -1.879,0 -3.414,-1.43 -3.414,-3.403 0,-1.957 1.535,-3.402 3.414,-3.402 1.883,0 3.418,1.445 3.418,3.402 0,1.973 -1.535,3.403 -3.418,3.403 z m 0,-5.465 c -1.031,0 -1.918,0.851 -1.918,2.062 0,1.227 0.887,2.063 1.918,2.063 1.031,0 1.922,-0.836 1.922,-2.063 0,-1.211 -0.891,-2.062 -1.922,-2.062 z m -7.449,5.465 c -1.883,0 -3.414,-1.43 -3.414,-3.403 0,-1.957 1.531,-3.402 3.414,-3.402 1.882,0 3.414,1.445 3.414,3.402 0,1.973 -1.532,3.403 -3.414,3.403 z m 0,-5.465 c -1.032,0 -1.922,0.851 -1.922,2.062 0,1.227 0.89,2.063 1.922,2.063 1.031,0 1.918,-0.836 1.918,-2.063 0,-1.211 -0.887,-2.062 -1.918,-2.062 z m -8.864,4.422 0,-1.446 3.453,0 c -0.101,-0.808 -0.371,-1.402 -0.785,-1.816 -0.504,-0.5 -1.289,-1.055 -2.668,-1.055 -2.125,0 -3.789,1.715 -3.789,3.84 0,2.125 1.664,3.84 3.789,3.84 1.149,0 1.985,-0.449 2.602,-1.031 l 1.019,1.019 c -0.863,0.824 -2.011,1.457 -3.621,1.457 -2.914,0 -5.363,-2.371 -5.363,-5.285 0,-2.914 2.449,-5.285 5.363,-5.285 1.575,0 2.758,0.516 3.688,1.484 0.953,0.953 1.25,2.293 1.25,3.375 0,0.336 -0.028,0.645 -0.078,0.903 l -4.86,0 z m 36.246,-1.121 c -0.281,0.761 -1.148,2.164 -2.914,2.164 -1.75,0 -3.207,-1.379 -3.207,-3.403 0,-1.906 1.442,-3.402 3.375,-3.402 1.563,0 2.465,0.953 2.836,1.508 l -1.16,0.773 c -0.387,-0.566 -0.914,-0.941 -1.676,-0.941 -0.757,0 -1.3,0.347 -1.648,1.031 l 4.551,1.883 -0.157,0.387 z m -4.64,-1.133 c -0.039,1.312 1.019,1.984 1.777,1.984 0.594,0 1.098,-0.297 1.266,-0.722 L 77.801,19.301 Z M 74.102,16 l 1.496,0 0,10 -1.496,0 0,-10 z m -2.45,5.84 -0.05,0 c -0.336,0.398 -0.977,0.758 -1.789,0.758 -1.704,0 -3.262,-1.496 -3.262,-3.414 0,-1.907 1.558,-3.391 3.262,-3.391 0.812,0 1.453,0.363 1.789,0.773 l 0.05,0 0,-0.488 c 0,-1.301 -0.695,-2 -1.816,-2 -0.914,0 -1.481,0.66 -1.715,1.215 L 66.82,14.75 c 0.375,-0.902 1.368,-2.012 3.016,-2.012 1.754,0 3.234,1.032 3.234,3.543 l 0,6.11 -1.418,0 0,-0.551 z m -1.711,-4.707 c -1.031,0 -1.894,0.863 -1.894,2.051 0,1.199 0.863,2.074 1.894,2.074 1.016,0 1.817,-0.875 1.817,-2.074 0,-1.188 -0.801,-2.051 -1.817,-2.051 z M 89.445,26 l -3.578,0 0,-10 1.492,0 0,3.789 2.086,0 c 1.657,0 3.282,1.199 3.282,3.106 0,1.906 -1.629,3.105 -3.282,3.105 z m 0.039,-4.82 -2.125,0 0,3.429 2.125,0 c 1.114,0 1.75,-0.925 1.75,-1.714 0,-0.774 -0.636,-1.715 -1.75,-1.715 z m 9.223,1.437 c -1.078,0 -2.199,-0.476 -2.66,-1.531 l 1.324,-0.555 c 0.285,0.555 0.809,0.735 1.363,0.735 0.774,0 1.559,-0.465 1.571,-1.286 l 0,-0.105 c -0.27,0.156 -0.848,0.387 -1.559,0.387 -1.426,0 -2.879,-0.785 -2.879,-2.25 0,-1.34 1.168,-2.203 2.481,-2.203 1.004,0 1.558,0.453 1.906,0.98 l 0.051,0 0,-0.773 1.441,0 0,3.836 c 0,1.773 -1.324,2.765 -3.039,2.765 z m -0.18,-5.48 c -0.488,0 -1.168,0.242 -1.168,0.847 0,0.774 0.848,1.071 1.582,1.071 0.657,0 0.965,-0.145 1.364,-0.336 -0.117,-0.926 -0.914,-1.582 -1.778,-1.582 z m 8.469,5.261 -1.715,-4.335 -0.051,0 -1.773,4.335 -1.609,0 2.664,-6.058 -1.52,-3.371 1.559,0 4.105,9.429 -1.66,0 z M 93.547,16 l 1.496,0 0,10 -1.496,0 0,-10 z"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path46"
+         inkscape:connector-curvature="0" /><g
+         id="g48"><path
+           d="M 16.348,33.969 C 16.113,33.723 15.977,33.34 15.977,32.844 l 0,-17.692 c 0,-0.496 0.136,-0.879 0.371,-1.125 l 0.058,-0.054 9.914,9.91 0,0.234 -9.914,9.91 -0.058,-0.058 z"
+           style="fill:url(#linearGradient50);fill-opacity:1;fill-rule:nonzero;stroke:none"
+           id="path64"
+           inkscape:connector-curvature="0" /></g><g
+         id="g66"><path
+           d="m 29.621,20.578 -3.301,3.305 0,0.234 3.305,3.305 0.074,-0.043 3.914,-2.227 c 1.117,-0.632 1.117,-1.672 0,-2.308 l -3.914,-2.223 -0.078,-0.043 z"
+           style="fill:url(#linearGradient68);fill-opacity:1;fill-rule:nonzero;stroke:none"
+           id="path78"
+           inkscape:connector-curvature="0" /></g><g
+         id="g80"><path
+           d="M 29.699,20.621 26.32,24 16.348,14.027 c 0.371,-0.39 0.976,-0.437 1.664,-0.047 l 11.687,6.641"
+           style="fill:url(#linearGradient82);fill-opacity:1;fill-rule:nonzero;stroke:none"
+           id="path88"
+           inkscape:connector-curvature="0" /></g><g
+         id="g90"><path
+           d="M 29.699,27.379 18.012,34.02 c -0.688,0.386 -1.293,0.339 -1.664,-0.051 L 26.32,24 l 3.379,3.379 z"
+           style="fill:url(#linearGradient92);fill-opacity:1;fill-rule:nonzero;stroke:none"
+           id="path104"
+           inkscape:connector-curvature="0" /></g><g
+         id="g106"><g
+           id="g108" /><g
+           id="g122"
+           mask="url(#mask114)"><g
+             id="g124" /><g
+             id="g146"><g
+               clip-path="url(#clipPath126)"
+               id="g148"><g
+                 id="g150"><path
+                   d="M 0,0 124,0 124,48 0,48 0,0 Z"
+                   style="fill:url(#pattern134);fill-opacity:1;fill-rule:nonzero;stroke:none"
+                   id="path152"
+                   inkscape:connector-curvature="0" /></g></g></g></g></g><g
+         id="g154"><g
+           id="g156" /><g
+           id="g170"
+           mask="url(#mask162)"><g
+             id="g172" /><g
+             id="g194"><g
+               clip-path="url(#clipPath174)"
+               id="g196"><g
+                 id="g198"><path
+                   d="M 0,0 124,0 124,48 0,48 0,0 Z"
+                   style="fill:url(#pattern182);fill-opacity:1;fill-rule:nonzero;stroke:none"
+                   id="path200"
+                   inkscape:connector-curvature="0" /></g></g></g></g></g><g
+         id="g202"><g
+           id="g204" /><g
+           id="g218"
+           mask="url(#mask210)"><g
+             id="g220" /><g
+             id="g242"><g
+               clip-path="url(#clipPath222)"
+               id="g244"><g
+                 id="g246"><path
+                   d="M 0,0 124,0 124,48 0,48 0,0 Z"
+                   style="fill:url(#pattern230);fill-opacity:1;fill-rule:nonzero;stroke:none"
+                   id="path248"
+                   inkscape:connector-curvature="0" /></g></g></g></g></g><g
+         id="g250"><g
+           id="g252" /><g
+           id="g266"
+           mask="url(#mask258)"><g
+             id="g268" /><g
+             id="g290"><g
+               clip-path="url(#clipPath270)"
+               id="g292"><g
+                 id="g294"><path
+                   d="M 0,0 124,0 124,48 0,48 0,0 Z"
+                   style="fill:url(#pattern278);fill-opacity:1;fill-rule:nonzero;stroke:none"
+                   id="path296"
+                   inkscape:connector-curvature="0" /></g></g></g></g></g></g></g></svg>
--- a/themes/black/client/src/img/success.png
+++ b/themes/black/client/src/img/success.png
--- a/themes/black/client/src/img/user.png
+++ b/themes/black/client/src/img/user.png
--- a/themes/black/client/src/img/warning.png
+++ b/themes/black/client/src/img/warning.png
--- a/themes/black/client/src/thirdparties/qrcode.min.js
+++ b/themes/black/client/src/thirdparties/qrcode.min.js
--- a/themes/black/client/src/thirdparties/u2f-api.js
+++ b/themes/black/client/src/thirdparties/u2f-api.js
@ -0,0 +1,749 @@
+//Copyright 2014-2015 Google Inc. All rights reserved.
+
+//Use of this source code is governed by a BSD-style
+//license that can be found in the LICENSE file or at
+//https://developers.google.com/open-source/licenses/bsd
+
+/**
+ * @fileoverview The U2F api.
+ */
+'use strict';
+
+
+/**
+ * Namespace for the U2F api.
+ * @type {Object}
+ */
+var u2f = u2f || {};
+
+/**
+ * FIDO U2F Javascript API Version
+ * @number
+ */
+var js_api_version;
+
+/**
+ * The U2F extension id
+ * @const {string}
+ */
+// The Chrome packaged app extension ID.
+// Uncomment this if you want to deploy a server instance that uses
+// the package Chrome app and does not require installing the U2F Chrome extension.
+ u2f.EXTENSION_ID = 'kmendfapggjehodndflmmgagdbamhnfd';
+// The U2F Chrome extension ID.
+// Uncomment this if you want to deploy a server instance that uses
+// the U2F Chrome extension to authenticate.
+// u2f.EXTENSION_ID = 'pfboblefjcgdjicmnffhdgionmgcdmne';
+
+
+/**
+ * Message types for messsages to/from the extension
+ * @const
+ * @enum {string}
+ */
+u2f.MessageTypes = {
+    'U2F_REGISTER_REQUEST': 'u2f_register_request',
+    'U2F_REGISTER_RESPONSE': 'u2f_register_response',
+    'U2F_SIGN_REQUEST': 'u2f_sign_request',
+    'U2F_SIGN_RESPONSE': 'u2f_sign_response',
+    'U2F_GET_API_VERSION_REQUEST': 'u2f_get_api_version_request',
+    'U2F_GET_API_VERSION_RESPONSE': 'u2f_get_api_version_response'
+};
+
+
+/**
+ * Response status codes
+ * @const
+ * @enum {number}
+ */
+u2f.ErrorCodes = {
+    'OK': 0,
+    'OTHER_ERROR': 1,
+    'BAD_REQUEST': 2,
+    'CONFIGURATION_UNSUPPORTED': 3,
+    'DEVICE_INELIGIBLE': 4,
+    'TIMEOUT': 5
+};
+
+
+/**
+ * A message for registration requests
+ * @typedef {{
+ *   type: u2f.MessageTypes,
+ *   appId: ?string,
+ *   timeoutSeconds: ?number,
+ *   requestId: ?number
+ * }}
+ */
+u2f.U2fRequest;
+
+
+/**
+ * A message for registration responses
+ * @typedef {{
+ *   type: u2f.MessageTypes,
+ *   responseData: (u2f.Error | u2f.RegisterResponse | u2f.SignResponse),
+ *   requestId: ?number
+ * }}
+ */
+u2f.U2fResponse;
+
+
+/**
+ * An error object for responses
+ * @typedef {{
+ *   errorCode: u2f.ErrorCodes,
+ *   errorMessage: ?string
+ * }}
+ */
+u2f.Error;
+
+/**
+ * Data object for a single sign request.
+ * @typedef {enum {BLUETOOTH_RADIO, BLUETOOTH_LOW_ENERGY, USB, NFC}}
+ */
+u2f.Transport;
+
+
+/**
+ * Data object for a single sign request.
+ * @typedef {Array<u2f.Transport>}
+ */
+u2f.Transports;
+
+/**
+ * Data object for a single sign request.
+ * @typedef {{
+ *   version: string,
+ *   challenge: string,
+ *   keyHandle: string,
+ *   appId: string
+ * }}
+ */
+u2f.SignRequest;
+
+
+/**
+ * Data object for a sign response.
+ * @typedef {{
+ *   keyHandle: string,
+ *   signatureData: string,
+ *   clientData: string
+ * }}
+ */
+u2f.SignResponse;
+
+
+/**
+ * Data object for a registration request.
+ * @typedef {{
+ *   version: string,
+ *   challenge: string
+ * }}
+ */
+u2f.RegisterRequest;
+
+
+/**
+ * Data object for a registration response.
+ * @typedef {{
+ *   version: string,
+ *   keyHandle: string,
+ *   transports: Transports,
+ *   appId: string
+ * }}
+ */
+u2f.RegisterResponse;
+
+
+/**
+ * Data object for a registered key.
+ * @typedef {{
+ *   version: string,
+ *   keyHandle: string,
+ *   transports: ?Transports,
+ *   appId: ?string
+ * }}
+ */
+u2f.RegisteredKey;
+
+
+/**
+ * Data object for a get API register response.
+ * @typedef {{
+ *   js_api_version: number
+ * }}
+ */
+u2f.GetJsApiVersionResponse;
+
+
+//Low level MessagePort API support
+
+/**
+ * Sets up a MessagePort to the U2F extension using the
+ * available mechanisms.
+ * @param {function((MessagePort|u2f.WrappedChromeRuntimePort_))} callback
+ */
+u2f.getMessagePort = function(callback) {
+  if (typeof chrome != 'undefined' && chrome.runtime) {
+    // The actual message here does not matter, but we need to get a reply
+    // for the callback to run. Thus, send an empty signature request
+    // in order to get a failure response.
+    var msg = {
+        type: u2f.MessageTypes.U2F_SIGN_REQUEST,
+        signRequests: []
+    };
+    chrome.runtime.sendMessage(u2f.EXTENSION_ID, msg, function() {
+      if (!chrome.runtime.lastError) {
+        // We are on a whitelisted origin and can talk directly
+        // with the extension.
+        u2f.getChromeRuntimePort_(callback);
+      } else {
+        // chrome.runtime was available, but we couldn't message
+        // the extension directly, use iframe
+        u2f.getIframePort_(callback);
+      }
+    });
+  } else if (u2f.isAndroidChrome_()) {
+    u2f.getAuthenticatorPort_(callback);
+  } else if (u2f.isIosChrome_()) {
+    u2f.getIosPort_(callback);
+  } else {
+    // chrome.runtime was not available at all, which is normal
+    // when this origin doesn't have access to any extensions.
+    u2f.getIframePort_(callback);
+  }
+};
+
+/**
+ * Detect chrome running on android based on the browser's useragent.
+ * @private
+ */
+u2f.isAndroidChrome_ = function() {
+  var userAgent = navigator.userAgent;
+  return userAgent.indexOf('Chrome') != -1 &&
+  userAgent.indexOf('Android') != -1;
+};
+
+/**
+ * Detect chrome running on iOS based on the browser's platform.
+ * @private
+ */
+u2f.isIosChrome_ = function() {
+  return ["iPhone", "iPad", "iPod"].indexOf(navigator.platform) > -1;
+};
+
+/**
+ * Connects directly to the extension via chrome.runtime.connect.
+ * @param {function(u2f.WrappedChromeRuntimePort_)} callback
+ * @private
+ */
+u2f.getChromeRuntimePort_ = function(callback) {
+  var port = chrome.runtime.connect(u2f.EXTENSION_ID,
+      {'includeTlsChannelId': true});
+  setTimeout(function() {
+    callback(new u2f.WrappedChromeRuntimePort_(port));
+  }, 0);
+};
+
+/**
+ * Return a 'port' abstraction to the Authenticator app.
+ * @param {function(u2f.WrappedAuthenticatorPort_)} callback
+ * @private
+ */
+u2f.getAuthenticatorPort_ = function(callback) {
+  setTimeout(function() {
+    callback(new u2f.WrappedAuthenticatorPort_());
+  }, 0);
+};
+
+/**
+ * Return a 'port' abstraction to the iOS client app.
+ * @param {function(u2f.WrappedIosPort_)} callback
+ * @private
+ */
+u2f.getIosPort_ = function(callback) {
+  setTimeout(function() {
+    callback(new u2f.WrappedIosPort_());
+  }, 0);
+};
+
+/**
+ * A wrapper for chrome.runtime.Port that is compatible with MessagePort.
+ * @param {Port} port
+ * @constructor
+ * @private
+ */
+u2f.WrappedChromeRuntimePort_ = function(port) {
+  this.port_ = port;
+};
+
+/**
+ * Format and return a sign request compliant with the JS API version supported by the extension.
+ * @param {Array<u2f.SignRequest>} signRequests
+ * @param {number} timeoutSeconds
+ * @param {number} reqId
+ * @return {Object}
+ */
+u2f.formatSignRequest_ =
+  function(appId, challenge, registeredKeys, timeoutSeconds, reqId) {
+  if (js_api_version === undefined || js_api_version < 1.1) {
+    // Adapt request to the 1.0 JS API
+    var signRequests = [];
+    for (var i = 0; i < registeredKeys.length; i++) {
+      signRequests[i] = {
+          version: registeredKeys[i].version,
+          challenge: challenge,
+          keyHandle: registeredKeys[i].keyHandle,
+          appId: appId
+      };
+    }
+    return {
+      type: u2f.MessageTypes.U2F_SIGN_REQUEST,
+      signRequests: signRequests,
+      timeoutSeconds: timeoutSeconds,
+      requestId: reqId
+    };
+  }
+  // JS 1.1 API
+  return {
+    type: u2f.MessageTypes.U2F_SIGN_REQUEST,
+    appId: appId,
+    challenge: challenge,
+    registeredKeys: registeredKeys,
+    timeoutSeconds: timeoutSeconds,
+    requestId: reqId
+  };
+};
+
+/**
+ * Format and return a register request compliant with the JS API version supported by the extension..
+ * @param {Array<u2f.SignRequest>} signRequests
+ * @param {Array<u2f.RegisterRequest>} signRequests
+ * @param {number} timeoutSeconds
+ * @param {number} reqId
+ * @return {Object}
+ */
+u2f.formatRegisterRequest_ =
+  function(appId, registeredKeys, registerRequests, timeoutSeconds, reqId) {
+  if (js_api_version === undefined || js_api_version < 1.1) {
+    // Adapt request to the 1.0 JS API
+    for (var i = 0; i < registerRequests.length; i++) {
+      registerRequests[i].appId = appId;
+    }
+    var signRequests = [];
+    for (var i = 0; i < registeredKeys.length; i++) {
+      signRequests[i] = {
+          version: registeredKeys[i].version,
+          challenge: registerRequests[0],
+          keyHandle: registeredKeys[i].keyHandle,
+          appId: appId
+      };
+    }
+    return {
+      type: u2f.MessageTypes.U2F_REGISTER_REQUEST,
+      signRequests: signRequests,
+      registerRequests: registerRequests,
+      timeoutSeconds: timeoutSeconds,
+      requestId: reqId
+    };
+  }
+  // JS 1.1 API
+  return {
+    type: u2f.MessageTypes.U2F_REGISTER_REQUEST,
+    appId: appId,
+    registerRequests: registerRequests,
+    registeredKeys: registeredKeys,
+    timeoutSeconds: timeoutSeconds,
+    requestId: reqId
+  };
+};
+
+
+/**
+ * Posts a message on the underlying channel.
+ * @param {Object} message
+ */
+u2f.WrappedChromeRuntimePort_.prototype.postMessage = function(message) {
+  this.port_.postMessage(message);
+};
+
+
+/**
+ * Emulates the HTML 5 addEventListener interface. Works only for the
+ * onmessage event, which is hooked up to the chrome.runtime.Port.onMessage.
+ * @param {string} eventName
+ * @param {function({data: Object})} handler
+ */
+u2f.WrappedChromeRuntimePort_.prototype.addEventListener =
+    function(eventName, handler) {
+  var name = eventName.toLowerCase();
+  if (name == 'message' || name == 'onmessage') {
+    this.port_.onMessage.addListener(function(message) {
+      // Emulate a minimal MessageEvent object
+      handler({'data': message});
+    });
+  } else {
+    console.error('WrappedChromeRuntimePort only supports onMessage');
+  }
+};
+
+/**
+ * Wrap the Authenticator app with a MessagePort interface.
+ * @constructor
+ * @private
+ */
+u2f.WrappedAuthenticatorPort_ = function() {
+  this.requestId_ = -1;
+  this.requestObject_ = null;
+}
+
+/**
+ * Launch the Authenticator intent.
+ * @param {Object} message
+ */
+u2f.WrappedAuthenticatorPort_.prototype.postMessage = function(message) {
+  var intentUrl =
+    u2f.WrappedAuthenticatorPort_.INTENT_URL_BASE_ +
+    ';S.request=' + encodeURIComponent(JSON.stringify(message)) +
+    ';end';
+  document.location = intentUrl;
+};
+
+/**
+ * Tells what type of port this is.
+ * @return {String} port type
+ */
+u2f.WrappedAuthenticatorPort_.prototype.getPortType = function() {
+  return "WrappedAuthenticatorPort_";
+};
+
+
+/**
+ * Emulates the HTML 5 addEventListener interface.
+ * @param {string} eventName
+ * @param {function({data: Object})} handler
+ */
+u2f.WrappedAuthenticatorPort_.prototype.addEventListener = function(eventName, handler) {
+  var name = eventName.toLowerCase();
+  if (name == 'message') {
+    var self = this;
+    /* Register a callback to that executes when
+     * chrome injects the response. */
+    window.addEventListener(
+        'message', self.onRequestUpdate_.bind(self, handler), false);
+  } else {
+    console.error('WrappedAuthenticatorPort only supports message');
+  }
+};
+
+/**
+ * Callback invoked  when a response is received from the Authenticator.
+ * @param function({data: Object}) callback
+ * @param {Object} message message Object
+ */
+u2f.WrappedAuthenticatorPort_.prototype.onRequestUpdate_ =
+    function(callback, message) {
+  var messageObject = JSON.parse(message.data);
+  var intentUrl = messageObject['intentURL'];
+
+  var errorCode = messageObject['errorCode'];
+  var responseObject = null;
+  if (messageObject.hasOwnProperty('data')) {
+    responseObject = /** @type {Object} */ (
+        JSON.parse(messageObject['data']));
+  }
+
+  callback({'data': responseObject});
+};
+
+/**
+ * Base URL for intents to Authenticator.
+ * @const
+ * @private
+ */
+u2f.WrappedAuthenticatorPort_.INTENT_URL_BASE_ =
+  'intent:#Intent;action=com.google.android.apps.authenticator.AUTHENTICATE';
+
+/**
+ * Wrap the iOS client app with a MessagePort interface.
+ * @constructor
+ * @private
+ */
+u2f.WrappedIosPort_ = function() {};
+
+/**
+ * Launch the iOS client app request
+ * @param {Object} message
+ */
+u2f.WrappedIosPort_.prototype.postMessage = function(message) {
+  var str = JSON.stringify(message);
+  var url = "u2f://auth?" + encodeURI(str);
+  location.replace(url);
+};
+
+/**
+ * Tells what type of port this is.
+ * @return {String} port type
+ */
+u2f.WrappedIosPort_.prototype.getPortType = function() {
+  return "WrappedIosPort_";
+};
+
+/**
+ * Emulates the HTML 5 addEventListener interface.
+ * @param {string} eventName
+ * @param {function({data: Object})} handler
+ */
+u2f.WrappedIosPort_.prototype.addEventListener = function(eventName, handler) {
+  var name = eventName.toLowerCase();
+  if (name !== 'message') {
+    console.error('WrappedIosPort only supports message');
+  }
+};
+
+/**
+ * Sets up an embedded trampoline iframe, sourced from the extension.
+ * @param {function(MessagePort)} callback
+ * @private
+ */
+u2f.getIframePort_ = function(callback) {
+  // Create the iframe
+  var iframeOrigin = 'chrome-extension://' + u2f.EXTENSION_ID;
+  var iframe = document.createElement('iframe');
+  iframe.src = iframeOrigin + '/u2f-comms.html';
+  iframe.setAttribute('style', 'display:none');
+  document.body.appendChild(iframe);
+
+  var channel = new MessageChannel();
+  var ready = function(message) {
+    if (message.data == 'ready') {
+      channel.port1.removeEventListener('message', ready);
+      callback(channel.port1);
+    } else {
+      console.error('First event on iframe port was not "ready"');
+    }
+  };
+  channel.port1.addEventListener('message', ready);
+  channel.port1.start();
+
+  iframe.addEventListener('load', function() {
+    // Deliver the port to the iframe and initialize
+    iframe.contentWindow.postMessage('init', iframeOrigin, [channel.port2]);
+  });
+};
+
+
+//High-level JS API
+
+/**
+ * Default extension response timeout in seconds.
+ * @const
+ */
+u2f.EXTENSION_TIMEOUT_SEC = 30;
+
+/**
+ * A singleton instance for a MessagePort to the extension.
+ * @type {MessagePort|u2f.WrappedChromeRuntimePort_}
+ * @private
+ */
+u2f.port_ = null;
+
+/**
+ * Callbacks waiting for a port
+ * @type {Array<function((MessagePort|u2f.WrappedChromeRuntimePort_))>}
+ * @private
+ */
+u2f.waitingForPort_ = [];
+
+/**
+ * A counter for requestIds.
+ * @type {number}
+ * @private
+ */
+u2f.reqCounter_ = 0;
+
+/**
+ * A map from requestIds to client callbacks
+ * @type {Object.<number,(function((u2f.Error|u2f.RegisterResponse))
+ *                       |function((u2f.Error|u2f.SignResponse)))>}
+ * @private
+ */
+u2f.callbackMap_ = {};
+
+/**
+ * Creates or retrieves the MessagePort singleton to use.
+ * @param {function((MessagePort|u2f.WrappedChromeRuntimePort_))} callback
+ * @private
+ */
+u2f.getPortSingleton_ = function(callback) {
+  if (u2f.port_) {
+    callback(u2f.port_);
+  } else {
+    if (u2f.waitingForPort_.length == 0) {
+      u2f.getMessagePort(function(port) {
+        u2f.port_ = port;
+        u2f.port_.addEventListener('message',
+            /** @type {function(Event)} */ (u2f.responseHandler_));
+
+        // Careful, here be async callbacks. Maybe.
+        while (u2f.waitingForPort_.length)
+          u2f.waitingForPort_.shift()(u2f.port_);
+      });
+    }
+    u2f.waitingForPort_.push(callback);
+  }
+};
+
+/**
+ * Handles response messages from the extension.
+ * @param {MessageEvent.<u2f.Response>} message
+ * @private
+ */
+u2f.responseHandler_ = function(message) {
+  var response = message.data;
+  var reqId = response['requestId'];
+  if (!reqId || !u2f.callbackMap_[reqId]) {
+    console.error('Unknown or missing requestId in response.');
+    return;
+  }
+  var cb = u2f.callbackMap_[reqId];
+  delete u2f.callbackMap_[reqId];
+  cb(response['responseData']);
+};
+
+/**
+ * Dispatches an array of sign requests to available U2F tokens.
+ * If the JS API version supported by the extension is unknown, it first sends a
+ * message to the extension to find out the supported API version and then it sends
+ * the sign request.
+ * @param {string=} appId
+ * @param {string=} challenge
+ * @param {Array<u2f.RegisteredKey>} registeredKeys
+ * @param {function((u2f.Error|u2f.SignResponse))} callback
+ * @param {number=} opt_timeoutSeconds
+ */
+u2f.sign = function(appId, challenge, registeredKeys, callback, opt_timeoutSeconds) {
+  if (js_api_version === undefined) {
+    // Send a message to get the extension to JS API version, then send the actual sign request.
+    u2f.getApiVersion(
+        function (response) {
+          js_api_version = response['js_api_version'] === undefined ? 0 : response['js_api_version'];
+          console.log("Extension JS API Version: ", js_api_version);
+          u2f.sendSignRequest(appId, challenge, registeredKeys, callback, opt_timeoutSeconds);
+        });
+  } else {
+    // We know the JS API version. Send the actual sign request in the supported API version.
+    u2f.sendSignRequest(appId, challenge, registeredKeys, callback, opt_timeoutSeconds);
+  }
+};
+
+/**
+ * Dispatches an array of sign requests to available U2F tokens.
+ * @param {string=} appId
+ * @param {string=} challenge
+ * @param {Array<u2f.RegisteredKey>} registeredKeys
+ * @param {function((u2f.Error|u2f.SignResponse))} callback
+ * @param {number=} opt_timeoutSeconds
+ */
+u2f.sendSignRequest = function(appId, challenge, registeredKeys, callback, opt_timeoutSeconds) {
+  u2f.getPortSingleton_(function(port) {
+    var reqId = ++u2f.reqCounter_;
+    u2f.callbackMap_[reqId] = callback;
+    var timeoutSeconds = (typeof opt_timeoutSeconds !== 'undefined' ?
+        opt_timeoutSeconds : u2f.EXTENSION_TIMEOUT_SEC);
+    var req = u2f.formatSignRequest_(appId, challenge, registeredKeys, timeoutSeconds, reqId);
+    port.postMessage(req);
+  });
+};
+
+/**
+ * Dispatches register requests to available U2F tokens. An array of sign
+ * requests identifies already registered tokens.
+ * If the JS API version supported by the extension is unknown, it first sends a
+ * message to the extension to find out the supported API version and then it sends
+ * the register request.
+ * @param {string=} appId
+ * @param {Array<u2f.RegisterRequest>} registerRequests
+ * @param {Array<u2f.RegisteredKey>} registeredKeys
+ * @param {function((u2f.Error|u2f.RegisterResponse))} callback
+ * @param {number=} opt_timeoutSeconds
+ */
+u2f.register = function(appId, registerRequests, registeredKeys, callback, opt_timeoutSeconds) {
+  if (js_api_version === undefined) {
+    // Send a message to get the extension to JS API version, then send the actual register request.
+    u2f.getApiVersion(
+        function (response) {
+          js_api_version = response['js_api_version'] === undefined ? 0: response['js_api_version'];
+          console.log("Extension JS API Version: ", js_api_version);
+          u2f.sendRegisterRequest(appId, registerRequests, registeredKeys,
+              callback, opt_timeoutSeconds);
+        });
+  } else {
+    // We know the JS API version. Send the actual register request in the supported API version.
+    u2f.sendRegisterRequest(appId, registerRequests, registeredKeys,
+        callback, opt_timeoutSeconds);
+  }
+};
+
+/**
+ * Dispatches register requests to available U2F tokens. An array of sign
+ * requests identifies already registered tokens.
+ * @param {string=} appId
+ * @param {Array<u2f.RegisterRequest>} registerRequests
+ * @param {Array<u2f.RegisteredKey>} registeredKeys
+ * @param {function((u2f.Error|u2f.RegisterResponse))} callback
+ * @param {number=} opt_timeoutSeconds
+ */
+u2f.sendRegisterRequest = function(appId, registerRequests, registeredKeys, callback, opt_timeoutSeconds) {
+  u2f.getPortSingleton_(function(port) {
+    var reqId = ++u2f.reqCounter_;
+    u2f.callbackMap_[reqId] = callback;
+    var timeoutSeconds = (typeof opt_timeoutSeconds !== 'undefined' ?
+        opt_timeoutSeconds : u2f.EXTENSION_TIMEOUT_SEC);
+    var req = u2f.formatRegisterRequest_(
+        appId, registeredKeys, registerRequests, timeoutSeconds, reqId);
+    port.postMessage(req);
+  });
+};
+
+
+/**
+ * Dispatches a message to the extension to find out the supported
+ * JS API version.
+ * If the user is on a mobile phone and is thus using Google Authenticator instead
+ * of the Chrome extension, don't send the request and simply return 0.
+ * @param {function((u2f.Error|u2f.GetJsApiVersionResponse))} callback
+ * @param {number=} opt_timeoutSeconds
+ */
+u2f.getApiVersion = function(callback, opt_timeoutSeconds) {
+ u2f.getPortSingleton_(function(port) {
+   // If we are using Android Google Authenticator or iOS client app,
+   // do not fire an intent to ask which JS API version to use.
+   if (port.getPortType) {
+     var apiVersion;
+     switch (port.getPortType()) {
+       case 'WrappedIosPort_':
+       case 'WrappedAuthenticatorPort_':
+         apiVersion = 1.1;
+         break;
+
+       default:
+         apiVersion = 0;
+         break;
+     }
+     callback({ 'js_api_version': apiVersion });
+     return;
+   }
+    var reqId = ++u2f.reqCounter_;
+    u2f.callbackMap_[reqId] = callback;
+    var req = {
+      type: u2f.MessageTypes.U2F_GET_API_VERSION_REQUEST,
+      timeoutSeconds: (typeof opt_timeoutSeconds !== 'undefined' ?
+          opt_timeoutSeconds : u2f.EXTENSION_TIMEOUT_SEC),
+      requestId: reqId
+    };
+    port.postMessage(req);
+  });
+};
+
--- a/themes/black/server/.directory
+++ b/themes/black/server/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,58,20
+Version=3
+ViewMode=1
--- a/themes/black/server/src/resources/email-template.ejs
+++ b/themes/black/server/src/resources/email-template.ejs
@ -0,0 +1,254 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+   <head>
+      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+      <title>Simples-Minimalistic Responsive Template</title>
+      
+      <style type="text/css">
+         /* Client-specific Styles */
+         #outlook a {padding:0;} /* Force Outlook to provide a "view in browser" menu link. */
+         body{background: rgb(0, 0, 0);width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0;}
+         /* Prevent Webkit and Windows Mobile platforms from changing default font sizes, while not breaking desktop design. */
+         .ExternalClass {width:100%;} /* Force Hotmail to display emails at full width */
+         .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing.*/
+         #backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important;}
+         img {outline:none; text-decoration:none;border:none; -ms-interpolation-mode: bicubic;}
+         a img {border:none;}
+         .image_fix {display:block;}
+         p {margin: 0px 0px !important;}
+         table td {border-collapse: collapse;}
+         table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
+         a {color: #ffffff;text-decoration: none;text-decoration:none!important;}
+          h1 {color: #ffffff; line-height: 30px; }
+         .button {padding: 15px 30px; border-radius: 10px; background: rgb(3, 183, 3); text-decoration:none; }
+
+         /*STYLES*/
+         table[class=full] { width: 100%; clear: both; }
+         /*IPAD STYLES*/
+         @media only screen and (max-width: 640px) {
+         a[href^="tel"], a[href^="sms"] {
+         text-decoration: none;
+         color: #ffffff; /* or whatever your want */
+         pointer-events: none;
+         cursor: default;
+         }
+         .mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {
+         text-decoration: default;
+         color: #000000 !important;
+         pointer-events: auto;
+         cursor: default;
+         }
+         table[class=devicewidth] {width: 440px!important;text-align:center!important;}
+         table[class=devicewidthinner] {width: 420px!important;text-align:center!important;}
+         img[class=banner] {width: 440px!important;height:220px!important;}
+         img[class=colimg2] {width: 440px!important;height:220px!important;}
+         
+         }
+         /*IPHONE STYLES*/
+         @media only screen and (max-width: 480px) {
+         a[href^="tel"], a[href^="sms"] {
+         text-decoration: none;
+         color: #000000; /* or whatever your want */
+         pointer-events: none;
+         cursor: default;
+         }
+         .mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {
+         text-decoration: default;
+         color: #000000 !important; 
+         pointer-events: auto;
+         cursor: default;
+         }
+         table[class=devicewidth] {width: 280px!important;text-align:center!important;}
+         table[class=devicewidthinner] {width: 260px!important;text-align:center!important;}
+         img[class=banner] {width: 280px!important;height:140px!important;}
+         img[class=colimg2] {width: 280px!important;height:140px!important;}
+         td[class=mobile-hide]{display:none!important;}
+         td[class="padding-bottom25"]{padding-bottom:25px!important;}
+        
+         }
+      </style>
+   </head>
+   <body>
+<!-- Start of header -->
+<table width="100%" bgcolor="#000000" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="header">
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td width="100%">
+                        <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+                           <tbody>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td>
+                                    <!-- logo -->
+                                    <table width="140" align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth">
+                                       <tbody>
+                                          <tr>
+                                             <td width="300" height="50" align="center">
+                                              	<h1><%= title %></h1>
+                                             </td>
+                                          </tr>
+                                       </tbody>
+                                    </table>
+                                    <!-- end of logo -->
+                                 </td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                              </tr>
+                              <!-- Spacing -->
+                           </tbody>
+                        </table>
+                     </td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- End of Header -->
+<!-- Start of seperator -->
+<table width="100%" bgcolor="#000000" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="seperator">
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" align="center" cellspacing="0" cellpadding="0" border="0" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td align="center" height="20" style="font-size:1px; line-height:1px;">&nbsp;</td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- End of seperator -->   
+<!-- Start Full Text -->
+<table width="100%" bgcolor="#000000" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="full-text">
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td width="100%">
+                        <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+                           <tbody>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td>
+                                    <table width="560" align="center" cellpadding="0" cellspacing="0" border="0" class="devicewidthinner">
+                                       <tbody>
+                                          <!-- Title -->
+                                          <tr>
+                                             <td style="font-family: Helvetica, arial, sans-serif; font-size: 16px; color: #ffffff; text-align:center; line-height: 30px;" st-title="fulltext-content">
+                                                This email has been sent to you in order to validate your identity. Please ignore it if you do not know why you received it.
+                                             </td>
+                                          </tr>
+                                          <!-- End of Title -->
+                                          <!-- spacing -->
+                                          <tr>
+                                             <td width="100%" height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                                          </tr>
+                                          <!-- End of spacing -->
+                                          <!-- content -->
+                                          <tr>
+                                             <td style="font-family: Helvetica, arial, sans-serif; font-size: 16px; color: #666666; text-align:center; line-height: 30px;" st-content="fulltext-content">
+                                                 <a href="<%= url %>" class="button"><%= button_title %></a>
+                                             </td>
+                                          </tr>
+                                          <!-- End of content -->
+                                       </tbody>
+                                    </table>
+                                 </td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                              </tr>
+                              <!-- Spacing -->
+                           </tbody>
+                        </table>
+                     </td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- end of full text -->
+<!-- Start of seperator -->
+<table width="100%" bgcolor="#000000" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="seperator">
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" align="center" cellspacing="0" cellpadding="0" border="0" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td align="center" height="30" style="font-size:1px; line-height:1px;">&nbsp;</td>
+                  </tr>
+                  <tr>
+                     <td width="550" align="center" height="1" bgcolor="#d1d1d1" style="font-size:1px; line-height:1px;">&nbsp;</td>
+                  </tr>
+                  <tr>
+                     <td align="center" height="30" style="font-size:1px; line-height:1px;">&nbsp;</td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- End of seperator -->  
+<!-- Start of Postfooter -->
+<table width="100%" bgcolor="#000000" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="postfooter" >
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td width="100%">
+                        <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+                           <tbody>
+                              <tr>
+                                 <td align="center" valign="middle" style="font-family: Helvetica, arial, sans-serif; font-size: 14px;color: #ffffff" st-content="postfooter">
+									Please ignore this email if you did not initiate the process.
+                                 </td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td width="100%" height="20"></td>
+                              </tr>
+                              <!-- Spacing -->
+                           </tbody>
+                        </table>
+                     </td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- End of postfooter -->
+   
+   </body>
+   </html>
+
--- a/themes/black/server/src/views/already-logged-in.pug
+++ b/themes/black/server/src/views/already-logged-in.pug
@ -0,0 +1,14 @@
+extends layout/layout.pug 
+
+block form-header
+  h1 Sign in
+
+block content
+  img(class="header-img" src="/img/success.png" alt="success")
+  if redirection_url
+    p You are already logged in as <b>#{ username }</b>.<br/><br/>
+      | If you are not redirected in few seconds, click <a href="#{ redirection_url }">here</a>.<br/><br/>
+      | Otherwise, click <a href="#{ logout_endpoint }">here</a> to log off.
+  else
+    p You are already logged in as <b>#{ username }</b>.<br/><br/>
+      | Click <a href="#{ logout_endpoint }">here</a> to log off.
--- a/themes/black/server/src/views/errors/.directory
+++ b/themes/black/server/src/views/errors/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,59,57
+Version=3
+ViewMode=1
--- a/themes/black/server/src/views/errors/401.pug
+++ b/themes/black/server/src/views/errors/401.pug
@ -0,0 +1,16 @@
+extends ../layout/layout.pug
+
+block variables
+  - page_classname = "error-401";
+
+block form-header
+  h1 Error 401
+
+block content
+  img(class="header-img" src="/img/warning.png" alt="warning")
+  if redirection_url
+    p You are not authorized to access this resource.<br/><br/>
+      | Please click <a href=#{redirection_url}>here</a> if you are not 
+      | redirected in few seconds.
+  else
+    p You are not authorized to access this resource.
--- a/themes/black/server/src/views/errors/403.pug
+++ b/themes/black/server/src/views/errors/403.pug
@ -0,0 +1,16 @@
+extends ../layout/layout.pug
+
+block variables
+  - page_classname = "error-403";
+
+block form-header
+  h1 Error 403
+
+block content
+  img(class="header-img" src="/img/warning.png" alt="warning")
+  if redirection_url
+    p You don't have enough privileges to access this resource.<br/><br/>
+      | Please click <a href=#{redirection_url}>here</a> if you are not 
+      | redirected in few seconds.
+  else
+    p You don't have enough privileges to access this resource.
--- a/themes/black/server/src/views/errors/404.pug
+++ b/themes/black/server/src/views/errors/404.pug
@ -0,0 +1,11 @@
+extends ../layout/layout.pug
+
+block variables
+  - page_classname = "error-404";
+
+block form-header
+  <h1>Error 404</h1>
+
+block content
+  img(class="header-img" src="/img/warning.png" alt="warning")
+  p Page not found.
--- a/themes/black/server/src/views/firstfactor.pug
+++ b/themes/black/server/src/views/firstfactor.pug
@ -0,0 +1,23 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "firstfactor";
+
+block form-header
+  h1 Sign in
+
+block content
+  div(class="notification")
+  img(class="header-img" src="/img/sharingan.png" alt="user profile")
+  p Enter your credentials to sign in
+  form(class="form-signin")
+    div(class="form-inputs")
+      input(type="text" class="form-control" id="username" placeholder="Username" required autofocus)
+      input(type="password" class="form-control" id="password" placeholder="Password" required)
+    button(id="signin" class="btn btn-lg btn-primary btn-block" type="submit") Sign in
+    div(class="keep-me-logged-in pull-left")
+      input(type="checkbox" id="keep_me_logged_in" name="keep_me_logged_in" value="true")
+      label(for="keep_me_logged_in") Keep me logged in
+    div(class="bottom-right-links pull-right")
+      a(href=reset_password_request_endpoint, class="link forgot-password") Forgot password?
+    span(class="clearfix")
--- a/themes/black/server/src/views/layout/layout.pug
+++ b/themes/black/server/src/views/layout/layout.pug
@ -0,0 +1,28 @@
+block variables
+
+doctype html
+html
+  head
+    title Authelia - 2FA
+    meta(name="viewport", content="width=device-width, initial-scale=1.0")
+    meta(name="robots", content="noindex, nofollow, nosnippet, noarchive")
+    meta(http-equiv="Content-Security-Policy", content="default-src 'self'; img-src 'self' data:;")
+    link(rel="icon", href="/img/icon.png" type="image/png" sizes="32x32")
+    link(rel="stylesheet", type="text/css", href="/css/authelia.css")
+    if redirection_url
+      meta(http-equiv="refresh" content="4;url=" + redirection_url) 
+  body
+    div(class="container")
+      div(class="row")
+        div(class="col-xs-12 col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3 col-lg-6 col-lg-offset-3")
+          div(class="account-wall " + page_classname)
+            div(class="row header")
+              block form-header
+            div(class="row body")
+              div(class="form col-xs-10 col-xs-offset-1 col-sm-8 col-sm-offset-2 col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2")
+                block content
+            div(class="row footer poweredby-block")
+              div(class="poweredby col-xs-6 col-xs-offset-4 col-sm-6 col-sm-offset-4 col-md-6 col-md-offset-4")
+                | Powered by <a class="authelia-brand" href="https://github.com/clems4ever/authelia">Authelia</a>
+    block entrypoint
+    script(src="/js/authelia.js", type="text/javascript")
--- a/themes/black/server/src/views/need-identity-validation.pug
+++ b/themes/black/server/src/views/need-identity-validation.pug
@ -0,0 +1,12 @@
+extends layout/layout.pug
+
+block variables
+  - page_classname = "identity-validation";
+
+block form-header
+  h1 Registration
+
+block content
+  img(class="header-img" src="/img/mail.png" alt="mail")
+  p A confirmation email has been sent to your mailbox. 
+    | Please open it and click on the link within 15 minutes to confirm the registration.
--- a/themes/black/server/src/views/password-reset-form.pug
+++ b/themes/black/server/src/views/password-reset-form.pug
@ -0,0 +1,18 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "password-reset-form";
+
+block form-header
+  h1 Reset password
+
+block content
+  div(class="notification")
+  img(class="header-img" src="/img/password_white.png" alt="password")
+  p Set your new password and confirm it.
+  form(class="form-signin")
+    div(class="form-inputs")
+      input(class="form-control" type="password" name="password1" id="password1" placeholder="New password" required="required")
+      input(class="form-control" type="password" name="password2" id="password2" placeholder="Password confirmation" required="required")
+    button(id="reset-password-button" class="btn btn-lg btn-primary btn-block" type="submit") Reset Password
+    span(class="clearfix")
--- a/themes/black/server/src/views/password-reset-request.pug
+++ b/themes/black/server/src/views/password-reset-request.pug
@ -0,0 +1,18 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "password-reset-request";
+
+block form-header
+  h1 Reset password
+
+block content
+  div(class="notification")
+  div
+    img(class="header-img" src="/img/password_white.png" alt="password")
+    p After giving your username, you will receive an email to change your password.
+  form(class="form-signin")
+    div(class="form-inputs")
+      input(type="text" class="form-control" name="username" id="username" placeholder="Your username" required="required")
+    button(id="reset-password-button" class="btn btn-lg btn-primary btn-block" type="submit") Reset Password
+    span(class="clearfix")
--- a/themes/black/server/src/views/secondfactor.pug
+++ b/themes/black/server/src/views/secondfactor.pug
@ -0,0 +1,31 @@
+extends layout/layout.pug
+
+block variables
+  - page_classname = "secondfactor";
+
+block form-header
+  h1 Sign in
+
+block content
+  div
+    div(class="notification notification-totp")
+    h3 Hi <b>#{username}</b>
+  div(class="row")
+    div(class="u2f-token")
+      img(src="/img/pendrive.png", alt="security key")
+    p
+      | Please, touch your <a href="https://www.yubico.com/products/yubikey-hardware/fido-u2f-security-key/">security key</a><br/>
+      b Or<br/>
+      | Get a one-time password
+    form(class="form-signin totp")
+      div(class="form-inputs")
+        input(type="text" autocomplete="off" class="form-control" id="token" placeholder="Token" required autofocus)
+      button(class="btn btn-lg btn-primary btn-block totp-button" type="submit") Sign in
+      div(class="pull-right bottom-right-links")
+        div Need to register?
+        div
+          a(href=u2f_identity_start_endpoint, class="link register-u2f", data-toggle="tooltip", title="A security key is required to register.") Security key
+          |  | 
+          a(href=totp_identity_start_endpoint, class="link register-totp") Google Authenticator
+          span(class="clearfix")
+  script(src="/js/u2f-api.js", type="text/javascript")
--- a/themes/black/server/src/views/totp-register.pug
+++ b/themes/black/server/src/views/totp-register.pug
@ -0,0 +1,25 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "totp-register";
+
+block form-header
+  h1 One-time passwords
+
+block content
+  p Open Google Authenticator and add this entry
+  p(id="secret") #{ base32_secret }
+  p or scan this barcode
+  div(id="qrcode") #{ otpauth_url }
+  p
+    a(href=login_endpoint, id="login-button") Login
+  div(class="need-google-authenticator")
+    | Need Google Authenticator?
+    div(class="store-badges")
+      a(href='https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2&hl=en&pcampaignid=MKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1', target="_blank")
+        img(alt='Get it on Google Play', src='/img/stores/googleplay-badge.svg', class="store-badge")
+      a(href='https://itunes.apple.com/us/app/google-authenticator/id388497605?mt=8', target="_blank")
+        img(alt='Get it on Apple Store' src='/img/stores/applestore-badge.svg' class="store-badge")
+
+block entrypoint
+  script(src="/js/qrcode.min.js", type="text/javascript" )
--- a/themes/black/server/src/views/u2f-register.pug
+++ b/themes/black/server/src/views/u2f-register.pug
@ -0,0 +1,12 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "u2f-register";
+
+block form-header
+  h1 Register your security key
+
+block content
+  p Touch the token to register your security key.
+  img(src="/img/pendrive.png" alt="pendrive")
+  script(src="/js/u2f-api.js", type="text/javascript")
--- a/themes/default/client/src/css/.directory
+++ b/themes/default/client/src/css/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,56,39
+Version=3
+ViewMode=1
--- a/themes/default/client/src/css/00-bootstrap.min.css
+++ b/themes/default/client/src/css/00-bootstrap.min.css
--- a/themes/default/client/src/css/01-main.css
+++ b/themes/default/client/src/css/01-main.css
@ -0,0 +1,67 @@
+body {
+  background-image: url("/img/background.svg");
+}
+.authelia-brand {
+  font-weight: bold;
+  font-style: italic;
+  color: #648caf
+}
+.poweredby-block {
+  margin: 0px 30px;
+  margin-top: 10px;
+  padding-top: 15px;
+  border-top: 1px solid rgba(0, 0, 0, 0.15);
+}
+.poweredby {
+  font-size: 0.7em;
+  color: #6b6b6b;
+}
+/* notifications */
+.notification {
+  padding: 10px;
+  margin: 15px 0px;
+  border-radius: 6px;
+  display: none;
+  position: absolute;
+}
+.notification img {
+  width: 24px;
+  margin-right: 10px;
+}
+.notification i,
+.notification span {
+  display:table-cell;
+  vertical-align:middle;
+}
+.info {
+  border: 1px solid #9cb1ff;
+  background-color: rgb(192, 220, 255);
+}
+.success {
+  border: 1px solid #65ec7c;
+  background-color: rgb(163, 255, 157);
+}
+.error {
+  border: 1px solid #ffa3a3;
+  background-color: rgb(255, 175, 175);
+}
+.warning {
+  border: 1px solid #ffd743;
+  background-color: rgb(255, 230, 143);
+}
+.bottom-right-links {
+  text-align: right;
+  margin-top: 10px;
+  font-size: 0.8em;
+}
+.header {
+  background-color: #778dab;
+  color: white;
+  margin: 0px;
+}
+.body {
+  padding: 10px;
+}
+h1 {
+  font-size: 25px;
+}
--- a/themes/default/client/src/css/02-login.css
+++ b/themes/default/client/src/css/02-login.css
@ -0,0 +1,132 @@
+.form-signin
+{
+    margin: 0 auto;
+}
+
+.form-signin .form-signin-heading, .form-signin .checkbox
+{
+    margin-bottom: 10px;
+}
+
+.form-signin .checkbox
+{
+    font-weight: normal;
+}
+
+.form-signin .form-control
+{
+    position: relative;
+    font-size: 16px;
+    height: auto;
+    padding: 10px;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+.form-signin .form-control:focus
+{
+    z-index: 2;
+}
+.form-signin input[type="text"]
+{
+    margin-bottom: -1px;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+.form-signin input[type="password"]
+{
+    /* margin-bottom: 10px; */
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+}
+.account-wall
+{
+    border: 1px solid #DDD;
+    margin-top: 20px;
+    padding-bottom: 20px;
+    background-color: #f7f7f7;
+    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
+    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
+    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
+}
+.account-wall h1
+{
+    margin-bottom: 15px;
+    margin-top: 15px;
+    font-weight: 800;
+    display: block;
+    text-align: center;
+}
+.account-wall h3
+{
+    display: block;
+    text-align: center;
+}
+.account-wall p 
+{
+    text-align: center;
+    margin: 10px;
+}
+.account-wall .form-inputs 
+{
+    margin-bottom: 10px;
+}
+.account-wall hr {
+    border-color: #c5c5c5;
+}
+
+.header-img
+{
+    width: 96px;
+    height: 96px;
+    margin: 0 auto 10px;
+    display: block;
+    -moz-border-radius: 50%;
+    -webkit-border-radius: 50%;
+    border-radius: 50%;
+}
+
+.link
+{
+    margin-top: 10px;
+}
+
+.btn-primary.totp
+{
+    background-color: rgb(102, 135, 162);
+}
+
+.btn-primary.u2f
+{
+    background-color: rgb(83, 149, 204);
+}
+
+.u2f-token {
+    text-align: center;
+}
+
+.u2f-token img {
+    width: 70px;
+}
+
+.keep-me-logged-in {
+    margin-top: 10px;
+    font-size: 0.8em;
+}
+
+.keep-me-logged-in input[type=checkbox] {
+    transform: scale(0.8);
+    margin: 0;
+    margin-right: 4px;
+}
+
+.keep-me-logged-in label {
+    font-weight: 300;
+}
+
+.keep-me-logged-in input,
+.keep-me-logged-in label {
+    display: inline-block;
+    margin-bottom: 0; /* I added this after I posted my reply */
+    vertical-align: middle; /* Fixes any weird issues in Firefox and IE */
+}
--- a/themes/default/client/src/css/03-errors.css
+++ b/themes/default/client/src/css/03-errors.css
@ -0,0 +1,12 @@
+
+.error-401 .header-img {
+    border-radius: 0%;
+}
+
+.error-403 .header-img {
+    border-radius: 0%;
+}
+
+.error-404 .header-img {
+    border-radius: 0%;
+}
--- a/themes/default/client/src/css/03-password-reset-form.css
+++ b/themes/default/client/src/css/03-password-reset-form.css
@ -0,0 +1,4 @@
+
+.password-reset-form .header-img {
+    border-radius: 0%;
+}
--- a/themes/default/client/src/css/03-password-reset-request.css
+++ b/themes/default/client/src/css/03-password-reset-request.css
@ -0,0 +1,4 @@
+
+.password-reset-request .header-img {
+    border-radius: 0%;
+}
--- a/themes/default/client/src/css/03-totp-register.css
+++ b/themes/default/client/src/css/03-totp-register.css
@ -0,0 +1,22 @@
+.totp-register #secret {
+  background-color: white;
+  font-size: 0.9em;
+  font-weight: bold;
+  padding: 5px;
+  border: 1px solid #c7c7c7;
+  word-wrap: break-word;
+}
+.totp-register #qrcode img {
+  margin: 10px auto;
+}
+.totp-register .need-google-authenticator {
+  text-align: center;
+  margin-top: 20px;
+}
+.totp-register .store-badges {
+  margin-top: 5px;
+}
+.totp-register .store-badge {
+  width: 110px;
+  height: 30px;
+}
--- a/themes/default/client/src/css/03-u2f-register.css
+++ b/themes/default/client/src/css/03-u2f-register.css
@ -0,0 +1,5 @@
+
+.u2f-register img {
+    display: block;
+    margin: 20px auto;
+}
--- a/themes/default/client/src/img/background.svg
+++ b/themes/default/client/src/img/background.svg
@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="56" height="100">
+<rect width="56" height="100" fill="#FFFFFF"></rect>
+<path d="M28 66L0 50L0 16L28 0L56 16L56 50L28 66L28 100" fill="none" stroke="#FCFCFC" stroke-width="2"></path>
+<path d="M28 0L28 34L0 50L0 84L28 100L56 84L56 50L28 34" fill="none" stroke="#FBFBFB" stroke-width="2"></path>
+</svg>
--- a/themes/default/client/src/img/icon.png
+++ b/themes/default/client/src/img/icon.png
--- a/themes/default/client/src/img/mail.png
+++ b/themes/default/client/src/img/mail.png
--- a/themes/default/client/src/img/notifications/.directory
+++ b/themes/default/client/src/img/notifications/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,57,31
+Version=3
+ViewMode=1
--- a/themes/default/client/src/img/notifications/error.png
+++ b/themes/default/client/src/img/notifications/error.png
--- a/themes/default/client/src/img/notifications/info.png
+++ b/themes/default/client/src/img/notifications/info.png
--- a/themes/default/client/src/img/notifications/success.png
+++ b/themes/default/client/src/img/notifications/success.png
--- a/themes/default/client/src/img/notifications/warning.png
+++ b/themes/default/client/src/img/notifications/warning.png
--- a/themes/default/client/src/img/padlock.png
+++ b/themes/default/client/src/img/padlock.png
--- a/themes/default/client/src/img/password.png
+++ b/themes/default/client/src/img/password.png
--- a/themes/default/client/src/img/pendrive.png
+++ b/themes/default/client/src/img/pendrive.png
--- a/themes/default/client/src/img/stores/.directory
+++ b/themes/default/client/src/img/stores/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,57,26
+Version=3
+ViewMode=1
--- a/themes/default/client/src/img/stores/applestore-badge.svg
+++ b/themes/default/client/src/img/stores/applestore-badge.svg
@ -0,0 +1,129 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="US_UK_Download_on_the" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+	 x="0px" y="0px" width="135px" height="40px" viewBox="0 0 135 40" enable-background="new 0 0 135 40" xml:space="preserve">
+<g>
+	<path fill="#A6A6A6" d="M130.197,40H4.729C2.122,40,0,37.872,0,35.267V4.726C0,2.12,2.122,0,4.729,0h125.468
+		C132.803,0,135,2.12,135,4.726v30.541C135,37.872,132.803,40,130.197,40L130.197,40z"/>
+	<path d="M134.032,35.268c0,2.116-1.714,3.83-3.834,3.83H4.729c-2.119,0-3.839-1.714-3.839-3.83V4.725
+		c0-2.115,1.72-3.835,3.839-3.835h125.468c2.121,0,3.834,1.72,3.834,3.835L134.032,35.268L134.032,35.268z"/>
+	<g>
+		<g>
+			<path fill="#FFFFFF" d="M30.128,19.784c-0.029-3.223,2.639-4.791,2.761-4.864c-1.511-2.203-3.853-2.504-4.676-2.528
+				c-1.967-0.207-3.875,1.177-4.877,1.177c-1.022,0-2.565-1.157-4.228-1.123c-2.14,0.033-4.142,1.272-5.24,3.196
+				c-2.266,3.923-0.576,9.688,1.595,12.859c1.086,1.553,2.355,3.287,4.016,3.226c1.625-0.067,2.232-1.036,4.193-1.036
+				c1.943,0,2.513,1.036,4.207,0.997c1.744-0.028,2.842-1.56,3.89-3.127c1.255-1.78,1.759-3.533,1.779-3.623
+				C33.507,24.924,30.161,23.647,30.128,19.784z"/>
+			<path fill="#FFFFFF" d="M26.928,10.306c0.874-1.093,1.472-2.58,1.306-4.089c-1.265,0.056-2.847,0.875-3.758,1.944
+				c-0.806,0.942-1.526,2.486-1.34,3.938C24.557,12.205,26.016,11.382,26.928,10.306z"/>
+		</g>
+	</g>
+	<g>
+		<path fill="#FFFFFF" d="M53.645,31.504h-2.271l-1.244-3.909h-4.324l-1.185,3.909h-2.211l4.284-13.308h2.646L53.645,31.504z
+			 M49.755,25.955L48.63,22.48c-0.119-0.355-0.342-1.191-0.671-2.507h-0.04c-0.131,0.566-0.342,1.402-0.632,2.507l-1.105,3.475
+			H49.755z"/>
+		<path fill="#FFFFFF" d="M64.662,26.588c0,1.632-0.441,2.922-1.323,3.869c-0.79,0.843-1.771,1.264-2.942,1.264
+			c-1.264,0-2.172-0.454-2.725-1.362h-0.04v5.055h-2.132V25.067c0-1.026-0.027-2.079-0.079-3.159h1.875l0.119,1.521h0.04
+			c0.711-1.146,1.79-1.718,3.238-1.718c1.132,0,2.077,0.447,2.833,1.342C64.284,23.949,64.662,25.127,64.662,26.588z M62.49,26.666
+			c0-0.934-0.21-1.704-0.632-2.31c-0.461-0.632-1.08-0.948-1.856-0.948c-0.526,0-1.004,0.176-1.431,0.523
+			c-0.428,0.35-0.708,0.807-0.839,1.373c-0.066,0.264-0.099,0.48-0.099,0.65v1.6c0,0.698,0.214,1.287,0.642,1.768
+			s0.984,0.721,1.668,0.721c0.803,0,1.428-0.31,1.875-0.928C62.266,28.496,62.49,27.68,62.49,26.666z"/>
+		<path fill="#FFFFFF" d="M75.699,26.588c0,1.632-0.441,2.922-1.324,3.869c-0.789,0.843-1.77,1.264-2.941,1.264
+			c-1.264,0-2.172-0.454-2.724-1.362H68.67v5.055h-2.132V25.067c0-1.026-0.027-2.079-0.079-3.159h1.875l0.119,1.521h0.04
+			c0.71-1.146,1.789-1.718,3.238-1.718c1.131,0,2.076,0.447,2.834,1.342C75.32,23.949,75.699,25.127,75.699,26.588z M73.527,26.666
+			c0-0.934-0.211-1.704-0.633-2.31c-0.461-0.632-1.078-0.948-1.855-0.948c-0.527,0-1.004,0.176-1.432,0.523
+			c-0.428,0.35-0.707,0.807-0.838,1.373c-0.065,0.264-0.099,0.48-0.099,0.65v1.6c0,0.698,0.214,1.287,0.64,1.768
+			c0.428,0.48,0.984,0.721,1.67,0.721c0.803,0,1.428-0.31,1.875-0.928C73.303,28.496,73.527,27.68,73.527,26.666z"/>
+		<path fill="#FFFFFF" d="M88.039,27.772c0,1.132-0.393,2.053-1.182,2.764c-0.867,0.777-2.074,1.165-3.625,1.165
+			c-1.432,0-2.58-0.276-3.449-0.829l0.494-1.777c0.936,0.566,1.963,0.85,3.082,0.85c0.803,0,1.428-0.182,1.877-0.544
+			c0.447-0.362,0.67-0.848,0.67-1.454c0-0.54-0.184-0.995-0.553-1.364c-0.367-0.369-0.98-0.712-1.836-1.029
+			c-2.33-0.869-3.494-2.142-3.494-3.816c0-1.094,0.408-1.991,1.225-2.689c0.814-0.699,1.9-1.048,3.258-1.048
+			c1.211,0,2.217,0.211,3.02,0.632l-0.533,1.738c-0.75-0.408-1.598-0.612-2.547-0.612c-0.75,0-1.336,0.185-1.756,0.553
+			c-0.355,0.329-0.533,0.73-0.533,1.205c0,0.526,0.203,0.961,0.611,1.303c0.355,0.316,1,0.658,1.936,1.027
+			c1.145,0.461,1.986,1,2.527,1.618C87.77,26.081,88.039,26.852,88.039,27.772z"/>
+		<path fill="#FFFFFF" d="M95.088,23.508h-2.35v4.659c0,1.185,0.414,1.777,1.244,1.777c0.381,0,0.697-0.033,0.947-0.099l0.059,1.619
+			c-0.42,0.157-0.973,0.236-1.658,0.236c-0.842,0-1.5-0.257-1.975-0.77c-0.473-0.514-0.711-1.376-0.711-2.587v-4.837h-1.4v-1.6h1.4
+			v-1.757l2.094-0.632v2.389h2.35V23.508z"/>
+		<path fill="#FFFFFF" d="M105.691,26.627c0,1.475-0.422,2.686-1.264,3.633c-0.883,0.975-2.055,1.461-3.516,1.461
+			c-1.408,0-2.529-0.467-3.365-1.401s-1.254-2.113-1.254-3.534c0-1.487,0.43-2.705,1.293-3.652c0.861-0.948,2.023-1.422,3.484-1.422
+			c1.408,0,2.541,0.467,3.396,1.402C105.283,24.021,105.691,25.192,105.691,26.627z M103.479,26.696
+			c0-0.885-0.189-1.644-0.572-2.277c-0.447-0.766-1.086-1.148-1.914-1.148c-0.857,0-1.508,0.383-1.955,1.148
+			c-0.383,0.634-0.572,1.405-0.572,2.317c0,0.885,0.189,1.644,0.572,2.276c0.461,0.766,1.105,1.148,1.936,1.148
+			c0.814,0,1.453-0.39,1.914-1.168C103.281,28.347,103.479,27.58,103.479,26.696z"/>
+		<path fill="#FFFFFF" d="M112.621,23.783c-0.211-0.039-0.436-0.059-0.672-0.059c-0.75,0-1.33,0.283-1.738,0.85
+			c-0.355,0.5-0.533,1.132-0.533,1.895v5.035h-2.131l0.02-6.574c0-1.106-0.027-2.113-0.08-3.021h1.857l0.078,1.836h0.059
+			c0.225-0.631,0.58-1.139,1.066-1.52c0.475-0.343,0.988-0.514,1.541-0.514c0.197,0,0.375,0.014,0.533,0.039V23.783z"/>
+		<path fill="#FFFFFF" d="M122.156,26.252c0,0.382-0.025,0.704-0.078,0.967h-6.396c0.025,0.948,0.334,1.673,0.928,2.173
+			c0.539,0.447,1.236,0.671,2.092,0.671c0.947,0,1.811-0.151,2.588-0.454l0.334,1.48c-0.908,0.396-1.98,0.593-3.217,0.593
+			c-1.488,0-2.656-0.438-3.506-1.313c-0.848-0.875-1.273-2.05-1.273-3.524c0-1.447,0.395-2.652,1.186-3.613
+			c0.828-1.026,1.947-1.539,3.355-1.539c1.383,0,2.43,0.513,3.141,1.539C121.873,24.047,122.156,25.055,122.156,26.252z
+			 M120.123,25.699c0.014-0.632-0.125-1.178-0.414-1.639c-0.369-0.593-0.936-0.889-1.699-0.889c-0.697,0-1.264,0.289-1.697,0.869
+			c-0.355,0.461-0.566,1.014-0.631,1.658H120.123z"/>
+	</g>
+	<g>
+		<g>
+			<path fill="#FFFFFF" d="M49.05,10.009c0,1.177-0.353,2.063-1.058,2.658c-0.653,0.549-1.581,0.824-2.783,0.824
+				c-0.596,0-1.106-0.026-1.533-0.078V6.982c0.557-0.09,1.157-0.136,1.805-0.136c1.145,0,2.008,0.249,2.59,0.747
+				C48.723,8.156,49.05,8.961,49.05,10.009z M47.945,10.038c0-0.763-0.202-1.348-0.606-1.756c-0.404-0.407-0.994-0.611-1.771-0.611
+				c-0.33,0-0.611,0.022-0.844,0.068v4.889c0.129,0.02,0.365,0.029,0.708,0.029c0.802,0,1.421-0.223,1.857-0.669
+				S47.945,10.892,47.945,10.038z"/>
+			<path fill="#FFFFFF" d="M54.909,11.037c0,0.725-0.207,1.319-0.621,1.785c-0.434,0.479-1.009,0.718-1.727,0.718
+				c-0.692,0-1.243-0.229-1.654-0.689c-0.41-0.459-0.615-1.038-0.615-1.736c0-0.73,0.211-1.329,0.635-1.794s0.994-0.698,1.712-0.698
+				c0.692,0,1.248,0.229,1.669,0.688C54.708,9.757,54.909,10.333,54.909,11.037z M53.822,11.071c0-0.435-0.094-0.808-0.281-1.119
+				c-0.22-0.376-0.533-0.564-0.94-0.564c-0.421,0-0.741,0.188-0.961,0.564c-0.188,0.311-0.281,0.69-0.281,1.138
+				c0,0.435,0.094,0.808,0.281,1.119c0.227,0.376,0.543,0.564,0.951,0.564c0.4,0,0.714-0.191,0.94-0.574
+				C53.725,11.882,53.822,11.506,53.822,11.071z"/>
+			<path fill="#FFFFFF" d="M62.765,8.719l-1.475,4.714h-0.96l-0.611-2.047c-0.155-0.511-0.281-1.019-0.379-1.523h-0.019
+				c-0.091,0.518-0.217,1.025-0.379,1.523l-0.649,2.047h-0.971l-1.387-4.714h1.077l0.533,2.241c0.129,0.53,0.235,1.035,0.32,1.513
+				h0.019c0.078-0.394,0.207-0.896,0.389-1.503l0.669-2.25h0.854l0.641,2.202c0.155,0.537,0.281,1.054,0.378,1.552h0.029
+				c0.071-0.485,0.178-1.002,0.32-1.552l0.572-2.202H62.765z"/>
+			<path fill="#FFFFFF" d="M68.198,13.433H67.15v-2.7c0-0.832-0.316-1.248-0.95-1.248c-0.311,0-0.562,0.114-0.757,0.343
+				c-0.193,0.229-0.291,0.499-0.291,0.808v2.796h-1.048v-3.366c0-0.414-0.013-0.863-0.038-1.349h0.921l0.049,0.737h0.029
+				c0.122-0.229,0.304-0.418,0.543-0.569c0.284-0.176,0.602-0.265,0.95-0.265c0.44,0,0.806,0.142,1.097,0.427
+				c0.362,0.349,0.543,0.87,0.543,1.562V13.433z"/>
+			<path fill="#FFFFFF" d="M71.088,13.433h-1.047V6.556h1.047V13.433z"/>
+			<path fill="#FFFFFF" d="M77.258,11.037c0,0.725-0.207,1.319-0.621,1.785c-0.434,0.479-1.01,0.718-1.727,0.718
+				c-0.693,0-1.244-0.229-1.654-0.689c-0.41-0.459-0.615-1.038-0.615-1.736c0-0.73,0.211-1.329,0.635-1.794s0.994-0.698,1.711-0.698
+				c0.693,0,1.248,0.229,1.67,0.688C77.057,9.757,77.258,10.333,77.258,11.037z M76.17,11.071c0-0.435-0.094-0.808-0.281-1.119
+				c-0.219-0.376-0.533-0.564-0.939-0.564c-0.422,0-0.742,0.188-0.961,0.564c-0.188,0.311-0.281,0.69-0.281,1.138
+				c0,0.435,0.094,0.808,0.281,1.119c0.227,0.376,0.543,0.564,0.951,0.564c0.4,0,0.713-0.191,0.939-0.574
+				C76.074,11.882,76.17,11.506,76.17,11.071z"/>
+			<path fill="#FFFFFF" d="M82.33,13.433h-0.941l-0.078-0.543h-0.029c-0.322,0.433-0.781,0.65-1.377,0.65
+				c-0.445,0-0.805-0.143-1.076-0.427c-0.246-0.258-0.369-0.579-0.369-0.96c0-0.576,0.24-1.015,0.723-1.319
+				c0.482-0.304,1.16-0.453,2.033-0.446V10.3c0-0.621-0.326-0.931-0.979-0.931c-0.465,0-0.875,0.117-1.229,0.349l-0.213-0.688
+				c0.438-0.271,0.979-0.407,1.617-0.407c1.232,0,1.85,0.65,1.85,1.95v1.736C82.262,12.78,82.285,13.155,82.33,13.433z
+				 M81.242,11.813v-0.727c-1.156-0.02-1.734,0.297-1.734,0.95c0,0.246,0.066,0.43,0.201,0.553c0.135,0.123,0.307,0.184,0.512,0.184
+				c0.23,0,0.445-0.073,0.641-0.218c0.197-0.146,0.318-0.331,0.363-0.558C81.236,11.946,81.242,11.884,81.242,11.813z"/>
+			<path fill="#FFFFFF" d="M88.285,13.433h-0.93l-0.049-0.757h-0.029c-0.297,0.576-0.803,0.864-1.514,0.864
+				c-0.568,0-1.041-0.223-1.416-0.669s-0.562-1.025-0.562-1.736c0-0.763,0.203-1.381,0.611-1.853c0.395-0.44,0.879-0.66,1.455-0.66
+				c0.633,0,1.076,0.213,1.328,0.64h0.02V6.556h1.049v5.607C88.248,12.622,88.26,13.045,88.285,13.433z M87.199,11.445v-0.786
+				c0-0.136-0.01-0.246-0.029-0.33c-0.059-0.252-0.186-0.464-0.379-0.635c-0.195-0.171-0.43-0.257-0.701-0.257
+				c-0.391,0-0.697,0.155-0.922,0.466c-0.223,0.311-0.336,0.708-0.336,1.193c0,0.466,0.107,0.844,0.322,1.135
+				c0.227,0.31,0.533,0.465,0.916,0.465c0.344,0,0.619-0.129,0.828-0.388C87.1,12.069,87.199,11.781,87.199,11.445z"/>
+			<path fill="#FFFFFF" d="M97.248,11.037c0,0.725-0.207,1.319-0.621,1.785c-0.434,0.479-1.008,0.718-1.727,0.718
+				c-0.691,0-1.242-0.229-1.654-0.689c-0.41-0.459-0.615-1.038-0.615-1.736c0-0.73,0.211-1.329,0.635-1.794s0.994-0.698,1.713-0.698
+				c0.691,0,1.248,0.229,1.668,0.688C97.047,9.757,97.248,10.333,97.248,11.037z M96.162,11.071c0-0.435-0.094-0.808-0.281-1.119
+				c-0.221-0.376-0.533-0.564-0.941-0.564c-0.42,0-0.74,0.188-0.961,0.564c-0.188,0.311-0.281,0.69-0.281,1.138
+				c0,0.435,0.094,0.808,0.281,1.119c0.227,0.376,0.543,0.564,0.951,0.564c0.4,0,0.715-0.191,0.941-0.574
+				C96.064,11.882,96.162,11.506,96.162,11.071z"/>
+			<path fill="#FFFFFF" d="M102.883,13.433h-1.047v-2.7c0-0.832-0.316-1.248-0.951-1.248c-0.311,0-0.562,0.114-0.756,0.343
+				s-0.291,0.499-0.291,0.808v2.796h-1.049v-3.366c0-0.414-0.012-0.863-0.037-1.349h0.92l0.049,0.737h0.029
+				c0.123-0.229,0.305-0.418,0.543-0.569c0.285-0.176,0.602-0.265,0.951-0.265c0.439,0,0.805,0.142,1.096,0.427
+				c0.363,0.349,0.543,0.87,0.543,1.562V13.433z"/>
+			<path fill="#FFFFFF" d="M109.936,9.504h-1.154v2.29c0,0.582,0.205,0.873,0.611,0.873c0.188,0,0.344-0.016,0.467-0.049
+				l0.027,0.795c-0.207,0.078-0.479,0.117-0.814,0.117c-0.414,0-0.736-0.126-0.969-0.378c-0.234-0.252-0.35-0.676-0.35-1.271V9.504
+				h-0.689V8.719h0.689V7.855l1.027-0.31v1.173h1.154V9.504z"/>
+			<path fill="#FFFFFF" d="M115.484,13.433h-1.049v-2.68c0-0.845-0.316-1.268-0.949-1.268c-0.486,0-0.818,0.245-1,0.735
+				c-0.031,0.103-0.049,0.229-0.049,0.377v2.835h-1.047V6.556h1.047v2.841h0.02c0.33-0.517,0.803-0.775,1.416-0.775
+				c0.434,0,0.793,0.142,1.078,0.427c0.355,0.355,0.533,0.883,0.533,1.581V13.433z"/>
+			<path fill="#FFFFFF" d="M121.207,10.853c0,0.188-0.014,0.346-0.039,0.475h-3.143c0.014,0.466,0.164,0.821,0.455,1.067
+				c0.266,0.22,0.609,0.33,1.029,0.33c0.465,0,0.889-0.074,1.271-0.223l0.164,0.728c-0.447,0.194-0.973,0.291-1.582,0.291
+				c-0.73,0-1.305-0.215-1.721-0.645c-0.418-0.43-0.625-1.007-0.625-1.731c0-0.711,0.193-1.303,0.582-1.775
+				c0.406-0.504,0.955-0.756,1.648-0.756c0.678,0,1.193,0.252,1.541,0.756C121.068,9.77,121.207,10.265,121.207,10.853z
+				 M120.207,10.582c0.008-0.311-0.061-0.579-0.203-0.805c-0.182-0.291-0.459-0.437-0.834-0.437c-0.342,0-0.621,0.142-0.834,0.427
+				c-0.174,0.227-0.277,0.498-0.311,0.815H120.207z"/>
+		</g>
+	</g>
+</g>
+</svg>
--- a/themes/default/client/src/img/stores/googleplay-badge.svg
+++ b/themes/default/client/src/img/stores/googleplay-badge.svg
@ -0,0 +1,429 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   xml:space="preserve"
+   width="135.71649"
+   height="40.018951"
+   viewBox="0 0 135.71649 40.018951"
+   sodipodi:docname="google-play-badge.svg"><metadata
+     id="metadata8"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+     id="defs6"><linearGradient
+       x1="31.7997"
+       y1="183.2903"
+       x2="15.0173"
+       y2="166.5079"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.8,0,0,-0.8,0,161.6)"
+       spreadMethod="pad"
+       id="linearGradient50"><stop
+         style="stop-opacity:1;stop-color:#00a0ff"
+         offset="0"
+         id="stop52" /><stop
+         style="stop-opacity:1;stop-color:#00a1ff"
+         offset="0.0066"
+         id="stop54" /><stop
+         style="stop-opacity:1;stop-color:#00beff"
+         offset="0.2601"
+         id="stop56" /><stop
+         style="stop-opacity:1;stop-color:#00d2ff"
+         offset="0.5122"
+         id="stop58" /><stop
+         style="stop-opacity:1;stop-color:#00dfff"
+         offset="0.7604"
+         id="stop60" /><stop
+         style="stop-opacity:1;stop-color:#00e3ff"
+         offset="1"
+         id="stop62" /></linearGradient><linearGradient
+       x1="43.8344"
+       y1="171.9986"
+       x2="19.637501"
+       y2="171.9986"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.8,0,0,-0.8,0,161.6)"
+       spreadMethod="pad"
+       id="linearGradient68"><stop
+         style="stop-opacity:1;stop-color:#ffe000"
+         offset="0"
+         id="stop70" /><stop
+         style="stop-opacity:1;stop-color:#ffbd00"
+         offset="0.4087"
+         id="stop72" /><stop
+         style="stop-opacity:1;stop-color:#ffa500"
+         offset="0.7754"
+         id="stop74" /><stop
+         style="stop-opacity:1;stop-color:#ff9c00"
+         offset="1"
+         id="stop76" /></linearGradient><linearGradient
+       x1="34.827"
+       y1="169.7039"
+       x2="12.0687"
+       y2="146.9456"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.8,0,0,-0.8,0,161.6)"
+       spreadMethod="pad"
+       id="linearGradient82"><stop
+         style="stop-opacity:1;stop-color:#ff3a44"
+         offset="0"
+         id="stop84" /><stop
+         style="stop-opacity:1;stop-color:#c31162"
+         offset="1"
+         id="stop86" /></linearGradient><linearGradient
+       x1="17.2973"
+       y1="191.82381"
+       x2="27.4599"
+       y2="181.6613"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(0.8,0,0,-0.8,0,161.6)"
+       spreadMethod="pad"
+       id="linearGradient92"><stop
+         style="stop-opacity:1;stop-color:#32a071"
+         offset="0"
+         id="stop94" /><stop
+         style="stop-opacity:1;stop-color:#2da771"
+         offset="0.0685"
+         id="stop96" /><stop
+         style="stop-opacity:1;stop-color:#15cf74"
+         offset="0.4762"
+         id="stop98" /><stop
+         style="stop-opacity:1;stop-color:#06e775"
+         offset="0.8009"
+         id="stop100" /><stop
+         style="stop-opacity:1;stop-color:#00f076"
+         offset="1"
+         id="stop102" /></linearGradient><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath110"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path112"
+         inkscape:connector-curvature="0" /></clipPath><mask
+       maskUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="1"
+       height="1"
+       id="mask114"><g
+         id="g116"><g
+           clip-path="url(#clipPath110)"
+           id="g118"><path
+             d="M 0,0 124,0 124,48 0,48 0,0 Z"
+             style="fill:#000000;fill-opacity:0.2;fill-rule:nonzero;stroke:none"
+             id="path120"
+             inkscape:connector-curvature="0" /></g></g></mask><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath126"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path128"
+         inkscape:connector-curvature="0" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath130"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path132"
+         inkscape:connector-curvature="0" /></clipPath><pattern
+       patternTransform="matrix(1,0,0,-1,0,48)"
+       patternUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="124"
+       height="48"
+       id="pattern134"><g
+         id="g136" /><g
+         id="g138"><g
+           clip-path="url(#clipPath130)"
+           id="g140"><g
+             id="g142"><path
+               d="M 29.625,20.695 18.012,14.098 C 17.363,13.727 16.781,13.754 16.406,14.09 l -0.058,-0.063 0.058,-0.058 c 0.375,-0.336 0.957,-0.36 1.606,0.011 l 11.687,6.641 -0.074,0.074 z"
+               style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"
+               id="path144" /></g></g></g></pattern><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath158"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path160"
+         inkscape:connector-curvature="0" /></clipPath><mask
+       maskUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="1"
+       height="1"
+       id="mask162"><g
+         id="g164"><g
+           clip-path="url(#clipPath158)"
+           id="g166"><path
+             d="M 0,0 124,0 124,48 0,48 0,0 Z"
+             style="fill:#000000;fill-opacity:0.12000002;fill-rule:nonzero;stroke:none"
+             id="path168"
+             inkscape:connector-curvature="0" /></g></g></mask><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath174"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path176"
+         inkscape:connector-curvature="0" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath178"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path180"
+         inkscape:connector-curvature="0" /></clipPath><pattern
+       patternTransform="matrix(1,0,0,-1,0,48)"
+       patternUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="124"
+       height="48"
+       id="pattern182"><g
+         id="g184" /><g
+         id="g186"><g
+           clip-path="url(#clipPath178)"
+           id="g188"><g
+             id="g190"><path
+               d="m 16.348,14.145 c -0.235,0.246 -0.371,0.628 -0.371,1.125 l 0,-0.118 c 0,-0.496 0.136,-0.879 0.371,-1.125 l 0.058,0.063 -0.058,0.055 z"
+               style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"
+               id="path192" /></g></g></g></pattern><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath206"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path208"
+         inkscape:connector-curvature="0" /></clipPath><mask
+       maskUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="1"
+       height="1"
+       id="mask210"><g
+         id="g212"><g
+           clip-path="url(#clipPath206)"
+           id="g214"><path
+             d="M 0,0 124,0 124,48 0,48 0,0 Z"
+             style="fill:#000000;fill-opacity:0.12000002;fill-rule:nonzero;stroke:none"
+             id="path216"
+             inkscape:connector-curvature="0" /></g></g></mask><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath222"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path224"
+         inkscape:connector-curvature="0" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath226"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path228"
+         inkscape:connector-curvature="0" /></clipPath><pattern
+       patternTransform="matrix(1,0,0,-1,0,48)"
+       patternUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="124"
+       height="48"
+       id="pattern230"><g
+         id="g232" /><g
+         id="g234"><g
+           clip-path="url(#clipPath226)"
+           id="g236"><g
+             id="g238"><path
+               d="m 33.613,22.961 -3.988,-2.266 0.074,-0.074 3.914,2.223 c 0.559,0.316 0.836,0.734 0.836,1.156 -0.047,-0.379 -0.332,-0.75 -0.836,-1.039 z"
+               style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"
+               id="path240" /></g></g></g></pattern><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath254"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path256"
+         inkscape:connector-curvature="0" /></clipPath><mask
+       maskUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="1"
+       height="1"
+       id="mask258"><g
+         id="g260"><g
+           clip-path="url(#clipPath254)"
+           id="g262"><path
+             d="M 0,0 124,0 124,48 0,48 0,0 Z"
+             style="fill:#000000;fill-opacity:0.25;fill-rule:nonzero;stroke:none"
+             id="path264"
+             inkscape:connector-curvature="0" /></g></g></mask><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath270"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path272"
+         inkscape:connector-curvature="0" /></clipPath><clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath274"><path
+         d="M 0,0 124,0 124,48 0,48 0,0 Z"
+         id="path276"
+         inkscape:connector-curvature="0" /></clipPath><pattern
+       patternTransform="matrix(1,0,0,-1,0,48)"
+       patternUnits="userSpaceOnUse"
+       x="0"
+       y="0"
+       width="124"
+       height="48"
+       id="pattern278"><g
+         id="g280" /><g
+         id="g282"><g
+           clip-path="url(#clipPath274)"
+           id="g284"><g
+             id="g286"><path
+               d="m 18.012,33.902 15.601,-8.863 c 0.508,-0.289 0.789,-0.66 0.836,-1.039 0,0.418 -0.277,0.836 -0.836,1.156 L 18.012,34.02 c -1.117,0.632 -2.035,0.105 -2.035,-1.176 l 0,-0.114 c 0,1.278 0.918,1.805 2.035,1.172 z"
+               style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+               id="path288" /></g></g></g></pattern></defs><sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1366"
+     inkscape:window-height="705"
+     id="namedview4"
+     showgrid="false"
+     inkscape:zoom="7.6276974"
+     inkscape:cx="93.965168"
+     inkscape:cy="29.61582"
+     inkscape:window-x="-8"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g10" /><g
+     id="g10"
+     inkscape:groupmode="layer"
+     inkscape:label="google-play-badge"
+     transform="matrix(1.25,0,0,-1.25,-9.4247625,49.85025)"><g
+       id="g12"
+       transform="matrix(1.0023923,0,0,0.99072975,-0.29664807,0)"><path
+         d="M 112,8 12,8 C 9.801,8 8,9.801 8,12 l 0,24 c 0,2.199 1.801,4 4,4 l 100,0 c 2.199,0 4,-1.801 4,-4 l 0,-24 c 0,-2.199 -1.801,-4 -4,-4 z"
+         style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path14"
+         inkscape:connector-curvature="0" /><path
+         d="m 112,39.359 c 1.852,0 3.359,-1.507 3.359,-3.359 l 0,-24 c 0,-1.852 -1.507,-3.359 -3.359,-3.359 l -100,0 c -1.852,0 -3.359,1.507 -3.359,3.359 l 0,24 c 0,1.852 1.507,3.359 3.359,3.359 l 100,0 M 112,40 12,40 C 9.801,40 8,38.199 8,36 L 8,12 C 8,9.801 9.801,8 12,8 l 100,0 c 2.199,0 4,1.801 4,4 l 0,24 c 0,2.199 -1.801,4 -4,4 z"
+         style="fill:#a6a6a6;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path16"
+         inkscape:connector-curvature="0" /><g
+         id="g18"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 45.934,16.195 c 0,0.668 -0.2,1.203 -0.594,1.602 -0.453,0.473 -1.043,0.711 -1.766,0.711 -0.691,0 -1.281,-0.242 -1.765,-0.719 -0.485,-0.484 -0.727,-1.078 -0.727,-1.789 0,-0.711 0.242,-1.305 0.727,-1.785 0.484,-0.481 1.074,-0.723 1.765,-0.723 0.344,0 0.672,0.071 0.985,0.203 0.312,0.133 0.566,0.313 0.75,0.535 l -0.418,0.422 c -0.321,-0.379 -0.758,-0.566 -1.317,-0.566 -0.504,0 -0.941,0.176 -1.312,0.531 -0.367,0.356 -0.551,0.817 -0.551,1.383 0,0.566 0.184,1.031 0.551,1.387 0.371,0.351 0.808,0.531 1.312,0.531 0.535,0 0.985,-0.18 1.34,-0.535 0.234,-0.235 0.367,-0.559 0.402,-0.973 l -1.742,0 0,-0.578 2.324,0 c 0.028,0.125 0.036,0.246 0.036,0.363 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path20"
+           inkscape:connector-curvature="0" /></g><g
+         id="g22"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 49.621,14.191 -2.183,0 0,1.52 1.968,0 0,0.578 -1.968,0 0,1.52 2.183,0 0,0.589 -2.801,0 0,-4.796 2.801,0 0,0.589 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path24"
+           inkscape:connector-curvature="0" /></g><g
+         id="g26"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 52.223,18.398 -0.618,0 0,-4.207 -1.339,0 0,-0.589 3.297,0 0,0.589 -1.34,0 0,4.207 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path28"
+           inkscape:connector-curvature="0" /></g><g
+         id="g30"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 55.949,18.398 0,-4.796 0.617,0 0,4.796 -0.617,0 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path32"
+           inkscape:connector-curvature="0" /></g><g
+         id="g34"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 59.301,18.398 -0.613,0 0,-4.207 -1.344,0 0,-0.589 3.301,0 0,0.589 -1.344,0 0,4.207 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path36"
+           inkscape:connector-curvature="0" /></g><g
+         id="g38"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 66.887,17.781 c -0.473,0.485 -1.059,0.727 -1.758,0.727 -0.703,0 -1.289,-0.242 -1.762,-0.727 C 62.895,17.297 62.66,16.703 62.66,16 c 0,-0.703 0.235,-1.297 0.707,-1.781 0.473,-0.485 1.059,-0.727 1.762,-0.727 0.695,0 1.281,0.242 1.754,0.731 0.476,0.488 0.711,1.078 0.711,1.777 0,0.703 -0.235,1.297 -0.707,1.781 z m -3.063,-0.402 c 0.356,0.359 0.789,0.539 1.305,0.539 0.512,0 0.949,-0.18 1.301,-0.539 0.355,-0.359 0.535,-0.82 0.535,-1.379 0,-0.559 -0.18,-1.02 -0.535,-1.379 -0.352,-0.359 -0.789,-0.539 -1.301,-0.539 -0.516,0 -0.949,0.18 -1.305,0.539 -0.355,0.359 -0.535,0.82 -0.535,1.379 0,0.559 0.18,1.02 0.535,1.379 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path40"
+           inkscape:connector-curvature="0" /></g><g
+         id="g42"
+         transform="matrix(1,0,0,-1,0,48)"><path
+           d="m 68.461,18.398 0,-4.796 0.75,0 2.332,3.73 0.027,0 -0.027,-0.922 0,-2.808 0.617,0 0,4.796 -0.644,0 -2.442,-3.914 -0.027,0 0.027,0.926 0,2.988 -0.613,0 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.16;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+           id="path44"
+           inkscape:connector-curvature="0" /></g><path
+         d="m 62.508,22.598 c -1.879,0 -3.414,-1.43 -3.414,-3.403 0,-1.957 1.535,-3.402 3.414,-3.402 1.883,0 3.418,1.445 3.418,3.402 0,1.973 -1.535,3.403 -3.418,3.403 z m 0,-5.465 c -1.031,0 -1.918,0.851 -1.918,2.062 0,1.227 0.887,2.063 1.918,2.063 1.031,0 1.922,-0.836 1.922,-2.063 0,-1.211 -0.891,-2.062 -1.922,-2.062 z m -7.449,5.465 c -1.883,0 -3.414,-1.43 -3.414,-3.403 0,-1.957 1.531,-3.402 3.414,-3.402 1.882,0 3.414,1.445 3.414,3.402 0,1.973 -1.532,3.403 -3.414,3.403 z m 0,-5.465 c -1.032,0 -1.922,0.851 -1.922,2.062 0,1.227 0.89,2.063 1.922,2.063 1.031,0 1.918,-0.836 1.918,-2.063 0,-1.211 -0.887,-2.062 -1.918,-2.062 z m -8.864,4.422 0,-1.446 3.453,0 c -0.101,-0.808 -0.371,-1.402 -0.785,-1.816 -0.504,-0.5 -1.289,-1.055 -2.668,-1.055 -2.125,0 -3.789,1.715 -3.789,3.84 0,2.125 1.664,3.84 3.789,3.84 1.149,0 1.985,-0.449 2.602,-1.031 l 1.019,1.019 c -0.863,0.824 -2.011,1.457 -3.621,1.457 -2.914,0 -5.363,-2.371 -5.363,-5.285 0,-2.914 2.449,-5.285 5.363,-5.285 1.575,0 2.758,0.516 3.688,1.484 0.953,0.953 1.25,2.293 1.25,3.375 0,0.336 -0.028,0.645 -0.078,0.903 l -4.86,0 z m 36.246,-1.121 c -0.281,0.761 -1.148,2.164 -2.914,2.164 -1.75,0 -3.207,-1.379 -3.207,-3.403 0,-1.906 1.442,-3.402 3.375,-3.402 1.563,0 2.465,0.953 2.836,1.508 l -1.16,0.773 c -0.387,-0.566 -0.914,-0.941 -1.676,-0.941 -0.757,0 -1.3,0.347 -1.648,1.031 l 4.551,1.883 -0.157,0.387 z m -4.64,-1.133 c -0.039,1.312 1.019,1.984 1.777,1.984 0.594,0 1.098,-0.297 1.266,-0.722 L 77.801,19.301 Z M 74.102,16 l 1.496,0 0,10 -1.496,0 0,-10 z m -2.45,5.84 -0.05,0 c -0.336,0.398 -0.977,0.758 -1.789,0.758 -1.704,0 -3.262,-1.496 -3.262,-3.414 0,-1.907 1.558,-3.391 3.262,-3.391 0.812,0 1.453,0.363 1.789,0.773 l 0.05,0 0,-0.488 c 0,-1.301 -0.695,-2 -1.816,-2 -0.914,0 -1.481,0.66 -1.715,1.215 L 66.82,14.75 c 0.375,-0.902 1.368,-2.012 3.016,-2.012 1.754,0 3.234,1.032 3.234,3.543 l 0,6.11 -1.418,0 0,-0.551 z m -1.711,-4.707 c -1.031,0 -1.894,0.863 -1.894,2.051 0,1.199 0.863,2.074 1.894,2.074 1.016,0 1.817,-0.875 1.817,-2.074 0,-1.188 -0.801,-2.051 -1.817,-2.051 z M 89.445,26 l -3.578,0 0,-10 1.492,0 0,3.789 2.086,0 c 1.657,0 3.282,1.199 3.282,3.106 0,1.906 -1.629,3.105 -3.282,3.105 z m 0.039,-4.82 -2.125,0 0,3.429 2.125,0 c 1.114,0 1.75,-0.925 1.75,-1.714 0,-0.774 -0.636,-1.715 -1.75,-1.715 z m 9.223,1.437 c -1.078,0 -2.199,-0.476 -2.66,-1.531 l 1.324,-0.555 c 0.285,0.555 0.809,0.735 1.363,0.735 0.774,0 1.559,-0.465 1.571,-1.286 l 0,-0.105 c -0.27,0.156 -0.848,0.387 -1.559,0.387 -1.426,0 -2.879,-0.785 -2.879,-2.25 0,-1.34 1.168,-2.203 2.481,-2.203 1.004,0 1.558,0.453 1.906,0.98 l 0.051,0 0,-0.773 1.441,0 0,3.836 c 0,1.773 -1.324,2.765 -3.039,2.765 z m -0.18,-5.48 c -0.488,0 -1.168,0.242 -1.168,0.847 0,0.774 0.848,1.071 1.582,1.071 0.657,0 0.965,-0.145 1.364,-0.336 -0.117,-0.926 -0.914,-1.582 -1.778,-1.582 z m 8.469,5.261 -1.715,-4.335 -0.051,0 -1.773,4.335 -1.609,0 2.664,-6.058 -1.52,-3.371 1.559,0 4.105,9.429 -1.66,0 z M 93.547,16 l 1.496,0 0,10 -1.496,0 0,-10 z"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path46"
+         inkscape:connector-curvature="0" /><g
+         id="g48"><path
+           d="M 16.348,33.969 C 16.113,33.723 15.977,33.34 15.977,32.844 l 0,-17.692 c 0,-0.496 0.136,-0.879 0.371,-1.125 l 0.058,-0.054 9.914,9.91 0,0.234 -9.914,9.91 -0.058,-0.058 z"
+           style="fill:url(#linearGradient50);fill-opacity:1;fill-rule:nonzero;stroke:none"
+           id="path64"
+           inkscape:connector-curvature="0" /></g><g
+         id="g66"><path
+           d="m 29.621,20.578 -3.301,3.305 0,0.234 3.305,3.305 0.074,-0.043 3.914,-2.227 c 1.117,-0.632 1.117,-1.672 0,-2.308 l -3.914,-2.223 -0.078,-0.043 z"
+           style="fill:url(#linearGradient68);fill-opacity:1;fill-rule:nonzero;stroke:none"
+           id="path78"
+           inkscape:connector-curvature="0" /></g><g
+         id="g80"><path
+           d="M 29.699,20.621 26.32,24 16.348,14.027 c 0.371,-0.39 0.976,-0.437 1.664,-0.047 l 11.687,6.641"
+           style="fill:url(#linearGradient82);fill-opacity:1;fill-rule:nonzero;stroke:none"
+           id="path88"
+           inkscape:connector-curvature="0" /></g><g
+         id="g90"><path
+           d="M 29.699,27.379 18.012,34.02 c -0.688,0.386 -1.293,0.339 -1.664,-0.051 L 26.32,24 l 3.379,3.379 z"
+           style="fill:url(#linearGradient92);fill-opacity:1;fill-rule:nonzero;stroke:none"
+           id="path104"
+           inkscape:connector-curvature="0" /></g><g
+         id="g106"><g
+           id="g108" /><g
+           id="g122"
+           mask="url(#mask114)"><g
+             id="g124" /><g
+             id="g146"><g
+               clip-path="url(#clipPath126)"
+               id="g148"><g
+                 id="g150"><path
+                   d="M 0,0 124,0 124,48 0,48 0,0 Z"
+                   style="fill:url(#pattern134);fill-opacity:1;fill-rule:nonzero;stroke:none"
+                   id="path152"
+                   inkscape:connector-curvature="0" /></g></g></g></g></g><g
+         id="g154"><g
+           id="g156" /><g
+           id="g170"
+           mask="url(#mask162)"><g
+             id="g172" /><g
+             id="g194"><g
+               clip-path="url(#clipPath174)"
+               id="g196"><g
+                 id="g198"><path
+                   d="M 0,0 124,0 124,48 0,48 0,0 Z"
+                   style="fill:url(#pattern182);fill-opacity:1;fill-rule:nonzero;stroke:none"
+                   id="path200"
+                   inkscape:connector-curvature="0" /></g></g></g></g></g><g
+         id="g202"><g
+           id="g204" /><g
+           id="g218"
+           mask="url(#mask210)"><g
+             id="g220" /><g
+             id="g242"><g
+               clip-path="url(#clipPath222)"
+               id="g244"><g
+                 id="g246"><path
+                   d="M 0,0 124,0 124,48 0,48 0,0 Z"
+                   style="fill:url(#pattern230);fill-opacity:1;fill-rule:nonzero;stroke:none"
+                   id="path248"
+                   inkscape:connector-curvature="0" /></g></g></g></g></g><g
+         id="g250"><g
+           id="g252" /><g
+           id="g266"
+           mask="url(#mask258)"><g
+             id="g268" /><g
+             id="g290"><g
+               clip-path="url(#clipPath270)"
+               id="g292"><g
+                 id="g294"><path
+                   d="M 0,0 124,0 124,48 0,48 0,0 Z"
+                   style="fill:url(#pattern278);fill-opacity:1;fill-rule:nonzero;stroke:none"
+                   id="path296"
+                   inkscape:connector-curvature="0" /></g></g></g></g></g></g></g></svg>
--- a/themes/default/client/src/img/success.png
+++ b/themes/default/client/src/img/success.png
--- a/themes/default/client/src/img/user.png
+++ b/themes/default/client/src/img/user.png
--- a/themes/default/client/src/img/warning.png
+++ b/themes/default/client/src/img/warning.png
--- a/themes/default/client/src/thirdparties/qrcode.min.js
+++ b/themes/default/client/src/thirdparties/qrcode.min.js
--- a/themes/default/server/.directory
+++ b/themes/default/server/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,58,21
+Version=3
+ViewMode=1
--- a/themes/default/server/src/resources/email-template.ejs
+++ b/themes/default/server/src/resources/email-template.ejs
@ -0,0 +1,254 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+   <head>
+      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+      <title>Simples-Minimalistic Responsive Template</title>
+      
+      <style type="text/css">
+         /* Client-specific Styles */
+         #outlook a {padding:0;} /* Force Outlook to provide a "view in browser" menu link. */
+         body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0;}
+         /* Prevent Webkit and Windows Mobile platforms from changing default font sizes, while not breaking desktop design. */
+         .ExternalClass {width:100%;} /* Force Hotmail to display emails at full width */
+         .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing.*/
+         #backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important;}
+         img {outline:none; text-decoration:none;border:none; -ms-interpolation-mode: bicubic;}
+         a img {border:none;}
+         .image_fix {display:block;}
+         p {margin: 0px 0px !important;}
+         table td {border-collapse: collapse;}
+         table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
+         a {color: #0a8cce;text-decoration: none;text-decoration:none!important;}
+          h1 { line-height: 30px; }
+         .button {padding: 15px 30px; border-radius: 10px; background: rgb(204, 204, 255); text-decoration:none; }
+
+         /*STYLES*/
+         table[class=full] { width: 100%; clear: both; }
+         /*IPAD STYLES*/
+         @media only screen and (max-width: 640px) {
+         a[href^="tel"], a[href^="sms"] {
+         text-decoration: none;
+         color: #0a8cce; /* or whatever your want */
+         pointer-events: none;
+         cursor: default;
+         }
+         .mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {
+         text-decoration: default;
+         color: #0a8cce !important;
+         pointer-events: auto;
+         cursor: default;
+         }
+         table[class=devicewidth] {width: 440px!important;text-align:center!important;}
+         table[class=devicewidthinner] {width: 420px!important;text-align:center!important;}
+         img[class=banner] {width: 440px!important;height:220px!important;}
+         img[class=colimg2] {width: 440px!important;height:220px!important;}
+         
+         }
+         /*IPHONE STYLES*/
+         @media only screen and (max-width: 480px) {
+         a[href^="tel"], a[href^="sms"] {
+         text-decoration: none;
+         color: #0a8cce; /* or whatever your want */
+         pointer-events: none;
+         cursor: default;
+         }
+         .mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {
+         text-decoration: default;
+         color: #0a8cce !important; 
+         pointer-events: auto;
+         cursor: default;
+         }
+         table[class=devicewidth] {width: 280px!important;text-align:center!important;}
+         table[class=devicewidthinner] {width: 260px!important;text-align:center!important;}
+         img[class=banner] {width: 280px!important;height:140px!important;}
+         img[class=colimg2] {width: 280px!important;height:140px!important;}
+         td[class=mobile-hide]{display:none!important;}
+         td[class="padding-bottom25"]{padding-bottom:25px!important;}
+        
+         }
+      </style>
+   </head>
+   <body>
+<!-- Start of header -->
+<table width="100%" bgcolor="#ffffff" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="header">
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td width="100%">
+                        <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+                           <tbody>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td>
+                                    <!-- logo -->
+                                    <table width="140" align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth">
+                                       <tbody>
+                                          <tr>
+                                             <td width="300" height="50" align="center">
+                                              	<h1><%= title %></h1>
+                                             </td>
+                                          </tr>
+                                       </tbody>
+                                    </table>
+                                    <!-- end of logo -->
+                                 </td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                              </tr>
+                              <!-- Spacing -->
+                           </tbody>
+                        </table>
+                     </td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- End of Header -->
+<!-- Start of seperator -->
+<table width="100%" bgcolor="#ffffff" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="seperator">
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" align="center" cellspacing="0" cellpadding="0" border="0" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td align="center" height="20" style="font-size:1px; line-height:1px;">&nbsp;</td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- End of seperator -->   
+<!-- Start Full Text -->
+<table width="100%" bgcolor="#ffffff" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="full-text">
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td width="100%">
+                        <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+                           <tbody>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td>
+                                    <table width="560" align="center" cellpadding="0" cellspacing="0" border="0" class="devicewidthinner">
+                                       <tbody>
+                                          <!-- Title -->
+                                          <tr>
+                                             <td style="font-family: Helvetica, arial, sans-serif; font-size: 16px; color: #333333; text-align:center; line-height: 30px;" st-title="fulltext-content">
+                                                This email has been sent to you in order to validate your identity. Please ignore it if you do not know why you received it.
+                                             </td>
+                                          </tr>
+                                          <!-- End of Title -->
+                                          <!-- spacing -->
+                                          <tr>
+                                             <td width="100%" height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                                          </tr>
+                                          <!-- End of spacing -->
+                                          <!-- content -->
+                                          <tr>
+                                             <td style="font-family: Helvetica, arial, sans-serif; font-size: 16px; color: #666666; text-align:center; line-height: 30px;" st-content="fulltext-content">
+                                                 <a href="<%= url %>" class="button"><%= button_title %></a>
+                                             </td>
+                                          </tr>
+                                          <!-- End of content -->
+                                       </tbody>
+                                    </table>
+                                 </td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;">&nbsp;</td>
+                              </tr>
+                              <!-- Spacing -->
+                           </tbody>
+                        </table>
+                     </td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- end of full text -->
+<!-- Start of seperator -->
+<table width="100%" bgcolor="#ffffff" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="seperator">
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" align="center" cellspacing="0" cellpadding="0" border="0" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td align="center" height="30" style="font-size:1px; line-height:1px;">&nbsp;</td>
+                  </tr>
+                  <tr>
+                     <td width="550" align="center" height="1" bgcolor="#d1d1d1" style="font-size:1px; line-height:1px;">&nbsp;</td>
+                  </tr>
+                  <tr>
+                     <td align="center" height="30" style="font-size:1px; line-height:1px;">&nbsp;</td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- End of seperator -->  
+<!-- Start of Postfooter -->
+<table width="100%" bgcolor="#ffffff" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="postfooter" >
+   <tbody>
+      <tr>
+         <td>
+            <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+               <tbody>
+                  <tr>
+                     <td width="100%">
+                        <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
+                           <tbody>
+                              <tr>
+                                 <td align="center" valign="middle" style="font-family: Helvetica, arial, sans-serif; font-size: 14px;color: #666666" st-content="postfooter">
+									Please ignore this email if you did not initiate the process.
+                                 </td>
+                              </tr>
+                              <!-- Spacing -->
+                              <tr>
+                                 <td width="100%" height="20"></td>
+                              </tr>
+                              <!-- Spacing -->
+                           </tbody>
+                        </table>
+                     </td>
+                  </tr>
+               </tbody>
+            </table>
+         </td>
+      </tr>
+   </tbody>
+</table>
+<!-- End of postfooter -->
+   
+   </body>
+   </html>
+
--- a/themes/default/server/src/views/already-logged-in.pug
+++ b/themes/default/server/src/views/already-logged-in.pug
@ -0,0 +1,14 @@
+extends layout/layout.pug 
+
+block form-header
+  h1 Sign in
+
+block content
+  img(class="header-img" src="/img/success.png" alt="success")
+  if redirection_url
+    p You are already logged in as <b>#{ username }</b>.<br/><br/>
+      | If you are not redirected in few seconds, click <a href="#{ redirection_url }">here</a>.<br/><br/>
+      | Otherwise, click <a href="#{ logout_endpoint }">here</a> to log off.
+  else
+    p You are already logged in as <b>#{ username }</b>.<br/><br/>
+      | Click <a href="#{ logout_endpoint }">here</a> to log off.
--- a/themes/default/server/src/views/errors/.directory
+++ b/themes/default/server/src/views/errors/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,59,58
+Version=3
+ViewMode=1
--- a/themes/default/server/src/views/errors/401.pug
+++ b/themes/default/server/src/views/errors/401.pug
@ -0,0 +1,16 @@
+extends ../layout/layout.pug
+
+block variables
+  - page_classname = "error-401";
+
+block form-header
+  h1 Error 401
+
+block content
+  img(class="header-img" src="/img/warning.png" alt="warning")
+  if redirection_url
+    p You are not authorized to access this resource.<br/><br/>
+      | Please click <a href=#{redirection_url}>here</a> if you are not 
+      | redirected in few seconds.
+  else
+    p You are not authorized to access this resource.
--- a/themes/default/server/src/views/errors/403.pug
+++ b/themes/default/server/src/views/errors/403.pug
@ -0,0 +1,16 @@
+extends ../layout/layout.pug
+
+block variables
+  - page_classname = "error-403";
+
+block form-header
+  h1 Error 403
+
+block content
+  img(class="header-img" src="/img/warning.png" alt="warning")
+  if redirection_url
+    p You don't have enough privileges to access this resource.<br/><br/>
+      | Please click <a href=#{redirection_url}>here</a> if you are not 
+      | redirected in few seconds.
+  else
+    p You don't have enough privileges to access this resource.
--- a/themes/default/server/src/views/errors/404.pug
+++ b/themes/default/server/src/views/errors/404.pug
@ -0,0 +1,11 @@
+extends ../layout/layout.pug
+
+block variables
+  - page_classname = "error-404";
+
+block form-header
+  <h1>Error 404</h1>
+
+block content
+  img(class="header-img" src="/img/warning.png" alt="warning")
+  p Page not found.
--- a/themes/default/server/src/views/firstfactor.pug
+++ b/themes/default/server/src/views/firstfactor.pug
@ -0,0 +1,23 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "firstfactor";
+
+block form-header
+  h1 Sign in
+
+block content
+  div(class="notification")
+  img(class="header-img" src="/img/user.png" alt="user profile")
+  p Enter your credentials to sign in
+  form(class="form-signin")
+    div(class="form-inputs")
+      input(type="text" class="form-control" id="username" placeholder="Username" required autofocus)
+      input(type="password" class="form-control" id="password" placeholder="Password" required)
+    button(id="signin" class="btn btn-lg btn-primary btn-block" type="submit") Sign in
+    div(class="keep-me-logged-in pull-left")
+      input(type="checkbox" id="keep_me_logged_in" name="keep_me_logged_in" value="true")
+      label(for="keep_me_logged_in") Keep me logged in
+    div(class="bottom-right-links pull-right")
+      a(href=reset_password_request_endpoint, class="link forgot-password") Forgot password?
+    span(class="clearfix")
--- a/themes/default/server/src/views/layout/layout.pug
+++ b/themes/default/server/src/views/layout/layout.pug
@ -0,0 +1,29 @@
+block variables
+
+doctype html
+html
+  head
+    title Authelia - 2FA
+    meta(name="viewport", content="width=device-width, initial-scale=1.0")
+    meta(name="robots", content="noindex, nofollow, nosnippet, noarchive")
+    meta(http-equiv="Content-Security-Policy", content="default-src 'self'; img-src 'self' data:;")
+    link(rel="icon", href="/img/icon.png" type="image/png" sizes="32x32")
+    link(rel="stylesheet", type="text/css", href="/css/authelia.css")
+    if redirection_url
+      meta(http-equiv="refresh" content="4;url=" + redirection_url) 
+  body
+    canvas#canvas(width='400', height='300')
+    div(class="container")
+      div(class="row")
+        div(class="col-xs-12 col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3 col-lg-6 col-lg-offset-3")
+          div(class="account-wall " + page_classname)
+            div(class="row header")
+              block form-header
+            div(class="row body")
+              div(class="form col-xs-10 col-xs-offset-1 col-sm-8 col-sm-offset-2 col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2")
+                block content
+            div(class="row footer poweredby-block")
+              div(class="poweredby col-xs-6 col-xs-offset-4 col-sm-6 col-sm-offset-4 col-md-6 col-md-offset-4")
+                | Powered by <a class="authelia-brand" href="https://github.com/clems4ever/authelia">Authelia</a>
+    block entrypoint
+    script(src="/js/authelia.js", type="text/javascript")
--- a/themes/default/server/src/views/need-identity-validation.pug
+++ b/themes/default/server/src/views/need-identity-validation.pug
@ -0,0 +1,12 @@
+extends layout/layout.pug
+
+block variables
+  - page_classname = "identity-validation";
+
+block form-header
+  h1 Registration
+
+block content
+  img(class="header-img" src="/img/mail.png" alt="mail")
+  p A confirmation email has been sent to your mailbox. 
+    | Please open it and click on the link within 15 minutes to confirm the registration.
--- a/themes/default/server/src/views/password-reset-form.pug
+++ b/themes/default/server/src/views/password-reset-form.pug
@ -0,0 +1,18 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "password-reset-form";
+
+block form-header
+  h1 Reset password
+
+block content
+  div(class="notification")
+  img(class="header-img" src="/img/password.png" alt="password")
+  p Set your new password and confirm it.
+  form(class="form-signin")
+    div(class="form-inputs")
+      input(class="form-control" type="password" name="password1" id="password1" placeholder="New password" required="required")
+      input(class="form-control" type="password" name="password2" id="password2" placeholder="Password confirmation" required="required")
+    button(id="reset-password-button" class="btn btn-lg btn-primary btn-block" type="submit") Reset Password
+    span(class="clearfix")
--- a/themes/default/server/src/views/password-reset-request.pug
+++ b/themes/default/server/src/views/password-reset-request.pug
@ -0,0 +1,18 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "password-reset-request";
+
+block form-header
+  h1 Reset password
+
+block content
+  div(class="notification")
+  div
+    img(class="header-img" src="/img/password.png" alt="password")
+    p After giving your username, you will receive an email to change your password.
+  form(class="form-signin")
+    div(class="form-inputs")
+      input(type="text" class="form-control" name="username" id="username" placeholder="Your username" required="required")
+    button(id="reset-password-button" class="btn btn-lg btn-primary btn-block" type="submit") Reset Password
+    span(class="clearfix")
--- a/themes/default/server/src/views/secondfactor.pug
+++ b/themes/default/server/src/views/secondfactor.pug
@ -0,0 +1,30 @@
+extends layout/layout.pug
+
+block variables
+  - page_classname = "secondfactor";
+
+block form-header
+  h1 Sign in
+
+block content
+  div
+    div(class="notification")
+    h3 Hi <b>#{username}</b>
+  div(class="row")
+    div(class="u2f-token")
+      img(src="/img/pendrive.png", alt="security key")
+    p
+      | Please, touch your <a href="https://www.yubico.com/products/yubikey-hardware/fido-u2f-security-key/">security key</a><br/>
+      b Or<br/>
+      | Get a one-time password
+    form(class="form-signin totp")
+      div(class="form-inputs")
+        input(type="text" autocomplete="off" class="form-control" id="token" placeholder="Token" required autofocus)
+      button(class="btn btn-lg btn-primary btn-block totp-button" type="submit") Sign in
+      div(class="pull-right bottom-right-links")
+        div Need to register?
+        div
+          a(href=u2f_identity_start_endpoint, class="link register-u2f", data-toggle="tooltip", title="A security key is required to register.") Security key
+          |  | 
+          a(href=totp_identity_start_endpoint, class="link register-totp") Google Authenticator
+          span(class="clearfix")
--- a/themes/default/server/src/views/totp-register.pug
+++ b/themes/default/server/src/views/totp-register.pug
@ -0,0 +1,25 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "totp-register";
+
+block form-header
+  h1 One-time passwords
+
+block content
+  p Open Google Authenticator and add this entry
+  p(id="secret") #{ base32_secret }
+  p or scan this barcode
+  div(id="qrcode") #{ otpauth_url }
+  p
+    a(href=login_endpoint, id="login-button") Login
+  div(class="need-google-authenticator")
+    | Need Google Authenticator?
+    div(class="store-badges")
+      a(href='https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2&hl=en&pcampaignid=MKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1', target="_blank")
+        img(alt='Get it on Google Play', src='/img/stores/googleplay-badge.svg', class="store-badge")
+      a(href='https://itunes.apple.com/us/app/google-authenticator/id388497605?mt=8', target="_blank")
+        img(alt='Get it on Apple Store' src='/img/stores/applestore-badge.svg' class="store-badge")
+
+block entrypoint
+  script(src="/js/qrcode.min.js", type="text/javascript" )
--- a/themes/default/server/src/views/u2f-register.pug
+++ b/themes/default/server/src/views/u2f-register.pug
@ -0,0 +1,11 @@
+extends layout/layout.pug 
+
+block variables
+  - page_classname = "u2f-register";
+
+block form-header
+  h1 Register your security key
+
+block content
+  p Touch the token to register your security key.
+  img(src="/img/pendrive.png" alt="pendrive")
--- a/themes/matrix/client/src/css/.directory
+++ b/themes/matrix/client/src/css/.directory
@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2018,12,17,20,56,41
+Version=3
+ViewMode=1
--- a/themes/matrix/client/src/css/00-bootstrap.min.css
+++ b/themes/matrix/client/src/css/00-bootstrap.min.css
--- a/themes/matrix/client/src/css/01-main.css
+++ b/themes/matrix/client/src/css/01-main.css
@ -0,0 +1,77 @@
+body {
+  /*background-image: url("//*img//*LargeTriangles.svg");*/
+  /*background-image: url("//*img//*RandomizedPattern.svg");*/
+  /*background-image: url("//*img//*background.svg");*/  
+  background-color:#000000;
+}
+canvas{
+  position:absolute;
+  top:0;
+  left:0;
+}
+.authelia-brand {
+  font-weight: bold;
+  font-style: italic;
+  color: #ffffff
+}
+.poweredby-block {
+  margin: 0px 30px;
+  margin-top: 10px;
+  padding-top: 15px;
+  border-top: 1px solid rgba(0, 0, 0, 0.15);
+
+}
+.poweredby {
+  font-size: 0.7em;
+  color: white;
+}
+/* notifications */
+.notification {
+  padding: 10px;
+  margin: 15px 0px;
+  border-radius: 6px;
+  display: none;
+  position: absolute;
+}
+.notification img {
+  width: 24px;
+  margin-right: 10px;
+}
+.notification i,
+.notification span {
+  display:table-cell;
+  vertical-align:middle;
+}
+.info {
+  border: 1px solid #9cb1ff;
+  background-color: rgb(192, 220, 255);
+}
+.success {
+  border: 1px solid #65ec7c;
+  background-color: rgb(163, 255, 157);
+}
+.error {
+  border: 1px solid #ffa3a3;
+  background-color: rgb(255, 175, 175);
+}
+.warning {
+  border: 1px solid #ffd743;
+  background-color: rgb(255, 230, 143);
+}
+.bottom-right-links {
+  text-align: right;
+  margin-top: 10px;
+  font-size: 0.8em;
+  color: white;
+}
+.header {
+  background-color: #000000;
+  color: white;
+  margin: 0px;
+}
+.body {
+  padding: 10px;
+}
+h1 {
+  font-size: 25px;
+}
--- a/themes/matrix/client/src/css/02-login.css
+++ b/themes/matrix/client/src/css/02-login.css
@ -0,0 +1,136 @@
+.form-signin
+{
+    margin: 0 auto;
+}
+
+.form-signin .form-signin-heading, .form-signin .checkbox
+{
+    margin-bottom: 10px;
+}
+
+.form-signin .checkbox
+{
+    font-weight: normal;
+}
+
+.form-signin .form-control
+{
+    position: relative;
+    font-size: 16px;
+    height: auto;
+    padding: 10px;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+.form-signin .form-control:focus
+{
+    z-index: 2;
+}
+.form-signin input[type="text"]
+{
+    margin-bottom: -1px;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+.form-signin input[type="password"]
+{
+    /* margin-bottom: 10px; */
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+}
+.account-wall
+{
+    border: 1px solid #000;
+    margin-top: 20px;
+    padding-bottom: 20px;
+    background-color: #000000;
+    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 1);
+    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 1);
+    box-shadow: 0px 2px 2px rgba(0, 0, 0, 1);
+}
+.account-wall h1
+{
+    margin-bottom: 15px;
+    margin-top: 15px;
+    font-weight: 800;
+    display: block;
+    text-align: center;
+}
+.account-wall h3
+{
+    display: block;
+    text-align: center;
+}
+.account-wall p 
+{
+    text-align: center;
+    margin: 10px;
+    color: white;
+}
+.account-wall .form-inputs 
+{
+    margin-bottom: 10px;
+    border-color: #b20c0c;
+}
+.account-wall hr {
+    border-color: #c5c5c5;
+}
+
+.header-img
+{
+    width: 96px;
+    height: 96px;
+    margin: 0 auto 10px;
+    display: block;
+    -moz-border-radius: 50%;
+    -webkit-border-radius: 50%;
+    border-radius: 50%;
+}
+
+.link
+{
+    margin-top: 10px;
+    color: white;
+}
+
+.btn-primary.totp
+{
+    background-color: rgb(102, 135, 162);
+}
+
+.btn-primary.u2f
+{
+    background-color: rgb(83, 149, 204);
+}
+
+.u2f-token {
+    text-align: center;
+}
+
+.u2f-token img {
+    width: 70px;
+}
+
+.keep-me-logged-in {
+    margin-top: 10px;
+    font-size: 0.8em;
+    color: white;
+}
+
+.keep-me-logged-in input[type=checkbox] {
+    transform: scale(0.8);
+    margin: 0;
+    margin-right: 4px;
+}
+
+.keep-me-logged-in label {
+    font-weight: 300;
+}
+
+.keep-me-logged-in input,
+.keep-me-logged-in label {
+    display: inline-block;
+    margin-bottom: 0; /* I added this after I posted my reply */
+    vertical-align: middle; /* Fixes any weird issues in Firefox and IE */
+}
--- a/themes/matrix/client/src/css/03-errors.css
+++ b/themes/matrix/client/src/css/03-errors.css
@ -0,0 +1,12 @@
+
+.error-401 .header-img {
+    border-radius: 0%;
+}
+
+.error-403 .header-img {
+    border-radius: 0%;
+}
+
+.error-404 .header-img {
+    border-radius: 0%;
+}
--- a/themes/matrix/client/src/css/03-password-reset-form.css
+++ b/themes/matrix/client/src/css/03-password-reset-form.css
@ -0,0 +1,4 @@
+
+.password-reset-form .header-img {
+    border-radius: 0%;
+}
--- a/Show More
+++ b/Show More
				`@ -0,0 +1 @@`
				<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='100' height='50' viewBox='0 0 100 50'><rect fill='#000000' width='50' height='25'/><defs><rect stroke='#000000' stroke-width='0.5' width='1' height='1' id='s'/><pattern id='a' width='2' height='2' patternUnits='userSpaceOnUse'><g stroke='#000000' stroke-width='0.5'><rect fill='#050505' width='1' height='1'/><rect fill='#000000' width='1' height='1' x='1' y='1'/><rect fill='#0a0a0a' width='1' height='1' y='1'/><rect fill='#0f0f0f' width='1' height='1' x='1'/></g></pattern><pattern id='b' width='5' height='11' patternUnits='userSpaceOnUse'><g fill='#141414'><use xlink:href='#s' x='2' y='0'/><use xlink:href='#s' x='4' y='1'/><use xlink:href='#s' x='1' y='2'/><use xlink:href='#s' x='2' y='4'/><use xlink:href='#s' x='4' y='6'/><use xlink:href='#s' x='0' y='8'/><use xlink:href='#s' x='3' y='9'/></g></pattern><pattern id='c' width='7' height='7' patternUnits='userSpaceOnUse'><g fill='#1a1a1a'><use xlink:href='#s' x='1' y='1'/><use xlink:href='#s' x='3' y='4'/><use xlink:href='#s' x='5' y='6'/><use xlink:href='#s' x='0' y='3'/></g></pattern><pattern id='d' width='11' height='5' patternUnits='userSpaceOnUse'><g fill='#000000'><use xlink:href='#s' x='1' y='1'/><use xlink:href='#s' x='6' y='3'/><use xlink:href='#s' x='8' y='2'/><use xlink:href='#s' x='3' y='0'/><use xlink:href='#s' x='0' y='3'/></g><g fill='#1f1f1f'><use xlink:href='#s' x='8' y='3'/><use xlink:href='#s' x='4' y='2'/><use xlink:href='#s' x='5' y='4'/><use xlink:href='#s' x='10' y='0'/></g></pattern><pattern id='e' width='47' height='23' patternUnits='userSpaceOnUse'><g fill='#000000'><use xlink:href='#s' x='2' y='5'/><use xlink:href='#s' x='23' y='13'/><use xlink:href='#s' x='4' y='18'/><use xlink:href='#s' x='35' y='9'/></g></pattern><pattern id='f' width='61' height='31' patternUnits='userSpaceOnUse'><g fill='#000000'><use xlink:href='#s' x='16' y='0'/><use xlink:href='#s' x='13' y='22'/><use xlink:href='#s' x='44' y='15'/><use xlink:href='#s' x='12' y='11'/></g></pattern></defs><rect fill='url(#a)' width='100' height='50'/><rect fill='url(#b)' width='100' height='50'/><rect fill='url(#c)' width='100' height='50'/><rect fill='url(#d)' width='100' height='50'/><rect fill='url(#e)' width='100' height='50'/><rect fill='url(#f)' width='100' height='50'/></svg>