body {
  font-family: 'Poppins';
  padding-bottom: 10px!important;
  background-color: white;
  overflow-x: hidden!important;
  overflow-y: auto!important;
  touch-action: pan-y!important;
  -webkit-user-drag: none!important;
  -webkit-touch-callout: none!important;
  margin: 0 10px 0 10px;
  color: #223AB1;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.modal-content {
  background-color: #fff;
  color: #fff;
}

.close {
  background-color: #fff;
  color: #fff;
}

img[src^="data:image/svg + xml"] {
  background-color: white;
}

.brand-logo {
  width: 140px;
}

.red {
  color: #ff2222;
}

.green {
  color: #60e660;
}

.icon {
  padding: 0px;
  color: #223AB1;
  border-color: rgba(0, 0, 0, 0);
  border-radius: 3px;
  letter-spacing: 1px;
  margin: 5px;
  font-size: 16px;
  font-weight: 600 !important;
  background: none !important;
}

.completed {
  color: rgb(1, 112, 23) !important;
}

.manual_processing {
  color: orange !important;
}

.failed {
  color: red !important;
}

.form-disabled {
  opacity: 0.5;
  pointer-events: none;
}

.btn {
  background-color: #223AB1;
  font-family: "Poppins", Sans-serif;
  font-size: 1em;
  font-weight: 600;
  border-style: solid;
  border-width: 0px 0px 0px 0px;
  border-color: #004899;
  color: white;
  border-radius: 0;
  height: 72px;
}

.btn-primary {
  font-family: "Poppins", Sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: white;
  background: #223AB1;
  box-shadow: 0px 8px 16px rgba(27, 57, 255, 0.2);
  border-radius: 45px;
  width: 315px;
  height: 72px;
  max-width:100%
}

.btn-secondary {
  font-family: "Poppins", Sans-serif;
  font-size: 16px;
  font-weight: 700;
  background: #223AB1;
  border-radius: 45px;
  box-shadow: 0px 8px 16px rgba(27, 57, 255, 0.2);
  height: 72px;
  width: 315px;
  max-width:100%
}

.btn-primary:active, .btn-primary.active .open > .dropdown-toggle.btn-primary {
  box-shadow: 0 12px 16px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19) !important;
  background-color: #223AB1;
  color: white;
}

.btn-primary:focus, .btn-primary:hover {
  box-shadow: 0 12px 16px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19) !important;
  background-color: #223AB1;
  color: white;
}

.form-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(86, 90, 120, 0.399);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  display: none;
}

.page-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(86, 90, 120, 0.399);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  display: none;
}

.spinner {
  border: 4px solid #f3f3f3;
  border-top: 4px solid #3498db;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 1s linear infinite;
}

