/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
	line-height: 1.15; /* 1 */
	-webkit-text-size-adjust: 100%; /* 2 */
  }

/* Sections
	 ========================================================================== */

/**
   * Remove the margin in all browsers.
   */

body {
	margin: 0;
  }

/**
   * Render the `main` element consistently in IE.
   */

main {
	display: block;
  }

/**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */

h1 {
	font-size: 2em;
	margin: 0.67em 0;
  }

/* Grouping content
	 ========================================================================== */

/**
   * 1. Add the correct box sizing in Firefox.
   * 2. Show the overflow in Edge and IE.
   */

hr {
	box-sizing: content-box; /* 1 */
	height: 0; /* 1 */
	overflow: visible; /* 2 */
  }

/**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */

pre {
	font-family: monospace, monospace; /* 1 */
	font-size: 1em; /* 2 */
  }

/* Text-level semantics
	 ========================================================================== */

/**
   * Remove the gray background on active links in IE 10.
   */

a {
	background-color: transparent;
  }

/**
   * 1. Remove the bottom border in Chrome 57-
   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   */

abbr[title] {
	border-bottom: none; /* 1 */
	text-decoration: underline; /* 2 */
	-webkit-text-decoration: underline dotted;
	        text-decoration: underline dotted; /* 2 */
  }

/**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */

b,
  strong {
	font-weight: bolder;
  }

/**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */

code,
  kbd,
  samp {
	font-family: monospace, monospace; /* 1 */
	font-size: 1em; /* 2 */
  }

/**
   * Add the correct font size in all browsers.
   */

small {
	font-size: 80%;
  }

/**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */

sub,
  sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
  }

sub {
	bottom: -0.25em;
  }

sup {
	top: -0.5em;
  }

/* Embedded content
	 ========================================================================== */

/**
   * Remove the border on images inside links in IE 10.
   */

img {
	border-style: none;
  }

/* Forms
	 ========================================================================== */

/**
   * 1. Change the font styles in all browsers.
   * 2. Remove the margin in Firefox and Safari.
   */

button,
  input,
  optgroup,
  select,
  textarea {
	font-family: inherit; /* 1 */
	font-size: 100%; /* 1 */
	line-height: 1.15; /* 1 */
	margin: 0; /* 2 */
  }

/**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */

button,
  input { /* 1 */
	overflow: visible;
  }

/**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */

button,
  select { /* 1 */
	text-transform: none;
  }

/**
   * Correct the inability to style clickable types in iOS and Safari.
   */

button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
	-webkit-appearance: button;
  }

/**
   * Remove the inner border and padding in Firefox.
   */

button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
  }

/**
   * Restore the focus styles unset by the previous rule.
   */

button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
  }

/**
   * Correct the padding in Firefox.
   */

fieldset {
	padding: 0.35em 0.75em 0.625em;
  }

/**
   * 1. Correct the text wrapping in Edge and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   * 3. Remove the padding so developers are not caught out when they zero out
   *    `fieldset` elements in all browsers.
   */

legend {
	box-sizing: border-box; /* 1 */
	color: inherit; /* 2 */
	display: table; /* 1 */
	max-width: 100%; /* 1 */
	padding: 0; /* 3 */
	white-space: normal; /* 1 */
  }

/**
   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */

progress {
	vertical-align: baseline;
  }

/**
   * Remove the default vertical scrollbar in IE 10+.
   */

textarea {
	overflow: auto;
  }

/**
   * 1. Add the correct box sizing in IE 10.
   * 2. Remove the padding in IE 10.
   */

[type="checkbox"],
  [type="radio"] {
	box-sizing: border-box; /* 1 */
	padding: 0; /* 2 */
  }

/**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */

[type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
	height: auto;
  }

/**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */

[type="search"] {
	-webkit-appearance: textfield; /* 1 */
	outline-offset: -2px; /* 2 */
  }

/**
   * Remove the inner padding in Chrome and Safari on macOS.
   */

[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
  }

/**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */

::-webkit-file-upload-button {
	-webkit-appearance: button; /* 1 */
	font: inherit; /* 2 */
  }

/* Interactive
	 ========================================================================== */

/*
   * Add the correct display in Edge, IE 10+, and Firefox.
   */

details {
	display: block;
  }

/*
   * Add the correct display in all browsers.
   */

summary {
	display: list-item;
  }

/* Misc
	 ========================================================================== */

/**
   * Add the correct display in IE 10+.
   */

template {
	display: none;
  }

/**
   * Add the correct display in IE 10.
   */

[hidden] {
	display: none;
  }

