body{


    margin:1px;
    font-family: Arial, Helvetica, sans-serif;

    overflow: hidden;
    /* overflow-y: auto; */
}

/* body:before{
    position:absolute;
    top : 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: black;
    content:"";
    pointer-events: none;
    z-index:100;
    opacity: .5

} */

.noselect{

    user-select: none !important;
    -webkit-user-select: none !important;
    cursor: default;

    -webkit-touch-callout: none !important; 

   /* overflow: hidden; */
   touch-action: none;
}

#manager_div{

    height: 100%;
    /* background: yellow; */
}


#top_leiste{

    position: relative;
    z-index: 3;
    display: flex;
    /* justify-content: flex-end; */
    /* justify-content: space-between; */
    align-items: center;


    /* background: #0281c5fc; */
    background: #0a67cbfc;
    background: linear-gradient(0deg, #1069f4 15%, #005fff34 15%, #000000 100%);

    /* background: rgb(16,105,244); */
background: linear-gradient(0deg, rgba(16,105,244,1) 0%, rgba(0,95,255,0.5354735644257703) 13%, rgba(0,0,1,1) 90%);

background: linear-gradient(0deg, #1069f433 0%, rgba(0,95,255,0.5354735644257703) 15%, rgb(0, 39, 105) 85%, rgba(0,0,1,1) 100%);

background: linear-gradient(0deg, #1069f433 0%, #2d8ae1db 15%, rgb(0, 39, 105) 85%, rgba(0,0,1,1) 100%);




    /* width:100%; */
    height:100px;



    /* padding: 40px 40px 40px 40px; */

    /* padding-top: 40px; */
    /* padding-right: 40px; */


    /* box-shadow: #000000 0px 1px 1px, #000000 0px 2px 5px; */

    box-shadow: #2d8ae1 0px 0px 20px 5px, #000000 0px 5px 20px 0px;

    box-shadow: inset #2d8ae1 0px 0px 20px 5px, #000000 0px -1px 0px 2px;



}

div#logo_div{

    flex: auto;
    display: flex;

    align-items: center;
    /* margin-top: 10px;
    margin-bottom: 10px; */
    /* padding: 10px; */
}

img.logo_img{

    height: 80px;
    width: auto;
    /* border-radius: 5px; */
    margin-left: 10px;


    /* border-top:  10px solid #00000079; */
    /* border-left: 10px solid transparent; */

    /* border: 10px solid #00000079; */



}

#top_title{

    padding: 20px;
    padding-left: 30px;
    /* flex: auto; */
    letter-spacing: 5px;
    text-shadow: 2px 2px #940000;
    text-shadow: 2px 2px black;
    /* padding: 100px; */
}

#title_text{

    text-align: center;
    font-size: 36px;
    color: #fff;
}

div#admin_button_bereich{

    height: 98px;
    width: 300px;

    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    background: #ffffff33;

    letter-spacing: 2px;
    text-shadow: 2px 2px #0164ce;

    text-shadow: 1px 1px black;



    /* padding-left: 40px;

    padding-right: 40px; */

    box-shadow: #000000 0px 1px 1px, #000000 2px 2px 5px;
    box-shadow: #000000 0px 0px 1px, #000000 2px 0px 5px;



}

div#admin_button_bereich:hover{

    color: #ffffffd3;
    color:yellow;
    background: #ffffff44;
    box-shadow: #000000 0px 1px 1px, #000000 2px 2px 5px;
}

div#admin_button_bereich:active{
    color:#ffdd00;
}

#keyIcon{


    background: #1a006ec0;

    display: flex;
    align-items:center;
    justify-content:center;

    margin-left: 20px;
    border: 1px dotted white;

    text-align: center;
    width: 40px;
    height: 40px;
    /* padding-top: 10px;
    padding-bottom: 10px; */

    border-radius: 50px;

    background: black;
    background: white;

    
    box-shadow: #000000 0px 1px 1px, #000000 2px 2px 5px;



}

#keyIcon:hover{



}

div#admin_button_bereich:hover #keyIcon{

    background: black;
    background: white;

    background: #ffffffd3;
    border: 1px dotted white;
    box-shadow: yellow 0px 1px 1px, yellow 2px 2px 5px;

}

div#admin_button_bereich:active #keyIcon{

    box-shadow: #ffdd00 0px 1px 1px, #ffdd00 2px 2px 5px;
}

div#admin_menu{

    pointer-events: none;
}
body[rolle=S] div#admin_menu, div.menu_div.abmelden, div#saveCookie_button, div#saveSession_button {

    pointer-events: all;
}

