diff --git a/qcbadge/Views/Home/Index.cshtml b/qcbadge/Views/Home/Index.cshtml
index de96bd5..306b2e7 100644
--- a/qcbadge/Views/Home/Index.cshtml
+++ b/qcbadge/Views/Home/Index.cshtml
@@ -83,14 +83,15 @@
 
 
 }
-<!-- ROW ONE -->
+
+        <!-- ROW ONE -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="icon" src="@img[0]">
+        <img class="icon" src="images/clear.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -98,7 +99,7 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="icon" src="@img[40]">
+        <img class="icon" src="images/clear.png">
     </div>
 </div>
 
@@ -107,42 +108,41 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="icon" src="@img[1]">
+        <img class="icon" src="images/clear.png">
     </div>
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 <div class="square">
     <div class="content">
-        <img class="icon" src="@img[2]">
+        <img class="icon" src="images/clear.png">
     </div>
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/right.png">
+        <img class="arrow" src="images/right.png">
     </div>
 </div>
 <div class="square">
     <div class="content">
-        <img class="icon" src="@img[3]">
+        <img class="icon" src="images/clear.png">
     </div>
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/right.png">
+        <img class="arrow" src="images/right.png">
     </div>
 </div>
 <div class="square">
     <div class="content">
-        <img class="icon" src="@img[39]">
+        <img class="icon" src="@img[40]">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
 <!-- ROW 1 ARROWS -->
 
 <div class="square"><div class="content"> </div></div>
@@ -152,14 +152,14 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/upperleft.png">
+        <img class="arrow" src="images/upperleft.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/up.png">
+        <img class="arrow" src="images/up.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -169,13 +169,13 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/up.png">
+        <img class="arrow" src="images/up.png">
     </div>
 </div>
 
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/lowerright.png">
+        <img class="arrow" src="images/lowerright.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -183,7 +183,7 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 2 -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -191,12 +191,12 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="icon" src="@img[4]">
+        <img class="icon" src="images/clear2.png">
     </div>
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 <div class="square">
@@ -206,7 +206,7 @@
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 <div class="square">
@@ -216,7 +216,7 @@
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 <div class="square">
@@ -247,7 +247,7 @@
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 2 ARROWS -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -256,7 +256,7 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/lowerleft.png">
+        <img class="arrow" src="images/lowerleft.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -265,7 +265,7 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/up.png">
+        <img class="arrow" src="images/up.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -273,7 +273,7 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/up.png">
+        <img class="arrow" src="images/up.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -281,12 +281,12 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/up.png">
+        <img class="arrow" src="images/up.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 3 -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -326,7 +326,7 @@
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/right.png">
+        <img class="arrow" src="images/right.png">
     </div>
 </div>
 <div class="square">
@@ -334,7 +334,7 @@
         <img class="icon" src="@img[15]">
     </div>
 </div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 3 ARROWS -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -348,7 +348,7 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/up.png">
+        <img class="arrow" src="images/up.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -356,7 +356,7 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/up.png">
+        <img class="arrow" src="images/up.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -364,12 +364,12 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/up.png">
+        <img class="arrow" src="images/up.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 4 -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -408,7 +408,7 @@
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 4 ARROWS -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -418,15 +418,12 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/down.png">
+        <img class="arrow" src="images/down.png">
     </div>
 </div>
-<div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/down.png">
+        <img class="arrow" src="images/lowerright.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -435,19 +432,22 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
+<div class="square"><div class="content"> </div></div>
+<div class="square"><div class="content"> </div></div>
+<div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/lowerleft.png">
+        <img class="arrow" src="images/lowerleft.png">
     </div>
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/down.png">
+        <img class="arrow" src="images/down.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 5 -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -459,7 +459,7 @@
 
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 <div class="square">
@@ -470,7 +470,7 @@
 
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 
@@ -480,8 +480,6 @@
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
         <img class="icon" src="@img[23]">
@@ -490,7 +488,7 @@
 
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/right.png">
+        <img class="arrow" src="images/right.png">
     </div>
 </div>
 
@@ -502,6 +500,8 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
+<div class="square"><div class="content"> </div></div>
+<div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
         <img class="icon" src="@img[25]">
@@ -513,9 +513,17 @@
         <img class="icon" src="@img[26]">
     </div>
 </div>
-<div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+<div class="square">
+    <div class="content">
+        <img class="arrow" src="images/right.png">
+    </div>
+</div>
+<div class="square">s
+    <div class="content">
+        <img class="icon" src="@img[43]">
+    </div>
+</div>
+
 <!-- ROW 5 ARROWS -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -525,7 +533,7 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/down.png">
+        <img class="arrow" src="images/down.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -541,12 +549,12 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/down.png">
+        <img class="arrow" src="images/down.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 6 -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -559,7 +567,7 @@
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 <div class="square">
@@ -569,7 +577,7 @@
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/right.png">
+        <img class="arrow" src="images/right.png">
     </div>
 </div>
 <div class="square">
@@ -580,7 +588,7 @@
 
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/right.png">
+        <img class="arrow" src="images/right.png">
     </div>
 </div>
 <div class="square">
@@ -602,7 +610,7 @@
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 6 ARROWS -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -612,19 +620,19 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/down.png">
+        <img class="arrow" src="images/down.png">
     </div>
 </div>
 
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/lowerright.png">
+        <img class="arrow" src="images/lowerright.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/lowerright.png">
+        <img class="arrow" src="images/lowerright.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -637,12 +645,12 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/down.png">
+        <img class="arrow" src="images/down.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 7 -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -655,7 +663,7 @@
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 <div class="square">
@@ -671,7 +679,7 @@
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/right.png">
+        <img class="arrow" src="images/right.png">
     </div>
 </div>
 <div class="square">
@@ -693,7 +701,7 @@
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 7 ARROWS -->
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
@@ -701,13 +709,13 @@
 
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/lowerleft.png">
+        <img class="arrow" src="images/lowerleft.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/lowerleft.png">
+        <img class="arrow" src="images/lowerleft.png">
     </div>
 </div>
 <div class="square"><div class="content"> </div></div>
@@ -725,7 +733,7 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>
+
 <!-- ROW 8 -->
 <div class="square">
     <div class="content">
@@ -734,7 +742,7 @@
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 <div class="square">
@@ -744,7 +752,7 @@
 </div>
 <div class="square">
     <div class="content">
-        <img class="arrow" src="/images/left.png">
+        <img class="arrow" src="images/left.png">
     </div>
 </div>
 <div class="square">
@@ -768,7 +776,6 @@
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
 <div class="square"><div class="content"> </div></div>
-<div class="square"><div class="content"> </div></div>