Update block art.

21 files changed, 493 insertions, 444 deletions

diff --git a/blocks_caesar.1x.png b/blocks_caesar.1x.png
new file mode 100644
index 0000000..f3c4992
--- /dev/null
+++ b/blocks_caesar.1x.png
diff --git a/blocks_caesar.1x.webp b/blocks_caesar.1x.webp
new file mode 100644
index 0000000..6f942c6
--- /dev/null
+++ b/blocks_caesar.1x.webp
diff --git a/blocks_caesar.2x.png b/blocks_caesar.2x.png
new file mode 100644
index 0000000..5f19d7e
--- /dev/null
+++ b/blocks_caesar.2x.png
diff --git a/blocks_caesar.2x.webp b/blocks_caesar.2x.webp
new file mode 100644
index 0000000..43c081c
--- /dev/null
+++ b/blocks_caesar.2x.webp
diff --git a/blocks_cleopatra.1x.png b/blocks_cleopatra.1x.png
new file mode 100644
index 0000000..51cc24c
--- /dev/null
+++ b/blocks_cleopatra.1x.png
diff --git a/blocks_cleopatra.1x.webp b/blocks_cleopatra.1x.webp
new file mode 100644
index 0000000..4e73cfd
--- /dev/null
+++ b/blocks_cleopatra.1x.webp
diff --git a/blocks_cleopatra.2x.png b/blocks_cleopatra.2x.png
new file mode 100644
index 0000000..81b47b2
--- /dev/null
+++ b/blocks_cleopatra.2x.png
diff --git a/blocks_cleopatra.2x.webp b/blocks_cleopatra.2x.webp
new file mode 100644
index 0000000..49f95b8
--- /dev/null
+++ b/blocks_cleopatra.2x.webp
diff --git a/blocks_columbia.css b/blocks_columbia.css
deleted file mode 100644
index 30935ad..0000000
--- a/blocks_columbia.css
+++ /dev/null
@@ -1,69 +0,0 @@
-.columbia-labels .known.block {
-	background-image: url('blocks_columbia.jpg');
-	background-repeat: no-repeat;
-	background-size: 496px 496px;
-}
-
-.columbia-labels .known.block_0{background-position:-3px -3px}
-.columbia-labels .known.block_1{background-position:-65px -3px}
-.columbia-labels .known.block_2{background-position:-127px -3px}
-.columbia-labels .known.block_3{background-position:-189px -3px}
-.columbia-labels .known.block_4{background-position:-251px -3px}
-.columbia-labels .known.block_5{background-position:-313px -3px}
-.columbia-labels .known.block_6{background-position:-375px -3px}
-.columbia-labels .known.block_7{background-position:-437px -3px}
-.columbia-labels .known.block_8{background-position:-3px -65px}
-.columbia-labels .known.block_9{background-position:-65px -65px}
-.columbia-labels .known.block_10{background-position:-127px -65px}
-.columbia-labels .known.block_11{background-position:-189px -65px}
-.columbia-labels .known.block_12{background-position:-251px -65px}
-.columbia-labels .known.block_13{background-position:-313px -65px}
-.columbia-labels .known.block_14{background-position:-375px -65px}
-.columbia-labels .known.block_15{background-position:-437px -65px}
-.columbia-labels .known.block_16{background-position:-3px -127px}
-.columbia-labels .known.block_17{background-position:-65px -127px}
-.columbia-labels .known.block_18{background-position:-127px -127px}
-.columbia-labels .known.block_19{background-position:-189px -127px}
-.columbia-labels .known.block_20{background-position:-251px -127px}
-.columbia-labels .known.block_21{background-position:-313px -127px}
-.columbia-labels .known.block_22{background-position:-375px -127px}
-.columbia-labels .known.block_23{background-position:-437px -127px}
-.columbia-labels .known.block_24{background-position:-3px -189px}
-.columbia-labels .known.block_25{background-position:-65px -189px}
-.columbia-labels .known.block_26{background-position:-127px -189px}
-.columbia-labels .known.block_27{background-position:-189px -189px}
-.columbia-labels .known.block_28{background-position:-251px -189px}
-.columbia-labels .known.block_29{background-position:-313px -189px}
-.columbia-labels .known.block_30{background-position:-375px -189px}
-.columbia-labels .known.block_31{background-position:-437px -189px}
-.columbia-labels .known.block_32{background-position:-3px -251px}
-.columbia-labels .known.block_33{background-position:-65px -251px}
-.columbia-labels .known.block_34{background-position:-127px -251px}
-.columbia-labels .known.block_35{background-position:-189px -251px}
-.columbia-labels .known.block_36{background-position:-251px -251px}
-.columbia-labels .known.block_37{background-position:-313px -251px}
-.columbia-labels .known.block_38{background-position:-375px -251px}
-.columbia-labels .known.block_39{background-position:-437px -251px}
-.columbia-labels .known.block_40{background-position:-3px -313px}
-.columbia-labels .known.block_41{background-position:-65px -313px}
-.columbia-labels .known.block_42{background-position:-127px -313px}
-.columbia-labels .known.block_43{background-position:-189px -313px}
-.columbia-labels .known.block_44{background-position:-251px -313px}
-.columbia-labels .known.block_45{background-position:-313px -313px}
-.columbia-labels .known.block_46{background-position:-375px -313px}
-.columbia-labels .known.block_47{background-position:-437px -313px}
-.columbia-labels .known.block_48{background-position:-3px -375px}
-.columbia-labels .known.block_49{background-position:-65px -375px}
-.columbia-labels .known.block_50{background-position:-127px -375px}
-.columbia-labels .known.block_51{background-position:-189px -375px}
-.columbia-labels .known.block_52{background-position:-251px -375px}
-.columbia-labels .known.block_53{background-position:-313px -375px}
-.columbia-labels .known.block_54{background-position:-375px -375px}
-.columbia-labels .known.block_55{background-position:-437px -375px}
-.columbia-labels .known.block_56{background-position:-3px -437px}
-.columbia-labels .known.block_57{background-position:-65px -437px}
-.columbia-labels .known.block_58{background-position:-127px -437px}
-.columbia-labels .known.block_59{background-position:-189px -437px}
-.columbia-labels .known.block_60{background-position:-251px -437px}
-.columbia-labels .known.block_61{background-position:-313px -437px}
-.columbia-labels .known.block_62{background-position:-375px -437px}
diff --git a/blocks_columbia.jpg b/blocks_columbia.jpg
deleted file mode 100644
index a5e2f37..0000000
--- a/blocks_columbia.jpg
+++ /dev/null
diff --git a/blocks_columbia.png b/blocks_columbia.png
deleted file mode 100644
index 1d9fde6..0000000
--- a/blocks_columbia.png
+++ /dev/null
diff --git a/blocks_pompeius.1x.png b/blocks_pompeius.1x.png
new file mode 100644
index 0000000..fe24eb3
--- /dev/null
+++ b/blocks_pompeius.1x.png
diff --git a/blocks_pompeius.1x.webp b/blocks_pompeius.1x.webp
new file mode 100644
index 0000000..72c01fa
--- /dev/null
+++ b/blocks_pompeius.1x.webp
diff --git a/blocks_pompeius.2x.png b/blocks_pompeius.2x.png
new file mode 100644
index 0000000..07948dc
--- /dev/null
+++ b/blocks_pompeius.2x.png
diff --git a/blocks_pompeius.2x.webp b/blocks_pompeius.2x.webp
new file mode 100644
index 0000000..cbda71b
--- /dev/null
+++ b/blocks_pompeius.2x.webp
diff --git a/blocks_simple.css b/blocks_simple.css
deleted file mode 100644
index 8856cb6..0000000
--- a/blocks_simple.css
+++ /dev/null
@@ -1,191 +0,0 @@
-.simple-labels .block.known {
-	background-image: url('blocks_simple.webp');
-	background-repeat: no-repeat;
-	background-size: 600% 3100%;
-}
-.simple-labels .block_0.r0{background-position:0% 0%}
-.simple-labels .block_0.r1{background-position:0% 3.3333333333333335%}
-.simple-labels .block_0.r2{background-position:0% 6.666666666666667%}
-.simple-labels .block_1.r0{background-position:0% 10%}
-.simple-labels .block_1.r1{background-position:0% 13.333333333333334%}
-.simple-labels .block_2.r0{background-position:0% 16.666666666666668%}
-.simple-labels .block_2.r1{background-position:0% 20%}
-.simple-labels .block_2.r2{background-position:0% 23.333333333333332%}
-.simple-labels .block_3.r0{background-position:0% 26.666666666666664%}
-.simple-labels .block_3.r1{background-position:0% 29.999999999999996%}
-.simple-labels .block_3.r2{background-position:0% 33.33333333333333%}
-.simple-labels .block_4.r0{background-position:0% 36.666666666666664%}
-.simple-labels .block_4.r1{background-position:0% 40%}
-.simple-labels .block_4.r2{background-position:0% 43.333333333333336%}
-.simple-labels .block_5.r0{background-position:0% 46.66666666666667%}
-.simple-labels .block_5.r1{background-position:0% 50.00000000000001%}
-.simple-labels .block_5.r2{background-position:0% 53.33333333333334%}
-.simple-labels .block_6.r0{background-position:0% 56.66666666666668%}
-.simple-labels .block_6.r1{background-position:0% 60.000000000000014%}
-.simple-labels .block_6.r2{background-position:0% 63.33333333333335%}
-.simple-labels .block_7.r0{background-position:0% 66.66666666666669%}
-.simple-labels .block_7.r1{background-position:0% 70.00000000000001%}
-.simple-labels .block_7.r2{background-position:0% 73.33333333333334%}
-.simple-labels .block_8.r0{background-position:0% 76.66666666666667%}
-.simple-labels .block_8.r1{background-position:0% 80%}
-.simple-labels .block_8.r2{background-position:0% 83.33333333333333%}
-.simple-labels .block_9.r0{background-position:0% 86.66666666666666%}
-.simple-labels .block_9.r1{background-position:0% 89.99999999999999%}
-.simple-labels .block_9.r2{background-position:0% 93.33333333333331%}
-.simple-labels .block_10.r0{background-position:0% 96.66666666666664%}
-.simple-labels .block_10.r1{background-position:0% 99.99999999999997%}
-.simple-labels .block_10.r2{background-position:20% 0%}
-.simple-labels .block_11.r0{background-position:20% 3.3333333333333335%}
-.simple-labels .block_11.r1{background-position:20% 6.666666666666667%}
-.simple-labels .block_11.r2{background-position:20% 10%}
-.simple-labels .block_12.r0{background-position:20% 13.333333333333334%}
-.simple-labels .block_12.r1{background-position:20% 16.666666666666668%}
-.simple-labels .block_12.r2{background-position:20% 20%}
-.simple-labels .block_12.r3{background-position:20% 23.333333333333332%}
-.simple-labels .block_13.r0{background-position:20% 26.666666666666664%}
-.simple-labels .block_13.r1{background-position:20% 29.999999999999996%}
-.simple-labels .block_13.r2{background-position:20% 33.33333333333333%}
-.simple-labels .block_13.r3{background-position:20% 36.666666666666664%}
-.simple-labels .block_14.r0{background-position:20% 40%}
-.simple-labels .block_14.r1{background-position:20% 43.333333333333336%}
-.simple-labels .block_14.r2{background-position:20% 46.66666666666667%}
-.simple-labels .block_14.r3{background-position:20% 50.00000000000001%}
-.simple-labels .block_15.r0{background-position:20% 53.33333333333334%}
-.simple-labels .block_15.r1{background-position:20% 56.66666666666668%}
-.simple-labels .block_15.r2{background-position:20% 60.000000000000014%}
-.simple-labels .block_15.r3{background-position:20% 63.33333333333335%}
-.simple-labels .block_16.r0{background-position:20% 66.66666666666669%}
-.simple-labels .block_16.r1{background-position:20% 70.00000000000001%}
-.simple-labels .block_16.r2{background-position:20% 73.33333333333334%}
-.simple-labels .block_16.r3{background-position:20% 76.66666666666667%}
-.simple-labels .block_17.r0{background-position:20% 80%}
-.simple-labels .block_17.r1{background-position:20% 83.33333333333333%}
-.simple-labels .block_17.r2{background-position:20% 86.66666666666666%}
-.simple-labels .block_18.r0{background-position:20% 89.99999999999999%}
-.simple-labels .block_18.r1{background-position:20% 93.33333333333331%}
-.simple-labels .block_19.r0{background-position:20% 96.66666666666664%}
-.simple-labels .block_19.r1{background-position:20% 99.99999999999997%}
-.simple-labels .block_20.r0{background-position:40% 0%}
-.simple-labels .block_20.r1{background-position:40% 3.3333333333333335%}
-.simple-labels .block_20.r2{background-position:40% 6.666666666666667%}
-.simple-labels .block_21.r0{background-position:40% 10%}
-.simple-labels .block_21.r1{background-position:40% 13.333333333333334%}
-.simple-labels .block_21.r2{background-position:40% 16.666666666666668%}
-.simple-labels .block_21.r3{background-position:40% 20%}
-.simple-labels .block_22.r0{background-position:40% 23.333333333333332%}
-.simple-labels .block_22.r1{background-position:40% 26.666666666666664%}
-.simple-labels .block_22.r2{background-position:40% 29.999999999999996%}
-.simple-labels .block_22.r3{background-position:40% 33.33333333333333%}
-.simple-labels .block_23.r0{background-position:40% 36.666666666666664%}
-.simple-labels .block_23.r1{background-position:40% 40%}
-.simple-labels .block_23.r2{background-position:40% 43.333333333333336%}
-.simple-labels .block_24.r0{background-position:40% 46.66666666666667%}
-.simple-labels .block_24.r1{background-position:40% 50.00000000000001%}
-.simple-labels .block_24.r2{background-position:40% 53.33333333333334%}
-.simple-labels .block_25.r0{background-position:40% 56.66666666666668%}
-.simple-labels .block_25.r1{background-position:40% 60.000000000000014%}
-.simple-labels .block_26.r0{background-position:40% 63.33333333333335%}
-.simple-labels .block_26.r1{background-position:40% 66.66666666666669%}
-.simple-labels .block_27.r0{background-position:40% 70.00000000000001%}
-.simple-labels .block_27.r1{background-position:40% 73.33333333333334%}
-.simple-labels .block_28.r0{background-position:40% 76.66666666666667%}
-.simple-labels .block_28.r1{background-position:40% 80%}
-.simple-labels .block_29.r0{background-position:40% 83.33333333333333%}
-.simple-labels .block_29.r1{background-position:40% 86.66666666666666%}
-.simple-labels .block_30.r0{background-position:40% 89.99999999999999%}
-.simple-labels .block_30.r1{background-position:40% 93.33333333333331%}
-.simple-labels .block_31.r0{background-position:40% 96.66666666666664%}
-.simple-labels .block_31.r1{background-position:40% 99.99999999999997%}
-.simple-labels .block_31.r2{background-position:60% 0%}
-.simple-labels .block_31.r3{background-position:60% 3.3333333333333335%}
-.simple-labels .block_32.r0{background-position:60% 6.666666666666667%}
-.simple-labels .block_32.r1{background-position:60% 10%}
-.simple-labels .block_32.r2{background-position:60% 13.333333333333334%}
-.simple-labels .block_33.r0{background-position:60% 16.666666666666668%}
-.simple-labels .block_33.r1{background-position:60% 20%}
-.simple-labels .block_33.r2{background-position:60% 23.333333333333332%}
-.simple-labels .block_34.r0{background-position:60% 26.666666666666664%}
-.simple-labels .block_34.r1{background-position:60% 29.999999999999996%}
-.simple-labels .block_35.r0{background-position:60% 33.33333333333333%}
-.simple-labels .block_35.r1{background-position:60% 36.666666666666664%}
-.simple-labels .block_35.r2{background-position:60% 40%}
-.simple-labels .block_35.r3{background-position:60% 43.333333333333336%}
-.simple-labels .block_36.r0{background-position:60% 46.66666666666667%}
-.simple-labels .block_36.r1{background-position:60% 50.00000000000001%}
-.simple-labels .block_36.r2{background-position:60% 53.33333333333334%}
-.simple-labels .block_36.r3{background-position:60% 56.66666666666668%}
-.simple-labels .block_37.r0{background-position:60% 60.000000000000014%}
-.simple-labels .block_37.r1{background-position:60% 63.33333333333335%}
-.simple-labels .block_37.r2{background-position:60% 66.66666666666669%}
-.simple-labels .block_38.r0{background-position:60% 70.00000000000001%}
-.simple-labels .block_38.r1{background-position:60% 73.33333333333334%}
-.simple-labels .block_38.r2{background-position:60% 76.66666666666667%}
-.simple-labels .block_39.r0{background-position:60% 80%}
-.simple-labels .block_39.r1{background-position:60% 83.33333333333333%}
-.simple-labels .block_39.r2{background-position:60% 86.66666666666666%}
-.simple-labels .block_40.r0{background-position:60% 89.99999999999999%}
-.simple-labels .block_40.r1{background-position:60% 93.33333333333331%}
-.simple-labels .block_40.r2{background-position:60% 96.66666666666664%}
-.simple-labels .block_41.r0{background-position:60% 99.99999999999997%}
-.simple-labels .block_41.r1{background-position:80% 0%}
-.simple-labels .block_41.r2{background-position:80% 3.3333333333333335%}
-.simple-labels .block_42.r0{background-position:80% 6.666666666666667%}
-.simple-labels .block_42.r1{background-position:80% 10%}
-.simple-labels .block_42.r2{background-position:80% 13.333333333333334%}
-.simple-labels .block_43.r0{background-position:80% 16.666666666666668%}
-.simple-labels .block_43.r1{background-position:80% 20%}
-.simple-labels .block_43.r2{background-position:80% 23.333333333333332%}
-.simple-labels .block_44.r0{background-position:80% 26.666666666666664%}
-.simple-labels .block_44.r1{background-position:80% 29.999999999999996%}
-.simple-labels .block_44.r2{background-position:80% 33.33333333333333%}
-.simple-labels .block_45.r0{background-position:80% 36.666666666666664%}
-.simple-labels .block_45.r1{background-position:80% 40%}
-.simple-labels .block_45.r2{background-position:80% 43.333333333333336%}
-.simple-labels .block_45.r3{background-position:80% 46.66666666666667%}
-.simple-labels .block_46.r0{background-position:80% 50.00000000000001%}
-.simple-labels .block_46.r1{background-position:80% 53.33333333333334%}
-.simple-labels .block_46.r2{background-position:80% 56.66666666666668%}
-.simple-labels .block_47.r0{background-position:80% 60.000000000000014%}
-.simple-labels .block_47.r1{background-position:80% 63.33333333333335%}
-.simple-labels .block_47.r2{background-position:80% 66.66666666666669%}
-.simple-labels .block_47.r3{background-position:80% 70.00000000000001%}
-.simple-labels .block_48.r0{background-position:80% 73.33333333333334%}
-.simple-labels .block_48.r1{background-position:80% 76.66666666666667%}
-.simple-labels .block_48.r2{background-position:80% 80%}
-.simple-labels .block_49.r0{background-position:80% 83.33333333333333%}
-.simple-labels .block_49.r1{background-position:80% 86.66666666666666%}
-.simple-labels .block_50.r0{background-position:80% 89.99999999999999%}
-.simple-labels .block_50.r1{background-position:80% 93.33333333333331%}
-.simple-labels .block_50.r2{background-position:80% 96.66666666666664%}
-.simple-labels .block_50.r3{background-position:80% 99.99999999999997%}
-.simple-labels .block_51.r0{background-position:100% 0%}
-.simple-labels .block_51.r1{background-position:100% 3.3333333333333335%}
-.simple-labels .block_51.r2{background-position:100% 6.666666666666667%}
-.simple-labels .block_52.r0{background-position:100% 10%}
-.simple-labels .block_52.r1{background-position:100% 13.333333333333334%}
-.simple-labels .block_53.r0{background-position:100% 16.666666666666668%}
-.simple-labels .block_53.r1{background-position:100% 20%}
-.simple-labels .block_53.r2{background-position:100% 23.333333333333332%}
-.simple-labels .block_53.r3{background-position:100% 26.666666666666664%}
-.simple-labels .block_54.r0{background-position:100% 29.999999999999996%}
-.simple-labels .block_54.r1{background-position:100% 33.33333333333333%}
-.simple-labels .block_54.r2{background-position:100% 36.666666666666664%}
-.simple-labels .block_54.r3{background-position:100% 40%}
-.simple-labels .block_55.r0{background-position:100% 43.333333333333336%}
-.simple-labels .block_55.r1{background-position:100% 46.66666666666667%}
-.simple-labels .block_55.r2{background-position:100% 50.00000000000001%}
-.simple-labels .block_56.r0{background-position:100% 53.33333333333334%}
-.simple-labels .block_56.r1{background-position:100% 56.66666666666668%}
-.simple-labels .block_56.r2{background-position:100% 60.000000000000014%}
-.simple-labels .block_57.r0{background-position:100% 63.33333333333335%}
-.simple-labels .block_57.r1{background-position:100% 66.66666666666669%}
-.simple-labels .block_58.r0{background-position:100% 70.00000000000001%}
-.simple-labels .block_58.r1{background-position:100% 73.33333333333334%}
-.simple-labels .block_59.r0{background-position:100% 76.66666666666667%}
-.simple-labels .block_59.r1{background-position:100% 80%}
-.simple-labels .block_60.r0{background-position:100% 83.33333333333333%}
-.simple-labels .block_60.r1{background-position:100% 86.66666666666666%}
-.simple-labels .block_61.r0{background-position:100% 89.99999999999999%}
-.simple-labels .block_61.r1{background-position:100% 93.33333333333331%}
-.simple-labels .block_62.r0{background-position:100% 96.66666666666664%}
-.simple-labels .block_62.r1{background-position:100% 99.99999999999997%}
diff --git a/data.js b/data.js
index 8a5b249..c2e8569 100644
--- a/data.js
+++ b/data.js
@@ -303,77 +303,90 @@ function init_data() {
 	sea("Pontus Euxinus", "Propontis")
 	sea("Pontus Euxinus", "Sinope")
 
-	function block(name, type, steps, initiative, firepower, levy = 0) {
+	function block(row, col, name, type, steps, initiative, firepower, levy = 0) {
 		if (levy)
 			levy = SPACES.findIndex(s=>s.name===levy)
-		BLOCKS.push({ name, type, steps, initiative, firepower, levy })
+		BLOCKS.push({ name, type, steps, initiative, firepower, levy, row, col })
 	}
 
-	block("Caesar", "leader", 3, "A", 3)
-	block("Antonius", "leader", 2, "A", 2)
-	block("Octavian", "leader", 3, "A", 2)
-	block("Legio 7", "legio", 3, "C", 2, "Tarraco")
-	block("Legio 8", "legio", 3, "C", 3, "Tarraco")
-	block("Legio 9", "legio", 3, "C", 2, "Carthago Nova")
-	block("Legio 10", "legio", 3, "C", 4, "Corduba")
-	block("Legio 11", "legio", 3, "C", 3, "Genua")
-	block("Legio 12", "legio", 3, "C", 3, "Genua")
-	block("Legio 13", "legio", 3, "C", 3, "Ravenna")
-	block("Legio 14", "legio", 3, "C", 3, "Ravenna")
-	block("Legio 16", "legio", 3, "C", 2, "Aquileia")
-	block("Legio 17", "legio", 4, "C", 2, "Roma")
-	block("Legio 18", "legio", 4, "C", 2, "Neapolis")
-	block("Legio 19", "legio", 4, "C", 2, "Syracusae")
-	block("Legio 20", "legio", 4, "C", 2, "Athenae")
-	block("Legio 21", "legio", 4, "C", 3, "Ancyra")
-	block("Equitatus 1", "equitatus", 3, "B", 2, "Lugdunum")
-	block("Equitatus 2", "equitatus", 2, "B", 2, "Toletum")
-	block("Equitatus 3", "equitatus", 2, "B", 3, "Byzantium")
-	block("Equitatus 4", "equitatus", 3, "B", 3, "Antiochia")
-	block("Auxilia 1", "auxilia-b", 4, "B", 1)
-	block("Auxilia 2", "auxilia-b", 4, "B", 1)
-	block("Auxilia 3", "auxilia-a", 3, "A", 1)
-	block("Auxilia 4", "auxilia-a", 3, "A", 1)
-	block("Ballista", "ballista", 2, "X", 4)
-	block("Navis 1", "navis", 2, "D", 2)
-	block("Navis 2", "navis", 2, "D", 2)
-	block("Navis 3", "navis", 2, "D", 2)
-	block("Navis 4", "navis", 2, "D", 3)
-	block("Navis 5", "navis", 2, "D", 3)
+	block(5,5, "Caesar", "leader", 3, "A", 3)
+	block(5,6, "Antonius", "leader", 2, "A", 2)
+	block(6,1, "Octavian", "leader", 3, "A", 2)
 
-	block("Cleopatra", "cleopatra", 4, "C", 1)
+	block(1,1, "Legio 7", "legio", 3, "C", 2, "Tarraco")
+	block(1,2, "Legio 8", "legio", 3, "C", 3, "Tarraco")
+	block(1,3, "Legio 9", "legio", 3, "C", 2, "Carthago Nova")
+	block(1,4, "Legio 10", "legio", 3, "C", 4, "Corduba")
+	block(1,5, "Legio 11", "legio", 3, "C", 3, "Genua")
+	block(1,6, "Legio 12", "legio", 3, "C", 3, "Genua")
 
-	block("Pompeius", "leader", 3, "B", 3)
-	block("Scipio", "leader", 3, "A", 2)
-	block("Brutus", "leader", 2, "A", 2)
-	block("Legio 1", "legio", 4, "C", 2, "Roma")
-	block("Legio 2", "legio", 4, "C", 2, "Carthago Nova")
-	block("Legio 3", "legio", 3, "C", 3, "Ravenna")
-	block("Legio 4", "legio", 3, "C", 2, "Carthago Nova")
-	block("Legio 5", "legio", 3, "C", 2, "Tarraco")
-	block("Legio 6", "legio", 3, "C", 2, "Tarraco")
-	block("Legio 32", "legio", 3, "C", 2, "Athenae")
-	block("Legio 33", "legio", 3, "C", 3, "Creta")
-	block("Legio 34", "legio", 3, "C", 3, "Antiochia")
-	block("Legio 35", "legio", 3, "C", 2, "Byzantium")
-	block("Legio 36", "legio", 4, "C", 2, "Ephesus")
-	block("Legio 37", "legio", 3, "C", 2, "Syracusae")
-	block("Legio 38", "legio", 4, "C", 2, "Alexandria")
-	block("Legio 39", "legio", 3, "C", 2, "Utica")
-	block("Equitatus 1", "equitatus", 2, "B", 3, "Toletum")
-	block("Equitatus 2", "equitatus", 4, "B", 2, "Badias")
-	block("Equitatus 3", "equitatus", 3, "B", 2, "Antiochia")
-	block("Elephant", "elephant", 2, "B", 3, "Utica")
-	block("Auxilia 1", "auxilia-b", 4, "B", 1)
-	block("Auxilia 2", "auxilia-b", 4, "B", 1)
-	block("Auxilia 3", "auxilia-a", 3, "A", 1)
-	block("Auxilia 4", "auxilia-a", 3, "A", 1)
-	block("Ballista", "ballista", 2, "X", 4)
-	block("Navis 1", "navis", 2, "D", 3)
-	block("Navis 2", "navis", 2, "D", 3)
-	block("Navis 3", "navis", 2, "D", 2)
-	block("Navis 4", "navis", 2, "D", 2)
-	block("Navis 5", "navis", 2, "D", 2)
+	block(2,1, "Legio 13", "legio", 3, "C", 3, "Ravenna")
+	block(2,2, "Legio 14", "legio", 3, "C", 3, "Ravenna")
+	block(2,3, "Legio 16", "legio", 3, "C", 2, "Aquileia")
+	block(2,4, "Legio 17", "legio", 4, "C", 2, "Roma")
+	block(2,5, "Legio 18", "legio", 4, "C", 2, "Neapolis")
+	block(2,6, "Legio 19", "legio", 4, "C", 2, "Syracusae")
+
+	block(3,1, "Legio 20", "legio", 4, "C", 2, "Athenae")
+	block(3,2, "Legio 21", "legio", 4, "C", 3, "Ancyra")
+
+	block(3,3, "Equitatus 1", "equitatus", 3, "B", 2, "Lugdunum")
+	block(3,4, "Equitatus 2", "equitatus", 2, "B", 2, "Toletum")
+	block(3,5, "Equitatus 3", "equitatus", 2, "B", 3, "Byzantium")
+	block(4,4, "Equitatus 4", "equitatus", 3, "B", 3, "Antiochia")
+
+	block(3,6, "Auxilia 1", "auxilia-b", 4, "B", 1)
+	block(4,1, "Auxilia 2", "auxilia-b", 4, "B", 1)
+	block(4,2, "Auxilia 3", "auxilia-a", 3, "A", 1)
+	block(4,3, "Auxilia 4", "auxilia-a", 3, "A", 1)
+
+	block(5,4, "Ballista", "ballista", 2, "X", 4)
+
+	block(4,5, "Navis 1", "navis", 2, "D", 2)
+	block(4,6, "Navis 2", "navis", 2, "D", 2)
+	block(5,1, "Navis 3", "navis", 2, "D", 2)
+	block(5,2, "Navis 4", "navis", 2, "D", 3)
+	block(5,3, "Navis 5", "navis", 2, "D", 3)
+
+	block(1,1, "Cleopatra", "cleopatra", 4, "C", 1)
+
+	block(1,1, "Pompeius", "leader", 3, "B", 3)
+	block(1,2, "Scipio", "leader", 3, "A", 2)
+	block(1,3, "Brutus", "leader", 2, "A", 2)
+
+	block(3,6, "Legio 1", "legio", 4, "C", 2, "Roma")
+	block(4,1, "Legio 2", "legio", 4, "C", 2, "Carthago Nova")
+	block(4,2, "Legio 3", "legio", 3, "C", 3, "Ravenna")
+	block(4,3, "Legio 4", "legio", 3, "C", 2, "Carthago Nova")
+	block(4,4, "Legio 5", "legio", 3, "C", 2, "Tarraco")
+	block(4,5, "Legio 6", "legio", 3, "C", 2, "Tarraco")
+	block(4,6, "Legio 32", "legio", 3, "C", 2, "Athenae")
+	block(5,1, "Legio 33", "legio", 3, "C", 3, "Creta")
+	block(5,2, "Legio 34", "legio", 3, "C", 3, "Antiochia")
+	block(5,3, "Legio 35", "legio", 3, "C", 2, "Byzantium")
+	block(5,4, "Legio 36", "legio", 4, "C", 2, "Ephesus")
+	block(5,5, "Legio 37", "legio", 3, "C", 2, "Syracusae")
+	block(5,6, "Legio 38", "legio", 4, "C", 2, "Alexandria")
+	block(6,1, "Legio 39", "legio", 3, "C", 2, "Utica")
+
+	block(2,5, "Equitatus 1", "equitatus", 2, "B", 3, "Toletum")
+	block(2,6, "Equitatus 2", "equitatus", 4, "B", 2, "Badias")
+	block(3,1, "Equitatus 3", "equitatus", 3, "B", 2, "Antiochia")
+
+	block(2,4, "Elephant", "elephant", 2, "B", 3, "Utica")
+
+	block(3,2, "Auxilia 1", "auxilia-b", 4, "B", 1)
+	block(3,3, "Auxilia 2", "auxilia-b", 4, "B", 1)
+	block(3,4, "Auxilia 3", "auxilia-a", 3, "A", 1)
+	block(3,5, "Auxilia 4", "auxilia-a", 3, "A", 1)
+
+	block(2,3, "Ballista", "ballista", 2, "X", 4)
+
+	block(1,4, "Navis 1", "navis", 2, "D", 3)
+	block(1,5, "Navis 2", "navis", 2, "D", 3)
+	block(1,6, "Navis 3", "navis", 2, "D", 2)
+	block(2,1, "Navis 4", "navis", 2, "D", 2)
+	block(2,2, "Navis 5", "navis", 2, "D", 2)
 }
 
 init_data()
diff --git a/info/blocks.html b/info/blocks.html
index b6160d6..ce307cb 100644
--- a/info/blocks.html
+++ b/info/blocks.html
@@ -2,8 +2,6 @@
 <html>
 <meta name="viewport" content="width=700">
 <title>Julius Caesar - Blocks</title>
-<link rel="stylesheet" href="../blocks_columbia.css">
-<link rel="stylesheet" href="../blocks_simple.css">
 <style>
 body {
 	margin: 40px;
@@ -11,118 +9,154 @@ body {
 	color: white;
 	text-align: center;
 }
+
 div.list {
-	display: flex;
-	flex-wrap: wrap;
-	justify-content: center;
+	display: grid;
+	width: calc(66px * 7 + 8px * 6);
+	margin: 0 auto;
+	grid-template-columns: repeat(7, 66px);
+	gap: 8px;
+}
+
+.block {
+	width: 60px;
+	height: 60px;
+	border-width: 3px;
+	border-radius: 8px;
+	border: 3px solid blue;
+	box-shadow: 0 0 2px 1px #0004;
 }
 
-.block { box-shadow: 1px 1px 3px rgba(0,0,0,0.5); }
-.block:hover { transform: scale(2); }
+.block { background-size: 360px 360px; }
+.Cleopatra.block { background-size: 60px 60px; }
+
+.Caesar.block { background-image: url(../blocks_caesar.1x.webp); }
+.Cleopatra.block { background-image: url(../blocks_cleopatra.1x.webp); }
+.Pompeius.block { background-image: url(../blocks_pompeius.1x.webp); }
 
-.columbia-labels .block { width:56px; height:56px; margin:8px; }
-.columbia-labels .block.Caesar { background-color: #822; border: 3px solid #822; }
-.columbia-labels .block.Pompeius { background-color: #862; border: 3px solid #862; }
-.columbia-labels .block.Cleopatra { background-color: #067; border: 3px solid #067; }
-.columbia-labels .block { border-radius: 0px; }
+@media (min-resolution: 97dpi) {
+.Caesar.block { background-image: url(../blocks_caesar.2x.webp); }
+.Cleopatra.block { background-image: url(../blocks_cleopatra.2x.webp); }
+.Pompeius.block { background-image: url(../blocks_pompeius.2x.webp); }
+}
+
+.block.Caesar { background-color: hsl(358, 69%, 47%); }
+.block.Caesar { border-color: hsl(358, 69%, 32%); }
+.block.Pompeius { background-color: hsl(43, 87%, 44%); }
+.block.Pompeius { border-color: hsl(43, 87%, 30%); }
+.block.Cleopatra { background-color: hsl(187, 100%, 35%); }
+.block.Cleopatra { border-color: hsl(187, 100%, 23%); }
 
-.simple-labels .block { width:48px; height:48px; margin:12px; }
-.simple-labels .block.Caesar { background-color: #b22; border: 3px solid #822; }
-.simple-labels .block.Pompeius { background-color: #eb2; border: 3px solid #862; }
-.simple-labels .block.Cleopatra { background-color: #09b; border: 3px solid #067; }
-.simple-labels .block { border-radius: 0px; }
+.block_1_1{background-position:0px 0px}
+.block_1_2{background-position:-60px 0px}
+.block_1_3{background-position:-120px 0px}
+.block_1_4{background-position:-180px 0px}
+.block_1_5{background-position:-240px 0px}
+.block_1_6{background-position:-300px 0px}
+.block_2_1{background-position:0px -60px}
+.block_2_2{background-position:-60px -60px}
+.block_2_3{background-position:-120px -60px}
+.block_2_4{background-position:-180px -60px}
+.block_2_5{background-position:-240px -60px}
+.block_2_6{background-position:-300px -60px}
+.block_3_1{background-position:0px -120px}
+.block_3_2{background-position:-60px -120px}
+.block_3_3{background-position:-120px -120px}
+.block_3_4{background-position:-180px -120px}
+.block_3_5{background-position:-240px -120px}
+.block_3_6{background-position:-300px -120px}
+.block_4_1{background-position:0px -180px}
+.block_4_2{background-position:-60px -180px}
+.block_4_3{background-position:-120px -180px}
+.block_4_4{background-position:-180px -180px}
+.block_4_5{background-position:-240px -180px}
+.block_4_6{background-position:-300px -180px}
+.block_5_1{background-position:0px -240px}
+.block_5_2{background-position:-60px -240px}
+.block_5_3{background-position:-120px -240px}
+.block_5_4{background-position:-180px -240px}
+.block_5_5{background-position:-240px -240px}
+.block_5_6{background-position:-300px -240px}
+.block_6_1{background-position:0px -300px}
+.block_6_2{background-position:-60px -300px}
+.block_6_3{background-position:-120px -300px}
+.block_6_4{background-position:-180px -300px}
+.block_6_5{background-position:-240px -300px}
+.block_6_6{background-position:-300px -300px}
 
 </style>
-<body id="body" class="columbia-labels">
-<h1>
-Julius Caesar - Blocks
-</h1>
-
-<p>
-<button onclick="window.body.className='columbia-labels'">Columbia</button>
-<button onclick="window.body.className='simple-labels'">Simple</button>
-</p>
-
-<div>
-<div class="list r0">
-<div class="block known Caesar block_0 r0"></div>
-<div class="block known Caesar block_1 r0"></div>
-<div class="block known Caesar block_2 r0"></div>
-<div class="block known Caesar block_3 r0"></div>
-<div class="block known Caesar block_4 r0"></div>
-<div class="block known Caesar block_5 r0"></div>
-<div class="block known Caesar block_6 r0"></div>
-</div>
-<div class="list r0">
-<div class="block known Caesar block_7 r0"></div>
-<div class="block known Caesar block_8 r0"></div>
-<div class="block known Caesar block_9 r0"></div>
-<div class="block known Caesar block_10 r0"></div>
-<div class="block known Caesar block_11 r0"></div>
-<div class="block known Caesar block_12 r0"></div>
-<div class="block known Caesar block_13 r0"></div>
-</div>
-<div class="list r0">
-<div class="block known Caesar block_14 r0"></div>
-<div class="block known Caesar block_15 r0"></div>
-<div class="block known Caesar block_16 r0"></div>
-<div class="block known Caesar block_17 r0"></div>
-<div class="block known Caesar block_18 r0"></div>
-<div class="block known Caesar block_19 r0"></div>
-<div class="block known Caesar block_20 r0"></div>
-</div>
-<div class="list r0">
-<div class="block known Caesar block_21 r0"></div>
-<div class="block known Caesar block_22 r0"></div>
-<div class="block known Caesar block_23 r0"></div>
-<div class="block known Caesar block_24 r0"></div>
-<div class="block known Caesar block_25 r0"></div>
-<div class="block known Caesar block_26 r0"></div>
-<div class="block known Caesar block_27 r0"></div>
-</div>
-<div class="list r0">
-<div class="block known Caesar block_28 r0"></div>
-<div class="block known Caesar block_29 r0"></div>
-<div class="block known Caesar block_30 r0"></div>
-<div class="block known Cleopatra block_31 r0"></div>
-<div class="block known Pompeius block_32 r0"></div>
-<div class="block known Pompeius block_33 r0"></div>
-<div class="block known Pompeius block_34 r0"></div>
-</div>
-<div class="list r0">
-<div class="block known Pompeius block_35 r0"></div>
-<div class="block known Pompeius block_36 r0"></div>
-<div class="block known Pompeius block_37 r0"></div>
-<div class="block known Pompeius block_38 r0"></div>
-<div class="block known Pompeius block_39 r0"></div>
-<div class="block known Pompeius block_40 r0"></div>
-<div class="block known Pompeius block_41 r0"></div>
-</div>
-<div class="list r0">
-<div class="block known Pompeius block_42 r0"></div>
-<div class="block known Pompeius block_43 r0"></div>
-<div class="block known Pompeius block_44 r0"></div>
-<div class="block known Pompeius block_45 r0"></div>
-<div class="block known Pompeius block_46 r0"></div>
-<div class="block known Pompeius block_47 r0"></div>
-<div class="block known Pompeius block_48 r0"></div>
-</div>
-<div class="list r0">
-<div class="block known Pompeius block_49 r0"></div>
-<div class="block known Pompeius block_50 r0"></div>
-<div class="block known Pompeius block_51 r0"></div>
-<div class="block known Pompeius block_52 r0"></div>
-<div class="block known Pompeius block_53 r0"></div>
-<div class="block known Pompeius block_54 r0"></div>
-<div class="block known Pompeius block_55 r0"></div>
-</div>
-<div class="list r0">
-<div class="block known Pompeius block_56 r0"></div>
-<div class="block known Pompeius block_57 r0"></div>
-<div class="block known Pompeius block_58 r0"></div>
-<div class="block known Pompeius block_59 r0"></div>
-<div class="block known Pompeius block_60 r0"></div>
-<div class="block known Pompeius block_61 r0"></div>
-<div class="block known Pompeius block_62 r0"></div>
-</div>
-</div>
+<body>
+
+<div class="list">
+
+<div class="block Caesar block_1_1"></div>
+<div class="block Caesar block_1_2"></div>
+<div class="block Caesar block_1_3"></div>
+<div class="block Caesar block_1_4"></div>
+<div class="block Caesar block_1_5"></div>
+<div class="block Caesar block_1_6"></div>
+<div class="block Caesar block_2_1"></div>
+
+<div class="block Caesar block_2_2"></div>
+<div class="block Caesar block_2_3"></div>
+<div class="block Caesar block_2_4"></div>
+<div class="block Caesar block_2_5"></div>
+<div class="block Caesar block_2_6"></div>
+<div class="block Caesar block_3_1"></div>
+<div class="block Caesar block_3_2"></div>
+
+<div class="block Caesar block_3_3"></div>
+<div class="block Caesar block_3_4"></div>
+<div class="block Caesar block_3_5"></div>
+<div class="block Caesar block_3_6"></div>
+<div class="block Caesar block_4_1"></div>
+<div class="block Caesar block_4_2"></div>
+<div class="block Caesar block_4_3"></div>
+
+<div class="block Caesar block_4_4"></div>
+<div class="block Caesar block_4_5"></div>
+<div class="block Caesar block_4_6"></div>
+<div class="block Caesar block_5_1"></div>
+<div class="block Caesar block_5_2"></div>
+<div class="block Caesar block_5_3"></div>
+<div class="block Caesar block_5_4"></div>
+
+<div class="block Caesar block_5_5"></div>
+<div class="block Caesar block_5_6"></div>
+<div class="block Caesar block_6_1"></div>
+<div class="block Cleopatra block_1_1"></div>
+<div class="block Pompeius block_1_1"></div>
+<div class="block Pompeius block_1_2"></div>
+<div class="block Pompeius block_1_3"></div>
+
+<div class="block Pompeius block_1_4"></div>
+<div class="block Pompeius block_1_5"></div>
+<div class="block Pompeius block_1_6"></div>
+<div class="block Pompeius block_2_1"></div>
+<div class="block Pompeius block_2_2"></div>
+<div class="block Pompeius block_2_3"></div>
+<div class="block Pompeius block_2_4"></div>
+
+<div class="block Pompeius block_2_5"></div>
+<div class="block Pompeius block_2_6"></div>
+<div class="block Pompeius block_3_1"></div>
+<div class="block Pompeius block_3_2"></div>
+<div class="block Pompeius block_3_3"></div>
+<div class="block Pompeius block_3_4"></div>
+<div class="block Pompeius block_3_5"></div>
+
+<div class="block Pompeius block_3_6"></div>
+<div class="block Pompeius block_4_1"></div>
+<div class="block Pompeius block_4_2"></div>
+<div class="block Pompeius block_4_3"></div>
+<div class="block Pompeius block_4_4"></div>
+<div class="block Pompeius block_4_5"></div>
+<div class="block Pompeius block_4_6"></div>
+
+<div class="block Pompeius block_5_1"></div>
+<div class="block Pompeius block_5_2"></div>
+<div class="block Pompeius block_5_3"></div>
+<div class="block Pompeius block_5_4"></div>
+<div class="block Pompeius block_5_5"></div>
+<div class="block Pompeius block_5_6"></div>
+<div class="block Pompeius block_6_1"></div>
diff --git a/play.css b/play.css
index 464505c..33f7d3a 100644
--- a/play.css
+++ b/play.css
@@ -232,21 +232,31 @@ body.shift .block.known:hover {
 .simple-labels .hit .block.highlight { border-color: black; }
 
 .columbia-labels .block {
-	width: 56px;
-	height: 56px;
+	width: 60px;
+	height: 60px;
 	border: 3px solid #363639;
 	box-shadow: 0 0 2px 1px #0002;
-	border-radius: 6px;
+	border-radius: 8px;
 }
 
+/* RED + OCHRE */
 .columbia-labels .block.Caesar { background-color: hsl(358, 69%, 47%); }
-.columbia-labels .block.Pompeius { background-color: hsl(43, 87%, 44%); }
-.columbia-labels .block.Cleopatra { background-color: hsl(187, 100%, 35%); }
-
 .columbia-labels .block.Caesar { border-color: hsl(358, 69%, 32%); }
+.columbia-labels .block.Pompeius { background-color: hsl(43, 87%, 44%); }
 .columbia-labels .block.Pompeius { border-color: hsl(43, 87%, 30%); }
+.columbia-labels .block.Cleopatra { background-color: hsl(187, 100%, 35%); }
 .columbia-labels .block.Cleopatra { border-color: hsl(187, 100%, 23%); }
 
+/* BROWN + GREEN */
+/*
+.columbia-labels .block.Caesar { background-color: hsl(25, 50%, 40%); }
+.columbia-labels .block.Caesar { border-color: hsl(25, 50%, 30%); }
+.columbia-labels .block.Pompeius { background-color: hsl(150, 95%, 30%); }
+.columbia-labels .block.Pompeius { border-color: hsl(150, 95%, 23%); }
+.columbia-labels .block.Cleopatra { background-color: hsl(206, 75%, 45%); }
+.columbia-labels .block.Cleopatra { border-color: hsl(206, 75%, 35%); }
+*/
+
 .columbia-labels .block.highlight { border-color: white; }
 .columbia-labels .block.selected { border-color: yellow; }
 .columbia-labels .hit .block.highlight { border-color: black; }
@@ -288,3 +298,254 @@ body.shift .block.known:hover {
 #replay_panel {
 	background-color: tan;
 }
+
+/* COLUMBIA BLOCKS */
+
+.columbia-labels .known.block { background-size: 360px 360px; }
+.columbia-labels .Cleopatra.known.block { background-size: 60px 60px; }
+
+.columbia-labels .Caesar.known.block { background-image: url(blocks_caesar.1x.webp); }
+.columbia-labels .Cleopatra.known.block { background-image: url(blocks_cleopatra.1x.webp); }
+.columbia-labels .Pompeius.known.block { background-image: url(blocks_pompeius.1x.webp); }
+
+@media (min-resolution: 97dpi) {
+.columbia-labels .Caesar.known.block { background-image: url(blocks_caesar.2x.webp); }
+.columbia-labels .Cleopatra.known.block { background-image: url(blocks_cleopatra.2x.webp); }
+.columbia-labels .Pompeius.known.block { background-image: url(blocks_pompeius.2x.webp); }
+}
+
+body.shift .columbia-labels .Caesar.known.block:hover { background-image: url(blocks_caesar.2x.webp); }
+body.shift .columbia-labels .Cleopatra.known.block:hover { background-image: url(blocks_cleopatra.2x.webp); }
+body.shift .columbia-labels .Pompeius.known.block:hover { background-image: url(blocks_pompeius.2x.webp); }
+
+.columbia-labels .known.block_1_1{background-position:0px 0px}
+.columbia-labels .known.block_1_2{background-position:-60px 0px}
+.columbia-labels .known.block_1_3{background-position:-120px 0px}
+.columbia-labels .known.block_1_4{background-position:-180px 0px}
+.columbia-labels .known.block_1_5{background-position:-240px 0px}
+.columbia-labels .known.block_1_6{background-position:-300px 0px}
+.columbia-labels .known.block_2_1{background-position:0px -60px}
+.columbia-labels .known.block_2_2{background-position:-60px -60px}
+.columbia-labels .known.block_2_3{background-position:-120px -60px}
+.columbia-labels .known.block_2_4{background-position:-180px -60px}
+.columbia-labels .known.block_2_5{background-position:-240px -60px}
+.columbia-labels .known.block_2_6{background-position:-300px -60px}
+.columbia-labels .known.block_3_1{background-position:0px -120px}
+.columbia-labels .known.block_3_2{background-position:-60px -120px}
+.columbia-labels .known.block_3_3{background-position:-120px -120px}
+.columbia-labels .known.block_3_4{background-position:-180px -120px}
+.columbia-labels .known.block_3_5{background-position:-240px -120px}
+.columbia-labels .known.block_3_6{background-position:-300px -120px}
+.columbia-labels .known.block_4_1{background-position:0px -180px}
+.columbia-labels .known.block_4_2{background-position:-60px -180px}
+.columbia-labels .known.block_4_3{background-position:-120px -180px}
+.columbia-labels .known.block_4_4{background-position:-180px -180px}
+.columbia-labels .known.block_4_5{background-position:-240px -180px}
+.columbia-labels .known.block_4_6{background-position:-300px -180px}
+.columbia-labels .known.block_5_1{background-position:0px -240px}
+.columbia-labels .known.block_5_2{background-position:-60px -240px}
+.columbia-labels .known.block_5_3{background-position:-120px -240px}
+.columbia-labels .known.block_5_4{background-position:-180px -240px}
+.columbia-labels .known.block_5_5{background-position:-240px -240px}
+.columbia-labels .known.block_5_6{background-position:-300px -240px}
+.columbia-labels .known.block_6_1{background-position:0px -300px}
+.columbia-labels .known.block_6_2{background-position:-60px -300px}
+.columbia-labels .known.block_6_3{background-position:-120px -300px}
+.columbia-labels .known.block_6_4{background-position:-180px -300px}
+.columbia-labels .known.block_6_5{background-position:-240px -300px}
+.columbia-labels .known.block_6_6{background-position:-300px -300px}
+
+/* SIMPLE BLOCKS */
+
+.simple-labels .block.known {
+	background-image: url('blocks_simple.webp');
+	background-repeat: no-repeat;
+	background-size: 600% 3100%;
+}
+
+.simple-labels .block_0.r0{background-position:0% 0%}
+.simple-labels .block_0.r1{background-position:0% 3.3333333333333335%}
+.simple-labels .block_0.r2{background-position:0% 6.666666666666667%}
+.simple-labels .block_1.r0{background-position:0% 10%}
+.simple-labels .block_1.r1{background-position:0% 13.333333333333334%}
+.simple-labels .block_2.r0{background-position:0% 16.666666666666668%}
+.simple-labels .block_2.r1{background-position:0% 20%}
+.simple-labels .block_2.r2{background-position:0% 23.333333333333332%}
+.simple-labels .block_3.r0{background-position:0% 26.666666666666664%}
+.simple-labels .block_3.r1{background-position:0% 29.999999999999996%}
+.simple-labels .block_3.r2{background-position:0% 33.33333333333333%}
+.simple-labels .block_4.r0{background-position:0% 36.666666666666664%}
+.simple-labels .block_4.r1{background-position:0% 40%}
+.simple-labels .block_4.r2{background-position:0% 43.333333333333336%}
+.simple-labels .block_5.r0{background-position:0% 46.66666666666667%}
+.simple-labels .block_5.r1{background-position:0% 50.00000000000001%}
+.simple-labels .block_5.r2{background-position:0% 53.33333333333334%}
+.simple-labels .block_6.r0{background-position:0% 56.66666666666668%}
+.simple-labels .block_6.r1{background-position:0% 60.000000000000014%}
+.simple-labels .block_6.r2{background-position:0% 63.33333333333335%}
+.simple-labels .block_7.r0{background-position:0% 66.66666666666669%}
+.simple-labels .block_7.r1{background-position:0% 70.00000000000001%}
+.simple-labels .block_7.r2{background-position:0% 73.33333333333334%}
+.simple-labels .block_8.r0{background-position:0% 76.66666666666667%}
+.simple-labels .block_8.r1{background-position:0% 80%}
+.simple-labels .block_8.r2{background-position:0% 83.33333333333333%}
+.simple-labels .block_9.r0{background-position:0% 86.66666666666666%}
+.simple-labels .block_9.r1{background-position:0% 89.99999999999999%}
+.simple-labels .block_9.r2{background-position:0% 93.33333333333331%}
+.simple-labels .block_10.r0{background-position:0% 96.66666666666664%}
+.simple-labels .block_10.r1{background-position:0% 99.99999999999997%}
+.simple-labels .block_10.r2{background-position:20% 0%}
+.simple-labels .block_11.r0{background-position:20% 3.3333333333333335%}
+.simple-labels .block_11.r1{background-position:20% 6.666666666666667%}
+.simple-labels .block_11.r2{background-position:20% 10%}
+.simple-labels .block_12.r0{background-position:20% 13.333333333333334%}
+.simple-labels .block_12.r1{background-position:20% 16.666666666666668%}
+.simple-labels .block_12.r2{background-position:20% 20%}
+.simple-labels .block_12.r3{background-position:20% 23.333333333333332%}
+.simple-labels .block_13.r0{background-position:20% 26.666666666666664%}
+.simple-labels .block_13.r1{background-position:20% 29.999999999999996%}
+.simple-labels .block_13.r2{background-position:20% 33.33333333333333%}
+.simple-labels .block_13.r3{background-position:20% 36.666666666666664%}
+.simple-labels .block_14.r0{background-position:20% 40%}
+.simple-labels .block_14.r1{background-position:20% 43.333333333333336%}
+.simple-labels .block_14.r2{background-position:20% 46.66666666666667%}
+.simple-labels .block_14.r3{background-position:20% 50.00000000000001%}
+.simple-labels .block_15.r0{background-position:20% 53.33333333333334%}
+.simple-labels .block_15.r1{background-position:20% 56.66666666666668%}
+.simple-labels .block_15.r2{background-position:20% 60.000000000000014%}
+.simple-labels .block_15.r3{background-position:20% 63.33333333333335%}
+.simple-labels .block_16.r0{background-position:20% 66.66666666666669%}
+.simple-labels .block_16.r1{background-position:20% 70.00000000000001%}
+.simple-labels .block_16.r2{background-position:20% 73.33333333333334%}
+.simple-labels .block_16.r3{background-position:20% 76.66666666666667%}
+.simple-labels .block_17.r0{background-position:20% 80%}
+.simple-labels .block_17.r1{background-position:20% 83.33333333333333%}
+.simple-labels .block_17.r2{background-position:20% 86.66666666666666%}
+.simple-labels .block_18.r0{background-position:20% 89.99999999999999%}
+.simple-labels .block_18.r1{background-position:20% 93.33333333333331%}
+.simple-labels .block_19.r0{background-position:20% 96.66666666666664%}
+.simple-labels .block_19.r1{background-position:20% 99.99999999999997%}
+.simple-labels .block_20.r0{background-position:40% 0%}
+.simple-labels .block_20.r1{background-position:40% 3.3333333333333335%}
+.simple-labels .block_20.r2{background-position:40% 6.666666666666667%}
+.simple-labels .block_21.r0{background-position:40% 10%}
+.simple-labels .block_21.r1{background-position:40% 13.333333333333334%}
+.simple-labels .block_21.r2{background-position:40% 16.666666666666668%}
+.simple-labels .block_21.r3{background-position:40% 20%}
+.simple-labels .block_22.r0{background-position:40% 23.333333333333332%}
+.simple-labels .block_22.r1{background-position:40% 26.666666666666664%}
+.simple-labels .block_22.r2{background-position:40% 29.999999999999996%}
+.simple-labels .block_22.r3{background-position:40% 33.33333333333333%}
+.simple-labels .block_23.r0{background-position:40% 36.666666666666664%}
+.simple-labels .block_23.r1{background-position:40% 40%}
+.simple-labels .block_23.r2{background-position:40% 43.333333333333336%}
+.simple-labels .block_24.r0{background-position:40% 46.66666666666667%}
+.simple-labels .block_24.r1{background-position:40% 50.00000000000001%}
+.simple-labels .block_24.r2{background-position:40% 53.33333333333334%}
+.simple-labels .block_25.r0{background-position:40% 56.66666666666668%}
+.simple-labels .block_25.r1{background-position:40% 60.000000000000014%}
+.simple-labels .block_26.r0{background-position:40% 63.33333333333335%}
+.simple-labels .block_26.r1{background-position:40% 66.66666666666669%}
+.simple-labels .block_27.r0{background-position:40% 70.00000000000001%}
+.simple-labels .block_27.r1{background-position:40% 73.33333333333334%}
+.simple-labels .block_28.r0{background-position:40% 76.66666666666667%}
+.simple-labels .block_28.r1{background-position:40% 80%}
+.simple-labels .block_29.r0{background-position:40% 83.33333333333333%}
+.simple-labels .block_29.r1{background-position:40% 86.66666666666666%}
+.simple-labels .block_30.r0{background-position:40% 89.99999999999999%}
+.simple-labels .block_30.r1{background-position:40% 93.33333333333331%}
+.simple-labels .block_31.r0{background-position:40% 96.66666666666664%}
+.simple-labels .block_31.r1{background-position:40% 99.99999999999997%}
+.simple-labels .block_31.r2{background-position:60% 0%}
+.simple-labels .block_31.r3{background-position:60% 3.3333333333333335%}
+.simple-labels .block_32.r0{background-position:60% 6.666666666666667%}
+.simple-labels .block_32.r1{background-position:60% 10%}
+.simple-labels .block_32.r2{background-position:60% 13.333333333333334%}
+.simple-labels .block_33.r0{background-position:60% 16.666666666666668%}
+.simple-labels .block_33.r1{background-position:60% 20%}
+.simple-labels .block_33.r2{background-position:60% 23.333333333333332%}
+.simple-labels .block_34.r0{background-position:60% 26.666666666666664%}
+.simple-labels .block_34.r1{background-position:60% 29.999999999999996%}
+.simple-labels .block_35.r0{background-position:60% 33.33333333333333%}
+.simple-labels .block_35.r1{background-position:60% 36.666666666666664%}
+.simple-labels .block_35.r2{background-position:60% 40%}
+.simple-labels .block_35.r3{background-position:60% 43.333333333333336%}
+.simple-labels .block_36.r0{background-position:60% 46.66666666666667%}
+.simple-labels .block_36.r1{background-position:60% 50.00000000000001%}
+.simple-labels .block_36.r2{background-position:60% 53.33333333333334%}
+.simple-labels .block_36.r3{background-position:60% 56.66666666666668%}
+.simple-labels .block_37.r0{background-position:60% 60.000000000000014%}
+.simple-labels .block_37.r1{background-position:60% 63.33333333333335%}
+.simple-labels .block_37.r2{background-position:60% 66.66666666666669%}
+.simple-labels .block_38.r0{background-position:60% 70.00000000000001%}
+.simple-labels .block_38.r1{background-position:60% 73.33333333333334%}
+.simple-labels .block_38.r2{background-position:60% 76.66666666666667%}
+.simple-labels .block_39.r0{background-position:60% 80%}
+.simple-labels .block_39.r1{background-position:60% 83.33333333333333%}
+.simple-labels .block_39.r2{background-position:60% 86.66666666666666%}
+.simple-labels .block_40.r0{background-position:60% 89.99999999999999%}
+.simple-labels .block_40.r1{background-position:60% 93.33333333333331%}
+.simple-labels .block_40.r2{background-position:60% 96.66666666666664%}
+.simple-labels .block_41.r0{background-position:60% 99.99999999999997%}
+.simple-labels .block_41.r1{background-position:80% 0%}
+.simple-labels .block_41.r2{background-position:80% 3.3333333333333335%}
+.simple-labels .block_42.r0{background-position:80% 6.666666666666667%}
+.simple-labels .block_42.r1{background-position:80% 10%}
+.simple-labels .block_42.r2{background-position:80% 13.333333333333334%}
+.simple-labels .block_43.r0{background-position:80% 16.666666666666668%}
+.simple-labels .block_43.r1{background-position:80% 20%}
+.simple-labels .block_43.r2{background-position:80% 23.333333333333332%}
+.simple-labels .block_44.r0{background-position:80% 26.666666666666664%}
+.simple-labels .block_44.r1{background-position:80% 29.999999999999996%}
+.simple-labels .block_44.r2{background-position:80% 33.33333333333333%}
+.simple-labels .block_45.r0{background-position:80% 36.666666666666664%}
+.simple-labels .block_45.r1{background-position:80% 40%}
+.simple-labels .block_45.r2{background-position:80% 43.333333333333336%}
+.simple-labels .block_45.r3{background-position:80% 46.66666666666667%}
+.simple-labels .block_46.r0{background-position:80% 50.00000000000001%}
+.simple-labels .block_46.r1{background-position:80% 53.33333333333334%}
+.simple-labels .block_46.r2{background-position:80% 56.66666666666668%}
+.simple-labels .block_47.r0{background-position:80% 60.000000000000014%}
+.simple-labels .block_47.r1{background-position:80% 63.33333333333335%}
+.simple-labels .block_47.r2{background-position:80% 66.66666666666669%}
+.simple-labels .block_47.r3{background-position:80% 70.00000000000001%}
+.simple-labels .block_48.r0{background-position:80% 73.33333333333334%}
+.simple-labels .block_48.r1{background-position:80% 76.66666666666667%}
+.simple-labels .block_48.r2{background-position:80% 80%}
+.simple-labels .block_49.r0{background-position:80% 83.33333333333333%}
+.simple-labels .block_49.r1{background-position:80% 86.66666666666666%}
+.simple-labels .block_50.r0{background-position:80% 89.99999999999999%}
+.simple-labels .block_50.r1{background-position:80% 93.33333333333331%}
+.simple-labels .block_50.r2{background-position:80% 96.66666666666664%}
+.simple-labels .block_50.r3{background-position:80% 99.99999999999997%}
+.simple-labels .block_51.r0{background-position:100% 0%}
+.simple-labels .block_51.r1{background-position:100% 3.3333333333333335%}
+.simple-labels .block_51.r2{background-position:100% 6.666666666666667%}
+.simple-labels .block_52.r0{background-position:100% 10%}
+.simple-labels .block_52.r1{background-position:100% 13.333333333333334%}
+.simple-labels .block_53.r0{background-position:100% 16.666666666666668%}
+.simple-labels .block_53.r1{background-position:100% 20%}
+.simple-labels .block_53.r2{background-position:100% 23.333333333333332%}
+.simple-labels .block_53.r3{background-position:100% 26.666666666666664%}
+.simple-labels .block_54.r0{background-position:100% 29.999999999999996%}
+.simple-labels .block_54.r1{background-position:100% 33.33333333333333%}
+.simple-labels .block_54.r2{background-position:100% 36.666666666666664%}
+.simple-labels .block_54.r3{background-position:100% 40%}
+.simple-labels .block_55.r0{background-position:100% 43.333333333333336%}
+.simple-labels .block_55.r1{background-position:100% 46.66666666666667%}
+.simple-labels .block_55.r2{background-position:100% 50.00000000000001%}
+.simple-labels .block_56.r0{background-position:100% 53.33333333333334%}
+.simple-labels .block_56.r1{background-position:100% 56.66666666666668%}
+.simple-labels .block_56.r2{background-position:100% 60.000000000000014%}
+.simple-labels .block_57.r0{background-position:100% 63.33333333333335%}
+.simple-labels .block_57.r1{background-position:100% 66.66666666666669%}
+.simple-labels .block_58.r0{background-position:100% 70.00000000000001%}
+.simple-labels .block_58.r1{background-position:100% 73.33333333333334%}
+.simple-labels .block_59.r0{background-position:100% 76.66666666666667%}
+.simple-labels .block_59.r1{background-position:100% 80%}
+.simple-labels .block_60.r0{background-position:100% 83.33333333333333%}
+.simple-labels .block_60.r1{background-position:100% 86.66666666666666%}
+.simple-labels .block_61.r0{background-position:100% 89.99999999999999%}
+.simple-labels .block_61.r1{background-position:100% 93.33333333333331%}
+.simple-labels .block_62.r0{background-position:100% 96.66666666666664%}
+.simple-labels .block_62.r1{background-position:100% 99.99999999999997%}
diff --git a/play.html b/play.html
index 779559c..7145907 100644
--- a/play.html
+++ b/play.html
@@ -9,8 +9,6 @@
 <link rel="stylesheet" href="/fonts/fonts.css">
 <link rel="stylesheet" href="/common/client.css">
 <link rel="stylesheet" href="/common/columbia.css">
-<link rel="stylesheet" href="blocks_simple.css">
-<link rel="stylesheet" href="blocks_columbia.css">
 <link rel="stylesheet" href="play.css">
 <script defer src="/common/client.js"></script>
 <script defer src="data.js"></script>
diff --git a/play.js b/play.js
index e922641..6e734ac 100644
--- a/play.js
+++ b/play.js
@@ -345,6 +345,7 @@ function build_map() {
 		element.classList.add("known")
 		element.classList.add(block_color(b))
 		element.classList.add("block_"+b)
+		element.classList.add("block_"+block.row+"_"+block.col)
 		element.addEventListener("mouseenter", on_focus_map_block)
 		element.addEventListener("mouseleave", on_blur_map_block)
 		element.addEventListener("click", on_click_map_block)
@@ -370,6 +371,7 @@ function build_map() {
 		element.classList.add("block")
 		element.classList.add(block_color(b))
 		element.classList.add("block_"+b)
+		element.classList.add("block_"+block.row+"_"+block.col)
 		element.addEventListener("mouseenter", on_focus_battle_block)
 		element.addEventListener("mouseleave", on_blur_battle_block)
 		element.addEventListener("click", on_click_battle_block)
@@ -483,7 +485,7 @@ function layout_blocks_spread(location, north, south) {
 
 function position_block_spread(location, row, n_rows, col, n_cols, element) {
 	let space = SPACES[location]
-	let block_size = (label_style === 'columbia') ? 56+6 : 48+6
+	let block_size = (label_style === 'columbia') ? 60+6 : 48+6
 	let padding = (location === LEVY || location === DEAD) ? 6 : 3
 	let offset = block_size + padding
 	let row_size = (n_rows-1) * offset
@@ -585,6 +587,7 @@ function update_map() {
 				battle = " battle"
 			if (is_known_block(b)) {
 				let image = " block_" + b
+				image += " block_"+info.row+"_"+info.col
 				let known = " known"
 				element.classList = block_color(b) + known + " block" + image + moved + battle
 				update_steps(b, element, true)