div#admin_menu{

    position: absolute;
    z-index: 2;

    top:100px;
    right: 0;

    display: flex;
    flex-direction: column;
    align-items:flex-start;
    justify-content: space-around;
    align-items: center;

    background: white;
    background: #f1f1f1;

    
    /* border: 1px black solid; */
    /* height:400px; */
    width: 300px;
    /* padding: 10px; */

    box-shadow: #000000 0px 1px 1px, #000000 -2px 2px 5px;
    box-shadow: #000000 0px 5px 20px 0px, inset grey 1px 8px 5px;


    transform-origin: top center;


    transition: all 1s;

}

div#admin_menu.minimiert{

    /* height:0; */
    /* transform:scale(1,0); */
    top:-800px;
    transition: all 1s;
}

div.menu_div{

    border: 1px dotted silver;
    padding: 20px;
    /* width: 100%; */
    text-align: center;

    width: calc(100% - 50px);
    text-align: left;
}

div.menu_div.abmelden{

    display: flex;
    align-items: center;
    justify-content: space-around;

    padding: 10px 20px;

    /* font-size: 20px; */
    font-weight: bold;
    letter-spacing: 0.5ch;
    text-shadow: 2px 2px 2px 2px black;

    box-shadow: #000000 -2px -2px 20px 0px, #666 -9px -9px 20px;
    color: white;
    border: 1px dotted #000000;
    background: linear-gradient(180deg, #940000, rgba(0,0,1,1));

    box-shadow: #000000 0px 2px 0px 0px, inset #f1f1f1 3px 11px 20px;
    color: white;
    /* border: 1px dotted #000000; */
    background: linear-gradient(180deg, #f73636, #940000);

    box-shadow: #000000 -6px 1px 20px 0px, #666 -5px -5px 20px;
    color: white;
    border: 1px dotted #000000;
    background: linear-gradient(180deg, #f73636, #940000);
}

div.menu_div.abmelden:hover{

    background: linear-gradient(180deg, #f7363699, #940000aa);
}

div.menu_div.abmelden:active{

    background: linear-gradient(180deg, #f73636, #6d0101);
    box-shadow: #000000 1px 1px 20px 0px, #666 0 -0 20px;
}

div.menu_div.abmelden.inaktiv{

    opacity: 0.4;
    box-shadow: inset #000000 1px 1px 20px 0px, #ff9e49 0 -0 20px;
    background: none;
    color: black;

}

div.menu_div.abmelden span{

    flex: 0;
    font-size: 12px;
    letter-spacing: 0.1ch;
    margin: 0;
    /* padding: 5px; */
    font-weight: 100;
    padding: 10px;
    /* padding-left: 20px; */
    border: 1px dotted silver;
    border-radius: 10px;
}


div.menu_div.delCookie{

    font-size: 12px;
    line-height: 10px;
    padding: 20px;
    margin:10px;
    width: calc(100% - 40px );

    box-shadow: #000000 0px 0px 5px 0px, #666 0px 0px 5px;
}

div.menu_div.delCookie.cookie{

    margin-bottom:0;
}

div.menu_div.delCookie.session{

    margin-top:0;
}

div.menu_div.delCookie.cookie.saveCookie{

    background: #00c60079;

}

div.menu_div.delCookie.session.saveSession{

    background: #00c60079;

}

div.menu_div.delCookie.saveCookie::after{

    content: "✅";

}

div.menu_div.delCookie.saveSession::after{

    content: "✅";

}

div.menu_div.delCookie.saveCookie:hover{

    background: linear-gradient(180deg, #00c60079, #ffffff);

}

div.menu_div.delCookie.saveSession:hover{

    background: linear-gradient(180deg, #00c60079, #ffffff);

}


div.menu_div:hover{

    background: #0091ff2c;

}



.einstellungen{

    /* margin:10px;
    padding: 20px;
    margin-left: 20px; */
    margin-left: 30px;
    padding: 40px 0 30px 20px;
    font-size: 20px;
    letter-spacing: 0.5ch;
    color: silver;

    color: #00000029;
    text-shadow: -1px -1px 0px #fffdf0;

    margin-top: 10px;
    /* flex: auto; */
    
    box-shadow: #2d8ae1 0px 0px 0px 0px, #000000 0px -2px 4px 0px;
    /* border-top: 2px #666 double; */

}

div#admin_menu .einstellungen{

    align-items: center;

    width: 300px;
    /* width: fit-content; */

}

div.pop_menu span.einstellungen{

    margin-left: 0;
    padding: 40px 20px 30px 20px;
}



.quer{

    margin-top: -10px;
    white-space: nowrap;
    box-shadow: #0000006b 1px 1px 2px 0px, #0000005e 0px 0px 2px 0px;
    padding: 10px 2px;
    /* border: silver solid 1px; */
    transform: rotate(270deg);
    font-size: 15px;
    letter-spacing: 0;
    color: #00000029;
    text-shadow: -1px -1px 0px #fffdf0;
}

/* zweite Top-Leiste */
#menu_leiste{

    position: relative;
    z-index: 1;

    display: flex;
    /* justify-content: flex-end; */
    /* justify-content: space-between; */
    align-items: center;
    justify-content: space-evenly;


    /* background: #0281c5fc; */
    background: #f1f1f1fc;


    /* width:100%; */
    height:50px;



    /* padding: 40px 40px 40px 40px; */

    /* padding-top: 40px; */
    /* padding-right: 40px; */


    box-shadow: #000000 0px 1px 1px, #000000 0px 2px 5px;
    box-shadow: #000000 0px 1px 1px, #000000 0px 0px 2px 2px;

    box-shadow: #000000 0px -20px 20px, #000000 0px 5px 20px 0px;

    box-shadow: #2d8ae1 0px 0px 20px 5px, #000000 0px 5px 20px 0px;



    user-select: none !important;
    -webkit-user-select: none !important;
    cursor: default;
    -webkit-touch-callout: none !important; 

   /* overflow: hidden; */
   touch-action: none;



}

div#button_gruppe {

    flex: auto;
    display: flex;
}

div.menu_button {


    overflow: visible;
    position: relative;



    text-overflow:ellipsis;
    /* overflow:hidden; */
    inline-size: 50px;
    /* white-space:nowrap; */

    flex: 1 1 auto;
    /* overflow-wrap: break-word;
    hyphens: manual; */


    /* background: rgba(26, 0, 110, 0.754); */
    font-size: 15px;

    display: flex;
    align-items:center;
    justify-content:center;

    border: 1px dotted grey;

    /* text-align: center; */
    /* width: 40px; */
    height: 40px;
    padding: 50px;
    /* padding-top: 10px;
    padding-bottom: 10px; */

    padding: 20px;
    padding: 5px 10px;
    min-width: 50px;
    border-radius: 5px;

    /* box-shadow: #000000 4px 1px 10px 0px, #000000 0px 0px 5px 0px;
    box-shadow: #000000 0px 0px 10px 0px, #000000 0px 0px 0px 0px; */



}

div.menu_button.button{

    background: #0091ff80;
    box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #0164ce 0px 0px 20px 0px;

    inline-size: auto;
    width:fit-content;
}

div.menu_button.button.deluser{

    background: #ff00009e;
    box-shadow: #000000 1px 1px 5px 1px, inset #620303 0px 1px 20px 1px;


}


div.menu_button.button.deluser:hover{

    box-shadow: #000000 1px 1px 5px 1px, inset #620303 0px 1px 20px 1px;
    background: #f73636;

}




.tooltip{

   /* position: relative; */
   /* background: #fbfbea; */

}

.tooltip:hover{

    background: #fbfbea;
}


.tooltip:hover::after{

    z-index: 1;

    position:absolute;
    content:'INFO';
    content:attr(tooltip);
    /* für Zeilenumbrüche */
    white-space: pre-wrap;
    /* white-space: pre; */
    /* display: block; */

    /* overflow: visible; */
    border-radius: 10px;
    padding: 10px;
    color:#a0a0a0;
    font-size:14px;

    /* margin-top: 120px; */
    top:60px;
    margin-left: 50px;
    /* margin-top: 200px; */

    background: #fbfbea;
    min-width: 200px;
    max-width: 400px;
    /* width: 200px; */
    /* height: 50px; */

    animation-duration: 1s;
    animation-name: tooltipAni;
    /* animation-iteration-count: infinite; */
    /* animation-direction: alternate; */

}

@keyframes tooltipAni {
    from {
        opacity: 0;
      /* margin-left: 100%;
      width: 300%; */
    }
  
    to {
        opacity: 1;
      /* margin-left: 0%;
      width: 100%; */
    }
  }

  /* div#export_button:hover::after{ */

    /* content:'Angezeigte Liste als CSV-Datei exportieren und auf dem Computer speichern'; */
    /* content:'Gefilterte Liste als CSV-Datei exportieren und auf dem Computer speichern';

    content:attr( tooltip ); */

  /* } */

div.menu_button:not( .speichern, .active ):hover{

    background: #0091ff2c;
    box-shadow: rgb(0, 39, 105) 0px 0px 2px 0px, #0164ce 0px 0px 0px 0px;
    box-shadow: rgb(0, 39, 105) 0px 0px 2px 0px, #0164ce 0px 0px 10px 0px;


}

div.menu_button:not(.speichern):active{

    background: #0091ff80;
    box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #0164ce 0px 0px 20px 0px;

}

div.menu_button.active {

    background: #0091ff80;
    box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #0164ce 0px 0px 20px 0px;

}

div.menu_button.active:hover{

    /* background: #0091ffc8; */
    /* box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #0164ce 0px 0px 20px 0px; */

}

div.menu_button.kategorie.active{

    flex: 0.5;
    /* width:200px; */

}

/* inaktiv */
div#pop_hover{

    /* display: none; */

    position: relative;


}

div.pop_menu{

    max-height: calc( 100vh - 250px );
    overflow: auto;
    display:flex;
    justify-content: flex-start;

    display: none;
    flex-direction: column;
    position: absolute;
    top: 50px;
    background: #f1f1f1fc;
    z-index: 2;
    /* width: 220px;
    width: -webkit-fill-available;
    width: fit-content; */
    width: auto;
    box-shadow: #000000 0px 1px 1px, #000000 0px 2px 5px;

    /* height: 400px; */
}

.sel_several{

    box-shadow: #000000 0px -1px 2px 0px;
}

div.menu_button.menu_sichtbar>div.pop_menu{

    display: flex;
    /* width: 220px; */
    
}

/* div.menu_button.active:hover div#pop_menu{ */
div.pop_menu.sichtbar,  div#pop_menu_umstellung.sichtbar {

    display: flex;

}

div.pop_menu div{

    padding: 20px;
    border: 1px dotted white;
    border-radius: 10px;
}


.module_menu .pop_menu div{

    display: flex;
    align-items: center;
    
}

.module_menu .pop_menu div span{

    font-size: 32px;
    padding-right:10px;

}

svg{

    height:20px;
    width:20px;
    padding-right:10px;
}



div.pop_menu div:not(.inaktiv):hover{

    border: 1px dotted white;
    background: #0091ff2c;
}

div.pop_menu div:not(.inaktiv):active{

    background: #0091ff80;

}

div#pop_menu_umstellung{

    width: 300px;

    /* height: 400px; */
}


div.menu_button>span {

    font-size: 24px;
    padding: 5px;
    /* filter: brightness(0.5) invert(0.1) sepia(1) hue-rotate(168deg) saturate(5); */

}

img.menu_icon{

    height: 25px;
    width: 25px;
    padding: 5px;

    filter: brightness(1) invert(0.4) sepia(1) hue-rotate(168deg) saturate(5);
    filter: brightness(1) invert(0.4) sepia(1) hue-rotate(168deg) saturate(3);



}

img.menu_icon.delete{

    height: 20px;
    width: 20px;

}



div.menu_button.speichern{




}

div#speichern_button{

    opacity: 0.4;
    /* color: silver; */
    /* background: #ffffff; */

}