:root {
	--outer: calc(100% - var(--inner-padding) - var(--inner-padding));
	--inner: 1240px;
	--inner-padding: 15px;
	--inner-with-padding: calc(var(--inner) + var(--inner-padding) + var(--inner-padding));
	--inner-text: 780px;

	--red: #CB2953;         /* R 203 G 41 B 83 */
	--red_30: #EFBFCC;      /* solid tint for nav dd menu */
	--blue: #35456b;        /* R53 G 69 B 107 */
	--yellow: #EBA84D;      /* R 235 G 168 B 77 */
	--yellow-bg: rgba(235,168,77,0.8);
	--yellow-sidebar: rgba(235,168,77,0.3);
	--orange: #E2694B;      /* R226 G 105 B 75 */
	--pink: #9D1E65;        /* R 157 G 30 B 101 (main link colour) */
	--purple: #6C3175;      /* R 108 G 49 B 117 */
	--teal_green: #00A987;  /* R 0 G 169 B 135 (currently not used) */
	--green: #94C11F;       /* R148 G 193 B 31  (form buttons only) */
	--grey: #8F9C9D;        /* R143 G 156 B 157 */
	--lt_blue: #9ECAC3;     /* R 158 G 202 B 195 */
	--lt_blue_60: #c5dfd8;  /* (Solid 60% Tint of --lt_blue) */
	--lt_blue_20: #ecf5f3;
	--txt: #333333;         /* colour of body text) */
	--white: #ffffff;
	--white_80: rgba(255,255,255,0.8);
	--black: #000000;
	--black_80: rgba(0,0,0,0.8);
	--form-border: #999;

	--font: "Nunito", sans-serif;
	--light: 300;
	--reg: 400;
	--bold: 700;

	--body-text: 16px;
	--nav: 1.25rem; /* 20px */
	--hero-heading: 2.25rem; /* 36px */
	--hero-text: 1.5rem; /* 24px */
	--large-paragraph: 1.563rem; /* 25px */
	--h1: 3rem; /* 48px */
	--h1-page: 2.5rem; /* 40px */
	--h2: 1.875rem; /* 30px */
	--h2-large: 2.125rem; /* 30px */
	--h3: 1.875rem; /* 30px */
	--single-h3: 1.563rem; /* 25px */
	--text: 1.375rem; /* 22px */
	--text-large: 2.25rem; /* 36px */
	--text-medium: 1.25rem; /* 20px */
	--text-small: 1.125rem; /*  18px */
	--hero-cta-heading: 3rem; /* 48px */
	--opening-paragraph: 1.375rem; /* 22px */

	--outline-red: dashed var(--red);
	--outline-white: dashed var(--white);

	--header-height: 187px;
}

html {
	overflow-x: hidden;
}

body {
	font-size: 16px;
	font-family: var(--font);
	color: var(--txt);
}

h1 {
	font-size: var(--h1);
	font-family: var(--font);
	font-weight: var(--light);
	margin: 0;
	padding: 0;
	line-height: 1.2;
}

p {
		margin-top: 5px;
		margin-bottom: 0.5em;
	}

h2 {
	font-size: var(--h2);
	font-family: var(--font);
	font-weight: var(--bold);
	margin: 0;
	padding: 0;
	line-height: 1.2;
}

h3 {

}

a {
	color: var(--txt);
	text-decoration: underline;
}

p a:hover,
p a:focus,
.block-text__inner li a:hover,
.block-text__inner li a:focus {
	color: var(--red);
	text-decoration: underline;
}

.block-text__inner p a:visited,
.block-text__inner li a:visited {
	color: var(--txt);
}

strong {
	font-weight: var(--bold);
}

em {
	font-style: italic;
}

.h2-large {
	font-size: var(--h2-large);
}

.heading-text {
	font-size: var(--text-large);
}

.text-center {
	text-align: center;
}

.underline {
	text-decoration: underline;
}

.text-black {
	color: var(--black);
}

.text-white {
	color: var(--white);
}

.text-purple {
	color: var(--purple);
}

.text-pink {
	color: var(--pink);
}

.nunito-light {
	font-family: "Nunito", sans-serif;
	font-optical-sizing: auto;
	font-weight: 300;
	font-style: normal;
}

.nunito-reg {
	font-family: "Nunito", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}

.nunito-bold {
	font-family: "Nunito", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
}

.caveat-reg {
	font-family: "Caveat", cursive;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

/* Mask Image. */

.mask-circle img {
	height: 100%;
	width: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	-webkit-mask-image: url('/wp-content/themes/shp/images/masks/circle.svg');
	        mask-image: url('/wp-content/themes/shp/images/masks/circle.svg');
}

.mask-circle-yellow img {
	height: 100%;
	width: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	-webkit-mask-image: url('/wp-content/themes/shp/images/masks/circle_yellow.svg');
	        mask-image: url('/wp-content/themes/shp/images/masks/circle_yellow.svg');
}

/* Backgrounds */

.bg-pink {
	background-color: var(--pink);
}

.bg-yellow {
	background-color: var(--yellow);
}

.bg-yellow-bordertop {
		position: relative;
	}

body:not(body.page-template-child):not(body.page-template-default) .bg-yellow-bordertop:before {
		content: '';
		height: 50px;
		width: 100vw;
		position: absolute;
		left: 0;
		top: -40px;
		background: url('/wp-content/themes/shp/images/bg_top_paint-edge-yellow.png') top center no-repeat;
		background-size: cover;
	}

.bg-red {
	background-color: var(--red);
}

.bg-blue {
	background-color: var(--blue);
}

.bg-pink {
	background-color: var(--pink);
}

.bg-purple {
	background-color: var(--purple);
}

.bg-orange {
	background-color: var(--orange);
}

.bg-blue-lt60 {
	background-color: var(--lt_blue_60);
}

.bg-blue-lt60-borders,
	.bg-blue-lt60-bordertop {
		position: relative;
	}

.bg-blue-lt60-borders:before,
		.bg-blue-lt60-borders:after,
		.bg-blue-lt60-bordertop:before {
			content: '';
			height: 30px;
			width: 100vw;
			position: absolute;
			left: 0;
		}

.bg-blue-lt60-borders:before,
		.bg-blue-lt60-bordertop:before {
			top: -30px;
			background: url('/wp-content/themes/shp/images/bg_top_paint-edge-lt-blue-60.png') top center no-repeat;
			background-size: cover;
		}

.bg-blue-lt60-borders:after {
			bottom: -30px;
			background: url('/wp-content/themes/shp/images/bg_btm_paint-edge-lt-blue-60.png') bottom center no-repeat;
			background-size: cover;
		}

@media screen and (max-width: 960px) {
	.desktop-only {
		display: none !important;
	}
}

@media screen and (min-width: 961px) {
	.mobile-only {
		display: none !important;
	}
}

@keyframes opacityFade {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

/* Sticky Header Styles */

#header.header--sticky {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	background: var(--white);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
}

#header.header--sticky .header__inner {
	padding: 8px 15px;
}

