#DCGT_SEL { padding:5px; display:flex; }
#DCGT_SEL > div, #DCGT_SEL > label {  height:40px; }
#DCGT_SEL > div:first-child { flex:1; vertical-align:bottom; text-align:left; display:flex; }
#DCGT_SEL > div:first-child * { display:inline-block; margin-right:5px; }
#DCGT_SEL > div:first-child > a:first-child > img { width:100%;}
#DCGT_SEL > div:first-child > label { width:40px; height:40px; line-height:40px; text-align:center; font-size:30px; color:#fff; font-weight:bold; cursor:pointer; }

#DCGT_SEL > input { display:none; }
#DCGT_SEL > label { display:inline-block; width:40px; font-size:30px; background-color:rgba(0,0,0,0.05); margin-left:5px;  font-weight:bold; color:#FFF; }
#DCGT_SEL > label:hover { background-color:rgba(0,0,0,0.15); }
#DCGT_SEL > label > span { position:relative; display:block; width:40px; height:40px; line-height:40px; text-align:center; font-size:30px; }
#DCGT_SEL > label > span[data-typ='img30'] > img { margin:auto; display:block; border-radius:100%; height:30px; position:relative; top:5px;  }
#DCGT_SEL > label > span[data-typ='sym26'] > img { margin:auto; height:26px;  background-color:transparent; padding:2px; margin-top:5px; }
#DCGT_SEL > label > span[data-typ='sym22'] > img { margin:auto; height:22px;  background-color:transparent; padding:4px; margin-top:5px; }


/*#DCGT_SEL > label > span[data-unread > 0]:before { content: attr(data-unread); position: absolute; bottom:1px; right:1px; width:11px; height:11px; font-size:11px; line-height:11px; font-weight:bold; background:rgba(255,255,255,0.9); color:#F76503; padding:3px; box-shadow:rgba(0, 0, 0, 0.5) 0 0 2px 0; }*/
/*
#DCGT_SEL > label > span[data-unread]::before { content: attr(data-unread); position: absolute; bottom:3px; right:3px; height:11px; min-width:11px;
                                                 font-family:'Segoe UI'; font-size:11px; line-height:11px; color:#fff; font-weight:bold;
                                                 background:rgba(0,102,0,0.8); border:none; padding:3px; outline:1px solid #fff; z-index:1; }

#DCGT_SEL > label > span[data-total]:not([data-unread])::before { content: attr(data-total); position: absolute; bottom:3px; right:3px; height:11px; min-width:11px;
                                                 font-family:'Segoe UI'; font-size:11px; line-height:11px; color:#fff; font-weight:bold;
                                                 background:rgba(64,64,64,0.8); border:none; padding:3px; outline:1px solid #fff; z-index:1; }

*/
/* TEST ab 22.5.2019 */
#DCGT_SEL > label > span[data-unread]::before {                  content: attr(data-unread); position:absolute; top:-2px; right:-2px; height:11px; min-width:11px; font-family:'Segoe UI'; font-size:11px; line-height:11px; color:#fff; border-radius:100%; font-weight:bold; background: rgba(0,102,0,0.9);  padding:3px; z-index:1; box-shadow:0 0 0 2px #fff, 0 0 5px 0 rgba(0,0,0,0.75); }
#DCGT_SEL > label > span[data-total]:not([data-unread])::before { content: attr(data-total);  position:absolute; top:-2px; right:-2px; height:11px; min-width:11px; font-family:'Segoe UI'; font-size:11px; line-height:11px; color:#fff; border-radius:100%; font-weight:bold; background: #bbb; padding:3px; z-index:1; box-shadow:0 0 0 2px #bbb, 0 0 5px 0 rgba(0,0,0,0.75); }
/*#DCGT_SEL > label > span[data-total]:not([data-unread])::before { content: attr(data-total);  position:absolute; top:-2px; right:-2px; height:11px; min-width:11px; font-family:'Segoe UI'; font-size:11px; line-height:11px; color:#888; border-radius:100%; font-weight:bold; background: #eee; padding:3px; z-index:1; box-shadow:0 0 0 2px #bbb, 0 0 5px 0 rgba(0,0,0,0.75); }*/
/*#DCGT_SEL > label > span[data-total]:not([data-unread])::before { content: attr(data-total);  position:absolute; top:-2px; right:-2px; height:11px; min-width:11px; font-family:'Segoe UI'; font-size:11px; line-height:11px; color:#fff; border-radius:100%; font-weight:bold; background: rgba(64,64,64,0.9); padding:3px; z-index:1; box-shadow:0 0 0 2px #fff, 0 0 5px 0 rgba(0,0,0,0.75); }*/

