diff --git a/public/favicon.png b/public/favicon.png
new file mode 100644
index 0000000..efaac46
Binary files /dev/null and b/public/favicon.png differ
diff --git a/public/icon-192.png b/public/icon-192.png
new file mode 100644
index 0000000..c111b3b
Binary files /dev/null and b/public/icon-192.png differ
diff --git a/public/index.html b/public/index.html
index 9d35186..3d53e8c 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,9 +4,13 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Rummy Timer">
+    <meta name="application-name" content="Rummy Timer">
+
+    <link rel="icon" href="<%= BASE_URL %>favicon.png">
+    <link rel="manifest" href="<%= BASE_URL %>rummy-timer.webmanifest">
 
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <title><%= htmlWebpackPlugin.options.title %></title>
   </head>
   <body>
diff --git a/public/rummy-timer.webmanifest b/public/rummy-timer.webmanifest
new file mode 100644
index 0000000..4674603
--- /dev/null
+++ b/public/rummy-timer.webmanifest
@@ -0,0 +1,15 @@
+{
+  "background_color": "#000088",
+  "description": "Simple timer for rummykub",
+  "display": "fullscreen",
+  "icons": [
+    {
+      "src": "/rummy-timer/icon-192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    }
+  ],
+  "name": "Rummy timer",
+  "short_name": "Rummy timer",
+  "start_url": "/rummy-timer/index.html"
+}
\ No newline at end of file
diff --git a/src/components/Settings.vue b/src/components/Settings.vue
index 87e9fb6..45f6b32 100644
--- a/src/components/Settings.vue
+++ b/src/components/Settings.vue
@@ -1,6 +1,7 @@
 <template>
   <div class="settings">
     <div class="time">
+      <p>Kies het aantal seconden:</p>
       <span class="time-choice" v-on:click="setTime(15)">15</span>
       <span class="time-choice" v-on:click="setTime(30)">30</span>
       <span class="time-choice" v-on:click="setTime(45)">45</span>
@@ -28,6 +29,10 @@ export default {
 }
 </script>
 
-<style scoped>
-
+<style lang="scss">
+  .time-choice {
+    font-size: 32px;
+    display: inline-block;
+    padding: 25px;
+  }
 </style>
\ No newline at end of file
diff --git a/vue.config.js b/vue.config.js
index bd72171..1aa40fa 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -1,5 +1,6 @@
 // vue.config.js
 module.exports = {
+    publicPath: process.env.NODE_ENV === 'production' ? '/rummy-timer/' : '/',
     css: {
         loaderOptions: {
             // by default the `sass` option will apply to both syntaxes
