﻿
body
{	
	font-size:100%; 
	margin:0px 0px 0px 0px;
	padding: 0px;
	width: 80%;
	height:auto;
    
	background-color:#FFFFFF;
	font-family: Ebrima;
 /*  background-image:url('images neu/test3.jpg')*/
}

img 
{
	width:100%;
	height:auto;
	max-width:100%;
	
	/*  margin-left:100px;
	float:left*/
	}

/* Hamburger */

@import url('https://fonts.googleapis.com/css2?family=Cabin&display=swap');

/*  body {
  padding: 0px;
  margin: 0px;
  font-size: 20px;
  min-height: 200vh;
  font-family: 'Cabin', Sans-serif;
}*/

.overlay{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s, visibility .35s, height .35s;
    overflow: hidden;
    background:#;
    z-index: -1;
}

#main-menu {
  display: block;
  height: 100px;
  width: 100%;
  background:#FFFFFF;
  margin: 0px;  
  z-index: 9;
}

#main-menu ul {
  max-width: 800px;
  width: 100%;
  height: 100%;
  margin: 0px auto;
  padding: 0px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  z-index: 9;
}

#main-menu li {
  list-style-type: none;
  font-size: 2em;
}

#main-menu a {
  color:#FFFFFF;
  font-size: 1.2em;
  text-decoration: none;
}

#main-menu a:hover {
  text-decoration: underline;
}

#hamburger-input{
  display: none;
}

#hamburger-menu {
    position: fixed;
    top: 40px;
    left: 25px;
    width: 20px;
    height: 20px;
    display: none;
    border: none;
    padding: 0px;
    margin: 0px;
    font-family: 'Ebrima', Sans-serif;
    background: linear-gradient(
      to bottom, 
      #3D0E61, #3D0E61 20%, 
      white 20%, white 40%, 
      #3D0E61 40%, #3D0E61 60%, 
      white 60%, white 80%, 
      #3D0E61 80%, #3D0E61 100%
    );
}

#hamburger-menu #menubar {
    visibilty: hidden;
    position:fixed;
    top: 0;
    left: -250px;
    width: 200px;
    height: 100%;
    background-color:gray;
    transition: 0.3s;
    padding: 0px 10px;
    box-sizing: border-box;
    
    
}

#hamburger-menu h3 {
  color: #B9FAF8;
  font-size: 2.2em;
}

#hamburger-menu ul {
  padding-left: 25px;
}

#hamburger-menu li {
  list-style-type: none;
  line-height: 3em;
}

#hamburger-menu a {
  color:#FFFFFF;
  font-size: 1.2em;
  text-decoration: none;
  text-align:center;
  letter-spacing:2px
}

#hamburger-menu a:hover {
  text-decoration: underline;
}

#hamburger-input:checked + #hamburger-menu #menubar {
    visibility: visible;
    left: 0;
}
#hamburger-input:checked ~ .overlay{
   visibility: visible;
  opacity: 0.4;
}


@media screen and (max-width: 750px) {
  #main-menu {
    display: none;
  }
  #hamburger-menu {
    display: inline;
  }
}

	
/* on top bar */
   /* #button
{
	display:inline;
 	float:left;
 	margin-left:25px;
 	height:40px;
 
 }
 
#button ul
{
background:#;
height:auto;
width:auto;
padding-top:0px;
margin-top:0px


}

#button ul li 
{
display:block;
margin-right:25px;
width:auto;
text-decoration:none;
margin-top:7px



}

#button ul li a.menubutton 
{
display:none;
margin-top:0px
}
 */


		

 
 
 #menu 
{
	display:block;
	
	background:#FFFF99;
	width:auto;
	height:60px;
	margin-left:25px;
	margin-top:0px
	
}

#menu ul
{
display:block;
text-align:center;
padding-top:5px;


}


#menu ul li
{
display:inline;
font-family:Ebrima;
font-size:1.1em;
text-decoration:none;
/*  background-color:gray;
width:200px;*/
letter-spacing:3px;

}

#menu ul li a
{
font-family:Ebrima;
background:#;
margin:0px 50px  0px 0px;
height:25px;
padding:5px;
float:left
}


#menu ul li a:hover
{
background:#;
/* text-decoration:underline;*/
 border-bottom:    thin   black  solid  ;
}

.Bild
{
margin-left:25px;
margin-top:0px;
height:auto;
width:auto
}



div.logo
{	
  
	display:block;
	
	float:right;	
	height:38px;
	width:auto;
	background-color:#;
 	text-align:right;
	margin-right:0px;
	margin-top:0px;
    padding-bottom: 0px;
	margin-left: 0px;
    
}
  /*
  
.nav li ul li{	
	float:left;
	display:inline
}


  div #slideShowWrapper
{	
	margin:0px auto 0 240px;
	padding: 40px 0px 0px 0px;
	width:1000px;
	height:580px;
	display:block;			
	position:relative;
	float:left;
	  background-color:#f3f3f3;
}*/

