/* =========== 
	Root Styles 
	========== */	
	:root {
		/* ====================== 
			Colors
			===================== */
			--black-100: #000; 
			--black-200:  #231F20;
			--black-300: #333;
			--black-400: #444;
			--black-500: #555;
			--black-600: #666;
			--blue-200: #2E4964;
			--orange-100: #D8A017;
			--white-100: #fff;
			--white-200: #f7f7f7;
			--green-100: #62817B;			
			--green-200: #343B34;
			/* ====================== 
			Typography
			===================== */
			--primary-font-fam: 'Open Sans', sans-serif;	
			--headings-font-fam: 'Histeagin';	
			--font-size-700: 3.0rem;
			 --font-size-600: 2.5rem;
			 --font-size-500: 2.0rem;
			 --font-size-400: 1.2rem;
			 --font-size-300: 1.0rem;  
			 --font-size-200: 0.9rem;			 
			 --font-size-100: 0.8rem;
			 --font-weight-200: 200;			 
			 --font-weight-300: 300;
			 --font-weight-400: 400;
			 --font-weight-500: 500;
			 --font-weight-600: 600;
			 --font-weight-700: 700;
			 --font-weight-800: 800;
			 --font-weight-900:  900;
		}
		@font-face {
			font-family: Histeagin;
			src: url('../fonts/Histeagin.ttf') format(truetype);
		}
		@font-face {
			font-family: Montserrat;
			src: url('../fonts/Montserrat-Regular.ttf') format(truetype);
		}
	/* ====================== 
		HTML
		===================== */
		html {
			font-size:  100%;
			height: 100%;
		}
		* { /* includes the width and height of padding and border when calculating the element's width and height. */
			box-sizing: border-box;
		}
		*,
		*::before,
		*::after {/* passes down box sizing property to child elements. */
			box-sizing: inherit;
		}
		article {
			display: grid;
			align-content: center;
		}
		body {
			min-height:  100%;
		}

		h1, 
		h2, 
		h3, 
		h4,
		h5,
		h6 {
			font-family: var(--headings-font-fam);    
		} 
		p {
			font-family:var(--primary-font-fam);
		}


/* ====================== 
	HTML Styles
	===================== */

	html {
		font-size:  100%;
		height: 100%;
		scroll-behavior: smooth;
	}
	a:link {
		color: var(--orange-100);
		text-decoration: inherit
	}
	a:visited {
		color:var(--orange-100);
		text-decoration: inherit
	}
	a:hover,
	a:active,
	a:focus {
		color: inherit;
		text-decoration: inherit;
	}
	body {
		min-height:  100%;
	}
	section {
		display: block;
	}


/* ====================== 
	Booknow
	===================== */
	.booknow {
		background-color: var(--white-200);
		padding: 6rem 8rem;
		position: relative;
		text-align: center;
	}
	.booknow__title {
		font-weight: var(--font-weight-300);
		font-size: clamp(1.1rem, 2.2vw, 2.2rem);
		color: var(--black-300);
		line-height: 1.2;
		padding: 0 0 0.6rem 0;
		margin: 0;
	}
	.booknow__desc {
		display: grid;
		align-content: center;
		font-size: clamp(1.0rem, 1vw, 1rem);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-300);
		line-height: 1.8;
	}
	.booknow__button {
		margin: 1rem 0 0;
		display: grid;
	}
	.booknow__button--btn {
		padding: 1rem 2rem;
		margin: 0 auto 0;
		border: 0;
		border-radius: 4px;
		background: var(--orange-100);
		color: #fff;
		font-size: var(--font-size-200);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-400);
		text-align: center;
		display: grid;
	}
	.booknow__button--btn:hover {
		background:var(--green-100);
	}

