.btn-white {
  width: 120px;
  height: 38px;
  border: 1px solid #FFFFFF;
  border-radius: 6px;
  background: transparent;
  color: #FFFFFF;
}

.btn-white:hover {
  transform: scale(1.05);
  transition: all .2s ease-in-out;
}

.btn-purple {
  width: 120px;
  min-width: fit-content;
  height: 38px;
  border: 1px solid #9E76B4;
  border-radius: 6px;
  background: #9E76B4;
  color: #FFFFFF;
}

.btn-purple:hover {
  transform: scale(1.05);
  transition: all .2s ease-in-out;
}

.btn-black {
  min-width: 120px;
  height: 38px;
  border: 1px solid #000000;
  border-radius: 6px;
  background: #FFFFFF00;
  color: #000000;
}

.btn-black:hover {
  transform: scale(1.05);
  transition: all .2s ease-in-out;
}

.btn-gray {
  width: 120px;
  height: 38px;
  border: 1px solid #B7B7B7;
  border-radius: 6px;
  background: #FFFFFF;
  color: #B7B7B7
}

.btn-gray:hover {
  transform: scale(1.05);
  transition: all .2s ease-in-out;
}

.btn-red {
  width: 120px;
  height: 38px;
  border: 1px solid #e54343;
  border-radius: 6px;
  background: #e54343;
  color: #FFFFFF
}

.btn-red:hover {
  transform: scale(1.05);
  transition: all .2s ease-in-out;
}

.btn-green {
  width: 120px;
  height: 38px;
  border: 1px solid #268e2b;
  border-radius: 6px;
  background: #268e2b;
  color: #FFFFFF
}

.btn-green:hover {
  transform: scale(1.05);
  transition: all .2s ease-in-out;
}

.btn-yellow {
  width: 120px;
  height: 38px;
  border: 1px solid #f18d12;
  border-radius: 6px;
  background: #f18d12;
  color: #FFFFFF
}

.btn-yellow:hover {
  transform: scale(1.05);
  transition: all .2s ease-in-out;
}