/* Homepage specific styling goes here. Excluded on all subpages */
/* For most builds, this stylesheet should be wiped and started fresh */

.home-main:after,
.home-main-fade,
.home-main-video {
	pointer-events: none;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.home-main-fade {
	z-index: 1;
	content:"";
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background: rgb(16,26,41);
	background: linear-gradient(335deg, rgba(16,26,41,1) 12%, rgba(16,26,41,0) 50%, rgba(16,26,41,1) 88%);
	pointer-events: none;
	opacity: 0;
	-webkit-transition: opacity 1600ms ease-out;
	-moz-transition: opacity 1600ms ease-out;
	-ms-transition: opacity 1600ms ease-out;
	-o-transition: opacity 1600ms ease-out;
	transition: opacity 1600ms ease-out;
}

.home-main.active .home-main-fade {
	opacity: 1;
}

.home-main:after {
	content: "";
	bottom: 0;
	top: auto;
	height: 200px;
	background: rgb(24, 38, 50);
	background: linear-gradient(0deg, rgba(24, 38, 50, 1) 0%, rgba(24, 38, 50, 0) 100%);
}

.home-main-video {
	object-fit: cover;
	opacity: 0;
	-webkit-transition: opacity 3000ms ease-out;
	-moz-transition: opacity 3000ms ease-out;
	-ms-transition: opacity 3000ms ease-out;
	-o-transition: opacity 3000ms ease-out;
	transition: opacity 3000ms ease-out;
}

.home-main-video.active {
	opacity: 1;
}

.home-main {
	position: relative;
	height: 100vh;
	background-size: cover;
	background-repeat: no-repeat;
}

.home-main {
	max-height: 800px;
}

.home-main-row,
.home-main-inner,
.home-main-row>.columns {
	height: 100%;
}

.home-main-inner {
	display: flex;
	align-items: center;
	position: relative;
}

.home-search-form {
	position: relative;
	width: 100%;
	display: flex;
	z-index: 2;
}

.home-search-form input {
	border: none !important;
}

.home .footer {
	z-index: 1;
	background-color: transparent;
	padding-top: 0;
	padding-bottom: 0;
	position: absolute;
	bottom: 30px;
	right: 0;
	left: 0;
}

#home-search-input.active~label,
#home-search-input:focus~label {
	font-size: 1.1rem;

}

.home-main-mask {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	content: '';
	height: 100%;
	z-index: 1;
	opacity: 0;
	background-image: url(../images/hero_mask_mobile.webp);
	background-size: cover;
	background-position-x: center;
	transform-origin: right;
	background-repeat: no-repeat;
	-webkit-transition: opacity 600ms ease-out;
	-moz-transition: opacity 600ms ease-out;
	-ms-transition: opacity 600ms ease-out;
	-o-transition: opacity 600ms ease-out;
	transition: opacity 600ms ease-out;
}

.home-main-mask.active {
	opacity: 1;
}

.home-search-input-sizing {
	font-size: 1.5rem;
	height: auto;
	line-height: 55px;
}

.home-search-form button {
	font-size: 1.7rem;
	position: absolute;
	right: 8px;
	top: 12px;
}

#home-search-input:focus~button {
	color: #fff;
}

.home-main-logo-xl.active {
	animation: homeLogoEnter 1000ms;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-timing-function: ease-out;
}

.home-main {
	background: #101A29;
}

@-webkit-keyframes homeLogoEnter {
	from {
		opacity: 0;
		transform: translateX(-40px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes homeLogoEnter {
	from {
		opacity: 0;
		transform: translateX(-40px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}


@media screen and (min-width: 1025px) {
	.home-main-mask {
		background-image: url(../images/hero_mask.webp);
		background-position-y: bottom;
	}

	.home-main-row>.columns {
		padding: 0 35px 0 35px;
	}

	.home-search-input-sizing {
		font-size: 1.9rem;
	}

	.home .custom-header-right {
		margin-left: auto;
		width: auto;
	}

	.home-search-form {
		max-width: 680px;
	}

	.home-main-inner {
		flex-direction: column;
		justify-content: center;
	}

	.home-search-form,
	.home-main-logo-xl {
		margin-left: auto;
	}

	.home-main-logo-xl {
		margin-bottom: 20vh;
		z-index: 1;
	}

	.home-main {
		height: 100vh;
		max-height: 1080px;
	}
}

@media screen and (min-width: 1025px) and (max-height: 730px) {
	.home-main-logo-xl {
		margin-bottom: 13vh;
	}
}

@media screen and (min-width: 1700px) {
	.home-main {
		max-height: none;
	}
}

.home-search-results {
	display: none;
	width: 100%;
	position: absolute;
	left: 0;
	top: 100%;
}

.home-search-results.active {
	display: block;
	-webkit-animation: fadeInGentleDown 200ms ease-out;
	animation: fadeInGentleDown 200ms ease-out;
}

.home-search-form .search-results-container {
	width: 100%;
	background: #fff;
	overflow: auto;
	max-height: 240px;
	padding: 20px;
}

@media screen and (max-height: 780px) {
	.search-results-post-type > h3 {
		display: none;
	}

	.search-results-post-type {
		margin-bottom: 0;
	}

}