.navbar {
  box-shadow: 0px 1px 14px 0px rgb(132, 132, 132);
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.bg-primary {
  background-color: #223AB1;
}

.nav-link {
  color: white;
}

.header-link:hover, .header-link:focus, .header-link:active {
  color: #ffffff !important;
}

.form-check-input {
  border-width: 1px;
  border-color: #484848;
}

.form-check-input:checked {
  background-color: #004899;
  border-color: #004899;
}

.h-30 {
  height: 30%;
}

.h-40 {
  height: 40%;
}

.h-20 {
  height: 20%;
}

.h-60 {
  height: 60%;
}

.h-70 {
  height: 70%;
}

.h-80 {
  height: 80%;
}

.list-checkmarks li:before {
  font-family: 'FontAwesome';
  content: "\f00c";
  margin: 0 8px 0 -22px;
  color: #545252;
  background-color: white;
}

.invalid-feedback {
  background-color: transparent !important;
  border: none;
  margin-top: .15rem;
  margin-bottom: 0.3rem;
}

.center-head {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-size: 30px;
  line-height: 45px;
  color: #223AB1;
}

.center-head-small {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-size: 24px;
  line-height: 45px;
  color: #223AB1;
}

.left-head {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-size: 28px;
  line-height: 45px;
  color: #223AB1;
  text-align: left;
}

:host, html {
  -webkit-text-size-adjust: 100%;
  font-feature-settings: normal;
  -webkit-tap-highlight-color: transparent;
  font-family: ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
  font-variation-settings: normal;
  line-height: 1.5;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;
}

.input-label {
  font-family: Poppins;
  font-weight: 400;
  font-style: normal;
  font-size: 14px;
}

.input-border {
  border-width: 0 0 1px 0;
  border-radius: 0;
  border-color: #223AB1;
}

.form-control, .form-select {
  font-weight: 400;
  font-size: 14px;
  padding-top: 8px;
  border-width: 0;
  /*border-radius: 0;*/
  /*border-color: #223AB1;*/
}

.form-control::placeholder {
  color: #B9B9B9;
  font-size: 14px;
  font-weight: 400;
}

.form-control:focus, .form-control.is-invalid {
  box-shadow: none !important;
}


a {
  color: #223AB1;
  font-size: 14px;
  font-weight: 700;
}

@media (min-width: 400px) {
  .float-sm-start {
    float: left !important;
  }
}

@media (min-width: 400px) {
  .float-sm-end {
    float: right !important;
  }
}

@media (min-width: 400px) {
  .float-sm-none {
    float: none !important;
  }
}

@media (min-width: 400px) {
  .object-fit-sm-contain {
    -o-object-fit: contain !important;
    object-fit: contain !important;
  }
}

@media (min-width: 400px) {
  .object-fit-sm-cover {
    -o-object-fit: cover !important;
    object-fit: cover !important;
  }
}

@media (min-width: 400px) {
  .object-fit-sm-fill {
    -o-object-fit: fill !important;
    object-fit: fill !important;
  }
}

@media (min-width: 400px) {
  .object-fit-sm-scale {
    -o-object-fit: scale-down !important;
    object-fit: scale-down !important;
  }
}

@media (min-width: 400px) {
  .object-fit-sm-none {
    -o-object-fit: none !important;
    object-fit: none !important;
  }
}

@media (min-width: 400px) {
  .d-sm-inline {
    display: inline !important;
  }
}

@media (min-width: 400px) {
  .d-sm-inline-block {
    display: inline-block !important;
  }
}

@media (min-width: 400px) {
  .d-sm-block {
    display: block !important;
  }
}

@media (min-width: 400px) {
  .d-sm-grid {
    display: grid !important;
  }
}

@media (min-width: 400px) {
  .d-sm-inline-grid {
    display: inline-grid !important;
  }
}

@media (min-width: 400px) {
  .d-sm-table {
    display: table !important;
  }
}

@media (min-width: 400px) {
  .d-sm-table-row {
    display: table-row !important;
  }
}

@media (min-width: 400px) {
  .d-sm-table-cell {
    display: table-cell !important;
  }
}

@media (min-width: 400px) {
  .d-sm-flex {
    display: flex !important;
  }
}

@media (min-width: 400px) {
  .d-sm-inline-flex {
    display: inline-flex !important;
  }
}

@media (min-width: 400px) {
  .d-sm-none {
    display: none !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-fill {
    flex: 1 1 auto !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-row {
    flex-direction: row !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-column {
    flex-direction: column !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-row-reverse {
    flex-direction: row-reverse !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-column-reverse {
    flex-direction: column-reverse !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-grow-0 {
    flex-grow: 0 !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-grow-1 {
    flex-grow: 1 !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-shrink-0 {
    flex-shrink: 0 !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-shrink-1 {
    flex-shrink: 1 !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-wrap {
    flex-wrap: wrap !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-nowrap {
    flex-wrap: nowrap !important;
  }
}

@media (min-width: 400px) {
  .flex-sm-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
}

@media (min-width: 400px) {
  .justify-content-sm-start {
    justify-content: flex-start !important;
  }
}

@media (min-width: 400px) {
  .justify-content-sm-end {
    justify-content: flex-end !important;
  }
}

@media (min-width: 400px) {
  .justify-content-sm-center {
    justify-content: center !important;
  }
}

@media (min-width: 400px) {
  .justify-content-sm-between {
    justify-content: space-between !important;
  }
}

@media (min-width: 400px) {
  .justify-content-sm-around {
    justify-content: space-around !important;
  }
}

@media (min-width: 400px) {
  .justify-content-sm-evenly {
    justify-content: space-evenly !important;
  }
}

@media (min-width: 400px) {
  .align-items-sm-start {
    align-items: flex-start !important;
  }
}

@media (min-width: 400px) {
  .align-items-sm-end {
    align-items: flex-end !important;
  }
}

@media (min-width: 400px) {
  .align-items-sm-center {
    align-items: center !important;
  }
}

@media (min-width: 400px) {
  .align-items-sm-baseline {
    align-items: baseline !important;
  }
}

@media (min-width: 400px) {
  .align-items-sm-stretch {
    align-items: stretch !important;
  }
}

@media (min-width: 400px) {
  .align-content-sm-start {
    align-content: flex-start !important;
  }
}

@media (min-width: 400px) {
  .align-content-sm-end {
    align-content: flex-end !important;
  }
}

@media (min-width: 400px) {
  .align-content-sm-center {
    align-content: center !important;
  }
}

@media (min-width: 400px) {
  .align-content-sm-between {
    align-content: space-between !important;
  }
}

@media (min-width: 400px) {
  .align-content-sm-around {
    align-content: space-around !important;
  }
}

@media (min-width: 400px) {
  .align-content-sm-stretch {
    align-content: stretch !important;
  }
}

@media (min-width: 400px) {
  .align-self-sm-auto {
    align-self: auto !important;
  }
}

@media (min-width: 400px) {
  .align-self-sm-start {
    align-self: flex-start !important;
  }
}

@media (min-width: 400px) {
  .align-self-sm-end {
    align-self: flex-end !important;
  }
}

@media (min-width: 400px) {
  .align-self-sm-center {
    align-self: center !important;
  }
}

@media (min-width: 400px) {
  .align-self-sm-baseline {
    align-self: baseline !important;
  }
}

@media (min-width: 400px) {
  .align-self-sm-stretch {
    align-self: stretch !important;
  }
}

@media (min-width: 400px) {
  .order-sm-first {
    order: -1 !important;
  }
}

@media (min-width: 400px) {
  .order-sm-0 {
    order: 0 !important;
  }
}

@media (min-width: 400px) {
  .order-sm-1 {
    order: 1 !important;
  }
}

@media (min-width: 400px) {
  .order-sm-2 {
    order: 2 !important;
  }
}

@media (min-width: 400px) {
  .order-sm-3 {
    order: 3 !important;
  }
}

@media (min-width: 400px) {
  .order-sm-4 {
    order: 4 !important;
  }
}

@media (min-width: 400px) {
  .order-sm-5 {
    order: 5 !important;
  }
}

@media (min-width: 400px) {
  .order-sm-last {
    order: 6 !important;
  }
}

@media (min-width: 400px) {
  .m-sm-0 {
    margin: 0 !important;
  }
}

@media (min-width: 400px) {
  .m-sm-1 {
    margin: .25rem !important;
  }
}

@media (min-width: 400px) {
  .m-sm-2 {
    margin: .5rem !important;
  }
}

@media (min-width: 400px) {
  .m-sm-3 {
    margin: 1rem !important;
  }
}

@media (min-width: 400px) {
  .m-sm-4 {
    margin: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .m-sm-5 {
    margin: 3rem !important;
  }
}

@media (min-width: 400px) {
  .m-sm-auto {
    margin: auto !important;
  }
}

@media (min-width: 400px) {
  .mx-sm-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
}

@media (min-width: 400px) {
  .mx-sm-1 {
    margin-right: .25rem !important;
    margin-left: .25rem !important;
  }
}

@media (min-width: 400px) {
  .mx-sm-2 {
    margin-right: .5rem !important;
    margin-left: .5rem !important;
  }
}

@media (min-width: 400px) {
  .mx-sm-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important;
  }
}

@media (min-width: 400px) {
  .mx-sm-4 {
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .mx-sm-5 {
    margin-right: 3rem !important;
    margin-left: 3rem !important;
  }
}

@media (min-width: 400px) {
  .mx-sm-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }
}

@media (min-width: 400px) {
  .my-sm-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

@media (min-width: 400px) {
  .my-sm-1 {
    margin-top: .25rem !important;
    margin-bottom: .25rem !important;
  }
}

@media (min-width: 400px) {
  .my-sm-2 {
    margin-top: .5rem !important;
    margin-bottom: .5rem !important;
  }
}

@media (min-width: 400px) {
  .my-sm-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }
}

@media (min-width: 400px) {
  .my-sm-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .my-sm-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }
}

@media (min-width: 400px) {
  .my-sm-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }
}

@media (min-width: 400px) {
  .mt-sm-0 {
    margin-top: 0 !important;
  }
}

@media (min-width: 400px) {
  .mt-sm-1 {
    margin-top: .25rem !important;
  }
}

@media (min-width: 400px) {
  .mt-sm-2 {
    margin-top: .5rem !important;
  }
}

@media (min-width: 400px) {
  .mt-sm-3 {
    margin-top: 1rem !important;
  }
}

@media (min-width: 400px) {
  .mt-sm-4 {
    margin-top: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .mt-sm-5 {
    margin-top: 3rem !important;
  }
}

@media (min-width: 400px) {
  .mt-sm-auto {
    margin-top: auto !important;
  }
}

@media (min-width: 400px) {
  .me-sm-0 {
    margin-right: 0 !important;
  }
}

@media (min-width: 400px) {
  .me-sm-1 {
    margin-right: .25rem !important;
  }
}

@media (min-width: 400px) {
  .me-sm-2 {
    margin-right: .5rem !important;
  }
}

@media (min-width: 400px) {
  .me-sm-3 {
    margin-right: 1rem !important;
  }
}

@media (min-width: 400px) {
  .me-sm-4 {
    margin-right: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .me-sm-5 {
    margin-right: 3rem !important;
  }
}

@media (min-width: 400px) {
  .me-sm-auto {
    margin-right: auto !important;
  }
}

@media (min-width: 400px) {
  .mb-sm-0 {
    margin-bottom: 0 !important;
  }
}

@media (min-width: 400px) {
  .mb-sm-1 {
    margin-bottom: .25rem !important;
  }
}

@media (min-width: 400px) {
  .mb-sm-2 {
    margin-bottom: .5rem !important;
  }
}

@media (min-width: 400px) {
  .mb-sm-3 {
    margin-bottom: 1rem !important;
  }
}

@media (min-width: 400px) {
  .mb-sm-4 {
    margin-bottom: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .mb-sm-5 {
    margin-bottom: 3rem !important;
  }
}

@media (min-width: 400px) {
  .mb-sm-auto {
    margin-bottom: auto !important;
  }
}

@media (min-width: 400px) {
  .ms-sm-0 {
    margin-left: 0 !important;
  }
}

@media (min-width: 400px) {
  .ms-sm-1 {
    margin-left: .25rem !important;
  }
}

@media (min-width: 400px) {
  .ms-sm-2 {
    margin-left: .5rem !important;
  }
}

@media (min-width: 400px) {
  .ms-sm-3 {
    margin-left: 1rem !important;
  }
}

@media (min-width: 400px) {
  .ms-sm-4 {
    margin-left: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .ms-sm-5 {
    margin-left: 3rem !important;
  }
}

@media (min-width: 400px) {
  .ms-sm-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 400px) {
  .p-sm-0 {
    padding: 0 !important;
  }
}

@media (min-width: 400px) {
  .p-sm-1 {
    padding: .25rem !important;
  }
}

@media (min-width: 400px) {
  .p-sm-2 {
    padding: .5rem !important;
  }
}

@media (min-width: 400px) {
  .p-sm-3 {
    padding: 1rem !important;
  }
}

@media (min-width: 400px) {
  .p-sm-4 {
    padding: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .p-sm-5 {
    padding: 3rem !important;
  }
}

@media (min-width: 400px) {
  .px-sm-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
}

@media (min-width: 400px) {
  .px-sm-1 {
    padding-right: .25rem !important;
    padding-left: .25rem !important;
  }
}

@media (min-width: 400px) {
  .px-sm-2 {
    padding-right: .5rem !important;
    padding-left: .5rem !important;
  }
}

@media (min-width: 400px) {
  .px-sm-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
  }
}

@media (min-width: 400px) {
  .px-sm-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .px-sm-5 {
    padding-right: 3rem !important;
    padding-left: 3rem !important;
  }
}

@media (min-width: 400px) {
  .py-sm-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media (min-width: 400px) {
  .py-sm-1 {
    padding-top: .25rem !important;
    padding-bottom: .25rem !important;
  }
}

@media (min-width: 400px) {
  .py-sm-2 {
    padding-top: .5rem !important;
    padding-bottom: .5rem !important;
  }
}

@media (min-width: 400px) {
  .py-sm-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }
}

@media (min-width: 400px) {
  .py-sm-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .py-sm-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
}

@media (min-width: 400px) {
  .pt-sm-0 {
    padding-top: 0 !important;
  }
}

@media (min-width: 400px) {
  .pt-sm-1 {
    padding-top: .25rem !important;
  }
}

@media (min-width: 400px) {
  .pt-sm-2 {
    padding-top: .5rem !important;
  }
}

@media (min-width: 400px) {
  .pt-sm-3 {
    padding-top: 1rem !important;
  }
}

@media (min-width: 400px) {
  .pt-sm-4 {
    padding-top: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .pt-sm-5 {
    padding-top: 3rem !important;
  }
}

@media (min-width: 400px) {
  .pe-sm-0 {
    padding-right: 0 !important;
  }
}

@media (min-width: 400px) {
  .pe-sm-1 {
    padding-right: .25rem !important;
  }
}

@media (min-width: 400px) {
  .pe-sm-2 {
    padding-right: .5rem !important;
  }
}

@media (min-width: 400px) {
  .pe-sm-3 {
    padding-right: 1rem !important;
  }
}

@media (min-width: 400px) {
  .pe-sm-4 {
    padding-right: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .pe-sm-5 {
    padding-right: 3rem !important;
  }
}

@media (min-width: 400px) {
  .pb-sm-0 {
    padding-bottom: 0 !important;
  }
}

@media (min-width: 400px) {
  .pb-sm-1 {
    padding-bottom: .25rem !important;
  }
}

@media (min-width: 400px) {
  .pb-sm-2 {
    padding-bottom: .5rem !important;
  }
}

@media (min-width: 400px) {
  .pb-sm-3 {
    padding-bottom: 1rem !important;
  }
}

@media (min-width: 400px) {
  .pb-sm-4 {
    padding-bottom: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .pb-sm-5 {
    padding-bottom: 3rem !important;
  }
}

@media (min-width: 400px) {
  .ps-sm-0 {
    padding-left: 0 !important;
  }
}

@media (min-width: 400px) {
  .ps-sm-1 {
    padding-left: .25rem !important;
  }
}

@media (min-width: 400px) {
  .ps-sm-2 {
    padding-left: .5rem !important;
  }
}

@media (min-width: 400px) {
  .ps-sm-3 {
    padding-left: 1rem !important;
  }
}

@media (min-width: 400px) {
  .ps-sm-4 {
    padding-left: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .ps-sm-5 {
    padding-left: 3rem !important;
  }
}

@media (min-width: 400px) {
  .gap-sm-0 {
    gap: 0 !important;
  }
}

@media (min-width: 400px) {
  .gap-sm-1 {
    gap: .25rem !important;
  }
}

@media (min-width: 400px) {
  .gap-sm-2 {
    gap: .5rem !important;
  }
}

@media (min-width: 400px) {
  .gap-sm-3 {
    gap: 1rem !important;
  }
}

@media (min-width: 400px) {
  .gap-sm-4 {
    gap: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .gap-sm-5 {
    gap: 3rem !important;
  }
}

@media (min-width: 400px) {
  .row-gap-sm-0 {
    row-gap: 0 !important;
  }
}

@media (min-width: 400px) {
  .row-gap-sm-1 {
    row-gap: .25rem !important;
  }
}

@media (min-width: 400px) {
  .row-gap-sm-2 {
    row-gap: .5rem !important;
  }
}

@media (min-width: 400px) {
  .row-gap-sm-3 {
    row-gap: 1rem !important;
  }
}

@media (min-width: 400px) {
  .row-gap-sm-4 {
    row-gap: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .row-gap-sm-5 {
    row-gap: 3rem !important;
  }
}

@media (min-width: 400px) {
  .column-gap-sm-0 {
    -moz-column-gap: 0 !important;
    column-gap: 0 !important;
  }
}

@media (min-width: 400px) {
  .column-gap-sm-1 {
    -moz-column-gap: .25rem !important;
    column-gap: .25rem !important;
  }
}

@media (min-width: 400px) {
  .column-gap-sm-2 {
    -moz-column-gap: .5rem !important;
    column-gap: .5rem !important;
  }
}

@media (min-width: 400px) {
  .column-gap-sm-3 {
    -moz-column-gap: 1rem !important;
    column-gap: 1rem !important;
  }
}

@media (min-width: 400px) {
  .column-gap-sm-4 {
    -moz-column-gap: 1.5rem !important;
    column-gap: 1.5rem !important;
  }
}

@media (min-width: 400px) {
  .column-gap-sm-5 {
    -moz-column-gap: 3rem !important;
    column-gap: 3rem !important;
  }
}

@media (min-width: 400px) {
  .text-sm-start {
    text-align: left !important;
  }
}

@media (min-width: 400px) {
  .text-sm-end {
    text-align: right !important;
  }
}

@media (min-width: 400px) {
  .text-sm-center {
    text-align: center !important;
  }
}

.icon-button {
  background: none;
  color: #223AB1;
  height: auto;
}

.input-group {
  border-width: 0 0 1px 0 !important;
  border-radius: 0;
  border-color: #223AB1 !important;
  border: 1px;
  border-bottom-style: solid;
}

.error-message {
    color: #FF5449;
    font-size: 14px;
    /*display: none;*/
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    margin-bottom: 10px;
}
 .pin-container {
      display: inline-flex;
      gap: 0.4rem;
  }
.pin-input {
      width: 50px;
      height: 50px;
      text-align: center;
      text-transform: uppercase;
  }