﻿
* {
	margin:0;
	padding:0;
}

html {
	font-size: 75%; 	
}

html > body {
	font-size: 12px;
}

body {
	background: #FFFFFF url('landschaft/Panorama_0245_247.jpg') no-repeat fixed center;
	text-align: center;
}

.clear {
	clear:both;
	float:left;
}

#wrapper {
	background:transparent;	
	text-align: left;		
	width: 80em;
	margin: 0px auto;
	padding: 0px 10px;
	
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-o-border-radius: 0;
	border-radius: 0;
	
	-webkit-box-shadow: 0px 10px 20px rgba(255,255,255,.6);
	-moz-box-shadow: 0px 10px 20px rgba(255,255,255,.6);
	-o-box-shadow: 0px 10px 20px rgba(255,255,255,.6);
	box-shadow: 0px 10px 20px rgba(255,255,255,.6);
	
/*	-webkit-transform: rotate(-5deg) scale(1,1.5) skew(-15deg,-5deg);
	-moz-transform: rotate(-5deg) scale(1,1.5) skew(-15deg,-5deg);
	-o-transform: rotate(-5deg) scale(1,1.5) skew(-15deg,-5deg);
	transform: rotate(-5deg) scale(1,1.5) skew(-15deg,-5deg);
*/
	background: rgba(255,255,255,.15);
/*	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,.25)), to(rgba(255,255,255,.4)));*/

	background: -webkit-linear-gradient(top, rgba(255,255,255,.1), rgba(255,255,255,.3));
	background: -moz-linear-gradient(top, rgba(255,255,255,.1), rgba(255,255,255,.3));
	background: -o-linear-gradient(top, from(rgba(255,255,255,.1)), to(rgba(255,255,255,.3)));
	background: linear-gradient(top, rgba(255,255,255,.1), rgba(255,255,255,.3));
	
}

#content {
	background:transparent;
}

#content h2 {
/*	background: #fff;*/
	color: yellow;
	padding: 20px 0;
	height: 130px;
}

#hauptinhalt {
	float: left;
	width: 550px;

	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-o-border-radius: 0;
	border-radius: 0;
}

#menuLX {
	background: trasparent;
	color:yellow;
	font-size:18px;
	width: 29.2em;
	float: left;

	-webkit-border-radius: 10;
	-moz-border-radius: 10;
	-o-border-radius: 10;
	border-radius: 10;
}

/*  Navigation  */
#navigation {
	background: #FFFFFF;
	background: rgba(192, 192, 192, 0.2);
	width: 29.2em;
	float: right;
}

#navigation p {
	font: 12px Arial, Tahoma, Verdana, sans-serif;
	margin-top: 1.8em;
	margin-bottom: 1.8em;				
	color:black;
	background: trasparent;		
}

#navigation a {
	font: 12px Arial, Tahoma, Verdana, sans-serif;
	margin-top: 1.8em;
	margin-bottom: 1.8em;				
	color:yellow;
	background: trasparent;		
}

img.bild {
	background-color: #EEEEEE;
}

#footer {
	background: #DDFFBB;
	clear: both;
	color: black;
	padding: 20px 0;
}

p {
/*	font: 1em/1.5em Arial, Tahoma, Verdana, sans-serif;*/
	font: 18px Arial, Tahoma, Verdana, sans-serif;	
	color:black;
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	clear: both;
}

h1 {
	font: 40px Georgia, "Times New Roman", Times, serif;
	margin-top: 0.9em;
	margin-bottom: 0.9em;	
	color:#000;	
}

h2 {
	font: 30px Georgia, "Times New Roman", Times, serif;	
	margin-top: 1em;
	margin-bottom: 1em;	
	color:yellow;	
}

h1#navigation {
	font-size:40px;
	font: 20px Georgia, "Times New Roman", Times, serif;	
	margin-top: 1em;
	margin-bottom: 1em;	
	color:yellow;	
	background: trasparent;		
}

h2#logo {
	font-size:20px;
	font: 30px Georgia, "Times New Roman", Times, serif;	
	margin-top: 1em;
	margin-bottom: 1em;	
	color:yellow;	
	background: trasparent;		
}

