#formProcessingPortlet .clickable {
	cursor: pointer;
}

#formProcessingPortlet button.clickable {
	background: none !important;
	border: none;
	padding: 0 !important;
	color: var(--secondary, #0b6263);
}

#formProcessingPortlet .priceGroup .input-group-addon {
	background-color: transparent;
	font-size: 15px;
	line-height: 20px;
	font-weight: 800;
	padding: 4px 6px 1px 8px;
}

#formProcessingPortlet [id^="_FormProcessing_INSTANCE_"] {
	background-image: none !important;
}

#formProcessingPortlet .has-success,
#formProcessingPortlet .has-error {
	position: relative;
}

/* #formProcessingPortlet .has-success:after, */
#formProcessingPortlet .has-error [role="alert"]:before {
    font-family: 'Font Awesome 6 Sharp';
    font-weight: 900;
    font-size: 1.125rem;
	margin-right: var(--spacer-2, 0.563rem);
}

/* #formProcessingPortlet .has-success:after {
	content: '\f058';
	color: var(--success, #29612d);
} */

#formProcessingPortlet .has-error:not(.no-icon) [role="alert"]:before {
	content: '\f071';
	color: #D70101;
}

#formProcessingPortlet .has-success.input-checkbox-wrapper:after,
#formProcessingPortlet .has-error.input-checkbox-wrapper:after {
	top: -2px;
}

#formProcessingPortlet .input-text-wrapper.has-error .charCounter {
	display: none;
}

#formProcessingPortlet .singleLineInputSet {
	position: relative;
}

#formProcessingPortlet .singleLineInputSection {
    display: flex;
    gap: 9px;
}

#formProcessingPortlet .singleLineInputSection.excludeLabel:after {
	top: 30px;
}

#formProcessingPortlet .singleLineInputSection * {
	display: inline-block;
}

#formProcessingPortlet .singleLineInputSection .form-group {
	margin-bottom: 0;
	border: 0;
	width: 100%;
}

#formProcessingPortlet .itemTrans .singleLineInputSection > * {
	margin-right: 10px;
}

#formProcessingPortlet .singleLineInputSection .has-success,
#formProcessingPortlet .singleLineInputSection .has-error,
#formProcessingPortlet .singleLineInputSection .form-validator-stack {
	position: static;
	padding: 0;
}

#formProcessingPortlet .singleLineInputSection .form-validator-stack div[role='alert'] {
	left: 0;
	top: 30px;
}

#formProcessingPortlet .form-control.quantityInput {
	width: 32px;
	padding: 0;
	margin: 0;
	height: 24px;
	text-align: center;
	border-radius: 1px;
	background: var(--light, #ffffff);
	margin-top: -3px;
}

#formProcessingPortlet .accHolder input {
    width: 427px;
}

#formProcessingPortlet .sortCode {
	position: relative;
	margin-bottom: 34px;
}

#formProcessingPortlet .sortCode .form-group input[type="text"],
#formProcessingPortlet .sortCode .form-group input[type="number"] {
	padding: var(--spacer-2) var(--spacer-3);
}

#formProcessingPortlet .sortCode .form-group.has-success:after {
	content: '';
}

#formProcessingPortlet #amountModal {
	z-index: 10000;
}

#formProcessingPortlet #amountModal .modal-dialog {
	max-height: 100%;
}

#formProcessingPortlet #amountModal .modal-dialog .modal-content {
	padding: 0 10px;
}

#formProcessingPortlet #amountModal .modal-dialog .modal-content .modal-header {
	justify-content: center;
}

#formProcessingPortlet #amountModal .modal-dialog .modal-content .modal-body {
	padding-bottom: 0;
	overflow: hidden;
}

#formProcessingPortlet #amountModal #amountForm .display-error-section div[role='alert'] {
	top: -34px;
}

#formProcessingPortlet #amountModal #amountForm .has-success:after,
#formProcessingPortlet #amountModal #amountForm .has-error:after {
	bottom: 40px;
}

#formProcessingPortlet .postcodeLookup .form-group.has-error .form-control,
#formProcessingPortlet .postcodeLookup .form-group.has-success .form-control {
	padding-right: 0;
}

#formProcessingPortlet .postcodeLookup .form-group.has-error:after,
#formProcessingPortlet .postcodeLookup .form-group.has-success:after {
	display: none;
}

/* #formProcessingPortlet .postcodeLookup .form-group.has-error .help-block {
    position: absolute;
    margin-top: 52px;
} */

#formProcessingPortlet .input-group-addon,
#formProcessingPortlet .form-control {
	border: none;
	box-shadow: none;
	box-sizing: border-box;
	color: inherit;
	background-color: transparent;
}

#formProcessingPortlet .form-control {
	background: var(--sheep-white);
    border: 2px solid var(--dark-5, #CACBCD);
	height: 50px;
	width: 100%;
	min-width: auto;
	max-width: 100%;
}

@-webkit-keyframes autofill {
	to {
		background: transparent;
	}
}

input:-webkit-autofill {
	-webkit-animation-name: autofill;
	-webkit-animation-fill-mode: both;
}

/* #formProcessingPortlet .form-group {
	width: fit-content;
} */

