init commit

2024-02-08 15:32:50 +01:00 · 2024-02-08 15:32:50 +01:00 · 0a64931748
commit 0a64931748
parent 37c5cf79ea
90 changed files with 15161 additions and 2 deletions
--- a/4
+++ b/4
@ -209,7 +209,7 @@ If you develop a new program, and you want it to be of the greatest possible use
 To do so, attach the following notices to the program. It is safest to attach them to the start of each source file to most effectively state the exclusion of warranty; and each file should have at least the “copyright” line and a pointer to where the full notice is found.

     RaMemory
-     Copyright (C) 2024  rama
+     Copyright (C) 2024 Raphael Martin 

     This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.

@ -221,7 +221,7 @@ Also add information on how to contact you by electronic and paper mail.

 If the program does terminal interaction, make it output a short notice like this when it starts in an interactive mode:

-     RaMemory  Copyright (C) 2024  rama
+     RaMemory  Copyright (C) 2024  Raphael Martin
     This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
     This is free software, and you are welcome to redistribute it under certain conditions; type `show c' for details.

--- a/build/config/emoji-categories.json
+++ b/build/config/emoji-categories.json
--- a/build/config/emoji-categories.min.json
+++ b/build/config/emoji-categories.min.json
--- a/build/config/emojis.json
+++ b/build/config/emojis.json
--- a/build/config/emojis.min.json
+++ b/build/config/emojis.min.json
--- a/build/config/images.json
+++ b/build/config/images.json
@ -0,0 +1,10 @@
+[
+    "https://travel.altogether.at/fileadmin/_processed_/f/e/csm_20220522_075119_f7f59f1947.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/c/4/csm_20220522_085437_6878ca9c79.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/a/e/csm_283250228_686175499137323_4942479361100056197_n_0f723df57f.jpg",
+    "https://travel.altogether.at/fileadmin/travel_blog/RaMa/AuthorSeite/282494555_2983554695217426_1326172026026569453_n.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/7/a/csm_285725297_181441544337054_6388859613749282169_n_1a54978bd2.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/9/6/csm_20220521_143042_e08fe4a244.jpg",
+    "https://travel.altogether.at//fileadmin/_processed_/8/f/csm_Hermanus6_362e5b53cf.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/4/c/csm_Hermanus-2_c1aa521e7d.jpg"
+]
--- a/build/css/index.css
+++ b/build/css/index.css
--- a/build/favicon/android-chrome-192x192.png
+++ b/build/favicon/android-chrome-192x192.png
--- a/build/favicon/android-chrome-512x512.png
+++ b/build/favicon/android-chrome-512x512.png
--- a/build/favicon/apple-touch-icon.png
+++ b/build/favicon/apple-touch-icon.png
--- a/build/favicon/browserconfig.xml
+++ b/build/favicon/browserconfig.xml
@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square70x70logo src="/mstile-70x70.png"/>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <square310x310logo src="/mstile-310x310.png"/>
+            <wide310x150logo src="/mstile-310x150.png"/>
+            <TileColor>#ffffff</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>
--- a/build/favicon/favicon-16x16.png
+++ b/build/favicon/favicon-16x16.png
--- a/build/favicon/favicon-32x32.png
+++ b/build/favicon/favicon-32x32.png
--- a/build/favicon/favicon.ico
+++ b/build/favicon/favicon.ico
--- a/build/favicon/favicon_package_v0.16(1).zip
+++ b/build/favicon/favicon_package_v0.16(1).zip
--- a/build/favicon/maskable/maskable_icon.png
+++ b/build/favicon/maskable/maskable_icon.png
--- a/build/favicon/maskable/maskable_icon_x128.png
+++ b/build/favicon/maskable/maskable_icon_x128.png
--- a/build/favicon/maskable/maskable_icon_x192.png
+++ b/build/favicon/maskable/maskable_icon_x192.png
--- a/build/favicon/maskable/maskable_icon_x384.png
+++ b/build/favicon/maskable/maskable_icon_x384.png
--- a/build/favicon/maskable/maskable_icon_x48.png
+++ b/build/favicon/maskable/maskable_icon_x48.png
--- a/build/favicon/maskable/maskable_icon_x512.png
+++ b/build/favicon/maskable/maskable_icon_x512.png
--- a/build/favicon/maskable/maskable_icon_x72.png
+++ b/build/favicon/maskable/maskable_icon_x72.png
--- a/build/favicon/maskable/maskable_icon_x96.png
+++ b/build/favicon/maskable/maskable_icon_x96.png
--- a/build/favicon/mstile-150x150.png
+++ b/build/favicon/mstile-150x150.png
--- a/build/favicon/mstile-310x150.png
+++ b/build/favicon/mstile-310x150.png
--- a/build/favicon/mstile-310x310.png
+++ b/build/favicon/mstile-310x310.png
--- a/build/favicon/mstile-70x70.png
+++ b/build/favicon/mstile-70x70.png
--- a/build/favicon/safari-pinned-tab.svg
+++ b/build/favicon/safari-pinned-tab.svg
@ -0,0 +1,135 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="1370.000000pt" height="1370.000000pt" viewBox="0 0 1370.000000 1370.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,1370.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M7300 12428 c-77 -48 -130 -135 -130 -212 0 -75 49 -155 125 -204 54
+-34 170 -37 228 -5 85 47 120 109 121 213 0 92 -24 139 -97 193 -48 36 -53 37
+-131 37 -66 0 -88 -4 -116 -22z"/>
+<path d="M5799 11887 c-57 -35 -71 -49 -95 -102 -55 -117 -13 -249 99 -313 30
+-17 54 -22 116 -22 68 0 82 3 124 30 26 16 59 50 77 77 26 42 30 57 30 122 0
+58 -5 81 -22 110 -56 94 -105 121 -215 120 -61 -1 -86 -6 -114 -22z"/>
+<path d="M8051 11513 c-13 -3 -40 -15 -60 -27 -20 -13 -121 -64 -226 -115
+-198 -97 -218 -106 -300 -141 -27 -12 -63 -27 -80 -35 -44 -20 -209 -85 -217
+-85 -4 0 -19 -5 -35 -12 -44 -18 -215 -78 -248 -88 -16 -4 -43 -13 -60 -19
+-60 -21 -131 -43 -165 -51 -19 -4 -48 -13 -65 -19 -16 -5 -70 -20 -120 -31
+-49 -12 -112 -28 -140 -35 -27 -8 -86 -22 -130 -30 -44 -9 -109 -23 -145 -31
+-36 -7 -101 -18 -145 -23 -137 -17 -184 -45 -198 -120 -20 -99 209 -365 419
+-490 l74 -43 2 -102 c3 -236 6 -289 16 -295 6 -3 32 -38 58 -76 49 -73 127
+-156 179 -190 46 -30 118 -64 136 -65 9 0 34 -7 55 -16 53 -22 357 -15 424 10
+123 47 238 135 302 231 15 22 42 60 59 85 l33 45 -3 181 -2 181 33 25 c18 13
+41 28 52 31 57 22 203 133 296 226 143 144 240 292 299 461 48 137 63 224 63
+390 1 134 -2 172 -15 197 -29 55 -90 87 -146 76z"/>
+<path d="M4660 6855 l0 -2195 2190 0 2190 0 0 2195 0 2195 -2190 0 -2190 0 0
+-2195z"/>
+<path d="M2180 8860 c-11 -7 2 -10 43 -10 36 0 56 4 52 10 -8 13 -75 13 -95 0z"/>
+<path d="M1257 7963 c-94 -51 -121 -114 -121 -283 0 -142 10 -180 68 -247 73
+-85 188 -107 298 -59 54 24 118 84 118 110 0 8 7 27 15 42 20 38 21 218 1 255
+-7 14 -16 37 -19 50 -9 36 -83 116 -128 139 -58 30 -169 26 -232 -7z"/>
+<path d="M3229 7947 c-50 -31 -85 -71 -116 -136 -25 -49 -28 -68 -28 -152 0
+-55 5 -102 11 -110 6 -8 14 -25 17 -39 9 -37 81 -115 127 -139 31 -16 59 -21
+121 -21 88 0 112 10 166 69 136 146 108 432 -52 526 -37 21 -55 25 -127 25
+-68 -1 -89 -5 -119 -23z"/>
+<path d="M11800 7938 c-77 -48 -130 -135 -130 -212 0 -75 49 -155 125 -204 54
+-34 170 -37 228 -5 85 47 120 109 121 213 0 92 -24 139 -97 193 -48 36 -53 37
+-131 37 -66 0 -88 -4 -116 -22z"/>
+<path d="M10299 7397 c-57 -35 -71 -49 -95 -102 -55 -117 -13 -249 99 -313 30
+-17 54 -22 116 -22 68 0 82 3 124 30 26 16 59 50 77 77 26 42 30 57 30 122 0
+58 -5 81 -22 110 -56 94 -105 121 -215 120 -61 -1 -86 -6 -114 -22z"/>
+<path d="M2733 7163 c-12 -2 -34 -18 -49 -36 -23 -27 -26 -38 -22 -87 3 -43
+10 -61 32 -85 24 -26 34 -29 87 -30 54 0 61 3 84 30 47 57 40 129 -18 183 -23
+21 -76 33 -114 25z"/>
+<path d="M1840 7120 c-36 -36 -40 -45 -40 -88 0 -42 5 -54 35 -85 40 -41 70
+-46 126 -23 44 19 69 62 69 121 0 42 -5 52 -36 81 -52 50 -100 48 -154 -6z"/>
+<path d="M12551 7023 c-13 -3 -40 -15 -60 -27 -20 -13 -121 -64 -226 -115
+-198 -97 -218 -106 -300 -141 -27 -12 -63 -27 -80 -35 -44 -20 -209 -85 -217
+-85 -4 0 -19 -5 -35 -12 -44 -18 -215 -78 -248 -88 -16 -4 -43 -13 -60 -19
+-60 -21 -131 -43 -165 -51 -19 -4 -48 -13 -65 -19 -16 -5 -70 -20 -120 -31
+-49 -12 -112 -28 -140 -35 -27 -8 -86 -22 -130 -30 -44 -9 -109 -23 -145 -31
+-36 -7 -101 -18 -145 -23 -137 -17 -184 -45 -198 -120 -20 -99 209 -365 419
+-490 l74 -43 2 -102 c3 -236 6 -289 16 -295 6 -3 32 -38 58 -76 49 -73 127
+-156 179 -190 46 -30 118 -64 136 -65 9 0 34 -7 55 -16 53 -22 357 -15 424 10
+123 47 238 135 302 231 15 22 42 60 59 85 l33 45 -3 181 -2 181 33 25 c18 13
+41 28 52 31 57 22 203 133 296 226 143 144 240 292 299 461 48 137 63 224 63
+390 1 134 -2 172 -15 197 -29 55 -90 87 -146 76z"/>
+<path d="M3349 6719 c-67 -33 -163 -74 -211 -90 -49 -16 -96 -33 -106 -38 -63
+-31 -188 -60 -407 -93 -110 -16 -420 -17 -495 -1 -30 7 -93 16 -140 22 -173
+20 -385 62 -403 80 -6 6 -19 11 -28 11 -33 0 -146 42 -245 90 -82 41 -111 50
+-154 50 -44 0 -56 -4 -81 -29 -31 -32 -35 -54 -18 -115 13 -46 75 -140 118
+-179 135 -119 394 -247 596 -294 259 -59 331 -66 648 -60 234 4 297 9 372 26
+124 28 175 42 212 57 17 8 38 14 46 14 40 0 269 118 368 189 23 17 47 31 54
+31 6 0 42 31 81 68 103 102 135 182 99 252 -26 50 -61 70 -125 70 -50 0 -73
+-8 -181 -61z"/>
+<path d="M140 2360 l0 -2200 2200 0 2200 0 0 2200 0 2200 -2200 0 -2200 0 0
+-2200z m2410 1869 c25 -5 77 -13 115 -18 82 -9 206 -37 253 -57 18 -8 41 -14
+52 -14 11 0 34 -6 52 -14 18 -8 58 -24 88 -36 224 -90 454 -243 611 -406 115
+-121 186 -224 270 -394 78 -159 79 -160 79 -178 0 -9 7 -30 15 -46 8 -16 18
+-47 21 -70 4 -22 11 -50 17 -60 5 -11 13 -45 17 -75 5 -31 14 -76 21 -101 8
+-30 12 -136 12 -320 0 -226 -3 -286 -16 -336 -10 -34 -17 -77 -17 -95 -1 -19
+-7 -45 -15 -59 -8 -14 -14 -36 -15 -50 0 -14 -7 -38 -15 -54 -8 -16 -18 -46
+-21 -67 -4 -21 -13 -44 -20 -50 -8 -6 -14 -22 -14 -34 0 -12 -7 -28 -15 -35
+-8 -7 -15 -20 -15 -29 0 -9 -4 -21 -9 -26 -5 -6 -24 -37 -42 -70 -18 -33 -43
+-74 -56 -91 -13 -17 -23 -35 -23 -40 0 -5 -16 -27 -35 -48 -19 -22 -35 -43
+-35 -47 0 -11 -219 -227 -250 -247 -20 -14 -100 -69 -155 -109 -27 -20 -72
+-45 -97 -54 -16 -6 -28 -15 -28 -19 0 -5 -13 -11 -29 -15 -16 -3 -35 -13 -42
+-21 -6 -8 -22 -14 -36 -14 -13 0 -26 -7 -29 -15 -4 -8 -17 -15 -31 -15 -14 0
+-37 -6 -51 -14 -15 -8 -54 -22 -87 -31 -33 -9 -76 -23 -95 -30 -32 -12 -59
+-17 -220 -45 -155 -27 -387 -44 -414 -32 -12 6 -82 15 -156 22 -74 6 -157 18
+-184 26 -27 8 -64 14 -82 14 -18 0 -35 4 -39 9 -3 5 -20 12 -38 16 -48 10
+-129 36 -159 51 -14 8 -37 14 -51 14 -14 0 -27 7 -31 15 -3 8 -16 15 -29 15
+-14 0 -30 6 -36 14 -7 8 -26 18 -42 21 -16 4 -31 10 -34 15 -3 4 -28 20 -56
+35 -28 14 -56 31 -63 36 -10 9 -110 76 -154 104 -44 28 -265 261 -322 340 -57
+80 -143 235 -177 320 -25 64 -45 121 -52 155 -4 19 -13 51 -19 70 -14 44 -30
+133 -42 225 -11 90 -11 483 1 555 32 203 48 268 96 393 50 132 133 297 176
+352 4 6 31 42 59 80 161 217 438 424 723 540 126 51 392 125 455 125 19 1 62
+7 95 14 72 17 398 20 465 5z"/>
+<path d="M2843 3306 c-15 -33 -15 -35 6 -65 12 -17 29 -31 37 -31 38 0 204
+-95 279 -160 50 -43 155 -165 155 -180 0 -14 59 -32 85 -26 30 8 45 40 38 82
+-9 47 -109 189 -179 252 -94 87 -260 162 -356 162 -45 0 -49 -2 -65 -34z"/>
+<path d="M1686 3222 c-81 -78 -142 -127 -177 -142 -13 -5 -31 -14 -39 -19 -28
+-17 -118 -51 -177 -66 -70 -18 -97 -46 -89 -90 12 -61 65 -69 207 -34 138 35
+261 107 352 208 83 92 107 160 69 194 -37 33 -69 22 -146 -51z"/>
+<path d="M2735 2969 c-129 -66 -194 -236 -149 -389 49 -164 190 -245 336 -192
+120 44 186 166 176 326 -8 122 -58 205 -153 255 -54 29 -155 29 -210 0z"/>
+<path d="M1650 2825 c-74 -36 -146 -70 -159 -77 -99 -52 -84 -200 30 -302 133
+-120 345 -62 411 111 13 36 18 76 18 155 l0 107 -34 35 c-53 56 -97 51 -266
+-29z"/>
+<path d="M1225 1962 c-16 -2 -34 -7 -40 -12 -5 -4 -25 -11 -42 -15 -18 -3 -33
+-10 -33 -14 0 -4 -11 -13 -24 -20 -26 -14 -46 -50 -46 -82 0 -53 66 -98 117
+-78 33 12 53 5 53 -18 1 -26 35 -122 49 -136 6 -6 11 -16 11 -22 0 -23 96
+-111 145 -134 133 -63 300 -41 411 53 63 53 122 76 194 76 88 0 151 -20 335
+-109 189 -92 216 -103 314 -132 160 -47 377 3 521 120 57 46 118 111 126 134
+3 9 9 17 12 17 4 0 16 16 26 35 11 19 23 35 28 35 5 0 21 -13 35 -30 36 -44
+83 -42 119 5 26 35 26 35 9 77 -51 130 -254 235 -354 183 -31 -15 -41 -33 -41
+-69 0 -27 42 -76 65 -76 19 0 19 -9 -2 -51 -29 -59 -132 -151 -218 -194 l-79
+-40 -116 1 c-130 1 -111 -5 -385 129 -201 99 -241 110 -390 109 -101 0 -128
+-3 -173 -22 -52 -22 -96 -49 -136 -85 -12 -10 -45 -25 -75 -34 -99 -28 -197
+12 -241 100 -14 28 -20 57 -18 82 3 40 3 40 51 45 67 8 82 29 78 107 -2 39
+-55 61 -161 65 -52 1 -108 1 -125 0z"/>
+<path d="M4660 2355 l0 -2195 2190 0 2190 0 0 2195 0 2195 -2190 0 -2190 0 0
+-2195z"/>
+<path d="M11800 3408 c-77 -48 -130 -135 -130 -212 0 -75 49 -155 125 -204 54
+-34 170 -37 228 -5 85 47 120 109 121 213 0 92 -24 139 -97 193 -48 36 -53 37
+-131 37 -66 0 -88 -4 -116 -22z"/>
+<path d="M10299 2867 c-57 -35 -71 -49 -95 -102 -55 -117 -13 -249 99 -313 30
+-17 54 -22 116 -22 68 0 82 3 124 30 26 16 59 50 77 77 26 42 30 57 30 122 0
+58 -5 81 -22 110 -56 94 -105 121 -215 120 -61 -1 -86 -6 -114 -22z"/>
+<path d="M12551 2493 c-13 -3 -40 -15 -60 -27 -20 -13 -121 -64 -226 -115
+-198 -97 -218 -106 -300 -141 -27 -12 -63 -27 -80 -35 -44 -20 -209 -85 -217
+-85 -4 0 -19 -5 -35 -12 -44 -18 -215 -78 -248 -88 -16 -4 -43 -13 -60 -19
+-60 -21 -131 -43 -165 -51 -19 -4 -48 -13 -65 -19 -16 -5 -70 -20 -120 -31
+-49 -12 -112 -28 -140 -35 -27 -8 -86 -22 -130 -30 -44 -9 -109 -23 -145 -31
+-36 -7 -101 -18 -145 -23 -137 -17 -184 -45 -198 -120 -20 -99 209 -365 419
+-490 l74 -43 2 -102 c3 -236 6 -289 16 -295 6 -3 32 -38 58 -76 49 -73 127
+-156 179 -190 46 -30 118 -64 136 -65 9 0 34 -7 55 -16 53 -22 357 -15 424 10
+123 47 238 135 302 231 15 22 42 60 59 85 l33 45 -3 181 -2 181 33 25 c18 13
+41 28 52 31 57 22 203 133 296 226 143 144 240 292 299 461 48 137 63 224 63
+390 1 134 -2 172 -15 197 -29 55 -90 87 -146 76z"/>
+</g>
+</svg>
--- a/build/favicon/site.webmanifest
+++ b/build/favicon/site.webmanifest
@ -0,0 +1,79 @@
+{
+    "name": "RaMemory",
+    "short_name": "RMMM",
+    "description": "Raphy's Memory Matrix Madness is a captivating and colorful memory matching game that can be played offline. Test your memory skills, customize the gameplay, and enjoy a vibrant celebration of success with this small but mighty JavaScript and CSS powered game.",
+    "icons": [
+        {
+            "src": "/favicon/android-chrome-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/favicon/android-chrome-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon.png",
+            "sizes": "1024x1024",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x512.png",
+            "sizes": "512x512",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x384.png",
+            "sizes": "384x384",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x192.png",
+            "sizes": "192x192",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x128.png",
+            "sizes": "128x128",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/Memory/favicon/maskable/maskable_icon_x96.png",
+            "sizes": "96x96",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x72.png",
+            "sizes": "72x72",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x48.png",
+            "sizes": "48x48",
+            "type": "image/png",
+            "purpose": "maskable"
+        }
+    ],
+    "screenshots" : [
+        {
+          "src": "/media/light_emoji_1280x720.webp",
+          "sizes": "1280x720",
+          "type": "image/webp",
+          "form_factor": "wide",
+          "label": "RaMemory MM gameplay black images"
+        }
+      ],
+    "theme_color": "#ffffff",
+    "scope": "/",
+    "background_color": "#ffffff",
+    "start_url": "https://ramemory.altogether.at",
+    "display": "standalone"
+}
--- a/build/fonts/TextMeOne-Regular.ttf
+++ b/build/fonts/TextMeOne-Regular.ttf
--- a/build/index.html
+++ b/build/index.html
--- a/build/js/index.js
+++ b/build/js/index.js
--- a/build/robots.txt
+++ b/build/robots.txt
@ -0,0 +1,6 @@
+User-Agent: *
+
+Allow: /  
+Disallow:                                  
+
+Sitemap: https://blog.altogether.at/sitemap.xml
--- a/build/sitemap.xml
+++ b/build/sitemap.xml
@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+    <url>
+        <loc>https://games.altogether.at/ramemory</loc>
+        <lastmod>2024-02-05T11:49:36+01:00</lastmod>
+        <priority>1.0</priority>
+    </url>
+</urlset>
--- a/build/sw.js
+++ b/build/sw.js
@ -0,0 +1 @@
+const swName="RaMemoryMM",addResourcesToCache=async function(a){await(await caches.open(swName)).addAll(a)},putInCache=async function(a,n){await(await caches.open(swName)).put(a,n)},enableNavigationPreload=async function(){self.registration.navigationPreload&&await self.registration.navigationPreload.enable()},limitCacheSize=(self.addEventListener("activate",function(a){a.waitUntil(enableNavigationPreload())}),self.addEventListener("install",function(a){a.waitUntil(addResourcesToCache(["./index.html","./JavaScript/Css.min.js","./JavaScript/PWA.min.js","./JavaScript/Firework.min.js","./JavaScript/Memory.min.js","./JavaScript/main.min.js","./Css/Firework.min.css","./Css/main.min.css","./fonts/TextMeOne-Regular.ttf","./config/emoji-categories.min.json","./config/emojis.min.json","./config/images.json","./media/frog512x512.png","./media/altogether-logo.png","./media/altogether-logo-inverted.png","./media/dark_intro.webm","./media/light_intro.webm","./media/dark_intro.mp4","./media/light_intro.mp4","./media/light_emoji.png","./favicon/site.webmanifest","./media/green_string.png","./favicon/favicon.ico","./favicon/favicon-32x32.png","./favicon/favicon-16x16.png","./favicon/android-chrome-192x192.png","./favicon/android-chrome-512x512.png","./favicon/maskable/maskable_icon.png","./favicon/maskable/maskable_icon_x48.png","./favicon/maskable/maskable_icon_x72.png","./favicon/maskable/maskable_icon_x96.png","./favicon/maskable/maskable_icon_x128.png","./favicon/maskable/maskable_icon_x192.png","./favicon/maskable/maskable_icon_x384.png","./favicon/maskable/maskable_icon_x512.png"]))}),self.addEventListener("fetch",function(e){0===e.request.url.indexOf("http")&&e.respondWith(caches.match(e.request).then(function(a){return a||fetch(e.request).then(function(n){cache.open(swName).then(function(a){return a.put(e.request.url,n.clone()),limitCacheSize(swName,200),n})})}).catch(function(){caches.match("/fallback")}))}),function(e,i){caches.open(e).then(function(n){n.keys().then(function(a){a.length>i&&n.delete(a[0]).then(limitCacheSize(e,i))})})});
--- a/gulpfile.js
+++ b/gulpfile.js
@ -0,0 +1,118 @@
+const gulp = require('gulp');
+const concat = require('gulp-concat');
+const cleanCss = require('gulp-clean-css');
+const browsersync = require('browser-sync').create();
+const uglify = require('gulp-uglify');
+const del = require('del');
+const htmlmin = require('gulp-htmlmin');
+const copy = require('gulp-copy');
+
+// Concat and minify CSS files
+gulp.task('build-css', () => {
+    return gulp.src('src/Css/main.css')
+    .pipe(concat('index.css'))
+    .pipe(cleanCss())
+    .pipe(gulp.dest('build/css'));
+});
+
+// Concat and minify application specific JS files
+gulp.task('build-js', function () {
+    return gulp.src(['src/JavaScript/Css.js', 
+                     'src/JavaScript/Firework.js', 
+                     'src/JavaScript/PWA.js',
+                     'src/JavaScript/Memory.js',
+                     'src/JavaScript/main.js'])
+        .pipe(concat('index.js'))
+        .pipe(uglify())
+        .pipe(gulp.dest('build/js'));
+});
+
+
+// Concat and minify application specific JS files
+gulp.task('build-sw', function () {
+    return gulp.src(['src/sw.js'])
+        .pipe(concat('sw.js'))
+        .pipe(uglify())
+        .pipe(gulp.dest('build'));
+});
+
+ 
+gulp.task('minify-html', () => {
+  return gulp.src('src/index.html')
+    .pipe(htmlmin({ collapseWhitespace: true }))
+    .pipe(gulp.dest('build'));
+});
+
+
+gulp.task('copy-sitemap', function() {
+  return gulp.src('src/sitemap.xml')
+    .pipe(gulp.dest('build'));
+});
+
+gulp.task('copy-robots', function() {
+  return gulp.src('src/robots.txt')
+    .pipe(gulp.dest('build'));
+});
+
+gulp.task('copy-media', function() {
+  return gulp.src('src/media/*')
+    .pipe(gulp.dest('build/media'));
+});
+
+gulp.task('copy-data', function() {
+  return gulp.src('src/config/*.json')
+    .pipe(gulp.dest('build/config'));
+});
+gulp.task('copy-fonts', function() {
+  return gulp.src('src/fonts/*')
+    .pipe(gulp.dest('build/fonts'));
+});
+
+gulp.task('copy-favicon', function() {
+  return gulp.src('src/favicon/*')
+    .pipe(gulp.dest('build/favicon'));
+});
+gulp.task('copy-favicon-maskable', function() {
+  return gulp.src('src/favicon/maskable/*')
+    .pipe(gulp.dest('build/favicon/maskable'));
+});
+
+gulp.task('clean', async () => {
+   return del.sync('build');
+});
+
+// Start session
+gulp.task("clean build", (cb) => {
+    return gulp.series('clean',
+        'build-css', 'build-js', 'build-sw', 'minify-html', 
+        'copy-media', 'copy-data', 'copy-favicon','copy-favicon-maskable', 'copy-fonts', 'copy-robots', 'copy-sitemap'
+                )(cb);
+});
+
+// Start session
+gulp.task("session-start", (cb) => {
+    return gulp.series('clean','build-css', 'build-js','build-sw',  'minify-html', 
+    'copy-media', 'copy-data', 'copy-favicon','copy-favicon-maskable',  'copy-fonts', 'copy-robots', 'copy-sitemap')(cb);
+});
+
+// Start session
+gulp.task("build", (cb) => {
+    return gulp.series('build-css', 'build-js','build-sw',  'minify-html', 
+    'copy-media', 'copy-data', 'copy-favicon','copy-favicon-maskable',  'copy-fonts', 'copy-robots', 'copy-sitemap')(cb);
+});
+
+// static server and watching CSS/JS/HTML files for changes
+gulp.task("server", (done) => {
+  browsersync.init({
+      server: './build',
+      directory: true
+  });
+
+  // Watch for file changes
+  gulp.watch('./src/Css/*.css', gulp.series('session-start'), browsersync.reload);
+  gulp.watch('./src/JavaScript/*.js', gulp.series('session-start'), browsersync.reload);
+  gulp.watch('./src/*.html', gulp.series('session-start'), browsersync.reload);
+});
+
+
+gulp.task('default', gulp.series('session-start'));
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -0,0 +1,35 @@
+{
+  "name": "RaMemory",
+  "version": "1.0.0",
+  "keywords": [
+    "util",
+    "functional",
+    "server",
+    "client",
+    "browser"
+  ],
+  "author": "rama",
+  "contributors": [],
+  "devDependencies": {
+    "browser-sync": "^2.26.14",
+    "del": "^6.1.1",
+    "gulp": "^4.0.2",
+    "gulp-clean-css": "^4.3.0",
+    "gulp-concat": "^2.6.1",
+    "gulp-htmlmin": "^5.0.1",
+    "gulp-minify-css": "^1.2.4",
+    "gulp-uglify": "^3.0.2",
+    "gulp-copy": "^4.0.1"
+  },
+  "main": "gulpfile.js",
+  "directories": {
+    "test": "test"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "license": "ISC",
+  "description": "",
+  "dependencies": {
+  }
+}
--- a/src/.sass-cache/ba40443684362481b75b2b588a7af7674fecfa7c/Firework.scssc
+++ b/src/.sass-cache/ba40443684362481b75b2b588a7af7674fecfa7c/Firework.scssc
--- a/src/.sass-cache/ba40443684362481b75b2b588a7af7674fecfa7c/Memory.scssc
+++ b/src/.sass-cache/ba40443684362481b75b2b588a7af7674fecfa7c/Memory.scssc
--- a/src/.sass-cache/ba40443684362481b75b2b588a7af7674fecfa7c/_variables.scssc
+++ b/src/.sass-cache/ba40443684362481b75b2b588a7af7674fecfa7c/_variables.scssc
--- a/src/.sass-cache/ba40443684362481b75b2b588a7af7674fecfa7c/main.scssc
+++ b/src/.sass-cache/ba40443684362481b75b2b588a7af7674fecfa7c/main.scssc
--- a/src/Css/Firework.css
+++ b/src/Css/Firework.css
@ -0,0 +1,314 @@
+/*
+    Created on : Jan 29, 2024, 8:03:11 PM
+    Author     : Raphael Martin
+*/
+.firework {
+  position: absolute;
+  width: 5px;
+  height: 5px;
+  opacity: 1; }
+
+@keyframes launchFirework {
+  to {
+    opacity: 0; } }
+@keyframes launchFirework1 {
+  to {
+    transform: translate(-100px, 51px); } }
+.firework1 {
+  animation: launchFirework 1001ms linear forwards, launchFirework1 616ms linear forwards; }
+
+@keyframes launchFirework2 {
+  to {
+    transform: translate(-30px, 47px); } }
+.firework2 {
+  animation: launchFirework 1412ms linear forwards, launchFirework2 723ms linear forwards; }
+
+@keyframes launchFirework3 {
+  to {
+    transform: translate(-76px, 58px); } }
+.firework3 {
+  animation: launchFirework 1091ms linear forwards, launchFirework3 996ms linear forwards; }
+
+@keyframes launchFirework4 {
+  to {
+    transform: translate(42px, 75px); } }
+.firework4 {
+  animation: launchFirework 880ms linear forwards, launchFirework4 1227ms linear forwards; }
+
+@keyframes launchFirework5 {
+  to {
+    transform: translate(99px, 62px); } }
+.firework5 {
+  animation: launchFirework 1032ms linear forwards, launchFirework5 1200ms linear forwards; }
+
+@keyframes launchFirework6 {
+  to {
+    transform: translate(-96px, -76px); } }
+.firework6 {
+  animation: launchFirework 1467ms linear forwards, launchFirework6 1483ms linear forwards; }
+
+@keyframes launchFirework7 {
+  to {
+    transform: translate(-94px, -62px); } }
+.firework7 {
+  animation: launchFirework 605ms linear forwards, launchFirework7 1467ms linear forwards; }
+
+@keyframes launchFirework8 {
+  to {
+    transform: translate(-70px, -24px); } }
+.firework8 {
+  animation: launchFirework 1164ms linear forwards, launchFirework8 839ms linear forwards; }
+
+@keyframes launchFirework9 {
+  to {
+    transform: translate(21px, 88px); } }
+.firework9 {
+  animation: launchFirework 1195ms linear forwards, launchFirework9 658ms linear forwards; }
+
+@keyframes launchFirework10 {
+  to {
+    transform: translate(24px, 75px); } }
+.firework10 {
+  animation: launchFirework 1243ms linear forwards, launchFirework10 1338ms linear forwards; }
+
+@keyframes launchFirework11 {
+  to {
+    transform: translate(-91px, 53px); } }
+.firework11 {
+  animation: launchFirework 660ms linear forwards, launchFirework11 1097ms linear forwards; }
+
+@keyframes launchFirework12 {
+  to {
+    transform: translate(44px, 70px); } }
+.firework12 {
+  animation: launchFirework 1072ms linear forwards, launchFirework12 1285ms linear forwards; }
+
+@keyframes launchFirework13 {
+  to {
+    transform: translate(90px, -85px); } }
+.firework13 {
+  animation: launchFirework 1159ms linear forwards, launchFirework13 1112ms linear forwards; }
+
+@keyframes launchFirework14 {
+  to {
+    transform: translate(-43px, 73px); } }
+.firework14 {
+  animation: launchFirework 1007ms linear forwards, launchFirework14 1361ms linear forwards; }
+
+@keyframes launchFirework15 {
+  to {
+    transform: translate(-47px, -19px); } }
+.firework15 {
+  animation: launchFirework 801ms linear forwards, launchFirework15 980ms linear forwards; }
+
+@keyframes launchFirework16 {
+  to {
+    transform: translate(70px, 53px); } }
+.firework16 {
+  animation: launchFirework 1232ms linear forwards, launchFirework16 1361ms linear forwards; }
+
+@keyframes launchFirework17 {
+  to {
+    transform: translate(77px, -78px); } }
+.firework17 {
+  animation: launchFirework 1275ms linear forwards, launchFirework17 743ms linear forwards; }
+
+@keyframes launchFirework18 {
+  to {
+    transform: translate(78px, -21px); } }
+.firework18 {
+  animation: launchFirework 605ms linear forwards, launchFirework18 797ms linear forwards; }
+
+@keyframes launchFirework19 {
+  to {
+    transform: translate(99px, -67px); } }
+.firework19 {
+  animation: launchFirework 1194ms linear forwards, launchFirework19 539ms linear forwards; }
+
+@keyframes launchFirework20 {
+  to {
+    transform: translate(11px, -94px); } }
+.firework20 {
+  animation: launchFirework 1099ms linear forwards, launchFirework20 653ms linear forwards; }
+
+@keyframes launchFirework21 {
+  to {
+    transform: translate(97px, -8px); } }
+.firework21 {
+  animation: launchFirework 1349ms linear forwards, launchFirework21 948ms linear forwards; }
+
+@keyframes launchFirework22 {
+  to {
+    transform: translate(35px, 3px); } }
+.firework22 {
+  animation: launchFirework 831ms linear forwards, launchFirework22 643ms linear forwards; }
+
+@keyframes launchFirework23 {
+  to {
+    transform: translate(-81px, -40px); } }
+.firework23 {
+  animation: launchFirework 1171ms linear forwards, launchFirework23 1023ms linear forwards; }
+
+@keyframes launchFirework24 {
+  to {
+    transform: translate(-28px, 42px); } }
+.firework24 {
+  animation: launchFirework 1414ms linear forwards, launchFirework24 1156ms linear forwards; }
+
+@keyframes launchFirework25 {
+  to {
+    transform: translate(13px, -55px); } }
+.firework25 {
+  animation: launchFirework 994ms linear forwards, launchFirework25 934ms linear forwards; }
+
+@keyframes launchFirework26 {
+  to {
+    transform: translate(77px, 44px); } }
+.firework26 {
+  animation: launchFirework 524ms linear forwards, launchFirework26 525ms linear forwards; }
+
+@keyframes launchFirework27 {
+  to {
+    transform: translate(87px, -32px); } }
+.firework27 {
+  animation: launchFirework 556ms linear forwards, launchFirework27 1129ms linear forwards; }
+
+@keyframes launchFirework28 {
+  to {
+    transform: translate(-80px, 77px); } }
+.firework28 {
+  animation: launchFirework 1256ms linear forwards, launchFirework28 1360ms linear forwards; }
+
+@keyframes launchFirework29 {
+  to {
+    transform: translate(53px, 15px); } }
+.firework29 {
+  animation: launchFirework 1157ms linear forwards, launchFirework29 778ms linear forwards; }
+
+@keyframes launchFirework30 {
+  to {
+    transform: translate(11px, 82px); } }
+.firework30 {
+  animation: launchFirework 925ms linear forwards, launchFirework30 1055ms linear forwards; }
+
+@keyframes launchFirework31 {
+  to {
+    transform: translate(78px, -18px); } }
+.firework31 {
+  animation: launchFirework 1366ms linear forwards, launchFirework31 760ms linear forwards; }
+
+@keyframes launchFirework32 {
+  to {
+    transform: translate(-83px, 12px); } }
+.firework32 {
+  animation: launchFirework 1370ms linear forwards, launchFirework32 1096ms linear forwards; }
+
+@keyframes launchFirework33 {
+  to {
+    transform: translate(-98px, -35px); } }
+.firework33 {
+  animation: launchFirework 1355ms linear forwards, launchFirework33 1423ms linear forwards; }
+
+@keyframes launchFirework34 {
+  to {
+    transform: translate(-3px, 54px); } }
+.firework34 {
+  animation: launchFirework 970ms linear forwards, launchFirework34 780ms linear forwards; }
+
+@keyframes launchFirework35 {
+  to {
+    transform: translate(-62px, -44px); } }
+.firework35 {
+  animation: launchFirework 1056ms linear forwards, launchFirework35 1175ms linear forwards; }
+
+@keyframes launchFirework36 {
+  to {
+    transform: translate(-86px, -84px); } }
+.firework36 {
+  animation: launchFirework 709ms linear forwards, launchFirework36 990ms linear forwards; }
+
+@keyframes launchFirework37 {
+  to {
+    transform: translate(88px, -50px); } }
+.firework37 {
+  animation: launchFirework 688ms linear forwards, launchFirework37 783ms linear forwards; }
+
+@keyframes launchFirework38 {
+  to {
+    transform: translate(-19px, 10px); } }
+.firework38 {
+  animation: launchFirework 586ms linear forwards, launchFirework38 608ms linear forwards; }
+
+@keyframes launchFirework39 {
+  to {
+    transform: translate(-11px, -100px); } }
+.firework39 {
+  animation: launchFirework 793ms linear forwards, launchFirework39 1179ms linear forwards; }
+
+@keyframes launchFirework40 {
+  to {
+    transform: translate(-88px, 85px); } }
+.firework40 {
+  animation: launchFirework 1095ms linear forwards, launchFirework40 511ms linear forwards; }
+
+@keyframes launchFirework41 {
+  to {
+    transform: translate(69px, -95px); } }
+.firework41 {
+  animation: launchFirework 828ms linear forwards, launchFirework41 847ms linear forwards; }
+
+@keyframes launchFirework42 {
+  to {
+    transform: translate(90px, 41px); } }
+.firework42 {
+  animation: launchFirework 788ms linear forwards, launchFirework42 748ms linear forwards; }
+
+@keyframes launchFirework43 {
+  to {
+    transform: translate(-64px, -86px); } }
+.firework43 {
+  animation: launchFirework 1195ms linear forwards, launchFirework43 1480ms linear forwards; }
+
+@keyframes launchFirework44 {
+  to {
+    transform: translate(-54px, 48px); } }
+.firework44 {
+  animation: launchFirework 1458ms linear forwards, launchFirework44 667ms linear forwards; }
+
+@keyframes launchFirework45 {
+  to {
+    transform: translate(-3px, -86px); } }
+.firework45 {
+  animation: launchFirework 849ms linear forwards, launchFirework45 1403ms linear forwards; }
+
+@keyframes launchFirework46 {
+  to {
+    transform: translate(10px, -78px); } }
+.firework46 {
+  animation: launchFirework 1140ms linear forwards, launchFirework46 1351ms linear forwards; }
+
+@keyframes launchFirework47 {
+  to {
+    transform: translate(-62px, 81px); } }
+.firework47 {
+  animation: launchFirework 807ms linear forwards, launchFirework47 597ms linear forwards; }
+
+@keyframes launchFirework48 {
+  to {
+    transform: translate(-3px, -74px); } }
+.firework48 {
+  animation: launchFirework 622ms linear forwards, launchFirework48 1007ms linear forwards; }
+
+@keyframes launchFirework49 {
+  to {
+    transform: translate(-41px, 2px); } }
+.firework49 {
+  animation: launchFirework 729ms linear forwards, launchFirework49 601ms linear forwards; }
+
+@keyframes launchFirework50 {
+  to {
+    transform: translate(9px, 81px); } }
+.firework50 {
+  animation: launchFirework 552ms linear forwards, launchFirework50 681ms linear forwards; }
+
+/*# sourceMappingURL=Firework.css.map */
--- a/src/Css/Firework.css.map
+++ b/src/Css/Firework.css.map
@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AAAA;;;EAGE;AAEF,SAAU;EACN,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,GAAG;EACX,OAAO,EAAE,CAAC;;AAGd,yBAIC;EAHG,EAAG;IACC,OAAO,EAAE,CAAC;AAKd,0BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,UAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,0BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,UAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,0BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,UAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,0BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,UAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,0BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,UAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,0BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,UAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,0BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,UAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,0BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,UAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,0BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,UAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,oBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,wBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,uBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,8EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,sBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,6EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,qBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH;;AANlI,2BAIC;EAHG,EAAG;IACC,SAAS,EAAE,oBAAyD;AAG5E,WAAe;EACX,SAAS,EAAE,4EAAmH",
+"sources": ["../Scss/Firework.scss"],
+"names": [],
+"file": "Firework.css"
+}
--- a/src/Css/Memory.css
+++ b/src/Css/Memory.css
@ -0,0 +1,71 @@
+#won {
+  bottom: 2rem;
+  height: 80px; }
+
+#memory {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center; }
+  #memory > .memory-flip-card {
+    font-size: 8px;
+    width: 230px;
+    height: 230px;
+    margin: 0.3rem;
+    background-color: transparent;
+    perspective: 1000px;
+    opacity: 1;
+    -webkit-transition: opacity 2s ease-in-out;
+    -moz-transition: opacity 2s ease-in-out;
+    transition: opacity 2s ease-in-out; }
+    #memory > .memory-flip-card > .inner {
+      position: relative;
+      width: 100%;
+      height: 100%;
+      text-align: center;
+      transition: transform 0.8s;
+      transform-style: preserve-3d; }
+      #memory > .memory-flip-card > .inner > .front {
+        cursor: pointer;
+        background-color: #333;
+        background-repeat: no-repeat;
+        background-size: contain;
+        background-position: center; }
+        #memory > .memory-flip-card > .inner > .front.style-one {
+          background-image: url("../media/frog512x512.png"); }
+        #memory > .memory-flip-card > .inner > .front.style-two {
+          background-image: url("../media/altogether-logo.png"); }
+          #memory > .memory-flip-card > .inner > .front.style-two.bg-black, #memory > .memory-flip-card > .inner > .front.style-two.bg-blue {
+            background-image: url("../media/altogether-logo-inverted.png"); }
+      #memory > .memory-flip-card > .inner > .back {
+        font-size: 8px;
+        transform: rotateY(180deg);
+        background-repeat: no-repeat;
+        background-size: cover;
+        background-position: center; }
+      #memory > .memory-flip-card > .inner > .front, #memory > .memory-flip-card > .inner > .back {
+        -webkit-user-select: none;
+        /* Safari */
+        -ms-user-select: none;
+        /* IE 10 and IE 11 */
+        user-select: none;
+        /* Standard syntax */
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        -webkit-backface-visibility: hidden;
+        backface-visibility: hidden;
+        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; }
+    #memory > .memory-flip-card.found {
+      opacity: 0.7; }
+      #memory > .memory-flip-card.found > .inner > .back {
+        border: solid 1px #bcce43; }
+    #memory > .memory-flip-card.active > .inner, #memory > .memory-flip-card.found > .inner {
+      transform: rotateY(180deg); }
+
+@media (min-width: 750px) {
+  #memory > .card {
+    font-size: 20px; }
+    #memory > .card > .inner > .back {
+      font-size: 20px; } }
+
+/*# sourceMappingURL=Memory.css.map */
--- a/src/Css/Memory.css.map
+++ b/src/Css/Memory.css.map
@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AAAA,IAAK;EACD,MAAM,EAAE,IAAI;EACZ,MAAM,EAAE,IAAI;;AAEhB,OAAO;EACH,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,IAAI;EACf,eAAe,EAAE,MAAM;EAEvB,2BAAmB;IAEf,SAAS,EAAE,GAAG;IACd,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE,KAAK;IACb,MAAM,EAAE,MAAM;IACd,gBAAgB,EAAE,WAAW;IAC7B,WAAW,EAAE,MAAM;IACnB,OAAO,EAAE,CAAC;IACV,kBAAkB,EAAE,sBAAsB;IAC1C,eAAe,EAAE,sBAAsB;IACvC,UAAU,EAAE,sBAAsB;IAClC,oCAAS;MACL,QAAQ,EAAE,QAAQ;MAClB,KAAK,EAAE,IAAI;MACX,MAAM,EAAE,IAAI;MACZ,UAAU,EAAE,MAAM;MAClB,UAAU,EAAE,cAAc;MAC1B,eAAe,EAAE,WAAW;MAC5B,6CAAS;QACL,MAAM,EAAE,OAAO;QACf,gBAAgB,EAAE,IAAI;QACtB,iBAAiB,EAAE,SAAS;QAC5B,eAAe,EAAE,OAAO;QACxB,mBAAmB,EAAE,MAAM;QAC3B,uDAAW;UACP,gBAAgB,EAAE,+BAA+B;QAGrD,uDAAW;UACP,gBAAgB,EAAE,mCAAmC;UACrD,iIAAqB;YACjB,gBAAgB,EAAE,4CAA4C;MAK1E,4CAAQ;QACJ,SAAS,EAAE,GAAG;QACd,SAAS,EAAE,eAAe;QAC1B,iBAAiB,EAAE,SAAS;QAC5B,eAAe,EAAE,KAAK;QACtB,mBAAmB,EAAE,MAAM;MAE/B,2FAAkB;QACd,mBAAmB,EAAE,IAAI;QAAE,YAAY;QACvC,eAAe,EAAE,IAAI;QAAE,qBAAqB;QAC5C,WAAW,EAAE,IAAI;QAAE,qBAAqB;QACxC,QAAQ,EAAE,QAAQ;QAClB,KAAK,EAAE,IAAI;QACX,MAAM,EAAE,IAAI;QACZ,2BAA2B,EAAE,MAAM;QACnC,mBAAmB,EAAE,MAAM;QAC3B,UAAU,EAAE,qCAAqC;IAGzD,iCAAO;MACH,OAAO,EAAE,GAAG;MAER,kDAAO;QACH,MAAM,EAAE,iBAAiB;IAKjC,uFAAQ;MACJ,SAAS,EAAE,eAAe;;AAM1C,yBAA0B;EACtB,eAAe;IACX,SAAS,EAAE,IAAI;IACf,gCAAiB;MACb,SAAS,EAAE,IAAI",
+"sources": ["../Scss/Memory.scss"],
+"names": [],
+"file": "Memory.css"
+}
--- a/src/Css/main.css
+++ b/src/Css/main.css
--- a/src/Css/main.css.map
+++ b/src/Css/main.css.map
--- a/src/JavaScript/Css.js
+++ b/src/JavaScript/Css.js
@ -0,0 +1,21 @@
+/* 
+ * Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
+ * Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/javascript.js to edit this template
+ */
+
+
+const Css = {
+    classes: {
+        displayNone: "d-none",
+        darkTheme: "dark-theme",
+        lightTheme: "light-theme",
+        bgBlack: "bg-black",
+        bgWhite: "bg-white",
+        bgPrimary: "bg-primary",
+        bgOrange: "bg-primary",
+        bgGreen: "bg-success",
+        bgBlue: "bg-blue",
+        memoryCardStyleOne: "style-one",
+        memoryCardStyleTwo: "style-two"
+        }
+};
--- a/src/JavaScript/Firework.js
+++ b/src/JavaScript/Firework.js
@ -0,0 +1,54 @@
+
+const Firework = {
+    set: 0,
+    intervalIds: [],
+    stopTimeoutId: 0,
+    fireworkClass:"firework",
+    fireworkTime: 750,
+    autoRemoveFfireworkTime: 9000,
+    random: function (min, max) {
+        return min + Math.random() * (max + 1 - min);
+    },
+    create: function () {
+        const xPos = Firework.random(40, 60),
+                yPos = Firework.random(40, 60),
+                colour = '#' + Math.random().toString(16).substr(2, 6);
+        for (let i = 1; i <= 30; i++) {
+            const firework = document.createElement('div');
+            firework.className = Firework.fireworkClass;
+            firework.classList.add(Firework.fireworkClass + i);
+            firework.classList.add("set" + this.set);
+            firework.style.backgroundColor = colour;
+            firework.style.left = xPos + '%';
+            firework.style.top = yPos + '%';
+            document.body.appendChild(firework);
+        }
+        this.set++;
+    },
+    delete: function () {
+        const setToDelete = this.set - 1;
+        if (this.set >= 0) {
+            const oldFireworks = document.getElemntsByClassName("set" + setToDelete);
+            oldFireworks.forEach(firework => {
+                firework.remove();
+            });
+        }
+    },
+    start: function () {
+        _this = Firework;
+        _this.create();
+        _this.intervalIds.push(setInterval(Firework.create, _this.fireworkTime));
+        _this.intervalIds.push(setInterval(Firework.delete, _this.fireworkTime * 3));
+        setTimeout(_this.stop, _this.autoRemoveFfireworkTime);
+    },
+    stop: function () {
+        _this = Firework;
+        for (let i = 0; i < _this.intervalIds.length; i++) {
+            clearInterval(_this.intervalIds[i]);
+        }
+        let leftOvers = document.getElementsByClassName(_this.fireworkClass);
+        while(leftOvers.length>0){
+            leftOvers[leftOvers.length-1].remove();
+        }
+    }
+};
--- a/src/JavaScript/Memory.js
+++ b/src/JavaScript/Memory.js
@ -0,0 +1,740 @@
+const Memory = {
+    memoryId: "memory",
+    wonId: "won",
+    inputMemoryPairsCountId: "memory-pair-count",
+    inputMemoryPairsId: "memory-pairs",
+    inputMemorySizeId: "memory-size",
+    selectFrontStyleId: "front-style-select",
+    selectBackStyleId: "back-style-select",
+    selectSpeedId: "speed-select",
+    countId: "tries-counter",
+    countWrapId: "tries-counter-wrap",
+    displayNoneClass: Css.classes.displayNone,
+    foundPairClass: "found",
+    activePairClass: "active",
+    memoryCardIdPrefix: "memory-card-",
+    memoryCardClass: "memory-flip-card",
+    memoryCardInnerClass: "inner",
+    memoryCardFrontClass: "front",
+    memoryCardBackClass: "back",
+    generateMemoryBtnId: "generate-memory",
+    memoryLoaderId: "memory-loader",
+    highscorePairsCountId: "highscore-pairs-count",
+    highscorePairsId: "highscore-pairs",
+    highscoreCountId: "highscore-count",
+    imageUrl: "./config/images.json",
+    emojiUrl: "./config/emojis.min.json",
+    emojiCategoriesUrl: "./config/emoji-categories.min.json",
+    emojis: null,
+    emojiCategories: null,
+    amountPairs: 5,
+    countPairs: 2,
+    speed: 3,
+    size: 14,
+    backStyle: 0,
+    frontStyle: 0,
+    foundPairs: 0,
+    counter: 0,
+    highscorePairsCount: 0,
+    highscorePairs: 0,
+    highscoreCount: 0,
+    memoryDom: null,
+    countDom: null,
+    wonDom: null,
+    loaderDom: null,
+    selectFrontStyleDom: null,
+    selectBackStyleDom: null,
+    images: null,
+    intervalIds: [],
+    colors: [],
+    actives: [],
+    activeFlipTimeoutId: 0,
+    cookies: false,
+    speedMap: [
+        6000,
+        4500,
+        3000,
+        1700,
+        850,
+        650,
+        300
+    ],
+    MAP: {
+        frontStyle2Class: {
+            0: Css.classes.memoryCardStyleTwo + " " + Css.classes.bgBlack,
+            1: Css.classes.memoryCardStyleTwo + " " + Css.classes.bgWhite,
+            2: Css.classes.memoryCardStyleTwo + " " + Css.classes.bgOrange,
+            3: Css.classes.memoryCardStyleTwo + " " + Css.classes.bgGreen,
+            4: Css.classes.memoryCardStyleTwo + " " + Css.classes.bgBlue,
+
+            5: Css.classes.memoryCardStyleOne + " " + Css.classes.bgBlack,
+            6: Css.classes.memoryCardStyleOne + " " + Css.classes.bgWhite,
+            7: Css.classes.memoryCardStyleOne + " " + Css.classes.bgOrange,
+            8: Css.classes.memoryCardStyleOne + " " + Css.classes.bgGreen,
+            9: Css.classes.memoryCardStyleOne + " " + Css.classes.bgBlue,
+
+            10: Css.classes.bgBlack,
+            11: Css.classes.bgWhite,
+            12: Css.classes.bgOrange,
+            13: Css.classes.bgGreen,
+            14: Css.classes.bgBlue
+        },
+        backStyle2Emoji: {
+            1: 0,
+            2: 0,
+            10: 1,
+            11: 1,
+            12: 2,
+            13: 2,
+            14: 3,
+            15: 3,
+            16: 4,
+            17: 4,
+            18: 5,
+            19: 5,
+            20: 6,
+            21: 6,
+            22: 7,
+            23: 7,
+            24: 8,
+            25: 8,
+            26: 9,
+            27: 9
+        },
+        backStyleHasColor: [
+            1, 3, 5, 7, 9, 10, 12, 14, 16, 18, 20, 22, 24, 26, 28
+        ]
+    },
+    timeoutEffectId: 0,
+    preFetchImages: false,
+    cookieSaveHighscore: 1,
+    cookieStartValue: 2,
+    randomize: function (values) {
+        let index = values.length, randomIndex;
+        while (index !== 0) {
+            randomIndex = Math.floor(Math.random() * index);
+            index--;
+            [values[index], values[randomIndex]] = [values[randomIndex], values[index]];
+        }
+    },
+    fillArr: function (_this) {
+        let arr = [];
+        _this.colors = ["F09130", "bcce43", "308ff0"];
+        for (let i = 0; i < _this.countPairs; i++) {
+            for (let j = 0; j < _this.amountPairs; j++) {
+                arr.push(j);
+                if (j > _this.colors.length - 1) {
+                    let newColor = Math.random().toString(16).substr(2, 3);
+                    while (_this.colors.indexOf(newColor) > -1) {
+                        newColor = Math.random().toString(16).substr(2, 3);
+                    }
+                    _this.colors.push(newColor);
+                }
+            }
+        }
+        if (_this.amountPairs < 5) {
+            _this.randomize(arr);
+        }
+        _this.randomize(arr);
+        _this.randomize(_this.colors);
+        return arr;
+    },
+    winActionHelper(_this) {
+        _this.highscorePairs = _this.amountPairs;
+        _this.highscorePairsCount = _this.countPairs;
+        _this.highscoreCount = _this.counter;
+        
+        if (_this.cookies && _this.cookieSaveHighscore === 1) {
+            _this.setCookie("highscorePairs", _this.highscorePairs);
+            _this.setCookie("highscorePairsCount", _this.highscorePairsCount);
+            _this.setCookie("highscoreCount", parseInt(_this.highscoreCount));
+        }
+        _this.showHighscore(_this);
+        if (typeof Firework === "object") {
+            Firework.start();
+        }
+    },
+    showHighscore: function (_this) {
+        if (document.getElementById(_this.highscoreCountId) !== null) {
+            document.getElementById(_this.highscoreCountId).innerHTML = _this.highscoreCount;
+        }
+        if (document.getElementById(_this.highscorePairsId) !== null) {
+            document.getElementById(_this.highscorePairsId).innerHTML = _this.highscorePairs;
+        }
+        if (document.getElementById(_this.highscorePairsCountId) !== null) {
+            document.getElementById(_this.highscorePairsCountId).innerHTML = _this.highscorePairsCount;
+        }
+    },
+    winAction: function (_this) {
+        if (_this.highscorePairsCount === _this.countPairs
+                && _this.highscorePairs === _this.amountPairs
+                && _this.highscoreCount > _this.counter) {
+            _this.winActionHelper(_this);
+        } else if (_this.highscorePairsCount === _this.countPairs
+                && _this.highscorePairs < _this.amountPairs) {
+            _this.winActionHelper(_this);
+        } else if (_this.highscorePairsCount < _this.countPairs) {
+            _this.winActionHelper(_this);
+        }
+        document.body.scrollIntoView({behavior: "smooth"});
+        if (_this.wonDom !== null) {
+            _this.wonDom.classList.remove(_this.displayNoneClass);
+        }
+    },
+    closeAllActiveCards: function (_this) {
+        let stillActives = _this.memoryDom.getElementsByClassName(_this.activePairClass);
+        for (let i = 0; i < stillActives.length; i++) {
+            if (stillActives[i] !== this) {
+                stillActives[i].classList.remove(_this.activePairClass);
+            }
+        }
+    },
+    compareActivesWith: function (_this, card) {
+        if (_this.actives.length === 0) {
+            return true;
+        } else {
+            return (_this.actives[0].innerHTML === card.innerHTML && card.id !== _this.actives[0].id);
+        }
+    },
+    cardAction: function (e) {
+        if (e.type === "click" || e.keyCode === 13) {
+            let _this = Memory;
+            if (this.classList.contains(_this.foundPairClass)
+                    || this.classList.contains(_this.activePairClass)
+                    ) {
+                return 0;
+            } else {
+                if (_this.actives.length === 0 && _this.memoryDom.getElementsByClassName(_this.activePairClass).length > 0) {
+                    // START lol some strange behavior without the while i think p
+                    while (_this.memoryDom.getElementsByClassName(_this.activePairClass).length > 0) {
+                        _this.closeAllActiveCards(_this);
+                    }
+                    clearTimeout(_this.activeFlipTimeoutId);
+                    // END
+                }
+
+                this.classList.add('active');
+                if (_this.compareActivesWith(_this, this) && _this.actives.length < _this.countPairs - 1) {
+                    _this.actives.push(this);
+                } else {
+                    _this.counter++;
+
+                    if (_this.countDom !== null) {
+                        if(document.getElementById(_this.countWrapId) !== null){
+                            document.getElementById(_this.countWrapId).classList.remove(_this.displayNoneClass);
+                        }
+                        _this.countDom.innerHTML = _this.counter;
+                    }
+                    if (_this.compareActivesWith(_this, this)) {
+                        this.removeAttribute("tabindex");
+                        this.classList.add(_this.foundPairClass);
+                        this.classList.remove(_this.activePairClass);
+                        this.removeEventListener("click", _this.cardAction, false);
+                        this.removeEventListener("keyup", _this.cardAction, false);
+
+                        for (let i = 0; i < _this.actives.length; i++) {
+                            _this.actives[i].removeAttribute("tabindex");
+                            _this.actives[i].classList.add(_this.foundPairClass);
+                            _this.actives[i].classList.remove(_this.activePairClass);
+                            _this.actives[i].removeEventListener("click", _this.cardAction, false);
+                            _this.actives[i].removeEventListener("keyup", _this.cardAction, false);
+                        }
+                        _this.foundPairs++;
+                        if (_this.foundPairs === _this.amountPairs) {
+                            _this.actives = [];
+                            _this.winAction(_this);
+                        }
+                    } else {
+                        let second = this, firsts = _this.actives;
+                        _this.activeFlipTimeoutId = setTimeout(function () {
+                            for (let i = 0; i < firsts.length; i++) {
+                                if (second.classList.contains(_this.activePairClass)) {
+                                    firsts[i].classList.remove(_this.activePairClass);
+                                }
+                            }
+                            if (second.classList.contains(_this.activePairClass)) {
+                                second.classList.remove(_this.activePairClass);
+                            }
+                            firsts = [];
+                            second = null;
+                        }, _this.speedMap[_this.speed]);
+                    }
+                    _this.actives = [];
+                }
+            }
+        }
+    },
+    cardClick: function (_this, card) {
+        card.addEventListener("click", _this.cardAction, false);
+        card.addEventListener("keyup", _this.cardAction, false);
+    },
+    getCharCode: function (value) {
+        if (value === null || value === "undefined") {
+            return "";
+        }
+        if (value < 26) {
+            return String.fromCharCode(65 + value);
+        }
+        return (Memory.getCharCode(Number(value / 26) - 1) + String.fromCharCode(65 + (value % 26)));
+    },
+    toHex: function (string) {
+        var s = unescape(encodeURIComponent(string));
+        var h = '';
+        for (var i = 0; i < s.length; i++) {
+            h += s.charCodeAt(i).toString(16);
+        }
+        return String(h);
+    },
+    simpleHashCode: function (string) {
+        var a = 1, c = 0, h, o;
+        if (string) {
+            a = 0;
+            for (h = string.length - 1; h >= 0; h--) {
+                o = string.charCodeAt(h);
+                a = (a << 6 & 268435455) + o + (o << 14);
+                c = a & 266338304;
+                a = c !== 0 ? a ^ c >> 21 : a;
+            }
+        }
+        return String(a);
+    },
+    getSaltetString(_this, arr, i) {
+        switch (arr[i] % 3) {
+            case 1:
+                return _this.amountPairs + ".a!" + _this.emojis[arr[i]] + _this.highscoreCount + "t" + arr[i] + "Rt" + ".a!" + _this.highscorePairs;
+                break;
+            case 2:
+                return _this.amountPairs + ".T!" + +_this.highscorePairs + "t" + _this.emojis[arr[i]] + "t" + ".R!" + _this.highscoreCount;
+                break;
+            default:
+                return _this.amountPairs + _this.emojis[arr[i]] + ".Ec" + arr[i] + _this.highscoreCount + "t" + "t" + ".a#" + _this.highscorePairs;
+                break;
+        }
+    },
+    randomLongString: function (_this, arr, i) {
+        return _this.getCharCode(_this.toHex(_this.simpleHashCode(_this.getSaltetString(_this, arr, i))));
+    },
+    randomShortString: function (_this, arr, i) {
+        return _this.getCharCode(_this.simpleHashCode(_this.getSaltetString(_this, arr, i)));
+    },
+    randomizeShortStringForMemorie: function (_this, arr, i) {
+        return _this.getCharCode(_this.simpleHashCode(_this.getSaltetString(_this, arr, i)));
+    },
+    getContrastYIQ: function (hexcolor) {
+        if (hexcolor.length === 3) {
+            hexcolor = hexcolor.split('').map(function (hex) {
+                return hex + hex;
+            }).join('');
+        }
+        let r = parseInt(hexcolor.substr(0, 2), 16);
+        let g = parseInt(hexcolor.substr(2, 2), 16);
+        let b = parseInt(hexcolor.substr(4, 2), 16);
+        let yiq = ((r * 299) + (g * 587) + (b * 114)) / 1000;
+        return (yiq >= 128) ? 'black' : 'white';
+    },
+    createCardBackDom: function (_this, arr, i, emojiSize) {
+        let back = document.createElement("div");
+        _this = Memory;
+        back.className = _this.memoryCardBackClass;
+        if (_this.MAP.backStyleHasColor.indexOf(_this.backStyle) > -1) {
+            back.style = "background-color: #" + _this.colors[arr[i]] + ";";
+            back.classList.add("text-" + _this.getContrastYIQ(_this.colors[arr[i]]));
+        }
+        switch (_this.backStyle) {
+            case 0:
+                if (typeof (_this.images[arr[i]]) === "undefined") {
+                    back.style = "background-color: #" + _this.colors[arr[i]] + ";";
+                    back.innerHTML = "<div style=\"font-size: " + emojiSize + "em;\">" + _this.emojis[_this.emojiCategories[0][arr[i]]] + "<div>";
+                } else {
+                    back.style = "background-image: url(" + _this.images[arr[i]] + ");";
+                }
+                break;
+            case 3:
+            case 4:
+                back.innerHTML = "<div class=\"h1 text-wrap\">" + _this.randomShortString(_this, arr, i) + "<div>";
+                break;
+            case 5:
+            case 6:
+                back.innerHTML = "<div class=\"h1 text-wrap\">" + _this.randomLongString(_this, arr, i) + "<div>";
+                break;
+            case 7:
+            case 8:
+                back.innerHTML = "<div class=\"h1\">" + arr[i] + "<div>";
+                break;
+            case 28:
+            case 29:
+                back.innerHTML = "<div class=\"h1 text-wrap\">" + _this.simpleHashCode(arr[i] + "") + "<div>";
+                break;
+            case 9:
+                break;
+            default:
+                if (typeof (_this.MAP.backStyle2Emoji[_this.backStyle]) === "undefined") {
+                    if (typeof (_this.images[arr[i]]) === "undefined") {
+                        back.style = "background-color: #" + _this.colors[arr[i]] + ";";
+                        back.innerHTML = "<div style=\"font-size: " + emojiSize + "em;\">" + _this.emojis[_this.emojiCategories[0][arr[i]]] + "<div>";
+                    } else {
+                        back.style = "background-image: url(" + _this.images[arr[i]] + ");";
+                    }
+                } else {
+                    back.innerHTML = "<div style=\"font-size: " + emojiSize + "em;\">" + _this.emojis[_this.emojiCategories[_this.MAP.backStyle2Emoji[_this.backStyle]][arr[i]]] + "<div>";
+                }
+                break;
+        }
+        return back;
+    },
+    drawSingleMemoryCard: function (_this, arr, i) {
+        let card = document.createElement("div");
+        card.id = _this.memoryCardIdPrefix + i;
+        card.className = _this.memoryCardClass;
+        card.setAttribute("tabindex", 0);
+
+        card.style = "width: " + _this.size + "em; height: " + _this.size + "em";
+
+        let inner = document.createElement("div");
+        inner.className = _this.memoryCardInnerClass;
+        let front = document.createElement("div");
+        front.className = _this.memoryCardFrontClass + " " + _this.MAP.frontStyle2Class[_this.frontStyle];
+
+        inner.appendChild(front);
+        inner.appendChild(_this.createCardBackDom(_this, arr, i, _this.size * 0.8));
+        card.appendChild(inner);
+        _this.cardClick(_this, card);
+        _this.memoryDom.appendChild(card);
+    },
+    draw: function (_this) {
+        // if someone put somthing else into the memory 
+        while (_this.memoryDom.firstChild) {
+            _this.memoryDom.removeChild(_this.memoryDom.firstChild);
+        }
+        if (_this.images !== null) {
+            _this.randomize(_this.images);
+        }
+        for (let i = 0; i < _this.emojiCategories.length; i++) {
+            _this.randomize(_this.emojiCategories[i]);
+        }
+
+
+        let arr = _this.fillArr(_this);
+        for (let i = 0; i < arr.length; i++) {
+            _this.drawSingleMemoryCard(_this, arr, i);
+        }
+        arr = [];
+    },
+    reset: function (_this) {
+        if (_this.wonDom !== null && !_this.wonDom.classList.contains(_this.displayNoneClass)) {
+            _this.wonDom.classList.add(_this.displayNoneClass);
+        }
+        if (typeof Firework === "object") {
+            Firework.stop();
+        }
+        let cards = document.getElementsByClassName(_this.memoryCardClass);
+        for (let i = 0; i < cards.length; i++) {
+            cards[i].removeEventListener("click", _this.cardAction, false);
+            cards[i].removeEventListener("keyup", _this.cardAction, false);
+            cards[i].remove();
+        }
+        cards = null;
+        _this.foundPairs = 0;
+        _this.actives = [];
+
+    },
+    hideWelcomeMessages: function (_this) {
+        let doms = document.getElementsByClassName("welcome");
+        for (let i = 0; i < doms.length; i++) {
+            if (!doms[i].classList.contains(_this.displayNoneClass)) {
+                doms[i].classList.add(_this.displayNoneClass);
+            }
+        }
+    },
+    showLoader: function (_this) {
+        if (_this.loaderDom.classList.contains(_this.displayNoneClass)) {
+            _this.loaderDom.classList.remove(_this.displayNoneClass);
+        }
+        if (!_this.memoryDom.classList.contains(_this.displayNoneClass)) {
+            _this.memoryDom.classList.add(_this.displayNoneClass);
+        }
+    },
+    hideLoader: function (_this) {
+        if (!_this.loaderDom.classList.contains(_this.displayNoneClass)) {
+            _this.loaderDom.classList.add(_this.displayNoneClass);
+        }
+        if (_this.memoryDom.classList.contains(_this.displayNoneClass)) {
+            _this.memoryDom.classList.remove(_this.displayNoneClass);
+        }
+    },
+    setCookieSaveHighscore: function (value) {
+        Memory.cookieSaveHighscore = parseInt(value);
+        Memory.setCookie("cookieSaveHighscore", Memory.cookieSaveHighscore);
+    },
+    setCookieStartValue: function (value) {
+        if (parseInt(value) > 0) {
+            Memory.cookieStartValue = parseInt(value);
+            Memory.setCookie("cookieStartValue", Memory.cookieStartValue);
+            Memory.setCooiesFromForm();
+        }
+    },
+    setCooiesFromForm: function () {
+        let _this = Memory;
+        if (_this.cookies && _this.cookieStartValue === 1) {
+            if (document.getElementById(_this.inputMemoryPairsId) !== null) {
+                _this.setCookie("amountPairs", parseInt(document.getElementById(_this.inputMemoryPairsId).value));
+            }
+            if (document.getElementById(_this.inputMemoryPairsCountId) !== null) {
+                _this.setCookie("countPairs", parseInt(document.getElementById(_this.inputMemoryPairsCountId).value));
+            }
+            if (document.getElementById(_this.selectSpeedId) !== null) {
+                _this.setCookie("speed", parseInt(document.getElementById(_this.selectSpeedId).value));
+            }
+            if (_this.selectFrontStyleDom !== null) {
+                _this.setCookie("frontStyle", parseInt(_this.selectFrontStyleDom.options[_this.selectFrontStyleDom.selectedIndex].value));
+            }
+            if (_this.selectBackStyleDom !== null) {
+                _this.setCookie("backStyle", parseInt(_this.selectBackStyleDom.options[_this.selectBackStyleDom.selectedIndex].value));
+            }
+            if (document.getElementById(_this.inputMemorySizeId) !== null) {
+                _this.setCookie("size", parseInt(document.getElementById(_this.inputMemorySizeId).value));
+            }
+        }
+    },
+    setCookieStartAction: function (_this) {
+        if (_this.cookies && _this.cookieStartValue === 2) {
+            _this.setCookie("amountPairs", _this.amountPairs);
+            _this.setCookie("countPairs", _this.countPairs);
+            _this.setCookie("speed", _this.speed);
+            _this.setCookie("size", _this.size);
+            _this.setCookie("frontStyle", _this.frontStyle);
+            _this.setCookie("backStyle", _this.backStyle);
+        }
+    },
+    startAction(_this) {
+        document.getElementById(_this.generateMemoryBtnId).addEventListener("click", function () {
+            _this.showLoader(_this);
+            _this.hideWelcomeMessages(_this);
+            _this.reset(_this);
+
+            if (document.getElementById(_this.inputMemoryPairsId) !== null) {
+                _this.amountPairs = parseInt(document.getElementById(_this.inputMemoryPairsId).value);
+            }
+            if (document.getElementById(_this.inputMemoryPairsCountId) !== null) {
+                _this.countPairs = parseInt(document.getElementById(_this.inputMemoryPairsCountId).value);
+            }
+            if (document.getElementById(_this.selectSpeedId) !== null) {
+                _this.speed = parseInt(document.getElementById(_this.selectSpeedId).value);
+            }
+            if (_this.selectFrontStyleDom !== null) {
+                _this.frontStyle = parseInt(_this.selectFrontStyleDom.options[_this.selectFrontStyleDom.selectedIndex].value);
+            }
+            if (_this.selectBackStyleDom !== null) {
+                _this.backStyle = parseInt(_this.selectBackStyleDom.options[_this.selectBackStyleDom.selectedIndex].value);
+            }
+            if (document.getElementById(_this.inputMemorySizeId) !== null) {
+                _this.size = parseInt(document.getElementById(_this.inputMemorySizeId).value);
+            }
+            _this.setCookieStartAction(_this);
+            _this.draw(_this);
+            _this.counter = 0;
+            setTimeout(function () {
+                _this.hideLoader(_this);
+                _this.memoryDom.scrollIntoView({behavior: "smooth"});
+            }, 750);
+        }, false);
+    },
+    setPrefilledCardActions: function (_this) {
+        // require same amount as in the pressetings for success on the init or u override the variables and create own inits
+        if (_this.memoryDom.getElementsByClassName(_this.memoryCardClass).length === (_this.amountPairs * _this.countPairs)) {
+            let cards = _this.memoryDom.getElementsByClassName(_this.memoryCardClass);
+            for (let i = 0; i < cards.length; i++) {
+                _this.cardClick(_this, cards[i]);
+            }
+        }
+    },
+    initDomVariables: function (_this) {
+        if (_this.memoryDom === null) {
+            _this.memoryDom = document.getElementById(_this.memoryId);
+        }
+        if (_this.countDom === null) {
+            _this.countDom = document.getElementById(_this.countId);
+        }
+        if (_this.selectFrontStyleDom === null) {
+            _this.selectFrontStyleDom = document.getElementById(_this.selectFrontStyleId);
+        }
+        if (_this.selectBackStyleDom === null) {
+            _this.selectBackStyleDom = document.getElementById(_this.selectBackStyleId);
+        }
+        if (_this.wonDom === null) {
+            _this.wonDom = document.getElementById(_this.wonId);
+        }
+        if (_this.loaderDom === null) {
+            _this.loaderDom = document.getElementById(_this.memoryLoaderId);
+        }
+    },
+    fetchEmojis: function (_this) {
+        if (_this.emojis === null) {
+            fetch(_this.emojiUrl)
+                    .then(function (response) {
+                        return response.json();
+                    })
+                    .then(function (data) {
+                        _this.emojis = data;
+                    })
+                    .catch(function (error) {
+                        _this.emojis = [];
+                    });
+        }
+        if (_this.emojiCategories === null) {
+            fetch(_this.emojiCategoriesUrl)
+                    .then(function (response) {
+                        return response.json();
+                    })
+                    .then(function (data) {
+                        _this.emojiCategories = data;
+                    })
+                    .catch(function (error) {
+                        _this.emojiCategories = [];
+                    });
+        }
+    },
+    fetchSingleImages: function (_this) {
+        if (_this.preFetchImages === true) {
+            document.addEventListener("DOMContentLoaded", async function () {
+                for (let i = 0; i < _this.images.length; i++) {
+                    if (_this.images[i].indexOf('http') === 0) {
+                        fetch(_this.images[i]);
+                    }
+                }
+            }, false);
+        }
+    },
+    fetchImages: function (_this) {
+        if (typeof (_this.memoryDom.dataset.imagesSrc) !== "undefined") {
+            _this.imageUrl = _this.memoryDom.dataset.imagesSrc;
+        }
+        if (_this.images === null) {
+            fetch(_this.imageUrl)
+                    .then(function (response) {
+                        return response.json();
+                    })
+                    .then(function (data) {
+                        _this.images = data;
+                        _this.fetchSingleImages(_this);
+                    })
+                    .catch(function (error) {
+                        _this.images = [];
+                    });
+        }
+    },
+    initDomActions: function (_this) {
+        _this.initDomVariables(_this);
+        _this.startAction(_this);
+        _this.setPrefilledCardActions(_this);
+    },
+    eraseCookie: function (name) {
+        let d = new Date;
+        d.setTime(d.getTime() - 24 * 60 * 60 * 1000 * 1);
+        document.cookie = name + "=;secure=true;path=/;expires=" + d.toGMTString();
+    },
+    eraseAllCookies: function () {
+        let _this = Memory;
+        _this.cookies = false;
+        _this.cookieSaveHighscore = 0;
+        _this.cookieStartValue = 0;
+
+        _this.eraseCookie("amountPairs");
+        _this.eraseCookie("countPairs");
+        _this.eraseCookie("speed");
+        _this.eraseCookie("size");
+        _this.eraseCookie("frontStyle");
+        _this.eraseCookie("backStyle");
+        _this.eraseCookie("highscorePairs");
+        _this.eraseCookie("highscorePairsCount");
+        _this.eraseCookie("highscoreCount");
+        _this.eraseCookie("cookieStartValue");
+        _this.eraseCookie("cookieSaveHighscore");
+        
+    },
+    getCookie: function (name) {
+        let v = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');
+        return v ? v[2] : null;
+    },
+    setCookie: function (name, value, days = 365) {
+        let d = new Date;
+        d.setTime(d.getTime() + 24 * 60 * 60 * 1000 * days);
+        document.cookie = name + "=" + value + ";secure=true;path=/;expires=" + d.toGMTString();
+    },
+    getInt: function (value, defaultValue = 0) {
+        return isNaN(parseInt(value)) ? defaultValue : parseInt(value);
+    },
+    fillForm: function (_this) {
+        if (document.getElementById(_this.inputMemoryPairsId) !== null) {
+            document.getElementById(_this.inputMemoryPairsId).value = _this.amountPairs;
+        }
+        if (document.getElementById(_this.inputMemoryPairsCountId) !== null) {
+            document.getElementById(_this.inputMemoryPairsCountId).value = _this.countPairs;
+        }
+        if (document.getElementById(_this.selectSpeedId) !== null) {
+            document.getElementById(_this.selectSpeedId).value = _this.speed;
+        }
+        if (_this.selectFrontStyleDom !== null) {
+            _this.selectFrontStyleDom.value = _this.frontStyle;
+        }
+        if (_this.selectBackStyleDom !== null) {
+            _this.selectBackStyleDom.value = _this.backStyle;
+        }
+        if (document.getElementById(_this.inputMemorySizeId) !== null) {
+            document.getElementById(_this.inputMemorySizeId).value = _this.size;
+        }
+    },
+    loadFromCookies(_this) {
+        _this.cookieSaveHighscore = _this.getInt(_this.getCookie("cookieSaveHighscore"));
+        _this.cookieStartValue = _this.getInt(_this.getCookie("cookieStartValue"));
+
+//
+//gulp.task('copy-resources', [ 'copy-media', 'copy-data', 'copy-favicon', 'copy-fonts']);
+        if (_this.cookieStartValue > 0) {
+            _this.cookies = true;
+            _this.amountPairs = _this.getInt(_this.getCookie("amountPairs"));
+            _this.countPairs = _this.getInt(_this.getCookie("countPairs"));
+            _this.speed = _this.getInt(_this.getCookie("speed"));
+            _this.size = _this.getInt(_this.getCookie("size"));
+            _this.frontStyle = _this.getInt(_this.getCookie("frontStyle"));
+            _this.backStyle = _this.getInt(_this.getCookie("backStyle"));
+        }
+
+        if (_this.cookieSaveHighscore > 0) {
+            _this.cookies = true;
+            _this.highscorePairs = _this.getInt(_this.getCookie("highscorePairs"));
+            _this.highscorePairsCount = _this.getInt(_this.getCookie("highscorePairsCount"));
+            _this.highscoreCount = _this.getInt(_this.getCookie("highscoreCount"));
+        }
+    },
+    init: function (preFetchImages = false, enforceCookies = false) {
+        let _this = this;
+        if (preFetchImages) {
+            _this.preFetchImages = true;
+        }
+        _this.loadFromCookies(_this);
+        if (!_this.cookies && enforceCookies) {
+            _this.cookies = true;
+            _this.setCookieSaveHighscore(1);
+            _this.setCookieStartValue(2);
+        }
+        if (document.getElementById(_this.memoryId) === null) {
+            document.addEventListener("DOMContentLoaded", function () {
+                if (document.getElementById(Memory.memoryId) === null) {
+                    _this.initDomActions();
+                    _this.showHighscore(_this);
+                    _this.fillForm(_this);
+                }
+            }, false);
+        } else {
+            _this.initDomActions(_this);
+            _this.showHighscore(_this);
+            _this.fillForm(_this);
+        }
+        _this.fetchEmojis(_this);
+        _this.fetchImages(_this);
+    }
+};
+
+
+//Memory.init();
--- a/src/JavaScript/PWA.js
+++ b/src/JavaScript/PWA.js
@ -0,0 +1,58 @@
+
+const PWA = {
+    installBtnClass: "btn-install-as-app",
+    deferredPrompt: null,
+    displaNoneClass: Css.classes.displayNone,
+    installBtnDoms: [],
+    getDeferredPromptEvent: function () {
+        let _this = this;
+        if (_this.deferredPrompt === null) {
+            window.addEventListener('beforeinstallprompt', async function (e) {
+                e.preventDefault();
+                _this.deferredPrompt = e;
+                for (let i = 0; i < _this.installBtnDoms.length; i++) {
+                    _this.installBtnDoms[i].classList.remove(_this.displaNoneClass);
+                }
+            });
+        }
+    },
+    installBtnAction: function () {
+        let _this = PWA;
+        for (let i = 0; i < _this.installBtnDoms.length; i++) {
+            _this.installBtnDoms[i].classList.add(_this.displaNoneClass);
+        }
+        _this.deferredPrompt.prompt();
+        _this.deferredPrompt.userChoice;
+        _this.deferredPrompt = null;
+    },
+
+    setBtnActions: function () {
+        let _this = PWA;
+        for (let i = 0; i < _this.installBtnDoms.length; i++) {
+            _this.installBtnDoms[i].addEventListener('click', _this.installBtnAction, false);
+        }
+        window.addEventListener('appinstalled', function () {
+            for (let i = 0; i < _this.installBtnDoms.length; i++) {
+                _this.installBtnDoms[i].classList.add(_this.displaNoneClass);
+            }
+            _this.deferredPrompt = null;
+        });
+    },
+    isStandalone: false,
+    getPWADisplayMode: function () {
+        this.isStandalone = window.matchMedia('(display-mode: standalone)').matches;
+        if (document.referrer.startsWith('android-app://')) {
+            return 'twa';
+        } else if (navigator.standalone || this.isStandalone) {
+            return 'standalone';
+        }
+        return 'browser';
+    },
+    init: function () {
+        this.installBtnDoms = document.getElementsByClassName(PWA.installBtnClass)
+        this.getDeferredPromptEvent();
+        this.setBtnActions();
+    }
+};
+
+PWA.init();
--- a/src/JavaScript/main.js
+++ b/src/JavaScript/main.js
@ -0,0 +1,212 @@
+const RaMemoryPage = {
+    howToPlayId: "how-to-play",
+    aboutId: "about",
+    gameId: "game",
+    imprintId: "imprint",
+    gdprId: "gdpr",
+    settingsId: "settings",
+    displayNoneClass: Css.classes.displayNone,
+    howToPlayBtnClass: "btn-howto",
+    gdprBtnClass: "btn-gdpr",
+    imprintBtnClass: "btn-imprint",
+    settingsBtnClass: "btn-settings",
+    themeSwitchBtnClass: "btn-toggle-theme",
+    settingsCheckUseCookiesId: "settings-use-cookies",
+    settingsCheckSaveHighscoreId: "settings-save-highscore",
+    settingsRadioStartValueClass: "settings-start-value",
+    scrollToTimeout: 200,
+    timeoutId: 0,
+    prefersDarkTheme: null,
+    currentTheme: null,
+    closeAll: function (_this, not = "") {
+        if (document.getElementById(_this.howToPlayId) && not !== _this.howToPlayId) {
+            if (!document.getElementById(_this.howToPlayId).classList.contains(_this.displayNoneClass)) {
+                document.getElementById(_this.howToPlayId).classList.add(_this.displayNoneClass);
+            }
+        }
+        if (document.getElementById(_this.gameId) && not !== _this.gameId) {
+            if (!document.getElementById(_this.gameId).classList.contains(_this.displayNoneClass)) {
+                document.getElementById(_this.gameId).classList.add(_this.displayNoneClass);
+            }
+        }
+        if (document.getElementById(_this.aboutId) && not !== _this.aboutId) {
+            if (!document.getElementById(_this.aboutId).classList.contains(_this.displayNoneClass)) {
+                document.getElementById(_this.aboutId).classList.add(_this.displayNoneClass);
+            }
+        }
+
+        if (document.getElementById(_this.imprintId) && not !== _this.imprintId) {
+            if (!document.getElementById(_this.imprintId).classList.contains(_this.displayNoneClass)) {
+                document.getElementById(_this.imprintId).classList.add(_this.displayNoneClass);
+            }
+        }
+        if (document.getElementById(_this.gdprId) && not !== _this.gdprId) {
+            if (!document.getElementById(_this.gdprId).classList.contains(_this.displayNoneClass)) {
+                document.getElementById(_this.gdprId).classList.add(_this.displayNoneClass);
+            }
+        }
+        if (document.getElementById(_this.settingsId) && not !== _this.settingsId) {
+            if (!document.getElementById(_this.settingsId).classList.contains(_this.displayNoneClass)) {
+                document.getElementById(_this.settingsId).classList.add(_this.displayNoneClass);
+            }
+    }
+    },
+    showJust: function (id) {
+        let _this = RaMemoryPage;
+        _this.closeAll(_this, id);
+        if (document.getElementById(id)) {
+            if (document.getElementById(id).classList.contains(_this.displayNoneClass)) {
+                document.getElementById(id).classList.remove(_this.displayNoneClass);
+            }
+        }
+    },
+    btnActions: function (_this, id) {
+        _this.showJust(id);
+        _this.timeoutId = setTimeout(function () {
+            document.getElementById(id).scrollIntoView({behavior: "smooth"});
+        }, _this.scrollToTimeout);
+    },
+    initBtnActions: function (_this) {
+        document.getElementById(Memory.generateMemoryBtnId).addEventListener("click", function () {
+            _this.showJust(_this.gameId);
+        });
+        let btns = document.getElementsByClassName(_this.howToPlayBtnClass);
+        for (let i = 0; i < btns.length; i++) {
+            btns[i].addEventListener("click", function () {
+                _this.btnActions(_this, _this.howToPlayId);
+            });
+        }
+        btns = document.getElementsByClassName(_this.gdprBtnClass);
+        for (let i = 0; i < btns.length; i++) {
+            btns[i].addEventListener("click", function () {
+                _this.btnActions(_this, _this.gdprId);
+            });
+        }
+        btns = document.getElementsByClassName(_this.imprintBtnClass);
+        for (let i = 0; i < btns.length; i++) {
+            btns[i].addEventListener("click", function () {
+                _this.btnActions(_this, _this.imprintId);
+            });
+        }
+        btns = document.getElementsByClassName(_this.settingsBtnClass);
+        for (let i = 0; i < btns.length; i++) {
+            btns[i].addEventListener("click", function () {
+                _this.btnActions(_this, _this.settingsId);
+            });
+        }
+
+        btns = document.getElementsByClassName(_this.themeSwitchBtnClass);
+        for (let i = 0; i < btns.length; i++) {
+            btns[i].addEventListener("click", function () {
+                let theme = "";
+                if (_this.prefersDarkTheme.matches) {
+                    document.body.classList.toggle(Css.classes.lightTheme);
+                    theme = document.body.classList.contains(Css.classes.lightTheme)
+                            ? "light"
+                            : "dark";
+                } else {
+                    document.body.classList.toggle(Css.classes.darkTheme);
+                    theme = document.body.classList.contains(Css.classes.darkTheme)
+                            ? "dark"
+                            : "light";
+                }
+                localStorage.setItem("theme", theme);
+            });
+        }
+        document.getElementById("save-settings").addEventListener("click", function (e) {
+            if (document.getElementById(_this.settingsCheckUseCookiesId).checked) {
+                _this.saveSettingsAction(_this);
+
+                document.getElementById(_this.settingsCheckUseCookiesId).parentNode.classList.remove("bg-alert");
+                document.getElementById(_this.settingsCheckUseCookiesId).parentNode.classList.remove("text-white");
+            } else {
+                document.getElementById(_this.settingsCheckUseCookiesId).parentNode.classList.add("bg-alert");
+                document.getElementById(_this.settingsCheckUseCookiesId).parentNode.classList.add("text-white");
+            }
+        });
+        document.getElementById("clear-settings").addEventListener("click", function (e) {
+            Memory.eraseAllCookies();
+            document.getElementById(_this.settingsRadioStartValueClass + "-0").checked = true;
+            document.getElementById(_this.settingsCheckSaveHighscoreId).checked = false;
+            document.getElementById(_this.settingsCheckUseCookiesId).checked = false;
+            
+                document.getElementById("settings-saved").classList.remove("d-none");
+            setTimeout(function(){
+                document.getElementById("settings-saved").classList.add("d-none");
+            },1350);
+        });
+    },
+    initTheme: function (_this) {
+        _this.prefersDarkTheme = window.matchMedia("(prefers-color-scheme: dark)");
+        _this.currentTheme = localStorage.getItem("theme");
+        if (_this.currentTheme === "dark") {
+            document.body.classList.toggle(Css.classes.darkTheme);
+        } else if (_this.currentTheme === "light") {
+            document.body.classList.toggle(Css.classes.lightTheme);
+        }
+    },
+    initSettings: function (_this) {
+        document.getElementById(_this.settingsRadioStartValueClass + "-" + Memory.cookieStartValue).checked = true;
+        document.getElementById(_this.settingsCheckSaveHighscoreId).checked = Memory.cookieSaveHighscore === 0 ? false : true;
+        document.getElementById(_this.settingsCheckUseCookiesId).checked = Memory.cookies;
+    },
+    saveSettingsAction: function (_this) {
+        document.cookie = "";
+        Memory.cookies = true;
+        Memory.setCookieSaveHighscore(document.getElementById(_this.settingsCheckSaveHighscoreId).checked ? 1 : 0);
+        Memory.setCookieStartValue(document.querySelector('input[name="' + _this.settingsRadioStartValueClass + '"]:checked').value);
+         document.getElementById("settings-saved").classList.remove("d-none");
+            setTimeout(function(){
+                document.getElementById("settings-saved").classList.add("d-none");
+            },1350);
+    },
+    init: function () {
+        let _this = this;
+        if (typeof Memory === "object") {
+            Memory.init();
+        }
+        _this.initTheme(_this);
+        _this.initBtnActions(_this);
+        _this.initSettings(_this);
+        if (location.hash === "#" + _this.howToPlayId ||
+                location.hash === "#" + _this.settingsId ||
+                location.hash === "#" + _this.gdprId ||
+                location.hash === "#" + _this.imprintId
+                ) {
+            let id = location.hash.substr(1, location.hash.length - 1);
+            if (document.getElementById(id)) {
+                _this.showJust(id);
+                setTimeout(function () {
+                    document.getElementById(id).scrollIntoView({behavior: "smooth"});
+                }, 450);
+            }
+        }
+        _this.closeAll(_this, _this.aboutId);
+    }
+};
+
+RaMemoryPage.init();
+
+
+const registerServiceWorker = async () => {
+    if ('serviceWorker' in navigator) {
+        try {
+            const registration = await navigator.serviceWorker.register(
+                    './sw.js',
+                    {
+                        scope: './',
+                    }
+            );
+            if (registration.installing) {
+            } else if (registration.waiting) {
+            } else if (registration.active) {
+            }
+        } catch (error) {
+            console.error(`Registration failed with ${error}`);
+        }
+    }
+};
+
+window.addEventListener("DOMContentLoaded", async function (event) {
+    registerServiceWorker();
+});
--- a/src/Scss/Firework.scss
+++ b/src/Scss/Firework.scss
@ -0,0 +1,29 @@
+/*
+    Created on : Jan 29, 2024, 8:03:11 PM
+    Author     : Raphael Martin
+*/
+
+.firework {
+    position: absolute;
+    width: 5px;
+    height: 5px;
+    opacity: 1;
+}
+
+@keyframes launchFirework {
+    to {
+        opacity: 0;
+    }
+}
+
+@for $i from 1 through 50 {
+    @keyframes launchFirework#{$i} {
+        to {
+            transform: translate(random(201) - 101 + px, random(201) - 101 + px);
+        }
+    }
+    .firework#{$i} {
+        animation: launchFirework random(1001) + 499 + ms linear forwards, launchFirework#{$i} random(1001) + 499 + ms linear forwards;
+    }
+}
+
--- a/src/Scss/Memory.scss
+++ b/src/Scss/Memory.scss
@ -0,0 +1,89 @@
+#won {
+    bottom: 2rem;
+    height: 80px;
+}
+#memory{
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+
+    > .memory-flip-card{
+
+        font-size: 8px;
+        width: 230px;
+        height: 230px;
+        margin: 0.3rem;
+        background-color: transparent;
+        perspective: 1000px;
+        opacity: 1;
+        -webkit-transition: opacity 2s ease-in-out;
+        -moz-transition: opacity 2s ease-in-out;
+        transition: opacity 2s ease-in-out;
+        > .inner {
+            position: relative;
+            width: 100%;
+            height: 100%;
+            text-align: center;
+            transition: transform 0.8s;
+            transform-style: preserve-3d;
+            > .front {
+                cursor: pointer;
+                background-color: #333;
+                background-repeat: no-repeat;
+                background-size: contain;
+                background-position: center;
+                &.style-one{
+                    background-image: url("../media/frog512x512.png");
+
+                }
+                &.style-two{
+                    background-image: url("../media/altogether-logo.png");
+                    &.bg-black, &.bg-blue{
+                        background-image: url("../media/altogether-logo-inverted.png");
+                    }
+
+                }
+            }
+            > .back {
+                font-size: 8px;
+                transform: rotateY(180deg);
+                background-repeat: no-repeat;
+                background-size: cover;
+                background-position: center;
+            }
+            > .front, > .back {
+                -webkit-user-select: none; /* Safari */
+                -ms-user-select: none; /* IE 10 and IE 11 */
+                user-select: none; /* Standard syntax */
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                -webkit-backface-visibility: hidden;
+                backface-visibility: hidden;
+                box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
+            }
+        }
+        &.found{
+            opacity: 0.7;
+            > .inner{
+                > .back{
+                    border: solid 1px #bcce43;
+                }
+            }
+        }
+        &.active, &.found{
+            > .inner{
+                transform: rotateY(180deg);
+            }
+        }
+    }
+}
+
+@media (min-width: 750px) {
+    #memory > .card{
+        font-size: 20px;
+        > .inner > .back {
+            font-size: 20px;
+        }
+    }
+}
--- a/src/Scss/_variables.scss
+++ b/src/Scss/_variables.scss
@ -0,0 +1,138 @@
+/*
+Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
+Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/style.scss to edit this template
+*/
+/*
+    Created on : Jan 29, 2024, 8:40:51 PM
+    Author     : Raphael Martin
+*/
+
+$darkRed: #8B0000;
+$crimson: #DC143C;
+$firebrick: #B22222;
+$indianRed: #CD5C5C;
+$tomato: #FF6347;
+
+$primary: #F09130;
+$secondry: #308ff0;
+$success: #bcce43;
+$violet: #5543ce;
+$black: #333;
+$white: #fff;
+$blue: #15739f;
+/*:root {
+  color-scheme: light dark;  both supported 
+
+     Light mode 
+    --light-switch-shadow: #373d4e;
+    --light-switch-icon: "🌚";
+    --light-switch-text: "dark mode?";
+
+     Dark mode 
+    --dark-switch-shadow: #fce477;
+    --dark-switch-icon: "🌝";
+    --dark-switch-text: "light mode?";
+}
+@media (prefers-color-scheme: dark) {
+
+    :root {
+         Default mode 
+        --bg-color: #333;
+        --text-color: #fff;
+        --switch-shadow-color: var(--light-switch-shadow);
+        --switch-icon: var(--light-switch-icon);
+        --switch-text: var(--light-switch-text);
+    }
+}
+@media (prefers-color-scheme: light) {
+
+    :root {
+         Default mode 
+        --bg-color: #fff;
+        --text-color: #333;
+        --switch-shadow-color: var(--light-switch-shadow);
+        --switch-icon: var(--light-switch-icon);
+        --switch-text: var(--light-switch-text);
+    }
+}*/
+
+$colors: (
+"primary": $primary,
+"black": $black,
+"white": $white,
+"secundary": $secondry,
+"alert": $firebrick,
+"success": $success,
+"blue": $blue,
+
+);
+
+$displays: (
+"flex",
+"none",
+"block"
+);
+
+$icons: ("eye": "\f112", "start": "\f12e", "stop": "\f12f");
+
+$positions: (
+absolute,
+fixed,
+relative
+);
+
+$aligns: (
+left,right,center
+);
+
+$displays: (
+flex,
+none,
+block
+);
+
+$justify: (
+"content": (
+space-between,
+center
+),
+);
+
+$cursors: (
+alias,
+all-scroll,
+auto,
+cell,
+col-resize,
+context-menu,
+copy,
+crosshair,
+default,
+e-resize,
+ew-resize,
+grab,
+grabbing,
+help,
+move,
+n-resize,
+ne-resize,
+nesw-resize,
+ns-resize,
+nw-resize,
+nwse-resize,
+no-drop,
+none, 
+not-allowed, 
+pointer, 
+progress, 
+row-resize,
+s-resize, 
+se-resize, 
+sw-resize, 
+text, 
+w-resize, 
+wait, 
+zoom-in, 
+zoom-out
+);
+
--- a/src/Scss/main.scss
+++ b/src/Scss/main.scss
@ -0,0 +1,463 @@
+/*
+Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
+Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/style.scss to edit this template
+*/
+/*
+    Created on : Jan 28, 2024, 4:32:52 PM
+    Author     : Raphael Martin
+*/
+
+@font-face {
+    font-family: "TextMeOne";
+    src: url("/fonts/TextMeOne-Regular.ttf") format("truetype");
+}
+
+@function invert($color, $amount: 100%) {
+    $inverse: change-color($color, $hue: hue($color) + 180);
+    @return mix($inverse, $color, $amount);
+}
+
+@import "_variables.scss";
+@import "Firework.scss";
+@import "Memory.scss";
+
+
+.rounded-top{
+    border-radius: 0.5rem 0.5rem 0 0;
+}
+
+button, .btn {
+    border: none;
+    cursor: pointer;
+    height: 1.2rem;
+    font-family: "TextMeOne", sans-serif;
+    font-weight: bold;
+    font-size: 0.8rem;
+    padding: 0.1rem 0.5rem;
+}
+.btn, select{
+    cursor:pointer;
+}
+
+
+body {
+    --text-color:#fff;
+    --bkg-color: #333;
+    .bg{
+        --text-color:#fff;
+        --bkg-color: #333;
+    }
+    .dark-mode-only{
+        display: block;
+    }
+    .light-mode-only{
+        display: none;
+    }
+    button, .btn{
+        color :#333;
+        background: rgba(#fff, 0.6);
+        border-color: #333;
+    }
+    &.dark-theme {
+        --text-color:#333;
+        --bkg-color: #fff;
+        button, .btn{
+            color :#fff;
+            background: rgba(#333, 0.6);
+            border-color: #fff;
+        }
+        .dark-mode-only{
+            display: none;
+        }
+        .light-mode-only{
+            display: block;
+        }
+        .bg{
+            --text-color:#333;
+            --bkg-color: #fff;
+        }
+    }
+}
+
+@media (prefers-color-scheme: dark) {
+    /* defaults to dark theme */
+
+    body {
+        --text-color:#333;
+        --bkg-color: #fff;
+        .bg{
+            --text-color:#333;
+            --bkg-color: #fff;
+        }
+        .dark-mode-only{
+            display: none;
+        }
+        .light-mode-only{
+            display: block;
+        }
+
+        button, .btn{
+            color :#fff;
+            background: rgba(#333, 0.6);
+            border-color: #fff;
+        }
+        &.light-theme {
+            --text-color:#fff;
+            --bkg-color: #333;
+
+            button, .btn{
+                color :#333;
+                background: rgba(#fff, 0.6);
+                border-color: #333;
+            }
+            .dark-mode-only{
+                display: block;
+            }
+            .light-mode-only{
+                display: none;
+            }
+            .bg{
+                --text-color:#fff;
+                --bkg-color: #333;
+            }
+        }
+
+    }
+}
+.loader {
+    width: 100%;
+    height: 4.8px;
+    display: inline-block;
+    position: relative;
+    overflow: hidden;
+}
+.loader::after {
+    content: '';
+    width: 96px;
+    height: 4.8px;
+    background: $primary;
+    position: absolute;
+    top: 0;
+    left: 0;
+    box-sizing: border-box;
+    animation: hitZak 0.3s ease-in-out infinite alternate;
+}
+
+@keyframes hitZak {
+    0% {
+        left: 0;
+        transform: translateX(-1%);
+    }
+    100% {
+        left: 100%;
+        transform: translateX(-99%);
+    }
+}
+
+
+#main {
+    margin-bottom: 5rem;
+}
+
+body {
+    background: var(--bkg-color);
+    color: var(--text-color);
+    overflow-x: hidden;
+    height: 100%;
+    font-family: "TextMeOne", sans-serif;
+    font-size: 1rem;
+    > div{
+        border-top: solid 1px;
+        border-bottom: solid 1px;
+        border-color: $primary;
+        left: 0;
+        right: 0;
+        margin: auto;
+        text-align: center;
+    }
+    a{
+        color: $primary;
+        text-decoration: none;
+        font-weight: bold;
+    }
+    .bg{
+        background: var(--bkg-color);
+        color: var(--text-color);
+    }
+}
+
+html{
+    font-size: 14px;
+
+}
+@media (min-width: 480px) {
+    html{
+        font-size: 20px;
+    }
+}
+
+.main-btn{
+    margin-top: 1rem;
+    font-size: 1.2rem;
+    
+    height: 1.8rem;
+}
+
+.w-100{
+    width: 100%;
+}
+
+.h-0{
+    height: 0;
+}
+.container, figure, video, img{
+    left:0;
+    right: 0;
+    width: 100%;
+    height: auto;
+    margin-left: auto;
+    margin-right: auto;
+    /*max-width: 890px;*/
+}
+
+.container{
+    max-width: 890px;
+}
+input, select {
+    border: 2px solid $primary;
+    color: $black;
+    box-shadow:
+        inset 0 0 8px  rgba(0,0,0,0.1),
+        0 0 16px rgba(0,0,0,0.1);
+    padding: 5px;
+    background: rgba(255,255,255,0.8);
+    margin: 0 0 5px 0;
+}
+
+.user-select-none {
+
+    -webkit-user-select: none; /* Safari */
+    -ms-user-select: none; /* IE 10 and IE 11 */
+    user-select: none; /* Standard syntax */
+}
+
+.text-wrap{
+    text-wrap: wrap;
+    overflow-wrap: break-word;
+}
+
+.to-top{
+    top: -1.3rem;
+}
+
+.left {
+    left: 0;
+}
+
+.right {
+    right: 0;
+}
+.top {
+    top: 0;
+}
+
+.bottom {
+    bottom: 0;
+}
+
+.overflow-hidden{
+    overflow: hidden;
+}
+
+.success{
+    background-color: $success !important;
+    color: $black;
+}
+
+
+.flex-wrap {
+    flex-wrap: wrap;
+}
+.flex-row {
+    flex-direction: row;
+}
+
+@for $i from 1 through 6 {
+    .h#{$i}, h#{$i} {
+        font-size: 0.275rem*(6 - $i)+1rem;
+    }
+}
+
+
+fieldset{
+    display: flex;
+    align-items: center;
+    input{
+        margin: 0;
+        cursor: pointer;
+    }
+    label{
+        cursor: pointer;
+        padding-left: 2rem;
+        width: 100%;
+        display: box;
+    }
+}
+
+@for $i from 0 through 10 {
+    .m-#{$i} {
+        margin: $i * 0.25rem;
+    }
+    .mb-#{$i} {
+        margin-bottom: $i * 0.25rem;
+    }
+    .mt-#{$i} {
+        margin-top: $i * 0.25rem;
+    }
+    .me-#{$i} {
+        margin-right: $i * 0.25rem;
+    }
+    .ms-#{$i} {
+        margin-left: $i * 0.25rem;
+    }
+
+    .p-#{$i} {
+        padding: $i * 0.25rem;
+    }
+    .pb-#{$i} {
+        padding-bottom: $i * 0.25rem;
+    }
+    .pt-#{$i} {
+        padding-top: $i * 0.25rem;
+    }
+    .pe-#{$i} {
+        padding-right: $i * 0.25rem;
+    }
+    .ps-#{$i} {
+        padding-left: $i * 0.25rem;
+    }
+}
+
+@each $name, $glyph in $icons {
+    .icon-#{$name}:before {
+        display: inline-block;
+        font-family: "Icon Font";
+        content: $glyph;
+    }
+}
+
+@each $name, $color in $colors {
+    .bg-#{$name} {
+        background-color: $color !important;
+    }
+    .text-#{$name} {
+        color: $color !important;
+    }
+    .border-#{$name} {
+        border-color: $color !important;
+    }
+}
+
+@each $name, $modes in $justify {
+    @each $mode in $modes {
+        .justify-#{$name}-#{$mode} {
+            justify-#{$name}: $mode !important;
+        }
+    }
+}
+@each $name in $displays {
+    .d-#{$name} {
+        display: $name !important;
+    }
+}
+@each $name in $cursors {
+    .cursor-#{$name} {
+        cursor: $name !important;
+    }
+}
+@each $name in $positions {
+    .position-#{$name} {
+        position: $name !important;
+    }
+}
+@each $name in $aligns {
+    .text-#{$name} {
+        text-align: $name !important;
+    }
+}
+
+@media all and (display-mode: standalone) {
+    .inapp-hidden{
+        display: none !important;
+    }
+}
+
+
+@media not all and (display-mode: standalone) {
+    .browser-hidden{
+        display: none !important;
+    }
+}
+
+
+
+
+
+
+
+
+
+.checkmark__circle {
+  stroke-dasharray: 166;
+  stroke-dashoffset: 166;
+  stroke-width: 2;
+  stroke-miterlimit: 10;
+  stroke: $success;
+  fill: none;
+  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
+}
+
+.checkmark {
+  bottom: 150px;
+  left: 0;
+  right: 0;
+  
+  position: fixed;
+  margin: auto;
+  width: 56px;
+  height: 56px;
+  border-radius: 50%;
+  display: block;
+  stroke-width: 2;
+  stroke: $white;
+  stroke-miterlimit: 10;
+  margin: 10% auto;
+  box-shadow: inset 0px 0px 0px $success;
+  animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
+}
+
+.checkmark__check {
+  transform-origin: 50% 50%;
+  stroke-dasharray: 48;
+  stroke-dashoffset: 48;
+  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
+}
+
+@keyframes stroke {
+  100% {
+    stroke-dashoffset: 0;
+  }
+}
+@keyframes scale {
+  0%, 100% {
+    transform: none;
+  }
+  50% {
+    transform: scale3d(1.1, 1.1, 1);
+  }
+}
+@keyframes fill {
+  100% {
+    box-shadow: inset 0px 0px 0px 30px #7ac142;
+  }
+}
--- a/src/config/EMOJI_LICENCE.md
+++ b/src/config/EMOJI_LICENCE.md
@ -0,0 +1,25 @@
+
+https://github.com/github/gemoji/blob/master/LICENSE
+
+Copyright (c) 2019 GitHub, Inc.
+
+Permission is hereby granted, free of charge, to any person
+obtaining a copy of this software and associated documentation
+files (the "Software"), to deal in the Software without
+restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the
+Software is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.
--- a/src/config/emoji-categories.json
+++ b/src/config/emoji-categories.json
--- a/src/config/emoji-categories.min.json
+++ b/src/config/emoji-categories.min.json
--- a/src/config/emojis.json
+++ b/src/config/emojis.json
--- a/src/config/emojis.min.json
+++ b/src/config/emojis.min.json
--- a/src/config/images.json
+++ b/src/config/images.json
@ -0,0 +1,10 @@
+[
+    "https://travel.altogether.at/fileadmin/_processed_/f/e/csm_20220522_075119_f7f59f1947.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/c/4/csm_20220522_085437_6878ca9c79.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/a/e/csm_283250228_686175499137323_4942479361100056197_n_0f723df57f.jpg",
+    "https://travel.altogether.at/fileadmin/travel_blog/RaMa/AuthorSeite/282494555_2983554695217426_1326172026026569453_n.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/7/a/csm_285725297_181441544337054_6388859613749282169_n_1a54978bd2.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/9/6/csm_20220521_143042_e08fe4a244.jpg",
+    "https://travel.altogether.at//fileadmin/_processed_/8/f/csm_Hermanus6_362e5b53cf.jpg",
+    "https://travel.altogether.at/fileadmin/_processed_/4/c/csm_Hermanus-2_c1aa521e7d.jpg"
+]
--- a/src/favicon/android-chrome-192x192.png
+++ b/src/favicon/android-chrome-192x192.png
--- a/src/favicon/android-chrome-512x512.png
+++ b/src/favicon/android-chrome-512x512.png
--- a/src/favicon/apple-touch-icon.png
+++ b/src/favicon/apple-touch-icon.png
--- a/src/favicon/browserconfig.xml
+++ b/src/favicon/browserconfig.xml
@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square70x70logo src="/mstile-70x70.png"/>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <square310x310logo src="/mstile-310x310.png"/>
+            <wide310x150logo src="/mstile-310x150.png"/>
+            <TileColor>#ffffff</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>
--- a/src/favicon/favicon-16x16.png
+++ b/src/favicon/favicon-16x16.png
--- a/src/favicon/favicon-32x32.png
+++ b/src/favicon/favicon-32x32.png
--- a/src/favicon/favicon.ico
+++ b/src/favicon/favicon.ico
--- a/src/favicon/favicon_package_v0.16(1).zip
+++ b/src/favicon/favicon_package_v0.16(1).zip
--- a/src/favicon/maskable/maskable_icon.png
+++ b/src/favicon/maskable/maskable_icon.png
--- a/src/favicon/maskable/maskable_icon_x128.png
+++ b/src/favicon/maskable/maskable_icon_x128.png
--- a/src/favicon/maskable/maskable_icon_x192.png
+++ b/src/favicon/maskable/maskable_icon_x192.png
--- a/src/favicon/maskable/maskable_icon_x384.png
+++ b/src/favicon/maskable/maskable_icon_x384.png
--- a/src/favicon/maskable/maskable_icon_x48.png
+++ b/src/favicon/maskable/maskable_icon_x48.png
--- a/src/favicon/maskable/maskable_icon_x512.png
+++ b/src/favicon/maskable/maskable_icon_x512.png
--- a/src/favicon/maskable/maskable_icon_x72.png
+++ b/src/favicon/maskable/maskable_icon_x72.png
--- a/src/favicon/maskable/maskable_icon_x96.png
+++ b/src/favicon/maskable/maskable_icon_x96.png
--- a/src/favicon/mstile-150x150.png
+++ b/src/favicon/mstile-150x150.png
--- a/src/favicon/mstile-310x150.png
+++ b/src/favicon/mstile-310x150.png
--- a/src/favicon/mstile-310x310.png
+++ b/src/favicon/mstile-310x310.png
--- a/src/favicon/mstile-70x70.png
+++ b/src/favicon/mstile-70x70.png
--- a/src/favicon/safari-pinned-tab.svg
+++ b/src/favicon/safari-pinned-tab.svg
@ -0,0 +1,135 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="1370.000000pt" height="1370.000000pt" viewBox="0 0 1370.000000 1370.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,1370.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M7300 12428 c-77 -48 -130 -135 -130 -212 0 -75 49 -155 125 -204 54
+-34 170 -37 228 -5 85 47 120 109 121 213 0 92 -24 139 -97 193 -48 36 -53 37
+-131 37 -66 0 -88 -4 -116 -22z"/>
+<path d="M5799 11887 c-57 -35 -71 -49 -95 -102 -55 -117 -13 -249 99 -313 30
+-17 54 -22 116 -22 68 0 82 3 124 30 26 16 59 50 77 77 26 42 30 57 30 122 0
+58 -5 81 -22 110 -56 94 -105 121 -215 120 -61 -1 -86 -6 -114 -22z"/>
+<path d="M8051 11513 c-13 -3 -40 -15 -60 -27 -20 -13 -121 -64 -226 -115
+-198 -97 -218 -106 -300 -141 -27 -12 -63 -27 -80 -35 -44 -20 -209 -85 -217
+-85 -4 0 -19 -5 -35 -12 -44 -18 -215 -78 -248 -88 -16 -4 -43 -13 -60 -19
+-60 -21 -131 -43 -165 -51 -19 -4 -48 -13 -65 -19 -16 -5 -70 -20 -120 -31
+-49 -12 -112 -28 -140 -35 -27 -8 -86 -22 -130 -30 -44 -9 -109 -23 -145 -31
+-36 -7 -101 -18 -145 -23 -137 -17 -184 -45 -198 -120 -20 -99 209 -365 419
+-490 l74 -43 2 -102 c3 -236 6 -289 16 -295 6 -3 32 -38 58 -76 49 -73 127
+-156 179 -190 46 -30 118 -64 136 -65 9 0 34 -7 55 -16 53 -22 357 -15 424 10
+123 47 238 135 302 231 15 22 42 60 59 85 l33 45 -3 181 -2 181 33 25 c18 13
+41 28 52 31 57 22 203 133 296 226 143 144 240 292 299 461 48 137 63 224 63
+390 1 134 -2 172 -15 197 -29 55 -90 87 -146 76z"/>
+<path d="M4660 6855 l0 -2195 2190 0 2190 0 0 2195 0 2195 -2190 0 -2190 0 0
+-2195z"/>
+<path d="M2180 8860 c-11 -7 2 -10 43 -10 36 0 56 4 52 10 -8 13 -75 13 -95 0z"/>
+<path d="M1257 7963 c-94 -51 -121 -114 -121 -283 0 -142 10 -180 68 -247 73
+-85 188 -107 298 -59 54 24 118 84 118 110 0 8 7 27 15 42 20 38 21 218 1 255
+-7 14 -16 37 -19 50 -9 36 -83 116 -128 139 -58 30 -169 26 -232 -7z"/>
+<path d="M3229 7947 c-50 -31 -85 -71 -116 -136 -25 -49 -28 -68 -28 -152 0
+-55 5 -102 11 -110 6 -8 14 -25 17 -39 9 -37 81 -115 127 -139 31 -16 59 -21
+121 -21 88 0 112 10 166 69 136 146 108 432 -52 526 -37 21 -55 25 -127 25
+-68 -1 -89 -5 -119 -23z"/>
+<path d="M11800 7938 c-77 -48 -130 -135 -130 -212 0 -75 49 -155 125 -204 54
+-34 170 -37 228 -5 85 47 120 109 121 213 0 92 -24 139 -97 193 -48 36 -53 37
+-131 37 -66 0 -88 -4 -116 -22z"/>
+<path d="M10299 7397 c-57 -35 -71 -49 -95 -102 -55 -117 -13 -249 99 -313 30
+-17 54 -22 116 -22 68 0 82 3 124 30 26 16 59 50 77 77 26 42 30 57 30 122 0
+58 -5 81 -22 110 -56 94 -105 121 -215 120 -61 -1 -86 -6 -114 -22z"/>
+<path d="M2733 7163 c-12 -2 -34 -18 -49 -36 -23 -27 -26 -38 -22 -87 3 -43
+10 -61 32 -85 24 -26 34 -29 87 -30 54 0 61 3 84 30 47 57 40 129 -18 183 -23
+21 -76 33 -114 25z"/>
+<path d="M1840 7120 c-36 -36 -40 -45 -40 -88 0 -42 5 -54 35 -85 40 -41 70
+-46 126 -23 44 19 69 62 69 121 0 42 -5 52 -36 81 -52 50 -100 48 -154 -6z"/>
+<path d="M12551 7023 c-13 -3 -40 -15 -60 -27 -20 -13 -121 -64 -226 -115
+-198 -97 -218 -106 -300 -141 -27 -12 -63 -27 -80 -35 -44 -20 -209 -85 -217
+-85 -4 0 -19 -5 -35 -12 -44 -18 -215 -78 -248 -88 -16 -4 -43 -13 -60 -19
+-60 -21 -131 -43 -165 -51 -19 -4 -48 -13 -65 -19 -16 -5 -70 -20 -120 -31
+-49 -12 -112 -28 -140 -35 -27 -8 -86 -22 -130 -30 -44 -9 -109 -23 -145 -31
+-36 -7 -101 -18 -145 -23 -137 -17 -184 -45 -198 -120 -20 -99 209 -365 419
+-490 l74 -43 2 -102 c3 -236 6 -289 16 -295 6 -3 32 -38 58 -76 49 -73 127
+-156 179 -190 46 -30 118 -64 136 -65 9 0 34 -7 55 -16 53 -22 357 -15 424 10
+123 47 238 135 302 231 15 22 42 60 59 85 l33 45 -3 181 -2 181 33 25 c18 13
+41 28 52 31 57 22 203 133 296 226 143 144 240 292 299 461 48 137 63 224 63
+390 1 134 -2 172 -15 197 -29 55 -90 87 -146 76z"/>
+<path d="M3349 6719 c-67 -33 -163 -74 -211 -90 -49 -16 -96 -33 -106 -38 -63
+-31 -188 -60 -407 -93 -110 -16 -420 -17 -495 -1 -30 7 -93 16 -140 22 -173
+20 -385 62 -403 80 -6 6 -19 11 -28 11 -33 0 -146 42 -245 90 -82 41 -111 50
+-154 50 -44 0 -56 -4 -81 -29 -31 -32 -35 -54 -18 -115 13 -46 75 -140 118
+-179 135 -119 394 -247 596 -294 259 -59 331 -66 648 -60 234 4 297 9 372 26
+124 28 175 42 212 57 17 8 38 14 46 14 40 0 269 118 368 189 23 17 47 31 54
+31 6 0 42 31 81 68 103 102 135 182 99 252 -26 50 -61 70 -125 70 -50 0 -73
+-8 -181 -61z"/>
+<path d="M140 2360 l0 -2200 2200 0 2200 0 0 2200 0 2200 -2200 0 -2200 0 0
+-2200z m2410 1869 c25 -5 77 -13 115 -18 82 -9 206 -37 253 -57 18 -8 41 -14
+52 -14 11 0 34 -6 52 -14 18 -8 58 -24 88 -36 224 -90 454 -243 611 -406 115
+-121 186 -224 270 -394 78 -159 79 -160 79 -178 0 -9 7 -30 15 -46 8 -16 18
+-47 21 -70 4 -22 11 -50 17 -60 5 -11 13 -45 17 -75 5 -31 14 -76 21 -101 8
+-30 12 -136 12 -320 0 -226 -3 -286 -16 -336 -10 -34 -17 -77 -17 -95 -1 -19
+-7 -45 -15 -59 -8 -14 -14 -36 -15 -50 0 -14 -7 -38 -15 -54 -8 -16 -18 -46
+-21 -67 -4 -21 -13 -44 -20 -50 -8 -6 -14 -22 -14 -34 0 -12 -7 -28 -15 -35
+-8 -7 -15 -20 -15 -29 0 -9 -4 -21 -9 -26 -5 -6 -24 -37 -42 -70 -18 -33 -43
+-74 -56 -91 -13 -17 -23 -35 -23 -40 0 -5 -16 -27 -35 -48 -19 -22 -35 -43
+-35 -47 0 -11 -219 -227 -250 -247 -20 -14 -100 -69 -155 -109 -27 -20 -72
+-45 -97 -54 -16 -6 -28 -15 -28 -19 0 -5 -13 -11 -29 -15 -16 -3 -35 -13 -42
+-21 -6 -8 -22 -14 -36 -14 -13 0 -26 -7 -29 -15 -4 -8 -17 -15 -31 -15 -14 0
+-37 -6 -51 -14 -15 -8 -54 -22 -87 -31 -33 -9 -76 -23 -95 -30 -32 -12 -59
+-17 -220 -45 -155 -27 -387 -44 -414 -32 -12 6 -82 15 -156 22 -74 6 -157 18
+-184 26 -27 8 -64 14 -82 14 -18 0 -35 4 -39 9 -3 5 -20 12 -38 16 -48 10
+-129 36 -159 51 -14 8 -37 14 -51 14 -14 0 -27 7 -31 15 -3 8 -16 15 -29 15
+-14 0 -30 6 -36 14 -7 8 -26 18 -42 21 -16 4 -31 10 -34 15 -3 4 -28 20 -56
+35 -28 14 -56 31 -63 36 -10 9 -110 76 -154 104 -44 28 -265 261 -322 340 -57
+80 -143 235 -177 320 -25 64 -45 121 -52 155 -4 19 -13 51 -19 70 -14 44 -30
+133 -42 225 -11 90 -11 483 1 555 32 203 48 268 96 393 50 132 133 297 176
+352 4 6 31 42 59 80 161 217 438 424 723 540 126 51 392 125 455 125 19 1 62
+7 95 14 72 17 398 20 465 5z"/>
+<path d="M2843 3306 c-15 -33 -15 -35 6 -65 12 -17 29 -31 37 -31 38 0 204
+-95 279 -160 50 -43 155 -165 155 -180 0 -14 59 -32 85 -26 30 8 45 40 38 82
+-9 47 -109 189 -179 252 -94 87 -260 162 -356 162 -45 0 -49 -2 -65 -34z"/>
+<path d="M1686 3222 c-81 -78 -142 -127 -177 -142 -13 -5 -31 -14 -39 -19 -28
+-17 -118 -51 -177 -66 -70 -18 -97 -46 -89 -90 12 -61 65 -69 207 -34 138 35
+261 107 352 208 83 92 107 160 69 194 -37 33 -69 22 -146 -51z"/>
+<path d="M2735 2969 c-129 -66 -194 -236 -149 -389 49 -164 190 -245 336 -192
+120 44 186 166 176 326 -8 122 -58 205 -153 255 -54 29 -155 29 -210 0z"/>
+<path d="M1650 2825 c-74 -36 -146 -70 -159 -77 -99 -52 -84 -200 30 -302 133
+-120 345 -62 411 111 13 36 18 76 18 155 l0 107 -34 35 c-53 56 -97 51 -266
+-29z"/>
+<path d="M1225 1962 c-16 -2 -34 -7 -40 -12 -5 -4 -25 -11 -42 -15 -18 -3 -33
+-10 -33 -14 0 -4 -11 -13 -24 -20 -26 -14 -46 -50 -46 -82 0 -53 66 -98 117
+-78 33 12 53 5 53 -18 1 -26 35 -122 49 -136 6 -6 11 -16 11 -22 0 -23 96
+-111 145 -134 133 -63 300 -41 411 53 63 53 122 76 194 76 88 0 151 -20 335
+-109 189 -92 216 -103 314 -132 160 -47 377 3 521 120 57 46 118 111 126 134
+3 9 9 17 12 17 4 0 16 16 26 35 11 19 23 35 28 35 5 0 21 -13 35 -30 36 -44
+83 -42 119 5 26 35 26 35 9 77 -51 130 -254 235 -354 183 -31 -15 -41 -33 -41
+-69 0 -27 42 -76 65 -76 19 0 19 -9 -2 -51 -29 -59 -132 -151 -218 -194 l-79
+-40 -116 1 c-130 1 -111 -5 -385 129 -201 99 -241 110 -390 109 -101 0 -128
+-3 -173 -22 -52 -22 -96 -49 -136 -85 -12 -10 -45 -25 -75 -34 -99 -28 -197
+12 -241 100 -14 28 -20 57 -18 82 3 40 3 40 51 45 67 8 82 29 78 107 -2 39
+-55 61 -161 65 -52 1 -108 1 -125 0z"/>
+<path d="M4660 2355 l0 -2195 2190 0 2190 0 0 2195 0 2195 -2190 0 -2190 0 0
+-2195z"/>
+<path d="M11800 3408 c-77 -48 -130 -135 -130 -212 0 -75 49 -155 125 -204 54
+-34 170 -37 228 -5 85 47 120 109 121 213 0 92 -24 139 -97 193 -48 36 -53 37
+-131 37 -66 0 -88 -4 -116 -22z"/>
+<path d="M10299 2867 c-57 -35 -71 -49 -95 -102 -55 -117 -13 -249 99 -313 30
+-17 54 -22 116 -22 68 0 82 3 124 30 26 16 59 50 77 77 26 42 30 57 30 122 0
+58 -5 81 -22 110 -56 94 -105 121 -215 120 -61 -1 -86 -6 -114 -22z"/>
+<path d="M12551 2493 c-13 -3 -40 -15 -60 -27 -20 -13 -121 -64 -226 -115
+-198 -97 -218 -106 -300 -141 -27 -12 -63 -27 -80 -35 -44 -20 -209 -85 -217
+-85 -4 0 -19 -5 -35 -12 -44 -18 -215 -78 -248 -88 -16 -4 -43 -13 -60 -19
+-60 -21 -131 -43 -165 -51 -19 -4 -48 -13 -65 -19 -16 -5 -70 -20 -120 -31
+-49 -12 -112 -28 -140 -35 -27 -8 -86 -22 -130 -30 -44 -9 -109 -23 -145 -31
+-36 -7 -101 -18 -145 -23 -137 -17 -184 -45 -198 -120 -20 -99 209 -365 419
+-490 l74 -43 2 -102 c3 -236 6 -289 16 -295 6 -3 32 -38 58 -76 49 -73 127
+-156 179 -190 46 -30 118 -64 136 -65 9 0 34 -7 55 -16 53 -22 357 -15 424 10
+123 47 238 135 302 231 15 22 42 60 59 85 l33 45 -3 181 -2 181 33 25 c18 13
+41 28 52 31 57 22 203 133 296 226 143 144 240 292 299 461 48 137 63 224 63
+390 1 134 -2 172 -15 197 -29 55 -90 87 -146 76z"/>
+</g>
+</svg>
--- a/src/favicon/site.webmanifest
+++ b/src/favicon/site.webmanifest
@ -0,0 +1,79 @@
+{
+    "name": "RaMemory",
+    "short_name": "RMMM",
+    "description": "Raphy's Memory Matrix Madness is a captivating and colorful memory matching game that can be played offline. Test your memory skills, customize the gameplay, and enjoy a vibrant celebration of success with this small but mighty JavaScript and CSS powered game.",
+    "icons": [
+        {
+            "src": "/favicon/android-chrome-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/favicon/android-chrome-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon.png",
+            "sizes": "1024x1024",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x512.png",
+            "sizes": "512x512",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x384.png",
+            "sizes": "384x384",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x192.png",
+            "sizes": "192x192",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x128.png",
+            "sizes": "128x128",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/Memory/favicon/maskable/maskable_icon_x96.png",
+            "sizes": "96x96",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x72.png",
+            "sizes": "72x72",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "/favicon/maskable/maskable_icon_x48.png",
+            "sizes": "48x48",
+            "type": "image/png",
+            "purpose": "maskable"
+        }
+    ],
+    "screenshots" : [
+        {
+          "src": "/media/light_emoji_1280x720.webp",
+          "sizes": "1280x720",
+          "type": "image/webp",
+          "form_factor": "wide",
+          "label": "RaMemory MM gameplay black images"
+        }
+      ],
+    "theme_color": "#ffffff",
+    "scope": "/",
+    "background_color": "#ffffff",
+    "start_url": "https://ramemory.altogether.at",
+    "display": "standalone"
+}
--- a/src/fonts/TextMeOne-Regular.ttf
+++ b/src/fonts/TextMeOne-Regular.ttf
--- a/src/index.html
+++ b/src/index.html
@ -0,0 +1,474 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>Raphy's Memory Matrix Madness | Sharpen Cognitive Skills Offline</title>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+        <meta http-equiv="x-ua-compatible" content="IE=edge" />
+
+        <meta name="keywords" content="HTML, SCSS, JavaScript,Memory game,Online game,JS+CSS game,Memory challenge,Interactive game,Keyboard navigation,Memory skill test,Card matching,Fun game">
+        <meta name="author" content="Raphael Martin">  
+        <meta name="description" content="Experience the thrill of memory improvement with RaMemory MM! Customize card numbers, styles, and speeds for a personalized memory challenge. Play offline and develop your cognitive prowess with each fun-filled match." />
+        <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
+        <meta name="robots" content="index,follow" />
+
+        <meta property="og:title" content="Raphy's Memory Matrix Madness - Train Your Brain Anywhere, Anytime" />
+        <meta property="og:description" content="Join the adventure with Raphy's Memory Matrix Madness! A progressive web app offering offline fun and cognitive skill enhancement. Tackle memory puzzles at varying difficulties, track your progress, and master memory!" />
+        <meta property="og:image" content="./media/og.png" />
+        <meta property="og:image:url" content="./media/og.png" />
+        <meta property="og:image:width" content="1524" />
+        <meta property="og:image:height" content="800" />
+        <meta name="twitter:card" content="summary" />
+        <meta name="twitter:title" content="Challenge Your Mind with Raphy's Memory Matrix Madness - No Internet Required!" />
+        <meta name="twitter:description" content="Discover Raphy's Memory Matrix Madness - the offline game that adapts to your cognitive level, offering endless fun while boosting memory and concentration. Customize your play, achieve high scores, and take the memory challenge on the go!" />
+        <meta name="twitter:image" content="./media/og.png" />
+
+        <meta name="apple-mobile-web-app-capable" content="no" />
+        <meta name="google" content="notranslate" />
+
+        <!--        optional you can have a additional  JavaScriptfirework when the player wins ( requires js from the bottom to )-->
+<!--        <link rel="stylesheet" href="Css/Firework.min.css">
+        <link rel="stylesheet" href="Css/main.min.css">-->
+        <link rel="stylesheet" href="css/index.css">
+        <link rel="apple-touch-icon" sizes="180x180" href="favicon/apple-touch-icon.png">
+        <link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png">
+        <link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png">
+        <link rel="manifest" href="favicon/site.webmanifest">
+        <link rel="mask-icon" href="favicon/safari-pinned-tab.svg" color="#f09130">
+        <link rel="shortcut icon" href="favicon/favicon.ico" type="image/vnd.microsoft.icon">
+        <meta name="msapplication-TileColor" content="#f09130">
+        <meta name="msapplication-TileImage" content="favicon/mstile-310x310.png">
+        <meta name="msapplication-config" content="favicon/browserconfig.xml">
+        <meta name="theme-color" content="#333333"/>
+        <meta name="color-scheme" content="dark light">
+    </head>
+    <body>
+        <div>
+            <h1 class="mb-1 user-select-none">RaMemory MM</h1>
+            <p class="m-1 h5 user-select-none"><i>Raphy's Memory Matrix Madness</i></p>
+
+
+
+            <div class="welcome">
+
+                <div class="container ">
+                    <figure class="light-mode-only user-select-none"  width="850" height="195">
+                        <video loading="lazy" title="RaMemory light with colors"  width="850" height="195" loop autoplay muted>
+                            <source src="https://ramemory.altogether.at/media/light_intro.webm" type="video/webm" />
+                            <source src="https://ramemory.altogether.at/images/light_intro.mp4" type="video/mp4" />
+                        </video>
+                    </figure> 
+                    <figure class="dark-mode-only user-select-none"  width="850" height="195">
+                        <video loading="lazy" title="RaMemory dark with colors" width="850" height="195" loop autoplay muted>
+                            <source src="https://ramemory.altogether.at/media/dark_intro.webm" type="video/webm" />
+                            <source src="https://ramemory.altogether.at/images/dark_intro.mp4" type="video/mp4" />
+                        </video>
+                    </figure>
+                    <p class="browser-hidden user-select-none">Welcome back</p>
+
+                    <p class="inapp-hidden">Welcome to RaMemory MM - Raphy&#39;s Memory Matrix Madness — a captivating and colorful journey through the world of memory matching games. Whether you&#39;re looking to pass the time, sharpen your cognitive skills, or simply enjoy a challenge, you&#39;ve discovered the perfect gaming companion that travels with you everywhere, with no internet connection required. Launch into an offline adventure where your memory skills are both your weapon and ally in the whimsical universe of matching pairs.</p>
+
+                </div>
+            </div>
+            <div class="container d-flex flex-row justify-content-space-between">
+                <div>
+                    <button class="btn-install-as-app d-none rounded-top">Install as App</button>
+                </div>
+            </div>
+        </div>
+        <div id="memory-settings" class="pt-2 user-select-none">
+            <div class="d-flex flex-wrap justify-content-center">
+                <div class="ms-2 me-2">
+                    <div class="d-flex flex-wrap justify-content-space-between">
+                        <label class="me-1" for="memory-pair-count">amount duplicates:</label>
+                        <input type="number" id="memory-pair-count" min="2" max="100" value="2"/>
+                    </div>
+                    <div class="d-flex flex-wrap justify-content-space-between">
+                        <label class="me-1" for="memory-pairs">amount same cards:</label>
+                        <input type="number" id="memory-pairs" min="2" max="100" value="9"/>
+                    </div>
+                    <div class="d-flex flex-wrap justify-content-space-between">
+                        <label class="me-1" for="memory-size">card size:</label>
+                        <input type="number" id="memory-size" min="1" max="100" value="14"/>
+                    </div> 
+                </div>
+                <div class="ms-2 me-2">
+                    <div class="d-flex flex-wrap justify-content-space-between">
+                        <label class="me-1" for="speed-select">flip speed:</label>
+                        <select id="speed-select">
+                            <option value="0">😴 sleep mode</option>
+                            <option value="1">🦥 slot</option>
+                            <option value="2">🐌 snail</option>
+                            <option value="3">🚶 chilly</option>
+                            <option value="4">🚆 train</option>
+                            <option value="5">🚀 rocket</option>
+                            <option value="6">🤪 insane</option>
+                        </select>
+                    </div>
+                    <div class="d-flex flex-wrap justify-content-space-between">
+                        <label class="me-1" for="front-style-select">front style:</label>
+                        <select id="front-style-select">
+                            <optgroup label="©️ altogether">
+                                <option value="0">©⬛ black</option>
+                                <option value="1">©⬜️ white</option>
+                                <option value="2">©🟧️ orange</option>
+                                <option value="3">©🟩️ green</option>
+                                <option value="4">©🟦 blue</option>
+                            </optgroup>
+                            <optgroup label="🐸 altogether frog">
+                                <option value="5">🐸⬛ black</option>
+                                <option value="6">🐸⬜️ white</option>
+                                <option value="7">🐸🟧️ orange</option>
+                                <option value="8">🐸🟩️ green</option>
+                                <option value="9">🐸🟦 blue</option>
+                            </optgroup>
+                            <optgroup label="🎨 just colors">
+                                <option value="10">⬛️ black</option>
+                                <option value="11">⬜️ white</option>
+                                <option value="12"> 🟧️orange</option>
+                                <option value="13">🟩️ green</option>
+                                <option value="14">🟦 blue</option>
+                            </optgroup>
+                        </select>
+                    </div>
+                    <div class="d-flex flex-wrap justify-content-space-between">
+                        <label class="me-1" for="back-style-select">back stylet:</label>
+                        <select id="back-style-select">
+                            <option value="9">🎨 colors</option>
+                            <option value="0">📷 pictures</option>
+                            <optgroup label="🔢 numbers">
+                                <option value="8">0️⃣ start with 0</option>
+                                <option value="7">0️⃣ start with 0 + 🎨</option>
+                                <option value="29">0️⃣ random</option>
+                                <option value="28">0️⃣ random + 🎨</option>
+                            </optgroup>
+                            <optgroup label="📝 text">
+                                <option value="4">📝short</option>
+                                <option value="3">📝short + 🎨</option>
+                                <option value="6">📝long</option>
+                                <option value="5">📝long + 🎨</option>
+                            </optgroup>
+                            <optgroup label="emojis">
+                                <option value="2">✴️ all emojis</option>
+                                <option value="1">✴ all emojis + 🎨</option>
+                                <option value="11">😀️ smileys & emotions</option>
+                                <option value="10">😀️ smileys & emotions + 🎨</option>
+                                <option value="13">🧟 people & body</option>
+                                <option value="12">🧟 people & body + 🎨</option>
+                                <option value="15">🐸 animals & nature</option>
+                                <option value="14">🐸 animals & nature + 🎨</option>
+                                <option value="17">🍕 food & drinks</option>
+                                <option value="16">🍕 food & drinks + 🎨</option>
+                                <option value="19">🗺️ travel & place</option>
+                                <option value="18">🗺️ travel & place + 🎨</option>
+                                <option value="21">🎉 activities</option>
+                                <option value="20">🎉 activities + 🎨</option>
+                                <option value="23">💡 objects</option>
+                                <option value="22">💡 objects + 🎨</option>
+                                <option value="25">☀️ symbols</option>
+                                <option value="24">☀️ symbols + 🎨</option>
+                                <option value="27">🏴‍☠️ flags</option>
+                                <option value="26">🏴‍☠️ flags + 🎨</option>
+                            </optgroup>
+                        </select>
+                    </div>
+                </div>
+            </div>
+            <div> 
+                <input id="generate-memory" class="btn main-btn success text-black" type="submit" value="start game ▶️" />
+            </div>
+            <div class="container d-flex flex-row flex-wrap justify-content-space-between">
+                <div>
+                    <button class="btn-howto me-1 rounded-top">❓ How to play</button>
+                    <button class="btn-settings me-1 rounded-top">🔧 Settings</button>
+                </div>
+                <div>
+                    <button class="btn-toggle-theme ms-1 ps-1 pe-1 rounded-top">
+                        <span class="light-mode-only pe-2"><b class="bg-white btn pe-1 ps-1 pt-1">🌚</b> Dark</span>
+                        <span class="dark-mode-only ps-2 pe-0">Light <b class="bg-black btn pe-1 ps-1 pt-1">🌞️</b></span>
+                    </button>
+                </div>
+            </div>
+        </div>
+        <div id="main">
+            <div id="game" class="p-2 m-2 user-select-none">
+                <div id="memory" class="d-none">
+                </div>
+                <span id="memory-loader" class="loader d-none"></span>
+                <div id="won" class="p-6 left right success d-none position-fixed user-select-none">
+                    <div class="h1">
+                        🎉 well done 🎉
+                    </div>
+                </div> 
+            </div>
+            <div id="about" class="container welcome inapp-hidden">
+                <h2>About RaMemory MM</h2>
+
+                <p>This innovative memory training game offers an exciting opportunity to enhance your memory skills like never before. With the ability to customize the amount of duplicate cards and the number of duplicates, you can challenge yourself with not just pairs, but also triplets, quadruplets, and more.
+                <p/>
+                <p>By searching for multiple matches, you can push your memory to its limits, improving your cognitive abilities and concentration. With different front and back designs to choose from, RMMM allows for a rich and varied gaming experience tailored to your preferences.
+                <p/>
+                <p>As you navigate through the game, you'll feel the thrill of uncovering and matching cards, all while strengthening your memory and mental agility. Whether you're seeking a fun and engaging way to train your memory or a new challenge to test your skills, Raphy's Memory Matrix Madness is the perfect choice. Step into the realm of memory mastery and enjoy the benefits of enhanced cognitive function with RMMM!
+                <p/>
+
+                <figure class="dark-mode-only">
+                    <img loading="lazy" src="media/dark_images.png" alt="RaMemory dark with images"/>
+                </figure>  
+
+                <figure class="light-mode-only">
+                    <img  loading="lazy" src="media/light_emoji.png" alt="RaMemory light with emojis"/>
+                </figure> 
+
+                <div class="mb-3">
+                    <h3>Game Highlights</h3>
+                    <p><b>Offline Access:</b> Never miss a moment of fun with our game's offline playability. Make long commutes, waiting rooms, and remote locales the perfect backdrop for a bit of memory-testing fun, no internet required!
+                    </p>
+                    <p><b>Engaging Challenges:</b> Tailor the difficulty to your preference by choosing the amount of duplicates and how many duplicates are shown. From the serene 😴 sleep mode to the electrifying 🤪 insane level, venture through a heart-pumping experience that adapts to your skill level.
+                    </p>
+                    <p><b>Customizable Experience:</b> Make it your game, your way! Choose from a variety of front styles, ranging from sleek ©️ dark to vibrant 🐸 green themes, and select from a diverse range of back styles including 🎨 colors and 😀️ smileys to create a gaming environment that's uniquely yours.
+                    </p>
+                    <p><b>Skill Development:</b> Beyond mere entertainment, our game is a reliable companion on your cognitive development journey, enhancing concentration, memory, and decision-making processes.
+                    </p>
+                </div>
+
+                <figure class="dark-mode-only">
+                    <img loading="lazy" src="media/dark_orange_number.png" alt="RaMemory dark with orange front and number back"/>
+                </figure> 
+                <figure class="dark-mode-only">
+                    <img loading="lazy" src="media/dark_blue_emoji.png" alt="RaMemory dark with blue front and emoji back"/>
+                </figure> 
+                <figure class="light-mode-only">
+                    <img  loading="lazy" src="media/green_string.png" alt="RaMemory light with green front and string back"/>
+                </figure> 
+
+                <h3>General Game Synopsis</h3>
+
+                <p>Raphy's Memory Matrix Madness offers more than just a gaming experience; it's a journey of cognitive enhancement wrapped in layers of joy. Crafted with ingenuity using JavaScript and CSS, the game provides an intuitive and user-friendly interface that welcomes players of all ages to indulge in hours of engaging memory play.
+                </p>
+                <p>From captivating 📷 picture cards to iconic 🏴‍☠️ flags, each round presents a refreshing challenge. Celebrate the achievement of a well-played game and track your progress with our highscore feature. With each tap, you have the opportunity to surpass your previous best, making each game an opportunity to reach new heights of memorization mastery.
+                </p>
+                <p>Whether you're enjoying leisure time at home or seeking entertainment on-the-go, Raphy's Memory Matrix Madness is the ideal pocket-sized partner, always primed to deliver delightful and brain-boosting entertainment.
+                </p>
+                <p>Embark on this memory-matching adventure with Raphy's Memory Matrix Madness, where fun and mental fitness intertwine seamlessly!
+                </p>
+            </div>
+
+            <div id="how-to-play" class="container d-none">
+                <h2>❓ How to play ❓</h2>
+
+                <p>Get ready to dive into the captivating world of memory matching with Raphy's Memory Matrix Madness (RaMemory MM). This exciting and convenient memory training game is designed to be intuitive and user-friendly, offering an engaging experience for players of all ages.
+                </p>
+                <p>
+                    To immerse yourself in the game, follow these simple steps:
+                </p>
+                <p>
+                    <b>Navigate and Select:</b> Use the keyboard to navigate through the grid of selectable cards. Press "Tab" to move to the next card and "Shift + Tab" to move to the previous card.
+                </p>
+                <p>
+                    <b>Match the Cards:</b> Once you've selected a card, click or press "Enter" to flip it and reveal its hidden side. Remember the position and design as you uncover the cards.
+                </p>
+                <p>
+                    <b>Uncover Duplicates:</b> Your goal is to uncover duplicate cards, including pairs, triplets, quadruplets, and beyond, depending on your chosen settings.
+                </p>
+                <p>
+                    <b>Customize Your Experience:</b> Before you start your game, you can choose the amount of duplicate cards, the card size, flip speed, and various front and back designs to personalize your gaming environment.
+                </p>
+                <p>
+                    <b>Challenge Yourself:</b> Adapt the level of difficulty by selecting the amount of duplicate cards and their frequency. Push your memory to its limits and enjoy the thrill of matching while enhancing your cognitive abilities.
+                </p>
+                <p>
+                    <b>Offline Enjoyment:</b> RaMemory MM is an installable progressive web app (PWA) that works seamlessly in offline mode, allowing you to enjoy uninterrupted memory training fun wherever you go.
+                </p>
+                <p>
+                    Embark on this memory-matching adventure, and get ready to uncover the full potential of your memory skills with RaMemory MM. Enjoy a delightful and brain-boosting gaming experience tailored to your preferences!
+                </p>
+            </div>
+
+            <div id="gdpr" class="container d-none">
+                <h2>GDPR Compliance Statement</h2>
+
+
+                <p>Our website is dedicated to adhering to the General Data Protection Regulation (GDPR) to safeguard the privacy and security of our users' data. In this regard, we provide the following information regarding cookies and service workers utilized on our site:
+                </p>
+                <p><b>Cookies:</b></p>
+
+                <p>Our website employs cookies to enhance functionality and provide an efficient user experience. However, it is important to note that cookies are only utilized if explicitly activated within the settings using your pre-game preferences. Without explicit activation, cookies will not be used.
+                </p>
+                <p><b>Service Worker:</b></p>
+                <p>
+                    We utilize service worker technology solely for offline functionality, allowing users to enjoy uninterrupted memory training fun regardless of their internet connection.
+                </p>
+                <p><b>Data Security:</b></p>
+                <p>
+                    We want to emphasize that we do not store any personal data of our users, ensuring the privacy and security of all user data.
+                    Additionally, our site is free to use and consume, and we are committed to GDPR compliance to ensure the protection of our users' privacy and security.
+                    If you have any inquiries or require more information about our GDPR compliance and data privacy, please feel free to contact us at <a href="mailto:rama@altogether.at" title="rama@altogether.at">rama@altogether.at</a>.
+                </p>
+                <p>
+                    We are committed to maintaining GDPR compliance and ensuring the protection of our users' privacy and security.
+                </p>
+                <p>
+                    Kindly note that the information provided is based on the details available for this site. If there are specific requirements or additional details, we recommend reaching out to the provided contact for precise information.
+                </p>            
+            </div>
+
+            <div id="imprint" class="container d-none">
+                <h2>Imprint</h2>
+
+                <li><b>Name:</b> Raphael Martin</li>
+                <li><b>E-Mail:</b> <a href="mailto:rama@altogether.at" title="rama@altogether.at">rama@altogether.at</a></li>
+                <p>All images on this site, are created by Raphael Martin. The rights to these pictures are wholly owned by Raphael Martin.
+                </p>
+                <p>The font used on this site is "Text Me One" under the Open Font License. More information about the license can be found on the <a href="https://fonts.google.com/specimen/Text+Me+One/about" title="Google Fonts website">Google Fonts website</a>.
+
+                </p>
+
+                <p><b>Disclaimer</b></p>
+                <p>
+                    We do not take responsibility for the content from external links. Any external links provided on this website are solely for informational purposes. We do not exercise any control over the content on these external links and, therefore, we do not take responsibility for such content. It is advisable to use discretion and assess the content of external links for your own protection.
+                </p>
+            </div>
+            <div id="settings" class="container d-none user-select-none ">
+                <h2>🔧 Settings 🔧</h2> 
+
+                <div class="text-left">
+                    <h3 class="h4 text-center">predefined start settings</h3>
+                    <p class="text-center">if you close RaMemory MM it will use the defined settings</p>
+
+                    <fieldset>
+                        <input name="settings-start-value" type="radio" id="settings-start-value-0" value="0" checked>
+                        <label for="settings-start-value-0" > use RaMemory defaults</label>
+                    </fieldset>
+
+                    <fieldset>
+                        <input name="settings-start-value" type="radio" id="settings-start-value-1" value="1">
+                        <label for="settings-start-value-1"> use the settings at the moment from above as default</label> 
+                    </fieldset>
+
+                    <fieldset>
+                        <input name="settings-start-value" type="radio" id="settings-start-value-2" value="2">
+                        <label for="settings-start-value-2"> use your last selected values as default</label>
+                    </fieldset>              
+
+                    <h3 class="h4 text-center">save data for the next login</h3>
+                    <fieldset>
+                        <input type="checkbox" id="settings-save-highscore"/>
+                        <label for="settings-save-highscore">save my highscore</label>
+                    </fieldset>    
+
+                    <p class="text-center">to save your data and initial configuraton RaMemory will use Cookies.</p> 
+                    <fieldset>
+                        <input type="checkbox" id="settings-use-cookies"/>
+                        <label for="settings-use-cookies">* I allow RaMemory to use the Cookies to save the above selected options.</label>
+                    </fieldset>
+                    <small>more informations about cookies you can find in the <a class="btn-gdpr" title="gdpr" href="#gdpr">gdpr page</a></small>
+
+                    <div class="mb-2 mt-2 d-flex justify-content-center"> 
+                        <input id="clear-settings" class="btn main-btn bg-alert text-white ms-1 me-1" type="button" value="🗑️ reset" />
+                        <input id="save-settings" class="btn main-btn success text-black ms-1 me-1" type="submit" value="💾 save️" />
+                    </div>
+                    <svg id="settings-saved" class="checkmark d-none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">
+                    <circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none"/>
+                    <path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/>
+                    </svg>
+                </div>
+
+            </div>
+
+        </div>
+        <div class="p-2 ps-2 pe-2 bg position-fixed bottom user-select-none">
+            <div class="left h-0 right ps-2 pe-2 d-flex flex-row position-absolute top justify-content-space-between">
+                <div class="to-top position-relative">
+                    <button class="btn-gdpr me-1 rounded-top">GDPR</button>
+                    <button class="btn-imprint rounded-top">IMPRINT</button>
+                </div>
+                <div>
+                    <a title="git.altogether.at" target="_blank" class="ms-2 btn btn-git to-top position-relative rounded-top" href="https://git.altogether.at">git</a>
+                </div>
+            </div>
+            <div class="d-flex justify-content-space-between user-select-none">
+                <div class="align-left">
+                    <div id="tries-counter-wrap" class="d-none">
+                        tries this round <span id="tries-counter">0</span> 
+                    </div>
+                    <div>
+                        your highscore <span id="highscore-pairs">0</span>x<span id="highscore-pairs-count">0</span>pairs <span id="highscore-count">0</span> moves
+                    </div>
+                </div>
+                <div>
+                    <a href="https://www.altogether.at" target="_blank" title="altogether.at">altogether.at</a>
+                </div>
+            </div>
+        </div>
+
+        <!--        optional you can have a additional  firework when the player wins ( requires css above to )-->
+<!--
+        <script type="text/javascript" src="JavaScript/Css.min.js"></script>
+        <script type="text/javascript" src="JavaScript/PWA.min.js"></script>
+        <script type="text/javascript" src="JavaScript/Firework.js"></script>
+        <script type="text/javascript" src="JavaScript/Memory.min.js"></script>
+        <script type="text/javascript" src="JavaScript/main.min.js"></script>-->
+<script type="text/javascript" src="js/index.js"></script>
+
+        <script type="application/ld+json">
+            [
+            {
+            "@context": "http://schema.org",
+            "@type": "WebPage",
+            "name": "Raphy's Memory Matrix Madness",
+            "url": "https://www.example.com/memory-game",
+            "description": "",
+            "breadcrumb": {
+            "@type": "BreadcrumbList",
+            "itemListElement": [
+            {
+            "@type": "ListItem",
+            "position": 1,
+            "name": "Raphy's Memory Matrix Madness",
+            "item": "https://www.example.com"
+            }
+            ]
+            },"author": {
+            "@type": "Person",
+            "name": "Raphael Martin",
+            "url": "https://www.altogether.at"
+            }
+            },
+            {
+            "@context": "http://schema.org",
+            "@type": "VideoGame",
+            "name": "Raphy's Memory Matrix Madness",
+            "url": "https://www.example.com/memory-game",
+            "description": "Test your memory with this classic single-player game.",
+            "gamePlatform": {
+            "@type": "GamePlatform",
+            "name": "Web"
+            },
+            "applicationCategory": "Game",
+            "playMode": "SinglePlayer",
+            "author": {
+            "@type": "Person",
+            "name": "Raphael Martin",
+            "url": "https://www.altogether.at"
+            }
+            },
+            {
+            "@context": "http://schema.org",
+            "@type": "WebApplication",
+            "name": "Raphy's Memory Matrix Madness",
+            "url": "https://www.example.com/memory-game-pwa",
+            "description": "Experience the memory game as a Progressive Web App for quick access and offline play.",
+            "applicationCategory": "Game",
+            "operatingSystem": "Cross-platform",
+            "browserRequirements": "HTML5, JavaScript",
+            "author": {
+            "@type": "Person",
+            "name": "Raphael Martin",
+            "url": "https://www.altogether.at"
+            }
+            }
+            ]
+        </script>
+    </body>
+</html>
--- a/src/robots.txt
+++ b/src/robots.txt
@ -0,0 +1,6 @@
+User-Agent: *
+
+Allow: /  
+Disallow:                                  
+
+Sitemap: https://blog.altogether.at/sitemap.xml
--- a/src/sitemap.xml
+++ b/src/sitemap.xml
@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+    <url>
+        <loc>https://games.altogether.at/ramemory</loc>
+        <lastmod>2024-02-05T11:49:36+01:00</lastmod>
+        <priority>1.0</priority>
+    </url>
+</urlset>
--- a/src/sw.js
+++ b/src/sw.js
@ -0,0 +1,97 @@
+const swName = "RaMemoryMM";
+
+const addResourcesToCache = async function (resources) {
+    const cache = await caches.open(swName);
+    await cache.addAll(resources);
+};
+
+const putInCache = async function (request, response) {
+    const cache = await caches.open(swName);
+    await cache.put(request, response);
+};
+
+const enableNavigationPreload = async function () {
+    if (self.registration.navigationPreload) {
+        // Enable navigation preloads!
+        await self.registration.navigationPreload.enable();
+    }
+};
+
+self.addEventListener('activate', function (event) {
+    event.waitUntil(enableNavigationPreload());
+});
+
+self.addEventListener('install', function (event) {
+    event.waitUntil(
+            addResourcesToCache([
+                './index.html',
+                './JavaScript/Css.min.js',
+                './JavaScript/PWA.min.js',
+                './JavaScript/Firework.min.js',
+                './JavaScript/Memory.min.js',
+                './JavaScript/main.min.js',
+                './Css/Firework.min.css',
+                './Css/main.min.css',
+                './fonts/TextMeOne-Regular.ttf',
+                './config/emoji-categories.min.json',
+                './config/emojis.min.json',
+                './config/images.json',
+                './media/frog512x512.png',
+                './media/altogether-logo.png',
+                './media/altogether-logo-inverted.png',
+                './media/dark_intro.webm',
+                './media/light_intro.webm',
+                './media/dark_intro.mp4',
+                './media/light_intro.mp4',
+                './media/light_emoji.png',
+                './favicon/site.webmanifest',
+                './media/green_string.png',
+                './favicon/favicon.ico',
+                './favicon/favicon-32x32.png',
+                './favicon/favicon-16x16.png',
+                './favicon/android-chrome-192x192.png',
+                './favicon/android-chrome-512x512.png',
+                './favicon/maskable/maskable_icon.png',
+                './favicon/maskable/maskable_icon_x48.png',
+                './favicon/maskable/maskable_icon_x72.png',
+                './favicon/maskable/maskable_icon_x96.png',
+                './favicon/maskable/maskable_icon_x128.png',
+                './favicon/maskable/maskable_icon_x192.png',
+                './favicon/maskable/maskable_icon_x384.png',
+                './favicon/maskable/maskable_icon_x512.png'
+            ])
+            );
+});
+
+
+self.addEventListener('fetch', function (evt) {
+
+    if (!(evt.request.url.indexOf('http') === 0)) {
+        return;
+    }
+    evt.respondWith(
+            caches
+            .match(evt.request)
+            .then(function (cacheRes) {
+                return cacheRes || fetch(evt.request).then(function (fetchRes) {
+                    cache.open(swName).then(function (cache) {
+                        cache.put(evt.request.url, fetchRes.clone());
+                        limitCacheSize(swName, 200);
+                        return fetchRes;
+                    });
+                });
+            }).catch(function () {
+        caches.match('/fallback');
+    })
+            )
+});
+
+const limitCacheSize = function (name, size) {
+    caches.open(name).then(function (cache) {
+        cache.keys().then(function (keys) {
+            if (keys.length > size) {
+                cache.delete(keys[0]).then(limitCacheSize(name, size));
+            }
+        });
+    });
+};
				`@ -0,0 +1 @@`
				const swName="RaMemoryMM",addResourcesToCache=async function(a){await(await caches.open(swName)).addAll(a)},putInCache=async function(a,n){await(await caches.open(swName)).put(a,n)},enableNavigationPreload=async function(){self.registration.navigationPreload&&await self.registration.navigationPreload.enable()},limitCacheSize=(self.addEventListener("activate",function(a){a.waitUntil(enableNavigationPreload())}),self.addEventListener("install",function(a){a.waitUntil(addResourcesToCache(["./index.html","./JavaScript/Css.min.js","./JavaScript/PWA.min.js","./JavaScript/Firework.min.js","./JavaScript/Memory.min.js","./JavaScript/main.min.js","./Css/Firework.min.css","./Css/main.min.css","./fonts/TextMeOne-Regular.ttf","./config/emoji-categories.min.json","./config/emojis.min.json","./config/images.json","./media/frog512x512.png","./media/altogether-logo.png","./media/altogether-logo-inverted.png","./media/dark_intro.webm","./media/light_intro.webm","./media/dark_intro.mp4","./media/light_intro.mp4","./media/light_emoji.png","./favicon/site.webmanifest","./media/green_string.png","./favicon/favicon.ico","./favicon/favicon-32x32.png","./favicon/favicon-16x16.png","./favicon/android-chrome-192x192.png","./favicon/android-chrome-512x512.png","./favicon/maskable/maskable_icon.png","./favicon/maskable/maskable_icon_x48.png","./favicon/maskable/maskable_icon_x72.png","./favicon/maskable/maskable_icon_x96.png","./favicon/maskable/maskable_icon_x128.png","./favicon/maskable/maskable_icon_x192.png","./favicon/maskable/maskable_icon_x384.png","./favicon/maskable/maskable_icon_x512.png"]))}),self.addEventListener("fetch",function(e){0===e.request.url.indexOf("http")&&e.respondWith(caches.match(e.request).then(function(a){return a\|\|fetch(e.request).then(function(n){cache.open(swName).then(function(a){return a.put(e.request.url,n.clone()),limitCacheSize(swName,200),n})})}).catch(function(){caches.match("/fallback")}))}),function(e,i){caches.open(e).then(function(n){n.keys().then(function(a){a.length>i&&n.delete(a[0]).then(limitCacheSize(e,i))})})});