#payment {
 color: white;
}

#userdata,
#domaindata {
  padding-top: 0.5em;
  padding-bottom: 1.2em;
}

#userdata input {
  max-width: 20em;
}

#domaindata input {
  max-width: 25em;
}

/* Domain license */

#payment a,
#domain-purchase-start {
  color: #44feea;
}

#domain-purchase-start {
  font-style: italic;
}

#domain-explanation .subtitle {
  font-size: 150%;
  text-transform: uppercase;
}

#netPrice {
  display: inline-block;
  min-width: 7em;
}

#domainSeparator {
  margin-top: 2em;
}

#vatIDOptional {
  margin-left: 1em;
}

#vatIDOptOut {
  margin-left: 0.5em;
}

#haveVATID {
  vertical-align: bottom;
  padding: 0;
  margin: 0px 5px;
}

label[type=checkbox] {
  font-weight: inherit;
}

[hidden-for-domain=true] {
  display: none !important;
}

/* Payment methods */

/* select-foo */
#payment-method > span {
  cursor: pointer;
  margin-right: 0.5em;
  vertical-align: middle;
  margin-bottom: 0px !important;
}

#payment-method > span[hidden=true] {
  opacity: 0;
}

#payment-method > span[disabled=true] {
  opacity: 0.2;
}

#select-sepa {
  font-weight: bold;
  position: relative;
  top: -3px;
}

#select-paypal {
  font-size: 45px !important;
  position: relative;
  top: -2px;
}

#stripe-sepa-payment-form,
#stripe-cc-payment-form {
  max-width: 30em;
}

.form {
  display: grid;
  grid-template-columns: [labels] auto [controls] 1fr;
  grid-auto-flow: row;
  grid-gap: 0.8em;
  align-items: center;
}

.form label {
  grid-column: labels;
  grid-row: auto;
}

.form select,
.form input {
  grid-column: controls;
  grid-row: auto;
}

#payment label {
  no-font-size: 24px;
  no-font-weight: 400;
}

.form span,
.form label {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

value {
  -moz-user-select: text;
}

#payment button {
  width: 30%;
  float: right;
  margin-top: 0.5em;
  margin-left: 1em;
  color: #3e3e3e;
}
#payment button:after {
  clear: both;
}

#payment div[role="alert"] {
color: #b01717;
}

#bank-name {
  margin-left: 10px;
}

#mandate-acceptance, #credit-card-note {
  margin-top: 100px;
}
#mandate-acceptance {
  font-size: small;
}
#credit-card-note {
  font-size: medium;
}
#mandate-acceptance a,
#credit-card-note a {
  color: #daddff;
}

#payment-method-loading {
  font-size: xx-large;
  font-weight: bold;
  padding-top: 3em;
}

#payment-method-loading > .icon {
  font-size: 50px !important;
  font-weight: bold;
  margin-right: 15pt;
}

#payment-error-message {
  margin-bottom: 1em;
}


/* #payment-success */
#thankyou {
  margin-top: 3em;
  margin-bottom: 1em;
  font-size: x-large;
  font-weight: bold;
}

#enjoy {
  margin-top: 1em;
  margin-left: 1em;
}

#payment input,
.StripeElement {
  height: 40px;
  padding: 10px 12px;

  color: #32325d;
  background-color: white;
  border: 1px solid transparent;
  border-radius: 4px;

  box-shadow: 0 1px 3px 0 #e6ebf1;
  -webkit-transition: box-shadow 150ms ease;
  transition: box-shadow 150ms ease;
}

#payment input:focus,
.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}