.container {
  display: flex;
  justify-content: center;
}


.box2d {
    display: inline-block; /* this will allow multiple divs to sit next to each other */
    height: 28px;
    margin: 10px;
    background-color: #2d2d2d;
    white-space: nowrap;
    cursor: pointer;
    /* padding: 1px 8px 0px 10px; */
    line-height: 27px;
    color: #BBB;
    font-size: 13px;
    font-weight: bold;
    border-spacing: 0px;
}
.box2d:hover {
    color: #FFF;
}
.box2d.empty {
    cursor: auto;
    width: 10%; /* or any width you want */
}
.box2d.empty:hover {
    background-color: #2d2d2d;
}




body {

				margin: 0;
				overflow: hidden;
				background-color: black;
				/* font-family: Arial, sans-serif; */
				font-family: monospace;
				font-size: 16pt;
				user-select: none;
				-webkit-user-select: none;
				-moz-user-select: none;
				-o-user-select: none;
				-ms-user-select: none;

			}

		


.boxSelected {
  box-shadow: 0 0 0 2px white !important; 
  outline: 2px dashed black !important; 
}

.banner {
  width: 100%; /* Full width */
  height: 20vh; /* 10% of the viewport height */
  max-width: 75%;
  height: auto;
  position: relative; /* Relative positioning */
  color: white;
  font-family: monospace;
  text-align: left;
  padding: 1vh; 
  
  background: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0)); /* Gradient from black to transparent */
  z-index: 1; /* Appear on top if necessary */
}

.banner a, .banner a * {
  color: inherit !important; 
  /* color: white !important; */
  text-decoration: none !important;
}

#game_score {
  position: fixed; /* Fixed positioning */
  top: 0; /* Align to the top of the viewport */
  right: 0; /* Align to the right of the viewport */
  max-width: 25%; 
  color: white; /* Text color */
  font-size: 1em; /* Font size */
  text-align: right; /* Text aligned to the right */
  padding: 1vh; /* Some padding */
  z-index: 2; /* Appear on top of the banner */
}