/* ====================== 
	Byline
	===================== */
	.byline {
		background: var(--black-300);
		text-align: center;
		padding: 1rem 0;
	}
	.byline__links {
		font-family: var(--primary-font-fam);
		color: var(--white-200)!important;
		font-size: clamp(0.8rem, 1vw, 3rem);
	}
	.byline__links:hover {
		color: var(--orange-100)!important;
		text-decoration: none ;	
	}

	/* ====================== 
	Privacy
	===================== */
	.calendar {
		display: grid;
		margin-bottom: 2rem;		
		background: var(--white-100);		padding: 4rem 10rem;		grid-template-columns: 1fr;
	}
	.calendar__content {
		position: relative;
		display: grid;

		z-index: 100;
		justify-items: center;
	}
	.calendar__desc {
		display: grid;
		font-size: clamp(.9rem, 1vw, 1rem);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-300);
		line-height: 1.6;
		justify-content: center;
	}
	.calendar__title {
		font-weight: var(--font-weight-700);
		font-size: clamp(1.1rem, 1.1vw, 4rem);
		color: var(--blue-300);
		line-height: 1.2;
		padding: 0 0 0.6rem 0;
		margin: 0;
	}

	/* ====================== 
	Cards
	===================== */
	.cards {
		padding: 6rem 8rem;
		display: grid;
		grid-template-columns: repeat(3,1fr);
		position: relative;
		background-color:var(--white-200);
	}

	.cards__card {
		display: block;
		text-align: center;
		padding: 0 3rem;
	}
	.cards__button {
		margin: 1rem 0 0;
	}
	.cards__button--btn {
		padding: 1rem 2rem;
		margin: 0 auto 0;
		border: 0;
		border-radius: 4px;
		background: var(--orange-100);
		color: #fff;
		font-size: var(--font-size-100);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-400);
		text-align: center;
		display: grid;
	}
	.cards__button--btn:hover {
		background:var(--green-100);
	}
	.cards__field-heroshot {
		width: 64%!important;
		margin: 0 auto 2rem;
		border-radius: 50%;
	}
	.cards__heroshot {
		max-width: 148px!important;
		margin: 0 auto 2rem;
		box-shadow: 0px 0px 20px #000;
	}
	.cards__desc {
		display: grid;
		align-content: center;
		font-size: clamp(.9rem, 1vw, 1rem);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-300);
		line-height: 1.6;
	}
	.cards__title {
		font-weight: var(--font-weight-700);
		font-size: clamp(1.1rem, 1.1vw, 4rem);
		color: var(--blue-300);
		line-height: 1.2;
		padding: 0 0 0.6rem 0;
		margin: 0;
	}

/* ====================== 
	Contact
	===================== */
	.contact {
		padding: 3rem 8rem;
		position: relative;
		background: var(--white-100);
		display: grid;
		z-index: 100;
		grid-template-columns: 1fr 50%;
		gap: 0 4rem;
	}
	.contact__button {
		margin: 1rem 0 0;
	}
	.contact__button--btn {
		padding: 1rem 2rem;
		margin: 0 auto 0;
		border: 0;
		border-radius: 4px;
		background: var(--orange-100);
		color: #fff;
		font-size: var(--font-size-100);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-400);
		text-align: center;
		display: grid;
	}
	.contact__button--btn:hover {
		background:var(--green-100);
	}
	.contact__content {
		display: grid;
		align-content: center;
	}
	.contact__heroshot {
		margin: 0 auto0;
	}
	.contact__desc {
		display: grid;
		align-content: center;
		font-size: clamp(1.0rem, 1vw, 1rem);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-300);
		line-height: 1.8;
	}	
	.contact__subtitle {
		font-weight: var(--font-weight-300);
		color: var(--black-400);
		font-size: clamp(1.2rem, 1.8vw, 1.8rem);
		line-height: 1.2;
		margin: 0 0 1rem;
		letter-spacing: 1px;
	}
	.contact__title {
		font-weight: var(--font-weight-500);
		color: var(--black-400);
		font-size: clamp(1.8rem, 3vw, 3rem);
		line-height: 1.2;
		margin: 0rem 0 1.0rem;
		letter-spacing: 1px;
	}
	.contact__links {
		color: var(--black-200)!important;
		font-size: clamp(.8rem, 1.0vw, 3rem);
		margin: 0;
	}
	.contact__links:hover {
		color: var(--orange-100)!important;
		text-decoration: none ;	
	}
	.contact__list {
		display: grid;
		align-items: center;
		justify-content: center;
		justify-items: center;
		grid-template-columns: repeat(3, 1fr);
		padding: 0;
		list-style-type: none;
	}
	.contact__social-icon {
		width: 20px;
		display: inline-block!important;
	}

