@import url("./hamburgers/dist/hamburgers.css");
/* ---------------------------- Site information ------------------------------ */
/* -------------------- Initial site build Sept of 2023 --------------------- */
/* ------------ Developer: Josh Martin (JLM) -------------- */
/* --------------------- Remember this is mobile first! ---------------------- */
/* ------------- A website built by Craft & Cloud Marketing Co. -------------- */

/* -------------------- SITE COLORS/Fonts Variable ---------------------- */
:root {
	--lightred: #ECDBD3;
	--red: #CE4649;
	--brown: #A2562A;
	--maroon: #763138;
	--darkbrown: #3C251A;
	--green: #3F492F;
	--lightcream: #FDF8EF;
	--cream: #F3DBAE;
	--gray: #756459;
	--lightgray: #DDD3CA;
	--marseille: "marseille", sans-serif;
	--pfmarket: "pf-marlet-display", sans-serif;
	--urbanist: "Urbanist", serif;
}
/* -------------------- TOP STYLES STYLES ---------------------- */
body {
	margin: 0;
	
	p, li {
		font-family: var(--urbanist);
	}
}

img {
	width: 100%;
	height: auto;
	display: block;
}

a {
	text-decoration: none;
}

hr {
	height: 2px;
	border: none;
	width: 75%;
	max-width: 956px;
}

.dialog-off-canvas-main-canvas {
	overflow-x: hidden;
}
/* -------------------- GENERAL PAGE STYLES LAYOUT ---------------------- */
.layout-padding-text, .layout-padding-text-max-width, #block-trailhead-footer {
	font-size: 3.2vw;
	padding: 2em 6%;
	position: relative;
	
	p {
		color: var(--darkbrown);
		line-height: 1.5;
	}
	
	h2, h3 {
		font-family: var(--marseille);
	}
}

.regulation-page-layout-padding-text {
	font-size: min(3.4vw, 1.1em);
	padding: 2em 6%;
}

.layout-padding-text-max-width {
	padding: 0;
}

.yoast-seo-score-widget {
	display: none;
}

@media screen and (min-width: 750px) {
	
	.layout-padding-text, .layout-padding-text-max-width, #block-trailhead-footer {
		font-size: 1.4em;
		padding: 3em 5%;
	}
	
	.layout-padding-text-max-width {
		padding: 0;
	}
}

@media screen and (min-width: 900px) {
	
	.layout-padding-text, #block-trailhead-footer {
		padding: 3em 8%;
	}
	
	.regulation-page-layout-padding-text {
		padding: 2em 8%;
	}
}

@media (min-width: 1500px) {
	
	.layout-padding-text-max-width {
		padding: 0 calc((100vw - 1550px)/2);
	}
	
	.regulation-page-layout-padding-text {
		padding: 2em calc((100vw - 1200px)/2);
	}
}

@media screen and (min-width: 2000px) {
	
	.layout-padding-text, #block-trailhead-footer {
		padding: 3em calc((100vw - 1550px)/2);
	}
}

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

.light-brown-background {
	background-color: var(--brown);
}

.brown-background {
	background-color: var(--darkbrown);
}

.cream-background {
	background-color: var(--cream);
}

.light-cream-background {
	background-color: var(--lightcream);
}

.gray-background {
	background-color: var(--gray);
}

.lightgray-background {
	background-color: var(--lightgray);
}

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

.green-background {
	background-color: var(--green);
}

.maroon-background {
	background-color: var(--maroon);
}

.heading-marseille {
	color: var(--darkbrown);
}

.floor-plan-heading {
	text-align: center;
}

.floor-plan {
	max-width: 1000px;
	margin: auto;
}

.floor-plan-button {
	
	.phone {
		color: var(--darkbrown);
		text-decoration: underline;
		text-decoration-color: var(--darkbrown);
	}
}

.cream-color-text {
	
	h2, h3, p {
		color: var(--cream) !important;
	}
}

/* .paragraph--type--modular-floor-plan, .paragraph--type--modular-why-trailhead, .video-heading, .paragraph--type--features-pictures {
	position: relative;
	
	h2, h3 {
		text-align: center;
		margin-bottom: 1.5em;
	}
} */

/* .paragraph--type--modular-floor-plan {
	
	h2 {
		color: var(--brown);
	}
	
	.floor-plan {
		
		div:nth-child(2) {
			margin-top: 3em;
		}
	}
	
	.phone {
		color: var(--darkbrown);
		text-decoration: underline;
	}
} */

.layout-additional-options {
	
	h2, p, ul {
		color: var(--cream);
	}
	
	li {
		font-weight: 200;
		margin: .3em 0;
	}
}

/* .paragraph--type--modular-floor-plan, .paragraph--type--modular-additional-options {
	
	.button {
		margin-top: 3em;
	}
}

.paragraph--type--modular-why-trailhead, .paragraph--type--modular-process-section, .paragraph--type--modular-additional-options {
	
	h2, p, ul {
		color: var(--cream) !important;
	}
} */
/* --------- FEATURES, POSSIBILITIES, AND HOUSE TYPE STYLING -------- */
.layout-features-icons {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	
	span {
		font-weight: 100;
	}
	
	> div {
		width: min(35%, 10em);
		margin: 1em;
	}
	
	.features-icon {
		width: 4.5em;
		margin: auto;
	
		img {
			aspect-ratio: 160 / 150;
			object-fit: fill;
		}
	}
	
	.features-text, p {
		font-family: var(--marseille);
		color: var(--cream) !important;
		text-align: center;
		font-weight: 300;
	}
}

.house-type-section {
	background-color: transparent;
	width: 65%;
	margin: 2em auto 0;
	padding: .5em 0;
	box-sizing: border-box;
	background-color: var(--darkbrown);
	border-radius: .4em;
	position: relative;
	box-shadow: 5px 5px 4px 0px rgb(0 0 0 / 30%);
	transition: .3s;
	
	.button {
		margin: 1em 0 .5em;
		
		a {
			padding: .5em 2em;
		}
	}
}

.house-type-section:hover a:after {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	box-shadow: 8px 6px 6px 0px rgb(0 0 0 / 10%);
	border-radius: .4em;
}

.layout-house-types.layout-house-types-multi-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	
	.house-type-section {
		width: 45%;
	}
}

/* .layout-explore-categories {
	
	h1, h2 {
		color: var(--green);
	}
	
	.container-photo-text {
		margin: 3em .5em;
		
		h2 {
			margin-top: 0;
			margin-bottom: -.5em;
		}
		
		p {
			font-weight: 700;
		}
	}
} */

/* .layout-house-types.layout-house-types-2 {
	flex-wrap: wrap;
} */

/* .layout-house-types.layout-house-types-2.layout-house-types-3 {
	
	.house-type-section {
		
		p {
			margin-top: .4em;
		}
	}
} */

/* .layout-house-types.layout-house-types-5 {
	justify-content: center;
} */

/* @media (max-width: 749px) {
	
	.layout-features-icons {
		flex-wrap: wrap;
		
		> div {
			margin: 0 2em;
		}
	}
} */

@media screen and (min-width: 750px) {
	
	.layout-features-icons {
		justify-content: space-between;
		flex-wrap: nowrap;
	}
	
	.layout-house-types.layout-house-types-multi-row {
		justify-content: flex-start;
		
		h2 {
			font-size: min(3vw, 1.5em);
		}
		
		.house-type-section {
			width: 31%;
			margin: 2em min(1.16%,1.5em) 0;
		}
	}
}

@media screen and (min-width: 1000px) {
	
	.layout-additional-options {
		
		ul {
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
			
			li {
				width: 48%;
			}
		}
	}
	
	/* .layout-features-icons {
		
		.paragraph--type--modular-pages {
			margin: 1em auto;
			max-width: 6rem;
		}
	} */
	
	/* .layout-explore-categories {
		
		.layout-photo-text {
			display: flex;
			justify-content: center;
			flex-wrap: wrap;
		}
		
		.container-photo-text {
			width: 30%;
			font-size: .5em;
			max-width: 36em;
			margin: 1em;
		}
		
		.button {
			
			a {
				padding: .5em 2em;
			}
		}
	} */
	
	/* .layout-house-types {
		display: flex;
		justify-content: space-between;
		max-width: 1250px;
		margin: auto;
		
		.house-type-section {
			margin: 2em 0 3em;
			width: 35%;
			max-width: 18em;
		}
	} */
}

@media screen and (min-width: 1150px) {
	
	/* .layout-house-types.layout-house-types-2 {
		justify-content: flex-start;
		
		.house-type-section {
			margin: 2em 1.66% 3em;
			width: 30%;
			
			h2 {
				font-size: 1.1em;
			}
		}
	} */
	
	/* .layout-house-types.layout-house-types-2.layout-house-types-3 {
		justify-content: space-around;
		
		.house-type-section {
			width: 30%;
		}
	} */
}

