/* This file was previously
  * https://en-assets.thehumaneleague.org.uk/assets/styles/main.css
  */

:root {
  --color-white: #fff;
  --color-black: #000;
  --color-neutral-100: #f9f9f9;
  --color-neutral-200: #f3f4f5;
  --color-neutral-250: #e5e7e7;
  --color-neutral-300: #e0e0e0;
  --color-neutral-350: #c0c4c7;
  --color-neutral-400: #9e9e9e;
  --color-neutral-500: #6d6e71;
  --color-neutral-600: #404040;
  --color-neutral-700: #313f4b;
  --color-neutral-800: #1d252c;
  --color-primary-100: #fff4f2;
  --color-primary-200: #ffdad4;
  --color-primary-300: #ff543d;
  --color-primary-500: #ef4129; /* brand red */
  --color-primary-700: #bd0b02; /* brand dark red */
  --color-secondary-300: #ffc534;
  --color-secondary-500: #ffb600; /* brand yellow */
  --color-secondary-700: #f29616;
  --color-accent-500: #00abc8;
  --color-accent-700: #068ba3;
  --font-primary: 'Open Sans', Arial, Helvetica, sans-serif;
  --font-secondary: Montserrat, Arial, Helvetica, sans-serif;
  --font-tertiary: 'Noto Serif', Georgia, serif;
  --body-background: var(--color-neutral-800);
  --body-color: var(--color-white);
  --body-line-height: 1.67;
  --body-padding: 0;
  --body-margin: 0;
  --main-padding: 0;
  --main-margin: 0;
  --main-max-width: none;
  --main-border-radius: 0;
  --main-clip-path: none;
  --main-background: var(--color-neutral-800);
  --main-color: var(--color-white);
  --form-padding: 0;
  --form-margin: 0;
  --form-background: transparent;
  --form-clip-path: none;
  --h1-font-family: var(--font-secondary);
  --h1-font-style: normal;
  --h1-font-size: 1.75rem;
  --h1-font-weight: 700;
  --h1-line-height: 1.25;
  --h1-text-transform: uppercase;
  --h1-text-align: center;
  --h1-color: inherit;
  --h1-margin: 0 0 1.5rem;
  --h1-padding: 0;
  --h1-letter-spacing: 0.01em;
  --h2-font-family: var(--font-secondary);
  --h2-font-style: normal;
  --h2-font-size: 1.5rem;
  --h2-font-weight: 700;
  --h2-line-height: 1.25;
  --h2-text-transform: uppercase;
  --h2-text-align: initial;
  --h2-color: inherit;
  --h2-margin: 0 0 1.5rem;
  --h2-padding: 0;
  --h2-letter-spacing: 0.01em;
  --h3-font-family: var(--font-secondary);
  --h3-font-style: normal;
  --h3-font-size: 1.25rem;
  --h3-font-weight: 700;
  --h3-line-height: 1.25;
  --h3-text-transform: uppercase;
  --h3-text-align: initial;
  --h3-color: inherit;
  --h3-margin: 0 0 1.5rem;
  --h3-padding: 0;
  --h3-letter-spacing: 0.01em;
  --p-margin: 0 0 1.5rem;
  --input-text-height: 3rem;
  --input-text-padding: 0 1.25rem;
  --input-text-font-size: 1rem;
  --input-text-font-weight: 400;
  --input-text-border-width: 0;
  --input-text-border-color: transparent;
  --input-text-text-align: initial;
  --input-text-background: var(--color-white);
  --input-text-color: var(--color-neutral-800);
  --input-text-background-focus: var(--color-white);
  --input-text-color-focus: var(--color-neutral-800);
  --input-text-border-color-focus: transparent;
  --input-border-radius: 0;
  --input-range-thumb-background: var(--color-secondary-500);
  --input-range-thumb-border-color: transparent;
  --input-range-track-background: transparent;
  --input-range-track-border-color: currentColor;
  --input-radio-color: var(--color-secondary-500);
  --input-radio-border-color: currentColor;
  --input-radio-border-opacity: 0.67;
  --input-radio-border-opacity-hover: 1;
  --input-radio-border-opacity-selected: 1;
  --input-checkbox-color: var(--color-secondary-500);
  --input-checkbox-border-color: currentColor;
  --input-checkbox-border-opacity: 0.67;
  --input-checkbox-border-opacity-hover: 1;
  --input-checkbox-border-opacity-selected: 1;
  --button-font-size: 0.9375rem;
  --button-margin: 3rem 0;
  --button-background: var(--color-secondary-500);
  --button-color: var(--color-neutral-800);
  --button-height: 3.75rem;
  --button-min-width: 13.75rem;
  --button-notch-color: var(--color-secondary-700);
  --button-background-hover: var(--button-notch-color);
  --button-color-hover: var(--button-color);
  --button-align: inherit;
  --field-margin: 1.5rem 0;
  --image-select-arrow: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iNnB4IiBoZWlnaHQ9IjEycHgiIHZpZXdCb3g9IjAgMCA2IDEyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPiAgICAgICAgPHRpdGxlPnNlbGVjdGFycm93PC90aXRsZT4gICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+ICAgIDxkZWZzPjwvZGVmcz4gICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj4gICAgICAgIDxnIGlkPSJzZWxlY3RhcnJvdyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC4wMDAwMDAsIDEuMDAwMDAwKSIgc3Ryb2tlPSIjODY4RTk2Ij4gICAgICAgICAgICA8cG9seWxpbmUgaWQ9IlBhdGgiIHBvaW50cz0iMCAzIDMuMDU1MDg0OTMgMCA2IDIuODkxODE2NTciPjwvcG9seWxpbmU+ICAgICAgICAgICAgPHBvbHlsaW5lIGlkPSJQYXRoLUNvcHkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMuMDAwMDAwLCA4LjUwMDAwMCkgc2NhbGUoMSwgLTEpIHRyYW5zbGF0ZSgtMy4wMDAwMDAsIC04LjUwMDAwMCkgIiBwb2ludHM9IjAgMTAgMy4wNTUwODQ5MyA3IDYgOS44OTE4MTY1NyI+PC9wb2x5bGluZT4gICAgICAgIDwvZz4gICAgPC9nPjwvc3ZnPg==');
  --image-checkmark: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTAgMTIuMTE2bDIuMDUzLTEuODk3YzIuNDAxIDEuMTYyIDMuOTI0IDIuMDQ1IDYuNjIyIDMuOTY5IDUuMDczLTUuNzU3IDguNDI2LTguNjc4IDE0LjY1Ny0xMi41NTVsLjY2OCAxLjUzNmMtNS4xMzkgNC40ODQtOC45MDIgOS40NzktMTQuMzIxIDE5LjE5OC0zLjM0My0zLjkzNi01LjU3NC02LjQ0Ni05LjY3OS0xMC4yNTF6Ii8+PC9zdmc+');

  /* Content widths */
  --hl-spacer: 1.5rem;
}

*,
:after,
:before {
  background: 0 0;
  border: none;
  box-sizing: inherit;
  color: inherit;
  font: inherit;
  font-size: 1em;
  margin: 0;
  padding: 0;
}
html {
  box-sizing: border-box;
}
body {
  text-rendering: optimizeSpeed;
  height: fit-content;
}
[hidden] {
  display: none !important;
}
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0s !important;
    scroll-behavior: auto !important;
  }
}
body {
  margin: var(--body-margin);
  padding: var(--body-padding);
  max-width: var(--body-max-width);
  background: var(--body-background);
  color: var(--body-color);
  font-family: var(--font-primary);
  line-height: var(--body-line-height);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
b,
strong {
  font-weight: 700;
}
em,
i {
  font-style: italic;
}
h1 {
  font: var(--h1-font-style) var(--h1-font-weight) var(--h1-font-size) /
    var(--h1-line-height) var(--h1-font-family);
  text-transform: var(--h1-text-transform);
  text-align: var(--h1-text-align);
  color: var(--h1-color);
  letter-spacing: var(--h1-letter-spacing);
  margin: var(--h1-margin);
  padding: var(--h1-padding);
}
h2 {
  font: var(--h2-font-style) var(--h2-font-weight) var(--h2-font-size) /
    var(--h2-line-height) var(--h2-font-family);
  text-transform: var(--h2-text-transform);
  text-align: var(--h2-text-align);
  color: var(--h2-color);
  letter-spacing: var(--h2-letter-spacing);
  margin: var(--h2-margin);
  padding: var(--h2-padding);
}
h3 {
  font: var(--h3-font-style) var(--h3-font-weight) var(--h3-font-size) /
    var(--h3-line-height) var(--h3-font-family);
  text-transform: var(--h3-text-transform);
  text-align: var(--h3-text-align);
  color: var(--h3-color);
  letter-spacing: var(--h3-letter-spacing);
  margin: var(--h3-margin);
  padding: var(--h3-padding);
}
p {
  margin: var(--p-margin);
}
:focus {
  outline-offset: 2px;
  outline: 2px solid var(--color-secondary-500);
}
img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}
form {
  padding: var(--form-padding);
  margin: var(--form-margin);
  background: var(--form-background);
  clip-path: var(--form-clip-path);
}
ol,
ul {
  padding-left: 2rem;
}

