/*Designed by Sean Holt @ New World Digital Media*/
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700&display=swap');
body{font-family: var(--sideFont);}
.text h1, .text h2, .text h3, .text h4, .text h5{
	font-family: var(--mainFont)
}
/*Custom Props*/
:root{
	/*Row Size*/
	--width: 91rem;
	/*Colors*/
	--white100: #999999;
	--white200: #CCCCCC;
	--white300: #FFFFFF;
	--black100: #444444;
	--black200: #222222;
	--black300: #000000;
	--primary: #818182;
	--secondary: #818182;
	--dark: #111111;
	--darker: #000000;
	--muted: #EEEEEE;
	--warning: #B22222;
	--success: #4BB543;
	/*Font Families*/
	--mainFont: 'Playfair Display', serif;
	--sideFont: 'Manrope', sans-serif;
	/*Font Sizing*/
	--fs100: 0.75rem;
	--fs200: 0.875rem;
	--fs300: 1rem;
	--fs400: 1.125rem;
	--fs500: 1.375rem;
	--fs600: 1.25rem;
	--fs700: 1.5rem;
	--fs800: 2.25rem;
	--fs900: 2.75rem;
	/*Border Radius*/
	--brSmall: 0rem;
	--brMedium: 0rem;
	--brLarge: 100vh;
	/*Box Shadows*/
	--shadow: 0px 4px 8px rgba(0,0,0,0.3);
	/*Spacing*/
	--sectionPadding: 7.25rem 1.25rem;
	--secX: 1.25rem;
	--boxPadding: 2rem;
	--textSpacing: 0px 0px 1.6rem 0px;
	--gap: 2rem;
	--thing: calc(100vw - 18px - var(--width));
	--gutter: calc(var(--thing) / 2);
}
/*Custom props at Medium sizes and below*/
@media screen and (max-width: 64em) {
	:root{
		/*Font Sizing*/
		--fs300: 0.9375em;
		--fs400: 1rem;
		--fs500: 1.25rem;
		--fs500: 1.25rem;
		--fs600: 1.5rem;
		--fs700: 1.75rem;
		--fs800: 2.25rem;
		--fs900: 2.75rem;
		/*Spacing*/
		--sectionPadding: 5rem 5rem;
		--secX: 5rem;
		--boxPadding: 1.8em;
		--textSpacing: 0 0 1.5rem 0;
		--gap: 1.8rem;
		--gutter: 0px;
	}
}
/*Custom props at in between Medium and Small sizes*/
@media screen and (max-width: 52em) {
	:root{
		/*Spacing*/
		--sectionPadding: 3.75rem 2.5rem;
		--secX: 2.5rem;
	}
}
/*Custom props at Small sizes*/
@media screen and (max-width: 40em) {
	:root{
		/*Font Sizing*/
		--fs500: 1.25rem;
		--fs600: 1.375rem;
		--fs700: 1.5rem;
		--fs800: 2rem;
		--fs900: 2.5rem;
		/*Spacing*/
		--sectionPadding: 3.125rem 1rem;
		--secX: 1rem;
		--boxPadding: 1.6em;
		--textSpacing: 0 0 1.6rem 0;
		--gap: 1.6rem;
	}
}
/*-------------------------------------------------------------------------*/
/*Spacing between columns*/
/*-------------------------------------------------------------------------*/
@media screen and (max-width: 64.9375em) {
	section .row > .columns:last-of-type, footer > .row > .columns:last-of-type{
		margin-bottom: 0;
	}
	section .row > .columns, footer > .row > .columns{
		margin-bottom: calc(var(--gap) * 2);
	}
}
@media screen and (max-width: 39.9375em) {
	section .row > .columns:last-of-type, footer > .row > .columns:last-of-type{
		margin-bottom: 0
	}
	section .row > .columns, footer > .row > .columns{
		margin-bottom: calc(var(--gap) * 1.5);
	}
}
/*Sections*/
section{
	padding: var(--sectionPadding);
	position: relative;
	z-index: 1;
}
/*Rows*/
section > .row + .row{
	margin-top: 2.75rem;
}
@media screen and (max-width: 40em) {
	section > .row + .row{
		margin-top: 2.5rem;
	}
}
/*Visibility*/
.line2{display: none!important;}
.socials a[href*="#"], .creds a[href*="#"]{display: none!important;}
.sticky{
	top: 0;
	display: block;
	position: -webkit-sticky;
	position: sticky;
	top: calc(var(--gap) + var(--menuHeight));
}
/*Utility Classes*/
/*Brings text based elements closer together*/
.condensed > *{--textSpacing: 0 0 1rem 0;}
.condensed h3{line-height: 110%;}
.text.condensed p{line-height: 110%;}
/*Makes overall text size smaller as well as compact*/
.smallText{font-size: 0.8em}
.smallText > *{--textSpacing: 0 0 1rem 0;}
/*Set text align to "center"*/
.tac{text-align: center;}
/*Set text align to "right"*/
.tar{text-align: right;}
.zeroMargin{margin: 0!important;}
.zeroPadding{padding: 0!important;}
.padBottom{padding-bottom: 3.75rem!important;}@media screen and (max-width: 39.9375em) {.padBottom{padding-bottom: 0rem!important}}
.padTop{padding-top: 3.75rem!important;}@media screen and (max-width: 39.9375em) {.padTop{padding-bottom: 0rem!important}}
.rel{
	position: relative;
}
/*Show for Small only*/
@media screen and (min-width: 40em) {.showSmall{display: none;}}
/*Show for Medium and Small*/
@media screen and (min-width: 64em) {.showMedium{display: none;}}
/*Show for Large only*/
@media screen and (max-width: 64em) {.showLarge{display: none;}}
/*Hide on Small only*/
@media screen and (max-width: 40em) {.hideSmall{display: none;}}
/*Hide on Medium and Small*/
@media screen and (max-width: 64em) {.hideMedium{display: none;}}
/*Hide on large only*/
@media screen and (min-width: 64em) {.hideLarge{display: none;}}

/*-------------------------------------------------------------------------*/
/*Background Color Variations*/
/*-------------------------------------------------------------------------*/
.darkBg{background-color: var(--dark);}
.paleBg{background-color: var(--muted);}
.primaryBg{background-color: var(--primary);}
.secondaryBg{background-color: var(--secondary);}
.whiteBg{background-color: var(--white300);}
.blackBg{background-color: var(--black300);}
.gradeBg{background-image: linear-gradient(to left, var(--secondary), var(--primary));}

