TestBody/*		Version 00.06A 20.03.2025		Vjeko Setka			*/

body {
	/* border: 2px solid blue; 					*/
	/* background-color: yellow;				*/
	background-color: paleturquoise;	
	width: 1880px;							/* Platz lassen für die vertikale Bildlauflesite
	margin: 0px 0px 0px 0px;
	/* margin-top: 0px;	 */
	/* margin-bottom: 0px;	 */
	/* margin-left: 20px; */
	/* margin-right: 5px; */
	font-family: 'Verdana';					
	/* font-family: 'Mina';			 */
}

.ResultList{
	max-height:600px;
	overflow:auto;
}

.TabelleTdHeader{
	/* border: 0px solid grey; */
	/* width: 100%; */
	height: 12px;
	text-align: left;
	vertical-align: middle;	
	background-color: blue;
	padding: 5px;
	color: silver;
	/* font-size: 9pt; */
	font-weight: 700;
}

.TabelleTdFooter{
	/* border: 0px solid grey; */
	/* width: 100%; */
	height: 12px;
	text-align: left;
	vertical-align: middle;	
	/* background-color: silver; */
	background-color: LightSkyBlue;	
	padding: 5px;
	color: white;
	/* font-size: 9pt; */
	font-weight: normal;
}

.TabelleTdZelle {
	/* border: 2px solid pink; */
	text-align: left;
	padding: 5;
	color: black;
	/* font-size: 9pt; */
	font-weight: normal;

	/* background-color: lightgreen; */
	background-color: silver;	
	vertical-align: middle;

	/* width: 8%; */
	/* max-width: 8%; */

	height: 12px;
	max-height: 12px;
	
	/* overflow: hidden; */
	overflow-y: clip;
	/* overflow-x: scroll; */
}

.TabItems {
	font-family: Verdana;
	/* margin-left: 0px; */
	/* margin-right: 0px; */
	font-size: 12pt;	
}

/* Markierung der Zeilen wenn man mit der Maus drüberfährt:						*/
table#ItemsID tbody tr:hover td {				/* 	 tbody: dann sollten aber die Zellen der Überschriftszeile nicht mit td sondern mit th angelegt werden */
   background-color: orange;
   color: red;     
}

.CopyrightBlock {
	border: 0px solid yellow;
	margin: 0px 0px 0px 0px;
	/* margin-left: 20px; */
	font-family: verdana;
	color: grey;
	font-size: 8pt;
}

.SearchForm {
	border: 0px solid blue;
	margin-top: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
	margin-right: 0px;
}

.LoginForm {
	border: 0px solid blue;
	margin-top: 200px;
	margin-bottom: 20px;
	margin-left: 0px;
	margin-right: 0px;
}

.ShowItemForm {
	/* border: 5px solid blue; */
	/* margin-top: 200px; */
	margin-bottom: 20px;
	margin-left:auto;
	margin-right:auto;
}

.ImgKeyboard {																
	border: 0px solid red;
	cursor: pointer;
	width: 60px;
	height: 36px;
	vertical-align: middle;
	margin-right:5px;
}

.SearchField {
	margin-left: 0px;
	margin-right: 2px;
	padding: 5px;
	width: 400px;
	height: 28pt;
	font-size: 14pt;
	background-color: Gainsboro;
	color: DarkSlateGray;
	vertical-align: middle;
}

.SearchOK {
	border-radius:5px;
	width:40pt;
	height:28pt;
	margin-left:0px;
	/* margin-right:5px;	 */
	font-size:12pt;
	vertical-align:middle;
	/* background-color:white; */
}

.SearchOKimg {
	/* border-radius:5px; */
	/* vertical-align:middle; */
	/* background-color:white; */	
	width:360pt;
	height:24pt;
	cursor: pointer;
	margin-left:auto;
	margin-right:auto;
}

.FunctionBtn {
	border-radius:5px;
	/* width:98pt; */
	width:24%;	
	/* height:28pt; */
	margin-left:0px;
	font-size:12pt;
	/* vertical-align:middle; */
	/* background-color:white; */
	/* font-size: 14pt;	 */
}

.FunctionBtns {
	/* border: 2px solid blue; */
	/* width: 600px; */
	width: 100%;	
	height: 32pt;
	font-size: 18pt;
	/* background-color: Gainsboro; */
	/* color: DarkSlateGray; */
	vertical-align: middle;
	/* align: center */
	
	/* border: 0px solid blue; */
	/* margin-top: 200px; */
	/* margin-bottom: 20px; */
	/* margin-left: 0px;	 */
	margin-left:auto;
	margin-right:auto;
}