#header.header--sticky .header__logo img {
	content: url('/wp-content/themes/shp/images/shp-logo.svg');
	max-width: 80px;
}


/* Handle desktop navigation positioning when header is sticky */
#header.header--sticky #nav {
	position: relative;
	top: 0;
}

/* Body padding is now handled dynamically via JavaScript */
/* body.header-sticky-active {
	padding-top: 120px;
} */

.header__inner {
	display: flex;
	max-width: var(--inner);
	width: calc(100% - 30px);
	margin: 0 auto;
	padding: 45px 15px 27px;
}

.header__logo {
		width: 40%;
		padding: 0 0 0 0;
	}

.header__logo a {
			display: block;
		}

.header__logo img {
			max-width: 100%;
			height: auto;
		}

.header__links {
		display: flex;
		width: 60%;
		text-align: right;
	}

.header__links--inner {
		margin: auto 0 auto auto;
		padding-right: 15px;
	}

.header__links .button-swoosh {
			margin: auto 30px auto 0;
			padding-left: 30px;
			padding-right: 30px;
		}

.header__links .button-swoosh:hover,
		.header__links .button-swoosh:focus {
			outline: 0;
		}

.header__links .button-swoosh:last-of-type {
			margin-right: 0;
		}

@media screen and (max-width: 960px) {
	/* .header__inner {
		display: block;
	}

	.header__logo {
		width: calc(100% - 30px);
		padding: 0 15px;
		margin: 0 auto;
	}
	.header__links {
		width: 100%;
		margin: 30px auto;
		text-align: center;
	}
	.header__links--inner {
		width: 100%;
		padding-right: 0;
	} */
}

/* Nav */

#nav {
	background: var(--red);
	width: calc(100% - 30px);
	/* padding: 13px 15px; */
	padding: 0 15px;
}

#nav .nav__inner {
		margin: 0 auto;
		padding: 0 0;
		max-width: 1240px;
		width: 100%;
	}

#nav ul {
		list-style: none;
		margin: 0 0 0 -12px;
		padding: 0;
		width: 100%;
	}

#nav li {
		display: inline-block;
		margin: 0 15px;
		font-family: var(--font);
		font-weight: var(--bold);
		font-size: var(--nav);
		position: relative;
	}

#nav .menu-white-button a {
			color: var(--red);
			text-decoration: none;

			background: var(--white) !important;
			-o-border-image: url('/wp-content/themes/shp/images/swoosh/paint_white.webp') 30;
			   border-image: url('/wp-content/themes/shp/images/swoosh/paint_white.webp') 30;
			border-style: solid;
			border-width: 5px 10px;
			border-image-outset: 5px 10px;

			padding: 0 !important;
		}

#nav .menu-white-button a:hover,
			#nav .menu-white-button a:focus {
				color: var(--black);
				text-decoration: none;

				background: var(--yellow) !important;
				-o-border-image: url('/wp-content/themes/shp/images/swoosh/paint_yellow.webp') 30;
				   border-image: url('/wp-content/themes/shp/images/swoosh/paint_yellow.webp') 30;
				border-style: solid;
				border-width: 5px 10px;
				border-image-outset: 5px 10px;

				padding: 0 !important;
				outline: 0;
			}

#nav a {
	color: var(--white);
	text-decoration: none;
	line-height: 1;

	display: inline-block;
	background: var(--red);

	padding: 17px 15px;
}

#nav li:hover,
	#nav li:focus,
	#nav li:hover a,
	#nav li:focus a {
		color: var(--txt);
		text-decoration: none;
		line-height: 1;
		display: inline-block;
		background: var(--red_30);
	}

#nav a:focus {
	outline: var(--outline-white);
}

#nav .sub-menu a:focus {
	outline: 0;
}

#nav .sub-menu {
	position: absolute;
	left: -999999px;
	margin-top: -5px;
	background: var(--red_30);
		width: 100%;
		min-width: 270px;
		padding: 0 !important;
		margin: 0 !important;
		z-index: 100;
}

#nav .sub-menu li {
		width: 100%;
		/* min-width: 260px; */
		padding: 0;
		margin: 0 !important;
		display: block;
	}

