@import url("//hello.myfonts.net/count/2f2632");
@font-face {
  font-family: 'StRydeRegular';
  src: url("../../assets/fonts/2F2632_0_0.eot") format("embedded-opentype"), url("../../assets/fonts/2F2632_0_0.woff2") format("woff2"), url("../../assets/fonts/2F2632_0_0.woff") format("woff"), url("../../assets/fonts/2F2632_0_0.ttf") format("truetype"); }
  
:root {
	--black: #000;
	--teal: #0093A3;
	--white: #FFF;
	--lt-grey: #F7F7F7;
	--lt-blue: #F6F9FB;
	--medheading: clamp(32px, 0.5vw, 40px);
	--infographic: clamp(40px, 0.5vw, 60px);
	--blockquote: clamp(18px, 1.563vw, 20px);
	--medbody: clamp(20px, 0.5vw, 24px);
	--body: clamp(14px, 1.094vw, 14px);
}

@media only screen and (max-width: 900px){
	:root {
		--medheading: 24px;
		--infographic: 32px;
		--blockquote: 16px;
		--medbody: 18px;
	}
}

#page {
	opacity: 0;
}

.paddingall {padding: 8rem 6rem;}
.paddingtop {padding: 8rem 0 0 0;}
.paddingtopbottom {padding: 8rem 0;}
.paddingbottom {padding: 0 0 8rem 0;}
.paddingsides {padding: 0 6rem;}
.paddingtopsides {padding: 8rem 6rem 0 6rem;}
.paddingbottomsides {padding: 0 6rem 8rem 6rem;}

@media only screen and (max-width: 900px){
.paddingall {padding: 6rem 4rem;}
.paddingsides {padding: 0 4rem;}
.paddingtopsides {padding: 6rem 4rem 0 4rem;}
.paddingbottomsides {padding: 0 4rem 6rem 4rem;}
}

@media only screen and (max-width: 600px){
.paddingall {padding: 6rem 2rem;}
.paddingsides {padding: 0 2rem;}
.paddingtopsides {padding: 6rem 2rem 0 2rem;}
.paddingbottomsides {padding: 0 2rem 6rem 2rem;}
}

.fadeInUp {opacity: 0;}

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

.white-bg {background: var(--white);}
.black-bg {background: var(--black);}
.lightblue-bg {background: var(--lt-blue);}

.black-bg h1,
.black-bg h2,
.black-bg h3,
.black-bg h4,
.black-bg p,
.black-bg p a,
.black-bg ul,
.black-bg ol,
.black-bg .secondarybtn,
.black-bg .secondarybtn:visited {color: var(--white);}

.white-bg h1,
.white-bg h2,
.white-bg h3,
.white-bg h4,
.white-bg p,
.white-bg p a,
.white-bg ul,
.white-bg ol,
.white-bg .secondarybtn,
.white-bg .secondarybtn:visited,
.lightblue-bg h1,
.lightblue-bg h2,
.lightblue-bg h3,
.lightblue-bg h4,
.lightblue-bg p,
.lightblue-bg p a,
.lightblue-bg ul,
.lightblue-bg ol,
.lightblue-bg .secondarybtn,
.lightblue-bg .secondarybtn:visited {color: var(--black);}

#textBlock h1,
.heading {
	font-size: var(--medheading);
	line-height: 1.5;
	text-transform: none;
}

.number,
.infographic {font-size: var(--infographic);}

.medheading {
	font-size: var(--medheading);
	line-height: 1.1;
}

.uppercase {
	text-transform: uppercase;
}

#textBlock h2,
.blockquote {
	font-size: var(--blockquote);
	font-weight: 400;
	line-height: 1.8;
}

#textBlock p,
.body {
	font-size: var(--body);
	line-height: 1.7;
}

.medbody {
	font-size: var(--medbody);
}

#textBlock p,
#textBlock h2,
.sorts-mill {
	font-family: "Sorts Mill Goudy", Georgia, "Times New Roman", Times, serif;
	font-weight: 400;
	font-style: normal;
}

#mediaContent h4,
#autoPlayCarouselBlock .textContainer h4,
#multiMediaContent h4,
#form h4 {
	margin-block-start: 0px;
}

