#rootContainer #manual {
   position: absolute;
   top: 5.5em;
   bottom: 3em;
   left: 1em;
   right: 1em;
   background-color: #DDDDDD;
   border-radius: 1em;
   border: solid black;
   padding: 1em;
   overflow-y: auto;
   box-shadow: 3px 3px #666;
   z-index: 4;
   visibility: hidden;
}

#rootContainer #manual p {
   font-size: 1em;
   text-align: center;
}

#rootContainer #manual table {
   font-size: 1em;
   margin: 0 auto;
   border-collapse: collapse;
   border: solid gray;
   background-color: #EEEEEE;
}

#rootContainer #manual table th {
   padding: 0.5em;
   border: solid gray;
   background-color: gray;
   color: white;
}

#rootContainer #manual table td {
   padding: 0.5em;
   border: solid gray;
   line-height: 150%;
}

#rootContainer #manual table td .svgInManual {
   width: 1em;
   height: 1em;
   display: inline;
   background-color: #AAAAAA;
   padding: 0.25em 0.5em;
   border: none;
   border-radius: 8px;
   font-size: 1em;
   box-shadow: 3px 3px #666;
   vertical-align: text-bottom;
}

#rootContainer #manual table td .keySymbol {
   width: 1em;
   height: 1em;
   display: inline;
   background-color: #AAAAAA;
   padding: 0.25em 0.5em;
   border: none;
   border-radius: 8px;
   font-size: 0.9em;
   box-shadow: 3px 3px #666;
}

#rootContainer #manual #hideManualButton button {
	display: block;
   margin: 1em auto;
   cursor: pointer;
   background-color: #4CAF50;
   padding: 0.5em 1em;
   border: none;
   border-radius: 8px;
   color: white;
   box-shadow: 3px 3px #666;
	font-size: 1em;
}

#rootContainer #manual #hideManualButton button:active {
  background-color: #3e8e41;
  transform: translate(3px, 3px);
  box-shadow: none;
}
