/* ============================== */
/* === Powered by locomputing === */
/* ============================== */


#nav-menue {
width:100%;
position:absolute;
top:0;
left:0;
z-index: 99999999;
}

#nav-menue a {
text-decoration: none;
}
.menue-button {
left: 0;
top: .16em;
color:black;
}



.menue-button {
position:absolute;
margin: 0 auto;
z-index:1000;
width: calc(.9em + ((.9vw - 0.1em) * 3));
height:auto;
}
.menue-button-zu {
visibility:hidden;
}

#nav-menue:target #menu  {
visibility:visible;
margin-top:0;
margin-left:0;
background: white;
}
#nav-menue:target .menue-button-zu  {
visibility:visible;
display: inline-block;
margin-top: 0em;
margin-left: -2em;
}
#nav-menue:target .menue-button-open {
visibility:hidden;
margin-top: 0;
background-color: black;
}


.hamb {
width: calc(.85em + ((.85vw - .1em) * 1));
height: auto;
position: absolute;
top: -.3em;
left: .35em;
}
.kreuz {
width: calc(.9em + ((.9vw - .1em) * 1));
height: auto;
position: absolute;
top: -1em;
left: .35em;
}


#login {
visibility: hidden;
}

#menu {
z-index:999;
background: white;
visibility:hidden;
position:absolute;
top:0em;
left:0em;
overflow:hidden;
width:100%;
height:auto;
font-size:calc(.85em + ((.85vw - 0.1em) * 1));
font-weight: bold;
margin-top:0em;
margin-left:-20em;
padding:.25em .5em 1em .1em;
-webkit-transition: all .85s linear;
transition: all .85s linear;
border:.3em solid gray;
outline: .3em solid gold;
cursor: default;
}
@media screen and (max-width: 950px) {
#menu {
-webkit-transition: all .5s linear;
transition: all .5s linear;
}
}

#menu ul {
padding:0;
margin: 0;
}




#menu ul li {
display:block;
list-style-type: none;
font-weight:bold;
height:calc(1.5em + ((1.5vw - 0.1em) * 1));
padding: 1em 0 .5em 0;
color:#ee0000;
-webkit-text-stroke: .0075em black;
}

#menu ul li.menuk {
color: red;
height:calc(.15em + ((.15vw - 0.1em) * 1));
}
#menu ul li.menuk a {
color: blue;
}

#menu ul li.menua:before{
content:"\25BA";
margin-left:calc(.25em + ((.25vw - .1em) * 1));
padding-right:calc(.5em + ((.5vw - .1em) * 1));
color: #ff3c3c;
font-size: 75%;
-webkit-text-stroke:1pt #a80000;
}

#menu ul li.menub:before{
content:"\25BA";
margin-left:calc(.25em + ((.25vw - .1em) * 1));
padding-right:calc(.5em + ((.5vw - .1em) * 1));
color: #ff3c3c;
font-size: 75%;
-webkit-text-stroke:1pt #a80000;
}

#menu ul li.menuc a{
display:inline;
text-align:center;
text-decoration:none;
background:transparent;
color: #00014f;
}
#menu ul li.menuc:before{
content:"\25BC";
margin-left:calc(.25em + ((.25vw - .1em) * 1));
padding-right:calc(.4em + ((.4vw - .1em) * 1));
color: #00014f;
font-size: 75%;
-webkit-text-stroke:1pt black;
}

#menu ul li.menud a{
display:inline;
text-align:center;
text-decoration:none;
background:transparent;
color: #0001b2;
-webkit-text-stroke: calc(.1em + ((.1vw - .1em) * 1)) black;
}
#menu ul li.menud:before{
content:"\25BA";
margin-left:calc(.25em + ((.25vw - .1em) * 1));
padding-right:calc(.5em + ((.5vw - .1em) * 1));
color: #0002ff;
font-size: 75%;
-webkit-text-stroke:1pt #0001b2;
}