#nav .sub-menu li a {
		color: var(--txt);
		width: calc(100% - 30px);
		padding-top: 10px;
		padding-bottom: 10px;
	}

#nav .sub-menu li.current_page_item,
	#nav .sub-menu li.current_page_item a,
	#nav .sub-menu li:hover,
	#nav .sub-menu li:focus,
	#nav .sub-menu li a:hover,
	#nav .sub-menu li a:focus {
		background: var(--red);
		color: var(--white);
	}

#nav li:hover > .sub-menu,
#nav li:focus > .sub-menu {
	position: absolute;
	left: 0;
	z-index: 100;
}

#nav li.submenu-open .sub-menu,
#nav li a:hover + .sub-menu,
#nav li a:focus + .sub-menu,
#nav li a:focus-within + .sub-menu {
	position: absolute;
	left: 0;
}

#nav .sub-menu a,
#nav .sub-menu a:hover,
#nav .sub-menu a:focus {
	-o-border-image: none;
	   border-image: none;
	border-style: none;
	border-width: none;
	border-image-outset: none;
	background: transparent;
}

#shp-menu {
	margin-left: -15px;
}

@media screen and (max-width: 960px) {
	body.nav-is-open:before {
		content: '';
		background: #000;
		opacity: 0.75;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 100;
	}

	#header {
		position: relative;
		z-index: 101;
		background-color: var(--white);
	}

	/* Mobile Sticky Header Styles */
	#header.header--sticky {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 1001;
		background: var(--white);
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
		transition: all 0.3s ease;
	}

	.header__inner {
		display: flex;
		padding-top: 20px;
		transition: padding 0.3s ease;
	}

	.header__logo {
		width: calc(100% - 100px);
		padding: 0 15px 0 0;
		margin: 0 0;
	}

	#menu-toggle {
		height: 50px;
		width: 50px;
		overflow: hidden;
		margin: 0 0 0 auto;
		padding: 0;
		border: 0;
		box-shadow: none;
		background: none;
		cursor: pointer;
	}

		#menu-toggle svg {
			width: 45px;
			height: 45px;
			display: block;
			-o-object-fit: contain;
			   object-fit: contain;
			margin: 0 auto;
		}

			#menu-toggle svg path {
				fill: var(--blue);
			}

		#menu-toggle #mobile-menu-open {
			display: block;
		}
		#menu-toggle #mobile-menu-close {
			display: none;
		}

		#menu-toggle.menu-toggle--open #mobile-menu-open {
			display: none;
		}
		#menu-toggle.menu-toggle--open #mobile-menu-close {
			display: block;
		}

	#nav {
		display: none;

		width: 100%;
		padding: 0;
		position: absolute;
		left: -99999px;
		top: -99999px;
		z-index: -1;
		opacity: 0;
	}

	#nav.show-nav {
		display: block;
		left: 0;
		top: auto;
		z-index: 1000;
		opacity: 1;
		transition: opacity 0.25s ease-in-out;
		overflow-y: auto;
    height: calc(100vh - var(--header-height));
	}

	#shp-menu {
		margin-left: 0;
	}

	#nav ul {
		margin: 0 auto;
	}

	#nav li {
		display: block;
		width: 100%;
		padding: 0;
		margin: 0;
	}

		#nav .sub-menu {
			position: static !important;
		}

		#nav a {
			display: block;
			padding: 15px;
		}

		#nav .menu-white-button a,
		#nav .menu-white-button a,
		#nav .menu-white-button a:hover,
		#nav .menu-white-button a:focus {
			background: none !important;
			-o-border-image: none !important;
			   border-image: none !important;
			border-style: solid;
			border-width: 0;
			border-image-outset: 0;

			color: var(--white);
			text-decoration: none;
			line-height: 1;
			display: block !important;
			background: var(--red);
			padding: 17px 15px !important;
		}

	#nav a, #nav a:hover, #nav a:focus {
		color: var(--white);
		text-decoration: none;
		line-height: 1;
		display: block !important;
		background: var(--red);
		padding: 17px 15px;
	}

	#nav .menu-white-button a:hover,
	#nav .menu-white-button a:focus,
	#nav li.menu-item-has-children:hover > a,
	#nav li.menu-item-has-children:focus > a,
	#nav li.menu-white-button:hover > a,
	#nav li.menu-white-button:focus > a {
		color: var(--white);
		background: var(--red) !important;
	}

	#nav .sub-menu li.current_page_item,
	#nav .sub-menu li.current_page_item a,
	#nav .sub-menu li:hover,
	#nav .sub-menu li:focus,
	#nav .sub-menu li a:hover,
	#nav .sub-menu li a:focus,
	#nav li.menu-item-has-children .sub-menu > a,
	#nav li.menu-item-has-children .sub-menu > a {
		color: var(--red);
		background: var(--red_30) !important;
	}

	#nav .sub-menu li a {
		padding-top: 15px;
		padding-bottom: 15px;
		padding-left: 30px;
	}

	#header #nav .menu-white-button a {
		background-color: var(--white) !important;
		color: var(--red) !important;
	}

	#header #nav #menu-shp-menu li.mobile-only a {
		background-color: var(--red) !important;
		color: var(--white) !important;
	}

	#header #nav #menu-shp-menu li.mobile-only:last-of-type a {
		background-color: var(--lt_blue) !important;
		color: var(--black) !important;
	}

	#header #nav .menu-white-button a:hover,
	#header #nav .menu-white-button a:focus,
	#header #nav #menu-shp-menu li.mobile-only a:hover,
	#header #nav #menu-shp-menu li.mobile-only a:focus,
	#header #nav #menu-shp-menu li.mobile-only:last-of-type a:hover,
	#header #nav #menu-shp-menu li.mobile-only:last-of-type a:focus {
		background-color: var(--yellow) !important;
		color: var(--black) !important;
	}


	#header #nav #menu-shp-menu .menu-item-has-children > a:hover,
	#header #nav #menu-shp-menu .menu-item-has-children > a:focus {
		color: var(--black);
	}
}

