﻿/*		Version 0.29B 29.1012024			*/

body {
	border: 0px solid pink;
	background-color: white;
	width: 300px;
	margin-top: 0px;	
	margin-bottom: 0px;	
	margin-left: auto;
	margin-right: auto;
	font-family: 'Ubuntu';
	/* font-family: 'Verdana';	*/
	/* font-family: 'Mina';		*/
}
	
/* unvisited link */
a:link {
  color: blue;
  text-decoration: none;
}

/* visited link */
a:visited {
  color: green;
  text-decoration: none;
}

/* mouse over link */
a:hover {
  color: hotpink;
  // text-decoration: none;
}

/* selected link */
a:active {
  color: blue;
  text-decoration: none;
}

footer {
	width: 100%;
	bottom: 10;
	margin-left: 5px;
	position: fixed;
}

/* header {
	position: fixed;
} */
	
input.CheckBox {
	border: 0px solid red;
    width: 16px;
    height: 16px;
	accent-color: silver;
	/* color: silver;				*/
	/* background-color: silver;	*/
	margin-left: 0px;
	valign: top;
}	
	
.WholeSite {
	border: 0px solid red;
	margin-left: auto;
	margin-right: auto;
}		

.Head {
	border: 0px solid blue;
	width: 100%;
	margin-bottom: 0px;	
}	

.HeadSchrift {
	border: 0px solid green;
	cursor: pointer;
	//width: 80%;
	width: 100%;
	font-weight: 1000;
	text-align: left;
	vertical-align: top;
	font-family: 'Abril Fatface';
	font-size: 68pt;
	margin-top: 0px;	
	margin-bottom: 0px;	
	margin-left: 0px;
	margin-right: 0px;
}	

.HeadMenu {
	border: 0px solid azure;
	cursor: pointer;
	text-align: right;
	vertical-align: top;
}

.HeadMenuLeftBlock{
	border: 0px solid pink;
	width: 100%;	
	cursor: pointer;
	// color: red;
	// font-size: 32pt;
	// font-weight: 1000;
	// text-align: left;
	// vertical-align: top;
}

.HeadMenuIconProfile{
	border: 0px solid orange;
	cursor: pointer;
	// color: red;
	// font-size: 32pt;
	// font-weight: 1000;
	text-align: right;
	// vertical-align: top;
}

.HeadMenuIconQuickIcon{
	border: 0px solid orange;
	cursor: pointer;
	color: red;
	font-size: 32pt;
	font-weight: 1000;
	text-align: right;
	vertical-align: top;
}

.HeadMenuIconHamburger{
	border: 0px solid orange;
	cursor: pointer;
	color: red;
	font-size: 32pt;
	font-weight: 1000;
	text-align: right;
	vertical-align: top;
}

.HeadEnde {
	border: 0px solid red;
	margin-top: 0px;
	margin-bottom: 0px;
	vertical-align: bottom;
	width: 100%;
	color: steelblue;
}

.HeadEndeUnderConstruction {
	border: 0px solid red;
	vertical-align: top;	
	padding-bottom: 10px;
}

.HeadEndeText {
	border: 0px solid pink;
	font-family: 'Abril Fatface';
	font-size: 36pt;
	font-weight: 200;
	color: steelblue;
	padding: 0px;
	width: 100%;
	vertical-align: bottom;	
}
	
.TextArea {
	border: 0px solid red;
	font-size: 12pt;
	font-family: Ubuntu;
	/*	font-family: 'Mina';		*/
	color: silver;
	margin-top: 20px;
	margin-bottom: 20px;
}

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

.SearchField {
	border: 0px solid red;
	margin-left: 0px;
	margin-right: 2px;
	padding: 10px;
	width: 250px;
	height: 32pt;
	font-size: 24pt;
	background-color: white;
	color: grey;
	vertical-align: middle;
	border-radius: 7px;
}

