html{
  background-color:#222A32;
  }
  .menu{
  display:flex;
  flex-flow:row;
  justify-content:space-around;
  width:90vw;
  box-sizing:border-box;
}
.menu div{
  border-width:5px;
  border-color:black;
  border-style:solid;
  padding:10px;
  background-color:grey;
}
.buttons{
  display:flex;
  flex-flow:row;
  justify-content:space-around;
  width:70vw;
  box-sizing:border-box;
}
.time{
  text-align:center;
  width:16vw;}
.game{
  display:grid;
  grid-template-columns: repeat(16, minmax(3vw, 0px));
  grid-gap: 0px;
  align-items: stretch;
  justify-items: center;
  align-items:center;
  margin: 5vw auto;
  margin-left:28vw;
  padding:0;
  text-align:center;
  float:center;
  width:48vw;
  border:2px solid black;
  background-color:#4c545c;
  }
.game div{
  width:3vw;
  height:3vw;
  box-sizing:border-box;
  background-color:#4c545c;
  border:8px outset #363E46;
  border-left:8px outset #363E46;
  border-bottom:8px outset #363E46;
  font-weight:bold;
  font-size:1vw;
  -webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
color:rgba(255,255,255,0);
  }
  .game div p{
    vertical-align:top;
  }
  .game .flagged, .game .ended{
    border:2px outset #2F373F}
  .flagged{
    background-image:url(flag.png);
    background-size: 2.9vw;}
    .flagged p{
      opacity:0;}
   .ended{
    background-image:url(flagged.png);
    background-size: 2.9vw;
    }
    .ended p{
      opacity:0;}