@font-face {
    font-family: FagoNo;
    src: url("../fonts/FagoNoBlack_LFRoman.ttf");
		src: url("../fonts/FagoNoBold_LFRoman.ttf");
		src: url("../fonts/FagoNoRegular_LFRoman.ttf");
}

@font-face {
	font-family: gothic_bold;
	src: url('../fonts/gothic.ttf')
	format("truetype");
}
@font-face {
	font-family: gothic_bold;
	src: url('../fonts/gothic-bold.ttf')
	format("truetype");
}

	html,	body,	div, span, h1, h2,	h3,	h4,	h5,	h6,	p, a, em, img, sub, sup, b, u, i, center, ol, ul, li, table, tbody, tr, th, td {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		vertical-align: baseline;
		transition: all 0.4s ease-out;
		-moz-transition: all 0.4s ease-out;
  	-o-transition: all 0.4s ease-out;
  	-webkit-transition: all 0.4s ease-out;
		position: relative;
		box-sizing: border-box;
	}
	
	@-ms-viewport { width: device-width; }
	
	body {
		font-family: Lato, Arial, Helvetica, sans-serif;
		background: #FFF;
		line-height: 23px;
		font-size: 15px; /* Datenbank */
		color: #333;
		margin: 0;
		padding: 0;
		position: relative;
		width: 100%;
		height: 100%;
		
	}

	html, body{height: 100%;}
	div { box-sizing: border-box; }
	.clear { clear: both; }
	p { margin: 0px; }
	.vollebreite{ max-width: 100%!important; }


	/* ---------- MEDIA QUERIES ---------- */
	@media screen and (max-width: 768px) {
		
		.mobilvollebreite{ max-width: 100%!important; }
		
	}
	/* -------- MEDIA QUERIES ENDE -------- */


	a {
		color: inherit;
		opacity: 1;
		text-decoration: none!important;
	}
	
	a:hover { opacity: 0.8; }
	.logo a:hover { opacity: 1; }


/* =========================== Allgemeine Formatierung ============================== */

/* ===================== Hyphens ===================== */

	body, h1, h2, h3, h4, h5, h6, ul, li{
		-moz-hyphens: manual;
		-o-hyphens: manual;
		-webkit-hyphens: manual;
		-ms-hyphens: manual;
		hyphens: manual;
	}

	a{
		-moz-hyphens: none!important;
		-o-hyphens: none!important;
		-webkit-hyphens: none!important;
		-ms-hyphens: none!important;
		hyphens: none!important;
	}

	.hyphensauto{
		-moz-hyphens: auto!important;
		-o-hyphens: auto!important;
		-webkit-hyphens: auto!important;
		-ms-hyphens: auto!important;
		hyphens: auto!important;
	}
	
/* ---------- MEDIA QUERIES ---------- */

	@media screen and (max-width: 624px) {
		
		body {
			-moz-hyphens: auto;
			-o-hyphens: auto;
			-webkit-hyphens: auto;
			-ms-hyphens: auto;
			hyphens: auto;
		}
		
	}
	
/* -------- MEDIA QUERIES ENDE -------- */

/* =================== Hyphens ENDE ================== */



/* ==================== Schriften ==================== */

	.uppercase{ text-transform: uppercase; }
	.lowercase{ text-transform: lowercase; }
	h1, h2, h3, h4, h5, h6{	line-height: normal; }
	.h2bold{
		font-family: Lato, Arial, Helvetica, sans-serif;
		font-size: 27px;
		text-align: left;
		font-weight: 700;
	} /* Datenbank */
	.textbold{
		font-family: Lato, Arial, Helvetica, sans-serif;
		font-weight: 700;
} /* Datenbank */

/* ================== Schriften ENDE ================== */