#formProcessingPortlet .form-group .input-group-addon + .form-control + .form-validator-stack {
	display: table-caption;
	caption-side: bottom;
}

#formProcessingPortlet .form-group.form-inline.input-checkbox-wrapper label {
	display: block;
}

#formProcessingPortlet .field-wrapper {
	border-bottom: 1px solid var(--dark, #1f252c);
}

#formProcessingPortlet .hideDeliniator .form-group,
#formProcessingPortlte .hideDeliniator .field-wrapper {
	border: 0;
}

#formProcessingPortlet .selectHolder {
	position: relative;
}

#formProcessingPortlet .selectHolder select {
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	appearance: none;
	appearance: none;
	line-height: 20px;
}

#formProcessingPortlet .selectHolder select::-ms-expand {
	display: none;
}

#formProcessingPortlet .selectHolder span {
	position: absolute;
	bottom: 7px;
	right: 7px;
	font-size: 15px;
	pointer-events: none;
	color: var(--secondary, #0b6263);
}

#formProcessingPortlet .selectHolder .has-success + span,
#formProcessingPortlet .selectHolder .has-error + span {
	right: 31px;
}

#formProcessingPortlet input.standardInput {
	border: 1px solid #ccc;
	border-radius: 4px;
}

#formProcessingPortlet input.sortCodeInput {
	text-align: center;
	min-width: auto;
	padding: 0;
}

#formProcessingPortlet input.customdate {
	max-width: 120px;
	text-align: center;
}

#formProcessingPortlet .productChoice {
	background-color: var(--light, #ffffff);
	width: auto;
	display: inline-block;
	padding: 1rem;
	border: 2px solid var(--dark, #1f252c);
	border-radius: 9px;
	margin-bottom: 1rem;
}

#formProcessingPortlet #dontUse .productChoice.checkedChoice {
	background-color: #ccfff5;
}

#formProcessingPortlet .productChoice .strongRadioLabel {
	cursor: pointer;
}

#formProcessingPortlet #dontUse .productChoice .bigRadio + label {
	cursor: pointer;
	padding-left: 35px;
}

#formProcessingPortlet #dontUse .productChoice .bigRadio + label:after {
	position: absolute;
	content: '';
	height: 20px;
	width: 20px;
	left: 0px;
	top: 0px;
	border: solid 1px var(--dark, #1f252c);
	border-radius: 45px;
	background-color: var(--light, #ffffff);
}

#formProcessingPortlet #dontUse .productChoice .bigRadio:checked + label:before {
	content: '';
	background-color: var(--secondary, #0b6263);
	width: 10px;
	height: 10px;
	left: 5px;
	top: 5px;
	position: absolute;
	z-index: 1;
	border-radius: 45px;
}

#formProcessingPortlet .productChoice p {
	padding-left: 35px;
}

form input[type='number'],
form input[type='tel'] {
	-webkit-appearance: none;
	-moz-appearance: textfield;
}

form input[type='number']::-webkit-inner-spin-button,
form input[type='number']::-webkit-outer-spin-button,
form input[type='tel']::-webkit-inner-spin-button,
form input[type='tel']::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

#formProcessingPortlet form .uploadedFile img {
	border: 3px solid var(--light, #ffffff);
	box-shadow: 0px 0px 2px 3px var(--dark, #1f252c);
}

#formProcessingPortlet span.reference-mark.text-warning {
	display: none;
}

#formProcessingPortlet input[type='checkbox'] {
	display: none;
}

#formProcessingPortlet input[type='checkbox'] + .standardCheckbox {
    width: 27px;
    height: 27px;
    float: left;
    margin-right: var(--spacer-2, 0.563rem);
    border: 2px solid var(--dark-10, #CACBCD);
    background: var(--sheep-white, #FFFAF5);
}

#formProcessingPortlet input[type='checkbox'].cbChecked + .standardCheckbox {
    border: 2px solid var(--rspca-blue, #2622F7);
}

#formProcessingPortlet input[type='checkbox'].cbChecked + .standardCheckbox::after {
	font-family: 'Font Awesome 6 Sharp';
    content: "\f00c";
    font-weight: 900;
	font-size: 13.5px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--rabbit-white, #FFF2E2);
    width: 100%;
    height: 100%;
    background: var(--rspca-blue, #2622F7);
}

#formProcessingPortlet input[type='checkbox'] ~ .anlstandardCheckbox {
	width: 20px;
	height: 20px;
	position: absolute;
	margin-left: 5px;
	margin-right: 5px;
	background: url(https://www.rspca.org.uk/o/cpmFormProcessing/images/check_radio_sheet.png) 0px -5px no-repeat;
}
#formProcessingPortlet input[type='checkbox'].cbChecked ~ .anlstandardCheckbox {
	background: url(https://www.rspca.org.uk/o/cpmFormProcessing/images/check_radio_sheet.png) -20px -5px no-repeat;
}

#formProcessingPortlet .addressManualButton .button-holder,
#formProcessingPortlet .payment .button-holder {
	margin-bottom: 20px;
}

#formProcessingPortlet .payment .button-holder {
	text-align: left;
}

#formProcessingPortlet .portletBody .leftSection {
	padding: 1rem;
}

#formProcessingPortlet .portletBody .payment .button-holder button.fullWidthButton {
	max-width: 750px;
	padding: 11px 30px 11px 30px;
	font-size: 19px;
}

