@font-face {
	font-family: "Jaro";
	src: url("../fonts/Jaro-VariableFont.ttf") format("truetype");
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: "Funnel Sans";
	src: url("../fonts/FunnelSans-VariableFont.ttf") format("truetype");
	font-weight: 300 800;
	font-style: normal;
}

:root {
	--color-green: #b0c80d;
	--color-blue: #034185;
	--color-mid-blue: #266cb4;
	--color-light-blue: #d5ecf4;
	--color-text-dark: #212529;
	--font-heading: "Jaro", sans-serif;
	--font-body: "Funnel Sans", sans-serif;
}

.lpeee {
	font-size: 16px !important;
	font-family: var(--font-body);
	color: var(--color-text-dark);
	line-height: 1.5;
	overflow-x: hidden;
	margin-left: -12px;
	margin-right: -12px;
}

.lpeee * {
	line-height: 1.5;
}

.lpeee h1,
.lpeee h2,
.lpeee h3,
.lpeee h4,
.lpeee h5 {
	font-family: var(--font-heading);
	text-transform: uppercase;
	font-weight: 400;
	line-height: 0.9;
}

.lpeee h2 {
	font-size: 2.5rem;
}

.lpeee .infotext {
	color: var(--color-mid-blue);
	font-size: 1.25rem;
	font-weight: bold;
}

.lpeee .text-big {
	font-size: 1.25rem;
}

.lpeee .btn.btn-primary {
	background-color: var(--color-mid-blue);
	color: white;
	border: 0;
	border-radius: 2.5rem;
	padding: 0.75rem 1.5rem;
	text-align: center;
	font-weight: 600;
	line-height: 1;
	box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.2);
	align-content: center;
}

.lpeee .btn.btn-primary:is(:hover, .active, :focus) {
	background-color: var(--color-text-dark);
	color: white;
	box-shadow: none;
}

.lpeee section p a {
	color: var(--color-mid-blue);
	font-weight: bold;
	transition: color 0.15s ease-in-out;
}

.lpeee section p a:is(:hover, .active, :focus) {
	color: var(--color-text-dark);
}

.lpeee .icon-instagram {
	color: var(--color-blue);
	text-decoration: none;
	font-size: 1.25rem;
	font-weight: 500;
	transition: color 0.15s ease-in-out;
}

.lpeee .icon-instagram:is(:hover, .active, :focus) {
	color: var(--color-text-dark);
}

@media (min-width: 576px) {
	.lpeee {
		margin-left: -30px;
		margin-right: -30px;
	}
}

@media (min-width: 768px) {
	.lpeee h2 {
		font-size: 3.5rem;
	}

	.lpeee .text-big {
		font-size: 1.4rem;
	}
}

@media (min-width: 992px) {
	.lpeee .text-big {
		font-size: 1.75rem;
	}
}

@media (min-width: 1200px) {
	.lpeee h2 {
		font-size: 4.25rem;
	}

	.lpeee .btn.btn-primary {
		padding: 0.75rem 2rem;
	}
}

/* SECTIONS */
.lpeee .bg-green {
	background-color: var(--color-green);
}

.lpeee .bg-light-blue {
	background-color: var(--color-light-blue);
}

.lpeee section .row {
	margin-top: 0;
	margin-bottom: 0;
}

.lpeee section ul {
	list-style: disc;
	padding: 0 0 0 1.5rem;
	margin-bottom: 1.5rem;
	font-size: 1rem;
}

.lpeee section ul li {
	list-style: disc;
	line-height: 1.5;
	padding: 0;
}

/* FLOATING BUTTON */
.lpeee .btn-floating {
	box-shadow: 0px 0px 15px 0px rgba(171, 210, 255, 0.64);
	position: fixed;
	z-index: 9999;
	bottom: 1rem;
	right: 1rem;
	font-size: 1rem;
}

@media (min-width: 1200px) {
	.lpeee .btn-floating {
		font-size: 1.5rem;
	}
}

/* HERO */
.lpeee .headline-hero {
	color: var(--color-mid-blue);
	font-size: 10vw;
}

.lpeee .hero-sub {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 1.25rem;
}

.lpeee .hero-text {
	max-width: 360px;
	padding-bottom: 250px;
}

.lpeee .header-hex {
	position: absolute;
	z-index: 10;
	top: 1rem;
	right: -15%;
	max-width: 300px;
	transform: translateY(500px);
}

