/**
* 1. Avoid the IE 10-11 `min-height` bug.
* 2. Set `flex-shrink` to `0` to prevent Chrome, Opera, and Safari from
* letting these items shrink to smaller than their contentŐs default
* minimum size.
* 3. Use `%` instead of `vh` since `vh` is buggy in older mobile Safari.
*/

*, *::before, *::after {
    -webkit-box-sizing: border-box; /* Safari/Chrome, andere WebKit-Browser */
    -moz-box-sizing: border-box; /* Firefox, andere Gecko-Browser */
    box-sizing: border-box; /* Opera/IE 8+ */
}

/* ----------------------------------------------------------------------------- *
 *                             Mobile First                                      *
 * ----------------------------------------------------------------------------- */

html {
	 margin: 0 auto;
     max-width: 1280px;
	 }

body 	{
		box-shadow: 7px 7px 7px #888, -4px -4px 7px #888;
		}
	
.grail-layout {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	height: 100%; /* 1, 3 */
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	}
	
.page-wrapper {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex: 1 0 auto;
	-ms-flex: 1 0 auto;
	flex: 1 0 auto; /* 2 */
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	/* padding: 1.5em; */
	}
	
header { display: block; margin-bottom: 1.5em; }
	
article {
	margin: 0;
	padding: 0 1.25em 0 1.25em;
	/* overflow: hidden; */
	}
	
p { line-height: 1.5; margin: 0.5em 0 1.25em 0; }
	

table	{
		width: 100%;
		margin: 1.5em 0 1.5em 0;
		}
		
 /* tr td:nth-child(2) 	{ */
						 /* white-space:; /*  Der Veranstaltungsort wird nicht umbrochen */
						 /* } */
						
th    	{
		max-width: 100%;
		padding: 0.3em 0.6em;
    	text-align: left;
  		/*  white-space:; */
  		/*  overflow: hidden; */
  		/*  text-overflow: ellipsis; */
		}
		
td	    {
		max-width: 100%;
		padding: 0.3em 0.6em;
  		/*  white-space:; */
  		/*  overflow: hidden; */
  		/*  text-overflow: ellipsis; */
		}
				
.intern th 	{
			padding: 0.3em 0 0.3em 0.6em;
    		text-align: left;
			}
		
.intern td {
	padding: 0.3em 0 0.3em 0.6em;
	}

address {
		margin: 1.5em 0 1.5em 0;
		}
		
footer address {
		margin: 0;
		}

nav 	{
	/* border-radius: 3px; */
	/* background: rgba(147, 128, 108, 0.1); */
	}

aside 	{
	padding: 1.25em; /* padding rund herum */
	}

	aside img { width: 100%; height: auto; margin-bottom: 1.25em; }
	aside .adsbygoogle { margin: 0 0 1.25em 0; }
	aside .ads { padding: 1.25em; }
	
footer 	{
	-webkit-flex: none;
	-ms-flex: none;
	flex: none; /* 2 */
	padding: 1.25em;
	}
	
small   {
		display: block;
		}
		
img	{
	width: 100%;
	height: auto;
	/* box-shadow: 3px 4px 8px rgba(0, 0, 0, 0.6); am 22.06.2018 auskommentiert*/
    }

.flags img {
	margin: 10px 0 6px 3px;
	width: 48px;
	height: auto;
	box-shadow: 3px 4px 8px rgba(0, 0, 0, 0.6);
	}	
	
.einzug {
	padding-left: 0.8em;
	}
	
.anzeige {
	padding: 1.25em 0;
	}
	
.adsbygoogle 	{
				clear: both;
				margin: 2.5em 0 2.5em 0;
				}

nav .adsbygoogle {
				margin: 0.5em 0 0 0;
				}
				
#bild > .adsbygoogle 	{
				clear: both;
				margin: 0.5em 0 0 0;
				}
				
.center	{
		text-align: center;
    	}
				
.button {
		text-align: center;
		margin-top: 3.25em;
		margin-bottom: 3.5em;
		padding: 20px;
		text-shadow: 0px -1px 0px rgba(30, 30, 30, 0.8);
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
		border-radius: 30px;
		
		background: -webkit-linear-gradient(top,rgba(93, 63, 33, 0.3),rgba(93, 63, 33, 1)); /*Safari 5.1-6*/
  		background: -o-linear-gradient(bottom,rgba(93, 63, 33, 0.3),rgba(93, 63, 33, 1)); /*Opera 11.1-12*/
  		background: -moz-linear-gradient(bottom,rgba(93, 63, 33, 0.3),rgba(93, 63, 33, 1)); /*Fx 3.6-15*/
  		background: -ms-linear-gradient(bottom,rgba(93, 63, 33, 0.3),rgba(93, 63, 33, 1)); /*Fx 3.6-15*/
  		background: linear-gradient(to bottom, rgba(93, 63, 33, 0.3), rgba(93, 63, 33, 1)); /*Standard*/
  		background-size: min-width: 25%;
		
		-webkit-box-shadow: 3px 4px 8px rgba(50, 50, 50, 0.75);
		-moz-box-shadow:    3px 4px 8px rgba(50, 50, 50, 0.75);
		box-shadow:         3px 4px 8px rgba(50, 50, 50, 0.75);
    	}
					