@media screen and (min-width: 1300px) {
	
	/* .layout-explore-categories {
		
		.container-photo-text {
			font-size: .8em;
			width: 28.5%;
			max-width: 22em;
		}
	} */
}

@media screen and (min-width: 1600px) {
	
	/* .layout-explore-categories {
		
		.container-photo-text {
			margin: 2em;
		}
	} */
}
/* -------------------- BUTTON STYLES ---------------------- */
.link-text-dark-brown {
	color: var(--darkbrown);
	text-decoration: underline;
	
	&:hover {
		text-decoration-color: var(--brown);
	}
}

.link-text-cream {
	color: var(--cream);
	text-decoration: underline;
	transition: .3s;
	
	&:hover {
		text-decoration-color: var(--red);
	}
}

.button {
	
	a {
		box-sizing: border-box;
		font-family: var(--marseille);
		font-weight: 900;
		padding: .5em 1em;
		border-radius: .2em;
		transition: .3s;
	}
}

.maroon-button {
	
	a {
		color: var(--maroon);
		background-color: var(--cream);
		border: solid 2px var(--cream);
		
		&:hover {
			background-color: var(--lightcream);
			border: solid 2px var(--maroon);
		}
	}
}

.dark-brown-button {
	
	a {
		color: var(--cream);
		background-color: var(--darkbrown);
		
		&:hover {
			color: var(--darkbrown);
			background-color: var(--cream)
		}
	}
}

.maroon-button-border {
	
	a {
		border: solid var(--gray) 1px;
	}
}

.maroon-background-button {
	
	a {
		background-color: var(--maroon);
		color: var(--cream);
		
		&:hover {
			background-color: var(--green);
		}
	}
}

.black-button {
	
	a {
		color: var(--darkbrown);
		background-color: transparent;
		border: solid var(--darkbrown) 2px;
		position: relative;
		
		&:hover {
			background-color: var(--maroon);
			color: var(--cream);
		}
	}
}

.cream-button {
	
	a {
		color: var(--cream);
		background-color: transparent;
		border: solid var(--cream) 2px;
		
		&:hover {
			background-color: var(--darkbrown);
			border: solid var(--darkbrown) 2px;
		}
	}
}

.green-button {
	
	a {
		color: var(--cream);
		background-color: var(--green);
		
		&:hover {
			background-color: var(--maroon);
		}
	}
}

.brown-button {
	
	a {
		background-color: var(--brown);
		color: var(--cream);
		
		&:hover {
			color: var(--brown);
			background-color: var(--cream);
		}
	}
}

.cream-background-button {
	
	a {
		background-color: var(--cream);
		color: var(--brown);
		
		&:hover {
			background-color: var(--brown);
			color: var(--cream);
		}
	}
}

.red-button {
	
	a {
		background-color: var(--red);
		color: var(--cream);
		
		&:hover {
			background-color: var(--cream);
			color: var(--red);
		}
	}
}

/* .paragraph--type--rv-model-bottom-section, .container-rv-models, .paragraph--type--call-section, .paragraph--type--features-pictures, .paragraph--type--rv-models, .regulation-page {
	
	.container-two-button {
		display: flex;
		justify-content: space-between;
		max-width: 22em;
		margin: 0 auto;
		align-items: center;
	}
	
	.button {
		margin: 2em 0;
	}
} */

@media screen and (min-width: 750px) {
	
	.container-two-button, .container-two-button-bigger {
		display: flex;
		justify-content: space-between;
		max-width: 20em;
		margin: 2em auto;
	}
	
	.container-two-button-bigger {
		max-width: 25em;
		margin: 0 auto 2em;
	}
}
/* -------------------- BORDER LINE STYLES ---------------------- */
.border-line:after {
	content: '';
	position: absolute;
	top: -6px;
	bottom: 0;
	left: 10%;
	right: 10%;
	height: 12px;
	max-width: 1313px;
	margin: 0 auto;
	background-color: var(--red);
}

.border-line.border-line-green:after {
	background-color: var(--green);
}

.border-line.border-line-light-brown:after {
	background-color: var(--brown);
}

.border-line.border-line-brown:after {
	background-color: var(--darkbrown);
}

.border-line.border-line-maroon:after {
	background-color: var(--maroon);
}

.border-line.border-line-cream:after {
	background-color: var(--cream);
}
/* -------------------- HEADER STYLES ---------------------- */
header {
	padding: 1em;
	background-color: var(--maroon);
	-webkit-box-shadow: 0px 5px 3px 0px #000000;
	box-shadow: 0px 0px 13px 4px #00000094;
	position: relative;
	z-index: 7;
	
	h3, a {
		font-family: var(--marseille);
	}
}

#block-trailhead-site-branding {
	width: 65%;
	max-width: 15em;
	margin: 2em auto 0;
	position: relative;
	z-index: 8;
}

#block-trailhead-headerbanner {
	position: absolute;
	z-index: 5;
	left: 50%;
	transform: translateX(-50%);
	width: 102%;
	top: 0;
	font-size: .7em;
	background-color: var(--maroon);
	color: var(--cream);
	
	h3 {
		width: 90%;
		margin: .5em auto 0;
	}
	
	a {
		color: var(--cream);
		
		&:hover {
			color: var(--lightcream);
		}
	}
}

.page-node-type-modular-pages, .page-node-type-modular-main-page {
	
	.sidenav, header, #block-trailhead-headerbanner {
		background-color: var(--brown);
		
		.tbm.tbm-main, .tbm-submenu, .tbm.tbm-main a, .tbm.tbm-main span {
			background-color: var(--brown) !important;
		}
	}
}

@media screen and (min-width: 750px) {
	
	header {
		padding: 1.2em 1em 1em;
		
		> div {
			display: flex;
			flex-direction: row-reverse;
			justify-content: space-between;
			max-width: 1650px;
			margin: auto;
		}
		
		#block-trailhead-site-branding {
			width: 17%;
			max-width: 12em;
			margin: 0;
			padding: 0;
			margin: auto;
		}
		
		#block-trailhead-mainnavigation {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		width: 83%;
		padding: 1em 0 1em 1em;
		font-size: 1em;
		
			.tbm.tbm-main, .tbm-submenu {
				background-color: var(--maroon);
				width: 100%;
				
				.tbm-nav {
					justify-content: space-between;
				}
				
				.tbm-item {
					border: none;
					
					a, span {
						color: var(--cream);
						background-color: var(--maroon);
						font-weight: 600;
						padding: .5em 0;
						
						&:hover {
							background-color: transparent;
							color: var(--lightcream);
						}
					}
				}
				
				.tbm-item.level-1.button { 
					
					a {
						padding: .5em 1em;
						color: var(--maroon);
						background-color: var(--cream) !important;
						font: min(1.8vw, 1em);
						
						&:hover {
							background-color: var(--lightcream) !important;
						}
					}
				}
				
				.tbm-item--has-dropdown {
					position: relative;
					
					.tbm-submenu {
						width: 8em;
					}
					
					.tbm-link.level-2 {
						align-items: center;
						display: flex !important;
						flex-direction: row-reverse;
						
						&::before {
							margin: 0.25rem 0 0 .3rem;
						}
					}
					
					.sub-dropdown-menu {
						width: 10em;
					}
				}
				
				.dropdown-2 {
					
					.tbm-submenu {
						width: 14em;
					}
				}
				
				.level-2 {
					width: fit-content;
				}
			}
		}
	}
}

@media screen and (min-width: 900px) {
	
	.margin-right {
		margin-right: 7%;
	}
	
	.margin-left {
		margin-left: 5%;
	}
}

@media screen and (min-width: 1150px) {
	
	#block-trailhead-mainnavigation {
		font-size: 1.4em !important;
	}
}
/* -------------------- MOBILE MENU STYLES ---------------------- */
#block-trailhead-mobilemenu {
	position: absolute;
	right: 1em;
	top: 1em;
	z-index: 10;
	
	@media screen and (min-width: 750px) {
		display: none;
	}
}


.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
	background-color: var(--cream) !important;
}


.hamburger--spin.is-active {
	
	.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
		background-color: var(--cream) !important;
	}
}


.hamburger--spin.is-active {
	position: relative;
	z-index: 1;
}


