diff --git a/content/blog/_index.md b/content/blog/_index.md
index fde2865b929a6685d3d75a75910b1b7e8285be61..ebf4979a5d2283b0318061d0f79718445092e286 100644
--- a/content/blog/_index.md
+++ b/content/blog/_index.md
@@ -1,6 +1,7 @@
 +++
 title = "Actualités"
 template = "feed.html"
+sort_by = "date"
 weight = 1
 
 aliases = ["fr/blog"]
diff --git "a/content/wiki/about/equipe/G\303\251rard.md" "b/content/wiki/about/equipe/G\303\251rard.md"
index 8b97d4dbe28daef893a0c0342c47b5cccccf00fa..d72ea9a5d0eea149257c285128bd0cf27d444696 100644
--- "a/content/wiki/about/equipe/G\303\251rard.md"
+++ "b/content/wiki/about/equipe/G\303\251rard.md"
@@ -3,5 +3,5 @@ title = "Gérard"
 description = "Gérard est développeur de WotWizard"
 
 [extra]
-avatar = "Gérard.jpeg"
+avatar = "Gerard.jpeg"
 +++
\ No newline at end of file
diff --git a/sass/components/_titlecards.sass b/sass/components/_titlecards.sass
index 3423f7d04b0086b99df941689a5d564593f2d6d2..eb55dd35a194e5ae4eee6f3aa18822f97e04d815 100644
--- a/sass/components/_titlecards.sass
+++ b/sass/components/_titlecards.sass
@@ -3,15 +3,29 @@
         text-align: center
     h1
         margin-bottom: 1em
-    img
-        width: 50%
-        // height: 5em
-        display: block
-        margin: auto
-    i.fa
-        font-size: 5em
-        display: block
-        text-align: center
-        margin-bottom: -12px
     pre
