/* Browser Reset
* {
    margin: 0;
    padding: 0;
}


body {#FFFDE8

    margin: 5px auto 0px;
	/*	
    padding: 0px;
	padding-top: 0px;
    background-color: #f2f5ed; /*rgb(113,149,62);
	    width: 996px;
	border: solid 4px rgb(113,149,62);

}#FCF501
	*/
/* ======================= CONTAINER =======================/*#f2f5ed;
#container{ padding: 10px 10px 3px 10px; background-color:  rgb(113,149,62); border: 2px solid white;  margin:0; }*/ 
/* Kastello: #FCF501 und hell #46AB3B */

/* fonts aus: https://archivfuehrer-kolonialzeit.de/schrift?sf_culture=de 
view-source:https://archivfuehrer-kolonialzeit.de/plugins/arPotsdamPlugin/css/potsdam.css */
@font-face{
    font-family:WiegelKurrent;
    src:url(../vendor/wiegel/wiegelkurrentmedium-webfont.eot);
    src:url(../vendor/wiegel/wiegelkurrentmedium-webfont.eot?#iefix) format("embedded-opentype"),url(../vendor/wiegel/wiegelkurrentmedium-webfont.woff) format("woff"),url(../vendor/wiegel/wiegelkurrentmedium-webfont.svg) format("svg");
    font-weight:400;
}
}
@font-face{
    font-family:WiegelKurrent;
    src:url(../vendor/wiegel/wiegelkurrentmedium-webfont.eot);
    src:url(../vendor/wiegel/wiegelkurrentmedium-webfont.eot?#iefix) format("embedded-opentype"),url(../vendor/wiegel/wiegelkurrentmedium-webfont.woff) format("woff"),url(../vendor/wiegel/wiegelkurrentmedium-webfont.svg) format("svg");
    font-weight:400;
}
@font-face{
    font-family:"18th Century";
    src:url(../vendor/fonts/18thctrkurtxt.eot);
    src:url(../vendor/fonts/18thctrkurtxt.eot?#iefix) format("embedded-opentype"),url(../vendor/fonts/18thctrkurtxt.woff) format("woff"),url(../vendor/fonts/18thctrkurtxt.svg) format("svg");
    font-weight:400;
}
@font-face{
    font-family:"Berthold Mainzer Fraktur gesperrt";
    src:url(../vendor/fonts/berthold_mainzer_fraktur_gesperrt_unz1a.eot);
    src:url(../vendor/fonts/berthold_mainzer_fraktur_gesperrt_unz1a.eot?#iefix) format("embedded-opentype"),url(../vendor/fonts/1berthold_mainzer_fraktur_gesperrt_unz1a.woff) format("woff"),url(../vendor/fonts/berthold_mainzer_fraktur_gesperrt_unz1a.svg) format("svg");
    font-weight:400;
}
@font-face{
    font-family:"Berthold Mainzer Fraktur";
    src:url(../vendor/fonts/berthold_mainzer_fraktur_unz1a.eot);
    src:url(../vendor/fonts/berthold_mainzer_fraktur_unz1a.eot?#iefix) format("embedded-opentype"),url(../vendor/fonts/berthold_mainzer_fraktur_unz1a.woff) format("woff"),url(../vendor/fonts/berthold_mainzer_fraktur_unz1a.svg) format("svg");
    font-weight:400;
}
@font-face{
    font-family:"Deutsche Kurrent";
    src:url(../vendor/fonts/deutschekurrent.eot);
    src:url(../vendor/fonts/deutschekurrent.eot?#iefix) format("embedded-opentype"),url(../vendor/fonts/deutschekurrent.woff) format("woff"),url(../vendor/fonts/deutschekurrent.svg) format("svg");
    font-weight:400;
}
@font-face{
    font-family:Greifswalder;
    src:url(../vendor/fonts/greifswalder_deutsche.eot);
    src:url(../vendor/fonts/greifswalder_deutsche.eot?#iefix) format("embedded-opentype"),url(../vendor/fonts/greifswalder_deutsche.woff) format("woff"),url(../vendor/fonts/greifswalder_deutsche.svg) format("svg");
    font-weight:400;
}
@font-face{
    font-family:"Kurrent Kupferstich";
    src:url(../vendor/fonts/kurrentkupferstichthin.eot);
    src:url(../vendor/fonts/kurrentkupferstichthin.eot?#iefix) format("embedded-opentype"),url(../vendor/fonts/kurrentkupferstichthin.woff) format("woff"),url(../vendor/fonts/kurrentkupferstichthin.svg) format("svg");
    font-weight:400;
}
@font-face{
    font-family:Kurrent;
    src:url(../vendor/fonts/kurrent.eot);
    src:url(../vendor/fonts/kurrent.eot?#iefix) format("embedded-opentype"),url(../vendor/fonts/kurrent.woff) format("woff"),url(../vendor/fonts/kurrent.svg) format("svg");
    font-weight:400;
}
@font-face{
    font-family:Ottilie;
    src:url(../vendor/fonts/ottilie_u1ay-webfont.woff2) format('woff2'),url(../vendor/fonts/ottilie_u1ay-webfont.woff) format('woff'),url(../vendor/fonts/ottilie_u1ay-webfont.ttf) format('truetype');
}


body{background-color: black;width:100%;margin:0;}
main a{color:black;}
main a.tag, aside a.tag{color: black;width:100%; background-color: #FFE2C6;padding: 0 3px; margin: 2px 3px; border: 1px solid white; border-radius:5px;}
main a.tour, aside a.tour{color: black;width:100%; background-color: #FFDF7F;padding: 0 3px; margin: 2px 3px; border: 1px solid white; border-radius:5px;}
main a.land, aside a.land{color: black;width:100%; background-color: #BFDFFF;padding: 0 3px; margin: 2px 3px; border: 1px solid white; border-radius:5px;}
main a.region, aside a.region{color: black;width:100%; background-color: #CCFF99;padding: 0 3px; margin: 2px 3px; border: 1px solid white; border-radius:5px;}
.Eintrag{border:1px solid lightgrey; border-top:none; border-radius: 10px; padding: 10px;margin-top: 15px;background-color:#FFFDE8}
#container {background-color: white;}
/* ======================= buttons ======================= */
button {
	background-color:red;
	color:white;
	font-weight:bold;
	border:1px solid grey;
	border-radius:5px;
	margin:2px;
	padding:2px;
-webkit-box-shadow: 3px 3px 4px -1px rgba(60,60,60,0.75);
box-shadow: 3px 3px 4px -1px rgba(60,60,60,0.75);
}
button:hover {border: 1px solid black}
.green {background-color:#46AB3B;}
/* ======================= sticky TOP-HEADER ======================= */
#top-header {
    width: 100%;
	min-height: 30px; 
	background-color: #FCF501;
	position:fixed;
    top: 0;    
}
#top-header h1 {
margin: 10px auto;
width: 55%;
		color:white;
		font-size:21px;
		font-family: Verdana,Arial,"Trebuchet MS",Tahoma,sans-serif;
		font-style: normal;
		font-weight: bold;
		text-align:center;
		padding: 3px;
		text-shadow: 0 0 0.2em #46AB3B, 0 0 0.2em #46AB3B, 0 0 0.2em #46AB3B;
		}
/* ======================= HEADER ======================= */
header {
    width: 100%; 
	background-color: #46AB3B; /*  weitere Farben: 5B160B */

/* folgendes ist der ar_container! */	
display: inline-block;
position: relative;
width: 100%;
} 

/* margin-top ist Seitenverhältnis des Titelbildes:23.4%; */
.ar_dummy {
margin-top: 17.0%;
}

.ar_content {
		background-image: url("Hohendorf-Abaschin-banner.jpg");
	background-size: 100%;
position: absolute;
top: 0; /* genullte Angaben zu allen vier Ecken zieht das Bild auf die Größe des Eltern-Elements (header) auf */
bottom: 0;
left: 0;
right: 0;
}

header p { /* Datenschutzerklärung */
	position: relative;
    top: 0px;
    left: 0px;
	margin:0;
	}
	
header p a {/* Datenschutzerklärung: Linktext */
			background-color: rgba(113,149,62, 0.5);
			color:white; 
			padding: 0 5px;
			text-decoration: none;
			text-shadow: 0 0 0.2em rgb(113,149,62), 0 0 0.2em rgb(113,149,62), 0 0 0.2em rgb(113,149,62);
		 }

header h1 { /* margin-top:190px; */ 
		margin-left: 5%;margin-top:-15%; width:28.2%; z-index: 12; position: absolute; 
		color:white;
		font-size:38px;
		font-family: Verdana,Arial,"Trebuchet MS",Tahoma,sans-serif;
		font-style: normal;
		font-weight: bold;
		text-align: left;
		padding: 30px;
		text-shadow: 0 0 0.2em #46AB3B, 0 0 0.2em #46AB3B, 0 0 0.2em #46AB3B;
		

		}

@media screen and (max-width: 1500px) { 
header h1 {font-size:36px; margin-left: 3%;}
}
		
@media screen and (max-width: 1300px) { 
header h1 {font-size:32px; margin-left: 0%;}
}

@media screen and (max-width: 1100px) { 
header h1 {font-size:28px; margin-left: 0%;}

}

@media screen and (max-width: 1000px) { 
header h1 {font-size:22px;margin-left: 0%;}
}

@media screen and (max-width: 800px) { 
header h1 {font-size:22px;margin-left: 0%;margin-top:-20%;}
}

@media screen and (max-width: 725px) { 
header h1 {width: 80%; font-size:26px;margin-left: 0%;margin-top:-20%;}
}



@media screen and (max-width: 600px) { 
header h1 {width: 80%; font-size:26px;margin-left: 0%;margin-top:-25%;}
}

@media screen and (max-width: 390px) { 
header h1 {width: 80%; font-size:24px;margin-left: -1%;margin-top:-28%;}
}

  header img { /* margin-top:-20px;  damit es nicht unter der DSE sitzt */
			width:100%; /*margin: 10px auto;*/
  } 
 
 
 #main-container{
	 width: 996px; 
	 margin: 0 auto;
 }

 
/* ======================= ASIDE ======================= */
 aside{z-index:1;position: sticky; top: 80px; float: right; width: 175px;  padding: 10px 5px 0 0; /*z-Index: damit aside nicht Mitgliedermenü bei dropdown überlagert! height: 100%; position: static; position: -webkit-sticky;  *//* background-color: rgb(113,149,62);border: 1px solid #692116;*/}
aside p{font-family: Arial;color: black; font-size:14px; /* text-shadow: 0 0 0.2em #FCF501, 0 0 0.2em #FCF501, 0 0 0.2em #FCF501; */}
aside p .fett{font-weight:bold; color: #FCF501; text-shadow: 1px 1px 0.05em lightgrey /* text-shadow: 0 0 0.2em #FCF501, 0 0 0.2em #FCF501, 0 0 0.2em black; */ }

 
 /* ======================= MAIN ======================= */
  main {
    width: 760px;
	margin: 5px 0 10px;
	float:none;
    padding: 10px;
    text-align: left;
	background-color: white;
/*	border:1px solid black;
	 border-left: 10px solid #3a3a3a;*/
}

/* ------------------------------------------------- */
/* Vorstands-Tabelle von KGV*/

main table { /*  " cellspacing="1" cellpadding="2" */
	width: 100%;
	border: none;
}

main table thead tr td {
	background-color: #333333;
	color: #E6E6E6;
	font-weight: bold;
	padding: 5px 3px;
	
}
main table tbody td{
	background-color: #E6E6E6;
	vertical-align:top;
	padding: 2px 3px;
}  

main table#vorstand tbody td.funktion{width: 20%;}
main table#vorstand tbody td.aufgabe{width: 25%;}
main table#vorstand tbody td.name{width: 25%;}
main table#vorstand tbody td.gartennr{width: 13%;}

main table#funktionen-berater tbody td.funktion{width: 25%;}
main table#funktionen-berater tbody td.aufgabe{width: 37%;}
main table#funktionen-berater tbody td.name{width: 25%;}
main table#funktionen-berater tbody td.gartennr{width: 13%;}

main table#termine tbody td.datum{width: 15%;}
main table#termine tbody td.beginn{width: 10%;}
main table#termine tbody td.ende{width: 10%;}
main table#termine tbody td.veranstaltung{width: 25%;}
main table#termine tbody td.ort{width: 40%;}
/*class="cell" align="left" valign="top"*/

main table#mitgliedsbeitraege{ /*  " cellspacing="1" cellpadding="2" */
	width: 45%;
	border: none;
}
/* ------------------------------------------------- */


main h1 {
	/*
	margin: 0;
	padding: 0;
	width: 510px;
	height: 35px;
	background-repeat : no-repeat;
	*/
	font-size: 2em;
}

main h2 {
display: block;
font-size: 1.7em;
font-weight: bold;
}

main .sidepicture {
	float: right;
	padding: 0px 0px 0px 10px;
	margin: 4px 0px 10px 10px;
	width: 160px;
}

main .clearer {
	clear: both;
}


main h3{
  font-family: Verdana,Arial,"Trebuchet MS",Tahoma,sans-serif;
  font-style: normal;
font-size: 1.1em;
font-weight: bold;
  text-decoration: none;
  color: #696560;
  margin-left:0px; 
  margin-top: 13px;	
  margin-bottom: 13px;	
	
}

ul {margin-top: 10px;}

h3 {
  font-family: Verdana,Arial,"Trebuchet MS",Tahoma,sans-serif;
  font-style: normal;
font-size: 1.2em;
font-weight: bold;
  text-decoration: none;
  color: #696560;
  margin-left:5px; 
  margin-top: 25px;
}

main, main p{
  font-family: Verdana,Arial,"Trebuchet MS",Tahoma,sans-serif;
  font-style: normal;
  font-size: 13px;
  font-weight: normal;
  text-decoration: none;
  color: #696560;
}


/* ======================= NAV ======================= */
nav {position: sticky; top: 40px;
z-index:2;
  /*  box-sizing: border-box;
 float: left; */
  width: 100%;
  background: #FCF501; /*#692116; #3a3a3a; */
  font-size: 16px;
  margin-left: auto;
  margin-right:auto;
  height:40px;
  }
  
#menue-ausklapper{display:none;} 

#menu-container {
	width: 996px;
	margin-left:auto;
	margin-right:auto;
}  
  
nav ul {z-index:2;
  margin: 0;
  padding: 0;
  margin-left: auto; /*50px; */
  margin-right:auto;
  text-align:center;
}
 
nav a {
  display: block;
  color: white; /* #B0CA89;  #fff; */
  text-decoration: none;
  font-family: Arial;
  font-weight:bold;
}

nav ul li {
  position: relative;
  float: left;

  list-style: none;
  padding: 0 10px;
}

nav ul li.active { /* aktiver Hauptmenüpunkt */
  background: #46AB3B; /*#333;  #FCF501; #4096ee; */
  border-bottom: 2px solid white;
  border-top-left-radius: 10px;
   border-top-right-radius: 10px;
}
 
nav ul li:hover { /* Hauptmenü, beim Hovern */
  background: #333; /* #FCF501; #4096ee; */
}

nav ul li:hover a{ /* Haupt oder submenü-Punkte, beim Hovern */
  color: white;
}

nav ul ul li:hover { /* Submenü, beim Hovern */
  background: #FCF501; /* #FCF501; #4096ee; */
}

nav ul li a {
    padding: 10px;
}

nav ul ul {
  position: absolute;
  top: -9999px;
  left: -9999px;
  background: #333;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
}
 
nav ul ul li {
  float: none;
  width: 200px;
  border-bottom: 1px solid #555;
}
 
nav ul ul li a {
  padding: 10px 20px;
}

nav ul li:hover > ul {
  top: 100%;
  left: 0;
}

nav ul ul li:hover > ul {
  top: 0;
  left: 200px;
    z-index:10000; 
}

nav ul li.submenu > a:after {
  position: relative;
  float: right;
  content: '';
  margin-left: 10px;
  margin-top: 5px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #fff;
  border-bottom: 5px solid transparent;
}

nav ul ul li.submenu a:after {
  margin-left: auto;
  margin-right: -10px;
  border-left: 5px solid #fff;
  border-right: 5px solid transparent;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
}

nav ul ul li:last-child {
  border-bottom: none;
}

/*

nav {
    width: 990px;
    background-color: blue;	
    padding-left: 10px;
	padding-top:10px;
		padding-bottom:10px;
}

nav ul {
    border: 0;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

nav ul li {display: inline; 
    margin: 2px 5px;
    padding: 2px;
	border:1px solid lightgrey;
	border-radius:2px;
}

nav ul a.aktiv{
  background: url(images/n1activeitem.gif) no-repeat;
  font-family: Verdana,Arial,"Trebuchet MS",Tahoma,sans-serif;
  font-style: normal;
  font-size: 11px;
  font-weight: normal;
  text-decoration: none;
  color: yellow;
  background-position: top right;
}

nav ul a  {
    display: inline;
    text-align: left;
    line-height: 24px;
    padding: 0 15px 0 3px;
    width: 132px;
  background-position: top right;
  background: url(images/n1.gif) no-repeat;
  font-family: Verdana,Arial,"Trebuchet MS",Tahoma,sans-serif;
  font-style: normal;
  font-size: 11px;
  font-weight: normal;
  text-decoration: none;
  color: white;
  background-position: top right;
}

nav ul a:hover {
  background: url(images/n1hover.gif) no-repeat;
  font-family: Verdana,Arial,"Trebuchet MS",Tahoma,sans-serif;
  font-style: normal;
  font-size: 11px;
  font-weight: normal;
  text-decoration: none;
  color: yellow;
}
*/



/* ======================= FOOTER ======================= */
footer {
    clear: both;   	
	font-family: arial;
	color:white;
	border-top: 1px solid grey;
/* 	//padding: 0px auto;
   margin: 5px auto 0px auto ;
    
	border: 1px solid black; */
    width: 100%;
   min-height: 30px; 

	background-color: #FCF501;
 /*   background-position: 200px, 0px ; 
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
	text-align: center;

	  /* position:fixed;
    bottom: 0;
    width: 100%;
*/
	
}

/* footer #fusszeile {margin: 0px auto;}
*/
footer p {	/* background-color: grey; 	 border: 1px solid red; 
    margin: 15px auto 5px auto;
	    padding: 5px auto; width: 90%; */
		color: white;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	
footer p a {
 /*  font-family: Verdana,Arial,"Trebuchet MS",Tahoma,sans-serif;
  font-size: 11px; */
  font-weight: normal;
 white-space: nowrap;
 		color: white;

}


/* =========================================================*/
/* Bilder  749px
.imgal{margin: 10px auto; width:100%;}	*/		
.thumbnail {
padding:5px;
display:block;
margin:9px 18px 9px 0px;border: white 5px solid;
float:left;
  position: relative; 
  width: 109px;
  height: 109px;
  overflow: hidden;
  box-shadow: rgb(138, 138, 138) 1px 1px 3px 3px;
}

.thumbnail:hover {
  box-shadow: rgb(238, 238, 238) 1px 1px 3px 5px;
  border: 5px double #FCF501;
  border-radius:5px;
}

.thumbnail img {
  position: absolute;
  left: 50%;
  top: 50%;
  height: 100%;
  width: auto;
  -webkit-transform: translate(-50%,-50%);
      -ms-transform: translate(-50%,-50%);
          transform: translate(-50%,-50%);
}

.thumbnail img.portrait {
  width: 100%;
  height: auto;
}		
/* =========================================================*/


/* RESPONSIVE */

@media screen and (max-width: 1020px) { 
/*
body{width: auto;}
header { width: auto; height:auto; }
header h1{float: none; text-align: center; }
header img{float: none; position: relative; width:100%; }
*/
#menue-ausklapper{display:block;  width: 100%; height: 30px;
background: #FCF501;
  font-size: 16px;
  margin:0;
  margin-left: auto;
  margin-right:auto;
  /* padding: 5px 10px; */
  text-align: right;
  color:white;
  font-weight:bold;
  font-family:Arial, sans-serif;
  font-size:16px;
}
#menue-ausklapper.closed{display:none;}
#container {     min-width: 320px;}
#menu-container.closed{display:none;	}
#menu-container.open{display:block;	width: 100%;}
nav{					width: 100%;float: none;  	display:block;position: static; height:auto;}
nav ul ul {position: static;}
nav ul li {							float: none;	display:block;background: #3a3a3a;}
nav ul ul li {	display:block;		width: 100%;}
main h1{				width: 100%;}
#main-container{	width: 100%;}
aside{				width: 100%; padding:0;float: none; position: static; clear:both; padding: 0;text-align:center;}
#Heute, #Kalender{display: inline-block; width: auto; margin: 0 auto; padding: 0 1%; text-align:left; clear:both;}
/* #Heute{				 background-color: lightgreen;}
#Kalender{			 background-color: lightyellow;}
*/
#top-header h1 {
margin: 5px auto;
width: 90%;
		color:white;
font-size:18px;}
main{width: 94%; float: none;  padding:0 3%;}
}