.ContactFullName {
	border: 2px solid grey;
	border-radius: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	padding-left: 5px;
	width: 100%;
	height: 32pt;
	font-size: 16pt;
	// font-weight: 550;
	// background-color: lightgrey;
	// background-color: 	#b0e2ff;			// LightSkyBlue1;
	background-color: 	#bfefff;				// LightBlue1;
	color: grey;
	// vertical-align: middle;
	text-align: left;
	maxlength:"50";
	resize: none;
	// overflow-y: scroll;
	overflow: hidden;
	}

.ContactMessage {
	border: 2px solid grey;
	border-radius: 0px;
	margin-left: px;
	margin-right: 0px;
	padding-left: 5px;
	width: 100%;
	height: 200pt;
	font-size: 14pt;
	// background-color: lightgrey;
	// background-color: 	#b0e2ff;			// LightSkyBlue1;
	background-color: 	#bfefff;				// LightBlue1;
	color: grey;
	// vertical-align: baseline;
	resize: none;
    overflow: auto;
}

.SearchOK {
	border-radius: 7px;
	width: 40pt;
	height: 32pt;
	margin-left: 0px;
	font-size: 25pt;
	vertical-align: middle;
	background-color: lightblue;
}

.ContactBtnSend {
	border-radius: 3px;
	width: 120px;
	height: 28pt;
	margin-left: 0px;
	margin-top: 5px;
	font-size: 16pt;
	vertical-align: middle;
	background-color: lightgrey;
	float: right;
	cursor: pointer;
}

.SearchResult {
	border: 0px solid blue;
	width: 100%;
	font-size: 12pt;
	vertical-align: top;
	word-break: break-all;
	word-wrap: break-word;
}

.SearchResultRow {
	border: 0px solid orange;				/* ?? scheint keine Wirkung zu haben    */
}

.SearchResultFlag {
	border: 0px solid pink;
	vertical-align: top;
	width: 28px;
	height: 18px;
	margin-top: 0px;
}

.SearchResultFlagImage {
	border: 0px solid green;
	vertical-align: top;
	width: 28px;
	height: 18px;
	margin-top: 0px;
}

.SearchResultItem {
	border: 0px solid pink;
	font-size: 12pt;	
	color: silver;
	width: 100px;
	cursor: pointer;
	vertical-align: top;
}

.SearchResultCheckBox {
	border: 0px solid yellow;
	vertical-align: top;
	width: 48px;
	height: 48px;
	font-size: 36pt;
	/* color: red;		*/		/*  ??? QQQQQ	*/				/*	accent-color: red;			*/
}

.CopyrightBlock {
	border: 0px solid yellow;
	margin: 25px 0px 0px 0px;
	color: grey;
	font-size: 8pt;
}

.QuickIconBar {
	border: 0px solid orange;
	/* display: none;		*/
	display: none;
	margin-left: 3px;
	/* background-color: lightblue;		*/
	margin-bottom: 20px;
}

.QuickIconBarBotton {
	border: 0px solid yellow;
	cursor: pointer;
	background-color: lightblue;
	height: 24px;
	padding: 0;
	width: 48x;
	margin: 0;
	vertical-align: middle;
	border-radius: 3px;	
}

.QuickIconBarIconImg {
	border: 0px solid red;
	cursor: pointer;	
	height: 20px;
	width: 34px;
	/* display: block;		*/
	margin: 0;
	vertical-align: middle;
	margin-left: auto;
	margin-right: auto;
}

.NewsTable {
	border: 0px solid red;
	width: 100%;
	font-size: 11pt;
	color: silver;	
	vertical-align: top;
}

.settingsTextHeaderErsterBlock{
	border: 0px solid green;
	font-size: 16pt;
	font-weight: 700;
	color: silver;
	vertical-align: bottom;
}

.settingsTextHeader {
	border: 0px solid lightblue;
	font-size: 16pt;
	font-weight: 700;
	color: silver;
	height: 36pt;
	vertical-align: bottom;
}