#textBlock h1,
.st-ride,
.st-ryde {
	font-family: 'StRydeRegular';
	font-weight: 400;
	font-style: normal;
}

p strong {
	font-weight: 800;
}

p em {
	font-style: italic;
}

#textBlock p a,
#textBlock p a:visited {
	text-decoration: underline;
	color: var(--teal);
}

.ctaRepeater {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 2rem;
}

.primarybtn {
	width: fit-content;
	width: -webkit-fit-content;
	margin: auto;
	padding: 0.8rem 1rem;
	text-transform: uppercase;
	transition: 0.3s ease all;
	font-family: 'StRydeRegular';
	font-size: var(--body);
	text-decoration: none;
}

.primarybtn.white:hover,
.primarybtn.black,
.primarybtn.black:visited {
	background: var(--black);
	color: var(--white);
}

.primarybtn.black:hover,
.primarybtn.white,
.primarybtn.white:visited {
	background: var(--white);
	color: var(--black);
}

.secondarybtn {
	font-family: 'StRydeRegular';
	line-height: 1;
	font-size: var(--body);
	font-weight: 400;
	text-transform: uppercase;
	text-decoration: none;
	position: relative;
	display: flex;
	gap: 1rem;
	align-items: center;
	padding: 0 0 0.5rem 0;
	width: fit-content;
	width: -webkit-fit-content;
	transition: 0.3s ease all;
}

.secondarybtn:after {
	content: "";
	width: 15px;
	height: 15px;
	min-width: 15px;
	min-height: 15px;
	background-size: cover !important;
	-moz-background-size: cover !important;
	-o-background-size: cover !important;
	-webkit-background-size: cover !important;
	background: url('https://secretbayresid.wpenginepowered.com/wp-content/uploads/2025/10/icon-right-arrow.svg')center center no-repeat;
}

.secondarybtn:before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	height: 1px;
	bottom: 0;
}

.black-bg .secondarybtn:before {
	background: var(--white);
}

.lightblue-bg .secondarybtn:before,
.white-bg .secondarybtn:before {
	background: var(--black);
}

.black-bg .secondarybtn:hover:before,
.lightblue-bg .secondarybtn:hover:before,
.white-bg .secondarybtn:hover:before  {
	background: var(--teal);
}
.secondarybtn:hover {
	color: var(--teal);
}

/*----- Header -----*/
.site-branding {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	z-index: 99;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 0.5rem 1rem;
	background: transparent;
	transition: 0.3s ease all;
}

.site-branding.sticky {
	position: fixed;
	background: var(--white);
}

.site-branding .header-logo {
	width: 100%;
	max-width: 200px;
}

.home .site-branding .header-logo {opacity: 0; visibility: hidden;}
.home .site-branding.sticky .header-logo {opacity: 1; visibility: visible;}

.site-branding.black-header .header-logo,
.site-branding.sticky .header-logo {
	filter: invert(1);
}

.site-branding .rightContainer {
	display: flex;
	justify-content: flex-end;
}

.site-branding .leftContainer {
	display: flex;
	justify-content: flex-start;
}

.site-branding .rightContainer .inquire {
	background: var(--black);
	color: var(--white);
	text-transform: uppercase;
	font-size: var(--body);
	font-family: 'StRydeRegular';
	font-weight: 400;
	padding: 0.5rem 2rem;
	text-decoration: none;
	transition: 0.3s ease all;
}
.site-branding .rightContainer .inquire:visited{
	color: var(--white);
}

.site-branding .rightContainer .inquire:hover {
	background: var(--teal);
	color: var(--white);
}
@media only screen and (max-width: 900px){
	.site-branding .leftContainer {
		display: none;
	}
}

section {
	display: block;
	margin: 0 auto;
	width: 100%;
	position: relative;
}

section .sectionContainer {
	max-width: 1728px;
	display: block;
	margin: 0 auto;
	width: 100%;
	position: relative;
}

.flexContainer {
	display: flex;
}

.flexContainer.center {
	align-items: center;
	justify-content: space-between;
}

/*-----Hero Component---*/
#heroBlock {
	overflow: hidden;
}