@media (min-width: 480px) {
	.lpeee .headline-hero {
		font-size: 7.5vw;
	}

	.lpeee .header-hex {
		max-width: 350px;
		transform: translateY(425px);
	}
}

@media (min-width: 576px) {
	.lpeee .header-hex {
		max-width: 375px;
	}
}

@media (min-width: 768px) {
	.lpeee .hero-text {
		max-width: 420px;
	}

	.lpeee .header-hex {
		max-width: 550px;
		transform: translateY(300px);
	}
}

@media (min-width: 992px) {
	.lpeee .headline-hero {
		font-size: 4.5rem;
	}

	.lpeee .hero-text {
		max-width: 480px;
	}

	.lpeee .header-hex {
		max-width: 600px;
		transform: translateY(60px);
	}
}

@media (min-width: 1200px) {
	.lpeee .headline-hero {
		font-size: 5rem;
	}

	.lpeee .hero-text {
		padding-bottom: 125px;
	}

	.lpeee .header-hex {
		right: -12.75%;
		max-width: 735px;
		transform: translateY(0);
	}
}

/* DAS ERWARTET DICH */
.lpeee .daserwartetdich div[class^="col-"] {
	margin-top: 4rem;
}

.lpeee .daserwartetdich h2 {
	color: white;
	margin-bottom: 1.5rem;
}

.lpeee .daserwartetdich h5 {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 1.1rem;
	margin-bottom: 0.25rem;
	text-transform: none;
}

.lpeee .daserwartetdich p {
	font-size: 1rem;
}

@media (min-width: 992px) {
	.lpeee .daserwartetdich div[class^="col-"] {
		margin-top: 0;
	}
}

/* UNSERE STUDIS ERZÄHLEN */
.lpeee .unserestudiserzaehlen h2 {
	color: var(--color-mid-blue);
}

.lpeee .unserestudiserzaehlen iframe {
	aspect-ratio: 16 / 9;
	width: 100%;
	height: auto;
}

/* BERUFSAUSSICHTEN */
.lpeee .berufsaussichten h2,
.lpeee .berufsaussichten h4 {
	color: var(--color-mid-blue);
}

.lpeee .berufsaussichten-hex {
	position: absolute;
	z-index: 20;
	top: -3rem;
	left: -20%;
	max-width: 250px;
}

@media (min-width: 576px) {
	.lpeee .berufsaussichten-hex {
		top: -2rem;
		left: -20%;
		max-width: 280px;
	}
}

@media (min-width: 768px) {
	.lpeee .berufsaussichten-hex {
		left: -7rem;
		max-width: 350px;
	}
}

@media (min-width: 992px) {
	.lpeee .berufsaussichten-hex {
		max-width: 400px;
	}
}

@media (min-width: 1200px) {
	.lpeee .berufsaussichten-hex {
		left: -10rem;
		max-width: 525px;
	}
}

@media (max-width: 575px) {
	.lpeee .berufsaussichten div[class^="col-"] {
		margin-top: 125px;
	}
}

/* VORAUSSETZUNGEN */
.lpeee .voraussetzungen h2 {
	color: var(--color-green);
}

.lpeee .voraussetzungen-hex {
	position: absolute;
	z-index: 20;
	top: 300px;
	right: -20%;
	max-width: 230px;
}

@media (min-width: 576px) {
	.lpeee .voraussetzungen-hex {
		right: -5rem;
		max-width: 300px;
	}
}

@media (min-width: 768px) {
	.lpeee .voraussetzungen-hex {
		top: 195px;
		right: -7.5rem;
		max-width: 400px;
	}
}

@media (min-width: 992px) {
	.lpeee .voraussetzungen-hex {
		top: 100px;
		right: -12rem;
		max-width: 550px;
	}
}

@media (min-width: 1200px) {
	.lpeee .voraussetzungen-hex {
		top: 80px;
		max-width: 650px;
	}
}

@media (max-width: 479px) {
	.lpeee .voraussetzungen-hex {
		display: none !important;
	}
}

/* JETZT ANMELDEN */
.lpeee .jetztanmelden h2 {
	color: white;
}

.lpeee .btn-downloads {
	display: flex;
	gap: 1rem;
}

@media (min-width: 576px) {
	.lpeee .btn-downloads {
		gap: 2.5rem;
	}
}

@media (max-width: 575px) {
	.lpeee .btn-downloads {
		flex-direction: column;
	}
}

/* KONTAKT */
.lpeee .kontakt img {
	width: 100%;
	max-width: 375px;
}