.settingsText {
	border: 0px solid orange;
	font-size: 14pt;
	color: silver;
	width: 40%;	
}

.settingsValues {
	border: 0px solid red;
	font-size: 14pt;
	color: grey;
	background-color: silver;
	width: 100%;	
}

.settingsValuesTmp {
	border: 0px solid yellow;
	font-size: 14pt;
	color: green;
	background-color: silver;
	width: 100%;	
}

.settingsCheckbox {
	border: 0px solid azure;
	font-size: 10pt;
	color:grey;
}

.overlay {
	height: 100%;	
	width: 0%;		
	position: fixed;	
	z-index: 1;			
	top: 0%;			
	right: 0%;			
	background-color: red;	
	overflow-y: hidden;			
	transition: 1.5s;			
}

.overlay-content {		
	position: relative;
	top: 0%;
	right: 20px;
	width: 100%;
	text-align: right;
	margin-top: 100px;
}

.overlay a {
	padding: 8px;		
	text-decoration: none;	
	font-size: 24px;		
	color: white;			
	display: block;			
	transition: 1.0s;		
}

.overlay a:hover, .overlay a:focus {
	color: #f1f1f1;
}

.overlay .closebtn {				
	position: absolute;
	top: 12px;
	right: 0px;
	text-align: right;
	font-size: 60px;
	/*	color: black;	*/
}
				
.SpCharKeyboard {																
	border: 0px solid red;
	cursor: pointer;
	margin-left: -2px;
	margin-right: 0px;
	margin-top: 3px;
	margin-bottom: 0px;
	width: 32px;
	height: 32px;
	color: white;
	background-color: grey;
	font-family: Ubuntu;
	/* font-family: Tahoma;				*/
	/*	font-family: 'Mina';			*/
	font-size: 18pt;
	font-weight: 500;
	border-radius: 3px;
}

.HeaderImgFly {																
	border: 0px solid green;
	width: 64px;
	height: 64px;
	vertical-align: bottom;
	margin-right: 0px;
	/* position: fixed;			*/
}

.HeaderImgProfile {																
	border: 0px solid green;
	width: 44x;
	height: 44px;
	vertical-align: bottom;
	margin-top: 0px;
	/* position: fixed;			*/
}

.ImgFly {																
	border: 5px solid red;
	width: 64px;
	height: 64px;
	vertical-align: bottom;
	margin-right: 0px;
	/* position: fixed;			*/
}

.ImgKeyboard {																
	border: 0px solid red;
	cursor: pointer;
	width: 70px;
	height: 42px;
	vertical-align: middle;
}

.ImgUnderConstruction {				/* Für das Image oben unterm Header		*/
	border: 0px solid pink;
	width: 64px;
	height: 55px;
}

.ContactCheckBox {
	border: 0px solid red;
    /* width: 16px; */
    /* height: 16px; */
	// width: 48px;
	// height: 48px;
	accent-color: orange;
	/* color: silver;				*/
	/* background-color: silver;	*/
	margin-left: 0px;
	// vertical-align: text-bottom;
	/* vertical-align:bottom; */
	// font-size: 36pt;
	// color: red;		*/		/*  ??? QQQQQ	*/				/*	accent-color: red;			*/
	/* float: bottom; */
}	

