
/*															*/
/*															*/
/*						Allgemein							*/
/*															*/
/*															*/

	.displaynone {
		display:none;
	}	

	.undurchsichtig {
		opacity:1.0;
		
	}
	.hervorheben {
		color: red;
	}
	
	.aus {
    color: #444;
    text-shadow: 1px 1px 1px #fff;
    cursor: pointer;
}

.aus:before {
    content: '»';
    padding: 0 10px;
}

.aus:hover,
.aus:focus {
    color: #444;
    text-decoration: none;
}

.ein {
    color: #111;
}

.ein:before {
    content: '-';
    padding: 0 12px;
}

.accordion {
    width: 90%;
	margin: 10px auto;
	/*padding-left: 20px;*/
    border-radius: 10px;
    /*border: 1px solid #555;
    background: #fff;*/
}


/* 	ENDE ACCORDION  */


	.redborder{
		border: solid 2px red;

	}
	
	p, li {
		color: rgb(0, 51, 153);
	}
	p.padding25px {
		padding-left: 25px;
	}
	* {
		margin: 0;
		padding: 0;
		font-family: Arial, sans-serif;
	}

	
	header {
		/*background-image:  url(bilder/LogoMVAu_aktuell_klein.jpg), url(bilder/wappen-au-iller.gif);*/
		 background-image:  url(bilder/logo.gif), url(bilder/wappen-au-iller.gif); 
		background-repeat: no-repeat, no-repeat;
		background-position: 0px, 740px;
		background-size: 160px 155px, 135px 150px;
		height: 151px;
		width: 900px;
		margin: 10px auto;
	 }

	header p{
		text-align: right;
		padding-right: 170px;
		color: white;
	}	

	header a {
		color: white;
	}

	body {
		text-align: center;
		background-image: url(bilder/luftbild_au.jpg);
		background-attachment: fixed;
		font-family: Arial, sans-serif;
	}

	header, footer, aside, section {
		display:block;
	}

	#wrapper {
		width: 900px;
		margin: 0 auto;
		text-align: left;
		background-image: url(bilder/durchsichtig1.png);
		background-size: 100% auto; 
	}

	#logotext {
		padding-top: 40px;
		font-size: 20pt;
		color: #dd9661;
	}

	#impressum { cursor: pointer }

	h1 {
		color: red;
	}

	#nav-menue {
		width: 900px;
		display: block;
		height: 36px;
		margin: 0 auto;
		overflow: hidden;

	}
	#nav-menue .icon {
	  display: none;
	}

	#steuerungoben {
		display: block;
		float: right;
		margin-right: 25px;
	}
	
.navbar {
	overflow: hidden;
	background-color: gray;
	}

	
.navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 0.5em;
  text-decoration: none;
  font-size: 16px;
}

#steuerungoben a:hover {
	color: black;
	background: orange;
	}
	
.icon {
	font-size:15px;
}
.calendericon {
	width:16px;
	height:16px;
	
}
.dropdown {
    float: left;
    overflow: hidden;
}

.dropdown .dropbtn {
    font-size: 16px;    
    border: none;
    outline: none;
    color: white;
    padding: 0.5em;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: gray;
    min-width: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    float: none;
    color: white;
    padding: .3em;
    text-decoration: none;
    display: block;
    text-align: left;
}

.navbar a:hover, .dropdown:hover .dropbtn {
    background-color: orange;
    color: white;
}

.dropdown-content a:hover {
    background-color: orange;
    color: white;
}

