/* CSS Document */
*
{
	font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	font-size: calc(12.5px + 0.15vw);}


html, body {
	margin:0px;
	background-color: #242424;
	color:#999999;
	min-height:800px;
	height:100%;
	background-image:url(../Medien/allgemein/spaene.jpg);
	background-repeat:no-repeat;
	background-size:100%;
	background-position:center;
	line-height:1.5em}
@media only screen and (max-width: 1199px) {
html, body {
	background-image:url(../Medien/allgemein/spaene-tablet.jpg);}}
@media only screen and (max-width: 619px) {
html, body {
	background-image:none;}}

a 					{ text-decoration:none; }
a:hover 			{ color:#cccccc; text-decoration:none;  }
a:focus				{ color:#cccccc; text-decoration:none; }
a:active			{ color:#ffffff; text-decoration:none; }
.aktiver_link 		{ color:#ffffff; text-align:right;  }
.menuepunkt_aktiv	{ color:#cccccc;}
.menuepunkt_inaktiv	{ color:#666666;}
.hervorhebung_menue {color:#999999;}
.links_menue_abstandshalter {margin: 27px 0 0 0}


@media only screen and (min-width: 620px) {
#links{
	position:relative;
	bottom:0;
	float:left;
	text-align:left;
	min-width:200px;
	width:60%;
	min-height: 100%; /* Mindesthöhe auf 100 % (bei modernen Browsern) */
	height: auto !important; /* important Behel (bei modernen Browsern */
	height: 100%; /* IE soll wie gewünscht interpretieren */}}
@media only screen and (min-width: 950px) {
#links{
	width:60%;}}
@media only screen and (min-width: 1200px) {
#links{
	width:53%;}}

#navigation {	
	position:relative;
	display:none;
	background-color:#242424;
	text-align:right;
	line-height:2.2em;
	float:left;
	width:97vw;}
@media only screen and (max-width: 619px) {
#navigation:target{
	display:block;}}
@media only screen and (min-width: 950px) {
#navigation {
	position:absolute;
	display:block;
	background-color:transparent;
	line-height:1.9em;
	height:auto;
	right:auto;
	width:38%;
	top:auto;
	bottom: calc(50% - 23vw - 0.45em);}}
@media only screen and (min-width: 1200px) {
#navigation {
	bottom: calc(50% - 20vw - 0.45em);}}

@media only screen and (max-width: 619px) {
#navigation_index_smart {
	position:relative;
	display:block;
	background-color:#242424;
	text-align:right;
	line-height:2.2em;
	float:left;
	width:96vw;}}
@media only screen and (min-width: 620px) {
#navigation_index_smart {
	display:none;}}



@media only screen and (max-width: 619px) {
#navigation_top {
	display:none;}}
@media only screen and (min-width: 620px) {
#navigation_top {
	display:block;
	color:#666666;
	margin:3%;
	width:148%;
	line-height:1.7em;
	text-align:right;}}
@media only screen and (min-width: 950px) {
#navigation_top {
	display:none;}}
	
#text{
	position:relative;
	float:left;
	margin-left:3vw;
	margin-right:3vw;
	margin-bottom:5vw}
@media only screen and (min-width: 620px){
#text{
	position:absolute;
	min-height:0px;
	width:82%;
	margin:5vw;
	margin-right:13vw;
	bottom: calc(50% - 26vw);}}
@media only screen and (min-width: 950px){
#text{
	margin:0;
	margin-left:1%;
	margin-right:3%;
	width:52%;
	bottom: calc(50% - 23vw - 0.25em);
	right:5%;}}
@media only screen and (min-width: 1200px){
#text{
	height:auto;
	margin:0;
	margin-left:1%;
	margin-right:5%;
	width:50%;
	bottom: calc(50% - 20vw - 0.25em);
	right:3%;}}

@media only screen and (min-width: 620px){
#text_o{
	width:145%;}}
@media only screen and (min-width: 750px){
#text_o{
	width:100%;}}

@media only screen and (min-width: 620px){
#text_index{
	width:107%;}}
@media only screen and (min-width: 750px){
#text_index{
	width:100%;}}

#logo_unter_matrix{
	position:relative;
	width:50%;
	margin-bottom:5vw;
	left:2vw;
	float:left;
	border:none;}
@media only screen and (min-width: 620px){	
#logo_unter_matrix{
	position:absolute;
	width:37.62239%;
	left:auto;
	margin-bottom:0px;
	margin-top:3vw;
	bottom: calc(50% - 18.5vw);
	right:-30.7vw;}}
@media only screen and (min-width: 950px){	
#logo_unter_matrix{
	width:37.62239%;
	left:auto;
	margin-bottom:0px;
	top:auto;
	bottom: calc(50% - 23vw + 1em);
	right:-30.7vw;}}
@media only screen and (min-width: 1200px){	
#logo_unter_matrix{
	width:28%;
	right:-28.4vw;
	bottom: calc(50% - 19vw);}}

#burger{	
	position:absolute;
	text-align:right;
	right:1vw;
	bottom:-11.5vw;
	width:50vw;}
@media only screen and (min-width: 620px) {
#burger{
	display:none;}}

#menue_zu{	
	position:absolute;
	width:45%;
	right:0vw;
	top:100%;}
@media only screen and (min-width: 620px) {
#menue_zu{
	display:none;}}

#bildmatrix{
	position:relative;
	color:#242424;	
	float:left;
	background-color:transparent;
	margin-left:3vw;
	margin-right:3vw;}
@media only screen and (min-width: 620px){	
#bildmatrix{
	position:absolute;
	bottom:calc(50% - 7.1vw);
	padding-bottom:0px;
	right:-30.7vw;
	margin:0;}}
@media only screen and (min-width: 1200px){	
#bildmatrix{
	bottom:calc(50% - 8.1vw);
	right:-28.4vw;}}
	
@media only screen and (min-width: 620px){	
.bildmatrix_hoch{
	width:37.1923%;
	right:-29.1vw;}}
	
@media only screen and (min-width: 620px){	
.bildmatrix_quer{
	width:55.6770%;}}
	
@media only screen and (min-width: 620px){	
.bildmatrix_index{
	width:calc(100% - 13em + 30.7vw);}}
@media only screen and (min-width: 950px){	
.bildmatrix_index{
	width:calc(60% + 30.7vw);}}
@media only screen and (min-width: 1200px){	
.bildmatrix_index{
	width:calc(60% + 27.6vw);}}
	
.aufhellen{
	color:#999999}


	
img{
	border:none;
	padding:none;
	margin:none;}