/************ MAIN ***************/

body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    overflow-x: hidden;
    font-family: 'Roboto', 'Oswald';
    width: 100%;

}

::selection {
    background-color: #00469d;
    color: #f45f0a;
    
}

a {
    text-decoration: none;
}

/************ LOGIN ***************/
.containerlogin{
    width: 100%;
    height: 100vh;
}

.containerlogin video {
    object-fit: cover;
    width: 100%;
    height: 100%;
    
    top: 0;
    left: 0;
    z-index: 10;
  }

.logincontent {
    position: fixed;
    bottom: 30%;
    background: rgba(0, 0, 0, 0.7);
    color: #f1f1f1;
    width: 100%;
    padding: 30px;
    text-align: center;
}

.logincontent input {
    color: #000;
    background: #fff;
    width: 33%;
    height: 35px;
}


.logincontent .submit {
    border: solid #f45f0a 1px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: #fff;
    background: none;
    padding: 0;
    transition: 1s;
}

.logincontent input[type="submit"]:hover {
    border: solid #fff 1px;
    color: #00469D;
    font-weight: bold;
    background: #f45f0a;
    transition: 1s;
}

/*
.containerlogin  {
    width: 100%;
    height: 100vh;
    background: url(             ) 50% 50% no-repeat;
    overflow: hidden;
    font-family: 'Oswald';
    color: #fafafa;
    padding-top: 2rem;
}

.containerlogin h1 {
    font-weight: 300;
    font-size: 60px;
    letter-spacing: 0.6px;
    padding-left:  2rem;
    text-transform: uppercase;
}

.loginform {
    width: 100%;
    text-align: center;
    line-height: 50px;
    margin-top: 5%;
}

.loginform input {
    color: #000;
    background: #fff;
    width: 20%;
    height: 30px;
}


.loginform select {
    color: #000;
    background: #fff;
    width: 20%;
    height: 30px;
}

.loginform .submit {
    border: solid #f45f0a 1px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: #fff;
    background: none;
    padding: 0;
}

.loginform input[type="submit"]:hover {
    border: solid #fff 1px;
    color: #000;
    background: #f45f0a;
    transition: 1s;
}


@media screen and (max-width: 650px) {
    .containerlogin {
        padding-top: 3rem;
        background: 50% 40% no-repeat ;
    }

    .loginform input {
        width: 100%;
        height: 40px;
    }
    
    
    .loginform select {
        width: 40%;
        height: 40px;
    }
    
    .loginform .submit {
        width: 40%;
        height: 40px;  
    }
}

@media screen and (max-width: 430px) {
    .containerlogin {
        padding-top: 3rem;
        background: 50% 0% no-repeat ;
    }
}

/************ ALARMMONITOR STANDART ***************/

.containerams {
    background:#202020;
    color: #c1c1c1;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

.picams {
    text-align: right;
    float: right;
    margin: 8px;
}

.picams img {
    width: 12rem;
    height: 10rem;
    margin: 5px;   
}

.contentams {
    margin-top: 15%;
    text-align: center;
    font-family: 'Oswald';
}

.contentams h1 {
    font-size: 80px;
    text-transform: uppercase;
    font-weight: 700;
    margin: 0;
    letter-spacing: 1px;
}

.contentams h2 {
    margin: 0;
    text-transform: lowercase;
    font-size: 20px;
    font-weight: 100;
    letter-spacing: 3px;
}

.clockams {
    font-family: 'Oswald';
    font-size: 55px;
    margin: 20px;
    text-align: left;
    bottom: 0;
    position: fixed;
    width: 100%;
    letter-spacing: 1.3px;
    display: flex;
}

.timeams {
    width:100%;
}

.weatherams {
    font-size: 110px;
    width: 100%;
    text-align: right;
    padding-right: 35px;
}

.timedataams {
    font-size: 80px;
    padding: 0;
    margin: 0;
    line-height: 0;
}

.datedataams {
    font-size: 60px;
    font-weight: 200;
    padding: 0;
    margin: 0;
    letter-spacing: 3px;
    line-height: 0;
}


/************ ALARMMONITOR ALARM ***************/

.containerama {
    background:#202020;
    color: #fafafa;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    font-family: 'Roboto';
    
}

.headerama {
    display: flex;
    padding: 20px 10px 20px 10px;
    border-bottom: solid #c1c1c1 1px;
}

.first {
    width: 100%;

}

.first h1 {
    font-size: 70px;
    margin:0;
    letter-spacing: 2px;
    font-weight: bold;
}

.first h2 {
    font-size: 40px;
    margin: 0;
    letter-spacing: 1.5px;
}

.spaceama {
    width: 100%;
}

.second {
    width: 150px;
    text-align: right;
}

.third {
    width: 40%;
    text-align: left;
}

.second h3,
.third h3 {
    font-size: 25px;
    letter-spacing: 1px;
    margin: 6px;
    text-align: left;
}

.contentama {
    width: 100%;
    height: 70vh;
    padding: 5px;
    display: flex;
    overflow: hidden;
    
}

.leftama {
    width: 100%;
    padding: 5px;
}

.rightama {
    width: 100%;
    border-left: 3px solid #fafafa;
    padding: 5px 16px 5px 5px;
}

.atextama {
    border-bottom: 3px solid #fafafa;
    font-size: 30px;
    padding: 3px 3px 40px 3px;
    text-align: justify;
}

.karteama {
    padding: 7px 0;
}

#mapid {
    height: 45vh ;
    
}


.fahrzeugeama {
    width: 100%;
    display: flex;
    font-size: 30px;
    font-family: 'Roboto';
}


.row {
    width: 100%;
}

.rowspace {
    width:30px;
}

.card {
    padding: 1px;
    padding-left: 5px;
    border: solid #fafafa 1px;
    margin: 15px 5px;
    letter-spacing: 1px;
    display: flex;
    font-family: 'Roboto'; 
}

.cardtitel{
    width: 100%;
}

.status {
    width: 30px;
    text-align: center;
    border: solid #fff 1px;
}

.status.null,
.stat.null {
    background: #45818E;
}
.status.one,
.stat.one {
    background: #93C47D;
}
.status.two,
.stat.two {
    background: #6AA84F;
}
.status.three,
.stat.three {
    background: rgb(235, 220, 12);
    color:#000;
}
.status.four,
.stat.four {
    background: #CC0000;
}
.status.five,
.stat.five {
    background: #76A5AF;
}
.status.six,
.stat.six {
    background: rgb(172, 173, 172);
}
.status.seven,
.stat.seven {
    background: #EA9999;
}
.status.eight,
.stat.eight {
    background: #B4A7D6;
}
.status.nine,
.stat.nine {
    background: #B6D7A8;
}


.card.choose,
.fahrzeugcontainerlso.choose{
    border: red solid 3px;
}

.card.choose .cardtitel {
    color: red;
}

.bottomcontainer {
    width: 100%;
    display:flex;
    padding: 5px;
    height: 100%;
}

.alarmtext {
    width: 100%;
    height: 100%;
    padding: 10px;
}

.alarmtext h1 {
    font-weight: 200;
    font-size: 20px;
    letter-spacing: 1.5px;
}

.alarmtext p {
    font-size: 30px;
    letter-spacing: 1px;
    line-height: 40px;
}

/*.textama {
    text-align: center;
    padding: 10px 10px;
    font-size: 25px;
} 

.textama p {
    padding: 10px 60px;
}

.textama h1 {
    font-size: 20px;
    font-weight: 200;
    padding: 5px;
    text-align: left;
}*/

