@charset "UTF-8";
/* CSS Document */
@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans/opensans-regular-webfont.eot');
    src: url('fonts/OpenSans/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans/opensans-regular-webfont.woff2') format('woff2'),
         url('fonts/OpenSans/opensans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans/opensans-bold-webfont.eot');
    src: url('fonts/OpenSans/opensans-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans/opensans-bold-webfont.woff2') format('woff2'),
         url('fonts/OpenSans/opensans-bold-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Fjalla One';
    src: url('fonts/FjallaOne/fjallaone-regular-webfont.woff2') format('woff2'),
         url('fonts/FjallaOne/fjallaone-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

*{margin:0; padding:0}
img{border: none;}
html{height:100%;}
body{height:100.1%; font-family:"Open Sans", sans-serif;}
#bgdiv{	
	position:fixed; 
	top:0; left:0;
    z-index:-1;  
	background-image: url("bilder/hg-baum.jpg"); 
	background-size: cover; 
	background-position: center top;
	width:100%; height:100%;
}

#hg img{width:100%; height:auto;}
a{text-decoration: none;}
#wrapper{width:100%; min-height:95%; max-width:800px; margin:auto; position:relative; overflow: hidden;}
#bgdiv{}
#header{
	margin-top:50px;
	text-align:center;
	background: rgba(255,255,255, 0.65);
	padding: 30px 0 32px;
}
#navi{
	margin-top:16px;
	background: rgba(255,255,255, 0.80);
}
#navi ul {padding:10px 0 ; text-align:center;}
#navi li{display:inline-block; list-style:none; margin: 0 6%;}
#navi li + li{}

#content_1, #content_2{
	margin-top:16px;
	clear:left;
	background: rgba(255,255,255, 0.90);
	padding:30px 7% 30px 7%;
	margin-bottom:20px;
}
@media screen AND (max-width:800px){
	#navi li{margin:0 5%;}
}
@media screen AND (max-width:660px){
	#navi li{margin:0 4%;}
}
@media screen AND (max-width:600px){
	#header{	margin-top:20px;	 padding: 20px 0 22px;}
	#navi li{margin:0 3.5%;}
}
@media screen AND (max-width:480px){
	#header{	margin-top:0px;	}
	#navi ul {padding:10px 0 10px 3%;}
	#navi li {margin: 0 3%;}
	#content_1, #content_2 {padding:30px 3% 30px 3%;}
}
@media screen AND (max-width:440px){
	#navi ul {padding-top:4px;}	
	#navi li {margin: 6px 7% 0;}	
}

#navi a:link, #navi a:visited{
	font-size:16px;  line-height:16px;
	text-transform: uppercase;
	color:rgb(51,51,51);
}
#navi a:hover, #navi a.current{color:rgb(227,0,69);}

footer{width:100%; max-width:800px; margin:auto; position:relative; text-align:center; padding: 0 0 15px;}

#content_1{min-height:240px; -moz-hyphens:auto; -webkit-hyphens:auto; -ms-hyphens:auto; hyphens:auto; }
#content_1, #content_2{font-size:16px; line-height:24px;}
.home #content_1 {background: rgba(255,255,255, 0.80); height:290px;}
h1{color:rgb(227,0,69); font-size:70px; font-weight:normal; font-family:"Fjalla One", sans-serif;
text-shadow: 3px 3px 5px #777777;}
h2{color:rgb(51,51,51); font-size:20px; font-weight:400; margin-top:5px;}
h3{color:rgb(227,0,69); font-size:24px; font-weight:400; margin-top:10px; margin-bottom:20px;}
h4{color:rgb(227,0,69); font-size:20px; font-weight:400; margin-top:30px;}
p{ margin-top:14px;}
#content_1 a:link, #content_2 a:link, #content_1 a:visited, #content_2 a:visited, strong{font-weight:600; color:rgb(51,51,51);}
#content_1 a:hover, #content_2 a:hover{color:rgb(227,0,69);}
@media screen AND (max-width:600px){
	h1{font-size:54px; }
	h2{font-size:18px; }
}
@media screen AND (max-width:480px){
	h1{font-size:36px; }
	h2{font-size:16px; }
	.home #content_1 {height:200px;}
}
footer, footer a{color:#fff; font-size:14px;}