[style*='font-family'] {
  font-family: inherit !important;
}

[style*='color:']:not(.enWidget__fill__count) {
  color: inherit !important;
}

.visually-hidden {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: auto !important;
  margin: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
  white-space: nowrap !important;
}
body .en__field .en__field__element.en__field__element--splitselect {
  display: flex;
  gap: 1.5rem;
  width: 100%;
}
body
  .en__field
  .en__field__element.en__field__element--splitselect
  .en__field__item {
  flex-grow: 1;
}
body .en__field {
  margin: var(--field-margin);
  padding-bottom: 0;
  display: flex;
  flex-direction: column;
}
body .en__field__item {
  padding: 0;
}
body .en__field > .en__field__label {
  display: block;
  margin-bottom: 0.25rem;
  font-size: 0.875rem;
  width: unset;
}
body .en__field.en__mandatory > .en__field__label:after {
  content: '*';
}
body .en__field__helpText {
  font-size: 0.75rem;
  margin: -0.25rem 0 0.5rem;
}
body .en__field--email .en__field__element,
body .en__field--number .en__field__element,
body .en__field--password .en__field__element,
body .en__field--select .en__field__element,
body .en__field--splitselect .en__field__element,
body .en__field--splittext .en__field__element,
body .en__field--telephone .en__field__element,
body .en__field--text .en__field__element,
body .en__field--textarea .en__field__element {
  display: block;
}
body .en__field--email .en__field__input,
body .en__field--number .en__field__input,
body .en__field--password .en__field__input,
body .en__field--select .en__field__input,
body .en__field--splitselect .en__field__input,
body .en__field--splittext .en__field__input,
body .en__field--telephone .en__field__input,
body .en__field--text .en__field__input,
body .en__field--textarea .en__field__input {
  display: block;
  font-weight: var(--input-text-font-weight);
  font-size: var(--input-text-font-size);
  background: var(--input-text-background);
  color: var(--input-text-color);
  width: 100%;
  color: var(--color-neutral-700);
  height: var(--input-text-height);
  padding: var(--input-text-padding);
  text-align: var(--input-text-text-align);
  border-style: solid;
  border-color: var(--input-text-border-color);
  border-width: var(--input-text-border-width);
  border-radius: var(--input-border-radius);
}
body .en__field--email .en__field__input:focus,
body .en__field--number .en__field__input:focus,
body .en__field--password .en__field__input:focus,
body .en__field--select .en__field__input:focus,
body .en__field--splitselect .en__field__input:focus,
body .en__field--splittext .en__field__input:focus,
body .en__field--telephone .en__field__input:focus,
body .en__field--text .en__field__input:focus,
body .en__field--textarea .en__field__input:focus {
  background: var(--input-text-background-focus);
  color: var(--input-text-color-focus);
  border-color: var(--input-text-border-color-focus);
}
body .en__field--email .en__field__input--select,
body .en__field--email .en__field__input--splitselect,
body .en__field--number .en__field__input--select,
body .en__field--number .en__field__input--splitselect,
body .en__field--password .en__field__input--select,
body .en__field--password .en__field__input--splitselect,
body .en__field--select .en__field__input--select,
body .en__field--select .en__field__input--splitselect,
body .en__field--splitselect .en__field__input--select,
body .en__field--splitselect .en__field__input--splitselect,
body .en__field--splittext .en__field__input--select,
body .en__field--splittext .en__field__input--splitselect,
body .en__field--telephone .en__field__input--select,
body .en__field--telephone .en__field__input--splitselect,
body .en__field--text .en__field__input--select,
body .en__field--text .en__field__input--splitselect,
body .en__field--textarea .en__field__input--select,
body .en__field--textarea .en__field__input--splitselect {
  appearance: none;
  background-image: var(--image-select-arrow);
  background-repeat: no-repeat;
  background-position: right 1rem center;
}
body .en__field--email .en__field__input:disabled,
body .en__field--number .en__field__input:disabled,
body .en__field--password .en__field__input:disabled,
body .en__field--select .en__field__input:disabled,
body .en__field--splitselect .en__field__input:disabled,
body .en__field--splittext .en__field__input:disabled,
body .en__field--telephone .en__field__input:disabled,
body .en__field--text .en__field__input:disabled,
body .en__field--textarea .en__field__input:disabled {
  opacity: 0.67;
}
body .en__field--email--textarea,
body .en__field--number--textarea,
body .en__field--password--textarea,
body .en__field--select--textarea,
body .en__field--splitselect--textarea,
body .en__field--splittext--textarea,
body .en__field--telephone--textarea,
body .en__field--text--textarea,
body .en__field--textarea--textarea {
  height: 200px;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
body .en__submit {
  margin: var(--button-margin);
  color: var(--button-color);
  font-family: var(--font-secondary);
  font-size: var(--button-font-size);
  text-align: var(--button-align);
}
body .en__submit button {
  position: relative;
  border: none;
  cursor: pointer;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  font-size: inherit;
  letter-spacing: 0.015em;
  overflow: hidden;
  transition: background-color 0.2s ease-in-out 0s;
  vertical-align: middle;
  white-space: nowrap;
  padding: 0 1.5em;
  background: var(--button-background);
  color: inherit;
  height: var(--button-height);
  line-height: var(--button-height);
  min-width: var(--button-min-width);
}
body .en__submit button:after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  border-bottom: 1.5rem solid var(--button-notch-color);
  border-left: 1.5rem solid transparent;
  transition: transform 0.2s ease-in-out 0s;
}
body .en__submit button:hover {
  background: var(--button-background-hover);
}
body .en__field--checkbox > .en__field__label {
  font-size: 1rem;
  font-weight: 700;
}
body .en__field__element--checkbox .en__field__label {
  position: relative;
  padding-left: 2em;
  font-size: 0.875rem;
  display: block;
}
body .en__field__element--checkbox .en__field__label:after,
body .en__field__element--checkbox .en__field__label:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.125rem;
  display: block;
  height: 1.25em;
  width: 1.25em;
  transition: all 0.1s ease-out;
}
body .en__field__element--checkbox .en__field__label:before {
  border: 1px solid var(--input-checkbox-border-color);
  opacity: var(--input-checkbox-border-opacity);
  cursor: pointer;
}
body .en__field__element--checkbox .en__field__label:after {
  background: var(--image-checkmark) no-repeat center center/contain;
  transition: all 0.1s ease-in-out;
  transform: scale(0);
}
body .en__field__element--checkbox .en__field__label:hover:before {
  opacity: var(--input-checkbox-border-opacity-hover);
}
body .en__field__element--checkbox .en__field__input--checkbox {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: auto !important;
  margin: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
  white-space: nowrap !important;
}
body
  .en__field__element--checkbox
  .en__field__input--checkbox:checked
  + .en__field__label:before {
  background: var(--input-checkbox-color);
  border-color: var(--input-checkbox-color);
  opacity: var(--input-checkbox-border-opacity-hover);
}
body
  .en__field__element--checkbox
  .en__field__input--checkbox:checked
  + .en__field__label:after {
  transform: scale(0.75);
}
body .en__component--column {
  min-width: auto;
}

.en__field__element--imgselect {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  column-gap: 1rem;
  row-gap: 2rem;
  justify-content: space-around;
}

.en__imageSelectField {
  align-items: center;
  border: 2px solid transparent;
  border-radius: 0.5rem;
  display: flex;
  height: 4rem;
  justify-content: center;
  padding: 0.5rem;
  width: 6rem;
}

@media (min-width: 768px) {
  .en__imageSelectField {
    height: 6rem;
    width: 9rem;
  }
}

.en__imageSelectField:has(input[type='radio']:focus) {
  border-color: var(--color-secondary-500);
}

.en__imageSelectField:has(input[type='radio']:checked) {
  border-color: var(--color-primary-500);
}

