@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400; /* Regular */
  font-display: swap;
  src: url('/assets/font/Inter-Regular.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500; /* Medium */
  font-display: swap;
  src: url('/assets/font/Inter-Medium.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600; /* Semi Bold */
  font-display: swap;
  src: url('/assets/font/Inter-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'metropolislight';
  src:
    url('/assets/font/metropolis-light-webfont.woff2') format('woff2'),
    url('/assets/font/metropolis-light-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'metropolisregular';
  src:
    url('/assets/font/metropolis-regular-webfont.woff2') format('woff2'),
    url('/assets/font/metropolis-regular-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'metropolismedium';
  src:
    url('/assets/font/metropolis-medium-webfont.woff2') format('woff2'),
    url('/assets/font/metropolis-medium-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'metropolisbold';
  src:
    url('/assets/font/metropolis-bold-webfont.woff2') format('woff2'),
    url('/assets/font/metropolis-bold-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
/* Inconsolata [End] */

html,
body {
  height: 100%;
}
body {
  margin: 0;
  padding: 0;
  font-family: 'Inter', sans-serif;
  box-sizing: border-box;
}
button,
input,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  outline: 0;
}

button:focus {
  outline: none;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

a {
  text-decoration: none;
  outline: none;
  cursor: pointer;
}

a:hover,
a:focus {
  text-decoration: none;
  outline: none;
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

input::-webkit-contacts-auto-fill-button,
input ::-webkit-credentials-auto-fill-button,
input::-webkit-autofill,
input::-webkit-caps-lock-indicator {
  visibility: hidden;
  display: none !important;
  pointer-events: none;
  position: absolute;
  right: 0;
  width: 0;
  height: 0;
}

.font-semibold-banner {
  font-family: 'metropolisbold';
  font-size: 14px;
}

aside,
figure,
footer,
header,
main,
nav,
section {
  display: block;
}

button,
html input[type='button'],
input[type='reset'],
input[type='submit'] {
  cursor: pointer;
  background: none;
}

button {
  color: #000000;
}

h4,
p {
  margin: 0;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px white inset !important;
  background-color: none;
}
.globalImg {
  /* background-image: url('./assets/icons/icons.svg'); */
  background-repeat: no-repeat;
}
.payIcon {
  background-image: url('./assets/icons/paymentIcon.svg');
  background-repeat: no-repeat;
}
::placeholder {
  color: lightgray !important;
}
.allbankIcon {
  background-position: -0.5px 0px;
}

.nb-andhra {
  background-position: -144.5px 0px;
}

.nb-au-small-fin {
  background-position: -36.5px -36px;
}

.nb-boi {
}

.nb-bom {
  background-position: -144.5px -36px;
}

.nb-bharat-co-op {
}

.nb-canara {
  background-position: -108.5px -72px;
}

.nb-catholic-syrian {
  background-position: -144.5px -72px;
}

.nb-cbi {
  background-position: -36.5px -72px;
}

.nb-cu {
  background-position: -144.5px -108px;
}

.nb-corp {
  background-position: -36.5px -108px;
}

.nb-cosmos {
  background-position: -108.5px -108px;
}

.nb-dena {
  background-position: -108.5px -144px;
}

.nb-dsh {
  background-position: -144.5px -144px;
}

.nb-dev-credit {
  background-position: -108.5px -180px;
}

.nb-dhan-laxmi {
  background-position: -144.5px -180px;
}

.nb-fed {
  background-position: 0px -108px;
}

.nb-icici {
  background-position: -0.5px -180px;
}

.nb-idbi {
  background-position: -36.5px -180px;
}

.nb-idfc {
  background-position: -36.5px -216px;
}

.nb-indian {
  background-position: -216.5px -180px;
}

.nb-indian-overseas {
  background-position: -72.5px -216px;
}

.nb-jnk {
  background-position: -216.5px -216px;
}

.nb-jsb {
}

.nb-karnataka {
  background-position: -0.5px -252px;
}

.nb-karur-corp,
.nb-karur {
  background-position: -36.5px -252px;
}

.nb-lakshmi-vilas-corp,
.nb-lakshmi-vilas-retail {
  background-position: -180.5px 0px;
}

.nb-nainital {
}

.nb-obc {
  background-position: -180.5px -36px;
}

.nb-pun-maha-co-op {
}

.nb-pun-sind {
  background-position: -180.5px -72px;
}

.nb-pnb-corp {
  background-position: -180.5px -108px;
}

.nb-pnb-retail {
  background-position: -180.5px -108px;
}

.nb-rbl {
  background-position: -72.5px 0px;
}

.nb-saraswat {
  background-position: -180.5px -144px;
}

.nb-shamrao-vithal {
  background-position: -180.5px -180px;
}

.nb-south-indian {
  background-position: -108.5px -216px;
}

.nb-syndicate {
  background-position: -144.5px -216px;
}

.nb-tamilnad-mercantile {
  background-position: -180.5px -216px;
}

.nb-uco {
  background-position: -216.5px 0px;
}

.nb-ub-corp {
  background-position: -216.5px -36px;
}

.nb-ub-ew-corp {
  background-position: -216.5px -36px;
}

.nb-united {
  background-position: -216.5px -72px;
}

.nb-vijaya {
  background-position: -216.5px -108px;
}

.nb-yes {
  background-position: -0.5px -216px;
}

.nb-sbi {
  background-position: -72.5px -72px;
}

.nb-axis {
  background-position: -216.5px -144px;
}

.nb-kotak {
  background-position: -72.5px -144px;
}

.nb-hdfc {
  background-position: -0.5px -144px;
}

.nb-indusland {
  background-position: -72.5px -180px;
}

.nb-airtel {
  background-position: -108.5px 0px;
}

.sprite-back-icon {
  width: 19px;
  height: 11px;
  cursor: pointer;
  background-position: -195px -32px;
  display: inline-block;
}
.sprite-cross-icon {
  width: 16px;
  height: 16px;
  background-position: -14px -289px;
  display: inline-block;
}
.sprite-info-icon {
  width: 12px;
  height: 10px;
  background-position: -166px -63px;
  display: inline-block;
}
.sprite-info-blue-icon {
  height: 12px;
  width: 16px;
  background-position: -179px -33px;
  display: inline-block;
}
.sprite-twidpay-icon {
  height: 16px !important;
  width: 42px !important;
  background-position: 0px -326px;
  display: inline-block;
}
.sprite-opaque-close-icon {
  width: 12px !important;
  height: 13px !important;
  background-position: -115px -62px;
  display: inline-block;
}
.info-blue-icon {
  height: 18px;
  width: 24px;
  background-position: -175px -208px;
  display: inline-block;
}
.floating-input-group {
  position: relative;
  display: block;
  margin-bottom: 12px;
}

.floating-input-group .input {
  width: 100%;
  padding: 12px;
  border: 1px solid #d2d6db;
  border-radius: 12px;
  box-sizing: border-box;
  font-size: 12px;
  line-height: 16px;
}

.floating-input-group div.input input {
  padding-left: 2px;
}

.floating-input-group .input:-webkit-autofill,
.floating-input-group .input:-webkit-autofill:hover,
.floating-input-group .input:-webkit-autofill:focus,
.floating-input-group .input:-webkit-autofill:active {
  -webkit-transition-delay: 9999s;
}
.floating-input-group .input:read-only + .label {
  background-color: white;
  color: #777;
  border-color: #ddd;
  cursor: not-allowed;
}

.floating-input-group .label {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 0 5px;
  background-color: white;
  color: #777;
  font-size: 0.75rem;
  transition:
    top 0.2s ease-in-out,
    font-size 0.2s ease-in-out,
    background-color 0.2s ease-in-out;
  pointer-events: none;
  z-index: 1;
}

.floating-input-group .input::placeholder {
  color: transparent;
}

.floating-input-group .input + .label {
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.75rem;
}
.floating-input-group:focus-within,
.input:focus-within {
  border-color: black;
}
.floating-input-group .input:read-only + .label,
.floating-input-group .input:focus + .label,
.floating-input-group .input:valid + .label {
  top: 0;
  font-size: 0.625rem;
  color: black;
}

.floating-input-group .error-message {
  font-size: 0.8em;
  color: red;
  margin-top: 5px;
}
.floating-input-group.disabled {
  pointer-events: none;
  opacity: 0.5;
}