#formProcessingPortlet .payment #paypal-button {
	position: relative;
	max-width: 750px;
	margin: auto;
}

#formProcessingPortlet .payment #paypal-button:after {
	content: '';
	width: 100%;
	height: 100%;
	border: none;
	border-radius: 4px;
	position: absolute;
	top: 0;
	z-index: 1000;
	pointer-events: none;
}

#formProcessingPortlet .button-holder button + button {
	margin-left: 0;
	margin-top: 5px;
}

#formProcessingPortlet .fieldset button {
	margin-bottom: 15px;
}

#formProcessingPortlet .backgroundImage {
	position: absolute;
	width: 100%;
	z-index: -1;
}

#formProcessingPortlet .backgroundImage img {
	width: 100%;
}

#formProcessingPortlet img.inline-image {
	margin-right: 20px;
}

#formProcessingPortlet .b-loginEditSection {
	background-color: var(--sheep-white);
    padding: var(--spacer-4, 1.125rem);
}
#formProcessingPortlet .loginEditSection a {
	color: var(--light, #ffffff);
}

#formProcessingPortlet .passiveActionButton.cardButton {
	background: var(--primary, #003473);
	border-color: var(--primary, #003473);
	color: var(--light, #ffffff);
}

#formProcessingPortlet .passiveActionButton.passiveSearchButton {
	border: none;
	padding: 2px 2px;
	font-size: 17px;
	margin-bottom: 34px;
	margin-top: 0px;
	background-color: transparent;
}

#formProcessingPortlet .portletBody .headerSection {
	position: relative;
	margin-bottom: 1rem;
	gap: 20px;
}

#formProcessingPortlet .portletBody .headerSection .progress-image,
#formProcessingPortlet .portletBody .headerSection .progress,
#formProcessingPortlet .portletBody .headerSection .progress-text {
	max-width: 100%;
	width: 100%;
	margin: auto;
}

#formProcessingPortlet .portletBody .headerSection .progress-image {
	padding-bottom: 2px;
	text-align: right;
}

#formProcessingPortlet .portletBody .headerSection .progress-image img {
	position: relative;
}

#formProcessingPortlet .portletBody .headerSection .progress {
	height: 15px;
	margin-bottom: 0;
}

#formProcessingPortlet .portletBody .headerSection .progress .progress-bar {
	background-color: var(--secondary, #0b6263);
}

#formProcessingPortlet .progress-bar-container {
	display: flex;
	gap: var(--spacer-1, 0.281rem);
	margin-bottom: var(--spacer-6, 2.25rem);
}

.progress-bar-item {
    height: 10px;
    background: #ED533440;
    width: 100%;
}

#formProcessingPortlet .progress-bar-item.active {
    background: var(--fox-red, #ED5334);
}

#formProcessingPortlet .portletBody .headerSection .button-holder {
	margin: 0;
}

#formProcessingPortlet .portletBody .headerSection .button-holder a.passiveActionButton {
	display: none;
	width: fit-content;
}

#formProcessingPortlet .portletBody .headerSection .button-holder a.passiveActionButton.mobile {
	display: block;
	font-size: 15px;
	height: 20px;
	margin-top: -17px;
	padding: 1px 8px;
	line-height: 12px;
	margin-right: 6px;
}

#formProcessingPortlet .portletBody .mainSection .addressSection .addressSelectList,
#formProcessingPortlet .portletBody .mainSection .addressSection .addressManualSection {
	display: none;
}

#formProcessingPortlet .portletBody .mainSection .addressSection .field-wrapper {
	border: 0;
}

/* body
	#wrapper
	#formProcessingPortlet
	.portletBody
	.mainSection
	.addressSection
	.field-wrapper
	.input-text-wrapper {
	display: inline-block;
} */

#formProcessingPortlet .portletBody .mainSection .addressManualSection .button-holder {
	margin-top: 0;
}

#formProcessingPortlet .portletBody .mainSection .addressForm .addressBackButton {
	position: absolute;
	right: 21px;
	font-size: 15px;
	height: 20px;
	margin-top: -32px;
	padding: 1px 8px;
	line-height: 11px;
	display: none;
}

#formProcessingPortlet .portletBody .mainSection .detailsSection {
	display: block;
	position: relative;
}

body
	#wrapper
	#formProcessingPortlet
	.portletBody
	.mainSection
	.detailsSection
	.loginEditSection
	.passiveActionButton,
body
	#wrapper
	#formProcessingPortlet
	.portletBody
	.mainSection
	.addressSection.loginEditSection
	.passiveActionButton {
	margin-bottom: 1rem;
}

#formProcessingPortlet .portletBody .mainSection .addressSection {
	position: relative;
	display: none;
}

#formProcessingPortlet .portletBody .mainSection .addressSection1 .addressSection {
	display: block !important;
}

#formProcessingPortlet .portletBody .mainSection .userAddressList .addressSelectList {
	max-height: 160px;
	overflow-y: scroll;
	margin: 0;
	margin-bottom: 20px;
}

#formProcessingPortlet .portletBody .mainSection .userAddressList .addressSelectList li {
	padding: 3px 20px;
	font-size: 14px;
}

