html, body {
    height: 100%;
    margin: 0px;
    padding: 0px;
    /*background-image:url(../images/background.jpg);*/
    background-position:20% 20%;
    font-family: arial, helvetica, sans-serif;
    font-style: normal;
	color: darkgray;
}

#innerContents {
	background-color: white;
    margin: 10px;
}

#outerContents {
	position: relative;
	min-height: 100%;
    height: auto !important;
    height: 100%;
}

h1 {
	font-family: "avantgarde bk bt", arial, helvetica, sans-serif;
	color: #333333;
	font-weight : bold;
	font-size: 20pt;
}
h2 {
	font-family: "avantgarde bk bt", arial, helvetica, sans-serif;
	color: #333333;
	font-weight : bold;
	font-size: 16pt;
}
h3 {
	font-family: "avantgarde bk bt", arial, helvetica, sans-serif;
	color: #333333;
	font-weight : bold;
	font-size: 20pt;
}

.text {
	font-family: "avantgarde bk bt", arial, helvetica, sans-serif;
	font-weight : normal;
	color: black;
	font-size: 14pt;
}

.inhalt {
	margin: 10px;
}

.kasten {
	margin: 10px;
	margin: auto;
}

.buttonimg {
	width: 40px;
	vertical-align:middle;
}

.navimg {
	width: 130px;
}

.rahmen {
	border:solid darkgray 1pt;
	margin-top:5px;
	margin-bottom:5px;
    width:100%;
    max-width:300px;

}

.textrahmen {
	border:none;
}