/* Responsive design: --------------------------------------------------------------------------------- */
@media screen and (min-width: 300px) {					/* Samrtphones: VOY, ...						*/
	body {
		width: 390px;
		/* width: 393px;				*/				/* XIAOMI Redmi Note ... [VOY]					*/
		/* background-color: white;		*/				/* #90ee90: helles grün							*/
		margin-left: 0px;
		margin-right: 0px;
		margin-top: 0px;
		margin-bottom: 0px;
	}

	.WholeSite {
		margin-left: 5px;
		margin-right: 5px;
	}

	.HeadSchrift {
		font-size: 58pt;
	}

	.HeadMenu {
		color: blue;
		font-size: 18pt;
	}

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

	.SearchResult {
		font-size: 12pt;
		vertical-align: top;
	}
	
	.SearchResultItem {
		border: 0px solid red;
		width: 135px;
	}
	
	.QuickIconBarBotton {
		width: 30px;
	}

	.QuickIconBarIconImg {
		width: 24px;
	}
	
	.HeadEndeText {
		font-size: 28pt;
	}
	
	.TextArea {
		font-size: 12pt;
	}

	.SpCharKeyboard {																
		cursor: pointer;		
		margin-left: -2px;
		margin-right: 0px;
		margin-top: 3px;
		margin-bottom: 0px;
		width: 26px;
		height: 26px;
		color: white;
		background-color: grey;
		font-size: 16pt;
		font-weight: 500;
		border-radius: 3px;
	}

	.ImgFly {																
		width: 64px;
		height: 64px;
		vertical-align: bottom;
		margin-right: 25px;
		margin-top: 60px;
	}

	.ImgUnderConstruction {																
		width: 0px;
		height: 0px;
	}

	.settingsTextHeaderErsterBlock{
	}
	
	.settingsTextHeader {
	}
	
	.settingsText {
	}
	
	.settingsValues {
	}

	.settingsValuesTmp {
	}
	
	.overlay {
		height: 100%;	
		background-color: red;	
	}
	.overlay-content {
		top: 0%;
		right: 10px;
		width: 100%;
		text-align: right;
		margin-top: 100px;
	}

	.overlay a {
		padding: 8px;		
		text-decoration: none;	
		font-size: 24px;
	}

	.overlay a:hover, .overlay a:focus {
		color: #f1f1f1;
	}

	.overlay .closebtn {				
		position: absolute;
		top: 12px;
		right: 0px;
		text-align: right;
		font-size: 60px;
	}	
	
	.ContactFullName {
		border: 0px solid grey;
		margin-left: 0px;
		margin-right: 0px;
		margin-bottom: 5px;
		padding-left: 5px;
		width: 100%;
		height: 28pt;
		font-size: 12pt;
		// font-weight: 550;
		// background-color: lightgrey;
		color: grey;
		// vertical-align: middle;
		text-align: left;
	}

	.ContactMessage {
		border: 0px solid grey;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 5px;
		width: 100%;
		height: 150pt;
		font-size: 10pt;
		// background-color: lightgrey;
		color: grey;
		// vertical-align: baseline;
		resize: none;
		overflow: auto;
	}
}