#heroBlock video {
	position: absolute;
	top: 0;
	left: 0px;
	right: 0px;
	bottom: 0px;
	z-index: 1;
	display: block;
	object-fit: cover;
	width: 100vw;
	height: 100vh;
}

#heroBlock.video .gradientOverlay,
#heroBlock.full .gradientOverlay,
#heroBlock.video,
#heroBlock.full {
	height: 100vh;
}

#heroBlock.half .gradientOverlay,
#heroBlock.half {
	height: 50vh;
}

#heroBlock.backgroundImage {
	background-size: cover !important;
	-moz-background-size: cover !important;
	-o-background-size: cover !important;
	-webkit-background-size: cover !important;
}

#heroBlock .gradientOverlay {
	position: absolute;
	top: 0;
	left: 0px;
	right: 0px;
	bottom: 0px;
	z-index: 2;
	display: block;
	width: 100%;
	background: rgba(0,0,0,0.4);
}

#heroBlock .primarybtn {
	display: block;
	text-align: center;
	margin: 2rem auto 0 auto;
}

#heroBlock .logoOverlay {
	width: 100%;
	max-width: 300px;
	position: absolute;
	z-index: 3;
	top: 35%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
}

#heroBlock .textOverlay {
	opacity: 0;
}

#heroBlock .textOverlay.bottomCenter {
	width: 100%;
	padding: 0 6rem;
	display: block;
	position: absolute;
	z-index: 3;
	bottom: 8rem;
	left: 0;
	right: 0;
}
#heroBlock .textOverlay.bottomCenter h1,
#heroBlock .textOverlay.bottomCenter h2 {
	text-align: center;
}

@media only screen and (max-width: 900px){
	#heroBlock .textOverlay.bottomCenter {
		padding: 0 4rem;
	}
}

@media only screen and (max-width: 600px){
	#heroBlock .textOverlay.bottomCenter {
		padding: 0 2rem;
	}
}

/*-----Text Component---*/
#textBlock .container {
	width: 100%;
	margin: auto;
	display: block;
	position: relative;
}

#textBlock .container.half {max-width: 50%;}
#textBlock .container.twothirds {max-width: 70%;}

@media only screen and (max-width: 900px){
	#textBlock .container.twothirds,
	#textBlock .container.half {
		max-width: 80%;
	}
}
@media only screen and (max-width: 600px){
	#textBlock .container.twothirds,
	#textBlock .container.half {
		max-width: 100%;
	}
}

/*-----Media + Content & Multi Media Component---*/
#mediaContent .flexContainer,
#multiMediaContent .flexContainer {
	flex-wrap: wrap;
	gap: 6rem;
	flex-direction: row;
}

#mediaContent .flexContainer.reverse,
#multiMediaContent .flexContainer.reverse {
	flex-direction: row-reverse;
}

#mediaContent .flexContainer .column.text,
#multiMediaContent .flexContainer .column.small {
	width: calc(40% - 3rem);
}

#multiMediaContent .flexContainer .column.large,
#mediaContent .flexContainer .column.media {
	width: calc(60% - 3rem);
}

#multiMediaContent .flexContainer .column.small .textContainer {
	padding: 0 4rem 3rem 0;
}

#multiMediaContent .flexContainer .column.large p {
	padding: 1rem 4rem 0 4rem;
}

#multiMediaContent .flexContainer .column.large img,
#multiMediaContent .flexContainer .column.small img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

@media only screen and (max-width: 900px){
	#multiMediaContent .flexContainer,
	#mediaContent .flexContainer {flex-direction: column; gap: 4rem;}
	
	#multiMediaContent .flexContainer.reverse {
		flex-direction: column;
	}
	
	#mediaContent .flexContainer.reverse {flex-direction: column-reverse;}
	
	#multiMediaContent .flexContainer .column.large,
	#multiMediaContent .flexContainer .column.small,
	#mediaContent .flexContainer .column.media,
	#mediaContent .flexContainer .column.text {width: 100%;}
}

@media only screen and (max-width: 600px){
	#multiMediaContent .flexContainer .column.small .textContainer {
		padding: 0 0rem 1rem 0;
	}
	#multiMediaContent .flexContainer .column.large p {
		padding: 1rem 0rem 0 0rem;
	}
}