.clear {
	clear: both;
	}

#bild { width: 100%; margin: 0.5em auto 1.25em auto; padding: 0; display: block; overflow: hidden; }
#bild img { width: 100%; height: auto; margin: 0 0 1.25em 0; box-shadow: none; }
figcaption { text-align: left; font-family: "Helvetica Condensed", Helvetica, "Arial Narrow", Arial, sans-serif; font-size: 0.875em; line-height: 1.5; margin-bottom: 1.5em; padding: 0.4em 0.6em; overflow: hidden; }

	
/* ----------------------------------------------------------------------------- *
 *                             Textauszeichnungen                                *
 * ----------------------------------------------------------------------------- */
 
header H1, header H2 { text-align: center; padding: 0; margin: 0.9375em 0 0.75em 0; }

h1, h2 { line-height: 1.5; margin: 1.25em 0 0.5em 0; -ms-hyphens: none; -webkit-hyphens: none; hyphens: none;}

h1 { font-size: 2.25em; }

h2 { font-size: 1.5em; }

article ul, article ol, article ul li ul, blockquote {
	/*  padding: 0 0 0.625em 1.25em; 26.06.2018 auskommentiert */
	padding: 0 0 0.625em 1.625em;
	/*  margin: 0 0 0.625em 0.625em; 26.06.2018 auskommentiert */
	/*  margin: 1.25em 0 1.25em 1em; 06.07.2018 auskommentiert */
	margin: 0 0 0 0;
	}
	
.none { list-style-type: none;
	  padding: 0 0 0.625em 0; }

	
/* ----------------------------------------------------------------------------- *
 *                                  Navigation                                   *
 * ----------------------------------------------------------------------------- */
	
nav ul {
	margin: 0;
	padding:0; /*  was 0 0 2.5em 0; */
	}	

nav ul > li {
	margin-left: 0; /*  ensures complete fill of hover-color */
	padding: 0;
	background-image: url("bullets/bullet.gif");
	background-size: 234px auto;
	background-position: left top; 
	background-repeat: no-repeat;
	text-shadow: 3px 4px 8px #000;
	line-height: 1.75em; /*  was 2.5em; */
	display: block;
	}
	
nav ul > li > a {
	padding: 17px 0.8em 17px 0.8em;
	display: block;
	}
	
nav a:hover, nav a:active, nav ul li em {
    background-image: url("bullets/bullet-an.gif");
	background-size: 234px auto;
	background-position: left top;
	background-repeat: no-repeat;
	}

nav ul > li > em {
    padding: 0.2em 0.4em;
    display: block;
	}
	
.an {
    background-image: url("bullets/bullet-an.gif");
	background-size: 234px auto;
	background-position: left top;
	background-repeat: no-repeat;
	}

.blink {
    background-image: url("bullets/bullet-blink.gif");
	background-size: 234px auto;
	background-position: left top;
	background-repeat: no-repeat;
	}
	
nav ul a:link {
	text-decoration: none;
	}
	
/* ----------------------------------------------------------------------------- *
 *                          Styles fŸr schmale Viewports                         *
 *                         bis 608px / 16px/em = 38em                            *
 * ----------------------------------------------------------------------------- */

/* @media only all and (max-width: 22em) { */
@media (max-width: 38em) {

h1 { font-size: 1.75em; }

h2 { font-size: 1.25em; }

thead	{
		display: none;
		}
		
tr 	{
	overflow: auto;
	clear: both;
	}	
		
td:before	{
			content: attr(data-header);
			font-weight: bold;
			}

td 	{
	width: 100%;
	display: block;
	float: left;
	white-space: wrap;
	}	

}

/* ----------------------------------------------------------------------------- *
 *                          Styles fŸr breitere Viewports                        *
 *                          608px / 16px/em = 38em                               *
 * ----------------------------------------------------------------------------- */
 
 /* @media only all and (min-width: 48em) { */
@media (min-width: 38em) {

#bild { width: 300px; float: left; margin: 0.25em 1.25em 1.5em 0 ; position: relative; top: 2px; right: 0; }
/* #bild {
	  width: 300px;
	  height: auto;
	  float: left;
	  margin-right: 1.25em;
	  margin-bottom: 1.5em;
	  position: relative;
	  top: -3px;
	  right: 2px;
      } */
      
.float img {
	width: 300px; height: auto;
	float: left;
	margin: 0.25em 1.25em 1.5em 0;
	position: relative;
	top: 2px;
	right: 2px;
	}
      
p img {
	float: left;
	margin-right: 0.625em;
	margin-bottom: 0.375em;
	position: relative;
	top: 2px;
	right: 2px;
	}

 }
 