/*-------------------------------------------------------------------------*/
/*Text Color Variations*/
/*-------------------------------------------------------------------------*/
.darkText{color: var(--dark)!important;}
.paleText{color: var(--muted)!important;}
.accentText{color: var(--primary)!important;}
.secondaryText{color: var(--secondary)!important;}
.whiteText{color: var(--white300)!important;}
.blackText{color: var(--black)!important;}
/*-------------------------------------------------------------------------*/
/*TopBar*/
/*-------------------------------------------------------------------------*/
.topBar.stayThere{
	top: 0!important;
}
.topBar{
	transition: top 0.5s ease, background-color 0.5s ease;
	padding: 1.5em var(--secX);
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 101;
}
.topBar.stuck{
	background-color: var(--darker);
}
.topBar.stuck .socials{
	margin-left: 0px;
}
.topBar.stuck nav ul{
	margin-right: 0;
}
@media screen and (max-width: 64.9375em) {
	.topBar.stuck nav ul{
		margin-right: unset;
	}
}
.topBar.stuck .headerBtn{
	transition: margin 0.5s ease;
	margin-right: 0!important;
}
.logo{
	height: 70px;
}
@media screen and (max-width: 40em) {
	.logo{
		height: 44px;
	}
}
.headerBtn{
	font-size: var(--fs200)!important;
	margin-right: 2.8em;
}
@media screen and (max-width: 39em) {
	.headerBtn{
		display: none!important
	}
}
/*-------------------------------------------------------------------------*/
/*Navigation*/
/*-------------------------------------------------------------------------*/
nav ul{
	text-align: right;
	margin-right: 1em;
	transition: margin 0.5s ease;
}
nav > ul > li:last-of-type{
	display: none;
}
nav ul li{
	display: inline-block;
	position: relative;
}
nav ul li a{
	font-weight: 500;
	color: var(--white300);
	padding: 0 0.7em;
	font-size: var(--fs200);
	display: inline-block;
	line-height: 2.6em;
	transition: color 0.5s ease;
}
nav ul li a.active{border-bottom: 1px solid var(--secondary);}
@media screen and (max-width: 64em) {
	nav ul li a.active{border-bottom: 0px solid var(--secondary); color: var(--primary)}
}
nav ul li a:hover{color: var(--primary);}
/*Show an arrow for items that have sub-menus*/
nav ul li > a:after {
	content: '\f078';
	color: var(--secondary);
	margin-left: 6px;
	width: 0;
	text-align: center;
	font-family: 'Font Awesome 5 Pro';
	font-weight: 500;
	font-size: 10px;
}
nav ul li > a:only-child:after { display: none;}
nav ul li:hover > a:after {color: var(--primary);}
nav > ul > li:hover ul{display: block;}
/*Sub Menu*/
nav > ul > li > ul{
	box-shadow: var(--shadow);
	text-align: left;
	border: none;
	background-color: var(--dark);
	overflow: hidden;
	display: none;
	left: 0px;
	position: absolute;
	padding: 15px;
	z-index: 100;
}
nav > ul > li > ul li{
	clear: both;
	width: 100%;
	display: block;
	white-space: nowrap;
}
nav > ul > li > ul li a{
	line-height: 36px;
	display: block;
}
nav > ul > li > ul li a:hover{color: var(--primary);}
@media screen and (max-width: 64em) {
	nav.shown{
		pointer-events: initial;
		opacity: 1;
	}
	nav .socials{
		display: block;
		width: 100%;
		text-align: right;
		margin: 3rem 0 0 0!important;
	}
	nav .socials a{
		font-size: 18px;
		width: 44px!important;
		height: 44px!important;
		line-height: 44px!important;
	}
	nav{
		transition: opacity 0.55s ease;
		pointer-events: none;
		opacity: 0;
		position: fixed;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 100vh;
		width: 500px;
		top: 0;
		right: 0;
		z-index: 100;
		background-color: var(--darker);
		padding: 0 calc(var(--secX) + 1.2em);
		margin: 0;
	}
	nav:before{
		content: '';
		background-image: url('../images/brand.png');
		height: 100%;
		width: 100%;
		bottom: -30%;
		left: 0;
		position: absolute;
		opacity: 0.1;
		background-position: center;
		background-size: cover;
		z-index: -1;
	}
	nav ul{
		width: 100%;
		margin: 0!important;
	}
	nav ul li > a:after {
		font-size: 16px;
		position: absolute;
		top: 0px;
		right: -10px;
		margin: 0;
	}
	nav ul li,nav ul li:last-of-type{
		width: 100%;
		display: block;
	}
	nav ul li a{
		font-weight: 500;
		display: block;
		line-height: 2.7rem;
		color: var(--white300);
		padding: 0;
		font-size: var(--fs700);
		text-align: right;
	}
	/*Sub Menu*/
	nav ul li:hover ul{
		display: none;
	}
	nav > ul > li > ul li a{
		line-height: 2em;
		font-size: var(--fs300);
		font-weight: 500;
		opacity: 0.7;
	}
	nav > ul > li > ul{
		padding: 1em 0;
		background-color: transparent;
		position: relative;
		box-shadow: none;
	}
}
@media screen and (max-width: 40em) {
	nav{
		width: 320px;
	}
}
/*-------------------------------------------------------------------------*/
/*Show Menu Button*/
/*-------------------------------------------------------------------------*/
.showMenu{
	display: none;
}
@media screen and (max-width: 64em) {
	/*Containing Element*/
	.showMenu{
		cursor: pointer;
		height: 50px;
		width: 50px;
		float: right;
		margin-left: 1em;
		display: block;
		position: relative;
		z-index: 101;
		top: 0;
		right: 0;
	}
	/*Default State*/
	.showMenu .bar{
		transition: background-color 0.5s ease, width 0.5s ease, transform 0.5s ease;
		background-color: var(--white300);
		width: 70%;
		margin: 0 15%;
		position: relative;
		height: 2px;
		top: calc(50% - 1px);
	}
	.showMenu .bar:before, .showMenu .bar:after{
		transition: all 0.5s ease;
		content: '';
		height: 100%;
		background-color: inherit;
		position: absolute;
		right: 0;
	}
	.showMenu .bar:before{
		width: 80%;
		top: -8px;
	}
	.showMenu .bar:after{
		bottom: -8px;
		width: 50%;
	}
	/*Clicked State*/
	.showMenu.menuVisible .bar{
		transform: rotate(45deg);
		background-color: var(--primary);
	}
	.showMenu.menuVisible .bar:before{
		transform: rotate(90deg);
		width: 100%;
		top: 0;
	}
	.showMenu.menuVisible .bar:after{
		transform: rotate(90deg);
		width: 100%;
		top: 0;
	}
}
/*-------------------------------------------------------------------------*/
/*Header*/
/*-------------------------------------------------------------------------*/
header .text p{
	font-size: var(--fs400)
}
/*Other Header*/
header.other{
	background-color: var(--dark);
	overflow: hidden;
	z-index: 1;
	position: relative;
}
header.other:before{
	content: '';
	width: 100%;
	height: 120px;
	z-index: 2;
	position: absolute;
	top: 0;
	left: 0;
	background-image: linear-gradient(to bottom, var(--darker), rgba(0,0,0,0.0));
}
header.other:after{
	content: '';
	position: absolute;
	width: 500px;
	height: 500px;
	background-size: cover;
	bottom: -100px;
	opacity: 0.05;
	transform: rotate(45deg);
	left: -100px;
	z-index: 4;
	filter: brightness(0) invert(1);
	background-image: url('../images/brand.png');
}
/*Header Text*/
.headerText{
	position: relative;
	z-index: 10;
	padding-top: 200px;
	padding-bottom: 150px;
}
@media screen and (max-width: 90rem) {
	.headerText{
		padding-left: calc(1.2em + var(--secX));
	}
}
@media screen and (max-width: 64em) {
	.headerText{
		position: relative;
		z-index: 10;
		padding: 500px calc(1.2em + var(--secX)) 3rem calc(1.2em + var(--secX));
	}
}
@media screen and (max-width: 39.9375em) {
	.headerText{
		padding: 340px calc(1.2em + var(--secX)) 2rem calc(1.2em + var(--secX));
	}
}
@media screen and (max-width: 64em) {
	.headerText.text h2,
	.headerText.text h1{
		font-size: var(--fs800);
	}	
}
/*header images*/
.headerImage{
	padding: 0!important;
	position: relative;
}
.headerImage img{
	opacity: 1;
	position: absolute;
	left: 0;
	max-width: 10000px;
	object-fit: cover;
	height: 100%;
	top: 0;
	width: calc(100% + var(--gutter))!important;
	transition: width 0.5s ease;
}
@media screen and (max-width: 64em) {
	.headerImage{
		order: -1;
	}
	.headerImage img{
		height: 450px;
	}
}
@media screen and (max-width: 40em) {
	.headerImage img{
		height: 290px;
	}
}
/*Home Header*/
header.home{
	height: auto;
	background-color: var(--dark);
	width: 100%;
	overflow: hidden;
	position: relative;
	z-index: 1;
}
header.home:after{
	content: '';
	width: 10000px;
	height: 10000px;
	top: calc(50% - 5000px);
	left: calc(50% - 5000px);
	position: absolute;
	opacity: 0.1;
	z-index: -1;
	background-image: url('../images/brand.png');
	background-size: 250px;
	background-repeat: space;
	transform: rotate(10deg);
	background-position: 200px 200px;
}
@media screen and (max-width: 64em) {
	header.home:after{
		display: none;
	}
}
header.home .flickity-viewport{
	overflow: visible;
}
/*Arrows*/
.flickity-page-dots .dot.is-selected{
	background-color: var(--primary);
}
.flickity-page-dots .dot{
	width: 50px;
	height: 4px;
	border-radius: 0;
	margin: 0;
	padding: 0;
	display: block;
	float: left;
}
.flickity-page-dots {
	bottom: 20px;
	left: 0px;
	background-color: var(--muted);
	width: auto;
}
/*Slider Slides*/
.homeSlider .slide{
	background-color: #FFFFFF;
	width: 100%;
	margin-right: 0;
}
@media screen and (max-width: 64em) {
	.homeSlider .slide{
		background-color: var(--dark);
	}
}
.homeSlider{
	position: relative;
	z-index: 1;
}
.homeSlider:before, .homeSlider:after{
	content: '';
	width: 400%;
	height: 250px;
	z-index: 3;
	position: absolute;
	top: 0em;
	transition: width 0.5s ease;
	right: -400px;
	opacity: 0.3;
	background-image: linear-gradient(to bottom, var(--darker), rgba(0,0,0,0.0));
}

