body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: #f0f2f5 !important;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
    "Segoe UI Symbol", "Noto Color Emoji";
  min-height: 100vh;
}
.font-weight-bold {
  font-weight: 700;
}
.text-dark {
  color: #343a40;
}
.align-center {
  align-items: center;
}
.flex {
  display: flex;
  flex-direction: row;
}
.ml-1 {
  margin-left: 5px;
}
.p-1 {
  padding: 5px;
}
.px-2 {
  padding-left: 10px;
  padding-right: 10px;
}
.py-2 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.px-4 {
  padding-left: 20px;
  padding-right: 20px;
}
.bg-primary {
  background-color: #007bff;
}
.text-white {
  color: #fff;
}
.rounded {
  border-radius: 4px;
}
button {
  outline: none;
  border: none;
}
.mainbox {
  max-width: 640px;
  margin: 0 auto;
}
.mainbox .part1 {
  background-color: #f8f8f8;
  margin: 15px;
  padding: 15px;
  box-sizing: border-box;
  border-radius: 10px;
}
.mainbox .part1 .name {
  text-align: center;
}
.mainbox .part1 .input {
  height: 30px;
  line-height: 30px;
  width: 100%;
  border: 1px solid #ccc;
  margin: 10px 0;
  padding-left: 5px;
}
.mainbox .part1 .button {
  justify-content: center;
}
.mainbox .part1 .button button {
  margin: 0 auto;
  background-color: #00a6ff;
}
.mainbox .part1 .tips {
  color: #e97c75;
  margin-top: 20px;
  margin-bottom: 10px;
  text-align: center;
  font-weight: 700;
}
.mainbox .part1 .code {
  justify-content: center;
  margin-bottom: 10px;
}
.mainbox .part1 .money {
  text-align: center;
  font-size: 20px;
}
.mainbox .part1 .tip img {
  width: 100%;
}
.mainbox .part1 .utr {
  justify-content: center;
  margin-top: 10px;
}
.mainbox .part1 .utr i {
  color: red;
}
.mainbox .part1 .utr input {
  height: 30px;
  line-height: 30px;
  width: 60%;
  border: 1px solid #ccc;
  padding: 0 10px;
}
.mainbox .part2 {
  justify-content: center;
}
.mainbox .part2 button {
  background-color: #00a6ff;
}
.mainbox .part3 {
  background-color: #f8f8f8;
  margin: 25px 15px 15px;
  padding: 20px 15px 15px;
  box-sizing: border-box;
  border-radius: 10px;
  line-height: 20px;
}

.maincontent {
  min-height: calc(100vh - 2rem);
}

.header {
  background: #2681c3;
  border-bottom: 2px solid transparent;
  box-shadow: 0 4px 4px #0573f04d;
}

.header .content {
  padding: 15px;
  display: grid;
  gap: 0.5rem;
}

.header .content span {
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  font-family: Space Grotesk;
}

.header .info {
  display: flex;
  justify-content: space-between;
  font-size: 24px;
  color: #fff;
  font-style: normal;
}

.header .countdown {
  font-weight: 600;
  color: #ff9e9e;
  font-family: Space Grotesk;
  width: 70px;
}

.indiasvg {
  width: 24px;
  height: 24px;
}

.container {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

.utrback .card {
  padding: 5px;
}

.utrback .col-12 {
  padding-right: 0px !important;
  padding-left: 0px !important;
}

.form-control::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #707070;
  font-style: normal;
  font-size: 0.8rem !important;
}
.form-control::-moz-placeholder { /* Firefox 19+ */
  color: #707070;
  font-style: normal;
  font-size: 0.8rem !important;
}
.form-control:-ms-input-placeholder { /* IE 10+ */
  color: #707070;
  font-style: normal;
  font-size: 0.8rem !important;
}
.form-control:-moz-placeholder { /* Firefox 18- */
  color: #707070;
  font-style: normal;
  font-size: 0.8rem !important;
}
.form-control::placeholder {
  color: #707070;
  font-style: normal;
  font-size: 0.8rem !important;
}

.info .amount {
  display: flex;
  align-items: center;
}

