:root {
	--primary-color: #bc1c53;
	--secondary-color: #505559;
	--blue-color: #2f458e;
	--white-color: #f8f8f8;
	--gray-color: #d9d9d9;
	--container-width: 1400px;
	--grid-gutter: 32px;
	--grid-width: calc((var(--container-width) - (11*var(--grid-gutter)))/12);
}


@media only screen and (max-width:600px) {
	.navigation-links {
		grid-template-columns: 1fr 1fr;
	}

	.navigation-links>a {
		grid-column: span 2/span 2;
	}
}

}


#header-container {
	transition: all 500ms;
}

@media only screen and (max-width:1400px) {

	#header:before {
		width: 100% !important;
		height: 100px !important;
		z-index: -1 !important;

	}

	.link-margin {
		margin: 0 auto;
	}

	.navigation-links {
		align-items: center;
		padding: 1rem;
		position: absolute;
		left: 0;
		right: 0;
		top: 100px;
		background-color: var(--primary-color);
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}



h2,
summary {
	font-size: 32px !important;
}

h3 {
	font-size: 24px !important;
}

h4 {
	font-size: 18px !important;
}

h5 {
	font-size: 16px !important;
}


h1,h2,h3,h4{
hyphens: auto;
}

	h1 {
        font-size: 52px !important;
		line-height: 4rem !important;
	}

	.form-input-text {
		grid-template-columns: 1fr !important;
	}

	.page-my {
		margin-top: var(--grid-width) !important;
		margin-bottom: var(--grid-width) !important;
	}


	.page-mb {
		margin-bottom: var(--grid-width) !important;
	}

	.page-mt {
		margin-top: var(--grid-width) !important;
	}
}


.page-py {
	padding-top: var(--grid-width) !important;
	padding-bottom: var(--grid-width) !important;
}


.page-my {
	margin-top: calc(var(--grid-width) * 2);
	margin-bottom: calc(var(--grid-width) * 2);
}

.page-mb {
	margin-bottom: calc(var(--grid-width) * 2);
}

.page-mt {
	margin-top: calc(var(--grid-width) * 2);
}


.rtl {
	direction: rtl;
}

.bg-offset{
 background-position: 0 -15vh !important;
}

img {
	max-width: 100%;
}

@font-face {
	font-family: "Caravel";
	src: url("/files/user-upload/css/fonts/Caravel-Regular.otf") format('opentype');
	font-display: swap;
}

@font-face {
	font-family: "Roboto";
	src: url("/files/user-upload/css/fonts/Roboto-Regular.ttf") format('truetype');
	font-display: swap;
}

@font-face {
	font-family: "Roboto-Bold";
	src: url("/files/user-upload/css/fonts/Roboto-Bold.ttf") format('truetype');
	font-display: swap;
}


@font-face {
	font-family: "Caravel-Bold";
	src: url("/files/user-upload/css/fonts/Caravel-Regular2.otf") format('opentype');
	font-display: swap;
}

@font-face {
	font-family: "Caravel-Bolder";
	src: url("/files/user-upload/css/fonts/Caravel-Regular3.otf") format('opentype');
	font-display: swap;
}

@font-face {
	font-family: "Caravel-Thin";
	src: url("/files/user-upload/css/fonts/Caravel-Regular4.otf") format('opentype');
	font-display: swap;
}


.caravel {
	font-family: "Caravel" !important;
}

.roboto {
	font-family: "Roboto" !important;
}


.caravel-bold {
	font-family: "Caravel-Bold" !important;
}

.caravel-bolder {
	font-family: "Caravel-Bolder" !important;
}

.font-roboto {
	font-family: "Roboto" !important;
}


.caravel-boldest {
	font-family: "Caravel-Thin" !important;
}


.bg-gray {
	background-color: var(--gray-color);
}

.bg-white {
	background-color: var(--white-color);
}

.shadow-inner {
	box-shadow: inset 0 -5px 10px 0 rgb(0 0 0 / 0.1);
}

.col-span-2 {
	grid-column: span 2 / span 2;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: "Caravel";
	background: var(--white-color);
}

button {
	cursor: pointer;
	font-family: "Roboto";
	font-size: 16px;
}


h1,
h2,
h3,
h4,
h5,
summary {
	font-family: "Caravel-Bolder";
	color: var(--secondary-color);
}

p,
li,
td {
	font-family: "Roboto";
	font-size: 22px;
	line-height: 30px;
	color: var(--secondary-color);
}

span {
	font-family: "Roboto";
	font-size: 22px;
	line-height: 30px;
}

label {
	color: var(--secondary-color);
}

a,
label {
	font-family: "Roboto-Bold";
	font-size: 16px;
}

.hyphens {
	hyphens: auto;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	word-break: break-word;
}

.glw-button {
	cursor: pointer;
	height: fit-content;
	width: fit-content;
	background-color: var(--primary-color);
	border-radius: 5px;
	border: none;
	text-transform: uppercase;
	padding: .8rem 2.25rem .65rem !important;
	color: white;
	transition: all 300ms;
	--un-drop-shadow: drop-shadow(0 20px 13px var(--un-drop-shadow-color, rgb(0 0 0 / 0.03))) drop-shadow(0 8px 5px var(--un-drop-shadow-color, rgb(0 0 0 / 0.08)));
	filter: var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia);


	@media only screen and (max-width:1400px) {
		margin: 2rem auto;
	}

}

.glw-button:disabled {
  cursor: not-allowed;
}


.glw-button:hover:not(:disabled) {
	color: var(--primary-color);
	background-color: white;
	outline: inset 1px var(--primary-color);
	scale: 1.05;
	font-family: "Roboto-Bold";
}

.glw-button:active:not(:disabled) {
	scale: 0.95;
	/*  color: white;
    background-color: var(--primary-color);
    outline: inset 1px var(--primary-color);
    */
}

.link {
	transition: all 200ms;
	text-decoration: none;
	cursor: pointer;
}

.link:hover {
	scale: 1.02;
	font-weight: bold;
	text-decoration: underline;
}

.diagonal {
@media screen and (min-width:1400px){
	clip-path: polygon(0 100%, 100% 100%, 100% 0, 15% 0);
}
}

h1 {
	font-size: 64px;
}

h2,
summary {
	font-size: 48px;
}

h3 {
	font-size: 34px;
}

h4 {
	font-size: 22px;
}

h5 {
	font-size: 18px;
}

.after-red-line:after {
	content: "";
	width: 100%;
	background-color: var(--primary-color);
	height: 12px;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: -1;
}


.cut-bottom-right-corner:after {
	margin-left: -1px;
	content: "";
	height: 100%;
	width: 50px;
	background-color: var(--primary-color);
	clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 100%, 0 100%);

}

#header:before {
    content: "";
	background: var(--primary-color);
	position: absolute;
	width: 50vw;
	height: 150px;
}


.form-input-text>div>input,
textarea,
select,
option {
	padding: .75rem 1rem;
	border: solid 1px var(--secondary-color);
	border-radius: 10px;
	overflow: hidden !important;
}


.form-input-text>label {
	margin-bottom: .5rem;
}


.apply-form {
	padding: 4rem 2rem;
	background-color: var(--primary-color);
	color: white;
}

.apply-form>div>label {
	color: white !important;
}

.global-search-item {
	padding: 2px 5px;
}


.bg-en-trainee {
	@media screen and (min-width: 1400px) {
		background-image: url("/files/user-upload/images/LP_Platzhalter_BE-PART-OF-US_en.png") !important;
	}

}