#DCGT_SEL > input:checked + label { background-color:#333; /*border:none; color:#555;*/ /*z-index:222223;*/ box-shadow: 0 6px 0 rgba(255,255,255,0.97); border-radius:4px 4px 0 0; }
/*#DCGT_SEL > input:checked + label > span > img { box-shadow: 0 0 0 1px rgba(255,255,255,1.00) }*/
                                                   /*rgba(255,255,255,0.57); */

/*
@keyframes unread_new {
 animation-name: unread_new; animation-duration: 4s;
  from {background-color: height:15px; min-width:15px; font-size:15px; line-height:15px; }
  to {background-color: height:11px; min-width:11px; font-size:11px; line-height:11px; }
}
*/


#DCGT_CONT { position:relative;  }                                                                                         /*9999*/
#DCGT_CONT > div { position:absolute; display:none; flex-direction:column;  background-color:rgba(255,255,255,.97); top:0; right:0; color:#000; /*z-index:222222;*/  font-size:13px; width:0; max-width:0; height:0; max-height:0;  max-height:0; box-sizing: border-box; transition: max-width 300ms ease; overflow:visible;  }
#DCGT_CONT > div > div { display:flex; flex-direction:column; padding:20px 5px; }

#DCGT_CONT > div[data-mtop='suche'] > div { overflow:visible; /* druckernamen*/ }


/* für legacy , small design */
#DCGT_CONT[data-design='1'] > div { box-shadow:0 0 5px 1px rgba(0,0,0,0.50); border-radius:1px }
#DCGT_CONT[data-design='1'] > div  > div { padding:15px 5px 15px 5px; }

#DCGT_CONT_LAYER { position:fixed;top:0;left:0;width:100%;height:100%; background-color:rgba(0,0,0,0.25); }

#DCGT_CONT h2 { color:#555; font-size:15px; font-family:Segoe UI; margin:0; margin-bottom:12px; }
#DCGT_CONT h3 { color:#555; font-size:14px; font-weight:normal; font-family:Segoe UI; margin:0; margin-top:-10px; margin-bottom:12px; }

#DCGT_CONT h2 *[data-typ='ntf_counter'] { margin-left:5px; color:#fff; background-color:#F76503; border-radius:4px; padding:1px 6px; }
#DCGT_CONT h2 *[data-typ='ntf_readall'] { margin-left:5px; float:right; color:#F76503; text-decoration:none;}
#DCGT_CONT h2 *[data-typ='ntf_readall']:hover { color:#555;}
/*
#DCGA_M_TOP_SUB_CONT *[data-mtop='menu'] { text-align:right;  }
#DCGA_M_TOP_SUB_CONT *[data-mtop='menu'] > a { font-size:12px; background-color:#FFF; color:#F76503; font-weight:bold; padding:0 5px; margin-left:5px; }
*/

/* #DCM_SUCHE >  */