/*Slider Image Container*/
.homeSlider .slide .slideImg{
	position: relative;
	height: 750px;
	z-index: 1
}
@media screen and (max-width: 64em) {
	.homeSlider .slide .slideImg{
		height: 550px;
	}	
}
@media screen and (max-width: 40em) {
	.homeSlider .slide .slideImg{
		height: 400px;
	}	
}
/*Slider Images*/
.homeSlider .slide img{
	object-fit: cover;
	object-position: right center;
	transition: width 0.7s ease, max-width 0.7s ease;
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 100%;
}
.homeSlider .slide.is-selected img, .homeSlider .slide:first-of-type img{
	width: calc(100% + var(--gutter));
	max-width: calc(100% + var(--gutter));
}

/*Slider Text Container*/
.homeSlider .slide .slideText{
	position: relative;
	padding: 4rem 4rem 2rem 4rem;
	overflow: hidden;
}
@media screen and (max-width: 64em) {
	.homeSlider .slide .slideText:before{
		content: '';
		width: 200px;
		height: 200px;
		opacity: 0.2;
		position: absolute;
		bottom: -40px;
		right: -40px;
		background-size: cover;
		background-position: center;
		background-image: url('../images/brand.png');
		transform: rotate(-45deg);
	}
	.homeSlider .slide .slideText{
		padding: 4rem;
		background-color: var(--muted);
		z-index: 5;
		width: calc(100% - var(--secX) - 2.4em)!important;
		flex: 1;
		margin: -4rem calc(var(--secX) + 1.2em) 2rem calc(var(--secX) + 1.2em);
	}
}
@media screen and (max-width: 40em) {
	.homeSlider .slide .slideText{
		padding: 2rem;
		height: 100%;
	}
}

/*Slider Text Elements*/
.homeSlider .slide .slideText a i{
	margin-left: 10px;
}
.homeSlider .slide.is-selected .slideText p{
	left: 0;
	opacity: 1;
}
@media screen and (max-width: 64em) {
	.slideText hr{
		display: none!important
	}
}
.homeSlider .slide .slideText p{
	transition: left 0.5s ease, opacity 0.5s ease;
	transition-delay: 0.4s;
	max-width: 85%;
	position: relative;
	opacity: 0;
	left: 50px;
}
@media screen and (max-width: 40em) {
	.homeSlider .slide .slideText p{
		max-width: 100%
	}
}
.homeSlider .slide.is-selected .slideText a{
	left: 0;
	opacity: 1;
}
.homeSlider .slide .slideText a:hover{
	color: var(--black300)
}
.homeSlider .slide .slideText a{
	transition: left 0.5s ease 0.6s, opacity 0.5s ease 0.6s, color 0.5s ease;
	opacity: 0;
	position: relative;
	left: 50px;
	color: var(--primary);
	font-weight: bold;
	display: block;
	margin-top: 50px!important;
}
.homeSlider .slide .slideText.text h2,
.homeSlider .slide .slideText.text h1{
	opacity: 0;
	font-size: var(--fs900);
	top: 50px;
	position: relative;
	transition: top 0.5s ease, opacity 0.5s ease;
	transition-delay: 0.2s;
}
@media screen and (max-width: 64em) {
	.homeSlider .slide .slideText.text h2,
	.homeSlider .slide .slideText.text h1{
		font-size: var(--fs800);
	}	
}
.homeSlider .slide.is-selected .slideText.text h2,
.homeSlider .slide.is-selected .slideText.text h1{
	opacity: 1;
	top: 0px;
}

/*-------------------------------------------------------------------------*/
/*Intro Section*/
/*-------------------------------------------------------------------------*/
@media screen and (max-width: 39em) {
	.intro{
		padding-top: 120px;
	}
}
.numero{
	font-size: 100px;
	position: absolute;
	color: var(--primary);
	top: -4rem;
	left: 10px;
	font-weight: 900;
	letter-spacing: -8px;
	opacity: 0.2;
	z-index: -1;
}
.card i{
	margin-top: 0.75em;
}
.card{
	border: 1px solid rgba(255,255,255,0.05);
	padding: var(--boxPadding);
	height: 100%;
}
@media screen and (max-width: 64.9375em) {
	.card{
		height: initial;
	}
}

/*Process Cards*/
.theProcess .columns{
	margin-bottom: 2.4rem!important;
}
.process h3 span{
	color: var(--primary)
}
.process{
	z-index: 1;
	position: relative;
	height: 100%;
	background-color: var(--dark);
	padding: var(--boxPadding);
}
.process.begin{
	background-color: var(--primary);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	cursor: pointer;
}
.process.begin:hover::after{
	width: 400px;
	height: 400px;
}
.begin:after{
	content: '';
	transition: 0.5s ease;
	position: absolute;
	width: 200px;
	height: 200px;
	top: 50%;
	left: 50%;
	opacity: 0.2;
	transform: translate(-50%, -50%);
	background-size: cover;
	z-index: -1;
	filter: brightness(0);
	background-image: url('../images/brand.png');
}