-        overflow: hidden
\ No newline at end of file
+        overflow: hidden
+
+    .m4    
+        img
+            width: 50%
+            // height: 5em
+            display: block
+            margin: auto
+        i.fa
+            font-size: 5em
+            display: block
+            text-align: center
+            margin-bottom: -12px
+
+    .m3    
+        img
+            width: 40%
+            // height: 5em
+            display: block
+            margin: auto
+        i.fa
+            font-size: 4em
+            display: block
+            text-align: center
+            margin-bottom: -12px
\ No newline at end of file
diff --git "a/static/equipe/G\303\251rard.jpeg" b/static/equipe/Gerard.jpeg
similarity index 100%
rename from "static/equipe/G\303\251rard.jpeg"
rename to static/equipe/Gerard.jpeg
diff --git a/static/home/fr-mars-2021.png b/static/home/fr-mars-2021.png
new file mode 100644
index 0000000000000000000000000000000000000000..be8794b783ffe2923df20ce7d1a599742c597dc7
Binary files /dev/null and b/static/home/fr-mars-2021.png differ
diff --git a/static/home/info.svg b/static/home/info.svg
new file mode 100644
index 0000000000000000000000000000000000000000..61a6f0e716ccc09512a3e1effdcb47f6084a7898
--- /dev/null
+++ b/static/home/info.svg
@@ -0,0 +1,88 @@
+<?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="169.47087mm"
+   height="163.35759mm"
+   viewBox="0 0 169.47087 163.35759"
+   version="1.1"
+   id="svg8"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
+   sodipodi:docname="info.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.70710678"
+     inkscape:cx="296.46167"
+     inkscape:cy="311.49541"
+     inkscape:document-units="mm"
+     inkscape:current-layer="text835"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     inkscape:window-width="1920"
+     inkscape:window-height="1007"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <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="Calque 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-23.939697,-34.312752)">
+    <g
+       aria-label="i"
+       id="text835"
+       style="font-style:normal;font-weight:normal;font-size:143.218px;line-height:546.3%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:3.58047px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1">
+      <path
+         d="M 112.04415,164.31272 H 99.832542 V 96.032799 h 12.211608 z m -6.17146,-80.622829 q -3.28269,0 -5.64623,-2.100921 -2.232223,-2.232228 -2.232223,-5.908839 0,-3.676611 2.232223,-5.777532 2.36354,-2.232228 5.64623,-2.232228 3.28269,0 5.51492,2.232228 2.36353,2.100921 2.36353,5.777532 0,3.676611 -2.36353,5.908839 -2.23223,2.100921 -5.51492,2.100921 z"
+         style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:143.218px;font-family:Ubuntu;-inkscape-font-specification:'Ubuntu, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#002a86;fill-opacity:1;stroke:#002a86;stroke-width:9.16837;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path837" />
+      <circle
+         style="fill:none;fill-opacity:1;stroke:#002a86;stroke-width:20;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path840"
+         cx="105.61849"
+         cy="115.99155"
+         r="71.678795" />
+      <rect
+         style="fill:#002a86;fill-opacity:1;stroke:none;stroke-width:18.4099;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="rect884"
+         width="5.8891835"
+         height="25.166933"
+         x="105.54031"
+         y="63.096939" />
+      <path
+         d="M 117.64903,164.31272 H 105.43742 V 96.0328 h 12.21161 z m -6.17146,-80.622827 q -3.28269,0 -5.64622,-2.100922 -2.23223,-2.232232 -2.23223,-5.908839 0,-3.676617 2.23223,-5.77753 2.36353,-2.232232 5.64622,-2.232232 3.28269,0 5.51492,2.232232 2.36353,2.100913 2.36353,5.77753 0,3.676607 -2.36353,5.908839 -2.23223,2.100922 -5.51492,2.100922 z"
+         style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:143.218px;line-height:546.3%;font-family:Ubuntu;-inkscape-font-specification:'Ubuntu, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;fill:#295fd6;fill-opacity:1;stroke:#295fd6;stroke-width:9.16837;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path837-7" />
+      <circle
+         style="font-style:normal;font-weight:normal;font-size:143.218px;line-height:546.3%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:none;fill-opacity:1;stroke:#295fd6;stroke-width:20;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path840-6"
+         cx="111.73177"
+         cy="115.99155"
+         r="71.678795" />
+    </g>
+  </g>
+</svg>
diff --git a/static/img/coin.png b/static/img/coin.png
new file mode 100644
index 0000000000000000000000000000000000000000..c964255f7fc3f2eae37ead131a7ceb80ad261037
Binary files /dev/null and b/static/img/coin.png differ
diff --git a/static/img/datapod.svg b/static/img/datapod.svg
new file mode 100644
index 0000000000000000000000000000000000000000..cf8746cadf391235556bf579372e35d99b1cdcc5
--- /dev/null
+++ b/static/img/datapod.svg
@@ -0,0 +1,87 @@
+<?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="60mm"
+   height="60mm"
+   viewBox="0 0 60 60"
+   version="1.1"
+   id="svg8"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
+   sodipodi:docname="datapod.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="1.979899"
+     inkscape:cx="130.99032"
+     inkscape:cy="155.38018"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     inkscape:window-width="1920"
+     inkscape:window-height="1007"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <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="Calque 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-143.99344,-88.370938)">
+    <g
+       id="g842"
+       transform="matrix(0.90670732,0,0,0.90670732,15.846569,8.2595831)">
+      <path
+         style="fill:#41b1ff;fill-opacity:0.992157;stroke-width:0.264583"
+         d="m 146.94024,108.12063 c 0,-1.33174 4.13214,-7.38026 6.97653,-10.212053 8.07112,-8.035392 19.83615,-11.302655 31.01169,-8.612242 7.22162,1.738541 13.81918,6.011602 18.28587,11.843255 l 1.5304,1.99808 -1.18714,1.02643 c -1.54536,1.33614 -5.59695,3.47189 -9.414,3.98481 0,0 -47.20335,-0.0283 -47.20335,-0.0283 z"
+         id="path862" />
+      <path
+         style="fill:#ffd086;fill-opacity:1;stroke-width:0.264583"
+         d="m 145.38502,130.79053 c -0.83998,-2.25871 -1.21238,-5.03221 -1.21751,-9.06759 -0.006,-4.47829 0.0358,-4.90027 0.80026,-8.14308 l 0.48433,-2.05441 23.43209,0.0717 23.43209,0.0717 1.6702,0.90559 c 2.89672,1.57059 4.85575,4.28691 5.36289,7.43597 0.6606,4.10193 -1.85766,8.68806 -5.78008,10.52636 l -1.51759,0.71125 -23.22161,0.0718 -23.22159,0.0718 z"
+         id="path860" />
+      <path
+         style="fill:#f9ba37;fill-opacity:1;stroke-width:0.264583"
+         d="m 170.00072,153.72891 c -6.23702,-1.44302 -10.81992,-3.90716 -15.48454,-8.32577 -3.22593,-3.05578 -6.69044,-7.83922 -7.4323,-10.26177 l -0.18512,-0.60448 24.42855,0.0798 c 22.83869,0.0746 24.52326,0.11126 25.88376,0.56383 2.19204,0.72917 4.92994,2.24356 6.302,3.48577 l 1.22438,1.1085 -1.15848,1.55743 c -1.73899,2.33784 -5.45444,5.87771 -7.83044,7.46039 -3.81445,2.54084 -7.61854,4.13585 -12.14122,5.09068 -3.6296,0.76628 -9.93669,0.69474 -13.60659,-0.15434 z"
+         id="path856" />
+      <path
+         style="fill:#5096c8;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 170.38946,108.15065 c -2.58308,-5.27273 -6.69193,-10.089854 -11.9726,-14.062564 -5.37792,3.937633 -9.20196,8.710064 -11.52366,13.882184 z"
+         id="path884"
+         sodipodi:nodetypes="cccc" />
+      <path
+         style="fill:#cb8802;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 171.90097,131.31017 c 2.29765,-6.56996 2.13751,-13.39334 -0.0947,-19.68143 L 145.5552,111.5121 c -1.98621,6.4188 -2.19482,13.34494 0.0533,19.87952 z"
+         id="path882"
+         sodipodi:nodetypes="ccccc" />
+      <path
+         style="fill:#412800;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 146.89876,134.53689 c 1.57716,5.33506 6.47336,10.08406 11.5201,14.29582 5.69451,-4.3751 9.66279,-9.19016 12.10548,-14.22187 z"
+         id="path864"
+         sodipodi:nodetypes="cccc" />
+    </g>
+  </g>
+</svg>
diff --git a/static/img/duniter-logo_alt.svg b/static/img/duniter-logo_alt.svg
new file mode 100644
index 0000000000000000000000000000000000000000..3874d947263cffedc2e646980e0d03d939dabd47
--- /dev/null
+++ b/static/img/duniter-logo_alt.svg
@@ -0,0 +1,286 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:osb="http://www.openswatchbook.org/uri/2009/osb"
+   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="820"
+   height="820"
+   viewBox="0 0 768.75002 768.75002"
+   id="svg2"
+   version="1.1"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
+   sodipodi:docname="duniter-logo_alt.svg"
+   inkscape:export-filename="/home/inso/Graphismes/Final/duniter-logo.png"
+   inkscape:export-xdpi="90"
+   inkscape:export-ydpi="90">
+  <defs
+     id="defs4">
+    <linearGradient
+       id="linearGradient6689"
+       osb:paint="solid">
+      <stop
+         style="stop-color:#40b2ff;stop-opacity:1;"
+         offset="0"
+         id="stop6691" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient4372"
+       osb:paint="solid">
+      <stop
+         style="stop-color:#dca900;stop-opacity:1;"
+         offset="0"
+         id="stop4374" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient4140"
+       osb:paint="gradient">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop4142" />
+      <stop
+         style="stop-color:#000000;stop-opacity:0;"
+         offset="1"
+         id="stop4144" />
+    </linearGradient>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.64"
+     inkscape:cx="281.4223"
+     inkscape:cy="540.62932"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer4"
+     showgrid="false"
+     inkscape:window-width="1920"
+     inkscape:window-height="1007"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     showguides="false"
+     inkscape:document-rotation="0"
+     units="px">
+    <inkscape:grid
+       type="xygrid"
+       id="grid6210"
+       originx="-47.663508"
+       originy="-36.51189" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata7">
+    <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:groupmode="layer"
+     id="layer2"
+     inkscape:label="Background"
+     style="display:inline"
+     transform="translate(-47.663509,-238.48039)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer4"
+     inkscape:label="Dunes"
+     style="display:inline"
+     transform="translate(-47.663509,-238.48039)">
+    <g
+       id="g874"
+       transform="matrix(1.0077866,0,0,1.0077889,-0.3711366,-1.857501)">
+      <path
+         style="display:inline;fill:#41b2ff;fill-opacity:0.993939;stroke:none"
+         d="m 428.92383,238.48047 c -1.6407,0.001 -3.28434,0.0133 -4.92969,0.0352 C 213.3893,241.31748 44.923886,414.30104 47.697266,624.90625 50.470837,835.51145 223.43348,1004.0009 434.03906,1001.2559 644.64516,998.51129 813.15822,825.5713 810.44141,614.96484 l -0.004,-0.20703 C 807.62877,405.79922 637.29194,238.34765 428.92383,238.48047 Z"
+         id="rect4247"
+         inkscape:connector-curvature="0" />
+      <path
+         style="display:inline;fill:#5096c8;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 428.92383,238.48047 c -1.6407,0.001 -3.28434,0.0133 -4.92969,0.0352 -52.46973,0.69805 -102.32225,11.9617 -147.56445,31.73633 102.06833,17.60695 269.41958,73.73803 305.92383,252.72852 l 225.29296,143.55664 c 2.05882,-16.8816 3.02037,-34.09624 2.79493,-51.57227 l -0.004,-0.20703 C 807.62877,405.79922 637.29194,238.34765 428.92383,238.48047 Z"
+         id="path6598-1"
+         inkscape:connector-curvature="0" />
+      <path
+         style="display:inline;fill:#ffd086;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="M 585.16992,524.91211 C 447.41745,738.84015 285.93093,797.68142 93.347656,801.03711 158.66452,921.84083 287.20038,1003.1698 434.03906,1001.2559 607.56851,998.99446 752.51317,881.18488 796.65234,721.9668 c -2.6864,-6.57764 -6.20106,-13.62037 -10.8164,-21.13477 C 768.68987,677.03878 709.10478,568.47721 585.16992,524.91211 Z"
+         id="path3338"
+         inkscape:connector-curvature="0" />
+      <path
+         style="display:inline;fill:#270b0b;fill-opacity:0.993939;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 586.25391,524.11523 c -21.57163,126.33825 -84.49072,227.63882 -63.88055,308.76871 7.23211,161.9915 69.99593,48.16445 69.99593,48.16445 0,0 160.68622,-137.97431 209.75368,-181.41201 0,0 5.34434,-22.4818 7.43758,-53.19693 -16.36318,-4.66228 -32.1351,-11.75072 -42.83789,-23.69336 -32.6877,-36.47436 -116.60579,-76.182 -180.46875,-98.63086 z"
+         id="path3338-8"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="cccscsc" />
+      <path
+         style="display:inline;fill:#cd8a03;fill-opacity:0.993939;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 584.99609,531.33008 c -26.42158,62.17296 -14.83089,66.98582 -37.91601,116.64258 -14.17092,30.48206 -17.33296,46.71697 -38.17188,103.35156 L 768.68555,793.625 c 0.9031,-1.76161 1.79166,-3.53131 2.66797,-5.30859 0.11251,-0.2282 0.22386,-0.4571 0.33593,-0.68555 0.74115,-1.5108 1.47173,-3.02889 2.19336,-4.55078 0.15212,-0.32079 0.30383,-0.64161 0.45508,-0.96289 0.81083,-1.72247 1.61278,-3.44918 2.39844,-5.18555 0.81608,-1.80361 1.61563,-3.61525 2.40429,-5.43359 0.10093,-0.23267 0.20031,-0.46631 0.30079,-0.69922 0.70062,-1.62429 1.38978,-3.25484 2.06836,-4.89063 0.0851,-0.20516 0.17108,-0.40989 0.25585,-0.61523 0.75277,-1.82369 1.49557,-3.65256 2.22071,-5.49024 0.74585,-1.89017 1.47506,-3.78866 2.1914,-5.69335 0.0436,-0.11584 0.0874,-0.23177 0.13086,-0.34766 0.64073,-1.70872 1.26799,-3.42437 1.88477,-5.14453 0.099,-0.27607 0.19849,-0.55177 0.29687,-0.82813 1.34147,-3.76877 2.62647,-7.56487 3.85157,-11.38672 0.008,-0.0255 0.0172,-0.0507 0.0254,-0.0762 0.0156,-0.0486 0.0294,-0.0979 0.0449,-0.14648 0.5996,-1.87449 1.18462,-3.75378 1.75586,-5.64063 0.0327,-0.10803 0.065,-0.21614 0.0977,-0.32422 1.1856,-3.92878 2.31202,-7.88466 3.37305,-11.86523 0.007,-0.0247 0.0129,-0.0495 0.0195,-0.0742 0.0125,-0.0468 0.0247,-0.0938 0.0371,-0.14062 0.52168,-1.96173 1.02656,-3.92847 1.51758,-5.90235 0.004,-0.0176 0.009,-0.0351 0.0137,-0.0527 0.003,-0.0124 0.007,-0.0247 0.01,-0.0371 1.01021,-4.06523 1.95547,-8.15656 2.83398,-12.27149 C 737.8798,634.95587 692.83855,571.9745 584.99609,531.33008 Z"
+         id="path3338-8-0"
+         inkscape:connector-curvature="0" />
+      <path
+         style="display:inline;fill:#402801;fill-opacity:0.993939;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 555.26038,628.99723 -10.44593,16.98129 c -2.50357,15.42044 -19.92944,49.42676 -41.29492,110.74414 -29.11835,83.56757 66.82865,38.28295 73.67969,41.38281 64.6125,29.23493 132.91974,31.41069 179.60937,16.95117 16.45351,-27.56961 29.52066,-57.37807 38.64063,-88.8457 -281.04013,-47.3816 23.76693,-25.38857 -240.18884,-97.21371 z"
+         id="path3338-8-0-6"
+         inkscape:connector-curvature="0"
+         sodipodi:nodetypes="ccssccc" />
+      <path
+         style="display:inline;fill:#fbbc38;fill-opacity:0.993939;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 504.68359,865.61328 c -22.81492,71.32292 -112.93496,103.95373 -173.36328,123.0293 32.7455,8.66079 67.19526,13.07632 102.71875,12.61332 97.62636,-1.27228 186.20324,-39.11993 252.87696,-100.33402 -50.96384,-3.16822 -102.74996,-5.35269 -182.23243,-35.3086 z"
+         id="path3338-8-0-2"
+         inkscape:connector-curvature="0" />
+      <path
+         style="display:inline;fill:#fcc24d;fill-opacity:0.993939;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="m 497.01953,776.20508 c -0.24187,19.10857 -15.69269,67.67827 4.86524,95.17578 13.90919,18.6044 105.68907,21.5062 170.4414,42.27734 37.49477,-31.08628 68.92344,-69.20103 92.28125,-112.29297 -88.15778,0.4392 -173.3807,10.34531 -267.58789,-25.16015 z"
+         id="path3338-8-0-2-8"
+         inkscape:connector-curvature="0" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer8"
+     inkscape:label="Shadow"
+     style="display:inline"
+     sodipodi:insensitive="true"
+     transform="translate(-47.663509,-238.48039)" />
+  <g
+     inkscape:label="Vent"
+     inkscape:groupmode="layer"
+     id="layer1"
+     style="display:inline"
+     transform="translate(-47.663509,-238.48039)">
+    <ellipse
+       style="fill:none;fill-opacity:0.993939"
+       id="path4179"
+       cx="429.84796"
+       cy="645.42908"
+       rx="392.85715"
+       ry="400" />
+    <rect
+       style="display:inline;opacity:1;fill:#fabb37;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-9-2"
+       width="23.492319"
+       height="25.527225"
+       x="504.26501"
+       y="500.28717" />
+    <rect
+       style="display:inline;opacity:1;fill:#ffd086;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-9-2-9"
+       width="22.383955"
+       height="24.418852"
+       x="369.1745"
+       y="415.42877" />
+    <rect
+       style="display:inline;opacity:1;fill:#fabb37;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-9-2-1"
+       width="30.523569"
+       height="30.523565"
+       x="418.995"
+       y="433.01941" />
+    <rect
+       style="display:inline;opacity:1;fill:#fbc14c;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-1"
+       width="46.802811"
+       height="46.802807"
+       x="417.33978"
+       y="652.55573" />
+    <rect
+       style="display:inline;opacity:1;fill:#fabb37;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-9-2-1-7"
+       width="30.523569"
+       height="30.523565"
+       x="422.58551"
+       y="475.89081" />
+    <rect
+       style="display:inline;opacity:1;fill:#cc8902;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-0-3-5-5"
+       width="24.418858"
+       height="26.453758"
+       x="472.61835"
+       y="605.45685" />
+    <rect
+       style="display:inline;opacity:1;fill:#fabb37;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-9-2-1-0-7-8"
+       width="18.314144"
+       height="18.314142"
+       x="520.77234"
+       y="557.90222" />
+    <rect
+       style="display:inline;opacity:1;fill:#fabb37;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-9-2-1-2-9"
+       width="30.523569"
+       height="30.523565"
+       x="454.78387"
+       y="563.02789" />
+    <rect
+       style="display:inline;opacity:1;fill:#fbc14c;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-1-6-5"
+       width="38.663193"
+       height="40.69809"
+       x="335.34222"
+       y="720.98743" />
+    <rect
+       style="display:inline;opacity:1;fill:#fbc14c;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-1-6-3-2"
+       width="26.453766"
+       height="30.523569"
+       x="371.97028"
+       y="661.9754" />
+    <rect
+       style="display:inline;opacity:1;fill:#cc8902;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-0-3-5-4-3-3"
+       width="24.506996"
+       height="24.418852"
+       x="-427.93024"
+       y="610.08527"
+       transform="scale(-1,1)" />
+    <rect
+       style="display:inline;opacity:1;fill:#ffd086;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-6-9-2-9-2-7-8-8-5"
+       width="20.349047"
+       height="22.383947"
+       x="480.41095"
+       y="523.46906" />
+    <rect
+       style="display:inline;opacity:1;fill:#cc8902;fill-opacity:1;stroke:none;stroke-width:34.9;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.996078"
+       id="rect6810-0-3-5-4-3-3-9"
+       width="24.506996"
+       height="24.418852"
+       x="-499.49951"
+       y="466.31366"
+       transform="scale(-1,1)" />
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer5"
+     inkscape:label="Flux"
+     sodipodi:insensitive="true"
+     transform="translate(-47.663509,-238.48039)" />
+  <g
+     inkscape:groupmode="layer"
+     id="layer3"
+     inkscape:label="Contour"
+     style="display:inline"
+     transform="translate(-47.663509,-238.48039)">
+    <path
+       style="opacity:1;fill:none;fill-opacity:0.993939;stroke:#ffffff;stroke-width:42.1;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+       id="path6212"
+       ry="440"
+       rx="300"
+       cy="492.36221"
+       cx="340"
+       d=""
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>
diff --git a/static/img/gbrevedot_color.svg b/static/img/gbrevedot_color.svg
new file mode 100644
index 0000000000000000000000000000000000000000..737af2ceb634a363f2e9bffa95c56899eac956e7
--- /dev/null
+++ b/static/img/gbrevedot_color.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"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="512"
+   height="512"
+   viewBox="-0.72 -0.72 1.44 1.44"
+   version="1.1"
+   id="svg7"
+   sodipodi:docname="gbrevedot (copie).svg"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)">
+  <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></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs11">
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient893">
+      <stop
+         style="stop-color:#5096c8;stop-opacity:1"
+         offset="0"
+         id="stop885" />
+      <stop
+         style="stop-color:#40b2ff;stop-opacity:0.99607843"
+         offset="0.49135655"
+         id="stop887" />
+      <stop
+         style="stop-color:#ffd086;stop-opacity:1"
+         offset="0.70193791"
+         id="stop889" />
+      <stop
+         style="stop-color:#fabb37;stop-opacity:1"
+         offset="1"
+         id="stop891" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient893"
+       id="linearGradient863"
+       x1="0.034742367"
+       y1="-2.8491416"
+       x2="0.032584585"
+       y2="2.8229399"
+       gradientUnits="userSpaceOnUse" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient893"
+       id="linearGradient883"
+       gradientUnits="userSpaceOnUse"
+       x1="0.12357556"
+       y1="-2.7718253"
+       x2="0.11708657"
+       y2="1.8124492" />
+  </defs>
+  <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="1007"
+     id="namedview9"
+     showgrid="false"
+     inkscape:zoom="0.51997208"
+     inkscape:cx="205.24387"
+     inkscape:cy="279.21503"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg7" />
+  <g
+     id="gbreve"
+     transform="scale(0.25)"
+     style="fill:url(#linearGradient863);fill-opacity:1.0">
+    <path
+       id="g"
+       d="M 0.7071,0.7071 A 1,1 0 1,1 0.866,-0.5 L 1.7321,-1 A 2,2 0 1,0 1.4142,1.4142 l 0.3536,0.3536 v -1.4142 h -1.4142 z"
+       fill="#000"
+       style="fill:url(#linearGradient883);fill-opacity:1.0" />
+    <path
+       id="breve"
+       d="M 1,0 h 1 A 2,2 0 0,0 -0.5176,-1.9319 L -0.2588,-0.9659 A 1,1 0 0,1 1,0 z"
+       transform="translate(0 -3.14159) scale(0.5) rotate(142.5)"
+       fill="#000"
+       style="fill:url(#linearGradient863);fill-opacity:1.0" />
+    <circle
+       cx="0"
+       cy="2.5"
+       r="0.3536"
+       fill="#000"
+       id="circle4"
+       style="fill:url(#linearGradient863);fill-opacity:1.0" />
+  </g>
+</svg>
diff --git a/static/img/gchange.png b/static/img/gchange.png
new file mode 100644
index 0000000000000000000000000000000000000000..8fb73df11168dfceae94821255aecbeefbdca02c
Binary files /dev/null and b/static/img/gchange.png differ
diff --git a/static/img/gecko.png b/static/img/gecko.png
new file mode 100644
index 0000000000000000000000000000000000000000..c6435fe5261e139a58940a68c74f8837f3ed39c0
Binary files /dev/null and b/static/img/gecko.png differ
diff --git a/static/img/pig.png b/static/img/pig.png
new file mode 100644
index 0000000000000000000000000000000000000000..8bb449b3190344ae296533cd02b85ffe666ed01a
Binary files /dev/null and b/static/img/pig.png differ
diff --git a/static/img/wizard.svg b/static/img/wizard.svg
new file mode 100644
index 0000000000000000000000000000000000000000..16e7d26fcd126a529bcbc4d2c6c74d8448e27e4a
--- /dev/null
+++ b/static/img/wizard.svg
@@ -0,0 +1,260 @@
+<?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="60mm"
+   height="60mm"
+   viewBox="0 0 60 60"
+   version="1.1"
+   id="svg8"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
+   sodipodi:docname="wotwizard.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="1.4"
+     inkscape:cx="73.753132"
+     inkscape:cy="26.76665"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     inkscape:window-width="1920"
+     inkscape:window-height="1007"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <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="Calque 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-149.94273,-160.56472)">
+    <g
+       id="g1864"
+       transform="translate(4.1330995,0.50015404)">
+      <path
+         style="fill:#e4e5e5;stroke-width:0.264583"
+         d="m 175.73275,216.89059 c -0.7716,-0.52361 -1.20437,-0.64561 -1.85636,-0.5233 -1.61219,0.30245 -2.5682,-0.32338 -3.02824,-1.98236 -0.20564,-0.74159 -0.48997,-1.04075 -1.34964,-1.42003 -1.11089,-0.49012 -2.07668,-1.96984 -2.08645,-3.19672 -0.01,-1.22896 -1.17541,-3.30729 -1.99178,-3.55139 -0.65671,-0.19636 -0.69097,-0.24146 -0.19844,-0.2612 0.5466,-0.0219 0.59463,-0.14834 0.5869,-1.54522 -0.005,-0.91611 -0.16296,-1.72567 -0.39688,-2.03494 -0.21365,-0.28248 -0.38846,-1.01056 -0.38846,-1.61797 0,-0.71019 -0.19224,-1.34877 -0.5386,-1.78909 -0.29623,-0.3766 -0.66507,-1.0475 -0.81963,-1.49089 -0.21353,-0.61253 -0.44959,-0.8125 -0.98276,-0.83254 l -0.70172,-0.0264 0.66146,-0.18315 c 0.6225,-0.17236 0.67062,-0.31616 0.81692,-2.44156 0.0855,-1.24213 0.37432,-2.86702 0.64181,-3.61087 l 0.48633,-1.35246 1.87175,-0.28918 c 3.30333,-0.51037 3.09958,-0.50348 2.75917,-0.0933 -0.16929,0.20399 -1.01394,0.56722 -1.87699,0.80716 l -1.56918,0.43628 0.21983,1.2071 c 0.27866,1.53019 0.28294,4.55549 0.009,6.10191 l -0.2112,1.19062 1.08333,0.60956 1.08332,0.60955 0.82044,-0.69035 c 2.57821,-2.16942 6.3552,-2.8981 8.2602,-1.59362 l 1.0329,0.7073 0.80858,-0.59781 c 1.66375,-1.23006 5.21179,-0.83878 7.44437,0.82096 1.88031,1.39787 2.03929,1.43596 3.13012,0.74995 0.95904,-0.60312 0.97473,-0.63957 0.77763,-1.80616 -0.26776,-1.58476 -0.2552,-4.59614 0.0256,-6.14852 0.19971,-1.10393 0.16796,-1.27257 -0.26579,-1.41149 -1.10716,-0.3546 -2.47463,-0.99721 -2.36192,-1.10992 0.0662,-0.0662 1.14088,0.0314 2.38806,0.21691 1.93563,0.28797 2.24664,0.40339 2.12446,0.78837 -0.0787,0.24805 -0.01,0.79415 0.15318,1.21355 0.16298,0.41941 0.37437,1.82907 0.46976,3.13259 0.16376,2.23782 0.21033,2.38025 0.83489,2.55331 l 0.66146,0.18328 -0.70172,0.0264 c -0.53317,0.02 -0.76923,0.22001 -0.98276,0.83254 -0.15456,0.4434 -0.5234,1.1143 -0.81963,1.49089 -0.34636,0.44033 -0.5386,1.07891 -0.5386,1.7891 0,0.60741 -0.17481,1.33549 -0.38846,1.61796 -0.23392,0.30927 -0.39181,1.11883 -0.39688,2.03495 -0.008,1.39687 0.0403,1.5233 0.5869,1.54521 0.48219,0.0193 0.4416,0.0685 -0.21355,0.25893 -0.82452,0.23961 -1.96925,2.29822 -1.96925,3.54139 0,1.12528 -1.04961,2.7061 -2.11605,3.187 -0.58813,0.26521 -1.11546,0.71667 -1.20306,1.02998 -0.5718,2.04513 -1.57484,2.78779 -3.26411,2.41677 -0.56734,-0.12461 -1.01338,0.005 -1.75579,0.50834 -1.39121,0.9441 -3.36655,0.94103 -4.76414,-0.007 z"
+         id="path1212" />
+      <path
+         style="fill:#f8f8f8;stroke-width:0.264583"
+         d="m 174.53225,202.46192 c 1.26642,-0.78725 1.56607,-0.8599 3.54668,-0.8599 1.9806,0 2.28026,0.0726 3.54667,0.8599 1.85456,1.15286 2.78957,1.12985 4.2312,-0.10414 0.84422,-0.72262 1.03836,-1.02089 0.77523,-1.19112 -0.71645,-0.46351 -3.84838,-1.23498 -5.61565,-1.38327 -1.00378,-0.0842 -2.07419,-0.31856 -2.3787,-0.52075 -0.46675,-0.30991 -0.63944,-0.31139 -1.10028,-0.009 -0.30064,0.19699 -1.61148,0.47184 -2.91297,0.61079 -2.19018,0.23381 -4.7172,0.88191 -5.22801,1.34081 -0.11872,0.10664 0.28967,0.6266 0.90752,1.15546 1.43853,1.23133 2.37483,1.25384 4.22831,0.10165 z"
+         id="path995" />
+      <path
+         style="fill:#f7d65e;stroke-width:0.264583"
+         d="m 192.86407,193.87496 c -0.0195,-1.43876 -0.18792,-2.69828 -0.44119,-3.29938 -0.52483,-1.24558 0.0355,-1.60571 0.99904,-0.64214 1.13671,1.13671 1.08689,4.28124 -0.0908,5.73212 -0.41238,0.50802 -0.43719,0.41288 -0.46704,-1.7906 z"
+         id="path1015" />
+      <path
+         style="fill:#f7d65e;stroke-width:0.264583"
+         d="m 162.75643,195.58273 c -1.52605,-2.3552 -0.82454,-6.28385 1.12206,-6.28385 0.49478,0 0.49378,0.0288 -0.0386,1.10477 -0.42234,0.85364 -0.55012,1.63546 -0.56211,3.43923 -0.0174,2.62019 0.004,2.55002 -0.52135,1.73985 z"
+         id="path1013" />
+      <path
+         style="fill:#f7d65e;stroke-width:0.264583"
+         d="m 185.76387,193.94111 c 1.37459,-1.37458 0.63532,-4.4438 -1.07036,-4.4438 -1.10386,0 -1.71979,0.89133 -1.71979,2.48874 0,1.38116 0.80778,2.60449 1.71979,2.60449 0.23151,0 0.71317,-0.29224 1.07036,-0.64943 z"
+         id="path1011" />
+      <path
+         style="fill:#f7d65e;stroke-width:0.264583"
+         d="m 172.5347,193.94111 c 1.37458,-1.37458 0.63532,-4.4438 -1.07036,-4.4438 -1.74292,0 -2.50347,3.38005 -1.02265,4.54486 0.90322,0.71048 1.30066,0.69129 2.09301,-0.10106 z"
+         id="path1009" />
+      <path
+         style="fill:#f7d65e;stroke-width:0.264583"
+         d="m 180.27497,195.86054 c 1.05161,-1.05161 -0.0254,-2.06375 -2.19604,-2.06375 -1.76562,0 -2.51354,0.38353 -2.51354,1.2889 0,0.83832 0.58453,1.09235 2.51354,1.09235 1.10831,0 2.00872,-0.13018 2.19604,-0.3175 z"
+         id="path1007" />
+      <path
+         style="fill:#f7d65e;stroke-width:0.264583"
+         d="m 167.33992,199.19259 c -0.19346,-0.23311 -0.60514,-0.52018 -0.91485,-0.63793 -0.55429,-0.21074 -0.55699,-0.24443 -0.17263,-2.15525 0.37751,-1.87674 0.21576,-4.61947 -0.36109,-6.12271 -0.13939,-0.36324 -0.0137,-0.44866 0.66043,-0.44866 0.86441,0 2.69886,-0.80173 3.55155,-1.55218 0.43081,-0.37915 1.45567,-0.43219 8.34998,-0.43219 h 7.85889 l 0.87583,0.73705 c 0.48171,0.40538 1.40038,0.87735 2.0415,1.04882 0.88197,0.23589 1.1253,0.41068 0.99978,0.71816 -0.5395,1.3216 -0.69219,4.21616 -0.32011,6.06821 0.35043,1.74428 0.3473,1.94223 -0.0329,2.07522 -0.23116,0.0809 -0.68355,0.3838 -1.00531,0.6732 l -0.58501,0.52619 -0.99041,-0.86959 c -2.66925,-2.34362 -6.92191,-3.06536 -8.64617,-1.46737 -0.65114,0.60346 -0.68351,0.60722 -1.11555,0.12982 -1.58226,-1.74837 -6.18861,-1.07482 -8.89395,1.3005 -0.85294,0.74889 -0.98357,0.78996 -1.29998,0.40871 z"
+         id="path1005" />
+      <path
+         style="fill:#f7d65e;stroke-width:0.264583"
+         d="m 181.39792,202.36883 -1.4435,-0.89912 h 1.26805 c 1.15199,0 1.29417,-0.0692 1.55349,-0.75622 l 0.28544,-0.75622 1.50041,0.45429 c 2.56292,0.77599 2.59904,0.82999 1.29943,1.9424 -1.45928,1.2491 -2.47637,1.25249 -4.46332,0.0149 z"
+         id="path1003" />
+      <path
+         style="fill:#f7d65e;stroke-width:0.264583"
+         d="m 170.2416,202.28663 -1.15851,-1.03519 0.68313,-0.26427 c 0.37573,-0.14535 1.27717,-0.44069 2.0032,-0.65629 l 1.32007,-0.39202 0.28892,0.76543 c 0.26312,0.69708 0.40182,0.76544 1.55312,0.76544 h 1.26418 l -1.53784,0.92604 c -2.06169,1.24148 -2.92873,1.22005 -4.41627,-0.10914 z"
+         id="path1001" />
+      <path
+         style="fill:#f7d65e;stroke-width:0.264583"
+         d="m 154.00184,216.33341 c -4.10883,-1.40615 -5.54465,-7.40731 -2.206,-9.22021 1.2269,-0.66621 5.02171,-0.67492 6.23642,-0.0143 2.68121,1.45816 2.13731,6.85753 -0.86949,8.63159 -1.02816,0.60663 -2.39069,0.86652 -3.16093,0.60293 z"
+         id="path963" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 176.83103,187.51603 c 0.76886,-0.0536 1.95948,-0.0531 2.64583,0.001 0.68634,0.0543 0.0573,0.0982 -1.39793,0.0975 -1.45521,-7.9e-4 -2.01677,-0.0451 -1.2479,-0.0987 z"
+         id="path1043" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 184.10323,187.79263 c 0.25743,-0.0671 0.61462,-0.0627 0.79375,0.01 0.17913,0.0725 -0.0315,0.12736 -0.46805,0.12197 -0.43657,-0.005 -0.58313,-0.0647 -0.3257,-0.13178 z"
+         id="path1041" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 171.40323,187.79263 c 0.25743,-0.0671 0.61462,-0.0627 0.79375,0.01 0.17913,0.0725 -0.0315,0.12736 -0.46806,0.12197 -0.43656,-0.005 -0.58312,-0.0647 -0.32569,-0.13178 z"
+         id="path1039" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 178.34084,199.34875 c -0.0914,-0.1479 -0.29542,-0.18903 -0.45337,-0.0914 -0.17554,0.10849 -0.2107,0.0537 -0.0904,-0.14083 0.15222,-0.2463 0.29614,-0.24256 0.63619,0.0165 0.24171,0.18417 0.48908,0.36855 0.54971,0.40972 0.0606,0.0412 -0.0216,0.0749 -0.18282,0.0749 -0.16119,0 -0.36785,-0.121 -0.45926,-0.2689 z"
+         id="path1037" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 179.74911,199.70149 c 0.19099,-0.0764 0.4192,-0.067 0.50712,0.0209 0.0879,0.0879 -0.0684,0.15045 -0.34727,0.13896 -0.30822,-0.0127 -0.37092,-0.0754 -0.15985,-0.15985 z"
+         id="path1035" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 176.04494,199.70149 c 0.191,-0.0764 0.4192,-0.067 0.50712,0.0209 0.0879,0.0879 -0.0683,0.15045 -0.34726,0.13896 -0.30823,-0.0127 -0.37092,-0.0754 -0.15986,-0.15985 z"
+         id="path1033" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 182.73002,200.25706 c 0.0127,-0.30823 0.0754,-0.37092 0.15985,-0.15986 0.0764,0.191 0.067,0.4192 -0.0209,0.50712 -0.0879,0.0879 -0.15045,-0.0684 -0.13897,-0.34726 z"
+         id="path1031" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 173.20502,200.25706 c 0.0127,-0.30823 0.0754,-0.37092 0.15985,-0.15986 0.0764,0.191 0.067,0.4192 -0.0209,0.50712 -0.0879,0.0879 -0.15045,-0.0684 -0.13896,-0.34726 z"
+         id="path1029" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 178.40966,201.2945 c 0.1819,-0.0734 0.47955,-0.0734 0.66145,0 0.18191,0.0734 0.0331,0.13345 -0.33072,0.13345 -0.36381,0 -0.51263,-0.0601 -0.33073,-0.13345 z"
+         id="path1027" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 177.08674,201.2945 c 0.1819,-0.0734 0.47956,-0.0734 0.66146,0 0.1819,0.0734 0.0331,0.13345 -0.33073,0.13345 -0.3638,0 -0.51263,-0.0601 -0.33073,-0.13345 z"
+         id="path1025" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 153.33882,193.2015 -0.002,-13.29531 -0.79063,-2.91042 c -0.43485,-1.60073 -0.79134,-2.92735 -0.7922,-2.94804 -8.4e-4,-0.0207 0.44034,0.18767 0.98043,0.46302 1.25966,0.64221 3.13083,0.63994 4.3965,-0.005 0.88507,-0.45123 0.97862,-0.45839 0.86457,-0.0661 -1.36376,4.69035 -1.50445,5.59258 -1.48,9.49073 0.0135,2.15253 0.0189,8.11064 0.012,13.24025 l -0.0126,9.32656 h -1.5875 -1.5875 l -0.002,-13.29531 z"
+         id="path1023" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 159.71127,210.04664 c 0.0127,-0.30823 0.0754,-0.37092 0.15985,-0.15985 0.0764,0.19099 0.067,0.4192 -0.0209,0.50712 -0.0879,0.0879 -0.15045,-0.0684 -0.13896,-0.34727 z"
+         id="path1021" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 159.73216,211.25931 c 0,-0.3638 0.0601,-0.51263 0.13345,-0.33073 0.0734,0.18191 0.0734,0.47956 0,0.66146 -0.0734,0.1819 -0.13345,0.0331 -0.13345,-0.33073 z"
+         id="path1019" />
+      <path
+         style="fill:#d39c81;stroke-width:0.264583"
+         d="m 153.34038,218.05029 v -1.6757 h 1.5875 1.5875 v 1.6757 1.67569 h -1.5875 -1.5875 z"
+         id="path961" />
+      <path
+         style="fill:#5fa2e3;stroke-width:0.264583"
+         d="m 152.93859,174.64268 c -1.08843,-0.47426 -2.42088,-2.05063 -2.7573,-3.26207 -1.36989,-4.93296 4.99034,-8.33978 8.37431,-4.48565 1.75738,2.00154 1.75738,4.44175 0,6.44329 -1.40261,1.59749 -3.71305,2.13404 -5.61701,1.30443 z"
+         id="path1053" />
+      <path
+         style="fill:#5fa2e3;stroke-width:0.264583"
+         d="m 187.42203,188.05982 c 0.19099,-0.0764 0.41919,-0.067 0.50711,0.0209 0.0879,0.0879 -0.0683,0.15045 -0.34726,0.13896 -0.30823,-0.0127 -0.37092,-0.0754 -0.15985,-0.15985 z"
+         id="path1051" />
+      <path
+         style="fill:#5fa2e3;stroke-width:0.264583"
+         d="m 168.37202,188.05982 c 0.191,-0.0764 0.4192,-0.067 0.50712,0.0209 0.0879,0.0879 -0.0684,0.15045 -0.34727,0.13896 -0.30822,-0.0127 -0.37092,-0.0754 -0.15985,-0.15985 z"
+         id="path1049" />
+      <path
+         style="fill:#5fa2e3;stroke-width:0.264583"
+         d="m 200.98627,215.33831 c 0.0127,-0.30823 0.0754,-0.37092 0.15985,-0.15986 0.0764,0.191 0.067,0.4192 -0.0209,0.50712 -0.0879,0.0879 -0.15045,-0.0684 -0.13897,-0.34726 z"
+         id="path1047" />
+      <path
+         style="fill:#5fa2e3;stroke-width:0.264583"
+         d="m 149.99977,216.94785 c 6e-4,-1.60072 0.0442,-2.22146 0.0968,-1.3794 0.0527,0.84206 0.0522,2.15175 -0.001,2.91042 -0.0533,0.75867 -0.0964,0.0697 -0.0957,-1.53102 z"
+         id="path959" />
+      <path
+         id="path973"
+         style="fill:#4c85bd;stroke-width:0.264583"
+         d="m 201.49455,191.11254 c -5.20301,-1.58418 -10.52695,-2.87589 -15.97085,-3.22887 -4.87553,-0.40559 -9.77563,-0.46305 -14.6517,-0.0332 -4.89223,0.24515 -9.65364,1.45779 -14.3806,2.66554 0.20195,-0.8447 -0.28228,-2.35508 0.72058,-2.63713 0.69132,-0.83558 2.05668,-0.78693 2.87528,-1.22578 1.4078,-0.54183 3.23884,-0.83666 4.83121,-1.23526 1.43211,-1.40406 1.45074,-2.86784 2.48706,-4.52794 0.62761,-1.50375 1.12618,-2.3379 1.82748,-3.93193 0.77519,-1.43755 1.23493,-2.76772 1.8705,-3.83234 1.18878,-2.6783 2.40064,-5.38523 3.96876,-7.86023 0.4842,-1.12387 1.34931,-2.6655 2.08065,-3.74771 0.26838,-0.86366 1.47515,-1.58559 1.66522,-0.081 0.93754,0.89339 1.31233,2.11152 2.02499,3.43541 0.78199,1.00815 0.88213,1.86591 1.77768,3.09495 0.80851,1.39988 0.98271,2.8423 1.83668,3.68252 0.35101,1.15801 1.19934,2.8447 1.92374,4.18783 0.69677,1.60709 1.14736,2.5344 1.95094,4.18399 0.56708,1.65268 1.72495,3.32458 2.1221,4.88672 1.43362,1.11466 3.634,0.88498 5.21942,1.58961 0.95124,0.36855 1.8525,0.63654 2.97656,1.00534 0.79962,0.6593 2.14954,1.20999 3.17913,2.04552 0.39412,0.82696 1.93797,2.4182 -0.33483,1.564 z" />
+      <path
+         id="path971"
+         style="fill:#4c85bd;stroke-width:0.264583"
+         d="m 180.3089,219.31169 c 1.19329,-0.5179 1.8961,-1.68657 2.98022,-2.35215 0.90564,-0.20622 1.77526,-0.67419 2.15433,-1.58623 0.3156,-0.70523 0.57208,-1.49301 1.26609,-1.929 0.88678,-0.48002 1.84155,-1.09555 2.07564,-2.15372 0.29522,-1.29079 0.55869,-2.60346 1.16362,-3.79607 0.16195,-0.35354 0.32389,-0.70707 0.48584,-1.0606 1.19571,0.18964 2.41928,0.26735 3.58543,0.59137 0.52636,0.3294 1.33442,0.12645 1.55092,0.70355 0.43558,-0.30807 0.33754,0.53772 0.81876,0.19005 0.38566,0.66547 1.35476,0.95505 1.81462,1.68947 0.74389,0.60031 1.09436,1.59491 1.76461,2.18014 0.14918,0.44059 0.41155,1.32157 0.73252,1.91823 0.3363,1.15981 0.30981,2.40074 0.43197,3.5986 0.0538,0.80689 0.10747,1.61378 0.16123,2.42067 -6.47236,-0.02 -12.94529,0.0239 -19.41716,-0.0631 -0.45977,-0.095 -1.69849,0.12633 -1.70046,-0.28791 l 0.13182,-0.0632 z" />
+      <path
+         id="path969"
+         style="fill:#4c85bd;stroke-width:0.264583"
+         d="m 156.52557,217.94004 c 0.0315,-0.77177 -0.14463,-1.8208 0.70776,-2.22424 1.78073,-1.10715 2.77594,-3.29056 2.64843,-5.35843 0.007,-0.75804 -0.46877,-1.69763 -0.10347,-2.35066 0.49331,0.18549 0.39649,-0.61778 0.89271,-0.28612 0.20147,-0.69095 1.26574,-0.38273 1.80787,-0.80228 1.07039,-0.20013 2.15258,-0.32763 3.23008,-0.4828 0.47599,1.10805 1.1058,2.17367 1.31821,3.37317 -0.14854,0.76016 0.544,1.51352 0.47518,2.14804 0.61309,0.76063 1.52733,1.15888 2.26783,1.76164 0.72003,0.62299 0.71894,1.697 1.42518,2.33726 0.61584,0.734 1.73159,0.59759 2.33496,1.35936 0.66583,0.82901 1.47919,1.5603 2.4748,1.96775 0.19476,0.42475 -1.08356,0.21295 -1.45057,0.29936 -6.01269,0.0661 -12.02612,0.0289 -18.03915,0.0441 0.003,-0.59537 0.007,-1.19074 0.0102,-1.78611 z" />
+      <path
+         style="fill:#4c85bd;stroke-width:0.264583"
+         d="m 150.18232,216.55098 c 0.0226,-1.74625 0.11732,-3.17041 0.2105,-3.16481 0.0932,0.006 0.40905,0.39107 0.70191,0.85659 0.29285,0.46552 0.91335,1.08602 1.37887,1.37887 0.81382,0.51198 0.84679,0.60121 0.85659,2.31841 l 0.0102,1.78594 h -1.59957 -1.59957 z"
+         id="path957" />
+      <path
+         style="fill:#b3664b;stroke-width:0.264583"
+         d="m 186.228,191.94473 c 0,-0.80036 0.0496,-1.12779 0.11023,-0.7276 0.0606,0.40018 0.0606,1.05502 0,1.4552 -0.0606,0.40019 -0.11023,0.0728 -0.11023,-0.7276 z"
+         id="path1075" />
+      <path
+         style="fill:#b3664b;stroke-width:0.264583"
+         d="m 183.053,191.94473 c 0,-0.80036 0.0496,-1.12779 0.11023,-0.7276 0.0606,0.40018 0.0606,1.05502 0,1.4552 -0.0606,0.40019 -0.11023,0.0728 -0.11023,-0.7276 z"
+         id="path1073" />
+      <path
+         style="fill:#b3664b;stroke-width:0.264583"
+         d="m 172.99883,191.94473 c 0,-0.80036 0.0496,-1.12779 0.11023,-0.7276 0.0606,0.40018 0.0606,1.05502 0,1.4552 -0.0606,0.40019 -0.11023,0.0728 -0.11023,-0.7276 z"
+         id="path1071" />
+      <path
+         style="fill:#b3664b;stroke-width:0.264583"
+         d="m 169.82383,191.94473 c 0,-0.80036 0.0496,-1.12779 0.11023,-0.7276 0.0606,0.40018 0.0606,1.05502 0,1.4552 -0.0606,0.40019 -0.11023,0.0728 -0.11023,-0.7276 z"
+         id="path1069" />
+      <path
+         style="fill:#b3664b;stroke-width:0.264583"
+         d="m 175.98116,195.76229 c -0.51651,-0.51652 -0.51688,-0.64506 -0.004,-1.37744 0.87639,-1.25122 4.61521,-0.62351 4.61521,0.77485 0,0.63643 -0.94269,1.01836 -2.51355,1.01836 -1.1763,0 -1.80699,-0.125 -2.09776,-0.41577 z"
+         id="path1067" />
+      <path
+         style="fill:#b3664b;stroke-width:0.264583"
+         d="m 173.77944,201.27782 c -0.1819,-0.0642 -0.33073,-0.40451 -0.33073,-0.75618 0,-0.5991 0.0923,-0.63941 1.46372,-0.63941 0.80503,0 1.86409,-0.16729 2.35345,-0.37176 0.62239,-0.26005 0.97336,-0.28813 1.16804,-0.0935 0.15306,0.15307 1.1776,0.33602 2.27676,0.40656 1.87208,0.12014 1.99846,0.16675 1.99846,0.73708 0,0.35612 -0.19219,0.66041 -0.46303,0.73308 -0.58175,0.15611 -8.01905,0.14213 -8.46667,-0.0159 z"
+         id="path955" />
+      <path
+         style="fill:#3c75ad;stroke-width:0.264583"
+         d="m 193.77203,189.11816 c 0.19099,-0.0764 0.41919,-0.067 0.50711,0.0209 0.0879,0.0879 -0.0683,0.15046 -0.34726,0.13897 -0.30823,-0.0127 -0.37092,-0.0754 -0.15985,-0.15985 z"
+         id="path1083" />
+      <path
+         style="fill:#3c75ad;stroke-width:0.264583"
+         d="m 162.02202,189.11816 c 0.191,-0.0764 0.4192,-0.067 0.50712,0.0209 0.0879,0.0879 -0.0684,0.15046 -0.34727,0.13897 -0.30822,-0.0127 -0.37092,-0.0754 -0.15985,-0.15985 z"
+         id="path1081" />
+      <path
+         style="fill:#3c75ad;stroke-width:0.264583"
+         d="m 198.03494,209.47338 -0.64143,-0.72761 0.7276,0.64143 c 0.68006,0.59952 0.84894,0.81378 0.64144,0.81378 -0.0474,0 -0.37482,-0.32742 -0.72761,-0.7276 z"
+         id="path1079" />
+      <path
+         style="fill:#3c75ad;stroke-width:0.264583"
+         d="m 175.67663,219.22413 c -0.59365,-0.26962 -1.39506,-0.89209 -1.78091,-1.38325 l -0.70154,-0.89303 0.72258,-0.1393 c 0.48525,-0.0936 1.0079,0.0523 1.59127,0.44393 1.66313,1.11663 3.47285,1.1209 5.12397,0.0121 0.61513,-0.41309 1.12301,-0.55269 1.65907,-0.45603 l 0.77256,0.13931 -0.93441,0.9904 c -1.68326,1.78414 -4.23562,2.29277 -6.45259,1.28588 z"
+         id="path953" />
+      <path
+         style="fill:#392d2e;stroke-width:0.264583"
+         d="m 183.65408,193.91021 c -0.28333,-0.28333 -0.41578,-0.90944 -0.41578,-1.96548 0,-1.71434 0.40756,-2.38125 1.45521,-2.38125 1.04765,0 1.45521,0.66691 1.45521,2.38125 0,1.71434 -0.40756,2.38125 -1.45521,2.38125 -0.34301,0 -0.81076,-0.1871 -1.03943,-0.41577 z"
+         id="path1091" />
+      <path
+         style="fill:#392d2e;stroke-width:0.264583"
+         d="m 170.42491,193.91021 c -0.28333,-0.28333 -0.41578,-0.90944 -0.41578,-1.96548 0,-1.71434 0.40756,-2.38125 1.45521,-2.38125 1.04765,0 1.45521,0.66691 1.45521,2.38125 0,1.71434 -0.40756,2.38125 -1.45521,2.38125 -0.34301,0 -0.81076,-0.1871 -1.03943,-0.41577 z"
+         id="path1089" />
+      <path
+         style="fill:#392d2e;stroke-width:0.264583"
+         d="m 193.34629,195.71504 c 1.27048,-1.46911 1.36403,-4.40076 0.18335,-5.74548 -1.01327,-1.15405 -1.11669,-1.15678 3.79041,0.10011 4.41653,1.13124 5.49742,1.48705 5.49742,1.80964 0,1.12978 -3.11603,2.81234 -6.92605,3.73985 -2.8415,0.69174 -3.0678,0.70026 -2.54513,0.0959 z"
+         id="path1087" />
+      <path
+         style="fill:#392d2e;stroke-width:0.264583"
+         d="m 159.95497,195.52682 c -1.23693,-0.34429 -2.51685,-0.70967 -2.84428,-0.81197 -0.54644,-0.17073 -0.59531,-0.34553 -0.59531,-2.12932 v -1.94332 l 0.99219,-0.2659 c 3.32483,-0.89104 6.44222,-1.51386 6.56696,-1.31202 0.0797,0.12904 -0.0896,0.23461 -0.37626,0.23461 -0.2867,0 -0.84365,0.38313 -1.23767,0.85139 -0.91641,1.0891 -0.85427,3.94552 0.11434,5.25563 0.72323,0.97822 0.49761,0.98863 -2.61997,0.1209 z"
+         id="path951" />
+      <path
+         style="fill:#b5efff;fill-opacity:1;stroke-width:0.264583"
+         d="m 153.17025,171.57404 c -1.58613,-0.64008 -1.92974,-2.96364 -0.60332,-4.07975 1.10263,-0.9278 2.18909,-0.89755 3.17505,0.0884 1.9145,1.9145 -0.0733,4.99957 -2.57173,3.99133 z"
+         id="path997" />
+      <path
+         style="fill:#b5efff;fill-opacity:1;stroke-width:0.264583"
+         d="m 155.19776,171.43678 c 1.54292,-0.79787 1.79751,-2.60078 0.54422,-3.85407 -2.06664,-2.06664 -5.24842,0.7505 -3.56391,3.15548 0.74747,1.06717 1.82492,1.31643 3.01969,0.69859 z"
+         id="path1055" />
+    </g>
+  </g>
+</svg>
diff --git a/static/style/timeline.css b/static/style/timeline.css
new file mode 100644
index 0000000000000000000000000000000000000000..56d4b24ed6e89cf5c602a350b3f3eee05eb2de54
--- /dev/null
+++ b/static/style/timeline.css
@@ -0,0 +1,132 @@
+/* css taken from https://www.w3schools.com/howto/howto_css_timeline.asp */
+
+/* The actual timeline (the vertical ruler) */
+.timeline {
+  --color: #f5f5f5;
+  position: relative;
+  max-width: 1200px;
+  margin: 0 auto;
+  padding-top: 100px;
+  padding-bottom: 100px;
+}
+
+/* The actual timeline (the vertical ruler) */
+.timeline::after {
+  content: '';
+  position: absolute;
+  width: 6px;
+  background-color: #5096C8;
+  top: 0;
+  bottom: 0;
+  left: 50%;
+  margin-left: -3px;
+}
+
+/* Container around content */
+.timeline .container {
+  padding: 0 40px;
+  position: relative;
+  background-color: inherit;
+  width: 50%;
+}
+
+/* The circles on the timeline */
+.timeline .container::after {
+  content: '';
+  position: absolute;
+  width: 25px;
+  height: 25px;
+  right: -12px;
+  background-color: #5096C8;
+  border: 4px solid #5096C8;
+  top: 15px;
+  border-radius: 50%;
+  z-index: 1;
+}
+
+/* Place the container to the left */
+.timeline .left {
+  left: 0;
+}
+
+/* Place the container to the right */
+.timeline .right {
+  left: 50%;
+}
+
+/* Add arrows to the left container (pointing right) */
+.timeline .left::before {
+  content: " ";
+  height: 0;
+  position: absolute;
+  top: 12px;
+  width: 0;
+  z-index: 1;
+  right: 30px;
+  border: medium solid var(--color);
+  border-width: 10px 0 10px 10px;
+  border-color: transparent transparent transparent var(--color);
+}
+
+/* Add arrows to the right container (pointing left) */
+.timeline .right::before {
+  content: " ";
+  height: 0;
+  position: absolute;
+  top: 12px;
+  width: 0;
+  z-index: 1;
+  left: 30px;
+  border: medium solid var(--color);
+  border-width: 10px 10px 10px 0;
+  border-color: transparent var(--color) transparent transparent;
+}
+
+/* Fix the circle for containers on the right side */
+.timeline .right::after {
+  left: -13px;
+}
+
+/* The actual content */
+.timeline .content {
+  padding: 2px 20px;
+  background-color: var(--color);
+  position: relative;
+  border-radius: 6px;
+}
+
+
+
+
+/* Media queries - Responsive timeline on screens less than 600px wide */
+@media screen and (max-width: 600px) {
+  /* Place the timelime to the left */
+  .timeline::after {
+  left: 31px;
+  }
+  
+  /* Full-width containers */
+  .timeline .container {
+  width: 100%;
+  padding-left: 70px;
+  padding-right: 25px;
+  }
+  
+  /* Make sure that all arrows are pointing leftwards */
+  .timeline .container::before {
+  left: 60px;
+  border: medium solid var(--color);
+  border-width: 10px 10px 10px 0;
+  border-color: transparent var(--color) transparent transparent;
+  }
+
+  /* Make sure all circles are at the same spot */
+  .timeline .left::after, .right::after {
+  left: 15px;
+  }
+  
+  /* Make all right containers behave like the left ones */
+  .timeline .right {
+  left: 0%;
+  }
+}
\ No newline at end of file
diff --git a/templates/custom/accueil.html b/templates/custom/accueil.html
index ff0523e520adf42bb1f7dacb42f1f54d99222a16..1e679f4aa7ca72a42fd8bb62f2f02ceb0d95ed96 100644
--- a/templates/custom/accueil.html
+++ b/templates/custom/accueil.html
@@ -40,7 +40,7 @@
 	        </ol>
             <u>Théorème :</u>
 	        <p>Une monnaie libre est possible et l'unique solution est un Dividende Universel, une part de monnaie créée périodiquement en proportion de la masse monétaire totale.</p>