.sidenav {
  height: 100%; /* 100% Full-height */
  width: 100%; /* 0 width - change this with JavaScript */
  left: -100%;
  position: fixed; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 0; 
  background-color: var(--maroon);
  overflow-x: hidden; /* Disable horizontal scroll */
  /*padding-top: 60px; /*Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
  -webkit-box-shadow: 3px 0px 5px 0px rgba(0,0,0,0.39);
  -moz-box-shadow: 3px 0px 5px 0px rgba(0,0,0,0.39);
  box-shadow: 3px 0px 5px 0px rgba(0,0,0,0.39);
  text-align: center;
  
  
  p {
	position:  relative;
  }
  
  a {
	position: relative;
  }
  
  ul {
		list-style: none;
		padding: 0;
		margin: -1em auto 1em;
		width: 50%;
		
		li {
			margin: .5em 0;
		}
		
		a {
			font-size: 4vw;
			width: 50%;
			margin: auto;
			
			&:after {
				content: '';
				position: absolute;
				top: 50%;
				bottom: 0;
				left: 10%;
				background-color: #F3DBAE;
				width: .5em;
				height: .5em;
				border-radius: 50%;
				transform: translate(-200%, -50%);
			}
		}
	}
}


.sidenav a {
  padding: 0.5em 32px 0.5em 32px;
  text-decoration: none;
  font-size: 6vw;
  color: var(--cream);
  display: block;
  transition: 0.3s;
  text-transform: uppercase;
}

.sidenav img {
	width: 75%;
	margin: auto;
}


.sidenav a:hover {
  color: var(--lightcream);
}


#main {
  transition: margin-left .5s;
  padding: 20px;
}


.closebtn {
	font-size: 18vw !important;
	margin-top: -1em;
	margin-bottom: -0.5em;
	font-family: var(--pfmarket);
}


@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

.menu-phone {
	font-weight: bold;
	font-size: 10vw !important;
}


body.mobile-menu-open #mySidenav {
	left: 0;
}
/* -------------------- GENERAL PAGE BANNER STYLES ---------------------- */
.custom-banner-fixed:after, .banner-image:after {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #00000073;
}
/* -------------------- HOME PAGE BANNER STYLES ---------------------- */
.layout-hero-section {
	color: var(--cream);
	position: relative;
	font-size: 3vw;
	
	h1 {
		font-weight: 300;
		margin-bottom: -.3em;
		
		span {
			font-weight: 700;
		}
	}
	
	h1, h3, a {
		font-family: var(--marseille);
		position: relative;
	}
}

.layout-hero-section.layout-hero-section-dark-text, .layout-hero-section-dark-text {
	color: var(--darkbrown);
	
	.modular-text-banner {
		
		h1 {
			font-weight: 900;
		}
	}
}

.container-home-text-banner {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 5%;
	width: 80%;
	max-width: 1450px;
	background: rgba(253, 248, 239, 0.70);
	border-radius: 5px;
	z-index: 4;
}

.right-corner-piece, .custom-right-corner-piece {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 30%;
	max-width: 42rem;
	z-index: 3;
}

.container-two-button.hero-image-buttons {
	display: flex;
	justify-content: space-between;
	margin: auto;
	max-width: min(61%, 19em);
	
	a {
		position: relative;
		padding: .5em 1.5em .5em 1em;
	}
	
	a:before {
		content: '';
		position: absolute;
		border-right: 2px solid var(--cream);
		border-top: 2px solid var(--cream);
		height: .5em;
		width: .5em;
		transform: rotate(45deg) translateY(-50%);
		right: .7em;
		top: 46%;
	}
}

@media screen and (min-width: 750px) {
	
	.layout-hero-section {
		font-size: 1.25em;
	}
	
	.container-home-text-banner {
		padding: 0 .5em;
	}
}

@media (min-width: 950px) {
	
	.layout-hero-section {
		
		h1 {
			font-size: min(3.5vw, 50px);
		}
		
		p {
			font-size: min(2.3vw, 23px);
		}
	}
	
	.container-home-text-banner {
		bottom: 10%;
	}
}
/* -------------------- LANDING PAGE BANNER STYLES ---------------------- */
.layout-hero-section.landing-page-banner {
	
	h1 {
		font-weight: 700;
		font-size: min(4.3vw, 50px);
		margin-top: 0;
	}
	
	.container-home-text-banner {
		box-sizing: border-box;
		padding: .6em;
		color: var(--darkbrown);
		
		.sub-heading-text {
			font-size: min(2.5vw, 23px);
			font-weight: 500;
		}
	}
	
	.es-badge-container {
		flex-direction: row;
		padding: .2em;
		width: min(88%, 15rem);
		justify-content: space-between;
		flex: none;
		
		.fTmTVa {
			width: 16px;
		}
	}
	
	.es-badge-sources-container {
		display: none;
	}
	
	.RatingValue__Container-sc-e029c8df-0.JGOmT {
		font-size: min(4vw, 22px) !important;
	}
}

.container-home-text-banner.landing-page-quote {
	
	h1 {
		margin: 1em auto;
	}
}

.landing-page-get-quote-heading {
	margin: 0;
}
/* -------------------- FIXED BANNER STYLES ---------------------- */
.layout-hero-section.pages-fixed-banner {
	font-size: 5vw;
}

.container-custom-banner-fixed {
	padding: 3em 0;
	
	h1 {
		font-weight: 900;
	}
	
	h3 {
		margin-top: .3em;
		font-weight: 100;
	}
}

.custom-right-corner-piece {
	max-width: 23rem;
}

.models-image {
	background-image: url(/sites/default/files/styles/desk_custom_page_banner/public/2023-10/Models_banner.jpg.webp?itok=Ar0Nm7ml);
}

.about-image {
	background-image: url(/sites/default/files/styles/desk_custom_page_banner/public/2023-10/Banner.jpg.webp?itok=uUo5XEGN);
}

.contact-image {
	background-image: url(/sites/default/files/styles/desk_custom_page_banner/public/2023-10/Banner_image.jpg.webp?itok=NJTR7Zfj);
}

.durango-image {
	background-image: url(/sites/default/files/styles/images/public/2024-06/the_durango_2_0.jpg.webp?itok=lvWa-IaT);
}

.homesteader-image {
	background-image: url(/sites/default/files/styles/desk_house_type_banner/public/2024-03/the_homesteader_2.jpg.webp?itok=iUjpq7Pl);
}

.rancher-image {
	background-image: url(/sites/default/files/styles/desk_house_type_banner/public/2024-03/the_rancher_2.jpg.webp?itok=8Fh_uoG_);
}

.lariat-image {
	background-image: url(/sites/default/files/styles/desk_house_type_banner/public/2024-03/the_lariat_2.jpg.webp?itok=tUjBFpvG);
}

.pioneer-image {
	background-image: url(/sites/default/files/styles/desk_house_type_banner/public/2024-12/IMG_5427.jpg.webp?itok=tdCL4THl);
}

.laramie-image {
	background-image: url(/sites/default/files/styles/desk_house_type_images/public/2024-06/ff2106172-2001%20copy.jpg.webp?itok=UBX72tr4);
}

.cherokee-a-image {
	background-image: url(/sites/default/files/styles/desk_house_type_banner/public/2024-03/the_cherokee_a.jpg.webp?itok=a1EWlQ_p);
}

.cherokee-b-image {
	background-image: url(/sites/default/files/styles/desk_house_type_banner/public/2024-03/the_cherokee_a.jpg.webp?itok=a1EWlQ_p);
}

.lakota-image {
	background-image: url(/sites/default/files/styles/desk_house_type_banner/public/2024-03/the_lakota.jpg.webp?itok=1AreXqms);
}

.mohawk-image {
	background-image: url(/sites/default/files/styles/desk_custom_page_banner/public/2024-06/mohawk_banner_0.jpg.webp?itok=kKkplRWR);
}

.shawnee-image {
	background-image: url(/sites/default/files/styles/desk_home_page_banner/public/2024-11/SIGP0218_Nov2024_Shawnee.jpg.webp?itok=5OJhZYu7);
}

.custom-banner-fixed {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	position: fixed;
	width: 100%;
	top: 0;
	height: 44rem;
}

@media (min-width: 750px) {
	
	.layout-hero-section.pages-fixed-banner {
		font-size: 2.4em;
	}
	
	.custom-banner-fixed {
		height: 41rem;
	}
}
/* -------------------- ICON PAGE BANNER STYLES ---------------------- */
.background-dots {
	position: fixed;
	top: 17%;
	width: 120%;
	z-index: 1;
}

@media screen and (min-width: 750px) {
	
	.background-dots {
		max-width: 950px;
		top: 61%;
		left: 50%;
		transform: translate(-50%, -60%);
	}
}
/* -------------------- HOUSE TYPE BANNER STYLES ---------------------- */
.header-section {
	position: relative;
	font-size: 5.5vw;
	
	.banner-text {
		position: absolute;
		background-color: #3f492fa8;
		color: var(--cream);
		padding: .5em;
		border-radius: 0.2em;
		width: 87%;
		margin-top: -13em;
		margin-left: 2.5%;
		
		h1 {
			margin: .1em auto .5em;
			font-weight: 700;
		}
		
		p {
			font-size: .8em;
			font-style: italic;
			line-height: 1.5em;
		}
	}
}

@media screen and (min-width: 750px) {
	
	.header-section {
		font-size: 3vw;
		
		.banner-text {
			padding: .5em 1em;
			max-width: 19em;
			margin-top: -9em
		}
	}
}

@media screen and (min-width: 1150px) {
	
	.header-section {
		font-size: 2.1em;
	}
}

@media screen and (min-width: 1500px) {
	
	.header-section {
		
		.banner-text {
			margin-left: 11%;
			margin-top: -10.5em;
		}
	}
}

@media screen and (min-width: 2500px) {
	
	.header-section {
		
		.banner-text {
			margin-top: -11em;
		}
	}
}
/* -------------------- BLAG PAGE BANNER STYLES ---------------------- */ 
.blog-banner-heading {
	color: var(--cream);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 4;
	text-align: center;
	font-weight: 800;
	font-size: min(3vw, 1.6em);
}
/* -------------------- HOME PAGE STYLES ---------------------- */
.path-modulars-landing {
	
	.paragraph--type--modular-pages {
		
		img {
			aspect-ratio: 160 / 170;
		}
	}
}

/* .green-background {
	
	.container-icon-text-column {
		
		hr {
			background-color: var(--brown);
		}	
	}
} */

/* .container-trailhead-value-section {
	
	hr {
		background-color: var(--brown);
	}
	
	.value-cards {
		font-size: 1.2em;
		max-width: 11em;
	}
	
	.why-icons {
		max-width: 78px;
		width: 30%;
		margin: auto;
		
		img {
			border-radius: 0 !important;
		}
	}
} */

.layout-value-cards {
	color: var(--cream);
	
	hr {
		background-color: var(--brown);
	}
}

.value-cards {
	max-width: 12em;
	margin: 3em auto;
	width: 45%;
	
	p {
		color: var(--cream) !important;
		font-size: 1.2em;
	}
	
	.why-icons {
		width: 30%;
		max-width: 3em;
	}
	
	/* h2 {
		font-family: var(--pfmarket) !important;
		color: var(--brown);
	} */
	
	/* img {
		border-radius: 50%;
	} */
}

.layout-reason-list {
	
	.value-cards {
		width: 28%;
		
		h2 {
			color: var(--maroon);
			font-family: var(--pfmarket) !important;
			font-weight: 500;
		}
		
		img {
			border-radius: 50%;
		}
	}
}

.layout-testimonial-review-content {
	color: var(--brown);
}

.layout-order-steps {
	color: var(--maroon);
	
	.container-order-steps {
		padding: 1em 0;
	}
	
	.block-order-process {
		margin: 2em auto 3em;
		width: 50%;
		max-width: 10em;
		
		p {
			color: var(--maroon) !important;
		}
		
		.process-number--text {
			display: flex;
			justify-content: space-between;
			align-items: center;
			height: 5em;
			width: 8.5em;
			margin: auto;
			
			h2 {
				color: var(--moroon);
			}
			
			.process-number {
				color: var(--darkbrown) !important;
				font-family: var(--pfmarket) !important;
				font-size: 5.5em;
			}
		}
	}
}

.layout-flex-image-text {
	text-align: right;
	
	.text-width {
		padding: 1em;
		display: flex;
		flex-direction: column;
	}
	
	h2, h3 {
		color: var(--darkbrown);
	}
}

.layout-flex-image-text.layout-flex-image-text-left {
	text-align: left;
}

.layout-seo-text {
	
	h2, h3, p {
		color: var(--darkbrown);
	}
}

@media (min-width: 750px) {
	
	.container-value-cards, .container-order-steps {
		display: flex;
		justify-content: space-between;
	}
}

@media (min-width: 900px) {
	
	.layout-flex-image-text {
		display: flex;
		justify-content: space-between;
		
		.image-width {
			width: 60%;
		}
		
		.text-width {
			width: 40%;
		}
	}
	
	.layout-flex-image-text-left {
		flex-direction: row-reverse;
	}
}
/* -------------------- LANDING PAGE STYLES ---------------------- */
.rv-section-cream-text {
	
	img {
		width: 80%;
		margin: 1em auto;
		max-width: 540px;
	}
}

.cream-text {
	
	h2, p {
		color: var(--cream) !important;
	}
}

.container-two-column-flex {
	width: 80%;
	margin: 3em auto 4em;
}

.container-testimonial-section {
	width: 80%;
	margin: 1em auto 2em;
	
	h2, p {
		font-family: var(--marseille);
		font-weight: 700;
		color: var(--brown) !important;
		text-align: center;
	}
	
	p {
		margin: 0;
	}
	
	.quotation-mark {
		text-align: center;
		position: relative;
		content: "\201C";
		font-size: 2em;
		font-family: cursive;
		color: var(--brown);
	}
	
	.quotation-mark-top {
		margin: -.5em 0;
	}
	
	.quotation-mark-top:before, .quotation-mark-top:after {
		content: '';
		position: absolute;
		top: 35%;
		height: 3px;
		width: 45%;
		background-color: var(--brown);
		left: 0;
	}
	
	.quotation-mark-top:after {
		left: 55% !important;
	}
	
	.quotation-mark-bottom {
		transform: rotate(180deg);
		margin: -.5em 0;
	}
	
	.quotation-mark-bottom:before, .quotation-mark-bottom:after {
		content: '';
		position: absolute;
		top: 35%;
		height: 3px;
		width: 45%;
		background-color: var(--brown);
		left: 0;
	}
	
	.quotation-mark-bottom:after {
		left: 55% !important;
	}
}

.dark-brown-text {
	
	.paragraph--type--modular-process-section {
		
		h2, p {
			color: var(--darkbrown) !important;
		}
	}
}

.service-icons {
	width: 5em;
	margin: auto;
	
	img {
		aspect-ratio: 1 / 1;
		object-fit: contain;
		margin: auto;
		border-radius: 0 !important;
	}
}

.exterior-image {
	
	h2 {
		color: var(--brown);
	}
}

.mini-gallery {
	
	.container-interior-pictures {
		
		> div {
			
			img {
				border: none;
			}
		}
	}
}

.landing-page-benefit-section {
	
	ol {
		margin: 1em 0 3em;
	}
	
	li {
		color: var(--cream);
		margin: 1em 0;
	}
}

@media (min-width: 750px) {
	
	.layout-two-column-flex {
		display: flex;
		justify-content: space-between;
	}
	
	.container-two-column-flex {
		margin: 2em auto 2em;
		width: 45%;
	}
	
	.mini-gallery {
		
		.container-interior-pictures {
			
			> div {
				width: 29.5%;
			}
		}
	}
}

@media (min-width: 900px) {
	
	.container-landing-page-testimonial-video-section {
		display: flex;
		justify-content: space-between;
		max-width: 885px;
		margin: 0em auto 3em;
		
		.container-videos {
			margin: 0;
			width: 100%;
			
			iframe {
				height: min(28vw,13.3em);
			}
		}
	}
	
	.container-testimonial-section {
		max-width: 15em;
		margin: 0 0 0 1em;
		
		h2 {
			margin-top: 0;
		}
	}
}
/* -------------------- RV MODELS MAIN PAGE STYLES ---------------------- */
/* .h2-cream-color {
	
	h2 {
		color: var(--cream);
	}
} */

.layout-main-page-rv-models {
	
	h2, p {
		color: var(--cream) !important;
	}
}

.container-main-page-rv-models {
	margin: 1em 1em 4em;
	
	.button {
		margin: 1.5em 0 .5em;
		text-align: center;
	}
}

/* .brown-value-section {
	
	.paragraph--type--modular-why-trailhead {
		
		h2 {
			color: var(--brown) !important;
		}
		
		.block-order-process {
			max-width: 8em;
			
			p {
				color: var(--brown) !important;
			}
		}
	}
} */

/* .red-number-section {
	
	.paragraph--type--modular-process-section {
		
		hr {
			background-color: var(--darkbrown);
		}
		
		.container-block-order-process {
			
			.process-number {
				color: var(--darkbrown) !important;
			}
		}
	}
} */

.container-flex-image-text.container-flex-image-text-left.green-text-section  {
	
	.paragraph--type--modular-why-trailhead {
		
		h2, p {
			color: var(--green) !important;
		}
	}
}

.green-text-section {
	
	.paragraph--type--modular-why-trailhead {
		
		.seo-close {
			
			h2, p {
				color: var(--green) !important;
			}
		}
	}
}

@media (min-width: 900px) {
	
	.container-main-page-rv-models {
		display: flex;
		justify-content: space-between;
		max-width: 1150px;
		margin: 1em auto 4em;
		
		.button {
			text-align: left;
		}
	}
	
	.main-page-rv-models-image {
		width: 49%;
		max-width: 25em;
	}
	
	.main-page-rv-models-text {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		width: 49%;
		
		h2 {
			margin: 0;
		}
		
		p:first-child {
			margin-top: 0;
		}
	}
}
/* -------------------- RV MODELS PAGE STYLES ---------------------- */
.container-rv-models {
	
	h2 {
		color: var(--brown);
	}
	
	ul {
		color: var(--green);
		margin-top: 2em;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 22em;
		margin: auto;
		
		li {
			width: 45%;
			margin: .25em 0;
		}
	}
	
	img {
		border-radius: .3em;
	}
	
	#get-pricing-button {
		margin: 2em auto 3em;
	}
}

