
#controlsDiv{
  display: flex;
  background-color: #c1cbe7;
  height: 80px;
  justify-content: center;
}

#resultsDiv{
  display: flex;
  height: 200px;
}

#doorsDiv {
  display: flex;
  justify-content: center;
}

button {
  font-size: 15pt;
  margin: 10px;
}

div.pickedDoor{
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 32pt;
  margin: 10px;
  cursor: pointer;
  border-radius: 20px;
  border: 3px solid #555;
  background-color: #3B6BF9;
  color: white;
  font-weight: bold;
}

div.plainDoor {
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 32pt;
  margin: 10px;
  cursor: pointer;
  border-radius: 20px;
  border: 1px solid #555;
  background-color: #A2BAF3;
  color: white;
  font-weight: bold;
}

div.winDoor {
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 32pt;
  margin: 10px;
  cursor: pointer;
  border-radius: 20px;
  border: 3px solid #555;
  background-color: #AAFFAA;
  color: white;
  font-weight: bold;
}

div.loseDoor {
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 32pt;
  margin: 10px;
  cursor: pointer;
  border-radius: 20px;
  border: 3px solid #555;
  background-color: #FAA;
  color: white;
  font-weight: bold;
}

div.doorWithStripes {
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 32pt;
  margin: 10px;
  cursor: pointer;
  border-radius: 20px;
  border: 1px solid #555;

  background-color: rgb(162, 186, 243); /* For browsers that do not support gradients */
  background-image: repeating-linear-gradient(45deg, rgb(162, 186, 243) 0px, rgb(162, 186, 243) 10px, rgb(162, 186, 243) 10px, rgb(211, 212, 214) 10px, rgb(211, 212, 214) 20px);

  color: white;
  font-weight: bold;
}

.mhBtn{
  width: 120px;
  height: 50px;
  border-radius: 10px;
  border: 1px solid #555;
  font-size: 15px; 
}

.active{
  font-weight: bold;
  color: #3B6BF9 !important;
}

/*-- not currently working...why? ---*/
button#stayBtn{
  background-color: rgb(229, 117, 117) !important;
}

/*-- not currently working...why? ---*/
button#switchBtn{
  background-color: rgb(187, 250, 195) !important;
}