/*Allgemeins zu CSS:
CSS bietet die Möglichkeit Regeln auf mehrere Elemente gleichzeitig anzuwenden
Das spart zeit und erhöht die WArtbarkeit. Außerdem werden viele alte HTML Befehle inzwischen nicht
mehr unterstützt, man kommt also um CSS nicht mehr herum.
Man geht vom allgmeinen zum speziellen, da Regeln sich überschreiben können. Die letzte Regel wird angewendet.
Also beginnt man mit allen Elementen, zum Beispiel alle Bilder oder Überschriften sollen etwas bestimmtes tun.
Dann kommen Klassen, also Elemente die mit class="Klassenname" spezifiziert werden. Um Klassen anzusprechen
schreibt man ein . vor den Klassennamen, also .classenname.
Dann kommen IDs, also einzelne Elemente, die sich anders verhalten sollen. Elemente denen eine ID mit
id="idname" zu gewieden wurde. IDs werden in CSS mit #idname angesprochen*/



/*Anwendung auf alles*/
* {
	font-size: 16px;
	font-family: verdana;
	color: black;
	font-weight: lighter;
	text-align: justify;

}
a{
	 text-decoration: none;
}

/*Anwendung auf alle Überschriften mit dem Tag h1*/
h1 {
	background-color: red;
	font-weight: bold;
	text-align: center;
	color: black;
	/*Angaben in vw wären besser, dann wäre die Schriftgröße auch responsive*/
	font-size: 18px;
	margin-bottom: 8%;
	/*Angaben in % wären besser, dann wäre der Zeilenabstand auch responsive*/
	line-height: 1.5;
}
/*Anwendung auf alle Bilder*/
img {
  width: 100%;
  height: auto;
  margin: 20px;
  margin-left: 0px;
}
/*Anwendung auf alles im body*/
body{
	margin: 1%;
	margin-top: 5%;
}

/*Anwendung auf alle footer-Klassen, also alles mit der Eigenschaft class="footer"*/
.footer {
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: red;
   color: white;
   text-align: center;
   font-weight: bold;
   font-size: 25px;
   letter-spacing: 1pt;
}

.footer a{
	color: black;
	text-align: center;
	margin-bottom: 0px;
	display: inline-block;
	text-decoration:none;
}



/*Anwendung auf alle carousel-Klassen, also alles mit der Eigenschaft class="carousel" 
Das sind die Slideshows*/
.carousel{
	margin: 20px;
	margin-left: 0px;
	width: 100%;
	height: auto;
}
/*In Slideshows bekommen Bilder eine extra Regel*/
.carousel img {
margin: 0px;
}



.icon{
	width: 37; 
	height: 37; 
	margin: 0px;
}

#greetings{
	text-align: center;
}

#antiklageklausel{
	text-align: left;
}

#postInfo{
	
  width: 100%;
  height: 500px;
  margin: 20px;
  margin-left: 0px;
}


#phoneNumber{
	color: white;
}

#maillogo{
	position: absolute;
		left: 40%;
}
#fblogo{
	position: absolute;
		left: 60%;
}

/*Das Element mit der ID fb, also id="fb"*/
#fb{
	width: 32;
	height: 32;
	margin: 0px;
}

	@media only screen and (max-width: 1000px) {
		#fb{
		position: absolute;
		left: 50%;
		}
		p::after {
		content: &nbsp;
}
	} 