/*-	Reset	-------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
body {
  line-height: 1;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

/* remember to define focus styles! */
:focus {
  outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}
del {
  text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*-	Menü -------------------------------------------------------------------------------*/
@charset 'UTF-8';

#cssmenu ul, #cssmenu li, #cssmenu span, #cssmenu a { border:0; margin: 0; padding: 0; position: relative; }
#cssmenu { font-weight: 400; width: auto; margin: 0 0 5px 0; background: transparent;}
#cssmenu:after, #cssmenu ul:after {content: ''; display: block; clear: both; }
#cssmenu a, #cssmenu p {color: #ffffff; display: inline-block; font-size: 1.1em; line-height: 250%; padding: 0 19.99px; text-decoration: none; margin: 0}
#cssmenu ul { list-style: none; }
#cssmenu > ul { float: left; }
#cssmenu > ul > li { float: left;}
#cssmenu > ul > li a { color: white; }
#cssmenu > ul > li:hover > a { background: papayawhip; color: #000; }
#cssmenu > ul > li> ul > li > a { background: moccasin; color: #000;}
#cssmenu > ul > li> ul > li > a:hover { background: moccasin; color: #000;}
#cssmenu .has-sub { z-index: 1; }
#cssmenu .has-sub:hover > ul { display: block; }    
#cssmenu .has-sub ul { display: none; position: absolute; width: 18.1em; top: 100%; left: 0; }  
#cssmenu .has-sub ul li a { background: papayawhip; border-bottom: 1px #dddddd solid; display: block; line-height: 250%; padding: 0px 19.99px; font-size: 1em; }    

/*- Content -------------------------------------------------------------------------------*/
html { min-height: 100%; }
body { margin-bottom: 1em;
	font: normal normal 400 0.9em/1.5em 'Verdana', sans-serif;
	color: #333; min-width: 320px; display: block; min-height: 100%;
	background-image: url("../images/feder.jpg"); background-color: white; background-position: center;
	background-position: left top; background-repeat: no-repeat; background-size: cover; }
#pageblock { margin: auto; max-width: 1085px; padding: 0 25px; }

/* --- Header ---------------------------- */
#skiplinks p a { position: absolute; left: -900em; top: -900em; width: 0; height: 0; overflow: hidden; }
#header { width: 100%; margin-top: 50px; }
#nav-open-btn, #nav-close-btn { position: absolute;  position: absolute; right: 32px; top: 16px;
	background-image: url(../images/nav-icon.png); width: 20px; height: 20px; display: none; }

/* --- Content ---------------------------- */
#contentrow { padding: 0 25px; background: white; overflow: hidden; }
#content { width: 100%; margin-bottom: 2em; }
#vd-text { float: left; width: calc(100% - 370px); }
.indexbild { margin: 0 -25px 0 5px; float: right }

 /* --- Text ---------------------------- */
p { margin: 1.2em 0em 1.2em 0; line-height: 1.6em;}
p.green { margin: 1.2em 0em 1.2em 0; line-height: 1.5em; color: green; font-size: 1.2em; font-variant:small-caps;>}
p.aboben { margin: 1.5em 0em 0 0;}

h1, h2, h3 { color: green /*goldenrod*/; font-weight: 400; line-height: 1.2em; font-variant:small-caps;}
h1 { font-size: 1.8em; margin: 1.5em 0 1em 0; }
h2 { font-size: 1.4em; margin: 1.8em 0 1em 0; }
h3 { font-size: 1.1em; margin: 1.8em 0 1em 0; }
#vd-text h1 { margin-top: 60px; }
#content ul { list-style:square; margin-left: 25px; }
.hidden { display: none; }

