/**
* Fuel Theme
* Version 6.0.6
**/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Hero
# Welcome
# CTA's
# Locations
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Hero
--------------------------------------------------------------*/

.home .header:before{
	content:''; 
	position: absolute;
	right: 0; 
	top: 0; 
	width: 7rem;
	height: 1rem;
	background: var(--primary-color);
	border-radius: 0 0 0 30px; 
}

.home .header-quicklinks{
	right: 0; 
	background: var(--primary-color);
}

.home .entry-content {
  margin-top: -7.5rem;
}

.home-hero h2{
	font-size: 2rem;
	padding-top: 8rem;
	font-weight: 500; 
}

.home-hero{
	padding-bottom: 21rem;
}

.home .header .wp-block-columns.has-primary-background-color{
		background: none !important ; 
	}

.home .header-logo a{
	transform: translateY(1rem);
}

@media (min-width: 68.5em) {
	.home .entry-content {
  		margin-top: -13rem;
	}
	.home-hero h2{
		padding-top: 22rem;
		font-size: 3.2rem;
	}
	
	.home .fuel6-walker-menu,
	.home .menu-styling-wrapper{
		background: none !important;
	}
	.home .menu-styling-wrapper.is-pinned{
		background: var(--primary-color) !important;
	}
	.home-hero{
		padding-bottom: 29rem;
	}
}

@keyframes showFade{
	to{
		opacity: 1; 
		transform: translateY(0); 
	}
}

@media (prefers-reduced-motion: no-preference) {
	.home-hero h2{
		opacity: 0; 
		transform: translateY(1rem); 
		animation: showFade 1s 1s ease forwards;  
	}
}

/*--------------------------------------------------------------
# Welcome
--------------------------------------------------------------*/

#welcome_section{
	margin-top: -14rem;
	background: #fff;
	border-radius: 25px 25px 0 0 ;
	width: 95%;
	margin-left: auto;
	margin-right: auto; 
	padding-top: 1.25rem; 
	max-width: 968px;
	position: relative; 
	z-index: 10; 
}

#welcome_section:before{
	content:'';
	position: absolute; 
	left: -1rem; 
	top: 2rem;
	width: 1rem;
	height: 12rem;
	background: var(--primary-color);
	border-radius: 25px 0 0 0 ;
}

#welcome_section:after {
	content:'';
	position: absolute; 
	left: -8rem;
	top: 17rem; 
	width: 14rem;
	height: 18rem; 
	background: url('../images/menu-bg-face.svg') no-repeat;
	background-size: 100%; 
	z-index: -1; 
}

.inner-welcome-section{
	max-width: 642px ; 
	margin-left: auto; 
	margin-right: auto; 
	padding-bottom: 4rem; 
}

#welcome_section h1{
	font-size: 1.2rem; 
	line-height: 1.5; 
	position: relative; 
	padding-bottom: 1rem; 
}

.committed strong{
	font-weight: 700; 
} 

@media (min-width: 68.5em) {
	#welcome_section{
		margin-top: -22rem;
	}
	#welcome_section h1{
		font-size: 2rem; 	
	}	
	.inner-welcome-section{
		padding-top: 3rem; 
	}
	#welcome_section h1{
		padding-bottom: 3rem; 
	}
	#welcome_section h1:after{
		bottom: 1rem; 
	}
	#welcome_section:after{
		width: 20rem;
		height: 24rem; 
		left: -11rem;
	  	top: 24rem;
	}
	#welcome_section:before{
		width: 46px;
		height: 20rem;
		left: -2.3rem; 
	}
}

@media (prefers-reduced-motion: no-preference) {
	.welcome .inner-welcome-section{
		opacity: 0; 
		transform: translateY(3rem); 
		transition: opacity 1s ease, transform 1s ease; 
	}
	.welcome.js-intersected .inner-welcome-section {
		opacity: 1; 
		transform: translateY(0); 
	}
}

.welcome.js-intersected .inner-welcome-section 

/*--------------------------------------------------------------
# CTA's
--------------------------------------------------------------*/

.cta-wrapper{
	z-index: 10; 
}

.cta {
	color: #fff; 
	align-items: initial; 
	min-height: 16rem; 
	position: relative;
	z-index: 100; 
}