div#speichern_button.aktiviert{

    /* color: black; */
    opacity: 1;
    background: #f73636a2;

}

div#speichern_button.gespeichert,
div.detail_zeile.dokumente.gespeichert{

    /* color: black; */
    color: silver;
    opacity: 1;
    background: #038d17a2;

}
div.detail_zeile.dokumente.fehler{

    color: black;
    background: #f501019e;

}

div#preview_gallerie {

    width:100%;
    height:100%;

    /* height: 200px; */
    /* overflow: clip;
    margin-top: -100px; */
}



div#preview_gallerie img{

    /* max-height: 300px;
    max-width: 300px; */

    max-height: 150px;
    width: 100%;
    object-fit: cover;
}

div#speichern_button.aktiviert:hover{

    /* color: grey; */
    background: #f73636d0;
    box-shadow: #000000 0px 1px 1px, #000000 0px 2px 5px;


}

div#inhalt_div{

    height: calc(100% - 200px );
}


div#inhalt{

    display: flex;
    overflow-x: hidden;
    overflow-y: hidden;

    /* overflow-x: auto !important; */


    /* height:100%; */


}

div#links_div{

    flex: 0 1 auto;
    display: flex;
    flex-direction: column;

    transition: all 1s;
    /* overflow: clip; */

   /* width:100px; */
     /* height:100px; */

     /* overflow-y: auto; */




    /* background: red; */

}