.dropdown:hover .dropdown-content {
    display: block;
}
	


	.zwischenUeberschrift {
		font-weight: bold;
		padding-top: 10px;
	}

	.menue-button {
		display: none;
	}		
	
		
		
	#alle_termine {
		font-size: 8pt;
	}


	aside {
		width: 247px;
		float: right;
		background-color: LightSlateGray;
		opacity: 1;
	
	}
	
	aside img {
		border:1px solid silver;
		opacity:1;
	}
	aside p {
		margin-top: 20px;
		margin-left: 20px;
		color: white;
	}

	aside li, #pFacebook{
		color: white;
		margin-left: 20px;
		list-style-type:none;
		font-size: 10pt;
		text-decoration: none;
	}
	aside  a{
		color: white;
		font-size: 10pt;
		text-decoration: underline;
		
	}	
	.link, .lnk:hover{
		text-decoration: underline;
		color: blue;
		
	}
	#imgfacebook {
		width: 20px; 
		height: 20px;
	}
	aside li:hover {
		background-color: orange;
	}


	section {
		margin-left: 20px;
		margin-right: 250px;
	}
	section h1 {
		padding-top: 20px;
		padding-bottom: 0.4em;
		color: #dd9661;
	}
	section p, li  {
		padding-left: 1em;
		font-size: 1em;
	}
	section p  {
		margin-right: 10px;
	}
	section h2 {
		color: #dd9661;
		padding-top: 1em;
		padding-bottom:0.61em;
	}
	section h3 {
		color: #dd9661;
		/*padding-left: 15px;*/
		padding-top: 0.5em;
		padding-bottom:0.2em;
		text-decoration:underline;
	}

	section h4 {
		color: #dd9661;
		margin-top: 0em;
		padding-top: 10px;
		padding-bottom: 10px;
	}


	section ul {
		padding-left: 3em;
	}
	
	footer {
		/* background-color: brown; */
		background-image: url(bilder/grau-50.png);
		color: white;
		text-align: center;
		clear: both;
	}	

	footer p {
		/* background-color: brown; */
		color: white;
		text-align: center;
	}	

	
	#floetennamen {
		display: block;
		margin-left: 20px; 
	}

	.back-to-top {
		 /*border: solid 2px orange;*/
		 position: fixed;
		 width: 20px;
		 height: 20px;
		 bottom:20px;
		 right:20px;
		 border-radius: 50%;
		 padding:0.5em;
		 text-decoration: none;
		 color: white;
		 background-color: orange;
		 opacity: 0.8;
	}
	#imgautreffen {
		display: block;
		width: 590px; 
		height: 833px;
		margin: 0px auto;
		margin-bottom: 20px;
		}
	#imgfruehlingsfest, #imghomefruehlingsfest {
		display: block;
		width: 400px; 
		height: 562px;
/* 		width: 590px; 
		height: 829px; */
		margin: 0px auto;
		margin-bottom: 20px;
		}
	/* #imgausschuss	{
		display: block;
		width: 590px; 
		height: 396px;
		margin: 0px auto;
		margin-bottom: 20px;
		} */
	#imgtagderblasmusik {
		display: block;
		width: 590px; 
		height: 443px;
		margin: 0px auto;
		margin-bottom: 20px;		
	}
	#imgfroehlicherfeierabend {
		display: block;
		width: 617px; 
		height: 463px;
		margin: 0px auto;
		margin-bottom: 20px;		
	}
	
	#imgbestuhlungsplan {
		display: block;
		width: 590px; 
		height: 915px;
		margin: 0px auto;
		}	

	#imgoktoberfest {
		display: block;
		width: 590px; 
		height: 421px; 
		margin: 0px auto;
	}

	/* #imgjahreskonzert {
		display: block;
		width: 590px; 
		height: 833px; 
		margin: 0px auto;
	} */
	#imgjahreskonzert, #imgjubilaeum2026 {
		display: block;
		width: 300px; 
		height: 423px; 
		margin: 0px auto;
	}
		
	#imgTanja {
		
		display: block;
		width: 98%; 
		height: 100%; 
		margin: 0px auto;
		opacity: 1;
	}
	
	.linksUeberschrift {
		padding-top: 15px;
		padding-bottom: 15px;
		padding-left: 30px;
		font-weight: bold;
	}
	
	.linksUeberschrift li{
		font-weight: normal;
		list-style: circle;
	}	
	.linksUeberschrift a{
		margin-top: 5px;
		text-decoration: none;
	}	
	.linksUeberschrift a:hover{
		background-color: orange;
	}

	#divfruehlingsfest div{
		float: left;  
		margin-bottom: 10px;
		position: relative; 
		text-align: left;
	}
	.emailreitespalte1{
		width: 35%;
		/*border: solid red 2px;*/
	}
	

	
/*															*/
/*															*/
/*						Handy								*/
/*															*/
/*															*/