.DCM_BOX { display:flex; font-size:13px; text-transform:uppercase; font-weight:bold; font-family:Segoe UI; }
.DCM_BOX > a { text-align:center; background-color:#EEE; color:#555; padding:4px 6px; margin-right:4px; flex:1; text-decoration:none !important }
.DCM_BOX > a:last-child { margin-right:0; }
.DCM_BOX > a:hover { background-color:#F76503; color:#FFF; box-shadow:0 0 2px 1px rgba(247,101,3,0.25); }

.DCM_INPUT_FORM { display:flex; margin:0; font-size:13px;}
.DCM_INPUT_FORM > input[type='password'],
.DCM_INPUT_FORM > input[type='text'] { margin-right:6px; }
.DCM_INPUT_FORM > input[type='text']:first-child { flex:1; }


/* = #DCMUE_UVAL > #MUE_UV_TYP */
#DCM_SUCHE_OPT { display:flex; margin-bottom:10px; font-size:13px; text-transform:uppercase; font-weight:bold; font-family:Segoe UI; }
#DCM_SUCHE_OPT > input { display:none !important; }
#DCM_SUCHE_OPT > label { text-align:center; background-color:#EEE; color:#555; padding:4px 6px; margin-right:4px; flex:1; }
#DCM_SUCHE_OPT > label:last-child { margin-right:0; }
#DCM_SUCHE_OPT > input:checked + label { background-color:#F76503; color:#FFF; }

.DCM_BOX + *,
.DCM_INPUT_FORM + * { margin-top:10px; }

/* = DCM_INPUT_FORM
#DCM_SUCHE_SUCHFELD { display:flex; margin:0; font-size:13px;}
#DCM_SUCHE_SUCHFELD > input[type='text'] { flex:1; margin-right:6px; }
*/

/* unangemeldet */
/*
#DCM_USER_0 > div { margin-bottom:10px; }
#DCM_USER_0 > div:first-child { display:flex; }
#DCM_USER_0 > div:first-child > *:not(:last-child) { margin-right:6px; }
#DCM_USER_0 > div:first-child > input:not(:last-child) { flex:1; }
*/
/*
//unangemeldet
#DCM_USER_0 > div > a:not(:first-child) { margin-left:10px; padding-left:10px;  }


#DCM_USER_1 > div { margin-bottom:10px; display:flex;  }
// unangemeldet
#DCM_USER_1 > div > a:not(:first-child) { display:inline-block; margin-left:10px; padding-left:10px;  }
#DCM_USER_1 > div > a:last-child { flex:1; }
*/



#DCM_MENU { display:flex; }
#DCM_MENU > div { flex:1;  }
#DCM_MENU > div *{ display:block; }

#DCM_MENU > div:not(:first-child) { margin-left:4px; }

#DCM_MENU div[data-sub] { max-height:0; overflow:hidden; transition: max-height 700ms ease; } /* alternativ display:none; */
/*
#DCM_MENU div[data-sub][data-ebene2='1'] { border-left:8px solid  #F98C42; }
#DCM_MENU div[data-sub][data-ebene2='2'] { border-left:16px solid #F98C42; }
#DCM_MENU div[data-sub][data-ebene2='3'] { border-left:24px solid #F98C42; }
*/

#DCM_MENU div[data-sub][data-ebene2='1'] > label  { padding-left:8px; }
#DCM_MENU div[data-sub][data-ebene2='2'] > label { padding-left:16px; }
#DCM_MENU div[data-sub][data-ebene2='3'] > label { padding-left:24px; }

#DCM_MENU div[data-isFixed],
#DCM_MENU div[data-klapped] { max-height:800px; } /* alternativ display:block; */

/* Ausgewählten Eintrag markieren ... */
/* #DCM_MENU input[type='radio'][data-sel='on'] + label > *:first-child { text-decoration:underline; }*/

#DCM_MENU input[type='radio'] { display:none;  }
#DCM_MENU input[type='radio'] + label { margin-bottom:1px;  background:#F76503; display:flex;  }
#DCM_MENU input[type='radio'] + label > *:first-child { flex:1; }


#DCM_MENU input[type='radio'] + label > * { padding:8px 0; font-size:15px; font-family:Arial; line-height:15px; }

/* Sprung (Hauptebenen weiter)[data-sebene] */
#DCM_MENU input[type='radio'] + label > *:first-child { padding:8px; padding-right:3px;  background:rgba(255,255,255,0.5);  color:#fff; font-weight:bold; }
#DCM_MENU input[type='radio']:checked + label > *:nth-child(1) { background:rgba(255,255,255,0.1); }
/*
#DCM_MENU input[type='radio']:checked + label > a { background:#F76503; color:#fff; }
*/

/* Sprungfeld */                                                                                                                    /* height25*/
#DCM_MENU input[type='radio'] + label > *:nth-child(2) {  background:rgba(255,255,255,0.8); color:#F98C42; font-family:arial; font-size:10px; width:40px; text-align:center; }
#DCM_MENU input[type='radio']:checked + label > *:nth-child(2) { background:rgba(255,255,255,0.7); color:#F76503;}




/* Pfeile an Sprungfeld */
#DCM_MENU input[type='radio'][data-sebene] + label > *:nth-child(2)::after { content: "\25b6"; } /*  Pfeil rechts */
#DCM_MENU input[type='radio'][data-sebene]:checked + label > *:nth-child(2)::after { content: "\25c0"; } /* links/ausgewählt  "\25c0" */
#DCM_MENU input[type='radio'][data-sebene='0'] + label > *:nth-child(2)::after { content: "\25bc"; } /* Pfeil unten*/
#DCM_MENU input[type='radio'][data-sebene='0']:checked + label > *:nth-child(2)::after { content: "\25b2"; } /* hoch/ausgewählt "\25b2" */