/************ Leitselle Overview ***************/

.containerlso {
    font-family: 'Roboto';
    background: #c1c1c1; /*dfdddd*/
    margin: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

.headerlso {
    width: 100%;
    display: flex;
}

.headertextlso {
    width: 100%;
    padding-left: 10px;
}

.headertextlso h1 {
    font-size: 30px;
    letter-spacing: 1px;
    font-weight: 400;
    margin: 15px 0 0 0;
}

.headertextlso h2 {
    margin-top: 5px;
    margin-bottom: 0;
    font-size: 15px;
    letter-spacing: 1.5px;
    font-weight: 200;
    font-family: 'Roboto';
    padding-left: 5px;
}

.headertextlso .lsoone {
    color: #f45f0a;
    
}

.headertextlso .lsotwo {
    color: #00469d;
}

.headertextlso .lsothree {
    text-transform: none;
}

.headerinfolso {
    text-align: right;
    width: 20%;
    padding: 15px 45px 0 0;
    line-height: 25px;
}

.homelink {
    font-size: 45px;
    padding: 10px 50px 0 0;
    justify-content: center;
}


.homelink a,
.homelink a:hover {
    color: #000;
}

.line {
    border: #8f8f8f dotted 0.1px;
    margin: 5px 0;
}

.buttonslso {
    width: 100%;
    display: flex;
    padding: 7px 10px 7px 10px;
    text-align: center;
    justify-content: center;
}

.buttonlso {
    width: 100%;
    font-size: 15px;
    text-transform: uppercase;
    line-height: 25px;
    border: #303030 solid 0.5px;
    cursor: pointer;

}

.buttonlso a {
    color: #202020;
    text-decoration: none;
}

.buttonspacelso {
    width: 50%;
}

.buttonspacelsotwo {
    width: 20%;
}

.contentlso {
    display: flex;
    padding: 5px;
    height: 70vh;
}

.tabellso { /*main*/
    width: 100%;
    padding: 5px;
    height: 100%;
}

.overviewonelso { /*sub*/
    margin-bottom: 10px;
    height: 60%;
    border: solid #8f8f8f 0.5px;
    overflow: auto;
    padding: 5px 2px;
    max-width: 100%;
}

.overviewonelso td a,
.overviewonelso td a:hover {
    color: #000;
    text-decoration: none;
}

.overviewtwolso { /*sub*/
    height: 32%;
    border: solid #8f8f8f 0.5px;
    padding: 5px 2px;
    overflow: auto;
}

.fahrzeugelso { /*main*/
    width: 70%;
    padding: 10px;
}

.fahrzeugecontentlso {
    height: 100%;
    border: solid #8f8f8f 0.5px;
    padding: 5px 2px;
    overflow: auto;
}

.overviewheaderlso {
    text-transform: uppercase;
}

.overviewheaderlso a {
    color: #000;
    text-decoration: none;
    text-transform: none;
}

.overviewheaderlso table {
    font-size: 12px;
}

.fahrzeugcontainerlso {
    display: flex;
    width: 100%;
    background: #8f8f8f;
    border: #202020 dotted 1px;
    margin-bottom: 5px;
}

.fahrzeugecontentlso a,
.fahrzeugecontentlso a:hover {
    color: #000;
    text-decoration: none;
}

.datalso {
    width: 100%;
    padding: 0 0 0 10px;
}

.titellso {
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 1px;
}

.funklso {
    letter-spacing: 2px;
}

.funklso a {
    color: #000;
    text-decoration: none;
}

.statuslso {
    width: 45px;
}

.stat {
    text-align: center;
    font-size: 30px;
    height: 100%;
}

.buttonslso a,
.buttonslso a:hover {
    color:#000;
    text-decoration: none;
    width: 100%;
}

/************ Leitselle neuer Einsatz ***************/
/*MAIN*/
.containerae {
    font-family: 'Roboto';
    background: #c1c1c1;
    margin: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    
}

.datacontainerae {
    display: flex;
    width: 99%;
    height: 85vh;
    padding: 5px;
    justify-content: center;
    font-size: 18px;
}

.datacontainerae h5{
    font-size: 13px;

}


.leftside {
    width: 100%;
    height: 98%;
    padding: 0 20px;
    overflow-y: auto;
    overflow-x: hidden;
}

.rightside {
    width: 100%;
    height: 98%;
    padding: 0 20px;
}

.rightsideidls {
    width: 75%;
    height: 98%;
    padding: 0 20px;
}

.formspace {
    margin: 23px 0;
}

.columnspace {
    width: 30px;
}

.priobtn {
    width: 100%;
}

/*DATUM*/
.datumae {
    display: flex;
    margin-top: 7px;
}

.datumone {
    width: 60%;
}

.datumtwo {
    width: 60%;
}
/*ORT*/
.ortae {
    padding: 5px 5px ;
    border: solid #8f8f8f 1px;
}

.ortae input[type="text"],
.ortae input[type="search"],
.ortae select{
    background-color: #F9CB9C;
    font-size: 16px;

}

.tzae {
    padding: 5px 5px ;
    border: solid #8f8f8f 1px;
}

.tzae input[type="text"],
.tzae input[type="search"],
.tzae select{
    background-color: #FFD99C; 
    font-size: 16px;

}

.ortrowone,
.ortrowtwo,
.ortrowthree {
    display: flex;
}

.oneae {
    width: 100%;
}

.twoae {
    width: 10%;
    text-align: center;
    
}

.threeae {
    width: 15%;
    text-align: center;
}

.bortae {
    background-color: #F9CB9C;
    font-weight: bold;
}
/*Infos*/
.infoae {
    padding: 10px 5px;
    border: #8f8f8f solid 1px;
}

.inforowone {
    display: flex;
}

.infoae input[type="text"],
.infoae input[type="search"],
.infoae select {
  background: #FFE599;
  font-size: 18px;
  width: 100%;
}

/*ANRUFERDATEN*/
.anruferae {
    padding: 10px 5px;
    border: #8f8f8f solid 1px;  
}

.anruferrowone {
    display: flex;
}

.anruferae input[type="text"],
.anruferae input[type="tel"] {
  background: #B6D7A8;
  font-size: 18px;
  width: 100%;
}

/*ILS-Daten*/
.lstae {
    padding: 10px 5px;
    border: #8f8f8f solid 1px;  
}

.lstae input[type="text"],
.lstae input[type="date"], 
.lstae input[type="time"] {
  background: rgb(228, 228, 228);
  font-size: 18px;
  width: 100%;
}
/*Text*/
.textae textarea{
    width: 100%;
    background: #D5A6BD;
    border: solid #8f8f8f 1px;
    height: 80px;
}

/*Patientendaten*/
.patientae {
    padding: 10px 5px;
    border: #8f8f8f solid 1px; 
}

.patientrowtwo table{
    font-size: 15px;
}

.bortpat {
    background-color: #A2C4C9;
    font-weight: bold;
    width: 100%;
}

.patientrowone {
    display: flex;
}

.label {
    width: 220px;
    margin: 0;
    padding: 0;
}

.patientae input[type="number"],
.patientae input[type=text],
.patientae select {
    background: #A2C4C9;
}

.patientae input{
    background: #A2C4C9;
}

.fourae {
    width: 60px;
    padding: 0;
}

.fiveae {
    width: 100px;
    padding: 0;
}

.sixae {
    width: 65%; 
}

.patientrowtwo {
    display: flex;
}

.patientrowtwo input{
    width: 100%;
}
/*Fahrzeuge B4A7D6*/
.fahrzeugeae {
    background: #c1c1c1;
    margin-top: 5px;
    padding: 10px 5px;
    border: #8f8f8f solid 1px; 
    max-height: 44rem;
    overflow-y: scroll;
    margin-bottom: 15px;
}

.fahrzeugeae table tr td,
.fahrzeugeae table tr th{
    border: solid 1px #000;
    padding: 5px 10px;
    margin: 0;
}

.buttonae input[type="submit"],
.buttonae button {
    width: 20px;
    background: rgb(231, 234, 255);
    color: #000;
    letter-spacing: 2px;
    font-size: 18px;
    border: 1px solid;
    
}

.buttonae .ortrowone .buttonlae {
    display: inline-block;
    height: 38px;
    padding: 0 30px;
    color: #555;
    text-align: center;
    font-size: 11px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #bbb;
    cursor: pointer;
    box-sizing: border-box;

    width: 100%;
    background: #E06666;
    color: #000;
    letter-spacing: 2px;
}

.tableboxae  {
    padding: 10px 5px;
    border: #8f8f8f solid 1px;  


}

.tablecontainerae {
    max-height: 20rem;
    overflow-y: auto;
    margin-bottom: 5px;
}

.tableboxae table,
.tablecontainerae #einsatzmitteluebersicht table.emtable {
    width: 100%;
    font-size: 13px;
    table-layout: auto;

}

