/* A L L G E M E I N */
	
	
	
	
	/* links */
	a	{color: #000000;}
			
	body	{margin: 0px;
			padding: 0px;
			font-family: Poppins, sans-serif;
			background-color: #f4f0ec;}
			
	h1			{font-family: 'Playfair Display', serif;
				color: #474a1e;}
			
	h3			{font-family: Poppins, sans-serif;
				text-align: left;}
				

	


/* S M A R T P H O N E ----------------------------------------------------------------------*/

	
	/* body */
	
	.swidth		{margin-left: 5%;
				margin-right: 5%;
				}
				
	/* natur */
	
	.natur		{display: flex;
				flex-direction: column;
				justify-content: center;
				}
	
	/* Überschriften */
	
	
	h1			{font-size:35pt;
				text-align: center;}
			
	h2			{text-align: center;
				font-size: 16pt;}
	
	h3			{font-size: 14pt;
				font-family: Poppins, sans-serif;
				text-align: left;}
	
	
	.verlauf_g {height: 180px;
				width: 100%;
				background-image: url(../images/gruen_verlauf.jpg);
				background-repeat: repeat-x;
				background-size: cover;
				}

	.mpoint			{font-family: Poppins, sans-serif;
					font-size: 13pt;
					display: flex;
					justify-content: center;
					align-items: center;
					width: 100%;
					height: 33%;
					color: #fff;
					text-decoration: none;}
							
	.mpoint:hover	{filter: brightness(83%);}
			
			
	.menue			{height: 180px;
					display: flex;
					flex-direction: column;}
		

	.mpoint img		{height: 60%;
					padding-right: 15px;
					filter: invert(100%);}
					
	/* Paragraph */
	
	p			{font-size: 12pt;}
	
	.impressum	{margin-top: 50px;
				margin-bottom: 40px;
				font-size: 10pt;
				font-family: Poppins , sans-serif;
				text-decoration: underline;
				display: flex;
				justify-content: center;
				color: #808080;}
				
	.impressum:hover	{font-style: italic;}
	
	
	.quellenangabe		{font-size: 7pt;
						text-align: center;}
						
	td		{font-size: 9pt;}
						
	/* Impressionen */
	
	.ttext			{font-size: 14pt;}	
	
	
	/* images */
	
	.logo_image		{width: 85%;}
	
	.closeup		{
					width: 90%;
					margin-left: 5%;
					margin-right: 5%;}


/* T A B L E T ------------------------------------------------------------------------------*/
	@media only screen and (min-width: 600px){
	
	body		{margin-left: 5%;
				margin-right: 5%;
				}
	
	
	.natur		{flex-direction: row;
				margin: 5%;}
				
	
				
	/* Überschriften */
	
	h1			{font-size: 50pt;
				margin-top: 40px;
				margin-bottom: 5px;}
				
	h2			{font-size: 18pt;
				margin-top: 5px;
				margin-bottom: 15px;}
				
	h3			{font-size: 16pt;
				font-weight: bold;
				margin-top: 40px;
				}
				
	/* Paragraph */
	
	p			{font-size: 15pt;}
	
	.impressum	{margin-top: 50px;
				font-size: 12pt;
				font-family: Poppins , sans-serif;
				text-decoration: underline;
				display: flex;
				justify-content: center;
				color: #808080;}
				
	.impressum:hover	{font-style: italic;}
	
	td		{font-size: 12pt;}
	
	
	/* Impressionen */
	
	.ttext			{font-size: 16pt;}	

	
	/* Index */
							
	.mpoint			{font-family: Poppins, sans-serif;
					display: flex;
					justify-content: center;
					align-items: center;
					width: 33%;
					height: 100%;
					color: #fff;
					text-decoration: none;}
					
	.mpoint:hover	{filter: brightness(83%);}
	
	
	.menue			{height: 70px;
					display: flex;
					flex-direction: row;}


	.mpoint img		{height: 60%;
					padding-right: 15px;
					filter: invert(100%);}
	/* header */
	header		{text-align: center;}

	/* n a v */
	nav		{margin-bottom: 50px;}
	
	nav	ul	{list-style: none;
			padding: 0;
			margin: 0;}
	
	nav ul li 	{float: left;
				text-align: center;
				padding: 25px;
				}
			
	.verlauf_g {height: 70px;
				width: 100%;
				background-image: url(../images/gruen_verlauf.jpg);
				background-repeat: repeat-x;
				background-size: cover;
				}	
	
	/* footer */
	
	footer		{margin-top: 20px;
				margin-bottom: 20px;
				}

	/* Quellenanbage */
	
	.quellenangabe		{font-size: 9pt;
						text-align: center;}
						
	.quellenangabe a:hover	{font-style: italic;}
	
	/* images */
	
	.logo_image		{width: 65%;}
	
	.closeup		{width: 50%;
					min-width: 220px;
					align-self: center;}
	
	}
	



/* D E S K T O P ---------------------------------------------------------------------------*/
	@media only screen and (min-width: 1200px){
		
	body		{width: 80%;
				margin-left: 10%;
				margin-right: 10%;
				max-width: 2300px;
				}
			
	.mpoint		{font-size: 15pt;}
	
	
	/* images */
	
	.logo_image		{width: 50%;}
	
	.closeup	{width: 70%;}
	
	}