.container-house-features {
	
	h2 {
		color: var(--green);
		font-weight: 500;
	}
	
	p {
		font-weight: 300;
	}
}


/* .paragraph--type--modular-additional-options {
	
	li {
		font-weight: 100;
	}
} */

/* .paragraph--type--rv-model-bottom-section {
	
	h2 {
		color: var(--green);
	}
} */
/* ---------- PRICING BUTTON ------------ */
.layout-pricing-section {
	position: relative;
	z-index: 4;
}


.container-pricing {
	position: absolute;
	text-align: center;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 0%;
	min-width: 0;
	height: 0;
	min-height: 12em;
	opacity: 0;
	overflow: hidden;
	background-color: transparent;
	padding: 2em 0 0;
	transition: .4s;
	
	h1, p {
		color: var(--cream) !important;
	}
}


.container-pricing.open {
	width: 100%;
	height: auto;
	min-height: 12em;
	min-width: 20em;
	opacity: 1;
	background-color: var(--maroon);
}


#get-pricing-button {
	background-color: var(--maroon);
	color: var(--cream) !important;
	cursor: pointer;
	font-family: var(--marseille);
	font-weight: 900;
	width: 6em;
	padding: .5em 1em;
	border-radius: .2em;
	transition: .3s;
	
	&:hover {
		background-color: var(--green);
	}
}