/* ----------------------------------------------------------------------------- *
 *                           Styles der Tabletversion                            *
 *                          768px / 16px/em = 48em                               *
 * ----------------------------------------------------------------------------- */
	
/* @media only all and (min-width: 48em) { */
@media (min-width: 48em) {

.page-wrapper {
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	}
	
	/* main, flex-item von page-wrapper (order 2) UND flex-container mit 2 flex-items article (1) und aside (2) */
main    {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	padding: 0;
	margin: 0;
	-webkit-order: 2;
	-ms-flex-order: 2;
	order: 2;
	overflow: hidden;
	}

	/* flex-item von main */
article {
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin: 1.25em;
	-webkit-order: 1;
	-ms-flex-order: 1;
	order: 1;
	max-width: 566px;
	overflow: hidden;
	}
	
	/* Navigation links anordnen */
nav 	{
	-webkit-flex: 0 0 auto;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-webkit-order: 1;
	-ms-flex-order: 1;
	order: 1;
	min-width: 234px;
	max-width: 234px;
	overflow: hidden;
	}

	/* flex-item von main, unter article anordnen */
aside 	{
	-webkit-flex: 0 0 auto;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-webkit-order: 2;
	-ms-flex-order: 2;
	order: 2;
	margin: 0;
	padding: 1.25em; /* padding rund herum */
	overflow: hidden;
	}
	
}

/* ----------------------------------------------------------------------------- *
 *                           Styles der Tabletversion                            *
 *                          800px / 16px/em = 50em                               *
 * ----------------------------------------------------------------------------- */

@media (min-width: 50em) {

body    {
    font-size: 1em; /* 16px */
	}
	
article	{
	max-width: 662px;
	}
	
}

/* ----------------------------------------------------------------------------- *
 *                          Styles der Tabletversion                            *
 *                          896px / 16px/em = 56em                               *
 * ----------------------------------------------------------------------------- */
 
 @media (min-width: 56em) {
 
article	{
	max-width: 746px;
	}
 
 }

/* ----------------------------------------------------------------------------- *
 *                           Styles der Tabletversion                            *
 *                          980px / 16px/em = 61.25em                            *
 * ----------------------------------------------------------------------------- */

@media (min-width: 61.25em) {

body	{
    	font-size: 1em;
		}

article	{
	max-width: 790px;
	}

nav	{
    min-width: 234px;
	max-width: 234px;
	}
	
}

/* ----------------------------------------------------------------------------- *
 *                           Styles der Tabletversion                            *
 *                          1024px / 16px/em = 64em                              *
 * ----------------------------------------------------------------------------- */

/* @media only all and (min-width: 64em) { */
@media (min-width: 64em) {

body    {
    font-size: 1em; /* was 0.9375em */
	}

.page-wrapper {
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	}
	
	/* main, flex-item von page-wrapper (order 2) UND flex-container mit 2 flex-items article (1) und aside (2) nebeneinander */
main    {
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	padding: 0;
	margin: 0;
	-webkit-order: 2;
	-ms-flex-order: 2;
	order: 2;
	overflow: hidden;
	}
	
	/* flex-item von main */
article {
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin: 0.625 em;
	-webkit-order: 1;
	-ms-flex-order: 1;
	order: 1;
	max-width: 886px;
	overflow: hidden;
	}
	
	/* Navigation links anordnen */
nav 	{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	-webkit-order: 1;
	-ms-flex-order: 1;
	order: 1;
	min-width: 234px;
	max-width: 234px;
	overflow: hidden;
	}

	/* flex-item von main, rechts anordnen */
aside 	{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	-webkit-order: 2;
	-ms-flex-order: 2;
	order: 2;
	padding: 0; /* kein padding */
	margin: 0;
	min-width: 160px;
	max-width: 160px;
	}
}

/* ----------------------------------------------------------------------------- *
 *                           Styles der Tabletversion                            *
 *                          1280px / 16px/em = 80em                           *
 * ----------------------------------------------------------------------------- */

@media (min-width: 80em) {

body    {
    font-size: 1em;
	}
	
article	{
	max-width: 746px;
	}
	
nav 	{
	min-width: 300px;
	max-width: 300px;
	}

	
aside	{
		min-width: 300px;
		max-width: 300px;
		}
	
}

/* ----------------------------------------------------------------------------- *
 *                           Styles der Tabletversion                            *
 *                          1920px / 16px/em = 120em                             *
 * ----------------------------------------------------------------------------- */

@media (min-width: 120em) {

	
}