#nav__search {
	height: 35px;
	width: 35px;
	display: inline-block;
	border: 0;
	cursor: pointer;
	text-align: center;
	padding: 0;
	margin: 0 0 0 35px;
	position: relative;
	top: 4px;
	background: transparent;
}

#nav__search span {
		background: url('/wp-content/themes/shp/images/icons/magnifying-glass-white.svg') no-repeat;
		background-position: center center;
		background-size: contain;
		background-color: transparent;
		height: 20px;
		width: 20px;
		display: inline-block;
		text-align: center;
	}

#nav__search:hover span,
	#nav__search:focus span,
	body.search-input-is-open #nav__search span {
		background: url('/wp-content/themes/shp/images/icons/magnifying-glass.svg') no-repeat;
		background-position: center center;
		background-size: contain;
		background-color: transparent;
	}

#nav li.nav__search {
		position: static;
	}

li.nav__search:hover,
	li.nav__search:focus {
		background: transparent !important;
		outline: 0 !important;
	}

@media screen and (min-width: 851px) and (max-width: 1000px) {
		#nav__search {
			margin: 0 0 0 5px;
		}
	}

#nav__search-input {
	display: block;
	width: 100%;
	background: var(--red_30);
	position: absolute;
	left: 0;
	/* top: 0; */
	margin-top: 10px;
	height: 55px;
	z-index: 50;
}

.nav__search-input--inner {
		max-width: var(--inner);
		margin: 0 auto;
		padding: 10px 10px;
	}

.nav__search-input--inner input {
		width: calc(100% - 20px);
		padding: 5px 10px;
		outline: 0;
		border: 1px solid var(--black);
	}

.nav__search-input--inner input:focus,
	.nav__search-input--inner input:hover {
		outline: 0;
	}

#nav__search-input {
	display: none;
}

#nav__search-input.show-search-input {
	display: block;
}

#nav__search-input .search-submit {
	display: none;
}

@media screen and (max-width: 960px) {
	#nav__search {
		display: none;
	}
	#nav__search-input {
		display: block;
		position: static;
		margin: 0 auto;
		height: unset;
	}
	.nav__search-input--inner {
		padding: 15px;
		max-width: unset;
		width: calc(100% - 10px);
	}
}

.button-swoosh {
	display: inline-block;
	line-height: 1;
	padding: 0px 10px 0 0;
	text-align: center;
	text-decoration: none;
	font-size: 20px;
}

.button-swoosh:visited {
		color: var(--white);
	}

.button-swoosh:focus {
		outline: 0;
	}

.button-swoosh--red {
	background: var(--red);
	-o-border-image: url('/wp-content/themes/shp/images/swoosh/paint_red.webp') 30;
	   border-image: url('/wp-content/themes/shp/images/swoosh/paint_red.webp') 30;
	border-style: solid;
    border-width: 10px 10px;
    border-image-outset: 5px 10px;
	color: var(--white);
}

.button-swoosh--pink {
	background: var(--pink);
	-o-border-image: url('/wp-content/themes/shp/images/swoosh/paint_pink.webp') 30;
	   border-image: url('/wp-content/themes/shp/images/swoosh/paint_pink.webp') 30;
    border-style: solid;
    border-width: 10px 10px;
    border-image-outset: 5px 10px;
	color: var(--white);
}

.button-swoosh--lt_blue {
	background: var(--lt_blue);
	-o-border-image: url('/wp-content/themes/shp/images/swoosh/paint_lt-blue.webp') 30;
	   border-image: url('/wp-content/themes/shp/images/swoosh/paint_lt-blue.webp') 30;
    border-style: solid;
    border-width: 10px 10px;
    border-image-outset: 5px 10px;
	color: var(--black);
}

.button-swoosh--blue {
	background: var(--blue);
	-o-border-image: url('/wp-content/themes/shp/images/swoosh/paint_blue_lg.webp') 30;
	   border-image: url('/wp-content/themes/shp/images/swoosh/paint_blue_lg.webp') 30;
	border-style: solid;
	border-width: 10px 10px;
	border-image-outset: 5px 10px;
	color: var(--white);
}

.button-swoosh--blue:visited,
	.button-swoosh--lt_blue:visited,
	.button-swoosh--yellow:visited {
		color: var(--black);
	}

/* Default hover states. */

