.parallax {
	position : relative;
	width : 100%;
	height : 100vh;
	display : flex;
	justify-content : center;
	align-items : center;
	overflow: hidden;
}
.parallax::before {
	content: '';
	position : absolute;
	bottom : 0;
	width : 100%;
	height : 100px;
	background: linear-gradient(to top, var(--bg-color), transparent);
	z-index : 1000;
}
.parallax img {
	position : absolute;
	top : 0;
	left : 0;
	width : 100%;
	height : 100%;
	object-fit : cover;
	z-index : 8;
	pointer-events : none;
}

#mountain { 
	z-index : 11;
}
#mountain_behind {
	z-index : 8;
}
#moon {
	width : 170%;
}
@media (min-width: 768px) {
	#moon {
		width : 120%;
	}
}
@media (min-width: 992px) {
	#moon {
		width : 100%;
	}
}
#title {
	position : absolute;
	color : var(--main-color);
	white-space : nowrap;
	font-size: 3vw;
	z-index : 9;
	transform : translateY(-0px);
	overflow : hidden;
	margin-top : 0px;
	display : none;
}
#explore {
	position : absolute;
	text-decoration : none;
	display : inline-block;
	padding : 7px 25px;
	border-radius : 40px;
	background : var(--bg-color-light);
	color : var(--main-color);
	font-size : 1.2em;
	z-index : 12;
	transform : translateY(0px);
	cursor : pointer;
	margin-top : 90px;
	opacity : 1;
	border : 0;
	transition : background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
#explore:hover, #explore:focus, #explore:active {
	background-color : var(--bg-color-day);
	color : var(--main-color-day);
}
[data-bs-theme=light] #explore {
	background : var(--main-color);
	color : var(--main-color-day);
}
[data-bs-theme=light] #explore:hover, [data-bs-theme=light] #explore:focus, [data-bs-theme=light] #explore:active {
	background : var(--bg-color-light);
	color : var(--main-color);
}
#explore .bi {
	margin-right : 10px;
	vertical-align: -0.070em;
}
@media (min-width: 992px) {
	#explore {
		padding : 8px 30px;
		font-size : 1.5em;
		margin-top : 150px;
	}
	#explore .bi {
		margin-right : 10px;
		vertical-align: -0.070em;
	}
}