@import url("https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700&display=swap");

body:has(.pnp) {
  --crm-page-bg-color: #333366;
  --crm-text-color: #eafaf1;
  --crm-f-fieldset-bg-color: none;
  --crm-input-color: var(--crm-text-color);
  --crm-link-color: yellow;
  --crm-font: "Barlow", sans-serif;
  --crm-font-title: "Barlow", sans-serif;
  background-color: var(--crm-page-bg-color);
}
.crm-container .ma-webform.pnp {
  --medact-webform-header-background: none;
  --medact-webform-header-text: #ff4769;
  --medact-webform-border-color: #eafaf1;
}
.crm-container .ma-webform.pnp * {
  text-transform: uppercase;
  border-radius: 0;
}

.crm-container .pnp af-field {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.pnp .af-field-type-text input,
.pnp .af-field-type-email input {
  background: transparent;
  border: none;
  border-bottom: 1px solid;
  border-radius: 0;
  max-width: 500px;
  width: 70%;
  min-width: 350px;
}

.pnp .af-field-type-text input::placeholder,
.pnp .af-field-type-email input::placeholder {
  font-weight: 500;
  font-size: 18px;
  text-transform: uppercase;
  color: #eafaf1;
  opacity: 1;
  padding: 0.5em 0.75em;
}

.pnp .af-field-type-radio .crm-af-field label,
.pnp .af-field-type-check-box .crm-af-field label {
    background-color: #2ECC71;
    color: #fff;
    border-width: 0px;
}

.crm-container .pnp .crm-button {
  font-weight: 500;
  font-family: inherit;
  font-size: 1.25rem;
  padding: 1.25rem 0.75rem;
  border-width: 0px!important;
  border-radius: 0px;
  box-shadow: none!important;
  margin-right: 0;
}
.crm-container .pnp .crm-button.crm-button-back[type=button] {
  background-color: #333366;
  color: #eafaf1;
}
.crm-container .pnp .crm-button.crm-button-back[type=button]:hover {
  background-color: #e6e6e6;
  color: #333;
}
.crm-container .pnp .crm-button.crm-button-next,
.crm-container .pnp .crm-button.crm-button-submit {
  background: #ff4769;
  color: #eafaf1;
}
.crm-container .pnp .crm-button.crm-button-next:hover,
.crm-container .pnp .crm-button.crm-button-submit:hover {
  background-color: #2ECC71;
  color: yellow;
}