#formPorcessingPortlet .portletBody .mainSection .userAddressList .addressSelectList li:hover {
	background-color: var(--dark-10, #e0e1e1);
}

#formProcessingPortlet .portletBody .mainSection .button-holder {
	width: 100%;
	display: block;
	overflow: hidden;
	margin-top: 20px;
}

#formProcessingPortlet .portletBody .mainSection .button-holder button.fullWidthButton {
	width: 100%;
}

#formProcessingPortlet .portletBody .mainSection select:invalid option {
	color: var(--dark, #1f252c);
}

#formProcessingPortlet .portletBody .rightSection {
	display: none;
}

#formProcessingPortlet .portletBody .mainSection .giftAidHeader .form-group {
	margin-bottom: 15px;
}

#formProcessingPortlet .portletBody .mainSection .giftAidSection button {
	display: inline-block;
}

#formProcessingPortlet .portletBody .payWithCardSection {
	text-align: center;
}

#formProcessingPortlet .portletBody .payWithCardSection .acceptedCards img {
	width: 65px;
	display: inline-block;
	margin-right: 5px;
}

#formProcessingPortlet .portletBody #amountModal button {
	display: inline-block;
}

#formProcessingPortlet .portletBody #amountModal button:not(:last-child) {
	margin: 0;
}

#formProcessingPortlet .portletBody .cardHolder .cvvInfo {
	font-size: 22px;
	margin-left: 15px;
	position: absolute;
	margin-top: -2px;
	color: var(--secondary, #0b6263);
}

#formProcessingPortlet .portletBody .cardHolder .cvvInfo .cvvInfoPopup {
	display: none;
	position: absolute;
	width: 200px;
	color: var(--dark, #1f252c);
	bottom: 42px;
	margin-left: -89px;
	background-color: var(--light, #ffffff);
	border: 2px solid var(--secondary, #0b6263);
	border-radius: 9px;
	padding: 5px;
}

#formProcessingPortlet .portletBody .cardHolder .cvvInfo .cvvInfoPopup:before {
	content: '';
	position: absolute;
	width: 20px;
	height: 20px;
	border-bottom: var(--secondary, #0b6263) 2px solid;
	border-right: var(--secondary, #0b6263) 2px solid;
	bottom: -11px;
	left: 90px;
	transform: rotate(45deg);
	z-index: 1;
	background-color: var(--light, #ffffff);
	border-top-left-radius: 33px;
}

#formProcessingPortlet .portletBody .cardHolder #cvvWrapper {
	position: relative;
}

#formProcessingPortlet .portletBody .cardHolder #cvvWrapper #cvv {
	padding-left: 50px;
}

/* #formProcessingPortlet .portletBody .cardHolder #cvvWrapper img {
	position: absolute;
	bottom: 7px;
} */

#formProcessingPortlet .portletBody .mobile {
	display: block;
}

#formProcessingPortlet .portletBody .giftAidSection button.themeActionButton {
	padding: 7px 13px 11px 13px;
}

.loading-image {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(https://www.rspca.org.uk/o/cpmFormProcessing/images/loading_page.gif) center no-repeat var(--light, #ffffff);
}

#formProcessingPortlet .form-validator-stack div[role='alert'],
#formProcessingPortlet .portletBody .hasError,
#formProcessingPortlet .portletBody .required,
.hasError {
	position: relative;
    color: #D70101;
    z-index: 2;
    font-size: var(--font-size-base, 1rem);
	font-weight: bold;
}

#formProcessingPortlet .portletBody .dateError {
	color: #D70101;
}

#formProcessingPortlet .portletBody .smallInput {
	width: 300px;
	max-width: 100%;
	padding: 0.25rem;
}

#formProcessingPortlet .portletBody noPad {
	padding: 0;
}

#formProcessingPortlet .portletBody .ddBox .required {
	position: relative;
}

/* #formProcessingPortlet .portletBody .hasError {
	margin-right: -200px;
} */

#formProcessingPortlet textarea.form-control {
	height: auto;
	width: 100%;
}

#formProcessingPortlet textarea.charCountTextArea + .form-validator-stack div[role='alert'] {
	top: 20px;
}

/* #formProcessingPortlet .portletBody .input-group-item [role='alert'] {
	margin-left: -38px;
	width: max-content;
} */

#formProcessingPortlet .portletBody .serverSideError {
	color: #D70101;
}

#formProcessingPortlet .errorContainer {
	margin-top: 12px;
}

#formPorcessingPortlet .portletBody .cardHolder {
	position: relative;
}

#formProcessingPortlet .portletBody .cardHolder > .hasError {
	bottom: -20px;
}

#formProcessingPortlet .portletBody .display-error-section div[role='alert'] {
	bottom: 14px;
}

#formProcessingPortlet .portletBody .addressLookupRequired .required {
	position: relative;
}

.ui-dialog .ui-dialog-titlebar.ui-widget-header {
	display: none;
}

.apple-pay-button {
	position: relative;
	display: inline-block;
	height: 55px;
	width: 100%;
	margin-top: 20px;
	margin-bottom: -5px;
	-webkit-appearance: -apple-pay-button;
}