-            <a href="https://trm.creationmonetaire.info/" class="w3-button w3-blue"><i class="fa fa-external-link-square"></i> Lire la TRM (v2.718)</a>
+            <a href="https://trm.creationmonetaire.info/" class="w3-round w3-button w3-blue"><i class="fa fa-external-link-square"></i> Lire la TRM (v2.718)</a>
         </div>
         <img alt="img" style="width: 25%;" src="/PELICAN/images/homepage/theorie-relative-de-la-monnaie-stephane-laborde.jpeg"/>
     </div>
@@ -57,7 +57,7 @@
             <p>Depuis le 8 mars 2017 (journée internationale des droits de la femme), Duniter fait fonctionner la première monnaie libre de l'histoire de l'humanité au sens donné par la TRM.</p>
             <p>La Ğ1 (prononcé "Ğ-une" ou "june") est un terrain d'expérimentation grandeur nature qui permet de confronter la théorie à la réalité. Plus de 2900 personnes y participent.</p>
             <p>Contrairement à beaucoup d'autre cryptomonnaies, elle présente une véritable activité économique qui justifie l'appellation de "monnaie" (plutôt que de jeton spéculatif).</p>
-            <a href="/g1/" class="w3-button w3-blue">En savoir plus sur la Äž1</a>
+            <a href="/g1/" class="w3-round w3-button w3-blue">En savoir plus sur la Äž1</a>
         </div>
     </div>
 