.tableboxae table a {
    text-decoration: none;
    color: #000;
}

.tableboxae th,
table.emtable th {
    padding: 5px 5px;
    text-align: center;
    font-weight: 600;
}

.tableboxae td,
table.emtable td{
    padding: 5px 10px;
    text-align: center;
    font-size: 13px;
}


.choose,
#choose {
    background: #f1f;
}

.alarmgone {
    background: #E06666;
}

.stateone {
    background: #93C47D;
}

.timestreak {
    background: #FFE599;
    color:#000;

}

table tr td.lefttext {
    text-align: left;
}

.meldungadd{
    display: flex;
}

.meldungadd input{
    width: 100%;
    height: auto;
}

.meldungadd input[type="submit"] {
    width: 30%;
    background: whitesmoke;
}


/************ Leitselle neuer Einsatz ***************/

.containerida {
    padding: 10px 5px;
    border: #8f8f8f solid 1px;
    height: 80vh;
}

.uhrida {
    display: flex;
}





.vorschauida {
    height: 100%;
}

.vorschauida textarea {
    width: 100%;
    height: 15vh;
    background: #c1c1c1;
    border: none;
    overflow: auto;
    height: 100%;
}

/************ Leitselle Fahrzeuge ***************/

.datacontainerlsf {
    width: 100%;
    height: 82vh;
    padding: 5px;
    justify-content: center;
    font-size: 18px;
}

.kurzlsf {
    margin: 0 20px 0 7px;
}

.langlsf {
    margin: 0 20px 0 7px;
    padding: 18px 9px;
    overflow: auto;
    height: 40vh;
    border: #8f8f8f solid 1px;
    font-size: 18px;
    display: block;
}

.langlsf td,
.containerida td {
    padding: 5px 7px 5px 0;
}

.langlsf td a {
    color: #000;
    letter-spacing: 1.5px;
    text-decoration: none;
}

.statlsf {
    display: flex;
    margin: 0 20px 0 7px;
    border: #8f8f8f solid 1px;
    padding: 18px 9px;
}

.statuslsf {
    width: 60px;
    border: #202020 solid 1px;
}

.statlsf a,
.statlsf a:hover {
    color: #000;
    text-decoration: none;
}

.spacelsf {
    width: 100%;
}

/************ Leitselle Einsatzupdate ***************/

.containeroneue {
    border: #8f8f8f solid 1px;
    height: 55vh;
    padding: 5px;
    padding-right: 0;
    overflow: auto;
}

.rightue {
    overflow: auto;
    color: #000;
}

.containertwoue textarea {
    width: 100%;
    height: 15vh;
}

.containertwoue input[type="submit"] {
    width: 100%;
    border: #202020 solid 1px;
    letter-spacing: 2px;
}

.buttonue {
    width: 100%;
    display: flex;
}

.buttonue button {
    width: 100%;
}


.buttonue button a{
    color: #000;
    text-decoration: none;
    letter-spacing: 2px;
}

.buttonspaceue {
    width: 30%;
}

/************ Leitselle Einstellungen***************/

.datacontaineres {
    display: flex;
    width: 100%;
    height: 85vh;
    padding: 5px;
    justify-content: center;
    font-size: 18px;
}

.leftsidees {
    width: 25%;
    height: 98%;
    padding: 10px 0px 0 10px;
}

.rightsidees {
    width: 100%;
    height: 98%;
    padding: 0 20px 0 0;
    padding: 10px 15px 0 15px;
}

.menues {
    padding: 5px;
    border: #8f8f8f solid 1px;
    max-width: 90vh;
    max-height: 70vh;
    overflow-y: auto;
}

.menues a{
    color:#000;
    text-decoration: none;
}

.menues li a,
.menues li a:hover{
    color: #000;
    text-decoration: none;
}


.menueescontent {
    color: #000;
    text-decoration: none;
    font-family: 'Oswald';
    letter-spacing: 2px;
    padding: 10px 5px;

}

.contentes {
    width: 98%;
    height: 97%;
    border: #8f8f8f solid 1px;
    padding: 5px;
    overflow-y: auto;
    overflow-x: hidden;
}

.contentes h1 {
    margin: 0 0 10px 0;
    font-weight: normal;
    font-size: 20px;
    font-family: 'Oswald';
    letter-spacing: 2px;
}

.showdbdataes {
    height: 45%;
    width: 100%;
    overflow-y: auto;
    padding: 2px;
    margin-bottom: 15px;
}

.showdbdataes a{
    color: #000;
    text-decoration: none;
}

.buttonlistees {
    display: flex;
    width: 100%;
    margin-bottom: 20px;
}

.buttonlistees a{
    color: #000;
    text-decoration: none;
    width: 100%;
}

.buttones {
    width: 100%;
    border: 1px solid #8f8f8f;
    text-align: center;
    padding: 5px 0;
}

.inputdivtwo{
    display: flex;
    width: 100%;
    

}

.inputdivtwo input[type="submit"] {
    border: 1px solid #fff;
    background: #7BDD89;
    width: 100%;
}

.inputdivtwo input[type="text"],
.inputdivtwo input[type="tel"],
.inputdivtwo input[type="email"],
.inputdivtwo input[type="search"],
.inputdivtwo select {
    width: 100%;
    letter-spacing: 1.5px;
}

.inputdivtwo input[type="date"],
.inputdivtwo input[type="time"] {
    width: 47%;
    letter-spacing: 1.5px;
}

.inputdivtwo input[type="checkbox"] {
    width: 30px;
}

.inputdivtwo textarea {
    width: 100%;
    height: 100px;
    resize: none;
}

.contentes a {
    color: #000;
    text-decoration: none;
}

.wachencontainer {
    width: 97%;
    padding: 10px;
    display: flex;
    border: #8f8f8f solid 1px;
    margin-bottom: 15px;
}

.wachenpic{
    width: 6%;
    margin-right: 15px;
    font-size: 35px;
    text-align: center;
}

.wachenname{
    width: 100%;
}