div#links_div.minimiert{

    width: 170px;

}

div#liste_div{

    display: flex;
    flex-direction: column;

    /* height:100%; */
    /* background: #17A8E3; */

    padding: 20px;

    overflow-y: scroll;
    overflow-x: hidden;
    height: 500px;
}

/* div#links_div div#liste_div{ */
div#links_div:not(.suche_minimiert) div#liste_div{

    height: -webkit-fill-available;
    transition: all 1s;
    padding-top:0;
}


div#such_balken{

    position: relative;
    display: flex;
    flex-direction: column;

    margin-top:10px;
    /* height:150px; */

    transition: all 1s;

}

div#such_zeile{

    display: flex;
    align-items: center;

    height: 80px;
    padding-left: 10px;
    background: #f1f1f1fc;

    transition: all 0.5s;

    font-size: 30px;
    white-space: pre-wrap;
}



/* div#such_balken.minimiert,  */
div#links_div.suche_minimiert div#such_balken {

    /* height: 0; */
    margin-top:-50px;
    height:50px;
    /* transform: scale(1, 0); */
    transition: all 0.5s;

}


input#such_input{

    flex: 1;
    padding: 10px;
    margin:10px;
}

input#such_input.slim{

    width: 40px;
    margin-left: -40px;
}

div#links_div.suche_minimiert div#such_feld_info{

    /* display: none; */
    height: 0;
    opacity: 0;
    transition: all 0.5s;
    transition-delay: 0.5s;
}

