* {
    padding: 0;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
}

body {
    background-color: rgb(207, 207, 207);
}
#benutzer_daten-allgemein{
    font-weight: bolder;
}
/*  Login */
#download_icon{
    height: 25px;
}

#calender_img{
    height: 25px;
}

#login_box{
    color:          rgb(0, 0, 0);
    display:        block;
    margin:         auto;
    margin-top:     10px;
    box-sizing:     border-box;
    border-radius:  20px;
    background:     #b90129;
    width:          350px;
    font-family:    Arial, Helvetica, sans-serif;
	text-align:     center;
}

#login_img{
    width: 340px;
}

#text_login_end{
    color: white;

}


.listerubrik{
    width: 100%;
}
.button1{
    background-color: rgb(131, 133, 121);
    color: black;
    border: 0px solid rgb(207,207,207);
    font-size: 13px;
    width: 110px;
    height: 30px;

}
.button1:hover {
    background-color: rgb(170, 170, 170);
  }

.button2{
    color: black;
    background-color: rgb(131, 133, 121);
    font-size: 13px;
    width: 100%;
    height: 30px;
}
.button3{
    color: black;
    background-color: rgb(0, 255, 0);
    font-size: 13px;
    width: 100%;
    height: 30px;
}
.button2:hover {
    background-color:  rgb(141,84,13);
  }
.button3:hover {
    background-color: rgb(40, 255, 40);
  }

  .button4{
    background-color: rgb(141,84,13);
    color: black;
    border: 0px solid rgb(141,84,13);
    font-size: 13px;
    width: 110px;
    height: 30px;

}
.button5{
    background-color: rgb(170, 170, 170);
    color: black;
    border: 0px solid rgb(170, 170, 170);
    color: white;
    font-size: 13px;
    width: 110px;
    height: 30px;

}
.button5:hover {
    background-color: rgb(204, 204, 204);
  }

.button4:hover {
    background-color: rgb(116, 191, 2);
    color: black;
  }

  .button9{
    background-color: rgb(187, 187, 187);
    color: black;
    border-color: black;
    border-radius: 4px;
    font-size: 13px;
    padding: 2px;
    width: auto;
    height: auto;
    min-height: 22px;
    margin-right: 10px;

}
.button9:hover {
    background-color: rgb(116, 191, 2);
  }

  tr:hover { 
    background-color: rgb(135, 202, 34);
} 




.logo_start{
    display: block;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
}

.passfoto{
    display: block;
    height: 200px;
}
.passfoto_daten{
    position: absolute;
    height: 170px;
    left: 550px;
    top: 152px;
}
.gmap{
    left: 550px;
    top: 350px;
    position: absolute;
}

#header_ueberschrift1{
    font-size: 1em;
}

#header_ueberschrift2{
    font-size: 0.5em;
}
#nav_start{
    text-align: center;
}

#nav_module{
    text-align: left;
}

header{
    min-height: 80px;
	text-align: center;
    font-size: 3em;
    font-weight: bolder;
	width: 100%;
    height: 50px;
    margin-left: 0px;  
    margin-top: 0px;
    margin-right: 0px;  
    display: block;
    background: rgb(207, 207, 207);
    color:  rgb(141,84,13);
}
#ueberschrieft{
    margin: auto;
    text-align: center;
}

#impressum{
    margin: auto;
    text-align: center;
}

/*9. Flexboxen */
#container {
	min-height: 100%;
	text-align: left;
	width: 100%;
    height: 100%;
    margin-left: 0px;  
    margin-top: 0px;
    margin-right: 0px;  
    display: flex;
    background: rgb(207, 207, 207);
}
#zugangsenden{
    color: rgb(207, 207, 207);
    font-size: 0px;
    display: flex;
}





#left {
	min-height: 100%;
    text-decoration: none;
    margin-top: -80px;
	float: left;
	width: 140px;
    height: 100%;
	background: rgb(207, 207, 207);
	overflow: hidden;
    color: rgb(255, 0,0 );
    
}

#left_ersatz {
	
    display: none;
    
}

#center {
	min-height: 700px;
    align-items: center;
    justify-content: center;
	float: left;
    background: rgb(131, 133, 121);
	overflow: hidden;
    flex-grow: 1;
    
}
#abstand {
	width: 10px;
	float: left;
    background: rgb(131, 133, 121);
}