.wachentitel {
    font-weight: bold;
    font-family: 'Oswald';
    letter-spacing: 3px;
}

.wacheninfo {
    font-size: 15px;
}

/************ Einstellungen ***************/

.objes input[type="submit"],
.objes input[type="text"],
.objes input[type="time"],
.objes input[type="date"],
.objes .ortrowtwo input[type="search"] {
    border: #000 solid 1px;
    background: #c1c1c1;
    letter-spacing: 2px;

}

.showes {
    width: 100%;
    max-height: 40vh;
    overflow: auto;
    padding: 5px;
    margin-bottom: 10px;
}

.showes a,
.showes a:hover {
    color: #000;
    text-decoration: none;
}

.checkboxesav {
    margin-top: 5px;
    padding: 10px 5px;
    border: #8f8f8f solid 1px; 
}

.checkboxes {
    margin-top: 5px;
    padding: 10px 5px;
}

/***** Startseite *****/


nav {
    height: 60px;
    width: 100%;
    background-color: #181818;
    position: fixed;
    z-index: 500;
}

nav ul {
    padding: 0;
    margin: 0;
}

nav li {
    display: inline;
    float: left;
}

nav a {
    display: inline-block;
    width: 100px;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
    padding: 15px 0;
    color: #c1c1c1;
    transition: 1s;
}

nav a:hover {
    color: #c1c1c1;
}

nav a#toggle-btn {
    display: none;
}

@media screen and (max-width: 580px) {
    nav {
          height: auto;
          border-bottom: 0;
    }

    nav ul {
          display: none;
          height: auto;
    }

    nav li {
          width: 100%;
          float: left;
          position: relative;
    }

    nav a {
          text-align: left;
          width: 100%;
          text-indent: 25px;
          background: #202020;
          color: #c1c1c1;
    }

    nav a:hover {
          color: #c1c1c1;
    }

    nav a#toggle-btn:after {
          content: "|||";
          transform: rotate(-90deg);
          width: 40px;
          height: 40px;
          display: inline-block;
          position: absolute;
          right: 5px;
          top: 20px;
    }

    nav a#toggle-btn {
          display: block;
          background: #202020;
          color: #c1c1c1;
          width: 100%;
          position: relative;
    }

    .menu:before, .menu:after {
          content: "";
          display: table;
    }

    .menu:after {
          clear: both;
    }

    .menu {
          zoom: 1;
    }

    nav {
        height: auto;
        border-bottom: 0;
  }

  nav ul {
        display: none;
        height: auto;
  }

  nav li {
        width: 100%;
        float: left;
        position: relative;
  }

  nav a {
        text-align: left;
        width: 100%;
        text-indent: 25px;
        background: #282627;
        background: #fff;/*!!!!!!!!!!!!!!!!!!!!!!*/
        color: #8D8273;
        margin-left: 0px;
        text-transform: uppercase;
  }

  nav a:hover {
        color: #6C6C6C;
        
  }

  nav a#toggle-btn:after {
        content: "|||";
        transform: rotate(-90deg);
        width: 40px;
        height: 40px;
        display: inline-block;
        position: absolute;
        right: 5px;
        top: 20px;
  }

  nav a#toggle-btn {
        display: block;
        background: #282627;
        background: #fff;/*!!!!!!!!!!!!!!!!!!!!!!*/
        color: #8D8273;
        width: 100%;
        position: relative;
        padding-bottom: 0px;
        padding-top: 10px;
  }

  .menu:before, .menu:after {
        content: "";
        display: table;
  }

  .menu:after {
        clear: both;
  }

  .menu {
        zoom: 1;
  }
}

.landingpic {
    width: 100%;
    height: 100vh;
    background: url(pics/startseite/tlf.jpg) 50% 50% no-repeat;
    background-size: cover;
    display: table;
    z-index: -1;
}

.landingpage {
    margin-top: 220px;
    font-family: 'Oswald';
}

.landingpage h1 {
    color: #fff;
    font-weight: 900;
    font-size: 500%;
    text-transform: uppercase;
    margin-bottom: 0;
    text-align: center;
}

.landingpage p {
    color: #fff;
    font-weight: lighter;
    text-transform: uppercase;
    letter-spacing: 10px;
    font-size: 20px;
    text-align: center;
    margin-top: 10px;
}

/*responsive landing page*/
@media screen and (max-width: 820px) {
    .landingpage h1 {
          font-size: 400%;
    }
    .landingpage p {
          letter-spacing: 9px;
          font-size: 18px;
    }
}

@media screen and (max-width: 700px) {
    .landingpage h1 {
          font-size: 300%;
    }
    .landingpage p {
          letter-spacing: 7px;
          font-size: 15px;
    }
}

@media screen and (max-width: 580px) {
    .landingpage h1 {
          font-size: 250%;
    }
    .landingpage p {
          letter-spacing: 5px;
          font-size: 13px;
    }
}

@media screen and (max-width: 450px) {
    .landingpage h1 {
          font-size: 200%;
    }
    .landingpage p {
          letter-spacing: 4px;
          font-size: 11px;
    }
}

@media screen and (max-width: 380px) {
    .landingpage h1 {
          font-size: 200%;
    }
    .landingpage p {
          letter-spacing: 3px;
          font-size: 9px;
    }
}

.footer {
    width: 100%;
    z-index: 90;
    /*background:rgb(93, 164, 192);*/

    padding: 10px 0px;
    font-family: 'Oswald';
    text-decoration: none;
    background: #0E0E0E;
}

.footer a {
    color: #fff;
    text-decoration: none;
}

.copytext {
    text-align: right;
    text-transform: uppercase;
    text-decoration: none;
    color: rgb(255, 255, 255);
    letter-spacing: 1px;
}

/*responsive footer*/

@media screen and (max-width: 730px) {
    .copytext {
          font-size: 10px;
          letter-spacing: 0px;
    }
}

@media screen and (max-width: 450px) {
    .copytext {
          font-size: 9px;
          letter-spacing: 0px;
    }
}

/*.quote {
    padding: 20px 360px;
    background: rgb(232, 232, 232);
}

.quotecontainer {
    padding: 20px;
    text-align: center;
    text-transform: lowercase;
}

.quotetext {
    font-size: 25px;
    letter-spacing: 1.5px;
    font-family: 'Cutive Mono';
}

.quotetext span {
    font-weight: bold;
}

.quotename {
    font-size: 15px;
    letter-spacing: 2px;
    font-weight: bold;
    text-transform: uppercase;
}

@media screen and (max-width: 1405px) {
    .quote {
        padding: 20px 250px;
    }

    .quotecontainer{
        padding: 15px;
    }

    .quotetext {
        font-size: 23px;
    }

    .quotename {
        font-size: 14px;
    }
}

@media screen and (max-width: 1200px) {
    .quote {
        padding: 20px 220px;
    }

    .quotecontainer{
        padding: 13px;
    }

    .quotetext {
        font-size: 20px;
        letter-spacing:  1px;
    }

    .quotename {
        font-size: 13px;
    }
}

@media screen and (max-width: 980px) {
    .quote {
        padding: 18px 150px;
    }

    .quotecontainer{
        padding: 10px;
    }

    .quotetext {
        font-size: 20px;
    }

    .quotename {
        font-size: 12px;
    }
}

@media screen and (max-width: 730px) {
    .quote {
        padding: 20px 100px;
    }

    .quotecontainer{
        padding: 5px;
    }

    .quotetext {
        font-size: 18px;
    }

    .quotename {
        font-size: 11px;
    }
}

@media screen and (max-width: 440px) {
    .quote {
        padding: 20px 50px;
    }

    .quotecontainer{
        padding: 5px;
    }

    .quotetext {
        font-size: 16px;
    }

    .quotename {
        font-size: 9px;
    }
}*/