.button-swoosh--red:hover,
	.button-swoosh--red:focus,
	.button-swoosh--lt_blue:hover,
	.button-swoosh--lt_blue:focus,
	.button-swoosh--blue:hover,
	.button-swoosh--blue:focus,
	.button-swoosh--pink:hover,
	.button-swoosh--pink:focus,
	#social .social__realstories--article a:hover .button-swoosh,
	#social .social__realstories--article a:focus .button-swoosh,
	.sidebar__article-cta--link:hover .button-swoosh--blue,
	.sidebar__article-cta--link:focus .button-swoosh--blue {
		background: var(--yellow);
		-o-border-image: url('/wp-content/themes/shp/images/swoosh/paint_yellow.webp') 30;
		   border-image: url('/wp-content/themes/shp/images/swoosh/paint_yellow.webp') 30;
		border-style: solid;
		border-width: 10px 10px;
		border-image-outset: 5px 10px;
		color: var(--black);
		text-decoration: none;
	}

.button-green {
	background: var(--green);
	display: inline-block;
	border: 0;
	padding: 0px 0px;
	margin: 0;
	cursor: pointer;
}

.button-green:focus,
	.button-green:hover {
		color: var(--black);
		background: var(--yellow);
	}

.gform_button.button {
	background: var(--green) !important;
	display: inline-block !important;
	border: 1px solid var(--black) !important;
	padding: 8px 25px !important;
	margin: 0 !important;
	cursor: pointer !important;
	color: var(--black) !important;
	min-height: 40px !important;

	font-family: "Nunito", sans-serif !important;
    font-optical-sizing: auto !important;
    font-weight: 400 !important;
    font-style: normal !important;
	font-size: 1rem !important;
}

.gform_button.button:focus,
	.gform_button.button:hover {
		color: var(--black) !important;
		background: var(--yellow) !important;
	}

.button-border {
	border-width: 4px;
	border-style: solid;
	padding: 14px 15px;
	display: inline-block;
	text-decoration: none;
	text-align: center;
}

.block-cta .button-border {
		padding: 12px 20px;
		margin-top: 22px;
	}

.button-border-white {
	border-color: var(--white);
	color: var(--white);
}

.bg-yellow .button-border-white {
		border-color: var(--txt);
		color: var(--txt);
	}

.bg-yellow .button-border-white:focus,
		.bg-yellow .button-border-white:hover {
			background: var(--txt);
			color: var(--white);
		}

.button-border-hover-white-pink:hover,
.button-border-hover-white-pink:focus {
	color: var(--pink);
	background: var(--white);
}

.button-border-hover-white-red:hover,
.button-border-hover-white-red:focus {
	color: var(--white);
	background: var(--red);
}

#page-content .button-swoosh {
	padding: 5px 10px;
	min-width: 170px;
	margin-top: 30px;
}

#page-content .button-swoosh:not(.button-swoosh:first-of-type) {
	margin-left: 30px;
}

#page-content .button-swoosh:hover,
#page-content .button-swoosh:focus,
.block-buttons a:hover,
.block-buttons a:focus {
	background: var(--yellow);
	-o-border-image: url('/wp-content/themes/shp/images/swoosh/paint_yellow.webp') 30;
	   border-image: url('/wp-content/themes/shp/images/swoosh/paint_yellow.webp') 30;
    border-style: solid;
    border-width: 10px 10px;
    border-image-outset: 5px 10px;
	color: var(--txt);
}

.block-buttons {
	margin-top: 30px;
	margin-bottom: 30px;
}

.block-buttons__inner {
	text-align: center;
}

.block-buttons__button {
	display: block;
	margin: 10px auto 20px;
	text-align: center;
}

.block-buttons__button a {
		min-width: 180px;
	}

.block-buttons__button--0 {
	margin-top: 0;
}

.block-buttons__button + .block-buttons__button {
	/* margin-bottom: 0; */
}

.block-buttons__inner-inline .button-swoosh {
	margin-left: 15px;
	margin-right: 15px;
}

.post-article .button-swoosh--red {
	color: var(--white);
	font-weight: var(--bold);
}

.post-article .button-swoosh--red:hover,
	.post-article .button-swoosh--red:focus {
		color: var(--black);
	}

#hero {
	aspect-ratio: 3/1;
	position: relative;
	width: 100%;
	min-height: 480px;
	padding-bottom: 10px;
}

#hero:after {
		content: '';
		width: 100%;
		height: 10px;
		background: url('/wp-content/themes/shp/images/hero-line.webp') no-repeat;
		background-size: cover;
		position: absolute;
		bottom: 0px;
	}

#hero .hero__background {
		display: block;
		height: 100%;
		width: 100%;
		position: absolute;
	}

#hero .hero__background picture img {
			display: block;
			width: 100%;
			height: 100%;
			-o-object-fit: cover;
			   object-fit: cover;
		}

#hero .hero__content {
		width: 100%;
		max-width: var(--inner);
		padding: 0;
		margin: 0 auto;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
	}

#hero .hero__content--wrapper {
			display: flex;
			position: absolute;
			top: 0;
			left: 0;
			height: 100%;
			width: 100%;
			max-width: 350px;
			margin: 0 auto;
			padding: 0 20px;
		}

#hero .hero__content--inner {
			margin: auto;
			padding: 0 10px 20px;
		}

#hero .hero__content--dark {
			background: var(--black_80);
			color: var(--white);
		}

