.tableFixHead {
background-color:white;
      width: 220px;
      <!--table-layout: fixed;-->
      border-collapse: collapse;
    }
      .tableFixHead tbody {
      display: block;
      <!--width: 100%;-->
      overflow-y: auto;
      overflow-x: hidden;
      height: 100px;
    }
    .tableFixHead thead tr {
      display: block;
    }
    .tableFixHead th,
    .tableFixHead  td {
      <!--padding: 5px 10px;-->
      width: 220px;
    }
.tableFixHead thead th:nth-child(1), tbody td:nth-child(1) {
	width:100px;
}
.tableFixHead thead th:nth-child(2), tbody td:nth-child(2) {
	width:100px;
}
.tableFixHead thead th:nth-child(3), tbody td:nth-child(3) {
	width:50px;
}

#dialog {
    display:none;
	background-color: white;
}

svg#my_map {
  height: 150px;
  width: 240px;
}
svg#front_map {
  height: 170px;
  width: 100px;
}

path {
  transition: 0.1s;
  transform-origin: 5%;
  stroke: #929ba9;
  stroke-width: 4;
  paint-order: stroke;
  opacity:60%
}

path:hover {
  z-index: 1;
  transform: scale(1);
  fill: gold;
opacity: 100%
}
.navOnCube {
	position: absolute;
	top: 349px;
	left:825px;
display:none;
}
.navFrontCube {
	position: absolute;
	top: 487px;
	left:845px;
	z-index: 2;
display:none;
}
#displayNavigation a:link, a:visited, a:hover, a:active {
  background-color: black;
  color: white;
  padding: 0px 10px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

/*#displayNavigation a:hover, a:active {*/
  /*background-color: red;*/
  /*color: white;*/
/*}*/
#displayNavigation table td { font-style: bold;}

        body {
            color: #888888;
            font-family: Monospace;
            font-size: 9pt;
            background-color: #000;
            margin: 0px;
            overflow: hidden;
        }

        #info {
            position: absolute;
            top: 0px;
            width: 200px;
            left: calc(50% - 100px);
            text-align: center;
        }
        #guide {
            position: absolute;
            top: 0px;
            width: 300px;
	    height: calc(100% -40px);
            left: calc(100% - 300px);
	    overflow-y: scroll;
	    overflow-x:hidden;
        }
	.guideButtons {
            position: absolute;
            top: calc(100% - 40px);
            width: 300px;
	    height: 30px;
            left: calc(100% - 300px);
	    overflow-y:hidden;
	    overflow-x:hidden;
	    visibility:hidden;
	    text-align:center;
	}
	#contBtn {
            position: absolute;
            top: calc(100% - 40px);
            width: 300px;
	    height: 30px;
            left: calc(100% - 300px);
	    overflow-y:hidden;
	    overflow-x:hidden;
	    text-align:center;
	}

        /*a {*/
            /*color: #00f;*/
        /*}*/
.normal .subHdg{
}
.highlight {
	color:black;
	background-color:white;
}
.highlight1 {
	color:black;
	background-color:yellow;
}
.highlight2 {
	color:black;
	background-color:orange;
}
.highlight3 {
	color:black;
	background-color:lightgreen;
}
.navigation {
    position: absolute;
    /*top: calc(100% - 460px);*/
    width: 150px;
    height: 100px;
    left: 0px;

}
.navigationHdg {
    position: absolute;
    top: 20vh;
    /*calc(100% - 598px);*/
    width: 150px;
    height: 218px;
    left: 0px;
}
.navigationHdgCaption {
	font-size:1.2em; 
	font-weight:bold; 
	background-color: white; 
	color:black;
	padding-left: 1px;
	width: 200px;
	z-index:9;
}
#displayNavigation {
   position: absolute;
    /*top: 100;*/
    width: 150px;
    height: 100px;

 margin-top: -30%;
}

#displayLegend {
   position: absolute;
    top: 50;
    width: 120px;
    height: 120px;
}

.status {
    position: absolute;
    top: calc(100% - 200px);
    width: 150px;
    height: 200px;
    left: 0px;
    overflow-y: scroll;
    overflow-x:hidden;	
    border-style: solid;
    border-color: white;
}
.statusHdg {
    position: absolute;
    top: calc(100% - 238px);
    width: 150px;
    height: 218px;
    left: 0px;
}
.statusHdgCaption {
	font-size:1.2em; 
	font-weight:bold; 
	background-color: white; 
	color:black;
	padding-left: 15px;
	width: 200px;
	z-index:9;
}
<!--.statusHdg caption {-->
<!--	font-size:1.2em; font-weight:bold;-->
<!--	background-color: white;-->
<!--	color:black;-->
<!--}-->
#displayMoveHist {
 margin-top:5px;
}
#displayMoveHist span {
	text-align: left;
	margin-left: 10px;
	display:inline-block;
	z-index:1;
}
.userMove {
	color: white;
}
.redoMove {
	color: gray;
}
.sysMove {
	color: red;
}
.colorb {
  color: lightblue;
}
.colorr {
  color: red;
}
.colorg {
  color: green
  ;
}
.coloro {
  color: orange;
}