*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:sans-serif;


}
html,body{
  width:100%;
  height:100%;
}

.container{
  /* background-color:#4f3222; */
  height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:50px;
}
.inputBtnContainer{
  margin:20px 0px;
}

.heading{
  background-color:#7b241c;
  color:cornsilk;
  font-size:2.5rem;
  width:fit-content;
  padding:8px;
  margin: 10px;
  border-radius:8px;
}

#randomBtn{
   padding: 8px 12px;
   margin:8px 12px;
  font-size: 16px;
  font-weight: 600;
  border: none;
  border-radius: 8px;
  background-color:#5dbea3;
  
}

#applyBtn{
   padding: 8px 16px;
   margin:8px 12px;
  font-size: 16px;
  font-weight: 600;
  border: none;
  border-radius: 8px;
  background-color: #33b249;
  
}
#inputBox{
  padding:10px 18px;
  font-size:12px;
  border-Radius:5px;
}

#currentColor{
   margin:20px 0px;
    font-size: 16px;
     font-weight: 600;
     background-color:#2c3e50;
     padding:10px 18px;
     border-radius:5px;
     color:bisque;
}