#close-button:hover {
	text-decoration: underline;
	cursor: pointer;
}

@media (min-width: 900px) {
	
	.container-house-features {
		display: flex;
		margin-bottom: 3.5em;
		
		.align-center {
			width: 50%;
		}
		
		.text-section {
			width: 48%;
			margin-left: 1em;
		}
		
		h2 {
			margin-top: 0;
			text-align: left;
		}
	}
	
	.container-pricing.open {
		min-width: 25em;
	}
}

@media (min-width: 1150px) {
	
	.container-house-features {
		
		.align-center {
			width: 40%;
		}
		
		.text-section {
			width: 52%;
		}
	}
	
	/* .paragraph--type--modular-additional-options {
		
		ul {
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
			
			li {
				width: 48%;
				margin: .25em 0;
			}
		}
	} */
}
/* ------------ MAIN MODULAR PAGE STYLES ------------ */
.container-modular-main-page {
	
	h2, p {
		color: var(--cream) !important;
	}
}

.container-why-choose-product {
	
	h2 {
		color: var(--darkbrown);
	}
	
	hr {
		width: 75%;
		max-width: 956px;
		height: 2px;
		border: none;
		background-color: var(--cream);
	}
	
	.block-order-process {
		font-size: 1.2em;
		
		p {
			color: var(--darkbrown) !important;
			font-weight: 500;
		}
	}
}

/* .container-main-modular-page-process {
	
	h2 {
		color: var(--maroon) !important;
	}
	
	hr {
		background-color: var(--darkbrown) !important; 
	}
	
	.block-order-process {
		
		h2, p {
			color: var(--maroon) !important;
		}
		
		.process-number {
			color: var(--darkbrown) !important;
		}
	}
} */

@media (min-width: 750px) {
	
	.layout-house-types {
		display: flex;
		justify-content: space-between;
		max-width: 1100px;
		margin: auto;
	}
	
	.container-modular-main-page {
		
		.house-type-section {
			width: 40%;
			margin: 2em 0 0;
			max-width: 20em;
		}
	}
}
/* ------------ MODULAR PAGE STYLES ------------ */
.body-section {
	
	h2 {
		color: var(--darkbrown);
	}
}

.exterior-image, .container-interior-pictures {
	
	> div {
		width: 46%;
		margin: .5em;
	}
	
	img {
		border: solid 3px var(--maroon);
		box-sizing: border-box;
	}
}

.exterior-image {
	margin: .5em;
	
	> div {
		width: 100%;
		margin: 0;
	}
}

.container-interior-pictures {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

/* .paragraph--type--features-pictures {
	
	.specification-text {
		
		h3 {
			text-align: left;
			color: var(--darkbrown);
		}
		
		p {
			color: var(--green) !important;
		}
	}
} */

@media (min-width: 750px) {
	
	.container-interior-pictures {
		
		> div {
			width: 21.5%;
		}
	}
}

@media (min-width: 900px) {
	
	.specification-text {
		
		ul {
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
			margin: 1em auto 2em;
			
			li {
				width: 43%;
			}
			
			p {
				margin: .5em 0;
			}
		}
	}
}

@media (min-width: 1350px) {
	
	.container-interior-pictures {
		
		> div {
			width: 23%;
		}
	}
}
/* ----------------- MAIN GALLERY PAGE STYLES ----------------- */
.layout-main-gallery {
	
	header {
		color: var(--maroon);
		background-color: transparent;
		box-shadow: none;
		padding: 0 1em 1em;
	}
	
	.views-view-responsive-grid--horizontal {
		margin: 0 0 4em;
	}
}

.views-exposed-form {
	background-color: transparent;
	padding: 0 1em 1em;
	width: 16em;
	position: relative;
	z-index: 9;
	
	select, input {
		margin: 1em 0 0 auto !important;
		text-align: center;
		transition: .3s;
		width: 100%;
		border: solid var(--gray) 1px;
		padding: .5em;
		border-radius: .5em;
		background-color: var(--cream);
		color: var(--maroon);
		font-weight: 700;
		font-size: max(16px, .8em);
		
		&:hover {
			cursor: pointer;
			background-color: var(--lightcream);
		}
	}
	
	.js-form-item {
		text-align: right;
		
		label {
			display: flex;
			color: var(--maroon);
			font-size: 1.5em;
		}
	}
}

@media (min-width: 750px) {
	
	.layout-main-gallery {
		
		.views-view-responsive-grid--horizontal {
			--views-responsive-grid--column-count: 4 !important;
		}
	}
}

@media (min-width: 850px) {
	
	.views-exposed-form {
		width: 11em;
		margin: -4.5em 0 1em auto;
		
		.js-form-item {
			
			label {
				justify-content: flex-end;
			}
		}
	}
}
/* -------------------- BLOG PAGE VIEW STYLES ------------------- */
.layout-blog-posts-block {
	font-family: sans-serif;
	
	header {
		background-color: transparent;
		box-shadow: none;
		padding: 1em 1em 0 0;
		z-index: 3;
	}

	.views-field-body {
		
		a {
			position: relative;
			text-decoration: underline;
			color: var(--darkbrown);
			z-index: 1;
		}
	}
	
	.views-row, .views-view-responsive-grid__item {
		position: relative;
		transition: .2s;
		background-color: var(--lightgray);
		margin: .0 .8em 1em;
		border-radius: .3em;
		
		&:hover {
			background-color: var(--cream);
			border-radius: .3em;
			box-shadow: 2px 3px 10px 0px rgba(127, 127, 127, 0.782);
		}
		
		img {
			border-radius: .3em .3em 0 0;
		}
	}
	
	/* .paragraph--type--blog-banner-and-heading {
		
		.custom-right-corner-piece, .blog-banner-heading, .banner-image:after {
			display: none;
		}
	} */
	
	.views-field-title {
		margin-top: 1em;
		padding: 0 1em;
		
		a {
			color: var(--darkbrown);
		}
	}
	
	.views-field-body {
		padding: 0 1em 1em;
	}
	
	.views-view-responsive-grid__item:hover a:after, .views-row:hover a:after {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 5;
	}
}

@media (min-width: 900px) {
	
	.layout-blog-posts-block {
		
		.views-view-responsive-grid.views-view-responsive-grid--horizontal {
			--views-responsive-grid--column-count: 3 !important;
		}
	}
}
/* -------------------- BLOG PAGE STYLES ------------------- */
.paragraph--type--blog-banner-and-heading {
	position: relative;
}

.layout-blog-posts-block {
	
	.blog-banner-heading, .custom-right-corner-piece {
		display: none;
	}
	
	.banner-image:after {
		display: none
	}
}

.blog-page-body {
	margin-top: -3em;
	font-family: sans-serif;
	
	h2, h3 {
		color: var(--darkbrown);
	}
	
	li {
		
		h3 {
			margin-bottom: 0;
		}
		
		p {
			margin-top: 0;
		}
	}
	
	a {
		color: var(--brown);
		transition: .3s;
		position: relative;
		text-decoration: underline;
		text-decoration-color: var(--brown);
		
		&:hover {
			color: var(--darkbrown);
			text-decoration-color: var(--darkbrown);
		}
	}
	
	li {
		margin: 1em 0;
	}
}
/* -------------------- USE CASES PAGE STYLES ---------------------- */ 
/* -------------------- ICON PAGE STYLES ---------------------- */ 
.container-icon-page {
	margin: 3em auto 2em;
	
	h2 {
		font-weight: 400;
	}
	
	h1 {
		font-weight: 800;
	}
	
	p {
		color: var(--brown) !important;
		font-style: italic;	
	}
	
	hr {
		width: 80%;
		background-color: var(--gray);
	}
	
	.icon-text-section {
		width: 57%;
		margin: 20% auto;
		
		h2 {
			margin: 0 auto -.5em;
		}
		
		img {
			object-fit: contain;
			aspect-ratio: 1147 / 543;
		}
	}
}

.custom-right-corner-piece-2 {
	width: 20%;
	top: 3em;
	bottom: auto;
}

.call-section {
	position: relative;
	z-index: 3;
	
	h2 {
		color: var(--cream);
	}
}

@media (min-width: 750px) {
	
	.container-icon-page {
		max-width: 670px;
		
		hr {
			width: 80%;
		}
		
		img {
			max-width: 18em;
			margin: auto;
			display: block;
		}
		
		.icon-text-section {
			width: 90%;
		}
	}
	
	.custom-right-corner-piece-2 {
		max-width: 11rem;
	}
}
/* -------------------- ABOUT PAGE STYLES ---------------------- */ 
.container-image-text-flex {
	img {
		margin: 1em 0;
		border-radius: .2em;
		-webkit-box-shadow: 2px 5px 10px -1px rgba(0,0,0,0.4); 
		box-shadow: 2px 5px 10px -1px rgba(0,0,0,0.4);
	}
}

@media (min-width: 750px) {
	
	.container-image-text-flex {
		display: flex;
		justify-content: space-between;
		margin: 1em 0;
		
		.align-center {
			width: 40%;
		}
		
		.text-section {
			width: 60%;
			margin-left: 3%;
		}
	}	
}
/* -------------------- ABOUT TRAILHEAD AND SEO BLOCK SECTION STYLES ---------------------- */
/* .container-seo-block-dropdown, .container-flex-image-text {
	
	.paragraph--type--modular-why-trailhead {
		
		h2, p, ul {
			color: var(--green) !important;
		}
		
		h2 {
			margin-bottom: -.5em;
			margin-top: 1em;
		}
	}
} */

.container-flex-image-text {
	
	h2, p {
		text-align: right;
	}
	
	.text-width {
		padding: 1em;
		box-sizing: border-box;
	}
}

/* .container-flex-image-text.container-flex-image-text-left {
	
	.paragraph--type--modular-why-trailhead {
		
		h2, p, ul {
			color: var(--cream) !important;
		}
	}
	
	h2, p {
		text-align: left;
	}
} */

.click-learn-more {
	cursor: pointer;
	box-sizing: border-box;
	font-family: var(--marseille);
	text-align: center;
	width: 8em;
	font-weight: 700;
	padding: .5em 1em;
	border-radius: .2em;
	transition: .3s;
	margin-top: auto;
}

.cream-button-dropdown {
	background-color: var(--maroon);
	color: var(--cream) !important;
	
	&:hover {
		background-color: var(--green);
		color: var(--cream) !important;
	}
}

.green-button-dropdown {
	background-color: var(--green);
	color: var(--cream) !important;
	
	&:hover {
		background-color: var(--maroon);
		color: var(--cream) !important;
	}
}

#seo-section-dropdown {
	max-height: 0;
	opacity: 0;
	transition: .4s;
	overflow: hidden;
	
	h2, p {
		text-align: left;
	}
	
	h2 {
		margin-bottom: .2em;
	}
	
	p {
		margin-top: 0;
	}
}