.apple-pay-button-black {
	-apple-pay-button-style: var(--dark, #1f252c);
}

.apple-pay-button-white {
	-apple-pay-button-style: var(--light, #ffffff);
}

.apple-pay-button-white-with-line {
	-apple-pay-button-style: white-outline;
}

.apple-pay-button:after {
	content: '';
	width: 100%;
	height: 100%;
	border: 2px solid var(--secondary, #0b6263);
	border-radius: 4px;
	position: absolute;
	pointer-events: none;
}

#formProcessingPortlet .panel-body {
	padding: 0;
}

#formProcessingPortlet .smokey {
	background-color: var(--dark-10, #e0e1e1);
}

#formProcessingPortlet .green {
	background-color: #f4fbf4;
	border-color: var(--success, #29612d);
}

#formProcessingPortlet .blue {
	background-color: #f0f5fa;
	border-color: var(--primary, #003473);
}

#formProcessingPortlet input[type='date'].green {
	color: var(--success, #29612d);
}

#formProcessingPortlet input[type='date'].blue {
	color: var(--primary, #003473);
}

#formProcessingPortlet input[type='radio'].bigRadio.blue + label::before {
	color: var(--primary, #003473);
}

#formProcessingPortlet input[type='radio'].bigRadio.green + label::before {
	color: var(--success, #29612d);
}

#formProcessingPortlet .termsandconditions .form-inline label {
	display: block;
}

#formProcessingPortlet .form .ddBox .form-inline label {
	display: block;
	font-weight: normal;
}

#formProcessingPortlet input[type='date']#packDate {
	margin-bottom: 1rem;
}

#formProcessingPortlet .border-bottom-fox-red {
	border-bottom: 2px solid var(--fox-red, #ED5334);
	padding-bottom: var(--spacer-2, 0.563rem);
}

#formProcessingPortlet label.control-label {
	margin-bottom: var(--spacer-1, 0.281rem);
}

@keyframes bouncing-loader {
	to {
		opacity: 0.1;
		transform: translate3d(0, -1rem, 0);
	}
}

.bouncing-loader {
	display: flex;
	justify-content: center;
}

.bouncing-loader > div {
	width: 1rem;
	height: 1rem;
	margin: 3rem 0.2rem;
	background: var(--secondary, #0b6263);
	border-radius: 50%;
	animation: bouncing-loader 0.6s infinite alternate;
}

.bouncing-loader > div:nth-child(2) {
	animation-delay: 0.2s;
}

.bouncing-loader > div:nth-child(3) {
	animation-delay: 0.4s;
}

#formProcessingPortlet .userAddressSearch .postcodeLookup .form-group.d-flex {
	flex-flow: wrap;
    gap: 0.5rem;
	margin-bottom: 0;
}

#formProcessingPortlet .userAddressSearch .postcodeLookup input, 
#formProcessingPortlet .userAddressSearch .postcodeLookup button {
    display: inline-block;
}

@media all and (max-width: 576px) {
	#formProcessingPortlet .userAddressSearch .postcodeLookup input, 
	#formProcessingPortlet .userAddressSearch .postcodeLookup button {
		width: 100%;
	}

	#formProcessingPortlet .addressManualButton,
	#formProcessingPortlet .manualAddressButton {
		width: 100%;
	}

}

@media all and (max-width: 767px) {
	#formProcessingPortlet .portletBody .mainSection .giftAidSection button {
		width: 45%;
	}

	#formProcessingPortlet .portletBody .mainSection .giftAidSection button:first-child {
		float: left;
	}

	#formProcessingPortlet .portletBody .mainSection .giftAidSection button:last-child {
		float: right;
		margin-top: 0;
	}

	#formProcessingPortlet .address-manual-button {
		display: none;
	}

	#formProcessingPortlet .productChoice {
		width: 100%;
	}
}

@media all and (max-width: 1006px) and (min-width: 768px) {
	.ios #wrapper #formProcessingPortlet input:not([type='submit']) {
		max-width: unset !important;
	}
}

@media all and (max-width: 767px) {
	#formProcessingPortlet .portletBody .headerSection .button-holder .passiveActionButton {
		display: none;
		width: fit-content;
	}
	#formProcessingPortlet .portletBody .headerSection .button-holder .passiveActionButton.mobile {
		display: inline-block;
		bottom: 0;
		padding: 0.5rem 1rem;
	}
	#formProcessingPortlet .panel-body {
		padding: 0;
	}
}
#formProcessingPortlet .portletBody .other-relation-input .required {
	position: relative;
}

@media all and (min-width: 576px) {
	#formProcessingPortlet .form-control {
		width: auto;
	}

	#formProcessingPortlet .singleLineInputSection {
		flex-flow: wrap;
	}
	#formProcessingPortlet .singleLineInputSection .form-group {
		width: unset;
	}
	#formProcessingPortlet .sortCode .form-group input[type="text"],
	#formProcessingPortlet .sortCode .form-group input[type="number"] {
		padding: var(--spacer-2) var(--spacer-4);
		width: 100px;
	}
}

