* {
    font-size: 100%;
    padding: 0;
    margin: 0;
    touch-action: manipulation;
}

html {
    background-color: rgb(31, 3, 22);
}

.container {
    padding: 5px;
}

.wrapper {
    display: flex;
    justify-content: center;
    align-items: center;   
    height: 100%;
    width: 100%;
}

#result {
    background-color: rgb(23 3 17);
    border: 1px solid rgb(67 16 51);
    color: white; 
    font-size: 1.7rem;
    border-radius: 15px;
    height: 280px;
    width: 600px;
    align-items: center;
    display: flex;
    justify-content: center;
    text-align: center;
    margin:5px;
    padding: 10px;
    flex-direction: column;
}

#result div {
    font-size: 5rem;
}
    
#score {
    background-color: rgb(23 3 17);
    border: 1px solid rgb(67 16 51);
    color: white; 
    font-size: 1.5rem;
    border-radius: 15px;
    height: 100px;
    width: 620px;
    align-items: center;
    display: flex;
    justify-content: center;
    text-align: center;
    margin: 5px;
    
}

#score div {
    display: flex;
    justify-content: space-around;
    width: 100%;
}

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

.userInput button {
    background-color: rgb(23 3 17);
    border: 1px solid rgb(67 16 51);
    color: white; 
    font-size: 5.0rem;
    border-radius: 15px;
    margin: 5px;
    height: 200px;
    width: 200px;
    align-items: center;
    display: flex;
    justify-content: center;
    cursor: pointer; 
  }

  .selected, button:hover {
      border: 2px solid rgb(158 60 127)!important;
  }

  #overlay {
    position: fixed; /* Sit on top of the page content */
    display: none; /* Hidden by default */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.6); /* Black background with opacity */
    z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  }

  #overlay_box {
    background-color: rgb(23 3 17);
    border: 1px solid rgb(67 16 51);
    color: white; 
    font-size: 2.0rem;
    border-radius: 15px;
    padding: 10px 30px 30px 30px;
    margin: 30px;
    text-align: center;
  }

 #newGame {
    background-color: rgb(63, 8, 46);
    border: 2px solid rgb(23 3 17);
    color: white; 
    font-size: 1.0rem;
    border-radius: 10px;
    margin-top: 30px;
    padding: 10px;
    cursor: pointer; 
   }

   #overlay_box div { font-size: 7rem; }