html {font-size:100%;}
body {margin:0px;background-image: linear-gradient(to right,#800000,#800000,#888888,#888888,#888888,#888888,#888888,#800000,#800000);}
table     {border-collapse: collapse;border-spacing: 0px;margin-left:auto; margin-right:auto;}
table, td {border: 0px solid black;font-size:1.1rem;}  

.sli, .letzte, #zur, #mam, #update, .zoom, #grImg1 {position:absolute;}
nav, .tdli, .tdmi, .tdre, .oben, .rel, .text, .sub, .sup, .img, #grImg2, .footer {position:relative;}


nav    {font-size:1.2rem;white-space:nowrap;text-align:center;}
nav ul {margin:0.2rem 0 0.2rem 0;padding:0.2rem 0 0.2rem 0.4rem;list-style: none;color:black;background-color:#800000;border:1px solid yellow;border-width:0.068rem;border-radius:8px;border-radius:0.5rem;}
nav li {margin: 0 0.2rem 0 0;padding:0.2rem 0.5rem 0.2rem 0.5rem;background-color:#cccccc;width:250px;width:15.625rem;
        border:1px solid #800000;border-width:0.068rem;border-radius:8px;border-radius:0.5rem;overflow:hidden;}
nav .l, .u  {cursor:pointer;}
nav .l:active, nav .u:active, nav .l:hover, nav .u:hover  {color:blue;}
nav .t {text-decoration:underline;margin-top:0.2rem;color:#400000;}
nav ul ul {margin-left:0.5rem;margin-right:0px;border-top-width:0;border-right-width:0;border-top-left-radius:0;border-bottom-right-radius:0;}
nav .akt  {color:darkred;cursor:default;}
#ula      {display:none;}                                       

div.table, .tmax {display: table;border-collapse:collapse;}
div.tr    {display:table-row;}
div.td, .tdli, .tdmi, .tdre    {display:table-cell;vertical-align: top;}
.tmax, .img > img {width:100%;}
.tdli, .tdre {width:150px;width:9.375rem;font-size:1.2rem;}

.oben     {height:80px;height:5rem;background-size:contain;background-image: url(<?php echo $wou;?>wouh.png);}
.oben .table  {margin-left:auto;margin-right:auto;}
.oben .table div {display:table-cell;height:5rem;vertical-align:middle;}
.oben img {width:464px;height:20px;width:29rem;height:1.25rem;}

.sli    {top:16px;top:1rem;left:0px;padding:4px;padding:0.25rem;z-index:9;}
.letzte {bottom:0;right:0.5rem;}

.text    {width:fit-content;max-width:480px;max-width:30rem;margin-left:auto;margin-right:auto;color:black;background-color:#dddddd;font-size:1.2rem;padding:16px;padding:1rem;
          border:4px solid grey;border-width:0.25rem;border-radius:16px;border-radius:1rem;}
.text span {-webkit-hyphens: auto; hyphens: auto;}
.text ul {list-style-type:"- ";margin-top:0;margin-bottom:0;}
.text ol, .text ul  {padding-left:1em;}
.text li {text-align:justify;}

#zur    {top:0;left:0;}
#pfeil  {position:fixed;right:8px;right:0.5rem;bottom:80px;bottom:5rem;background-color:#aaaaaa;padding:4px;padding:0.25rem;
         border:2px solid blue;border-width:0.125rem;border-radius:8px;border-radius:0.5rem;z-index: 2000;transition: opacity 2s 0.5s}
.pfeil  {width:32px;height:32px;width:2rem;height:2rem;z-index:9000;}

#mam    {top:-24px;left:4px;top:-1.5rem;left:0.25rem;padding:4px;padding:0.25rem;border:2px solid white;border-width:0.125rem;border-radius:8px;
         border-radius:0.5rem;z-index: 2000;cursor:pointer;background-color:#400000;}
#mam img  {width:32px;height:32px;width:2rem;height:2rem;}

h1, h2, h3, h4, h5 {text-align:center;padding:0.2em 0.2em 0 0.2em;margin:0;}
h1       {font-size:1.3em;}
h2       {font-size:1.2em;}
h3       {font-size:1.1em;}
h4, h5   {font-size:1em;}
.p, .gross, .klein {text-align:justify;padding-top:4px;padding-top:0.25em;padding-bottom:4px;padding-bottom:0.25em;}
.gross   {font-size:1.1em;}
.klein   {font-size:0.8em;}
.sub, .sup {display:inline;font-size:0.7em;padding:0 0.1em 0 0.1em;}
.sub      {top:0.2em;}
.sup      {top:-0.4em;}

#update   {top:3.25rem;right:0.5rem;width:16.725rem;list-style: none;z-index:2000;padding-left:0;padding-right:0;}
#update .l {width:8rem;margin-left:auto;margin-right:0;}

#daten a {padding-right: 1.5em; color: blue;}
#daten a[href^="../"] {background: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2012%2012%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpolygon%20fill%3D%22blue%22%20points%3D%222%2C5%203%2C5%203%2C3%209%2C3%209%2C9%207%2C9%207%2C10%2010%2C10%2010%2C2%202%2C2%22/%3E%3Cpolygon%20points%3D%220.5%2C10.5%203.5%2C7.5%202%2C6%205.5%2C6%205.5%2C10%204.5%2C8.5%201.5%2C11.5%22/%3E%3C/svg%3E") no-repeat right;}
#daten a:hover, a:focus {color: red;}
#daten a[href^="../"]:hover, a[href^="../"]:focus {background: #fffbf0 url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2012%2012%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpolygon%20fill%3D%22red%22%20points%3D%222%2C5%203%2C5%203%2C3%209%2C3%209%2C9%207%2C9%207%2C10%2010%2C10%2010%2C2%202%2C2%22/%3E%3Cpolygon%20points%3D%220.5%2C10.5%203.5%2C7.5%202%2C6%205.5%2C6%205.5%2C10%204.5%2C8.5%201.5%2C11.5%22/%3E%3C/svg%3E") no-repeat right;}
#daten a[href^="http"] {background: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2012%2012%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpolygon%20fill%3D%22blue%22%20points%3D%222%2C2%205%2C2%205%2C3%203%2C3%203%2C9%209%2C9%209%2C7%2010%2C7%2010%2C10%202%2C10%22/%3E%3Cpolygon%20points%3D%226.2%2C2%2010%2C2%2010%2C5.8%208.6%2C4.4%206.5%2C6.5%205.5%2C5.5%207.6%2C3.4%22/%3E%3C/svg%3E") no-repeat right;}
#daten a[href^="http"]:hover, a[href^="http"]:focus {background: #fffbf0 url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2012%2012%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpolygon%20fill%3D%22red%22%20points%3D%222%2C2%205%2C2%205%2C3%203%2C3%203%2C9%209%2C9%209%2C7%2010%2C7%2010%2C10%202%2C10%22/%3E%3Cpolygon%20points%3D%226.2%2C2%2010%2C2%2010%2C5.8%208.6%2C4.4%206.5%2C6.5%205.5%2C5.5%207.6%2C3.4%22/%3E%3C/svg%3E") no-repeat right;}

details  {display:inline-block;}
summary  {color:darkblue;white-space:nowrap;font-size:1.2rem;padding-left:0.2rem;cursor:pointer;}
details > div {position:absolute;width:100%;left:0;}
details > div > div {width: fit-content;max-width:20em;margin-left:auto;margin-right:auto;background-color:white;padding:0.2em 0.5em 0.2em 0.5em;
                     border:2px solid grey;border-width:0.125rem;border-radius:16px;border-radius:1rem;font-size:1.2rem;}

.re       {text-align:right;}
.zoom     {top:4px;top:0.25rem;right:4px;right:0.25rem;cursor:pointer;border:2px solid grey;}
#grImg1   {width:100%;top:0;z-index:3000;display:none;}
#grImg2   {margin-left:auto;margin-right:auto;border:2px solid #ffd700;background-color:white;}
.zoom, #grImg2 {width:fit-content;padding:4px;padding:0.25rem;border-width:0.125rem;border-radius:8px;border-radius:0.5rem;}

.footer     {bottom:0;width:95vw;margin-top:1em;font-size:1rem;margin-left:auto;margin-right:auto;}
.footer div {width:fit-content;margin-left:auto;margin-right:auto;padding:0.4rem;line-height:1.5em;text-align:center;
             border:2px solid yellow;border-width:0.125rem;border-radius:8px;border-radius:0.5rem;}
.footer div div {display:inline-block;padding:0.2em 2em 0.2em 2em;color:white;border:none;}
#vwI        {background: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2012%2012%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpolygon%20fill%3D%22blue%22%20points%3D%222%2C5%203%2C5%203%2C3%209%2C3%209%2C9%207%2C9%207%2C10%2010%2C10%2010%2C2%202%2C2%22/%3E%3Cpolygon%20points%3D%220.5%2C10.5%203.5%2C7.5%202%2C6%205.5%2C6%205.5%2C10%204.5%2C8.5%201.5%2C11.5%22/%3E%3C/svg%3E") no-repeat left;background-size:2em;background-position:0 0;}
#vwE        {background: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2012%2012%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpolygon%20fill%3D%22blue%22%20points%3D%222%2C2%205%2C2%205%2C3%203%2C3%203%2C9%209%2C9%209%2C7%2010%2C7%2010%2C10%202%2C10%22/%3E%3Cpolygon%20points%3D%226.2%2C2%2010%2C2%2010%2C5.8%208.6%2C4.4%206.5%2C6.5%205.5%2C5.5%207.6%2C3.4%22/%3E%3C/svg%3E") no-repeat left;background-size:2em;background-position:0 0;}
.footer nav, .footer ul, .footer li {display:inline;}
.footer li  {border:1px solid #800000;border-width:0.068rem;border-radius:8px;border-radius:0.5rem;}
.footer a   {text-decoration:none;}
#imp        {max-width:480px;max-width:30rem;margin: 0.5rem auto 0.2rem auto;color:black;background-color:#dddddd;font-size:1.3rem;color:blue;text-align:center;
             background-color:yellow;padding:8px;padding:0.5rem;border:4px solid #ff4500;border-width:0.25rem;border-radius:16px;border-radius:1rem;}

input, textarea {border: 0.25em solid grey; border-radius:12px;font-size: 1em;padding: 0.25em 0.5em 0.25em 0.5em; background-color: #eeeeee; margin: 0.25em;}
input[type=button] {cursor:pointer;}
::placeholder {color: #aaaaaa;}
form .sup, .fehler {color:red;}
.fehler, #verify {display:none;}

.infoError  {color:red;}
.cb         {width:2.3em;text-align:center;}
.klick      {color:blue;text-decoration:underline;cursor:pointer;}
.vb         {width:190px;height:55px;background-color:#FFFF80;text-align:center;}

summary::-webkit-details-marker,	
summary::marker {font-size: 1em;font-weight: bold;transition: all 0.5s;}	

.gallery {position: absolute;right:0.5rem;top:-1.8rem;background: none;border: none;}
.gallery > figcaption  {position: absolute;right:14.125rem;bottom:2.5rem;color:white;white-space:nowrap;}

.gallery > figure {position: absolute;display: inline-block;bottom:2rem;right:-3rem;z-index: 1;animation: wechseln 40s infinite;background-color:white;}


.gallery > figure figcaption, .bg {color: black;font-size:1.1em;text-align:center;white-space:nowrap;
                                   margin: 0;padding:0.2rem 0.5rem 0.2rem 0.5rem;width:250px;width:15.625rem;
                                   border-radius:8px;border-radius:0.5rem;}
.gallery > figure figcaption {position: absolute;right:-2.5rem;top:-1.2rem;background-color:transparent;border:1px solid transparent;z-index: 2;}
.bg                          {position: absolute;right:0;top:-4.95rem;background-color:#cccccc;border:1px solid #800000;border-width:0.068rem;z-index:7;}

@keyframes wechseln {0% {opacity: 0;transform:scaleX(0);z-index: 8;}
	                 3% {opacity: 1;transform:scaleX(1);z-index: 10;}
	                 9% {opacity: 1;transform:scaleX(1);}
                    12% {opacity: 0;transform:scaleX(0);z-index: 9;}
                    22% {opacity: 0;z-index: 8;}
                    32% {opacity: 0;z-index: 6;}
	               100% {opacity: 0;}
}

.gallery figure:nth-of-type(2) {animation-delay: 4s;opacity: 0;}
.gallery figure:nth-of-type(3) {animation-delay: 8s;opacity: 0;}
.gallery figure:nth-of-type(4) {animation-delay: 12s;opacity: 0;}
.gallery figure:nth-of-type(5) {animation-delay: 16s;opacity: 0;}
.gallery figure:nth-of-type(6) {animation-delay: 20s;opacity: 0;}
.gallery figure:nth-of-type(7) {animation-delay: 24s;opacity: 0;}
.gallery figure:nth-of-type(8) {animation-delay: 28s;opacity: 0;}
.gallery figure:nth-of-type(9) {animation-delay: 32s;opacity: 0;}
.gallery figure:nth-of-type(10) {animation-delay: 36s;opacity: 0;}

@media screen and (max-width:64rem) {
  .oben img {width:90vw;height:1.25rem;}
  .text, #imp, summary, details > div > div {font-size:0.9rem;}
  nav, .gallery > figure figcaption {font-size:1rem;}
}
