.content-landing-page {
	position: relative;
	padding: 0em;
	display: flex;
	justify-content: center;
	align-items: flex-start;

	height: calc(100dvh - var(--padding-top-header));
	/* min-height: 600px; */
	width: 100%;

}

#content-container {
    padding-top: var(--padding-top-header);
}

#landing-page-banner {
	position: absolute;
	top: 0;
	right: 2em;
	width: 3em;
	z-index: 1;
}

.content-landing-page > div {
	width: 100vw;
}

#landing-page-welcome {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	color: rgb(var(--text-color));

	z-index: 2;
	width: 100%;

	padding: 0;

	position: relative;
	overflow: hidden;
}

#landing-page-welcome .button {
	text-shadow: none;
}

#landing-page-welcome > div {
	/* height: 100%; */
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

#landing-page-welcome > div > h3,
#landing-page-welcome > div > p {
	margin: 0;
	font-size: 1.1em;
	font-weight: 500;
}

#landing-page-welcome > div > h1 {
	margin: 0em;
	font-size: 2.5em;
	line-height: 1.1em;

	word-break: break-word;
}

#landing-page-welcome > #text-container {
	text-align: center;
	align-items: center;

	padding: 2em 1em;

	gap: 0.5em;

	width: 100%;
}

#landing-page-welcome > #image-container {
	width: 100%;

	overflow: hidden;
	border-radius: 0 0 20px 20px;
	box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);

	position: absolute;
    top: 0;
    left: 0;
	width: 100%;
}

.home #landing-page-welcome > #image-container {
	top: -50%;
	left: 0;
}

#landing-page-welcome > #image-container .bg,
#landing-page-welcome > .placeholder {
	height: min(320px, 32vh);
}

#landing-page-welcome > #image-container .bg {
	width: 100%;
	object-fit: cover;
	object-position: top;

	object-fit: cover;
	object-position: center;
}

#landing-page-welcome > #image-container > .banner-a {
	position: absolute;
	top: 2em;
	left: 50%;
	transform: translate(-50%, 0);
	z-index: 2;
	width: 100%;
	max-width: 65%;
}

#landing-page-welcome > #image-container > .banner-a > .banner {

	object-fit: contain;
	object-position: center;

	height: 35%;
	width: 100%;
}

#landing-page-welcome > #image-container > .cover {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

	background: rgba(0, 0, 0, 0.45);
	z-index: 1;
}

#landing-page-welcome > #text-container form.form {
	width: 90%;
}

#landing-page-buttons {
	margin-top: 2em;
	font-size: 1.3em;

	display: flex;
	justify-content: center;
	gap: 1em;
}

#landing-page-buttons .button {
	width: 10em;
}

#landing-page-bg-img,
#landing-page-bg-img + .progressive-image-fallback {
	height: calc(100% + 1em);
	width: 100%;
	margin-top: -1em;
	object-fit: cover;
}

/* CHECK INTERNSHIP STYLES */

.content-check-result {
	padding: 2em;
}

#checkmark-gif-container {
	overflow: hidden;
	border-radius: 50%;
	width: 10em;
	height: 10em;
	display: flex;
	justify-content: center;
	align-items: center;
}

#checkmark-gif-container img {
	width: 125%;
	height: 125%;
	object-fit: cover;
	object-position: center center;
}

#check-activity-permit-container {
	display: flex;
	align-items: center;
	flex-direction: column;
	width: min(700px, 90%);
	margin: 0 auto;
	text-align: center;
}

.activity-permit-detail-container {
	display: flex;
	justify-content: center;
	width: 100%;
}

.activity-permit-detail {
	display: grid;
	grid-template-columns: 11em 0.1em 1fr;
	grid-column-gap: 0.8em;
	grid-row-gap: 0.5em;
	text-align: left;
}

.activity-permit-detail > h2 {
	grid-column: 1 / 4;
	margin-bottom: 0.25em;
	margin-top: 0.5em;
	text-decoration: underline;
}

.activity-permit-detail > div.header {
	font-weight: bold;
	word-break: normal;
}

.activity-permit-detail > div {
	margin: 0.2em 0;
	display: flex;
	align-items: center;
	word-break: break-all;
}

#check-activity-permit-container .button-container {
	width: 100%;
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin-top: 2em;
}

#check-activity-permit-container .button-container > * {
	margin: 0;
	padding-left: 1.5em;
	padding-right: 1.5em;
}

.x-check-container {
	background: rgb(var(--primary-red));
	color: white;
	width: 6em;
	height: 6em;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50%;
}

.x-check-container .x-check {
	color: white;
	margin: 0;
	font-size: 4em;
}

@media only screen and (min-width: 370px) {
	#landing-page-welcome > div > h3,
	#landing-page-welcome > div > p {
		font-size: 1.3em;
	}

	#landing-page-welcome > div > h1 {
		font-size: 3em;
	}
}

@media only screen and (min-width: 800px) {
	#landing-page-banner {
		right: 4em;
		width: 4.25em;
	}

	#landing-page-welcome > div > h3,
	#landing-page-welcome > div > p {
		font-size: 1.6em;
	}

	#landing-page-welcome > div > h1 {
		font-size: 3.6em;
	}

	#scroll-to-login-instruction-div {
		font-size: 0.8em;
	}

	#landing-page-login .form-container {
		font-size: 0.9em;
	}

	#landing-page-welcome {
		display: grid;
		grid-template-columns: 50% 50%;

		height: 100dvh;
	}

	#landing-page-welcome > #text-container {
		padding: 2em;
	}

	#landing-page-welcome > #image-container {
		height: 100%;

		border-radius: 0 25px 25px 0;

		top: 0;
		left: 0;
		width: 50%;
	}

	.home #landing-page-welcome > #image-container {
		top: 0;
		left: -50%;
	}

	#landing-page-welcome > #image-container .bg {
		height: 100%;
	}

	#landing-page-welcome > #image-container > .banner-a {
		top: 1.5em;
		max-width: 75%;

		padding-right: 1%;
	}
}