div.suche_minimiert div#liste_div{

    /* padding-top:0; */

     /* display: none; */

     /* transition: all 0s;
    transition-delay: 0s; */
}

div#such_feld_info{

    padding: 10px;
    margin: 10px;
    font-size: 12px;
    background: #fffdf0;
}

div#such_feld_info p{

    margin: 5px;
    font-weight: 600;
}


div#active_row {

    /* scroll-margin-top: 1000px; */
}

#liste_div{

    scroll-padding-top: 80px;
}



.styled-table {

    border-collapse: collapse;
    /* margin: 25px 0; */
    font-size: 0.9em;
    font-family: sans-serif;
    /* min-width: 400px; */
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);

    user-select: none !important;
    -webkit-user-select: none !important;
    cursor: default;

    -webkit-touch-callout: none !important; 

   /* overflow: hidden;
   touch-action: none; */
}

/* .styled-table thead tr { position: sticky; top: 0; }
.styled-table thead { position: sticky; top: 0; } */


.styled-table thead tr {

    height:80px;
    background-color: #2d8ae1db;
    background: linear-gradient(0deg, #1069f433 0%, #2d8ae1db 15%, rgb(0, 39, 105) 85%, rgba(0,0,1,1) 100%);

    /* background: black; */
    color: #ffffff;
    text-align: left;
    position:sticky;
    top:-20px;
}

.styled-table th,
.styled-table td {
    padding: 12px 15px;
    
}



/* die ersten 8 Spalten: */
.styled-table th:nth-child( -n + 8 ) ,
.styled-table td:nth-child( -n + 8 )  {

    /* background: red; */
    /* max-width: 60px; */
    max-width: 13ch;
}

/* alle restlichen Spalten: */
.styled-table th:nth-child( n + 9 ) ,
.styled-table td:nth-child( n + 9 )  {

    /* background: red; */
    /* max-width: 60px; */
    max-width: 20ch;
}

.styled-table th:first-child ,
.styled-table td:first-child {

    /* max-width: 60px; */
    /* text-align: center; */
    /* padding: 5px; */
}

.styled-table tbody tr {
    border-bottom: 1px solid #dddddd;
    color:#666;
}

.styled-table tbody tr:hover :not(.active_row) {

    color: black;
    background: #0091ff2c !important;
}



.styled-table tbody tr:nth-of-type(even) {
    background-color: #f3f3f3;
}

.styled-table tbody tr:last-of-type {
    border-bottom: 2px solid #2d8ae1a2;
}

.styled-table tbody tr.active_row {
    /* font-weight: bold; */
    /* color: #af0000; */
    color: #000;
    outline: #17A8E3 solid;
    background-color: #17a9e353;
    /* background: #0091ff80; */
    /* box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #0164ce 0px 0px 20px 0px; */

}

.styled-table tbody tr.active_row.removeLine{

    width: -webkit-fill-available;
    /* left: 0; */
    /* margin-left: 0; */

}

#lineCopy{

    left: 100px;
    height: 50px;
    margin-top: -60px;
    width: 500px;
    color: #000;
    outline: #17A8E3 solid;
    background-color: #17a9e353;

    position: absolute;
    animation-duration: 0.3s;
    animation-name: removeAni;

}

@keyframes removeAni {
from {

    left: 100px;
}

to {
    left: -500px;
}
}



.styled-table tbody tr.saved_row {
    /* font-weight: bold; */
    /* color: #af0000; */
    color: #000;
    outline: #17A8E3 solid;
    background: #29a819d9;
    box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #0f4100 0px 0px 20px 0px;

}