@media only screen and ( max-width: 440px ) {
    /* mobile Geräte */


  .navbar, .dropdown .dropbtn , .navdiv{
	  display: none;
 
	 }
	 
/*  .navbar a.icon {*/
	#steuerungoben.responsive {
		display: block;
		margin: 0;
		width: 100%;
	/*margin-right: 125px;*/
		}



	#nav-menue{
		height:0px;
	}
	#nav-menue a.icon {
    float: right;
    display: block;
	padding: 0.5em;
	color: white;
	text-decoration: none;
	background-color: darkblue;
	position: absolute;
	right: 0;
	top: 0;
	cursor: pointer;
	z-index: 1;

 }
	#nav-menue.responsive {
    display: block;
	width: 100%;
	height: auto;
	float: none;

  }  
  
  	#nav-menue > a:hover {
		background-color: orange;
		color: white;
	}
	
	
	.TextWeisenblaeser{
			font-size: 0.7em;
		}
	#logotext {
		padding-top: 10px;
		font-size: 10pt;
		color: #dd9661;
	}

	#tblMails, #divimpressumtext{
		font-size: 0.75em;
	}
	.emailreitespalte1{
		width: 30%;
		/*border: solid red 2px;*/
	}

	h1 {
		font-size: 14pt;
	}		
	h2 {
		font-size: 12pt;
	}	
	
	h3 {
		font-size: 10pt;
	}		
	h4 {
		font-size: 8pt;
	}	
	header p {
		font-size: 8pt;
		padding-left: 5px;
		color: white;
		text-align: left;
		padding-right: 0px;
	}
	aside {
		display: none;
	}
	header {
		background-size: 0 0;
		height: 70px;
		margin: 5px auto;
	}	
	body, header, #wrapper {
		display: block;
		width: 100%;
		float: left;

	}
	
	section {
		margin-left: 20px;
		margin-right: 10px;
		
		}
	
	#wrapper {
		background-image: url(bilder/durchsichtig0.png);		
		background-size: 100% auto; 
		
	}

/*	
	#nav-menue {
		height: auto;
		overflow: hidden;
	}
*/

	/*
	 .menue-button {
		display: block;
	}

	.menue-button {
		background-color: darkblue;
		display: block;
		position: absolute;
		right: 0;
		top: 0;
		padding: 0.5em;
		color: white;
		cursor: pointer;
		text-decoration: none;
	}	
	
	.menue-button:hover {
		color: black;
		background: orange;
	}	
*/

	section img :not(.thumbnail) {
		display: block;
		width: 300px;
		height: 200px;
		margin: 0 auto;
	
	}

	 #imgBenedikt {
		display: block;
		width: 100%;
		height: auto;
		margin: 0 auto;
		/*margin-right: 10px;
		float: left;*/
		}
	
	#imgHans {
		display: block;
		width: 100%;
		height: auto;
		margin: 0 auto;
		
		}		
	
	#imgfruehlingsfest, #imghomefruehlingsfest {
		display: block;
		width: 300px; 
		height: 421px;
		margin: 10px auto;
		}
	#imgautreffen {
		display: block;
		width: 300px; 
		height: 423px;
		margin: 0px auto;
		}
	#imgtagderblasmusik, #imgfroehlicherfeierabend {
		display: block;
		width: 300px; 
		height: 225px;
		margin: 10px auto;
		}
	#imgoktoberfest {
		display: block;
		width: 300px; 
		height: 214px; 
		margin: 0px auto;
	}	
	
	#imgjahreskonzert, #imgjubilaeum2026 {
		display: block;
		width: 300px; 
		height: 421px; 
		margin: 0px auto;
	}
			
	#imgbestuhlungsplan {
		display: block;
		width: 300px; 
		height: 467px;
		margin: 0px auto;
		}		


	div .register  {
		margin-top: 10px;
		margin-left: 10px;
		clear: both;
		
		
	}
	div .register  h4{
		margin-top: 10px;
		margin-bottom: 10px;
	}

	div .register  div{
		float: left;
		display: none;
	}
	div .register  p{
		/*margin-top: 20px;*/
		font-size: 8pt;

	}
	.unterstrichen {
		text-decoration: underline;
	}

	div .register ul {
		list-style-type: none;
		}

	div .register li{
		margin-left: -20px;
		margin-top: 5px;
		}

	.clear {
		clear: both;
	}
	.margintop10 {
		margin-top: 10px;
	}
	.bild_unterschrift {
		text-decoration: none;
		margin-left: 5px;
		width: auto;
		}
	footer {
		font-size: 0.6em;
	}
	section p, li {
		font-size: 0.8em;
	
	}	
}	
	
	
@media only screen and (max-width: 440px) {
  .navbar.responsive {
	  position: relative;
	  display: block;  /* jetzt wird das Menü angezeigt*/
	  margin: 0;
  }

  /*  .navbar.responsive .icon {*/
/*  #nav.responsive .icon {*/
  #nav-menue.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
	z-index: 1;
  }

	
  /*.navbar.responsive a {*/