@@ -77,7 +77,7 @@
                 </p>
                 <p>Ces projets se sont réunis en 2019 à Berlin, à l'occasion des tables rondes de l'OpenUBI pour échanger et discuter sur les enjeux qu'ils partagent. Duniter fait figure d'exception par son approche théorique et ses apports techniques.</p>
                 <p>Un compte rendu est disponible ici :</p>
-                <a href="/PELICAN/docs/compte-rendu-reunion-Open-UBI.pdf" class="w3-button w3-blue"><i class="fa fa-file-pdf-o"></i> Comparaison des projets (PDF)</a>
+                <a href="/PELICAN/docs/compte-rendu-reunion-Open-UBI.pdf" class="w3-round w3-button w3-blue"><i class="fa fa-file-pdf-o"></i> Comparaison des projets (PDF)</a>
             </div>
             <img alt="img" style="width: 25%;" src="/PELICAN/images/homepage/autres-initiatives-blockchain-et-revenu-de-base.png"/>
         </div>
@@ -108,7 +108,7 @@
             <div>
                 <p>Au coeur de la monnaie est la confiance. La confiance dans l'absence de faux-monnayeurs et dans la robustesse du système. Duniter implémente une Toile de Confiance, un système innovant d'identification décentralisé qui sert de base au dividende universel.</p>
                 <p>Ce système d’identification pair-à-pair utilise des propriétés de théorie des graphes pour s'affranchir d'entité centrale tout en maintenant une notion forte d'identité. Une identité membre correspond ainsi strictement à une personne physique vivante.</p>
