.cards-menu {
  position: absolute;
  width: 105%;
  max-height: max-content;
  left: 1rem;
  top: 6rem;
  box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
  border-radius: 16px;
  z-index: 1000;
}
.supportInput input::placeholder {
  color: #aaa;
}
.card-detail-barcode-mobile svg {
  width: 100%;
}
.d-none-fund {
  display: none;
}
.d-block-fund {
  display: block;
}
.text-support h5,
.text-support p {
  color: white;
}
.card-support {
  background: #396ed8;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.25);
  border-radius: 16px;
  width: 100%;
}
.text-support {
  font-size: 1rem;
  font-weight: 400;
  line-height: normal;
}
.container-icon {
  border-radius: 8px;
  width: 44px;
  height: 44px;
  min-width: 44px !important;
  justify-content: center;
  align-items: center;
  display: flex;
}
.bg-gray-100 {
  background-color: #f3f4f6;
}
/* sign in specific elements */
.sign-in-button:disabled {
  background-color: #e5e5e5 !important;
  color: #ababab !important;
}
/* position */
.p-absolute {
  position: absolute !important;
}
.p-fixed {
  position: fixed !important;
}
.p-relative {
  position: relative !important;
}
/* spacing */
.m-auto {
  margin: auto !important;
}
.mt-auto {
  margin-top: auto !important;
}
.mr-auto {
  margin-right: auto !important;
}
.mb-auto {
  margin-bottom: auto !important;
}
.ml-auto {
  margin-left: auto !important;
}
/*  flex   */
.d-flex {
  display: flex;
}
.d-flex-column {
  flex-direction: column !important;
}
.justify-content-center {
  justify-content: center !important;
}
.justify-content-sA {
  justify-content: space-around !important;
}
.justify-content-sB {
  justify-content: space-between !important;
}
.justify-content-sE {
  justify-content: space-evenly !important;
}
.align-items-center {
  align-items: center !important;
}
/*  text and fonts  */
.fw-100 {
  font-weight: 100 !important;
}
.fw-200 {
  font-weight: 200 !important;
}
.fw-300 {
  font-weight: 300 !important;
}
.fw-400 {
  font-weight: 400 !important;
}
.fw-500 {
  font-weight: 500 !important;
}
.fw-600 {
  font-weight: 600 !important;
}
.fw-700 {
  font-weight: 700 !important;
}
.fw-800 {
  font-weight: 800 !important;
}
.fw-900 {
  font-weight: 900 !important;
}
.fs-5px {
  font-size: 5px !important;
}
.fs-6px {
  font-size: 6px !important;
}
.fs-7px {
  font-size: 7px !important;
}
.fs-8px {
  font-size: 8px !important;
}
.fs-9px {
  font-size: 9px !important;
}
.fs-10px {
  font-size: 10px !important;
}
.fs-11px {
  font-size: 11px !important;
}
.fs-12px {
  font-size: 12px !important;
}
.fs-13px {
  font-size: 13px !important;
}
.fs-14px {
  font-size: 14px !important;
}
.fs-15px {
  font-size: 15px !important;
}
.fs-16px {
  font-size: 16px !important;
}
.fs-17px {
  font-size: 17px !important;
}
.fs-18px {
  font-size: 18px !important;
}
.fs-19px {
  font-size: 19px !important;
}
.fs-20px {
  font-size: 20px !important;
}
.text-center {
  text-align: center !important;
}
/* border */
.border-none {
  border: none !important;
}
.border-radius-10px {
  border-radius: 10px !important;
}
/*   colors    */
.text-white {
  color: #fff !important;
}
.bg-transparent {
  background-color: transparent !important;
}
.white-bg {
  background-color: #fff !important;
}
.color-white {
  color: #fff !important;
}
.blueColor-500 {
  color: #396ed8 !important;
}
.grey-500 {
  color: #8398a3 !important;
}
.grey-700 {
  color: #415d6a !important;
}
.grey-900 {
  color: #162a34 !important;
}
.red-500 {
  color: #f4765d !important;
}
.red-bg-500 {
  background-color: #f4765d !important;
}
.red-bg-500:disabled {
  color: white !important;
  background-color: #bbb !important;
  opacity: 80%;
}
.red-700 {
  color: #e24222 !important;
}
/* inputs */
.placeholder-gray-500::placeholder {
  color: #8398a3 !important;
}
.flexDirCol {
  flex-direction: column;
}
.benefit-card-bg {
  background-size: cover;
  max-width: 400px;
  min-width: 350px !important;
  border-radius: 20px;
  margin: 0 auto !important;
  flex-direction: column;
}
.card-info-payment {
  height: 80px;
  background-color: #e6edf0;
  border-radius: 0px 0px 80px 80px;
}
.card-date-button {
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.activity-title {
  font-size: 24px;
  font-weight: 600;
  line-height: 28px;
  color: #8398a3;
  align-self: center;
}