@media all and (min-width: 768px) {
	#formProcessingPortlet .portletBody .headerSection {
		position: relative;
		gap: 100px;
	}

	#formProcessingPortlet .portletBody .headerSection .progress-image,
	#formProcessingPortlet .portletBody .headerSection .progress,
	#formProcessingPortlet .portletBody .headerSection .progress-text {
		margin: auto;
		width: 50%;
	}

	#formProcessingPortlet .portletBody .headerSection .button-holder {
		position: absolute;
		top: 13px;
		left: 0;
	}

	#formProcessingPortlet .portletBody .headerSection .button-holder a.passiveActionButton {
		display: block;
	}

	#formProcessingPortlet .portletBody .headerSection .button-holder a.passiveActionButton.mobile {
		display: none !important;
	}

	#formProcessingPortlet .portletBody .mobile {
		display: none;
	}

	#formProcessingPortlet .portletBody .mainSection .button-holder button {
		width: auto;
	}

	#formProcessingPortlet .portletBody .mainSection .button-holder button + button {
		margin-left: 5px;
		margin-top: 0;
	}

	#formProcessingPortlet .portletBody .mainSection .detailsSection {
		display: block !important;
	}

	#formProcessingPortlet .portletBody .mainSection .addressSection {
		display: block !important;
	}

	#formProcessingPortlet .portletBody .mainSection .addressSection.loginEditSection {
		display: none !important;
	}

	#formProcessingPortlet .portletBody .mainSection .addressForm .showAddressSectionButton {
		display: none !important;
	}

	#formProcessingPortlet .portletBody .mainSection .addressForm .addressBackButton {
		display: none !important;
	}

	#formProcessingPortlet .address-manual-button {
		display: none;
	}

	#formProcessingPortlet .postcodeLookup .form-group {
		flex: 0 0 60%;
	}
}

@media all and (min-width: 1007px) {
	#formProcessingPortlet .portletBody.hasBannerImage {
		display: flex;
	}

	#formProcessingPortlet .portletBody .leftSection,
	#formProcessingPortlet .portletBody .rightSection {
		display: block;
		flex: 0 0 50%;
	}

	#formProcessingPortlet .portletBody .rightSection img {
		max-width: 100%;
	}

	#formProcessingPortlet .productChoice#pickedChoice {
		margin-left: 1rem;
	}
}#formProcessingPortlet .bigText{
	width: 100%;
	text-align: center;
}

#formProcessingPortlet div.choiceHolder{
	text-align: center;
	display: flex;
	gap: 9px;
	display: -webkit-flex;
}

#formProcessingPortlet div.mineOther{
	padding: 1rem;
	border-style: solid;
	border-width: 2px;
	border-color: var(--secondary, #0B6263);
	background: var(--light, #ffffff);
	box-shadow: none;
	border-radius: 9px;
	flex-grow: 1;
	flex-basis: 0;
}

#formProcessingPortlet div#yesNo{
	padding: 0 10px;
	background: var(--light, #ffffff);
	box-shadow: none;
	text-align: center;
}

#formProcessingPortlet div.mineOther img{
	margin-left: auto;
	margin-right: auto;
	display: block;
	padding-bottom: 10px;
}

#formProcessingPortlet div.mineOther.selected{
	background-color: var(--secondary, #0B6263);
}

#formProcessingPortlet div.mineOther.selected a{
	color: var(--light, #ffffff);
}

#formProcessingPortlet .choiceHolder .mineOther:not(.selected) a {
    color: var(--secondary, #0B6263);
}

#formProcessingPortlet label.strongRadioLabel {
	display: inline-block;
	font-weight: bold;
	margin: 5px 4px 5px 8px;
}

#formProcessingPortlet label.strongRadioLabel p {
	font-weight: normal;
}

#formProcessingPortlet input[type=radio].bigRadio {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

#formProcessingPortlet input[type=radio].bigRadio + label:before {
	font-family: "Font Awesome 6 Pro";
	display: inline-block;
	content: "\f096";
	font-weight: 300;
	letter-spacing: 10px;
	font-size: 1.4em;
	color: var(--secondary, #0B6263);
}

#formProcessingPortlet input[type=radio].bigRadio:checked + label:before {
	content: "\f14a";
	font-size: 1.4em;
	color: var(--secondary, #0B6263);
}

#formProcessingPortlet div.singleFrLogo, #formProcessingPortlet div.monthlyFrLogo {
	position: relative;
}

@media all and (max-width: 415px) {

	#formProcessingPortlet div.choiceHolder{
		display: flex;
	}


	#formProcessingPortlet div.mineOther{
		padding: 1rem 0.5rem;
	}

	#formProcessingPortlet div#myMoney{
		margin-left: 0;
		margin-right: 5px;
	}

	#formProcessingPortlet div#otherMoney{
		margin-left: 5px;
		margin-right: 0;
	}
}

@media all and (max-width: 576px) {
	#formProcessingPortlet .button-container {
		display: flex;
		flex-flow: wrap;
		gap: var(--spacer-2, 0.563rem);
	}
	#formProcessingPortlet .button-container button {
		width: 100%;
	}
}

@media all and (max-width: 1007px) {

	#formProcessingPortlet div.singleFrLogo, #formProcessingPortlet div.monthlyFrLogo {
		position: relative;
		float: none;
	}

	#formProcessingPortlet div.singleFrLogo img {
		margin-left: 23%;
	}
	#formProcessingPortlet div.monthlyFrLogo img {
		margin-left: 30%;
	}
}

