button {
  background-color: #edf1f7;
  border-color: #edf1f7;
  color: #222b45;
  border-style: solid;
  border-width: 0.0625rem;
  text-transform: uppercase;
  border-radius: 0.25rem;
  padding: 0 1.125rem;
  height: 40px;
}
button.primary {
  background-color: #3366ff;
  border-color: #3366ff;
  color: #ffffff;
}
button.primary:active {
  background-color: #274bdb;
  border-color: #274bdb;
}
button.primary:focus {
  background-color: #274bdb;
  border-color: #1a34b8;
}
button.primary:hover {
  background-color: #598bff;
  border-color: #598bff;
}
button.info {
  background-color: #0095ff;
  border-color: #0095ff;
  color: #ffffff;
}
button.info:active {
  background-color: #006fd6;
  border-color: #006fd6;
}
button.info:focus {
  background-color: #006fd6;
  border-color: #0057c2;
}
button.info:hover {
  background-color: #42aaff;
  border-color: #42aaff;
}
button.warning {
  background-color: #ffaa00;
  border-color: #ffaa00;
  color: #ffffff;
}
button.warning:active {
  background-color: #db8b00;
  border-color: #db8b00;
}
button.warning:focus {
  background-color: #db8b00;
  border-color: #b86e00;
}
button.warning:hover {
  background-color: #ffc94d;
  border-color: #ffc94d;
}
button.success {
  background-color: #00d68f;
  border-color: #00d68f;
  color: #ffffff;
}
button.success:active {
  background-color: #00b887;
  border-color: #00b887;
}
button.success:focus {
  background-color: #00b887;
  border-color: #00997a;
}
button.success:hover {
  background-color: #2ce69b;
  border-color: #2ce69b;
}
button.danger {
  background-color: #ff3d71;
  border-color: #ff3d71;
  color: #ffffff;
}
button.danger:active {
  background-color: #db2c66;
  border-color: #db2c66;
}
button.danger:focus {
  background-color: #db2c66;
  border-color: #b81d5b;
}
button.danger:hover {
  background-color: #ff708d;
  border-color: #ff708d;
}
button.control {
  background-color: #ffffff;
  border-color: #ffffff;
  color: #222b45;
}
button.control:active {
  background-color: #edf1f7;
  border-color: #edf1f7;
}
button.control:focus {
  background-color: #edf1f7;
  border-color: #c5cee0;
}
button.control:hover {
  background-color: #f7f9fc;
  border-color: #f7f9fc;
}
button:focus {
  background-color: #e4e9f2;
  border-color: #c5cee0;
  outline: none;
  box-shadow: 0 0 0 0.375rem rgba(143, 155, 179, 0.16);
}
button:hover {
  background-color: #f7f9fc;
  border-color: #f7f9fc;
}
button:active {
  background-color: #e4e9f2;
  border-color: #e4e9f2;
}