/*----------------------------------
	Body und Main-Div
------------------------------------*/

body{
	background: #fff;
	margin: 0;
	padding: 0;
	font-family: Calibri, Arial, sans-serif;
	letter-spacing:0.25px;
}

body, html {
	min-height:101%;			/* damit immer ein Scrollbalken => keine horizontalen Verschiebungen */
}


.gesamt{
	margin-top: 0;

	/* min-height: 1000px; */
	max-width: 1100px;
	min-width:300px;

	/* für horizontale Zentrierung: */
	margin-left:auto;
	margin-right:auto;
}

/*----------------------------------
	Head, Platzhalter und Top-Bild
------------------------------------*/

#myHead {

	height: 150px;																	/* HEAD_HOEHE */
	background-color: #fff;
}

#myHead #logo {
	height: 160px;
	width: 240px;
	background: #fff url(../img/titellogo.png) no-repeat;
	margin-top:25px;
	margin-left: auto;
	margin-right: auto;
	background-position: center;
}

#platzhalter {
	background-color: orange;		/* (nur um falsche Höhe zu erkennen) */
	height: 30px;																	/* So hoch wie das Menü */
}

#topPicture {
	height: 300px;																	/* Höhe des Bildes */
	background: url(../img/topbild-01.jpg);
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-position: 20% 50%;
}


/*
#topPicture {
	height: 140px;																	/* Höhe des Bildes 
	background: url(../img/topbild-01.jpg);
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-position: 20% 50%;
}
*/
/*
#topPictureStartseite {
	height: 205px;																	/* Höhe des Bildes auf der Startseite 
	background: url(../img/topbild-Startseite.jpg);
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-position: 20% 50%;
}
*/

/*----------------------------------
				Content
------------------------------------*/


#inhalt {
 	background-color:#F4F4F4;
	width: calc(100% - 20%);			/* 100% minus (padding-left + padding-right) */
	padding-left: 10%;
	padding-right: 10%;
	padding-top: 75px;
	padding-bottom:35px;
	margin-bottom:25px;
	float: right;
	/*text-align:justify; */		/* Blocksatz */
}

/* Silbentrennung 
#inhalt p, #inhalt li {							/* Silbentrennung 
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto; 
} */

#inhalt p, #inhalt table {							/* Zeilenhöhe */
	line-height:1.3em; 
}

#inhalt li { 						/* Abstand bei Auflistungen */
	padding-bottom: 0.5em;
	line-height:1.3em; 
}

#inhalt a { 						/* Links nicht unterstreichen */
	text-decoration:none;
}



#inhalt a:hover { 						/* Links bei hover unterstreichen */
	text-decoration:underline;
}


#inhalt img {
	/* Bilder responsive-tauglich machen: */
	max-width:	100% !important;
	height: auto  !important;
}

#inhalt table {
	/* Tabellen responsive-tauglich machen: */
	width: 100% !important;
}



/* Spalten-Layout ---- */

.ganze_breite {
	margin-bottom: 15px;
}

.eine_haelfte,
.ein_drittel,
.zwei_drittel {
	float: left;
	margin-bottom: 15px;
	margin-right: 10%;
	position: relative;
}
.eine_haelfte {
	width: 45%;
}
.ein_drittel {
	width: 26.6%;
}
.zwei_drittel {
	width: 63.4%;
}
.letzte_spalte {
	clear: right;
	margin-right:0 !important;
}
.clearfix{ clear:both; }


/*----------------------------------
				Footer
------------------------------------*/

footer {
	margin-left: -1em; 			/* wie minus footer #links {padding-left} */
	color: #555;
}

footer a {
	color: #555;
}

footer .areal {
	float: left;
	padding-left: 1em; 			/* Abstand zwischen den zwei Footer-Spalten */
	box-sizing: border-box;
}

footer .links {
	width: 95%;
	margin-top:-10px;
}


footer .rechts {
	width: 15%;
	padding-bottom:75px;   /* Abstand zum untersten Browserrand */
}

footer ul {
	list-style:none;
	margin:0;
	padding:0;
	/*padding-top: 20px;*/
	/*margin-bottom: 100px;*/
	padding-left: 30px;
	padding-right: 30px;
}

footer li {
	float: left;
	margin-right: 1em;
	padding-right: 1em;
	margin-bottom: 0.75em;  /* Zeilenabstand zwischen Logo und Text rechts*/
}

footer .links li a {
	margin-right: 10px;
}

footer .rechts ul {
	float: right;
	overflow: hidden;
}

footer .rechts li {
	border-right: 1px solid #DDD;
	font-size: 0.95em;
	margin-bottom: 0.5em; /* Zeilenabstand Text rechts*/
	text-align: right;
/*	margin-top: 0.25em;*/
}

footer .rechts li:last-child {
	margin-right: 0;
	padding-right: 0;
	border-right: none;
}




/*****************************************************************************

							RESPONSIVES DESIGN

*****************************************************************************/
@media (max-width: 1500px) {
	footer .rechts li {
		border-right: none;			/* keine Trennstriche ('|') mehr */
	}
		
}

@media (max-width: 1495px) {
	footer .links {
	width: 100%;
	}


	footer .rechts {
	width: 100%;
}
		
}

@media (max-width: 950px) {

	#topPictureStartseite {
		clear:both;
		height: 170px;				/* (verkleinertes Top-Bild für Startseite) */
	}

}

@media (max-width: 768px) {
/*@media (max-width: 950px) {*/

	/*----------------------------------
		Head, Platzhalter und Top-Bild
	------------------------------------*/

	#myHead {
		height: 40px;				/* (verkleinerter Head) */
	}

	#platzhalter {
		height: 0px;				/* (Platzhalter annullieren) */
	}

	#topPicture {
		clear:both;
		height: 150px;				/* (verkleinertes Top-Bild) */
	}

	#topPictureStartseite {
		clear:both;
		height: 150px;				/* (verkleinertes Top-Bild für Startseite) */
		background: url(../img/topbild-01.jpg);
		background-size: auto 100%;
		background-repeat: no-repeat;
		background-position: 20% 50%;
	}

	/*----------------------------------
					Inhalt
	------------------------------------*/

	#inhalt {
		width: calc(100% - 60px);		/* 100% minus (padding-left + padding-right) */
		padding-left: 30px;
		padding-right: 30px;
		padding-top: 20px;
	}


	/* Spalten. Mehrspaltigkeit fällt zu nur einer Spalte zusammen. */
	.eine_haelfte,
	.ein_drittel,
	.zwei_drittel {
		width: 100%;
		margin-right: 0px;
	}


	/*----------------------------------
					Footer
	------------------------------------*/
	footer li {
		float: left;
		/* Abstand der Trennlinie ('|') zwischen den Einträgen verringern: */
		margin-right: 0.5em;
		padding-right: 0.5em;
	}

	footer .rechts li {
		border-right: none;			/* keine Trennstriche ('|') mehr */
	}	


	

	
	
}



@media (max-width: 400px) {
	footer .rechts li {
		float: none;					/* Alle Zeilen nun untereinander */
	/*	line-height: 2em;				/* Zeilen etwas auseinanderziehen */
		margin-right: 0em;
		border-right: none;			/* keine Trennstriche ('|') mehr */
		text-align: left;
	}
	

/*	margin-top: 0.25em;*/
}
	
	footer .rechts ul {
	float: left;
	

}
	



@media print {

.flexy-menu {
	display:none;
	}

footer .links {
	display:none;
}	

footer .rechts {
 	display:none;
}
	
}