diff --git a/keycloak/Dockerfile b/keycloak/Dockerfile
new file mode 100644
index 00000000..24a6069e
--- /dev/null
+++ b/keycloak/Dockerfile
@@ -0,0 +1,28 @@
+##FROM quay.io/keycloak/keycloak:latest as builder
+#FROM quay.io/keycloak/keycloak:22.0.4 as builder
+#
+## Copy the theme
+#COPY ./themes/treetracker /opt/keycloak/themes/treetracker
+#
+#RUN /opt/keycloak/bin/kc.sh build
+#
+#FROM quay.io/keycloak/keycloak:22.0.4
+#ENTRYPOINT ["/opt/keycloak/bin/kc.sh"]
+
+FROM quay.io/keycloak/keycloak:latest as builder
+ENV KC_HEALTH_ENABLED=true
+ENV KC_METRICS_ENABLED=true
+
+# Configure a database vendor
+ENV KC_DB=postgres
+
+WORKDIR /opt/keycloak
+
+# Copy the theme
+COPY ./themes/treetracker /opt/keycloak/themes/treetracker
+RUN /opt/keycloak/bin/kc.sh build
+
+FROM quay.io/keycloak/keycloak:latest
+COPY --from=builder /opt/keycloak/ /opt/keycloak/
+
+ENTRYPOINT ["/opt/keycloak/bin/kc.sh"]
diff --git a/keycloak/README.md b/keycloak/README.md
new file mode 100644
index 00000000..9354767b
--- /dev/null
+++ b/keycloak/README.md
@@ -0,0 +1,8 @@
+# How to run it locally in a docker container
+
+```
+docker run -d --name mykeycloak -p 3001:8080 \
+        -e KEYCLOAK_ADMIN=admin -e KEYCLOAK_ADMIN_PASSWORD=change_me \
+        mykeycloak:theme \
+        start-dev
+```
diff --git a/keycloak/keycloak.yaml b/keycloak/keycloak.yaml
new file mode 100644
index 00000000..b0adc57d
--- /dev/null
+++ b/keycloak/keycloak.yaml
@@ -0,0 +1,126 @@
+apiVersion: k8s.keycloak.org/v2alpha1
+kind: Keycloak
+metadata:
+  name: example-kc
+spec:
+  instances: 1
+  image: dadiorchen/keycloak:1.1
+  db:
+    vendor: postgres
+    database: testdb
+    schema: keycloak
+    host: postgres-db
+    usernameSecret:
+      name: keycloak-db-secret
+      key: username
+    passwordSecret:
+      name: keycloak-db-secret
+      key: password
+        #  http:
+        #    tlsSecret: example-tls-secret
+        #hostname:
+        #hostname: example-kc-service.keycloak.svc.cluster.local
+  http:
+    httpEnabled: true
+  hostname:
+    strict: false
+    strictBackchannel: false
+  unsupported:
+    podTemplate:
+      spec:
+        containers:
+          - name: keycloak
+            env:
+              - name: KC_LOG_LEVEL
+                value: INFO
+              - name: KC_DB
+                value: postgres
+
+
+---
+# Ingress Nginx to expose Keycloak
+#apiVersion: extensions/v1beta1
+apiVersion: networking.k8s.io/v1
+kind: Ingress
+metadata:
+  name: keycloak-ingress
+    #  annotations:
+    #    nginx.ingress.kubernetes.io/rewrite-target: /
+spec:
+  ingressClassName: nginx
+  defaultBackend:
+    service:
+      name: example-kc-service
+      port:
+        number: 8080
+    #  rules:
+    #  - http:
+    #      paths:
+    #      - path: /
+    #        pathType: Prefix
+    #        backend:
+    #          service: 
+    #            name: example-kc-service 
+    #            port: 
+    #              number: 8080
+
+---
+## Nginx Ingress Controller
+#apiVersion: v1
+#kind: service
+#metadata:
+#  name: nginx-ingress-controller
+#spec:
+#  type: LoadBalancer
+#  ports:
+#    - port: 80
+#      targetPort: 80
+#      protocol: TCP
+#      name: http
+#    - port: 443
+#      targetPort: 443
+#      protocol: TCP
+#      name: https
+#  selector:
+#    app: nginx-ingress-controller
+#
+#---
+## Nginx Ingress Controller
+#apiVersion: apps/v1
+#kind: Deployment
+#metadata:
+#  name: nginx-ingress-controller
+#spec:
+#  replicas: 1
+#  selector:
+#    matchLabels:
+#      app: nginx-ingress-controller
+#  template:
+#    metadata:
+#      labels:
+#        app: nginx-ingress-controller
+#    spec:
+#      containers:
+#        - name: nginx-ingress-controller
+#          image: quay.io/kubernetes-ingress-controller/nginx-ingress-controller:0.32.0
+#          args:
+#            - /nginx-ingress-controller
+#            - --publish-service=nginx-ingress-controller
+#            - --configmap=$(POD_NAMESPACE)/nginx-configuration
+#            - --tcp-services-configmap=$(POD_NAMESPACE)/tcp-services
+#            - --udp-services-configmap=$(POD_NAMESPACE)/udp-services
+#            - --annotations-prefix=nginx.ingress.kubernetes.io
+#          env:
+#            - name: POD_NAME
+#              valueFrom:
+#                fieldRef:
+#                  fieldPath: metadata.name
+#            - name: POD_NAMESPACE
+#              valueFrom:
+#                fieldRef:
+#                  fieldPath: metadata.namespace
+#          ports:
+#            - name: http
+#              containerPort: 80
+#            - name: https
+#              containerPort: 443
diff --git a/keycloak/test-db.yaml b/keycloak/test-db.yaml
new file mode 100644
index 00000000..d2aa0d0f
--- /dev/null
+++ b/keycloak/test-db.yaml
@@ -0,0 +1,43 @@
+apiVersion: apps/v1
+kind: StatefulSet
+metadata:
+  name: postgresql-db
+spec:
+  serviceName: postgresql-db-service
+  selector:
+    matchLabels:
+      app: postgresql-db
+  replicas: 1
+  template:
+    metadata:
+      labels:
+        app: postgresql-db
+    spec:
+      containers:
+        - name: postgresql-db
+          image: postgres:latest
+          volumeMounts:
+            - mountPath: /data
+              name: cache-volume
+          env:
+            - name: POSTGRES_PASSWORD
+              value: testpassword
+            - name: PGDATA
+              value: /data/pgdata
+            - name: POSTGRES_DB
+              value: keycloak
+      volumes:
+        - name: cache-volume
+          emptyDir: {}
+---
+apiVersion: v1
+kind: Service
+metadata:
+  name: postgres-db
+spec:
+  selector:
+    app: postgresql-db
+  type: LoadBalancer
+  ports:
+  - port: 5432
+    targetPort: 5432
diff --git a/keycloak/test/README.md b/keycloak/test/README.md
new file mode 100644
index 00000000..d4a2af09
--- /dev/null
+++ b/keycloak/test/README.md
@@ -0,0 +1,5 @@
+# The Keycloak client test
+
+To use the test, run `npx serve -l 3001` under current folder.
+
+Visit: http://localhost:3001
diff --git a/keycloak/test/index.html b/keycloak/test/index.html
new file mode 100644
index 00000000..47cc28b0
--- /dev/null
+++ b/keycloak/test/index.html
@@ -0,0 +1,323 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <title>Photoz HTML5 Client</title>
+
+    <!-- Load AngularJS -->
+    <!--
+    <script src="lib/jwt-decode.min.js"></script>
+    -->
+
+    <script src="http://167.172.8.145/js/keycloak.js"></script>
+    <script src="http://167.172.8.145/js/keycloak-authz.js"></script>
+    <script >
+      var keycloak;
+      var auzTemp;
+      window.onload = function() {
+        keycloak = new Keycloak({
+          url: 'http://167.172.8.145',
+          realm: 'test',
+          clientId: 'test-client',
+          // realm: 'quickstart',
+          // clientId: 'webmap-client',
+        });
+	console.warn("keycloak:", keycloak);
+	// force logout everytime
+	// keycloak.logout();
+  //        var keycloakAuthz = new KeycloakAuthz(keycloak);
+        keycloak.init({onLoad: 'login-required'}).success(function () {
+          console.log('User is now authenticated.');
+	  console.log("loaded token:", keycloak.token);
+          document.getElementById('token').innerHTML = "loaded token: " + keycloak.token;
+          keycloak.loadUserProfile().
+            success(function (profile) {
+              console.log('User profile loaded: ' + JSON.stringify(profile));
+            });
+          keycloak.loadUserInfo().then(() => {
+            console.warn('user', keycloak.userInfo);
+            console.warn('user', keycloak.userInfo);
+	    document.getElementById('user').innerHTML = "loaded user: " + keycloak.userInfo.preferred_username;
+          });
+          console.error("keycloak", keycloak);
+          if(keycloak.token){
+            auzTemp = new KeycloakAuthorization(keycloak);
+            console.warn('auz', auzTemp);
+            const inited = auzTemp.init()
+            console.warn("inited", inited);
+//            .then(() => {
+//              console.warn('auz', auzTemp);
+//            });
+            setTimeout(() => {
+              console.warn('auz', auzTemp);
+              auzTemp.entitlement('microservice').then((res) => {
+                console.warn('entitlement', res);
+                const r = jwt_decode(res);
+                console.warn('r', r);
+                console.log(JSON.stringify(r, undefined,2));
+                console.warn("rpt:", auzTemp.rpt);
+                document.getElementById('rpt').innerHTML = "loaded rpt: " + auzTemp.rpt;
+              });
+            }, 1000*2);
+          }else{
+            console.error('no token');
+          }
+        }).error(function (e) {
+            console.error('User is not authenticated: ', e); 
+            // window.location.reload();
+        });
+      }
+      function handleLogin(){
+        window.location.href = keycloak.createLoginUrl();
+      }
+
+      function handleAPI(){
+        fetch('https://treetracker.local/api/organizations/178/theme', {
+          method: 'GET',
+          headers: {
+            //'Authorization': 'Bearer ' + keycloak.token,
+            'Authorization': 'Bearer ' + auzTemp.rpt,
+          }
+        }).then(function(response) {
+	  console.log('response', response);
+	  return response.json();
+	}).then(function(json) {
+	  console.log('json', json);
+	  document.getElementById('settings').innerHTML = "loaded settings: " + JSON.stringify(json, undefined,2);
+	});
+      }
+
+      function handleAPI2(){
+        fetch('https://treetracker.local/api/web-map-settings', {
+          method: 'GET',
+          headers: {
+            //'Authorization': 'Bearer ' + keycloak.token,
+            'Authorization': 'Bearer ' + auzTemp.rpt,
+          }
+        })
+      }
+
+      function handleAPI3(){
+        fetch('https://treetracker.local/api/web-map-settings', {
+          method: 'POST',
+          headers: {
+            //'Authorization': 'Bearer ' + keycloak.token,
+            'Authorization': 'Bearer ' + auzTemp.rpt,
+          }
+        })
+      }
+
+      function handleAPI4(){
+        fetch('https://treetracker.local/api/organizations/178', {
+          method: 'GET',
+          headers: {
+            //'Authorization': 'Bearer ' + keycloak.token,
+            'Authorization': 'Bearer ' + auzTemp.rpt,
+          }
+        })
+      }
+
+      function handleAPI5(){
+        fetch('https://treetracker.local/api/organizations/178', {
+          method: 'POST',
+          headers: {
+            //'Authorization': 'Bearer ' + keycloak.token,
+            'Authorization': 'Bearer ' + auzTemp.rpt,
+          }
+        })
+      }
+
+      function handleLogout(){
+      	console.warn("begin logout");
+	window.location.href = keycloak.createLogoutUrl();
+      }
+    </script>
+</head>
+
+<body>
+  <h1>Client App</h1>
+  <button onclick={javascript:handleLogin();} >Login</button>
+  <button onclick={javascript:handleLogout();} >Logout</button>
+  <button onclick={javascript:handleAPI();} >API</button>
+  <button onclick={javascript:handleAPI2();} >API:web-map-settings:view</button>
+  <button onclick={javascript:handleAPI3();} >API:web-map-settings:edit</button>
+  <button onclick={javascript:handleAPI4();} >GET /api/organizations/178</button>
+  <button onclick={javascript:handleAPI5();} >POST /api/organizations/178</button>
+  <div>user:
+    <div id="user" />
+  </div>
+  <div>rpt:
+    <div id="rpt" />
+  </div>
+  <div>token:
+    <div id="token" />
+  </div>
+  <div>settings:
+    <div id="settings" />
+  </div>
+
+</body>
+</html>
+<script>
+      !(function a(b, c, d) {
+        function e(g, h) {
+          if (!c[g]) {
+            if (!b[g]) {
+              var i = 'function' == typeof require && require;
+              if (!h && i) return i(g, !0);
+              if (f) return f(g, !0);
+              throw new Error("Cannot find module '" + g + "'");
+            }
+            var j = (c[g] = { exports: {} });
+            b[g][0].call(
+              j.exports,
+              function (a) {
+                var c = b[g][1][a];
+                return e(c ? c : a);
+              },
+              j,
+              j.exports,
+              a,
+              b,
+              c,
+              d,
+            );
+          }
+          return c[g].exports;
+        }
+        for (
+          var f = 'function' == typeof require && require, g = 0;
+          g < d.length;
+          g++
+        )
+          e(d[g]);
+        return e;
+      })(
+        {
+          1: [
+            function (a, b) {
+              function c(a) {
+                return decodeURIComponent(
+                  atob(a).replace(/(.)/g, function (a, b) {
+                    var c = b.charCodeAt(0).toString(16).toUpperCase();
+                    return c.length < 2 && (c = '0' + c), '%' + c;
+                  }),
+                );
+              }
+              var d = a('Base64');
+              b.exports = function (a) {
+                var b = a.replace(/-/g, '+').replace(/_/g, '/');
+                switch (b.length % 4) {
+                  case 0:
+                    break;
+                  case 2:
+                    b += '==';
+                    break;
+                  case 3:
+                    b += '=';
+                    break;
+                  default:
+                    throw 'Illegal base64url string!';
+                }
+                try {
+                  return c(b);
+                } catch (e) {
+                  return d.atob(b);
+                }
+              };
+            },
+            { Base64: 4 },
+          ],
+          2: [
+            function (a, b) {
+              'use strict';
+              var c = a('./base64_url_decode'),
+                d = a('./json_parse');
+              b.exports = function (a) {
+                if (!a) throw new Error('Invalid token specified');
+                return d(c(a.split('.')[1]));
+              };
+            },
+            { './base64_url_decode': 1, './json_parse': 3 },
+          ],
+          3: [
+            function (require, module, exports) {
+              module.exports = function (str) {
+                var parsed;
+                return (parsed =
+                  'object' == typeof JSON
+                    ? JSON.parse(str)
+                    : eval('(' + str + ')'));
+              };
+            },
+            {},
+          ],
+          4: [
+            function (a, b, c) {
+              !(function () {
+                var a = 'undefined' != typeof c ? c : this,
+                  b =
+                    'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=',
+                  d = (function () {
+                    try {
+                      document.createElement('$');
+                    } catch (a) {
+                      return a;
+                    }
+                  })();
+                a.btoa ||
+                  (a.btoa = function (a) {
+                    for (
+                      var c, e, f = 0, g = b, h = '';
+                      a.charAt(0 | f) || ((g = '='), f % 1);
+                      h += g.charAt(63 & (c >> (8 - (f % 1) * 8)))
+                    ) {
+                      if (((e = a.charCodeAt((f += 0.75))), e > 255)) throw d;
+                      c = (c << 8) | e;
+                    }
+                    return h;
+                  }),
+                  a.atob ||
+                  (a.atob = function (a) {
+                    if (((a = a.replace(/=+$/, '')), a.length % 4 == 1))
+                      throw d;
+                    for (
+                      var c, e, f = 0, g = 0, h = '';
+                      (e = a.charAt(g++));
+                      ~e && ((c = f % 4 ? 64 * c + e : e), f++ % 4)
+                        ? (h += String.fromCharCode(
+                          255 & (c >> ((-2 * f) & 6)),
+                        ))
+                        : 0
+                    )
+                      e = b.indexOf(e);
+                    return h;
+                  });
+              })();
+            },
+            {},
+          ],
+          5: [
+            function (a) {
+              var b =
+                'undefined' != typeof self
+                  ? self
+                  : 'undefined' != typeof window
+                    ? window
+                    : {},
+                c = a('./lib/index');
+              'function' == typeof b.window.define && b.window.define.amd
+                ? b.window.define('jwt_decode', function () {
+                  return c;
+                })
+                : b.window && (b.window.jwt_decode = c);
+            },
+            { './lib/index': 2 },
+          ],
+        },
+        {},
+        [5],
+      );
+      /* eslint-enable */
+</script>
diff --git a/keycloak/themes/treetracker/login/resources/css/treetracker.css b/keycloak/themes/treetracker/login/resources/css/treetracker.css
new file mode 100644
index 00000000..714a96ce
--- /dev/null
+++ b/keycloak/themes/treetracker/login/resources/css/treetracker.css
@@ -0,0 +1,34 @@
+.login-pf body {
+  /*background: url(https://treetracker-production-images.s3.eu-central-1.amazonaws.com/2023.09.23.14.04.00_0.45559833333333327_109.32892366666664_5e5b8f08-2f3f-46f7-adbe-967030e48266_IMG_20230829_091903_642222451085378253.jpg) no-repeat center center fixed;*/
+  background: url(https://treetracker-production-images.s3.eu-central-1.amazonaws.com/2023.04.21.03.36.20_8.485640049999999_-13.254117873333334_27928e01-6f29-4ac0-bee2-df494f3a1363_IMG_20230412_170116_1704432758494134189.jpg) no-repeat left 35%;
+  background-size: cover;
+}
+div.kc-logo-text {
+  /*background-image: url(https://map.treetracker.org/images/treetracker_logo.svg);*/
+  background-image: url(https://map.treetracker.org/images/treetracker_logo_white.svg);
+}
+:root {
+  --pf-global--primary-color--100: #86C232;
+  --pf-global--primary-color--200: #a6dc5a;
+  --pf-global--primary-color--dark-100: #86C232;
+  --pf-global--primary-color--light-100: #a6dc5a;
+  --pf-global--active-color--100: #68a119;
+  --pf-global--active-color--200: #b9ef6d;
+  --pf-global--active-color--300: #89e00f;
+  --pf-global--active-color--400: #80aa44;
+  --pf-global--link--Color: #61901f;
+  --pf-global--link--Color--hover: #547722;
+  --pf-global--link--Color--light: #b4ef62;
+  --pf-global--link--Color--light--hover: #b7e973;
+  --pf-global--link--Color--dark: #679822;
+  --pf-global--link--Color--dark--hover: #5e9413;
+  --pf-global--default-color--100: #86C232;
+  --pf-global--default-color--200: #a6dc5a;
+  --pf-global--default-color--300: #86C232;
+}
+@media (max-width: 767px) {
+    .login-pf-page .card-pf {
+        margin-left: 20px;
+        margin-right: 20px;
+    }
+}
diff --git a/keycloak/themes/treetracker/login/resources/js/treetracker.js b/keycloak/themes/treetracker/login/resources/js/treetracker.js
new file mode 100644
index 00000000..75e84fbd
--- /dev/null
+++ b/keycloak/themes/treetracker/login/resources/js/treetracker.js
@@ -0,0 +1,18 @@
+// javascript to append a new div to body
+var newDiv = document.createElement("div");
+newDiv.innerHTML = `
+<div style="
+    position: fixed;
+    bottom: 0px;
+    margin: 10px 20px;
+    background-color: #09090980;
+    color: white;
+    font-size: 16px;
+    padding: 5px;
+">On the background, it is one tree on the system, which is a mangrove capable of trapping a ton of carbon - if it can survive a city where some 800 thousand people rely on wood to cook; The chances that it will survive are drastically increased by payments made to the grower who guards it. Our work is creating green employment for people, check <a href="https://map.treetracker.org/?treeid=5457697">this tree</a> on our map.</div>
+`;
+
+// Append new div to body when the DOM is loaded
+document.addEventListener("DOMContentLoaded", function(event) {
+  document.body.appendChild(newDiv);
+});
diff --git a/keycloak/themes/treetracker/login/theme.properties b/keycloak/themes/treetracker/login/theme.properties
new file mode 100644
index 00000000..ee8200a0
--- /dev/null
+++ b/keycloak/themes/treetracker/login/theme.properties
@@ -0,0 +1,5 @@
+parent=keycloak
+import=common/keycloak
+styles=web_modules/@fontawesome/fontawesome-free/css/icons/all.css web_modules/@patternfly/react-core/dist/styles/base.css web_modules/@patternfly/react-core/dist/styles/app.css node_modules/patternfly/dist/css/patternfly.min.css node_modules/patternfly/dist/css/patternfly-additions.min.css css/login.css css/treetracker.css
+scripts=js/treetracker.js
+