-                <a href="/wiki/toile-de-confiance/" class="w3-button w3-blue">Découvrir la Toile de Confiance</a>
+                <a href="/wiki/toile-de-confiance/" class="w3-round w3-button w3-blue">Découvrir la Toile de Confiance</a>
             </div>
         </div>
     </div>
@@ -119,7 +119,7 @@
             <div>
                 <p>La preuve de travail implémentée dans Duniter évite astucieusement la course à la puissance grâce à son système d'identification cryptographique. La difficulté de la preuve de travail est ainsi ajustée pour maintenir l'équilibre et éviter la surconsommation.</p>
                 <p>Duniter fonctionne sur des machines très modestes comme un simple Raspberry Pi, ce qui en fait un système peu énergivore. Cet élément est important pour se diriger vers une certaine sobriété énergétique.</p>
-                <a href="/wiki/duniter-est-il-energivore/" class="w3-button w3-blue">Duniter est-il énergivore ?</a>
+                <a href="/wiki/duniter-est-il-energivore/" class="w3-round w3-button w3-blue">Duniter est-il énergivore ?</a>
             </div>
             <img alt="img" style="width: 25%;" src="/PELICAN/images/homepage/light.svg"/>
         </div>
diff --git a/templates/custom/ecosysteme.html b/templates/custom/ecosysteme.html
index ddbe4cad7f621f6d8e8228ca0c6dc18fb52723a7..cc9b5b6a161c47cb368b879d43940ce5bdb5e660 100644
--- a/templates/custom/ecosysteme.html
+++ b/templates/custom/ecosysteme.html
@@ -7,40 +7,53 @@
 {% block content %}
 <main class="w3-container w3-padding-64">
 
