#checkin_registration,
.checkin_registration {
  font-family: NetlifeSansY !important;
  /* Hack for fixing curly characters on checkin form */
  font-feature-settings: "ss01" !important;
  /* font-weight: bold !important; */
  font-size: 24px !important;
}

#checkin_registration h3,
.checkin_registration h3 {
  font-size: 34px !important;
  margin-top: 10px !important;
}

#checkin_registration tfoot {
  padding: 20px 0 !important;
}

/* LANGUAGE SWITCHER */
#checkin_registration .selectBox-default,
.checkin_registration .selectBox-default {
  height: 60px !important;
  border-radius: 0px !important;
  border: 0px solid #b7bbbf !important;
  /* Hack for fixing curly characters on checkin form */
  font-feature-settings: "ss01" !important;
}

.icons8-expand-arrow::before {
  font-size: 20px !important;
}

/* END —— LANGUAGE SWITCHER */
/* STYLING CHECKIN */

#checkin_registration h2,
.checkin_registration h2 {
  font-size: 42px !important;
  text-transform: uppercase !important;
  width: 1px !important;
  line-height: 1.1em !important;
}

@media screen and (min-width: 992px) {
  #checkin_registration h2,
  .checkin_registration h2 {
    font-size: 64px !important;
  }
}

#checkin_registration h4,
.checkin_registration h4 {
  font-size: 24px !important;
}

#checkin_registration h1,
#checkin_registration h2,
#checkin_registration h3,
#checkin_registration h4,
#checkin_registration h5,
#checkin_registration h6,
.checkin_registration h1,
.checkin_registration h2,
.checkin_registration h3,
.checkin_registration h4,
.checkin_registration h5,
.checkin_registration h6 {
  font-family: NetlifeSansY !important;
  /* Hack for fixing curly characters on checkin form */
  font-feature-settings: "ss01" !important;
}

#checkin_registration .coupon--section {
  margin-bottom: 0 !important;
}

#checkin_registration .coupon--section .btn-success,
.checkin_registration .coupon--section .btn-success {
  height: auto !important;
}

/* FORM LABEL */
.label.label--required {
  font-family: NetlifeSansY !important;
  font-size: 22px !important;
}

/* —— END FORM LABEL */

/* ERROR MESSAGE BLOCK */
#checkin_registration .errorMessageBlock,
.checkin_registration .errorMessageBlock {
  bottom: -32px !important;
  font-size: 0.7em !important;
}

/* –– END ERROR MESSAGE BLOCK */
#checkin_registration .coupon--section--activate,
.checkin_registration .coupon--section--activate {
  color: #2ee57c !important;

  text-decoration: underline !important;
}

#checkin_registration .label,
.checkin_registration .label {
  color: white !important;
}

#checkin_registration .reservation--text,
.checkin_registration .reservation--text {
  display: none;
}

.label--medium {
  font-size: 20px;
}

.registration .price,
.registration h4,
.ticket--amount--number {
  font-weight: bold !important;
  text-transform: uppercase !important;
  padding: 0;
}

.ticket--amount--number {
  margin-bottom: 0 !important;
}

.ticket-number-input {
  color: black !important;
}

.registration .price {
  /* margin: 0.33em 0 !important;
  margin-top: 0.7em !important; */
}

.registration--body:first-child h2 {
  padding-bottom: 1em !important;
}

.registration--body:first-child {
  background-color: black !important;
  color: white !important;
  padding-bottom: 3rem !important;
}

#checkin_registration .registration--body {
  color: white !important;
  background-color: black !important;
}

/* BUTTONS */
#checkin_registration .button-group,
.checkin_registration .button-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 16px 0;
}

.btn {
  color: black !important;
  font-family: NetlifeSansY !important;
  font-size: 24px !important;
  /* Hack for fixing curly characters on checkin form */
  font-feature-settings: "ss01" !important;
  text-transform: uppercase !important;
}

.btn.addNewTicket {
  color: white !important;
}

#checkin_registration .button-group .btn-squared,
#checkin_registration .button-group > .btn,
.checkin_registration .button-group .btn-squared,
.checkin_registration .button-group > .btn {
  height: auto !important;
}

.btn.btn-success.nextButton {
  height: auto !important;
}

/*END ——BUTTONS*/

/* Input Text Color */
#checkin_registration .form-control,
#checkin_registration input[type="text"],
.checkin_registration .form-control,
.checkin_registration input[type="text"] {
  color: black !important;
}

input.form-control {
  padding: 25px !important;
}

/* Input Text Color */
#checkin_registration
  .registration
  .accordion
  .registration--body:nth-last-child(3) {
  padding-bottom: 2em !important;
  background-color: black !important;
  color: white !important;
}

.registration--summary {
  background-color: black !important;
  color: white !important;
}

.registration--summary .summary {
  display: inline-table;
  margin-bottom: 2em !important;
}

.total-amount {
  display: none !important;
}

/*payment*/
#checkin_registration
  .registration
  .accordion
  .registration--body:nth-last-child(2) {
  background-color: black !important;
  color: white !important;
  padding-bottom: 3em !important;
  /* .terms-link {
    color: white !important;
  } */
}

#checkin_registration .btn-success,
.checkin_registration .btn-success,
#checkin_registration .btn-validate,
.checkin_registration .btn-validate {
  /* background-color: green !important; */
  background-color: #2ee57c !important;
  color: black !important;
  border-radius: 0 !important;
}