/*  #nav.responsive a {*/
  #nav-menue.responsive a {
    float: none;
    display: block;
    text-align: left;
	font-size: 12pt;
	height: auto;
  }
  .navbar.responsive .dropdown {float: none;}
  .navbar.responsive .dropdown-content {position: relative;}
  .navbar.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
	font-size: 12pt;
	
	
  }
}	
	
	
/*															*/
/*															*/
/*						PC									*/
/*															*/
/*															*/
	
	
@media only screen and ( min-width: 950px ) {
    /* breites Browserfenster */
 

	section img :not(.thumbnail){
		width: 600px;
		height: 400px;
		display: block;
		margin: 0 auto;
	}

	/* #nav-menue {
		position: sticky;
		top: 0;
	} */

	#imgBenedikt {
		display: block;
		width: 300px;
		height: 400px;
		margin-left: 30px;
		margin-right: 20px;
		float: left;
		}
	 #imgtabbs {
		display: block;
		width: 550px;
		height: 367px;
		margin: 10px 20px 10px 20px;	
	}
	
	
	
	#imgHans {
		display: block;
		width: 300px;
		height: 300px;
		margin-left: 30px;
		margin-right: 20px;
		float: left;
		}		
	

	div.register  {
		margin-top: 10px;
		clear: both;
	}
	div .register  h4{
		margin-top: 10px;
		margin-bottom: 10px;
		font-size: 15pt;
	}

	div .register  div{
		float: left;

	}
	div .register  p{
		font-size: 10pt;

	}
	.unterstrichen {
		text-decoration: underline;
	}

	div .register ul {
		list-style-type: none;
		}

	div .register li{
		margin-left: -20px;
		margin-top: 5px;
		}

	.clear {
		clear: both;
	}
	.margintop10 {
		margin-top: 10px;
	}	
	.margintop20 {
		margin-top: 20px;
	}
	.bild_unterschrift {
		text-decoration: none;
		margin-left: 25px;
		width: auto;
		}



	
	.lnk{
		text-decoration: underline;
	}
	
}



/*															*/
/*															*/
/*						Tablets								*/
/*															*/
/*															*/



@media only screen and ( min-width: 440px ) and ( max-width: 950px ) {
    /* Tablets und mittlere Bildschirme */
	aside {
		display: none;
	}
	
	body, header, #nav-menue, #wrapper {
		display: block;
		width: 100%;
		float: left;
	}

	header  {
		background-position: 10px, 98%;
		background-size:  80px 79px,80px 89px;
		height: 100px
	}
	#logotext {
		padding-top: 20px;
		font-size: 15pt;
	}
	header p{
		padding-right: 100px;
		color: white;
		font-size: 10pt;
	}
	#nav-menue {
		margin: 0 auto;
		height: auto;
		overflow: hidden;
		/* position: sticky; */
		/* top: 0; */
	}

	section {
		margin-left: 20px;
		margin-right: 20px;
		
		}
	
	#wrapper {
		background-image: url(bilder/durchsichtig0.png);		
		background-size: 100% auto; 
		
	}

	section img :not(.thumbnail){
		width: 600px;
		height: 400px;
		margin: 0 auto;
		display: block;
	}


	#imgBenedikt {
		display: block;
		width: 300px;
		height: 400px;
		margin-left: 30px;
		margin-right: 20px;
		float: left;
		}
	

	#imgHans {
		display: block;
		width: 300px;
		height: 300px;
		margin-left: 30px;
		margin-right: 20px;
		float: left;
		}	
	
	#imgfruehlingsfest, #imghomefruehlingsfest {
		display: block;
		width: 400px; 
		height: 562px;
		margin: 10px auto;
		}
	#imgtagderblasmusik, #imgfroehlicherfeierabend {
		display: block;
		width: 400px; 
		height: 300px;
		margin: 10px auto;
		}	

	#imgoktoberfest {
		display: block;
		width: 400px; 
		height: 285px; 
		margin: 0px auto;
	}
	
	#imgjahreskonzert {
		display: block;
		width: 400px; 
		height: 565px; 
		margin: 0px auto;
	}
	
	#imgbestuhlungsplan {
		display: block;
		width: 400px; 
		height: 621px;
		margin: 0px auto;
		
		}	
	#weisenblaseser{
		margin: 10px auto;
	}

	div.register  {
		margin-top: 10px;
		margin-left: 10px;
		clear: both;
		
	}
	div.register  h4{
		margin-top: 10px;
		margin-bottom: 10px;
		font-size: 15pt;
	}

	div.register  div{
		float: left;
	}
	div.register  p{
		font-size: 15pt;

	}
	.unterstrichen {
		text-decoration: underline;
	}

	div.register ul {
		list-style-type: none;
		}

	div.register li{
		margin-left: -20px;
		margin-top: 5px;
		}

	.clear {
		clear: both;
	}
	.margintop10 {
		margin-top: 10px;
	}
	.bild_unterschrift {
		text-decoration: none;
		margin-left: 5px;
		width: auto;
		font-size: 10pt;
		}
	
}

	.bild{
		width: 100%;
		height: auto;
	}
	
	.bild50Prozent{
		width: 50%;
		height: auto;
		display: block;
		margin-left: auto;
		margin-right: auto
	}