.en__imageSelectField__image {
  max-height: 3rem;
  max-width: 5rem;
}

@media (min-width: 768px) {
  .en__imageSelectField__image {
    max-height: 5rem;
    max-width: 8rem;
  }
}

.en__field__element--imgselect .en__field__item {
  padding-right: 0;
}

/* Visually hide the radio buttons, but keep them accessible */
.en__field__element--imgselect .en__imageSelectField__control {
  height: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  width: 0;
}

body .en__field--radio {
  width: 100%;
}
body .en__field--radio > .en__field__label {
  font-size: 1rem;
  font-weight: 700;
}
body .en__field--radio .en__field__element {
  display: flex;
  gap: 1.5rem;
  padding: 0;
}
body .en__field--radio .en__field__element .en__field__label {
  position: relative;
  padding-left: 2em;
  font-size: 0.875rem;
  line-height: normal;
}
body .en__field--radio .en__field__element .en__field__label:after,
body .en__field--radio .en__field__element .en__field__label:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  height: 1.375em;
  width: 1.375em;
  transition: all 0.1s ease-out;
  border-radius: 50%;
}
body .en__field--radio .en__field__element .en__field__label:before {
  border: 1px solid var(--input-radio-border-color);
  opacity: var(--input-radio-border-opacity);
  cursor: pointer;
}
body .en__field--radio .en__field__element .en__field__label:after {
  background: var(--input-radio-color);
  transform: scale(0);
}
body .en__field--radio .en__field__element .en__field__label:hover:before {
  opacity: var(--input-radio-border-opacity-hover);
}
body .en__field--radio .en__field__input--radio {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: auto !important;
  margin: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
  white-space: nowrap !important;
}
body .en__field--radio .en__field__input--radio:checked + .en__field__label {
  font-weight: 700;
}
body
  .en__field--radio
  .en__field__input--radio:checked
  + .en__field__label:before {
  opacity: var(--input-radio-border-opacity-selected);
}
body
  .en__field--radio
  .en__field__input--radio:checked
  + .en__field__label:after {
  transform: scale(0.55);
}
body .en__field--range > .en__field__label {
  font-size: 1rem;
  font-weight: 700;
}
body .en__field--range .en__field__element {
  display: block;
}
body .en__field--range .en__field__input {
  display: block;
  width: 100%;
  margin: 0.5rem 0 0.25rem;
  -webkit-appearance: none;
}
body .en__field--range .en__field__input::-webkit-slider-thumb {
  -webkit-appearance: none;
}
body .en__field--range .en__field__input::-ms-track {
  width: 100%;
  cursor: pointer;
  background: 0 0;
  border-color: transparent;
  color: transparent;
}
body .en__field--range .en__field__input::-webkit-slider-thumb {
  -webkit-appearance: none;
  border-radius: 50%;
  background: var(--input-range-thumb-background);
  border: 0.125rem solid var(--input-range-thumb-border-color);
  cursor: pointer;
  box-shadow: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.5);
  height: 1.125rem;
  width: 1.125rem;
  margin-top: -0.0125rem;
  margin-top: -0.25rem;
}
body .en__field--range .en__field__input::-moz-range-thumb {
  border-radius: 50%;
  background: var(--input-range-thumb-background);
  border: 0.125rem solid var(--input-range-thumb-border-color);
  cursor: pointer;
  box-shadow: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.5);
  height: 1.125rem;
  width: 1.125rem;
  margin-top: -0.0125rem;
}
body .en__field--range .en__field__input::-ms-thumb {
  border-radius: 50%;
  background: var(--input-range-thumb-background);
  border: 0.125rem solid var(--input-range-thumb-border-color);
  cursor: pointer;
  box-shadow: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.5);
  height: 1.125rem;
  width: 1.125rem;
  margin-top: -0.0125rem;
}
body .en__field--range .en__field__input::-webkit-slider-runnable-track {
  -webkit-appearance: none;
  width: 100%;
  height: 0.6875rem;
  border-radius: 0.34375rem;
  cursor: pointer;
  background: var(--input-range-track-background);
  border: 0.0625rem solid var(--input-range-track-border-color);
}
body .en__field--range .en__field__input::-moz-range-track {
  width: 100%;
  height: 0.6875rem;
  border-radius: 0.34375rem;
  cursor: pointer;
  background: var(--input-range-track-background);
  border: 0.0625rem solid var(--input-range-track-border-color);
}
body .en__field--range .en__field__input::-ms-track {
  width: 100%;
  height: 0.6875rem;
  border-radius: 0.34375rem;
  cursor: pointer;
  background: var(--input-range-track-background);
  border: 0.0625rem solid var(--input-range-track-border-color);
}
body .en__field--range .en__rangeFieldLabels {
  display: flex;
  justify-content: space-between;
  font-size: 0.875rem;
}
body .en__component--ecardblock button {
  background: var(--color-primary-500);
  border-radius: 0;
  transition: background-color 0.2s ease-in-out 0s;
}
body .en__component--ecardblock button:hover {
  background: var(--color-primary-700);
}
body .en__component--ecardblock label {
  display: block;
  padding: 6px 0;
  margin-bottom: 0.25rem;
  font-size: 0.875rem;
  width: unset;
}
body .en__component--ecardblock input,
body .en__component--ecardblock textarea {
  display: block;
  font-weight: var(--input-text-font-weight);
  font-size: var(--input-text-font-size);
  background: var(--input-text-background);
  color: var(--color-neutral-700);
  height: var(--input-text-height);
  padding: var(--input-text-padding);
  text-align: var(--input-text-text-align);
  border-style: solid;
  border-color: var(--input-text-border-color);
  border-width: var(--input-text-border-width);
  border-radius: var(--input-border-radius);
}
body .en__component--ecardblock input:focus,
body .en__component--ecardblock textarea:focus {
  background: var(--input-text-background-focus);
  color: var(--input-text-color-focus);
  border-color: var(--input-text-border-color-focus);
}
body .en__component--ecardblock textarea {
  height: 200px;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
body .en__ecarditems__showprev {
  position: relative;
  font-weight: 700;
  text-transform: uppercase;
  font-family: inherit;
  font-size: 0.9375rem;
  letter-spacing: 0.015em;
  padding: 0 1.5em;
  height: var(--button-height);
  line-height: var(--button-height);
  min-width: var(--button-min-width);
  margin-bottom: 1rem;
}
body .en__ecarditems__showprev:after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  border-bottom: 1.5rem solid var(--color-primary-700);
  border-left: 1.5rem solid transparent;
  transition: transform 0.2s ease-in-out 0s;
}
body .en__ecarditems__addrecipient {
  height: var(--input-text-height);
  width: var(--input-text-height);
}
body .en__ecardrecipients__detail {
  margin: var(--field-margin);
  margin-top: 0;
}
body .en__ecardrecipients__name input {
  width: 92%;
}
body .en__ecardrecipients__email input {
  width: calc(92% - var(--input-text-height));
}
body .en__ecardrecipients__list {
  color: var(--input-text-color);
  background: var(--color-neutral-250);
  border: none;
}
body .en__ecardrecipients__recipient input {
  background: 0 0;
  width: auto;
  height: auto;
  padding: inherit;
  flex: 1 1 0;
  margin-right: 0.75rem;
}
body .ecardrecipient__remove button {
  transition: color 0.2s ease-in-out 0s;
}
body .ecardrecipient__remove button:hover {
  background: 0 0;
  color: var(--color-primary-700);
}
body .en__field__error {
  font-size: 0.75rem;
  color: var(--color-primary-500);
  order: 99;
  margin-top: 0.5rem;
}
body .en__socialShares {
  height: auto;
}
body .en__component--contactblock {
  background: 0 0;
}
body .en__contact__detail {
  padding: 0;
  background: 0 0;
}
body .en__contact__detail .en__field--email,
body .en__contact__detail .en__field--number,
body .en__contact__detail .en__field--password,
body .en__contact__detail .en__field--select,
body .en__contact__detail .en__field--splitselect,
body .en__contact__detail .en__field--textarea,
body .en__contact__detail .en__field__input--text {
  display: block;
  font-weight: var(--input-text-font-weight);
  font-size: var(--input-text-font-size);
  background: var(--input-text-background);
  color: var(--input-text-color);
  width: 100%;
  color: var(--color-neutral-700);
  height: var(--input-text-height);
  padding: var(--input-text-padding);
  text-align: var(--input-text-text-align);
  border-style: solid;
  border-color: var(--input-text-border-color);
  border-width: var(--input-text-border-width);
  border-radius: var(--input-border-radius);
}
body .en__contact__detail .en__field--email:focus,
body .en__contact__detail .en__field--number:focus,
body .en__contact__detail .en__field--password:focus,
body .en__contact__detail .en__field--select:focus,
body .en__contact__detail .en__field--splitselect:focus,
body .en__contact__detail .en__field--textarea:focus,
body .en__contact__detail .en__field__input--text:focus {
  background: var(--input-text-background-focus);
  color: var(--input-text-color-focus);
  border-color: var(--input-text-border-color-focus);
}
body .en__contact__detail .en__field--email--select,
body .en__contact__detail .en__field--email--splitselect,
body .en__contact__detail .en__field--number--select,
body .en__contact__detail .en__field--number--splitselect,
body .en__contact__detail .en__field--password--select,
body .en__contact__detail .en__field--password--splitselect,
body .en__contact__detail .en__field--select--select,
body .en__contact__detail .en__field--select--splitselect,
body .en__contact__detail .en__field--splitselect--select,
body .en__contact__detail .en__field--splitselect--splitselect,
body .en__contact__detail .en__field--textarea--select,
body .en__contact__detail .en__field--textarea--splitselect,
body .en__contact__detail .en__field__input--text--select,
body .en__contact__detail .en__field__input--text--splitselect {
  appearance: none;
  background-image: var(--image-select-arrow);
  background-repeat: no-repeat;
  background-position: right 1rem center;
}
body .en__contact__detail .en__field--email:disabled,
body .en__contact__detail .en__field--number:disabled,
body .en__contact__detail .en__field--password:disabled,
body .en__contact__detail .en__field--select:disabled,
body .en__contact__detail .en__field--splitselect:disabled,
body .en__contact__detail .en__field--textarea:disabled,
body .en__contact__detail .en__field__input--text:disabled {
  opacity: 0.67;
}
body .en__contact__detail .en__field--textarea {
  height: 200px;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
body .en__hidden {
  display: none !important;
}
body .en__field--recurrpay > .en__field__label {
  display: none;
}
body .en__field--recurrpay .en__field__error {
  padding-top: 0.125rem;
}
body .en__field--recurrpay .en__field__element--radio .en__field__label {
  padding: 0.5rem 0.75rem;
  color: var(--color-neutral-200);
  border: 1px solid var(--color-neutral-400);
  border-radius: 0.375rem;
  cursor: pointer;
  display: block;
  transition: all 0.1s ease-out;
  flex-grow: 1;
  text-align: center;
  line-height: 1.25;
}
body .en__field--recurrpay .en__field__element--radio .en__field__label:hover {
  border-color: var(--color-white);
  color: var(--color-white);
}
body .en__field--recurrpay .en__field__element--radio .en__field__label:after,
body .en__field--recurrpay .en__field__element--radio .en__field__label:before {
  display: none;
}
body
  .en__field--recurrpay
  .en__field__element--radio
  .en__field__input:checked
  + .en__field__label {
  background: var(--color-primary-500);
  border-color: var(--color-primary-500);
  font-weight: 600;
  color: var(--color-white);
}
body .en__field--NOT_TAGGED_12.en__field--radio > .en__field__label,
body .en__field--donationAmt.en__field--radio > .en__field__label {
  display: none;
}
body .en__field--NOT_TAGGED_12.en__field--radio .en__field__error,
body .en__field--donationAmt.en__field--radio .en__field__error {
  padding-top: 1rem;
}
body .en__field--NOT_TAGGED_12.en__field--radio .en__field__element--radio,
body .en__field--donationAmt.en__field--radio .en__field__element--radio {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 1px;
}
@media (min-width: 600px) {
  body .en__field--NOT_TAGGED_12.en__field--radio .en__field__element--radio,
  body .en__field--donationAmt.en__field--radio .en__field__element--radio {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
body .en__field--NOT_TAGGED_12.en__field--radio .en__field__item,
body .en__field--donationAmt.en__field--radio .en__field__item {
  display: contents;
}
body .en__field--NOT_TAGGED_12.en__field--radio .en__field__item--hidden,
body .en__field--donationAmt.en__field--radio .en__field__item--hidden {
  display: none;
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__label,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__label {
  color: var(--color-neutral-800);
  height: 6.25rem;
  display: block;
  text-align: center;
  position: relative;
  line-height: 6.25rem;
  width: 100%;
  z-index: 1;
  font-size: 2rem;
  cursor: pointer;
  font-weight: 300;
  text-transform: capitalize;
  padding-left: 0;
}
@media (min-width: 600px) {
  body
    .en__field--NOT_TAGGED_12.en__field--radio
    .en__field__item
    .en__field__label,
  body
    .en__field--donationAmt.en__field--radio
    .en__field__item
    .en__field__label {
    line-height: 8.75rem;
    height: 8.75rem;
    font-size: 3rem;
  }
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__label:after,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__label:after {
  display: none;
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__label:before,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__label:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: var(--color-white);
  z-index: -1;
  transition: all 0.1s ease-out;
  transform: scale(1);
  border-radius: 0;
  border: none;
  opacity: 1;
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__label:hover:before,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__label:hover:before {
  transform: scale(0.95);
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__input--radio,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__input--radio {
  display: none;
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__input--radio[value='Other']:checked
  + label,
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__input--radio[value='other']:checked
  + label,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__input--radio[value='Other']:checked
  + label,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__input--radio[value='other']:checked
  + label {
  display: none !important;
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__input--radio:checked
  + .en__field__label,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__input--radio:checked
  + .en__field__label {
  z-index: 2;
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__input--radio:checked
  + .en__field__label:before,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__input--radio:checked
  + .en__field__label:before {
  transform: scaleX(1.125) scaleY(1.14286);
  box-shadow: 0 2px 20px 4px rgba(0, 0, 0, 0.12),
    0 0.375rem 0 0 var(--color-primary-700) inset;
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__item--hidden,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__item--hidden {
  display: none;
}
body
  .en__field--NOT_TAGGED_12.en__field--radio
  .en__field__item
  .en__field__input--other,
body
  .en__field--donationAmt.en__field--radio
  .en__field__item
  .en__field__input--other,
.hl-slider-number {
  background: var(--color-white);
  color: var(--color-neutral-800);
  width: 100%;
  line-height: 6.25rem;
  font-size: 2rem;
  text-align: center;
  transition: all 0.2s ease-in-out;
  position: relative;
  outline: 0;
  font-weight: 300;
  z-index: 2;
  transform: scale(1.125);
  transition: all 0.2s ease-in-out;
  box-shadow: 0 2px 20px 4px rgba(0, 0, 0, 0.12),
    0 0.375rem 0 0 var(--color-primary-700) inset;
}
@media (min-width: 600px) {
  body
    .en__field--NOT_TAGGED_12.en__field--radio
    .en__field__item
    .en__field__input--other,
  body
    .en__field--donationAmt.en__field--radio
    .en__field__item
    .en__field__input--other {
    line-height: 8.75rem;
    font-size: 2.667rem;
  }
}

.en__field.en__field--donationAmt
  .en__field__item--other:not(.en__field__item--hidden),
.hl-slider-number-input-container {
  flex-direction: row-reverse;
  background: #1d252c;
  border-radius: 5px;
  height: 2.8rem;
  display: flex;
  flex-grow: 100;
  font-size: 1.125rem !important;
}

.en__field.en__field--donationAmt
  .en__field__item--other:not(.en__field__item--hidden)
  label {
  box-sizing: border-box;
  height: 55px;
  flex-basis: 15%;
  margin: 0;
  padding: 12px 7px;
  padding-right: 0;
  text-align: right;
  color: transparent;
  background: unset;
  border-radius: 5px 0 0 5px;
}

.en__field.en__field--donationAmt
  .en__field__item--other:not(.en__field__item--hidden)
  input,
body .hl-slider-number {
  height: 2.8rem;
  flex-basis: 85%;
  margin: 0;
  border: 0;
  background: #fff;
  color: #000;
  box-sizing: border-box;
  border-radius: 0 5px 5px 0;
  margin-right: 0px;
  padding: 13px 13px 13px 0px;
  font-size: 1.125rem !important;
  color: #000 !important;
  border-top: solid 1px #999999;
  border-bottom: solid 1px #999999;
  border-right: solid 1px #999999;
  text-align: left;
  padding-left: 20px;
}

.en__field--donationAmt
  div.en__field__element--radio
  .en__field__item.en__field__item--other:not(.en__field__item--hidden)::after,
.en__field--recurrfreq
  div.en__field__element--radio
  .en__field__item.en__field__item--other:not(.en__field__item--hidden)::after,
.hl-slider-number-input-container::after {
  content: '£';
  font-size: 1.125rem !important;
  color: #fff;
  width: 45px;
  display: flex;
  flex-direction: row;
  align-content: center;
  justify-content: center;
  align-items: center;
}

/* Donation amount slider */
.hl-slider-container,
.hl-slider-settings {
  display: none;
}

#en__pagebuilder .hl-slider-container,
#en__pagebuilder .hl-slider-settings {
  display: block;
}

.hl-slider-container {
  margin: 1.5rem 0;
}

.hl-slider-container label {
  width: 100%;
}

.hl-slider-number-input-container {
  background-color: var(--color-primary-500);
}

:root {
  --range-track-height: 0.5rem;
  --range-thumb-size: 2rem;
  --range-track-radius: 999px;
  --range-thumb-radius: 50%;
  --range-colour: var(--color-primary-500); /* active / filled part */
  --range-bg: transparent; /* track background */
  --range-thumb-bg: var(--color-primary-500);
  --range-thumb-border: 0.12rem solid var(--color-primary-500);
  --range-thumb-focus-ring: 0.25rem;
}

/* Base reset */
input[type='range'] {
  -webkit-appearance: none; /* webkit */
  appearance: none;
  background: var(--range-bg);
  cursor: pointer;
  height: var(--range-thumb-size);
  margin: 0;
  width: 100%;
}

/* WebKit (Chrome, Safari, Edge Chromium) track */
input[type='range']::-webkit-slider-runnable-track {
  background: var(--range-colour);
  border-radius: var(--range-track-radius);
  box-sizing: border-box;
  cursor: pointer;
  height: var(--range-track-height);
  width: 100%;
}

/* WebKit thumb */
input[type='range']::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  background: radial-gradient(
    circle at 50% 40%,
    var(--range-thumb-bg) 0%,
    var(--range-thumb-bg) 70%
  );
  border: var(--range-thumb-border);
  border-radius: var(--range-thumb-radius);
  box-shadow: 0 0 0 calc(var(--range-thumb-focus-ring) * 0) transparent;
  cursor: pointer;
  height: var(--range-thumb-size);
  margin-top: calc((var(--range-track-height) - var(--range-thumb-size)) / 2);
  width: var(--range-thumb-size);
}

/* Firefox track */
input[type='range']::-moz-range-track {
  background: var(--range-bg);
  border-radius: var(--range-track-radius);
  box-sizing: border-box;
  cursor: pointer;
  height: var(--range-track-height);
  width: 100%;
}

/* Firefox filled part + thumb */
input[type='range']::-moz-range-progress {
  background: var(--range-color);
  border-radius: var(--range-track-radius);
  height: var(--range-track-height);
}
input[type='range']::-moz-range-thumb {
  background: radial-gradient(
    circle at 50% 40%,
    var(--range-thumb-bg) 0%,
    var(--range-thumb-bg) 70%
  );
  border: var(--range-thumb-border);
  border-radius: var(--range-thumb-radius);
  box-shadow: none;
  cursor: pointer;
  height: var(--range-thumb-size);
  width: var(--range-thumb-size);
}

/* IE / old Edge */
input[type='range']::-ms-track {
  border: 0;
  color: transparent;
  cursor: pointer;
  height: var(--range-track-height);
  width: 100%;
  background: transparent;
}
input[type='range']::-ms-fill-lower {
  background: var(--range-color);
  border-radius: var(--range-track-radius);
  height: var(--range-track-height);
}
input[type='range']::-ms-fill-upper {
  background: var(--range-bg);
  border-radius: var(--range-track-radius);
  height: var(--range-track-height);
}
input[type='range']::-ms-thumb {
  background: radial-gradient(
    circle at 50% 40%,
    var(--range-thumb-bg) 0%,
    var(--range-thumb-bg) 70%
  );
  border: var(--range-thumb-border);
  border-radius: var(--range-thumb-radius);
  cursor: pointer;
  height: var(--range-thumb-size);
  margin-top: 0;
  width: var(--range-thumb-size);
}

/* Focus styles (visible) */
input[type='range']:focus {
  outline: none;
}
input[type='range']:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 var(--range-thumb-focus-ring) rgba(43, 108, 176, 0.18);
}
input[type='range']:focus::-moz-range-thumb {
  box-shadow: 0 0 0 var(--range-thumb-focus-ring) rgba(43, 108, 176, 0.18);
}
input[type='range']:focus::-ms-thumb {
  box-shadow: 0 0 0 var(--range-thumb-focus-ring) rgba(43, 108, 176, 0.18);
}

/* Reduced motion / accessibility */
@media (prefers-reduced-motion: reduce) {
  input[type='range'] {
    transition: none;
  }
}

/* Small utility: visually-hide the default Firefox focus outline for thumb while keeping keyboard focus visible */
input[type='range']::-moz-focus-outer {
  border: 0;
}

/* Impact statements */
.impact-statement {
  display: none;
}

#en__pagebuilder .impact-statement {
  display: block;
}

.impact-statement p {
  align-items: center;
  background-color: var(--color-secondary-500);
  border-radius: 0.5rem;
  color: black;
  display: flex;
  flex-direction: column;
  margin-top: 2rem !important;
  padding: 1rem;
  text-align: center;
  width: 100%;
}

.impact-statement p img {
  border-radius: 0.25rem;
  height: auto !important;
  margin-bottom: 1rem;
  width: 100% !important;
}

body .en__component--gift-aid {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
}

body .en__component--gift-aid .en__field {
  flex-grow: 1;
  margin: 0;
}

body .en__component--gift-aid .en__field--checkbox {
  width: 100%;
}

/* Hide the other Gift Aid radio button field */
/* TODO: uncomment styles below when we have changed over to new Gift Aid checkbox */
/* body .en__field--NOT_TAGGED_5 {
  display: none;
}

#en__pagebuilder .en__field--NOT_TAGGED_5 {
  display: block;
} */

/* Hide the 'Gift Aid' opt-in checkbox */
.en__field--gift-aid {
  display: none !important;
}

#en__pagebuilder .en__field--gift-aid {
  display: block !important;
}

body .en__upsellModal__content {
  color: var(--color-neutral-800);
  text-align: center;
}
body #en__upsellModal #en__upsellModal__yes button {
  position: relative;
  border: none;
  cursor: pointer;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  font-size: inherit;
  letter-spacing: 0.015em;
  overflow: hidden;
  transition: background-color 0.2s ease-in-out 0s;
  vertical-align: middle;
  padding: 0 1.5em;
  background: var(--button-background);
  color: inherit;
  height: 4em;
  line-height: 1.25;
  min-width: var(--button-min-width);
  font-family: var(--font-secondary);
  font-size: var(--button-font-size);
  color: var(--button-color);
}
body #en__upsellModal #en__upsellModal__yes button:after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  border-bottom: 1.5rem solid var(--button-notch-color);
  border-left: 1.5rem solid transparent;
  transition: transform 0.2s ease-in-out 0s;
}
body #en__upsellModal #en__upsellModal__yes button:hover {
  background: var(--button-background-hover);
}
body #en__upsellModal #en__upsellModal__no button {
  padding: 0;
  margin: 0;
  display: inline;
  text-decoration: underline;
  text-decoration-color: var(--color-secondary-500);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
  width: auto;
  cursor: pointer;
  font-weight: 600;
}
body #en__upsellModal #en__upsellModal__no button:hover {
  background: var(--color-secondary-500);
}
.thw-iframe--donation {
  --body-padding: 1.5rem;
  --input-radio-color: var(--color-primary-500);
  --input-checkbox-color: var(--color-primary-500);
  --button-background: var(--color-primary-500);
  --button-color: var(--color-white);
  --button-height: 5rem;
  --button-min-width: 16.25rem;
  --button-notch-color: var(--color-primary-700);
  --button-background-hover: var(--color-primary-700);
}
.thw-iframe--newsletter-subscribe {
  --input-text-height: 3.75rem;
  --input-text-font-size: 1.125rem;
  --input-text-font-weight: 300;
  --input-text-border-width: 1px;
  --input-text-border-color: var(--color-neutral-250);
  --input-text-text-align: center;
  --input-text-background: var(--color-neutral-200);
  --input-text-background-focus: var(--color-white);
  --input-text-border-color-focus: var(--color-secondary-500);
  --field-margin: 1rem 0;
}
.thw-iframe--newsletter-subscribe {
  background: var(--color-white);
  color: var(--color-neutral-800);
}
.thw-iframe--newsletter-subscribe h1 {
  font-family: var(--font-tertiary);
  font-style: italic;
  letter-spacing: 0;
  text-transform: none;
  text-align: left;
  font-weight: 700;
  font-size: 1.5rem;
  text-align: center;
}
.thw-iframe--newsletter-subscribe h2 {
  text-align: center;
  font-size: 1.75rem;
  line-height: 1.2;
  letter-spacing: 0.05em;
}
.thw-iframe--newsletter-subscribe p {
  margin: 0.75rem 0;
  text-align: center;
  font-size: 1.125rem;
}
.thw-iframe--newsletter-subscribe .en__field > .en__field__label {
  text-align: center;
}
.thw-iframe--newsletter-subscribe .en__field--radio .en__field__element {
  justify-content: center;
}
.thw-iframe--newsletter-subscribe
  .en__field--radio
  .en__field__element
  .en__field__label:hover:before {
  border-color: var(--color-neutral-500);
}
.thw-iframe--newsletter-subscribe
  .en__field--radio
  .en__field__input--radio:checked
  + .en__field__label:before {
  border-color: var(--color-neutral-500);
}
.thw-iframe--newsletter-subscribe
  .en__field--checkbox
  .en__field__element
  .en__field__label:hover:before {
  border-color: var(--color-neutral-500);
}
.thw-iframe--newsletter-subscribe
  .en__field--checkbox
  .en__field__input--checkbox:checked
  + .en__field__label:before {
  border-color: var(--color-neutral-500);
}
.thw-iframe--newsletter-subscribe .en__submit {
  text-align: center;
  margin: 1.5rem 0;
}
.thw-iframe--newsletter-footer {
  --body-max-width: 23.9375rem;
  --body-background: transparent;
  --h1-font-family: var(--font-tertiary);
  --h1-font-style: italic;
  --h1-color: var(--color-secondary-500);
  --h1-letter-spacing: 0;
  --h1-text-transform: none;
  --h1-text-align: initial;
  --h1-font-size: 1.25rem;
  --h2-font-size: 1.125rem;
  --h2-line-height: 1.2;
  --h2-letter-spacing: 0.05em;
  --p-margin: 1rem 0;
  --input-text-height: 3.75rem;
  --input-text-font-size: 1.125rem;
  --input-text-font-weight: 300;
  --input-text-border-width: 1px;
  --input-text-border-color: var(--color-neutral-250);
  --input-text-text-align: center;
  --input-text-background: var(--color-neutral-200);
  --input-text-background-focus: var(--color-white);
  --input-text-border-color-focus: var(--color-secondary-500);
  --button-margin: 1rem 0;
  --field-margin: 1rem 0;
  --form-padding: 1.75rem 2rem;
  --form-background: var(--color-black);
  --form-clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 2.5rem),
    calc(100% - 2.5rem) 100%,
    0 100%
  );
}
.en-page {
  --body-background: transparent;
  --main-max-width: 50rem;
  --main-margin: clamp(0rem, calc(6vw - 120px), 3rem) auto;
  --main-padding: clamp(3rem, 6.25%, 4rem) clamp(1.5rem, 6.25%, 4rem);
  --button-align: center;
}
.en-page .pageImage {
  width: auto !important;
  height: auto !important;
}
.en-page .main {
  margin: var(--main-margin);
  background: var(--main-background);
  color: var(--main-color);
  border-radius: var(--main-border-radius);
  padding: var(--main-padding);
  max-width: var(--main-max-width);
  clip-path: var(--main-clip-path);
  width: 100%;
}
.en-page .footer {
  background: var(--color-black);
  color: var(--color-white);
  padding: 1.75rem 1.25rem;
}
@media (min-width: 1140px) {
  .en-page .footer {
    height: 3.75rem;
    padding: 0 2.5rem;
  }
}
.en-page .footer__container {
  margin: 0 auto;
}
@media (min-width: 1140px) {
  .en-page .footer__container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
  }
}
@media (min-width: 1140px) {
  .en-page .footer__section {
    white-space: nowrap;
    flex: 1;
    display: flex;
    justify-content: center;
  }
  .en-page .footer__section:first-child > * {
    margin-right: auto;
  }
  .en-page .footer__section:last-child > * {
    text-align: right;
    margin-left: auto;
  }
}
.en-page .footer-nav {
  list-style: none;
  display: flex;
  margin: 0;
  padding: 0.5em 0 0;
  justify-content: center;
  font-size: 0.75rem;
  line-height: 1;
}
@media (min-width: 1140px) {
  .en-page .footer-nav {
    padding-top: 0;
  }
}
.en-page .footer-nav a {
  text-decoration: none;
  color: inherit;
  display: block;
  padding: 4px 8px;
}
.en-page .footer-nav a:hover {
  text-decoration: underline;
}
.en-page .social {
  list-style: none;
  display: flex;
  margin: 0 -6px;
  padding: 0;
  justify-content: center;
  line-height: 1;
}
.en-page .social__item {
  color: var(--color-white);
  padding: 6px;
}
.en-page .social__item a {
  display: block;
  color: inherit;
  opacity: 0.68;
}
.en-page .social__item a:hover {
  opacity: 1;
}
.en-page .social__item svg {
  display: block;
}
.en-page .social__item path {
  fill: currentColor;
}
.en-page .copyright {
  font-size: 0.75rem;
  line-height: 1;
  opacity: 0.68;
  margin: 0;
  padding: 3em 0 0;
  text-align: center;
}
@media (min-width: 1140px) {
  .en-page .copyright {
    padding-top: 0;
  }
}
.en-page--light {
  --body-color: var(--color-neutral-600);
  --body-background: transparent;
  --main-border-radius: 0.5rem;
  --main-background: var(--color-white);
  --main-color: var(--color-neutral-600);
  --input-text-height: 3.125rem;
  --input-text-border-width: 0 0 0.125rem;
  --input-text-background: var(--color-neutral-100);
  --input-text-background-focus: var(--color-neutral-100);
  --input-text-border-color: var(--color-neutral-300);
  --input-text-border-color-focus: var(--color-secondary-500);
  --input-text-color: var(--color-neutral-600);
}
.en-page--light :focus {
  outline: 0;
}
.en-page--transparent {
  --body-color: var(--color-neutral-600);
  --body-background: transparent;
  --main-border-radius: 0.5rem;
  --main-background: rgba(255, 255, 255, 0.9);
  --main-color: var(--color-neutral-600);
  --input-text-height: 3.125rem;
  --input-text-border-width: 0 0 0.125rem;
  --input-text-background: var(--color-neutral-100);
  --input-text-background-focus: var(--color-neutral-100);
  --input-text-border-color: var(--color-neutral-300);
  --input-text-border-color-focus: var(--color-secondary-500);
  --input-text-color: var(--color-neutral-600);
}
.en-page--transparent :focus {
  outline: 0;
}
.en-page--dark {
  --main-background: var(--color-neutral-800);
  --main-color: var(--color-white);
  --main-clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 3.75rem),
    calc(100% - 3.75rem) 100%,
    0 100%
  );
}
.en-page--donation {
  --body-padding: 1.5rem;
  --input-radio-color: var(--color-primary-500);
  --input-checkbox-color: var(--color-primary-500);
  --button-background: var(--color-primary-500);
  --button-color: var(--color-white);
  --button-height: 5rem;
  --button-min-width: 16.25rem;
  --button-notch-color: var(--color-primary-700);
  --button-background-hover: var(--color-primary-700);
}
.en-page--donation-standalone {
  --body-padding: 0;
  --input-radio-color: var(--color-primary-500);
  --input-checkbox-color: var(--color-primary-500);
  --button-background: var(--color-primary-500);
  --button-color: var(--color-white);
  --button-height: 5rem;
  --button-min-width: 16.25rem;
  --button-notch-color: var(--color-primary-700);
  --button-background-hover: var(--color-primary-700);
}
.en-page--donation-standalone .header {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 2;
  height: 3.75rem;
  padding: 0 1.5rem;
  display: flex;
  align-items: center;
}
@media (min-width: 768px) {
  .en-page--donation-standalone .header {
    height: 4.75rem;
  }
}
@media (min-width: 1140px) {
  .en-page--donation-standalone .header {
    padding: 0 2.5rem;
  }
}
.en-page--donation-standalone .header__logo {
  width: 7.8125rem;
}
@media (min-width: 768px) {
  .en-page--donation-standalone .header__logo {
    width: 17.5rem;
  }
}
.en-page--donation-standalone .hero {
  position: relative;
  z-index: 1;
  padding: 6rem 1.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 4rem;
}
@media (min-width: 1140px) {
  .en-page--donation-standalone .hero {
    padding: 10rem 2.5rem 0;
    flex-direction: row;
    justify-content: space-around;
  }
}
.en-page--donation-standalone .hero__image {
  width: 100%;
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  clip-path: polygon(0 0, 100% 0, 100% 90%, 70% 100%, 0 82%);
}
.en-page--donation-standalone .hero__image img {
  width: 100%;
}
.en-page--donation-standalone .hero__image:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0), #000 115%);
  top: 0;
  left: 0;
}
.en-page--donation-standalone .hero__content {
  margin: 0;
  max-width: 40rem;
}
@media (min-width: 1140px) {
  .en-page--donation-standalone .hero__content {
    max-width: 20rem;
  }
}
.en-page--donation-standalone .hero__title {
  max-width: 20rem;
  font-size: 2.25rem;
}
@media (min-width: 1280px) {
  .en-page--donation-standalone .hero__title {
    font-size: 3rem;
  }
}
.en-page--donation-standalone .hero__text {
  font-size: 1.125rem;
}
.en-page--donation-standalone .hero__form {
  background: var(--color-neutral-800);
  padding: 1.5rem;
  margin: 0 -1.5rem;
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 3rem),
    calc(100% - 3rem) 100%,
    0 100%
  );
}
@media (min-width: 640px) {
  .en-page--donation-standalone .hero__form {
    max-width: 860px;
    width: 100%;
    padding: 3rem;
    margin: 0;
  }
}
@media (min-width: 960px) {
  .en-page--donation-standalone .hero__form {
    padding: 5rem;
  }
}
@media (min-width: 1140px) {
  .en-page--donation-standalone .hero__form {
    margin-top: 15vw;
  }
}
.en-page--donation-standalone .text-block {
  color: var(--color-neutral-800);
  padding: 5rem 1.5rem;
  max-width: 43rem;
  text-align: center;
  margin: 0 auto;
  font-size: 1.125rem;
}
.en-page--donation-standalone .text-block a {
  text-decoration: none;
  border-bottom: 2px solid var(--color-secondary-500);
}
.en-page--donation-standalone .text-block a:hover {
  background: var(--color-secondary-500);
}

