/* https://www.base64-image.de/ */
/* http://png-pixel.com/ */
/* padding,margin: top  right bot left */
/* 'Vier' Angaben: 1. Wert für oben-links, 2. Wert für oben-rechts, 3. Wert für unten-rechts, 4. Wert für unten-links */
*     { margin:0; padding:0px; }
p     { margin:4px 4px 4px 0px; }
ol,
ul    { margin:4px 4px 8px 20px; }
h2    { margin:8px 4px 8px 0px;  }
body  { font:normal 14px arial,sans-serif; 
        background:#ffe; padding:4px;
      }
.impressum p   { font:normal 14px arial,sans-serif; padding:4px 0px; }
#login,
#impressum,
.bread,
a              { text-decoration:none; padding:0px 8px; color:#008;
                 font:bold 12px/18px arial,sans-serif; 
               }
.register,
.impressum  { margin:78px 8px 10px 32px; width:auto; 
             xbackground-color:#000020;
            }
form#reglog p { display:inline-block; width:100px; color:#f00; } 

li a,
#login a,
#impressum a,
.bread a       { padding:0px;  }
#login a:hover,
#impressum a:hover,
.bread a:hover { color:#08f; background:#eee; }
#login,
#impressum,
.bread         { position:absolute; bottom:2px; }
#login         { left:220px; }
#impressum     { left:136px; }
.bread         { right:4px; color:#557; }
@keyframes fade 
{ 100% { opacity:1; transform:translate3d(0,0,0); }
}
#tophdr  { position:fixed;  top:0; left:0; width:100%; }
#toplin  { background:#ffe; height:4px;    width:100%; }
#topbgl  { background:url(img/bg/alpha.png); 
           border-radius:8px 8px 8px 0; margin:0px 4px 4px 4px;
         }
#top0    { text-align:right;  height:30px;
           margin:4px 8px 4px 204px; margin-right:8px;
         }
h1[id],
h2[id],
h3[id],
h4[id]   { margin-top:-72px; padding-top:72px; }
#leftbar { position:fixed; background:#ffaa1a;
           top:74px; left:4px; 
           border-radius:0 0 8px 8px; height:100%; 
         }
#leftber { background:url(img/bg/plot.png) 0px 54px; height:60px; width:24px; }
#plor    { height:60px;   margin:8px 158px 0px 4px;
           background:url(img/bg/plor.png) 0px -22px; 
         }
#emsr    { background:url(img/bg/plot.png);
           height:54px; background-position:0px -18px;
           padding:14px 0px 14px 0px; width:150px;
         }
#emsrb img,
#emsrb div
{ opacity:0;
  transform:translate3d(0,30px,0);
  transform-style:preserve-3d;
  animation:fade 1s;
  animation-fill-mode:forwards;
  background:url(img/bg/emsr.png);
}
#emsrb #e { background-position:  0px 0px; animation-delay:0s; transform:translate3d(0,-10px,0); }
#emsrb #m { background-position:-29px 0px; animation-delay:0.5s; transform:translate3d(0, 10px,0); }
#emsrb #s { background-position:-58px 0px; animation-delay:0.5s; transform:translate3d(0,-10px,0); }
#emsrb #r { background-position:-87px 0px; animation-delay:1s; transform:translate3d(0, 10px,0); }
#emsrb img { width:29px; height:18px; margin-right: -4px; }
#emsrb img#a { animation-delay:0s; transform:translate3d(0,-10px,0);}
#emsrb img#b { animation-delay:0.5s; transform:translate3d(0, 10px,0);}
#emsrb img#c { animation-delay:0.5s; transform:translate3d(0,-10px,0);}
#emsrb img#d { animation-delay:1s; transform:translate3d(0, 10px,0);}
.inhalt,
#inhalt     { margin:78px 0px 10px 32px; width:auto; }
input#hamburg { display:none;      }
#menu         { width:100%;        }
#menu label   { border-radius:4px; }
#s1, #s2, #s3, #s4 { display:none; }
.sub         { padding:2px 0px;     }
.sub a:hover { color:#08a;         }
input[type=radio] { display:none;  }
input[type=radio] ~ label 
{ background:#008; height:20px; color:#fff;
  padding:2px 8px; display:inline-block;
  border-spacing:0; margin-right:-0px; 
  font:bold 12px/18px arial,sans-serif;
}
input[type=radio] ~ label:hover { background:#08f; } 
input[type=radio]#_1a:checked  ~ label#_1b,
input[type=radio]#_2a:checked  ~ label#_2b,
input[type=radio]#_3a:checked  ~ label#_3b,
input[type=radio]#_4a:checked  ~ label#_4b { background:#ccc; color:#008; }
input[type=radio]#_1a:checked  ~ #s1,
input[type=radio]#_2a:checked  ~ #s2,
input[type=radio]#_3a:checked  ~ #s3,
input[type=radio]#_4a:checked  ~ #s4 { display:block; z-index:5; }
input[type=text]#login,
input[type=text]#search,
input[type=submit]#search { position:absolute; top:4px; height:20px; }
input[type=text]#login,
input[type=text]#search
{ left:140px; width:100px;  width:calc(100% - 524px);  
}
input[type=submit]#login,
input[type=submit]#search
{ left:240px; left:calc(100% - 378px);  width:24px; height:24px;
  background:url(img/alldok20.png) -100px 0px;
}
input[type=submit]#login  { background:url(img/key.png); }

.exe,
.zip,
.pdf,
.lnk,
.logn,
.lupe  { background:url(img/alldok20.png); height:20px; width:20px; }
.exe   { background-position:-20px 0px; }
.zip   { background-position:  0px 0px; }
.pdf   { background-position:-40px 0px;  }
.logn  { background-position:-60px 0px;  }
.lupe  { background-position:-100px 0px;  }
.lnk   { background-position:-160px 0px; }
i.exe,
i.zip,
i.pdf,
i.lnk,
i.logn,
i.lupe { display:inline-block; margin:4px 4px; }
.article a { padding:0px; margin:0px; width:0px; }
a.anchor   { display: block;  position: relative;
             top: -80px;     visibility: hidden;
           }
.article p { margin:8px; }
.article pre { font:normal 14px/18px "Courier New", Courier,
               "Lucida Sans Typewriter", "Lucida Typewriter", monospace;
               color:#000;
               background:#ff0;
             }
.article pre { font:normal 14px/18px Courier,monospace;
               color:#000;
               background:#ff8;
             }