.info {
    background: #282627;
    color: #fff;
    text-align: center;
}


.columninfo {
    float: left;
    width: 31%;
    
    padding: 0px 10px;
}


.rowinfo:after{
    content: "";
    display: table;
    clear: both;
}

.rowinfo {
    margin-left: 4%;
    padding-top: 6rem;
    padding-bottom: 4rem;
}

.columninfo h1{
    font-size: 90px;
    font-family: 'Raleway';
    font-weight: 300;
    padding-bottom: 10px;
}

.columninfo h2{
    font-size: 18px;
    letter-spacing: 2px;
    line-height: 28px;
    text-align: justify;
    padding: 0 30px;
}

.columninfo h2 a {
    text-transform: lowercase;
    color: #fff;
    text-decoration: none;
    letter-spacing: 3px;


}

/*responsive info*/

@media screen and (max-width: 790px) {
    .columninfo {
          width: 90%;
          padding-top: 20px;
    }

    .rowinfo {
          padding-top: 1.5rem;
    }
}

.contentstart {
    background: rgb(237, 237, 237);
    padding: 2rem 1rem 3rem 5rem;
    font-size: 17px;
    line-height: 25px;
    letter-spacing: 0.5px;
}

.contentbox{
    width: 100%;
    display: flex;
}

.textcontent {
    width: 75%;
    text-align: justify;
}