/* The Humane League logo */

.logo-container {
  display: flex;
  justify-content: center;
  margin-bottom: 2rem;
  width: 100%;
}

@media (min-width: 600px) {
  .logo-container {
    justify-content: flex-end;
  }
}

.logo {
  margin: 0;
  max-width: 18.75rem;
  width: 100%;
}

@media (min-width: 600px) {
  .logo {
    width: 18.75rem;
  }
}

/* Callout (grey box) */

.callout {
  width: 100% !important;
  background-color: #f1f1ef !important;
  border-radius: 5px !important;
  padding: 1em 1em 1em 1em;
  color: black;
  margin-bottom: 2rem;
}

.callout p {
  margin-top: auto;
  margin-bottom: auto;
}

/* Link button / custom button */

.button-container {
  display: flex;
  justify-content: center;
}

.button-container a,
.button-container button {
  position: relative;
  border: none;
  cursor: pointer;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  font-size: inherit;
  letter-spacing: 0.015em;
  overflow: hidden;
  transition: background-color 0.2s ease-in-out 0s;
  vertical-align: middle;
  white-space: nowrap;
  padding: 0 1.5em;
  background: var(--button-background);
  color: #1d252c;
  height: var(--button-height);
  line-height: var(--button-height);
  min-width: var(--button-min-width);
  text-decoration: none;
}