/*-------------------------------------------------------------------------*/
/*Content Section*/
/*-------------------------------------------------------------------------*/
section.content{
	padding: 0px;
	overflow: hidden;
}
.content:nth-child(odd){
	background-color: var(--muted);
}
/*Main*/
.content main{
	padding-top: 6rem;
	padding-bottom: 6rem
}
.content:nth-child(odd) main{
	padding-left: 4rem;
}
.content:nth-child(even) main{
	padding-right: 4rem;
}
@media screen and (max-width: 90rem) {
	.content:nth-child(odd) main{
		padding-right: calc(1.2em + var(--secX))
	}
	.content:nth-child(even) main{
		padding-left: calc(1.2em + var(--secX))
	}	
}
@media screen and (max-width: 64em) {
	section.content main{
		padding: 6rem calc(1.2em + var(--secX))!important 
	}
}
@media screen and (max-width: 40em) {
	section.content main{
		padding: 4rem calc(1.2em + var(--secX))!important 
	}
}
/*Aside*/
.content aside > img{
	width: calc(100% + var(--gutter));
	max-width: 50vw;
	object-fit: cover;
	height: 100%;
	left: 0;
	position: absolute;
	z-index: -1;
	transition: width 0.5s ease;
}
@media screen and (max-width: 64em) {
	.content aside > img{
		width: 100%;
		max-width: 100%;
	}
}
.content aside{
	padding: 0px!important;
	position: relative;
	z-index: 1;
}
.content:nth-child(odd) aside, .content.flipped aside{
	order: -1;
}
@media screen and (max-width: 64em) {
	section.content aside{
		order: -1;
		height: 50vh;
	}
}
.content:nth-child(odd) aside > img, .content.flipped aside > img{
	left: unset;
	right: 0;
}
/*Lickle Blocks*/
.block{
	position: absolute;
	background-color: var(--primary);
	left: -60px;
	width: 120px;
	padding: 10px;
	top: 50%;
	transform: translateY(-50%);
}
.content:nth-of-type(odd) .block, .content.flipped .block{
	left: unset;
	right: -60px;
}
.block img{
	padding: 10px;
	margin: 0!important;
	filter: brightness(0) invert(1);
}
.text .block p{
	line-height: 120%;
	text-align: center;
	margin-bottom: 10px;
	color: white;
}
@media screen and (max-width: 64em) {
	.text .block p{
		font-size: 10px;
	}
	.block{
		width: 100px;
		right: unset;
		left: calc(1.2em + var(--secX))!important;
		top: unset;
		bottom: 0;
		transform: translateY(20px);
	}
}
/*-------------------------------------------------------------------------*/
/*CTA Section*/
/*-------------------------------------------------------------------------*/
.cta{
	z-index: 1;
	overflow: hidden;
}
.cta:before, .cta:after{
	content: '';
	z-index: -1;
	background-image: url('../images/brand.png');
	position: absolute;
	background-size: cover;
}
.cta:before{
	left: -100px;
	width: 320px;
	height: 320px;
	opacity: 0.1;
	filter: brightness(0) invert(1);
	top: 30px;
	transform: rotate(45deg);
}
.cta:after{
	width: 450px;
	height: 450px;
	right: -180px;
	opacity: 0.1;
	top: 0px;
	transform: rotate(-45deg);
}

/*-------------------------------------------------------------------------*/
/*Feature Section*/
/*-------------------------------------------------------------------------*/
section.feature{
	padding: 0;
}
/*Main Container*/
.featureBox{
	float: right;
	height: 600px;
	width: calc(100% + var(--gutter));
	display: flex;
	position: relative;
	z-index: 1;
}
.featureBox:after{
	content:'';
	width: 100%;
	height: 100px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	background-image: linear-gradient(to bottom, rgba(0,0,0,.5), rgba(0,0,0,0.0));
	pointer-events: none;
}
@media screen and (max-width: 64em) {
	.featureBox{
		float: right;
		height: 400px;
		display: flex;
		position: relative;
		z-index: 1;
	}
}
@media screen and (max-width: 39em) {
	.featureText{
		order: -1;
	}
}

/*Text Beside Feature Images*/
.featureText{
	padding-right: 3rem!important;
}
@media screen and (max-width: 64em) {
	.featureText{
		padding: 3rem calc(var(--secX) + 1.2em) !important;
	}
}
@media screen and (max-width: 39em) {
	.featureText{
		order: -1;
	}
}
/*Feature Main Elements*/
.featureBox .service{
	display: block;
	position: relative;
	height: 100%;
	z-index: 1;
	overflow: hidden;
	width: 33.33%;
	transition: width 0.8s ease;
}
.featureBox .service:after{
	content:'';
	width: 200px;
	height: 100%;
	position: absolute;
	top: 0;
	z-index: -2;
	left: 0;
	background-image: linear-gradient(to right, rgba(0,0,0,.7), rgba(0,0,0,0.0));
	pointer-events: none;
}
.featureBox:hover .service{
	width: 80px;
}
.featureBox .service:hover{
	width: calc(100% - 160px);
}
/*Images*/
.featureBox .service img{
	object-fit: cover;
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: -4;
}
/*Vertical P*/
.featureBox .service p{
	color: white;
	font-size: var(--fs400);
	font-weight: 400;
	position: absolute;
	padding: 0 0 0 40px;
	line-height: 80px;
	top: 100%;
	left: 0;
	width: 600px;
	transform-origin: 0% 0%;
	transform: rotate(-90deg);
	margin: 0;
	z-index: 4;
}
/*Span Number*/
.featureBox .service span{
	color: var(--primary);
	font-weight: 700;
	font-size: var(--fs800);
	position: absolute;
	letter-spacing: -2px;
	width: 80px;
	line-height: 80px;
	text-align: center;
	top: 0;
	margin: 0;
	z-index: 4;
}


/*-------------------------------------------------------------------------*/
/*You Might Also Like Boxes*/
/*-------------------------------------------------------------------------*/
.pageLink{
	background-color: white;
	height: 100%;
	transition: background-color 0.5s ease;
}
.pageLink .text h3, .pageLink .text p{
	transition: color 0.5s ease;
}
.pageLink:hover .text p{
	color: var(--white100);
}
.pageLink:hover .text h3{
	color: white;
}
.pageLink:hover{
	background-color: var(--darker);
	color: white;
}
.pageText{
	padding: var(--boxPadding);
	padding-top: 4rem;
	position: relative;
}
.pageText.text i{
	left: var(--boxPadding);
	margin: 0;
	position: absolute;
	background-color: var(--primary);
	color: white;
	font-size: 1.4rem;
	width: 50px;
	line-height: 50px;
	text-align: center;
	margin-bottom: 0;
	top: -20px;
}
.pageLink img{
	width: 100%;
	height: 280px;
	object-fit: cover;
}

/*-------------------------------------------------------------------------*/
/*Text Styles Basics*/
/*-------------------------------------------------------------------------*/
/*Last element in text block has no margin-bottom*/
.text > *:last-child{
	margin-bottom: 0;
}

/*-------------------------------------------------------------------------*/
/*Headings*/
/*-------------------------------------------------------------------------*/
.text h1, .text h2, .text h3, .text h4, .text h5, .text h6{
	margin: 0 0 0.5em 0;
	letter-spacing: 0px;
	font-weight: 500;
	line-height: 115%;
	color: var(--dark);
}
.light h1, .light h2, .light h3, .light h4, .light h5, .light h6{
	color: var(--white300);
	font-weight: 400!important;
}
.text h1 span{color: var(--primary);}
.text h2 span{color: var(--primary);}
.text h3 span{color: var(--primary);}
.text h4 span{color: var(--primary);}
.text h5 span{color: var(--primary);}
.text h6 span{color: var(--primary);}

.text h1{font-size: var(--fs900);}
.text h2{font-size: var(--fs800);}
.text h3{font-size: var(--fs700);}
.text h4{font-size: var(--fs600);}
.text h5{font-size: var(--fs500);}
.text h6{font-size: var(--fs400);}

/*-------------------------------------------------------------------------*/
/*Ems, Strongs, Bolds and Spans*/
/*-------------------------------------------------------------------------*/
.text > * em{
	color: var(--primary);
	font-style: initial;
}
.text > span{
	font-size: var(--fs200);
	font-weight: 500;
	position: relative;
	color: var(--primary);
	display: block;
}

