/* DATEI: atelier-nennmann.css  update: 2016-12-30 */

html { width:auto; height:100%; margin:0; background-color:#EAEAEA; border:0; padding: 0;}

body {margin:0; padding:0 ; width:auto; height:100%; }

h1,h2,h3,h4,p,ul,ol,li,div,td,th,address,blockquote,nobr,b,i {
 font-family:Arial; color:#383838; }

h1 { font-size:36px; font-weight:bolder; text-align:center; text-decoration:none; }

h2 { font-size:26px; margin-bottom:18px; margin-left:5px; text-align:center; }

h3 { font-size:20px; margin-bottom:8px; margin-top:14px; margin-left:25px; text-align:center; }

h5 {font-size:36px; font-weight:bolder; text-align:center; text-decoration:none; }

/*h4 { font-size:14px; margin-bottom:8px; margin-top:14px; margin-left:5px; text-decoration:underline; }*/

p { font-size:14px; text-align:center; margin-bottom:10px; margin-left:10px; margin-top:10px; margin-right:10px; }

/*p.k { font-size:16px; text-align:left; font-style:italic; }

p.l { font-size:16px; margin-left:10px; text-align:left; } */

table {width: 100%; padding-bottom: 10px;}

td,li { font-size:14px; }
td {padding: 0.3em; }

li { margin-left:5px; }

tr:nth-child(even) {
  background-color: #BFBFBF;
}

tr:nth-child(odd) {
  background-color: #EAEAEA;
}
tr.mark {background-color: #FFBE44; vertical-align: top; height: 0.2em;}

iframe {margin: 0; padding: 0; }

noscript {margin: 10px; border: 2px dotted red; padding: 10px;}

a:link { color:#000000; text-decoration:underline; font-weight:bold;  }
a:visited { color:#000000; text-decoration:none; font-weight:bold; background-color:#F7F7F7; }
a:hover { color:#000000; text-decoration:underline; background-color:#F7f7f7; font-weight:bold; }
a:active { color:#f7f7f7; background-color:#000000; text-decoration:none; font-weight:bold; }

.osm { width: 100%; max-width: 400px; padding: 0;}

.footer {opacity: 0.8;}

.flex-container-row {
  display: flex; /* or inline-flex */
  display: -webkit-flex;
  flex-direction: row; 
  margin: 10px 2%;
  border: 0;
}
.flex-container-1 {
  display: flex; /* or inline-flex */
  display: -webkit-flex;
  flex-direction: column;
  margin: 0;
  border: 0;
  padding: 0;
}
.flex-container-2 {
 		display: flex; /* or inline-flex */
 		display: -webkit-flex;
 		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		align-content: center;
 		position: static;
 		border:0 ;
	}
.flex-item1 {
  flex: 1;
  margin: auto;
  border: 0;
  padding:5px;
}

.flex-item2 {
  flex: 1;
  margin: auto;
  padding:0;
}

.div-center{ display: flex;
  align-items: center;
  justify-content: center;
}

.galerietip {display: none;}

#nav-toggle {
		display: inline;
		position: fixed;
		z-index: 20;
		top: 20px;
		right: 0;
		opacity: 0.8;
		background-color: white;
		border: 1px solid white;
		border-radius: 5px 0 0 5px;
		box-shadow: 0 0 15px 5px black;
		padding: 5px ;
		font-size: 1.5em;
		font-weight: bold;
	}
#nav-toggle a {
		text-decoration: none;
}
#Menu {
  display: none;
  position: fixed;
  top: 55px;
  right: 0;
  width: 180px;
  z-index: 10;
  opacity: 0.9;
}
#Menu div.flex-container-1 {
	display: flex; /* or inline-flex */
  display: -webkit-flex;
  flex-wrap: nowrap;
  flex-direction: column;
  flex-wrap: nowrap;
  margin:0;
  background-color:none;
  padding:0;
}
#Menu div.flex-container-1 div {
	flex: 1;
  margin: 0 auto;
  width: 100%;
  background-color:#F7F7F7;
  border: 1px solid none;
  border-radius: 2px;
  box-shadow: none;
  transition: box-shadow 1s;
  padding: 5px 2px;
  text-align: center;
}

#Menu h3 {margin: 0;}
#Menu .aktiv {
font-style: italic; text-decoration:none; transition: none;
}
#Menu div.flex-container-1 div:hover {box-shadow: inset 0 0 5px orange;}
#Menu div.flex-container-1 div.aktiv:hover { box-shadow: none;}

#imagelightbox
{
    position: fixed;
    z-index: 9999;
    
    border: 10px solid white;
    box-shadow: 0 0 30px 10px black;
 
    
}

#Kontakt div.flex-item1 {padding: 10px;}
#Kontakt img { margin: 0; border: 3px solid #4D4D4D; border-radius: 3px; box-shadow: 12px 8px 25px 5px #9D9A9A;}

#Adresse { margin:0;  font-size: 1.2em; padding: 0; border: 0;}
#Adresse li {  list-style-type: none; font-size: 1.0em; }
#vita-text li { margin: 0 0 10px; list-style-type: none;  }

#indexpic { display:block; position:relative; margin: 0 auto; padding: 0; max-width: 800px; height: auto; }
#indexpic img {width:100%; height:auto; display:block;}

#accordion h1 {transition: text-shadow 1s;}
#accordion h1 > p {transition: none; text-shadow: none;}
#accordion h1:hover {text-shadow: 0 0 10px orange;}
#accordion h1:hover > p {text-shadow: none;}

/* viewport-Breite von min 340px wird benötigt um den Film anzeigen zu können! */
/* Tabletts und größer */
@media only screen and (min-width: 763px) {
	body {
		margin: 0 auto;
		max-width: 1100px;
		padding: 0 5%;
	}
	table {width: 84%;}
	.section { position: relative; margin-top: 20px;}
	.footer {margin-top: 20px;}
	
	.flex-container-1 {
 		display: flex; /* or inline-flex */
 		display: -webkit-flex;
 		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: center;
		align-content: center;
 		position: static;
 		border:0 ;
	}

	.flex-item1 {
		flex-grow: 1;
		flex-basis: auto;
  		padding: 20px;
  		border: 0;
	}
	.flex-item1 img {display: block; margin: auto;}	
	
	.flex-item2 {padding: 20px;}
	
	.galerietip {
		display: inline;
		position: relative;
		top: 0;
		margin-left: 5px;
	}
	a.galerietip:hover {background-color: #EAEAEA; }
	
	#nav-toggle {
		display: none;
	}
	#Menu {
		display: inline;
		position: relative;
		top:0;
 		margin: 0 auto;
 		height: 20px;
 		width: auto;
 	}
 	#Menu div.flex-container-1 {
 		display: flex; /* or inline-flex */
 		display: -webkit-flex;
 		flex-direction: row;
 		border: 0;
	}
	#Menu div.flex-container-1 div {
		padding: 10px;
		border: 0;
 		box-shadow: none;
	}
}