body *
{
   /*font:  16px/100% Arial, Helvetica, sans-serif;*/
   font: 12px/100% Arial, Helvetica, sans-serif;

}


	#indexHeaderDiv {	margin:2% auto 0; width:30%; height:auto; }
	#indexHeaderDiv h2 {  margin:8px 0; padding:2px 0; text-align:center;		}
	
	.indexLogo {position:relative; width:55%; margin:0 auto; display:block;}
	
	#indexLoginDiv {	margin: 0 auto; width:30%; height:400px; border: 3px solid #1f4994; padding:1%; border-radius:5px; overflow-y:auto; }
	#indexLoginDiv strong { max-height:98%;}
	#loginDiv {position:relative; margin:6% auto 0px; width:95%; height:10%; padding:5px .5%; display:block; display:none; border-radius:3px; border:#1f4994 solid 1px;}
	#loginOperationsDiv{  position:relative; width:100%; height:auto; display:none;		}
	
	#loginField { position:relative; float:left; width:28%; height:auto;  font-size:.9em; padding:4px 1%; border:none;   }
	#loginOperationsDiv{  position:relative; width:100%; height:auto; display:none;		}
	#loginTmpField {	position:relative; float:left; width:5%; padding:1px 0; margin:4px 0 0 0; font-size:1em;  font-weight:normal; border:none; overflow:hidden;   	}
	.loginButton { position:relative; width:30%; margin:1px 1%; }
	
	#errorDiv {position:relative; width:90%; height:22px; margin:5px auto 5px; padding:3px 7px; color:#a00; font-weight:bold; text-align:center; 	}		/* modal hat z-index 999			*/
	
	#logonNumberPad { position:relativ; width:250px; height:auto; margin:5px auto; padding:1% 1% 1% 0.5%;  border:2px silver solid; 
			background-image: linear-gradient(45deg, #e6e6e6, #f1f1ff); border-radius:5px; 	}
	.username { width:40%; min-width:450px; max-width:600px; display:flex;  flex-direction:column; }
	
	#autologinChecker {position:absolute; top:0; left:0; display:none; }
	
	.indexNumPadKey { position:relative; width:31%; height:35px; font-size:16px;  font-weight:bold; border:silver 1px solid; border-radius:3px; margin:1% 0 1% 2%; padding:0;  cursor:pointer;
							}
	.numPadNumberDiv { position:absolute; bottom:2px; left:4%; height:90%; width:18px; font-size:1.8em; padding:0px 0 0 0; line-height:100%; text-align:right;					}
	.numPadNumberCenterDiv  { left:2%; width:96%; text-align:center;					}
	.numPadNumberDiv_2{ position:absolute; height:60%; top:18%; width:100%; font-size:1.3em; padding:3% 0 0 0; text-align:center;					}
	.numPadNumberDiv_3{ position:absolute; height:40%; top:35%; width:30%; font-size:2em; padding:3% 0 0 0;  text-align:center;				}
	.numPadLetterDiv { position:absolute; bottom:4px; right:4px; font-size:1.1em; font-weight:bold; font-style:italic; letter-spacing: .1em; text-align:right;			}
	
	.button_login { width:46%; height:40px; margin:5px 2%; }
	
	.button_kp {	outline: none; text-align: center; text-decoration: none; padding: .2em .1em .2em; text-shadow: 0 1px 1px rgba(0,0,0,.3); border-radius:.3em; 	cursor: pointer;	}
	.button_kp:hover {	text-decoration: none;	}
	.button_kp:active {		}
	
	.logOffButton {position:relative; margin:0 5px; font-size:12px; font-weight:bold; background:none; border:none; color:darkblue; cursor:pointer; }
	.logOffButton:hover {color:red;}		
/*  Ende Index */
/* ==================== kopiert von kassieren.php ============================= */
	
/*	#bonContent {width:100%; height:100%; background:yellow; margin:0 0 12px 0; border-bottom:green dotted 2px;} */
	
	/*  classe für mobile device   -- !! divicePs ist ein Test  */
	.button {
	float:left;
	display: inline-block;
	margin: 1px;	
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	padding: .2em .1em .2em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	
	-webkit-appearance: none;
	-webkit-border-radius: .3em; 
	-moz-border-radius: .3em;
	border-radius: .3em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	}
	.button:hover {
		text-decoration: none;
	}
	.button:active {		/*	position: relative; top: 1px;	*/	}
	.button:active {			}
	#menu {position:relative; width:100%;  }
	/*  Menu links Slider  	*/
	
	#menu_links_slider {position:absolute; width:1px; height:50px; top:0px; left:-2px; border-radius:3px; /* background:url(images/menuBg.png);*/ z-index:888;} 
	
	#menuReiterLinks {position:absolute; top:1px; right:-18px; width:15px; height:15px; margin:0; padding:0;  cursor:pointer; }
	#menue_links_sliderCont { width:100%; height:100%; overflow:hidden; }
	
	/*  Funktions Button  	*/
	

	.orange {
		color: #fff;
		border: solid 1px #ac6225;

		background: -webkit-gradient(linear, left top, left bottom, from(#f78d1d), to(#f78d1d));
		background: -moz-linear-gradient(top,  #f78d1d,  #f78d1d);
	}
/*	
	.orange:hover {

		background: -moz-linear-gradient(top,  #de7e1f,  #de7e1f);	
	}
	.orange:active {
		color: #fcd3a5;
		background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
		background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
	}
	
*/

	/*=================================================================*/
	

	/*  Modal Change Zahlung */
	

	
	
	
	/* ======================================================================== */
	/* Modal Produkt editieren
	
	/* The Close Button */
	
	/* ======================================================================== */
	
	
	/*   bon zusatztext modal */
	
	/* Aussere Box, grau hinterlegt */
	
		/* zahlungsterminal ModaL	*/

	/* Modal sichtbarer Teil alles*/		/*position: relative; padding: 2px 16px; height:470px; border:green solid 1px;*/
	
		/* für zahlung Modal			*/
	

	/* Add Animation */

	/* The Close Button */

	/* eigenes CSS Klumpat */
	.menue { border-bottom:1px solid #111; }
	.menuDivLeft { position:absolute; width:24%; height:100%; top:0; left:0; border-right:1px solid #111;}
	
	.menuDivRight { position:absolute; width:35%; height:100%; top:0; right:0; padding:0 2px 0 0;  border-left:0px solid #111;  } 
	#menue_links_sliderCont ul li a {min-width:120px; text-align:center; }
	
	@media print 
	{
		body * {
			font-size: 12px;
			visibility: hidden;
		}
		
		/*   ist für bonjournal ausdruck */
	}
	
	
/* ======================================================================== */
/* ===  Bonjournal kopiert */

	.fenster_links{
		/*width:60%;*/
		height:85%;
		overflow: scroll;
		
	}
	
	.fenster_rechts * {	/*width:40%;*/ font: <?php echo SCHRIFT_AUSDRUCK ?>;	}

	.fenster_rechts {	position:relative; float:right; height:85%; overflow-Y:scroll; width:auto; font: <?php echo SCHRIFT_AUSDRUCK ?>; padding:3px 2px;	}
		
				
	.fenster_rechts_overlowauto { overflow:auto;}	
	
	#fenster_rechts #fenster_rechts * { width: <?php echo AUSDRUCK_GESAMTE_BREITE; ?>; float: right; font: <?php echo SCHRIFT_AUSDRUCK ?>;
		
	}
	
	@media screen 
	{ 
		.ausdruck { display: none; }
		.fenster_rechts { max-width:40%;			}
	}
	
	/*  ENDE AUSWERTUNGEN */

	.wrapper_bon{
		/*width: 100%; height: 100%;	$bonContH=str_replace("%", "", BON_CONTAINER_HOEHE)-10;			*/
				position: relative; width:100%; height:100%; padding:0 2px; border:1px solid gray;
	}
	
	#wrapper_bon .menuDivRight { visibility:hidden; 	}

	.logOffButton {position:relative; margin:0 5px; font-size:12px; font-weight:bold; background:none; border:none; color:darkblue; cursor:pointer; }
	.logOffButton:hover {color:red;}		/* modal hat z-index 999			*/
	#autologoffChecker {position:absolute; top:0; right:0; display:none; }
	
	#sit_world { 
	position: absolute;
	width: 200px;
	height:150px;
	top: 50%;
	left: 50%;
	margin-top: -100px;
	margin-left: -75px;
	display: none;
	visibility: none;
	text-align:center;
	font-size:1em;
	z-index: 999;
	}
	
	#sit_world_gif { 
	width: 80px;
	height: 80px;
	display: block;
    margin-left: auto;
    margin-right: auto;
	}
	
	/* Benutzerrechte anlegen und ändern */
	#configUserLevelDiv { position:relativ; width:100%; height:100%;			}
	.configUserLevelRightDiv { position:relativ; float:left; width:49%; height:100%; overflow-y:auto;			}
	.configUserLevelLeftDiv { position:relativ; float:left; width:49%; height:100%; margin:0 0 0 1%; overflow-y:auto;				}
	.adminConfigTableUserLevel{	width:100%; border:none;				}
	.adminConfigTableUserLevel th{	line-height:1.5em; border-bottom:8px transparent solid;				}
	.adminKonfigUserlevelSel { width:85%; text-align:center; border:1px solid gray; border-radius:2px;			}
	.adminKonfigUserlevelSel option { text-align:center; border-bottom:1px solid #111;		}
	.adminKonfigAnzeigeTypeSel { width:75%; text-align:center; border:1px solid #97B9E6; margin:1px 3px; padding:0; border-radius:1px; 
			color:#000; font-size:.85em; font-weight:bold;			}
	.adminKonfigAnzeigeFocusSel{width:80%; text-align:center; border:1px solid #97B9E6; margin:1px 3px; padding:0; border-radius:1px; 
			color:#000; font-size:.85em; font-weight:bold;			}			
	.adminKonfigAnzeigeTypeSel option { text-align:center; border-bottom:1px solid #111; margin:3px 0;		}
	.configContentDiv { position:relative; width:100%; height:98%; display:none; overflow-y:auto; }
	.adminConfigTableListThLeft { text-align:left; padding:2px 0 0 5px !important;  		}
	.adminConfigTableListThRight { text-align:right;  padding:2px 5px 0 0 !important;	}
	.adminConfigTableListThL1 { text-align:center; padding:2px 0 2px 5px !important;  		}
	.adminConfigTableListThL2 { text-align:center; padding:2px 0 2px 5px !important;  		}
	.configTable th {  font-size:.85em; font-weight:bold; background:#555; color:#fff; border:none;}
	.layoutDataTableColA_3 {	width:44%; text-align:left; vertical-align:top;	}
	.layoutDataTableColB_3 { width:55%;  font-size:.85em; text-align:right;  padding:0 7px 0 0; }
	
	/* Tables in der Zentrale */
	.table_zentrale {
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		border-collapse: collapse;
		width: 100%;
	}
	.table_zentrale td, .table_zentrale th {
		border: 1px solid #ddd;
		padding: 8px;
	}
	.table_zentrale tr:nth-child(even){background-color: #f2f2f2;}
	.table_zentrale tr:hover {background-color: #ddd;}
	.table_zentrale th {
		padding-top: 12px;
		padding-bottom: 12px;
		text-align: left;
		background-color: rgb(247, 141, 29);
		color: white;
	}
	
	.ueberschrift { border-bottom:0px solid #6699CC; border-left:0px solid #6699CC; background: #BEC8D1; text-align:center; font-family: Verdana; font-weight:bold; padding:0 5px;
				font-size:.9em; color:#404040; }
	.div_ueberschrift {  text-align: center; font-size:.9em; font-weight: bold; color: #404040; border:none; }
	.datepicker { font-size:1em; }