#seo-section-dropdown.seo-open {
	max-height: 1200px;
	opacity: 1;
	padding: 0 1em 1em;
}

@media (min-width: 900px) {
	
	/* .container-flex-image-text {
		
		.paragraph--type--modular-why-trailhead {
			
			> div {
				display: flex;
				justify-content: space-between;
			}
		}
		
		.image-width {
			width: 60%;
		}
		
		.text-width {
			width: 40%;
		}
	}
	
	.container-flex-image-text.container-flex-image-text-left {
		
		.paragraph--type--modular-why-trailhead {
			
			> div {
				flex-direction: row-reverse;
			}
		}
		
		.image-width {
			width: 40%;
		}
		
		.text-width {
			width: 60%;
		}
	} */
}
/* -------------------- FINANCE PAGE STYLES ---------------------- */ 
.container-financing-section {
	position: relative;
	padding-top: 1.5em;
	border-top: solid #756459 3px;
}

.container-bank-logos {
	display: flex;
	justify-content: space-between;
}

.container-financing-section:before {
	position: absolute;
	content: '';
	width: 3px;
	background-color: #756459;
	right: 0;
	height: 3.8em;
	top: 0;
}

.container-financing-section:after {
	position: absolute;
	content: '';
	width: 3px;
	background-color: #756459;
	left: 0;
	height: 3.8em;
	top: 0;
}

.bank-logos.div-bank-logos {
	width: 30%;
}

.bank-logos {
	width: 35%;
	margin-bottom: .5em;
	
	img {
		width: 80%;
		margin: auto;
		max-width: 10em;
	}
}

.container-financing-heading--checkbox {
	display: flex;
	margin: .5em 0;
}

.financing-list-heading {
	width: 30%;
	background-color: #756459;
	color: #F3DBAE;
	padding: 1em .5em;
	margin: 0;
	font-weight: 600;
	font-size: 1.2em;
	box-sizing: border-box;
	align-content: center;
}

.financing-list-heading.financial-heading-right {
	background-color: #DDD3CA;
	color: #3C251A;
	display: flex;
	justify-content: center;
	width: 35%;
	align-items: center;
}

.checkbox, .astros {
	width: 35%;
	background-color: #DDD3CA;
	position: relative;
	box-sizing: border-box;
}

.checkbox-icon {
	position: relative;
	width: 2.2rem;
	height: 2.2rem;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	background-color: #3C251A;
	border-radius: .2em;
}

.right-column {
	border-radius: 0 .2em .2em 0;
}

.middle-column {
	border-right: solid 3px var(--darkbrown);
}

.checkbox-checkmark {
	border: solid #DDD3CA;
	border-width: 0px 5px 5px 0;
	transform: rotate(45deg);
	display: block;
	position: absolute;
	width: .5rem;
	height: 1.2rem;
	top: .2rem;
	left: .7rem;
}

.astros {
	font-weight: 900;
	font-size: 2em;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-wrap: wrap;
}

.astros.astros-bottom {
	align-content: center;
}

.container-button-financing {
	display: flex;
	justify-content: space-between;
}

.button-financing.div-button-financing {
	width: 30%;
}

.button-financing {
	text-align: center;
	width: 35%;
	
	a {
		display: flex;
		justify-content: center;
		border-radius: .3em;
		padding: .5em 0;
		color: #F3DBAE;
		background-color: #3C251A;
		font-weight: 600;
		transition: .2s;
		width: 9em;
		margin: auto;
		
		&:hover {
			color: #FDF8EF;
		}
	}
}

@media only screen and (min-width: 750px) {
	
	.astros {
		align-content: end;
	}
	
	.checkbox-icon {
		width: 3rem;
		height: 3rem;
	}
	
	.checkbox-checkmark {
		width: .8rem;
		height: 1.8rem;
		top: .2rem;
		left: 1rem;
	}
}
/* -------------------- INVENTORY PAGE STYLES ---------------------- */
.inventory-page-styles {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	
	header {
		background-color: var(--cream);
		box-shadow: none;
		z-index: 1;
		
		h1 {
			text-align: center;
			color: var(--darkbrown);
		}
	}
}

.inventory-rows {
	background-color: var(--lightcream);
	box-sizing: border-box;
	border-radius: .3em;
	padding: 1em 1em 1.5em;
	text-align: center;
	width: 48%;
	margin: 0 0 2em .5em;
	position: relative;
	
	.views-field-field-product-status {
		position: absolute;
		color: var(--lightcream);
		background-color: var(--brown);
		box-sizing: border-box;
		padding: .1em .5em;
		border-radius: .1em 0 0 0;
	}
	
	.views-field-field-product-page-hero-image {
		
		img {
			border-radius: .1em;
			box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25);
		}
	}
	
	.paragraph--type--product-model-heading {
		color: var(--maroon);
		padding: .5em 0 0;
		justify-content: center;
		
		h1 {
			font-size: min(5vw, 40px);
		}
		
		.pricing {
			display: none;
		}
	}
	
	.paragraph--type--product-page-specifications {
		margin: 0;
		
		h1, h2 {
			display: none;
		}
		
		p {
			color: var(--green) !important;
			margin: .2em 0;
		}
	}
	
	.views-field-nothing, .views-field-view-node-1 {
		margin: 1.5em 0 0;
		
		a {
			font-family: var(--marseille);
			background-color: var(--maroon);
			color: var(--lightcream);
			padding: .5em;
			border-radius: .3em;
			transition: .3s;
			font-weight: 700;
			
			&:hover {
				background-color: var(--green);
			}
		}
	}
}