.textcontent h1 {
    font-family: 'Oswald';
    font-size: 28px;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.textcontent h2 {
    font-family: 'Oswald';
    font-size: 20px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: bold;
}

.textcontent h3 {
    font-family: 'Oswald';
    font-size: 18px;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-align: left;
}

.textcontent h4 {
    font-family: 'Oswald';
    font-size: 17px;
    letter-spacing: 2px;
    text-align: left;
}

.textcontent p{
    font-size: 16px;
    text-align: justify;
}

.bildcontent {
    max-width: 20%;
}

.regis {
    background: #282627;
    border-top: solid 1px #8f8f8f;
    padding: 2rem 1rem 3rem 5rem;
    color: #8D8273;
}

.regis h1 {
    margin: 0;
    font-family: 'Oswald';
    font-size: 28px;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.regis h2 {
    font-family: 'Oswald';
    font-size: 20px;
    margin: 0;
}

.regisform {
    padding: 3rem 4rem;
}

.regisname {
    display: flex;
}

.regisform input {
    width: 100%;
    margin-bottom: 2rem ;
    background: none;
    border: 1px solid #8D8273;
    padding: 10px 20px;
    font-family: 'Roboto';
    font-weight: 400;
    color: #8D8273;
    letter-spacing: 1.5px;
}

.regisform textarea {
    width: 100%;
    margin-bottom: 2rem ;
    background: none;
    border: 1px solid #8D8273;
    padding: 10px 20px;
    font-family: 'Roboto';
    font-weight: 400;
    color: #282627;
    letter-spacing: 1.5px;
    height: 100px;
}

.regisname input {
    width: 100%;
    margin-bottom: 2rem ;
    background: none;
    border: 1px solid #8D8273;
    padding: 10px 20px;
    font-family: 'Roboto';
    font-weight: 400;
    color: #8D8273;
    letter-spacing: 1.5px;
}

.regisform select {
    width: 100%;
    margin-bottom: 2rem ;
    background: none;
    border: 1px solid #8D8273;
    font-family: 'Roboto';
    font-weight: 400;
    color: #8D8273;
    letter-spacing: 1.5px;
}

.regisform input[type="checkbox"] {
    width: 15px;
} 

.regisform input[type="submit"] {
    width: 100%;
    margin-bottom: 2rem ;
    padding: 0 20px;
    background: #f45f0a;;
    border: 1px solid #8D8273;
    font-family: 'Roboto';
    font-weight: 400;
    color: #000;
    letter-spacing: 1.5px;
    font-weight: bold;
} 

.titlerecht{
    background: #00469d;
    padding: 3rem 0 5rem 0;
    border-bottom: #f45f0a 1px solid;
}

.titlerecht h1 {
    margin: 0;
    font-size: 70px;
    text-align: center;
    font-family: 'Oswald';
    text-transform: uppercase;
    color: #f45f0a;
}






/*** FAHRZEUG ***/
.fzmaincontainerch {
    width: 100%;
    background: #000;
    padding: 30px 0 40px 20px;
    overflow-x: hidden;
}

.fzinnercontainerch {
    padding: 5px;
    font-family: 'Oswald';
    font-size: 30px; 
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #fefefe;
}

.fzinnerconatinerchfz{
    
    margin-right: 5rem;
    padding: 10px;
}

.fzchoose,
.fzchoose a{
    padding: 10px;
    width: 100%;
    border: solid 1px #eeee;
    border-radius: 10px;
    transition: 0.5s;
    height: 6rem;
    margin: 3rem 0;
    color: #fefefe;
    text-decoration: none;
    background: #1c1c1e;
}


.fzchoose h1{
    font-size: 25px;
    margin: 0;
    font-weight: 800;
    letter-spacing: 1px;
}

.fzchoose h1 span{
    font-size: 18px;
    letter-spacing: 2px;
    font-weight: lighter;
    margin-left: 2rem;
}

.fzchoose h2{
    font-size: 18px;
    margin: 0;
    letter-spacing: 2px;
}

/*
DARK :  000
L DARK: 1c1c1e
white fefefe
*/
.containermainfz {
    color: #fefefe;
    background: #000;
    padding: 0 10px ;
    height: 100vh;
    overflow: hidden;
}

.bannermainfz {
    text-align: center;
    padding-top: 2rem;
    font-family: 'Oswald';
    font-size: 23px;
    letter-spacing: 2px;
}

.innercontainermainfz {
    display: flex;
    padding-top: 3rem;
    overflow: hidden;
}


.innerconatinermainleftfz,
.containerleftesfz {
    width: 100%;
    padding: 4px;
}

.containerleftesfz {
    height: 100%;
    display: flex;
    flex-direction: column;
    
}

.innerconatinermainrightfz,
.containerrightesfz {
width: 100%;
padding: 4px 0 4px 4px;
max-height: 100%;
}

.contentmainleftupfz,
.containerleftupfz {
    background: #1c1c1e;
    padding: 10px 15px;
    border-radius: 10px;
    margin-bottom: 10px;
}


.contentmainleftupfz a{
    color: #fefefe;
    text-decoration: none;
}

.contentmainleftupfz h1 {
    font-family: 'Oswald';
    font-size: 45px;
    letter-spacing: 2px;
    font-weight: 800;
    margin: 0;
}

.contentmainleftupfz h2 {
    font-family: 'Oswald';
    font-size: 25px;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 200;
}

.contentmainleftdofz {
    background: #1c1c1e;
    padding: 10px 15px;
    border-radius: 10px;
    display: flex;
    margin-bottom: 10px;
}


.contentmainleftdofzone a {
    color: #000;
    text-decoration: none;
}
.contentmainleftdofztwo a,
.contentmainleftdofzthree a {
    color: #fefefe;
    text-decoration: none;
}

.contentmainleftdofzone {
    width: 100%;
    padding: 2px 5px;
    
}

.contentmainleftdofztwo {
    width: 100%;
    border-right: white solid 1px;
    padding: 2px 5px;

}

.contentmainleftdofzthree {
    width: 100%;
    padding: 2px 5px;

}

.contentmainleftdofz h1, h3{
    text-align: center;
    font-size: 20px;
    font-family: 'Roboto';
    margin: 0;
}

.contentmainleftdofzone h2 {
    margin-top: 5px;
    font-size: 50px;
    font-weight: bold;
    text-align: center;
    padding-bottom: 1rem;

}

.contentmainleftdofztwo h2,
.contentmainleftdofzthree h2 {
    margin-top: 5px;
    margin-bottom: 0;
    font-size: 50px;
    font-weight: bold;
    text-align: center;

}

.innercontaineresfz {
    display: flex;
    padding-top: 2rem;
    padding-bottom: 2rem;
    overflow: hidden;
    height: 60vh;
}

.contentmainrightfz{
    background: #1c1c1e;
    padding: 10px 15px;
    border-radius: 10px;
    overflow: auto;
    height: 60vh;
}

.contenesrightfz {
    background: #1c1c1e;
    padding: 10px 0 5px 15px;
    border-radius: 10px;
    overflow: auto;
    height: 99%;
}

.contentmainrightfz p {
    font-size: 15px;
    margin: 0;
    color: #eeee;
}

.contentmainrightfzbox{
    border: solid 1px #fefefe;
    padding: 5px 10px;
    margin: 10px 0;
    border-radius: 10px;
}

.contentmainrightfz a {
    color: #fefefe;
    text-decoration: none;
}

.contentmainrightfzbox span.info{
    background: none;
    color: #eeee;
    text-decoration: none;
    font-size: 15px;
}

.contentmainrightfzbox span.sw {
    font-size: 25px;
    font-weight: bold;
}

.contentmainrightfzbox span.mb,
.contentmainrightfzbox span.adr {
    font-size: 15px;
}

.innerconatinermainleftfz a {
    color: #fefefe;
    text-decoration: none;
}

.contentmainleftreloadfz,
.contentstautusthreefz{
    background: #1c1c1e;
    padding: 10px 15px;
    border-radius: 10px;
    margin-bottom: 10px;
    color: #fefefe;
    text-align: center;
    text-decoration: none;
}

.innercontainerstatusfz{
    padding: 4rem 1rem 0 1rem;
}

.innercontainerstatusfz a {
    color: #fefefe;
    text-decoration: none;
}

.contentstatusonefz{
    background: #1c1c1e;
    font-size: 30px;
    font-weight: bold;
    font-family: 'Oswald';
    letter-spacing: 1px;
    padding: 10px 15px;
    border-radius: 10px;
    margin-bottom: 10px;
}

.contentstatustwofz {
    background: #1c1c1e;
    padding: 10px 15px;
    border-radius: 10px;
    margin-bottom: 30px;
}

.contentstatustwosubonefz {
    font-size: 20px;
    color: #eeee;
    letter-spacing: 2px;
    font-family: 'Oswald';
    margin-bottom: 20px;
}

.contentstatustwosubtwofz {
    display: flex;
    margin-bottom: 10px;
}

.contentstatustwosubtwofz a {
    color: #fefefe;
    text-decoration: none;
}

.spacefz {
    width: 5%;
}

.contentloginfz {
    background: #1c1c1e;
    letter-spacing: 1px;
    padding: 10px 15px;
    border-radius: 10px;
    margin-bottom: 10px;
}

.contentloginfz p {
    font-size: 25px;
    font-weight: bold;
    font-family: 'Oswald';
    color: #eeee;
}

.contentloginfzsubone {
    display: flex;
}

.spaceloginfzsubone {
    width: 20%;
}

.contentloginfzsubone input {
    width: 100%;
    border: 1px solid #fefefe;
    border-radius: 10px;
    color: #fefefe;
    background: #000;
    height: 40px;
    font-size: 20px;
    padding: 10px 20px;
    font-family: 'Oswald';
    letter-spacing: 2px;
}

.contentloginfz select{
    width: 100%;
    background: #000;
    color: #fefefe;
    border: 1px solid #fefefe;
    border-radius: 10px;
    height: 40px;
    font-size: 20px;
    font-family: 'Oswald';
    letter-spacing: 2px;
}

.buttonloginfz {
    width: 100%;
    padding-bottom: 10px;
}

.buttonloginfz input[type=submit] {
    width: 100%;
    border-radius: 10px;
    border: 1px solid #fefefe;
    background: #00D296;
    color: #fefefe;
    font-weight: bold;
    letter-spacing: 2px;
    font-size: 15px;
}

.logoutloginfz {
    background: #e71837;
    padding: 10px 15px;
    border-radius: 10px;
    margin-bottom: 10px;
    color: #fefefe;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    font-size: 15px;
    width: 400px;
}

.containerleftupfz h1 {
    font-family: 'Oswald';
    font-size: 43px;
    letter-spacing: 3px;
    font-weight: 800;
    margin: 0;
}

.containerleftupfz h2 {
    font-family: 'Oswald';
    font-size: 25px;
    letter-spacing: 2px;
    margin: 0;
    font-weight: 200;
}

.containerleftupfz h5 {
    font-family: 'Oswald';
    font-size: 17px;
    letter-spacing: 2px;
    margin: 0;
    color: #eeee;
}

#mapfz {
    height: 100%;
    border-radius: 10px;
}

.buttoncontaineresfz {
    display: flex;
    max-width: 100%;

    
}

.buttoncontaineresfz a {
    text-decoration: none;
    color: #fefefe; 
}

.buttonspacees{
    width: 50%;
}

.buttonesfz {
    padding: 3px 2px;
    border-radius: 10px;
    width: 280px;
    text-align: center;
    background: #1c1c1e;
}

.contenesrightfz h1 {
    font-size: 22px;
    letter-spacing: 2px;
    font-weight: 600;
    margin: 13px 0 20px 0;
}

.datarightesfz{
    display: flex;
    padding-right: 4px;
}

.datarightspw{
    display: flex;
}

.dataoneesfz {
    font-size: 17px;
    padding: 3px 0;
    width: 70%;  
}

.dataoneesfz.lsdata {
    font-size: 17px;
    padding: 3px 0;
    width: 47%;  
}

.datatwoesfz{
    font-size: 17px;
    padding: 3px 0;
    width: 100%;
}

.datatwoesfz.lsdata{
    font-size: 17px;
    padding: 3px 0;
    width: 100%;
}

.dataonespw {
    font-size: 17px;
    padding: 3px 0;
    width: 70%;  
}

.datatwospw{
    font-size: 17px;
    padding: 3px 0;
    width: 100%;
}

.buttonlogoutmainfz {
    display: flex;
    width: 100%;
}

.spacelogoutfz{
    width: 60%;
}

/** DOWN MENU **/
.menufz {
    background: #1c1c1e;
    overflow: hidden;
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 7rem;
    display: flex;
    padding-right: 10px;
    z-index: 100000;
    align-items: center;
    
}

.menufz a{
    color: #fff;
    text-decoration: none;
}

.logindatafzm {
    display: flex;
    min-width: 160%;
    border-right: 1px solid #fefefe;

}

.loginpicfzm {
    font-size: 40px;
    padding: 5px;

}

.loginnamefzm{
    padding-top: 5px;
    padding-left: 10px;
}

.loginnamefzm span.name {
    font-size: 15px;
    letter-spacing: 2px;
}

.loginnamefzm span.funktion {
    font-size: 13px;
    letter-spacing: 1px;
    color: #eeee;
}

.menucontentfz {
    width: 90%;
    display: flex;
}

.containerfzm{
    margin-top: 0;
    text-align: center;
    min-width: 150px;
}

.picfzm{
    font-size: 20px;
    margin: 0;
    padding: 0;
}

.textfzm{
    font-size: 10px;
    color: #eeee;
    margin: 0;
    padding: 0;
}

.spacegrfzm {
    width: 18%;
}

.spaceklfzm {
    width: 20px;
}

/*EINSATZPROTOKOLL*/
.containerepfz {
    padding-top: 1rem;
    padding-bottom: 2rem;
    overflow: hidden;
    height: 75vh;
}

.maindatacontainerepfz {
    display: flex;
    padding: 10px 5px;
    overflow: hidden;
    background: #1c1c1e;
    border-radius: 5px;
}

.leftdataconatinerepfz {
    width: 30%;
    border-right: solid 1px #8f8f8f;
    max-height: 70vh;
    overflow-x: hidden;
}

.leftdataconatinerepfz a {
    color: #fefefe;
    text-decoration: none;
}

.rightdataconatinerepfz {
    width: 70%;
    padding: 5px 5px 5px 10px;
}

.leftcontentcontainerepfz{
    display: flex;
    padding: 15px 7px;
    background: #1c1c1e;
    border-bottom: 1px solid #8f8f8f;
    align-items: center;
}

.picleftepfz{
    font-size: 23px;
    margin-right: 10px;
}

.lefttitleepfz {
    font-size: 15px;
}

.rightcontentepfz {
    max-height: 69vh;
    overflow-x: hidden;
    padding-top: 5px;
}

.rightcontentepfz h1{
    font-size: 25px;
    letter-spacing: 5px;
    text-transform: uppercase;
    margin: 0;
    font-family: 'Oswald';
    margin: 0 0 30px 0;
}

.rightcontentconatinerepfz {
    border-radius: 10px;
    background: #1c1c1e;
    color: #ffff;
    font-size: 15px;
    padding: 4px 4px;
    margin: 0 0 30px 0;
}

.rightcontentconatinerepfz h2{
    letter-spacing: 2px;
    font-size: 20px;
    color: #fefefe;
    margin: 5px 0 15px 0;

}

.rightcontentrowepfz {
    display: flex;
    background: #1c1c1e;
    width: 100%;
    padding: 10px 0 20px 0;
    align-items: center;
}

.rightcontentrowepfz.pkep {
    align-items: flex-start;
}

.rightcontentrowepfz.infoep {
    padding: 10px 0 0px 0;

}

.columnleftepfz {
    width: 40%;
    background: #1c1c1e;
}

.columnleftepfz.ezep {
    width: 30%;
    align-items: flex-start;
}

.columnleftepfz.vpep {
    width: 23%;
    align-items: flex-start;
}

.columnrightepfz {
    width: 60%;
    background: #1c1c1e;
}


.columnrightepfz input {
    margin: 0;
    padding: 0;
    border: #fff solid 1px;
    background: #000;
    width: 100%;
    padding: 0 7px;
    border-radius: 5px;
}

.columnrightepfz input::placeholder {
    color: #8f8f8f
}

.columnrightepfz input.checkboxepfz {
    margin: 0;
    padding: 0;
    border: #fff solid 1px;
    background: #000;
    padding: 0 7px;
    width: 15px;
    height: 15px;
}


.columnrightepfz select {
    width: 100%;
    border: #fff solid 1px;
    background: #000;
    margin: 0;
    padding: 0;
}

.rightcontentepfz input[type="submit"] {
    width: 100%;
    background: #7BDD89;
    color: #000;
    border: #fefefe 1px solid;
    border-radius: 10px;
    font-size: 13px;
    font-weight: normal;

}

.sbuttonepfz {
    width: 100%;
    border-radius: 10px;
    border: #fefefe 1px solid;
    background: #f45f0a;
    color: #fff;
    font-size: 13px;
    text-align: center;
    padding: 5px 0;

}

.columnrightepfz.adrep,
.columnrightepfz.swep,
.columnrightepfz.ezep,
.columnrightepfz.patgeb,
.buttonbfep{
    display: flex;
    align-items: center;
}

.columnrightepfz.adrep input {
    width: 80%;
}

.columnrightepfz.adrep input.hnr {
    width: 20%;
}

.columnrightepfz.swep select{
    width: 80%;
}

.columnrightepfz.ezep input[type="time"],
.columnrightepfz.ezep input[type="date"] {
    width: 100px;
    text-align: center;
    color: #fff;
}

.columnrightepfz.patgeb input[type="date"] {
    width: 190px;
    text-align: center;
    color: #fff;
}

.columnrightepfz.patgeb input[type="number"] {
    width: 65px;
    color: #fff;
    text-align: center;
}

.columnrightepfz.patgeb input[type="text"] {
    width: 60%;
    color: #fff;
}

.columnrightepfz.ezep input[type="checkbox"] {
    width: 30px;
}

.columnrightepfz.adrep input[type="number"] {
    width: 100px;
}

.columnrightepfz.adrep button {
    font-size: 9px;
    color: #fff;
    padding: 0 5px;
    background: #8f8f8f;
}

.columnrightepfz.ezep input[type="date"]::-webkit-inner-spin-button,
.columnrightepfz.ezep input[type="date"]::-webkit-calendar-picker-indicator,
.columnrightepfz.ezep input[type="time"]::-webkit-inner-spin-button,
.columnrightepfz.ezep input[type="time"]::-webkit-calendar-picker-indicator,
.columnrightepfz.patgeb input[type="time"]::-webkit-inner-spin-button,
.columnrightepfz.patgeb input[type="time"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}

.columnrightepfz.ezep input[type="submit"] {
    width: 60px;
    text-align: center;
    background: #8f8f8f;
    font-size: 13px;
    text-transform: lowercase;
}

.columnrightepfz.ezep button {
    width: 60px;
    text-align: center;
    background: #8f8f8f;
    font-size: 13px;
    text-transform: lowercase;
    padding: 0;
    margin: 0;
    border-radius: 10px;
    color: #fff;
}

.textepfz{
    width: 100%;
    height: 40vh;
}

.textepfz textarea{
    background: #000;
    width: 100%;
    height: 100%;
    padding: 10px 5px;
    letter-spacing: 2px;
    border: solid #fff 1px;
}

.rightcontentepfz a{
    color:#fff;
    text-decoration: none;
}

.patmainboxep {
    background: #000;
    padding: 10px 10px;
    border: 1px solid #8f8f8f;
    border-radius: 5px;
    display: flex;
}

.titlepatmainboxep {
    font-size: 19px;
    letter-spacing: 2px;
    font-weight: bold;
}

.subtitlepatmainboxep{
    font-size: 13px;
    letter-spacing: 2px;
}

.patmainleft{
    width: 100%
}

.patmainright {
    font-size: 37px;
    padding: 0 10px;
}

.patmainaddbutton {
    margin: 20px 0 0 0;
    padding: 5px;
    text-align: center;
    background: #7BDD89;
    border: 1px solid #8f8f8f;
    border-radius: 5px;
}

.manvpatmain {
    width: 30px;
    margin-right: 10px;
}

.manvgreen {
    background: green;
}

.manvyellow {
    background: yellow;
}

.manvred {
    background: red;
}

.manvblue {
    background: blue;
}

.manvblack {
    background: black;
    border: 2px solid #fff;
}

.buttonadep {
    background: #bdddf6;
    width: 100%;
    margin-top: 10px;
    padding: 5px 0;
    text-align: center;
    border: 1px solid #8f8f8f;
    border-radius: 10px;
    color: #000;
}

.columnrightepfz.bfep textarea {
    background: #000;
    width: 100%;
    height: 10vh;
    margin: 0;
}

.buttonbfep button{
    border: 1px solid #fff;
    background: #8f8f8f;
    color: #fff;
    border-radius: 10px;
    text-transform: initial;
}

.linkbfep{
    background: #8f8f8f;
    display: flex;
    align-items: center;
    padding: 7px 15px;
    border-radius: 10px;
    margin-bottom: 10px;

}

.linktitelbfep {
    font-size: 18px;
    letter-spacing: 2px;
    width: 100%;

}

.linkpicbfep{
    font-size: 25px;
}

.columnrightepfz.ezep span {
    font-size: 20px;
    margin-left: 5px;
}

.columnrightepfz.vpep input[type=text],
.columnrightepfz.vpep input[type=number] {
    width: 120px;
}

.columnrightepfz.massep button {
    width: 150px;
}

.datavpep {
    width: 60%;
}

.datavpep span {
    font-size: 15px;
}


/** INFODATEN **/

.databoxidls {
    padding: 5px;
    height: 40vh;
    overflow-y: auto;
    overflow-x: hidden;
    border: solid 1px #8f8f8f;
}

.databoxidls table {
    font-size: 15px;
}


.databoxidls table a {
    color: #000;
    text-decoration: none;
}

.leftside a {
    color: #000;
    text-decoration: none;
}

.buttonidls {
    width: 100%;
    text-align: center;
    text-transform: uppercase;
    font-size: 13px;
    padding: 5px;
    border: solid 1px #000;
    border-radius: 5px;
    letter-spacing: 2px;
}

.rightsideidls select {
    background: #F9CB9C;
    width: 100%;
}

.rightsideidls textarea {
    background: #F9CB9C;
    width: 100%;
    height: 15vh;
    overflow-y: auto;
}

.fahrzeugeidls {
    background: #B4A7D6;
    margin-top: 5px;
    padding: 10px 5px;
    border: #8f8f8f solid 1px; 
    height: 20vh;
    overflow-y: auto;
}

.fahrzeugespw {
    margin-top: 25px;
    width: 100%;
    height: 55vh;
    border: #8f8f8f solid 1px;
    overflow-y: auto;
    padding: 10px 10px 10px 5px;
}

.fahrzeugespw span{
    font-size: 18px;
}

.rightspanspw {
    margin-top: 5px;
    letter-spacing: 1px;
}

.rightside select.spw {
    background: #F9CB9C;
    width: 100%;
}

.rightside textarea {
    background: #FFE599;
    width: 100%;
    height: 15vh;
    overflow-y: auto;
}

.einfospw {
    padding: 10px 5px;
    height: 25vh;
    overflow-y: auto;
    overflow-x: hidden;
    border: solid 1px #8f8f8f;
    
}

.einfospw h1 {
    font-size: 18px;
    letter-spacing: 2px;
    font-weight: 600;
}

.buttonSubmitHide {
    display: none;
   }

dialog {
    width: 70%;
    height: 65vh;
    overflow: auto;
    font-size: 16px;
    margin-top: 20px;
}

dialog.alarm{
    border: #f45f0a 4px solid;
}

dialog h1{
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 2px;
}

dialog .diafz{
    display: flex;
}

.diaalarm,
.dianalarm {
    width: 100%;
    padding: 0 10px;
}


dialog button {
    width: 100%;
    background: #c1c1c1;
}

dialog a .dialink {
    width: 100%;
    border: solid 1px #000;
    border-radius: 5px;
    background: #c1c1c1;
    text-align: center;
    color: #000;
    text-decoration: none;
}

.ausstehendue a{
    color: #E06666;
    text-decoration: none;
}

/* ### DASHBOARD ### */
.statistikdb{
    display: flex;
    margin: 15px 10px;
    padding: 20px 10px;
}

.onesdb{
    width: 100%;
    text-align: center;
}

.onesdb h1 {
    font-family: 'Oswald';
    font-size: 60px;
    letter-spacing: 2px;
    margin: 0 0 10px 0;

}

.onesdb h2{
    font-family: 'Roboto';
    font-size: 14px;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.edatadb{
    padding: 10px 10px 20px 10px;
    margin: 15px 10px;
    border: solid 1px #8f8f8f;
}

.edatadb p{
    font-family: 'Oswald';
    font-size: 15px;
    letter-spacing: 2px;
    margin-bottom: 7px;
}

/*STARTSEITE*/

.container {
    max-width: 1200px;
    text-align: center;
    margin: 0 auto;
    padding: 0 3rem;
}

@media screen and (max-width: 580px) {
    .container {
          padding: 0 2rem;
    }
}

h1.lp, h2.lp, h3.lp {
    font-weight: 300;
    margin-top: 0px;
    margin-bottom: 8px;
}

h1.lp {
    font-size: 54px;
    color: #FFD152;
}

h2.lp {
    font-size: 42px;
    color: #8D8273;
}

h3.lp {
    font-size: 28px;
    color: #8D8273;
}

h4.lp {
    font-size: 20px;
    color: #8D8273;
    font-weight: 400;
    margin-bottom: 0;
}

p.lp {
    margin: 20px 0;
    color: #8D8273;
    line-height: 24px;
}

img.lp {
    margin: 20px 0;
    width: 100%;
}

button.lp {
    outline: none;
    border: none;
    margin: 18px 0;
    padding: 20px 40px;
    background: #FFD152;
    font-family: Roboto;
    color: #282627;
    letter-spacing: 2px;
    font-weight: 800;
    text-transform: uppercase;
}

i.lp {
    font-size: 42px;
    letter-spacing: 14px;
}


#overview {
    background: #282627;
    padding: 8rem 0;
}

.overview-content {
    display: grid;
    grid-gap: 80px;
    grid-template-columns: repeat(2, 1fr);
    text-align: left;
}

@media screen and (max-width: 580px) {
    .overview-content {
          display: grid;
          grid-gap: 20px;
          grid-template-columns: repeat(1, 1fr);
          text-align: left;
    }
}

#features {
    background: #282627;
    padding: 8em 0;
    border-top: solid 1px #8f8f8f;
}

.features-content {
    display: grid;
    grid-gap: 80px;
    grid-template-columns: repeat(2, 1fr);
    text-align: left;
}
@media screen and (max-width: 580px) {
    .features-content {
          display: grid;
          grid-gap: 20px;
          grid-template-columns: repeat(1, 1fr);
          text-align: left;
    }
}

.headerbuttonlist {
    width: 70%;
    padding: 2px;
    display: flex;
}

.headerbuttonlist a {
    font-size: 14px;
    background: #555;
    width: 50%;
    color: #fff;
    text-align: center;
    border-radius: 2px;
    font-weight: bold;
}

.headerbuttonlist a.alarm{
    background: #CC0000;
}

.headerbuttonlist a.info{
    background: #f45f0a;
}

.headerbuttonlist a.push{
    background: #93C47D;
}

.headerbuttonlist a ion-icon,
.headerbuttonlist a.alarm ion-icon,
.headerbuttonlist a.info ion-icon  {
    padding-top: 3px ;
    font-size: 16px;
}