/*-----AutoplayCarousel Component---*/
.autoPlayCarouselContainer {
	width: 100%;
	display: block;
	position: relative;
	overflow: hidden;
	padding: 2em 0 0 0;
}

.autoPlayCarousel .flickity-slider {
	display: flex;
	align-items: center;
}

.autoPlayCarousel .cell {
	width: 22.65%;
	position: relative;
	margin-right: 3rem;
}

.autoPlayCarousel .cell:nth-child(2n) {
	width: 20.3%
}

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

@media only screen and (max-width: 900px){
	.autoPlayCarousel .cell {
		width: 32.65%;
	}
	.autoPlayCarousel .cell:nth-child(2n) {
		width: 30.3%
	}
}

@media only screen and (max-width: 600px){
	.autoPlayCarousel .cell {
		width: 42.65%;
	}
	.autoPlayCarousel .cell:nth-child(2n) {
		width: 40.3%
	}
}

/*-----InfoGraphics Component---*/
#infographicsBlock .flexContainer{
	display: flex;
	gap: 6rem;
	width: 100%;
	align-items: flex-start;
	justify-content: space-between;
	width: 100%;
	padding: 2rem;
}

#infographicsBlock h3 {
	margin-block-start: 0;
	padding: 0 4rem 0 0;
}

#infographicsBlock .flexContainer .column.small .item .textContainer h4,
#infographicsBlock .flexContainer .column.large h4 {
	margin-block-start: 0;
	margin-block-end: 0;
}

#infographicsBlock .flexContainer .column.large,
#infographicsBlock .flexContainer .column.small {
	position: relative;
}

#infographicsBlock .flexContainer .column.small {
	display: flex;
	gap: 2rem;
	flex-direction: column;
}

#infographicsBlock .flexContainer .column.large .flexInner {
	border-top: 1px solid rgba(255,255,255,0.3);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	padding: 2rem 0 0 0;
}

#infographicsBlock .flexContainer .column.small .item {
	display: flex;
	gap: 1rem;
	align-items: center;
}
#infographicsBlock .flexContainer .column.small .item img {
	max-width: 178px;
	min-width: 100px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}
#infographicsBlock .flexContainer .column.small .item .textContainer {
	max-width: 255px;
}
@media only screen and (max-width: 1024px){
	#infographicsBlock .flexContainer{
		flex-direction: column;
		gap: 4rem;
	}
	#infographicsBlock .flexContainer .column.large,
	#infographicsBlock .flexContainer .column.small {
		width: 100%;
	}
	#infographicsBlock .flexContainer .column.small {
		flex-direction: row;
	}
}
@media only screen and (max-width: 900px){
	#infographicsBlock .flexContainer .column.small .item {
		flex-direction: column;
	}
	#infographicsBlock .flexContainer .column.small .item img {
		width: 10%;
		max-width: 100%;
		min-width: 100%;
	}
	#infographicsBlock .flexContainer .column.small .item .textContainer {
		max-width: 100%;
	}
}
@media only screen and (max-width: 500px){
	#infographicsBlock .flexContainer .column.large .flexInner {
		flex-direction: column;
		gap: 1rem;
	}
	#infographicsBlock h3 {
		padding: 0 0rem 0 0;
	}
}

/*-----Testimonials Component---*/
.testimonialsSlider {
	height: 80vh;
	max-height: max-content;
	min-height: 80vh;
	width: 100%;
	position: relative;
	background-size: cover !important;
	-moz-background-size: cover !important;
	-webkit-background-size: cover !important;
}

.testimonialsSlider .flickity-viewport {
	height: 100% !important;
}

.testimonialsSlider::before {
	  content: "";
	  position: absolute;
	  top: 2rem; /* Adjust for desired inner border thickness */
	  left: 2rem;
	  right: 2rem;
	  bottom: 2rem;
	  border: 1px solid var(--white); /* The inner border */
	  z-index: 2;
}

.testimonialsSlider .flickity-page-dots {bottom: 3rem;}