@media (min-width: 1000px) {
	
	.inventory-rows {
		width: 30.5%;
		margin: 0 0 2em .6em;
	}
}

@media (min-width: 1700px) {
	
	.inventory-rows {
		width: 24%;
	}
}
/* -------------------- PRODUCT PAGE STYLES ---------------------- */
.product-page-layout-padding-text {
	font-size: 3vw;
	padding: 1em 6%;
	position: relative;
}

.product-status {
	font-weight: 600;
	color: var(--darkbrown);
}

.product-page-hero-section-layout {
	
	h1 {
		margin: 0;
	}
}

.paragraph--type--product-model-heading {
	color: var(--cream);
	display: flex;
	justify-content: space-between;
	padding: .8em 1em;
	align-items: center;
	
	.heading {
		
		h1 {
			font-family: var(--marseille);
			font-size: min(5vw, 40px);
		}
	}
}

.product-hero-image {
	margin: 0 0 1em;
}

.paragraph--type--product-media-section {
	
	.container-interior-pictures {
		
		> div {
			position: relative;
		}
		
		picture:after {
			transition: .3s;
			opacity: 0;
			position: absolute;
			content: '';
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			background-color: var(--lightcream);
		}
		
		> div:hover picture:after {
			opacity: .3;
		}
		
		img {
			border: none;
		}
	}
	
	.remote-video {
		
		iframe {
			width: min(1040px, 100%);
			height: clamp(150px, 48vw, 550px);
			display: block;
			margin: 1em auto;
		}
	}
}

#walk-through-video {
	display: flex;
	
	.remote-video {
		margin: 2em auto;
	}
}

.inventory-button {
	text-align: center;
	padding-bottom: 2em !important;
}

.paragraph--type--product-page-download-blueprint {
	max-width: 22em !important;
	align-items: center;
	margin: 1.5em auto 1em !important;
	
	p {
		margin: 0 !important;
	}
}

.paragraph--type--product-page-specifications {
	max-width: 600px;
	margin: -2em auto 0;
	text-align: center;
	
	li, p, h2 {
		color: var(--darkbrown);
	}
	
	h2 {
		text-align: center;
	}
	
	ul {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		max-width: 1020px;
		margin: auto;
		
		li {
			width: clamp(12em, 38vw, 22em);
		}
	}
}

/* .dark-brown-button.text-align-center {
	padding-bottom: 2.5em;
} */

.product-page-hero-section-buttons, .paragraph--type--product-page-download-blueprint {
	display: flex;
	justify-content: space-between;
	max-width: 18em;
	margin: auto;
	
	p {
		margin: 2em 0;
	}
}

@media (min-width: 750px) {
	
	.product-page-layout-padding-text {
		font-size: 1.4em;
		padding: 1em 5%;
	}
	
	.product-hero-image {
		margin: 0;
	}
	
	.product-page-container-image-blueprint-buttons {
		display: flex;
		justify-content: space-between;
		padding: .8em 2.2em 0;
		
		> div:first-child {
			width: 59%;
		}
		
		> div:nth-child(2) {
			width: 39%;
		}
	}
	
	.paragraph--type--product-page-image-blueprint-but {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: 100%;
	}
	
	.product-page-hero-section-buttons {
		display: block;
		margin: 0 auto 0;
		width: 100%;
		
		.button {
			margin: 1em 0 0;
			
			a {
				display: block;
				width: 100%;
				text-align: center;
			}
		}
	}
}

@media (min-width: 900px) {
	
	.product-page-layout-padding-text {
		padding: 1em 8%;
	}
}

@media (min-width: 2000px) {
	
	.product-page-layout-padding-text {
		padding: 1em calc((100vw - 1550px)/2);
	}
}
/* -------------------- REGULATIONS PAGE STYLES ---------------------- */
.page-node-type-regulation {
	
	.regulation-page-layout-padding-text {
		
		h1, h2, h3 {
			font-family: var(--marseille);
			font-size: 2em;
			color: var(--darkbrown);
		}
		
		h2, h3 {
			margin-bottom: -.5em;
		}
		
		li {
			margin: 1em 0;
		}
		
		p {
			line-height: 1.5;
			color: var(--darkbrown);
		}
		
		img {
			margin-top: 1.5em;
		}
		
		a {
			color: var(--brown);
			text-decoration: underline;
			text-decoration-color: var(--brown);
			
			&:hover {
				text-decoration-color: var(--darkbrown);
				color: var(--darkbrown);
			}
		}
		
		table {
			margin: auto;
			border-collapse: collapse;
			width: 88vw;
			max-width: 700px;
			
			td {
				width: 50%;
				border: solid 2px var(--darkbrown);
				padding: .5em;
				
				a {
					text-decoration: none;
				}
			}
		}
		
		.table-of-contents {
			max-width: 460px;
			margin: auto;
			
			ol {
				border: 2px solid black;
			}
		}
		
		.button {
			
			a {
				text-decoration: none;
			}
		}
	}
}
/* -------------------- WEBFORM STYLES ---------------------- */
#block-trailhead-webform-3 {
	background-color: var(--lightcream);
	position: relative;
	padding: 0 6% 4em;
}

.webform-submission-form {
	background-color: var(--darkbrown);
	padding: 5% 0 10%;
	border-radius: .3em;
	
	h2 {
		color: var(--cream);
		font-family: var(--marseille);
		font-weight: 600;
		
		span {
			font-weight: 100;
		}
		
		a {
			color: var(--cream);
			
			&:hover {
				color: var(--maroon);
			}
		}
	}
	
	input, textarea, select {
		font-size: 1em;
		display: block;
		width: 86% !important;
		box-sizing: border-box !important;
		margin: 1em auto !important;
		background-color: var(--cream);
		color: var(--maroon);
		font-family: var(--marseille);
		border-radius: .4em;
		border: solid var(--gray) 1px;
	}
	
	input, select {
		padding: .5em;
	}
	
	textarea {
		padding: .5em .5em 10%;
	}
	
	legend, fieldset {
		font-size: 1em;
		width: 86%;
		margin: 1em auto;
		box-sizing: border-box;
		color: var(--cream);
	}
	
	legend {
		text-align: center;
	}
	
	fieldset {
		margin: 0;
		width: 100%;
	}
	
	#edit-flexbox {
		margin: auto;
	}
	
	.container-office-hours {
		max-width: 20em;
		margin: auto;
		padding: 0 8%;
		
		h2 {
			margin-top: 0;
		}
		
		p {
			color: var(--cream);
		}
		
		span {
			font-weight: 600;
		}
		
		.social-media-icon {
			display: flex;
			justify-content: flex-start;
			align-items: center;
			width: 15rem;
			position: relative;
			
			.icon {
				width: 2em;
				height: 2em;
				margin-right: 1em;
			}
		}
		
		.social-media-icon:hover .icon:after {
			position: absolute;
			content: '';
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
		}
		
		.social-media-icon:hover p {
			color: var(--brown);
			transition: .3s;
		}
	}
	
	.contact-form-logo {
		width: 50%;
		margin: 1em auto;
	}
	
	#edit-do-you-want-us-to-call--wrapper {
		
		legend {
			width: 60%;
			font-size: 1.1em;
		}
		
		.js-webform-radios {
			display: flex;
			justify-content: space-between;
			max-width: 15em;
			margin: auto;
		}
		
		.js-form-type-radio {
			display: flex;
			justify-content: center;
		}
		
		label {
			width: 1.5em;
			height: 1.5em;
			align-content: center;
			border-radius: 50%;
			border: none;
			color: var(--maroon);
			background-color: var(--cream);
			
			&:hover {
				cursor: pointer;
			}
		}
		
		.webform-options-display-buttons input:checked + label.webform-options-display-buttons-label {
			background-color: #3F492F;
			color: #F3DBAE;
			border: 1.5px solid rgba(253, 248, 239, 0.502);
		}
	}
	
	#edit-address--wrapper {
		margin: 0 0 -.5em;
		
		legend {
			display: none;
		}
	}
	
	::placeholder {
		color: var(--maroon);
	}
	
	.webform-button--submit {
		color: var(--cream);
		background-color: var(--darkbrown);
		border: solid var(--cream) 2px;
		justify-content: center;
		font-weight: 700;
		width: 70%;
		max-width: 10em;
		padding: .8em 1em;
		margin-top: 2em;
		
		&:hover {
			color: var(--darkbrown);
			background-color: var(--cream);
			cursor: pointer;
		}
	}
	
	.captcha {
		margin-left: 5%;
	}
}