.registration--body h2 {
  font-weight: bold !important;
  /* font-size: 3rem; */
  text-transform: uppercase;
  margin-bottom: 0.5em;
}

/* .registration--body:first-child h2 {
  // margin-top: 1em !important;
} */

.ticket--description.description {
  margin-bottom: 0 !important;
}

.icons8-expand-arrow {
  top: 2px !important;
}

.icon .icons8-minus-math,
.icon .icons8-plus-math-3:before {
  font-weight: bold !important;
}

.ticket--additionals {
  border-color: black !important;
}

.ticket--additionals--select {
  border-radius: 0 !important;
}

select option {
  /* Hack for fixing curly characters on checkin form */
  font-feature-settings: "ss01" !important;
}

.ticket {
  background-color: black !important;
  border-bottom-width: 3px !important;
}

.registration--start {
  border-top: 0 !important;
}

.registration--body {
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

.registration--body:first-child .w50p,
.registration--body:first-child .w40p {
  background: black !important;
}

.ticket--amount--button {
  border: 0 !important;
}

.ticket--amount--button.plus {
  background-color: white !important;
  color: black !important;
}

.ticket--amount--button.minus {
  background-color: white !important;
  color: black !important;
}

#checkin_registration .ticket--amount {
  background-color: white !important;
  align-items: center !important;
  /* margin-top: 1.5rem !important; */
}

#checkin_registration .ticket--amount p {
  color: black !important;
}

.errorMessages {
  width: 100% !important;
}

@media (max-width: 900px) {
  .ticket--amount {
    margin-top: 0.75rem !important;
  }
}

.registration * {
  /* font-family: $font !important; */
}

#checkin_registration {
  /* font-size: 1.5rem !important; */
  padding-top: 4em !important;
}

@media (max-width: 900px) {
  #checkin_registration {
    font-size: 1em !important;
  }
}

#checkin_registration,
.registration,
.registration--body {
  width: 100% !important;
  max-width: 100% !important;
}

#checkin_registration h4 {
  /* padding-top: 0.3em !important; */
}

.react-tel-input {
  position: relative !important;
  height: 2.5rem !important;
}

#checkin_registration .react-tel-input input[type="tel"] {
  position: absolute !important;
  border: 3px solid black !important;
  width: 100% !important;
  display: block !important;
  top: 0 !important;
  height: 2.5rem !important;
  border: 0 !important;
  left: 0 !important;
  padding: 0 0 0 3em !important;
  font-size: 1.1em !important;
  border-radius: 0 !important;
}

#checkin_registration .react-tel-input input[type="text"] {
  border: 3px solid black !important;
}

@media (max-width: 599px) {
  .registration--body {
    width: 100% !important;
  }
}

@media (min-width: 900px) {
  .registration--body {
    width: 80% !important;
  }
}

@media (min-width: 1500px) {
  .registration--body {
    width: 60% !important;
  }
}

@media (min-width: 1800px) {
  /* .registration--body {
    // width: 40% !important;
  } */
}

.form-group input {
  border-width: 3px !important;
  border-color: black !important;
}

.form-group input:focus {
  outline: 4px solid #2ee57c !important;
}

.errorInput {
  border: 3px solid #e00707 !important;
}

.button-group button {
  margin: 0 !important;
  border: 3px solid black !important;
  padding: 0.5em 2em !important;
  border-radius: 0 !important;
  text-transform: uppercase;
  max-width: 100% !important;
  width: 100% !important;
}

.btn--active {
  background-color: #2ee57c !important;
  color: black !important;
}

/* // input.checkbox */
.registration .checkbox {
  flex-grow: 1 !important;
  min-width: 1em !important;
  /*
  & + p {
    flex-grow: 2 !important;
  } */
}

.btn.payment--option.btn-default.btn--active {
  color: #000000 !important;
}

.registration--order .btn.wide {
  font-size: 1.5rem !important;
  background-color: #2ee57c !important;
  color: black !important;
  padding: 0.7em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  width: auto !important;
  height: auto !important;
}

.terms-link,
.terms-link:visited,
.terms-link:hover,
.terms-link:active {
  color: #2ee57c !important;
  text-decoration: underline !important;
}

.terms-link a:hover {
  color: #2ee57c !important;
}

#checkin_registration .green {
  /* .green { */
  /* color: green !important; */
  color: #2ee57c !important;
}

/* #checkin_registration .green {
  display: none !important;
} */

/* .payment button:nth-child(2) {
  border-left: 0 !important;
  border-right: 0 !important;
} */
.flag-dropdown {
  border-radius: 0 !important;
}

.registration--body:nth-last-child(1) {
  background: black !important;
  color: white !important;
}

.registration--body:nth-last-child(1) a,
.terms-link {
  background: black !important;
  color: white !important;
}

@media (max-width: 900px) {
  .button-group {
    flex-direction: column;
  }
}

.singleTicket--additional--description p {
  color: white !important;
}

/* This is absolutely hideous, sorry. Hide unnecessary elements.
   Making it super specific to avoid hiding the wrong stuff.
   TODO: double check they don't hide anything we weren't supposed to hide */
.right div .btn .nextButton,
/* .w50p + .df.jcsb.acc.w40p .tright, */
.form-group+.right div .btn.nextButton {
  display: none !important;
}

#checkin_registration .payment .btn--active,
.btn .payment--option .btn-default .btn--active {
  color: black !important;
}

div[aria-label="Discount"] > .w40p > .ticket--amount {
  display: none !important;
}
