QC14-Badge-Webview/qcbadge/Views/Home/Index.cshtml
2017-07-25 17:11:27 -07:00

791 lines
26 KiB
Plaintext

@{
ViewData["Title"] = "Map View";
bool[] showimg = new bool[50];
for (int i = 0; i < 50; i++)
{
showimg[i] = Convert.ToBoolean(ViewData[i.ToString()]);
}
string[] imgname = new string[100];
imgname[0] = "/images/1-eb466664-61c2-11e7-a8e6-876b73c3292d.png";
imgname[1] = "/images/2-eb467672-61c2-11e7-a8e7-bfbec3058f18.png";
imgname[2] = "/images/3-eb467b68-61c2-11e7-a8e8-bf5dcee8f5a4.png";
imgname[3] = "/images/4-eb468036-61c2-11e7-a8e9-8fa59b75eeab.png";
imgname[4] = "/images/5-eb4683ce-61c2-11e7-a8ea-2fb6e98c9f95.png";
imgname[5] = "/images/6-eb4689c8-61c2-11e7-a8eb-b7408fd42ab8.png";
imgname[6] = "/images/7-eb468e50-61c2-11e7-a8ec-1f2ea9f0ab82.png";
imgname[7] = "/images/8-eb46929c-61c2-11e7-a8ed-8b3acc903f02.png";
imgname[8] = "/images/9-eb469634-61c2-11e7-a8ee-c739d63aed77.png";
imgname[9] = "/images/10-eb469e40-61c2-11e7-a8ef-aff04cd092f4.png";
imgname[10] = "/images/11-eb46ccc6-61c2-11e7-a8f0-2ba14a609735.png";
imgname[11] = "/images/12-eb46e54e-61c2-11e7-a8f1-ffed42a32cd8.png";
imgname[12] = "/images/13-eb473be8-61c2-11e7-a8f2-97169bffdcdc.png";
imgname[13] = "/images/14-eb4757ea-61c2-11e7-a8f3-a758b83c2fd9.png";
imgname[14] = "/images/15-eb476f3c-61c2-11e7-a8f4-0bc4085c363a.png";
imgname[15] = "/images/16-eb478346-61c2-11e7-a8f5-9be54b52f15a.png";
imgname[16] = "/images/17-eb479746-61c2-11e7-a8f6-1b0d93caff33.png";
imgname[17] = "/images/18-eb47a9b6-61c2-11e7-a8f7-9f3b1ad0a5a8.png";
imgname[18] = "/images/19-eb48481c-61c2-11e7-a8f8-6f45fa8c1975.png";
imgname[19] = "/images/20-eb48689c-61c2-11e7-a8f9-539d89786ce3.png";
imgname[20] = "/images/21-eb4883fe-61c2-11e7-a8fa-afd62b20ce4e.png";
imgname[21] = "/images/22-eb489934-61c2-11e7-a8fb-5bfa98429be6.png";
imgname[22] = "/images/23-eb48afbe-61c2-11e7-a8fc-afcec996e426.png";
imgname[23] = "/images/24-eb48c526-61c2-11e7-a8fd-83245fd2c36f.png";
imgname[24] = "/images/25-eb48dc0a-61c2-11e7-a8fe-cb747a657a8b.png";
imgname[25] = "/images/26-eb48f1f4-61c2-11e7-a8ff-43cc47b01ac5.png";
imgname[26] = "/images/27-eb4908e2-61c2-11e7-a900-637b158b5adf.png";
imgname[27] = "/images/28-eb49232c-61c2-11e7-a901-ebf4867570bd.png";
imgname[28] = "/images/29-eb4955b8-61c2-11e7-a902-0b0d12e5a8f4.png";
imgname[29] = "/images/30-eb4a1fa2-61c2-11e7-a903-f7eca7a7f055.png";
imgname[30] = "/images/31-eb4a3b68-61c2-11e7-a904-63fa9e2c47b0.png";
imgname[31] = "/images/32-eb4a4f9a-61c2-11e7-a905-dbe0daf1a7ce.png";
imgname[32] = "/images/33-eb4a6a3e-61c2-11e7-a906-9f652af3f189.png";
imgname[33] = "/images/34-eb4a7fba-61c2-11e7-a907-cb5a4cba0a56.png";
imgname[34] = "/images/35-eb4a9f40-61c2-11e7-a908-ff06d36f3dcd.png";
imgname[35] = "/images/36-eb4ab2a0-61c2-11e7-a909-075d9873cefd.png";
imgname[36] = "/images/37-eb4ac600-61c2-11e7-a90a-c7db722031cf.png";
imgname[37] = "/images/38-eb4addf2-61c2-11e7-a90b-17d8801a3416.png";
imgname[38] = "/images/39-eb4af26a-61c2-11e7-a90c-1300b2d20958.png";
imgname[39] = "/images/40-eb4b0dea-61c2-11e7-a90d-1fb8e62fdf32.png";
imgname[40] = "/images/41-eb4b2550-61c2-11e7-a90e-2b83f972e68d.png";
imgname[41] = "/images/42-eb4b3b58-61c2-11e7-a90f-f73233bbb2e0.png";
imgname[42] = "/images/43-eb4b51ba-61c2-11e7-a910-0746d91b5694.png";
imgname[43] = "/images/44-eb4c48ea-61c2-11e7-a911-b7d36247c7ba.png";
imgname[44] = "/images/45-eb4c97c8-61c2-11e7-a912-cfe6b83218f4.png";
imgname[45] = "/images/46-eb4cb6b8-61c2-11e7-a913-97241579840b.png";
imgname[46] = "/images/47-eb4ccdb0-61c2-11e7-a914-1b987c8ad9d8.png";
imgname[47] = "/images/48-eb4ce412-61c2-11e7-a915-d794e6b54cea.png";
imgname[48] = "/images/49-eb4cf9ca-61c2-11e7-a916-0ff9007929d3.png";
imgname[49] = "/images/50-eb4d0ef6-61c2-11e7-a917-336b0f829aba.png";
imgname[98] = "/images/clear2.png";
imgname[99] = "/images/clear.png";
string[] img = new string[50];
for (int i = 0; i < 50; i++)
{
if (showimg[i])
{
img[i] = imgname[i];
}
else
{
if (i == 4)
{
img[i] = imgname[98];
}
else
{
img[i] = imgname[99];
}
}
}
}
<!-- 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]">
</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[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>
<div class="square">
<div class="content">
<img class="icon" src="@img[1]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[2]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/right.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[3]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/right.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[39]">
</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>
<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/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">
</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/up.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/lowerright.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"> </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>
<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[4]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[5]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[6]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[7]">
</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[8]">
</div>
</div>
<div class="square"><div class="content"> </div></div>
<div class="square">
<div class="content">
<img class="icon" src="@img[9]">
</div>
</div>
<div class="square"><div class="content"> </div></div>
<div class="square">
<div class="content">
<img class="icon" src="@img[10]">
</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>
<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">
</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/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>
<div class="square">
<div class="content">
<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>
<div class="square">
<div class="content">
<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>
<!-- ROW 3 -->
<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[11]">
</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="icon" src="@img[12]">
</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[13]">
</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[14]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/right.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[15]">
</div>
</div>
<!-- ROW 3 ARROWS -->
<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"> </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/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>
<div class="square">
<div class="content">
<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>
<div class="square">
<div class="content">
<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>
<!-- ROW 4 -->
<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="icon" src="@img[16]">
</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[17]">
</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[18]">
</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[19]">
</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>
<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/down.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/lowerright.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"> </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">
</div>
</div>
<div class="square">
<div class="content">
<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>
<!-- ROW 5 -->
<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[20]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[21]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[22]">
</div>
</div>
<div class="square"><div class="content"> </div></div>
<div class="square">
<div class="content">
<img class="icon" src="@img[23]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/right.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[24]">
</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="icon" src="@img[25]">
</div>
</div>
<div class="square"><div class="content"> </div></div>
<div class="square">
<div class="content">
<img class="icon" src="@img[26]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/right.png">
</div>
</div>
<div class="square">
<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>
<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/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"> </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"> </div></div>
<div class="square"><div class="content"> </div></div>
<div class="square">
<div class="content">
<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>
<!-- ROW 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>
<div class="square">
<div class="content">
<img class="icon" src="@img[27]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[28]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/right.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[29]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/right.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[41]">
</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"> </div></div>
<div class="square"><div class="content"> </div></div>
<div class="square">
<div class="content">
<img class="icon" src="@img[30]">
</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>
<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/down.png">
</div>
</div>
<div class="square">
<div class="content">
<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">
</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"> </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">
</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>
<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[31]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[32]">
</div>
</div>
<div class="square"><div class="content"> </div></div>
<div class="square">
<div class="content">
<img class="icon" src="@img[33]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/right.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[34]">
</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"> </div></div>
<div class="square"><div class="content"> </div></div>
<div class="square">
<div class="content">
<img class="icon" src="@img[35]">
</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>
<div class="square"><div class="content"> </div></div>
<div class="square">
<div class="content">
<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">
</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"> </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"> </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">
<img class="icon" src="@img[36]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[37]">
</div>
</div>
<div class="square">
<div class="content">
<img class="arrow" src="/images/left.png">
</div>
</div>
<div class="square">
<div class="content">
<img class="icon" src="@img[38]">
</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"> </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"> </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>@ViewData["Message"]</div>