#page1{
	aspect-ratio: 2110/1536;
	background: var(--darkGrey);
}

#page1 .background{
	opacity: 0;
}

#page1 .background img{
	position: absolute;
	height: 100%;
	width: auto;
	top:0;
	left: 0;
}

#page1 .background video{
	position: absolute;
	width: 100%;
	height: auto;
	bottom: 0;
	left: 0;
}

#page1 .background .sky{
	width: 100%;
	aspect-ratio: 2110/650;
	background-image: url(../images/HeroSky.jpg);
	background-size: 50%;

	position: absolute;
	top:0;
	left: 0%;
	animation: slide-left 120s linear infinite;

	z-index:0;
}

#page1 .textBlock {
	padding-top: 152rem;
	
}

#page1 h1{
	opacity: 0;
	position: relative;
	top:50rem;
}

#page1 h4{
	opacity: 0;
	position: relative;
	top:50rem;
	display: block;
	margin-top: 34rem;
}




#page1 .textBlock .logosLockup{
	margin-top: 250rem;
	opacity: 0;
}

/*-----------------------------------------------------------------*/

#page1.load .background{
	opacity: 1;
	transition: opacity .25s linear;
	transition-delay: .1s;
}

#page1.animate h1,#page1.animate h4{
	opacity: 1;
	top:0;
	transition: opacity .5s linear, top 1s cubic-bezier(0,0,0,1);
	transition-delay: .5s;
}

#page1.animate h4{
	transition-delay: .65s;
}

#page1.animate .textBlock .logosLockup{
	opacity: 1;
	transition: opacity 1s linear;
	transition-delay: .75s;
}

@keyframes slide-left {
	0% {
		transform: translateX(50%);
	}
	100% {
		transform: translateX(0%);
	}
}