add help

12 files changed, 586 insertions, 27 deletions

diff --git a/css/notes.css b/css/notes.css
index 520192ff..4b2079c7 100644
--- a/css/notes.css
+++ b/css/notes.css
@@ -26,6 +26,25 @@ li:focus  .app-navigation-entry__utils .action-item {
 	visibility: visible;
 }
 
+/* Welcome / Help */
+.feature {
+	background-position: left center;
+	width: 100%;
+	min-height: 32px;
+	line-height: 32px;
+	padding-left: 32px;
+	margin-top: 0.3em !important;
+	margin-bottom: 0.3em !important;
+	display: inline-block;
+	vertical-align: middle;
+}
+
+.feature ul {
+	list-style: circle outside;
+	padding-left: 2em;
+}
+
+
 @media print {
 	#header,
 	.app-navigation,
diff --git a/img/badge_applestore.svg b/img/badge_applestore.svg
new file mode 100644
index 00000000..92fa58f0
--- /dev/null
+++ b/img/badge_applestore.svg
@@ -0,0 +1,46 @@
+<svg id="livetype" xmlns="http://www.w3.org/2000/svg" width="119.66407" height="40" viewBox="0 0 119.66407 40">
+	<title>Download_on_the_App_Store_Badge_US-UK_RGB_blk_4SVG_092917</title>
+	<g>
+		<g>
+			<g>
+				<path d="M110.13477,0H9.53468c-.3667,0-.729,0-1.09473.002-.30615.002-.60986.00781-.91895.0127A13.21476,13.21476,0,0,0,5.5171.19141a6.66509,6.66509,0,0,0-1.90088.627A6.43779,6.43779,0,0,0,1.99757,1.99707,6.25844,6.25844,0,0,0,.81935,3.61816a6.60119,6.60119,0,0,0-.625,1.90332,12.993,12.993,0,0,0-.1792,2.002C.00587,7.83008.00489,8.1377,0,8.44434V31.5586c.00489.3105.00587.6113.01515.9219a12.99232,12.99232,0,0,0,.1792,2.0019,6.58756,6.58756,0,0,0,.625,1.9043A6.20778,6.20778,0,0,0,1.99757,38.001a6.27445,6.27445,0,0,0,1.61865,1.1787,6.70082,6.70082,0,0,0,1.90088.6308,13.45514,13.45514,0,0,0,2.0039.1768c.30909.0068.6128.0107.91895.0107C8.80567,40,9.168,40,9.53468,40H110.13477c.3594,0,.7246,0,1.084-.002.3047,0,.6172-.0039.9219-.0107a13.279,13.279,0,0,0,2-.1768,6.80432,6.80432,0,0,0,1.9082-.6308,6.27742,6.27742,0,0,0,1.6172-1.1787,6.39482,6.39482,0,0,0,1.1816-1.6143,6.60413,6.60413,0,0,0,.6191-1.9043,13.50643,13.50643,0,0,0,.1856-2.0019c.0039-.3106.0039-.6114.0039-.9219.0078-.3633.0078-.7246.0078-1.0938V9.53613c0-.36621,0-.72949-.0078-1.09179,0-.30664,0-.61426-.0039-.9209a13.5071,13.5071,0,0,0-.1856-2.002,6.6177,6.6177,0,0,0-.6191-1.90332,6.46619,6.46619,0,0,0-2.7988-2.7998,6.76754,6.76754,0,0,0-1.9082-.627,13.04394,13.04394,0,0,0-2-.17676c-.3047-.00488-.6172-.01074-.9219-.01269-.3594-.002-.7246-.002-1.084-.002Z" style="fill: #a6a6a6"/>
+				<path d="M8.44483,39.125c-.30468,0-.602-.0039-.90429-.0107a12.68714,12.68714,0,0,1-1.86914-.1631,5.88381,5.88381,0,0,1-1.65674-.5479,5.40573,5.40573,0,0,1-1.397-1.0166,5.32082,5.32082,0,0,1-1.02051-1.3965,5.72186,5.72186,0,0,1-.543-1.6572,12.41351,12.41351,0,0,1-.1665-1.875c-.00634-.2109-.01464-.9131-.01464-.9131V8.44434S.88185,7.75293.8877,7.5498a12.37039,12.37039,0,0,1,.16553-1.87207,5.7555,5.7555,0,0,1,.54346-1.6621A5.37349,5.37349,0,0,1,2.61183,2.61768,5.56543,5.56543,0,0,1,4.01417,1.59521a5.82309,5.82309,0,0,1,1.65332-.54394A12.58589,12.58589,0,0,1,7.543.88721L8.44532.875H111.21387l.9131.0127a12.38493,12.38493,0,0,1,1.8584.16259,5.93833,5.93833,0,0,1,1.6709.54785,5.59374,5.59374,0,0,1,2.415,2.41993,5.76267,5.76267,0,0,1,.5352,1.64892,12.995,12.995,0,0,1,.1738,1.88721c.0029.2832.0029.5874.0029.89014.0079.375.0079.73193.0079,1.09179V30.4648c0,.3633,0,.7178-.0079,1.0752,0,.3252,0,.6231-.0039.9297a12.73126,12.73126,0,0,1-.1709,1.8535,5.739,5.739,0,0,1-.54,1.67,5.48029,5.48029,0,0,1-1.0156,1.3857,5.4129,5.4129,0,0,1-1.3994,1.0225,5.86168,5.86168,0,0,1-1.668.5498,12.54218,12.54218,0,0,1-1.8692.1631c-.2929.0068-.5996.0107-.8974.0107l-1.084.002Z"/>
+			</g>
+			<g id="_Group_" data-name="&lt;Group&gt;">
+				<g id="_Group_2" data-name="&lt;Group&gt;">
+					<g id="_Group_3" data-name="&lt;Group&gt;">
+						<path id="_Path_" data-name="&lt;Path&gt;" d="M24.76888,20.30068a4.94881,4.94881,0,0,1,2.35656-4.15206,5.06566,5.06566,0,0,0-3.99116-2.15768c-1.67924-.17626-3.30719,1.00483-4.1629,1.00483-.87227,0-2.18977-.98733-3.6085-.95814a5.31529,5.31529,0,0,0-4.47292,2.72787c-1.934,3.34842-.49141,8.26947,1.3612,10.97608.9269,1.32535,2.01018,2.8058,3.42763,2.7533,1.38706-.05753,1.9051-.88448,3.5794-.88448,1.65876,0,2.14479.88448,3.591.8511,1.48838-.02416,2.42613-1.33124,3.32051-2.66914a10.962,10.962,0,0,0,1.51842-3.09251A4.78205,4.78205,0,0,1,24.76888,20.30068Z" style="fill: #fff"/>
+						<path id="_Path_2" data-name="&lt;Path&gt;" d="M22.03725,12.21089a4.87248,4.87248,0,0,0,1.11452-3.49062,4.95746,4.95746,0,0,0-3.20758,1.65961,4.63634,4.63634,0,0,0-1.14371,3.36139A4.09905,4.09905,0,0,0,22.03725,12.21089Z" style="fill: #fff"/>
+					</g>
+				</g>
+				<g>
+					<path d="M42.30227,27.13965h-4.7334l-1.13672,3.35645H34.42727l4.4834-12.418h2.083l4.4834,12.418H43.438ZM38.0591,25.59082h3.752l-1.84961-5.44727h-.05176Z" style="fill: #fff"/>
+					<path d="M55.15969,25.96973c0,2.81348-1.50586,4.62109-3.77832,4.62109a3.0693,3.0693,0,0,1-2.84863-1.584h-.043v4.48438h-1.8584V21.44238H48.4302v1.50586h.03418a3.21162,3.21162,0,0,1,2.88281-1.60059C53.645,21.34766,55.15969,23.16406,55.15969,25.96973Zm-1.91016,0c0-1.833-.94727-3.03809-2.39258-3.03809-1.41992,0-2.375,1.23047-2.375,3.03809,0,1.82422.95508,3.0459,2.375,3.0459C52.30227,29.01563,53.24953,27.81934,53.24953,25.96973Z" style="fill: #fff"/>
+					<path d="M65.12453,25.96973c0,2.81348-1.50586,4.62109-3.77832,4.62109a3.0693,3.0693,0,0,1-2.84863-1.584h-.043v4.48438h-1.8584V21.44238H58.395v1.50586h.03418A3.21162,3.21162,0,0,1,61.312,21.34766C63.60988,21.34766,65.12453,23.16406,65.12453,25.96973Zm-1.91016,0c0-1.833-.94727-3.03809-2.39258-3.03809-1.41992,0-2.375,1.23047-2.375,3.03809,0,1.82422.95508,3.0459,2.375,3.0459C62.26711,29.01563,63.21438,27.81934,63.21438,25.96973Z" style="fill: #fff"/>
+					<path d="M71.71047,27.03613c.1377,1.23145,1.334,2.04,2.96875,2.04,1.56641,0,2.69336-.80859,2.69336-1.91895,0-.96387-.67969-1.541-2.28906-1.93652l-1.60937-.3877c-2.28027-.55078-3.33887-1.61719-3.33887-3.34766,0-2.14258,1.86719-3.61426,4.51855-3.61426,2.624,0,4.42285,1.47168,4.4834,3.61426h-1.876c-.1123-1.23926-1.13672-1.9873-2.63379-1.9873s-2.52148.75684-2.52148,1.8584c0,.87793.6543,1.39453,2.25488,1.79l1.36816.33594c2.54785.60254,3.60645,1.626,3.60645,3.44238,0,2.32324-1.85059,3.77832-4.79395,3.77832-2.75391,0-4.61328-1.4209-4.7334-3.667Z" style="fill: #fff"/>
+					<path d="M83.34621,19.2998v2.14258h1.72168v1.47168H83.34621v4.99121c0,.77539.34473,1.13672,1.10156,1.13672a5.80752,5.80752,0,0,0,.61133-.043v1.46289a5.10351,5.10351,0,0,1-1.03223.08594c-1.833,0-2.54785-.68848-2.54785-2.44434V22.91406H80.16262V21.44238H81.479V19.2998Z" style="fill: #fff"/>
+					<path d="M86.065,25.96973c0-2.84863,1.67773-4.63867,4.29395-4.63867,2.625,0,4.29492,1.79,4.29492,4.63867,0,2.85645-1.66113,4.63867-4.29492,4.63867C87.72609,30.6084,86.065,28.82617,86.065,25.96973Zm6.69531,0c0-1.9541-.89551-3.10742-2.40137-3.10742s-2.40039,1.16211-2.40039,3.10742c0,1.96191.89453,3.10645,2.40039,3.10645S92.76027,27.93164,92.76027,25.96973Z" style="fill: #fff"/>
+					<path d="M96.18606,21.44238h1.77246v1.541h.043a2.1594,2.1594,0,0,1,2.17773-1.63574,2.86616,2.86616,0,0,1,.63672.06934v1.73828a2.59794,2.59794,0,0,0-.835-.1123,1.87264,1.87264,0,0,0-1.93652,2.083v5.37012h-1.8584Z" style="fill: #fff"/>
+					<path d="M109.3843,27.83691c-.25,1.64355-1.85059,2.77148-3.89844,2.77148-2.63379,0-4.26855-1.76465-4.26855-4.5957,0-2.83984,1.64355-4.68164,4.19043-4.68164,2.50488,0,4.08008,1.7207,4.08008,4.46582v.63672h-6.39453v.1123a2.358,2.358,0,0,0,2.43555,2.56445,2.04834,2.04834,0,0,0,2.09082-1.27344Zm-6.28223-2.70215h4.52637a2.1773,2.1773,0,0,0-2.2207-2.29785A2.292,2.292,0,0,0,103.10207,25.13477Z" style="fill: #fff"/>
+				</g>
+			</g>
+		</g>
+		<g id="_Group_4" data-name="&lt;Group&gt;">
+			<g>
+				<path d="M37.82619,8.731a2.63964,2.63964,0,0,1,2.80762,2.96484c0,1.90625-1.03027,3.002-2.80762,3.002H35.67092V8.731Zm-1.22852,5.123h1.125a1.87588,1.87588,0,0,0,1.96777-2.146,1.881,1.881,0,0,0-1.96777-2.13379h-1.125Z" style="fill: #fff"/>
+				<path d="M41.68068,12.44434a2.13323,2.13323,0,1,1,4.24707,0,2.13358,2.13358,0,1,1-4.24707,0Zm3.333,0c0-.97607-.43848-1.54687-1.208-1.54687-.77246,0-1.207.5708-1.207,1.54688,0,.98389.43457,1.55029,1.207,1.55029C44.57522,13.99463,45.01369,13.42432,45.01369,12.44434Z" style="fill: #fff"/>
+				<path d="M51.57326,14.69775h-.92187l-.93066-3.31641h-.07031l-.92676,3.31641h-.91309l-1.24121-4.50293h.90137l.80664,3.436h.06641l.92578-3.436h.85254l.92578,3.436h.07031l.80273-3.436h.88867Z" style="fill: #fff"/>
+				<path d="M53.85354,10.19482H54.709v.71533h.06641a1.348,1.348,0,0,1,1.34375-.80225,1.46456,1.46456,0,0,1,1.55859,1.6748v2.915h-.88867V12.00586c0-.72363-.31445-1.0835-.97168-1.0835a1.03294,1.03294,0,0,0-1.0752,1.14111v2.63428h-.88867Z" style="fill: #fff"/>
+				<path d="M59.09377,8.437h.88867v6.26074h-.88867Z" style="fill: #fff"/>
+				<path d="M61.21779,12.44434a2.13346,2.13346,0,1,1,4.24756,0,2.1338,2.1338,0,1,1-4.24756,0Zm3.333,0c0-.97607-.43848-1.54687-1.208-1.54687-.77246,0-1.207.5708-1.207,1.54688,0,.98389.43457,1.55029,1.207,1.55029C64.11232,13.99463,64.5508,13.42432,64.5508,12.44434Z" style="fill: #fff"/>
+				<path d="M66.4009,13.42432c0-.81055.60352-1.27783,1.6748-1.34424l1.21973-.07031v-.38867c0-.47559-.31445-.74414-.92187-.74414-.49609,0-.83984.18213-.93848.50049h-.86035c.09082-.77344.81836-1.26953,1.83984-1.26953,1.12891,0,1.76563.562,1.76563,1.51318v3.07666h-.85547v-.63281h-.07031a1.515,1.515,0,0,1-1.35254.707A1.36026,1.36026,0,0,1,66.4009,13.42432Zm2.89453-.38477v-.37646l-1.09961.07031c-.62012.0415-.90137.25244-.90137.64941,0,.40527.35156.64111.835.64111A1.0615,1.0615,0,0,0,69.29543,13.03955Z" style="fill: #fff"/>
+				<path d="M71.34816,12.44434c0-1.42285.73145-2.32422,1.86914-2.32422a1.484,1.484,0,0,1,1.38086.79h.06641V8.437h.88867v6.26074h-.85156v-.71143h-.07031a1.56284,1.56284,0,0,1-1.41406.78564C72.0718,14.772,71.34816,13.87061,71.34816,12.44434Zm.918,0c0,.95508.4502,1.52979,1.20313,1.52979.749,0,1.21191-.583,1.21191-1.52588,0-.93848-.46777-1.52979-1.21191-1.52979C72.72121,10.91846,72.26613,11.49707,72.26613,12.44434Z" style="fill: #fff"/>
+				<path d="M79.23,12.44434a2.13323,2.13323,0,1,1,4.24707,0,2.13358,2.13358,0,1,1-4.24707,0Zm3.333,0c0-.97607-.43848-1.54687-1.208-1.54687-.77246,0-1.207.5708-1.207,1.54688,0,.98389.43457,1.55029,1.207,1.55029C82.12453,13.99463,82.563,13.42432,82.563,12.44434Z" style="fill: #fff"/>
+				<path d="M84.66945,10.19482h.85547v.71533h.06641a1.348,1.348,0,0,1,1.34375-.80225,1.46456,1.46456,0,0,1,1.55859,1.6748v2.915H87.605V12.00586c0-.72363-.31445-1.0835-.97168-1.0835a1.03294,1.03294,0,0,0-1.0752,1.14111v2.63428h-.88867Z" style="fill: #fff"/>
+				<path d="M93.51516,9.07373v1.1416h.97559v.74854h-.97559V13.2793c0,.47168.19434.67822.63672.67822a2.96657,2.96657,0,0,0,.33887-.02051v.74023a2.9155,2.9155,0,0,1-.4834.04541c-.98828,0-1.38184-.34766-1.38184-1.21582v-2.543h-.71484v-.74854h.71484V9.07373Z" style="fill: #fff"/>
+				<path d="M95.70461,8.437h.88086v2.48145h.07031a1.3856,1.3856,0,0,1,1.373-.80664,1.48339,1.48339,0,0,1,1.55078,1.67871v2.90723H98.69v-2.688c0-.71924-.335-1.0835-.96289-1.0835a1.05194,1.05194,0,0,0-1.13379,1.1416v2.62988h-.88867Z" style="fill: #fff"/>
+				<path d="M104.76125,13.48193a1.828,1.828,0,0,1-1.95117,1.30273A2.04531,2.04531,0,0,1,100.73,12.46045a2.07685,2.07685,0,0,1,2.07617-2.35254c1.25293,0,2.00879.856,2.00879,2.27V12.688h-3.17969v.0498a1.1902,1.1902,0,0,0,1.19922,1.29,1.07934,1.07934,0,0,0,1.07129-.5459Zm-3.126-1.45117h2.27441a1.08647,1.08647,0,0,0-1.1084-1.1665A1.15162,1.15162,0,0,0,101.63527,12.03076Z" style="fill: #fff"/>
+			</g>
+		</g>
+	</g>
+</svg>
diff --git a/img/badge_fdroid.svg b/img/badge_fdroid.svg
new file mode 100644
index 00000000..6f98b41a
--- /dev/null
+++ b/img/badge_fdroid.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="646" height="250"><defs><linearGradient id="a"><stop offset="0" stop-color="#fff" stop-opacity=".098"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></linearGradient><radialGradient xlink:href="#a" id="b" cx="113" cy="-12.89" fx="113" fy="-12.89" r="59.662" gradientTransform="matrix(0 1.96105 -1.97781 0 254.507 78.763)" gradientUnits="userSpaceOnUse"/></defs><g transform="translate(-289 -312.362)"><rect style="marker:none" width="560" height="164" x="332" y="355.362" rx="20" ry="20" color="#000" overflow="visible" stroke="#a6a6a6" stroke-width="4"/><g fill="#fff"><path d="m 529.2627,398.81787 v -6.6817 h -5.49866 v -2.76599 h 8.83117 v 10.68072 q -1.94952,1.383 -4.29895,2.09949 -2.34942,0.69983 -5.01544,0.69983 -5.83191,0 -9.1311,-3.39917 -3.28253,-3.41583 -3.28253,-9.49768 0,-6.09851 3.28253,-9.49768 3.29919,-3.41583 9.1311,-3.41583 2.43274,0 4.61554,0.59985 2.19947,0.59985 4.04901,1.76623 v 3.58246 q -1.86621,-1.58294 -3.96569,-2.38275 -2.09949,-0.7998 -4.41559,-0.7998 -4.56555,0 -6.86499,2.54937 -2.28278,2.54938 -2.28278,7.59815 0,5.0321 2.28278,7.58148 2.29944,2.54938 6.86499,2.54938 1.78289,0 3.18255,-0.29993 1.39966,-0.31659 2.51606,-0.96643 z" /><path d="m 538.74371,377.48975 h 15.7295 v 2.83264 h -12.36365 v 7.36487 h 11.84711 v 2.83264 h -11.84711 v 9.01446 h 12.66357 v 2.83264 h -16.02942 z" /><path d="m 556.85596,377.48975 h 21.04486 v 2.83264 h -8.83118 V 402.367 h -3.38251 v -22.04461 h -8.83117 z" /><path d="m 591.99738,377.48975 h 3.36584 V 402.367 h -3.36584 z" /><path d="m 598.61243,377.48975 h 21.04486 v 2.83264 h -8.83118 V 402.367 h -3.38251 v -22.04461 h -8.83117 z" /><path d="m 643.85138,379.77252 q -3.66577,0 -5.83191,2.73267 -2.14947,2.73266 -2.14947,7.44818 0,4.69885 2.14947,7.43152 2.16614,2.73266 5.83191,2.73266 3.66577,0 5.79858,-2.73266 2.14948,-2.73267 2.14948,-7.43152 0,-4.71552 -2.14948,-7.44818 -2.13281,-2.73267 -5.79858,-2.73267 z m 0,-2.73266 q 5.23206,0 8.36462,3.5158 3.13257,3.49915 3.13257,9.39771 0,5.8819 -3.13257,9.3977 -3.13256,3.49915 -8.36462,3.49915 -5.24872,0 -8.39795,-3.49915 -3.13257,-3.49914 -3.13257,-9.3977 0,-5.89856 3.13257,-9.39771 3.14923,-3.5158 8.39795,-3.5158 z" /><path d="m 660.61395,377.48975 h 4.53223 l 11.03064,20.81158 v -20.81158 h 3.26587 V 402.367 h -4.53223 L 663.87982,381.55542 V 402.367 h -3.26587 z" /></g><g fill="#fff"><path d="m 510.81067,489.36099 v -8.11767 l 7.18994,-1.3916 v -48.47413 l -7.18994,-1.3916 v -8.16406 h 53.76221 v 18.5083 h -10.39063 l -0.60303,-8.07129 h -22.03369 v 18.60108 h 23.65723 v 10.43701 h -23.65723 v 18.55469 l 7.23633,1.3916 v 8.11767 z" /><path d="m 572.96887,465.70377 v -10.43702 h 26.16211 v 10.43702 z" /><path d="m 607.29504,489.36099 v -8.11767 l 7.28272,-1.53077 v -48.14941 l -7.28272,-1.57715 v -8.16406 h 7.28272 22.3584 q 9.04541,0 15.95703,4.26758 6.91162,4.22119 10.76172,11.73584 3.89648,7.46826 3.89648,17.16308 v 1.25245 q 0,9.60205 -3.8501,17.11669 -3.80371,7.46827 -10.66894,11.73584 -6.86524,4.26758 -15.91065,4.26758 z m 20.82764,-10.34424 h 8.30322 q 5.6128,0 9.50928,-2.92236 3.89649,-2.96875 5.9375,-8.11767 2.0874,-5.14893 2.0874,-11.73584 v -1.29883 q 0,-6.67969 -2.0874,-11.78223 -2.04101,-5.14893 -5.9375,-8.0249 -3.89648,-2.92237 -9.50928,-2.92237 h -8.30322 z" /><path d="m 674.78772,489.36099 v -8.11767 l 6.49414,-1.3916 v -31.12549 l -7.18994,-1.3916 v -8.16407 h 19.80713 l 0.51025,6.21582 0.0928,1.11328 q 1.85546,-4.08203 4.59228,-6.16943 2.73682,-2.0874 6.54053,-2.0874 1.20605,0 2.64404,0.23193 1.43799,0.18555 2.55127,0.51026 l -1.43799,12.47802 -6.72607,-0.37109 q -2.87598,-0.13916 -4.68506,0.97412 -1.7627,1.11328 -3.1543,3.20068 v 24.58497 l 6.49414,1.3916 v 8.11767 z" /><path d="m 737.87366,490.33511 q -7.42188,0 -12.75635,-3.24707 -5.33447,-3.24707 -8.16406,-8.99902 -2.82959,-5.79834 -2.82959,-13.31299 v -0.97412 q 0,-7.46826 2.82959,-13.22021 2.82959,-5.79834 8.11767,-9.04541 5.33448,-3.29346 12.70996,-3.29346 7.46827,0 12.75635,3.29346 5.28809,3.24707 8.11768,8.99902 2.82959,5.75195 2.82959,13.2666 v 0.97412 q 0,7.51465 -2.82959,13.31299 -2.82959,5.75195 -8.11768,8.99902 -5.28808,3.24707 -12.66357,3.24707 z m 0,-10.39062 q 3.52539,0 5.75195,-1.90186 2.22656,-1.90185 3.29346,-5.28808 1.06689,-3.43262 1.06689,-7.97852 v -0.97412 q 0,-4.45312 -1.06689,-7.83936 -1.0669,-3.43261 -3.33985,-5.33447 -2.22656,-1.94824 -5.79834,-1.94824 -3.479,0 -5.75195,1.94824 -2.27295,1.90186 -3.33984,5.33447 -1.02051,3.38624 -1.02051,7.83936 v 0.97412 q 0,4.5459 1.02051,7.97852 1.06689,3.43261 3.33984,5.33447 2.27295,1.85547 5.84473,1.85547 z" /><path d="m 767.09729,489.36099 v -8.11767 l 6.54053,-1.3916 v -31.12549 l -7.23633,-1.3916 v -8.16407 h 20.78125 v 40.68116 l 6.49414,1.3916 v 8.11767 z m 6.07666,-60.81299 v -11.55029 h 14.00879 V 428.548 Z" /><path d="m 817.47327,490.33511 q -5.98389,0 -10.29785,-3.06152 -4.26758,-3.10791 -6.54053,-8.62793 -2.27295,-5.56641 -2.27295,-12.98828 v -0.97412 q 0,-7.93213 2.27295,-13.86963 2.31933,-5.9375 6.58691,-9.23096 4.26758,-3.33984 10.20508,-3.33984 4.12842,0 7.23633,1.66992 3.10791,1.62354 5.38086,4.63867 v -17.99804 l -7.23633,-1.39161 v -8.16406 h 7.23633 13.54492 v 62.85401 l 6.49414,1.3916 v 8.11767 h -18.22998 l -1.02051,-6.12304 q -2.36572,3.479 -5.65918,5.28808 -3.24707,1.80908 -7.70019,1.80908 z m 4.03564,-10.52978 q 2.82959,0 4.96338,-1.20606 2.13379,-1.20605 3.57178,-3.479 v -21.2915 q -1.3916,-2.41211 -3.52539,-3.71094 -2.13379,-1.34522 -4.917,-1.34522 -3.38623,0 -5.5664,2.04102 -2.13379,1.99463 -3.1543,5.56641 -0.97412,3.57177 -0.97412,8.30322 v 0.97412 q 0,6.58691 2.22656,10.39062 2.22657,3.75733 7.37549,3.75733 z" /></g><g fill-rule="evenodd"><path d="M2.589 1006.862l4.25 5.5" fill="#8ab000" stroke="#769616" stroke-width="2.5" stroke-linecap="round" transform="matrix(-2.63159 0 0 2.63157 483.158 -2270.475)"/><path style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" d="M476.286 375.862c1.193.031 2.004.497 2.58 1.18-5.333 6.34-6.232 7.347-13.514 16.372-2.683 3.472-5.478 1.678-2.795-1.793l11.185-14.474c.602-.804 1.54-1.258 2.544-1.285z" color="#000" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible" fill="#fff" fill-opacity=".298"/><path style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" d="M478.89 377.075c.325.39 1.476 2.118.058 4.096l-11.184 14.473c-2.683 3.471-3.026-1.611-3.026-1.611s9.828-11.869 14.151-16.958z" color="#000" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible" fill="#263238" fill-opacity=".2"/><path style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" d="M477.006 376.48c1.153 0 2.525.373 2.169 2.102-.273 1.32-12.266 15.985-12.266 15.985-2.683 3.47-6.562 1.78-3.879-1.691l11.143-14.402c.685-.763 1.602-1.957 2.833-1.994z" color="#000" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible" fill="#8ab000"/></g><g fill-rule="evenodd"><path d="M2.589 1006.862l4.25 5.5" fill="#8ab000" stroke="#769616" stroke-width="2.5" stroke-linecap="round" transform="matrix(2.63159 0 0 2.63157 356.842 -2270.475)"/><path d="M363.714 375.862c-1.193.031-2.004.497-2.58 1.18 5.333 6.34 6.232 7.347 13.514 16.372 2.683 3.472 5.478 1.678 2.795-1.793l-11.185-14.474c-.602-.804-1.54-1.258-2.544-1.285z" style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" color="#000" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible" fill="#fff" fill-opacity=".298"/><path d="M361.11 377.075c-.325.39-1.476 2.118-.058 4.096l11.184 14.473c2.683 3.471 3.026-1.611 3.026-1.611s-9.828-11.869-14.151-16.958z" style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" color="#000" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible" fill="#263238" fill-opacity=".2"/><path d="M362.995 376.48c-1.153 0-2.526.373-2.17 2.102.273 1.32 12.266 15.985 12.266 15.985 2.683 3.47 6.562 1.78 3.879-1.691l-11.143-14.402c-.685-.763-1.602-1.957-2.832-1.994z" style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" color="#000" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible" fill="#8ab000"/></g><g transform="matrix(2.63159 0 0 2.63157 467.369 -2270.475)"><rect ry="3" rx="3" y="1010.36" x="-37" height="12.92" width="38" fill="#aeea00"/><rect width="38" height="10" x="-37" y="1013.279" rx="3" ry="3" fill="#263238" fill-opacity=".2"/><rect width="38" height="10" x="-37" y="1010.362" rx="3" ry="3" fill="#fff" fill-opacity=".298"/><rect width="38" height="10.641" x="-37" y="1011.5" rx="3" ry="2.456" fill="#aeea00"/></g><g transform="matrix(2.63159 0 0 2.63157 356.842 -2270.745)"><rect ry="3" rx="3" y="1024.522" x="5" height="25.84" width="38" fill="#1976d2"/><rect width="38" height="13" x="5" y="1037.362" rx="3" ry="3" fill="#263238" fill-opacity=".2"/><rect width="38" height="13" x="5" y="1024.442" rx="3" ry="3" fill="#fff" fill-opacity=".2"/><rect width="38" height="23.56" x="5" y="1025.662" rx="3" ry="2.718" fill="#1976d2"/></g><g transform="matrix(2.63159 0 0 2.63157 356.842 396.264)"><path d="M24 17.75c-2.88 0-5.32 1.985-6.033 4.65h3.213A3.215 3.215 0 0 1 24 20.75 3.228 3.228 0 0 1 27.25 24 3.228 3.228 0 0 1 24 27.25a3.219 3.219 0 0 1-2.93-1.85h-3.154c.642 2.766 3.132 4.85 6.084 4.85 3.434 0 6.25-2.816 6.25-6.25s-2.816-6.25-6.25-6.25z" style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" color="#000" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible" fill="#0d47a1"/><circle r="9.55" cy="24" cx="24" fill="none" stroke="#0d47a1" stroke-width="1.9" stroke-linecap="round"/></g><g transform="matrix(2.63159 0 0 2.63157 356.842 -2269.159)"><ellipse ry="3.875" rx="3.375" cx="14.375" cy="1016.487" fill="#263238" fill-opacity=".2"/><circle r="3.375" cy="1016.987" cx="14.375" fill="#fff"/></g><g transform="matrix(2.63159 0 0 2.63157 408.158 -2269.159)"><ellipse cy="1016.487" cx="14.375" rx="3.375" ry="3.875" fill="#263238" fill-opacity=".2"/><circle cx="14.375" cy="1016.987" r="3.375" fill="#fff"/></g><path d="M282.715 299.835a3.29 3.29 0 0 0-2.662 5.336l9.474 12.261a7.894 7.894 0 0 0-.527 2.825v18.21a7.877 7.877 0 0 0 7.895 7.895h84.21a7.877 7.877 0 0 0 7.895-7.894v-18.211c0-.999-.19-1.949-.525-2.826l9.472-12.26a3.29 3.29 0 0 0-2.433-5.334 3.29 3.29 0 0 0-2.772 1.31l-9.013 11.666a7.91 7.91 0 0 0-2.624-.45h-84.21c-.922 0-1.8.163-2.622.45l-9.015-11.666a3.29 3.29 0 0 0-2.543-1.312zm14.18 49.527a7.877 7.877 0 0 0-7.895 7.895v52.21a7.877 7.877 0 0 0 7.895 7.895h84.21a7.877 7.877 0 0 0 7.895-7.894v-52.211a7.877 7.877 0 0 0-7.895-7.895h-84.21z" style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" color="#000" font-weight="400" font-family="sans-serif" white-space="normal" overflow="visible" fill="url(#b)" fill-rule="evenodd" transform="translate(81 76)"/></g></svg>
\ No newline at end of file
diff --git a/img/badge_playstore.svg b/img/badge_playstore.svg
new file mode 100644
index 00000000..a01a8d87
--- /dev/null
+++ b/img/badge_playstore.svg
@@ -0,0 +1,113 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 23.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
+	<!ENTITY ns_extend "http://ns.adobe.com/Extensibility/1.0/">
+	<!ENTITY ns_ai "http://ns.adobe.com/AdobeIllustrator/10.0/">
+	<!ENTITY ns_graphs "http://ns.adobe.com/Graphs/1.0/">
+	<!ENTITY ns_vars "http://ns.adobe.com/Variables/1.0/">
+	<!ENTITY ns_imrep "http://ns.adobe.com/ImageReplacement/1.0/">
+	<!ENTITY ns_sfw "http://ns.adobe.com/SaveForWeb/1.0/">
+	<!ENTITY ns_custom "http://ns.adobe.com/GenericCustomNamespace/1.0/">
+	<!ENTITY ns_adobe_xpath "http://ns.adobe.com/XPath/1.0/">
+]>
+<svg version="1.1" id="Livello_1" xmlns:x="&ns_extend;" xmlns:i="&ns_ai;" xmlns:graph="&ns_graphs;"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 5435.8 1604"
+	 style="enable-background:new 0 0 5435.8 1604;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill-rule:evenodd;clip-rule:evenodd;}
+	.st1{fill-rule:evenodd;clip-rule:evenodd;fill:#A6A6A6;}
+	.st2{fill:#FFFFFF;}
+	.st3{fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;}
+	.st4{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_1_);}
+	.st5{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_2_);}
+	.st6{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_3_);}
+	.st7{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_4_);}
+	.st8{opacity:0.2;fill-rule:evenodd;clip-rule:evenodd;enable-background:new    ;}
+	.st9{opacity:0.12;fill-rule:evenodd;clip-rule:evenodd;enable-background:new    ;}
+	.st10{opacity:0.25;fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;enable-background:new    ;}
+</style>
+<metadata>
+	<sfw  xmlns="&ns_sfw;">
+		<slices></slices>
+		<sliceSourceBounds  bottomLeftOrigin="true" height="1604" width="5435.8" x="-2656.9" y="-784"></sliceSourceBounds>
+	</sfw>
+</metadata>
+<path class="st0" d="M5234.4,1604h-5033C90.4,1604,0,1513.6,0,1403.5v-1203C0,90,90.4,0,201.4,0h5033c110.9,0,201.4,90,201.4,200.5
+	v1203C5435.8,1513.6,5345.3,1604,5234.4,1604z"/>
+<path class="st1" d="M5234.4,32.1c93.1,0,169.3,75.7,169.3,168.4v1203c0,92.7-75.7,168.4-169.3,168.4h-5033
+	c-93.1,0-169.3-75.7-169.3-168.4v-1203c0-92.7,75.7-168.4,169.3-168.4C201.4,32.1,5234.4,32.1,5234.4,32.1z M5234.4,0h-5033
+	C90.4,0,0,90.4,0,200.5v1203C0,1514,90.4,1604,201.4,1604h5033c110.9,0,201.4-90,201.4-200.5v-1203C5435.8,90.4,5345.3,0,5234.4,0z"
+	/>
+<path class="st2" d="M2863.6,530.6c-36.3,0-66.9-12.7-91.1-37.7c-24-24.3-37.4-57.8-36.8-92c0-36.5,12.4-67.4,36.8-91.9
+	c24.1-25,54.7-37.7,91-37.7c35.9,0,66.5,12.7,91.1,37.7c24.4,25.3,36.8,56.2,36.8,91.9c-0.4,36.6-12.8,67.5-36.8,91.9
+	C2930.5,518,2899.9,530.6,2863.6,530.6z M1783.5,530.6c-35.5,0-66.3-12.5-91.5-37.2c-25-24.6-37.7-55.7-37.7-92.4
+	s12.7-67.8,37.7-92.4c24.7-24.7,55.5-37.2,91.5-37.2c17.6,0,34.7,3.5,51.1,10.6c16.1,6.9,29.2,16.3,38.9,27.8l2.4,2.9l-27.1,26.6
+	l-2.8-3.3c-15.3-18.2-35.8-27.1-62.9-27.1c-24.2,0-45.3,8.6-62.7,25.6c-17.5,17.1-26.4,39.5-26.4,66.6s8.9,49.5,26.4,66.6
+	c17.4,17,38.5,25.6,62.7,25.6c25.8,0,47.5-8.6,64.4-25.6c10-10,16.2-24,18.4-41.7h-86.9v-37.4h124.2l0.5,3.4
+	c0.9,6.3,1.8,12.8,1.8,18.8c0,34.5-10.4,62.4-31,83C1851.1,518.2,1820.5,530.6,1783.5,530.6z M3219.6,525.3h-38.3L3064,337.6l1,33.8
+	v153.8h-38.3V276.7h43.7l1.2,1.9l110.3,176.8l-1-33.7V276.7h38.7V525.3z M2575.8,525.3H2537V314.1h-67.3v-37.4H2643v37.4h-67.3
+	V525.3z M2438.1,525.3h-38.7V276.7h38.7V525.3z M2220.6,525.3h-38.7V314.1h-67.3v-37.4h173.3v37.4h-67.3V525.3z M2090.1,524.9
+	h-148.4V276.7h148.4v37.4h-109.6v68.2h98.9v37h-98.9v68.2h109.6V524.9z M2800.9,467.2c17.3,17.3,38.3,26,62.7,26
+	c25.1,0,45.6-8.5,62.7-26c17-17,25.6-39.3,25.6-66.2s-8.6-49.3-25.5-66.2c-17.3-17.3-38.4-26-62.7-26c-25.1,0-45.6,8.5-62.6,26
+	c-17,17-25.6,39.3-25.6,66.2S2784,450.3,2800.9,467.2L2800.9,467.2z"/>
+<path class="st3" d="M2732.1,872.4c-94.5,0-171.1,71.7-171.1,170.6c0,98,77.1,170.6,171.1,170.6c94.5,0,171.1-72.2,171.1-170.6
+	C2903.2,944.1,2826.6,872.4,2732.1,872.4z M2732.1,1146c-51.7,0-96.2-42.8-96.2-103.4c0-61.5,44.6-103.4,96.2-103.4
+	c51.7,0,96.2,41.9,96.2,103.4C2828.4,1103.6,2783.8,1146,2732.1,1146z M2358.8,872.4c-94.5,0-171.1,71.7-171.1,170.6
+	c0,98,77.1,170.6,171.1,170.6c94.5,0,171.1-72.2,171.1-170.6C2529.9,944.1,2453.2,872.4,2358.8,872.4z M2358.8,1146
+	c-51.7,0-96.2-42.8-96.2-103.4c0-61.5,44.6-103.4,96.2-103.4c51.7,0,96.2,41.9,96.2,103.4C2455,1103.6,2410.5,1146,2358.8,1146z
+	 M1914.6,924.5v72.2h173.3c-5.3,40.5-18.7,70.4-39.2,90.9c-25.4,25.4-64.6,53-133.7,53c-106.5,0-189.8-86-189.8-192.5
+	s83.3-192.5,189.8-192.5c57.5,0,99.4,22.7,130.5,51.7l51.2-51.2c-43.2-41.4-100.7-73.1-181.3-73.1c-146.1,0-268.7,119-268.7,264.7
+	c0,146.1,122.5,264.7,268.7,264.7c78.9,0,138.1-25.8,184.9-74.4c47.7-47.7,62.8-115,62.8-169.3c0-16.9-1.3-32.1-4-45h-244.6
+	C1914.6,923.6,1914.6,924.5,1914.6,924.5z M3731.5,980.7c-14.3-38.3-57.5-108.7-146.1-108.7c-87.8,0-160.8,69.1-160.8,170.6
+	c0,95.8,72.2,170.6,169.3,170.6c78,0,123.4-47.7,142.1-75.7l-57.9-38.8c-19.2,28.5-45.9,47.2-83.8,47.2c-38.3,0-65.1-17.4-82.9-51.7
+	l228.1-94.5C3739.5,999.8,3731.5,980.7,3731.5,980.7z M3498.9,1037.7c-1.8-65.9,51.2-99.4,89.1-99.4c29.9,0,54.8,14.7,63.3,36.1
+	L3498.9,1037.7z M3313.6,1203h74.9V701.8h-74.9V1203z M3190.6,910.3h-2.7c-16.9-20.1-49-38.3-90-38.3
+	c-85.1,0-163.5,74.9-163.5,171.1c0,95.8,78,169.8,163.5,169.8c40.5,0,73.1-18.3,90-38.8h2.7v24.5c0,65.1-34.8,100.2-90.9,100.2
+	c-45.9,0-74.4-33-86-60.6l-65.1,27.2c18.7,45,68.6,100.7,151,100.7c87.8,0,162.2-51.7,162.2-177.8V882.2h-70.8v28.1
+	C3191.1,910.3,3190.6,910.3,3190.6,910.3z M3104.6,1146c-51.7,0-94.9-43.2-94.9-102.9c0-60.2,43.2-103.8,94.9-103.8
+	c51.2,0,90.9,44.1,90.9,103.8C3196,1102.8,3155.9,1146,3104.6,1146z M4082.2,701.8h-179.1V1203h74.9v-189.8h104.3
+	c82.9,0,164.4-60.1,164.4-155.5S4165.5,701.8,4082.2,701.8z M4084.4,943.2h-106.5v-172h106.5c56.1,0,87.8,46.3,87.8,86
+	C4172.2,896.5,4140.1,943.2,4084.4,943.2z M4546.9,871.5c-54.4,0-110.5,24.1-133.7,76.6l66.4,27.6c14.3-27.6,40.5-37,68.2-37
+	c38.8,0,78,23.2,78.9,64.6v5.3c-13.4-7.6-42.8-19.2-78-19.2c-71.7,0-144.4,39.2-144.4,112.7c0,67.3,58.8,110.5,124.3,110.5
+	c50.3,0,78-22.7,95.3-49h2.7v38.8h72.2v-192C4698.8,921,4632.4,871.5,4546.9,871.5z M4537.5,1146c-24.5,0-58.8-12-58.8-42.8
+	c0-38.8,42.8-53.5,79.3-53.5c33,0,48.6,7.1,68.2,16.9C4620.8,1111.6,4582.8,1145.6,4537.5,1146z M4962.2,882.2l-86,217.4h-2.7
+	l-89.1-217.4h-80.6l133.7,303.9l-76.2,168.9h78L5045,882.2C5045,882.2,4962.2,882.2,4962.2,882.2z M4288,1203h74.9V701.8H4288V1203z
+	"/>
+<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="1682.1077" y1="1339.4783" x2="1624.2924" y2="1309.6345" gradientTransform="matrix(11.64 0 0 -22.55 -18705.5957 30554.3691)">
+	<stop  offset="0" style="stop-color:#00A0FF"/>
+	<stop  offset="6.569999e-03" style="stop-color:#00A1FF"/>
+	<stop  offset="0.2601" style="stop-color:#00BEFF"/>
+	<stop  offset="0.5122" style="stop-color:#00D2FF"/>
+	<stop  offset="0.7604" style="stop-color:#00DFFF"/>
+	<stop  offset="1" style="stop-color:#00E3FF"/>
+</linearGradient>
+<path class="st4" d="M418.4,302.1c-11.6,12.5-18.3,31.6-18.3,56.6v886.7c0,25,6.7,44.1,18.7,56.1l3.1,2.7l496.8-496.8v-11.1
+	L421.5,299.4C421.5,299.4,418.4,302.1,418.4,302.1z"/>
+<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="1712.6624" y1="1274.8376" x2="1606.5613" y2="1274.8376" gradientTransform="matrix(9.145 0 0 -7.7 -14305.5381 10618.251)">
+	<stop  offset="0" style="stop-color:#FFE000"/>
+	<stop  offset="0.4087" style="stop-color:#FFBD00"/>
+	<stop  offset="0.7754" style="stop-color:#FFA500"/>
+	<stop  offset="1" style="stop-color:#FF9C00"/>
+</linearGradient>
+<path class="st5" d="M1084,973.5L918.3,807.8v-11.6L1084,630.5l3.6,2.2l196,111.4c56.1,31.6,56.1,83.8,0,115.8l-196,111.4
+	C1087.6,971.3,1084,973.5,1084,973.5z"/>
+<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="1707.4414" y1="1290.0475" x2="1646.682" y2="1211.2225" gradientTransform="matrix(15.02 0 0 -11.5775 -24650.2285 15829.6484)">
+	<stop  offset="0" style="stop-color:#FF3A44"/>
+	<stop  offset="1" style="stop-color:#C31162"/>
+</linearGradient>
+<path class="st6" d="M1087.6,971.3L918.3,802l-499.9,499.9c18.3,19.6,49,21.8,83.3,2.7L1087.6,971.3"/>
+<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="1660.6357" y1="1365.6676" x2="1687.767" y2="1330.4501" gradientTransform="matrix(15.02 0 0 -11.5715 -24650.2285 15809.9922)">
+	<stop  offset="0" style="stop-color:#32A071"/>
+	<stop  offset="6.850000e-02" style="stop-color:#2DA771"/>
+	<stop  offset="0.4762" style="stop-color:#15CF74"/>
+	<stop  offset="0.8009" style="stop-color:#06E775"/>
+	<stop  offset="1" style="stop-color:#00F076"/>
+</linearGradient>
+<path class="st7" d="M1087.6,632.7L501.7,299.9c-34.3-19.6-65.1-16.9-83.3,2.7L918.3,802L1087.6,632.7z"/>
+<path class="st8" d="M1084,967.7l-581.9,330.6c-32.5,18.7-61.5,17.4-80.2,0.4l-3.1,3.1l3.1,2.7c18.7,16.9,47.7,18.3,80.2-0.4
+	L1088,971.3C1088,971.3,1084,967.7,1084,967.7z"/>
+<path class="st9" d="M1283.6,854.1l-200.1,113.6l3.6,3.6l196-111.4c28.1-16,41.9-37,41.9-57.9C1323.3,821.2,1309,839.4,1283.6,854.1
+	z"/>
+<path class="st10" d="M501.7,305.7l781.9,444.2c25.4,14.3,39.7,33,41.9,52.1c0-20.9-13.8-41.9-41.9-57.9L501.7,299.9
+	c-56.1-32.1-101.6-5.3-101.6,58.8v5.8C400.1,300.3,445.6,274,501.7,305.7z"/>
+</svg>
diff --git a/lib/Controller/NotesController.php b/lib/Controller/NotesController.php
index 15460398..36635a2d 100644
--- a/lib/Controller/NotesController.php
+++ b/lib/Controller/NotesController.php
@@ -149,9 +149,12 @@ class NotesController extends Controller {
 	/**
 	 * @NoAdminRequired
 	 */
-	public function create(string $category) : JSONResponse {
-		return $this->helper->handleErrorResponse(function () use ($category) {
-			$note = $this->notesService->create($this->helper->getUID(), '', $category);
+	public function create(string $category = '', string $content = '', string $title = '') : JSONResponse {
+		return $this->helper->handleErrorResponse(function () use ($category, $content, $title) {
+			$note = $this->notesService->create($this->helper->getUID(), $title, $category);
+			if ($content) {
+				$note->setContent($content);
+			}
 			return $this->helper->getNoteData($note);
 		});
 	}
diff --git a/src/App.vue b/src/App.vue
index 656e9d25..d36b2616 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -16,6 +16,14 @@
 					@category-selected="onSelectCategory"
 					@note-deleted="onNoteDeleted"
 				/>
+				<NcAppNavigationItem
+					:title="t('notes', 'Help')"
+					:pinned="true"
+					@click.prevent="openHelp"
+				>
+					<InfoIcon slot="icon" :size="20" />
+				</NcAppNavigationItem>
+				<AppHelp :open.sync="helpVisible" />
 			</template>
 
 			<template #footer>
@@ -41,28 +49,35 @@ import {
 	NcAppContent,
 	NcAppNavigation,
 	NcAppNavigationNew,
+	NcAppNavigationItem,
 	NcContent,
 } from '@nextcloud/vue'
 import { showSuccess, TOAST_UNDO_TIMEOUT, TOAST_PERMANENT_TIMEOUT } from '@nextcloud/dialogs'
 import '@nextcloud/dialogs/styles/toast.scss'
 
+import InfoIcon from 'vue-material-design-icons/Information.vue'
 import PlusIcon from 'vue-material-design-icons/Plus.vue'
 
-import { config } from './config.js'
-import { fetchNotes, noteExists, createNote, undoDeleteNote } from './NotesService.js'
 import AppSettings from './components/AppSettings.vue'
 import NavigationList from './components/NavigationList.vue'
+import AppHelp from './components/AppHelp.vue'
+
+import { config } from './config.js'
+import { fetchNotes, noteExists, createNote, undoDeleteNote } from './NotesService.js'
 import store from './store.js'
 
 export default {
 	name: 'App',
 
 	components: {
+		AppHelp,
 		AppSettings,
+		InfoIcon,
 		NavigationList,
 		NcAppContent,
 		NcAppNavigation,
 		NcAppNavigationNew,
+		NcAppNavigationItem,
 		NcContent,
 		PlusIcon,
 	},
@@ -81,6 +96,7 @@ export default {
 			undoTimer: null,
 			deletedNotes: [],
 			refreshTimer: null,
+			helpVisible: false,
 		}
 	},
 
@@ -227,6 +243,10 @@ export default {
 			}
 		},
 
+		openHelp() {
+			this.helpVisible = true
+		},
+
 		onNewNote() {
 			if (this.loading.create) {
 				return
diff --git a/src/NotesService.js b/src/NotesService.js
index 04c6a58f..0e927da5 100644
--- a/src/NotesService.js
+++ b/src/NotesService.js
@@ -177,9 +177,13 @@ export const setTitle = (noteId, title) => {
 		})
 }
 
-export const createNote = category => {
+export const createNote = (category, title, content) => {
 	return axios
-		.post(url('/notes'), { category: category || '' })
+		.post(url('/notes'), {
+			category: category || '',
+			content: content || '',
+			title: title || '',
+		})
 		.then(response => {
 			_updateLocalNote(response.data)
 			return response.data
diff --git a/src/Util.js b/src/Util.js
index c8c58c2c..f95098cc 100644
--- a/src/Util.js
+++ b/src/Util.js
@@ -27,3 +27,37 @@ export const categoryLabel = (category) => {
 export const routeIsNewNote = ($route) => {
 	return {}.hasOwnProperty.call($route.query, 'new')
 }
+
+export const getDefaultSampleNoteTitle = () => {
+	return t('notes', 'Sample note')
+}
+
+export const getDefaultSampleNote = () => {
+	return '# ' + getDefaultSampleNoteTitle() + `
+
+* 📅 ` + t('notes', '15 January 2021, via Nextcloud Notes') + `
+* 👥 ` + t('notes', 'Me, you, and all our friends!') + `
+
+## ` + t('notes', 'Tasks') + ` ✅
+
+* [ ] ` + t('notes', 'Write nice todo lists') + `
+* [ ] ` + t('notes', 'Buy Fries') + `
+* [ ] …
+
+## ` + t('notes', 'Birthdays') + `
+
+* ` + t('notes', 'Jen, in three days!') + `
+* ` + t('notes', 'Moss, 21.03.1973') + `
+* ` + t('notes', 'Roy, 1979') + `
+
+## ` + t('notes', 'Review Steps') + ` 🔁
+
+1. ` + t('notes', 'Turn PC off') + `
+2. ` + t('notes', 'Turn PC on') + `
+3. ` + t('notes', 'Then call IT') + `
+
+## ` + t('notes', 'Quotes') + ` 💬
+
+> ` + t('notes', 'Nextcloud, a safe home for all your data') + `
+`
+}
diff --git a/src/components/AppHelp.vue b/src/components/AppHelp.vue
new file mode 100644
index 00000000..868b0c7d
--- /dev/null
+++ b/src/components/AppHelp.vue
@@ -0,0 +1,188 @@
+<template>
+	<div>
+		<NcAppSettingsDialog
+			:title="t('notes', 'Help')"
+			:show-navigation="true"
+			:open="helpOpen"
+			@update:open="setHelpOpen($event)"
+		>
+			<NcAppSettingsSection id="help-basics" :title="t('notes', 'Basics')">
+				<div class="feature icon-add">
+					{{ t('notes', 'Start writing a note by clicking on “{newnote}” in the app navigation.', { newnote: t('notes', 'New note') }) }}
+				</div>
+				<div class="feature icon-fullscreen">
+					{{ t('notes', 'Write down your thoughts without any distractions.') }}
+				</div>
+				<div class="feature icon-files-dark">
+					{{ t('notes', 'Organize your notes in categories.') }}
+				</div>
+			</NcAppSettingsSection>
+			<NcAppSettingsSection id="help-markdown" :title="t('notes', 'Markdown')">
+				<div class="feature icon-toggle-filelist">
+					{{ t('notes', 'Use Markdown markups to style your text.') }}
+				</div>
+				<p>
+					<CreateSampleButton @click="setHelpOpen(false)" />
+				</p>
+				<br>
+				<table class="notes-help">
+					<tr>
+						<th>
+							{{ t('notes', 'Sequence') }}
+						</th>
+						<th>
+							{{ t('notes', 'Result') }}
+						</th>
+						<th>
+							{{ t('notes', 'Visualized') }}
+						</th>
+					</tr>
+					<tr v-for="(item, index) in formatting" :key="index">
+						<!-- eslint-disable-next-line vue/no-v-html -->
+						<td v-html="item.sequence" />
+						<td>
+							{{ item.result }}
+						</td>
+						<!-- eslint-disable-next-line vue/no-v-html -->
+						<td v-html="item.visualized" />
+					</tr>
+				</table>
+			</NcAppSettingsSection>
+			<NcAppSettingsSection id="help-shortcuts" :title="t('notes', 'Shortcuts')">
+				<div class="feature icon-toggle-filelist">
+					{{ t('notes', 'Use shortcuts to quickly navigate this app.') }}
+				</div>
+				<table class="notes-help">
+					<tr>
+						<th>{{ t('notes', 'Shortcut') }}</th>
+						<th>{{ t('notes', 'Action') }}</th>
+					</tr>
+					<tr v-for="(item, index) in shortcuts" :key="index">
+						<td>{{ item.shortcut }}</td>
+						<td>{{ item.action }}</td>
+					</tr>
+				</table>
+			</NcAppSettingsSection>
+			<NcAppSettingsSection id="help-apps" :title="t('notes', 'Mobile apps')">
+				<HelpMobile />
+			</NcAppSettingsSection>
+		</NcAppSettingsDialog>
+	</div>
+</template>
+
+<script>
+
+import {
+	NcAppSettingsDialog,
+	NcAppSettingsSection,
+} from '@nextcloud/vue'
+
+import CreateSampleButton from './CreateSampleButton.vue'
+import HelpMobile from './HelpMobile.vue'
+
+export default {
+	name: 'AppHelp',
+
+	components: {
+		CreateSampleButton,
+		HelpMobile,
+		NcAppSettingsDialog,
+		NcAppSettingsSection,
+	},
+
+	props: {
+		open: Boolean,
+	},
+
+	data() {
+		return {
+			helpOpen: this.open,
+			shortcuts: [
+				{ shortcut: t('notes', 'CTRL') + '+B', action: t('notes', 'Make the selection bold') },
+				{ shortcut: t('notes', 'CTRL') + '+I', action: t('notes', 'Make the selection italic') },
+				{ shortcut: t('notes', 'CTRL') + '+\'', action: t('notes', 'Wrap the selection in quotes') },
+				{ shortcut: t('notes', 'CTRL') + '+' + t('notes', 'ALT') + '+C', action: t('notes', 'The selection will be turned into monospace') },
+				{ shortcut: t('notes', 'CTRL') + '+E', action: t('notes', 'Remove any styles from the selected text') },
+				{ shortcut: t('notes', 'CTRL') + '+L', action: t('notes', 'Makes the current line a list element') },
+				{ shortcut: t('notes', 'CTRL') + '+' + t('notes', 'ALT') + '+L', action: t('notes', 'Makes the current line a list element with a number') },
+				{ shortcut: t('notes', 'CTRL') + '+H', action: t('notes', 'Toggle heading for current line') },
+				{ shortcut: t('notes', 'CTRL') + '+' + t('notes', 'SHIFT') + '+H', action: t('notes', 'Set the current line as a big heading') },
+				{ shortcut: t('notes', 'CTRL') + '+K', action: t('notes', 'Insert link') },
+				{ shortcut: t('notes', 'CTRL') + '+' + t('notes', 'ALT') + '+I', action: t('notes', 'Insert image') },
+				{ shortcut: t('notes', 'CTRL') + '+/', action: t('notes', 'Switch between editor and viewer') },
+			],
+			formatting: [
+				{ sequence: '**' + t('notes', 'bold') + '**', result: t('notes', 'bold'), visualized: '<b>' + t('notes', 'bold') + '</b>' },
+				{ sequence: '*' + t('notes', 'italic') + '*', result: t('notes', 'italic'), visualized: '<em>' + t('notes', 'italic') + '</em>' },
+				{ sequence: '~~' + t('notes', 'strikethrough') + '~~', result: t('notes', 'strikethrough'), visualized: '<s>' + t('notes', 'strikethrough') + '</s>' },
+
+				{ sequence: '# ' + t('notes', 'Big header'), result: t('notes', 'Big header'), visualized: '<h2>' + t('notes', 'Big header') + '</h2>' },
+				{ sequence: '## ' + t('notes', 'Medium header'), result: t('notes', 'Medium header'), visualized: '<b><h3>' + t('notes', 'Medium header') + '</h3></b>' },
+				{ sequence: '### ' + t('notes', 'Small header'), result: t('notes', 'Small header'), visualized: '<h3>' + t('notes', 'Small header') + '</h3>' },
+				{ sequence: '#### ' + t('notes', 'Tiny header'), result: t('notes', 'Tiny header'), visualized: '<h4>' + t('notes', 'Tiny header') + '</h4>' },
+
+				{ sequence: '* ' + t('notes', 'Generic list item'), result: t('notes', 'Generic list'), visualized: '<li>' + t('notes', 'Generic list item') + '</li>' },
+				{ sequence: '- ' + t('notes', 'Generic list item'), result: t('notes', 'Generic list'), visualized: '<li>' + t('notes', 'Generic list item') + '</li>' },
+
+				{
+					sequence: '1. William Riker<br>2. Deanna Troi<br>3. Beverly Crusher<br>',
+					result: t('notes', 'Numbered list'),
+					visualized: '<ol><li>William Riker</li><li>Deanna Troi</li><li>Beverly Crusher</li></ol>',
+				},
+
+				{ sequence: '[' + t('notes', 'Link title') + '](http://www.example.com)', result: t('notes', 'link'), visualized: '<a href="http://www.example.com">' + t('notes', 'Link title') + '</a>' },
+				{ sequence: '![' + t('notes', 'Image title') + '](http://www.example.com/image.jpg)', result: t('notes', 'image'), visualized: '<img src="http://www.example.com" alt="' + t('notes', 'Image title') + '" />' },
+				{ sequence: '> ' + t('notes', 'This is a quote.'), result: t('notes', 'quote'), visualized: '<blockquote>' + t('notes', 'This is a quote.') + '</blockquote>' },
+
+				{ sequence: '`' + t('notes', 'code') + '`', result: t('notes', 'code'), visualized: '<code>' + t('notes', 'code') + '</code>' },
+				{ sequence: '```<br>' + t('notes', 'Multi line block code') + '<br>```', result: t('notes', 'Multi line block code'), visualized: '<pre>' + t('notes', 'Multi line block code') + '</pre>' },
+			],
+		}
+	},
+
+	watch: {
+		open(newValue) {
+			this.helpOpen = newValue
+		},
+	},
+
+	methods: {
+		setHelpOpen(newValue) {
+			this.helpOpen = newValue
+			this.$emit('update:open', newValue)
+		},
+	},
+}
+</script>
+
+<style scoped>
+
+table.notes-help {
+	width: 70%;
+	border: 1px lightgray solid;
+	border-spacing: 0;
+
+	border-collapse:separate;
+	border-radius:6px;
+}
+
+table.notes-help th {
+	font-style: oblique;
+	font-weight: bold;
+	border-top: none;
+}
+
+table.notes-help th, table.notes-help td {
+	padding: 5px;
+	border-left: 1px lightgray solid;
+}
+
+table.notes-help td:first-child, table.notes-help th:first-child {
+	border-left: none;
+}
+
+table.notes-help tr:nth-child(even) {
+	background-color: #eeeeee;
+}
+
+</style>
diff --git a/src/components/CreateSampleButton.vue b/src/components/CreateSampleButton.vue
new file mode 100644
index 00000000..046b98fa
--- /dev/null
+++ b/src/components/CreateSampleButton.vue
@@ -0,0 +1,38 @@
+<template>
+	<NcButton type="secondary" @click="onNewNote">
+		<PlusIcon slot="icon" :size="20" />
+		{{ t('notes', 'Create a sample note with markdown') }}
+	</NcButton>
+</template>
+<script>
+
+import {
+	NcButton,
+} from '@nextcloud/vue'
+
+import PlusIcon from 'vue-material-design-icons/Plus.vue'
+
+import { createNote } from '../NotesService.js'
+import { getDefaultSampleNote, getDefaultSampleNoteTitle } from '../Util.js'
+
+export default {
+	components: {
+		NcButton,
+		PlusIcon,
+	},
+
+	methods: {
+		onNewNote() {
+			this.$emit('click')
+			createNote('', getDefaultSampleNoteTitle(), getDefaultSampleNote())
+				.then(note => {
+					this.$router.push({
+						name: 'note',
+						params: { noteId: note.id.toString() },
+					})
+				})
+		},
+	},
+}
+
+</script>
diff --git a/src/components/HelpMobile.vue b/src/components/HelpMobile.vue
new file mode 100644
index 00000000..79d015c1
--- /dev/null
+++ b/src/components/HelpMobile.vue
@@ -0,0 +1,77 @@
+<template>
+	<Fragment>
+		<div class="feature icon-phone">
+			{{ t('notes', 'Install the app for your mobile phone in order to access your notes from everywhere.') }}
+		</div>
+		<div class="badge-wrapper">
+			<a target="_blank" href="https://github.com/stefan-niedermann/nextcloud-notes">
+				{{ t('notes', 'Android app: {notes} by {company}', {notes: 'Nextcloud Notes', company: 'Niedermann IT-Dienstleistungen'}) }}
+			</a>
+			<div>
+				<div class="badge">
+					<a target="_blank" href="https://play.google.com/store/apps/details?id=it.niedermann.owncloud.notes">
+						<img :src="getRoute('badge_playstore.svg')" class="appstore-badge badge-playstore-fix">
+					</a>
+				</div>
+				<div class="badge">
+					<a target="_blank" href="https://f-droid.org/repository/browse/?fdid=it.niedermann.owncloud.notes">
+						<img :src="getRoute('badge_fdroid.svg')" class="appstore-badge">
+					</a>
+				</div>
+			</div>
+		</div>
+		<div class="badge-wrapper">
+			<a target="_blank" href="https://github.com/phedlund/CloudNotes">
+				{{ t('notes', 'iOS app: {notes} by {company}', {notes: 'CloudNotes - Nextcloud Notes', company: 'Peter Hedlund'}) }}
+			</a>
+			<div>
+				<div class="badge">
+					<a target="_blank" href="https://apps.apple.com/app/cloudnotes-owncloud-notes/id813973264">
+						<img :src="getRoute('badge_applestore.svg')" class="appstore-badge badge-playstore-fix">
+					</a>
+				</div>
+			</div>
+		</div>
+	</Fragment>
+</template>
+<script>
+
+import { generateFilePath } from '@nextcloud/router'
+
+import { Fragment } from 'vue-fragment'
+
+export default {
+	components: {
+		Fragment,
+	},
+
+	methods: {
+		getRoute(file) {
+			return generateFilePath('notes', 'img', file)
+		},
+	},
+}
+
+</script>
+<style scoped>
+.badge-wrapper {
+	margin-top: 2em;
+	margin-left: 2em;
+	width: 100%;
+	clear:both;
+}
+
+.badge {
+	float: left;
+}
+
+.appstore-badge {
+	height: 72px;
+	box-sizing: border-box;
+}
+
+.badge-playstore-fix {
+	padding: 12px;
+}
+
+</style>
diff --git a/src/components/Welcome.vue b/src/components/Welcome.vue
index 9dbd19f7..fc4643dd 100644
--- a/src/components/Welcome.vue
+++ b/src/components/Welcome.vue
@@ -5,22 +5,25 @@
 			<div class="feature icon-add">
 				{{ t('notes', 'Start writing a note by clicking on “{newnote}” in the app navigation.', { newnote: t('notes', 'New note') }) }}
 			</div>
+			<div class="feature">
+				<NcButton type="secondary" @click="onNewNote">
+					<PlusIcon slot="icon" :size="20" />
+					{{ t('notes', 'New note') }}
+				</NcButton>
+			</div>
 			<div class="feature icon-fullscreen">
 				{{ t('notes', 'Write down your thoughts without any distractions.') }}
 			</div>
 			<div class="feature icon-toggle-filelist">
 				{{ t('notes', 'Use Markdown markups to style your text.') }}
 			</div>
+			<div class="feature">
+				<CreateSampleButton />
+			</div>
 			<div class="feature icon-files-dark">
 				{{ t('notes', 'Organize your notes in categories.') }}
 			</div>
-			<div class="feature icon-phone">
-				{{ t('notes', 'Install the app for your mobile phone in order to access your notes from everywhere.') }}
-				<ul>
-					<li><a target="_blank" href="https://github.com/stefan-niedermann/nextcloud-notes">{{ t('notes', 'Android app') }}</a></li>
-					<li><a target="_blank" href="https://github.com/owncloud/notes-iOS-App">{{ t('notes', 'iOS app') }}</a></li>
-				</ul>
-			</div>
+			<HelpMobile />
 		</div>
 	</NcAppContent>
 </template>
@@ -28,20 +31,44 @@
 
 import {
 	NcAppContent,
+	NcButton,
 } from '@nextcloud/vue'
 
+import PlusIcon from 'vue-material-design-icons/Plus.vue'
+
+import CreateSampleButton from './CreateSampleButton.vue'
+import HelpMobile from './HelpMobile.vue'
+
+import { createNote } from '../NotesService.js'
+
 export default {
 	name: 'Welcome',
 
 	components: {
+		CreateSampleButton,
+		HelpMobile,
 		NcAppContent,
+		NcButton,
+		PlusIcon,
+	},
+
+	methods: {
+		onNewNote() {
+			createNote()
+				.then(note => {
+					this.$router.push({
+						name: 'note',
+						params: { noteId: note.id.toString() },
+					})
+				})
+		},
 	},
 }
 
 </script>
-<style>
+<style scoped>
 .welcome-content {
-	padding: 2em 3em;
+	padding: 4em 8em;
 }
 
 .welcome-content h2 {
@@ -52,15 +79,4 @@ export default {
 	color: var(--color-primary-element);
 }
 
-.feature {
-	background-position: left top;
-	min-height: 32px;
-	padding-left: 32px;
-	margin-top: 1em;
-}
-
-.feature ul {
-	list-style: circle outside;
-	padding-left: 2em;
-}
 </style>