.cognitoDivSuccess {
  font-size: 17px;
  font-weight: 600;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  border: 1px solid rgb(16, 191, 166);
  border-radius: 4px;
  color: rgb(16, 191, 166);
}

.cognitoDivFailed {
  font-size: 17px;
  font-weight: 600;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  border: 1px solid rgb(254, 65, 127);
  border-radius: 4px;
  color: rgb(254, 65, 127);
}

.cognitoDivNA {
  font-size: 10px;
  font-weight: 600;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  border: 1px solid rgb(165, 173, 185);
  border-radius: 4px;
  color: rgb(165, 173, 185);
}

.cognitoDivSuccessSmall {
  font-size: 10px;
  font-weight: 600;
  text-align: center;
  width: 40px;
  height: 40px;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  border: 1px solid rgb(16, 191, 166);
  border-radius: 4px;
  color: rgb(16, 191, 166);
}

.cognitoDivFailedSmall {
  font-size: 10px;
  font-weight: 600;
  text-align: center;
  width: 40px;
  height: 40px;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  border: 1px solid rgb(254, 65, 127);
  border-radius: 4px;
  color: rgb(254, 65, 127);
}

.cognitoDivNASmall {
  font-size: 10px;
  font-weight: 600;
  text-align: center;
  width: 40px;
  height: 40px;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  border: 1px solid rgb(165, 173, 185);
  border-radius: 4px;
  color: rgb(165, 173, 185);
}

.boxEmpty {
  height: 19px;
  width: 35px;
  background-color: rgb(246, 246, 246);
  border: 1px solid rgb(224, 224, 224);
  color: rgb(143, 143, 143);
  text-align: center;
  margin-right: 15px;
  font-size: 14px;
  padding-top: 1px;
  border-radius: 4px;
}

.boxFlag {
  margin-right: 15px;
  height: 17px;
  border-radius: 2px;
  filter: drop-shadow(rgba(0, 0, 0, 0.15) 0px 1px 1px);
  width: 35px;
}

.statusBox {
  background: rgb(255, 240, 229);
  font-weight: 500;
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 12px;
  height: 28px;
  flex-direction: column;
  -webkit-box-pack: center;
  justify-content: center;
  white-space: nowrap;
  border: 1px solid rgb(143, 143, 143);
  color: rgb(143, 143, 143);
  width: 100%;
  text-align: center;
}

.statusBox.active {
  border: 1px solid rgb(10, 133, 234);
  color: rgb(10, 133, 234);
  background: rgb(235, 241, 252);
}

.statusBox.pending_review {
  border: 1px solid rgb(235, 98, 0);
  color: rgb(235, 98, 0);
}

.statusBox.success {
  border: 1px solid rgb(14, 160, 138);
  color: rgb(14, 160, 138);
  background: rgb(242, 252, 251);
}

.statusBox.failed {
  border: 1px solid rgb(237, 94, 111);
  color: rgb(237, 94, 111);
  background: rgb(253, 240, 241);
}

.statusBox.canceled {
  border: 1px solid rgb(177, 140, 47);
  color: rgb(177, 140, 47);
  background: rgb(255, 252, 227);
}

.statusBox.expired {
  border: 1px solid rgb(143, 143, 143);
  color: rgb(143, 143, 143);
  background: rgb(246, 246, 246);
}

.cursorGrab {
  cursor: pointer;
}