/* ====================== 
	Footer
	===================== */
	.footer {
		font-family: var(--primary-font-fam);
		background: var(--black-200);
		padding: 3rem 1rem;
		display: grid;
		gap: 2rem 0;
		grid-template-columns: 1fr 1fr 1fr;
		position: relative;
		align-items: center;
	}
	.footer__admin {
		grid-column: span 4;
		margin-bottom: 2rem;
		display: grid;
		justify-content: center;
	}
	.footer__desc {
		color: var(--white-100)!important;
		font-size: clamp(.9rem, 1.0vw, 3rem);
		margin: 0;
		grid-column: 1;
	}
	.footer__quicklinks {
		color: var(--white-100)!important;
		grid-column: span 4;
		text-align: center;
	}
	.footer__brand {
		grid-column: 3;
		display: grid;
		justify-items: end;
	}
	.footer__links {
		color: var(--white-100)!important;
		font-size: clamp(.8rem, 1.0vw, 3rem);
		margin: 0;
	}
	.footer__links:hover {
		color: var(--orange-100)!important;
		text-decoration: none ;	
	}
	.footer__list {
		display: grid;
		align-items: center;
		justify-content: center;
		justify-items: center;
		grid-template-columns: repeat(3, 1fr);
		padding: 0;
		list-style-type: none;
	}
	.footer__logo {
		width: 70%;
	}
	.footer__social-icon {
		width: 20px;
		display: inline-block!important;
	}
	.footer__title {
		font-weight: var(--font-weight-300);
		font-size: clamp(.8rem, 2vw, 3rem);
		color: var(--white-200);
		letter-spacing: 1px;
	}

/* ====================== 
	Gallery
	===================== */
	.gallery {
		padding: 6rem 8rem;
		position: relative;
		text-align: center;
	}
	.gallery__title {
    font-weight: var(--font-weight-300);
    font-size: clamp(1.1rem, 2.2vw, 2.2rem);
    color: var(--black-300);
    line-height: 1.2;
    padding: 0 0 0.6rem 0;
    margin: 0;
	}
	.gallery__CODE {
		display: inline;
	}

/* ====================== 
	Img Responsive
	===================== */
	.img-responsive {
		display: block;
		max-width: 100%;
		height: auto;
	}

/* ====================== 
	Intro
	===================== */


/* ====================== 
	Main
	===================== */
	.main__content {
		display: grid;
		align-content: center;
	}
	.main {
		padding: 3rem 8rem;
		position: relative;
		background: var(--white-100);
		display: grid;
		z-index: 100;
		grid-template-columns: 1fr 40%;
		gap: 0 4rem;
	}	
	.main__button {
		margin: 1rem 0 0;
	}
	.main__button--btn {
		padding: 1rem 2rem;
		margin: 0 auto 0;
		border: 0;
		border-radius: 4px;
		background: var(--orange-100);
		color: #fff;
		font-size: var(--font-size-100);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-400);
		text-align: center;
		display: grid;
	}
	.main__button--btn:hover {
		background:var(--green-100);
	}

	.main__heroshot {
		margin: 0 auto0;
	}
	.main__desc {
		font-size: clamp(1.0rem, 1vw, 1rem);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-300);
		line-height: 1.8;
	}	
	.main__subtitle {
		font-weight: var(--font-weight-300);
		color: var(--black-400);
		font-size: clamp(1.2rem, 1.8vw, 1.8rem);
		line-height: 1.2;
		margin: 0 0 1rem;
		letter-spacing: 1px;
	}
		.main__title {
		font-weight: var(--font-weight-500);
		color: var(--black-400);
		font-size: clamp(1.8rem, 3vw, 3rem);
		line-height: 1.2;
		margin: 0rem 0 1.0rem;
		letter-spacing: 1px;
	}

/* ====================== 
	Map
	===================== */
	.map {
		display: grid;
	}
	.map iframe{
		width: 100%;
	}