#menu ul li.menue:before{
content:"\25BA";
margin-left:calc(.95em + ((.95vw - .1em) * 1));
padding-right:calc(.5em + ((.5vw - .1em) * 1));
color: #89a3ed;
font-size: 75%;
-webkit-text-stroke:1pt #00789d;
}

#menu ul li.menuf:before{
content:"\25BA";
margin-left:calc(.95em + ((.95vw - .1em) * 1));
padding-right:calc(.5em + ((.5vw - .1em) * 1));
color: #ff3c3c;
font-size: 75%;
-webkit-text-stroke:1pt #8a0000;
}
#menu ul li.menug:before{
content:"\25BA";
margin-left:calc(.25em + ((.25vw - .1em) * 1));
padding-right:calc(.75em + ((.75vw - .1em) * 1));
color: #00bfff;
font-size: 75%;
-webkit-text-stroke:1pt #00789d;
}

#menu ul li:hover:before {
color: #00ea02;
text-decoration: none;
-webkit-text-stroke:1pt green;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
transition-timing-function: linear, ease-in, ease;
-webkit-transition-timing-function: linear, ease-in, ease;
-webkit-transition-delay: 0s, 25ms, 0s;
}

#menu ul li.menua:hover:before {
color: #ff3c3c;
text-decoration: none;
-webkit-text-stroke:1pt #8a0000;
}
#menu ul li.menub:hover:before {
color: #ff3c3c;
text-decoration: none;
-webkit-text-stroke:1pt #8a0000;
}
#menu ul li.menuf:hover:before {
color: #ff3c3c;
text-decoration: none;
-webkit-text-stroke:1pt #8a0000;
}

#menu ul li a:hover {
color: #009d01;
background-color: transparent;
text-decoration: none;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
transition-timing-function: linear, ease-in, ease;
-webkit-transition-timing-function: linear, ease-in, ease;
-webkit-transition-delay: 0s, 25ms, 0s;
}


#login {
visibility: visible;
text-align:center;
font-size:calc(.75em + ((.75vw - 0.1em) * 1));
line-height: 1px;
margin: 1.25em 0 .1em 0;
padding: 1em 15px 8px 0;
}

#user {
margin: 0 auto;
padding:0;
}



.hrline {
height: 2px;
background: black;
margin: 1em 0 5px 0;
}





/* ==================================== 18,75 x 28,125rem ( 300 x 450px ) ================================== */
@media screen and (max-width:500px), screen and (max-height:450px){
#menu {min-height:120vh;}
}
@media screen and (min-width:500px), screen and (min-height:450px){
#menu {min-height:100vh;}
}
/* ==================================== ab 960 pixel ================================== */
@media screen and (min-width: 60em) {


.admenu {
display:block;
}

#aside {
display:block;
height: 100%;
border-right: .3em solid gray;
margin: .135em .35em 0 0;
}

aside {
position: relative;
margin: 0;
padding: 0 0 .14em 0;
}


aside {
  position: relative;
  border-right: .26em solid gray;
  z-index: 1111;
}
aside:before {
  content: ' ';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-right: .4em solid gold;
}


.menue-button {
display:none;
}
#nav-menue {
position:relative;
height:auto;
}

#menu {
	visibility:visible;
	background: transparent;
	padding: calc(1.15em + ((1.15vw - 0.1em) * 1)) 0 0 0;
	text-align:left;
	position:relative;
	font-size:calc(.5em + ((.5vw - 0.1em) * 1));
	margin:0;
width: 100%;
min-height: 95vh;
height: auto;
border: none;
outline: none;
cursor: default;
}
@media screen and (min-width:1920px), screen and (min-height:1080px){
#menu {min-height:96.5vh;height: auto;}
}
@media screen and (min-width:1024px), screen and (min-height:768px){
#menu {min-height:96vh;height: auto;}
}
@media screen and (min-width:960px), screen and (min-height:700px){
#menu {min-height:96.1vh;height: auto;}
}


