/* Formattazione Navigation - SR 11/11/15 - 24/08/15 */

* {
	margin:0;
	padding:0;
}

body {
	font-size:16px;
	font-family:Verdana, Geneva, Tahoma, sans-serif Arial, serif;
	text-align: center;
	color: white;
	margin: 0 auto;
	padding: 0;
	background: url('../images/_goldrain_titelbild.jpg') no-repeat fixed top;
}


.clear {
	clear:both;
	float:left;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

div#wrapper {
	max-width:1024px;
	min-width:500px;
	background:transparent;	
	text-align: left;		
	width: 80em;
	margin: 0px auto;
	margin:0 auto 50px 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);
	
	background: rgba(255,255,255,.5);
/*	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));
}

#wrapper p {
	font-size: 14px;
	line-height:20px;
}

#wrapperNav {
	width:100%;
	text-align: left;
}

#header {
	margin:10px auto;
	padding:10px 0;

	width:100%;
	background-color: rgba(211,211,211,0.4);
	-webkit-border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;
	-moz-border-radius-bottomright:5px;
	-moz-border-radius-bottomleft:5px;
	border-bottom-right-radius:5px;
	border-bottom-left-radius:5px;

	color: black;
	padding: 20px 0;
}

#footer {
	margin:10px auto;
	padding:10px 0;

	width:100%;
	background-color: rgba(211,211,211,0.4);
	-webkit-border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;
	-moz-border-radius-bottomright:5px;
	-moz-border-radius-bottomleft:5px;
	border-bottom-right-radius:5px;
	border-bottom-left-radius:5px;

	color: black;
	padding: 20px 0;
	padding:25px 0;
	margin:50px 0 0 0;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	font-size:18px;
	text-align: left;
}

#footer p {
	font: 10px Arial, Tahoma, Verdana, sans-serif;
	margin-top: 1.8em;
	margin-bottom: 1.8em;	
	padding: 0 20px;	
	font-size:18px;
}


div#colSX  {
	width:25%;
	float:left;	
	background-color: rgba(211,211,211,0.4);
}

div#colCentrale  {
	width:80%;	
	float:left;
}

div#content  {
	width:100%;
	height:100%;

	float:left;	
	margin:5px auto;
	padding:5px 10px;
	text-align: left;

	background-color: rgba(211,211,211,0.4);
	-webkit-border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;

	-moz-border-radius-bottomright:5px;
	-moz-border-radius-bottomleft:5px;

	border-bottom-right-radius:5px;
	border-bottom-left-radius:5px;

	background:transparent;

	border-radius:5px;

	-webkit-border-top-left-radius:0px;
	-moz-border-radius-topleft:0px;
	border-top-left-radius:0px;
}

#contentWrapper {	
	padding-bottom: 220px; 
}


#content h2 {
	margin-left:30px;
	color: yellow;
	padding: 20px 0;
	height: 130px;
	margin:0;
	padding:10px 50px
	font:bold 80px/.825 'Yanone Kaffeesatz', arial, serif;
	text-shadow: 1px 1px 1px #CCC;

	color:black;  /*6c6c6c;*/
	font: 30px 'Yanone Kaffeesatz', arial, serif;
	display: block;
}

#content h3 {
	margin-left:30px;
	color: yellow;
	padding: 20px 0;
	height: 130px;
	margin:0;
	padding:10px 50px
}

#content a {
	margin-left:30px;
	color: yellow;
	padding: 20px 0;
	height: 130px;
	margin:0;
	padding:10px 50px
}

/*  chiedere a Claudio   */  
#content p {
	float:left;
	margin:10% 10%;
	-moz-column-gap:40px;
	-moz-column-count:2;	
	-webkit-column-gap:40px;	
	-webkit-column-count:2;
	
	column-gap:40px;
	column-count:2;

	font-size:18px;
	margin:0;
	padding:10px 50px;

	font: normal 16px 'Yanone Kaffeesatz', arial, serif;
	text-shadow: 1px 1px 1px #6c6c6c;
	text-indent:50px;
}