#edit-processed-text-01 {
	font-size: .9em;
	width: 86%;
	margin: auto;
	
	p {
		color: var(--cream);
	}
	
	a {
		color: var(--cream);
		text-decoration: underline;
	}
}
/* ----- MAILCHIMP FORM ------ */
#mc_embed_shell {
	width: 80%;
	max-width: 750px;
	margin: .2em auto;
	
	form {
		background-color: transparent;
		margin: 20px 0 15px !important;
	}
	
	input, select {
		box-sizing: border-box;
		border: solid .12em var(--darkbrown) !important;
		border-radius: .2em !important;
		font-family: var(--marseille);
		background-color: transparent;
		padding: .5em 1em !important;
		color: var(--darkbrown);
		font-size: min(2.7vw, 1em) !important;
	}
	
	::placeholder {
		color: var(--darkbrown);
	}
	
	.mc-field-group {
		padding: 0 !important;
		min-height: auto !important;
	}
	
	.mailchimp-flex-name-email {
		display: flex;
		justify-content: space-between;
		
		.mc-field-group {
			width: 48%;
			
			input {
				width: 100%;
			}
		}
	}
	
	.select-dropdown-field {
		width: 100% !important;
		margin: 1em auto;
		max-width: 22em;
		
		select {
			cursor: pointer;
			text-align: center;
		}
	}
	
	div.response {
		margin: 0 0 .5em !important;
		color: var(--darkbrown) !important;
		padding: 0 !important;
	}
	
	.visually-hidden {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		border: 0;
	}
	
	#mc-embedded-subscribe {
		background-color: var(--green);
		color: var(--cream);
		display: block;
		margin: auto;
		padding: .5em 1em;
		height: auto;
		line-height: 2;
		font-weight: 700;
		border: none !important;
		
		&:hover {
			background-color: var(--maroon);
		}
	}
}

.privacy-text {
	font-size: min(2vw, .7em) !important;
	margin: 0 0 -.5rem;
	font-style: italic;
}

@media (min-width: 750px) {
		
	.webform-submission-form {
		max-width: 950px;
		margin: auto;
		padding: 2em 0 4em;
		
		input, textarea, select {
			font-size: .8em;
			padding: .5em 1em .5em;
		}
		
		textarea {
			padding: .5em 1em 8em;
		}
	}
}

@media (min-width: 768px) {
	
	.webform-submission-form {
		
		.webform-flex, .webform-flex--container {
			margin: 0;
		}
		
		.webform-flexbox {
			flex-direction: row-reverse;
		}
		
		.webform-address {
			
			.webform-flexbox {
				display: block;
			}
		}
	}
}

@media (min-width: 900px) {
	
	#block-trailhead-webform-3 {
		padding: 0 8% 4em;
	}
}
/* -------------------- OUR PROCESS & WHY CHOOSE TRAILHEAD SECTION STYLES ---------------------- */
/* .paragraph--type--modular-process-section {
	
	hr {
		width: 75%;
		max-width: 956px;
		height: 2px;
		border: none;
		background-color: var(--red);
	}
	
	.process-number--text {
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 5em;
		width: 8.5em;
		margin: auto;
	}
	
	.process-number {
		color: var(--red) !important;
		font-family: var(--pfmarket) !important;
		font-size: 5.5em;
	}
} */

/* .container-block-order-process {
	padding: 1em 0;
	
	.block-order-process {
		margin: 2em auto 4em;
	}
} */

/* .block-order-process {
	width: 50%;
	max-width: 10em;
	
	h2, p {
		color: var(--cream) !important;
	}
} */

.layout-block-order-reasons {
	
	hr {
		background-color: var(--cream);
	}
}

.layout-block-order-reasons-brown {
	
	h2, p {
		color: var(--brown) !important;
	}
}

.block-order-reasons {
	max-width: 12em;
	margin: 1.5em auto;
	
	h3 {
		font-family: var(--urbanist) !important;
		margin: 2em auto;
		font-weight: 500;
	}
}

@media screen and (min-width: 750px) {
	
	.container-block-order-reasons {
		display: flex;
		justify-content: space-between;
		max-width: 1100px;
		margin: auto;
	}
	
	.block-order-reasons {
		width: 30%;
	}
}
/* -------------------- GOOGLE REVIEW SECTION STYLES ---------------------- */
.paragraph--type--google-reviews-section {
	
	h2 {
		color: var(--brown);
	}
	
	.button {
		margin-top: 3em;
	}
	
	.HeaderContainer__Inner-sc-1532ffp-0 {
		justify-content: flex-start;
	}
	
	.HeaderInfoContainer__Info-sc-16jx15e-0 {
		
		.Icon__IconContainer-sc-11wrh3u-0 {
			display: none;
		}
	}
}

.fXiDND {
	border: 5px solid var(--green) !important;
}

.HeaderInfoContainer__Info-sc-caf5865b-0 {
	display: flex !important;
}
/* -------------------- WHY TRAILHEAD STYLES ---------------------- */
.container-flex-check-circle-icons {
	display: flex;
	justify-content: space-between;
	max-width: 700px;
	margin: 0 2em;
	flex-wrap: wrap;
}

.flex-icon-text {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 1em 0;
	width: 12em;
	
	p {
		width: 9em;
		margin-left: 1em;
	}
}

.icon-width {
	width: 2em;
}

.flex-text-picture {
	display: flex;
	justify-content: space-between;
	margin: 3em 3em 5em;
	
	p:first-child {
		margin-top: 0;
	}
}

.text-details-section {
	width: 45%;
	
	details {
		
		summary {
			background-color: var(--cream);
			width: 10.5em;
			text-align: center;
			padding: 0.5em 1em;
			border-radius: 0.2em;
			color: var(--maroon);
			font-weight: 900;
			
			&:hover {
				background-color: var(--lightcream);
				cursor: pointer;
			}
		}
		
		p {
			width: 200%;
			max-width: 33em;
		}
	}
}

.flex-text-picture-picture {
	width: 43%;
	max-width: 17em;
}

@media screen and (min-width: 850px) {
	
	.container-flex-check-circle-icons {
		margin: auto;
	}
}

@media screen and (min-width: 1130px) {
	
	.flex-icon-text {
		width: 13em;
		
		p {
			margin-left: 2em;
		}
	}
	
	.text-details-section {
		
		details {
			margin-top: 35%;
		}
	}
}
/* -------------------- VIDEO STYLES ---------------------- */
.video-heading {
	color: var(--brown);
}
 
.container-videos {
	position: relative;
	margin: 1em auto 3em;
	
	iframe {
		width: 100%;
		height: min(50vw, 24.3em);
		max-width: 950px;
		display: block;
		margin: auto;
	}
}

@media (min-width: 750px) {
	
	.container-videos-flex {
		display: flex;
		justify-content: space-between;
		
		.container-videos {
			position: relative;
			margin: 1em .5em 1em;
			width: 45%;
			
			iframe {
				height: min(20vw,15.3em);			}
		}
	}
}
/* -------------------- FOOTER STYLES ---------------------- */
#block-trailhead-footer {
	background-color: var(--green);
	color: var(--cream);
	position: relative;
	z-index: 7;
	
	a, p {
		color: var(--cream);
		font-family: var(--marseille);
		
		&:hover {
			color: var(--lightcream);
		}
	}
	
	.footer-address {
		width: 10em;
		margin: 1em auto;
		
		a {
			font-weight: 300
		}
	}
	
	.footer-address, .footer-phone {
		
		a {
			font-family: var(--urbanist);
		}
	}
}

.container-footer-text {
	font-size: 1.2em;
	
	a {
		font-weight: 600;
	}
}

.footer-logo {
	width: 65%;
	display: flex;
	margin: auto;
	max-width: 15em;
}

.container-bbb-rv-logos {
	display: flex;
	justify-content: space-between;
	max-width: 400px;
	margin: 1em auto 2em;
	
	img {
		height: 80px;
		width: auto;
	}
}

.copyright-text {
	color: var(--cream) !important;
	font-weight: 200;
	margin-bottom: 0;
	font-size: .8em;
}
@media screen and (min-width: 750px) {
	
	#block-trailhead-footer {
		padding: 2em 0 .6em;
	}
	
	.container-footer-text {
		display: flex;
		justify-content: space-between;
		font-size: 1em;
		max-width: 1540px;
		margin: 0 auto 2em;
	}
	
	.footer-logo {
		width: 20%;
		max-width: 8em;
		margin: auto .5em;
		order: 1;
	}
	
	.second-column {
		order: 4;
		margin: auto .5em;
		
		p {
			text-align: right;
		}
	}
	
	.third-column {
		order: 2;
	}
	
	.fourth-column {
		order: 3;
	}
	
	.third-column, .fourth-column {
		
		p {
			text-align: left;
		}
	}
	
	.third-column, .fourth-column {
		margin: 0 .5em;
	}
}