.testimonialsSlider .flickity-page-dots .dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 8px;
	background: #fff !important;
	border-radius: 50%;
	opacity: .25;
	cursor: pointer;
}

.testimonialsSlider .cell {
	width: 100%;
	height: 100%;
	margin-right: 2rem;
	padding: 4rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	z-index: 3;
}
.testimonialsSlider .cell .cellInner {
	display: block;
	margin: auto;
	text-align: center;
	max-width: 600px;
}
.testimonialsSlider .cell .cellInner img {
	width: 100%;
	max-width: 200px;
	height: auto;
	margin: auto auto 2rem auto;
}

.testimonialsSlider .cell .cellInner .medheading {
	line-height: 1.5;
}

.testimonialsSlider .flickity-button {
	z-index: 9;
	background: transparent !important;
}

.testimonialsSlider .flickity-prev-next-button.previous svg,
.testimonialsSlider .flickity-prev-next-button.next svg {
	fill: var(--white);
}

.testimonialsSlider .flickity-prev-next-button.previous {
	left: 4rem;
}
.testimonialsSlider .flickity-prev-next-button.next {
	right: 4rem;
}

@media only screen and (max-width: 900px){
	.testimonialsSlider {
		height: 100vh;
		max-height: max-content;
		min-height: 100vh;
	}
	.testimonialsSlider::before {
		  content: "";
		  position: absolute;
		  top: 1rem; /* Adjust for desired inner border thickness */
		  left: 1rem;
		  right: 1rem;
		  bottom: 1rem;
		  border: 1px solid var(--white); /* The inner border */
		  z-index: 2;
	}
	.testimonialsSlider .flickity-prev-next-button.previous {
		left: 2rem;
	}
	.testimonialsSlider .flickity-prev-next-button.next {
		right: 2rem;
	}
}
@media only screen and (max-width: 600px) {
	.testimonialsSlider .flickity-prev-next-button.previous {
		left: 1.5rem;
	}
	.testimonialsSlider .flickity-prev-next-button.next {
		right: 1.5rem;
	}
	.testimonialsSlider .cell {
		padding: 5rem;
	}
}

/*-----Table Component---*/
#tableBlock {
	width: 100%;
	margin: auto;
	display: block;
	position: relative;
}

#tableBlock .tableHeader,
#tableBlock .tableBody .row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2rem;
	justify-content: space-between;
	width: 100%;
	max-width: 1200px;
}

#tableBlock .tableHeader {
	padding: 1rem 0;
	background: rgba(255,255,255,0.15);
}

#tableBlock #tableInner,
.tableBody {
	width: 100%;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	display: flex;
}

#tableBlock #tableInner.fivecolumns .tableBody .row {
	padding: 1rem 0;
}

#tableBlock #tableInner.fivecolumns .tableBody .row:nth-child(even) {
	background: rgba(255,255,255,0.15);
}

#tableBlock #tableInner.fivecolumns .tableHeader .column,
#tableBlock #tableInner.fivecolumns .tableBody .row .column {
	width: calc(20% - 2rem);
}
#tableBlock #tableInner.threecolumns .tableHeader .column,
#tableBlock #tableInner.threecolumns .tableBody .row .column {
	width: calc(33.33% - 2rem);
}

#tableBlock #tableInner.fivecolumns .tableHeader .column p,
#tableBlock #tableInner.fivecolumns .tableBody .row .column p,
#tableBlock #tableInner.threecolumns .tableHeader .column p,
#tableBlock #tableInner.threecolumns .tableBody .row .column p {
	text-align: center;
	margin-block-start: 0px;
	margin-block-end: 0px;
}

#tableBlock #tableInner.fivecolumns .tableHeader .column p {
	text-transform: uppercase;
}