#right {
	min-height: 100%;
	float: right;
	width: 200px;
    height: 400px;
    margin-left: 10px;
    background: rgb(207, 207, 207);
	overflow: hidden;
    
}



nav{

    min-height: 40px;
    max-width: 100%;

    display: block;

    justify-content: space-between;

    align-items: center;

    background-color: rgb(131, 133, 121);

    color: white;

}

#nav_logo{
    display: flex;

    margin: auto;

    width: 80%;
}

#nav_logo_software{
    
    display: flex;

    margin: auto;

    width: 80%;

}

nav ul{

    display: flex;

}

nav ul li{

    height: 100%;

    padding: 30px;

    list-style-type: none;

    border-bottom: 4px solid rgb(42,42,42);

}

div ul li{
    height: 20px;
    
}

nav ul li:hover{

    border-bottom: 4px solid rgb(111,0,255);

}

nav ul li a{

    color: white;

    text-decoration: none;

    font-size: 22px;

    font-family: sans-serif;

}

#left nav{

    min-height: 100%;

    display: flex;

    justify-content: space-between;

    align-items: center;

    background-color: rgb(207,207,207);

    color: white;

}

.nav_logo{

    margin: 20px;

    font-size: 30px;

    font-family: sans-serif;

    font-style: italic;

}

nav ul{

    display: flex;

}

nav ul li{

    height: 100%;

    padding: 30px;

    list-style-type: none;

    border-bottom: 4px solid rgb(42,42,42);

}

nav ul li:hover{

    border-bottom: 4px solid rgb(111,0,255);

}

nav ul li a{

    color: white;

    text-decoration: none;

    font-size: 22px;

    font-family: sans-serif;

}



.toggle-button{

    position: absolute;

    top: 15px;

    right: 25px;

    display: none;

    flex-direction: column;

    justify-content: space-between;

    width: 30px;

    height: 23px;

}



.toggle-button .bar{

    height: 4px;

    width: 100%;

    background-color: white;

    border-radius: 100px;

}
.listerubrik-button{

    position: absolute;

    top: 15px;

    left: 25px;

    display: none;

    flex-direction: column;

    justify-content: space-between;

    width: 30px;

    height: 23px;

}
.nav_mobie_rubrik{
    display: none;
}



.listerubrik-button .bar{

    height: 4px;

    width: 100%;

    background-color: white;

    border-radius: 100px;

}

#abfrageformular_text1{
    position: relative;
    left: 15px;
}
#abfrageformular_text2{
    position: relative;
    left: 30px;
}
#abfrageformular_text3{
    position: relative;
    left: 45px;
}
#abfrageformular_text4{
    position: relative;
    left: 60;
}
#abfrageformular_text5{
    position: relative;
    left: 75;
}
#abfrageformular_text6{
    position: relative;
    left: 90;
}

#checkbox_button_3{
    position: absolute;
    left: 550px;
    top: 152px;
    display: none;
}

@media(max-width:850px){

    .passfoto_daten{
        display: none;
    }


    .gmap{
        display: none;
    }


    .button1{
        
    width: 100%;

    }
    #nav_logo{
        display: none;
    }

    header{
        font-size: 1em;
    }

    

    .list-container{

        display: none;

        width: 100%;

    }
    #left{

        display: none;

        width: 100%;

    }
    #left nav{

        display: none;

    }

    .toggle-button{

        display: flex;

    }
    .listerubrik-button{

        display: flex;

    }

    nav{

        flex-direction: column;
        align-items: flex-start;

    }
    #left_ersatz{
        display: flex;

    }

    .list-container ul{

        flex-direction: column;
        text-align: center;
        width: 100%;

    }

    .list-container li{

        text-align: center;

    }

    .list-container.active{

        display: flex;

    }



    .nav_mobie_rubrik{

        display: none;

        width: 100%;

    }
    .nav_mobie_rubrik ul{

        flex-direction: column;

        width: 100%;

    }

    .nav_mobie_rubrik li{

        text-align: center;

    }
    .nav_mobie_rubrik.active{

        display: flex;

    }

}