.button-container a::after,
.button-container button::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  border-bottom: 1.5rem solid var(--button-notch-color);
  border-left: 1.5rem solid transparent;
  transition: transform 0.2s ease-in-out 0s;
}

.button-container a:hover,
.button-container button:hover {
  background-color: #f29616;
  background: #f29616;
}

/* Email to target contact */

.en__component--column > .en__component--contactblock {
  background-color: transparent;
  margin-bottom: 4.5rem;
  padding: 0;
}

.en__contact__detail {
  padding-top: 0 !important;
}

.en__contactSubject__field {
  border-width: 1px;
}

/* Email to target modals */

/* Hide modal text - we'll automatically move it into the contact block using JS */
form:has(.modal-open) .modal-text {
  display: none;
}

/* Hide contact block initially */
form:has(.modal-open) .en__component--contactblock {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

form:has(.modal-open) .en__component--contactblock.modal-show {
  align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(5px);
  clip: auto;
  clip-path: none;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  left: 0px;
  max-width: 100%;
  position: fixed;
  top: 0px;
  width: 100%;
  z-index: 999;
}

form:has(.modal-open) .en__component--contactblock.modal-show > * {
  background-color: white;
  margin: 0 auto;
  max-width: min(100%, 768px);
  padding: 1.5rem;
  width: 100%;
}

form:has(.modal-open) .en__component--contactblock.modal-show > *:first-child {
  padding-top: 3rem;
}

form:has(.modal-open) .en__component--contactblock.modal-show > *:last-child {
  padding-bottom: 3rem;
}

@media (min-width: 770px) {
  form:has(.modal-open) .en__component--contactblock.modal-show > * {
    padding: 1.5rem 3rem;
  }
}

.en__component--contactblock h2 {
  line-height: calc(0.9em + 0.75rem);
  letter-spacing: 0.02em;
  margin-bottom: 1rem;
  font-family: 'Noto Serif';
  font-size: 1.5625rem;
  font-style: italic;
  font-weight: 400;
  color: var(--color-neutral-800);
  text-transform: none;
  margin-left: 10px;
}

.modal-open {
  cursor: pointer;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  padding: 0.95em 1.2em 0.92em;
  color: var(--color-theme-accent-dark);
  font-weight: 400;
  font-size: 1rem;
  -webkit-font-smoothing: subpixel-antialiased;
  line-height: 1;
  width: 100%;
  margin: auto;
}

@media (min-width: 1000px) {
  .modal-open {
    width: 70%;
  }
}

.modal-open:hover {
  transform: scale(1.1); /* Slightly increases size */
  background-color: #f6f6f6; /* Lightens background color */
  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
}

.modal-open button {
  background-color: transparent;
  border: none;
  color: var(--hl-colour-dark-red);
  cursor: pointer;
  font-size: 1rem;
  text-decoration: none;
  text-transform: uppercase;
}

.modal-svg {
  fill: var(--hl-colour-dark-red);
  margin-right: 2px;
}

@media (max-width: 760px) {
  .CompModal {
    min-width: 100% !important;
  }
}

#companiesText {
  text-decoration: underline;
}