@media only screen and (max-width: 820px){
	#tableBlock #tableInner {
		overflow-x: auto;
		white-space: nowrap;
		max-width: fit-content;
	}
	
	/* Style the entire scrollbar */
	#tableBlock #tableInner::-webkit-scrollbar {
	  width: 10px; /* Set the width of the vertical scrollbar */
	  height: 10px; /* Set the height of the horizontal scrollbar */
	}
	
	/* Style the track (the area the thumb moves along) */
	#tableBlock #tableInner::-webkit-scrollbar-track {
	  background: rgba(255,255,255,0.2); /* Background color of the track */
	  border-radius: 10px; /* Rounded corners for the track */
	}
	
	/* Style the thumb (the draggable handle) */
	#tableBlock #tableInner::-webkit-scrollbar-thumb {
	  background: rgba(255,255,255,0.8); /* Background color of the thumb */
	  border-radius: 10px; /* Rounded corners for the thumb */
	}
	
	/* Style the thumb on hover */
	#tableBlock #tableInner::-webkit-scrollbar-thumb:hover {
	  background: rgba(255,255,255,1); /* Darker background on hover */
	}
	
	/* Optionally style the scrollbar corner (where horizontal and vertical scrollbars meet) */
	#tableBlock #tableInner::-webkit-scrollbar-corner {
	  background: #ccc;
	}
	
	#tableBlock .tableHeader,
	#tableBlock .tableBody .row {
		flex-wrap: nowrap;
		width: max-content;
		max-width: max-content;
	}
	#tableBlock .tableBody .row:last-child {
		margin-bottom: 2rem;
	}
	#tableBlock #tableInner.threecolumns .tableHeader .column,
	#tableBlock #tableInner.threecolumns .tableBody .row .column,
	#tableBlock #tableInner.fivecolumns .tableHeader .column,
	#tableBlock #tableInner.fivecolumns .tableBody .row .column {
		width: 150px;
		min-width: 150px;
	}
}

/*-----Sticky Panels Component---*/
/* container */
#stickyPanels {
  position: relative;
}

/* the fixed media “stage” that doesn’t scroll */
#stickyPanels .media-fixed {
  position: sticky;
	top: 0;
	height: 100vh;
	width: calc(60% - 6rem);
	margin-left: auto; /* keep right-aligned */
	overflow: hidden;
	pointer-events: none;
	display: flex;
	align-items: center;     /* vertically center */
	justify-content: center;
}

/* where the swapped media goes */
#stickyPanels .media-stage,
#stickyPanels .media-stage > * {
  width: 100%;
  height: 100%;
}

#stickyPanels .media-stage {
  position: relative;
	width: 100%;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}

#stickyPanels .media-stage > * {
  position: absolute;
	inset: 0 auto auto 0;
	width: 100%;
	height: auto;
	object-fit: contain; /* maintain aspect ratio */
	opacity: 0;
	transform: translateY(-50%);
	top: 50%;
}

/* text column takes the left side; panels create scroll length */
#stickyPanels .panels {
  position: relative;
  z-index: 2;           /* above background but below fixed stage clicks */
}

#stickyPanels .panel {
  display: block;
  min-height: 100vh;    /* each panel fills the viewport for clear steps */
  padding-right: 62%;   /* leave room for the fixed media on the right */
  display: flex;
  align-items: center;
}

#stickyPanels .panel .column.text {
  width: 100%;
  max-width: 720px; 
  padding: 0 0 0 6rem;
}

#stickyPanels .panel:first-child {
	margin-top: -100vh;
}

#stickyPanels .panel .column.text ul {
	margin-block-start: 0em;
	margin-block-end: 0em;
	padding-inline-start: 0px;
	margin: 0 0 1.5em 1rem;
}
#stickyPanels .panel .column.text ul li {
	padding: 0 0 1rem 0;
}
#stickyPanels .panel .column.text ul li:last-child {
	padding: 0;
}

/* optional: nicer images if any fall back into DOM */
#stickyPanels .panel .column.media { display: none; } /* we won’t use these now */