tr#new_table_line{

    pointer-events: none;

    background: #ffffe6d9;
    background: #0091ff80;
    background: linear-gradient(0, rgba(0,0,0,0.07), #33d0ff);
    box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #0164ce 0px 0px 20px 0px;

    background: linear-gradient(177deg, #005fff11, #33d0ff66);
    background: linear-gradient(177deg, #ffdd0000, #ffdd008f);
    outline: #17A8E3 solid;
    box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #0164ce 0px 0px 20px 0px;

    background: #ffffe6d9;
    box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #ffdd00 0px 0px 20px 0px;
    box-shadow: inset #f73636 0px 0px 5px 1px, inset #ffdd00 0px 0px 20px 0px;
    outline: #ffdd00 solid;
}





div#rechts_div{

    flex: auto;

    /* display: flex; */
    /* flex-direction: column; */

    /* align-items: flex-start; */

    /* justify-content: center; */


    /* background:  #00bbff40;; */
    border: 1px solid #00bbff40;


    /* justify-content: center; */
    /* align-items: center; */


}

    /* wird derzet nicht benutzt */
div.button_leiste{

    display: flex;
    display: none;

    /* background: white; */
    position: sticky;
    top:0;
    padding:20px;
}

div#details{

    flex: 1;

    display: flex;
    /* flex-direction: column; */
    /* justify-content: center; */


    justify-content: flex-start;

        justify-content: space-evenly;

        flex-wrap: wrap;

        overflow-y: auto;
        overflow-x: hidden; 
        height:500px;



    /* background: #efefef; */

    padding: 10px;

    /* height: 200px;
    width: 200px; */
}

div.detail_spalte{

    flex:1;

    display: flex;
    flex-direction: column;

    padding: 5px;

    /* padding: 0 10px 0 10px; */

    /* padding: 10px; */

}




div#details.nur_ms_aktiv div.detail_spalte{

    pointer-events: none;
    /* backdrop-filter: blur(3px); */
}

div#details.nur_ms_aktiv div.detail_spalte input, div#details.nur_ms_aktiv div.detail_spalte select, div#details.nur_ms_aktiv div.detail_spalte textarea {

    background: #c0c0c04b !important;
}

div#details.nur_ms_aktiv div.wait_for_change{

    pointer-events:all;
    /* backdrop-filter: blur(3px); */
}

div#details.nur_ms_aktiv div.wait_for_change input, div#details.nur_ms_aktiv div.wait_for_change select, div#details.nur_ms_aktiv div.wait_for_change textarea {

    background:white !important;
}

div#details.ms_inaktiv div.wait_for_change{

    pointer-events: none !important;
    /* backdrop-filter: blur(3px); */
}

div#details.ms_inaktiv div.wait_for_change input, div#details.ms_inaktiv div.wait_for_change select, div#details.ms_inaktiv div.wait_for_change textarea {

    background: #c0c0c04b !important;
}

button.detail_button{

    font-size: 14px;
    font-weight: 700;

}

button.detail_button.standort{

    background: #0164ce;
}

button.detail_button.dokumente{

    background: #012a56;
}

div.detail_spalte.telefon button.detail_button{

    background: #008111;
}

div.detail_spalte.organisation button.detail_button{

    background: #940000;
}

div.detail_spalte.leitungsnetz button.detail_button{

    background: #2a03c5;
}