#companiesText:hover {
  cursor: pointer;
  color: var(--hl-colour-dark-red);
}

.CompModal p {
  margin: 0px !important;
  line-height: 1.5 !important;
}

.en__contactSubject__field,
.en__contactMessage__plainText {
  background: #f9f9f9;
  border-style: solid;
  border-color: #ededed;
  box-shadow: none;
}

/* Steps indicator */

.en__component--row .en__component--column--2 > .steps-listing {
  padding-top: 2rem;
}

.en__component--row .en__component--column--2 .steps-listing ul {
  border-top: solid 2px #e9e9eb;
  margin: 0;
  padding: 0;
  padding-top: 3px;
  list-style: none;
  display: flex;
  flex-wrap: nowrap;
  box-sizing: border-box;
  justify-content: space-between;
}

.en__component--row .en__component--column--2 .steps-listing ul li span {
  font-size: 0.9375rem;
  color: #000;
}

.en__component--row .en__component--column--2 .steps-listing ul li.active span {
  font-size: 0.9375rem;
  font-weight: bold;
  color: #000;
}

.en__component--row
  .en__component--column--2
  .steps-listing
  ul
  li.active::after {
  content: '';
  width: 12px;
  height: 12px;
  background: #3a4147 !important;
  display: block;
  position: absolute;
  left: calc(50% - 6px);
  border-radius: 50%;
  top: -10px;
  z-index: 1;
}