#hero .hero__content--light {
			background: var(--white_80);
			color: var(--black);
		}

#hero .hero__content--heading {
			display: block;
			font-size: var(--hero-heading);
			line-height: 1.2;
			margin-bottom: 5px;
		}

#hero .hero__content--text {
			display: block;
			font-size: var(--hero-text);
			line-height: 1.2;
		}

#hero .button-swoosh {
	margin-top: 50px;
}

/* Page Hero. */

#page-hero {
	aspect-ratio: 4/1;
	width: 100%;
	min-height: 360px;
	padding-bottom: 10px;
	width: 100vw !important;
	position: relative !important;
	left: 50% !important;
	right: 50% !important;
	margin-left: -50vw !important;
	margin-right: -50vw !important;
	max-width: unset !important;
}

#page-hero:after {
		content: '';
		width: 100%;
		height: 10px;
		background: url('/wp-content/themes/shp/images/hero-line.webp') no-repeat;
		background-size: cover;
		position: absolute;
		bottom: 0px;
	}

#page-hero .page-hero__background {
		display: block;
		height: 100%;
		width: 100%;
	}

#page-hero:not(.page-hero-nobg) .page-hero__background {
		position: absolute;
	}

#page-hero .page-hero__background picture img {
			display: block;
			width: 100%;
			height: 100%;
			-o-object-fit: cover;
			   object-fit: cover;
		}

#page-hero .page-hero__content {
		width: 100%;
		padding: 0;
		margin: 0 auto;
		height: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
	}

#page-hero .page-hero__content--wrapper {
			display: flex;
			position: absolute;
			bottom: 10px;
			left: 0;
			width: calc(100% - 30px);
			margin: 0 auto;
			padding: 0 15px;
		}

#page-hero .page-hero__content--inner {
			width: 100%;
			max-width: var(--inner);
			margin: auto;
			padding: 0;
		}

#page-hero .page-hero__content--dark {
			background: var(--black_80);
			color: var(--white);
		}

#page-hero .page-hero__content--light {
			background: var(--white_80);
			color: var(--black);
		}

#page-hero .page-hero__content--inner h1 {
				font-size: var(--h1-page);
				font-weight: var(--bold);
				line-height: 1.2;
				padding: 12px 0 5px;
			}

/* No image background. */

#page-hero.page-hero-nobg {
	aspect-ratio: unset;
	position: relative;
	width: 100%;
	height: unset;
	padding-bottom: 0;
	min-height: unset;
	background: url('/wp-content/themes/shp/images/bg_title-area.webp') right top no-repeat;
	background-size: cover;
}

#page-hero.page-hero-nobg:after{
	display: none;
}

#page-hero.page-hero-nobg .page-hero__content {
	position: relative;
	padding-top: 10px;
}

#page-hero.page-hero-nobg .page-hero__content--wrapper {
	bottom: 10px;
	position: relative;
}

@media screen and (max-width: 640px) {
	#hero .hero__content--wrapper {
		max-width: unset;
		padding: 0;
	}
	#hero .hero__content--wrapper .hero__content--inner {
		padding: 0 20px;
	}
}

.breadcrumbs__wrapper {
	width: calc(100% - 20px);
	background: var(--white);
	padding: 11px 10px 12px;
}

#breadcrumbs {
	display: flex;
    max-width: var(--inner);
    width: 100%;
    margin: 0 auto;
    padding: 5px 0 1px;
	font-family: var(--font);
	font-weight: var(--light);
	font-size: 20px;
}

#breadcrumbs a {
	text-decoration: none;
	display: inline-block;
}

#breadcrumbs a:focus {
	outline: 0;
}

/* #breadcrumbs a, */

#breadcrumbs a:hover,
#breadcrumbs a:focus,
#breadcrumbs span a,
#breadcrumbs span a:hover,
#breadcrumbs span a:focus,
#breadcrumbs span a:hover span,
#breadcrumbs span a:focus span {
	color: var(--red);
	text-decoration: underline;
}

#breadcrumbs span span {
	display: inline-block;
	line-height: 1.3;
}

/* #breadcrumbs a.home span,
#breadcrumbs .breadcrumb-sep:first-of-type {
	border:0;
	clip:rect(1px, 1px, 1px, 1px);
	clip-path:inset(50%);
	height:1px;
	margin:-1px;
	overflow:hidden;
	padding:0;
	position:absolute;
	width:1px;
	word-wrap:normal !important;
} */

#breadcrumbs .breadcrumb-sep {
	margin: 0 5px;
}

#breadcrumbs a.home {
	display: inline-block;
	position: relative;
	padding-left: 40px;
}

#breadcrumbs a.home:before {
	content: '';
	display: inline-block;
	height: 22px;
	width: 22px;
	background: url('/wp-content/themes/shp/images/icons/house-breadcrumb.svg') top left no-repeat;
	background-size: contain;
	position: absolute;
	top: 0px;
	left: -5px;
	padding-right: 15px;
}

/* #breadcrumbs span:first-of-type span:first-of-type a:before {
	content: '';
	display: inline-block;
	height: 22px;
	width: 22px;
	background: url('/wp-content/themes/shp/images/icons/house-breadcrumb.svg') top left no-repeat;
	background-size: contain;
	position: relative;
	top: 3px;
	padding-right: 15px;
} */

