Color H2 and H3 headers by active player.

1 files changed, 14 insertions, 5 deletions

diff --git a/play.html b/play.html
index 3f3e662..9e459a3 100644
--- a/play.html
+++ b/play.html
@@ -17,19 +17,28 @@ main { background-color: dimgray; }
 #roles { background-color: gray; }
 header { background-color: silver; }
 header.your_turn { background-color: orange; }
-#role_Teutons .role_name { background-color: #e1e6e8; }
-#role_Russians .role_name { background-color: #e1d6c1; }
+#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; }
 
 #log { background-color: whitesmoke; }
-#log .h1 { background-color: silver; font-weight: bold; padding-top:2px; padding-bottom:2px; text-align: center; }
-#log .h2 { background-color: gainsboro; padding-top:2px; padding-bottom:2px; text-align: center; }
-#log .h3 { text-decoration: underline; }
+#log .h1 { font-weight: bold; padding-top:2px; padding-bottom:2px; text-align: center; }
+#log .h2 { padding-top:2px; padding-bottom:2px; text-align: center; }
+#log .h3 { text-align: center; }
 #log .h4 { text-decoration: underline; }
+#log .h5 { text-decoration: underline; }
+
+#log .h1 { background-color: hsl(0,0%,80%); }
+#log .h2.teutonic { background-color: hsl(210,30%,85%); }
+#log .h2.russian { background-color: hsl(36,40%,85%); }
+#log .h3.teutonic { background-color: hsl(210,30%,90%); }
+#log .h3.russian { background-color: hsl(35,40%,90%); }
+
 #log > .i { padding-left: 20px; }
 #log > .ii { padding-left: 32px; }
 #log > div > .i { padding-left: 12px; }
+
 #log .card_tip { font-style: italic; }
 #log .card_tip:hover { text-decoration: underline; }
 #log .lord_tip:hover { cursor: pointer; text-decoration: underline; }