:root {
	--hellgrau: #F3F3F3;
	--mittelgrau: #B3B3B3;
	--dunkelgrau: #585858;
	--fastschwarz: #2F2D2C;
	
	--hell: #f3e4ef;
	--mittel: #e5c5dc;
	--dunkel: #8b6b86;
	--sehrdunkel: #604a5c;
	
}
/*
:root {
  --hellgrau: #F3F3F3;
  --mittelgrau: #B3B3B3;
	--dunkelgrau: #585858;
	--fastschwarz: #2F2D2C;
	
	--hell: #E7F4CC;
	--mittel: #D9F0A8;
	--dunkel: #9acd32;
	
}

:root {
  --hellgrau: #F3F3F3;
  --mittelgrau: #B3B3B3;
	--dunkelgrau: #585858;
	--fastschwarz: #2F2D2C;
	
	--hell: #EEFAFF;
	--mittel: #C0E2F1;
	--dunkel: #00ccff;
}

*/


* {
	font-family: Helvetica, sans-serif;
}

a {
    text-decoration: none;
    outline: none;
	 color: var(--fastschwarz);
}



object {
  width: 30%; 
  height: auto;
}

table{
	border-collapse:collapse;
}

#lmausgabe{
	width:90%;
	font-size: 11px;
}

td, th{
	vertical-align: middle;
	padding:5px;
}
td.del {
	padding-left: 10px;
	width:21px;
}

tr.lmbglight {
	background-color: var(--hell);
}

tr.lmbgdark {
	background-color: var(--hellgrau);
}

.button {
	text-align: center;
}

.button,
input[type="email"],
input[type="date"],
input[type="password"],
input[type="text"],
input[type="submit"],
input[type="number"] {
	
	width:96%;
	font-size:1.5em;
	outline: 0;
	transition: border-color 1s;
	border-style: solid;
	border-color: var(--mittelgrau);
	border-width: 2px;
	text-decoration: none;
	display: inline-block;
	cursor: pointer;
	border-radius:6px;
	font-family: Helvetica, sans-serif; 
	padding: 2px;
}
.button,
input[type="submit"] {
	background-color: var(--sehrdunkel);
	color: var(--hell);
}

input[type="email"],
input[type="date"],
input[type="password"],
input[type="text"],
input[type="number"] {
	background-color: var(--mittel);
	color: var(--sehrdunkel);
}

.button:hover,
input[type="submit"]:hover {
	border-color: var(--dunkel);
	color: var(--fastschwarz);
}

input[type="email"]:focus,
input[type="date"]:focus,
input[type="password"]:focus,
input[type="text"]:focus,
input[type="number"]:focus {
	border-color: var(--dunkel);
	color: var(--dunkelgrau);
}

label {display: block; padding: 1ex; }

input.float {
	width:45%;
}

/*header*/
#menubar {
    display: block;
    background: #ffffff;
}
#menubar img {
  max-width: 2em;
}
#menubar div { 
    display: block;
    padding: 0.9em;
    max-width: 100%;
}
#menubar  a.menubutton{
    display: none;
}

/*Navigation*/

nav {
	 font-size: 86%;
    display: block;
    height: 2.5em;
    background: #ffffff;
    /*width: 96%;*/
	 text-align: left;
    /*margin-left:auto;
    margin-right:auto;*/
    padding-bottom: 2em;
}

nav ul{
    display:block;
}
/* margin:top right bottom left; */

nav ul li{
    display: inline;
    margin:0em 0.118em 0em 0.118em;
}

nav ul li a{
    color: #000000;
    font-size:1.125em;
    line-height: 2.5em;
    padding: 0.563em 0.938em 0.375em 0.983em;
    transition: 0.2s;
    -webkit-transition: background 0.2s;
}

nav ul li a.logout{
    color: var(--sehrdunkel);
    font-size:1.125em;
    line-height: 2.5em;
    padding: 0.563em 0.938em 0.375em 0.983em;
    transition: 0.2s;
    -webkit-transition: background 0.2s;
}

nav ul li a:hover{
    /*background: #DBD9D8;*/
    color: var(--dunkelgrau);
    border-bottom: 0.188em solid var(--dunkel);
}

nav ul li a.active{
    border-bottom: 0.188em solid var(--dunkel);
    /* font-weight:bold; */
    color: var(--dunkelgrau);
}


/*Mobile Style*/

@media screen and (min-width: 700px) {
    nav.nav{
        display:block !important;
        text-align: left;  
    }
}

@media screen and (max-width: 700px) {

    #menubar div a.menubutton{
			display: block;
			margin-left:90%;
    }
    
    nav{
        display: none;
        height: auto;
        font-size: 100%;
    }
    nav ul li{
        display: block;
		  text-align: right; 
        margin: 0.3em 2em 0.3em 0em;
    }
}