.breadcrumb_last,
.breadcrumb_last strong {
	font-family: var(--font);
	font-weight: var(--light);
}

#breadcrumbs a:before,
#breadcrumbs span.current-item:before {
	content: ' \00BB ';
	display: inline-block;
	width: 10px;
	margin: 0 5px 0 7px;
	color: var(--txt);
	cursor: default;
}

#breadcrumbs .breadcrumb-sep:nth-of-type(1) {
    opacity: 0.3;
}

body.single-post #breadcrumbs .post-post.current-item,
body.single-homelessness #breadcrumbs .post-homelessness.current-item,
body.single-personal-stories #breadcrumbs .post-personal-stories.current-item {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	-webkit-clip-path: inset(50%);
	        clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.breadcrumb-sep:last-of-type {
	display: none;
}

@media screen and (max-width: 960px) {
	.breadcrumbs__wrapper {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		border: 0;
	}
}

.parent-page__wrapper {
	margin-top: 90px;
	margin-bottom: 95px;
}

.parent-page__wrapper h2.wp-block-heading {
		font-weight: var(--light);
	}

.parent-page__wrapper h3.wp-block-heading,
.parent-page__wrapper h4.wp-block-heading,
.parent-page__wrapper h5.wp-block-heading,
.parent-page__wrapper h6.wp-block-heading {
	font-weight: var(--bold);
}

.parent-page__wrapper p + h3,
.parent-page__wrapper p + h4,
.parent-page__wrapper p + h5,
.parent-page__wrapper p + h6 {
	margin-top: 40px;
}

.page-childred-pages.block-cards-animated {
	padding-top: 55px;
}

.parent-page__wrapper-has-hero {
	padding-top: 0;
	margin-top: 0;
}

.parent-page__wrapper h2.wp-block-heading,
.parent-page__wrapper h3.wp-block-heading,
.parent-page__wrapper h4.wp-block-heading,
.parent-page__wrapper h5.wp-block-heading,
.parent-page__wrapper h6.wp-block-heading,
.parent-page__wrapper > .parent-block-text > .block-text__inner > p {
	padding-left: 15px;
	padding-right: 15px;
}

.child-page__wrapper {
	margin-top: 40px;
	margin-bottom: 95px;
}

.child-page__wrapper h2.wp-block-heading {
		font-weight: var(--light);
	}

.child-page__wrapper h3.wp-block-heading,
.child-page__wrapper h4.wp-block-heading,
.child-page__wrapper h5.wp-block-heading,
.child-page__wrapper h6.wp-block-heading {
	font-weight: var(--bold);
}

.child-page__wrapper p + h3,
.child-page__wrapper p + h4,
.child-page__wrapper p + h5,
.child-page__wrapper p + h6 {
	margin-top: 40px;
}

.page-childred-pages.block-cards-animated {
	padding-top: 55px;
}

/* body.page-template-child .page-childred-pages.block-cards-animated h2 {
		font-weight: var(--light);
	} */

/* .child-page__wrapper-has-hero {
	padding-top: 0;
	margin-top: 0;
} */

.child-page__wrapper-has-hero > .block-text {
		padding-top: 0;
	}

.page-template-real-stories #page-hero + .block-page-text {
	padding-top: 35px;
}

body.single-personal-stories .post-article-wrapper,
body.single-post .post-article-wrapper,
body.single-homelessness .post-article-wrapper {
	padding-top: 5px;
}

body.single-personal-stories #sidebar,
	body.single-post #sidebar,
	body.single-homelessness #sidebar {
		padding-top: 35px;
	}

body.single-post .post-article-wrapper > .post-article {
		padding-top: 37px;
	}

/** Sidebar **/

.parent-page__wrapper.includes-sidebar,
.child-page__wrapper.includes-sidebar {
	/* width: calc(100% - 30px); */
	width: 100%;
    max-width: var(--inner-with-padding);
    margin: auto;
    /* padding: 65px 15px; */
	/* padding: 40px 15px 65px 15px; */
	padding: 40px 0px 65px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.child-page__wrapper.includes-sidebar .block-text {
	width: 100%;
    max-width: calc(75% - 50px);
}

.parent-page__wrapper.includes-sidebar .parent-block-text {
	width: 100%;
    max-width: calc(75% - 30px);
}

.child-page__wrapper h2.wp-block-heading,
.child-page__wrapper h3.wp-block-heading,
.child-page__wrapper h4.wp-block-heading,
.child-page__wrapper h5.wp-block-heading,
.child-page__wrapper h6.wp-block-heading,
.child-page__wrapper > .block-text > .block-text__inner > p {
	padding-left: 15px;
	padding-right: 15px;
}

.child-page__wrapper > .block-text {
	padding-left: 0;
}

.child-page__wrapper .shp-block {
	padding-left: 15px;
	padding-right: 15px;
}

@media screen and (max-width: 1240px) {
	.parent-page__wrapper.includes-sidebar .parent-block-text,
	.child-page__wrapper.includes-sidebar .block-text {
		width: 100%;
		max-width: unset;
	}

	.parent-page__wrapper.includes-sidebar .parent-block-text .block-info_box__inner,
	.child-page__wrapper.includes-sidebar .block-text .block-info_box__inner {
		margin: auto;
	}
}