diff --git a/html/index.html b/html/index.html
index 37b236b..fc3e7d7 100644
--- a/html/index.html
+++ b/html/index.html
@@ -2,6 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width">
     <script>
 
 		(function (PageType) {
@@ -66,43 +67,66 @@
 							// {
 							// 	type: PageType.FullPageMultiChoice,
 							// 	title: "Who do you primarily chat with on Kik?",
-							// 	description: "Finish the poll to earn <span style='color:#047cfc;'>6,000</span> Kin",
+							// 	rewardText: "Finish the poll to earn",
+							// 	rewardValue: 6000,
 							// 	question: {
-							// 		id: "G@#$",
+							// 		id: "question_id_1 - G@#$",
 							// 		answers: [
 							// 			"New friends I’ve met on Kik",
 							// 			"Friends I’ve met elsewhere online",
 							// 			"Friends I know from real life",
 							// 			"An equal mix of all three!",
+							// 			"An equal mix of all four!",
 							// 		],
 							// 	},
 							// },
 							// {
-							// 	type: PageType.EarnThankYou,
-							// 	description: "4,500"
-							// },
-
-							//*** Quiz ***//
-							// {
-							// 	type: PageType.TimedFullPageMultiChoice,
-							// 	description: "What was the name of the substance that Star Wars hero Han Solo was encased in?",
-							// 	amount: 15,
-							// 	rightAnswer: 3,
+							// 	type: PageType.FullPageMultiChoice,
+							// 	title: "Who do you primarily chat with on Kik?",
+							// 	rewardText: "Finish the poll to earn",
+							// 	rewardValue: 6000,
 							// 	question: {
-							// 		id: "erthwt",
+							// 		id: "question_id_2 - G@#$",
 							// 		answers: [
-							// 			"Radonite",
-							// 			"Argonite",
-							// 			"Carbonite",
-							// 			"Kryptonite",
+							// 			"New friends I’ve met on Kik",
+							// 			"Friends I’ve met elsewhere online",
+							// 			"Friends I know from real life",
+							// 			"An equal mix of all three!",
+							// 			"An equal mix of all four!",
 							// 		],
 							// 	},
 							// },
+							// {
+							// 	type: PageType.EarnThankYou,
+							// 	description: "4,500"
+							// },
+
+							//*** Quiz ***//
+							{
+								type: PageType.TimedFullPageMultiChoice,
+								title: "What was the name of the substance that Star Wars hero Han Solo was encased in?",
+								amount: 15,
+								rightAnswer: 3,
+								rewardText: "Finish the poll to earn",
+								rewardValue: 6000,
+								question: {
+									id: "erthwt",
+									answers: [
+										"Radonite",
+										"Argonite",
+										"Carbonite",
+										"Kryptonite",
+										"Kryptonite-2",
+									],
+								},
+							},
 							{
 								type: PageType.TimedFullPageMultiChoice,
-								description: "How much wood could a woodchuck chuck?",
+								title: "How much wood could a woodchuck chuck?",
 								amount: 15,
 								rightAnswer: 2,
+								rewardText: "Finish the poll to earn",
+								rewardValue: 6000,
 								question: {
 									id: "question-1",
 									answers: [
@@ -110,14 +134,17 @@
 										"A woodchuck would chuck as much wood as a woodchuck could chuck",
 										"320 kg",
 										"361.9237001 cm3",
+										"361.9237001 cm3-2",
 									],
 								},
 							},
 							{
 								type: PageType.TimedFullPageMultiChoice,
-								description: "Yes?",
+								title: "Yes?",
 								amount: 20,
 								rightAnswer: 3,
+								rewardText: "Finish the poll to earn",
+								rewardValue: 6000,
 								question: {
 									id: "question-2",
 									answers: [
@@ -125,14 +152,17 @@
 										"no",
 										"320 kg",
 										"Camel",
+										"Camel-2",
 									],
 								},
 							},
 							{
 								type: PageType.TimedFullPageMultiChoice,
-								description: "Color?",
+								title: "Color?",
 								amount: 15,
 								rightAnswer: 4,
+								rewardText: "Finish the poll to earn",
+								rewardValue: 6000,
 								question: {
 									id: "question-3",
 									answers: [
@@ -140,6 +170,7 @@
 										"Red",
 										"Crimson",
 										"Dorothy",
+										"Dorothy-2",
 									],
 								},
 							},
diff --git a/images/cheering-hands.svg b/images/cheering-hands.svg
new file mode 100644
index 0000000..41e12bc
--- /dev/null
+++ b/images/cheering-hands.svg
@@ -0,0 +1,86 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="360" height="213" viewBox="0 0 360 213">
+    <defs>
+        <path id="a" d="M50.926 0l15.875 83.423-50.907 9.687L.02 9.687c.816 4.292 12.874 5.602 26.931 2.927C41.009 9.939 51.743 4.293 50.926 0"/>
+        <path id="c" d="M82.47 25.193L15.943 50.612c-4.691 1.792-9.994-.58-11.786-5.27L1.482 38.34c-1.792-4.69.579-9.994 5.269-11.786l66.528-25.42c4.69-1.791 9.994.58 11.786 5.27l2.675 7.003c1.792 4.69-.58 9.994-5.27 11.786"/>
+        <path id="e" d="M55.047-49.122h47.077v113.35H55.047z"/>
+        <path id="f" d="M.394.322h6.638v6.637H.394z"/>
+    </defs>
+    <g fill="none" fill-rule="evenodd">
+        <path fill="#DF78E8" d="M102.816 160.37l.717-7.262c.347-3.513-1.531-7.454-4.824-8.723l-6.61-4.259-3.764 6.352-2.331 13.985 16.812-.094z"/>
+        <path stroke="#DF78E8" stroke-linecap="round" stroke-linejoin="round" stroke-width="16" d="M100.357 137.064c-.464-4.362-2.506-7.823-7.61-8.446-14.766-1.805-16.084 27.98-16.325 33.239"/>
+        <path stroke="#DF78E8" stroke-linecap="round" stroke-linejoin="round" stroke-width="16" d="M104.999 140.2c-.464-4.364-2.506-7.824-7.612-8.448-14.764-1.805-16.082 27.981-16.324 33.24"/>
+        <path stroke="#DF78E8" stroke-linecap="round" stroke-linejoin="round" stroke-width="16" d="M92.674 134.858c-.464-4.363-2.506-7.823-7.612-8.447-14.764-1.804-16.082 27.98-16.324 33.24"/>
+        <path stroke="#1F1F1F" stroke-linecap="round" stroke-linejoin="round" d="M91.951 119.566c3.438 2.107 6.607 5.604 8.036 9.533 1.377 3.787 1.41 8.127-1.123 11.44-1.296 1.695-3.054 2.77-5.152 3.104-1.823.29-3.85.133-5.477-.803a4.987 4.987 0 0 1-1.343-1.11"/>
+        <path stroke="#1F1F1F" stroke-linecap="round" stroke-linejoin="round" d="M99.68 121.367c3.372 2.2 6.531 5.863 7.972 9.636 1.484 3.887 1.4 8.448-1.135 11.761-1.296 1.694-3.054 2.77-5.152 3.104-1.823.29-3.85.133-5.477-.804a4.999 4.999 0 0 1-1.343-1.109M103.1 148.469a9.502 9.502 0 0 1-2.873-1.046 6.64 6.64 0 0 1-1.543-1.292"/>
+        <path stroke="#DF78E8" stroke-width="42" d="M76.771 217.212l5.268-60.056"/>
+        <path stroke="#149E83" stroke-width="2" d="M100.733 184.454c5.543.539 5.89 2.216 5.886 3.608-.163 4.32-12.008 7.383-26.458 6.838-14.448-.546-26.03-4.491-25.866-8.814.06-1.572 1.25-3.006 4.36-2.713"/>
+        <path stroke="#F1BD19" stroke-width="2" d="M101.201 173.235c3.8.327 4.989 3.304 4.525 5.071-1.098 4.183-13.325 4.6-27.31.931-13.987-3.67-24.435-10.036-23.337-14.219.39-1.486 1.457-2.884 5.399-2.558"/>
+        <path fill="#F28433" d="M101.913 86.208l18.103 7.25c.938.375.889 1.72-.073 2.026L74.86 109.877a1.077 1.077 0 0 1-1.354-.698l-8.058-25.24a1.077 1.077 0 0 1 .698-1.355l45.12-14.405c.964-.307 1.783.761 1.235 1.611l-10.59 16.418z"/>
+        <path fill="#DF78E8" d="M64.2 83.107l16.056 50.292"/>
+        <path stroke="#DB497B" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M64.2 83.107l16.056 50.292"/>
+        <path fill="#DF78E8" d="M68.898 146.31c.08-.695.735-3.638 1.161-4.72 1.082-2.752 2.57-5.568 5.095-7.251 2.645-1.762 6.376-2.2 9.194-.588a8 8 0 0 1 2.976 10.915c-2.607 4.562-2.65 7.982-2.66 8.008"/>
+        <path stroke="#1F1F1F" stroke-linecap="round" stroke-linejoin="round" d="M68.898 146.31c.08-.695.735-3.638 1.161-4.72 1.082-2.752 2.57-5.568 5.095-7.251 2.645-1.762 6.376-2.2 9.194-.588a8 8 0 0 1 2.976 10.915c-2.607 4.562-2.65 7.982-2.66 8.008"/>
+        <path fill="#6F41E8" d="M216.834 218.63l-50.904 9.686-15.882-83.46 50.904-9.688z"/>
+        <g transform="translate(153.207 151.883)">
+            <mask id="b" fill="#fff">
+                <use xlink:href="#a"/>
+            </mask>
+            <use fill="#936BFB" xlink:href="#a"/>
+            <path fill="#FFD654" d="M44.984 29.814c1.177 6.182-2.881 12.147-9.063 13.322-6.181 1.177-12.146-2.88-13.323-9.062-1.176-6.181 2.882-12.146 9.064-13.322 6.18-1.176 12.146 2.88 13.322 9.063M69.75 12.454c1.176 6.182-2.882 12.146-9.064 13.323-6.18 1.176-12.146-2.882-13.323-9.063-1.176-6.18 2.882-12.146 9.064-13.323 6.181-1.175 12.146 2.882 13.322 9.063M73.627 43.077c1.177 6.182-2.88 12.146-9.063 13.322-6.18 1.176-12.146-2.88-13.323-9.062-1.176-6.182 2.882-12.147 9.064-13.323 6.181-1.176 12.146 2.881 13.322 9.063M24.995 54.865c1.176 6.182-2.882 12.146-9.063 13.322-6.182 1.177-12.147-2.88-13.323-9.062-1.176-6.182 2.881-12.147 9.063-13.323 6.181-1.176 12.146 2.881 13.323 9.063M13.588 25.652c1.177 6.182-2.88 12.146-9.063 13.323-6.18 1.176-12.146-2.882-13.322-9.063C-9.974 23.73-5.916 17.765.266 16.59c6.181-1.176 12.146 2.881 13.322 9.063" mask="url(#b)"/>
+        </g>
+        <path fill="#1F1F1F" d="M163.302 148.703c-2.77 0-5.202-.208-7.229-.617-3.289-.675-5.252-1.845-5.527-3.293-.305-1.585 1.387-3.234 2.859-4.337 4.18-3.153 11.922-6.03 20.712-7.699 4.732-.9 9.417-1.377 13.552-1.377 3.222 0 6.069.294 8.231.85 2.695.683 4.316 1.77 4.564 3.061.294 1.563-1.34 3.183-2.762 4.267-4.105 3.14-12.079 6.116-20.81 7.766-4.742.902-9.442 1.38-13.59 1.38"/>
+        <path fill="#6F41E8" d="M187.67 130.88c-4.037 0-8.72.448-13.646 1.386-9.12 1.73-16.849 4.72-20.919 7.79-2.2 1.65-3.34 3.32-3.05 4.83.33 1.74 2.51 2.99 5.92 3.69 2.045.413 4.532.627 7.33.627 4.045 0 8.738-.447 13.68-1.387 9.2-1.74 16.98-4.77 21.02-7.86 2.14-1.63 3.23-3.27 2.95-4.76-.3-1.56-2.09-2.73-4.93-3.45-2.216-.569-5.072-.866-8.355-.866m.001 0v1c3.18 0 5.982.29 8.108.835 2.458.624 3.988 1.597 4.193 2.666.193 1.026-.72 2.368-2.574 3.78-4.046 3.095-11.939 6.034-20.6 7.672-4.71.897-9.376 1.37-13.493 1.37-2.739 0-5.138-.204-7.129-.606-3.035-.623-4.908-1.68-5.139-2.9-.199-1.037.748-2.4 2.67-3.842 4.06-3.063 11.917-5.978 20.505-7.607 4.7-.894 9.354-1.368 13.458-1.368l.001-1"/>
+        <path fill="#FFD654" d="M197.715 138.916c-.1.08-.21.17-.32.25-4.04 3.09-11.94 6.03-20.6 7.67-4.71.89-9.37 1.37-13.49 1.37-2.74 0-5.14-.21-7.13-.61-.22-.04-.43-.09-.63-.14a79.68 79.68 0 0 1-2.14-6.37c-.1-.34-.2-.68-.3-1.03-2.42-8.57-4.55-20.98-2.59-34.74.1 0 43.34-6.62 43.34-6.62s-1.21 15.85 2.17 33.05c.07.36.15.73.23 1.1.41 2.01.9 4.05 1.46 6.07"/>
+        <path stroke="#FFD654" stroke-linecap="round" stroke-linejoin="round" stroke-width="14" d="M168.05 100.19c-.743-4.25-1.958-5.802-4.049-7.49-.98-.79-2.479-.82-3.31.13-2.173 2.478-3.58 10.567-3.998 20.868 0 0-.383 8.042 1.148 14.17"/>
+        <path fill="#B23E66" d="M116.145 119.625c-.71-1.839.836-3.758 2.784-3.453l8.908 1.39 8.91 1.39c1.948.305 2.835 2.604 1.598 4.14l-5.658 7.018-5.66 7.02c-1.236 1.535-3.671 1.155-4.382-.684l-3.25-8.41-3.25-8.41zM226.297 77.538c-.696-1.845-3.129-2.243-4.378-.718l-5.71 6.978-5.713 6.976c-1.249 1.526-.378 3.831 1.568 4.15l8.898 1.458 8.898 1.458c1.945.32 3.506-1.588 2.81-3.433l-3.186-8.434-3.187-8.435z"/>
+        <g transform="translate(129.825 81.122)">
+            <mask id="d" fill="#fff">
+                <use xlink:href="#c"/>
+            </mask>
+            <use fill="#DB497B" xlink:href="#c"/>
+            <path fill="#1DC2A4" d="M33.918 1.95l-17.6 92.97c-.933 4.933-5.734 8.206-10.668 7.271l-11.219-2.124c-4.933-.933-8.206-5.734-7.272-10.668L4.76-3.57c.933-4.933 5.734-8.206 10.668-7.27l11.22 2.122c4.932.935 8.205 5.734 7.271 10.668M101.965-36.17l-17.6 92.968c-.933 4.933-5.734 8.206-10.668 7.271l-11.219-2.123c-4.933-.934-8.205-5.735-7.272-10.668l17.6-92.97c.933-4.933 5.734-8.206 10.668-7.27l11.22 2.123c4.932.934 8.205 5.734 7.271 10.668" mask="url(#d)"/>
+        </g>
+        <path fill="#FFD654" d="M196.531 93.4c-.943-5.403-2.78-8.693-6.548-11.73-3.782-3.053-9.11-2.821-12.456.43-3.548-1.294-7.6-.41-10.18 2.529-.378.432-.687.9-.942 1.388-3.725-1.75-8.207-.966-10.979 2.199-2.548 2.908-1.578 6.182 1.331 8.73 1.363 1.195 5.52 10.355 11.284 10.245a7.97 7.97 0 0 0 1.212-.105 6.995 6.995 0 0 0 5.677-5.652c1.293 1.347 3.088 2.173 5.03 2.173a6.97 6.97 0 0 0 5.854-3.164c1.113.729 2.424 1.163 3.814 1.163a7 7 0 0 0 6.903-8.205"/>
+        <path stroke="#191919" stroke-linecap="round" stroke-linejoin="round" d="M164.216 84.457c3.44 1.043 6.372 3.655 8.22 6.702 1.253 2.066 2.42 4.495 2.821 6.887.24 1.431.397 3.2.027 4.501M176.245 81.036c3.44 1.043 6.401 3.581 8.25 6.628 1.252 2.065 2.312 4.47 2.713 6.861.388 2.315.1 4.766-1.154 6.503"/>
+        <path fill="#FFD654" d="M168.894 128.326c.008-.032.314-3.38 2.229-7.62a8 8 0 0 0-4.001-10.583c-3.2-1.443-7.494-.603-9.534 2.358-1.714 2.488-2.975 5.47-3.646 8.384-.717 3.114-1.047 6.273-1.047 9.483"/>
+        <path stroke="#1F1F1F" stroke-linecap="round" stroke-linejoin="round" d="M168.894 128.326c.008-.032.314-3.38 2.229-7.62a8 8 0 0 0-4.001-10.583c-3.2-1.443-7.494-.603-9.534 2.358-1.714 2.488-2.975 5.47-3.646 8.384-.717 3.114-1.047 6.273-1.047 9.483"/>
+        <path fill="#FFD654" stroke="#FFD654" d="M280.347 199.317c4.019.747 17.298 4.266 17.017 18.068a.917.917 0 0 1-.9.89c-3.445.073-16.064-.84-17.196-18.003a.916.916 0 0 1 1.079-.955z"/>
+        <path fill="#FFD654" stroke="#FFD654" d="M282.026 200.216c1.305-3.873 6.655-16.525 20.282-14.306a.915.915 0 0 1 .754 1.015c-.412 3.422-3.09 15.787-20.242 14.495a.917.917 0 0 1-.794-1.204z"/>
+        <path fill="#F28433" d="M287.507 199.519a4.623 4.623 0 1 1-9.246 0 4.623 4.623 0 0 1 9.246 0"/>
+        <path fill="#1DC2A4" d="M308.207 143.273a8 8 0 0 0-11.16 1.857l-10.798 15.112 9.868-20.425a8 8 0 1 0-14.406-6.961l-8.45 17.49 3.878-16.814a7.999 7.999 0 0 0-5.997-9.593 7.997 7.997 0 0 0-9.593 5.997l-5.983 25.938-.2-.468a8 8 0 0 0-10.505-4.202 8.002 8.002 0 0 0-4.202 10.505l5.592 13.047a7.97 7.97 0 0 0 4.011 4.117l-.142.616a7.999 7.999 0 0 0 7.802 9.8 7.952 7.952 0 0 0 3.141-.652 7.973 7.973 0 0 0 1.943 1.323 7.984 7.984 0 0 0 3.002.772 7.984 7.984 0 0 0 3.331 6.935 7.993 7.993 0 0 0 11.16-1.858l29.565-41.376a7.998 7.998 0 0 0-1.857-11.16"/>
+        <path fill="#1DC2A4" d="M308.207 143.273a8 8 0 0 0-11.16 1.857l-10.798 15.112 9.868-20.425a8 8 0 1 0-14.406-6.961l-8.45 17.49 3.878-16.814a7.999 7.999 0 0 0-5.997-9.593 7.997 7.997 0 0 0-9.593 5.997l-5.983 25.938-.2-.468a8 8 0 0 0-10.505-4.202 8.002 8.002 0 0 0-4.202 10.505l5.592 13.047c.043.1.096.196.143.294l-16.725 46.56 39.527 14.198 17.402-48.445-.05-.018 23.516-32.912a7.998 7.998 0 0 0-1.857-11.16"/>
+        <path stroke="#1F1F1F" stroke-linecap="round" stroke-linejoin="round" d="M254.845 151.562c.901 4.17 2.805 8.085 6.253 10.468 1.575 1.089 3.546 1.909 5.273 2.599"/>
+        <path fill="#1DC2A4" d="M245.135 172.203s1.388 2.717.211 5.75c.053.018 1.81-1.179 1.81-1.179l1.302-2.215-2.831-2.954-.492.598z"/>
+        <path fill="#FFD654" d="M243.298 180.593c5.272 3.961 18.303 12.065 41.814 14.156-.846 1.32-2.47 6.237-3.108 8.325-.184.601-.714 1.035-1.34 1.177-5.278 1.203-30.057 5.952-43.669-7.288a1.729 1.729 0 0 1-.402-1.853c1.06-2.824 3.857-10.718 4.976-13.883.246-.695 1.132-1.082 1.73-.634"/>
+        <path stroke="#DB497B" stroke-linecap="round" stroke-linejoin="bevel" stroke-width="2" d="M61.515 60.22c2.104.926 3.553 3.139 3.374 5.43-.05.628-.267 1.38-.624 1.897-.297.432-.716.766-1.164 1.035-.835.502-1.816.8-2.784.695-.968-.106-1.909-.658-2.353-1.524-.444-.866-.3-2.035.431-2.677.85-.745 2.254-.586 3.098.167.843.753 1.18 1.95 1.138 3.08-.07 1.924-1.19 3.779-2.86 4.739"/>
+        <path stroke="#6F41E8" stroke-linecap="round" stroke-linejoin="bevel" stroke-width="2" d="M13.572 154.76c-1.583-1.667-2.063-4.269-1.011-6.312.287-.56.778-1.169 1.307-1.509.441-.283.957-.429 1.474-.504.964-.141 1.986-.036 2.836.436.851.472 1.506 1.344 1.581 2.315.075.97-.51 1.993-1.433 2.302-1.072.359-2.306-.332-2.792-1.352-.486-1.021-.335-2.254.141-3.279.81-1.748 2.56-3.026 4.471-3.266"/>
+        <path stroke="#DC650F" stroke-linecap="round" stroke-linejoin="bevel" stroke-width="2" d="M223.927 134.57c-1.889 1.31-4.533 1.39-6.394.037-.508-.37-1.036-.946-1.292-1.522-.211-.478-.278-1.01-.273-1.534.008-.972.267-1.965.862-2.736.597-.77 1.558-1.284 2.529-1.21.97.073 1.892.807 2.057 1.766.192 1.114-.677 2.228-1.76 2.553-1.083.327-2.28-.01-3.221-.637-1.604-1.067-2.601-2.99-2.546-4.916"/>
+        <path fill="#F28433" d="M148.642 72.99c.452-1.24 1.812-3.938 5.437-5.751.18-.092.28-.28.173-.452-.618-.984-2.327-3.91-2.821-4.759a.307.307 0 0 0-.386-.131c-1.156.486-5.952 2.753-6.69 7.119a.317.317 0 0 0 .092.28c.545.538 2.799 2.882 3.68 3.801.16.168.436.11.515-.106"/>
+        <path fill="#A6A6A6" d="M44.797 117.674c.57 1.19 1.545 4.052.303 7.909-.06.193.004.397.201.44 1.136.247 4.423 1.075 5.374 1.315a.308.308 0 0 0 .365-.184c.461-1.167 2.198-6.178-.405-9.76a.318.318 0 0 0-.263-.132c-.766.014-4.019-.018-5.292-.03a.307.307 0 0 0-.283.442M342.46 108.47c-1.307-.18-4.233-.937-6.772-4.097-.126-.157-.333-.214-.477-.073-.83.813-3.33 3.103-4.055 3.765a.308.308 0 0 0-.047.405c.721 1.027 3.952 5.234 8.374 5.03a.316.316 0 0 0 .255-.147c.41-.648 2.225-3.347 2.936-4.404a.307.307 0 0 0-.214-.48"/>
+        <path fill="#936BFB" d="M243.083 117.001c-.219 1.302-1.063 4.204-4.296 6.648-.16.122-.225.327-.088.475.788.855 3.002 3.421 3.643 4.164a.308.308 0 0 0 .404.06c1.048-.69 5.35-3.795 5.276-8.222a.32.32 0 0 0-.14-.26c-.634-.428-3.279-2.322-4.315-3.064a.306.306 0 0 0-.484.2"/>
+        <path fill="#FFD654" d="M319.508 26.405c-.219 1.302-1.062 4.204-4.296 6.648-.16.123-.224.328-.087.476.787.854 3.002 3.42 3.643 4.163a.307.307 0 0 0 .403.06c1.05-.69 5.35-3.794 5.277-8.222a.32.32 0 0 0-.14-.26c-.635-.427-3.279-2.322-4.315-3.064a.307.307 0 0 0-.485.2M244.508 68.406c-.219 1.301-1.062 4.203-4.296 6.647-.16.123-.224.328-.087.475.787.855 3.002 3.421 3.643 4.164a.307.307 0 0 0 .403.06c1.05-.69 5.35-3.794 5.277-8.221a.32.32 0 0 0-.14-.26c-.635-.428-3.279-2.323-4.315-3.064a.307.307 0 0 0-.485.199M230.855 171.291c-.568 1.19-1.545 4.051-.303 7.91.062.192-.004.396-.201.438-1.136.247-4.423 1.075-5.374 1.316a.308.308 0 0 1-.364-.184c-.462-1.167-2.2-6.178.404-9.76a.317.317 0 0 1 .264-.132c.765.013 4.018-.018 5.292-.03a.307.307 0 0 1 .282.442"/>
+        <path fill="#F28433" d="M38.545 173.035c-1.317.071-4.334-.117-7.427-2.737-.154-.13-.367-.148-.482.018-.662.956-2.68 3.68-3.266 4.466a.307.307 0 0 0 .03.407c.903.871 4.873 4.39 9.177 3.35a.322.322 0 0 0 .223-.194c.28-.713 1.55-3.708 2.046-4.88a.307.307 0 0 0-.3-.43"/>
+        <path fill="#FFD654" d="M51.545 29.355c-1.317.07-4.334-.117-7.427-2.737-.154-.13-.367-.148-.482.018-.662.956-2.68 3.679-3.266 4.466a.307.307 0 0 0 .03.407c.903.87 4.873 4.389 9.177 3.35a.322.322 0 0 0 .223-.194c.28-.713 1.55-3.708 2.046-4.88a.307.307 0 0 0-.3-.43"/>
+        <path fill="#DB497B" d="M303.396 111.011c-1.308-.177-4.235-.928-6.782-4.081-.127-.157-.333-.214-.478-.072-.83.814-3.323 3.109-4.045 3.773a.307.307 0 0 0-.046.405c.723 1.027 3.962 5.226 8.385 5.012a.319.319 0 0 0 .255-.148c.409-.649 2.217-3.352 2.926-4.41a.307.307 0 0 0-.215-.479"/>
+        <path fill="#DF78E8" d="M19.075 110.123a3.318 3.318 0 1 1-6.636 0 3.318 3.318 0 0 1 6.636 0"/>
+        <path fill="#FFD654" d="M108.693 114.08a3.319 3.319 0 1 1-6.638 0 3.319 3.319 0 0 1 6.638 0"/>
+        <path fill="#936BFB" d="M39.458 83.654a3.319 3.319 0 1 1-6.638 0 3.319 3.319 0 0 1 6.638 0"/>
+        <path fill="#B041BA" d="M24.522 199.91a3.318 3.318 0 1 1-6.636 0 3.318 3.318 0 0 1 6.636 0"/>
+        <path fill="#A6A6A6" d="M97.118 32.378a3.319 3.319 0 1 1-6.638 0 3.319 3.319 0 0 1 6.638 0"/>
+        <path fill="#F28433" d="M319.969 196.804a3.319 3.319 0 1 1-6.64-.002 3.319 3.319 0 0 1 6.64.002"/>
+        <path fill="#B041BA" d="M149.288 194.378a3.319 3.319 0 1 1-6.638 0 3.319 3.319 0 0 1 6.638 0M299.139 69.825a3.319 3.319 0 1 1-6.64-.002 3.319 3.319 0 0 1 6.64.002M217.628 25.059a3.318 3.318 0 1 1-6.637.001 3.318 3.318 0 0 1 6.637-.001"/>
+        <path fill="#6F41E8" d="M147.671 4.123a3.318 3.318 0 1 1-6.636 0 3.318 3.318 0 0 1 6.636 0M332.926 142.335a3.319 3.319 0 1 1-6.638 0 3.319 3.319 0 0 1 6.638 0"/>
+        <path fill="#A6A6A6" d="M270.437 95.952a3.319 3.319 0 1 1-6.638 0 3.319 3.319 0 0 1 6.638 0"/>
+        <g transform="translate(340 58.993)">
+            <mask id="g" fill="#fff">
+                <use xlink:href="#f"/>
+            </mask>
+            <path fill="#F28433" d="M7.032 3.641a3.319 3.319 0 1 1-6.64-.002 3.319 3.319 0 0 1 6.64.002" mask="url(#g)"/>
+        </g>
+        <path fill="#DB497B" d="M248.48 46.165a3.319 3.319 0 1 1-6.638 0 3.319 3.319 0 0 1 6.638 0"/>
+        <path stroke="#936BFB" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M119.06 163.825c2.065.531 3.77 2.134 4.522 3.965 1.004 2.443 1.111 6.345-2.036 7.263-.958.28-2.063.07-2.803-.6-1.359-1.23-.968-3.42.623-4.224 2.527-1.277 5.527.53 6.617 2.894.782 1.696.96 4.206 0 5.807"/>
+        <path stroke="#1DC2A4" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M192.197 45.18c.018 2.135-1.094 4.193-2.67 5.39-2.103 1.597-5.847 2.703-7.541-.103-.517-.854-.599-1.976-.14-2.864.84-1.63 3.056-1.813 4.242-.483 1.882 2.117.907 5.48-1.1 7.14-1.438 1.19-3.817 2.007-5.612 1.49"/>
+        <path stroke="#DF78E8" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M276.051 35.93c-2.108.327-4.307-.474-5.72-1.86-1.885-1.851-3.522-5.393-.992-7.477.772-.635 1.869-.878 2.814-.554 1.733.595 2.237 2.76 1.092 4.126-1.819 2.17-5.289 1.695-7.223-.05-1.386-1.25-2.539-3.488-2.289-5.337"/>
+        <path stroke="#B041BA" stroke-linecap="round" stroke-linejoin="bevel" stroke-width="2" d="M339.283 165.46c-1.132 1.343-1.938 3.025-1.944 4.782-.005 1.756.894 3.562 2.457 4.361 1.692.864 4.959.14 4.968-2.196.005-1.45-1.55-2.254-2.848-2.07-.776.11-1.51.48-2.062 1.037-.688.696-1.065 1.647-1.27 2.605-.346 1.626-.137 3.541 1.142 4.601.88.73 2.086.91 3.228.958M135.282 31.46c-1.132 1.343-1.937 3.025-1.943 4.782-.006 1.756.893 3.562 2.458 4.361 1.691.864 4.958.14 4.966-2.196.005-1.45-1.549-2.254-2.846-2.07-.776.11-1.512.48-2.063 1.037-.688.696-1.066 1.647-1.27 2.605-.346 1.626-.138 3.541 1.142 4.601.88.73 2.085.91 3.228.958"/>
+    </g>
+</svg>
diff --git a/images/ic-back.svg b/images/ic-back.svg
new file mode 100644
index 0000000..b9f1ad8
--- /dev/null
+++ b/images/ic-back.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+    <path fill="#A6A6A6" fill-rule="evenodd" d="M15 5.93L13.635 4.5 6 12.5l7.635 8L15 19.07 8.73 12.5z"/>
+</svg>
diff --git a/images/kin-coin.svg b/images/kin-coin.svg
new file mode 100644
index 0000000..bd087f2
--- /dev/null
+++ b/images/kin-coin.svg
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="6" height="6" viewBox="0 0 6 6">
+    <g fill="#6F41E8" fill-rule="evenodd">
+        <text font-family="Sailec-Medium, Sailec" font-size="14" font-weight="400" transform="translate(-9 -13)">
+            <tspan x="0" y="11">+ 30</tspan>
+        </text>
+        <path d="M5.446 2.009A.548.548 0 0 0 6 1.467V0H4.473a.548.548 0 0 0-.554.542v.482c0 .544-.423 1.012-.979 1.012s-1.035-.468-1.035-1.012V.522A.528.528 0 0 0 1.37 0H0v6h1.36a.54.54 0 0 0 .545-.533v-.452c0-.573.432-1.054.989-1.054.556.002 1.025.46 1.025 1.005v.496c0 .297.246.538.55.538H6V4.517a.544.544 0 0 0-.55-.538h-.457c-.557 0-1.074-.441-1.074-.985a1 1 0 0 1 1.01-.985h.517z"/>
+    </g>
+</svg>
diff --git a/scripts/src/app.tsx b/scripts/src/app.tsx
index ccc2609..174999f 100644
--- a/scripts/src/app.tsx
+++ b/scripts/src/app.tsx
@@ -47,7 +47,10 @@ export interface CommonProps {
 	totalPagesCount: number;
 	currentPage: number;
 	sharedData: SharedData;
+	rewardText?: string;
+	rewardValue?: number;
 	updateSharedDate(data: any): void;
+	navigateBack(): void;
 }
 
 const sharedPageData = {};
@@ -84,6 +87,7 @@ class App extends React.Component {
 			data: {},
 		};
 		this.onPageCompleteHandler = this.onPageCompleteHandler.bind(this);
+		this.navigateBack = this.navigateBack.bind(this);
 	}
 
 	public render() {
@@ -99,20 +103,20 @@ class App extends React.Component {
 	}
 
 	private onPageCompleteHandler(answerData: any) {
+		const navigationStep = 1;
+		const newPageIndex = this.navigate(navigationStep);
+
 		const allData: any = Object.assign({}, this.state.data, answerData);  // todo pollyfill Object.assign
-		const newPageIndex = this.state.currentPage + 1;
-		const isComplete = this.state.currentPage === (this.state.pages.length - 1);
-		console.log("current: %s, new page: %s, isComplete: %s", this.state.currentPage, newPageIndex, isComplete);
 
+		const isComplete = this.state.currentPage === (this.state.pages.length - 1);
 		if (isComplete) {
 			if (Object.keys(allData)) {
-				console.log("submit " + JSON.stringify(allData));
-				bridge.submitResult(allData);
+				console.log("submit " + JSON.stringify(this.state.data));
+				bridge.submitResult(this.state.data);
 				bridge.close();
 			}
 			return;
 		}
-
 		this.setState({
 			currentPage: newPageIndex,
 			data: allData,
@@ -120,6 +124,29 @@ class App extends React.Component {
 		});
 	}
 
+	private navigateBack() {
+		const navigationStep = -1;
+		const newPageIndex = this.navigate(navigationStep);
+
+		const shouldExit = newPageIndex < 0;
+		if (shouldExit) {
+			console.log("exit " + JSON.stringify(this.state.data));
+			bridge.close();
+			return;
+		}
+
+		this.setState(Object.assign({}, this.state, {
+			currentPage: newPageIndex,
+		}));
+	}
+
+	private navigate(pageStep: number): number {
+		const newPageIndex = this.state.currentPage + pageStep;
+		console.log("current: %s, new page: %s", this.state.currentPage, newPageIndex);
+
+		return newPageIndex;
+	}
+
 	private updateSharedData(data: any) {
 		Object.assign(sharedPageData, data);
 	}
@@ -132,22 +159,39 @@ class App extends React.Component {
 				pageIndex: index,
 				id: page.question && page.question.id,
 				title: page.title,
+				rewardText: page.rewardText,
+				rewardValue: page.rewardValue,
 				isDisplayed: this.state.currentPage === index,
 				totalPagesCount: this.state.pages.length,
 				currentPage: this.state.currentPage,
 				sharedData: sharedPageData,
 				updateSharedDate: this.updateSharedData,
+				navigateBack: this.navigateBack,
 			};
 
 			switch (page.type) {
 				case PageType.FullPageMultiChoice:
-					return <MultichoiceQuestion {...commonProps} choices={page.question.choices} description={page.description} onSelected={this.onPageCompleteHandler} rightAnswer={page.rightAnswer}/>;
+					return <MultichoiceQuestion
+						{...commonProps}
+						choices={page.question.choices}
+						rewardText={page.rewardText}
+						rewardValue={page.rewardValue}
+						onSelected={this.onPageCompleteHandler}
+						rightAnswer={page.rightAnswer}/>;
 				case PageType.ImageAndText:
 					return <ImageAndTextPage {...commonProps} image={page.image} footerHtml={page.footerHtml} bodyHtml={page.bodyHtml} buttonText={page.buttonText} onBtnClick={this.onPageCompleteHandler}/>;
 				case PageType.EarnThankYou:
 					return <EarnThankYou {...commonProps} isDisplayed={this.state.currentPage === index} closeHandler={this.onPageCompleteHandler} hideTopBarHandler={bridge.hideTopBar} amount={page.description}/>;
 				case PageType.TimedFullPageMultiChoice:
-					return <TimedMultichoiceQuestion {...commonProps} choices={page.question.choices} title={page.description} onSelected={this.onPageCompleteHandler} amount={page.amount} rightAnswer={page.rightAnswer}/>;
+					return <TimedMultichoiceQuestion
+						{...commonProps}
+						choices={page.question.choices}
+						title={page.title}
+						rewardText={page.rewardText}
+						rewardValue={page.rewardValue}
+						onSelected={this.onPageCompleteHandler}
+						amount={page.amount}
+						rightAnswer={page.rightAnswer}/>;
 				case PageType.SuccessBasedThankYou:
 					return <SuccessBasedThankYou {...commonProps} isDisplayed={this.state.currentPage === index} closeHandler={this.onPageCompleteHandler} hideTopBarHandler={bridge.hideTopBar}/>;
 			}
diff --git a/scripts/src/ui/page/earnThankYou.tsx b/scripts/src/ui/page/earnThankYou.tsx
index b7d7be1..a3f086b 100644
--- a/scripts/src/ui/page/earnThankYou.tsx
+++ b/scripts/src/ui/page/earnThankYou.tsx
@@ -22,20 +22,14 @@ export class EarnThankYou extends React.Component<EarnThankYouProps> {
 	}
 
 	public render() {
-		const diamonds = [ "l-1", "l-2", "l-3", "l-4", "c-1", "c-2", "r-3", "r-2", "r-1" ]
-			.map((name, index) => <img key={index} src={getImageUrl("diamond-" + name)} className={"diamond-" + name + " diamonds"}/>);
 		return (
 			<BasePage className="earnThankYou">
-
 				<div className="text">
 					<div>Yay! You've earned</div>
-					<div className="amount">{this.props.amount}</div>
-					<img src={getImageUrl("kin-type")} className="kin-type"/>
+					<span className="amount"><span className="full-width-plus">＋</span><img src={ getImageUrl("kin-coin") } /><span>{this.props.amount}</span></span>
 				</div>
 				<div className={"footer"}>
-					<img src={getImageUrl("coins")} className="coins"/>
-					<img src={getImageUrl("sparks")} className="sparks"/>
-					{diamonds}
+					<img src={ getImageUrl("cheering-hands") } className="cheering-hands"/>
 				</div>
 			</BasePage>
 		);
diff --git a/scripts/src/ui/page/multichoice.question.tsx b/scripts/src/ui/page/multichoice.question.tsx
index fd6d4e9..3c671ae 100644
--- a/scripts/src/ui/page/multichoice.question.tsx
+++ b/scripts/src/ui/page/multichoice.question.tsx
@@ -20,6 +20,8 @@ export interface FullPageMultiChoiceState {
 	wrongAnswer: number | null;
 }
 
+const getImageUrl = (imageName: string) => `https://s3.amazonaws.com/htmlpoll.kinecosystem.com/images/${imageName}.svg`;
+
 export class MultichoiceQuestion<P extends FullPageMultiChoiceProps = FullPageMultiChoiceProps, S extends FullPageMultiChoiceState = FullPageMultiChoiceState> extends React.Component<P, S> {
 	protected additionalClasses = new Set(" ");
 	protected highlightRightWrong = false;
@@ -52,10 +54,19 @@ export class MultichoiceQuestion<P extends FullPageMultiChoiceProps = FullPageMu
 	}
 
 	protected getHeader() {
+		const currentPage = this.props.pageIndex + 1;
+		/* the list is 0 based */
+		const totalQuestionPages = this.props.totalPagesCount - 1;
+		/* the list contains a Thank you page --- a better solution is better */
 		return (
 			<React.Fragment>
-				<div className="title">{this.props.title}</div>
-				<div className="description" dangerouslySetInnerHTML={{ __html: this.props && this.props.description! }}/>
+				<div className="header-controls">
+					<button className="back-nav" onClick={this.props.navigateBack}><img src={ getImageUrl("ic-back") } /></button>
+					<span></span>
+					<div className="pageProgress">{currentPage}/{totalQuestionPages}</div>
+				</div>
+				<span className="title">{this.props.title}</span>
+				<div className="description">{ this.props.rewardText } <span className="description-price"><span className="full-width-plus">＋</span><img src={ getImageUrl("kin-coin") } />{ Number(this.props.rewardValue) }</span> </div>
 			</React.Fragment>
 		);
 	}
diff --git a/scripts/src/ui/page/successBasedThankYou.tsx b/scripts/src/ui/page/successBasedThankYou.tsx
index 36fd500..97ee351 100644
--- a/scripts/src/ui/page/successBasedThankYou.tsx
+++ b/scripts/src/ui/page/successBasedThankYou.tsx
@@ -46,16 +46,12 @@ export class SuccessBasedThankYou extends React.Component<EarnThankYouProps> {
 		return (
 			<React.Fragment>
 				<div className="text">
-					<h1 className={ "" }>Better Luck Next Time!</h1>
-					<h2>Thanks for trying, you've earned</h2>
-					<div className="amount">1</div>
-					<img src={ getImageUrl("kin-type") } className="kin-type"/>
-					<h2>for the effort</h2>
+					<h1>Better luck next time!</h1>
+					<h2>you've earned:</h2>
+					<span className="amount"><span className="full-width-plus">＋</span><img src={ getImageUrl("kin-coin") } /><span>1</span></span>
 				</div>
-				<div className={ "footer" }>
-					<img src={ getImageUrl("coins") } className="coins"/>
-					<img src={ getImageUrl("sparks") } className="sparks"/>
-					{ SuccessBasedThankYou.diamondElements }
+				<div className="footer">
+					<img src={ getImageUrl("cheering-hands") } className="cheering-hands"/>
 				</div>
 			</React.Fragment>
 		);
@@ -65,15 +61,12 @@ export class SuccessBasedThankYou extends React.Component<EarnThankYouProps> {
 		return (
 			<React.Fragment>
 				<div className="text">
-					<h1 className={ "" }>Well Done!</h1>
-					<h2>Yay! You've earned</h2>
-					<div className="amount">{ this.props.sharedData.earnedAmount }</div>
-					<img src={ getImageUrl("kin-type") } className="kin-type"/>
+					<h1>Well Done!</h1>
+					<h2>Yay! You've earned:</h2>
+					<span className="amount"><span className="full-width-plus">＋</span><img src={ getImageUrl("kin-coin") } /><span>{ this.props.sharedData.earnedAmount }</span></span>
 				</div>
-				<div className={ "footer" }>
-					<img src={ getImageUrl("coins") } className="coins"/>
-					<img src={ getImageUrl("sparks") } className="sparks"/>
-					{ SuccessBasedThankYou.diamondElements }
+				<div className="footer">
+					<img src={ getImageUrl("cheering-hands") } className="cheering-hands"/>
 				</div>
 			</React.Fragment>
 		);
@@ -83,15 +76,12 @@ export class SuccessBasedThankYou extends React.Component<EarnThankYouProps> {
 		return (
 			<React.Fragment>
 				<div className="text">
-					<h1 className={ "" }>Perfect Score!</h1>
-					<h2>Yay! You've earned</h2>
-					<div className="amount">{ this.props.sharedData.earnedAmount }</div>
-					<img src={ getImageUrl("kin-type") } className="kin-type"/>
+					<h1>High five!</h1>
+					<h2>Yay! You've earned:</h2>
+					<span className="amount"><span className="full-width-plus">＋</span><img src={ getImageUrl("kin-coin") } /><span>{ this.props.sharedData.earnedAmount }</span></span>
 				</div>
-				<div className={ "footer" }>
-					<img src={ getImageUrl("coins") } className="coins"/>
-					<img src={ getImageUrl("sparks") } className="sparks"/>
-					{ SuccessBasedThankYou.diamondElements }
+				<div className="footer">
+					<img src={ getImageUrl("cheering-hands") } className="cheering-hands"/>
 				</div>
 			</React.Fragment>
 		);
diff --git a/scripts/src/ui/page/timed.multichoice.question.tsx b/scripts/src/ui/page/timed.multichoice.question.tsx
index 1b8400d..5128515 100644
--- a/scripts/src/ui/page/timed.multichoice.question.tsx
+++ b/scripts/src/ui/page/timed.multichoice.question.tsx
@@ -19,6 +19,8 @@ interface TimerState {
 	time: number;
 }
 
+const getImageUrl = (imageName: string) => `https://s3.amazonaws.com/htmlpoll.kinecosystem.com/images/${imageName}.svg`;
+
 class Timer extends React.Component<TimerProps, TimerState> {
 	constructor(props: TimerProps) {
 		super(props);
@@ -39,7 +41,7 @@ class Timer extends React.Component<TimerProps, TimerState> {
 		);
 	}
 
-	public componentDidMount() {  // First timer won't get componentDidUpdate
+	public componentDidMount() {  // First timer won"t get componentDidUpdate
 		setTimeout(this.updateTime, 1000);
 	}
 
@@ -67,9 +69,13 @@ class TimedMultichoiceQuestion extends MultichoiceQuestion {
 		/* the list contains a Thank you page --- a better solution is better */
 		return (
 			<React.Fragment>
-				<Timer parent={this.props.pageIndex} pause={!this.props.isDisplayed} time={quizTimerTime} callback={this.onSelect.bind(this, null, -1)}/>
-				<div className={"pageProgress"}>{currentPage}/{totalQuestionPages}</div>
-				<div className="title">{this.props.title}</div>
+				<div className="header-controls">
+					<button className="back-nav" onClick={this.props.navigateBack}><img src={ getImageUrl("ic-back") } /></button>
+					<Timer parent={this.props.pageIndex} pause={!this.props.isDisplayed} time={quizTimerTime} callback={this.onSelect.bind(this, null, -1)}/>
+					<div className="pageProgress">{currentPage}/{totalQuestionPages}</div>
+				</div>
+				<p className="title">{this.props.title}</p>
+				<div className="description">{ this.props.rewardText } <span className="description-price"><span className="full-width-plus">＋</span><img src={ getImageUrl("kin-coin") } />{ Number(this.props.rewardValue) }</span> </div>
 			</React.Fragment>
 		);
 	}
diff --git a/styles/src/app.styl b/styles/src/app.styl
index 1f9a21b..35f3784 100644
--- a/styles/src/app.styl
+++ b/styles/src/app.styl
@@ -1,13 +1,18 @@
-html, body, #root, .app,  .slider-wrapper, .slider-wrapper .slider.animated
-	width: 100%
-	height: 100%
-	padding: 0
-	margin: 0
-
-.carouselWrapper, .react-swipeable-view-container
-	width: 100%
-	height: 100%
-
-.react-swipeable-view-container > div
-	position relative
-
+html, body, #root, .app,  .slider-wrapper, .slider-wrapper .slider.animated
+	width: 100%
+	height: 100%
+	padding: 0
+	margin: 0
+	text-align: center
+
+.app
+	background-color #1f1f1f
+	color: #fff
+
+.carouselWrapper, .react-swipeable-view-container
+	width: 100%
+	height: 100%
+
+.react-swipeable-view-container > div
+	position relative
+
diff --git a/styles/src/common.styl b/styles/src/common.styl
index 16dfd0d..1210834 100644
--- a/styles/src/common.styl
+++ b/styles/src/common.styl
@@ -1,45 +1,48 @@
-/*** Colors ***/
-$deep-sky-blue = #047cfc
-$blue-grey = #7884a5
-$bright-sky-blue = #08c6f1
-$bright-blue = #0262ff
-$green-blue = #00d093
-$watermelon = #ff4b67
-
-/*** Mixins ***/
-flex-box($direction = row, $justify = flex-start, $align = stretch)
-	// $align only supports stretch and center
-	// $direction only supports row and column
-	display: -webkit-box
-	display: -webkit-flex
-	display: flex
-	-webkit-justify-content: $justify
-	justify-content: $justify
-	-webkit-flex-direction: $direction
-	flex-direction: $direction
-	-webkit-align-items: $align
-	align-items: $align
-
-font-roboto()
-	font-family: 'Roboto', 'San Francisco', sans-serif
-	font-weight: normal
-	font-style: normal
-	font-stretch: normal
-	line-height: normal
-
-btn()
-	border-radius: 60px
-	width: 80vw
-	height: 11.7vw
-	padding: 2vw
-	font-size: 4.2vw
-	border: solid 1px #7884a5
-	outline none
-
-btn-active()
-	background-color: #047cfc
-	border-color: #047cfc
-	color white
-
-.hidden
-	display: none
+/*** Colors ***/
+$deep-sky-blue = #047cfc
+$blue-grey = #7884a5
+$bright-sky-blue = #08c6f1
+$bright-blue = #0262ff
+$green-blue = #00d093
+$watermelon = #ff4b67
+$kin-purple = #6F41E8;
+
+/*** Mixins ***/
+flex-box($direction = row, $justify = flex-start, $align = stretch)
+	// $align only supports stretch and center
+	// $direction only supports row and column
+	display: -webkit-box
+	display: -webkit-flex
+	display: flex
+	-webkit-justify-content: $justify
+	justify-content: $justify
+	-webkit-flex-direction: $direction
+	flex-direction: $direction
+	-webkit-align-items: $align
+	align-items: $align
+
+font-roboto()
+	font-family: 'Roboto', 'San Francisco', sans-serif
+	font-weight: normal
+	font-style: normal
+	font-stretch: normal
+	line-height: normal
+
+btn()
+	border-radius: 5px
+	width: 86vw
+	height: 15vw
+	font-size: 4.2vw
+	border: solid 1px #3d3d3d
+	outline none
+
+btn-active()
+	background-color: $kin-purple
+	color white
+
+.hidden
+	display: none
+
+.kin-purple
+	color: $kin-purple;
+
diff --git a/styles/src/page/base.styl b/styles/src/page/base.styl
index 8ccfbef..85d5418 100644
--- a/styles/src/page/base.styl
+++ b/styles/src/page/base.styl
@@ -1,15 +1,15 @@
-.page-container
-	width: 100%
-	height: 100%
-	padding: 0
-	margin: 0
-	.page
-		width: 100%
-		height: 100%
-		margin: 0
-		position relative
-		.header
-			border: none
-			border-bottom: solid 1px #d7dce9
-			flex-box(column)
-
+.page-container
+	width: 100%
+	height: 100%
+	padding: 0
+	margin: 0
+	.page
+		width: 100%
+		height: 100%
+		margin: 0
+		position relative
+		.header
+			border: none
+			border-bottom: solid 1px #3d3d3d
+			flex-box(column)
+
diff --git a/styles/src/page/earnThankYou.styl b/styles/src/page/earnThankYou.styl
index b45b955..67c0855 100644
--- a/styles/src/page/earnThankYou.styl
+++ b/styles/src/page/earnThankYou.styl
@@ -7,7 +7,7 @@
 	width: 100%
 	height: 100%
 	flex-box(column)  // This is kind of a hack to make it full screen
-	background-image: linear-gradient(7deg, $bright-sky-blue, $bright-blue)
+	background-image: #1f1f1f
 	.text
 		font-roboto()
 		color: white
@@ -16,11 +16,11 @@
 		font-size: 8vw
 		margin: 30vh 0 0
 		h1
-			font-size: 10vw
-			margin: 6vh 0 0;
+			font-size: 1.2rem
+			margin: 6vh 0 .5rem;
 			font-roboto()
 		h2
-			font-size: 6vw
+			font-size: 1.2rem
 			margin: 0;
 			font-roboto()
 		.standAloneText
@@ -28,55 +28,20 @@
 			font-size: 8vw
 			font-roboto()
 		.amount
-			font-weight: bold
-			font-size: 16vw
-		.kin-type
-			width: 16vw
+			font-weight: 500
+			font-size: 12vw
+			color: $kin-purple
+			> *
+				vertical-align: middle
+			.full-width-plus
+				font-size: 7vw
+			img
+				width: 1.3rem
+				margin-right: .4rem
 	.footer
 		img
 			position: absolute
-		.diamonds
-			width: 7vw;
-		.coins
-			bottom: 0
-			left: 0
-			width: 100%
-		.sparks
-			bottom: 0
-			left: 0
-			width: 100%
-			object-fit: contain
-		.diamond-l-1
-			left: 1vw;
-			bottom: 9.4vw;
-		.diamond-l-2
-			left: 11vw;
-			bottom: 19vw;
-		.diamond-l-3
-			left: 18vw;
-			bottom: 30vw;
-			width: 10vw
-		.diamond-l-4
-			left: 39vw;
-			bottom: 28vw;
-		.diamond-c-1
-			left: 37.5vw;
-			bottom: 6vw;
-		.diamond-c-2
-			left: 53vw;
-			bottom: 17vw;
-			width: 8vw
-		.diamond-r-3
-			left: 68.3vw;
-			bottom: 22.3vw;
-			width: 8.3vw
-		.diamond-r-2
-			left: 83vw;
-			bottom: 25vw;
-			width: 9.1vw
-		.diamond-r-1
-			left: 84vw;
-			bottom: 13.3vw;
-			width: 8.2vw
-
-
+			&.cheering-hands
+				width: 100%
+				left: 0
+				bottom: 0
diff --git a/styles/src/page/multichoice.question.styl b/styles/src/page/multichoice.question.styl
index 89cab24..44700d6 100644
--- a/styles/src/page/multichoice.question.styl
+++ b/styles/src/page/multichoice.question.styl
@@ -1,39 +1,66 @@
-@require "../common.styl"
-
-.page.question.multichoice
-	width: 100%
-	font-roboto()
-	.header
-		.title
-			text-align: center
-			width: 72vw
-			font-size: 6.2vw
-			letter-spacing: -0.5px
-			color: #047cfc
-			margin: 10% auto 1%
-
-		.description
-			text-align: center
-			margin: 3vh auto
-			color: #7884a5
-			font-size: 3.5vw
-
-	.choices
-		margin: 6% auto 0
-		flex-box(column)
-	.choice
-		position relative
-		btn()
-		margin: 5% 11%
-		background: white
-		color: #7884a5
-		outline none
-		&.rightAnswer
-			btn-active()
-		&.wrongAnswer
-			border solid 3px $watermelon
-	&:not(.highlightRightWrong)
-		.choices
-			.choice
-				&.selected
-					btn-active()
+@require "../common.styl"
+
+.page.question.multichoice
+	width: 100%
+	font-roboto()
+	.header
+		width: 86%
+		margin: 10% auto 0
+		.header-controls
+			flex-box()
+			justify-content: space-between
+			align-items: center
+			font-size: 6.2vw
+		.title
+			display: inline-block
+			width: 72vw
+			margin: 0.1rem auto 8%
+			font-weight: 500
+		button.back-nav
+			-webkit-appearance: none
+			border: none
+			background: none
+			padding: 0
+			img
+				width: 2rem
+
+		.description
+			margin: 3vh auto
+			font-size: .9rem
+			.description-price
+				display: -webkit-inline-flex
+				display: -moz-inline-flex
+				display: -ms-inline-flex
+				display: -o-inline-flex
+				display: inline-flex
+				align-items: center
+				vertical-align: middle
+				color: $kin-purple
+				line-height: 90%
+
+				img
+					width: 7px
+					margin-right: 3px
+				.full-width-plus
+					font-size: .8rem
+					font-weight bold
+	.choices
+		margin: 6% auto 0
+		flex-box(column)
+	.choice
+		position relative
+		btn()
+		margin: 4% auto
+		background: inherit
+		color: currentColor
+		outline none
+		font-size:.9rem
+		&.rightAnswer
+			btn-active()
+		&.wrongAnswer
+			border solid 3px $watermelon
+	&:not(.highlightRightWrong)
+		.choices
+			.choice
+				&.selected
+					btn-active()
diff --git a/styles/src/page/timed.multichoice.question.styl b/styles/src/page/timed.multichoice.question.styl
index dd3f9bc..926020b 100644
--- a/styles/src/page/timed.multichoice.question.styl
+++ b/styles/src/page/timed.multichoice.question.styl
@@ -1,37 +1,35 @@
-@require "../common.styl"
-
-.page.question.multichoice.timed
-	.header
-		.timer
-			width: 15vw
-			font-size: 6.2vw
-			text-align: center
-			letter-spacing: -0.5px
-			margin: 10% auto 1%
-			font-roboto()
-			color: $green-blue
-			&.warn
-				color: $watermelon
-
-		.pageProgress
-			font-roboto()
-			font-weight: bold;
-			width: 12vw
-			font-size: 4.5vw
-			text-align: center
-			letter-spacing: -0.5px
-			margin: 5% auto 1%
-			color: $deep-sky-blue
-
-		.title
-			margin: 2% auto 10%
-	.choices
-		.choice
-			.receivedAmount
-				opacity 0
-				transition: all .5s ease;
-				position absolute
-				right 5vw
-			&.selected.rightAnswer
-				.receivedAmount
-					opacity 1
+@require "../common.styl"
+
+.page.question.multichoice.timed
+	.header
+		.timer
+			//width: 15vw
+			font-size: 1.3rem
+			//text-align: center
+			letter-spacing: -0.5px
+			color: #ea690b
+			font-roboto()
+			&.warn
+				color: $watermelon
+
+		.pageProgress
+			font-roboto()
+			font-weight: bold;
+			width: 12vw
+			font-size: 4.5vw
+			text-align: center
+			letter-spacing: -0.5px
+			// margin: 5% auto 1%
+
+		.title
+			margin: 2% auto 10%
+	.choices
+		.choice
+			.receivedAmount
+				opacity 0
+				transition: all .5s ease;
+				position absolute
+				right 5vw
+			&.selected.rightAnswer
+				.receivedAmount
+					opacity 1
diff --git a/updateJsonSchema.js b/updateJsonSchema.js
new file mode 100644
index 0000000..c69048c
--- /dev/null
+++ b/updateJsonSchema.js
@@ -0,0 +1,43 @@
+/**
+ * make console-docker -> .admin -> const offer_contents = (await OfferContent.find())
+ *
+ * @return     {OfferContent[]}  repl can resolve promises
+ */
+const offer_contents = (await OfferContent.find())
+
+async function updatePolls() {
+	for (let i = 0; i < offer_contents.length; i++) {
+		const oc = offer_contents[i];
+		const pageTypeNum = 0;
+		if (oc.contentType !== 'poll') { continue; }; // I divided polls and quizzes to two separate calls
+		const content = JSON.parse(oc.content);
+		content.pages.forEach(page => {
+			if (page.type !== pageTypeNum) { return false; }
+			page.rewardText = page.title.replace(/ \${amount}.*/, '');
+			page.rewardValue = '${amount}';
+			page.title = '';
+		});
+		oc.content = JSON.stringify(content);
+		await oc.save();
+	}
+}
+
+async function updateQuizzes() {
+	for (let i = 0; i < offer_contents.length; i++) {
+		const oc = offer_contents[i];
+		const pageTypeNum = 3;
+		if (oc.contentType !== 'quiz') { continue; }; // I divided polls and quizzes to two separate calls
+		const content = JSON.parse(oc.content);
+		content.pages.forEach(page => {
+			if (page.type !== pageTypeNum) { return false; }
+			page.rewardText = page.description.replace(/ \${amount}.*/, '');
+			page.rewardValue = '${amount}';
+			page.description = '';
+		});
+		oc.content = JSON.stringify(content);
+		await oc.save();
+	}
+}
+
+await updatePolls();
+await updateQuizzes();
