/*
* This file will be included in header in every page. It should be used for content 
* that relates to the site as a whole. It should not be used for plugin-specific css.
*/

/*
Fonts from the style guide
spacin-3
https://fonts.googleapis.com/css?family=Raleway:400,700,900
400 = Raleway Regular
700 = Raleway Bold
900 = Raleway Black

https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900
300 = Roboto Light
400 = Roboto Regular
500 = Roboto Medium
700 = Roboto Bold
900 = Roboto Black
*/

@media only screen {
	:root {
		--space-1: 4px;
		--space-2: 8px;
		--space-3: 12px;
		--space-4: 16px;
		--space-5: 20px;
		--space-6: 24px;
		--space-8: 32px;
		--orange: #d26d33;
		--green: #006d5b;
		--medium-green: #d1dfc6;
		--light-green: #e4ebdf;
	}

	/* Colors from the style guide */
	.orange { color: #d26d33; }
	.green { color: #006d5b; }
	.medium_green { color: #d1dfc6; }
	.light_green { color: #e4ebdf; }
	.white { color: white; }

	/* This ensures that the page always has a scrollbar to ensure that some headers load correctly without FOUC */
	html, body {
		height: 100%;
	}

	body {
		margin: 0;
		font-family: Roboto, Helvetica, Arial, sans-serif;
		font-size: 1em;
		color: black;
		background-color: white;
	}

	body.menu-open {
		overflow: hidden;
	}

	/* General Styles */
	h1 {
		margin: 0.5em 0;
		font-family: Raleway, Arial, sans-serif;
		font-weight: 700;
		font-size: 2.625em;
		line-height: 1.1;
		color: #006d5b;
	}

	h2 {
		margin: 0.5em 0;
		font-family: Raleway, Arial, sans-serif;
		font-weight: 700;
		font-size: 2em;
		line-height: 1.1;
		color: #006d5b;
	}

	h3 {
		margin: 0.5em 0;
		font-family: Roboto, Arial, sans-serif;
		font-weight: 700;
		font-size: 1.75em;
		line-height: 1.1;
		color: #006d5b;
	}

	h4 {
		margin: 0.5em 0;
		font-family: Roboto, Arial, sans-serif;
		font-weight: 700;
		font-size: 1.5em;
		line-height: 1.1;
	}

	h5 {
		margin: 0.5em 0;
		font-family: Roboto, Arial, sans-serif;
		font-weight: 700;
		font-size: 1.25em;
		line-height: 1.1;
	}

	h6 {
		margin: 0.5em 0;
		font-family: Roboto, Arial, sans-serif;
		font-weight: 700;
		font-size: 1.125em;
		line-height: 1.1;
	}

	p {
		margin-block-start: 0;
		margin-block-end: 0;
		margin-inline-start: 0;
		margin-inline-end: 0;
		font-family: Roboto, Arial, sans-serif;
		font-weight: 400;
		font-size: 1em;
		line-height: 1.5;
	}

	a {
		font-family: Roboto, Arial, sans-serif;
		font-weight: 700;
		font-size: 1.125em;
		line-height: 1.5;
		text-decoration: underline;
		color: black;
		cursor: pointer;
	}

	a.phone {
		font-weight: 400;
		font-size: 1em;
	}

	input {
		font-weight: 300;
		font-size: 1em;
		line-height: 1.7;
	}

	h1 > a,
	h2 > a,
	h3 > a,
	h4 > a,
	h5 > a,
	h6 > a,
	p > a {
		font: inherit;
		font-weight: inherit;
		color: inherit;
	}

	a.reverse-underline {
		text-decoration: none;
	}
	a.reverse-underline:hover {
		text-decoration: underline;
	}

	ol,
	ul {
		padding-inline-start: 1em;
	}

	body > .contentRender {
		min-height: 100%;
		height: 100%;
	}

	.button-wrapper {
		position: relative;
		z-index: 1;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 1em 1.5em;
	}

	.panel-container .button-wrapper {
		padding-left: 0;
		padding-right: 0;
	}

	.button-wrapper.justify-left {
		justify-content: flex-start;
	}

	.button-wrapper.justify-center {
		justify-content: center;
	}

	.button-wrapper.justify-right {
		justify-content: flex-end;
	}

	button,
	.button {
		display: inline-block;
		border-width: 1px;
		border-style: solid;
		border-color: black;
		color: black;
		background-color: white;
		font-family: Roboto, Arial, sans-serif;
		font-weight: 700;
		font-size: 1em;
		line-height: 2.5em;
		text-transform: uppercase;
		text-decoration: none;
		text-align: center;
		cursor: pointer;
		overflow: hidden;
	}
	.button {
		height: 2.5em;
		margin: 1em 0;
		padding: 0 1em;
	}
	button.green,
	.button.green {
		color: #006d5b;
		border-color: #006d5b;
	}
	button.orange,
	.button.orange {
		color: #d26d33;
		border-color: #d26d33;
	}
	button:hover,
	.button:hover {
		color: white !important;
		border-color: white !important;
		background-color: #777;
	}
	button.green:hover,
	.button.green:hover {
		background-color: #006d5b;
	}
	button.orange:hover,
	.button.orange:hover {
		background-color: #D26D33;
	}
	@media screen and (max-width: 1024px) {
		.button {
			font-size: 14px;
		}
	}

	.contentRender_name_plugins_core_textbox {
		padding: 1em;
	}

	section.header,
	section.slideshow,
	section.content,
	section.footer {
		position: relative;
	}

	/* Panels */
	.panel-page {
		position: relative;
		min-height: 100%;
	}

	.panel-page > .header {
		margin-bottom: 74px;
	}

	.panel-layout {
		position: relative;
	}

	.panel-layout .panel-container {
		margin-top: 20px;
	}

	.panel-layout.space-around .panel-container {
		padding: 20px;
	}

	.panel-one-column.has-background {
		background-repeat: no-repeat;
		background-position: left top;
	}

	.panel-two-column,
	.panel-three-column {
		display: flex;
		flex-direction: column;
	}

	.panel-two-column.mobile-reverse .left-container {
		order: 2;
	}

	.panel-two-column.mobile-reverse .right-container {
		order: 1;
	}

	.panel-layout.panel-accordion.collapse .custom-link {
		display: none;
	}
	.panel-layout.panel-accordion .panel-button {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.panel-layout.panel-accordion .panel-button h3 {
		width: calc(100% - 40px);
	}
	.panel-layout.panel-accordion .panel-button button {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 40px;
		height: 40px;
		padding: 0;
		border: 3px solid #0d8069;
		border-radius: 50%;
		background-color: white;
		cursor: pointer;
	}
	.panel-layout.panel-accordion .panel-button button i {
		margin-top: 2px;
		font-size: 27px;
		color: #006d5b;
	}
	.panel-layout.panel-accordion .panel-button button i.fa-plus {
		display: none;
	}
	.panel-layout.panel-accordion.collapse .panel-button button i.fa-plus {
		display: flex;
	}
	.panel-layout.panel-accordion.collapse .panel-button button i.fa-minus {
		display: none;
	}
	.panel-layout.panel-accordion > .button-wrapper {
		display: block;
		padding: 0;
	}
	.panel-layout.panel-accordion.collapse > .button-wrapper {
		display: none;
	}
	.panel-layout.panel-accordion .button.accordion-link {
		display: block;
	}
	.panel-layout.panel-accordion.collapse {
		margin-bottom: 1em;
	}
	.panel-layout.panel-accordion .panel-container {
		height: auto;
		margin-top: 0;
		overflow: hidden;
	}
	.panel-layout.panel-accordion.collapse .panel-container {
		height: 0;
	}

	.ui-datepicker {
		z-index: 11 !important;
	}
	
	.mesquite-slider .slick-dots {
		position: relative;
		display: flex !important;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		width: 90%;
		margin: 0 auto;
	}
	.mesquite-slider .slick-dots li {
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.mesquite-slider .slick-dots li button {
		position: relative;
		border: 1px solid #ccc;
		border-radius: 50%;
		width: 12px;
		height: 12px;
	}
	.mesquite-slider .slick-dots li button:before {
		left: -6px;
		top: -4px;
		font-size: 14px;
		color: transparent;
		background-color: #ccc;
		opacity: 1;
	}
	.mesquite-slider .slick-dots li button:hover,
	.mesquite-slider .slick-dots li button:focus {
		border: 1px solid #ccc !important;
	}
	.mesquite-slider .slick-dots li.slick-active button {
		background-color: black !important;
		border: 1px solid black !important;
	}
	.mesquite-slider .slick-dots li.slick-active button:before {
		color: black;
		transform: scale(1.1);
		opacity: 1;
	}
}

@media (max-width: 64em) {
	.panel-layout.panel-accordion .panel-button {
		padding: 0 1em;
		background-color: #006d5b;
	}
	.panel-layout.panel-accordion .panel-button h3 {
		text-shadow: 0 2px 4px rgba(0,0,0,0.5);
		color: white;
	}
	.panel-layout.panel-accordion .button.accordion-link {
		height: 2.2em;
		margin: 10px;
		font-size: 3.6vw;
		line-height: 2.3;
		color: #006d5b;
		border-width: 3px;
		border-color: #006d5b;
	}
	.panel-layout.panel-accordion .button.accordion-link:hover {
		border-color: #006d5b !important;
		background-color: #006d5b;
	}
}

@media (min-width: 500px) and (max-width: 64em) {
	.panel-layout.panel-accordion .button.accordion-link {
		font-size: 1.125em;
	}
}

@media (min-width: 64.063em) {
	h1 {
		font-size: 48px;
		font-weight: 900;
	}

	h2 {
		font-size: 36px;
		font-weight: 900;
	}

	h3 {
		font-family: Raleway, Arial, sans-serif;
		font-size: 32px;
		font-weight: 900;
	}

	h4 {
		font-size: 28px;
	}

	h5 {
		font-size: 20px;
		font-weight: 400;
	}

	h6 {
		font-size: 16px;
		font-weight: 400;
	}

	p {
		font-size: 14px;
	}

	a {
		font-size: 18px;
		font-weight: 700;
	}

	button,
	.button {
		font-size: 14px;
		font-weight: 700;
		line-height: 2.3em;
		border-width: 3px;
	}

	.panel-page > .header,
	.panel-page > .slideshow,
	.panel-page > .content,
	.panel-page > .footer,
	.panel-one-column,
	.panel-two-column,
	.panel-three-column {
		margin: 0 auto;
		position: relative;
	}

	.panel-page > .header {
		margin-bottom: 112px;
	}

	/* panel options */
	.panel-layout.controlled-width {
		max-width: 73em;
		margin: 0 auto;
	}
	
	.panel-two-column,
	.panel-three-column {
		flex-direction: row;
	}

	.panel-two-column.space-between,
	.panel-three-column.space-between {
		justify-content: space-between;
	}

	.panel-layout .panel-container {
		margin-top: 0;
	}

	.panel-layout.controlled-width .panel-container {
		max-width: 73em;
		margin: 0 auto;
	}
	
	.panel-layout.panel-one-column .panel-container {
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.panel-two-column .panel-container {
		align-self: stretch;
		flex-grow: 1;
		flex-shrink: 1;
	}
	
	.panel-layout.space-between .left-container,
	.panel-layout.space-around .left-container {
		margin-right: 20px;
	}
	.panel-layout.space-between .right-container,
	.panel-layout.space-around .right-container {
		margin-left: 20px;
	}

	.panel-two-column.mobile-reverse .left-container {
		order: 1;
	}

	.panel-two-column.mobile-reverse .right-container {
		order: 2;
	}
	.panel-two-column.fifty_fifty .left-container,
	.panel-two-column.fifty_fifty .right-container {
		flex-basis: 50%;
	}

	.panel-two-column.narrow_left .left-container {
		flex-basis: 25%;
	}
	.panel-two-column.narrow_left .right-container {
		flex-basis: 75%;
	}

	.panel-two-column.narrow_left_33 .left-container {
		flex-basis: 33%;
	}
	.panel-two-column.narrow_left_33 .right-container {
		flex-basis: 66%;
	}

	.panel-two-column.narrow_right .left-container {
		flex-basis: 75%;
	}
	.panel-two-column.narrow_right .right-container {
		flex-basis: 25%;
	}

	.panel-two-column.narrow_right_33 .left-container {
		flex-basis: 55%;
	}
	.panel-two-column.narrow_right_33 .right-container {
		flex-basis: 33%;
	}

	.panel-three-column.equal_widths .left-container,
	.panel-three-column.equal_widths .middle-container,
	.panel-three-column.equal_widths .right-container {
		flex-basis: 33%;
	}

	.panel-three-column.left_50 .left-container {
		flex-basis: 50%;
	}
	.panel-three-column.left_50 .middle-container,
	.panel-three-column.left_50 .right-container {
		flex-basis: 25%;
	}

	.panel-three-column.middle_50 .left-container,
	.panel-three-column.middle_50 .right-container {
		flex-basis: 25%;
	}
	.panel-three-column.middle_50 .middle-container {
		flex-basis: 50%;
	}

	.panel-three-column.right_50 .left-container,
	.panel-three-column.right_50 .middle-container {
		flex-basis: 25%;
	}
	.panel-three-column.right_50 .right-container {
		flex-basis: 50%;
	}

	.panel-layout.panel-accordion {
		max-width: 73em;
		margin: 0 auto;
		padding-top: 2em;
	}
	.panel-layout.panel-accordion.two-col {
		padding: 2em 0;
	}
	.panel-layout.panel-accordion .panel-button {
		max-width: 73em;
		margin: 0 auto;
		padding: 0 1em;
		background-color: white;
		border: none;
	}
	.panel-layout.panel-accordion .panel-button h3 {
		margin: 0;
	}
	.panel-layout.panel-accordion .panel-button button {
		display: none;
	}
	.panel-layout.panel-accordion > .button-wrapper,
	.panel-layout.panel-accordion.collapse > .button-wrapper {
		display: block;
		max-width: 73em;
		margin: 0 auto;
		padding: 0 1em;
	}
	.panel-layout.panel-accordion .button.accordion-link {
		height: auto;
		margin: 0;
		padding: 0;
		color: #006d5b;
		font-weight: 900;
		text-align: left;
		text-decoration: underline;
		background-color: white;
		border: none;
	}
	.panel-layout.panel-accordion .button.accordion-link:hover {
		color: #006d5b !important;
		background-color: white !important;
		text-decoration: none;
	}
	.panel-layout.panel-accordion.collapse .panel-container	{
		height: auto;
	}
}

@media only screen and (min-width: 73em) {
	.panel-layout.panel-accordion > .button-wrapper,
	.panel-layout.panel-accordion.collapse > .button-wrapper,

	.panel-layout.panel-accordion > .panel-container > .contentRender_name_plugins_core_textbox,
	.panel-layout.panel-accordion .panel-button,
	.panel-layout.panel-accordion > .button-wrapper {
		padding: 0;
	}
}

@media only screen and (min-width: 90em) {
	.panel-layout.controlled-width .contentRender_name_plugins_core_textbox {
		padding: 1em 0 0 0;
	}
	.contentRender_name_plugins_core_textbox {
		padding: 1em;
	}
	.panel-layout.panel-accordion .panel-button,
	.panel-layout.panel-accordion .button.accordion-link {
		padding: 0;
	}
}

body .mfp-close:hover,
body .mfp-arrow:hover,
body .mfp-arrow:focus {
	background-color: transparent; /* foundation compatibility with magnific popup */
}

/* edit bar and button */
@media only screen and (max-width: 64em) { 
	div[id^="sv_adminBar_"] {
		text-align: center;
	}
}

/* Info Banner */
@media only screen {
	.info-banner {
		position: relative;
		display: flex;
		align-items: center;
		opacity: 0;
		transition: opacity 500ms linear;
	}
	.info-banner.loaded {
		opacity: 1;
	}
	.info-banner.justify-left {
		justify-content: flex-start;
	}
	.info-banner.justify-center {
		justify-content: center;
	}
	.info-banner.justify-right {
		justify-content: flex-end;
	}
	.info-banner p {
		margin: 0;
		padding: 10px 20px;
		letter-spacing: initial;
	}
	.info-banner p .banner-intro {
		margin-right: 10px;
		font-weight: 600;
	}
	.info-banner a {
		margin-left: 10px;
		font-weight: 600;
		text-decoration: underline;
		color: inherit;
	}
	.info-banner a:hover {
		text-decoration: none;
	}
	.info-banner p button {
		display: inline-flex;
		justify-content: center;
		align-items: center;
		align-self: flex-start;
		width: 22px;
		height: 22px;
		margin: 0 0.5em;
		padding: 0;
		color: inherit;
		background-color: transparent;
		border-color: inherit;
		border-width: 1px;
	}
	.info-banner p button:hover {
		color: black;
		background-color: #777;
		border-color: #777 !important;
	}
	.info-banner p button:hover i {
		color: black;
	}
}