h3 {
	font: 20px Georgia, "Times New Roman", Times, serif;	
	margin-top: 1.13em;
	margin-bottom: 1.13em;	
	color:#000;
	background: trasparent;		
}

h4 {
	font: 15px Georgia, "Times New Roman", Times, serif;	
	margin-top: 1.29em;
	margin-bottom: 1.29em;	
	color:#000;
	background: trasparent;		
}

h1, 
#hauptinhalt h2, 
#hauptinhalt h3, 
#hauptinhalt h4, 
#hauptinhalt ul, 
#hauptinhalt p,

#navigation h2, 
#navigation h3, 
#navigation h4, 
#navigation ul, 
#navigation p {
	padding: 0 20px;	
}

#footer p {
	font: 10px Arial, Tahoma, Verdana, sans-serif;
	margin-top: 1.8em;
	margin-bottom: 1.8em;	
	padding: 0 20px;	
}

.bild {
	float:  left;
	padding: 5px;
	border:  1px solid #eee;
	margin: 0 18px 18px 0;
	max-width: 250px;
}

.elastisches-bild {
	float:  left;
	padding: 0.42em;
	border:  0.083em solid #eee;
	margin: 0 1.5em 1.5em 0;
	width: 25em;
	height: 16.7em;	
}

/*   screen and (max-width: 320px)  */
@media only screen and (width: 320px) {

	body {
		background: #FFFFFF url('landschaft/Panorama_0245_247.jpg') no-repeat fixed center;
		text-align: center;
	}
	
	#wrapper {
		width:100%;
	}
	
	#header { width:100%; }
	
	#hauptinhalt { width:100%; }
	
	#navigation {
		width:100%;
	}
	
	#footer {
		width:100%;
		}
	}
	
	#content {
		margin-bottom:40px;
	}
	
	#content p {
		margin-bottom:90px;
	}
}

/*   screen and (max-width: 380px)  */
@media only screen and (width: 380px) {

	body {
/*		background:  url('') no-repeat fixed center;*/
		text-align: center;
	}
	
	#wrapper {
		width:100%;
	}
	
	#header { width:100%; }
	
	#hauptinhalt { width:100%; }
	
	#navigation {
		width:100%;
	}
	
	#footer {
		width:100%;
		}
	
	h1#navigation {
		font-size:30px;
		font: 20px;
		margin-top: 1em;
		margin-bottom: 1em;	
		color:#000;	
	}
	
	
	h2#logo {
		font-size:20px;
		font: 20px;	
		margin-top: 1em;
		margin-bottom: 1em;	
		color:#000;	
	}
	
	#content {
		margin-bottom:40px;
	}
	
	#content p {
		margin-bottom:90px;
	}
}
/* Ende 320 px */



/*   screen and (max-width: 480px)  */
@media only screen and (width: 480px) {

	body {
/*		background:  url('landschaft/Panorama_0245_247.jpg') no-repeat fixed center;*/
		text-align: center;
	}
	
	#wrapper {
		width:100%;
	}
	
	#header { width:100%; }
	
	#hauptinhalt { width:100%; }
	
	#navigation {
		width:100%;
/*		background-color:#FFF2BF;*/
	}
	
	h1#navigation {
		font-size:30px;
		font: 20px;
		margin-top: 1em;
		margin-bottom: 1em;	
/*		color:#000;*/
	}
	
	#footer {
		width:100%;
		}
	
	h2#logo {
		font-size:20px;
		font: 20px;
		margin-top: 1em;
		margin-bottom: 1em;	
/*		color:#000;	*/
	}
	
	#content {
		margin-bottom:40px;
	}
	
	#content p {
		margin-bottom:90px;
	}
}

/* Ende 480 px */

/*

/*   screen and (max-width: 1024px)  */
/*@media only screen and (width: 1024px) {

#wrapper { width:100%; }

#header { width:100%; }

#hauptinhalt { width:78%; }

#navigation {
	width:20%;
}

#footer {
	width:100%;
	}
}
*/

