#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.5); /* Black background with opacity */
  z-index: 10; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}

.btn-proccess{
  background-color: #ffaf40;
  color:#303952;
}
.btn-shipping-sent{
  background-color: #fffa65;
  color:#303952;
}
.btn-shipping-received{
  background-color: #18dcff;
  color:#303952;
}
.btn-courier-contacted{
  background-color: #cd84f1;
  color:#303952;
}
.btn-courier-received{
  background-color: #7efff5;
  color:#303952;
}
.btn-order-complete{
  background-color: #32ff7e;
  color:#303952;
}

/* hover */
.btn-proccess:hover{
  background-color: #d49338;
}
.btn-shipping-sent:hover{
  background-color: #c7c350;
}
.btn-shipping-received:hover{
  background-color: #15a9c4;
}
.btn-courier-contacted:hover{
  background-color: #9b64b6;
}
.btn-courier-received:hover{
  background-color: #5ec2b9;
}
.btn-order-complete:hover{
  background-color: #27c460;
}