@media screen and (min-width: 768px) {						/* Tablets: iPad, ...						*/
	body {
		/* border: 5px solid red;		*/
		width: 600px;
		/* background-color: white; */
		margin-left: auto;
		margin-right: auto;
	}	

	.WholeSite {
		margin-left: 0px;
		margin-right: 0px;		
	}		

	.HeadSchrift {
		font-size: 90pt;
	}

	.HeadMenu {
		color: red;
		font-size: 36pt;
	}

	.HeadEndeText {
		font-size: 36pt;
	}
	
	.SearchField {
		margin-left: 0px;
		margin-right: 2px;
		padding: 10px;
		width: 450px;
		height: 32pt;
		font-size: 24pt;
		background-color: Gainsboro;
		color: DarkSlateGray;
		vertical-align: middle;
	}	
	
	.SearchResult {
		font-size: 12pt;
		vertical-align: top;
	}
	
	.SearchResultItem {
		width: 310px;
	}	

	.QuickIconBarBotton {
		width: 50px;
	}
	
	.QuickIconBarIconImg {
		
		width: 32px;
	}	
	
	.ImgFly {																
		width: 64px;
		height: 64px;
		vertical-align: bottom;
		margin-right: 5px;
		margin-top: 3px;
	}

	.ImgUnderConstruction {																
		width: 64px;
		height: 55px;
	}
	
	.TextArea {
		font-size: 14pt;
	}
	
	.SpCharKeyboard {																
		cursor: pointer;
		margin-left: -2px;
		margin-right: 0px;
		margin-top: 3px;
		margin-bottom: 0px;
		width: 32px;
		height: 32px;
		color: white;
		background-color: grey;
		font-size: 18pt;
		font-weight: 500;
	}
		
	.settingsText {
		font-size: 14pt;
		/* color: grey;			*/
	}

	.settingsValues {
		font-size: 14pt;
	}

	.settingsValuesTmp {
		font-size: 14pt;
	}
	
	.overlay {
		height: 100%;
		background-color: red;
	}
		
	.overlay-content {		
		top: 0%;
		right: 20px;
		width: 100%;
		text-align: right;
		margin-top: 100px;
	}

	.overlay a {
		padding: 8px;		
		text-decoration: none;	
		font-size: 26px;
	}

	.overlay a:hover, .overlay a:focus {
		color: #f1f1f1;
	}

	.overlay .closebtn {				
		position: absolute;
		top: 12px;
		right: 0px;
		text-align: right;
		font-size: 60px;
	}

	.ContactFullName {
		border: 2px solid grey;
		margin-left: 0px;
		margin-right: 0px;
		margin-bottom: 5px;
		padding-left: 5px;
		width: 100%;
		height: 28pt;
		font-size: 12pt;
		// font-weight: 550;
		// background-color: lightgrey;
		color: grey;
		// vertical-align: middle;
		text-align: left;
	}

	.ContactMessage {
		border: 2px solid grey;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 5px;
		width: 100%;
		height: 150pt;
		font-size: 10pt;
		// background-color: lightgrey;
		color: grey;
		// vertical-align: baseline;
		resize: none;
		overflow: auto;
	}	
}

@media screen and (min-width: 800px) {						/* Tablets: TABLETTE, ...						*/
	body {
		width: 600px;
		/* background-color: white;		 */
		margin-left: auto;
		margin-right: auto;
	}	

	.WholeSite {
		margin-left: auto;
		margin-right: auto;		
	}		

	.HeadSchrift {
		/*	font-size: 52pt;		*/
		font-size: 92pt;
	}

	.HeadMenu {
		color: red;
		font-size: 36pt;
	}

	.HeadEndeText {
		font-size: 36pt;
	}
	
	.SearchField {
		margin-left: 0px;
		margin-right: 2px;
		padding: 10px;
		width: 465px;
		height: 32pt;
		font-size: 24pt;
		background-color: Gainsboro;
		color: DarkSlateGray;
		vertical-align: middle;
	}	
	
	.SearchResult {
		font-size: 12pt;
		vertical-align: top;
	}
	
	.SearchResultItem {
		width: 260px;
	}	

	.QuickIconBarBotton {
		width: 50.5px;
	}
	
	.QuickIconBarIconImg {
		width: 32px;
	}	
	
	.ImgFly {																
		width: 64px;
		height: 64px;
		vertical-align: bottom;
		margin-right: 5px;
		margin-top: 3px;
	}

	.ImgUnderConstruction {																
		width: 64px;
		height: 55px;
	}

	.TextArea {
		font-size: 14pt;
	}
	
	.SpCharKeyboard {																
		cursor: pointer;
		margin-left: -2px;
		margin-right: 0px;
		margin-top: 3px;
		margin-bottom: 0px;
		width: 32px;
		height: 32px;
		color: white;
		background-color: grey;
		font-size: 18pt;
		font-weight: 500;
	}

	.settingsTextHeader {
	}
	
	.settingsText {
	}

	.settingsValues {
	}

	.settingsValuesTmp {
	}
	
	.overlay {
		height: 100%;
		background-color: red;
	}
		
	.overlay-content {		
		top: 0%;
		right: 20px;
		width: 100%;
		text-align: right;
		margin-top: 100px;
	}

	.overlay a {
		padding: 8px;		
		text-decoration: none;	
		font-size: 26px;
	}

	.overlay a:hover, .overlay a:focus {
		color: #f1f1f1;
	}

	.overlay .closebtn {				
		position: absolute;
		top: 12px;
		right: 0px;
		text-align: right;
		font-size: 60px;
	}

	.ContactFullName {
		border: 0px solid grey;
		margin-left: 0px;
		margin-right: 0px;
		margin-bottom: 5px;
		padding-left: 5px;
		width: 100%;
		height: 28pt;
		font-size: 12pt;
		// font-weight: 550;
		// background-color: lightgrey;
		color: grey;
		// vertical-align: middle;
		text-align: left;
	}

	.ContactMessage {
		border: 0px solid grey;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 5px;
		width: 100%;
		height: 150pt;
		font-size: 10pt;
		// background-color: lightgrey;
		color: grey;
		// vertical-align: baseline;
		resize: none;
		overflow: auto;
	}	
}
		