/*  div.Abstandeins
{
	position:relative;
	display: block;
	height:100px;
	float:left;
	width:1980px;
	background-color:#;
}}
p.Abstand
{
 background-color:#;
 width:1920px;
 float:left;
 height:200px	}*/

div.kastenoben
{

	background-color:#;
	display:block;
	/*  filter:alpha(opacity=50);*/
	/* opacity:0.5; */
	
 	float:left;
	position:relative;
	margin:30px 0px 0px 0px;
	width:auto;
	/*height:250px;
	margin-top:0px
	   z-index:1;*/
}

.architektur{
	display:block;
}

p{
	font-family:"Ebrima";
	font-size:16px;
	color:#333333;		
	float:left;
	width:350px;	
	padding-left:50px;
	padding-top:0px;	
}




/*  h1{
	font-size:17px;
	
	
float:left;
	  margin-top:0px;
	background-color:#FFFFFF;
	width:320px;
	height:25px;
	padding:px 0px 0px 0px;
	  margin-left:140px;
	  
	}

;
	font-size:16px;
	color:#333333;		
	float:left;
	width:350px;	
	padding-left:50px;
	padding-top:0px;	
}*/




/*  h1{
	font-size:17px;
	
	
float:left;
	  margin-top:0px;
	background-color:#FFFFFF;
	width:320px;
	height:25px;
	padding:px 0px 0px 0px;
	  margin-left:140px;
	  
	}*/

button.push
{
	width:300px;	
	height:40px;
 	background-color:#FFFFFF;
 	opacity:0.5;
 	margin-left:25px;
	float:left;
	border:thin black solid;
	cursor: pointer;
    outline-offset: 4px;
    transition: filter 250ms;   
}

  .push:hover
{
	border:thin
	red
	solid;
}

a{
	text-decoration:none
}



  strong{

font-size:16px;
font-weight:normal;

	color:#0099FF;
	
	}
button:hover
{
	color:red
}

div.kastenunten {
	display:block;
	background-color:#;
	float:left;
	
	margin:0px 0px 0px 0px;
	width:auto;
	/*height:250px; opacity:0.5;*/	
}

/*  h2{
	font-size:15px;
	margin-left:0px;
	float:left;
	margin-top:0px;
	background-color:#FFFFFF;
	width:320px;
	height:25px;
	padding:5px 0px 0px 20px;
	border:thin
	black
	solid	
}*/


p{	
	font-family:"Ebrima";
	color:#333333;
	font-size:16px;	
	float:left;
	width:auto;
	padding-left:25px;
	padding:0px;
}

span{
	color:#FD5200;
	font-size:16px;
	font-weight:normal;
}

div.kastenganzunten
{
display:block;
	background-color:#;
	float:left; 
 /*  position:absolute;*/
	margin:0px 0px 0px 0px;
	 width:auto;
	/*height:150px;   opacity:0.5;*/	
	}
	
span{
	color:#FD5200;
	font-size:16px;
font-weight:normal;
}
	
	
p{
	font-family:"Ebrima";
	font-size:16px;
	color:#333333;		
	float:left;
	width:auto;	
	padding-left:25px;
	padding-top:0px;	
}


  strong{

font-size:16px;
font-weight:normal;

	color:#0099FF;
	
	}

/*  p {
	
	font-size:14px;
	text-align:left;
	font-weight:normal;
	margin:0px 0 0 140;
	color:black;
	width:650px;
	height:50px	
} */

div.Abstand{
	position:relative;
	display: block;
	height:25px;
	float:left;
	 width:1940px;
	background-color:#FFFFFF;
	margin-top:0em
		
}

/* Fusszeile*/ 
div.Fuss{
	display:block;
	height:20px;
	width:1850px;
	background-color:#FFFF66;
		position:relative;
	
	
	margin-top:0px	;
	margin-left:px;
	float:left;
	/*  border-top:1px silver solid;
	opacity: 50	*/	
}

p.Fusszeile{	
	/*  float:left;*/
	text-align:left;
	color:black;
	margin:0px 0px 0px 10px; 
	padding-left:25px;
	width:200px;
	font-size:11px;
	height:40px;
	font-weight: normal		 
}

div.Impressum{
	display:block;
	position:relative;
	margin-top:0px;
	width:1850px;
	float:left;
	height:40px;
	background-color:#FFFF66;
	 font-family:Arial, Helvetica, sans-serif;
	/*   border-top:1px silver solid*/
}

 .Imp li 
{
	float:left;
	list-style-type:none;
	text-align:left	 	 	
	 }
 
	 
.Imp li  a{	
	font-size:12px;
	text-decoration:none;
	color:black;
		 	
	 }
 .Imp li a:hover{
	  font-weight:bold 	
	 }
	 
	 
	 /* mobile Style */

@media screen and (min-width:900px) {
#menu {
	display:block !important;}
}



@media screen and (max-width:900px) {
	
	#button ul li a.menubutton 
{
display:block;
}
#menu
{
	display:block;
	height:auto;
	}

div.logo
	{background-color:#FFFFFF;
}
#menu ul li
{
display:none;
margin: 10px 0 10px 0;
} 

}