.LoginUserName{
  background-color:white;
  width:360px;
  font-size:1.5em;  
  /* margin-top:2px; */
  margin-bottom:5px;  
  border:1px solid black;  
  /* border-radius:0px; */
  /* border-bottom: #ccc 2px solid; */
  padding:10px;
    /* padding-left:5px;   */
}

/* #LoginUsername:focus{ */
  /* background-color:azure; */
  /* border:3px solid red;   */
/* } */

/* INPUT:focus {  */
  /* background-color:pink; */
  /* border:2px solid red;   */
  /* border-radius:0px; */
/* } */

.LoginPassword{
background-color:white;
  width:360px;
  font-size:1.5em;  
  margin-top:2px;  
  /* border-radius:0px; */
  border:1px solid black;  
  padding:10px;
  /* padding-left:5px; */
}

.loginOK{
  /* background-color:white; */
  /* width:360px;   */
  font-size:1.5em;  
  /* padding:10px;   */
  /* padding-left:5px; */
  padding:10px;
  /* padding-top:5px; */
  /* padding-bottom:5px; */
  /* color:black; */
  border-radius:5px;
  border:2px solid black;
  margin-top:40px;
  /* margin-bottom:10px; */
  /* margin-left:0px; */ 
  /* font-weight:300; */ 
  /* font-weight:bold; */
}

.ShowItemName{
  /* background-color:white; */
  /* width:600px; */
  width:100%;  
  font-size:1.5em;  
  /* margin-top:2px; */
  margin-bottom:5px;  
  /* border:1px solid black;   */
  /* border-radius:0px; */
  /* border-bottom: #ccc 2px solid; */
  padding:10px;
    /* padding-left:5px;   */
}

.ShowItemBody{
  /* background-color:white; */
  /* width:600px; */
  width:100%;   
  font-size:1.5em;  
  /* margin-top:2px; */
  /* margin-bottom:5px;   */
  /* border:1px solid black;   */
  /* border-radius:0px; */
  /* border-bottom: #ccc 2px solid; */
  /* padding:10px; */
  /* padding-left:5px;   */
	
  /* border: 1px solid black;	 */
  /* width: 100%; */
  /* width:600px;	 */
  height: 500px;
  /* vertical-align: bottom;	 */
  text-align: top;
  padding:10px;
  /* font-size: 36pt; */
}

.ShowItemBody2{
  background-color:white;
  /* width:600px; */
  width:100%;   
  font-size:1.2em;  
  /* margin-top:2px; */
  /* margin-bottom:5px;   */
  border:1px solid black;  
  /* border-radius:0px; */
  /* border-bottom: #ccc 2px solid; */
  /* padding:10px; */
  /* padding-left:5px;   */
	
  /* border: 1px solid black;	 */
  /* width: 100%; */
  /* width:600px;	 */
  height: 500px;
  /* vertical-align: bottom;	 */
  /* text-align:top; */
  text-align: left;  
  padding:10px;
  /* font-size: 36pt; */
}

.TestBody {					/* Nur für Testzwecke					*/
	/* border: 1px solid black;	 */
	width: 100%;
	height: 200px;
	/* vertical-align: bottom;	 */
	text-align: top;
	padding:10px;
	/* font-size: 36pt; */
}

.Button1 {				
	font-size: 14pt;
}