#menu ul li.menua:before{
margin-left:calc(.4em + ((.4vw - .1em) * 1));
padding-right: .1em;
}
#menu ul li.menub:before{
margin-left:calc(.4em + ((.4vw - .1em) * 1));
padding-right: .1em;
}

#menu ul li.menuc:before{
margin-left:calc(.3em + ((.3vw - .1em) * 1));
padding-right: 0;
}
#menu li.menuc:before{
margin-left:calc(.3em + ((.3vw - .1em) * 1));
padding-right: 0;
}

#menu ul li.menud:before{
margin-left:calc(.4em + ((.4vw - .1em) * 1));
padding-right: .1em;
}

#menu ul li.menue:before{
margin-left:calc(.6em + ((.6vw - .1em) * 1));
padding-right: .1em;
}

#menu ul li.menuf:before{
margin-left:calc(.6em + ((.6vw - .1em) * 1));
padding-right: .1em;
}
#menu ul li.menug:before{
margin-left:calc(.3em + ((.3vw - .1em) * 1));
padding-right: .1em;
}

#menu ul li.menuk {
color: red;
height:calc(.6em + ((.6vw - 0.1em) * 1));
font-size: 111%;
}
#menu ul li.menuk a {
color: blue;
}



#menu li a {
	display:inline-block;
	width: 80%;
}


#menu ul {
	margin:0;
	padding:0;
	list-style: none;
}

#menu ul li {
display:block;
list-style-type: none;
font-weight:bold;
margin-left: -.15em;
height:calc(1.1em + ((1.1vw - 0.1em) * 1));
padding:0;
-webkit-text-stroke: .0075em black;
}


#menu ul li.menuc a {
	display:inline-block;
	text-align: left;
}

#menu ul li.menud a {
-webkit-text-stroke: .0075em black;
	display:inline-block;
	text-align: left;
}

#menu ul li a:hover {
color: green;
background-color: transparent;
text-decoration: none;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
transition-timing-function: linear, ease-in, ease;
-webkit-transition-timing-function: linear, ease-in, ease;
}

#login {
visibility: visible;
text-align:center;
font-size:calc(.55em + ((.55vw - 0.1em) * 1));
line-height: 1;
margin: calc(.25em + ((.25vw - 0.1em) * 1)) 0 calc(.5em + ((.5vw - 0.1em) * 1)) 0;
padding: .5em 15px 8px 0;
}

#user {
display: block;
height: auto;
margin: 0 auto 1em auto;
padding:0;
}

.hrline {
height: 2px;
background: black;
margin: .25em 0 .1em 0;
}

}


.hallo {
color:navy;
text-align: center;
}


.logtext {
text-align: center;
font-size: 125%;
margin-bottom: .5em;
color:navy;
}



#nav-menue [data-title]:hover:after {
    opacity: 1;
    transition: all 0.5s ease 0.5s;
    visibility: visible;
}
#nav-menue [data-title]:after {
    content: attr(data-title);
    background-color: white;
    color: #111;
    font-size: .75em;
    position: absolute;
    padding: 0 .25em;
    bottom: .15em;
    left: 2em;
    white-space: nowrap;
    opacity: 0;
    z-index: 999989;
    visibility: hidden;
}
#nav-menue [data-title] {
    position: relative;
}




#menu [data-title]:hover:after {
    opacity: 1;
    transition: all 0.5s ease 0.5s;
    visibility: visible;
}
#menu [data-title]:after {
    content: attr(data-title);
    background-color:white;
    color: green;
    font-size: 100%;
    position: absolute;
    height: 50px;
    height: calc(1.15em + ((1.15vw - 0.1em) * 1));
    padding: 0;
    top: -2px;
    left: -2px;
    white-space: nowrap;
    opacity: 0;
    z-index: 99997;
    border: 2px solid transparent;
    visibility: hidden;
}
#menu [data-title] {
    position: relative;
}





























