3 files changed, 18 insertions, 24 deletions

diff --git a/play.css b/play.css
index e1fabe8..8917f5b 100644
--- a/play.css
+++ b/play.css
@@ -1,11 +1,9 @@
 main { background-color: dimgray; }
-#roles { background-color: gray; }
 header { background-color: silver; }
 header.your_turn { background-color: orange; }
-#role_Teutons .role_name { background-color: hsl(210,30%,80%); }
-#role_Russians .role_name { background-color: hsl(35,40%,80%); }
-#turn_info { background-color: gainsboro; }
-.role_held { float: right; }
+#role_Teutons { background-color: hsl(210,30%,80%); }
+#role_Russians { background-color: hsl(35,40%,80%); }
+#turn_info { background-color: gray; }
 
 #log { background-color: whitesmoke; }
 #log .h1 { font-weight: bold; padding-top:2px; padding-bottom:2px; text-align: center; }
@@ -682,23 +680,23 @@ body.shift .mustered_vassals {
 	transition: 100ms;
 }
 
-.card_info {
+#turn_info {
 	border-bottom: 1px solid black;
 	padding: 12px;
 	overflow: clip;
 }
 
-.card_info .card {
+#turn_info .card {
 	margin: 0 auto;
 }
 
 @media (max-height: 800px) {
-	.card_info { height: 95px; }
-	.card_info:hover { height: auto; }
+	#turn_info { height: 95px; }
+	#turn_info:hover { height: auto; }
 }
 
 @media (max-height: 600px) {
-	.card_info {
+	#turn_info {
 		display: none;
 	}
 }
diff --git a/play.html b/play.html
index cb678b4..e6f4c14 100644
--- a/play.html
+++ b/play.html
@@ -30,27 +30,23 @@
 				<li class="resign" onclick="confirm_resign()">Resign
 			</menu>
 		</details>
-		<button class="icon_button" onclick="toggle_pieces()"><img src="/images/earth-africa-europe.svg"></button>
+		<button onclick="toggle_pieces()"><img src="/images/earth-africa-europe.svg"></button>
 	</div>
 </header>
 
 <aside>
 	<div id="roles">
 		<div class="role" id="role_Teutons">
-			<div class="role_name">
-				Teutons
-				<div class="role_held">0 Held</div>
-				<div class="role_user">-</div>
-			</div>
+			<div class="role_name">Teutons</div>
+			<div class="role_stat">0 Held</div>
+			<div class="role_user">-</div>
 		</div>
 		<div class="role" id="role_Russians">
-			<div class="role_name">
-				Russians
-				<div class="role_held">0 Held</div>
-				<div class="role_user">-</div>
-			</div>
+			<div class="role_name">Russians</div>
+			<div class="role_stat">0 Held</div>
+			<div class="role_user">-</div>
 		</div>
-		<div class="card_info"><div id="command" class="card teutonic aow_back"></div></div>
+		<div id="turn_info"><div id="command" class="card teutonic aow_back"></div></div>
 	</div>
 	<div id="log"></div>
 </aside>
diff --git a/play.js b/play.js
index 14afb6d..87bd8f8 100644
--- a/play.js
+++ b/play.js
@@ -587,8 +587,8 @@ const ui = {
 	hand_panel: document.getElementById("hand_panel"),
 	hand: document.getElementById("hand"),
 
-	held1: document.querySelector("#role_Teutons .role_held"),
-	held2: document.querySelector("#role_Russians .role_held"),
+	held1: document.querySelector("#role_Teutons .role_stat"),
+	held2: document.querySelector("#role_Russians .role_stat"),
 
 	capabilities1: document.getElementById("capabilities1"),
 	capabilities2: document.getElementById("capabilities2"),