/* Responsive design: --------------------------------------------------------------------------------- */
@media screen and (min-width: 800px) {			/* Tablet: TABLETTE, ...						*/
	body {
		width: 780px;
		background-color: lightgreen;		
		margin-left: auto;
		margin-right: auto;
	}

	.loginUsername{
		width:600px;
		font-size:2.0em;
	}

	.loginPassword{
		width:600px;
		font-size:2.0em;
	}

	.loginOK{
		width:600px;
		font-size:2.0em;
	}

	.ImgKeyboard {																
		width: 90px;
		height: 48px;
	}
	
	.SearchField {
		width: 494px;
		height: 32pt;
		font-size: 18pt;
	}
	
	.SearchOK {
		width:40pt;
		height:32pt;
		font-size:12pt;
	}	
	
	.SearchOKimg {
		width:28pt;
		height:18pt;
	}	

	.ShowItemForm {
		width: 96%;
	}

	.FunctionBtn {
		/* width:92pt; */
		/* height:32pt; */
		font-size:14pt;
	}

	.FunctionBtns {
		/* border: 2px solid blue; */
		/* width: 600px; */
		/* height: 32pt; */
		width: 96%;
		font-size: 18pt;
		/* background-color: Gainsboro; */
		/* color: DarkSlateGray; */
		/* vertical-align: middle; */
		/* align: center; */
			
		/* margin-bottom: 20px; */
		/* margin-left: 0px; */
		/* margin-right: 0px;	 */
		
		/* margin-left:auto; */
		/* margin-right:auto; */
	}
	
	.TabItems {
		/* font-family: Verdana; */
		/* margin-left: 0px; */
		/* margin-right: 0px; */
		font-size: 14pt;	
	}	

	.ResultList{
		max-height:800px;
		overflow:auto;
	}
	
	.Button1 {				
		font-size: 18pt;
	}

@media screen and (min-width: 980px) {			/* Smartphone: VOY, ...						*/
	body {
		width: 960px;
		background-color: tomato;		
		margin-left: auto;
		margin-right: auto;
	}

	.loginUsername{
		width:700px;
		font-size:4.0em;
	}

	.loginPassword{
		width:700px;
		font-size:4.0em;
	}

	.loginOK{
		width:700px;
		font-size:4.0em;
	}

	.ImgKeyboard {																
		width: 156px;
		height: 78px;
	}
	
	.SearchField {
		width: 490px;
		height: 64pt;
		font-size: 36pt;
	}
	
	.SearchOK {
		width:72pt;
		height:64pt;
	}		
	
	.SearchOKimg {
		width:48pt;
		height:32pt;
	}	
	
	.ShowItemForm {
		width: 96%;
	}	

	.FunctionBtn {
		/* width:148pt; */
		/* height:64pt; */
		/* font-size:36pt; */
	}
	
	.FunctionBtns {
		/* border: 2px solid blue; */
		/* width: 600px; */
		/* height: 32pt; */
		width: 96%;
		font-size: 18pt;
		/* background-color: Gainsboro; */
		/* color: DarkSlateGray; */
		/* vertical-align: middle; */
		/* align: center; */
			
		/* margin-bottom: 20px; */
		/* margin-left: 0px; */
		/* margin-right: 0px;	 */
		
		/* margin-left:auto; */
		/* margin-right:auto; */
	}	
	
	.TabItems {
		/* font-family: Verdana; */
		/* margin-left: 0px; */
		/* margin-right: 0px; */
		font-size:22pt;	
	}
	
	.ResultList{
		max-height:800px;
		overflow:auto;
	}
	
.Button1 {				
		font-size: 24pt;
	}	
		
@media screen and (min-width: 1920px) {			/* DESKTOP: BORG, ...						*/
	body {
		width: 1920px;
		background-color: azure;		
		margin-left: auto;
		margin-right: auto;
	}

	.LoginUserName{
		width:600px;
		font-size:1.5em;
	}

	.LoginPassword{
		width:600px;
		font-size:1.5em;
	}

	.loginOK{
		width:600px;
		font-size:1.5em;
	}	
	
	.ImgKeyboard {																
		width: 96px;
		height: 48px;
	}
	
	.SearchField {
		width: 600px;
		height: 32pt;
		font-size: 18pt;
		/* background-color: Gainsboro; */
		/* color: DarkSlateGray; */
		/* vertical-align: middle; */
	}
	
	.SearchOK {
		color: silver;
		width:68pt;
		height:32pt;
	}
		
	.SearchOKimg {
		width:24pt;
		height:16pt;
	}	

	.ShowItemForm {
		width: 32%;
	}
	.FunctionBtns {
		/* border: 2px solid blue; */
		/* width: 600px; */
		/* height: 32pt; */
		width: 32%;
		font-size: 18pt;
		/* background-color: Gainsboro; */
		/* color: DarkSlateGray; */
		/* vertical-align: middle; */
		/* align: center; */
			
		/* margin-bottom: 20px; */
		/* margin-left: 0px; */
		/* margin-right: 0px;	 */
		
		/* margin-left:auto; */
		/* margin-right:auto; */
	}

	.FunctionBtn {
		width:24%;
		height:28pt;
		font-size:16pt;
	}
	
	.TabItems {
		/* font-family: Verdana; */
		/* margin-left: 0px; */
		/* margin-right: 0px; */
		font-size: 10pt;	
	}
		
	.ResultList{
		max-height:800px;
		overflow:auto;
	}
	
	.Button1 {				
		font-size: 14pt;
	}