@mixin animate($duration:0.3s){
	transition: all $duration;
}

@mixin trajan-font($weight:600){
	font-family: trajan-pro-3, serif;
	font-weight: $weight;
	font-style: normal;
}

.no-js {
	.toggle-main-navigation{display:none;}
}

.main-container{overflow:hidden}

.shadeout{
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background:rgba($black,0.45);
	z-index:1;
	opacity:1;
}

.page-row__spacer{
	.default-spacer{height:1.5rem;}
	.space-1{height:1.5rem;}
	.space-2{height:3rem;}
	.space-3{height:4.5rem;}
	.space-4{height:6rem;}
	.space-5{height:7.5rem;}
	
}

.space-half-line{margin-top:0.75rem;}
.space-1-line{margin-top:1.5rem;}


.come-in {
  transform: translateY(150px);
  animation: come-in 0.8s ease forwards;
}
.come-in:nth-child(odd) {
  animation-duration: 0.6s; /* So they look staggered */
}

@keyframes come-in {
  to { transform: translateY(0); }
}

//.page-section__no-padding .column-wrapper,

.jarallax{
	
	
  	position: relative;
 	z-index: 0;
	
	&::after{
		content:"";
		position:absolute;
		top:0;right:0;bottom:0;left:0;
		background:$black;
		opacity:0;
		@include animate(1s);
	}
 
	.jarallax-img {
		position: absolute;
		object-fit: cover;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: -1;
	}
	
	&.jarallax__fadeout{
		
	//	&::after{opacity:1;}
		
	}
}