/* ====================== 
	Masthead
	===================== */
	.masthead-about {
		padding: 16rem 8rem 2rem;
		display: grid;
		background: url('../imgs/pngs/bg.png');
		grid-template-columns: repeat(2,1fr);
		position: relative;
		max-width: 1366px;
		margin: auto;
	}
	.masthead-blog {
		padding: 16rem 8rem 2rem;
		display: grid;
		grid-template-columns: 1fr;
		position: relative;
		background: url('../imgs/pngs/bg.png');
	}
	.masthead-about__content {
		display: grid;
		padding: 0 3rem;
		align-content: center;
	}
	.masthead-about__heroshot {
		width: 100%;
		margin: 0 auto 1rem;
	}
	.masthead-about__heroshot-mob {
		display: none;
	}
	.masthead-about__subtitle {
		font-weight: var(--font-weight-300);
		color: var(--black-400);
		font-size: clamp(1.2rem, 1.8vw, 1.8rem);
		line-height: 1.2;
		margin: 1rem 1rem 1rem;
		letter-spacing: 1px;
	}
	.masthead-home {
		display: grid;
		padding: 14rem 8rem 2rem;
		background: url('../imgs/pngs/bg.png');
		grid-template-columns: 60% 1fr;
		align-items: center;
		max-width: 1366px;
		margin: auto;
	}

	.masthead__right {
		display: grid;
		align-items: end;
	}







	.masthead-home__heroshot-wrapper {
		padding: 0;
		display: grid;
	}
	.masthead-home__heroshot {
		display: block;
	}	

	.masthead-home__content {
		display: grid;
		align-content: center;
	}

	.masthead__desc {
		display: grid;
		align-content: center;
		font-size: clamp(.9rem, 1vw, 1rem);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-300);
		line-height: 1.8;
	}	
	.masthead__subtitle {
		font-weight: var(--font-weight-300);
		color: var(--black-400);
		font-size: clamp(1.2rem, 1.8vw, 1.8rem);
		line-height: 1.2;
		margin: 0 0 1rem;
		letter-spacing: 1px;
	}
	
	.masthead__title {
		font-weight: var(--font-weight-500);
		color: var(--black-400);
		font-size: clamp(1.8rem, 3vw, 3rem);
		line-height: 1.2;
		margin: 0rem 0 1.0rem;
		letter-spacing: 1px;
	}
	.masthead-home__button {
		margin: 1rem 0 0;
		grid-column: 2;
		display: grid;
		justify-content: start;
	}
	.masthead-home__button--btn {
		padding: 1rem 2rem;
		margin: 0 auto 0;
		border: 0;
		border-radius: 4px;
		background: var(--orange-100);
		color: #fff;
		font-size: var(--font-size-200);
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-400);
		text-align: center;
		display: grid;
	}
	.masthead-home__button--btn:hover {
		background:var(--green-100);
	}

/* ====================== 
	Menu
	===================== */
	.menu {
		position: absolute;
		z-index: 999;
		width: 100%;
		background: transparent;
		display: grid;
	}
	.menu__btn {
		color: var(--blue-300)!important;
		text-align: center;
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-400);
		font-size: var(--font-size-200);
		transition-duration: 0.4s;
		cursor: pointer;
		background: transparent;
		margin: 0 0 0 .5rem;
		border: 0;
		border-radius: 50px;
		padding: 6px 0;
		width: 10rem;
	}	
	.menu__btn-desc {
		font-size: var(--font-size-200)!important;
	}
	.menu__btn-icon {
		width: 20px;
		display: inline-block;
	}
	.menu__logo {
		width: 100%;
		padding: 1rem 0;
		margin: auto;
	}
	.menu__logo-wrapper {
		grid-column: 1;
		display: grid;
		justify-items: center;
	}
	
/* ====================== 
	Nav
	===================== */
	nav {
		position: absolute;
		text-align: left;
		left: 0;
		background: var(--background);
		width: 100%;
		transform: scale(1, 0);
		transform-origin: top;
		transition: transform 200ms ease-in-out;
	}
	nav a {
		color: var(--black-300)!important;
		text-decoration: none;
		font-size: var(--font-size-400);
		font-family: var(--headings-font-fam);
		font-weight: var(--font-weight-300);
		opacity: 0;
		letter-spacing: 1px;
		transition: opacity 150ms ease-in-out;
	}
	.nav-toggle {
		position: absolute !important;
		top: -9999px !important;
		left: -9999px !important;
	}
	.nav-toggle:focus ~ .nav-toggle-label {
		outline: 3px solid rgba(lightblue, .75);
	}
	.nav-toggle-label {
		position: absolute;
		top: 50px;
		right: 0;
		margin-right: 2em;
		display: flex;
		align-items: center;
		height: 40px
	}
	.nav-toggle-label span::before,
	.nav-toggle-label span::after {
		content: '';
		position: absolute;
	}
	.nav-toggle-label span, .nav-toggle-label span::before, .nav-toggle-label span::after {
		display: block;
		background:var(--orange-100);
		height: 2px;
		width: 3em;
		border-radius: 2px;
		position: relative;
	}
	.nav-toggle-label span::after {
		top: 10px;
	}
	.nav-toggle-label span::before {
		bottom: 10px;
	}
	nav ul {
		background: rgba(255, 255, 255, .9);
		margin: 0;
		padding: 1rem 0;
		list-style: none;
		text-align: center;
	}
	nav ul li {
		margin-left: 0;
		margin-bottom: 2.2rem;
	}
	.nav-toggle:checked ~ nav {
		transform: scale(1,1);
	}
	.nav-toggle:checked ~ nav a {
		opacity: 1;
		transition: opacity 250ms ease-in-out 250ms;
		color: var(--white-100);
	}