.en__component--row .en__component--column--2 .steps-listing ul li {
  flex-basis: 33%;
  position: relative;
  text-align: center;
}

.en__component--row .en__component--column--2 .steps-listing ul li::before {
  content: '';
  width: 12px;
  height: 12px;
  background: #dddee0;
  display: block;
  position: absolute;
  left: calc(50% - 6px);
  border-radius: 50%;
  top: -10px;
  z-index: 1;
}

.en__component--row .en__component--column--2 .steps-listing ul li::after {
  content: '';
  width: 12px;
  height: 12px;
  background: #dddee0;
  display: block;
  position: absolute;
  left: calc(50% - 6px);
  border-radius: 50%;
  top: -10px;
  z-index: 1;
}

/* Red flash */

.flash-red p {
  display: inline-block;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  background: var(--hl-colour-red);
  color: white;
  line-height: 1;
  margin-bottom: 0;
  white-space: nowrap;
  padding: 0.5em 1em;
  font-size: 1.125rem;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 100%;
}

.flash-red + .en__component--copyblock h1 {
  margin-top: 2rem;
}

/* Widgets e.g. progress bar for petitions */

.enWidget {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.enWidget__fill {
  background-color: var(--color-primary-700) !important;
}

.enWidget__fill__count {
  font-family: 'Open Sans', sans-serif !important;
  font-size: 1.6rem !important;
}

.enWidget__progress {
  border: 1px solid lightgrey !important;
}

/**************

  Helper classes

  **************/

/* Show/hide on different screen sizes */

@media only screen and (max-width: 39.999em) {
  .hl__hide-on-mobile {
    display: none !important;
  }
}

@media only screen and (max-width: 63.999em) {
  .hl__hide-on-mobile-tablet {
    display: none !important;
  }
}

@media only screen and (min-width: 40em) {
  .hl__hide-on-tablet-desktop {
    display: none !important;
  }
}

@media only screen and (min-width: 64em) {
  .hl__hide-on-desktop {
    display: none !important;
  }
}

@media only screen and (min-width: 76em) {
  .hl__hide-on-large-desktop {
    display: none !important;
  }
}

/* Spacing */

.hl__margin--bottom--none {
  margin-bottom: 0 !important;
}

.hl__margin--bottom--small {
  margin-bottom: calc(var(--hl-spacer) / 2) !important;
}

.hl__margin--bottom--medium {
  margin-bottom: var(--hl-spacer) !important;
}

.hl__margin--bottom--large {
  margin-bottom: calc(var(--hl-spacer) * 2) !important;
}

.hl__margin--bottom--extra-large {
  margin-bottom: calc(var(--hl-spacer) * 3) !important;
}

.hl__margin--left--none {
  margin-left: 0 !important;
}

.hl__margin--left--small {
  margin-left: calc(var(--hl-spacer) / 2) !important;
}

.hl__margin--left--medium {
  margin-left: var(--hl-spacer) !important;
}

.hl__margin--left--large {
  margin-left: calc(var(--hl-spacer) * 2) !important;
}

.hl__margin--left--extra-large {
  margin-left: calc(var(--hl-spacer) * 3) !important;
}

.hl__margin--right--none {
  margin-right: 0 !important;
}

.hl__margin--right--small {
  margin-right: calc(var(--hl-spacer) / 2) !important;
}

.hl__margin--right--medium {
  margin-right: var(--hl-spacer) !important;
}

.hl__margin--right--large {
  margin-right: calc(var(--hl-spacer) * 2) !important;
}

.hl__margin--right--extra-large {
  margin-right: calc(var(--hl-spacer) * 3) !important;
}

.hl__margin--top--none {
  margin-top: 0 !important;
}

.hl__margin--top--small {
  margin-top: calc(var(--hl-spacer) / 2) !important;
}

.hl__margin--top--medium {
  margin-top: var(--hl-spacer) !important;
}

.hl__margin--top--large {
  margin-top: calc(var(--hl-spacer) * 2) !important;
}

.hl__margin--top--extra-large {
  margin-top: calc(var(--hl-spacer) * 3) !important;
}

.hl__padding--bottom--none {
  padding-bottom: 0 !important;
}

.hl__padding--bottom--small {
  padding-bottom: calc(var(--hl-spacer) / 2) !important;
}

.hl__padding--bottom--medium {
  padding-bottom: var(--hl-spacer) !important;
}

.hl__padding--bottom--large {
  padding-bottom: calc(var(--hl-spacer) * 2) !important;
}

.hl__padding--bottom--extra-large {
  padding-bottom: calc(var(--hl-spacer) * 3) !important;
}

.hl__padding--left--none {
  padding-left: 0 !important;
}

.hl__padding--left--small {
  padding-left: calc(var(--hl-spacer) / 2) !important;
}

.hl__padding--left--medium {
  padding-left: var(--hl-spacer) !important;
}

.hl__padding--left--large {
  padding-left: calc(var(--hl-spacer) * 2) !important;
}

.hl__padding--left--extra-large {
  padding-left: calc(var(--hl-spacer) * 3) !important;
}

.hl__padding--right--none {
  padding-right: 0 !important;
}

.hl__padding--right--small {
  padding-right: calc(var(--hl-spacer) / 2) !important;
}

.hl__padding--right--medium {
  padding-right: var(--hl-spacer) !important;
}

.hl__padding--right--large {
  padding-right: calc(var(--hl-spacer) * 2) !important;
}

.hl__padding--right--extra-large {
  padding-right: calc(var(--hl-spacer) * 3) !important;
}

.hl__padding--top--none {
  padding-top: 0 !important;
}

.hl__padding--top--small {
  padding-top: calc(var(--hl-spacer) / 2) !important;
}

.hl__padding--top--medium {
  padding-top: var(--hl-spacer) !important;
}

.hl__padding--top--large {
  padding-top: calc(var(--hl-spacer) * 2) !important;
}

.hl__padding--top--extra-large {
  padding-top: calc(var(--hl-spacer) * 3) !important;
}

/* Colours */

.hl__background--red {
  background-color: var(--color-primary-500) !important;
}

.hl__background--dark-red {
  background-color: var(--color-primary-700) !important;
}

.hl__background--white {
  background-color: white !important;
}

.hl__background--yellow {
  background-color: var(--color-secondary-500) !important;
}

.hl__text--red {
  color: var(--color-primary-500) !important;
}

.hl__text--dark-red {
  color: var(--color-primary-700) !important;
}

.hl__text--white {
  color: white !important;
}

.hl__text--yellow {
  color: var(--color-secondary-500) !important;
}

button.hl__button--red,
.hl__button--red button,
a.hl__button--red,
a.hl__button--red:link,
a.hl__button--red:visited,
.button-container.hl__button--red a,
.button-container.hl__button--red a:link,
.button-container.hl__button--red a:visited {
  background-color: var(--color-primary-500) !important;
  color: white !important;
}

button.hl__button--red::after,
.hl__button--red button::after,
a.hl__button--red::after,
.button-container.hl__button--red a::after {
  border-bottom-color: var(--color-primary-700) !important;
}

button.hl__button--red:hover,
button.hl__button--red:active,
button.hl__button--red:focus,
.hl__button--red button:hover,
.hl__button--red button:active,
.hl__button--red button:focus,
a.hl__button--red:hover,
a.hl__button--red:active,
a.hl__button--red:focus,
.button-container.hl__button--red a:hover,
.button-container.hl__button--red a:active,
.button-container.hl__button--red a:focus {
  background-color: var(--color-primary-700) !important;
}

button.hl__button--yellow,
.hl__button--yellow button,
a.hl__button--yellow,
a.hl__button--yellow:link,
a.hl__button--yellow:visited,
.button-container.hl__button--yellow a,
.button-container.hl__button--yellow a:link,
.button-container.hl__button--yellow a:visited {
  background-color: var(--color-secondary-500) !important;
  color: var(--color-neutral-800) !important;
}

button.hl__button--yellow::after,
.hl__button--yellow button::after,
a.hl__button--yellow::after,
.button-container.hl__button--yellow a::after {
  border-bottom-color: var(--color-secondary-700) !important;
}

button.hl__button--yellow:hover,
button.hl__button--yellow:active,
button.hl__button--yellow:focus,
.hl__button--yellow button:hover,
.hl__button--yellow button:active,
.hl__button--yellow button:focus,
a.hl__button--yellow:hover,
a.hl__button--yellow:active,
a.hl__button--yellow:focus,
.button-container.hl__button--yellow a:hover,
.button-container.hl__button--yellow a:active,
.button-container.hl__button--yellow a:focus {
  background-color: var(--color-secondary-700) !important;
}

/* Screenreaders */

.hl__screenreader-only {
  clip: rect(1px, 1px, 1px, 1px) !important;
  height: 1px !important;
  overflow: hidden !important;
  position: absolute !important;
  width: 1px !important;
}