+    <section class="w3-content">
+        <h1 style="text-align: center;">Écosystème logiciel</h1>
+    </section>
+
 <section class="w3-content w3-padding-32">
     <div class="titlecards">
-        <h1>Un serveur</h1>
+        <!-- main -->
         <div class="w3-row-padding">
             <div class="w3-col m4" style="float: none; margin: auto;"> 
-                <a href="/"><img src="/img/duniter-logo.svg"/></a>
+                <a href="https://git.duniter.org/nodes/typescript/duniter/"><img src="/img/duniter-logo_alt.svg"/></a>
                 <h3>Duniter</h3>
-                <p>Historiquement en <strong>Node.js</strong>, Duniter est en cours de migration vers <strong>Rust</strong>. C'est le cœur de la monnaie, il propulse la blockchain.</p>
+                <p>La blockchain de la Ğ1 fonctionne grâce à <a href="https://git.duniter.org/nodes/typescript/duniter/">Duniter</a>. Historiquement en <strong>Node.js</strong>, une migration progressive vers <strong>Rust</strong> est en cours.</p>
             </div>
         </div>
-    </div>
-</section>
-
-<section class="w3-content w3-padding-32">
-    <div class="titlecards">
-        <h1>Trois clients</h1>
+        <!-- clients -->
         <div class="w3-row-padding">
             <div class="w3-col m4">
                 <a href="https://cesium.app/fr/"><img src="/img/cesium.svg"/></a>
                 <h3>Cesium</h3>
-                <p>Fondé sur les frameworks <strong>AngularJS</strong> et <strong>Ionic</strong>, Cesium est un client web également disponible sur smartphone.</p>
+                <p>Fondé sur les frameworks <strong>AngularJS</strong> et <strong>Ionic</strong>, <a href="https://cesium.app/">Cesium</a> est un client web également disponible sur smartphone.</p>
             </div>
             <div class="w3-col m4">
                 <a href="https://silkaj.duniter.org/"><img src="/img/silkaj.svg"/></a>
                 <h3>Silkaj</h3>
-                <p>Client en ligne de commande développé en <strong>Python</strong>, Silkaj permet notamment d'automatiser certaines tâches complexes.</p>
+                <p>Client en ligne de commande développé en <strong>Python</strong>, <a href="https://silkaj.duniter.org/">Silkaj</a> permet notamment d'automatiser certaines tâches complexes.</p>
             </div>
             <div class="w3-col m4">
                 <a href="https://clients.duniter.io/python/duniterpy/index.html"><img src="/img/duniterpy-logo.png"/></a>
                 <h3>DuniterPy</h3>
-                <p>Bibliothèque <strong>Python</strong> actuellement utilisée par les clients Sakia et Silkaj, DuniterPy permet d'explorer simplement la blockchain.
+                <p>Bibliothèque <strong>Python</strong> actuellement utilisée par le client Silkaj, <a href="https://clients.duniter.io/python/duniterpy/index.html">DuniterPy</a> permet d'explorer simplement la blockchain.
                 </p>
             </div>
-            <!-- ajouter dex (database explorer) ? style="float: none; margin: auto;"   -->
+            <div class="w3-col m4">
+                <a href="https://www.gchange.fr/"><img src="/img/gchange.png"/></a>
+                <h3>Äžchange</h3>                
+                <p>C'est le logiciel de place de marché le plus utilisé. <a href="https://www.gchange.fr/">Ğchange</a> utilise les Datapod et une interface en <strong>Ionic</strong>.</p>
+            </div>
+            <div class="w3-col m4">
+                <a href="https://github.com/duniter/WotWizard/"><img src="/img/wizard.svg"/></a>
+                <h3>WotWizard</h3>
+                <p>Développé en <strong>Go</strong> et exposant une API <strong>GraphQL</strong>, <a href="https://github.com/duniter/WotWizard/">WotWizard</a> fournit des informations sur l'historique de la toile de confiance ansi que des prédictions sur les entrées.</p>
+            </div>
+            <div class="w3-col m4"> 
+                <a href="http://doc.e-is.pro/cesium-plus-pod/REST_API.html"><img src="/img/datapod.svg"/></a>
+                <h3>Datapod</h3>
+                <p>Les <a href="http://doc.e-is.pro/cesium-plus-pod/REST_API.html">Datapods</a> sont une couche de données complémentaires hors-blockchain sur <strong>ElasticSearch</strong> qui sert pour les applications clients comme Cesium et Ğchange.</p>
+            </div>
         </div>
     </div>
 </section>
@@ -48,128 +61,149 @@
 
 <section class="w3-content w3-padding-32">
     <div class="titlecards">
-        <h1>Un écosystème logiciel fourni</h1>
+        <h1>En développement actif</h1>
         <div class="w3-row-padding">
-            <div class="w3-col m4">
-                <i class="fa fa-balance-scale"></i>
-                <h3>Äžchange</h3>                
-                <p>Ğchange est la place de marché la plus active. Comme Césium, il offre des fonctionnalités de création de pages pour les entreprises.</p>
-                <p>Le logiciel est composé d'un serveur Elasticsearch et d'une interface ionic.js.</p>
-                <p><a href="https://www.gchange.fr/">Visiter Äžchange</a>
-                    <br><a href="https://git.duniter.org/search?search=gchange&group_id=165">Dépôts GitLab relatifs à Ğchange</a></p>
+            <div class="w3-col m4" style="float: none; margin: auto;">
+                <a href="https://git.p2p.legal/axiom-team/gecko"><img src="/img/gecko.png"/></a>
+                <h3>Äžecko</h3>
+                <p>Le framework <strong>Flutter</strong> permet au client mobile axé transaction <a href="https://git.p2p.legal/axiom-team/gecko">Ğecko</a> d'atteindre de très bonnes performances. Les portefeuilles sont gérés via des bindings <strong>Rust</strong> et les données sont échangées via GVA et les Datapods.</p>
             </div>
+        </div>
+    </div>
+</section>
+
+<section class="w3-content w3-padding-32">
+    <div class="titlecards">
+        <h1>De nombreux utilitaires</h1>
+
+        <div class="w3-row-padding">
             <div class="w3-col m4">
                 <i class="fa fa-bullhorn"></i>
                 <h3>Äžannonce</h3>
-                <p>Ğannonce est une place de marché généraliste permettant d'effectuer des financements participatifs.</p>
-                <p>C'est un plugin pour nœud Duniter qui utilise les commentaires de transaction pour mettre à jour la barre de financement.</p>
-                <p><a href="https://gannonce.duniter.org/">Visiter Äžannonce</a></p>
+                <p><a href="https://gannonce.duniter.org/">Ğannonce</a> est une place de marché permettant d'effectuer des financements participatifs. C'est un plugin pour nœud Duniter qui utilise les commentaires de transaction pour mettre à jour la barre de financement.</p>
+            </div>
+            <div class="w3-col m4">
+                <i class="fa fa-database"></i>
+                <h3>Remuniter</h3>
+                <p><a href="https://remuniter.cgeek.fr/">Remuniter</a> est une caisse commune pour <a href="/wiki/forger-des-blocs/remuneration-calcul-blocs/">rémunérer automatiquement</a> l'ajout d'un bloc dans la blockchain.</p>
             </div>
             <div class="w3-col m4">
                 <i class="fa fa-battery-half"></i>
                 <h3>Barre intégrable</h3>
-                <p>La barre de financement intégrable permet d'intégrer dans un site web une barre de progression via une balise <span style="font-family: monospace;">&lt;iframe/&gt;</span> afin de suivre l'évolution d'un financement participatif </p>
-                <p><a href="https://git.duniter.org/paidge/barre-de-financement-int-grable">Voir le dépôt de la barre de financement intégrable</a>
-                <br><a href="https://wotmap.duniter.org/iframe/generate.php">Générateur d'image et d'&lt;iframe/&gt; en ligne</a></p>
+                <p>La <a href="https://git.duniter.org/paidge/barre-de-financement-int-grable">barre de financement intégrable</a> permet d'intégrer dans un site web une barre de progression via une balise <span style="font-family: monospace;">&lt;iframe/&gt;</span> afin de suivre l'évolution d'un financement participatif.</p>
             </div>
         </div>
+
         <div class="w3-row-padding">