.detail_button.changes{

    position: relative;
    background: transparent;
    background-image: url('/img/teams.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 30%;
    height: 100px;




}

.detail_button.changes::after{

    content: "Umstellung auf MS-Teams";
    font-size: calc(1.5vw + 1.5vh);
    font-size: calc((5vw - 1rem) / 5);
    /* display: flex; */
    /* background: red; */


    line-height: 40px;

    /* padding-top:10px; */

    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(120deg, #eaee44, #33d0ff);
    background-image: linear-gradient(180deg, #000001, #33d0ff);

    background-image: linear-gradient(0, rgba(0,0,0,0.07), #33d0ff);

    opacity: .7;
    /* height: 100px;
    width: 100px; */
}


rrr.detail_button.changes::after{

    content: "";
    /* display: flex; */
    background: red;

    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(120deg, #eaee44, #33d0ff);
    opacity: .7;
    /* height: 100px;
    width: 100px; */
}





div.detail_spalte.standort{

    background: #0164ce11;
}


div.detail_spalte.telefon{

    background: #00811111;
}

div.detail_spalte.organisation{

    background: #94000011;
}

div.detail_spalte.leitungsnetz{

    background: #2a03c511;
    background: #2d8ae14f;
}

div.detail_spalte.wait_for_change{

    /* opacity: 0.3; */

    background: #2d8ae189;
    border: solid #0011ff 2px;

    background: #542de140

}








div.detail_zeile{

    /* flex: 1;  passt die Höhe an die verfügbare Höhe an */
    /* flex: 1; */



    /* background: #ffffff; */
    border: 1px black solid;

    padding: 10px;

    /* height: 200px;
    width: 200px; */
}

div.detail_zeile.ganze_gruppe{

    border: 5px double red;
}

div.detail_zeile.ganze_gruppe #ganze_gruppe_label{

    color:red;
}

div.detail_zeile.dokumente{

    flex:1;
    background: #0176b511;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.detail_label{

    display: block;
    color: #666;
    font-weight: bold;
    font-size: 12px;

    user-select: none !important;
    -webkit-user-select: none !important;
    cursor: default;

}

div.detail_zeile .detail_label *, div.detail_zeile input {

    display: block;
    border: #ccc solid 1px;
    color: #0000c3;
    color: blue;
    color: #194e93;
    font-weight: 700;


    padding: 5px;
    margin-top: 2px;

    width: calc(100% - 15px);
   width: -webkit-fill-available;
}

div.detail_zeile div.detail_label {

    text-wrap:balance;

}

.detail_label *:focus{

    background: #fffee9;
}

.detail_label select{

    display: block;
    padding: 5px;
    width: calc(100% - 15px);
    width: -webkit-fill-available;
    border: #ccc solid;
    padding: 5px;
    margin-top: 2px;
}

/* label.detail_label textarea{

    display: block;
    width: -webkit-fill-available;
} */


input#file_input{

    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

label#upload_label{

    color:white;


    border: 1px solid black;
    background: #2d8ae1db;

    padding: 10px;
}

#info_ganz_rechts{

    padding: 10px;
    border: 2px silver dashed;
}

input[ readonly ]{

    width: 80px;
    width: 12ch;
    text-align: center;
    background: #f1f1f1;
}



div.info_unten{

    display: none;

    padding-top: 1px;
    height: 50px;
    background: #fffdf0;
    width: 100%;
    box-shadow: 0 1px 2px rgba(0,0,0,0.07), 0 2px 4px rgba(0,0,0,0.07), 0 4px 8px rgba(0,0,0,0.07), 0 8px 16px rgba(0,0,0,0.07), 0 16px 32px rgba(0,0,0,0.07), 0 32px 64px rgba(0,0,0,0.07);
   

}

div.info_box{

    /* box-shadow: 0 1px 2px rgba(0,0,0,0.07), 0 2px 4px rgba(0,0,0,0.07), 0 4px 8px rgba(0,0,0,0.07), 0 8px 16px rgba(0,0,0,0.07), 0 16px 32px rgba(0,0,0,0.07), 0 32px 64px rgba(0,0,0,0.07); */
    
    padding: 10px;
    height: 30px;
    display: flex;
    /* justify-content: center; */
    align-items: center;
    font-size: 12px;
    font-family: 'Courier New', Courier, monospace;
    /* font-family: monospace; */

    color: #666;
    border: 1px silver dotted;
}

div#info_links{

    /* background: green; */
}
div#info_links div{

    padding-left: 50px;
}

div#info_rechts{

    /* background-color: blue; */
    
}

div.info_unten.links, div.info_unten.rechts{

    display: none;
}





div.login_modal{

    text-align: center;

    /* position: fixed; */

    position: absolute;
    right: 50px;
    top: 150px;


    width: 30ch;
    overflow: hidden;
    white-space: nowrap;

    padding:20px;



    background: #ffffff80;
    border: 1px solid #2B6CB0;

    border-radius: 14px;

    border-bottom-width: 1px;

    /* box-shadow: #000000 0px 1px 1px, #000000 0px 2px 5px; */

    box-shadow: inset #2B6CB0 -2px -2px 0px 0px, #2B6CB0 0px 2px 5px;



    /* box-shadow: #2B6CB0 0px 1px 1px, #2B6CB0 0px 2px 5px; */


}

div.hidden{

    display: none !important;
}






div#login_modal input{

    font-size: 16px;

    box-sizing: border-box;
    width: 100%;
    display: block;
    margin: 0;
    padding: 10px 0 9px;

    border-radius: 0;
    background-color: transparent!important;
    line-height: 1.3em;
    /* transition: .2s ease; */

    outline: none;
    border: 1px solid transparent;
    border-bottom: 1px solid #9d9d9d;




}

input::placeholder {
    font-weight: bold;
    opacity: 0.5;
    color: red;
}

input:focus{

    /* border-top: 0; */
    border-bottom: 1px solid #17A8E3;
}

button{

    /* width: 20ch; */

    width:100%;

    font-size: 16px;

   background: #17A8E3;
   background: #2d8ae1db;
   color: #ffffff;
   outline: 0;
    text-decoration: none;

    margin: 0 10px 0 0;
    padding: 10px;
    /* border: 0; */
    border-radius: 2px;
    box-shadow: none;
    background-image: unset;
    line-height: 1.45em;
    text-align: center;
    /* transition: .2s ease; */
}

button:hover{

    opacity: 0.9;
}

button:active{

    margin-top: 1px;
    margin-left: 1px;
}


/* warn-popup */
.bg{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background-color: #00000066;
    backdrop-filter: blur(3px);

    display: flex;

    align-items: center;
    justify-content: center;
}