#header h1 {
	font: 20px/1 'Yanone Kaffeesatz', arial, serif;
	text-shadow: 1px 1px 1px #6c6c6c;
	text-indent:100px;
}

#content h2 {
	text-shadow: 1px 1px 1px #CCC;
	color:black;  /*6c6c6c;*/
	font: 30px 'Yanone Kaffeesatz', arial, serif;
	display: block;
}

#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  */
#nav {
	text-align:left;	
}

#nav ul {
	width:100%;
	padding:0;
	margin:0;
	list-style:none;
}

#nav li {
	display:inline-block;
	padding:7px 0 0 0;
	margin:0 5px 0 0;
	font: bold 81.25%/2.125 Arial, Verdana, sans-serif;
}

#nav li a {
	display: block;
	color:yellow;
	text-decoration: none;
	padding:0 0 0 5px;
	background:#2c2c2c;
	/* alte webkit-basierte Browser (Safari, Chrome, etc.) */
	background: -webkit-gradient(linear, left top, left bottom, from(#848487), to(#3c3c3c));
	/* neue webkit-basierte Browser(Safari, Chrome, etc.) */
	background: -webkit-linear-gradient(top, #848487, #3c3c3c);
	/* Mozilla/Gecko (Firefox, Flock, etc) */
	background: -moz-linear-gradient(top, #848487, #3c3c3c);
	/* Für Presto (Opera ab Version 11.1) */
	background: -o-linear-gradient(top, #848487, #3c3c3c);
	/* IE10 Pre-Beta */
	background: -ms-linear-gradient(top, #848487, #3c3c3c);
	/* aktueller W3C working draft */
	background: linear-gradient(top, #848487, #3c3c3c);
}

#nav li#active,
#nav li a {
	-webkit-border-top-right-radius:5px;
	-webkit-border-top-left-radius:5px;
	-moz-border-radius-topright:5px;
	-moz-border-radius-topleft:5px;
	border-top-right-radius:5px;
	border-top-left-radius:5px;
}

#nav li a:hover,
#nav li a:active,
#nav li a:focus {
	outline: none;
	text-decoration: underline;
}

#nav li a  {
	display:block;
	margin:0;
	padding:0 15px 0 10px;
}

#nav li#active {
	display:block;
	margin:0 5px 0 0;
	padding:7px 15px 0 15px;
	color:#2c2c2c;
	background:#FFF;
}

#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;
}

p {
	font: 25px Arial, Tahoma, Verdana, sans-serif;	
	color:white;
	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:white;	
}

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:white;
	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 {
	padding: 0 20px;	
}

#navigation h2, 
#navigation h3, 
#navigation h4, 
#navigation ul, 
#navigation p {
	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;	
}


/* IE-Patch für IE 7*/
*:first-child+html .clearfix { min-height: 0; }

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


@media only screen and (max-width: 750px) {
	#wrapper {
	margin:0 auto;
	max-width:700px;
	min-width:400px;
	width:90%;
	}

	#header,
	#footer {
	margin:25px auto;
	width:100%;
	height:auto;
	}
	
	#header {
	margin-top:0;
	}
	
	#content {
	padding:10px 0;
	}
	
	#content h2,
	#content p {
	margin:0;
	padding:10px 20px;
	}
	
	#header h1,
	#footer p {
	text-indent:20px;
	}
	
	#wrapper h1,
	#wrapper h2 {
	font-size:30px;
	line-height: 1.25;
	}
	
	#content h1  {
	font-size:18px;
	}

	div#content  {
		width:90%;
		float:left;	
		margin-left:20px;
		padding-left:20px;
	}
	
	div#colSX  {
		width:90%;
		float:left;	
	}

	div#colCentrale  {
		width:80%;	
		float:left;
	}
}