/*-------------------------------------------------------------------------*/
/*Figures*/
/*-------------------------------------------------------------------------*/
.text figure{
	z-index: 1;
	overflow: hidden;
	margin: var(--textSpacing);
	border-radius: var(--brMedium);
	position: relative;
}
.text figure img{
	margin-bottom: 0;
}
.text figure figcaption{
	background-color: rgba(0,0,0,0.75);
	color: var(--white200);
	position: absolute;
	padding: 1.2em;
	width: 100%;
	left: 0px;
	bottom: 0px;
	font-size: var(--fs200);
}

/*-------------------------------------------------------------------------*/
/*Articles*/
/*-------------------------------------------------------------------------*/
article > *{
	--textSpacing: 0 0 1rem 0;
}
article{
	width: 100%;
	font-size: 0.9em;
	position: relative;
	padding: calc(var(--boxPadding) + 2em) var(--boxPadding) calc(var(--boxPadding) + 2em) calc(220px + var(--boxPadding));
	overflow: hidden;
	background-color: var(--muted);
	border-radius: var(--brMedium);
	margin: 0 0 var(--gap) 0;
	z-index: 1;
}
article:before{
	content: '';
	position: absolute;
	width: 301px;
	left: 0;
	top: 0;
	z-index: -1;
	height: 100%;
	background-image: linear-gradient(to right, transparent, var(--muted));
}
article.darkBg:before{background-image: linear-gradient(to right, transparent, var(--dark))}
article img{
	pointer-events: none;
	border-radius: 0!important;
	object-fit: cover;
	position: absolute;
	width: 300px;
	height: 100%;
	left: 0;
	z-index: -2;
	top: 0;
}
/*Stacked*/
article.stacked{
	padding: calc(180px + var(--boxPadding)) var(--boxPadding) var(--boxPadding) var(--boxPadding) ;
}
article.stacked img{
	width: 100%;
	height: 220px;
}
article.stacked:before{
	height: 221px;
	width: 100%;
	background-image: linear-gradient(to bottom, transparent, var(--muted))
}
article.stacked.darkBg:before{background-image: linear-gradient(to bottom, transparent, var(--dark))}
@media screen and (max-width: 40em) {
	article{
		padding: calc(120px + var(--boxPadding)) var(--boxPadding) var(--boxPadding) var(--boxPadding) ;
	}
	article img{
		width: 100%;
		height: 200px;
	}
	article:before{
		height: 201px;
		width: 100%;
		background-image: linear-gradient(to bottom, transparent, var(--muted))
	}
	article.darkBg:before{background-image: linear-gradient(to bottom, transparent, var(--dark))}
}
/*-------------------------------------------------------------------------*/
/*Images*/
/*-------------------------------------------------------------------------*/
.text img{
	margin: var(--textSpacing);
	border-radius: var(--brMedium);
}
.littleImg{
	width: 60px;
}
/*-------------------------------------------------------------------------*/
/*Horizontal Rules and Breaks*/
/*-------------------------------------------------------------------------*/
@keyframes wideon{
	from{width: 0px}
	to{width: 80px}
}
.wideOn, .slide.is-selected hr{
	animation-duration: 1s;
	animation-fill-mode: both;
	-webkit-animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-name: wideon;
	-webkit-animation-name: wideon;
}
.text hr{
	max-width: 80px;
	position: relative;
	display: block;
	height: 2px;
	margin: var(--textSpacing);
	background-color: var(--primary);
	border: 0px!important;
}
.accentBg hr, .gradeBg hr{
	background-color: #FFFFFF;
}
br{
	content:'';
	display: block;
	width: 100%;
	height: 0.5em;
}

/*-------------------------------------------------------------------------*/
/*Paragraphs*/
/*-------------------------------------------------------------------------*/
.text p{
	color: var(--black100);
	font-size: var(--fs300);
	line-height: 160%;
	font-weight: 500;
	margin: var(--textSpacing);
}
.text p.statement{
	font-weight: bold;
	font-size: var(--fs400);
}
.text p.smallPrint{
	font-size: var(--fs100);
	opacity: 0.8;
}
.text p b{
	color: var(--black200);
	font-weight: 800!important;
}
.text p a{
	color: var(--secondary);
	text-decoration: underline;
}
/*Dark Mode*/
.light p b{
	color: var(--white200)
}
.light p{
	color: var(--white100);
}

/*-------------------------------------------------------------------------*/
/*Icons*/
/*-------------------------------------------------------------------------*/
.text > i{
	color: var(--primary);
	font-size: var(--fs800);
	display: inline-block;
	margin-bottom: 1.2em;
}
.text > i + i{
	margin-left: 1em;
}
.text > i.fa-whatsapp{
	color: #2BA63A;
}
.text p i{
	font-size: var(--fs500);
	line-height: 80%;
	height: 100%;
	width: 20px;
	text-align: center;
	display: inline-block;
	margin-right: 1rem;
}

/*-------------------------------------------------------------------------*/
/*Address and hours*/
/*-------------------------------------------------------------------------*/
.text address, .hours{
	margin: var(--textSpacing);
}
.text address p, .hours p{
	margin-bottom: unset;
	font-style: initial;
}
p.dib{
	display: inline-block;
}
.hours p b{
	width: 100px;
	display: inline-block;
}
.hours p.today{
	font-weight: bold;
	color: var(--primary);
}

/*-------------------------------------------------------------------------*/
/*Basic Masonry Layout*/
/*-------------------------------------------------------------------------*/
.masonry{
	columns: 2!important;
	column-gap: 2em;
}
.masonry > *{
	break-inside: avoid-column !important;
}
@media screen and (max-width: 40em) {
	.masonry{
		columns: 1 !important;
		column-gap: var(--gap);
	}
}

/*-------------------------------------------------------------------------*/
/*Blockquotes*/
/*-------------------------------------------------------------------------*/
.stars{
	color: goldenrod;
	margin-top: 0.7em;
}
.stars i{
	display: inline-block;
}
.avgRating p{
	line-height: 120%;
	margin-bottom: 0;
}
.avgRating h4{
	margin-top: 6px;
	margin-bottom: 6px;
}
.avgRating .columns{
	margin-bottom: 0px!important
}
.avgRating{
	background-color: var(--muted);
	padding: var(--boxPadding);
}
.avgRating .rating span{
	font-size: 1.4rem;
	color: var(--black200);
}
.avgRating .rating{
	color: var(--primary);
	display: inline-block;
	font-size: 2.6em
}
@keyframes fadeInUp{
	from{
		opacity: 0;
		top: 20px;
	}
	to{
		opacity: 1;
		top: 0;
	}
}
.fadeInUp{
	animation-duration: 1s;
	animation-fill-mode: both;
	-webkit-animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-name: fadeInUp;
	-webkit-animation-name: fadeInUp;
}
.text blockquote:after{
	content: '';
	position: absolute;
	width: 100px;
	height: 100px;
	bottom: -1em;
	right: -1em;
	opacity: 0.5;
	z-index: -1;
	background-image: url('../images/brand.png');
	background-size: cover;
	transform: rotate(-45deg);
}
.text blockquote{
	z-index: 1;
	top: 20px;
	overflow: hidden;
	position: relative;
	background-color: var(--muted);
	border-radius: var(--brMedium);
	margin: 0 0 2.4em;
	padding: var(--boxPadding);
	font-size: var(--fs200);
}
.text blockquote > *{
	--textSpacing: 0 0 0.8rem 0;
}
.text blockquote p{
	font-style: initial;
}
.text blockquote p:last-of-type:before{
	content: 'Reviewed by ';
}
.text blockquote p:last-of-type{
	margin-bottom: 0!important;
	font-style: initial;
	color: var(--primary);
	margin-top: 2em;
}
@media screen and (max-width: 40em) {
	.text blockquote{
		margin-bottom: var(--gap);
	}
}
/*Dark Mode*/
.light blockquote{
	background-color: rgba(0,0,0,0.2);
}
/*Alt Mode*/
.paleBg .text blockquote{
	background-color: rgba(255,255,255,0.5);
}

