*{ 												box-sizing: border-box;  }

	html{ 
		height: 									100%; 
		margin: 									0px; 
		padding: 									0px; 
		scroll-behavior: 							smooth; 
		-webkit-font-smoothing: 					antialiased;  }
	
	.fixed{ 										position: fixed;  }
	.absolute{ 										position: absolute;  }
	.noscroll{ 										overflow: hidden;  } 

	.absolute-top-left { 				
		position: 									absolute; 
		top: 										0px; 
		left: 										0px;  }

	.absolute-top-right { 
		position: 									absolute; 
		top: 										0px; 
		right: 										0px;  }

	.absolute-bottom-left { 
		position: 									absolute; 
		bottom: 									0px; 
		left: 										0px;  }
	
	.absolute-bottom-right { 
		position: 									absolute; 
		bottom: 									0px; 
		right: 										0px;  }

	.absolute-bottom-left-pct{ 
		position: 									absolute; 
		bottom: 									0px; 
		left: 										12vw;  }

	.fixed-bottom-left { 
		position: 									fixed; 
		bottom: 									0px; 
		left: 										0px;  }
		
	.relative{ 										position: relative;  }

	.inline-block{ 									display: inline-block;  
													vertical-align:top  }

	.hidden{ 										display: none;  }
	.visible{	 									display: block; opacity: 1;  }
	.block{											display: block; } 
	
	.visibility-transition.hidden, .visibility-transition-hero.hidden{
		display: block;
		opacity: 0;
	}
	.visibility-transition {
		transition: opacity 420ms ease;
	}
	.visibility-transition-hero {
		transition: opacity 1320ms ease;
	}

	.visibility-slide-left-transition.hidden{
		left: 500px;
		display: block;
		opacity: 0; }
		
	.visibility-slide-left-transition {
		left: 0px;
		transition: opacity 900ms ease, left 920ms ease; }

	.visibility-slide-right-transition.hidden{
		right: 500px;
		display: block;
		opacity: 0; }

	.visibility-slide-right-transition {
		right: 0px;
		transition: opacity 900ms ease, right 920ms ease; }

	.flex{ 										display: flex; }
	.flex-1{ 									flex: 1; }
	.flex-auto-height{ 							display: flex; height: auto; }
	.distribute{ 
		display: 								flex; 
		flex-direction: 						row; 
		flex-wrap: 								nowrap; 
		justify-content: 						space-between; }
	.distribute-wrap{ 
		display: 								flex; 
		flex-direction: 						row; 
		flex-wrap: 								wrap; 
		justify-content: 						space-between; }
	.distribute-start{ 
		display: 								flex; 
		flex-direction: 						row; 
		flex-wrap: 								wrap; 
		justify-content: 						flex-start; }
	.distribute-end{ 
		display: 								flex; 
		flex-direction: 						row; 
		flex-wrap: 								wrap; 
		justify-content: 						flex-end; }
	.distribute-evenly{ 
		display: 								flex; 
		flex-direction: 						row; 
		flex-wrap: 								wrap; 
		justify-content: 						space-evenly; }


	.position-bottom-left{ 
		bottom: 									0px; 
		left:		 								0px; }

	.position-bottom-right{ 
		bottom: 									0px; 
		right: 										0px;  }

	.position-top-left{ 
		top: 										0px; 
		left: 										0px;  }

	.position-top-right{ 
		top: 										0px; 
		right: 										0px;  }

	.nowrap{ 										white-space: nowrap;  }
	.normal-whitespace{ 							white-space: normal;  }

	.overflow-auto{ 								overflow: auto;  }
	.overflow-y-auto{ 								overflow-y: auto;  }
	.overflow-hidden{ 								overflow: hidden;  }
	.overflow-x{ 
		overflow-x: 								auto; 
		white-space: 								nowrap;  }

	.overflow-x-hidden{ 
		overflow-x: 								hidden; 
		white-space: 								nowrap;  }

	.overflow-x-no-scroll{ 							overflow-x: auto;  }
	.overflow-x-no-scroll::-webkit-scrollbar { 		display: none; }
	.overflow-x-no-scroll{ 
		-ms-overflow-style: 						none; 
		scrollbar-width: 							none;  }

	.snap-y-proximity{ 								scroll-snap-type: y proximity; }

	.width-5pct{ 									width: 5%;  }
	.width-10pct{ 									width: 10%;  }
	.width-15pct{ 									width: 15%;  }
	.width-20pct{ 									width: 20%;  }
	.width-25pct{ 									width: 25%;  }
	.width-30pct{ 									width: 30%;  }
	.width-40pct{ 									width: 40%;  }
	.width-50pct{ 									width: 50%;  }
	.width-55pct{ 									width: 55%;  }
	.width-60pct{ 									width: 60%;  }
	.width-70pct{ 									width: 70%;  }
	.width-75pct{ 									width: 75%;  }
	.width-80pct{ 									width: 80%;  }
	.width-85pct{ 									width: 85%;  }
	.width-90pct{ 									width: 90%;  }
	.width-95pct{ 									width: 95%;  }
	.width-100pct{ 									width: 100%; }
	.height-70pct{ 									height: 70%; }
	.height-80pct{ 									height: 80%; }
	.height-90pct{ 									height: 90%; }
	.height-95pct{ 									height: 95%; }
	.height-98pct{ 									height: 98%; }
	.height-100pct{ 								height: 100%; }
	.height-100vh{ 									height: 100vh; }
	.min-height-50vh{ 								min-height: 50vh; }
	
	.zi-1{ 											z-index:1; }
	.zi-999{ 										z-index:999; }
	.zi-9999{ 										z-index:9999; }

	.backdrop-blur{ 								backdrop-filter: blur(1px) brightness(76%);  }

	.content-centered{ 
		display: 									flex; 
		justify-content: 							center; 
		align-items: 								center;  }
	
	.content-centered-left{ 
		display: 									flex; 
		justify-content: 							center; 
		align-items: 								left;  }
	
	.content-centered-right{ 
		display: 									flex; 
		justify-content: 							center; 
		align-items: 								right;  }

	.float-left{ 									float: left;  }
	.float-right{ 									float: right;  }

	.margin-0-auto{ 								margin: 0 auto; }

	.bg-covered-top{ 
		background-size: 							cover; 
		background-repeat: 							no-repeat; 
		background-position: 						top;  }

	.bg-covered-bottom{ 
		background-size: 							cover; 
		background-repeat: 							no-repeat; 
		background-position: 						bottom;  }

	.bg-covered-center{ 
		background-size: 							cover; 
		background-repeat: 							no-repeat; 
		background-position: 						center;  }

	.square{ 										width: 100%; 
													aspect-ratio: 1 / 1; }
	
	.rectangle-flat{ 								height: 100%; 
													aspect-ratio: 2.09 / 1; }
	
	.rectangle-vertical{ 							height: 100%; 
													aspect-ratio: 1 / 2; }
	.round{
		display: 									flex; 
		justify-content: 							center; 
		align-items: 								center; 
		aspect-ratio:               				1/1;
		border-radius:								50%; 
		text-align: 								center;
		text-decoration:							none; }

	.text-left, 
	.text-left-to-center{ 							text-align: left;  }

	.text-right, 
	.text-right-to-center{ 							text-align: right;  }

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

	.text-vertical-bottom-left{ 					
		transform-origin:							bottom left; 
		right:										0; 
		bottom:										0; 
		transform: 									rotate(-90deg) translateX(100%); 
		-moz-transform:								rotate(-90deg); 
		-webkit-transform:							rotate(-90deg); 
		-o-transform:								rotate(-90deg); 
		-ms-transform:								rotate(-90deg);  }
	
	.text-vertical-bottom-right{ 					
		transform-origin:							bottom right; 
		right:										0; 
		bottom:										0; 
		transform: 									rotate(90deg) translateX(100%); 
		-moz-transform:								rotate(90deg); 
		-webkit-transform:							rotate(90deg); 
		-o-transform:								rotate(90deg); 
		-ms-transform:								rotate(90deg);  }

	.text-vertical-top-left{ 
		transform-origin:							top left; 
		right:										0; 
		top:										0; 
		transform: 									rotate(-90deg) translateX(100%); 
		-moz-transform:								rotate(-90deg); 
		-webkit-transform:							rotate(-90deg); 
		-o-transform:								rotate(-90deg); 
		-ms-transform:								rotate(-90deg);  }
	
	.text-caps{ 
		text-transform: 							uppercase; 
		letter-spacing: 							0.025em;  }
	.text-capitalized{ 								display: inline-block;  }
	.text-capitalized:first-letter{ 				text-transform: capitalize;  }
	.text-lowercase{ 								text-transform: lowercase;  }
	.text-shadowed{ 								text-shadow: 2px 2px 6px rgba(0,0,0,0.31);  }
	
	.black-and-white-image{ 
		-webkit-filter: 							grayscale(100%); 
		filter: 									grayscale(100%);  }
	
	.parallax{ 
		height: 									100vh; 
		overflow-x: 								hidden; 
		overflow-y: 								auto; 
		-webkit-perspective: 						1px; 
		perspective: 								1px;  }
	
	.parallax__layer{ 
		position: 									absolute; 
		top: 										0; 
		left: 										0; 
		right: 										0; 
		bottom: 									0; }
	
	.parallax__layer--base{ 
		-webkit-transform: 							translateZ(0); 
		transform: 									translateZ(0);  }
	
	.parallax__layer--back{ 
		-webkit-transform: 							translateZ(-1px) scale(2); 
		transform: 									translateZ(-1px) scale(2);  }

	.bottom-hidden{ 
		position: 									fixed; 
		left: 										0px; 
		bottom: 									-1000px; 
		transition: 								bottom 340ms;  }

	.bottom-visible{ 
		position: 									fixed; 
		left: 										0px; 
		bottom: 									0px; 
		transition: 								bottom 740ms;  }

	.bottom-floating-visible{ 
		position:									fixed; 
		left: 										0px; 
		bottom: 									1vh; 
		transition: 								bottom 740ms;  }

		
	.img-hover-zoom { 	
		overflow: 									hidden;  }

	.img-hover-zoom--slowmo img {
		transform-origin: 							100% 100%;
		transition: 								transform 4s, filter 4s ease-in-out;  }
	
	.img-hover-zoom--slowmo:hover img {
		transform: 									scale(1.07);  }


	.video-container {
		position: 									relative;
		padding-bottom: 							56.25%; /* 16:9 */
		height: 									0;
	}
	.video-container iframe {
		position: 									absolute;
		top: 										0;
		left: 										0;
		width: 										100%;
		height: 									100%;
	}

	.monospaced{
		font-variant-numeric: 						tabular-nums;
	}

	.accordion {
		background-color: 							#FFF;
		cursor: 									pointer;
		width: 										100%;
		border: 									none;
		text-align: 								left;
		outline: 									none;
		font-size: 									18px;
		font-weight: 								var(--font-semibold);
		padding-bottom: 							12px;
		color: 										var(--dark-grey);
		transition: 								0.4s;
	  }


	.accordion-panel-open{
		max-height: 								auto;
		-webkit-transition: 						max-height 820ms ease-out; 
		-moz-transition: 							max-height 820ms ease-out;  
		-o-transition: 								max-height 820ms ease-out; 
		transition: 								max-height 820ms ease-out;
		font-size: 									var(--font-n);
		font-weight: 								var(--font-regular);
		color: 										var(--base-color);
		padding: 									10px 0px 32px 0px;
	}
	
	.accordion-panel-closed{
		max-height: 								0px;
		overflow: 									hidden;
		-webkit-transition: 						max-height 820ms ease-out; 
		-moz-transition: 							max-height 820ms ease-out;  
		-o-transition: 								max-height 820ms ease-out; 
		transition: 								max-height 820ms ease-out; 
		font-size: 									var(--font-n);
		font-weight: 								var(--font-regular);
		color: 										var(--base-color);
		padding: 									0px;
	}

	.bounce {
		animation: 									bounce 4s infinite;
	}
	.unbounce {
		animation:									none; 						
	}
	  
	@keyframes bounce {
		0%, 20%, 50%, 70%, 100% { transform: translateY(10px); }
		40%, 60% { transform: translateY(2px); }
	}

	@keyframes horizontal-shake {
		0% { transform: translateX(0) }
		25% { transform: translateX(10px) }
		50% { transform: translateX(-10px) }
		75% { transform: translateX(10px) }
		100% { transform: translateX(0) }
	}

	.cursor-pointer{
		cursor: pointer;
	}
	.cursor-auto{
		cursor: auto;
	}

	.tooltip{
		position: relative;
		display: inline-block;
	}
	
	.tooltip .info-left,
	.tooltip .info-right,
	.tooltip .info-top,
	.tooltip .info-bottom{
		visibility: hidden;
		width: 260px;
		background-color: var(--base-color);
		color: #fff;
		text-align: center;
		padding: var(--padding-s);
		border-radius: 6px;
		position: absolute;
		z-index: 1;
	}
	.tooltip .info-left{
		top: -5px;
  		right: 105%;
	}
	.tooltip .info-right{
		top: -5px;
		left: 105%;
	}
	.tooltip .info-top{
		bottom: 100%;
		left: 50%;
		margin-left: -130px;
	}
	.tooltip .info-bottom{
		top: 100%;
		left: 50%;
		margin-left: -130px;
	}
	
	.tooltip:hover .info-left,
	.tooltip:hover .info-right,
	.tooltip:hover .info-top,
	.tooltip:hover .info-bottom{
		visibility: visible;
	}

	.disable-scroll {
		overflow: hidden;
		pointer-events: none;
	}

	a.copy-to-clipboard:link,
	a.copy-to-clipboard:visited,
	a.copy-to-clipboard:active,
	a.copy-to-clipboard:hover{
		padding: 10px 14px;
		border-radius: 8px;
		font-size: 28px;
		-webkit-box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.0); 
		-moz-box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.0); 
		box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.0);
		border: 1px solid #DDD;
		transition: all 320ms ease;
	}
	a.copy-to-clipboard:hover{
		-webkit-box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.10); 
		-moz-box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.10); 
		box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.10);
		border: 1px solid #DDD;
	}
	a.copy-to-clipboard:active{
		color: var(--orange);
	}