@media all and (max-width: 768px) {
	#formProcessingPortlet div.singleFrLogo img {
		position: relative;
		margin-left: auto;
	}

	#formProcessingPortlet div.monthlyFrLogo img {
		position: relative;
		margin-left: 5%;
	}

	#formProcessingPortlet #submitButtonHolder {
		float: none;
	}
}

#formProcessingPortlet .donation-button {
	padding: 10px 50px;
	border: 1px solid var(--rspca-blue, #2622F7);
	background-color: var(--rabbit-white, #FFF2E2);
	color: var(--rspca-blue, #2622F7);
	cursor: pointer;
	font-size: 16px;
	transition: background-color 0.3s, color 0.3s;
}

#formProcessingPortlet .donation-button.selected {
	background-color: var(--rspca-blue, #2622F7);
	color: var(--rabbit-white, #FFF2E2);
}

#formProcessingPortlet .donation-button:hover {
	background-color: var(--rspca-blue, #2622F7);
	color: var(--rabbit-white, #FFF2E2);
}

#formProcessingPortlet .donation-message{
	font-weight: bold;
	color: var(--swallow-blue, #260071);
}

#formProcessingPortlet .donation-label {
	position: relative;
	width: 100%;
}

#formProcessingPortlet .donation-label input[type="radio"] {
	display: none;
}

#formProcessingPortlet .donation-label .donation-button {
	padding: 10px 50px;
	border: 1px solid var(--rspca-blue, #2622F7);
	background-color: var(--rabbit-white, #FFF2E2);
	color: var(--rspca-blue, #2622F7);
	cursor: pointer;
	font-size: 16px;
	transition: background-color 0.3s, color 0.3s;
}

#formProcessingPortlet .donation-label input[type="radio"]:checked + .donation-button {
	background-color: var(--rspca-blue, #2622F7) !important;
	color: #fff;
	border-color: var(--rspca-blue, #2622F7);
}
#formProcessingPortlet #donation-description{
	font-weight: bold;
}
#formProcessingPortlet .donation-label .donation-button:hover {
	background-color: #e0e0e0;
}

#formProcessingPortlet .donation-button.checked {
	background-color: var(--rspca-blue, #2622F7);
	color: var(--rabbit-white, #FFF2E2);
}
#formProcessingPortlet input[type="radio"]:checked + .donation-button {
	background-color: var(--rspca-blue, #2622F7);
	color: var(--rabbit-white, #FFF2E2);
}

#formProcessingPortlet label {
	font-weight: bold;
	color: var(--swallow-blue, #260071);
}

/* #formProcessingPortlet input[type="text"], select, textarea {
	width: 100%;
	max-width: 300px;
	padding: 8px;
	border: 1px solid #ccc;
} */
#formProcessingPortlet .button {
	background-color: var(--rspca-blue, #2622F7);
	color: #fff;
	border: none;
	cursor: pointer;
}
#formProcessingPortlet .button:hover {
	background-color: darkblue;
}
#formProcessingPortlet .required {
	color: red;
}
#formProcessingPortlet .additional-info {
	margin-top: 20px;
	font-size: 14px;
	color: #666;
}
#formProcessingPortlet .pet-section {
	margin-bottom: 20px;
}
#formProcessingPortlet .button-container {
	margin-bottom: 20px;
}

#formProcessingPortlet .gift-aid-title {
	font-size: 2rem;
	font-weight: bold;
	margin-bottom: 15px;
}

#formProcessingPortlet .required-fields {
	font-style: italic;
	margin-bottom: 20px;
	color: darkblue;
}

#formProcessingPortlet .gift-aid-box {
    padding: var(--spacer-5, 1.688rem);
    background-color: var(--sheep-white, #FFFAF5);
    position: relative;
}

#formProcessingPortlet .donation-boost-box {
    display: flex;
    gap: var(--spacer-4, 1.125rem);
    flex-wrap: wrap;
}

#formProcessingPortlet .boost-arrow {
    font-size: 35px;
    padding-top: 18px;
	color: var(--fox-red, #ED5334);
}

#formProcessingPortlet .gift-aid-option-container {
    border: 2px solid var(--dark-10, #CACBCD);
    margin-bottom: var(--spacer-3, 0.844rem);
    padding: var(--spacer-4, 1.125rem);
	/* cursor: pointer; */
}

#formProcessingPortlet .payment-method-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
    flex-wrap: wrap;
	gap: 1rem;
}

/* container for radio buttons */
#formProcessingPortlet .gift-aid-option {
	display: flex;
	align-items: center;
}

#formProcessingPortlet .gift-aid-option-container label {
	margin: 0;
}

/* Radio buttons for giftaid and direct debit */
#formProcessingPortlet .gift-aid-option-container input[type="radio"],
#formProcessingPortlet .form-container input[type="radio"] {
    margin-right: var(--spacer-2, 0.563rem);
	min-height: 27px;
	min-width: 27px;
}

#formProcessingPortlet .gift-aid-choices ul.gift-aid-options {
    padding: 0;
    list-style: none;
}

#formProcessingPortlet .direct-debit-table tr {
    /* margin-bottom: var(--spacer-2, 0.563rem); */
    display: block;
}

#formProcessingPortlet .direct-debit-table td {
    max-width: 100%;
}