@media (max-width: 800px) {
	.h1button {
		-moz-box-shadow:inset 0px 1px 25px 0px #EC870E;
		-webkit-box-shadow:inset 0px 1px 25px 0px #EC870E;
		box-shadow:inset 0px 1px 25px 0px #EC870E;
		background:-webkit-gradient( linear, left top, right bottom, color-stop(0.05, #ffffff), color-stop(1, #EC870E) );
		background:-moz-linear-gradient( center top, #ffffff 25%, #EC870E 100% );
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#EC870E');
		background-color:white; //#EC870E;
		-moz-border-radius:6px;
		-webkit-border-radius:6px;
		border-radius:6px;
		border:1px solid #dcdcdc;
		display:inline-block;
		color:#333333;
		font-size:20px;
		font-weight:bold;
		padding:6px 6px;
		text-decoration:none;
		text-shadow:1px 1px 21px #ffffff;
		width: 90%;
		margin: auto;
		text-align: left;
	}
}
a.h1button:hover {
	color:#434343;
}

.zahnrad {
	float:left;margin-bottom:8px;margin-right:8px;
	width:60px;
}

.logoimg {
	margin:20px;
	width:180px;
}


/* screenshot-bilder */
.screen {
	margin:8px;
	width: 90%;
}

#L1 { z-index:0; position:absolute;margin:auto;}
#L2 { z-index:1; position:absolute;margin:auto;}
#L3 { z-index:2; position:absolute;margin:auto;}
#L4 { z-index:3; position:absolute;margin:auto;}

.tabhide {
	display:none;	
}

/* desktop */
@media (min-width: 800px) {
	font-size:10pt;  
	#innerContents {
		margin: auto;
		width: 750px;
		color:green;
	}
	
	h1 {font-size: 18pt;}
	h2 {font-size: 16pt;}
	h2 {font-size: 14pt;}
	.text {font-size: 11pt;}
	.kasten {min-width: 300px;margin: auto;}
	.inhalt {
		width: 750px;
		margin: auto;
		//width: 85vw;
	}
	.buttonimg {width: 48px;float:left; margin-right:10px; margin-bottom:10px; border:0px;}
	.logoimg {width: 320px;}
	
	.zahnrad {
	float:left;margin-bottom:20px;margin-right:20px;
	width:100px;
	}
	
	#about {display:block;}
	
	.tabhide {
		display:block;	
	}

	.menubutton {
		-moz-box-shadow:inset 0px 1px 25px 0px #EC870E;
		-webkit-box-shadow:inset 0px 1px 25px 0px #EC870E;
		box-shadow:inset 0px 1px 25px 0px #EC870E;
		background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #EC870E), color-stop(1, #EC870E) );
		background:-moz-linear-gradient( center top, #ffffff 5%, #EC870E 100% );
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#EC870E');
		background-color:#EC870E;
		-moz-border-radius:6px;
		-webkit-border-radius:6px;
		border-radius:6px;
		border:1px solid #dcdcdc;
		display:inline-block;
		color:#333333;
		font-size:19px;
		font-weight:bold;
		padding:6px 24px;
		text-decoration:none;
		text-shadow:1px 1px 21px #ffffff;
		width: 300px;
		margin: 5px;
		text-align: left;
	}
	.menubutton:hover, h1button:hover {
		background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #EC870E) );
		background:-moz-linear-gradient( center top, #dfdfdf 5%, #EC870E 100% );
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#EC870E');
		background-color:#dfdfdf;
	}
	.menubutton:active, h1button:active {
		position:relative;
		top:1px;
	}
	
	.h1button {
		border:none;
		display:inline-block;
		color:#333333;
		font-size:19px;
		font-weight:bold;
		text-decoration:none;
		text-align: left;
		padding:6px 6px 0px 0px;
	
	}
	
	.textrahmen {
		border:solid #EC870E 1pt;
		margin: auto;
		margin-top:15px;
		padding:5px 5px 5px 5px;
		/*min-width: 300px;
		max-width: 500px;*/
		width: 750px;

	}


} /* end media desktop*/




.streifen{
	background-color:#aaaaaa;
	height:30px;
}

td{
	vertical-align:top;
	text-align:left;
}

li {
	color: black ;
}

li span {
	color: black;
}

a {
	font-family: "avantgarde bk bt", arial, helvetica, sans-serif;
	font-size : 14pt; 
    text-decoration: underline;
	font-weight : bold;
    color: #434343 ;
	
}

a:hover{
	color: #EC870E;
}

a.flink {
	font-family: arial, helvetica, sans-serif;
	font-size : 10pt; 
    text-decoration: none;
	font-weight : bold;
    color: white;
	margin-top: 75px;
}

a.gray {
	font-family: arial, helvetica, sans-serif;
	font-size : 10pt; 
    text-decoration: none;
	font-weight : normal;
    color: darkgray
}

font.flink {
	font-family: arial, helvetica, sans-serif;
	font-size : 10pt; 
    text-decoration: none;
	font-weight : bold;
    color: white;
    margin-left: 2cm;
	margin-right: 1cm;
	padding-top: 1cm;
}

.abs {
	font-family: "avantgarde bk bt", arial, helvetica, sans-serif;
	font-size: 11pt;
	font-weight : normal;
	color: black;
    margin-bottom:3px
}

font.pg {
	font-family: "avantgarde bk bt", arial, helvetica, sans-serif;
	font-size : 14pt; 
    text-decoration: none;
	font-weight : bold;
    color: #EC870E ;
}

img {	border: 0px; }

img.button {
	border: 15px outset #EC870E;
}

img.screen{
	margin-bottom:20px;
	margin-top:10px;
	border:1px solid #999999;
}

img.link {
	border: 0px;
	vertical-align:middle;
}

button {
	width:160px;
	height:160px;
    margin: 0px;
    padding: 0px;
}

img.pgviewer{
	margin-top:5px;
	margin-bottom:5px;
    width:100%;
    max-width:300px;
}

@media only screen and (min-width: 400px) {
	img.pgviewer{
		width:100%;
		max-width:450px;
	}
}

@media only screen and (min-width: 768px) {
	font.pg {
		font-size : 11pt; 
	}
	
	a {
		font-size : 11pt; 
	}
	
	img.pgviewer{
		width:100%;
		max-width:600px;
	}

}