.footerStyle {
  /* position: fixed;
  bottom: 1rem;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.8rem; */
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.8rem;
  width: 100%;
}
.accordion .card .card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.qrcode {
  display: flex;
  justify-content: center;
}
.qrcode img {
  border: 1px solid #bec4ca;
  border-radius: 5px;
  padding: 0.5rem;
}
.title {
  color: #000;
  font-size: 1.25rem;
  font-weight: 600;
  font-family: Space Grotesk;
}
.toptext {
  color: #5a5a5a;
  font-size: 0.7rem;
  font-family: normal;
}
.text-red {
  color: #ff0000;
  font-family: Space Grotesk;
  font-size: 1rem;
  font-weight: 500;
}
.d-flex {
  padding: 0.25rem;
  border: 1px solid #bec4ca;
}

.not-border-top {
  border-top: none;
}

.toast_box {
  position: absolute;
  bottom: 50%;
  left: 50%;
  z-index: 10;
  transform: translate(-50%, -50%);
  display: none;
}

.toast_box p {
  box-sizing: border-box;
  padding: 10px 20px;
  width: max-content;
  background: #000;
  color: #fff;
  font-size: 16px;
  text-align: center;
  border-radius: 6px;
  opacity: 0.7;
}

.loadingico {
  background-repeat: no-repeat;
  height: 8rem;
  width: 8rem;
  background-image: url("../image/UPI.svg");
  background-size: 8rem 8rem;
  margin-left: 1rem;
  margin-top: 1rem;
}