/* Input field styling if needed
#formProcessingPortlet .gift-aid-option-container input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: 27px;
    height: 27px;
    border: 2px solid var(--dark-10, #CACBCD);
	background-color: var(--sheep-white, #FFFAF5);
    border-radius: 50%;
    outline: none;
    cursor: pointer;
    margin-right: var(--spacer-2, 0.563rem);
}
#formProcessingPortlet .gift-aid-option-container input[type="radio"]:checked {
    background-color: var(--rspca-blue, #2622F7);
    border-color: var(--rspca-blue, #2622F7);
}
#formProcessingPortlet .gift-aid-option-container input[type="radio"]:hover {
    border-color: var(--rspca-blue, #2622F7);
} */

#formProcessingPortlet .button-container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	padding: 10px 0;
}

#formProcessingPortlet .form-container {
	width: 100%;
	border: 2px solid var(--rspca-blue, #2622F7);
	padding: var(--spacer-4, 1.125rem);
}

#formProcessingPortlet .form-header {
	font-size: 18px;
	font-weight: bold;
	color: #00008B;
	margin-bottom: 10px;
}

/* #formProcessingPortlet .form-group {
	margin-bottom: var(--spacer-5, 1.688rem);
} */

#formProcessingPortlet .form-group input[type="text"],
#formProcessingPortlet .form-group input[type="number"]
{
	padding: var(--spacer-2) var(--spacer-6) var(--spacer-2) var(--spacer-4);
}

#formProcessingPortlet .form-group input[type="checkbox"] {
	margin-right: 10px;
}

#formProcessingPortlet .help-text {
	font-size: 18px;
	color: darkblue;
}

#formProcessingPortlet .form-footer {
	margin-top: 20px;
}

#formProcessingPortlet .btn-submit {
	width: 100%;
	padding: 10px;
	background-color: blue;
	color: #fff;
	border: none;
	border-radius: 5px;
	font-size: 16px;
	cursor: pointer;
}
#formProcessingPortlet .display-text{
	color: darkblue;
	font-size: 18px;
	margin-bottom: 10px;
}
#formProcessingPortlet .display-text b {
	display: inline-block;
	text-align: left;
	width: 150px;
}
#formProcessingPortlet .display-text span{
	display: inline-block;
	margin-left: 100px;
}

#formProcessingPortlet .direct-debit-logo {
	float: right;
}

#formProcessingPortlet .confirmButton{
	width: 600px;
}

#formProcessingPortlet .paymentMethod{
	height: 18px;
	width: 18px;
}



.errorContainer {
	margin-top: 12px;
	background-color: #f8d7da; /* Light red background */
	color: #721c24; /* Dark red text */
	border: 1px solid #f5c6cb; /* Border similar to background but darker */
	padding: 15px; /* Padding inside the box */
	border-radius: 5px; /* Rounded corners */
	margin: 15px 0; /* Space above and below the box */
	width: 790px;
	font-size: 20px; /* Adjust font size */
	line-height: 2.5; /* Improve line spacing */
}


@media all and (min-width: 576px) {
	#formProcessingPortlet .direct-debit-table td {
		min-width: 200px;
	}
}

@media all and (min-width: 992px) {
	#formProcessingPortlet .gift-aid-box {
		padding: var(--spacer-6, 2.25rem);
	}
}/* bespoke */
#formProcessingPortlet .inmem__select {
	appearance: none;
	max-width: 350px !important;
}

#formProcessingPortlet .inmem__input {
	max-width: 350px !important;
}

/* utility */
#formProcessingPortlet .inmem__20px {
	font-size: 20px;
}

#formProcessingPortlet .inmem__textarea-border {
	border: 2px solid #cacbcd !important;
}

#formProcessingPortlet span.inmem__line {
	max-width: 650px;
	width: 100%;
	height: 2px;
	background-color: #cacbcd;
	color: #cacbcd;
	display: block;
}

#formProcessingPortlet .inmem__input-width {
	max-width: 350px;
	width: 100%;
}

#formProcessingPortlet .inmem__input-width-650 {
	max-width: 650px;
	width: 100%;
}

#formProcessingPortlet .inmem__border-2px {
	border-width: 2px !important;
}

#formProcessingPortlet .inmem__desktop-title br {
	display: none;
}

#formProcessingPortlet .inmem__consent-form-description br {
	display: none;
}

#formProcessingPortlet .inmem__form-group__m-0 {
	margin-bottom: 0 !important;
}

#formProcessingPortlet .inmem__form-group__m-0 .form-group.input-text-wrapper {
	margin-bottom: 0 !important;
}

#formProcessingPortlet .inmem__top-0 {
	top: 0 !important;
}

#formProcessingPortlet .inmem__right-auto {
	right: auto !important;
}

#formProcessingPortlet .inmem_error-msg-positioning {
	right: -25px;
	top: -48px;
}

#formProcessingPortlet .mb-24px {
	margin-bottom: 24px !important;
}

#formProcessingPortlet .mb-2px {
	margin-bottom: 2px !important;
}

#formProcessingPortlet .square-cover {
	background: #fffaf5;
	width: 15px;
	height: 15px;
	left: 224px;
	top: 18px;
}

@media (min-width: 400px) {
	#formProcessingPortlet .square-cover{
        left: 324px;
    }
}