/* --- Links ---------------------------- */
a { color: #0000A0; text-decoration: none; }
a:active, a:hover, a:focus { color: #4D1A1F; text-decoration: underline; }

/* --- Footer  ---------------------------- */
#footerrow { margin: 5px 0; background: wheat; }
#footer1 { line-height: 1em; padding: 20px 0; text-align: center; }
#footerrow ul { list-style:none; display:inline-block; }
#footerrow ul li { float: left; margin-right: 20px; }

/*	cookiebanner	*/
#cookiebanner { display: none; text-align: center; line-height: 1.5em; color: white; background: black; position: fixed; left: 0; bottom: 0; height: auto; width: 100%; z-index: 255; opacity: 1; }
.cookietext { padding: 1.2em 1em 1.5em 1em; }
.cookiebutton { list-style-type: none; margin-bottom: 2em; }
.cookiebutton li{ display:inline; padding: .1em }
.cookiebutton li a { color: #0D46B9; padding: 6px 18px; background-color: white; text-decoration: none; }

/* --- Responsiv ---------------------------- */
@media only screen and (max-width: 975px)
{ body {font: normal normal 400 0.9em/1.5em 'Verdana', sans-serif; } }

@media only screen and (max-width: 950px)
{ body {font: normal normal 400 0.9em/1.5em 'Verdana', sans-serif;} }

@media only screen and (max-width: 930px)
{ body {font: normal normal 400 0.9em/1.5em 'Verdana', sans-serif;} }

@media only screen and (max-width: 910px)
{ body {font: normal normal 400 0.9em/1.5em 'Verdana', sans-serif;} }

@media only screen and (max-width: 700px)
{
	#vd-text { width: 100% }
	#vd-text h1 { margin-top: 1.5em }
	.indexbild { margin: 0 0 20px 0; float: left; }
	#vd-bild { padding: 0 10px; float: left; width: 100%}
	#pageblock { padding: 0 10px; }
	#nav-open-btn, #nav-close-btn { position: absolute; right: 16px; top: 16px; }
}

@media only screen and (max-width: 650px)
{
	#nav-open-btn, #nav-close-btn { display: block; }
	
	#cssmenu { position: absolute; top: 12px; width: 80%; display: none; padding: 0; }
	#cssmenu > ul { float: none; }
	#cssmenu > ul > li:hover > p, #cssmenu > ul > p { color: #ffffff; }
	#cssmenu > ul > li { float: none; }
	#cssmenu ul { float: none; }
	#cssmenu a, #cssmenu p { padding-left: 25px; border-bottom: 1px solid #dddddd; }
	#cssmenu .has-sub ul { display: block; position: relative; width: 100%; }
	#cssmenu .has-sub ul li a { padding-left: 50px; }
	#cssmenu .has-sub p { color: #000; display: block }
	#cssmenu > ul > li:hover > a, #cssmenu > ul > li:hover > p { color: #000080; }
	#cssmenu ul li { text-transform: none; border-bottom: 1px solid #dddddd; color: #000080; background-color: floralwhite; }	
	#cssmenu ul li a, #cssmenu .has-sub ul li a { display: block; color: #000080; background-color: floralwhite; }
}

@media only screen and (max-width: 520px)
{
	html { background-color: white }
	body { background-image: none; }
	#contentrow { padding: 0 10px; }
	#footerrow { margin: 0 0 5px 0;}
	#footerrow ul li { margin-right: 12px; }
	#vd-text h1 { margin-top: 25px; }
	#vd-bild { padding: 0; }
	.indexbild { min-width: -webkit-fill-available; padding: 0; width: 100% }
	#nav-open-btn, #nav-close-btn { position: absolute; right: 16px; top: 16px; }
}
@media only screen and (max-width: 420px)
{ 
	#contentrow { padding: 0 10px; }
	#header { margin-top: 0px; }
	#pageblock { padding: 0 0px }
	#nav-open-btn, #nav-close-btn { position: absolute; right: 16px; top: 14px; }
}

@media only screen and (max-width: 350px)
{  
	#footer1 li { font-size: 0.9em }
}

@media only screen and (max-width: 330px)
{
	#footer1 li { font-size: 0.85em }
}

@media (pointer:coarse)
{
	#nav-open-btn, #nav-close-btn { display: block; }
	
	#cssmenu { position: absolute; top: 12px; width: 80%; display: none; padding: 0; }
	#cssmenu > ul { float: none; }
	#cssmenu > ul > li:hover > p, #cssmenu > ul > p { color: #ffffff; }
	#cssmenu > ul > li { float: none; }
	#cssmenu ul { float: none; }
	#cssmenu a, #cssmenu p { padding-left: 25px; border-bottom: 1px solid #dddddd; }
	#cssmenu .has-sub ul { display: block; position: relative; width: 100%; }
	#cssmenu .has-sub ul li a { padding-left: 50px; }
	#cssmenu .has-sub p { color: #000; display: block }
	#cssmenu > ul > li:hover > a, #cssmenu > ul > li:hover > p { color: #000080; }
	#cssmenu ul li { text-transform: none; border-bottom: 1px solid #dddddd; color: #000080; background-color: floralwhite; }	
	#cssmenu ul li a, #cssmenu .has-sub ul li a { display: block; color: #000080; background-color: floralwhite; }
}