.pop_title_bar{

    padding: 10px;
    color: white;
    background: #002a5b;

    letter-spacing: 1ch;
    padding-left: 20px;



    background: #0a67cbfc;
    background: linear-gradient(0deg, #1069f433 0%, rgba(0,95,255,0.5354735644257703) 15%, rgb(0, 39, 105) 85%, rgba(0,0,1,1) 100%);
    background: linear-gradient(0deg, #1069f433 0%, #2d8ae1db 15%, rgb(0, 39, 105) 85%, rgba(0,0,1,1) 100%);

    border: 1px black solid;
    /* text-align: center; */
}

.pop{

    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */

    /* position: fixed;
    top: 0;
    left: 0;
    z-index: 1041; */

    /* height:300px; */
    width:400px;
    background: #f1f1f1;
    background: white;
    background: #fffdf0;
    border: 1px solid black;

    box-shadow: 0 60px 80px rgba(0,0,0,0.60), 0 45px 26px rgba(0,0,0,0.14);
}

.pop_body{

    padding: 20px;
    background: white;
    background: #fffdf2;
    text-align: left;
    flex: 1;

    display: flex;
}

.pop_button_div{

    display: flex;
    padding: 10px;
    min-height: 50px;
    border: 1px dotted silver;
}

button.red_button{

    background: #660099db;
}



.lastEdit{

    /* display: none; */

    /* width: 200%; */
    transform: translate(-50%, 0);
    font-size: 12px;
    font-family: 'Courier New', Courier, monospace;

    /* text-align: center; */
    background: #fffdf2;
    padding: 20px;
    border: 1px #fff solid;

    
}

.col{

    display: flex;
    flex-direction: column;
}

.fett{

    /* font-weight: bold; */

    text-shadow: .25px 0px .1px, -.25px 0px .1px;
    white-space:nowrap;
}

.rel{

    display: flex;
    width: 200%;
    position: relative;
}

#editMark1{

/* display: none; */
}

#editMark2{

    /* width: 48%; */
    transform: none;
}


@media only print {

    body, #manager_div, table , #liste_div, #links_div, #inhalt_div {

      display: block !important;
      position: relative !important;
      width: auto !important;
      height: auto !important;
      overflow: visible !important;
      margin-left: 0 !important;
    }
 }


@media print {

    .hide-in-print {
        
        
        
        display:none;
    
    }
  }


::-webkit-scrollbar-track{

    border: 1px solid #f1f1f1;
    background: #fffdf0;
}

div.scrolling ::-webkit-scrollbar-track{

    background: #f0ffff;
}


::-webkit-scrollbar{
	width: 20px;
	background-color: #dfe6e9;
    transition: all 1s;
}

div.breit ::-webkit-scrollbar{
	width: 20px;
    /* height: 100px; */
    /* min-height:100px; */
	background-color: #dfe6e9;
    transition: all 1s;
}
div.breit div#liste_div{

    /* overflow-x:hidden; */
    /* width:unset; */
}


::-webkit-scrollbar-thumb{

    height: 50px;
	border-radius: 5px;
    background: linear-gradient(45deg, black, #2b6cb0);
    box-shadow: inset #2d8ae1 0px 0px 10px 0px;

}

::-webkit-scrollbar-thumb:hover{

    /* box-shadow: inset #2d8ae1 0px 0px 10px 0px #0047a2 0px 0 5px 1px; */
    background: linear-gradient(45deg, rgb(0, 39, 105), #2d8ae1);
    /* box-shadow: #030f1b 0px 0px 10px 1px; */


}

::-webkit-scrollbar-thumb:active, div.scrolling ::-webkit-scrollbar-thumb{

    background: #33d0ff;

}

div#contentBox{

    background: yellow;
    width: 400px;
    height: 400px;
}


/*


transform: rotate(270deg);
transition-property: background-color, font-size, transform, color;
transition-timing-function: ease-in-out;
transition-duration: 3s;
transition-delay: 2s;

*/



.isttestgruppe{

    /* filter:hue-rotate(300deg); */
    background: rgb(255, 236, 225) !important;
}

.istgruppe{

    /* filter:hue-rotate(300deg); */
    background: rgba(255, 249, 226, 0.856) !important;
}

.istgruppe.active_row, .isttestgruppe.active_row  {
    /* font-weight: bold; */
    /* color: #af0000; */
    color: #000;
    outline: #17A8E3 solid;
    background-color: #17a9e3 !important;
    /* background: #0091ff80; */
    /* box-shadow: inset rgb(0, 39, 105) 0px 0px 5px 1px, inset #0164ce 0px 0px 20px 0px; */

}







.isttestgruppe:hover{

    background: red;
}





#copy_input{

    right: 50px;
    display: none;
    z-index: 3;
    position: absolute;
    top: 0;
    margin-top: 150px;
    width: 500px;
    line-height: 40px;
    border: red double 5px;
    padding-left: 20px;
    background: beige;

}

#copy_input.show_clipboard{

    display: flex;
}