diff --git a/public/img/app-grau.svg b/public/img/app-grau.svg
new file mode 100644
index 0000000000000000000000000000000000000000..f6c0f7ca736a8004bf2f2605efc0a66c4b4e697a
--- /dev/null
+++ b/public/img/app-grau.svg
@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="svg1400"
+   version="1.1"
+   viewBox="0 0 23.859747 23.859747"
+   height="23.859747mm"
+   width="23.859747mm"
+   sodipodi:docname="App-grau.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     id="namedview9"
+     showgrid="false"
+     inkscape:zoom="2.6170297"
+     inkscape:cx="45.089286"
+     inkscape:cy="45.089286"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1400" />
+  <defs
+     id="defs1394" />
+  <metadata
+     id="metadata1397">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <rect
+     ry="3.9087646"
+     y="2.1777344e-06"
+     x="-3.6987306e-06"
+     height="23.859747"
+     width="23.859747"
+     id="rect28"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:17.69223785;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <g
+     id="g6"
+     transform="matrix(0.03649932,0,0,-0.03649932,-103.50668,25.63962)"
+     style="fill:#ffffff;fill-opacity:1">
+    <path
+       inkscape:connector-curvature="0"
+       style="fill:#ffffff;fill-opacity:1;stroke-width:0.64666831"
+       id="path4"
+       d="M 2938.0555,633.9116 V 484.97095 h 44.8207 c 17.6217,0 26.4293,9.32884 26.4293,27.72849 v 50.95035 h 223.6567 c 65.32,0 97.9767,-34.70539 97.9767,-101.93432 V 406.296 h -321.6334 l 0.01,-33.63645 c 0,-18.30913 -8.8917,-27.72332 -26.4293,-27.72332 h -60.6639 v -91.04444 c 0,-91.04444 45.5233,-136.56988 137.5572,-136.56988 h 182.0953 c 106.8749,0 161.3114,55.41883 161.3114,165.26902 V 468.6374 c 0,109.84956 -54.4365,165.26903 -161.3114,165.26903 z m 187.3981,-288.97667 h 48.3449 c 32.5663,0 44.9564,-16.72026 44.9564,-47.91683 v -72.93772 c 0,-24.77063 -12.4225,-37.6154 -36.7049,-37.6154 h -24.942 c -21.0361,0 -31.6544,12.44836 -31.6544,37.16079 v 121.30852" />
+  </g>
+</svg>
diff --git a/public/img/back-arrow.svg b/public/img/back-arrow.svg
new file mode 100644
index 0000000000000000000000000000000000000000..0f56f9a48726b0126c315862345ef1b5a1c0b4ee
--- /dev/null
+++ b/public/img/back-arrow.svg
@@ -0,0 +1,74 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="16.401388"
+   height="21.86853"
+   viewBox="0 0 4.339534 5.7860488"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
+   sodipodi:docname="back-arrow.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="7.5"
+     inkscape:cx="-34.837518"
+     inkscape:cy="0.69305927"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     units="px"
+     inkscape:snap-global="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1">
+    <inkscape:grid
+       type="xygrid"
+       id="grid815"
+       originx="-7.6990081"
+       originy="-12.981972" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-7.6990078,-278.23196)">
+    <path
+       style="fill:#787878;fill-opacity:1;stroke:#787878;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 11.90625,278.47915 -3.9687501,2.64583 3.9687501,2.64584 z"
+       id="path842"
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>
diff --git a/public/img/bangs-icon-help.svg b/public/img/bangs-icon-help.svg
new file mode 100644
index 0000000000000000000000000000000000000000..972532a8af7a0a576b7e41607c32c50072949698
--- /dev/null
+++ b/public/img/bangs-icon-help.svg
@@ -0,0 +1,84 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="20.552494"
+   height="72.408394"
+   viewBox="0 0 5.4378473 19.158055"
+   version="1.1"
+   id="svg5"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
+   sodipodi:docname="bangs-icon-help.svg">
+  <metadata
+     id="metadata9">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#999999"
+     borderopacity="1"
+     inkscape:pageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="true"
+     inkscape:zoom="7.65"
+     inkscape:cx="-33.470175"
+     inkscape:cy="44.126043"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     units="px"
+     inkscape:snap-global="true"
+     inkscape:snap-bbox="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0">
+    <inkscape:grid
+       type="xygrid"
+       id="grid13"
+       originx="-10.583333"
+       originy="-1.3471501" />
+  </sodipodi:namedview>
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-10.583333,-5.9531243)">
+    <ellipse
+       style="fill:#969696;fill-opacity:1;stroke-width:0.264999"
+       id="path141-4"
+       cx="13.229167"
+       cy="22.772942"
+       rx="2.5128586"
+       ry="2.3382375" />
+    <path
+       style="fill:#969696;fill-opacity:1;stroke:#969696;stroke-width:0.26458299px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 10.583333,6.0854159 5.291667,-1e-7 -1.322917,13.2291682 H 11.90625"
+       id="path1564"
+       sodipodi:nodetypes="cccc"
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>
diff --git a/public/img/capitalization-icon-help.svg b/public/img/capitalization-icon-help.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4fb4966e17f76594ce83d129e62f3f279e77bd54
--- /dev/null
+++ b/public/img/capitalization-icon-help.svg
@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="49.632107"
+   height="27.910067"
+   viewBox="0 0 13.131828 7.3845386"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="capitalization-icon-help.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <metadata
+     id="metadata11">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="640"
+     inkscape:window-height="480"
+     id="namedview9"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:zoom="7.7570757"
+     inkscape:cx="28.876862"
+     inkscape:cy="13.955034"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg5" />
+  <defs
+     id="defs2" />
+  <path
+     style="font-size:10.58329964px;line-height:1.25;font-family:'Liberation Sans';-inkscape-font-specification:'Liberation Sans';fill:#666666;stroke-width:0.26458299"
+     inkscape:connector-curvature="0"
+     id="path6932"
+     d="M 6.0099499,7.2811861 5.177962,5.1521239 H 1.8603456 L 1.0231901,7.2811861 H 0 L 2.9713854,0 h 1.121375 L 7.0176375,7.2811861 Z M 3.5191538,0.7441382 3.4726452,0.8888318 Q 3.3434545,1.3177448 3.0902408,1.9895363 L 2.160068,4.3821475 H 4.8834073 L 3.9480669,1.979201 Q 3.8033733,1.6226348 3.6586798,1.1730512 Z" />
+  <path
+     style="font-size:10.58329964px;line-height:1.25;font-family:'Liberation Sans';-inkscape-font-specification:'Liberation Sans';fill:#666666;stroke-width:0.26458299"
+     inkscape:connector-curvature="0"
+     id="path6934"
+     d="m 9.3852984,7.3845386 q -0.842324,0 -1.266069,-0.4444159 -0.4237455,-0.4444159 -0.4237455,-1.2195599 0,-0.8681613 0.5684385,-1.3332477 0.573607,-0.4650864 1.8448436,-0.4960922 l 1.255733,-0.02067 v -0.30489 q 0,-0.6821267 -0.289388,-0.9766814 -0.289387,-0.2945548 -0.909502,-0.2945548 -0.6252826,0 -0.9095016,0.2118727 -0.28422,0.2118727 -0.341064,0.6769592 l -0.971513,-0.08785 q 0.237711,-1.508947 2.2427496,-1.508947 1.054196,0 1.586462,0.4857569 0.532265,0.4805893 0.532265,1.3952592 v 2.4081141 q 0,0.4134101 0.108521,0.6252828 0.108519,0.2067051 0.413409,0.2067051 0.134358,0 0.304891,-0.036173 v 0.5787742 q -0.3514,0.082682 -0.7183,0.082682 -0.516764,0 -0.754474,-0.2687166 -0.232544,-0.2738848 -0.263549,-0.852659 h -0.03101 Q 11.007932,6.8522731 10.532511,7.1209897 10.062257,7.3845386 9.3852984,7.3845386 Z M 9.5971714,6.686909 q 0.5115946,0 0.9095016,-0.2325432 0.397908,-0.2325432 0.625283,-0.6356181 0.232543,-0.4082425 0.232543,-0.8371555 V 4.5216734 l -1.018022,0.02067 q -0.6562886,0.010336 -0.9973516,0.1343588 -0.335896,0.124023 -0.516763,0.3824044 -0.180867,0.2583813 -0.180867,0.6769591 0,0.4547511 0.242879,0.7027972 0.248046,0.2480461 0.702797,0.2480461 z" />
+</svg>
diff --git a/public/img/cookies.svg b/public/img/cookies.svg
new file mode 100644
index 0000000000000000000000000000000000000000..326d31091bfb19ac852f5c866801a9bb752bacab
--- /dev/null
+++ b/public/img/cookies.svg
@@ -0,0 +1,139 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   id="svg8"
+   version="1.1"
+   viewBox="0 0 20.208656 16.704592"
+   height="63.135464"
+   width="76.379173">
+  <defs
+     id="defs2" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     transform="translate(-0.95801133,-271.82168)"
+     id="layer1">
+    <g
+       transform="translate(-5.4833937,-0.72856291)"
+       id="g1058">
+      <circle
+         style="opacity:1;fill:#666666;fill-opacity:1;stroke:#666666;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path897"
+         cx="13.909799"
+         cy="281.78644"
+         r="7.2760415" />
+      <circle
+         style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:#c8c8c8;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path846"
+         cx="13.027853"
+         cy="280.29099"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:#c8c8c8;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850"
+         cx="9.346693"
+         cy="282.01651"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:#c8c8c8;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-6"
+         cx="14.29325"
+         cy="276.91656"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:#c8c8c8;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-7"
+         cx="17.514265"
+         cy="283.12857"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:#c8c8c8;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-5"
+         cx="12.816953"
+         cy="284.39392"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:#c8c8c8;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-35"
+         cx="9.9410448"
+         cy="278.02863"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:#c8c8c8;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-62"
+         cx="18.166136"
+         cy="279.3707"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:#c8c8c8;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-6-9"
+         cx="15.079331"
+         cy="287.05896"
+         r="0.66145831" />
+    </g>
+    <g
+       transform="translate(10.583333,-21.166663)"
+       id="g985">
+      <path
+         style="opacity:1;fill:#969696;fill-opacity:1;stroke:none;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="m 3.3424313,292.98834 a 7.2760414,7.2760414 0 0 0 -7.2760422,7.27604 7.2760414,7.2760414 0 0 0 7.2760422,7.27605 7.2760414,7.2760414 0 0 0 7.2409027,-6.5717 4.3483961,4.3483961 0 0 1 -1.6676,0.33693 4.3483961,4.3483961 0 0 1 -4.3480546,-4.34857 4.3483961,4.3483961 0 0 1 1.6236726,-3.38687 7.2760414,7.2760414 0 0 0 -2.8489207,-0.58188 z"
+         id="path817-9-6" />
+      <circle
+         style="opacity:1;fill:#6e6e6e;fill-opacity:1;stroke:#6e6e6e;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path846-1-2"
+         cx="1.4826795"
+         cy="299.07565"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#6e6e6e;fill-opacity:1;stroke:#6e6e6e;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-2-6"
+         cx="-1.0481194"
+         cy="304.06055"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#6e6e6e;fill-opacity:1;stroke:#6e6e6e;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-6-7-1"
+         cx="4.6653461"
+         cy="305.55603"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#6e6e6e;fill-opacity:1;stroke:#6e6e6e;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-7-0-8"
+         cx="2.9398038"
+         cy="302.14328"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#6e6e6e;fill-opacity:1;stroke:#6e6e6e;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-5-9-7"
+         cx="-2.0259264"
+         cy="298.92224"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#6e6e6e;fill-opacity:1;stroke:#6e6e6e;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-35-3-9"
+         cx="2.5371759"
+         cy="295.47119"
+         r="0.66145831" />
+      <circle
+         style="opacity:1;fill:#6e6e6e;fill-opacity:1;stroke:#6e6e6e;stroke-width:0.38470417;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path850-62-6-2"
+         cx="7.1194534"
+         cy="303.25528"
+         r="0.66145831" />
+    </g>
+  </g>
+</svg>
diff --git a/public/img/icon-settings-grau.svg b/public/img/icon-settings-grau.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4aa8efe873a7d197f9036c77b0f341cbbe6e3f08
--- /dev/null
+++ b/public/img/icon-settings-grau.svg
@@ -0,0 +1,96 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="21.166666mm"
+   height="21.166666mm"
+   viewBox="0 0 21.166666 21.166666"
+   version="1.1"
+   id="svg831"
+   sodipodi:docname="settings-grau.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     id="namedview15"
+     showgrid="false"
+     inkscape:zoom="2.9500001"
+     inkscape:cx="39.999999"
+     inkscape:cy="39.999999"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg831" />
+  <defs
+     id="defs825" />
+  <metadata
+     id="metadata828">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <path
+     inkscape:connector-curvature="0"
+     id="path839"
+     d="M 10.51512,2.0065958 C 8.3111686,2.0237121 6.1138683,2.8746442 4.4591594,4.5557942 1.1497403,7.9180641 1.1945538,13.398097 4.5568277,16.707507 c 3.3622649,3.30942 8.8407483,3.266102 12.1501623,-0.09612 v -5.29e-4 C 20.016406,13.24861 19.973141,7.7701175 16.61087,4.4607076 14.92974,2.8059926 12.71907,1.9894776 10.515118,2.0065938 Z M 10.54406,6.56239 A 3.9949461,3.9949461 0 0 1 14.539165,10.556978 3.9949461,3.9949461 0 0 1 10.54406,14.552083 3.9949461,3.9949461 0 0 1 6.5489541,10.556978 3.9949461,3.9949461 0 0 1 10.54406,6.56239 Z"
+     style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#969696;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4.66400003;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+  <path
+     inkscape:connector-curvature="0"
+     id="rect843"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:4.66400003;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="m 19.053927,17.06455 -1.856008,1.88565 -2.813652,-0.91319 3.712018,-3.77129 z" />
+  <path
+     inkscape:connector-curvature="0"
+     id="rect843-5"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:4.66400003;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="M 4.102123,19.05393 2.216476,17.19792 3.12966,14.38427 6.900955,18.09629 Z" />
+  <path
+     inkscape:connector-curvature="0"
+     id="rect843-4"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:4.66400003;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="M 3.96875,2.21648 2.112741,4.10212 3.070384,6.90096 6.782402,3.12966 Z" />
+  <path
+     inkscape:connector-curvature="0"
+     id="rect843-9"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:4.66400003;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="M 17.064547,2.11274 18.950193,3.96875 18.037009,6.7824 14.265714,3.07039 Z" />
+  <path
+     inkscape:connector-curvature="0"
+     id="rect843-45"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:4.66400003;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="M 0,11.90625 V 9.26042 L 2.645833,7.9375 v 5.29167 z" />
+  <path
+     inkscape:connector-curvature="0"
+     id="rect843-6"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:4.66400003;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="m 9.260417,0 h 2.645833 l 1.322917,2.64584 H 7.9375 Z" />
+  <path
+     inkscape:connector-curvature="0"
+     id="rect843-3"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:4.66400003;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="m 9.260417,21.16667 h 2.645833 l 1.322917,-2.64583 H 7.9375 Z" />
+  <path
+     inkscape:connector-curvature="0"
+     id="rect843-64"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:4.66400003;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="m 21.166667,9.26042 v 2.64583 l -2.645834,1.32292 V 7.9375 Z" />
+</svg>
diff --git a/public/img/jugendschutz.svg b/public/img/jugendschutz.svg
new file mode 100644
index 0000000000000000000000000000000000000000..34936f3b42c542f0e5f577f7514c26264bf5d575
--- /dev/null
+++ b/public/img/jugendschutz.svg
@@ -0,0 +1,133 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="77.880318"
+   height="77.880318"
+   viewBox="0 0 20.605834 20.605835"
+   version="1.1"
+   id="svg1654"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
+   sodipodi:docname="jugendschutz.svg">
+  <defs
+     id="defs1648">
+    <inkscape:path-effect
+       effect="bspline"
+       id="path-effect2225"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" />
+    <inkscape:path-effect
+       effect="bspline"
+       id="path-effect2215"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" />
+    <inkscape:path-effect
+       effect="bspline"
+       id="path-effect2207"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" />
+    <inkscape:path-effect
+       effect="bspline"
+       id="path-effect2203"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" />
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="7.14"
+     inkscape:cx="17.315257"
+     inkscape:cy="37.259456"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     units="px"
+     inkscape:window-width="835"
+     inkscape:window-height="424"
+     inkscape:window-x="975"
+     inkscape:window-y="343"
+     inkscape:window-maximized="0"
+     showguides="true"
+     inkscape:guide-bbox="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0">
+    <inkscape:grid
+       type="xygrid"
+       id="grid2199"
+       originx="-2.9262499"
+       originy="-2.926258" />
+    <sodipodi:guide
+       position="-6.8950001,24.854994"
+       orientation="0,1"
+       id="guide2848"
+       inkscape:locked="false" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata1651">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-2.92625,-273.4679)">
+    <circle
+       style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:#787878;stroke-width:2.08500004;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path2840"
+       cx="13.229167"
+       cy="283.77081"
+       r="9.260417" />
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:10.58333302px;line-height:1.25;font-family:'Liberation Sans';-inkscape-font-specification:'Liberation Sans';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.26458332"
+       x="7.1701055"
+       y="287.414"
+       id="text2844"><tspan
+         sodipodi:role="line"
+         id="tspan2842"
+         x="7.1701055"
+         y="287.414"
+         style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:'Liberation Sans';-inkscape-font-specification:'Liberation Sans';stroke-width:0.26458332">18</tspan></text>
+  </g>
+</svg>
diff --git a/public/img/lupe-grau.svg b/public/img/lupe-grau.svg
new file mode 100644
index 0000000000000000000000000000000000000000..a6eea503f674b8a06b617c62df7077e5e05160c3
--- /dev/null
+++ b/public/img/lupe-grau.svg
@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="svg830"
+   version="1.1"
+   viewBox="0 0 22.822979 22.036577"
+   height="22.036577mm"
+   width="22.822979mm"
+   sodipodi:docname="lupe-grau.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     id="namedview8"
+     showgrid="false"
+     inkscape:zoom="2.8335465"
+     inkscape:cx="43.130039"
+     inkscape:cy="41.643925"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg830" />
+  <defs
+     id="defs824" />
+  <metadata
+     id="metadata827">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <circle
+     r="7.3626533"
+     cy="5.8385634"
+     cx="10.263864"
+     id="path2298"
+     style="fill:none;fill-opacity:1;stroke:#969696;stroke-width:1.97363663;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     transform="rotate(15.366797)" />
+  <rect
+     transform="matrix(0.66463899,-0.74716465,0.74301394,0.66927594,0,0)"
+     y="18.755049"
+     x="-2.0498953"
+     height="11.882497"
+     width="2.1384423"
+     id="rect2300"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:1.74589539;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+</svg>
diff --git a/public/img/maps-grau.svg b/public/img/maps-grau.svg
new file mode 100644
index 0000000000000000000000000000000000000000..e487f92aff1c69f09eba73546370bb47b5cfbd08
--- /dev/null
+++ b/public/img/maps-grau.svg
@@ -0,0 +1,151 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="27.076725mm"
+   height="26.458357mm"
+   viewBox="0 0 27.076725 26.458357"
+   version="1.1"
+   id="svg861"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
+   sodipodi:docname="maps-grau.svg">
+  <defs
+     id="defs855" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="6.1300268"
+     inkscape:cx="71.978829"
+     inkscape:cy="62.247327"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0">
+    <inkscape:grid
+       type="xygrid"
+       id="grid833" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata858">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-95.318779,-128.80058)">
+    <rect
+       style="opacity:1;fill:#666666;fill-opacity:1;stroke:none;stroke-width:0.37185931;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="rect850"
+       width="27.076725"
+       height="26.458336"
+       x="95.318779"
+       y="128.80058"
+       ry="3.6040778" />
+    <rect
+       style="opacity:1;fill:#969696;fill-opacity:1;stroke:none;stroke-width:0.33178031;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+       id="rect863"
+       width="14.816668"
+       height="2.6458333"
+       x="107.56817"
+       y="137.97847" />
+    <path
+       inkscape:connector-curvature="0"
+       style="fill:none;stroke:#fce6d6;stroke-width:0.1234747;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 107.56817,140.57706 h 14.81667"
+       id="path897" />
+    <path
+       inkscape:connector-curvature="0"
+       style="fill:none;stroke:#f0f0f0;stroke-width:0.1234747;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 107.56817,138.06098 h 14.81667"
+       id="path897-7" />
+    <path
+       style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:0.26458332px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 122.38484,144.05547 c -3.45367,0.95961 -3.28297,2.83864 -3.49643,3.75377 -0.81015,4.4643 -16.39435,2.882 -16.39435,2.882 0,0 -7.28394,3.52268 6.14175,3.44888 8.59896,-0.0472 11.7823,-2.13687 11.67008,-5.48028 -0.0608,-1.81041 0.19244,-3.01217 2.07895,-3.71967 z"
+       id="path1301"
+       inkscape:connector-curvature="0" />
+    <g
+       id="g831"
+       transform="matrix(0.88935351,0,0,1.0000003,12.003472,-3.2581087e-5)">
+      <rect
+         y="128.8006"
+         x="97.845764"
+         height="26.458342"
+         width="10.473661"
+         id="rect821"
+         style="opacity:1;fill:#c8c8c8;fill-opacity:1;stroke:none;stroke-width:1.99952221;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         id="path823"
+         d="m 103.0826,128.80059 v 26.45833"
+         style="fill:#ffffff;stroke:#ffffff;stroke-width:0.56206495;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:2.24825981, 4.49651962;stroke-dashoffset:0;stroke-opacity:1"
+         inkscape:connector-curvature="0" />
+      <path
+         id="path825"
+         d="m 97.845768,128.80059 v 26.45833"
+         style="fill:none;stroke:#ffffff;stroke-width:0.46258444;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         inkscape:connector-curvature="0" />
+      <path
+         id="path825-3"
+         d="m 108.31943,128.80059 v 26.45833"
+         style="fill:none;stroke:#ffffff;stroke-width:0.46258444;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         inkscape:connector-curvature="0" />
+    </g>
+    <path
+       d="m 113.171,137.3904 -1.37872,-0.22509 0.86888,-1.12869 c 0.45045,0.3927 0.50649,0.86417 0.50984,1.35378 m 0.37927,0.0826 c 0.002,-0.0491 0.0102,-0.12771 0.0102,-0.18277 0,-0.55849 -0.18076,-1.10125 -0.67113,-1.55238 l 0.51071,-0.61155 0.79049,2.41156 z m 3.03414,-2.40013 -0.0439,-0.13424 -2.81548,-0.003 0.74894,2.27049 0.0323,-0.23686 h -0.0862 l 0.0108,-0.15075 h 0.37687 l -0.0108,0.13999 h -0.0969 l -0.0216,0.25837 c 0,0 1.89509,-2.13264 1.90583,-2.14339 m 1.24699,2.1811 c -0.37812,-0.30029 -0.67238,-0.5866 -0.88461,-1.15939 -0.33503,0.30395 -0.52606,0.74347 -0.52606,1.19566 0,0.89822 0.73253,1.63076 1.63067,1.63076 0.89823,0 1.63076,-0.73254 1.63076,-1.63076 0,-0.89813 -0.73253,-1.63067 -1.63076,-1.63067 -0.28659,0 -0.5797,0.0828 -0.81591,0.22231 0.15994,0.50533 0.31546,0.766 0.80756,1.16216 0.11945,0.005 0.21031,0.10094 0.21031,0.21532 0,0.11858 -0.0967,0.21538 -0.2153,0.21538 -0.11868,0 -0.20666,-0.0968 -0.20666,-0.22077 m -4.71815,0.48288 c -0.1845,0.68736 -0.84057,1.18415 -1.56677,1.18415 -0.89823,0 -1.63077,-0.73254 -1.63077,-1.63076 0,-0.89813 0.73254,-1.63067 1.63077,-1.63067 0.28668,0 0.61836,0.0676 0.86033,0.20924 l -0.88509,1.17523 c -0.10832,0.002 -0.20253,0.0984 -0.20253,0.21532 0,0.11858 0.0967,0.21538 0.21539,0.21538 0.0328,0 0.0673,-0.009 0.0964,-0.0221 z m 4.00576,-2.23242 -0.57768,-1.59372 0.18307,-0.31223 -0.36603,-0.39833 h -0.78607 l -0.0108,0.22604 h 0.68907 l 0.13998,0.15074 -0.16147,0.2907 0.20311,0.71986 h -2.82086 l -0.0431,-0.13162 c 0.22662,-0.0295 0.61769,-0.16916 0.71104,-0.25032 0.0935,-0.0811 0.0117,-0.15573 -0.0947,-0.15919 -0.55676,-0.0239 -1.3839,-0.0703 -1.54105,-0.0709 -0.15707,-7.4e-4 -0.17318,0.0783 -0.068,0.19333 0.10525,0.11503 0.19716,0.21866 0.59562,0.28043 l 0.10765,0.29071 -0.66749,0.82685 c -0.3146,-0.19092 -0.69511,-0.29033 -1.06488,-0.29033 -1.10921,0 -2.01387,0.90465 -2.01387,2.01389 0,1.1093 0.90466,2.01396 2.01387,2.01396 0.91262,0 1.715,-0.62932 1.95083,-1.49915 l 0.61328,0.11025 c 0.0263,0.0721 0.0875,0.1277 0.16061,0.17107 l -0.10938,0.51887 h -0.13997 l -0.0107,0.13998 0.44144,0.0216 v -0.15072 h -0.10765 l 0.13326,-0.51859 c 0.19842,-0.0325 0.30242,-0.20235 0.24332,-0.37093 l 2.0037,-2.2661 0.0897,0.24312 c -0.48625,0.38301 -0.77734,0.97305 -0.77734,1.58664 0,1.1093 0.90466,2.01396 2.01387,2.01396 1.1092,2e-5 2.01396,-0.90465 2.01396,-2.01395 0,-1.10922 -0.90476,-2.01386 -2.01397,-2.01386 -0.32256,0 -0.6529,0.0787 -0.93238,0.22805"
+       style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.07675536"
+       id="path3837"
+       inkscape:connector-curvature="0" />
+    <g
+       id="g1262"
+       transform="matrix(0.11907477,-0.00929935,0.00929935,0.11907477,109.44515,114.0575)"
+       style="fill:#ffffff">
+      <path
+         style="fill:#ffffff;stroke-width:0.26458332"
+         id="path8"
+         d="m 16.626748,260.48721 c 3.288242,0 5.94651,-2.64308 5.94651,-5.89809 0,-3.24909 -2.658268,-5.87587 -5.94651,-5.87587 -3.288241,0 -5.963179,2.62668 -5.963179,5.87587 0,3.2549 2.674938,5.89809 5.963179,5.89809 z"
+         inkscape:connector-curvature="0" />
+      <path
+         style="fill:#ffffff;stroke-width:0.26458332"
+         id="path10"
+         d="m 6.563824,261.46087 c 0.230653,-0.90667 -0.348853,-1.80834 -1.249865,-2.03625 0,0 -4.96120251,-1.17944 -4.96120251,-1.17944 -0.9291108,-0.21153 -1.84668579,0.32835 -2.05570659,1.23002 0,0 -4.1719501,17.06007 -4.1719501,17.06007 -0.2306532,0.90668 0.3322902,1.80835 1.2498653,2.03626 0,0 4.97787079,1.17944 4.97787079,1.17944 0.90098561,0.22791 1.83009651,-0.32835 2.04417081,-1.235 0,0 4.1669233,-17.05504 4.1669233,-17.05504 0,0 -1.06e-4,-6e-5 -1.06e-4,-6e-5 z"
+         inkscape:connector-curvature="0" />
+      <path
+         style="fill:#ffffff;stroke-width:0.26458332"
+         id="path12"
+         d="m 29.471977,322.12798 c 0,0.0335 -0.01656,0.0669 -0.01656,0.0833 0,0.75139 0.619151,1.3575 1.373823,1.3575 0.686911,0 1.267168,-0.52277 1.351491,-1.17944 0,0 10.000985,-53.5728 10.000985,-53.5728 0,0 0,-0.10541 0,-0.10541 0,-0.72861 -0.602588,-1.34112 -1.357262,-1.34112 -0.686911,0 -1.216713,0.52276 -1.35726,1.18515 0,0 -9.995164,53.57283 -9.995164,53.57283 0,0 -5.3e-5,-1e-5 -5.3e-5,-1e-5 z"
+         inkscape:connector-curvature="0" />
+      <path
+         style="fill:#ffffff;stroke-width:0.26458332"
+         id="path14"
+         d="m -3.7803262,318.61696 c -0.056221,0.27847 -0.073517,0.55626 -0.073517,0.83473 0,2.29267 1.869731,4.13438 4.18914792,4.13438 1.90362418,0 3.50228958,-1.25208 4.01478728,-2.95433 l 7.196402,-29.44019 6.859059,29.26821 c 0.43897,1.80834 2.094626,3.12737 4.042832,3.12737 2.326005,0 4.189148,-1.84182 4.189148,-4.13438 0,-0.31694 -0.03388,-0.61182 -0.0901,-0.90667 l -9.408582,-38.87788 0.788538,-3.42714 0.619151,2.69292 c 0.562954,1.75848 2.178975,1.93085 2.178975,1.93085 l 9.696979,2.43724 c 0.191733,0.0335 0.388514,0.0499 0.580231,0.0499 1.582156,0 2.866496,-1.25209 2.866496,-2.81544 0,-1.34112 -0.929111,-2.4707 -2.196253,-2.76568 l -8.395758,-2.08683 -2.302934,-9.25327 c -1.092728,-5.16361 -6.087003,-5.04111 -6.087003,-5.04111 -4.853781,-0.1225 -6.0706,4.92443 -6.0706,4.92443 l -12.5973405,52.30279 z"
+         inkscape:connector-curvature="0" />
+    </g>
+  </g>
+</svg>
diff --git a/public/img/proxy.svg b/public/img/proxy.svg
new file mode 100644
index 0000000000000000000000000000000000000000..b6eaeeaf21adc18f4b4cf6c26c208e8cbb40551e
--- /dev/null
+++ b/public/img/proxy.svg
@@ -0,0 +1,159 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="svg10"
+   xml:space="preserve"
+   viewBox="0 0 146.21562 379.52535"
+   version="1.1"
+   height="71.263634"
+   width="66.349052"
+   sodipodi:docname="proxy.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"><sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     id="namedview7"
+     showgrid="true"
+     inkscape:snap-global="false"
+     inkscape:zoom="4.9917265"
+     inkscape:cx="-21.86993"
+     inkscape:cy="29.40011"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg10"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"><inkscape:grid
+       type="xygrid"
+       id="grid814"
+       originx="-2.36192"
+       originy="3.4247368" /></sodipodi:namedview><defs
+     id="defs14"><inkscape:path-effect
+       effect="bspline"
+       id="path-effect1246"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" /><marker
+       style="overflow:visible"
+       id="DistanceEnd"
+       refX="0"
+       refY="0"
+       orient="auto"
+       inkscape:stockid="DistanceEnd"
+       inkscape:isstock="true"><g
+         id="g2301"
+         style="fill:#000000;fill-opacity:1;stroke:#000000;stroke-opacity:1"><path
+           style="fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:1.14999998;stroke-linecap:square;stroke-opacity:1"
+           d="M 0,0 H -2"
+           id="path2316"
+           inkscape:connector-curvature="0" /><path
+           style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-opacity:1"
+           d="m 0,0 -13,4 4,-4 -4,-4 z"
+           id="path2312"
+           inkscape:connector-curvature="0" /><path
+           style="fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:1;stroke-linecap:square;stroke-opacity:1"
+           d="M 0,-4 V 40"
+           id="path2314"
+           inkscape:connector-curvature="0" /></g></marker><marker
+       inkscape:stockid="Arrow1Mstart"
+       orient="auto"
+       refY="0"
+       refX="0"
+       id="Arrow1Mstart"
+       style="overflow:visible"
+       inkscape:isstock="true"><path
+         id="path880"
+         d="M 0,0 5,-5 -12.5,0 5,5 Z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:1.00000003pt;stroke-opacity:1"
+         transform="matrix(0.4,0,0,0.4,4,0)"
+         inkscape:connector-curvature="0" /></marker><marker
+       inkscape:stockid="Arrow1Lend"
+       orient="auto"
+       refY="0"
+       refX="0"
+       id="Arrow1Lend"
+       style="overflow:visible"
+       inkscape:isstock="true"><path
+         id="path877"
+         d="M 0,0 5,-5 -12.5,0 5,5 Z"
+         style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:1.00000003pt;stroke-opacity:1"
+         transform="matrix(-0.8,0,0,-0.8,-10,0)"
+         inkscape:connector-curvature="0" /></marker><inkscape:path-effect
+       effect="bspline"
+       id="path-effect837"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" /><inkscape:path-effect
+       effect="bspline"
+       id="path-effect833"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" /><inkscape:path-effect
+       effect="bspline"
+       id="path-effect829"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" /><inkscape:path-effect
+       effect="bspline"
+       id="path-effect837-3"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" /></defs><metadata
+     id="metadata2"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title /></cc:Work></rdf:RDF></metadata><g
+     transform="matrix(0.73467465,0,0,-0.73467465,-2250.4508,465.71878)"
+     id="g6"
+     style="fill:#969696;fill-opacity:1"><path
+       d="M 2938.0555,633.9116 V 484.97095 h 44.8207 c 17.6217,0 26.4293,9.32884 26.4293,27.72849 v 50.95035 h 223.6567 c 65.32,0 97.9767,-34.70539 97.9767,-101.93432 V 406.296 h -321.6334 l 0.01,-33.63645 c 0,-18.30913 -8.8917,-27.72332 -26.4293,-27.72332 h -60.6639 v -91.04444 c 0,-91.04444 45.5233,-136.56988 137.5572,-136.56988 h 182.0953 c 106.8749,0 161.3114,55.41883 161.3114,165.26902 V 468.6374 c 0,109.84956 -54.4365,165.26903 -161.3114,165.26903 z"
+       id="path4"
+       style="fill:#969696;fill-opacity:1;stroke-width:0.64666831"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccsscsscccscssssscc" /></g><path
+     style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:5.3256526px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+     d="m -28.181019,275.76926 c 0.05061,-3.59639 56.835832,-47.27733 107.406526,-47.51102 50.570693,-0.23369 108.313483,41.23613 108.246783,46.3978 -0.0667,5.16168 -66.0103,46.37643 -109.75427,46.58318 -43.743969,0.20674 -105.949646,-41.87356 -105.899039,-45.46996 z"
+     id="path1244"
+     inkscape:connector-curvature="0"
+     inkscape:path-effect="#path-effect1246"
+     inkscape:original-d="m -33.153062,276.03645 c 5.022055,-3.86435 61.80728,-47.54529 110.957175,-85.35167 51.996427,37.33373 109.739217,78.80355 117.358547,84.28477 -7.75797,4.84673 -73.70157,46.06148 -119.492338,74.68271 C 33.978193,321.43984 -28.227482,279.35953 -33.153062,276.03645 Z"
+     sodipodi:nodetypes="ccccc"
+     transform="translate(-5.7079344,-3.4247371)" /><path
+     style="opacity:1;fill:#969696;fill-opacity:1;stroke:none;stroke-width:71.29497528;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="m 71.066946,228.68073 a 39.942394,39.942394 0 0 0 -39.9424,39.94239 39.942394,39.942394 0 0 0 39.9424,39.9424 39.942394,39.942394 0 0 0 39.942394,-39.9424 39.942394,39.942394 0 0 0 -4.9616,-19.18067 14.439076,14.439076 0 0 1 -14.156664,11.57706 14.439076,14.439076 0 0 1 -14.43751,-14.43752 14.439076,14.439076 0 0 1 10.80732,-13.95903 39.942394,39.942394 0 0 0 -17.19394,-3.94223 z"
+     id="path818"
+     inkscape:connector-curvature="0" /></svg>
\ No newline at end of file
diff --git a/public/img/result-icon-help.svg b/public/img/result-icon-help.svg
new file mode 100644
index 0000000000000000000000000000000000000000..14bb9c30537c027599412bbabb8c806b3888285c
--- /dev/null
+++ b/public/img/result-icon-help.svg
@@ -0,0 +1,114 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   id="svg1652"
+   version="1.1"
+   viewBox="0 0 185.20834 47.625017"
+   height="47.625015mm"
+   width="185.20834mm">
+  <metadata
+     id="metadata29">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs1649">
+    <linearGradient
+       id="linearGradient835">
+      <stop
+         id="stop831"
+         offset="0"
+         style="stop-color:#000000;stop-opacity:1;" />
+      <stop
+         id="stop833"
+         offset="1"
+         style="stop-color:#000000;stop-opacity:0;" />
+    </linearGradient>
+    <rect
+       id="rect53428"
+       height="60"
+       width="680"
+       y="500"
+       x="0" />
+    <rect
+       id="rect38342"
+       height="60"
+       width="400"
+       y="500"
+       x="0" />
+    <rect
+       id="rect53428-3"
+       height="60"
+       width="680"
+       y="500"
+       x="0" />
+    <linearGradient
+       gradientUnits="userSpaceOnUse"
+       y2="128.68524"
+       x2="42.395428"
+       y1="128.68524"
+       x1="0.97160118"
+       id="linearGradient837"
+       xlink:href="#linearGradient835" />
+  </defs>
+  <g
+     transform="translate(5.2916665,-100.54166)"
+     id="layer1">
+    <rect
+       ry="7.937499"
+       y="100.54164"
+       x="-5.291667"
+       height="47.625015"
+       width="185.20834"
+       id="rect1686"
+       style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:1.16403961" />
+    <text
+       id="text13070"
+       y="117.28403"
+       x="0.76927918"
+       style="font-style:normal;font-weight:normal;font-size:7.76110983px;line-height:1.25;font-family:sans-serif;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.26458299"
+       xml:space="preserve"><tspan
+         y="117.28403"
+         x="0.76927918"
+         style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:9.87777805px;font-family:'Liberation Sans';-inkscape-font-specification:'Liberation Sans';stroke-width:0.26458299"
+         id="tspan13068">MetaGer - Mehr als eine Suchmaschine</tspan></text>
+    <text
+       id="text17430"
+       y="130.87425"
+       x="0.40936163"
+       style="font-style:normal;font-weight:normal;font-size:6.3499999px;line-height:1.25;font-family:sans-serif;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.22090399;stroke-opacity:1;"
+       xml:space="preserve"><tspan
+         y="130.87425"
+         x="0.40936163"
+         style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:8.46666622px;font-family:'Liberation Sans';-inkscape-font-specification:'Liberation Sans';fill:#0066cc;fill-opacity:1;stroke:none;stroke-width:0.22090399;stroke-opacity:1;"
+         id="tspan17428">metager.de</tspan></text>
+    <text
+       transform="scale(0.53998771,1.851894)"
+       id="text20096"
+       y="83.065468"
+       x="-97.070999"
+       style="font-style:normal;font-weight:normal;font-size:11.22920036px;line-height:1.25;font-family:sans-serif;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.280729"
+       xml:space="preserve"><tspan
+         y="93.000679"
+         x="-97.070999"
+         style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:'Liberation Sans';-inkscape-font-specification:'Liberation Sans';stroke-width:0.280729"
+         id="tspan20094" /></text>
+    <text
+       style="font-style:normal;font-weight:normal;font-size:16px;line-height:1.25;font-family:sans-serif;white-space:pre;shape-inside:url(#rect38342);fill:#000000;fill-opacity:1;stroke:none"
+       id="text38340"
+       transform="scale(0.26458333)"
+       xml:space="preserve" />
+  </g>
+</svg>
diff --git a/public/img/searchfield-icon-help.svg b/public/img/searchfield-icon-help.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4df51443343893878eca5dd6cef91773c2ed59dd
--- /dev/null
+++ b/public/img/searchfield-icon-help.svg
@@ -0,0 +1,87 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="81.454002"
+   height="20.236609"
+   viewBox="0 0 21.551372 5.3542697"
+   version="1.1"
+   id="svg14"
+   sodipodi:docname="searchfield-icon-help.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <metadata
+     id="metadata13">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1043"
+     id="namedview11"
+     showgrid="true"
+     units="px"
+     inkscape:zoom="8.4348572"
+     inkscape:cx="37.25363"
+     inkscape:cy="9.2739984"
+     inkscape:window-x="0"
+     inkscape:window-y="92"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg14"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0">
+    <inkscape:grid
+       type="xygrid"
+       id="grid15"
+       originx="-2.4534811"
+       originy="-10.552033" />
+  </sodipodi:namedview>
+  <defs
+     id="defs11" />
+  <rect
+     style="opacity:1;fill:#969696;fill-opacity:1;stroke:none;stroke-width:0.30908409;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     id="rect830"
+     width="20.682688"
+     height="4.7231369"
+     x="0.43434235"
+     y="0.31556633"
+     ry="0.50948554" />
+  <circle
+     r="1.0243692"
+     cy="-2.5509632"
+     cx="18.370987"
+     id="path2298"
+     style="fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:0.27459294;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     transform="rotate(15.366805)" />
+  <rect
+     transform="matrix(0.66463919,-0.74716447,0.74301379,0.66927611,0,0)"
+     y="16.310865"
+     x="10.319241"
+     height="1.6532173"
+     width="0.29752249"
+     id="rect2300"
+     style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.24290724;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+</svg>
diff --git a/public/img/searchinsearch-icon-help.svg b/public/img/searchinsearch-icon-help.svg
new file mode 100644
index 0000000000000000000000000000000000000000..5a0249d9453ec18b3b5800995955d84285c5645a
--- /dev/null
+++ b/public/img/searchinsearch-icon-help.svg
@@ -0,0 +1,73 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="86.260094"
+   height="85.057335"
+   viewBox="0 0 22.822983 22.504754"
+   version="1.1"
+   id="svg829"
+   sodipodi:docname="searchinsearch-icon-help.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     id="namedview10"
+     showgrid="false"
+     inkscape:zoom="2.774599"
+     inkscape:cx="-106.0807"
+     inkscape:cy="39.645367"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg829" />
+  <defs
+     id="defs826" />
+  <circle
+     r="7.3626533"
+     cy="6.2899933"
+     cx="10.387932"
+     id="path2298"
+     style="fill:none;fill-opacity:1;stroke:#969696;stroke-width:1.97363663;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     transform="rotate(15.366798)" />
+  <rect
+     transform="matrix(0.66463899,-0.74716465,0.74301394,0.66927594,0,0)"
+     y="19.066225"
+     x="-2.3977544"
+     height="11.882498"
+     width="2.1384423"
+     id="rect2300"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:1.74589539;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     inkscape:connector-curvature="0"
+     id="path995"
+     d="M 19.187413,0 V 5.2916666 2.6458333 h -2.645833 5.291667"
+     style="fill:none;stroke:#969696;stroke-width:1.16499996;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+</svg>
diff --git a/public/img/startseite-icon-help.svg b/public/img/startseite-icon-help.svg
new file mode 100644
index 0000000000000000000000000000000000000000..858b92883928ae71399cc3507bfa37c47d3d2cb4
--- /dev/null
+++ b/public/img/startseite-icon-help.svg
@@ -0,0 +1,150 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="163.61827mm"
+   height="21.874273mm"
+   viewBox="0 0 163.61827 21.874273"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="Startseite-icon-hilfe.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <metadata
+     id="metadata31">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     id="namedview29"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:zoom="1.4182101"
+     inkscape:cx="343.67619"
+     inkscape:cy="-113.86888"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg5" />
+  <defs
+     id="defs2">
+    <linearGradient
+       xlink:href="#linearGradient6206"
+       id="linearGradient6210"
+       gradientUnits="userSpaceOnUse"
+       x1="-293.63593"
+       y1="3.2192702"
+       x2="-258.68027"
+       y2="13.229791" />
+    <linearGradient
+       id="linearGradient6206">
+      <stop
+         style="stop-color:#d7d7d7;stop-opacity:1"
+         offset="0"
+         id="stop6202" />
+      <stop
+         style="stop-color:#4c4c4c;stop-opacity:1"
+         offset="1"
+         id="stop6204" />
+    </linearGradient>
+  </defs>
+  <g
+     id="g918">
+    <g
+       id="g893">
+      <path
+         inkscape:connector-curvature="0"
+         style="fill:none;fill-opacity:1;stroke:#969696;stroke-width:3.1280489;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path1386"
+         d="m 104.06408,16.496372 a 7.2094553,6.7982272 0 0 1 7.20945,-6.7982262 7.2094553,6.7982272 0 0 1 7.20946,6.7982262" />
+      <path
+         inkscape:connector-curvature="0"
+         style="fill:none;fill-opacity:1;stroke:#c8c8c8;stroke-width:2.5352881;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path1388"
+         d="m 107.95947,16.496372 a 3.314066,2.7867174 0 0 1 3.31406,-2.786717 3.314066,2.7867174 0 0 1 3.31407,2.786717" />
+      <path
+         inkscape:connector-curvature="0"
+         style="fill:none;fill-opacity:1;stroke:#666666;stroke-width:3.17744565;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path1390"
+         d="m 100.02466,16.496372 c 0,-5.526526 4.04485,-10.1152945 9.35628,-11.0085272 0.61531,-0.103477 1.24761,-0.1573592 1.8926,-0.1573592 6.21258,2e-7 11.24887,4.9991374 11.24887,11.1658864" />
+    </g>
+    <path
+       inkscape:connector-curvature="0"
+       d="M 0.57789849,0.657233 V 6.093464 H 2.2138231 c 0.6431799,0 0.9646512,-0.3404963 0.9646512,-1.0120708 V 3.2217406 H 11.34179 c 2.384134,0 3.576082,1.2667228 3.576082,3.7205323 V 8.9650453 H 3.1784743 l 3.65e-4,1.2277077 c 0,0.66827 -0.3245409,1.011882 -0.9646512,1.011882 H -2.383387e-6 v 3.323059 c 0,3.323059 1.661569083387,4.984706 5.020742883387,4.984706 h 6.6463525 c 3.90086,0 5.887755,-2.022749 5.887755,-6.032205 V 6.6896273 c 0,-4.0094332 -1.986895,-6.0322056 -5.887755,-6.0322056 z M 7.4177998,11.204682 h 1.7645555 c 1.1886477,0 1.6408777,0.610278 1.6408777,1.748931 v 2.662177 c 0,0.904111 -0.453413,1.372936 -1.3397036,1.372936 H 8.5731636 c -0.7678031,0 -1.1553638,-0.454357 -1.1553638,-1.356343 v -4.427678"
+       fill="#00000"
+       id="path4"
+       style="stroke-width:0.02360294;fill:#666666;fill-opacity:1" />
+    <g
+       id="g898">
+      <path
+         inkscape:connector-curvature="0"
+         id="path819-2"
+         style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:0.34375513;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="M 149.55354,3.055558e-7 C 153.18984,9.5785361 160.46243,12.061863 162.85707,17.560651 M 149.55354,3.055558e-7 C 146.71546,12.682693 154.52019,15.69816 155.58447,16.496373 c 3.37023,1.596419 7.2726,1.064278 7.2726,1.064278" />
+      <path
+         id="path819"
+         style="fill:#c8c8c8;fill-opacity:1;stroke:none;stroke-width:0.34375513;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="M 149.55354,3.055558e-7 C 153.18984,9.5785361 160.46243,12.061862 162.85707,17.560651 m 0,0 c 0,0 0,0 0,0 C 164.76913,1.6228004 152.98553,3.1007976 149.55354,3.055558e-7 v 0 c 0,0 0,0 0,0"
+         inkscape:connector-curvature="0" />
+      <path
+         inkscape:connector-curvature="0"
+         id="path825"
+         d="m 162.31484,16.903962 c 2.2626,4.581753 0.19271,4.728403 0.19271,4.728403"
+         style="fill:none;stroke:#969696;stroke-width:0.48503193;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+    <g
+       id="g8-3"
+       transform="matrix(0.31861296,0,0,-0.31861296,-41.896402,20.888893)">
+      <g
+         id="layer1-2"
+         transform="matrix(2.0600602,0,0,-1.954417,280.47242,579.78551)">
+        <g
+           id="g61"
+           transform="rotate(-45,12.388336,277.04149)">
+          <g
+             id="g112">
+            <g
+               id="g120">
+              <g
+                 id="g125">
+                <path
+                   id="path26-6"
+                   transform="rotate(-90)"
+                   style="fill:url(#linearGradient6210);fill-opacity:1;stroke-width:0.421325"
+                   d="m -262.5319,13.229773 a 11.083057,10.010504 0 0 1 -11.08306,10.010503 11.083057,10.010504 0 0 1 -11.08306,-10.010503 11.083057,10.010504 0 0 1 11.08306,-10.0105042 11.083057,10.010504 0 0 1 11.08306,10.0105042 z m -21.09353,21.093558 a 10.010503,11.083056 0 0 1 -10.0105,-11.083057 10.010503,11.083056 0 0 1 10.0105,-11.083056 10.010503,11.083056 0 0 1 10.01051,11.083056 10.010503,11.083056 0 0 1 -10.01051,11.083057 z M -273.61496,3.2192702 V 23.240276 h -20.02098 V 3.2192702 Z"
+                   inkscape:connector-curvature="0" />
+              </g>
+            </g>
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/public/img/stopwords-icon-help.svg b/public/img/stopwords-icon-help.svg
new file mode 100644
index 0000000000000000000000000000000000000000..68d2e48eee79308ab24552a824c1bf582bb05d27
--- /dev/null
+++ b/public/img/stopwords-icon-help.svg
@@ -0,0 +1,117 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="43.154655"
+   height="37.588097"
+   viewBox="0 0 11.418003 9.9451843"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="Stopwords-icon-help.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <metadata
+     id="metadata16">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="833"
+     inkscape:window-height="480"
+     id="namedview14"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:zoom="6.66"
+     inkscape:cx="40.527212"
+     inkscape:cy="14.59015"
+     inkscape:window-x="2390"
+     inkscape:window-y="182"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg5" />
+  <defs
+     id="defs2" />
+  <path
+     inkscape:connector-curvature="0"
+     id="path1594"
+     d="M 2.7992253,0.1533918 H 5.4450586 L 8.0908912,2.7992253 V 5.4450587 L 5.4450586,8.0908917 H 2.7992253 L 0.1533921,5.4450587 V 2.7992253 Z"
+     style="fill:#666666;fill-opacity:1;stroke:#ffffff;stroke-width:0.16500001;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     inkscape:connector-curvature="0"
+     id="path1594-5"
+     d="M 2.7771766,0.0872458 H 5.4671071 L 8.1570372,2.7771764 V 5.4671057 L 5.4671071,8.1570377 H 2.7771766 L 0.0872461,5.4671057 V 2.7771764 Z"
+     style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:0.0354542;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     inkscape:connector-curvature="0"
+     id="path1594-5-3"
+     d="M 2.759761,0.035 H 5.4845221 L 8.2092832,2.7597611 V 5.4845217 L 5.4845221,8.2092837 H 2.759761 L 0.035,5.4845217 V 2.7597611 Z"
+     style="fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:0.07;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <g
+     aria-label="STOP"
+     style="font-style:normal;font-weight:normal;font-size:2.11666989px;line-height:1.25;font-family:sans-serif;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.26458299"
+     id="text9507">
+    <path
+       d="M 2.4318024,3.4002215 V 3.603827 q -0.1188559,-0.056844 -0.224276,-0.08475 -0.1054201,-0.027905 -0.2036055,-0.027905 -0.1705325,0 -0.2635502,0.066146 -0.091984,0.066146 -0.091984,0.1881025 0,0.1023195 0.060978,0.1550295 0.062012,0.051677 0.2335778,0.083716 l 0.1260907,0.025838 q 0.2335779,0.044442 0.3441656,0.1570965 0.1116213,0.1116213 0.1116213,0.2997238 0,0.2242761 -0.1508955,0.3400315 -0.1498618,0.1157553 -0.4402838,0.1157553 -0.1095542,0 -0.2335779,-0.024805 Q 1.5770729,4.8730021 1.4447811,4.8244262 V 4.6094519 q 0.1271242,0.071314 0.2490808,0.1074871 0.1219565,0.036174 0.239779,0.036174 0.1788007,0 0.2759525,-0.07028 0.097152,-0.07028 0.097152,-0.2005048 0,-0.1136884 -0.07028,-0.1777672 Q 2.1672187,4.2404816 2.008055,4.2084422 L 1.8809308,4.1836374 Q 1.647353,4.1371286 1.5429664,4.0379097 1.4385799,3.9386908 1.4385799,3.7619571 q 0,-0.204639 0.1436607,-0.3224614 0.1446942,-0.1178225 0.3979091,-0.1178225 0.1085207,0 0.2211755,0.019637 0.1126548,0.019637 0.2304772,0.058911 z"
+       style="font-size:2.11666989px;fill:#ffffff;fill-opacity:1;stroke-width:0.26458299"
+       id="path15" />
+    <path
+       d="M 2.6364414,3.3495785 H 3.9417901 V 3.5252787 H 3.3940191 V 4.8926392 H 3.1842125 V 3.5252787 H 2.6364414 Z"
+       style="font-size:2.11666989px;fill:#ffffff;fill-opacity:1;stroke-width:0.26458299"
+       id="path17" />
+    <path
+       d="m 4.7696478,3.4911722 q -0.2273766,0 -0.3617355,0.1694989 -0.1333254,0.169499 -0.1333254,0.461988 0,0.2914556 0.1333254,0.4609545 0.1343589,0.169499 0.3617355,0.169499 0.2273767,0 0.3596686,-0.169499 0.1333254,-0.1694989 0.1333254,-0.4609545 0,-0.292489 -0.1333254,-0.461988 Q 4.9970245,3.4911722 4.7696478,3.4911722 Z m 0,-0.169499 q 0.3245285,0 0.5188322,0.2180749 0.1943037,0.2170413 0.1943037,0.582911 0,0.3648362 -0.1943037,0.5829111 -0.1943037,0.2170413 -0.5188322,0.2170413 -0.325562,0 -0.5208992,-0.2170413 -0.1943037,-0.2170414 -0.1943037,-0.5829111 0,-0.3658697 0.1943037,-0.582911 0.1953372,-0.2180749 0.5208992,-0.2180749 z"
+       style="font-size:2.11666989px;fill:#ffffff;fill-opacity:1;stroke-width:0.26458299"
+       id="path19" />
+    <path
+       d="M 6.0181525,3.5211446 V 4.100955 h 0.2625167 q 0.1457278,0 0.2253096,-0.075448 0.079582,-0.075448 0.079582,-0.2149743 0,-0.138493 -0.079582,-0.2139407 Q 6.426397,3.5211446 6.2806692,3.5211446 Z M 5.8093794,3.3495785 h 0.4712898 q 0.2594161,0 0.391708,0.1178225 0.1333254,0.1167889 0.1333254,0.343132 0,0.2284102 -0.1333254,0.3451991 Q 6.5400853,4.272521 6.2806692,4.272521 H 6.0181525 V 4.8926392 H 5.8093794 Z"
+       style="font-size:2.11666989px;fill:#ffffff;fill-opacity:1;stroke-width:0.26458299"
+       id="path21" />
+  </g>
+  <g
+     style="stroke:#b3b3b3"
+     transform="matrix(0.24364126,0,0,0.24364126,5.1151339,3.7362456)"
+     id="layer1-4">
+    <g
+       style="stroke:#b3b3b3"
+       transform="matrix(0.10921535,0.03001484,-0.03001484,0.10921535,4.9673534,-3.6991722)"
+       id="g2304">
+      <circle
+         r="65.003975"
+         cy="109.23066"
+         cx="77.631805"
+         id="path2298"
+         style="fill:none;fill-opacity:1;stroke:#b3b3b3;stroke-width:17.42499924;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <rect
+         transform="matrix(0.44288089,-0.89658046,0.89380692,0.448452,0,0)"
+         y="179.48938"
+         x="-75.480446"
+         height="104.90914"
+         width="18.880049"
+         id="rect2300"
+         style="fill:#b3b3b3;fill-opacity:1;stroke:#b3b3b3;stroke-width:15.41429996;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+  </g>
+</svg>
diff --git a/public/img/suchwortasso.svg b/public/img/suchwortasso.svg
new file mode 100644
index 0000000000000000000000000000000000000000..8fac39a9e0e7f38e52615009bbbc7c66f0d3323a
--- /dev/null
+++ b/public/img/suchwortasso.svg
@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="22.822979mm"
+   height="22.036577mm"
+   viewBox="0 0 22.822979 22.036577"
+   version="1.1"
+   id="svg830"
+   sodipodi:docname="suchwortasso.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     id="namedview8"
+     showgrid="true"
+     inkscape:zoom="8.02"
+     inkscape:cx="31.781574"
+     inkscape:cy="41.492428"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg830">
+    <inkscape:grid
+       type="xygrid"
+       id="grid815" />
+  </sodipodi:namedview>
+  <defs
+     id="defs824" />
+  <metadata
+     id="metadata827">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <circle
+     transform="rotate(15.366797)"
+     style="fill:none;fill-opacity:1;stroke:#969696;stroke-width:1.97363663;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     id="path2298"
+     cx="10.263864"
+     cy="5.8385634"
+     r="7.3626533" />
+  <rect
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:1.74589539;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     id="rect2300"
+     width="2.1384423"
+     height="11.882497"
+     x="-2.0498953"
+     y="18.755049"
+     transform="matrix(0.66463899,-0.74716465,0.74301394,0.66927594,0,0)" />
+  <text
+     xml:space="preserve"
+     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:12.69999981px;line-height:1.25;font-family:'Liberation Sans';-inkscape-font-specification:'Liberation Sans';letter-spacing:0px;word-spacing:0px;fill:#969696;fill-opacity:1;stroke:#969696;stroke-width:0.396875;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;"
+     x="4.0749793"
+     y="12.204106"
+     id="text819"><tspan
+       sodipodi:role="line"
+       id="tspan817"
+       x="4.0749793"
+       y="12.204106"
+       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:12.69999981px;font-family:'Liberation Sans';-inkscape-font-specification:'Liberation Sans';fill:#969696;fill-opacity:1;stroke-width:0.396875;stroke-miterlimit:4;stroke-dasharray:none;stroke:#969696;stroke-opacity:1;">A</tspan></text>
+</svg>
diff --git a/public/img/tor-icon.svg b/public/img/tor-icon.svg
new file mode 100644
index 0000000000000000000000000000000000000000..62f6dfeb5bd43996a1566059f53f26fe1e10078e
--- /dev/null
+++ b/public/img/tor-icon.svg
@@ -0,0 +1,82 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="150.8125mm"
+   height="81.726486mm"
+   viewBox="0 0 150.8125 81.726486"
+   version="1.1"
+   id="svg8"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
+   sodipodi:docname="Tor-Logo.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.73228114"
+     inkscape:cx="356.85039"
+     inkscape:cy="181.25983"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:window-width="1920"
+     inkscape:window-height="1015"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1">
+    <inkscape:grid
+       type="xygrid"
+       id="grid847"
+       originx="-10.583333"
+       originy="-100.54167" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-10.583333,-100.54167)">
+    <path
+       style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 10.583333,100.54167 h 58.208333 v 23.8125 H 51.878 v 55.56249 H 28.031 V 124.35417 H 10.583333 Z"
+       id="path849"
+       sodipodi:nodetypes="ccccccccc" />
+    <path
+       style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 129.64583,179.91666 0.11212,-32.88903 c -0.2719,-15.67372 7.84476,-20.95323 13.11705,-22.67346 12.23641,-3.99246 18.52083,0 18.52083,0 v 21.16666 c 0,0 -6.97965,-3.89003 -9.47139,3.04079 -2.00157,5.5674 -1.11194,31.35504 -1.11194,31.35504 z"
+       id="path851"
+       sodipodi:nodetypes="ccsccscc" />
+    <circle
+       style="opacity:0.729;fill:#969696;fill-opacity:1;stroke:none;stroke-width:1.465"
+       id="path853"
+       cx="93.55249"
+       cy="152.12317"
+       r="30.144991" />
+  </g>
+</svg>
diff --git a/public/img/url-icon-help.svg b/public/img/url-icon-help.svg
new file mode 100644
index 0000000000000000000000000000000000000000..d7ac986228b32dfa40df73f65a21ca1ce039efe0
--- /dev/null
+++ b/public/img/url-icon-help.svg
@@ -0,0 +1,114 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="40.711807"
+   height="45.999996"
+   viewBox="0 0 10.771665 12.170832"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1 (c68e22c387, 2021-05-23)"
+   sodipodi:docname="URL-icon-hilfe-durchgestrichen.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#999999"
+     borderopacity="1"
+     inkscape:pageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="true"
+     units="px"
+     inkscape:snap-global="true"
+     inkscape:zoom="11.693048"
+     inkscape:cx="28.692261"
+     inkscape:cy="21.380224"
+     inkscape:window-width="1368"
+     inkscape:window-height="850"
+     inkscape:window-x="-6"
+     inkscape:window-y="-6"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="rect11612"
+     showguides="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0">
+    <inkscape:grid
+       type="xygrid"
+       id="grid9"
+       originx="-2.5897924"
+       originy="-2.5135414" />
+  </sodipodi:namedview>
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-2.5897933,-2.5135418)">
+    <g
+       id="rect11612"
+       transform="rotate(70.376371)">
+      <path
+         style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 3.8250262,-2.8496647 2.221442,-6.230402 3.3807375,-1.6035843 8.7225623,3.1100191 L 15.03975,1.1489309 11.550725,-0.09507657 11.106436,1.1510038 8.7031331,0.01321094 8.8093477,-1.0725111 8.3109155,-1.2502265 3.8250262,-2.8496647"
+         id="path13212"
+         sodipodi:nodetypes="ccccccccccc" />
+      <g
+         id="g12875">
+        <path
+           style="fill:none;stroke:#000000;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+           d="m 10.583333,2.6458333 c 0,0 0.379222,1.2974903 0.337086,2.4351548 1.432615,-0.042136 2.308748,0.2106785 2.308748,0.2106785"
+           id="path79"
+           sodipodi:nodetypes="ccc"
+           transform="rotate(-70.376371)" />
+        <g
+           id="g9176"
+           transform="rotate(-70.376371,-2.3965864,-0.78176343)">
+          <g
+             id="rect1274">
+            <path
+               style="color:#000000;fill:#000000;stroke-width:0.0878021;-inkscape-stroke:none"
+               d="M 0.69464284,9.6756744 H 6.5432596 c 0.2155516,0 0.3890823,0.1735308 0.3890823,0.3890826 v 2.275797 c 0,0.215551 -0.1735307,0.389082 -0.3890823,0.389082 H 0.69464284 c -0.21555163,0 -0.38908237,-0.173531 -0.38908237,-0.389082 v -2.275797 c 0,-0.2155518 0.17353074,-0.3890826 0.38908237,-0.3890826 z"
+               id="path11277" />
+            <path
+               style="color:#000000;fill:#000000;-inkscape-stroke:none"
+               d="m 0.6953125,9.6308594 c -0.23911321,0 -0.43359375,0.1944805 -0.43359375,0.4335936 v 2.275391 c 0,0.239113 0.19448054,0.433594 0.43359375,0.433594 h 5.8476562 c 0.2391133,0 0.4335938,-0.194481 0.4335938,-0.433594 v -2.275391 c 0,-0.2391131 -0.1944805,-0.4335936 -0.4335938,-0.4335936 z m 0,0.087891 h 5.8476562 c 0.1919897,0 0.3457032,0.1537135 0.3457032,0.3457026 v 2.275391 c 0,0.191989 -0.1537135,0.345703 -0.3457032,0.345703 H 0.6953125 c -0.19198963,0 -0.34570312,-0.153714 -0.34570312,-0.345703 v -2.275391 c 0,-0.1919891 0.15371349,-0.3457026 0.34570312,-0.3457026 z"
+               id="path11279" />
+          </g>
+          <g
+             aria-label="URL"
+             id="text7394"
+             style="font-size:3.05476px;line-height:1.25;fill:#ffffff;stroke-width:0.0763694">
+            <path
+               d="M 0.72975678,10.067562 H 1.0325479 v 1.352865 q 0,0.357979 0.1297677,0.516087 0.1297676,0.156616 0.4206261,0.156616 0.2893669,0 0.4191345,-0.156616 0.1297677,-0.158108 0.1297677,-0.516087 V 10.067562 H 2.434635 v 1.390154 q 0,0.435542 -0.2162794,0.657788 -0.2147878,0.222246 -0.6354139,0.222246 -0.4221177,0 -0.63839711,-0.222246 -0.21478781,-0.222246 -0.21478781,-0.657788 z"
+               id="path11283" />
+            <path
+               d="m 4.0559848,11.250386 q 0.096953,0.03281 0.1879393,0.140209 0.092478,0.107394 0.1849562,0.295333 l 0.3057743,0.608566 H 4.4109813 L 4.1260892,11.723218 Q 4.0157121,11.49948 3.9113014,11.426393 3.8083822,11.353305 3.6293924,11.353305 H 3.3012443 v 0.941189 H 2.9999447 v -2.226932 h 0.6801614 q 0.381845,0 0.5697844,0.159599 0.1879393,0.159599 0.1879393,0.481781 0,0.210313 -0.098444,0.34903 -0.096953,0.138717 -0.283401,0.192414 z M 3.3012443,10.315164 v 0.790539 h 0.3788618 q 0.217771,0 0.3281481,-0.09994 0.1118686,-0.101428 0.1118686,-0.296825 0,-0.195397 -0.1118686,-0.293842 -0.1103771,-0.09994 -0.3281481,-0.09994 z"
+               id="path11285" />
+            <path
+               d="m 5.1224659,10.067562 h 0.3012996 v 1.973363 h 1.0843801 v 0.253569 H 5.1224659 Z"
+               id="path11287" />
+          </g>
+        </g>
+        <path
+           style="fill:none;stroke:#000000;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+           d="M 3.96875,7.415162 V 2.6458333 h 6.614583 l 2.645834,2.6458333 V 14.552083 H 3.96875 v -1.322916 -1.744274"
+           id="path9404"
+           sodipodi:nodetypes="cccccccc"
+           transform="rotate(-70.376371)" />
+        <path
+           style="fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+           d="M 11.179613,1.1399818 10.641222,-6.0551675"
+           id="path12060"
+           sodipodi:nodetypes="cc" />
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/public/img/widget.svg b/public/img/widget.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4871dc1831ba679d5c34983c2f07893e79221523
--- /dev/null
+++ b/public/img/widget.svg
@@ -0,0 +1,105 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="svg1085"
+   version="1.1"
+   viewBox="0 0 29.150677 8.8851613"
+   height="33.581711"
+   width="110.17579"
+   sodipodi:docname="widget.svg"
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1848"
+     inkscape:window-height="1016"
+     id="namedview10"
+     showgrid="true"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:snap-global="false"
+     inkscape:zoom="6.6449955"
+     inkscape:cx="36.038419"
+     inkscape:cy="15.189796"
+     inkscape:window-x="1992"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1085">
+    <inkscape:grid
+       type="xygrid"
+       id="grid817"
+       originx="-0.39601618"
+       originy="-8.9604158" />
+  </sodipodi:namedview>
+  <defs
+     id="defs1079" />
+  <metadata
+     id="metadata1082">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     aria-label="&lt;   /&gt;"
+     style="font-style:normal;font-weight:normal;font-size:10.58333397px;line-height:1.25;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#969696;fill-opacity:1;stroke:none;stroke-width:0.26458335"
+     id="text839">
+    <path
+       d="M 6.624919,2.5063073 1.2919109,4.4028325 6.624919,6.2890224 V 7.2295335 L -1.2107193e-8,4.8265792 V 3.9687504 L 6.624919,1.5657962 Z"
+       style="fill:#969696;fill-opacity:1;stroke-width:0.26458335"
+       id="path820" />
+    <path
+       d="M 20.525881,1.7229468e-7 H 21.40438 L 18.717206,8.6971442 h -0.8785 z"
+       style="fill:#969696;fill-opacity:1;stroke-width:0.26458335"
+       id="path822" />
+    <path
+       d="M 22.525759,2.5063073 V 1.5657962 l 6.624919,2.4029542 V 4.8265792 L 22.525759,7.2295335 V 6.2890224 l 5.322673,-1.8861899 z"
+       style="fill:#969696;fill-opacity:1;stroke-width:0.26458335"
+       id="path824" />
+  </g>
+  <circle
+     r="2.9484577"
+     cy="0.40367529"
+     cx="11.376951"
+     id="path2298"
+     style="fill:none;fill-opacity:1;stroke:#969696;stroke-width:0.7903651;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     transform="rotate(15.366797)" />
+  <rect
+     transform="matrix(0.66463899,-0.74716465,0.74301394,0.66927594,0,0)"
+     y="13.169208"
+     x="4.1669655"
+     height="4.7584801"
+     width="0.85636342"
+     id="rect2300"
+     style="fill:#969696;fill-opacity:1;stroke:none;stroke-width:0.69916356;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <flowRoot
+     xml:space="preserve"
+     id="flowRoot829"
+     style="font-style:normal;font-weight:normal;font-size:40px;line-height:1.25;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+     transform="matrix(0.26458334,0,0,0.26458334,-0.39601621,-8.75026)"><flowRegion
+       id="flowRegion831"><rect
+         id="rect833"
+         width="105"
+         height="55"
+         x="5"
+         y="15.519691" /></flowRegion><flowPara
+       id="flowPara835" /></flowRoot></svg>
diff --git a/resources/lang/de/help/help-functions.php b/resources/lang/de/help/help-functions.php
new file mode 100644
index 0000000000000000000000000000000000000000..5c5d837952a0c74ee52ac6bb881e9efc46fb51d9
--- /dev/null
+++ b/resources/lang/de/help/help-functions.php
@@ -0,0 +1,39 @@
+<?php
+
+return [
+    'title' => 'MetaGer - Hilfe',
+    "backarrow" => ' Zurück',
+    "suchfunktion.title" => "Suchfunktionen",
+    "stopworte.title" => 'Stoppworte',
+    "stopworte.1" => "Wenn Sie unter den MetaGer-Suchergebnissen solche ausschließen wollen, in denen bestimmte Worte (Ausschlussworte / Stoppworte) vorkommen, dann erreichen Sie das, indem Sie diese Worte mit einem Minus versehen.",
+    "stopworte.2" => "Beispiel: Sie suchen ein neues Auto, aber auf keinen Fall einen BMW. Ihre Eingabe lautet also:",
+    "stopworte.3" => "auto neu -bmw",
+
+    "mehrwortsuche.title" => "Mehrwortsuche",
+    "mehrwortsuche.1" => "Wenn Sie bei MetaGer nach mehr als einem Wort suchen, versuchen wir automatisch, Ihnen Ergebnisse zu liefern, in denen alle Wörter vorkommen, oder die diesen möglichst nahe kommen.",
+    "mehrwortsuche.2" => "Sollte Ihnen das nicht ausreichen, haben Sie 2 Möglichkeiten, Ihre Suche genauer zu machen:",
+    "mehrwortsuche.3" => "Wenn Sie sicher gehen wollen, dass Wörter aus Ihrer Suche auch in den Ergebnissen vorkommen, dann müssen Sie diese in Anführungszeichen setzen.",
+    "mehrwortsuche.3.example" => '"der" "runde" "tisch"',
+    "mehrwortsuche.4" => "Mit einer Phrasensuche können Sie statt nach einzelnen Wörtern auch nach Wortkombinationen suchen. Setzen Sie dazu einfach diejenigen Wörter, die gemeinsam vorkommen sollen, in Anführungszeichen.",
+    "mehrwortsuche.4.example" => '"der runde tisch"',
+
+
+    'urls.title' => 'URLs ausschließen',
+    'urls.explanation' => 'Sie können Suchergebnisse ausschließen, deren Ergebnislinks bestimmte Worte enthalten, indem Sie in ihrer Suche "-url:" verwenden.',
+    'urls.example.1' => 'Beispiel: Sie möchten keine Ergebnisse, bei denen im Ergebnislink das Wort "Hund" auftaucht:',
+    'urls.example.2' => '<i>meine suche</i> -url:hund',
+
+    "bang.title" => "!bangs",
+    "bang.1" => "MetaGer unterstützt in geringem Umfang eine Schreibweise, die oft als „!bang“-Syntax bezeichnet wird.<br>Ein solches „!bang“ beginnt immer mit einem Ausrufezeichen und enthält keine Leerzeichen. Beispiele sind hier „!twitter“ oder „!facebook“.<br>Wird ein !bang, das wir unterstützen, in der Suchanfrage verwendet, erscheint in unseren Quicktips ein Eintrag, über den man die Suche auf Knopfdruck mit dem jeweiligen Dienst (hier Twitter oder Facebook) fortführen kann.",
+    'faq.18.h' => 'Warum werden !bangs nicht direkt geöffnet?',
+    'faq.18.b' => 'Die !bang-„Weiterleitungen“ sind bei uns ein Teil unserer Quicktips und benötigen einen zusätzlichen „Klick“. Das war für uns eine schwierige Entscheidung, da die !bang dadurch weniger nützlich sind. Jedoch ist es leider nötig, da die Links, auf die weitergeleitet wird, nicht von uns stammen, sondern von einem Drittanbieter, DuckDuckGo.<p>Wir achten stehts darauf, dass unsere Nutzer jederzeit die Kontrolle behalten. Wir schützen daher auf zwei Arten: Zum Einen wird der eingegebene Suchbegriff niemals an DuckDuckGo übertragen, sondern nur das !bang. Zum Anderen bestätigt der Nutzer den Besuch des !bang-Ziels explizit. Leider können wir derzeit aus Personalgründen nicht alle diese !bangs prüfen oder selbst pflegen.',
+
+    "searchinsearch.title" => "Suche in der Suche",
+    "searchinsearch.1" => 'Auf die Funktion der Suche in der Suche kann mit Hilfe des "MEHR"-Knopfes rechts unten im Ergebniskasten zugegriffen werden. Beim Klick auf diesen öffnet sich ein Menü, in dem "Ergebnis speichern" an erster Stelle steht. Mit dieser Option wird das jeweilige Ergebnis in einem separaten Speicher abgelegt. Der Inhalt dieses Speichers wird rechts neben den Ergebnissen unter den Quicktips angezeigt (Auf zu kleinen Bildschirmen werden gespeicherte Ergebnisse aus Platzmangel nicht angezeigt). Dort können Sie die gespeicherten Ergebnisse nach Schlüsselworten filtern oder umsortieren lassen. Mehr Infos zum Thema "Suche in der Suche" gibt es im <a href="http://blog.suma-ev.de/node/225" target="_blank" rel="noopener"> SUMA-Blog</a>.',
+    
+
+    'selist.title' => 'MetaGer zur Suchmaschinenliste des Browsers hinzufügen',
+    'selist.explanation.1' => 'Versuchen Sie bitte zuerst, das aktuelle Plugin zu installieren. Zum Installieren einfach auf den Link direkt unter dem Suchfeld klicken. Dort sollte Ihr Browser schon erkannt worden sein.',
+    'selist.explanation.2' => 'Manche Browser erwarten die Eingabe einer URL; diese lautet "https://metager.de/meta/meta.ger3?eingabe=%s" ohne Gänsefüßchen eintragen. Die URL können Sie selbst erzeugen, wenn Sie mit metager.de nach irgendetwas suchen und dann das, was oben im Adressfeld hinter "eingabe=" steht, mit %s ersetzen. Wenn Sie dann noch Probleme haben sollten, wenden Sie sich bitte an uns: <a href="/kontakt" target="_blank" rel="noopener">Kontaktformular</a>',
+    
+];
\ No newline at end of file
diff --git a/resources/lang/de/help/help-mainpages.php b/resources/lang/de/help/help-mainpages.php
new file mode 100644
index 0000000000000000000000000000000000000000..2216d60f6232dcec39d7f5d16c998b3023a904ab
--- /dev/null
+++ b/resources/lang/de/help/help-mainpages.php
@@ -0,0 +1,44 @@
+<?php
+
+return [
+    "title"                 => 'MetaGer - Hilfe',
+    "backarrow"             => ' Zurück',
+    "title.2"               => 'Die Benutzung der Hauptseiten',
+    "startpage.title"       => 'Die Startseite',
+    "startpage.info"        => 'Die Startseite beinhaltet das Suchfeld, oben rechts einen Button zum Aufrufen des Menus und unter dem Suchfeld einen Link, mit dem Sie MetaGer zu Ihrem Browser hinzufügen können. Im unteren Bereich finden Sie Informationen zu MetaGer und dem Trägerverein SUMA-EV. Zusätzlich werden unten unsere Schwerpunkte <i>Garantierte Privatsphäre, Gemeinnütziger Verein, Vielfältig & Frei</i> und <i>100% Ökostrom</i> angezeigt. Durch einen Klick auf die entsprechenden Bereiche oder durch Scrollen können mehr Informationen gefunden werden. ',
+    "searchfield.title"     => 'Das Suchfeld',
+    "searchfield.info"      => 'Das Suchfeld besteht aus mehreren Teilen:',
+    "searchfield.memberkey" => 'dem Schlüsselsymbol: Hier können Mitglieder des SUMA-EV oder Spender Ihren Schlüssel eingeben, um die werbefreie Suche nutzen zu können. Sie wollen das auch? Werden Sie Mitglied über unser <a href = "/beitritt/">Beitrittsformular</a> oder <a href = "/spende/">spenden</a> Sie an den SUMA-EV.',
+    "searchfield.slot"      => 'dem Suchfeld: Geben Sie hier Ihren Suchbegriff ein. Groß- und Kleinschreibung wird nicht unterschieden.',
+    "searchfield.search"    => 'der Lupe: Starten Sie hier die Suche mit einem Klick oder drücken Sie "Enter".',
+    "searchfield.morefunctions" => 'Weitere Funktionen finden sie unter dem Menüpunkt "<a href = "/hilfe/funktionen">Suchfunktionen</a>"',
+
+    "resultpage.title"      => 'Die Ergebnisseite',
+    "resultpage.foci"       => 'Unter dem Suchfeld sind 6 verschiedene Suchfokusse (drei im englischsprachigen Bereich) (Web, Bilder…...) abgebildet, bei denen intern auch spezifische Suchmaschinen zugeordnet sind.',
+    "resultpage.choice"     => 'Darunter sehen Sie zwei Punkte: gegebenenfalls „Filter“ sowie „Einstellungen“',
+    "resultpage.filter"     => 'Filter: Hier können Sie Filtermöglichkeiten ein- und ausblenden und Filter anwenden. In jedem Suchfokus haben Sie hier andere Auswahlmöglichkeiten.',
+    "resultpage.settings" => 'Einstellungen: Hier können Sie dauerhafte Sucheinstellungen für Ihre MetaGer-Suche im aktuellen Fokus vornehmen. Sie können auch Suchmaschinen, die dem Fokus zugeordnet sind, an- und abwählen. Ihre Einstellungen werden mithilfe eines nicht personenbeziehbaren Klartextcookies gespeichert. Die Einstellungsseite erreichen Sie auch über das Menu oben rechts.',
+   
+    "result.title" => 'Ergebnisse',
+    "result.info.1" => 'Alle Ergebnisse werden in folgender Form ausgegeben:<p><div class="image-container"><img src="/img/hilfe-php-resultpic-01.png"></div></p>',
+    "result.info.open" => '"ÖFFNEN": Klicken Sie auf die Überschrift, den darunter stehenden Link (die URL) oder auch auf den Button "ÖFFNEN", um das Ergebnis im selben Tab zu öffnen.',
+    "result.info.newtab" => '"IN NEUEM TAB ÖFFNEN" öffnet das Ergebnis in einem neuen Tab.',
+    "result.info.anonym" => '"ANONYM ÖFFNEN" bewirkt, dass das Ergebnis unter dem Schutz unseres Proxys geöffnet wird. Einige Infos dazu finden Sie im Bereich <a href = "/hilfe/datensicherheit#proxy/">Anonymisierender MetaGer Proxyserver.</a>',
+    "result.info.more" => 'MEHR: Wenn Sie auf „MEHR“ klicken, dann erhalten Sie neue Optionen; das Aussehen des Ergebnisses ändert sich:<p><div class="image-container"><img src="/img/hilfe-php-resultpic-02.png"></div></p>',
+    "result.info.2" => 'Die neuen Optionen sind:',
+    "result.info.saveresult" => '"Ergebnis speichern" (Nur Desktopversion): Dieses Ergebnis wird in einem Sammeltab gespeichert. Der TAB erscheint rechts und bleibt über beliebig viele Suchen aktiv. (siehe <a href="/hilfe/funktionen#searchinsearch"> Suche in der Suche</a>)',
+    "result.info.domainnewsearch" => '"Auf dieser Domain neu suchen": Auf der Domain des Ergebnisses wird "genauer nachgesehen".',
+    "result.info.hideresult" => '"ausblenden": Hiermit blenden Sie Ergebnisse dieser Domain aus. Sie können diesen Schalter auch direkt hinter Ihr Suchwort schreiben und auch verketten; ebenso ist ein "*" als Wildcard erlaubt. Siehe auch <a href="#einstellungen"> "Einstellungen"</a> für eine dauerhafte Lösung.',
+
+    
+    "settings.title" => 'Einstellungen',
+    "settings.1" => 'Hinweis <br> Unter dem Punkt „Hinweis“ finden Sie einen Link, der Ihnen Ihre gesamten Einstellungen zeigt. Diesen Link können Sie sich <a href=:link>anzeigen lassen</a>. Diese können Sie auch wieder mit einem Klick löschen. Ebenfalls finden Sie auch einen Link, den Sie kopieren und als Bookmark speichern können. Wenn Sie das Bookmark später aufrufen, sind Ihre Einstellungen wieder parat.',
+    "settings.2" => 'Verwendete Suchmaschinen <br> Hier können Sie Ihre verwendeten Suchmaschinen einsehen und gegebenenfalls anpassen. Durch einen Klick auf den entsprechenden Namen kann diese entsprechend ein- oder ausgeschaltet werden.',
+    "settings.3" => 'Suchfilter <br> Durch Suchfilter können Sie Ihre Suche dauerhaft filtern.',
+    "settings.4" => 'Blacklist <br> Hier können Sie sich eine persönliche Blacklist zusammenzustellen. Sie können damit also nicht nur Suchmaschinen, sondern auch spezielle Domains ausfiltern und damit eigene Sucheinstellungen produzieren. Mit einem Klick auf "Hinzufügen" werden diese Einstellungen an den Link im Abschnitt "Hinweis" angehängt.',
+    "settings.5" => 'Dunklen Modus umschalten <br>Schalten Sie hier ganz einfach in den Dark Mode um.',
+    "settings.6" => 'Ergebnisse in neuem Tab öffnen <br> Hier können Sie die Funktion, Ergebnisse im neuen Tab zu öffnen, dauerhaft einschalten.',
+    "settings.7" => 'Zitate <br> Sie können hier die Anzeige der Zitate an- und ausschalten.',
+
+
+];
\ No newline at end of file
diff --git a/resources/lang/de/help/help-privacy-protection.php b/resources/lang/de/help/help-privacy-protection.php
new file mode 100644
index 0000000000000000000000000000000000000000..18a677f7298fec6e9945e9b6b6a795654f63a3ba
--- /dev/null
+++ b/resources/lang/de/help/help-privacy-protection.php
@@ -0,0 +1,28 @@
+<?php
+
+return [
+    "title"                 => 'MetaGer - Hilfe',
+    "backarrow"             => ' Zurück',
+    "datenschutz.title" => "Anonymität und Datensicherheit",
+
+    "datenschutz.1" => 'Tracking-Cookies, Session-IDs und IP-Adressen',
+    "datenschutz.2" => 'Nichts von alldem wird hier bei MetaGer verwendet, gespeichert, aufgehoben oder sonst irgendwie verarbeitet (Ausnahme: Kurzfristige Speicherung gegen Hacking- und Bot-Attacken). Weil wir diese Thematik für extrem wichtig halten, haben wir auch Möglichkeiten geschaffen, die Ihnen helfen können, hier ein Höchstmaß an Sicherheit zu erreichen: den MetaGer-TOR-Hidden-Service und unseren anonymisierenden Proxyserver.',
+    "datenschutz.3" => "Mehr Informationen finden Sie weiter unten. Die Funktionen sind unter \"Dienste\" in der Navigationsleiste erreichbar.",
+
+    "tor.title" => "Tor-Hidden-Service",
+    "tor.1" => "Bei MetaGer werden schon seit vielen Jahren die IP-Adressen ausgeblendet und nicht gespeichert. Nichtsdestotrotz sind diese Adressen auf dem MetaGer-Server zeitweise, während eine Suche läuft, sichtbar: wenn MetaGer also einmal kompromittiert sein sollte, dann könnte dieser Angreifer Ihre Adressen mitlesen und speichern. Um dem höchsten Sicherheitsbedürfnis entgegenzukommen, unterhalten wir eine MetaGer-Instanz im Tor-Netzwerk: den MetaGer-TOR-hidden-Service - erreichbar über: <a href=\"/tor/\" target=\"_blank\" rel=\"noopener\">https://metager.de/tor/</a>. Für die Benutzung benötigen Sie einen speziellen Browser, den Sie auf <a href=\"https://www.torproject.org/\" target=\"_blank\" rel=\"noopener\">https://www.torproject.org/</a> herunter laden können.",
+    "tor.2" => "MetaGer erreichen Sie im Tor-Browser dann unter: http://metagerv65pwclop2rsfzg4jwowpavpwd6grhhlvdgsswvo6ii4akgyd.onion .",
+
+    "proxy.title" => "Anonymisierender MetaGer-Proxyserver",
+    "proxy.1" => "Um ihn zu verwenden, müssen Sie auf der MetaGer-Ergebnisseite nur auf \"ANONYM ÖFFNEN\" am unteren Rand des Ergebnisses klicken. Dann wird Ihre Anfrage an die Zielwebseite über unseren anonymisierenden Proxy-Server geleitet und Ihre persönlichen Daten bleiben weiterhin völlig geschützt. Wichtig: wenn Sie ab dieser Stelle den Links auf den Seiten folgen, bleiben Sie durch den Proxy geschützt. Sie können aber oben im Adressfeld keine neue Adresse ansteuern. In diesem Fall verlieren Sie den Schutz. Ob Sie noch geschützt sind, sehen Sie ebenfalls im Adressfeld. Es zeigt: https://proxy.suma-ev.de/?url=hier steht die eigentlich Adresse.",
+
+    "maps.title" => "MetaGer Maps",
+    "maps.1" => 'Die Sicherung der Privatsphäre im Zeitalter der globalen Datenkraken hat uns auch bewogen, <a href="https://maps.metager.de" target="_blank">https://maps.metager.de</a> zu entwickeln: Der (unseres Wissens) einzige Routenplaner, der die vollen Funktionalitäten via Browser und App bietet - ohne dass Nutzer-Standorte gespeichert werden.  All dies ist nachprüfbar, denn unsere Softwaren sind Open-Source. Für die Nutzung von maps.metager.de empfehlen wir unsere schnelle App-Version. Unsere Apps können Sie unter <a href="/app" target="_blank">App beziehen</a> downloaden (oder natürlich auch über den Play-Store).',
+    "maps.2" => "Diese Kartenfunktion kann auch von der MetaGer-Suche aufgerufen werden (und umgekehrt). Sobald Sie bei MetaGer nach einem Begriff gesucht haben, sehen Sie oben rechts einen neuen Suchfokus \"Maps\".  Beim Klick darauf gelangen Sie zu einer dazugehörigen Karte. .",
+    "maps.3" => "Die Karte zeigt nach dem Aufrufen die auch in der Spalte rechts wiedergegebenen von MetaGer gefundenen Punkte (POIs = Points of Interest). Beim Zoomen passt sich diese Liste an den Kartenausschnitt an.  Wenn Sie die Maus über eine Markierung in der Karte oder in der Liste halten, wird das jeweilige Gegenstück hervorgehoben.  Klicken Sie auf \"Details\", um genauere Informationen zu diesem Punkt aus der darunter liegenden Datenbank zu erhalten.",
+    
+    'content.title' => 'Fragwürdige Inhalte / Jugendschutz',
+    'content.explanation.1' => 'Ich habe "Treffer" erhalten, die finde ich nicht nur ärgerlich, sondern die enthalten meiner Meinung nach illegale Inhalte!',
+    'content.explanation.2' => 'Wenn Sie im Internet etwas finden, das Sie für illegal oder jugendgefährdend halten, dann können Sie sich per Mail an <a href="mailto:hotline@jugendschutz.net" target="_blank" rel="noopener">hotline@jugendschutz.net</a> wenden oder Sie gehen auf <a href="http://www.jugendschutz.net/" target="_blank" rel="noopener">www.jugendschutz.net</a> und füllen das dort zu findende Beschwerdeformular aus. Sinnvoll ist ein kurzer Hinweis, was Sie konkret für unzulässig halten und wie Sie auf dieses Angebot gestoßen sind. Direkt an uns können Sie fragwürdige Inhalte auch melden. Schreiben Sie dazu eine Mail an unseren Jugendschutzbeauftragten (<a href="mailto:jugendschutz@metager.de" target="_blank" rel="noopener">jugendschutz@metager.de</a>).',
+
+];
\ No newline at end of file
diff --git a/resources/lang/de/help/help-services.php b/resources/lang/de/help/help-services.php
new file mode 100644
index 0000000000000000000000000000000000000000..35e9f3b410b39915c8166487865907ae984e019c
--- /dev/null
+++ b/resources/lang/de/help/help-services.php
@@ -0,0 +1,26 @@
+<?php
+
+return [
+    "title"                 => 'MetaGer - Hilfe',
+    "backarrow"             => ' Zurück',
+"dienste" => "Weitere Dienste um die Suche herum",
+    "dienste.kostenlos" => "Selbstverständlich sind all unsere Dienste kostenlos",
+
+    "app.title" => "Android-App",
+    "app.1" => "Sie können MetaGer auch als App nutzen. Laden Sie sich dazu einfach die <a href=\"https://play.google.com/store/apps/details?id=de.metager.metagerapp\" target=\"_blank\" rel=\"noopener\">MetaGer App</a> auf ihr Android Smartphone.",
+    
+    "suchwortassoziator.title" => "Suchwortassoziator",
+    "suchwortassoziator.1" => 'Als Hilfe für die Erschließung eines Begriffsumfelds haben wir den <a href="/asso" target="_blank" rel="noopener">MetaGer-Web-Assoziator</a> entwickelt. Sie finden das Tool auch direkt unter dem Reiter "Dienste". Gibt man in diesen ein Suchwort ein, welches dem zu untersuchenden Fachgebiet irgendwie nahe kommt, dann wird versucht, typische Fachbegriffe dieses Gebietes aus dem WWW zu extrahieren.',
+    "suchwortassoziator.2" => "Beispiel: Sie möchten mehr über Zeckenbisse und deren Gefahren wissen, aber ihnen fallen die medizinischen Fachbegriffe für Erkrankungen aus diesem Bereich nicht mehr ein. Die Eingabe des Wortes \"Zeckenbisse\" in den Web-Assoziator liefert dann u.a. die Begriffe \"Borreliose\" und \"fsme\".",
+    "suchwortassoziator.3" => "Da diese Assoziationsanalyse u.a. aus Web-Dokumenten selber gewonnen wird, ist sie sprachunabhängig; d.h. Sie können bei Eingabe deutscher Wörter Fachbegriffe aus beliebigen Sprachen gewinnen (und umgekehrt). Wenn Ihnen andererseits Assoziationsanalysen auffallen, die mit Hilfe Ihrer Fachkenntnisse besser sein könnten, dann zögern Sie bitte nicht, uns dieses samt Ihrem Verbesserungsvorschlag über <a href=\"/kontakt/\" target=\"_blank\" rel=\"noopener\">unser Kontaktformular</a> mitzuteilen.",
+
+    "widget.title" => "MetaGer Widget",
+    "widget.1" => "Hierbei handelt es sich um einen Codegenerator, der es Ihnen ermöglicht, MetaGer in Ihre Webseite einzubinden. Sie können damit dann nach Belieben auf Ihrer eigenen Seite oder im Internet suchen lassen. Bei allen Fragen: <a href=\"/kontakt/\" target=\"_blank\" rel=\"noopener\">unser Kontaktformular</a>",
+
+    "maps.title" => "MetaGer Maps",
+    "maps.1" => 'Die Sicherung der Privatsphäre im Zeitalter der globalen Datenkraken hat uns auch bewogen, <a href="https://maps.metager.de" target="_blank">https://maps.metager.de</a> zu entwickeln: Der (unseres Wissens) einzige Routenplaner, der die vollen Funktionalitäten via Browser und App bietet - ohne dass Nutzer-Standorte gespeichert werden.  All dies ist nachprüfbar, denn unsere Softwaren sind Open-Source. Für die Nutzung von maps.metager.de empfehlen wir unsere schnelle App-Version. Unsere Apps können Sie unter <a href="/app" target="_blank">App beziehen</a> downloaden (oder natürlich auch über den Play-Store).',
+    "maps.2" => "Diese Kartenfunktion kann auch von der MetaGer-Suche aufgerufen werden (und umgekehrt). Sobald Sie bei MetaGer nach einem Begriff gesucht haben, sehen Sie oben rechts einen neuen Suchfokus \"Maps\".  Beim Klick darauf gelangen Sie zu einer dazugehörigen Karte. .",
+    "maps.3" => "Die Karte zeigt nach dem Aufrufen die auch in der Spalte rechts wiedergegebenen von MetaGer gefundenen Punkte (POIs = Points of Interest). Beim Zoomen passt sich diese Liste an den Kartenausschnitt an.  Wenn Sie die Maus über eine Markierung in der Karte oder in der Liste halten, wird das jeweilige Gegenstück hervorgehoben.  Klicken Sie auf \"Details\", um genauere Informationen zu diesem Punkt aus der darunter liegenden Datenbank zu erhalten.",
+
+
+];
\ No newline at end of file
diff --git a/resources/lang/de/help/help.php b/resources/lang/de/help/help.php
new file mode 100644
index 0000000000000000000000000000000000000000..bc7965865a50114685b8bfdc1d4ab63c91445995
--- /dev/null
+++ b/resources/lang/de/help/help.php
@@ -0,0 +1,35 @@
+<?php
+
+return [
+    "achtung"               => 'Achtung, da unsere Suchmaschine ständig weiterentwickelt und verbessert wird, kann es dazu kommen, dass sich immer wieder Änderungen an Aufbau und Funktion ergeben. Wir versuchen zwar die Hilfe schnellstmöglich den Änderungen entsprechend anzupassen, können jedoch nicht ausschließen, dass es zu temporären Unstimmigkeiten in Teilen der Erklärungen kommt.',
+    "title"                 => 'MetaGer - Hilfe',
+
+    'tableofcontents.title' => '',
+    'tableofcontents.1' => 'Die Hauptseiten',
+    'tableofcontents.1.1' => 'Die Startseite',
+    'tableofcontents.1.2' => 'Das Suchfeld',
+    'tableofcontents.1.3' => 'Die Ergebnisseite',
+    'tableofcontents.1.4' => 'Einstellungen',
+
+
+    'tableofcontents.2' => 'Nützliche Funktionen und Hinweise',
+    'tableofcontents.2.1' => 'Suchfunktionen',
+    'tableofcontents.2.2' => '!bangs',
+    'tableofcontents.2.3' => 'Suche in der Suche',
+    'tableofcontents.2.4' => 'MetaGer hinzufügen',
+
+
+
+    'tableofcontents.4' => 'Weitere Dienste um die Suche herum',
+    'tableofcontents.4.1' => 'Android-App',
+    'tableofcontents.4.3' => 'Suchwortassoziator',
+    'tableofcontents.4.4' => 'MetaGer Widget',
+    'tableofcontents.4.5' => 'MetaGer Maps',
+
+
+    'tableofcontents.3' => 'Funktionen zur Anonymität und Datensicherheit',
+    'tableofcontents.3.2' => 'Cookies & Co.',
+    'tableofcontents.3.3' => 'Tor-Hidden-Service',
+    'tableofcontents.3.4' => 'MetaGer-Proxy',
+    'tableofcontents.3.5' => 'Jugendschutz',
+ ];
diff --git a/resources/lang/de/hilfe.php b/resources/lang/de/hilfe.php
deleted file mode 100644
index 91c8190a385c151b1e91d35fc494696a6ba92404..0000000000000000000000000000000000000000
--- a/resources/lang/de/hilfe.php
+++ /dev/null
@@ -1,129 +0,0 @@
-<?php
-
-return [
-    "achtung"               => 'Achtung, da unsere Suchmaschine ständig weiterentwickelt und verbessert wird, kann es dazu kommen, dass sich immer wieder Änderungen an Aufbau und Funktion ergeben. Wir versuchen zwar die Hilfe schnellstmöglich den Änderungen entsprechend anzupassen, können jedoch nicht ausschließen, dass es zu temporären Unstimmigkeiten in Teilen der Erklärungen kommt.',
-    "title"                 => 'MetaGer - Hilfe',
-
-    "title.2"               => 'Benutzung der Suchmaschine',
-    "startpage.title"       => 'Die Startseite',
-    "startpage.info"        => 'Die Startseite beinhaltet das Suchfeld, oben rechts einen Button zum Aufrufen des Menus und unter dem Suchfeld einen Link, mit dem Sie MetaGer zu Ihrem Browser hinzufügen können. Im unteren Bereich finden Sie Informationen zu MetaGer und dem Trägerverein SUMA-EV.',
-    "searchfield.title"     => 'Das Suchfeld',
-    "searchfield.info"      => 'Das Suchfeld besteht aus mehreren Teilen:',
-    "searchfield.memberkey" => 'dem Schlüsselsymbol (nur für Vereinsmitglieder): Hier können die Mitglieder des SUMA-EV Ihren Schlüssel eingeben, um die werbefreie Suche nutzen zu können. Sie wollen das auch? Werden Sie Mitglied: <a href = "/beitritt/">Beitrittsantrag</a>',
-    "searchfield.slot"      => 'dem Suchfeld: Geben Sie hier Ihren Suchbegriff ein.',
-    "searchfield.search"    => 'der Lupe: Starten Sie hier die Suche mit einem Klick oder drücken Sie "Enter".',
-
-    "resultpage.title"      => 'Die Ergebnisseite',
-    "resultpage.foci"       => 'Unter dem Suchfeld sehen Sie nun 6 verschiedene Suchfokusse (drei im englischsprachigen Bereich) (Web, Bilder…...), denen intern auch spezifische Suchmaschinen zugeordnet sind.',
-    "resultpage.choice"     => 'Darunter sehen Sie zwei Punkte: gegebenenfalls „Filter“ sowie „Einstellungen“',
-    "resultpage.filter"     => 'Filter: Sie haben hier die Möglichkeit, Filtermöglichkeiten ein- und auszublenden und Filter anzuwenden. In jedem Suchfokus haben Sie hier andere Auswahlmöglichkeiten.',
-    "resultpage.settings.0" => 'Einstellungen: Hier können Sie dauerhafte Sucheinstellungen für Ihre MetaGer-Suche im aktuellen Fokus vornehmen. Sie können auch Suchmaschinen, die dem Fokus zugeordnet sind, an- und abwählen. Ihre Einstellungen werden mithilfe eines nicht personenbeziehbaren Klartextcookies gespeichert. Die Einstellungsseite erreichen Sie auch über das Menu oben rechts.',
-    "resultpage.settings.1" => 'Unter dem Punkt „Hinweis“ finden Sie einen Link, der Ihnen Ihre gesamten Einstellungen zeigt. Hier können Sie diese auch wieder mit einem Klick löschen. Hier finden Sie auch einen Link, den Sie kopieren und als Bookmark speichern können. Wenn Sie das Bookmark später aufrufen, sind Ihre Einstellungen wieder parat.',
-    "resultpage.settings.2" => 'Hier haben Sie auch die Möglichkeit, sich eine persönliche Blacklist zusammenzustellen; Sie können damit also nicht nur Suchmaschinen, sonden auch spezielle Domains ausfiltern und sich damit eigene Suchsettings produzieren. Mit einem Klick auf "Hinzufügen" werden diese Einstellungen an den Link im Abschnitt "Hinweis" angehängt.',
-    "resultpage.settings.3" => 'Sie können hier die Anzeige der Zitate an- und ausschalten.',
-    "resultpage.settings.4" => 'Schalten Sie hier ganz einfach in den Dark Mode um.',
-
-    "stopworte.title" => 'Stoppworte',
-    "stopworte.1" => "Wenn Sie unter den MetaGer-Suchergebnissen solche ausschließen wollen, in denen bestimmte Worte (Ausschlussworte / Stoppworte) vorkommen, dann erreichen Sie das, indem Sie diese Worte mit einem Minus versehen.",
-    "stopworte.2" => "Beispiel: Sie suchen ein neues Auto, aber auf keinen Fall einen BMW. Ihre Eingabe lautet also:",
-    "stopworte.3" => "auto neu -bmw",
-
-    "mehrwortsuche.title" => "Mehrwortsuche",
-    "mehrwortsuche.1" => "Wenn Sie bei MetaGer nach mehr als einem Wort suchen, versuchen wir automatisch, Ihnen Ergebnisse zu liefern, in denen alle Wörter vorkommen, oder die diesen möglichst nahe kommen.",
-    "mehrwortsuche.2" => "Sollte Ihnen das nicht ausreichen, haben Sie 2 Möglichkeiten, Ihre Suche genauer zu machen:",
-    "mehrwortsuche.3" => "Wenn Sie sicher gehen wollen, dass Wörter aus Ihrer Suche auch in den Ergebnissen vorkommen, dann müssen Sie diese in Anführungszeichen setzen.",
-    "mehrwortsuche.3.example" => '"der" "runde" "tisch"',
-    "mehrwortsuche.4" => "Mit einer Phrasensuche können Sie statt nach einzelnen Wörtern auch nach Wortkombinationen suchen. Setzen Sie dazu einfach diejenigen Wörter, die gemeinsam vorkommen sollen, in Anführungszeichen.",
-    "mehrwortsuche.4.example" => '"der runde tisch"',
-
-    "grossklein.title" => "Groß-/ Kleinschreibung",
-    "grossklein.1" => "Groß- und Kleinschreibung wird bei der Suche nicht unterschieden, es handelt sich um eine rein inhaltliche Suche.",
-    "grossklein.2" => "Beispiel: Die Suche nach",
-    "grossklein.2.example" => "suchmaschine",
-    "grossklein.3" => "sollte die gleichen Ergebnisse liefern wie",
-    "grossklein.3.example" => "SUCHMASCHINE",
-
-    "result.title" => 'Ergebnisse',
-    "result.info.1" => 'Alle Ergebnisse werden in folgender Form ausgegeben:<p><div class="image-container"><img src="/img/hilfe-php-resultpic-01.png"></div></p>',
-    "result.info.open" => '"ÖFFNEN": Klicken Sie auf die Überschrift, den darunter stehenden Link (die URL) oder auch auf den Button "ÖFFNEN", um das Ergebnis im selben TAB zu öffnen.',
-    "result.info.newtab" => '"IN NEUEM TAB ÖFFNEN" öffnet das Ergebnis in einem neuen TAB.',
-    "result.info.anonym" => '"ANONYM ÖFFNEN" bewirkt, dass das Ergebnis unter dem Schutz unseres Proxys geöffnet wird. Einige Infos dazu finden Sie weiter unten auf dieser Seite.',
-    "result.info.more" => 'MEHR: Wenn Sie hier klicken, dann erhalten Sie neue Optionen; das Aussehen des Ergebnisses ändert sich:<p><div class="image-container"><img src="/img/hilfe-php-resultpic-02.png"></div></p>',
-    "result.info.2" => 'Die neuen Optionen sind:',
-    "result.info.saveresult" => '"Ergebnis speichern" (Nur Desktopversion): Dieses Ergebnis wird in einem Sammeltab gespeichert. Der TAB erscheint rechts und bleibt über beliebig viele Suchen aktiv. (siehe <a href="#searchinsearch"> Suche in der Suche</a>)',
-    "result.info.domainnewsearch" => '"Auf dieser Domain neu suchen": Auf der Domain des Ergebnisses wird "genauer nachgesehen".',
-    "result.info.hideresult" => '"ausblenden": Hiermit blenden Sie Ergebnisse dieser Domain aus. Sie können diesen Schalter auch direkt hinter Ihr Suchwort schreiben und auch verketten; ebenso ist ein "*" als Wildcard erlaubt. Siehe auch <a href="#difset"> "Einstellungen"</a> für eine dauerhafte Lösung.',
-    'urls.title' => 'URLs ausschließen',
-    'urls.explanation' => 'Sie können Suchergebnisse ausschließen, deren Ergebnislinks bestimmte Worte enthalten, indem Sie in ihrer Suche "-url:" verwenden.',
-    'urls.example.1' => 'Beispiel: Sie möchten keine Ergebnisse, bei denen im Ergebnislink das Wort "Hund" auftaucht:',
-    'urls.example.2' => '<i>meine suche</i> -url:hund',
-
-    "bang.title" => "!bangs",
-    "bang.1" => "MetaGer unterstützt in geringem Umfang eine Schreibweise, die oft als „!bang“-Syntax bezeichnet wird.<br>Ein solches „!bang“ beginnt immer mit einem Ausrufezeichen und enthält keine Leerzeichen. Beispiele sind hier „!twitter“ oder „!facebook“.<br>Wird ein !bang, das wir unterstützen, in der Suchanfrage verwendet, erscheint in unseren Quicktips ein Eintrag, über den man die Suche auf Knopfdruck mit dem jeweiligen Dienst (hier Twitter oder Facebook) fortführen kann.",
-    'faq.18.h' => 'Warum werden !bangs nicht direkt geöffnet?',
-    'faq.18.b' => 'Die !bang-„Weiterleitungen“ sind bei uns ein Teil unserer Quicktips und benötigen einen zusätzlichen „Klick“. Das war für uns eine schwierige Entscheidung, da die !bang dadurch weniger nützlich sind. Jedoch ist es leider nötig, da die Links, auf die weitergeleitet wird, nicht von uns stammen, sondern von einem Drittanbieter, DuckDuckGo.<p>Wir achten stehts darauf, dass unsere Nutzer jederzeit die Kontrolle behalten. Wir schützen daher auf zwei Arten: Zum Einen wird der eingegebene Suchbegriff niemals an DuckDuckGo übertragen, sondern nur das !bang. Zum Anderen bestätigt der Nutzer den Besuch des !bang-Ziels explizit. Leider können wir derzeit aus Personalgründen nicht alle diese !bangs prüfen oder selbst pflegen.',
-
-    "searchinsearch.title" => "Suche in der Suche",
-    "searchinsearch.1" => 'Auf die Funktion der Suche in der Suche kann mit Hilfe des "MEHR"-Knopfes rechts unten im Ergebniskasten zugegriffen werden. Beim Klick auf diesen öffnet sich ein Menü, in dem "Ergebnis speichern" an erster Stelle steht. Mit dieser Option wird das jeweilige Ergebnis in einem separaten Speicher abgelegt. Der Inhalt dieses Speichers wird rechts neben den Ergebnissen unter den Quicktips angezeigt (Auf zu kleinen Bildschirmen werden gespeicherte Ergebnisse aus Platzmangel nicht angezeigt). Dort können Sie die gespeicherten Ergebnisse nach Schlüsselworten filtern oder umsortieren lassen. Mehr Infos zum Thema "Suche in der Suche" gibt es im <a href="http://blog.suma-ev.de/node/225" target="_blank" rel="noopener"> SUMA-Blog</a>.',
-
-    "dienste" => "Weitere Dienste um die Suche herum",
-    "dienste.kostenlos" => "Selbstverständlich sind all unsere Dienste kostenlos",
-
-    "app.title" => "Android-App",
-    "app.1" => "Sie können MetaGer auch als App nutzen. Laden Sie sich dazu einfach die <a href=\"https://play.google.com/store/apps/details?id=de.metager.metagerapp\" target=\"_blank\" rel=\"noopener\">MetaGer App</a> auf ihr Android Smartphone.",
-
-    "plugin.title" => "Browser-Plugin",
-    "plugin.1" => "Für die meisten Browser gibt es ein MetaGer Plugin. Damit können Sie MetaGer bequem direkt von ihrer Suchzeile aus benutzen. Mehr dazu finden Sie unter <a href=\"/plugin\" rel=\"noopener\">MetaGer-Plugin hinzufügen</a>.",
-
-    "suchwortassoziator.title" => "Suchwortassoziator",
-    "suchwortassoziator.1" => 'Als Hilfe für die Erschließung eines Begriffsumfelds haben wir den <a href="/asso" target="_blank" rel="noopener">MetaGer-Web-Assoziator</a> entwickelt. Sie finden das Tool auch direkt unter dem Reiter "Dienste". Gibt man in diesen ein Suchwort ein, welches dem zu untersuchenden Fachgebiet irgendwie nahe kommt, dann wird versucht, typische Fachbegriffe dieses Gebietes aus dem WWW zu extrahieren.',
-    "suchwortassoziator.2" => "Beispiel: Sie möchten mehr über Zeckenbisse und deren Gefahren wissen, aber ihnen fallen die medizinischen Fachbegriffe für Erkrankungen aus diesem Bereich nicht mehr ein. Die Eingabe des Wortes \"Zeckenbisse\" in den Web-Assoziator liefert dann u.a. die Begriffe \"Borreliose\" und \"fsme\".",
-    "suchwortassoziator.3" => "Da diese Assoziationsanalyse u.a. aus Web-Dokumenten selber gewonnen wird, ist sie sprachunabhängig; d.h. Sie können bei Eingabe deutscher Wörter Fachbegriffe aus beliebigen Sprachen gewinnen (und umgekehrt). Wenn Ihnen andererseits Assoziationsanalysen auffallen, die mit Hilfe Ihrer Fachkenntnisse besser sein könnten, dann zögern Sie bitte nicht, uns dieses samt Ihrem Verbesserungsvorschlag über <a href=\"/kontakt/\" target=\"_blank\" rel=\"noopener\">unser Kontaktformular</a> mitzuteilen.",
-
-    "widget.title" => "MetaGer Widget",
-    "widget.1" => "Hierbei handelt es sich um einen Codegenerator, der es Ihnen ermöglicht, MetaGer in Ihre Webseite einzubinden. Sie können damit dann nach Belieben auf Ihrer eigenen Seite oder im Internet suchen lassen. Bei allen Fragen: <a href=\"/kontakt/\" target=\"_blank\" rel=\"noopener\">unser Kontaktformular</a>",
-
-    "datenschutz.title" => "Anonymität und Datensicherheit",
-    "datenschutz.faktencheck.heading" => "Fakten-Prüfung contra Fake-News:",
-    "datenschutz.faktencheck.body.1" => '<a href="http://www.password-online.de/?wysija-page=1&controller=email&action=view&email_id=280" target="_blanK" rel="noopener">Ausführliche Anleitung und Beschreibung</a> von <a href="http://www.ude.de/" target="_blanK" rel="noopener">Albrecht Ude</a>',
-    "datenschutz.faktencheck.body.2" => '<a href="/hilfe/faktencheck">Fakten-Checkliste</a>',
-
-    "datenschutz.1" => 'Tracking-Cookies, Session-IDs und IP-Adressen',
-    "datenschutz.2" => 'Nichts von alldem wird hier bei MetaGer verwendet, gespeichert, aufgehoben oder sonst irgendwie verarbeitet (Ausnahme: Kurzfristige Speicherung gegen Hacking- und Bot-Attacken). Weil wir diese Thematik für extrem wichtig halten, haben wir auch Möglichkeiten geschaffen, die Ihnen helfen können, hier ein Höchstmaß an Sicherheit zu erreichen: den MetaGer-TOR-Hidden-Service und unseren anonymisierenden Proxyserver.',
-    "datenschutz.3" => "Mehr Informationen finden Sie weiter unten. Die Funktionen sind unter \"Dienste\" in der Navigationsleiste erreichbar.",
-
-    "tor.title" => "Tor-Hidden-Service",
-    "tor.1" => "Bei MetaGer werden schon seit vielen Jahren die IP-Adressen ausgeblendet und nicht gespeichert. Nichtsdestotrotz sind diese Adressen auf dem MetaGer-Server zeitweise, während eine Suche läuft, sichtbar: wenn MetaGer also einmal kompromittiert sein sollte, dann könnte dieser Angreifer Ihre Adressen mitlesen und speichern. Um dem höchsten Sicherheitsbedürfnis entgegenzukommen, unterhalten wir eine MetaGer-Instanz im Tor-Netzwerk: den MetaGer-TOR-hidden-Service - erreichbar über: <a href=\"/tor/\" target=\"_blank\" rel=\"noopener\">https://metager.de/tor/</a>. Für die Benutzung benötigen Sie einen speziellen Browser, den Sie auf <a href=\"https://www.torproject.org/\" target=\"_blank\" rel=\"noopener\">https://www.torproject.org/</a> herunter laden können.",
-    "tor.2" => "MetaGer erreichen Sie im Tor-Browser dann unter: http://metagerv65pwclop2rsfzg4jwowpavpwd6grhhlvdgsswvo6ii4akgyd.onion .",
-
-    "proxy.title" => "Anonymisierender MetaGer-Proxyserver",
-    "proxy.1" => "Um ihn zu verwenden, müssen Sie auf der MetaGer-Ergebnisseite nur auf \"ANONYM ÖFFNEN\" am unteren Rand des Ergebnisses klicken. Dann wird Ihre Anfrage an die Zielwebseite über unseren anonymisierenden Proxy-Server geleitet und Ihre persönlichen Daten bleiben weiterhin völlig geschützt. Wichtig: wenn Sie ab dieser Stelle den Links auf den Seiten folgen, bleiben Sie durch den Proxy geschützt. Sie können aber oben im Adressfeld keine neue Adresse ansteuern. In diesem Fall verlieren Sie den Schutz. Ob Sie noch geschützt sind, sehen Sie ebenfalls im Adressfeld. Es zeigt: https://proxy.suma-ev.de/?url=hier steht die eigentlich Adresse.",
-
-    "maps.title" => "MetaGer Maps",
-    "maps.1" => 'Die Sicherung der Privatsphäre im Zeitalter der globalen Datenkraken hat uns auch bewogen, <a href="https://maps.metager.de" target="_blank">https://maps.metager.de</a> zu entwickeln: Der (unseres Wissens) einzige Routenplaner, der die vollen Funktionalitäten via Browser und App bietet - ohne dass Nutzer-Standorte gespeichert werden.  All dies ist nachprüfbar, denn unsere Softwaren sind Open-Source. Für die Nutzung von maps.metager.de empfehlen wir unsere schnelle App-Version. Unsere Apps können Sie unter <a href="/app" target="_blank">App beziehen</a> downloaden (oder natürlich auch über den Play-Store).',
-    "maps.2" => "Diese Kartenfunktion kann auch von der MetaGer-Suche aufgerufen werden (und umgekehrt). Sobald Sie bei MetaGer nach einem Begriff gesucht haben, sehen Sie oben rechts einen neuen Suchfokus \"Maps\".  Beim Klick darauf gelangen Sie zu einer dazugehörigen Karte. .",
-    "maps.3" => "Die Karte zeigt nach dem Aufrufen die auch in der Spalte rechts wiedergegebenen von MetaGer gefundenen Punkte (POIs = Points of Interest). Beim Zoomen passt sich diese Liste an den Kartenausschnitt an.  Wenn Sie die Maus über eine Markierung in der Karte oder in der Liste halten, wird das jeweilige Gegenstück hervorgehoben.  Klicken Sie auf \"Details\", um genauere Informationen zu diesem Punkt aus der darunter liegenden Datenbank zu erhalten.",
-
-    'faq.title' => 'FAQ',
-    'metager.title' => 'Allgemeines zu MetaGer',
-    'metager.explanation.1' => 'MetaGer ist eine schon <a href="http://blog.suma-ev.de/node/207" target="_blank" rel="noopener">im Jahr 1996 gegründete</a> <strong>Suchmaschine</strong>, die Suchdienste parallel nach den von Ihnen eingegebenen Suchworten absucht und alle Ergebnisse zusammenfasst. MetaGer arbeitet die Ergebnisse sinnvoll auf. Dabei werden etwa (möglichst) alle doppelten Treffer (Doubletten) zu einem zusammengefasst. Eine vollständige Erkennung von Doubletten ist allerdings unmöglich. So etwas nennt man eine <strong>Meta-Suchmaschine</strong>. Wenn man also sinnvoll suchen will, dann muss man etliche Suchmaschinen nacheinander "von Hand" absuchen und alle Ergebnisse vergleichen und zusammenführen. Diese Arbeit kann einem ein Automat - die Metasuchmaschine – abnehmen.',
-    'metager.explanation.2' => 'Dazu kommt der höhere Abdeckungsgrad, denn nicht jede Suchmaschine kennt das ganze Internet. Näheres zu Metasuchmaschinen finden Sie bei <a href="https://de.wikipedia.org/wiki/Metasuchmaschine" target="_blank" rel="noopener">Wikipedia</a>. Vielleicht genügen Ihnen die Ergebnisse, die Ihnen MetaGer präsentiert, vielleicht möchten Sie mit einer einzelnen Suchmaschine nochmals suchen. In der Ergebnisliste sehen Sie an jedem Ergebnis, woher es kam und können auch direkt klicken. Wir haben die uns zur Verfügung stehenden Suchdienste sinnvoll gruppiert und daraus die verschiedenen Suchfokusse erstellt.',
-
-    'searchengine.title' => 'Warum können wir Suchmaschinen abfragen und trotzdem die Anonymität der Nutzer wahren?',
-    'searchengine.explanation' => 'Wir als Meta-Suchmaschine stehen zwischen Ihnen und der Abfrage, die bspw. an Yahoo weiter geleitet wird. Das bedeutet, wenn Sie eine Suchabfrage abschicken, schicken sie diese Abfrage an uns. Wir entziehen dieser dann alle Informationen, welche sie identifizieren könnten und leiten eine anonyme Abfrage an Yahoo weiter. Yahoo schickt die Antwort dann wiederum an uns und wir leiten diese an Sie weiter. So handhaben wir dies mit allen Suchmaschinen, die wir abfragen. So können wir garantieren, dass Ihre Privatsphäre gegenüber allen bei uns abgefragten Suchmaschinen gewahrt bleibt. Darüber hinaus können wir auch garantieren, dass Ihre Daten auch bei uns nicht abgespeichert werden (Ausnahme: Kurzfristige Speicherung gegen Hacking- und Bot-Attacken) Genauer ersichtlich wird das in unserer <a href="/datenschutz/" target="_blank" rel="noopener">Datenschutzerklärung</a>. Dies ist sogar für die Öffentlichkeit nachvollziehbar, da der gesamte Quelltext von MetaGer unter einer freien Lizenz veröffentlicht wurde <a href="https://gitlab.metager.de/open-source/MetaGer">(https://gitlab.metager.de/open-source/MetaGer)</a>. Wenn Sie eine eigene Website haben, dann können Sie auf ihr auch einmal auf einfache Weise mit dem  <a href=":widget-link" target="_blank">MetaGer-Widget</a> experimentieren. Sie dürfen das Widget mit Logo frei auf Ihren Webseiten verwenden und auch Links auf MetaGer.de setzen, wenn Sie wollen.',
-
-    'content.title' => 'Fragwürdige Inhalte / Jugendschutz',
-    'content.explanation.1' => 'Ich habe "Treffer" erhalten, die finde ich nicht nur ärgerlich, sondern die enthalten meiner Meinung nach illegale Inhalte!',
-    'content.explanation.2' => 'Wenn Sie im Internet etwas finden, das Sie für illegal oder jugendgefährdend halten, dann können Sie sich per Mail an <a href="mailto:hotline@jugendschutz.net" target="_blank" rel="noopener">hotline@jugendschutz.net</a> wenden oder Sie gehen auf <a href="http://www.jugendschutz.net/" target="_blank" rel="noopener">www.jugendschutz.net</a> und füllen das dort zu findende Beschwerdeformular aus. Sinnvoll ist ein kurzer Hinweis, was Sie konkret für unzulässig halten und wie Sie auf dieses Angebot gestoßen sind. Direkt an uns können Sie fragwürdige Inhalte auch melden. Schreiben Sie dazu eine Mail an unseren Jugendschutzbeauftragten (<a href="mailto:jugendschutz@metager.de" target="_blank" rel="noopener">jugendschutz@metager.de</a>).',
-
-    'selist.title' => 'Ich möchte MetaGer zur Suchmaschinenliste meines Browsers hinzufügen.',
-    'selist.explanation.1' => 'Versuchen Sie bitte zuerst, das aktuelle Plugin zu installieren. Zum Installieren einfach auf den Link direkt unter dem Suchfeld klicken. Dort sollte Ihr Browser schon erkannt worden sein.',
-    'selist.explanation.2' => 'Manche Browser erwarten die Eingabe einer URL; diese lautet "https://metager.de/meta/meta.ger3?eingabe=%s" ohne Gänsefüßchen eintragen. Die URL können Sie selbst erzeugen, wenn Sie mit metager.de nach irgendetwas suchen und dann das, was oben im Adressfeld hinter "eingabe=" steht, mit %s ersetzen. Wenn Sie dann noch Probleme haben sollten, wenden Sie sich bitte an uns: <a href="/kontakt" target="_blank" rel="noopener">Kontaktformular</a>',
-
-    'proposal.title' => 'Wie kann ich die Anzeige meiner vorherigen Suchen löschen?',
-    'proposal.explanation' => 'Die Suchvorschläge liefert Ihnen Ihr Webbrowser, sie müssen die Suchvorschläge also auch in ihrem Browser ausschalten. Meist geht das über die Chronik, immer ein wenig anders, aber abschalten können Sie das in jedem Browser.',
-
-    'assignment.title' => 'Über welche Wege kann eine Zuordnung zu Personen hergestellt werden?',
-    'assignment.explanation.1' => 'Die Zuordnung kann dann hergestellt werden, wenn sich ein Nutzer bei einem Dienst eines Anbieters (z.B. Google-Mail) persönlich angemeldet hat. Dann wird ein Cookie für diesen Anmelder gesetzt. Bei einer späteren Suche ist dann dieser Anmelder anhand des Cookies identifiziert. Löschen Sie regelmäßig Cookies von nicht vertrauenswürdigen oder unbekannten Quellen. Eine exakte Zuordnung über die IP-Adresse zur Person ist nur mit Hilfe des Providers möglich. Dies wird im Normalfall wahrscheinlich nicht geschehen. Aber es gibt weitere Indizien: auch anhand einer wechselnden IP ist ohne Mithilfe des Providers eine ungefähre geografische Zuordnung möglich.',
-    'assignment.explanation.2' => 'Darüber hinaus sendet der Browser weitere Daten, wie z.B. den User-Agent, dessen genaue Version und Arbeitsumgebung, das Betriebssystem und dessen exakte Version und ggf. Patch-Level. Auch mit diesen Daten ist eine Zuordnung zur Person des Anmelders, wenn dessen Daten durch die Anmeldung zu einem Dienst erst einmal bekannt sind, mit hoher Wahrscheinlichkeit möglich.',
-];
diff --git a/resources/lang/de/titles.php b/resources/lang/de/titles.php
index f1cf814bfcbcbb2822cd8b92cc70283d3ae107e0..b022e69568d408b3e5eef03260352cf42a5e69b4 100644
--- a/resources/lang/de/titles.php
+++ b/resources/lang/de/titles.php
@@ -8,7 +8,11 @@ return [
     'kontakt' => 'Kontakt - MetaGer',
     'spende' => 'Spenden - MetaGer',
     'datenschutz' => 'Datenschutz und Privatsphäre - MetaGer',
-    'hilfe' => 'Hilfe - MetaGer',
+    'help' => 'Hilfe - MetaGer',
+    'help-mainpages' =>'Hilfe - MetaGer',
+    'help-functions' =>'Hilfe - MetaGer',
+    'help-services' =>'Hilfe - MetaGer',
+    'help-privacy-protection' =>'Hilfe - MetaGer',
     'widget' => 'MetaGer Widget',
     'settings' => 'Einstellungen',
     'websearch' => 'Websuche-Widget - MetaGer',
diff --git a/resources/lang/en/help/help-functions.php b/resources/lang/en/help/help-functions.php
new file mode 100644
index 0000000000000000000000000000000000000000..b3308c2087ec9640b4e37a4ab9dc34b4c7a31941
--- /dev/null
+++ b/resources/lang/en/help/help-functions.php
@@ -0,0 +1,38 @@
+<?php
+return [
+    "title"                 => "MetaGer - Help",
+    "backarrow"             => ' back',
+
+    "suchfunktion.title" => "Search functions",
+    "stopworte.title" => "Exclude single words",
+    "stopworte.1" => "If you want to exclude words within the search result, you have to put a \"-\" in front of that word",
+    "stopworte.2" => "Example: You are looking for a new car, but no BMW. Then your search should be <div class=\"well well-sm\">new car -bmw</div>",
+    "stopworte.3" => "car new -bmw",
+
+    "mehrwortsuche.title" => "Searching for more than one word",
+    "mehrwortsuche.1" => "Without quotation you will get results containing one or some of the words of your search entry. Use quotes for the search for exact phrases, citations....",
+    "mehrwortsuche.2" => "Example: search for Shakespears <div class=\"well well-sm\">to be or not to be</div> will deliver many results, but the exact phrase will only be found using <div class=\"well well-sm\">\"to be or nor to be\"</div>",
+    "mehrwortsuche.3" => "Please use quotes to make sure to get your search words in the results list.",
+    "mehrwortsuche.3.example" => '"round-table" "decision"',
+    "mehrwortsuche.4" => "Put words or phrases in quotation marks to search for exact combinations.",
+    "mehrwortsuche.4.example" => '"round-table decision"',
+
+    "urls.title" => "Exclude URLs",
+    "urls.explanation" => "Use \"-url:\" to exclude search results containing specified words.",
+    "urls.example.1" => "Example: You don' t want the word \"dog\" in the results:",
+    "urls.example.2" => "Type <i>my search words</i> -url:dog",
+
+    "bang.title" => "!bangs",
+    "bang.1" => "MetaGer uses a little a special spelling called \"!bang syntax\". A !bang starts with the \"!\" and doesn't contain blanks (\"!twitter\", \"!facebook\" for example). If you use a !bang supported by MetaGer you will see a new entry in the \"Quicktips\". We direct then to the specified service (click the button). Read more about our method departing from others:  <a href=\"/en/hilfe/#bangs\" target=\"_blank\" rel=\"noopener\"> FAQ</a>",
+    "faq.18.h" => "Why are the !bangs not opended directly?",
+    "faq.18.b" => "The !bang -\\\"redirections\\\" are part of our quicktips and they need an additional click. We had to decide between easy-to-use and keep-control-of-data. We find it necessary to show that the links are third party property (DuckDuckGo). So there is a two way protection: first we do not transfer your searchwords but only the !bang to DuckDuckGo. On the other hand the user confirms the !bang-target explicit. We don't have the ressources to maintain all this !bangs, we are sorry.",
+
+    "searchinsearch.title" => "Search in search",
+    "searchinsearch.1" => "The result will be stored in a new TAB appearing at the right side of the screen. It is called \"Saved results\". You can store here single results from several searches. The TAB persists. Entering this TAB you get your personal result list with tools to filter and sort the results. Click another TAB to go back for further searches. You won´t have this if the screen is too small. More info (only german so far): <a href=\"http://blog.suma-ev.de/node/225\" target=\"_blank\" rel=\"noopener\"> SUMA blog</a>.",
+
+    'selist.title' => 'I want to add metager.de to the search engines list of my browser.',
+    'selist.explanation.1' => 'Please try first to install the newest available plugin. Just use the link below the searchfield, it has an automatic browserdetection.',
+    'selist.explanation.2' => 'Some browser need an URL. Please use "https://metager.de/meta/meta.ger3?eingabe=%s" without qoutation marks. If there are still problems, please <a href="/en/kontakt" target="_blank" rel="noopener">write an email.</a>',
+
+
+];
\ No newline at end of file
diff --git a/resources/lang/en/help/help-mainpages.php b/resources/lang/en/help/help-mainpages.php
new file mode 100644
index 0000000000000000000000000000000000000000..09f8fbedce55a365e983ff592efd3718944ea4bc
--- /dev/null
+++ b/resources/lang/en/help/help-mainpages.php
@@ -0,0 +1,49 @@
+<?php
+return [
+    "title"                 => "MetaGer - Help",
+    "backarrow"             => ' back',
+
+"title.2"               => 'Use of the search engine',
+
+"startpage.title"       => 'The start page',
+"startpage.info"        => 'The start page contains the search field and a menu button in the upper right corner. There is a link below the search field which let you add MetaGer to your web browser. At last, at the bottom of the page there is some information about MetaGer and its supporting association, the SUMA-EV.',
+
+"searchfield.title"     => 'The search field',
+"searchfield.info"      => 'The search field contains:',
+"searchfield.memberkey" => 'The key symbol: Here members of SUMA-EV or donors can enter their key to use the ad-free search. You want this too? Become a member via our <a href = "https://metager.org/beitritt">Membership form</a> or <a href = "https://metager.org/spende/">donate</a> to SUMA-EV.',
+"searchfield.slot"      => 'The search field: Enter your words here. Upper case will not be distinguished from lower case.',
+"searchfield.search"    => 'The magnifier: Start your search.',
+"searchfield.morefunctions" => 'More information on other functions are available under "<a href = "/hilfe/funktionen">search functions</a>"',
+
+"resultpage.title"      => 'The result page',
+"resultpage.foci"       => 'There are three (six for the german branch) different search focuses below the search field (Web, Pictures and Shopping). We assigned specific search engines to these focuses.',
+"resultpage.choice"     => 'Below these you have two links:',
+"resultpage.filter"     => 'Filter: Toggle filters on / off and apply settings here. Each focus has its own assortment.',
+"resultpage.settings" => 'Settings: Apply here your permanent settings for the current focus. You can select / unselect search engines here, too. Your settings are stored as non-personally identifiable cookies. Click "Overview" to see your settings. If settings have been stored you find a deletion button at the end of the page. There is also a menu entry to access the settings page.',
+"resultpage.settings.1" => 'The section "Note" offers a link to the cookie list and also a box with a link which is useful to copy and save as a bookmark. Using the bookmark you will have all settings working immediately.',
+"resultpage.settings.2" => 'Arrange your personal blacklist here. Settings made here will be concatenetad to the link in the section "Note".',
+"resultpage.settings.3" => 'Switch citations on/off.',
+"resultpage.settings.4" => 'Enter the MetaGer Dark Mode here.',
+
+
+"result.title" => 'Results',
+"result.info.1" => 'All results will look like this:<p><div class="image-container"><img src="/img/hilfe-php-resultpic-en-01.png"></div></p>',
+"result.info.open" => '"OPEN": Click the headline, the link below (URL) or the "OPEN" button to open the result in the same TAB.',
+"result.info.newtab" => '"OPEN IN NEW TAB" will open the result in a new TAB.',
+"result.info.anonym" => '"OPEN ANONYMOUSLY": the page will be opened under the proxy protection.You can find some info about this in the <a href = "/hilfe/datensicherheit#proxy/">MetaGer proxy server</a> section.',
+"result.info.more" => '"MORE": you will get more options, the result changes its appearance to:<p><div class="image-container"><img src="/img/hilfe-php-resultpic-en-02.png"></div></p>',
+"result.info.2" => 'The new options are:',
+"result.info.saveresult" => '"Save result in TAB" (Only desktop): The result will be stored in a new TAB. It´ s used for collecting results out of several searches. This TAB appears on the right side of your screen. (info: <a href="/hilfe/funktionen#searchinsearch"> Search in search</a>)',
+"result.info.domainnewsearch" => '"Start a new search on this domain": search only on this domain.',
+"result.info.hideresult" => '"Hide": hide results from this domain. You can use this filter directly after your search words (e.g. my search words -site:*.wikipedia.org), filters can be concatenated and the wildcard "*" is allowed. See also <a href="#einstellungen"> "Settings"</a> to apply a permanent solution.',
+
+"settings.title" => 'Settings',
+"settings.1" => 'Note <br> Under the intem "Note" you will find a link that shows you all your settings. You can <a href=:link>display</a> this link. You can also delete it again with one click. You will also find a link that you can copy and save as a bookmark. If you open the bookmark later, your settings are ready again.',
+"settings.2" => 'Used search engines <br> Here you can view your used search engines and adjust them if necessary. By clicking on the corresponding name you can switch it on or off accordingly.',
+"settings.3" => 'Search filters <br> With search filters xou can filter your search permanently.',
+"settings.4" => 'Blacklist <br> Here you can compile your personal blacklist. You can filter out not only search engines, but also special domains. Therfore you can produce your own search settings. With a click on "Add" these settings will be attached to the link in the "Note" section.',
+"settings.5" => 'Toggle dark mode <br> Simply switch to dark mode here.',
+"settings.6" => 'Open results in new tab <br> Here you can permanently switch on the function to open results in a new tab.',
+"settings.7" => 'Citations <br> Here you can switch on/off the display of citations.',
+
+];
\ No newline at end of file
diff --git a/resources/lang/en/help/help-privacy-protection.php b/resources/lang/en/help/help-privacy-protection.php
new file mode 100644
index 0000000000000000000000000000000000000000..09340da891a8f821bee796185cc46b9eaae971f5
--- /dev/null
+++ b/resources/lang/en/help/help-privacy-protection.php
@@ -0,0 +1,22 @@
+<?php
+return [
+    "title"                 => "MetaGer - Help",
+    "backarrow"             => ' back',
+
+    "datenschutz.title" => "Privacy",
+    "datenschutz.1" => "Tracking-Cookies, Session-IDs, IP addresses",
+    "datenschutz.2" => "We don&apos;t store or work with any personal information (For the purpose of securing our servers against Hacking- and Bot-Attacks, we need to store these information for a short period of time. It will be automatically deleted afterwards). We provide further privacy security services. For more details see below:",
+    "datenschutz.3" => "Click / touch the burger menu to use the tools.",
+
+    "tor.title" => "Tor Hidden Service",
+    "tor.1" => "MetaGer provides the highest reachable security level for your privacy (anonymised IP addresses, servers under german privacy protection law). For further security needs or fear of compromised servers you may use the MetaGer-Tor branch. Please download the specialized webbrowser from <a href=\"https://www.torproject.org/\" target=\"_blank\" rel=\"noopener\">https://www.torproject.org/</a>. You will find help there, too.",
+    "tor.2" => "MetaGer Tor address: http://metagerv65pwclop2rsfzg4jwowpavpwd6grhhlvdgsswvo6ii4akgyd.onion",
+
+    "proxy.title" => "MetaGer proxy server",
+    "proxy.1" => "Click or touch \"open anonymously\" to use the MetaGer proxy server. The provided protection is limited to the website you reached from our result page. Protection persists while you see https://proxy.suma-ev.de/?url=...in your webbrowser‘s address field.",
+    
+    'content.title' => 'Inappropriate Content / youth protection',
+    'content.explanation.1' => 'I found results with illegal content.',
+    'content.explanation.2' => 'If some content (presented by MetaGer) seems to be illegal, please email us to <a href="mailto:jugendschutz@metager.de" target="_blank" rel="noopener">jugendschutz@metager.de</a>.',
+
+];
\ No newline at end of file
diff --git a/resources/lang/en/help/help-services.php b/resources/lang/en/help/help-services.php
new file mode 100644
index 0000000000000000000000000000000000000000..e9cb1b9f6ac193cef80c8d6fc1bd0460eaa153ee
--- /dev/null
+++ b/resources/lang/en/help/help-services.php
@@ -0,0 +1,24 @@
+<?php
+return [
+    "title"                 => "MetaGer - Help",
+    "backarrow"             => ' back',
+
+    "dienste" => "Services",
+    "dienste.kostenlos" => "All our services are cost free. You do not pay with your data.",
+
+    "app.title" => "Android-App",
+    "app.1" => "You can use MetaGer within an app, too. To do so just download the <a href=\"https://play.google.com/store/apps/details?id=de.metager.metagerapp\" target=\"_blank\" rel=\"noopener\">MetaGer App</a> on your Android smartphone.",
+    
+    "suchwortassoziator.title" => "MetaGer-Web-Associator",
+    "suchwortassoziator.1" => 'Ask the <a href="/en/asso/" target="_blank" rel="noopener">MetaGer-Web-Assoziator</a> (Tools / Associator) to find connotations in a subject area. The service doesn&apos;t append upon any language because it uses webdocuments as a source. Therefore, you find any connotations to your used language and vice-versa.',
+    "suchwortassoziator.2" => "Example: you want to know more about \"tick bites\" and its dangers but you forgot the technical terms around this issue. The \"Assoziator\" presents \"Borreliose\" and \"fsme\" among others.",
+    "suchwortassoziator.3" => "Please let us know if something unsuitable appears. Please use our <a href=\"/en/kontakt/\" target=\"_blank\" rel=\"noopener\">contact form</a>.",
+
+    "widget.title" => "MetaGer widget",
+    "widget.1" => "Provide full MetaGer functionality to your own website! Just select Tools / widget on our startpage, decide whether you want a powerful websearch or a sitesearch -which may be useful on your own pages. Enter the domainname and let the script do the rest. Questions to: <a href=\"/en/kontakt/\" target=\"_blank\" rel=\"noopener\">contact form</a>",
+
+    "maps.title" => "MetaGer maps",
+    "maps.1" => "MetaGer provides a map function (not on metager.org, please use <a href=\"https://www.metager.de/\" target=\"_blank\" rel=\"noopener\">MetaGer.de</a>) : On a result page you see a new focus on the upper right, called \"Maps\". You receive a map according to your search by click.",
+    "maps.2" => "After loading the map shows POIs according to the MetaGer results. You see them in the right column too. Mouseover a POI highlights its counterpart. Click \"Details\" to get further information (Nominatim data base) to this POI.",
+    "maps.3" => "The maps are rendered before (except for the last three ones) and fast available. Affect the zoom level by mouse-wheel or the \"+ / -\" buttons in the upper left corner of the map.",
+    ];
\ No newline at end of file
diff --git a/resources/lang/en/help/help.php b/resources/lang/en/help/help.php
new file mode 100644
index 0000000000000000000000000000000000000000..e9be217564a68e4137cd2ef292fe6ba82af0042f
--- /dev/null
+++ b/resources/lang/en/help/help.php
@@ -0,0 +1,30 @@
+<?php
+return [
+    "achtung"               => "Warning! Structure and functionality of our website are subject to constant development and changes. We try to update our help pages as quickly as possible, but can not prevent temporary mistakes.",
+    "title"                 => "MetaGer - Help",
+   
+    'tableofcontents.title' => '',
+    'tableofcontents.1' => 'Use of the search engine',
+    'tableofcontents.1.1' => 'The start page',
+    'tableofcontents.1.2' => 'The search field',
+    'tableofcontents.1.3' => 'The result page',
+    'tableofcontents.1.4' => 'Settings',
+
+    'tableofcontents.2' => 'Useful functions and hints',
+    'tableofcontents.2.1' => 'Search functions',
+    'tableofcontents.2.2' => '!bangs',
+    'tableofcontents.2.3' => 'Search in search',
+    'tableofcontents.2.4' => 'Add MetaGer',
+
+    'tableofcontents.4' => 'Services',
+    'tableofcontents.4.1' => 'Android-App',
+    'tableofcontents.4.3' => 'MetaGer-Web-Associator',
+    'tableofcontents.4.4' => 'MetaGer widget',
+    'tableofcontents.4.5' => 'MetaGer Maps',
+
+    'tableofcontents.3' => 'Privacy',
+    'tableofcontents.3.2' => 'Tracking & Cookies',
+    'tableofcontents.3.3' => 'Tor Hidden Service',
+    'tableofcontents.3.4' => 'MetaGer proxy server',
+    'tableofcontents.3.5' => 'Youth protection',
+ ];
diff --git a/resources/lang/en/hilfe.php b/resources/lang/en/hilfe.php
deleted file mode 100644
index 9a19e209fa4dbd998f3278370e9059630c358532..0000000000000000000000000000000000000000
--- a/resources/lang/en/hilfe.php
+++ /dev/null
@@ -1,132 +0,0 @@
-<?php
-return [
-    "achtung"               => "Warning! Structure and functionality of our website are subject to constant development and changes. We try to update our help pages as quickly as possible, but can not prevent temporary mistakes.",
-    "title"                 => "MetaGer Help",
-
-    "title.2"               => 'Use of the search engine',
-
-    "startpage.title"       => 'The start page',
-    "startpage.info"        => 'The start page contains the search field and a menu button in the upper right corner. There is a link below the search field which let you add MetaGer to your web browser. At last, at the bottom of the page there is some information about MetaGer and its supporting association, the SUMA-EV.',
-
-    "searchfield.title"     => 'The search field',
-    "searchfield.info"      => 'The search field contains:',
-    "searchfield.memberkey" => 'The key symbol (only SUMA-EV members): Members can enter a private key to use the "free-of-advertising" metager search. If you want this too, just become a member: <a href = "https://metager.org/beitritt">Membership form</a>',
-    "searchfield.slot"      => 'The search field: Enter your words here.',
-    "searchfield.search"    => 'The magnifier: Start your search.',
-    "resultpage.title"      => 'The result page',
-    "resultpage.foci"       => 'There are three (six for the german branch) different search focuses below the search field (Web, Pictures and Shopping). We assigned specific search engines to these focuses.',
-    "resultpage.choice"     => 'Below these you have two links:',
-    "resultpage.filter"     => 'Filter: Toggle filters on / off and apply settings here. Each focus has its own assortment.',
-    "resultpage.settings.0" => 'Settings: Apply here your permanent settings for the current focus. You can select / unselect search engines here, too. Your settings are stored as non-personally identifiable cookies. Click "Overview" to see your settings. If settings have been stored you find a deletion button at the end of the page. There is also a menu entry to access the settings page.',
-    "resultpage.settings.1" => 'The section "Note" offers a link to the cookie list and also a box with a link which is useful to copy and save as a bookmark. Using the bookmark you will have all settings working immediately.',
-    "resultpage.settings.2" => 'Arrange your personal blacklist here. Settings made here will be concatenetad to the link in the section "Note".',
-    "resultpage.settings.3" => 'Switch citations on/off.',
-    "resultpage.settings.4" => 'Enter the MetaGer Dark Mode here.',
-
-
-    "stopworte.title" => "Exclude single words",
-    "stopworte.1" => "If you want to exclude words within the search result, you have to put a \"-\" in front of that word",
-    "stopworte.2" => "Example: You are looking for a new car, but no BMW. Then your search should be <div class=\"well well-sm\">new car -bmw</div>",
-    "stopworte.3" => "car new -bmw",
-
-    "mehrwortsuche.title" => "Searching for more than one word",
-    "mehrwortsuche.1" => "Without quotation you will get results containing one or some of the words of your search entry. Use quotes for the search for exact phrases, citations....",
-    "mehrwortsuche.2" => "Example: search for Shakespears <div class=\"well well-sm\">to be or not to be</div> will deliver many results, but the exact phrase will only be found using <div class=\"well well-sm\">\"to be or nor to be\"</div>",
-    "mehrwortsuche.3" => "Please use quotes to make sure to get your search words in the results list.",
-    "mehrwortsuche.3.example" => '"round-table" "decision"',
-    "mehrwortsuche.4" => "Put words or phrases in quotation marks to search for exact combinations.",
-    "mehrwortsuche.4.example" => '"round-table decision"',
-
-    "grossklein.title" => "Upper case vs. lower case",
-    "grossklein.1" => "Upper case will not be distinguished from lower case",
-    "grossklein.2" => "Example: Searching for",
-    "grossklein.2.example" => "capitalization",
-    "grossklein.3" => "should give the same results as",
-    "grossklein.3.example" => "CAPITALIZATION",
-
-    "result.title" => 'Results',
-    "result.info.1" => 'All results will look like this:<p><div class="image-container"><img src="/img/hilfe-php-resultpic-en-01.png"></div></p>',
-    "result.info.open" => '"OPEN": Click the headline, the link below (URL) or the "OPEN" button to open the result in the same TAB.',
-    "result.info.newtab" => '"OPEN IN NEW TAB" will open the result in a new TAB.',
-    "result.info.anonym" => '"OPEN ANONYMOUSLY": the page will be opened under the proxy protection. There is some information about the proxy further down here.',
-    "result.info.more" => '"MORE": you will get more options, the result changes its appearance to:<p><div class="image-container"><img src="/img/hilfe-php-resultpic-en-02.png"></div></p>',
-    "result.info.2" => 'The new options are:',
-    "result.info.saveresult" => '"Save result in TAB" (Only desktop): The result will be stored in a new TAB. It´ s used for collecting results out of several searches. This TAB appears on the right side of your screen. (info: <a href="#searchinsearch"> Search in search</a>)',
-    "result.info.domainnewsearch" => '"Start a new search on this domain": search only on this domain.',
-    "result.info.hideresult" => '"Hide": hide results from this domain. You can use this filter directly after your search words (e.g. my search words -site:*.wikipedia.org), filters can be concatenated and the wildcard "*" is allowed. See also <a href="#difset"> "Settings"</a> to apply a permanent solution.',
-
-    "urls.title" => "Exclude URLs",
-    "urls.explanation" => "Use \"-url:\" to exclude search results containing specified words.",
-    "urls.example.1" => "Example: You don' t want the word \"dog\" in the results:",
-    "urls.example.2" => "Type <i>my search words</i> -url:dog",
-
-    "bang.title" => "!bangs",
-    "bang.1" => "MetaGer uses a little a special spelling called \"!bang syntax\". A !bang starts with the \"!\" and doesn't contain blanks (\"!twitter\", \"!facebook\" for example). If you use a !bang supported by MetaGer you will see a new entry in the \"Quicktips\". We direct then to the specified service (click the button). Read more about our method departing from others:  <a href=\"/en/hilfe/#bangs\" target=\"_blank\" rel=\"noopener\"> FAQ</a>",
-    "faq.18.h" => "Why are the !bangs not opended directly?",
-    "faq.18.b" => "The !bang -\\\"redirections\\\" are part of our quicktips and they need an additional click. We had to decide between easy-to-use and keep-control-of-data. We find it necessary to show that the links are third party property (DuckDuckGo). So there is a two way protection: first we do not transfer your searchwords but only the !bang to DuckDuckGo. On the other hand the user confirms the !bang-target explicit. We don't have the ressources to maintain all this !bangs, we are sorry.",
-
-    "searchinsearch.title" => "Search in search",
-    "searchinsearch.1" => "The result will be stored in a new TAB appearing at the right side of the screen. It is called \"Saved results\". You can store here single results from several searches. The TAB persists. Entering this TAB you get your personal result list with tools to filter and sort the results. Click another TAB to go back for further searches. You won´t have this if the screen is too small. More info (only german so far): <a href=\"http://blog.suma-ev.de/node/225\" target=\"_blank\" rel=\"noopener\"> SUMA blog</a>.",
-
-    "dienste" => "Tools-free of charge",
-
-    "app.title" => "Android-App",
-    "app.1" => "You can use MetaGer within an app, too. To do so just download the <a href=\"https://play.google.com/store/apps/details?id=de.metager.metagerapp\" target=\"_blank\" rel=\"noopener\">MetaGer App</a> on your Android smartphone.",
-
-    "plugin.title" => "Browser-Plugin",
-    "plugin.1" => "There is a MetaGer Plugin for most of the common web browsers. The plugin provides easy search from the web browsers search field. Find out more: <a href=\"/en/plugin\" rel=\"noopener\">MetaGer Plugin</a>.",
-
-    "suchwortassoziator.title" => "MetaGer-Web-Associator",
-    "suchwortassoziator.1" => 'Ask the <a href="/en/asso/" target="_blank" rel="noopener">MetaGer-Web-Assoziator</a> (Tools / Associator) to find connotations in a subject area. The service doesn&apos;t append upon any language because it uses webdocuments as a source. Therefore, you find any connotations to your used language and vice-versa.',
-    "suchwortassoziator.2" => "Example: you want to know more about \"tick bites\" and its dangers but you forgot the technical terms around this issue. The \"Assoziator\" presents \"Borreliose\" and \"fsme\" among others.",
-    "suchwortassoziator.3" => "Please let us know if something unsuitable appears. Please use our <a href=\"/en/kontakt/\" target=\"_blank\" rel=\"noopener\">contact form</a>.",
-
-    "widget.title" => "MetaGer widget",
-    "widget.1" => "Provide full MetaGer functionality to your own website! Just select Tools / widget on our startpage, decide whether you want a powerful websearch or a sitesearch -which may be useful on your own pages. Enter the domainname and let the script do the rest. Questions to: <a href=\"/en/kontakt/\" target=\"_blank\" rel=\"noopener\">contact form</a>",
-
-    "dienste.kostenlos" => "All our services are cost free. You do not pay with your data.",
-
-    "datenschutz.title" => "Privacy",
-    "datenschutz.faktencheck.heading" => "Fact-Check versus fake news:",
-    "datenschutz.faktencheck.body.1" => "<a href=\"http://www.password-online.de/?wysija-page=1&controller=email&action=view&email_id=280\" target=\"_blanK\" rel=\"noopener\">Ausführliche Anleitung und Beschreibung</a> von <a href=\"http://www.ude.de/\" target=\"_blanK\" rel=\"noopener\">Albrecht Ude</a>",
-    "datenschutz.faktencheck.body.2" => "<a href=\"en/hilfe/faktencheck\">Checklist</a>",
-    "datenschutz.1" => "Tracking-Cookies, Session-IDs, IP addresses",
-    "datenschutz.2" => "We don&apos;t store or work with any personal information (For the purpose of securing our servers against Hacking- and Bot-Attacks, we need to store these information for a short period of time. It will be automatically deleted afterwards). We provide further privacy security services. For more details see below:",
-    "datenschutz.3" => "Click / touch the burger menu to use the tools.",
-
-    "tor.title" => "Tor Hidden Service",
-    "tor.1" => "MetaGer provides the highest reachable security level for your privacy (anonymised IP addresses, servers under german privacy protection law). For further security needs or fear of compromised servers you may use the MetaGer-Tor branch. Please download the specialized webbrowser from <a href=\"https://www.torproject.org/\" target=\"_blank\" rel=\"noopener\">https://www.torproject.org/</a>. You will find help there, too.",
-    "tor.2" => "MetaGer Tor address: http://metagerv65pwclop2rsfzg4jwowpavpwd6grhhlvdgsswvo6ii4akgyd.onion",
-
-    "proxy.title" => "MetaGer proxy server",
-    "proxy.1" => "Click or touch \"open anonymously\" to use the MetaGer proxy server. The provided protection is limited to the website you reached from our result page. Protection persists while you see https://proxy.suma-ev.de/?url=...in your webbrowser‘s address field.",
-
-    "maps.title" => "MetaGer maps",
-    "maps.1" => "MetaGer provides a map function (not on metager.org, please use <a href=\"https://www.metager.de/\" target=\"_blank\" rel=\"noopener\">MetaGer.de</a>) : On a result page you see a new focus on the upper right, called \"Maps\". You receive a map according to your search by click.",
-    "maps.2" => "After loading the map shows POIs according to the MetaGer results. You see them in the right column too. Mouseover a POI highlights its counterpart. Click \"Details\" to get further information (Nominatim data base) to this POI.",
-    "maps.3" => "The maps are rendered before (except for the last three ones) and fast available. Affect the zoom level by mouse-wheel or the \"+ / -\" buttons in the upper left corner of the map.",
-
-    'faq.title' => 'FAQ',
-
-    'metager.title' => 'MetaGer - General remarks',
-    'metager.explanation.1' => 'MetaGer is primarily a meta search engine (founded in 1996). Besides that MetaGer maintains a number of specialized crawlers and indexers of its own.',
-    'metager.explanation.2' => 'Additionally: meta search engines provide a wider coverage and a better overview, because none of the search engines knows the whole internet (Read more: <a href="https://en.wikipedia.org/wiki/Metasearch_engine" target="_blank" rel="noopener">Wikipedia</a>. Every result shows its origin in the right top corner. You may try this specific search engine to look for further results. We have grouped all available search services to several search focuses.',
-
-    'searchengine.title' => 'How does MetaGer query other search engines while preserving user anonymity?',
-    'searchengine.explanation' => 'Since MetaGer is a meta-search engine, every search request you send to us will be stripped of information which could lead to your identification before being sent to e.g. Yahoo. Yahoo will send their response to us which we will then forward to you. This is how we handle every search request sent to us, no matter which one of the offered search engines you use. By doing this we commit ourselves to guarantee your privacy and do not save any personal data. It is possible to verify this, since the source code of MetaGer has been released under a free license <a href=\"https://gitlab.metager.de/open-source/MetaGer\">(https://gitlab.metager.de/open-source/MetaGer)</a>. If you have your own website you could try and find out how our <a href=":widget-link" target="_blank">MetaGer-Widget</a> works. You are also free to create links to our search engine.',
-
-    'content.title' => 'Inappropriate Content / youth protection',
-    'content.explanation.1' => 'I found results with illegal content.',
-    'content.explanation.2' => 'If some content (presented by MetaGer) seems to be illegal, please email us to <a href="mailto:jugendschutz@metager.de" target="_blank" rel="noopener">jugendschutz@metager.de</a>.',
-
-    'selist.title' => 'I want to add metager.de to the search engines list of my browser.',
-    'selist.explanation.1' => 'Please try first to install the newest available plugin. Just use the link below the searchfield, it has an automatic browserdetection.',
-    'selist.explanation.2' => 'Some browser need an URL. Please use "https://metager.de/meta/meta.ger3?eingabe=%s" without qoutation marks. If there are still problems, please <a href="/en/kontakt" target="_blank" rel="noopener">write an email.</a>',
-
-    'proposal.title' => 'How can I delete the search suggestions?',
-    'proposal.explanation' => 'This is provided by your webbrowser. Try to customize the history settings.',
-
-    'assignment.title' => 'How can one match data to individuals ?',
-    'assignment.explanation.1' => 'This could be done by cookies. For example a cookie can be set as a part of making an account. You give your data, a cookie is made out of it and is stored on your PC. Next time using the same service it will know you very well. This kind of data is managed by the webbrowser. It is easy to find and erase all cookies from unknown or not confidable origins. You should do this routinely.',
-    'assignment.explanation.2' => 'The webbrowser sends a heap of data to a website, like the user agent, exact version numbers, the work invironment, the operating system and so on. Maybe there is a matching of data to individuals possible, too.',
-];
diff --git a/resources/lang/en/titles.php b/resources/lang/en/titles.php
index ac138faf24de2499b8ba52d09693c9350ba7675d..84c144c5590c4f3ca34bfad7b2b791ce183e3c08 100644
--- a/resources/lang/en/titles.php
+++ b/resources/lang/en/titles.php
@@ -8,7 +8,7 @@ return [
     "kontakt"	=>	"Contact - MetaGer",
     "spende"	=>	"Donation - MetaGer",
     "datenschutz"	=>	"Privacy - MetaGer",
-    "hilfe"	=>	"Help - MetaGer",
+    "help"	=>	"Help - MetaGer",
     "widget"	=>	"MetaGer Widget",
     "settings"	=>	"Settings",
     "websearch"	=>	"Websearch-Widget - MetaGer",
diff --git a/resources/lang/es/help/help-functions.php b/resources/lang/es/help/help-functions.php
new file mode 100644
index 0000000000000000000000000000000000000000..735052fb63c78fa8994bab2f3076e71b9ebae60d
--- /dev/null
+++ b/resources/lang/es/help/help-functions.php
@@ -0,0 +1,9 @@
+<?php
+
+return [
+
+    "title"	=>	"Ayuda de MetaGer",
+   
+
+
+];
\ No newline at end of file
diff --git a/resources/lang/es/hilfe.php b/resources/lang/es/help/help-mainpages.php
similarity index 91%
rename from resources/lang/es/hilfe.php
rename to resources/lang/es/help/help-mainpages.php
index 987eb0cb163013749ca392d559822f489e862d58..f66f508e6897c225abba26dc95a2f61dceeb1423 100644
--- a/resources/lang/es/hilfe.php
+++ b/resources/lang/es/help/help-mainpages.php
@@ -1,7 +1,7 @@
 <?php
 
 return [
-    "achtung"	=>	"Atención:\r\nDado que desarrollamos y mejoramos nuestro motor de búsqueda  constantemente, puede suceder que siempre haya cambios en la estructura y función. Aunque intentamos adaptar la ayuda lo más rápido posible a los cambios, no podemos descartar la posibilidad de discrepancias temporales en partes de las instrucciones.",
+
     "title"	=>	"Ayuda de MetaGer",
     "title.2"	=>	"Uso del motor de búsqueda",
     "startpage.title"	=>	"La página de inicio",
@@ -27,4 +27,5 @@ return [
     "mehrwortsuche.title"	=>	"Búsqueda de varias palabras",
     "mehrwortsuche.1"	=>	"Si busca más de una palabra en MetaGer, automáticamente intentaremos proporcionarle los resultados que contengan todas las palabras o que se acerquen lo más posible a ellas.",
     "mehrwortsuche.2"	=>	"Si eso no es suficiente para usted, tiene dos opciones para refinar su búsqueda:"
-];
+
+];
\ No newline at end of file
diff --git a/resources/lang/es/help/help-privacy-protection.php b/resources/lang/es/help/help-privacy-protection.php
new file mode 100644
index 0000000000000000000000000000000000000000..1954477b3454ba9ba124bee8be04e21176d45560
--- /dev/null
+++ b/resources/lang/es/help/help-privacy-protection.php
@@ -0,0 +1,7 @@
+<?php
+
+return [
+    "title"	=>	"Ayuda de MetaGer",
+   
+
+];
\ No newline at end of file
diff --git a/resources/lang/es/help/help-services.php b/resources/lang/es/help/help-services.php
new file mode 100644
index 0000000000000000000000000000000000000000..81c8b8abd4469842f7f39f6b7aad7b319e985f8d
--- /dev/null
+++ b/resources/lang/es/help/help-services.php
@@ -0,0 +1,7 @@
+<?php
+
+return [
+
+    "title"	=>	"Ayuda de MetaGer",
+   
+];
\ No newline at end of file
diff --git a/resources/lang/es/help/help.php b/resources/lang/es/help/help.php
new file mode 100644
index 0000000000000000000000000000000000000000..32416aa39ce76debb8254ecea103026b67d52eca
--- /dev/null
+++ b/resources/lang/es/help/help.php
@@ -0,0 +1,8 @@
+<?php
+
+return [
+    "achtung"	=>	"Atención:\r\nDado que desarrollamos y mejoramos nuestro motor de búsqueda  constantemente, puede suceder que siempre haya cambios en la estructura y función. Aunque intentamos adaptar la ayuda lo más rápido posible a los cambios, no podemos descartar la posibilidad de discrepancias temporales en partes de las instrucciones.",
+    "title"	=>	"Ayuda de MetaGer",
+    "title.2"	=>	"Uso del motor de búsqueda",
+
+];
diff --git a/resources/lang/es/titles.php b/resources/lang/es/titles.php
index f74391b5f96cc6217eab9dde8a126cbdbe3ac700..cd8675725a3871fa55a39826b2fb22dc19e31a0f 100644
--- a/resources/lang/es/titles.php
+++ b/resources/lang/es/titles.php
@@ -6,7 +6,7 @@
     "kontakt"	=>	"Contacto - MetaGer",
     "spende"	=>	"Donaciones - MetaGer",
     "datenschutz"	=>	"Protección de datos y privacidad - MetaGer",
-    "hilfe"	=>	"Ayuda - MetaGer",
+    "help"	=>	"Ayuda - MetaGer",
     "widget"	=>	"MetaGer Widget",
     "settings"	=>	"Preferencias",
     "websearch"	=>	"Widget para buscar la web - MetaGer",
diff --git a/resources/less/metager/pages/all.less b/resources/less/metager/pages/all.less
index 7bbdb618ffd0c075968057d9c3f8123b546bf625..59a4c0851c9d966b9adac35ba102c49a6f4f0d1b 100644
--- a/resources/less/metager/pages/all.less
+++ b/resources/less/metager/pages/all.less
@@ -1,7 +1,7 @@
 
 @import "./contact.less";
 @import "./donation.less";
-@import "./help_faq.less";
+@import "./help.less";
 @import "./language.less";
 @import "./privacy.less";
 @import "./resultpage.less";
diff --git a/resources/less/metager/pages/help.less b/resources/less/metager/pages/help.less
new file mode 100644
index 0000000000000000000000000000000000000000..cce8e2406f43d077118d398fbb411227463ba78e
--- /dev/null
+++ b/resources/less/metager/pages/help.less
@@ -0,0 +1,200 @@
+.hilfe,
+.faq {
+    section {
+        .card;
+
+        @media(max-width: @screen-medium) {
+            .card;
+        }
+
+        @media(max-width: @screen-small) {
+            .card;
+        }
+
+        margin: 4px 0;
+
+        .search-example {
+            border: 1px solid #aaa;
+            background-color: @background-color;
+            border-radius: 5px;
+            padding: 10px;
+        }
+
+        div.image-container {
+            align-items: center;
+            justify-content: center;
+
+            img {
+                margin: 10px 0;
+                padding: 8px;
+                border: 1px solid @border-color;
+                border-radius: 3px;
+            }
+        }
+    }
+
+    .fake-result {
+        *:hover {
+            overflow: visible !important;
+        }
+
+        .result-footer {
+            overflow: hidden;
+            align-items: center;
+        }
+
+        .open-result-options label {
+            padding: 10px;
+            border: 2px dashed red;
+            border-radius: 100%;
+            color: black;
+            font-size: 1em;
+            text-decoration: none;
+            font-weight: normal;
+        }
+    }
+}
+.help-back-button, .help-back-button:visited {
+    font-size: medium;
+    color: @text-color;
+}
+.help-back-button .back-arrow {
+    width:10px ;
+}
+.help-topic-row {
+    display: flex;
+    gap:4%;
+    flex-wrap:wrap;
+}
+.help-topic, .help-topic:visited {
+        width:20vw;
+        max-width: 220px;
+        min-width: 160px;
+        height: 100px;
+        display: block;
+        border: solid #5b5b5b8f 2px;
+        border-radius: 5px;
+        position: relative;
+        color: @text-color;
+        flex-shrink: 0;
+        background-color: @card-background-color;
+} 
+
+.help-topic:hover {
+    color:@text-color;
+}
+
+.help-topic > p {
+        bottom: 0px;
+        position: absolute;
+        padding: 10px;
+        font-weight: bold;
+        padding-bottom: 0px;
+}
+.help-topic:hover{
+    border-color:#f47216 ;
+}
+
+#help-topic-mainpage {
+    background-image: url("/img/startseite-icon-help.svg");
+    background-size: 130px;
+    background-repeat: no-repeat;
+    background-position: 35% 35%;
+}
+#help-topic-searchfield {
+    background-image: url("/img/searchfield-icon-help.svg");
+    background-size: 130px;
+    background-repeat: no-repeat;
+    background-position: 35% 25%;
+}
+#help-topic-result {
+background-image: url("/img/result-icon-help.svg");
+background-size: 130px;
+background-repeat: no-repeat;
+background-position: 35% 20%;
+
+}
+#help-topic-settings {
+    background-image: url("/img/icon-settings-grau.svg");
+    background-size: 100px;
+    background-repeat: no-repeat;
+    background-position: top -50px left -21px;
+}
+
+
+#help-topic-searchfunctions {
+    background-image: url("/img/lupe-grau.svg");
+    background-size: 45px;
+    background-repeat: no-repeat;
+    background-position: 50% 20%;
+    
+}
+ #help-topic-bangs {
+    background-image: url("/img/bangs-icon-help.svg");
+    background-size: 20px;
+    background-repeat: no-repeat;
+    background-position: 55% 35%;
+        
+}
+#help-topic-searchinsearch {
+    background-image: url("/img/searchinsearch-icon-help.svg");
+    background-size: 50px;
+    background-repeat: no-repeat;
+    background-position: 50% 20%;
+        
+}
+#help-topic-addmetager {
+    background-image: url("/img/plug-in.svg");
+    background-size: 55px;
+    background-repeat: no-repeat;
+    background-position: 80% 25%;
+        
+}
+#help-topic-app {
+    background-image: url("/img/app-grau.svg");
+    background-size: 50px;
+    background-repeat: no-repeat;
+    background-position: 50% 20%;
+}
+#help-topic-maps {
+    background-image: url("/img/maps-grau.svg");
+    background-size: 50px;
+    background-repeat: no-repeat;
+    background-position: 50% 20%;
+}
+#help-topic-tracking {
+    background-image: url("/img/cookies.svg");
+    background-size: 50px;
+    background-repeat: no-repeat;
+    background-position: 50% 20%;
+}
+#help-topic-content {
+    background-image: url("/img/jugendschutz.svg");
+    background-size: 50px;
+    background-repeat: no-repeat;
+    background-position: 50% 20%;
+}
+#help-topic-widget {
+    background-image: url("/img/widget.svg");
+    background-size: 110px;
+    background-repeat: no-repeat;
+    background-position: 50% 20%;
+}
+#help-topic-asso {
+    background-image: url("/img/suchwortasso.svg");
+    background-size: 50px;
+    background-repeat: no-repeat;
+    background-position: 50% 20%;      
+}
+#help-topic-proxy {
+    background-image: url("/img/proxy.svg");
+    background-size: 40px;
+    background-repeat: no-repeat;
+    background-position: 50% 20%;      
+}
+#help-topic-tor {
+    background-image: url("/img/tor-icon.svg");
+    background-size: 90px;
+    background-repeat: no-repeat;
+    background-position: 50% 25%;      
+}
\ No newline at end of file
diff --git a/resources/less/metager/pages/help_faq.less b/resources/less/metager/pages/help_faq.less
deleted file mode 100644
index 1c0161d63104980bf273bce440d9430218901ff5..0000000000000000000000000000000000000000
--- a/resources/less/metager/pages/help_faq.less
+++ /dev/null
@@ -1,56 +0,0 @@
-.hilfe,
-.faq {
-    section {
-        .card;
-
-        @media(max-width: @screen-medium) {
-            .card;
-        }
-
-        @media(max-width: @screen-small) {
-            .card;
-        }
-
-        margin: 4px 0;
-
-        .search-example {
-            border: 1px solid #aaa;
-            background-color: @background-color;
-            border-radius: 5px;
-            padding: 10px;
-        }
-
-        div.image-container {
-            align-items: center;
-            justify-content: center;
-
-            img {
-                margin: 10px 0;
-                padding: 8px;
-                border: 1px solid @border-color;
-                border-radius: 3px;
-            }
-        }
-    }
-
-    .fake-result {
-        *:hover {
-            overflow: visible !important;
-        }
-
-        .result-footer {
-            overflow: hidden;
-            align-items: center;
-        }
-
-        .open-result-options label {
-            padding: 10px;
-            border: 2px dashed red;
-            border-radius: 100%;
-            color: black;
-            font-size: 1em;
-            text-decoration: none;
-            font-weight: normal;
-        }
-    }
-}
\ No newline at end of file
diff --git a/resources/views/faktencheck.blade.php b/resources/views/help/faktencheck.blade.php
similarity index 100%
rename from resources/views/faktencheck.blade.php
rename to resources/views/help/faktencheck.blade.php
diff --git a/resources/views/help/help-functions.blade.php b/resources/views/help/help-functions.blade.php
new file mode 100644
index 0000000000000000000000000000000000000000..e7f90fae24a0dee8f536db7b5ecd84787e89de83
--- /dev/null
+++ b/resources/views/help/help-functions.blade.php
@@ -0,0 +1,60 @@
+@extends('layouts.subPages', ['page' => 'hilfe'])
+
+@section('title', $title )
+
+@section('content')
+<h1 class="page-title">{!! trans('help/help-functions.title') !!}</h1>
+<section>
+<a  class=help-back-button href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe") }}"><img class="back-arrow" src=/img/back-arrow.svg>{!! trans('help/help-functions.backarrow') !!}</a>
+		<h2 id="searchfunctions">{!! trans('help/help-functions.suchfunktion.title') !!}</h2>
+		<h3 id="stopwordsearch">{!! trans('help/help-functions.stopworte.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-functions.stopworte.1') !!}</p>
+			<ul class="dotlist">
+				<li>{!! trans('help/help-functions.stopworte.2') !!}</li>
+				<li class="nodot"><div class="search-example">{!! trans('help/help-functions.stopworte.3') !!}</div></li>
+			</ul>
+		</div>
+		<h3 id="severalwords">{!! trans('help/help-functions.mehrwortsuche.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-functions.mehrwortsuche.1') !!}</p>
+			<p>{!! trans('help/help-functions.mehrwortsuche.2') !!}</p>
+			<ul class="dotlist">
+				<li>{!! trans('help/help-functions.mehrwortsuche.3') !!}</li>
+				<li class="nodot"><div class = "search-example">{!! trans('help/help-functions.mehrwortsuche.3.example') !!}</div></li>
+				<li>{!! trans('help/help-functions.mehrwortsuche.4') !!}</li>
+				<li class="nodot"><div class = "search-example">{!! trans('help/help-functions.mehrwortsuche.4.example') !!}</div></li>
+			</ul>
+		</div>
+
+		<h3 id="urls">{!! trans('help/help-functions.urls.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-functions.urls.explanation') !!}</p>
+			<ul class="dotlist">
+				<li>{!! trans('help/help-functions.urls.example.1') !!}</li>
+				<li class="nodot"><div class = "search-example">{!! trans('help/help-functions.urls.example.2') !!}</div></li>
+			</ul>
+		</div>
+	</section>
+	<section id="bangs">
+		<h3>{!! trans('help/help-functions.bang.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-functions.bang.1') !!}</p>
+		</div>
+	</section>
+	<section id="searchinsearch">
+		<h3>{!! trans('help/help-functions.searchinsearch.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-functions.searchinsearch.1') !!}</p>
+		</div>
+	</section>
+	<section id="selist">
+		<h3>{!! trans('help/help-functions.selist.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-functions.selist.explanation.1') !!}</p>
+			<p>{!! trans('help/help-functions.selist.explanation.2') !!}</p>
+
+		</div>
+	</section>
+
+@endsection
\ No newline at end of file
diff --git a/resources/views/help/help-mainpages.blade.php b/resources/views/help/help-mainpages.blade.php
new file mode 100644
index 0000000000000000000000000000000000000000..41cf0218bb05a39bee4ea64073c3a464ec47a2b2
--- /dev/null
+++ b/resources/views/help/help-mainpages.blade.php
@@ -0,0 +1,62 @@
+@extends('layouts.subPages', ['page' => 'hilfe'])
+
+@section('title', $title )
+
+@section('content')
+	<h1 class="page-title">{!! trans('help/help-mainpages.title') !!}</h1>
+
+	<section id="startpage">
+		<a  class=help-back-button href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe") }}"><img class="back-arrow" src=/img/back-arrow.svg>{!! trans('help/help-mainpages.backarrow') !!}</a>
+		<h2>{!! trans('help/help-mainpages.title.2') !!}</h2>
+
+		<h3 id="startseite">{!! trans('help/help-mainpages.startpage.title') !!}</h3>
+		<p>{!! trans('help/help-mainpages.startpage.info') !!}</p>
+		<h3 id="suchfeld">{!! trans('help/help-mainpages.searchfield.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-mainpages.searchfield.info') !!}</p>
+			<ul class="dotlist">
+				<li>{!! trans('help/help-mainpages.searchfield.memberkey') !!}</li>
+				<li>{!! trans('help/help-mainpages.searchfield.slot') !!}</li>
+				<li>{!! trans('help/help-mainpages.searchfield.search') !!}</li>
+				<li>{!! trans('help/help-mainpages.searchfield.morefunctions') !!}</li>
+			</ul>
+		</div>
+        <h3 id="ergebnis">{!! trans('help/help-mainpages.resultpage.title') !!}</h3>
+		    <div>
+			    <ul class="dotlist">
+				    <li>{!! trans('help/help-mainpages.resultpage.foci') !!}</li>
+				    <li>{!! trans('help/help-mainpages.resultpage.choice') !!}</li>
+				        <ul class="dotlist">
+				        	<li>{!! trans('help/help-mainpages.resultpage.filter') !!}</li>
+				        	<li id="difset">{!! trans('help/help-mainpages.resultpage.settings') !!}</li>
+            </div>
+		<h3>{!! trans('help/help-mainpages.result.title') !!}</h3>
+			<div>
+				<p>{!! trans('help/help-mainpages.result.info.1') !!}</p>
+				<ul class = "dotlist">
+					<li>{!! trans('help/help-mainpages.result.info.open') !!}</li>
+					<li>{!! trans('help/help-mainpages.result.info.newtab') !!}</li>
+					<li>{!! trans('help/help-mainpages.result.info.anonym') !!}</li>
+					<li>{!! trans('help/help-mainpages.result.info.more') !!}</li>
+				</ul>
+				<p>{!! trans('help/help-mainpages.result.info.2') !!}</p>
+				<ul class = "dotlist">
+					<li>{!! trans('help/help-mainpages.result.info.saveresult') !!}</li>
+					<li>{!! trans('help/help-mainpages.result.info.domainnewsearch') !!}</li>
+					<li>{!! trans('help/help-mainpages.result.info.hideresult') !!}</li>
+				</ul>
+			</div>
+        <h3 id="einstellungen">{!! trans('help/help-mainpages.settings.title') !!}</h3>
+            <ul>
+                <li>@lang('help/help-mainpages.settings.1', ["link" => LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), route('showAllSettings', ['url' => url()->full()])) ])</li>
+                <li>{!! trans('help/help-mainpages.settings.2') !!}</li>
+                <li>{!! trans('help/help-mainpages.settings.3') !!}</li>
+                <li>{!! trans('help/help-mainpages.settings.4') !!}</li>
+                <li>{!! trans('help/help-mainpages.settings.5') !!}</li>
+                <li>{!! trans('help/help-mainpages.settings.6') !!}</li>
+                <li>{!! trans('help/help-mainpages.settings.7') !!}</li>
+    </section>
+
+
+
+@endsection
\ No newline at end of file
diff --git a/resources/views/help/help-privacy-protection.blade.php b/resources/views/help/help-privacy-protection.blade.php
new file mode 100644
index 0000000000000000000000000000000000000000..4ca96c579ee84505029591b202aaaf75f76f0c99
--- /dev/null
+++ b/resources/views/help/help-privacy-protection.blade.php
@@ -0,0 +1,37 @@
+@extends('layouts.subPages', ['page' => 'hilfe'])
+
+@section('title', $title )
+
+@section('content')
+<h1 class="page-title">{!! trans('help/help-privacy-protection.title') !!}</h1>
+<a  class=help-back-button href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe") }}"><img class="back-arrow" src=/img/back-arrow.svg>{!! trans('help/help-privacy-protection.backarrow') !!}</a>
+<h2>{!! trans('help/help-privacy-protection.datenschutz.title') !!}</h2>
+	<section id="tracking">
+		<h3>{!! trans('help/help-privacy-protection.datenschutz.1') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-privacy-protection.datenschutz.2') !!}</p>
+			<p>{!! trans('help/help-privacy-protection.datenschutz.3') !!}</p>
+		</div>
+	</section>
+	<section id="torhidden">
+		<h3>{!! trans('help/help-privacy-protection.tor.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-privacy-protection.tor.1') !!}</p>
+			<p>{!! trans('help/help-privacy-protection.tor.2') !!}</p>
+		</div>
+	</section>
+	<section id="proxy">
+		<h3>{!! trans('help/help-privacy-protection.proxy.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-privacy-protection.proxy.1') !!}</p>
+		</div>
+	</section>
+
+	<section id="content">
+		<h3>{!! trans('help/help-privacy-protection.content.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-privacy-protection.content.explanation.1') !!}</p>
+			<p>{!! trans('help/help-privacy-protection.content.explanation.2') !!}</p>
+		</div>
+	</section>
+    @endsection
\ No newline at end of file
diff --git a/resources/views/help/help-services.blade.php b/resources/views/help/help-services.blade.php
new file mode 100644
index 0000000000000000000000000000000000000000..7b5a4dc7efc3c6c3b7608ab53fb8539fb259a214
--- /dev/null
+++ b/resources/views/help/help-services.blade.php
@@ -0,0 +1,40 @@
+@extends('layouts.subPages', ['page' => 'hilfe'])
+
+@section('title', $title )
+
+@section('content')
+<h1 class="page-title">{!! trans('help/help-services.title') !!}</h1>
+<a  class=help-back-button href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe") }}"><img class="back-arrow" src=/img/back-arrow.svg>{!! trans('help/help-services.backarrow') !!}</a>
+<h2 id="dienste">{!! trans('help/help-services.dienste') !!}</h2>
+	<h3><img class= "mg-icon" src="/img/angle-double-right.svg" alt="{{ trans('angle-double-right.alt') }}" aria-hidden= "true"> {!! trans('help/help-services.dienste.kostenlos') !!}</h3>
+	<section id="app">
+		<div id="mg-app" style="margin-top: -100px"></div>
+		<div style="margin-top: 100px"></div>
+		<h3>{!! trans('help/help-services.app.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-services.app.1') !!}</p>
+		</div>
+	</section>
+
+	<section id="asso">
+		<h3>{!! trans('help/help-services.suchwortassoziator.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-services.suchwortassoziator.1') !!}</p>
+			<p>{!! trans('help/help-services.suchwortassoziator.2') !!}</p>
+			<p>{!! trans('help/help-services.suchwortassoziator.3') !!}</p>
+		</div>
+	</section>
+	<section id="widget">
+		<h3>{!! trans('help/help-services.widget.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-services.widget.1') !!}</p>
+		</div>
+	</section>
+	<section id="maps">
+		<h3>{!! trans('help/help-services.maps.title') !!}</h3>
+		<div>
+			<p>{!! trans('help/help-services.maps.1') !!}</p>
+			<p>{!! trans('help/help-services.maps.2') !!}</p>
+			<p>{!! trans('help/help-services.maps.3') !!}</p>
+		</div>
+@endsection
\ No newline at end of file
diff --git a/resources/views/help/help.blade.php b/resources/views/help/help.blade.php
new file mode 100644
index 0000000000000000000000000000000000000000..179b710f44ddfbc446a34a497e1109314f469ca0
--- /dev/null
+++ b/resources/views/help/help.blade.php
@@ -0,0 +1,69 @@
+@extends('layouts.subPages', ['page' => 'hilfe'])
+
+@section('title', $title )
+
+@section('content')
+<h1>{!! trans('help/help.title') !!}</h1>
+<h2>{!! trans('help/help.tableofcontents.1') !!}</h2>
+<div class="help-topic-row">
+	<a id=help-topic-mainpage href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/hauptseiten") }}" class="help-topic">
+		<p>{!! trans('help/help.tableofcontents.1.1') !!}</p>
+	</a>
+	<a id=help-topic-searchfield href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/hauptseiten#suchfeld") }}" class="help-topic">
+		<p>{!! trans('help/help.tableofcontents.1.2') !!}</p>
+	</a>
+	<a id=help-topic-result href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/hauptseiten#ergebnis") }}" class="help-topic">
+		<p>{!! trans('help/help.tableofcontents.1.3') !!}</p>
+	</a>
+	<a id=help-topic-settings href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/hauptseiten#einstellungen") }}" class="help-topic">
+		<p>{!! trans('help/help.tableofcontents.1.4') !!}</p>
+	</a>
+</div>
+
+<h2>{!! trans('help/help.tableofcontents.2') !!}</h2>
+<div class="help-topic-row">
+	<a id=help-topic-searchfunctions href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/funktionen") }}" class="help-topic">
+		<p>{!! trans('help/help.tableofcontents.2.1') !!}</p>
+	</a>
+	<a id=help-topic-bangs href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/funktionen#bangs") }}" class="help-topic">
+		<p>{!! trans('help/help.tableofcontents.2.2') !!}<br></p>
+	</a>
+	<a id=help-topic-searchinsearch href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/funktionen#searchinsearch") }}" class="help-topic">
+		<p>{!! trans('help/help.tableofcontents.2.3') !!}<br></p>
+	</a>
+	<a id=help-topic-addmetager href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/funktionen#selist") }}" class="help-topic">
+		<p>{!! trans('help/help.tableofcontents.2.4') !!}<br></p>
+	</a>
+</div>
+
+<h2>{!! trans('help/help.tableofcontents.3') !!}</h2>
+	<div class="help-topic-row">
+		<a id=help-topic-tracking href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/datensicherheit#tracking") }}" class="help-topic"><p>{!! trans('help/help.tableofcontents.3.2') !!}</p>
+		</a>
+		<a id=help-topic-tor href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/datensicherheit#torhidden") }}" class="help-topic"><p>{!! trans('help/help.tableofcontents.3.3') !!}<br></p>
+		</a>
+		<a id= help-topic-proxy href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/datensicherheit#proxy") }}" class="help-topic"><p>{!! trans('help/help.tableofcontents.3.4') !!}<br></p>
+		</a>
+		<a id=help-topic-content href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/datensicherheit#content") }}" class="help-topic"><p>{!! trans('help/help.tableofcontents.3.5') !!}<br></p>
+		</a>
+	</div>
+		
+<h2>{!! trans('help/help.tableofcontents.4') !!}</h2>
+
+	<div class="help-topic-row">
+		<a id=help-topic-app href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/dienste") }}" class="help-topic">
+			<p>{!! trans('help/help.tableofcontents.4.1') !!}<br></p>
+		</a>
+		</a>
+		<a id=help-topic-asso href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/dienste#asso") }}" class="help-topic">
+			<p>{!! trans('help/help.tableofcontents.4.3') !!}<br></p>
+		</a>
+		<a id=help-topic-widget href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/dienste#widget") }}" class="help-topic">
+			<p>{!! trans('help/help.tableofcontents.4.4') !!}<br></p>
+		</a>		
+		<a id=help-topic-maps href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/hilfe/dienste#map") }}" class="help-topic">
+			<p>{!! trans('help/help.tableofcontents.4.5') !!}<br></p>
+		</a>
+		
+	</div>
+@endsection
\ No newline at end of file
diff --git a/resources/views/hilfe.blade.php b/resources/views/hilfe.blade.php
deleted file mode 100644
index 2efb3be40f02b3f6e1816b15c7d29099cc70a725..0000000000000000000000000000000000000000
--- a/resources/views/hilfe.blade.php
+++ /dev/null
@@ -1,226 +0,0 @@
-@extends('layouts.subPages', ['page' => 'hilfe'])
-
-@section('title', $title )
-
-@section('content')
-<h1 class="page-title">{!! trans('hilfe.title') !!}</h1>
-
-<section id="startpage">
-	<h1>{!! trans('hilfe.title.2') !!}</h1>
-	<h2>{!! trans('hilfe.startpage.title') !!}</h2>
-	<p>{!! trans('hilfe.startpage.info') !!}</p>
-	<h2>{!! trans('hilfe.searchfield.title') !!}</h2>
-	<div>
-		<p>{!! trans('hilfe.searchfield.info') !!}</p>
-		<ul class="dotlist">
-			<li>{!! trans('hilfe.searchfield.memberkey') !!}</li>
-			<li>{!! trans('hilfe.searchfield.slot') !!}</li>
-			<li>{!! trans('hilfe.searchfield.search') !!}</li>
-		</ul>
-	</div>
-
-	<h2>{!! trans('hilfe.resultpage.title') !!}</h2>
-	<div>
-		<ul class="dotlist">
-			<li>{!! trans('hilfe.resultpage.foci') !!}</li>
-			<li>{!! trans('hilfe.resultpage.choice') !!}</li>
-			<ul class="dotlist">
-				<li>{!! trans('hilfe.resultpage.filter') !!}</li>
-				<li id="difset">{!! trans('hilfe.resultpage.settings.0') !!}</li>
-				<ol>
-					<li>{!! trans('hilfe.resultpage.settings.1') !!}</li>
-					<li>{!! trans('hilfe.resultpage.settings.2') !!}</li>
-					<li>{!! trans('hilfe.resultpage.settings.3') !!}</li>
-					<li>{!! trans('hilfe.resultpage.settings.4') !!}</li>
-				</ol>
-			</ul>
-		</ul>
-	</div>
-</section>
-<section id="results">
-	<h1>{!! trans('hilfe.result.title') !!}</h1>
-	<div>
-		<p>{!! trans('hilfe.result.info.1') !!}</p>
-		<ul class="dotlist">
-			<li>{!! trans('hilfe.result.info.open') !!}</li>
-			<li>{!! trans('hilfe.result.info.newtab') !!}</li>
-			<li>{!! trans('hilfe.result.info.anonym') !!}</li>
-			<li>{!! trans('hilfe.result.info.more') !!}</li>
-		</ul>
-		<p>{!! trans('hilfe.result.info.2') !!}</p>
-		<ul class="dotlist">
-			<li>{!! trans('hilfe.result.info.saveresult') !!}</li>
-			<li>{!! trans('hilfe.result.info.domainnewsearch') !!}</li>
-			<li>{!! trans('hilfe.result.info.hideresult') !!}</li>
-		</ul>
-	</div>
-</section>
-<section>
-	<h1>{!! trans('hilfe.stopworte.title') !!}</h1>
-	<div>
-		<p>{!! trans('hilfe.stopworte.1') !!}</p>
-		<ul class="dotlist">
-			<li>{!! trans('hilfe.stopworte.2') !!}</li>
-			<li class="nodot">
-				<div class="search-example">{!! trans('hilfe.stopworte.3') !!}</div>
-			</li>
-		</ul>
-	</div>
-</section>
-<section id="severalwords">
-	<h1>{!! trans('hilfe.mehrwortsuche.title') !!}</h1>
-	<div>
-		<p>{!! trans('hilfe.mehrwortsuche.1') !!}</p>
-		<p>{!! trans('hilfe.mehrwortsuche.2') !!}</p>
-		<ul class="dotlist">
-			<li>{!! trans('hilfe.mehrwortsuche.3') !!}</li>
-			<li class="nodot">
-				<div class="search-example">{!! trans('hilfe.mehrwortsuche.3.example') !!}</div>
-			</li>
-			<li>{!! trans('hilfe.mehrwortsuche.4') !!}</li>
-			<li class="nodot">
-				<div class="search-example">{!! trans('hilfe.mehrwortsuche.4.example') !!}</div>
-			</li>
-		</ul>
-	</div>
-</section>
-
-<section id="capitalizationrules">
-	<h1>{!! trans('hilfe.grossklein.title') !!}</h1>
-	<div>
-		<p>{!! trans('hilfe.grossklein.1') !!}</p>
-		<ul class="dotlist">
-			<li>{!! trans('hilfe.grossklein.2') !!}</li>
-			<li class="nodot">
-				<div class="search-example">{!! trans('hilfe.grossklein.2.example') !!}</div>
-			</li>
-			<li class="nodot">{!! trans('hilfe.grossklein.3') !!}</li>
-			<li class="nodot">
-				<div class="search-example">{!! trans('hilfe.grossklein.3.example') !!}</div>
-			</li>
-		</ul>
-	</div>
-</section>
-<section id="urls">
-	<h1>{!! trans('hilfe.urls.title') !!}</h1>
-	<div>
-		<p>{!! trans('hilfe.urls.explanation') !!}</p>
-		<ul class="dotlist">
-			<li>{!! trans('hilfe.urls.example.1') !!}</li>
-			<li class="nodot">
-				<div class="search-example">{!! trans('hilfe.urls.example.2') !!}</div>
-			</li>
-		</ul>
-	</div>
-</section>
-<section id="bangs">
-	<h1>{!! trans('hilfe.bang.title') !!}</h1>
-	<div>
-		<p>{!! trans('hilfe.bang.1') !!}</p>
-	</div>
-</section>
-<section id="searchinsearch">
-	<h1>{!! trans('hilfe.searchinsearch.title') !!}</h1>
-	<div>
-		<p>{!! trans('hilfe.searchinsearch.1') !!}</p>
-	</div>
-</section>
-<h1 id="dienste">{!! trans('hilfe.dienste') !!}</h1>
-<h2><img class="mg-icon" src="/img/angle-double-right.svg" alt="{{ trans('angle-double-right.alt') }}" aria-hidden="true"> {!! trans('hilfe.dienste.kostenlos') !!}</h2>
-<section id="app">
-	<div id="mg-app" style="margin-top: -100px"></div>
-	<div style="margin-top: 100px"></div>
-	<h3>{!! trans('hilfe.app.title') !!}</h3>
-	<div>
-		<p>{!! trans('hilfe.app.1') !!}</p>
-	</div>
-</section>
-<section id="plugin">
-	<h3>{!! trans('hilfe.plugin.title') !!}</h3>
-	<div>
-		<p>{!! trans('hilfe.plugin.1') !!}</p>
-	</div>
-</section>
-<section id="torhidden">
-	<h3>{!! trans('hilfe.tor.title') !!}</h3>
-	<div>
-		<p>{!! trans('hilfe.tor.1') !!}</p>
-		<p>{!! trans('hilfe.tor.2') !!}</p>
-	</div>
-</section>
-<section id="proxy">
-	<h3>{!! trans('hilfe.proxy.title') !!}</h3>
-	<div>
-		<p>{!! trans('hilfe.proxy.1') !!}</p>
-	</div>
-</section>
-
-<section id="maps">
-	<h3>{!! trans('hilfe.maps.title') !!}</h3>
-	<div>
-		<p>{!! trans('hilfe.maps.1') !!}</p>
-		<p>{!! trans('hilfe.maps.2') !!}</p>
-		<p>{!! trans('hilfe.maps.3') !!}</p>
-	</div>
-</section id="faq">
-<section id="asso">
-	<h3>{!! trans('hilfe.suchwortassoziator.title') !!}</h3>
-	<div>
-		<p>{!! trans('hilfe.suchwortassoziator.1') !!}</p>
-		<p>{!! trans('hilfe.suchwortassoziator.2') !!}</p>
-		<p>{!! trans('hilfe.suchwortassoziator.3') !!}</p>
-	</div>
-</section>
-<section id="widget">
-	<h3>{!! trans('hilfe.widget.title') !!}</h3>
-	<div>
-		<p>{!! trans('hilfe.widget.1') !!}</p>
-	</div>
-</section>
-<h1>{!! trans('hilfe.datenschutz.title') !!}</h1>
-<section id="factcheck">
-	<h2>{!! trans('hilfe.datenschutz.faktencheck.heading') !!}</h2>
-	<div>
-		<p>@lang('hilfe.datenschutz.faktencheck.body.1')</p>
-		<p>@lang('hilfe.datenschutz.faktencheck.body.2')</p>
-	</div>
-</section>
-<section id="tracking">
-	<h2>{!! trans('hilfe.datenschutz.1') !!}</h2>
-	<div>
-		<p>{!! trans('hilfe.datenschutz.2') !!}</p>
-		<p>{!! trans('hilfe.datenschutz.3') !!}</p>
-	</div>
-</section>
-
-<h1>{!! trans('hilfe.faq.title') !!}</h1>
-<section>
-	<h2>{!! trans('hilfe.metager.title') !!}</h2>
-	<p>{!! trans('hilfe.metager.explanation.1') !!}</p>
-	<p>{!! trans('hilfe.metager.explanation.2') !!}</p>
-</section>
-<section>
-	<h2>{!! trans('hilfe.searchengine.title') !!}</h2>
-	<p>{!! trans('hilfe.searchengine.explanation') !!}</p>
-</section>
-<section>
-	<h2>{!! trans('hilfe.content.title') !!}</h2>
-	<p>{!! trans('hilfe.content.explanation.1') !!}</p>
-	<p>{!! trans('hilfe.content.explanation.2') !!}</p>
-</section>
-<section>
-	<h2>{!! trans('hilfe.selist.title') !!}</h2>
-	<p>{!! trans('hilfe.selist.explanation.1') !!}</p>
-	<p>{!! trans('hilfe.selist.explanation.2') !!}</p>
-</section>
-<section>
-	<h2>{!! trans('hilfe.proposal.title') !!}</h2>
-	<p>{!! trans('hilfe.proposal.explanation') !!}</p>
-</section>
-<section>
-	<h2>{!! trans('hilfe.assignment.title') !!}</h2>
-	<p>{!! trans('hilfe.assignment.explanation.1') !!}</p>
-	<p>{!! trans('hilfe.assignment.explanation.2') !!}</p>
-</section>
-<div class="alert alert-warning" role="alert">{!! trans('hilfe.achtung') !!}</div>
-@endsection
\ No newline at end of file
diff --git a/routes/web.php b/routes/web.php
index 06f585d1a8d525cc6febdd347ff7a83fea5bc2fc..aa5a62adcb044295dc4f98bea29616d57e0f59dd 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -139,19 +139,42 @@ Route::get('search-engine', function () {
         ->with('title', trans('titles.search-engine'))
         ->with('navbarFocus', 'info');
 });
-
 Route::get('hilfe', function () {
-    return view('hilfe')
-        ->with('title', trans('titles.hilfe'))
+    return view('help/help')
+        ->with('title', trans('titles.help'))
         ->with('navbarFocus', 'hilfe');
 });
 
 Route::get('hilfe/faktencheck', function () {
-    return view('faktencheck')
+    return view('help/faktencheck')
         ->with('title', trans('titles.faktencheck'))
         ->with('navbarFocus', 'hilfe');
 });
 
+Route::get('hilfe/hauptseiten', function () {
+    return view('help/help-mainpages')
+        ->with('title', trans('titles.help-mainpages'))
+        ->with('navbarFocus', 'hilfe');
+});
+
+Route::get('hilfe/funktionen', function () {
+    return view('help/help-functions')
+        ->with('title', trans('titles.help-functions'))
+        ->with('navbarFocus', 'hilfe');
+});
+
+Route::get('hilfe/dienste', function () {
+    return view('help/help-services')
+        ->with('title', trans('titles.help-services'))
+        ->with('navbarFocus', 'hilfe');
+});
+
+Route::get('hilfe/datensicherheit', function () {
+    return view('help/help-privacy-protection')
+        ->with('title', trans('titles.help-privacy-protection'))
+        ->with('navbarFocus', 'hilfe');
+});
+
 Route::get('faq', function () {
     return redirect(LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), '/hilfe'));
 });
diff --git a/tests/Browser/Pages/Hilfe.php b/tests/Browser/Pages/Hilfe.php
index c6efa741e82d757245602b68f1574df5dd1e08ff..28b5a29621f0c68551f624fe10587d0fb45a7df5 100644
--- a/tests/Browser/Pages/Hilfe.php
+++ b/tests/Browser/Pages/Hilfe.php
@@ -28,7 +28,7 @@ class Hilfe extends Page
             ->waitForText("MetaGer - Hilfe")
             ->assertTitle("Hilfe - MetaGer")
             ->switchLanguage("English")
-            ->waitForText("MetaGer Help")
+            ->waitForText("MetaGer - Help")
             ->assertTitle("Help - MetaGer")
             ->switchLanguage("Español")
             ->waitForText("Ayuda de MetaGer")