/*   screen and (max-width: 320px)  */
@media only screen and (width: 320px) {

	body {
		background:  url('../images/goldrain_titelbild.jpg') no-repeat fixed top;
		text-align: center;
	}
	
	#wrapper {	width:320px;	}
	
	#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('../images/goldrain_titelbild.jpg') no-repeat fixed top;
		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 */


@media only screen and (max-width: 450px) {

	body {
		background: none;	
		background:  url('../images/goldrain_titelbild.jpg') no-repeat fixed top;		
		background-color: rgba(211,211,211,0.4);
		color:black;	
	}

	#wrapper {
		margin:0 auto;
		max-width:460px;
		min-width:150px;
		width:98%;
	}

	#header {
		margin:55px auto;	
		padding:5px 0px;
		width:98%;
		height:130px;
	}
	#header h1 {
		text-indent:10px;  /* spazio a Sx*/
		font-size:15px;
		line-height:.66;
		text-align:center;
		margin-top:10px;
		padding-top:20px;
	}
	#header h1#testo {
/*		display:none;*/
	}
	
	#nav {
		margin-top:0px;
		text-align:left;	
	}
	
	#nav ul {
	float:none;
	width:100%;
	padding:0;
	}
	
	#nav li,
	#nav li#active ,
	#nav li a,
	#nav li a  {
	float:none;
	width:100%;
	}
	#nav ul li {
	padding:0;
	}
	#content h2, h3, p {
		margin:0 auto;
		padding:5px;
	}
	div#content img {
		margin:0px 0px;
		margin-left:-20px;
		padding:0px;
	}
	div#content a:img {
		margin:0px;
		padding:0px;
	}
	#content {
		background-color: rgba(211,211,211,0.4);
		-webkit-border-top-right-radius:0px;
		-webkit-border-top-left-radius:0px;
		-moz-border-radius-topright:0px;
		-moz-border-radius-topleft:0px;
		border-top-right-radius:0px;
		border-top-left-radius:0px;
	}

	#footer {
		width:98%;
		padding:0px 0px;
	}

	#footer p {
		text-indent:20px;  /* spazio a Sx*/
		font-size:16px;
	}

	#nav li a,
	#nav li#active {
		height:27px;
		text-align: left;
		margin:0;
		padding:0;
		text-indent:10px;
		-webkit-border-radius:0px;
		-moz-border-radius:0px;
		border-radius:0px;
	}
	#nav li a,
	#nav li a,
	#nav li#active {
		padding:0;
	}

	#nav li#active,
	#nav li a {
		-webkit-border-top-right-radius:0px;
		-webkit-border-top-left-radius:0px;
		-moz-border-radius-topright:0px;
		-moz-border-radius-topleft:0px;
		border-top-right-radius:0px;
		border-top-left-radius:0px;
	}
	#nav li:first-child a,
	#nav li#active:first-child  {
		-webkit-border-top-right-radius:5px;
		-webkit-border-top-left-radius:5px;
		-moz-border-radius-topright:5px;
		-moz-border-radius-topleft:5px;
		border-top-right-radius:5px;
		border-top-left-radius:5px;
	}

	div#content  {
		width:98%;
		float:left;	
		margin-left:5px;
		padding-left:3px;

		background-color: rgba(211,211,211,0.4);
		-webkit-border-bottom-right-radius:5px;
		-webkit-border-bottom-left-radius:5px;
		-moz-border-radius-bottomright:5px;
		-moz-border-radius-bottomleft:5px;
		border-bottom-right-radius:5px;
		border-bottom-left-radius:5px;
	}
	
	
	div#colSX  {
		width: 98%;
		float: left;
		margin-left: 5px;
		padding-left: 3px;
		background-color: rgba(211,211,211,0.4);	
		-webkit-border-bottom-right-radius:5px;
		-webkit-border-bottom-left-radius:5px;
		-moz-border-radius-bottomright:5px;
		-moz-border-radius-bottomleft:5px;
		border-bottom-right-radius:5px;
		border-bottom-left-radius:5px;
}
	
	div#colCentrale  {
		width:98%;	
		float:left;
		margin-left:5px;
		padding-left:5px;
		background-color: rgba(211,211,211,0.4);		
		-webkit-border-bottom-right-radius:5px;
		-webkit-border-bottom-left-radius:5px;
		-moz-border-radius-bottomright:5px;
		-moz-border-radius-bottomleft:5px;
		border-bottom-right-radius:5px;
		border-bottom-left-radius:5px;
	}
}




/*   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%;
	}
}
*/