/*-------------------------------------------------------------------------*/
/*Buttons*/
/*-------------------------------------------------------------------------*/
.text a.btn i{
	margin-left: 1em;
	color: inherit;
	position: relative;
	transition: 0.5s ease;
	top: 0;
}
.text a.btn.goDown:hover i{
	top: 7px;
}
.text a.btn + a.btn{
	background-color: transparent;
	box-shadow: none;
	color: var(--dark);
}
.text.light a.btn + a.btn{
	color: var(--white300)
}
.text a.btn:hover{
	background: var(--darker);
	color: var(--secondary);
}
.text a.btn{
	cursor: pointer;
	font-size: var(--fs200);
	background: var(--primary);
	padding: 1em 1.2em;
	font-weight: 600;
	height: auto;
	margin-right: 1em;
	display: inline-block;
	transition: background-color 0.5s, color 0.5s ease, width 0.5s ease, margin 0.5s ease;
	cursor: pointer;
	color: var(--white300);
	border-radius: var(--brSmall);
	position: relative;
}
/*Stack Buttons on Mobile*/
@media screen and (max-width: 40em) {
	.text a.btn{
		display: block;
		text-align: center;
		margin-right: 0;
		margin-bottom: 1em;
	}
	.text a.btn + a.btn{
		margin-bottom: 0;
	}
}
.text a.btn + a.btn:hover{
	background-color: transparent;
	color: var(--secondary);
}

/*-------------------------------------------------------------------------*/
/*Tables*/
/*-------------------------------------------------------------------------*/
.text table{
	width: 100%;
	text-align: left;
	margin: var(--textSpacing);
	border-radius: var(--brMedium);
	border-collapse: collapse;
	overflow: hidden;
	font-size: var(--fs200);
}
.text table tr:first-of-type{
	font-size: 1.2em;
	background-color: var(--dark)!important;
}
.text table tr th{
	color: #FFFFFF;
	font-weight: 400;
}
.text table td, table th{
	padding: 10px;
}
.text table tr:nth-of-type(even){
	background-color: rgba(0,0,0,0);
}
.text table tr:nth-of-type(odd){
	background-color: rgba(0,0,0,0.05);
}
/*Dark Mode*/
.light table tr:nth-of-type(odd){
	background-color: rgba(0,0,0,0.1);
}
.light table tr:first-of-type{
	background-color: var(--muted)!important;
}
.light table tr th{
	color: var(--dark);
	font-weight: 600;
}
.light table tr{
	color: var(--white100)
}
/*Alt Mode*/
.paleBg .text table{

}
/*-------------------------------------------------------------------------*/
/*Unordered Lists*/
/*-------------------------------------------------------------------------*/

.text ul{
	font-size: 0.9em;
	margin-bottom: var(--gap);
	font-weight: 500;
}
.text ul.twoCols{
	-webkit-columns: 2;
	-moz-columns: 2;
	-o-columns: 2;
	columns: 2;
}
.text ul li{
	color: var(--black200);
	display: inline-block;
	width: 100%;
	line-height: 200%;
}
.text ul li:before{
	color: var(--primary);
	display: inline-block;
	content: '\f86c';
	font-family: 'Font Awesome 5 Pro';
	font-weight: 500;
	line-height: inherit;
	padding: 0;
	margin: 0 1em 0 0;
}
/*Dark Mode*/
.light ul li{
	color: var(--white200);
}

/*-------------------------------------------------------------------------*/
/*Unordered Lists Emphasized*/
/*-------------------------------------------------------------------------*/
.text ul.chonky li{
	display: inline-block;
	width: 100%;
	line-height: 160%;
	margin-bottom: 16px;
	border: 1px solid rgba(0,0,0,0.2);
	padding: 12px 18px;
	border-radius: var(--brSmall);
}
.text ul.chonky li:before{
	content: '-';
}
.text ul.chonky li:last-of-type{
	margin-bottom: 0;
}
/*Dark Mode*/
.light ul.chonky li{
	background-color: rgba(0,0,0,0.5);
}
/*Alt Mode*/
.paleBg .text ul.chonky li{
	background-color: rgba(255,255,255,0.5);
}

/*-------------------------------------------------------------------------*/
/*Ordered Lists*/
/*-------------------------------------------------------------------------*/
.text ol{
	font-weight: 500;
	font-size: 0.9em;
	margin-bottom: var(--gap);
}
.text ol.twoCols{
	-webkit-columns: 2;
	-moz-columns: 2;
	-o-columns: 2;
	columns: 2;
}
.text ol li{
	color: var(--black200);
	display: inline-block;
	width: 100%;
	line-height: 210%;
	counter-increment: step-counter;
}
.text ol li:before{
	text-align: center;
	height: 100%;
	font-weight: bold;
	border-radius: var(--brSmall);
	width: 20px;
	color: var(--primary);
	display: inline-block;
	content: counter(step-counter)".";
	margin-right: 10px;
}
/*Dark Mode*/
.light ol li{
	color: var(--white200);
}

/*-------------------------------------------------------------------------*/
/*Ordered Lists*/
/*-------------------------------------------------------------------------*/
.text menu{
	font-weight: 500;
	font-size: 0.9em;
	list-style: none;
	padding: 0;
	margin: 0;
	border-radius: var(--brSmall);
	overflow: hidden;
}
.text menu li i{
	margin-right: 10px;
	color: var(--primary);
}
.text menu li.activeItem i{
	color: var(--white300);
}
.text menu li.activeItem{
	color: var(--white300);
	background-color: var(--secondary);
}
.text menu li{
	text-align: right;
	transition: color 0.5s ease, background-color 0.5s ease;
	font-size: 1em;
	color: var(--black200);
	display: inline-block;
	margin: 0 0 0 0.75em;
	padding: 0.8em 1.4em;
	cursor: pointer;
	border: 1px solid rgba(0,0,0,0.2);
}
@media screen and (max-width: 64em) {
	.text menu li{
		margin: 0 0.75em 0 0;
	}
}
@media screen and (max-width: 40em) {
	.text menu li{
		font-size: 0.625em;
	}
	.text menu li i{
		display: none;
	}
}

/*Make all lists 1 col on Small*/
@media screen and (max-width: 40em) {
	.text ul, .text ul.twoCols, .text ol.twoCols{
		-webkit-columns: 1;
		-moz-columns: 1;
		-o-columns: 1;
		columns: 1;
	}
}


/*-------------------------------------------------------------------------*/
/*Social Links*/
/*-------------------------------------------------------------------------*/
.socials{
	overflow: auto;
	text-align: left;
	margin-left: 2.8em;
	transition: margin 0.5s ease;
}
.socials a{
	color: var(--black300);
	overflow: hidden;
	padding: 0px;
	width: 20px;
	height: 46px;
	line-height: 46px;
	text-align: center;
	font-size: 1em;
	display: inline-block;
	-webkit-perspective: 1000;
	-webkit-backface-visibility: hidden;
	text-align: center;
	transition: transform 0.5s ease-out, background-color 0.5s ease, color 0.5s ease;
	margin-right: 0.2em;
}
.socials a img{
	margin: 0!important;
	width: 100%;
	height: 100%;
	display: block;
}
.socials a:hover{
	color: var(--white300)!important;
}
.topBar .socials a{
	background-color: var(--muted);
	width: 34px;
	height: 34px;
	line-height: 34px;
	transition: background-color 0.5s ease;
}