/* ====================== 
	Privacy
	===================== */
	.privacy {
		display: grid;
		padding: 10rem;
	}
	.privacy__content {
		padding: 0 10rem 4rem;
		position: relative;
		background: var(--white-100);
		display: grid;
		z-index: 100;
	}
	.privacy__title {
		font-weight: var(--font-weight-600);
		color: var(--black-300);
		font-size: clamp(1.0rem, 2.8vw, 2.4rem);
		line-height: 1.2;
		margin: 4rem 0 1rem;
	}
	.privacy__desc {
		display: grid;
		align-content: center;
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-300);
	}

	/* ====================== 
	Terms
	===================== */
	.terms {
		display: grid;
	}
	.terms__content {
		padding: 0 10rem 4rem;
		position: relative;
		background: var(--white-100);
		display: grid;
		z-index: 100;
	}
	.terms__subtitle {
		font-weight: var(--font-weight-600);
		color: var(--black-300);
		font-size: clamp(1.0rem, 1.0vw, 1.0rem);
		line-height: 1.2;
		margin: 1rem 0 1rem;
	}
	.terms__title {
		font-weight: var(--font-weight-600);
		color: var(--black-300);
		font-size: clamp(1.0rem, 2.8vw, 2.4rem);
		line-height: 1.2;
		margin: 4rem 0 1rem;
	}
	.terms__desc {
		display: grid;
		align-content: center;
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-300);
	}
	.terms__list {
		display: grid;
		list-style-type: disc;
		margin-bottom: 1rem;
	}	
	.terms__list-item {
		margin-bottom: 0.5rem;
		font-family: var(--primary-font-fam);
		font-weight: var(--font-weight-300);
	}



/* ====================== 
	Software CSS over-rides
	===================== contact form */
	#pjCF_container_1 {
		background-color: transparent!important;
		padding: 0!important;
	}
	.pjCF-form label.cf-heading-large {
		font-weight: var(--font-weight-400)!important;
		font-family: var(--headings-font-fam)!important;
		font-size: clamp(2.0rem, 2.0vw, 2.0rem)!important;
		padding: var(--padding-zero)!important;
		color: var(--white-200)!important;
		margin-bottom: 1rem!important
	}
	.pjCF-form label.cf-heading-medium {
		font-weight: var(--font-weight-500)!important;
		font-family: var(--headings-font-fam)!important;
		font-size: clamp(1.8rem, 1.2vw, 2.0rem)!important;
		padding: 0;
		color: var(--black-300);
		margin-bottom: 1rem;
	}
	.pjCF-form label.cf-heading-medium img {
		transform: translateY(-3px);
		opacity: .8;
		width: 18px;
	}
	.pjCF-form label.cf-heading-small {
		font-weight: var(--font-weight-300)!important;
		font-family: var(--headings-font-fam)!important;
		font-size: var(--font-size-200)!important;
		color: var(--black-300)!important;
		padding: 0;
		margin-bottom: 1rem
	}
	.form-control {
		height: 60px!important;
		padding: 6px 12px;
		border-radius: 0!important;
	}
	body [id^=pjWrapper] {
		background-color: transparent!important;
	}
	#pjCF_container_1 .pjCF-button {
		background-color: var(--orange-100)!important;
		border-radius: 30px!important;
		border: 0!important;
		color: var(--white-100)!important;
		font-family: var(--headings-font-fam)!important;
		font-weight: var(--font-weight-400)!important;
		letter-spacing: 0px;
		font-size: clamp(1.0rem, 1.0vw, 1.0rem)!important;
		width: 12rem!important;
		padding: 14px 0!important;
	}
	#pjCF_container_1 .pjCF-button:hover {
		background-color: var(--green-100)!important;
		color: var(--white-100)!important;
		transition: .5s;
	}
	[id^=pjWrapper] .checkbox label, [id^=pjWrapper] .radio label {
		color:var(--orange-200);
	}