-            <div class="w3-col m4">
-                <i class="fa fa-database"></i>
-                <h3>Remuniter</h3>
-                <p>Remuniter est une caisse commune pour <a href="/wiki/forger-des-blocs/remuneration-calcul-blocs/">dédomager calculateurs</a>.</p>
-                <p>N'importe qui peut déposer de la monnaie sur la clé publique associée au service. 
-                    Il va alors automatiquement verser une petite somme (0,20 Ğ1 par bloc, à l'heure actuelle) aux nœuds qui participent au réseau. </p>
-                <p><a href="https://remuniter.cgeek.fr/#/">Visiter remuniter.cgeek.fr</a></p>
+            <div class="w3-col m3">
+                <img style="height: 5em; width: unset; margin-bottom: -12px;" src="/img/gsper-logo.svg"/>
+                <h3>Gsper</h3>
+                <p><a href="https://gsper.duniter.io/">Äžsper</a> permet d'essayer de retrouver un mot de passe perdu par force brute (<a href="https://forum.monnaie-libre.fr/t/rml14-erreur-de-transaction-portefeuille-fantome/8573/34">alt</a>).</p>
             </div>
-            <div class="w3-col m4">
-                <i class="fa fa-cube"></i>
-                <h3>Äž1Cotis</h3>
-                <p>Ğ1Cotis est un système de cotisations volontaires en monnaie libre.</p>
-                <p>Ğ1Cotis permet de reverser un pourcentage de transaction(s) à un ou plusieurs comptes, paramétrables selon vos souhaits.</p>
-                <p><a href="http://g1pourboire.fr/G1cotis.html">Visiter g1pourboire.fr/G1cotis</a></p>
+            <div class="w3-col m3">
+                <i class="fa fa-gears"></i>
+                <h3>Dex</h3>
+                <p><a href="https://git.duniter.org/nodes/typescript/duniter/-/tree/dev/rust-bins/duniter-dbex">Dex</a> est un explorateur de base de données Duniter.</p>
             </div>
-            <div class="w3-col m4">
-                <i class="fa fa-money"></i>
-                <h3>Äž1Pourboire</h3>
-                <p>Ğ1Pourboire est un système qui permet d'imprimer des petits papiers qui peuvent êtres 
-                    utilisés pour laisser un pourboire.</p>
-                <p>Ces petits papiers contiennent des codes d'accès à un portefeuille dédié, depuis lequel 
-                    le bénéficiaire pourra transférer la monnaie contenue.</p>
-                <p><a href="http://g1pourboire.fr/">Visiter g1pourboire.fr</a></p>
+            <div class="w3-col m3">
+                <i class="fa">🐔</i>
+                <h3>Tikka</h3>
+                <p><a href="https://forum.duniter.org/t/naissance-aujourdhui-de-tikka-un-nouveau-client/7849">Tikka</a> est un client bureau en développement.</p>
+            </div>
+            <div class="w3-col m3">
+                <i class="fa fa-terminal"></i>
+                <h3>Äžcli</h3>
+                <p><a href="https://git.duniter.org/clients/rust/gcli">Äžcli</a> est un client GVA en ligne de commande en <strong>Rust</strong>.</p>
             </div>
         </div>
+
         <div class="w3-row-padding">
-            <div class="w3-col m4">
+            <div class="w3-col m3">
+                <i class="fa fa-spell-check"></i>
+                <h3>dup-tools</h3>
+                <p><a href="https://git.duniter.org/tools/dup-tools-front">dup-tools</a> est un validateur de documents blockchain en <strong>Rust</strong> et <strong>Js</strong>.</p>
+            </div>
+            <div class="w3-col m3">
                 <i class="fa fa-book"></i>
                 <h3>VanityGen</h3>
-                <p>Programme qui permet de créer une clef publique contenant un certain schéma.</p>
-                <p>Avec VanityGen, vous pouvez par exemple créer une clef publique de la forme&nbsp;:</p>
-                <pre>CedricMoreau000BQCsfyJrAUDZJTqfnQHqJm2E89Vc</pre>
-                <p><a href="https://github.com/jytou/vanitygen">Visiter le dépôt de VanityGen</a></p>
+                <p><a href="https://github.com/jytou/vanitygen">VanityGen</a> permet de créer une clef publique contenant un certain schéma.</p>
             </div>
-            <div class="w3-col m4">
-                <img style="height: 5em; width: unset; margin-bottom: -12px;" src="/img/gsper-logo.svg"/>
-                <h3>Gsper</h3>
-                <p>Programme pour essayer de retrouver un mot de passe perdu, par force brute.</p>
-                <p><a href="https://gsper.duniter.io/">Visiter gsper.duniter.io</a>
-                <br><a href="https://forum.monnaie-libre.fr/t/rml14-erreur-de-transaction-portefeuille-fantome/8573/34">L'aternative de Matograine</a></p>
+            <div class="w3-col m3">
+                <img style="height: 5em; width: unset; margin-bottom: -12px;" src="/img/wotmap.jpg"/>
+                <h3>WOT map</h3>
+                <p>Logiciel de visualisation de la toile de confiance sous forme d'un graphe.</p>
+                <p><a href="https://wotmap.duniter.org/">Voir la WOT map</a></p>
             </div>
-            <div class="w3-col m4">
+            <div class="w3-col m3">
+                <i class="fa fa-play-circle"></i>
+                <h3>Animwotmap</h3>
+                <p><a href="https://forum.monnaie-libre.fr/t/la-toile-de-confiance-animee/11132">Animwotmap</a>Toile de confiance animée.</p>
+            </div>
+        </div>
+
+        <div class="w3-row-padding">
+            <div class="w3-col m3">
+                <i class="fa fa-globe-e"></i>
+                <h3>Worldwotmap</h3>
+                <p><a href="https://forum.duniter.org/t/carte-cesium-lente-ameliorer-worldwotmap/7529">WorlWotmap</a> Toile de confiance géographique.</p>
+            </div>
+            <div class="w3-col m3">
+                <i class="fa fa-cube"></i>
+                <h3>Äž1Cotis</h3>
+                <p><a href="https://g1pourboire.fr/G1cotis.html">Ğ1Cotis</a> permet de reverser automatiquement un pourcentage des transactions à un compte cible.</p>
+            </div>
+            <div class="w3-col m3">
+                <i class="fa fa-money"></i>
+                <h3>Äž1Pourboire</h3>
+                <p><a href="https://g1pourboire.fr/">Ğ1Pourboire</a> permet d'imprimer des des codes d'accès à un portefeuille dédié qui peuvent êtres utilisés pour laisser un pourboire.</p>
+            </div>
+            <div class="w3-col m3">
                 <i class="fa fa-comment"></i>
-                <h3>Ḡ1sms</h3>
-                <p>Bien que la monnaie ğ1 ait beaucoup recours à l'informatique, elle souhaite inclure les moins technophiles. C'est pourquoi nous avons développé un système de paiement par SMS.</p>
-                <p><a href="https://www.g1sms.fr/">Visiter g1sms.fr</a></p>
+                <h3>Äž1sms</h3>
+                <p><a href="https://www.g1sms.fr/">ĞSMS</a> est un système de paiement par SMS qui facilite l'accès à la monnaie aux moins technophiles.</p>
             </div>
         </div>
+
         <div class="w3-row-padding">
-            <div class="w3-col m4">
+            <div class="w3-col m3">
                 <i class="fa fa-money"></i>
                 <h3>Äž1Billet</h3>
-                <p>Pour imprimer votre propre monnaie, avec des <strong>QR codes</strong> et des billets à gratter.</p>
-                <p><a href="https://www.g1sms.fr/fr/blog/g1billet">Visiter g1sms.fr/g1billet</a></p>
+                <p><a href="https://g1sms.fr/fr/g1billet">Ğ1Billet</a> permet d'imprimer votre propre monnaie, avec des <strong>QR codes</strong> et des billets à gratter.</p>
             </div>
-            <div class="w3-col m4">
-                <i class="fa fa-book"></i>
+            <div class="w3-col m3">
+                <i class="fa fa-qrcode"></i>
                 <h3>Äž1Tag</h3>
-                <p>Capsule IPFS chiffrée qui conserve le montant en centimes de Ḡ1 (ZEN) dépensés à sa création</p>
-                <p><a href="https://www.g1sms.fr/fr/blog/g1tag">Visiter g1sms.fr/g1tag</a></p>
-            </div>
-            <div class="w3-col m4">
-                <img style="height: 5em; width: unset; margin-bottom: -12px;" src="/img/wot-wizard-black-and-white.png"/>
-                <h3>WOT Wizard</h3>
-                <p>Développé en <strong>Go</strong>, WOT Wizard permet de calculer les probabilités futures d’entrées d’une identité dans la toile de confiance</p>
-                <p><a href="https://wot-wizard.duniter.org/">Visiter wot-wizard.duniter.org</a></p>
+                <p><a href="https://www.g1sms.fr/fr/blog/g1tag">Ğ1Tag</a> est une capsule IPFS chiffrée qui conserve le montant en centimes de Ḡ1 (ZEN) dépensés à sa création</p>
             </div>
-        </div>
-        <div class="w3-row-padding">
-            <div class="w3-col m4">
-                <img style="height: 5em; width: unset; margin-bottom: -12px;" src="/img/wotmap.jpg"/>
-                <h3>WOT map</h3>
-                <p>Logiciel de visualisation de la toile de confiance sous forme d'un graphe.</p>
-                <p><a href="https://wotmap.duniter.org/">Voir la WOT map</a></p>
+            <div class="w3-col m3">
+                <i class="fa fa-link"></i>
+                <h3>Äž1Lien</h3>
+                <p><a href="https://git.duniter.org/clients/g1lien/#%C7%A71lien">Ǧ1Lien</a> définit la syntaxe d'url dédiées à la Ǧ1, tel que <a href="g1://pay:100:to:1000i100">g1://pay:100:to:1000i100</a>.</p>
             </div>
-            <div class="w3-col m4">
+            <div class="w3-col m3">
                 <i class="fa fa-bolt"></i>
-                <h3>g1-monit</h3>
-                <p>Logiciel permettant de générer diverses statistiques sur la monnaie libre Ğ1.</p>
-                <p><a href="https://monit.g1.nordstrom.duniter.org/">Visiter une instance g1-monit</a>
-                    <br><a href="https://git.duniter.org/nodes/typescript/modules/duniter-currency-monit">Dépôt Git du projet</a></p>
+                <h3>ÄŸ1-monit</h3>
+                <p><a href="https://git.duniter.org/nodes/typescript/modules/duniter-currency-monit">ğ1-monit</a> est un module duniter permettant de générer diverses statistiques sur la monnaie libre Ğ1.</p>
             </div>
-            <div class="w3-col m4">
-                <i class="fa fa-book"></i>
+        </div>
+
+        <div class="w3-row-padding">
+            <div class="w3-col m3">
+                <i class="fa fa-sliders"></i>
                 <h3>Äžmixer</h3>
-                <p>Anonymiseur de portefeuille Äž1.</p>
-                <p><a href="https://zettascript.org/projects/gmixer/">Site officiel</a>
-                    <br><a href="https://git.duniter.org/tuxmain/gmixer-webclient">Dépôt du client Javascript</a>
-                    <br><a href="https://git.duniter.org/tuxmain/gmixer-rs">Dépôt du serveur</a>
-                </p>
+                <p><a href="https://zettascript.org/projects/gmixer/">Ğmixer</a>est un anonymiseur de portefeuille Ğ1 (à ne pas confondre avec le service <a href="https://forum.monnaie-libre.fr/t/gmix-anonymiseur-de-porte-feuille-g1/862">ĞMix</a>).</p>
+            </div>
+            <div class="w3-col m3">
+                <img style="height: 5em; width: unset; margin-bottom: -12px;" src="/img/pig.png"/>
+                <h3>Äžakpot</h3>
+                <p><a href="https://forum.duniter.org/t/gakpot-service-de-cagnottes-en-ligne/8198">Ğakpot</a> est un gestionnaire de cagnotte en développement.</p>
             </div>
         </div>
     </div>
 </section>
 
-    
+
+
 
 </main>
 {% endblock content %}
diff --git a/templates/custom/g1.html b/templates/custom/g1.html
index 23fe0f99674bc5021b81d92958555a526d1d8c4f..f14b4393a012e4508f391fa9d63cb4db20f012ce 100644
--- a/templates/custom/g1.html
+++ b/templates/custom/g1.html
@@ -3,120 +3,122 @@
 {% block title %}<title>Duniter | Äž1</title>{% endblock title %}
 {% block description %}<meta name="description" content="La monnaie ğ1 est la première monnaie libre en circulation.">{% endblock description %}
 {% block keywords %}<meta name="keywords" content="monnaie libre, ÄŸ1">{% endblock keywords %}
+{% block extrahead %}<link rel="stylesheet" type="text/css" href="/style/timeline.css">{% endblock extrahead %}
+
 {% block content %}
 
 <main class="w3-container">
 
     <div class="w3-panel textimage">
-        <img alt="logo ÄŸ1" style="width: 30%;" src="/img/gbrevedot.svg">
+        <img alt="logo ÄŸ1" style="width: 30%;" src="/img/gbrevedot_color.svg">
         <div>
             <h1>La monnaie Äž1</h1>
-            <p>La Ğ1 (prononcé "Ğ-une" ou "june") est une monnaie libre fonctionnant à l'aide du logiciel Duniter. Créée il y a quatre ans, elle compte aujourd'hui plus de 2900 membres co-créateurs.</p>
+            <p>La Ğ1 (prononcé "Ğ-une" ou "June") est une monnaie libre fonctionnant à l'aide du logiciel Duniter. Créée il y a quatre ans, elle compte aujourd'hui plus de 2900 membres co-créateurs.</p>
             <p>Cette expérience a permis d'en apprendre beaucoup, tant sur le plan technique que sur le plan humain. Ce site est plutôt consacré à l'aspect technique. Pour les détails pratiques, consultez plutôt le site monnaie libre.</p>
             <a class="w3-round w3-large" href="https://monnaie-libre-fr.vercel.app/"><i class="fa fa-external-link-square"></i> Site monnaie-libre.fr</a>
         </div>
     </div>
 
-
-<div class="w3-content" style="max-width: 35em;">
-    <h1>Particularités de la Ğ1</h1>
-    <div class="">
-        <p>Duniter a été codé pour faire advenir une monnaie libre.</p>
-        <p>Après des années de développement, est enfin née la première monnaie libre de l'histoire de l'humanité, le 8 mars 2017.</p>
-        <p>Nous l'avons appelée la Ğ1 (prononcez "jüne").</p>
-        <p>En plus d'être une monnaie libre, la Ğ1 possèdes plusieurs caractéristiques qui lui sont propre :</p>
+    <div class="w3-panel textimage" style="min-height: 40vh;">
+        <div>
+            <h2>Un projet dans la durée</h2>
+            <p>De nombreuses cryptomonnaies tentent de s'imposer rapidement à l'aide de techniques marketing aggressive ou d'<em>initial coin offering</em> (ICO). La June prend le temps d'instaurer la confiance et avance avec équilibre.</p>
+        </div>
+        <img alt="logo ÄŸ1" src="/img/coin.png">
     </div>
-</div>
-    
-<div class="w3-content w3-center w3-padding-32">
-    <h1>Un modèle économique solidaire</h1>
-    <div class="w3-row">
-        <div class="w3-half">
-            <img src="/PELICAN/images/code.svg" height="256px"/>
-            <h3>Développeurs</h3>
-            <p>Les développeurs sont volontaires. Leurs contributions sont valorisées par une caisse de financement participatif en monnaie libre Ğ1 (la monnaie produite par Duniter).</p>
+
+    <div class="timeline">
+        <div class="container left">
+          <div class="content">
+            <h5>avril 2016</h5>
+            <p>Le projet initialement nommé uCoin <a href="/blog/ucoin-rename-duniter/">change de nom et devient Duniter</a>. C'est le début du logiciel qui fait fonctionner la June.</p>
+          </div>
         </div>
-        <div class="w3-half">
-            <img src="/PELICAN/images/network.svg" height="256px"/>
-            <h3>Nœuds calculateurs</h3>
-            <p>Les nœuds calculateurs sont financés par crowdfunding également, via un système appelé Remuniter.</p>
+        <div class="container right">
+          <div class="content">
+            <h5>8 mars 2017</h5>
+            <p>Une année après <a href="/blog/bye-metabrouzouf/">la fin de l'expérimentation Meta_Brouzouf</a>, le premier bloc de la June est écrit. Il compte <b>59 membres</b> et démarre une aventure qui se poursuit aujourd'hui.</p>
+          </div>
         </div>
+        <div class="container left">
+          <div class="content">
+            <h5>1er mai 2018</h5>
+            <p>Un peu plus d'un an après son lancement, la June passe le cap symbolique des 1000 membres simultanément co-créateurs de monnaie. Malgré une économie naissante, l'idée séduit d'un bout à l'autre de la France.</p>
+          </div>
+        </div>
+        <div class="container right">
+          <div class="content">
+            <h5>31 décembre 2019</h5>
+            <p>Entre le début de la Ğ1 et la fin de l'année 2019, plus de 3000 personnes ont été cocréatrices de monnaie libre au moins une fois dans leur vie.</p>
+          </div>
+        </div>
+        <div class="container left">
+          <div class="content">
+            <h5>avril 2020</h5>
+            <p>Malgré la pandémie qui limite les rencontres physiques, le forum Duniter dédié aux contributeurs techniques dépasse la barre symbolique des 1000 comptes. Le projet intéresse donc tant sur le point humain que sur les aspects techniques.</p>
+          </div>
+        </div>
+        <div class="container right">
+          <div class="content">
+            <h5>juin 2020</h5>
+            <p>Le site de petites annonces ğchange dépasse la barre symbolique des <a href="https://www.gchange.fr/#/app/data/stats?stepUnit=month">10 000 annonces</a>. De nombreux ğmarchés hors ligne ont également été organisés !</p>
+          </div>
+        </div>
+        <div class="container left">
+          <div class="content">
+            <h5>2021</h5>
+            <p>Que nous réserve l'année 2021 ? Rejoignez l'aventure pour le savoir !</p>
+          </div>
+        </div>
+      </div>
+
+      <div class="w3-panel textimage">
+        <div>
+            <h2>Une monnaie née en France</h2>
+            <p>La June est née en France, et la grande majorité de ses utilisateurs y vivent. De plus, la plupart des contenus ne sont disponibles qu'en Français, mais le projet suscite un intérêt par delà la barrière de la langue. Consultez les sites suivants pour les autres langues.</p>
+            <a class="w3-round w3-button w3-orange" href="https://monedalliure.org/">catalan</a>
+            <a class="w3-round w3-button w3-red" href="https://moneda-libre.org/">castillan</a>
+            <a class="w3-round w3-button w3-green" href="https://www.miavivo.net/grupoj/libera-mono-la-guno-g1/">esperanto</a>
+        </div>
+        <img alt="logo ÄŸ1" style="max-width: 30%;" src="/home/fr-mars-2021.png">
     </div>
-</div>
-    
-    
-<div class="w3-container w3-row w3-padding-64">
-    <div class="w3-col l7 w3-mobile w3-padding">
-    <h2>Une expansion lente, mais régulière</h2>
-    <p>La Toile de Confiance de la Ğ1 a été initialisée en France par 59 personnes.</p>
-    <p>Malgré quelques obstacles (difficulté des nouveaux à conceptualiser une monnaie libre, puis difficulté à obtenir 5 certifications), la Toile de Confiance s'étend progressivement en France, en Belgique, et même au-delà.</p>
-    <p>Déjà plus de 2400 personnes sont certifiées et donc membres co-producteurs de monnaie.</p>
-    <p>Si l'économie en est encore à ses débuts, elle est relativement plus dynamique dans les régions où sont pour l'instant concentrés l'essentiel de ses utilisateurs, en Occitanie et en Mayenne notamment.</p>
-    </div>
-    <img class="w3-col l5 w3-mobile" src="/PELICAN/images/g1/carte-france.png"/>
-</div>
-    
-<div class="w3-container w3-content w3-padding-64">
-    <div class="w3-mobile w3-padding">
-        <h2>Une économie bien réelle</h2>
-        <p>Parce qu'une monnaie libre rend impossible la création monétaire arbitraire, elle limite considérablement les bulles financières, et favorise par là même l'économie dite "réelle".</p>
-        <p>C'est actuellement ce qu'on observe dans la Ğ1 : la plupart des membres échangent des autoproductions (produits "faits main" ou "faits maison", services, etc.) et des biens d'occasion (livres, vêtements, etc.).</p>
-        <p>Il arrive même de voir apparaître, lors de ventes aux enchères, des valeurs économiques un peu plus prestigieuses : ordinateurs portables, guitares folk, claviers MIDI et synthétiseurs, ordinateurs collector types Commodore ou Amiga, etc.</p>
-        <p>Sur ğchange, qu'on peut voir comme "le bon coin de la Ğ1", on recense déjà plus de 3000 petites annonces.</p>
-    </div>
-    <a href="#" title="Visiter Äžchange"><img class="w3-mobile" src="/PELICAN/images/g1/gchange-toulouse.png" style="max-width: 100%;"/></a>
-</div>
-    
-<div class="w3-container w3-center w3-padding-32">
-    <h2>Une expérience qui intéresse la recherche</h2>
-    <p>Expérience sociale grandeur nature, la Ğ1 commence à intéresser quelques chercheuses et chercheurs, qui lui consacrent des travaux de recherche :</p>
-    <div class="w3-row-padding">
-        <p class="w3-card w3-light-gray w3-col m3 w3-margin">
-        25 nov 2019<br>
-        <a href="https://arxiv.org/abs/1911.10792v1">Do you trade with your friends or become friends with your trading partners? A case study in the G1 cryptocurrency</a><br>
-        Nicolas Gensollen, Matthieu Latapy
-        </p>
-        <p class="w3-card w3-light-gray w3-col m3 w3-margin">
-        16 jan 2019<br>
-        <a href="https://papers.ssrn.com/sol3/papers.cfm?abstract_id=3317121">At the Very Beginning, There’s This Dream.’ The Role of Utopia in the Workings of Local and Cryptocurrencies</a><br>
-        Diane-Laure Arjaliès
-        </p>
+
+    <div class="w3-panel textimage">
+      <img alt="image" src="/PELICAN/images/network.svg" style="max-width: 15%;"/>
+      <div>
+        <h2>Une gouvernance technique partagée</h2>
+        <p>La preuve de travail personnalisée de Duniter met chaque membre à égalité pour l'écriture de la blockchain. En pratique, déjà 184 personnes ont écrit au moins un bloc, ce qui représente une part importante des utilisateurs, au contraire d'autres cryptomonnaies.</p>
+        <p>Le calcul de bloc n'étant pas rémunéré par création monétaire, une <a href="https://remuniter.cgeek.fr/">caisse collaborative</a> récompense automatiquement l'auteur de chaque bloc.</p>
+      </div>
     </div>
-</div>
-    
-<div class="w3-container w3-padding-32">
-    <h1 class="w3-center">Une monnaie qui a le vent en poupe</h1>
-    <div class="numbercards">
-        <div class="numbercard" style="flex-basis: 35%;">
-        <h2>24+</h2><h3>groupes locaux</h3>
-        <p>Plus de 24 groupes locaux, pour la majorité situés en France ou en Belgique.</p>
-        <p>Tous animés par des bénévoles qui, à l'occasion d'apéros ou de ğmarchés expliquent la TRM ou le fonctionnement des clients de Duniter.</p>
+
+    <div class="w3-container w3-content w3-padding-64">
+        <div class="">
+            <h2>Une économie vivante</h2>
+            <p>Malgré l'intérêt pour la technique, la première fonction d'une monnaie reste l'échange ! La June présente une activité économique foisonnante dans les régions les plus denses.</p>
+            <p>Plusieurs sites d'annonces comme Le Bon Coin ou Craigslist spécifiquement dédiés à la June permettent aux personnes de prendre contact à distance pour échanger des biens ou services. Le plus connu, ğchange, a vu passer plus de 15000 offres et demandes !</p>
         </div>
-        <div class="numbercard" style="flex-basis: 35%;">
-        <h2>+900</h2><h3>coproducteurs en 2019</h3>
-        <p>Chaque année, de plus en plus d'individus font les démarches nécessaires pour rejoindre la toile de confiance afin de pouvoir co-produire la Ğ1.</p>
-        <p>En 2019, plus de 900 personnes ont ainsi réussi à obtenir les 5 certifications leur permettant de produire chaque jour le dividende universel.</p>
+        <a href="https://www.gchange.fr/" title="Consulter Äžchange"><img src="/PELICAN/images/g1/gchange-toulouse.png" style="max-width: 80%; margin: 1em 10%;"/></a>
+
+        <div class="w3-display-container" style="height: 6em;">
+          <div class="w3-display-middle">
+            <a class="w3-button w3-blue w3-round" href="https://www.gchange.fr/"><i class="fa fa-chevron-circle-right"></i> Äžchange</a>
+            <a class="w3-button w3-green w3-round" href="https://gannonce.duniter.org/"><i class="fa fa-chevron-circle-right"></i> Äžannonce</a>
+          </div>
         </div>
+
     </div>
-</div>
-    
-<div class="w3-container w3-content">
-    <div>
-    <h2>Aller plus loin</h2>
-    <ul>
-    <li><a href="/wiki/g1/faq-g1/">Questions fréquentes sur la Ğ1</a></li>
-    <li><a href="/wiki/g1/obtenir-des-g1/">Comment obtenir des Äž1</a></li>
-    <li><a href="/wiki/g1/licence-g1/">Licence Äž1</a></li>
-    <li>Plus d'infos sur <a href="https://monnaie-libre.fr/">monnaie-libre.fr</a></li>
-    </ul>
-    <h3>Articles</h3>
-    <ul>
-    <li><a href="https://blog.spyou.org/wordpress-mu/2017/03/14/oh-les-cons-ils-ont-double-hamon/">Oh les cons, ils ont doublé Hamon !</a> par Spyou</li>
-    <li><a href="https://pluxml.nayya.org/pluxml/">Une monnaie libre existe !</a> par Nay4</li>
-    </ul>
-    </div>
-</div>
     
+  	
+	<div class="w3-panel textimage">
+    <img alt="img" src="/home/info.svg" style="max-width: 15%;"/>
+      <div>
+        <h2>Plus d'infos</h2>
+        <p>Pour les détails pratiques, nous vons invitons à consulter le site <a class="w3-round" href="https://monnaie-libre.fr/">monnaie-libre.fr</a> ou à discuter avec d'autres utilisateurs sur le <a class="w3-round" href="https://forum.monnaie-libre.fr/">forum.monnaie-libre.fr</a>.</p>
+        <p>Sur ce site, vous trouverez plus d'informations techniques par rapport à la ğ1 dans la catégorie dédiée du wiki. Vous pouvez également consulter les question fréquemment posées à propos de la ğ1.</p>
+        <a class="w3-button w3-indigo w3-round" href="#"><i class="fa fa-question-circle"></i> FAQ Äž1</a>
+      </div>
+  </div>
 
 </main>
 {% endblock content %}
diff --git a/templates/feed.html b/templates/feed.html
index 5333994bc7e8df1012b44b518adc37b0ad2ba0a9..940bc5796fd86adfe6f49dd422e1fdab4f025d00 100644
--- a/templates/feed.html
+++ b/templates/feed.html
@@ -12,7 +12,7 @@
 
     {% if not section.extra.disable_listing %}
     <hr>
-      {% for article in section.pages | reverse() %}
+      {% for article in section.pages %}
       <a href="{{ article.permalink }}">
       <div class="w3-margin-mobile w3-row-padding kkk-newslink">
         {% if article.extra.thumbnail %}
diff --git a/templates/nav.html b/templates/nav.html
index afe228dd1eb2a1b3e307f19a9029c05f8dfa7f8e..edd3862bf16cf2ffbbfe1f828f10f1bd57d1b04b 100644
--- a/templates/nav.html
+++ b/templates/nav.html
@@ -11,6 +11,10 @@
     {% endif %}
   {% endfor %}
 
+  <a href="https://duniter.org/" title="English website" class="w3-bar-item w3-button w3-right" style="font-size: 1.6em; padding: 0 10px;">
+    🇬🇧
+  </a>
+
   <div class="w3-dropdown-hover w3-dropdown-click w3-right">
     <button class="w3-button">Liens <i class="fa fa-caret-down"></i></button>
     <div class="w3-dropdown-content w3-bar-block w3-dark-grey">