.socials a:hover[href*="facebook"]{background-color: #4B69B0;}
.socials a:hover[href*="twitter"]{background-color: #37B1E1;}
.socials a:hover[href*="instagram"]{background: #d6249f;background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);}
.socials a:hover[href*="youtube"]{background-color: #E83F3A;}
.socials a:hover[href*="whatsapp"]{background-color: #2BA63A;}
.socials a:hover[href*="linkedin"]{background-color: #0074B2;}

/*-------------------------------------------------------------------------*/
/*Definition Lists*/
/*-------------------------------------------------------------------------*/
.text dl {
	font-size: 0.9em;
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin-bottom: var(--gap);
}
.text dl > * {
	padding-top: 10px;
}
.text dt {
	width: 25%;
	color: var(--primary);
	font-size: 1.2em;
	padding-right: 10px;
	line-height: 125%;
	font-weight: bold;
}
.text dd {
	width:75%;
	color: var(--black200);
	padding-left: 20px;
	line-height: 165%;
	margin-left: 0px;
	margin-bottom: 20px;
}
.text dd + dd {
	width: 100%;
	padding-left: calc(25% + 20px);
}
.text dt + dt {
	padding-right: 75%;
}
.text dt + dt + dd {
	margin-top: 20px;
	padding-left: calc(25% + 20px;);
}
/*SMALL SCREENS AND UNDER */
@media screen and (max-width: 40em) {
	.text dl > * {
		padding-top: 0px;
	}
	.text dt {
		width: 100%;
		padding-right: 0px;
		margin-bottom: 6px; 
	}
	.text dd {
		width: 100%;
		padding-left: 0px;
		margin-left: 0px;
		margin-bottom: 20px;
	}
	.text dd + dd {
		padding-left: 0;
	}
	.text dt + dt {
		padding-right: 75%;
	}
	.text dt + dt + dd {
		margin-top: 10px;
		padding-left: 0;
	}
}
/*Dark Mode*/
.light dd {
	color: var(--white200);
}
/*-------------------------------------------------------------------------*/
/*Accreditations*/
/*-------------------------------------------------------------------------*/
.row.links{
	margin-top: 3em;
}
.links .columns{
	margin-bottom: 2.4rem!important;
}
a.cred img{
	margin-bottom: 0;
	width: 90px;
	height: 90px;
	position: relative;
	top: 0;
}
a.cred p{
	color: white;
	font-size: 1.1em;
	margin: 0;
	font-weight: bold;
	line-height: 120%;
	padding: 0 10px;
}
a.cred:hover{
	transform: scale(1.05)
}
a.cred{
	transition: transform 0.4s ease;
	overflow: hidden;
	padding: 6px 12px;
	align-items: center;
	display: flex;
	background-size: 10000px;
	height: 100%;
}

/*-------------------------------------------------------------------------*/
/*Forms*/
/*-------------------------------------------------------------------------*/
/*Placeholders*/
.text form ::placeholder {color: var(--black300);opacity: 1;}
.text form :-ms-input-placeholder {color: var(--black300);}
.text form ::-ms-input-placeholder {color: var(--black300);}
/*Containing Block(s)*/
.text form{
	margin-bottom: 30px;
}
.text form .columns{
	margin-bottom: 0!important;
}
/*Labels*/
.text form label{
	display: block;
	font-size: 0.8em;
	line-height: 200%;
	font-weight: 500;
	margin-top: 10px;
	margin-bottom: 6px;
	color: var(--dark);
}
/*Inputs and Selects*/
.text form input, .text form select{
	width: 100%;
	height: 52px;
	color: #333333;
	background-color: var(--muted);
	font-size: 0.8em;
	padding: 0 1em;
	box-shadow: 0px;
	outline: 0;
	border-radius: var(--brSmall);
	border: 0px solid #BBBBBB;
	display: block;
}
.text form select{
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
}
.text form select::-ms-expand {
  display: none;
}
/*TextAreas*/
.text form textarea{
	border-radius: var(--brSmall);
	width: 100%;
	background-color: var(--muted);
	color: #333333;
	resize: none;
	padding: 16px;
	border: 0px solid #BBBBBB;
	height: 160px;
	margin-bottom: var(--gap);
}
/*Submit Button*/
.text form .sendForm{
	display: block;
	width: 100%;
	line-height: 52px;
	color: var(--white300);
	border: none!important;
	background-color: var(--success)!important;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 1px;
	transition: all 0.5s;
	cursor: pointer;
}
.text form .sendForm.disabled{
	cursor: not-allowed;
	background-color: var(--warning)!important;
}
@media screen and (max-width: 64em) {
	.text form .sendForm{
		margin-top: 30px;
	}
}
/*Validate Humans*/
.text form .checker *{
	line-height: 100%;
	margin: 0;
}
.text form #sum{
	margin-top: 6px!important;
}
/*Dark Mode*/
.light form ::placeholder {color: var(--white300);opacity: 1;}
.light form :-ms-input-placeholder {color: var(--white300);}
.light form ::-ms-input-placeholder {color: var(--white300);}
.text.light form label{
	color: var(--primary);
}
.text.light form select option{
	background-color: var(--dark);
}
.light form input, .light form select, .light form textarea{
	background-color: rgba(0,0,0,0.2);
	color: white;
}
.light form .sendForm.disabled{
	background-color: firebrick!important;
}
/*Alt Mode*/
.paleBg .text form input, .paleBg .text form select, .paleBg .text form textarea{
	background-color: var(--white300);
}

/*-------------------------------------------------------------------------*/
/*Galleries*/
/*-------------------------------------------------------------------------*/
@media screen and (max-width: 64em) {
	.fillSmall, .contactCard .row .columns{
		flex: 0 0 1;
		width: 100%
	}
}
.galleryContainer div:hover img{
	filter: brightness(1.2) grayscale(0.8);
}
.galleryContainer div{
	padding: 1.2rem;
	margin-bottom: 0px!important;
	transition: background-color 0.5s ease;
}
.galleryContainer div img{
	width: 100%;
	max-width: unset;
	margin: 0!important;
	transition: filter 0.5s ease;
}
.galleryContainer div a{
	display: block;
}

/*ContactCards*/
.contactCard{
	padding: 3rem 0 2rem 0;
	border-top: 1px solid rgba(0,0,0,0.1)
}
@media screen and (max-width: 40em) {
	.contactCard{
		padding: 2rem 0 1rem 0;
	}
}
.contactCard.text p a{
	text-decoration: none;
	font-weight: bold;
	font-size: var(--fs400)
}
.contactCard.text h3{
	font-size: var(--fs700)
}
.contactCard.text p{
	font-size: var(--fs200);
}
.contactCard .text i{
	width: 80px;
	font-size: 50px;
	margin-top: 10px;
}
@media screen and (max-width: 39.9375em) {
	.contactCard .row .columns{
		flex: 0 0 1;
		width: 100%
	}
}
/*-------------------------------------------------------------------------*/
/*Maps*/
/*-------------------------------------------------------------------------*/
.map{
	width: 100%;
	position: relative;
	z-index: 1;
	overflow: hidden;
	background-color: var(--dark);
}
.map iframe{
	position: absolute;
	width: 130%;
	height: calc(100% + 300px);
	z-index: -1;
	left: 0;
	opacity: 0.8;
	filter: grayscale(1) invert(1);
	top: -150px;
	pointer-events: none;
}
@media screen and (max-width: 64.9375em) {
	.map iframe{
		width: 150%;
		height: calc(100% + 300px);
		right: 0;
		bottom: -150px;
		top: unset;
	}
}
@media screen and (max-width: 40em) {
	.map iframe{
		width: 100%;
		height: calc(100% + 750px);
		right: 0;
		bottom: -150px;
		top: unset;
	}
	.map{
		padding-top: 320px;
	}
}
.mapCard{
	padding: var(--boxPadding);
	background-color: white;
}

/*-------------------------------------------------------------------------*/
/*Lightboxes*/
/*-------------------------------------------------------------------------*/
.lightbox{
	--gap: 1rem;
	max-width: 800px;
	padding: 3em 3em calc(3em - var(--gap)) 3em;
	display: none;
	background-color: var(--white300);
	border-radius: var(--brMedium);
}
.fancybox-slide--html .fancybox-close-small {
	color: var(--primary);
	background-color: var(--dark);
	padding: 2px;
	border-radius: var(--brLarge);
	top: 20px;
	right: 20px;
}
.fancybox-bg{
	background-color: var(--dark);
}
.fancybox-image{
	border-radius: var(--brMedium)
}
/*-------------------------------------------------------------------------*/
/*Footer*/
/*-------------------------------------------------------------------------*/
footer{
	overflow: hidden;
	padding: 100px  var(--secX) 50px var(--secX);
	background-color: var(--darker)
}
@media screen and (max-width: 39em) {
	footer{
		padding: 100px  var(--secX) 0px var(--secX);
	}
}
.footerLogo img{
	height: 50px;
}
footer .row:first-of-type{
	margin-bottom: 5rem;
}
.footerLogo{
	position: relative;
}
.footerLogo:before{
	right: calc(100% + 20px);
}
.footerLogo:after{
	left: calc(100% + 20px);
}
.footerLogo:before, .footerLogo:after{
	content: '';
	width: 3000px;
	height: 1px;
	position: absolute;
	top: 50%;
	background-color: rgba(255,255,255,0.1);
}
footer .text h4{
	margin-bottom: 3rem;
	font-size: var(--fs600)
}
footer .text ul li:hover{
	color: white
}
footer .text ul li{
	font-size: 14px;
	color: var(--white100);
	line-height: 220%;
}
footer .text p.ethos{
	line-height: 180%;
	font-style: italic;
}
footer .text p.contactMethod i{
	width: 20px;
	color: var(--primary);
}
footer .text p.contactMethod{
	margin-bottom: 0;
}
footer .text p{
	line-height: 220%;
	font-size: 14px;
	color: var(--white100);
}
footer .socials{
	margin: 0;
}
footer .socials a:hover{
	color: var(--primary)!important;
	background-color: transparent!important;
	background: transparent!important;
}
footer .socials a{
	color: white!important;
}
/*Remove dots from footer list*/
footer .text ul li:before{
	content: '-';
}
footer .text .footerMenu + ul > li > ul{
	display: none!important
}
/*-------------------------------------------------------------------------*/
/*Copy Bar*
/*-------------------------------------------------------------------------*/
.copyBar{
	font-size: var(--fs100);
	padding: 3em var(--secX);
	background-color: var(--darker);
	border-top: 1px solid rgba(255,255,255,0.1);
}
@media screen and (max-width: 40em) {
	.copyBar{
		padding: 3em 10px;
	}
}
.copyBar .columns{
	width: 100%;
	margin-top: 0!important;
	margin-bottom: 0!important;
}
@media screen and (max-width: 40em) {
	.copyBar .columns{
		flex: 0 0 100%;
	}
}
.copyBar .text p{
	opacity: 0.6;
	text-align: right;
	margin: 0!important;
}
@media screen and (max-width: 40em) {
	.copyBar .text p{
		text-align: left;
	}
}
.copyBar ul.links li:last-of-type:after{
	content: '';
	display: none;
}
.copyBar ul.links li:before{
	content: '';
	display: none;
}
.copyBar ul.links li:after{
	content: '|';
	color: var(--primary);
	margin-right: 0.8em;
	margin-left: 0.8em;
}
.copyBar ul.links li{
	float: left;
	line-height: unset;
	width: auto;
}
.copyBar ul.links li a:hover{
	color: var(--primary);
}
.copyBar ul.links li a{
	color: var(--white100)!important;
	display: inline-block;
	line-height: 2.5em;
	font-weight: 500;
}

/*-------------------------------------------------------------------------*/
/*Floating Action Button*/
/*-------------------------------------------------------------------------*/
.floatingMenu.open{
	pointer-events: inherit;
}
.floatingMenu{
	pointer-events: none;
	position: fixed;
	overflow: hidden;
	z-index: 98;
	bottom: 3.8rem;
	padding: 0.2rem 0.4rem 2.8rem 0;
	right: 2rem;
	display: flex;
	flex-direction: column;
}
.floatingMenu li.visible{
	opacity: 1;
	top: 0!important;
}
.floatingMenu li:last-of-type{
	margin-bottom: 0;
}
.floatingMenu li{
	opacity: 0;
	top: 20em;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	position: relative;
	column-gap: 1em;
	margin-bottom: 1em;
	transition: top 0.5s ease, opacity 0.5s ease;
}
.floatingMenu li a:hover i, .floatingMenu li a:hover img{
	transform: scale(1.06);
}
.floatingMenu li:hover span{
	opacity: 1;
}
.floatingMenu li span{
	padding: 0.4rem;
	opacity: 0;
	font-size: 0.7rem;
	color: white;
	border-radius: var(--brSmall);
	background-color: var(--black);
	transition: opacity 0.5s ease;
}
@media screen and (max-width: 40em) {
	.floatingMenu li span{
		opacity: 1;
	}
}
.floatingMenu li a i{
	width: 3rem;
	height: 3rem;
	line-height: 3rem;
	color: white;
	display: block;
	font-size: 1.375rem;
	border-radius: var(--brLarge);
	text-align: center;
	background-color: var(--primary);
	transition: transform 0.5s ease;
}
.floatingMenu li a img{
	transition: transform 0.5s ease;
	display: block;
	font-size: 1.375rem;
	width: 3rem;
	height: 3rem;
	border-radius: var(--brLarge);
}
.floatingMenu li a[href*="facebook"] i{background-color: #4B69B0;}
.floatingMenu li a[href*="youtube"] i{background-color: #E83F3A;}
.floatingMenu li a[href*="twitter"] i{background-color: #37B1E1;}
.floatingMenu li a[href*="instagram"] i{background: #d6249f;background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);}
.floatingMenu li a[href*="whatsapp"] i{background-color: #2BA63A;}
.floatingMenu li a[href*="tel:"] i{background-color: #78e08f;}
.floatingMenu li a[href*="tel:07"] i{background-color: #38ada9!important;}
.floatingMenu li a[href*="sms:"] i{background-color: #60a3bc;}
.floatingMenu li a[href*="mailto:"] i{background-color: #e55039;}
.floatingMenu li a[href="#"] i{background-color: #e58e26;}
.floatingMenu li a i.fa-facebook-messenger{background-image: linear-gradient(to left, #2c80fc, #f35e82);}
button.actionButton{
	cursor: pointer;
	position: fixed;
	bottom: 2rem;
	z-index: 99;
	right: 2rem;
	font-size: 1.5rem;
	color: white;
	background-color: var(--primary);
	width: 3.6rem;
	height: 3.6rem;
	border-radius: var(--brLarge);
}
button.actionButton:before{
	content: '';
	border-radius: inherit;
	width: calc(100% - 0.4em);
	height: calc(100% - 0.4em);
	z-index: -1;
	position: absolute;
	top: 0.2em;
	left: 0.2em;
	background-color: rgba(255,255,255,0.1)
}