* {
  box-sizing: border-box;
  margin: 0;
}

html {
	font-size: 10px;
	background-color: black;
	margin: 0;
	font-family: calibri, arial;
}

body {
	width: 100%;
	max-width: 120rem;
	margin: 0 auto;
	font-size: 1.6rem;
}





						/* HEADER ANFANG */

#header {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: inherit;
	width: inherit;
	z-index: 1000;
	position: fixed;
	height: 7rem;
	background-color: rgba(0,0,0,0.9);
	color: white;
	font-weight: 100;
	box-shadow: 0rem 0.2rem 0.5rem black;
}

#header_teil_1, #header_teil_2, #header_teil_3 {
	display: flex;
	align-items: center;
	justify-content: center;
}

#header_teil_1, #header_teil_3 {
	width: 8%;
}

#header_teil_2 {
	width: 84%;
}


#toi_logo {
	height: 5rem;
	width: auto;
}

#language_image {
	margin-right: 1rem;
	width: 2rem;
	height: auto;
}

#top_on_ice_home_button {
	margin-left: 1rem;
	width: 1.5rem;
	height: auto;
}

#header_definition {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	width: 100%;
	background-color: black;
	color: #bcbcbc;
	text-align: center;
	font-size: 1.2rem;
	letter-spacing: 0.07rem;
	position: relative;
	height: 4rem;
	top: 7.5rem;
}

							/* HEADER ENDE */




#content {
	margin: 0 auto;
	z-index: 900;
	position: relative;
	top: 7rem;
	box-shadow: 1rem black;
}

.jobs_banner {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	background-color: white;
	background-image: url("img_page/jobs_banner.jpg");
	background-size: cover;
	background-position: bottom;
	color: #fff;
	font-family: 'Contrail One', calibri;
	font-size: 2rem;
	text-align: center;
	letter-spacing: 0.07rem;
	position: relative;
	height: 25rem;
}
	
.jobs_banner p {
	background-color: rgba(0,0,0,0.4);
	padding: 2rem 1.5rem 2rem 1.5rem;
}

#dann_bist_du {
	font-size: 1.3rem;
	font-family: calibri;
}


.job_title {
	font-size: 80%;
	font-weight: lighter;
	letter-spacing: 0.3rem;
	padding-top: 1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	color: #eee;
	text-align: center;
	height: auto;
	background-color: #232323;
	text-shadow: -0rem -0.1rem 0.2rem #666666;
	padding: 3rem 1rem 2rem 1rem;
	text-transform: uppercase;
}

.job_description {
	font-size: 1,7rem;
	color: #eee;
	float: left;
	width: 100%;
	height: auto;
	text-align: center;
	background-color: #353535;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: left;
}

.job_description p {
	padding: 2rem ;
}

.jobs_unterschrift {
	color: #eee;
	font-size: 1,7rem;
	text-align: center;
	background-color: #353535;
	padding: 2rem 1rem 2rem 1rem;
}


.mail_style {
	color: #eee;
}

.mehr_erfahren_jobs {
	color: #eee;
	font-size: 1.2rem;
	background-color: #232323;
	text-decoration-line: underline;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	color: white;
	text-align: center;
	height: auto;
	padding: 0rem 1rem 2rem 1rem;
}

.mehr_erfahren_jobs:hover {
	cursor: pointer;
}


/* FOOTER ANFANG*/

.mehr_erfahren {
	color: white;
	text-decoration-line: underline;
}

.box_footer {
	position: relative;
	font-size: 1.5rem;
	color: #fff;
	float: left;
	width: 100%;
	height: auto;
	text-align: center;
	background-color: #000000;
}

.footer_bestandteile {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 8rem;
	float: left;
}

#abstand_social_icons {
	margin: 0 1rem;
}

#copyright {
	width: 100%;
}

/*FOOTER ENDE*/





/*Media Quaries Begin*/

@media (min-width: 450px){	
	
	.job_title {
		width: 100%;
		font-size: 90%;
	}
	
	#header_definition  {
		font-size: 1.6rem;
		letter-spacing: 0.2rem;
		word-spacing: 0.5rem;
	}
	
	#toi_logo {
		height: 6rem;
	}
	
	#content {
		top: 7rem;
	}
	
	.jobs_banner {
	font-size: 3rem;
	height: 40rem;
}
	
	.jobs_banner p {
		padding: 4rem 2rem 4rem 2rem;
	}

	#dann_bist_du {
		font-size: 1.6rem;
	}
}

@media (min-width: 600px){
		.footer_bestandteile {
		width: 20%;
		height: 15rem;
	}
}


@media (min-width: 700px){

	#toi_logo {
	height: 7rem;
	}

	#header {
	height: 9rem;
	}

	#language_image, #top_on_ice_home_button {
	width: 2.3rem;
	}

	#header_definition {
	font-size: 1.8rem;
	height: 4.3rem;
	top: 9rem;
	}

	#content {
	top: 9rem;
	}
	
	.jobs_banner {
	font-size: 4rem;
	height: 50rem;
}
	
	.jobs_banner p {
		padding: 5rem 3rem 5rem 3rem;
	}

	#dann_bist_du {
		font-size: 2rem;
	}
	
	.job_title h1 {
	font-size: 100%;
	position: relative;
	padding-top: 1rem;
	}
	
	
	#team_text {
	margin: 5rem 5rem;
	font-size: 100%;
	}
	
	.job_description p {
	padding: 3rem 5rem 3rem 5rem;
	}
}


/*Media Quaries ENDE*/