/* ===================== anordnen ===================== */

	.center{ text-align: center!important; }
	.alignleft{ text-align: left!important; }
	.alignright{ text-align: right!important; }

	.vcenter{	/* Vertikal zentriert */
		display: flex;
		display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
		
  	flex-direction: column; 
  	justify-content:center;
		-webkit-box-pack: center;
		-moz-box-pack: center;
		box-pack: center;
		justify-content: center;
	}

	.flexbox {
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	.left, .right {
		float: left;
		width: 48%;
	}
	.left {	margin-right: 4%; }
	

/* ---------- MEDIA QUERIES ---------- */

	@media screen and (max-width: 624px) {
		
		.left, .right {
			float: none;
			width: 100%;
		}
		.left { margin-right: 0%; }
		.right{ margin-top: 20px; }
		.mobilcenter { text-align: center!important; }
		
	}

/* -------- MEDIA QUERIES ENDE -------- */

/* =================== anordnen ENDE ================== */


/* ===================== Abstände ===================== */

	.padding{ padding: 30px; }
	.margin{ margin: 30px!important; }
	
	.ptop-1x { padding-top: 10px; }
	.pbottom-1x { padding-bottom: 10px; }
	.pleft-1x { padding-left: 10px; }
	.pright-1x {	padding-right: 10px; }

	.ptop-2x { padding-top: 20px; }
	.pbottom-2x { padding-bottom: 20px; }
	.pleft-2x { padding-left: 20px; }
	.pright-2x {	padding-right: 20px; }

	.ptop-3x { padding-top: 30px; }
	.pbottom-3x { padding-bottom: 30px; }
	.pleft-3x { padding-left: 30px; }
	.pright-3x {	padding-right: 30px; }

	.ptop-4x { padding-top: 40px; }
	.pbottom-4x { padding-bottom: 40px; }
	.pleft-4x { padding-left: 40px; }
	.pright-4x {	padding-right: 40px; }

	.ptop-5x { padding-top: 50px; }
	.pbottom-5x { padding-bottom: 50px; }
	.pleft-5x { padding-left: 50px; }
	.pright-5x {	padding-right: 50px; }
	
	.mtop-1x { margin-top: 10px!important; }
	.mbottom-1x { margin-bottom: 10px!important; }
	.mleft-1x { margin-left: 10px!important; }
	.mright-1x {	margin-right: 10px!important; }
	
	.mtop-2x { margin-top: 20px!important; }
	.mbottom-2x { margin-bottom: 20px!important; }
	.mleft-2x { margin-left: 20px!important; }
	.mright-2x {	margin-right: 20px!important; }
	
	.mtop-3x { margin-top: 30px!important; }
	.mbottom-3x { margin-bottom: 30px!important; }
	.mleft-3x { margin-left: 30px!important; }
	.mright-3x {	margin-right: 30px!important; }
	
	.mtop-4x { margin-top: 40px!important; }
	.mbottom-4x { margin-bottom: 40px!important; }
	.mleft-4x { margin-left: 40px!important; }
	.mright-4x {	margin-right: 40px!important; }

	.gap{ padding-top: 10px; }

/* =================== Abstände ENDE ================== */
	

	.container {
		background-color: none;
		width: 1024px!important;
		margin: 0px auto!important;
		max-width: calc(100% - 60px)!important;
	}


/* ====================== Listen ====================== */

	ul { list-style: none; }
	
	ul li::before {
		content: "\25CF";
		color: #000;
		font-weight: bold;
		margin-left: -1.5em; /* dieser Wert bestimmt den Abstand zwischen bullet und Text */
		position: absolute;
	}
	
	li {
		padding-left: 20px; /* mit diesem Wert wird die Liste eingerückt */
		margin-left: 0px;
		padding-bottom: 6px;
		padding-right: 5px;
	}
		li:hover{
			margin-left: 5px;
			padding-right: 0px;
		}

/* ==================== Listen ENDE =================== */


/* ========================= Allgemeine Formatierung Ende ============================ */




/* =========================== Spezifische Formatierung ============================== */


/* ====================== Farben ====================== */

	.weiss{ color: #FFF; }
	.schwarz{ color: #333; }
	.grau{ color: #666; }
	.bgschwarz{ background: #000000; }
	.bgweiss{ background: #FFF; }
	.bggrau{ background: #333333; }
	.bgfarbe01{ background: rgb(58,127,138,1); }
	.farbe01{ color: rgb(58,127,138,1); }
	.javrot{color:#E20E18}

/* ==================== Farben ENDE =================== */


/* ====================== Buttons ===================== */

	.button1{
		border: 1px solid #333;
		text-align: center;
		padding: 20px;
	}
		.button1:hover{	background: rgb(51,51,51,1);}
	
	.button2{ margin-top: 40px; }
		
		.button2 a{
			width: 210px;
			border: 2px solid #FFF;
			border-radius: 15px;
			-moz-border-radius: 15px;
			-ms-border-radius: 15px;
			-webkit-border-radius: 15px;
			padding: 10px 25px;
			text-transform: uppercase;
		}
		.button2 a:hover{ background: #333; opacity: 1; }

/* =================== Buttons ENDE =================== */



/* ---------- MEDIA QUERIES ---------- */

	@media screen and (max-width: 988px) {}
	@media screen and (max-width: 768px) {}
	@media screen and (max-width: 480px) {}

/* -------- MEDIA QUERIES ENDE -------- */
	


.menumargintop{margin-top: 135px;}
.menupaddingtop{padding-top: 250px;}

.weissraum_oben{margin-top: 70px!important;}
.weissraum_oben_2{margin-top: 70px!important;}
.weissraum_unten{margin-bottom: 70px!important;}

.weissraum_oben_ohne_header{margin-top: 150px!important;}
.weissraum_unten_ohne_header{margin-bottom: 204px!important;}


.header_ueberschrift_ges{font-size:50px!important;}

/* ---------- MEDIA QUERIES ---------- */

	@media screen and (max-width: 988px) {.header_ueberschrift_ges{font-size:40px!important;}}
	@media screen and (max-width: 768px) {.header_ueberschrift_ges{font-size:35px!important;}}
	@media screen and (max-width: 480px) {.header_ueberschrift_ges{font-size:30px!important; text-align:center;}}

/* -------- MEDIA QUERIES ENDE -------- */       




.abstand_menu_n{ padding-top: 224.5px;}
.inhalt_n{ 
	min-height: calc(100% - 493px)!important;
	padding: 70px 20px!important;
}


/* ---------- MEDIA QUERIES ---------- */

	@media screen and (max-width: 1100px) {}
	
	@media screen and (max-width: 988px) {
		.inhalt_n{ min-height: calc(100% - 583px)!important; }
	}
	
	@media screen and (max-width: 910px) {}
	
	@media screen and (max-width: 820px) {
		.abstand_menu_n{ padding-top: 194.5px;}
		.inhalt_n{ min-height: calc(100% - 553.4px)!important; }
	}
	
	@media screen and (max-width: 768px) {
		.abstand_menu_n{ padding-top: 171px;}
		.inhalt_n{ min-height: auto; }
	}
	
	@media screen and (max-width: 600px) {
		.inhalt_n{ min-height: calc(100% - 776.8px)!important; }
	}

/* -------- MEDIA QUERIES ENDE -------- */