@media screen and (min-width: 1024px) {					/* Desktops: SMEAGOL, ...					*/
/* @media screen and (min-width: 1920px) {	*/			/* Desktops: SMEAGOL, ...					*/	
	body {
		width: 600px;
		/* background-color: white;		*/
		margin-left: auto;
		margin-right: auto;
	}	
	
	.WholeSite {
		margin-left: auto;
		margin-right: auto;
	}

	.HeadSchrift {
		/* font-size: 52pt;			*/
		font-size: 92pt;
	}
				
	.HeadMenu {
		color: red;
		font-size: 36pt;
	}				

	.HeadEndeText {
		font-size: 36pt;
	}
	
	.TextArea {
		font-size: 10pt;
	}	

	.SearchField {
		margin-left: 0px;
		margin-right: 2px;
		padding: 10px;
		width: 465px;
		height: 32pt;
		font-size: 24pt;
		background-color: Gainsboro;
		color: DarkSlateGray;
		vertical-align: middle;
	}
	
	.SearchResult {
		font-size: 12pt;
		vertical-align: top;
	}
	
	.SearchResultItem {
		width: 270px;
	}
	
	.QuickIconBarBotton {
		width: 50.5px;
	}

	.QuickIconBarIconImg {
		width: 32px;
	}
	
	.ImgFly {																
		width: 58px;
		height: 58px;
		vertical-align: bottom;
		margin-right: 10px;
		margin-top: 75px;				
	}
	
	.ImgUnderConstruction{																
		width: 64px;
		height: 55px;
	}

	.settingsTextHeaderErsterBlock{
	}
	
	.settingsTextHeader {
	}

	.settingsText {
	}

	.settingsValues {
	}

	.settingsValuesTmp {
	}
	
	.overlay {
		height: 100%;	
		background-color: red;	
	}
	
	.overlay-content {		
		top: 0%;
		right: 20px;
		width: 100%;
		text-align: right;
		margin-top: 100px;
	}

	.overlay a {
		padding: 8px;		
		text-decoration: none;	
		font-size: 20px;
	}

	.overlay a:hover, .overlay a:focus {
		color: #f1f1f1;
	}

	.overlay .closebtn {				
		position: absolute;
		top: 12px;
		right: 0px;
		text-align: right;
		font-size: 60px;
	}
	
	.ContactFullName {
		border: 0px solid grey;
		margin-left: 0px;
		margin-right: 0px;
		margin-bottom: 5px;
		padding-left: 5px;
		width: 100%;
		height: 28pt;
		font-size: 14pt;
		// font-weight: 550;
		// background-color: 	#b0e2ff;				// LightSkyBlue1;
		// background-color: 	#bfefff;				// LightBlue1;
		// color: grey;
		// vertical-align: middle;
		text-align: left;
	}

	.ContactMessage {
		border: 0px solid grey;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 5px;
		width: 100%;
		height: 250pt;
		font-size: 12pt;
		// background-color: 	#b0e2ff;			// LightSkyBlue1;
		// background-color: 	#bfefff;				// LightBlue1;
		// color: grey;
		// vertical-align: baseline;
		resize: none;
		overflow: auto;
	}
}
