:root {
	--booking-base-color: #005AAB;
	--booking-text-color: #757575;
	--booking-error-color: #D21E00;
	--booking-success-text-color: #039902;
	--booking-border-color: #F7F7F7;
	--booking-background-color-secondary: #E8E8E8;
	--booking-description-text-color: #44444480;
	--booking-secondary-border-color: #DDDDDD;
	--booking-button-text-color: #ffffff;
	--booking-progressbar-bg-color: #F1F8FF;
	--booking-button-hover-color: #171717;
	--booking-font--family--eyebrow: family('eyebrow');
	--booking-font--family--heading: family('heading');
	--booking-font--family--base: family('base');
	--booking-size--xsmall: 14px;
	--booking-size--small: 16px;
	--booking-size--medium: 24px;
	--booking-size--large: clamp(1.5rem, 1.2539rem + 0.829vw, 2rem); // 24px to 32px
	--booking-size--xlarge: clamp(2rem, 1.6479rem + 1.5023vw, 3rem); // 32px to 48px
	--booking-size--xxlarge: clamp(3rem, 2.1197rem + 3.7559vw, 5.5rem); //48 to 88px
	--booking-font-size-h3: clamp(1.25rem, 1.0299rem + 0.939vw, 1.875rem);
}

#book-an-appointment-application {
	max-width: 100%;

	.book-an-appointment-block {
		padding: var(--booking-size--medium);
		background-color: var(--booking-border-color);
		margin: var(--booking-size--medium) 0 var(--booking-size--xlarge) 0;
	}

	.book-an-appointment-block-wrapper {
		padding: var(--booking-size--xlarge);
		border-radius: 5px;
		background-color: var(--booking-button-text-color);
	}

	.book-an-appointment-block-wrapper {
		h3 {
			color: var(--booking-base-color);
			font-weight: 600;
			font-size: var(--booking-font-size-h3);
			font-family: var(--booking-font--family--heading);
			line-height: calc(50/30);
			margin: 0  0 var(--booking-size--small) 0;
		}
	}

	p {
		font-size: var(--booking-size--small);
		color: var(--booking-text-color);
		font-family: var(--booking-font--family--base);
		line-height: calc(20/16);
		letter-spacing: 0;
	}
}