@media (max-width: 991px), (prefers-reduced-motion: reduce) {
  #stickyPanels .media-fixed {
	display: none;         /* hide sticky stage entirely */
  }
  #stickyPanels .media-stage {
	display: none;
  }

  #stickyPanels .panels {
	z-index: 1;
  }

  #stickyPanels .panel {
	display: flex;
	flex-direction: column-reverse;
	min-height: auto;      /* don’t force 100vh steps on mobile */
	padding: 2rem 1.25rem; /* comfy mobile spacing */
  }

  #stickyPanels .panel:first-child {
	margin-top: 0;         /* remove the negative offset trick on mobile */
  }

  #stickyPanels .panel .column.text {
	padding: 0;            /* reduce left pad */
	max-width: 640px;      /* keep readable line length */
	margin: 0 auto;
  }

  /* show the per-panel media on mobile */
  #stickyPanels .panel .column.media {
	display: block !important;
	margin: 1rem 0 0 0;
  }

  #stickyPanels .panel .column.media img,
  #stickyPanels .panel .column.media video {
	width: 100%;
	height: auto;
	object-fit: contain;
  }

  /* trim lists slightly for mobile rhythm */
  #stickyPanels .panel .column.text ul {
	margin: 0.5rem 0 1rem 1rem;
  }
}

/* Slightly friendlier sticky stage height on small laptops/tablets */
@media (min-width: 992px) and (max-width: 1199px) {
  #stickyPanels .media-fixed {
	height: 85vh;
  }
}

/*-----Form Component---*/
#gform_wrapper_1 input,
#gform_wrapper_1 select {
	background: transparent;
	border: 1px solid var(--white);
	color: var(--white);
	font-size: var(--body);
	font-family: 'StRydeRegular';
	font-weight: 400;
	border-radius: 0px;
}
.gform_required_legend {
	font-family: 'StRydeRegular';
	font-weight: 400;
	width: 100%;
	margin: auto;
	display: block;
	text-align: center;
	padding: 0 0 2rem 0;
}
#gform_wrapper_1 legend,
#gform_wrapper_1 label {
	font-family: 'StRydeRegular';
	font-weight: 400;
	color: var(--white);
	font-size: var(--body);
}
.gform_button.button {
	background: var(--white) !important;
	color: var(--black) !important;
	text-transform: uppercase;
	padding: 1rem 2rem;
	transition: 0.3s ease all;
	cursor: pointer;
}
.gform_button.button:hover {
	background: var(--teal) !important;
	color: var(--white) !important;
	border: 1px solid var(--teal) !important;
}
.gfield_required.gfield_required_asterisk {
	color: var(--teal) !important;
}
#gform_wrapper_1 ::-webkit-input-placeholder { /* Chrome, Opera, Safari */
  color: var(--white);
  font-family: 'StRydeRegular';
  font-weight: 400;
  font-size: var(--body);
}
#gform_wrapper_1 ::-moz-placeholder { /* Firefox 19+ */
  color: var(--white);
  font-family: 'StRydeRegular';
  font-weight: 400;
  font-size: var(--body);
}
#gform_wrapper_1 :-ms-input-placeholder { /* IE 10+ */
  color: var(--white);
  font-family: 'StRydeRegular';
  font-weight: 400;
  font-size: var(--body);
}
#gform_wrapper_1 :-moz-placeholder { /* Firefox 18- */
 color: var(--white);
 font-family: 'StRydeRegular';
 font-weight: 400;
 font-size: var(--body);
}

/*----- Footer ---*/
footer {
	width: 100%;
	min-width: 100%;
	max-width: 100%;
	overflow: hidden;
	position: relative;
	z-index: 99999;
	background: #000;
	color: #fff;
}

.f1 {
	padding: 59px 0 10px;
	border-top: 1px solid #2e2e2e;
}

footer .container {
	margin-right: auto;
	margin-left: auto;
	padding-left: 15px;
	padding-right: 15px;
	width: 100%;
	max-width: 1230px;
}

footer .container a,
footer .container a:visited {
	color: var(--white);
	text-decoration: none;
}

@media (min-width: 1024px) {
	.f1 > .container {
		padding-bottom: 19px;
	}
}

@media (min-width: 754px) {
	.f1 {
		padding: 53px 0 0;
	}
	.f1 > .container {
		padding-bottom: 21px;
	}
}

@media (min-width: 1200px) {
	footer .container {
		width: 1230px;
	}
}

footer .row {
	display: flex;
	flex-direction: row;
	gap: 6rem;
	margin: 0;
}

.col-xs-12 {
	width: 100%;
}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
	position: relative;
	min-height: 1px;
	padding-left: 15px;
	padding-right: 15px;
}

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
	float: left;
}