.loading {
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.image-container {
  position: relative;
  width: 10rem;
  height: 10rem;
  margin: 0 auto;
  overflow: hidden;
}

.progress-bar {
  position: absolute;
  width: 100%;
  height: 100%;
  border: 5px solid transparent;
  border-top-color: #2b82e0;
  background-color: unset !important;
  border-radius: 50%;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.icon-gpay,
.icon-paytm,
.icon-phonepe,
.icon-upi {
  background-size: 5rem 3rem;
  background-repeat: no-repeat;
  height: 3rem;
  width: 5rem;
}

.icon-gpay {
  background-image: url("../image/wakup_gpay.svg");
  background-size: 4rem 3rem;
}

.icon-paytm {
  background-image: url("../image/Paytm_Logo.svg");
}

.icon-phonepe {
  background-image: url("../image/wakup_phonepe.svg");
}

.icon-upi {
  background-image: url("../image/UPI.svg");
  background-size: 4rem 3rem;
}

.payitem {
  display: flex !important;
  padding: 0.2rem 0.5rem;
  /* border-bottom: 1px solid #b2acac; */
}

Button[type="submit"] {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

*,
*:before,
*:after {
  box-sizing: border-box;
}

.submitUtr {
  height: 2.4rem !important;
  width: 7.8rem !important;
  border-radius: 0 !important;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff !important;
  background-color: #007bff !important;
  border: 2px solid #007bff !important;
}

.submitUtr.active {
  font-size: 0 !important;
  border-radius: 1.5rem !important;
  width: 2.4rem !important;
  background: transparent !important;
}

Button[type="submit"] {
  height: 2rem;
  width: 5rem;
  background: transparent;
  border-radius: 1.5rem;
  will-change: transform;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  border: 2px solid #ff5126;
  cursor: pointer;
  color: #ffffff;
  font-size: 1rem;
  color: #ff5126;
  outline: none;
  text-align: center;
}

Button[type="submit"].active {
  font-size: 0;
  border-radius: 1.5rem;
  width: 2rem;
  background: transparent;
}
Button[type="submit"].loader {
  border-right: 2px solid #ffffff !important;
  -webkit-animation: loader 0.6s linear infinite;
  animation: loader 0.6s linear infinite;
}
Button[type="submit"].success {
  background: #3bb873 !important;
  border-color: #3bb873 !important;
  font-size: 1rem;
  color: #ffffff;
}
@-webkit-keyframes loader {
  0% {
    -webkit-transform: rotateZ(0);
    transform: rotateZ(0);
  }
  100% {
    -webkit-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
  }
}
@keyframes loader {
  0% {
    -webkit-transform: rotateZ(0);
    transform: rotateZ(0);
  }
  100% {
    -webkit-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
  }
}

.i-emojione-flag-for-us-outlying-islands {
  background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 64 64' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%23ed4c5c' d='M48 6.6C43.3 3.7 37.9 2 32 2v4.6z'/%3E%3Cpath fill='%23fff' d='M32 11.2h21.6C51.9 9.5 50 7.9 48 6.6H32z'/%3E%3Cpath fill='%23ed4c5c' d='M32 15.8h25.3c-1.1-1.7-2.3-3.2-3.6-4.6H32z'/%3E%3Cpath fill='%23fff' d='M32 20.4h27.7c-.7-1.6-1.5-3.2-2.4-4.6H32z'/%3E%3Cpath fill='%23ed4c5c' d='M32 25h29.2c-.4-1.6-.9-3.1-1.5-4.6H32z'/%3E%3Cpath fill='%23fff' d='M32 29.7h29.9c-.1-1.6-.4-3.1-.7-4.6H32z'/%3E%3Cpath fill='%23ed4c5c' d='M61.9 29.7H32V32H2c0 .8 0 1.5.1 2.3h59.8c.1-.8.1-1.5.1-2.3c0-.8 0-1.6-.1-2.3'/%3E%3Cpath fill='%23fff' d='M2.8 38.9h58.4c.4-1.5.6-3 .7-4.6H2.1c.1 1.5.4 3.1.7 4.6'/%3E%3Cpath fill='%23ed4c5c' d='M4.3 43.5h55.4c.6-1.5 1.1-3 1.5-4.6H2.8c.4 1.6.9 3.1 1.5 4.6'/%3E%3Cpath fill='%23fff' d='M6.7 48.1h50.6c.9-1.5 1.7-3 2.4-4.6H4.3c.7 1.6 1.5 3.1 2.4 4.6'/%3E%3Cpath fill='%23ed4c5c' d='M10.3 52.7h43.4c1.3-1.4 2.6-3 3.6-4.6H6.7c1 1.7 2.3 3.2 3.6 4.6'/%3E%3Cpath fill='%23fff' d='M15.9 57.3h32.2c2.1-1.3 3.9-2.9 5.6-4.6H10.3c1.7 1.8 3.6 3.3 5.6 4.6'/%3E%3Cpath fill='%23ed4c5c' d='M32 62c5.9 0 11.4-1.7 16.1-4.7H15.9c4.7 3 10.2 4.7 16.1 4.7'/%3E%3Cpath fill='%23428bc1' d='M16 6.6c-2.1 1.3-4 2.9-5.7 4.6c-1.4 1.4-2.6 3-3.6 4.6c-.9 1.5-1.8 3-2.4 4.6c-.6 1.5-1.1 3-1.5 4.6c-.4 1.5-.6 3-.7 4.6c-.1.8-.1 1.6-.1 2.4h30V2c-5.9 0-11.3 1.7-16 4.6'/%3E%3Cpath fill='%23fff' d='m25 3l.5 1.5H27l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm4 6l.5 1.5H31l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm-8 0l.5 1.5H23l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm4 6l.5 1.5H27l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm-8 0l.5 1.5H19l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm-8 0l.5 1.5H11l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm20 6l.5 1.5H31l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm-8 0l.5 1.5H23l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm-8 0l.5 1.5H15l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm12 6l.5 1.5H27l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm-8 0l.5 1.5H19l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm-8 0l.5 1.5H11l-1.2 1l.4 1.5l-1.2-.9l-1.2.9l.4-1.5l-1.2-1h1.5zm2.8-14l1.2-.9l1.2.9l-.5-1.5l1.2-1h-1.5L13 9l-.5 1.5h-1.4l1.2.9zm-8 12l1.2-.9l1.2.9l-.5-1.5l1.2-1H5.5L5 21l-.5 1.5h-1c0 .1-.1.2-.1.3l.8.6z'/%3E%3C/svg%3E") no-repeat;
  background-size: 100% 100%;
  background-color: transparent;
  width: 1.2em;
  height: 1.2em;
}

.i-emojione-flag-for-india {
  background: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 64 64' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%23f2b200' d='M31.8 2c-13 0-24.1 8.4-28.2 20h56.6C56 10.4 44.9 2 31.8 2'/%3E%3Cpath fill='%2383bf4f' d='M31.8 62c13.1 0 24.2-8.3 28.3-20H3.6c4.1 11.7 15.2 20 28.2 20'/%3E%3Cpath fill='%23fff' d='M3.6 22c-1.1 3.1-1.7 6.5-1.7 10s.6 6.9 1.7 10h56.6c1.1-3.1 1.7-6.5 1.7-10s-.6-6.9-1.7-10z'/%3E%3Ccircle cx='31.8' cy='32' r='8' fill='%23428bc1'/%3E%3Ccircle cx='31.8' cy='32' r='7' fill='%23fff'/%3E%3Cg fill='%23428bc1'%3E%3Ccircle cx='29.2' cy='25.5' r='.5'/%3E%3Ccircle cx='27.6' cy='26.4' r='.5'/%3E%3Ccircle cx='26.3' cy='27.7' r='.5'/%3E%3Ccircle cx='25.4' cy='29.3' r='.5'/%3E%3Ccircle cx='24.9' cy='31.1' r='.5'/%3E%3Ccircle cx='24.9' cy='32.9' r='.5'/%3E%3Ccircle cx='25.4' cy='34.7' r='.5'/%3E%3Ccircle cx='26.3' cy='36.3' r='.5'/%3E%3Ccircle cx='27.6' cy='37.6' r='.5'/%3E%3Ccircle cx='29.2' cy='38.5' r='.5'/%3E%3Ccircle cx='30.9' cy='38.9' r='.5'/%3E%3Cpath d='M32.3 39c0-.3.2-.5.4-.6c.3 0 .5.2.6.4c0 .3-.2.5-.4.6c-.4.1-.6-.1-.6-.4'/%3E%3Ccircle cx='34.5' cy='38.5' r='.5'/%3E%3Ccircle cx='36.1' cy='37.6' r='.5'/%3E%3Ccircle cx='37.4' cy='36.3' r='.5'/%3E%3Ccircle cx='38.3' cy='34.7' r='.5'/%3E%3Ccircle cx='38.8' cy='32.9' r='.5'/%3E%3Cpath d='M38.8 31.6c-.3 0-.5-.2-.6-.4c0-.3.2-.5.4-.6c.3 0 .5.2.6.4c.1.3-.1.5-.4.6'/%3E%3Ccircle cx='38.3' cy='29.3' r='.5'/%3E%3Ccircle cx='37.4' cy='27.7' r='.5'/%3E%3Ccircle cx='36.1' cy='26.4' r='.5'/%3E%3Cpath d='M35 25.7c-.1.3-.4.4-.7.3c-.3-.1-.4-.4-.3-.7c.1-.3.4-.4.7-.3c.3.2.4.5.3.7m-1.8-.6c0 .3-.3.5-.6.4c-.3 0-.5-.3-.4-.6c0-.3.3-.5.6-.4c.3.1.5.4.4.6m-1.8-.1c0 .3-.2.5-.4.6c-.3 0-.5-.2-.6-.4c0-.3.2-.5.4-.6c.3-.1.6.1.6.4'/%3E%3Ccircle cx='31.8' cy='32' r='1.5'/%3E%3Cpath d='m31.8 25l-.2 4.3l.2 2.7l.3-2.7zm-1.8.2l.9 4.3l.9 2.5l-.4-2.7z'/%3E%3Cpath d='m28.3 25.9l2 3.9l1.5 2.2l-1.1-2.5zM26.9 27l2.9 3.3l2 1.7l-1.7-2.1z'/%3E%3Cpath d='m25.8 28.5l3.6 2.4l2.4 1.1l-2.2-1.6z'/%3E%3Cpath d='m25.1 30.2l4.1 1.3l2.6.5l-2.5-.9zm-.3 1.8l4.4.2l2.6-.2l-2.6-.2z'/%3E%3Cpath d='m25.1 33.8l4.2-.9l2.5-.9l-2.6.5zm.7 1.7l3.8-1.9l2.2-1.6l-2.4 1.1z'/%3E%3Cpath d='m26.9 36.9l3.2-2.8l1.7-2.1l-2 1.7zm1.4 1.2l2.4-3.7l1.1-2.4l-1.5 2.2z'/%3E%3Cpath d='m30 38.8l1.4-4.1l.4-2.7l-.9 2.5zm1.8.2l.3-4.3l-.3-2.7l-.2 2.7zm1.8-.2l-.8-4.3l-1-2.5l.5 2.7z'/%3E%3Cpath d='m35.3 38.1l-1.9-3.9l-1.6-2.2l1.2 2.5zm1.5-1.2l-2.9-3.2l-2.1-1.7l1.8 2.1z'/%3E%3Cpath d='m37.9 35.5l-3.6-2.4l-2.5-1.1l2.2 1.6zm.7-1.7l-4.1-1.3l-2.7-.5l2.6.9zm.2-1.8l-4.3-.3l-2.7.3l2.7.2zm-.2-1.8l-4.2.9l-2.6.9l2.7-.5z'/%3E%3Cpath d='M37.9 28.5L34 30.4L31.8 32l2.5-1.1zm-1.1-1.4l-3.2 2.8l-1.8 2.1l2.1-1.7z'/%3E%3Cpath d='M35.3 25.9L33 29.6L31.8 32l1.6-2.2z'/%3E%3Cpath d='m33.7 25.2l-1.4 4.1l-.5 2.7l1-2.5z'/%3E%3C/g%3E%3C/svg%3E") no-repeat;
  background-size: 100% 100%;
  background-color: transparent;
  width: 1.2em;
  height: 1.2em;
}

.switch-language .i-iconamoon-arrow-down-2-fill {
  --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' fill-rule='evenodd' d='M7 9a1 1 0 0 0-.707 1.707l5 5a1 1 0 0 0 1.414 0l5-5A1 1 0 0 0 17 9z' clip-rule='evenodd'/%3E%3C/svg%3E");
  -webkit-mask: var(--un-icon) no-repeat;
  mask: var(--un-icon) no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  background-color: currentColor;
  color: inherit;
  width: 1.2em !important;
  height: 1.2em !important;
  display: inline-block !important;
  vertical-align:3px;
}

.mainbox .head {
  position: relative;
}

.mainbox .head .title {
  text-align: left;
  color: #fb3737;
}

.switch-language {
  position: absolute;
  user-select: none;
  cursor: pointer;
  right: 1rem;
  top: 1rem;
}

.switch-language i {
  display: block;
  margin: 0 auto;
  width: 30px !important;
  height: 30px !important;
}


.mainbox .head {
  background-color: #f8f8f8;
  margin: 15px;
  padding: 15px;
  box-sizing: border-box;
  border-radius: 10px;
  position: relative;
}

.head .title {
  font-size: 22px;
  text-align: center;
  line-height: 36px;
}

.head .language-icon {
  display: inline-block;
}

.head .language-text {
   display: inline-block;
   vertical-align: bottom;
   line-height: 36px;
}

[lang="hi"] .language-text {
  font-weight: 600;
}

.submitUtr-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;  
  margin-top: 1rem;
  margin-bottom: .325rem;
}


.pay-title {
  text-align: center;
  font-size: .85rem;
  font-weight: 600;
  margin-top: .5rem;
  margin-bottom: -.125rem;
}

.pay-methods {
  width: 100%;
}

.pay-more-methods {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}

.submitUtr-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 1rem;
  margin-bottom: .325rem;
}

@media (min-width: 410px) {

  .icon-gpay,
  .icon-paytm,
  .icon-phonepe,
  .icon-upi {
    height: 2.5rem;
    width: 5rem;
  }
}

@media (min-width: 530px) {

  .icon-gpay,
  .icon-paytm,
  .icon-phonepe,
  .icon-upi {
    height: 3rem;
    width: 6rem;
  }
}