@charset "utf-8";
/* CSS Document by Pit Bergmann -Webdesign  */

q:lang(de) {
quotes: "»" "«";}
#burger{display:none;}
body {padding: 0;  margin:0; 
background-color:#fff;
font-family: Verdana, Arial, Helvetica, sans-serif;}

header{margin:0; padding:0;}
#header{width: 100%; min-height:150px; background-color:#009; margin-top:-30px; padding:0; margin-left:0; margin-right:0;}
#wrapper{ margin: 0 auto 0 auto; width:90%;}
.text {width: 70%; margin: 0 auto;}

p, h1, h2, h3 {color:#000;}
.heading{ color:#FF0; font-size:3em; padding-top:20px;  }
p{font-size: 0.9em;}
h1 { font-size:1.5em;}
h2{ font-size:1.2em;}
h3{ font-size:1em; color:#666;}
#oben{ font-size:2em;}
.implink {font-size: 0.75em; color:#fff; text-decoration:none; margin-left:1%; margin-top:40px; display:none;}
 .implink:hover{color:#FF0;} 
.italic{font-style:italic;}
a {color:#009; font-weight:bold;}
a:hover{color:#ccc;}

.thisside{color:#FF0;}
.link {font-size:1.25em; color:#fff; text-decoration:none; margin-left:1%;margin-top:1%;}
.klein{font-size:0.75em;}
.center {text-align: center;}
.bold {font-weight: bold;}
.wide{letter-spacing:0.5em;}
  

#fahne{float:left;  position:absolute; transform: rotate(10deg); margin-left:1%; margin-top:10px;}



.topspace {margin-top:60px;}

img {max-width:100%;
height:auto;
width:auto;}


nav ul li{float:left; margin-left:1em; margin-right:1em; list-style:none; color:#fff; font-size:0.9em;}
nav ul li a:hover{color:#FF0;}
nav ul li a {color:#fff; font-weight:bold; text-decoration:none;}

#diashow{margin: 0 auto 0 auto; width:90%;}




@media only screen and (max-width:1200px) {
img {
max-width:100%;
height:auto;
margin:0; padding:0;}


p{font-size:0.8em;}
h1{font-size:1.0em; text-align:center;}
		
h2 {font-size:1.2em;letter-spacing:0.2em;}
h3 { font-size:1em; color:#666;}
table{width:90%; font-size:0.70em;}
nav ul li{display:block; margin-left:1em; margin-right:1em; list-style:none; color:#000; font-size:1em; line-height:2.5em;}
#fahne{position:relative; clear:both; display:none;}
#header{width: 100%; min-height:250px; background-color:#009; margin-top:-30px; padding:0; margin-left:0; margin-right:0;}
.heading{display:block;}
nav ul li{ clear:both; display:block;}
.trenner{display:none;}



/*Burgertime:*/
nav.topmenu { 
    height: auto; 
	margin: 0 auto;
    max-height:0;
    overflow: hidden; 
    transition: all 2s;}
	
label.burger{ 
float: left;
display: block;
width:50px; height:45px;
position: relative; 
margin-left: auto;
margin-right: 5%;
border-radius: 4px;
margin-bottom: 20px;
margin-top: -20px;
cursor: pointer;}


input#burger {display:none;}

.line {position: absolute; 
   left:7px; height: 5px; width: 40px; 
   background:#FF0; 
   display: block; 
   transition: 0.5s; 
   transform-origin: center; 
    margin-right: 5%;}

.line:nth-child(1) { top: 12px; }
.line:nth-child(2) { top: 24px; }
.line:nth-child(3) { top: 36px; }

#burger:checked + .burger .line:nth-child(1){
   transform: translateY(12px) rotate(-45deg);}

#burger:checked + .burger .line:nth-child(2){
   opacity:0;}

#burger:checked + .burger .line:nth-child(3){
   transform: translateY(-12px) rotate(45deg);}


#burger:checked + .burger  + nav.topmenu { 
    max-height: 500px;}

nav .topmenu a {text-decoration:none; color:#fff; font-size:1.5em;}
.clear{clear:both;}  
.pos {margin: 0 auto 0 auto;}
.implink{display:block;}
.lastlink{padding-bottom:30px;}

}


/*diashow*/


.rahmen{box-shadow: 10px 10px 10px silver;}


#dias {position:relative; 
  height: 600px; 
  padding: 10px; }

#dias > div { 
    position: absolute; 
    top: 25px; 
    left: 1%; 
    right: 1%;  
    bottom: 1%; }


.mini {font-size:0.70em; text-align:center;}
.minifont{font-size:0.70em; }

/*Galerie*/

 .thumb{height: 250px;
  object-fit: cover;
  width: 350px;}
.galerie {margin: 0 auto; text-align:center;} 

.galerielink {color:#00C; text-decoration:none; font-weight:bold;}
.galerielink a:hover {color:#FC6;}



  hr {width: 60%;margin-left: auto;margin-right: auto; height:0.5px;}
  
 #wetter{ margin: 0 auto; text-align:center; width:300px; }

.button{position:absolute; right:3%; top:2%; transform: rotate(15deg);}
#portrait {float:right; margin-left:2%; margin-top:2%; margin-bottom:2%; max-width:100%;
height:auto; box-shadow: 10px 10px 10px silver;}

@media only screen and (max-width:500px) {
#portrait { float:none;}