.visible-xs {
	display: none !important;
}

.footer-logo {
	max-width: 240px;
	margin: 0 0 28px;
	position: relative;
}

@media (min-width: 754px) {
	.footer-logo {
		max-width: 240px;
		padding: 0 0 0 2px;
		margin: 0 0 16px;
	}
}

.footer-badges {
	display: flex;
	gap: 1.5rem;
	align-items: center;
	justify-content: flex-start;
	padding: 0 0 2rem 0;
}

.footer-badges .greenGlobe, .footer-badges .relais {
	max-width: 40px;
	height: auto;
}

.footer-badges a.gems {
	max-width: 80px;
	height: auto;
	position: relative;
}

.footer-badges a.gems img, .footer-logo img {
	width: 100%;
	max-width: 100%;
	margin: auto;
	display: block;
	height: auto;
}

.footer-box .text {
	display: block;
	font-size: 13px;
	line-height: 19px;
	color: #e4e5e6;
	max-width: 260px;
	padding: 0 2px 19px;
	font-family: "Sorts Mill Goudy", Georgia, "Times New Roman", Times, serif;
}

.copyright {
	display: block;
	color: rgba(228, 229, 230, 0.5);
	text-transform: uppercase;
	font: 300 11px / 13px "Sorts Mill Goudy", Georgia, "Times New Roman", Times, serif;
}
.copyright a,
.copyright a:visited {
	color: rgba(228, 229, 230, 0.5) !important;
}

.cols-holder {
	display: flex;
	gap: 2rem;
	align-items: flex-start;
	justify-content: space-between;
}
@media only screen and (max-width: 900px){
	.cols-holder {
		flex-direction: column;
	}
}
.cols-holder .title {
	display: block;
	text-transform: uppercase;
	font: 12px / 14px "StRydeRegular", Helvetica, Arial, sans-serif;
	margin: 0 0 14px;
}

.cols-holder .col ul {
	list-style: none;
	padding: 0;
	margin: 0 0 10px;
}

.cols-holder:after{
	content: "";
	display: block;
	clear: both;
}

.cols-holder .col ul li a {
	font: 11px / 13px "Sorts Mill Goudy", Georgia, "Times New Roman", Times, serif;
	color: rgba(228, 229, 230, 0.8);
	display: inline-block;
	vertical-align: top;
}

.address-block {
	font-size: 12px;
	line-height: 14px;
	color: #e4e5e6;
	float: left;
	width: 54%;
	font-family: "Sorts Mill Goudy", Georgia, "Times New Roman", Times, serif;
}

address {
	margin-bottom: 24px;
	font-style: normal;
	line-height: 1.5;
}

.address-block address {
	margin: 0 0 6px;
}

.address-block span {
	display: block;
	margin: 0 0 8px;
}

.address-block a {
	color: #e4e5e6;
}

.social-networks {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0;
	width: 100%;
	gap: 1rem;
	list-style: none;
}

@media (min-width: 754px) {
	.cols-holder .title {
		font-size: 11px;
		line-height: 13px;
		margin: 0 0 11px;
		letter-spacing: 1px;
	}
	.address-block {
		width: 100%;
		font-size: 11px;
		margin: 0 0 26px;
	}
	.address-block address {
		margin: 0 0 2px 1px;
	}
	.address-block span {
		margin-bottom: 4px;
	}
	.copyright {
		text-transform: capitalize;
	}
}
#menu-mobile-footer {
	columns: 2;
	list-style-type: none;
}

.footer-box {
	padding: 9px 0 0;
}

.social-block {
	padding: 0 0 16px;
}

@media (min-width: 1024px) {
	.footer-box {
		padding-left: 26px;
	}
	.col-md-8 {
		width: 66.6666666667%;
	}
	.social-block {
		padding-bottom: 12px;
	}
}

.pull-right {
	float: right !important;
}

.visible-lg,
.visible-md {
	display: none !important;
}

@media (min-width: 1200px) {
	.visible-lg {
		display: block !important;
	}
}

@media only screen and (max-width: 900px){
	.social-networks {
		padding: 2rem 0 0 0 !important;
	}
	footer .row {
		gap: 3rem;
	}
}