.cta:before{
	content:'';
	position: absolute; 
	top: 0; 
	left: 0; 
	height: 100%;
	width: 100%;
	background: linear-gradient(270deg, rgba(0, 0, 0, 0) 5.67%, #2E3192 82.67%);
	z-index: 1; 
}

.cta-aud:before{
	background: linear-gradient(270deg, rgba(19, 139, 141, 0) 21.54%, #285C74 67.78%);
}

.cta-allergy:before{
	background: linear-gradient(270deg, rgba(0, 0, 0, 0) 6.76%, #003851 84.06%);
}

.cta-sleep:before{
	background: linear-gradient(270deg, rgba(19, 139, 141, 0) -5.81%, #2E3192 73.75%);
}
.cta h2{
	font-size: 1.2rem; 
	padding-top: .5rem; 
	margin-bottom: 2rem; 
	position: relative; 
}

.cta h2:after{
	content:''; 
	position: absolute; 
	bottom: -.75rem;
	left: 0;
	height: 1px;
	width: 110%; 
	background: #fff; 
	transform: translateX(-1rem);
}

.cta p{
	padding-right: 20%; 
}

.cta-arrow{
	position: absolute;
	right: .1rem;
	top: 45%;
	z-index: 101;
}

.cta-svg-group{
	position: absolute;
	top: -2.5rem; 
	right: -1rem; 
	height: 120%;
	width: 1.5rem;
	background: var(--accent-color);
	z-index: 10; 
	border-left: 1px solid #fff; 
}

.cta p.cta-button{
	font-family: var(--title-font);
	display: inline-block; 
	background: var(--accent-color);
	padding-top: .5rem;
	padding-bottom: .5rem; 
	padding-right: 1rem;
	position: relative; 
	z-index: 11; 
	transform: translateY(1rem);
	color: var(--primary-color);
}

.cta p.cta-button:before{
	content:'';
	position: absolute; 
	left: -1rem;
	top: 0;
	height: 100%;
	width: 1rem;
	background: var(--accent-color); 
	z-index: 2; 
}

.cta-allergy img{
	transform: scaleX(-1);
}

@media (min-width: 68.5em) {
	.cta-paragraph-special{
		padding-bottom: 3rem; 	
	}	
	.cta{
		height: 16.5rem;
		width: 24.5rem;
	}
	.cta p.cta-button{
		background: none; 
		z-index: 10; 
		transition: color .5s ease; 
		color: #fff; 
	}
/* 	.cta:hover p.cta-button{
		color: var(--primary-color);
	} */
	.cta p.cta-button::before{
		width: .5rem; 
		transition: width .5s ease; 
		z-index: -1;
	}
	.cta:hover p.cta-button::before{
		width: 11rem; 
	}
	.cta h2{
		font-size: 1.6rem; 
	}
	.cta h2:after{
		display: none; 
	}
	.cta-svg-group{
		border-left: none; 
		background: none; 
		width: 3.25rem; 
		transition: background .5s ease; 
	}
	.cta:hover .cta-svg-group{
		background: var(--accent-color);
	}

	.cta:after {
		content:''; 
		position: absolute; 
		right: 3.25rem;
		top: 0; 
		height: 100%; 
		width: 100%;
 		background: url('../images/ctalines.svg') no-repeat;
		background-size: 100%;  
		background-position: center;
		z-index: 10; 
	}
	.cta-arrow{
		right: 1rem;
	}
	.cta-wrapper-block:focus-visible .cta .cta-svg-group {
		background: var(--accent-color);
	}
	.cta-wrapper-block:focus-visible .cta p.cta-button::before{
		width: 11rem; 
	}
	.cta-columns-top .wp-block-column{
		min-width: initial; 
	}
	.cta-columns-bottom .wp-block-column{
		min-width: initial; 
	}
	.cta-wrapper{
		margin-top: 4rem;
	}
}
@media (min-width: 82.5em) {
	.cta{
		width: 28.5rem;
		height: 111%; 
	}
	.cta-columns-top{
		margin-bottom: 3rem; 
	}
}
	
@media (prefers-reduced-motion: no-preference) {
	.cta-wrapper .cta-wrapper-block{
		opacity: 0; 
		transform: translateY(3rem);
		transition: opacity .5s .5s ease, transform 1s .5s ease; 
		display: inline-block; 
	}
	
	.cta-wrapper h2{
/* 		opacity: 0;  */
		transform: translateY(-1rem);
/* 		transition: opacity .5s .5s ease, transform 1s .5s ease;  */
	}
	
/* 	.cta-wrapper.js-intersected h2{
		opacity: 1; 
		transform: translateY(-1rem);
	} */
	
	.cta-wrapper .cta-paragraph-special{
		opacity: 0; 
		transform: translateY(1rem);
		transition: opacity .5s .5s ease, transform 1s .5s ease; 
	}
	
	.cta-wrapper.js-intersected .cta-paragraph-special{
		opacity: 1; 
		transform: translateY(0);
	}
	
	.cta-wrapper.js-intersected .cta-wrapper-block{
		opacity: 1; 
		transform: translateY(0);
	}
	
	.loc-wrapper .wp-block-fuel-interactive-map{
		opacity: 0; 
		transform: translateY(3rem);
		transition: opacity .5s .5s ease, transform 1s .5s ease; 
	}
	
	.loc-wrapper.js-intersected .wp-block-fuel-interactive-map {
		opacity: 1; 
		transform: translateY(0);
	}
	
	.loc-wrapper .locations-title{
		opacity: 0; 
		transform: translateY(3rem);
		transition: opacity .5s .5s ease, transform 1s .5s ease; 
	}
	
	.loc-wrapper .locations-tagline{
		opacity: 0; 
		transform: translateY(3rem);
		transition: opacity .5s .5s ease, transform 1s .5s ease; 
	}
	
	.loc-wrapper.js-intersected .locations-title{
		opacity: 1; 
		transform: translateY(0);
	}
	.loc-wrapper.js-intersected .locations-tagline{
		opacity: 1; 
		transform: translateY(0);
	}
	
}

/*--------------------------------------------------------------
# Locations
--------------------------------------------------------------*/

.is-layout-flex>.flex-grow {
    flex-grow: 1;
}

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

@media (min-width: 68.5em) {
	.locations-title.add-header-accent:after{
		right: initial;  
	}
	.locations-title {
		text-align: left;
	}	
	.locations-tagline{
/* 		width: 40%;  */
		margin-left: 0 !important;
	}
	.home #location_section{
		margin-top: 4rem; 
	}
}