@charset "UTF-8";
/*****************************************************************
File:		domikuere.css
Datum:		13.06.2025
Version:	0.11.06.13
Autor(en):	A. Pelka
Zweck:		CSS3-File für den neuen domikuere.de-Auftritt, der
			responsive ist und das neue Boxmodell berücksichtigt.
			Ich hoffe damit ein brauchbares Hilfsmittel für
			meine Webseitengestaltung zu haben. Die Farben und 
			Bilder müssen dann noch für jeden Auftritt einzeln
			modifiziert werden. Mit dem Filter, wie breit eine 
			Website ist, kann man die Container unterschiedlich
			modifizieren. Beispiel: @media all and (max-width: 1200px)
			Ich fange jetzt mal mit der kleinsten Breite an
			

*******************************************************************/

header, section, footer, aside, nav, article, figure, figcaption, main {
		display: block;
}

* { 
	/*-moz-box-sizing: border-box;*/ /* neues Boxmodell */
	box-sizing: border-box; 
	font-family: Arial, Verdana, sans-serif;  /* Georgia, Times, serif */
	line-height: 1.4em;			/* "Courier New", Courier, monospace */
	margin: 0px;
	font-size:18px;  /* 1.1em; */
}
		
		
body {
	width:100.01%; /* für firefox */
	color: #000; /*  */
	background-color: #FFF; /* #897  #FFF/*
	/* für sehr breite Bildschirme ist es u. U gut einen Hintergrund
	einzubinden mit background-image: url("hintergrund.jpg"); */
	background-position: center;
	font-size:1.1em; /* 1.1em; lieber erst einmal etwas größer */
}

h1 { font-size:1.9em;
	font-weight:bold;
	color: #000;
	overflow:auto;
	text-align:center;
	clear:left;
	/*border:1px solid #880;*/
}

h2 { font-size:1.7em;
	font-weight:bold;
	/*border:1px solid #880;*/
	color: #000;
	overflow:auto;
	text-align:center;
	clear:left;
}

h3 { font-size:1.5em;
	font-weight:bold;
	color: #000;
	overflow:auto;
	text-align:center;
	clear:left;
	/*border:1px solid #880;*/
}

h4 { font-size:1.4em;
	font-weight:bold;
	color: #000;
	overflow:auto;
	text-align:left;
	clear:left;
	/* border:1px solid #880; */
}

h5 { font-size:1.2em;
	font-weight:bold;
	color: #000;
	overflow:auto;
	text-align:left;
	clear:left;
	/*border:1px solid #880;*/
}

h5.weissnich { font-size:1.2em;
	font-weight:bold;
	color: #FFF;
	overflow:auto;
	text-align:center;
	clear:left;
	/*border:1px solid #880;*/
}



h6 { font-size:1.1em;
	font-weight:bold;
	color: #000;
	overflow:auto;
	text-align:left;
	clear:left;
	/*border:1px solid #880;*/
}

.nothing{
	border:0px solid #F80;
}

.fett{
	font-weight:bold;
}

.neu {
	clear:left;
	float:left;
	overflow:auto;
	margin-top:5px;
	/*border:5px green solid;
	;background-color:yellow;*/
	border:0px green solid;
}

p{	color: #000;
	font-size:1.0em;
	text-decoration:none;
	font-weight:normal;
	margin-bottom:6px;
}

.bild95 {
	width:95%;
	height:auto;
	overflow:auto;
}

.rand95 {
	width:95%;
	height:auto;
	overflow:auto;
	border:2px white solid;
}

.bild49 {
	width:49%;
	height:auto;
	overflow:auto;
}

.rand49 {
	width:49%;
	height:auto;
	overflow:auto;
	border:2px white solid;
}

.bild60 {
	width:60%;
	height:auto;
	overflow:auto;
}

.rand60 {
	width:60%;
	height:auto;
	overflow:auto;
	border:2px white solid;
}

.bild75 {
	width:75%;
	height:auto;
	overflow:auto;
	text-align:center;
}

.rand75 {
	width:75%;
	height:auto;
	overflow:auto;
	border:2px white solid;
	text-align:center;

}


.rand {
	border:10px blue solid;
}

.bild100 {
	width:100%;
	height:auto;
	overflow:auto;
}

.mittix {
    margin: 0px auto 0px auto; /* zentrieren */	
}

.datenschutz {
	margin-top:40px;
	padding:20px;
	clear:both;
	width:80%;
	margin-right:auto;
	margin-left:auto;
	border:2px solid gray;
	overflow:auto;
}

.klitze {
	font-size:0.8em;
}

.klitzig {
	font-size:0.8em;
	text-align:center;
}

.einseins {
	font-size:1.1em;
	/* text-align:center; */
}

.einszwo {
	font-size:1.2em;
	/* text-align:center; */
}

.nullacht {
	font-size:0.8em;
	/*text-align:center;*/
}



#wrapper {
	font-weight:normal;
	width:95%; /* 100% ab mittlerem BS Platz für Scrolleiste */
	max-width: 1800px;
	min-width: 360px;
	margin: 0px auto 0px auto; /* zentrieren */
/*	margin-left:auto; /* nur für schmale Bildschirme */
/*	margin-right:auto;/* nur für schmale Bildschirme */
	/*border: 0px solid #000000;*/
	border: 1px solid #223300;
	background-color: #FFF; /*FFF */
	padding:1px;
	font-size:1.0em;/* ursprünglich lieber erst einmal etwas größer */
	/*float:left;*/
}

.schwarz
{
	color:white;
	background-color:#000;
}

.left{
	float:left;
	}
	

.quote {
	width:80%; 
	padding:8px;
	border:2px solid red;
	margin-left:auto;
	margin-right:auto;

}

.versteckt {
	position:absolute;
	top:-1000px;
	
}

.bigger {
	font-size:1.2em;
}


.prozent100 {
	width:100%;
	margin:0;
	padding:0px;
	clear:both;
	overflow:auto;	
	background-color:red;
	min-height:250px;
	
}

.prozent20 {
	width:20%;
	margin:0;
	padding:5px;
	/* clear:both; */
	float:left;
	overflow:auto;
	background-color:yellow;
	min-height:200px;
}

.prozent80 {
	width:20%;
	min-height:200px;
	margin:0;
	padding:5px;
	float:right;
	overflow:auto;
	background-color:green;	
}

ul {
	padding-top:10px;
	padding-bottom:10px;
}

ol {
	padding-top:10px;
	padding-bottom:10px;
}


/************** Kopfzeile *************/
header {
	/*min-height: 5em; */
	background-color: #fff; /*#eee*/
	width:100%;
	/*border:2px solid #000;*/
	border: 0px solid #000000;
	margin-bottom:2px;
	overflow:auto;
	height:auto;/*********************** auto ***********/
	/*background-image:url(pano1.jpg);/* wird bei schmalen Bildschirmen ausgeschaltet 
	background-image:url(banner_1600_200_barriere_freiarm.png);
	background-size: 100% 100%;
	background-repeat:no-repeat;*/
	font-size:1.0em;/* ursprünglich lieber erst einmal etwas größer */
}

.mittig {
	text-align:center;
	font-size:0.8em;
	padding-left:5px;
	padding-right:5px;
}

.neumittig {
	text-align:center;
	font-size:0.8em;
	padding-left:5px;
	padding-right:5px;
	clear:both;
	float:left;
	overflow:auto;
	width:100%;
}

.obacht {
	clear:both;
	/*float:left;*/
	text-align:center;
	font-size:1.2em;
	font-weight:bold;
	padding-left:10px;
	padding-right:10px;
	background-color:#FF8;
	color:#000;
	border:2px solid #800;
	width:90%;
	min-height:50px;
	overflow:auto;
	margin-left:5%;
}


.hmittig {
	text-align:center;
	padding-left:5px;
	padding-right:5px;
}

hr {
	background:#444;
	border: none;
	/*color:#111;*/
	height: 2px;
	text-align:center;
	margin-top:12px;
	margin-bottom:6px;
	width: 100%;
}

#oben {
	overflow:auto;
	width:100%; /* 84% bei breiten Bildschirmen */
	/*height:100%;*/
	/*height:100%;*/
	/*min-height:5em;
	background-image:url(pano1.jpg);
	background-size: 100% 100%;
	background-repeat:no-repeat;*/
	/*background-image:url(bg1.png);
	background-size: 100% 100%;
	background-repeat:no-repeat;*/	
	/*display:inline;*/
	/*float:left;  /* right bei breitem Bildschirm */
	clear:both; /* nur für schmale Bildschirme */
}

/* Farben */
.weiss {color:#FFF; }
.blau {color:#00F; }
.gelb {color:#FF0; }
.green {color:#FF0; }
.black{color:#000; }
.rot {color:#F00; }
.orange {color:#F80; }
.weissmittig {color:#FFF; text-align:center;}
.zentriert {text-align:center;}
.weisszentriert {text-align:center; color:#EEEEEE;}


/********************* Hauptnavigation *************/


#navigat1 {/* Haupt-Navigation horizontal */
	clear: both;
	color: #ffffff;
	background-color: #aaa;
	/*border:1px solid #F80;*/
	overflow:auto;
	width:100%;
	float:left;
	padding-top:5px;
	padding-bottom:5px;
}

	#navigat1 ul {
		/*position: absolute;*/
		/* margin: 0 auto; */
		list-style: none;
}
 
	#navigat1 ul li {
		float: left;
		color: #fff;
		margin: 1px 1px 1px 20px;
		border:1px solid #000;
		background-color:#222;
		padding:2px;
}

	#navigat1 ul li a {
			color: #FFF; /* fff */
			text-decoration:underline;
			display:inline;
			border:1px solid #000;
			background-color:#222;
			padding:2px;
		}  

	#navigat1 ul li a:hover{
				color: #222; /* 000 */
				border:1px solid #F88;
				background-color:#FFF;
				padding:2px;
		}

	#navigat1 ul li a:focus{
				color: #222; /* 000 */
				border:1px solid #F88;
				background-color:#FFF;
				padding:2px;
		}


.current { /* markiert die laufende Seite */
	color: #F80; /* fff */
	background-color:#08F;
	border:2px solid red;
}



.navigat4 {/* Unter-Navigation auch horizontal */
	clear: both;
	color: #ffffff;
	background-color: #aaa;
	/*border:1px solid #F80;*/
	overflow:auto;
	width:100%;
}

	.navigat4 ul {
		/*position: absolute;*/
		/* margin: 0 auto; */
		list-style: none;
}
 
	.navigat4 ul li {
		float: left;
		color: #fff;
		margin: 1px 1px 1px 20px;
		border:1px solid #000;
		background-color:#222;
		padding:2px;
}

	.navigat4 ul li a {
			color: #FFF; /* fff */
			text-decoration:underline;
			display:inline;
			border:1px solid #000;
			background-color:#222;
			padding:2px;
		}  

	.navigat4 ul li a:hover{
				color: #222; /* 000 */
				border:1px solid #F88;
				background-color:#FFF;
				padding:2px;
		}

	.navigat4 ul li a:focus{
				color: #222; /* 000 */
				border:1px solid #F88;
				background-color:#FFF;
				padding:2px;
		}





#navigat2{/* Subnavigation auch horizontal*/
	
	clear: both;
	color: #FF0;
	background-color: #000;
	/*border:1px solid #F80;*/
	/*min-height: 3em;*/
	overflow:auto;
	width:100%;
	float:left;
}

	#navigat2 ul {
		/* margin: 0 auto; */
		list-style: none;
}
 
	#navigat2 ul li {
		float: left;
		color: #ff0;
		margin: 1px 1px 1px 20px;
		padding:2px;
		border:1px solid #000;
		background-color:#228;
}

	#navigat2 ul li a {
			color: #FF0; /* fff */
			text-decoration:underline;
			float:left; /*display:inline;*/
			border:1px solid #000;
			padding:2px;
			background-color:#228;
		}  

	#navigat2 ul li a:hover{
				color: #222; /* 000 */
				border:1px solid #F88;
				background-color:#DDF;
				padding:2px;
		}

	#navigat2 ul li a:focus{
				color: #222; /* 000 */
				border:1px solid #F88;
				background-color:#DDF;
				padding:2px;
		}

/* ----------------------------------------------------------- */


#main { /* Main ist die eine, linke Spalte, aside die rechte, andere Spalte */
	float: left; /* nur bei breitem Bildschirm */
	clear:both; /* fängt links an */
	width: 95%; /* bei schmalem BS 100 ab mittl. BS --- 95% wg. der Laufleiste */ 
	overflow:auto;
	/*border: 1px solid #eeeeee;*/
	border: 0px solid #000000;
	/*height:40%;*/
	/*min-height:2em;*/
	padding:0;
	margin:0;
	background-color: #fff;
	/*margin-bottom:2px;*/
}
	
/* bei schmalem Bildschirm */

/* Sektion liegt links neben dem Aside, in einer Section liegen articles */
section {/* für inhalt, in den sections liegen articles */
	float: left; /* nur bei breitem Bildschirm */
	overflow:auto;
	/*border: 1px solid #eeeeee;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	margin-bottom:2px;/* Abstand nach unten */
}

article {/* volle Breite über Inhalt  Einzelner Artikel innerhab einer Section*/
	overflow:auto;
	width: 99%;
	/* margin-right:3%; */
	margin-top:1%;
	background-color:#FFF; /* #EEE; #88F; */
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:left;
}

/* bei schmalem Bildschirm */
article.half1 {/* linke Hälfte von Inhalt */
	clear: both; /* Muss links anfangen */
	/*float: left; /* bei schmalem Bildschirm steht der Artikel ohne Nachbarn */ 
	width: 95%;  /* 95% wegen Scrollleiste bei schmalem Bildschirm, 49% bei breitem Bildschirm */
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	background-color:#FFF; /*#EEE; #AAF; */
	padding:5px;
}

article.half2 {/* rechte Hälfte von inhalt */
	clear: both; /* bei schmalem Bildschirm */
	/*float:left; /* bei schmalem Bildschirm steht der Artikel ohne Nachbarn */ 
	overflow: auto;
	width: 95%;  /* 49%; ab mittlerem Bildschirm */
	/*margin-left:1%; */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	background-color:#FFF; /* #EEE; #AAF;*/
	padding:5px;
}

/* bei schmalem Bildschirm */

aside {
	overflow:auto;
	clear:both; /* left ursprünglich bei schmalem Bildschirm */
	/* float: left; /* bei schmalem Bildschirm steht Aside ohne Nachbarn */ 
	width:95%;  /* 28 % bei breitem Bildschirm 36%; */
	border:0px green solid;
	/*border: 2px solid #F88;*/
	background-color:#EEE; /*#EEE; */
	/*min-height:3em;*/
	/* height:100%; */
	padding:10px;
	/*border-left:1px solid gray;*/
	font-size:1.1 em;  /* 1.1em; 18px*/
}

section.rechts {  /* als Ersatz für Aside */
	overflow:auto;
	clear:both; /* left ursprünglich bei schmalem Bildschirm */
	/* float: left; /* bei schmalem Bildschirm steht Aside ohne Nachbarn */ 
	width:95%;  /* 28 % bei breitem Bildschirm 36%; */
	border:0px green solid;
	/*border: 2px solid #F88;*/
	background-color:#EEE; /*#EEE; */
	/*min-height:3em;*/
	/* height:100%; */
	padding:10px;
	/*border-left:1px solid gray;*/
	font-size:1.1 em;  /* 1.1em; 18px*/
}





footer{
	clear: both;
	overflow:auto;
	width:99%;
	min-height:2em;
	margin-top:11px;
	background-color: #FFF; /*#EEE; #faf; */
	/*border:2px solid #000;*/
	border: 0px solid #000000;
	padding:10px;
}

	footer ul { /* Liste für Footer-Einträge horizontal */
		/*position: absolute;*/
		/* margin: 0 auto; */
		list-style: none;
}
 
	footer ul li {
		float: left;
		color: #fff;
		margin: 1px 1px 1px 20px;
		border:1px solid #000;
		background-color:#222;
		padding:2px;
}

	footer ul li a {
			color: #FFF; /* fff */
			text-decoration:underline;
			display:inline;
			border:1px solid #000;
			background-color:#222;
			padding:2px;
		}  

	footer ul li a:hover{
				color: #222; /* 000 */
				border:1px solid #F88;
				background-color:#FFF;
				padding:2px;
		}

	footer ul li a:focus{
				color: #222; /* 000 */
				border:1px solid #F88;
				background-color:#FFF;
				padding:2px;
		}


Wenn man Absätze nur eine bestimmte Breite darstellen will */
.oadrittl1 {/* 1/3 Breite links*/
	clear: both; /* */
	width: 95%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:left;
	}

.oadrittl2 {/* 1/3 Breite Mitte */
	width: 95%;  /* 95% wegen Scrollleiste 49% bei breiterem Bildschirm */
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	/*margin-left:auto;
	margin-right:auto;*/
	}
.oadrittl3 {/* 1/3 Breite rechts*/
	width: 95%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:left;
	}
	
.zwoadrittl1 {/* 2/3 Breite links */
	clear: both; /* */
	float:left; /* bei breitem Bildschirm links */
	overflow: auto;
	width: 95%;  /* 49%; ab mittlerem Bildschirm */ 
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	}
	
.zwoadrittl2 {/* 2/3 Breite rechts */
	/* clear: both; /* */
	float:left; /* bei breitem Bildschirm links */
	overflow: auto;
	width: 95%;  /* 49%; ab mittlerem Bildschirm */ 
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	}


.oaviertl1 {/* 1/4 Breite links*/
	clear: both; /* */
	width: 95%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:left;
	}

.dreiviertl1 {/* 3/4 Breite rechts*/
	/*clear: both;  */
	width: 95%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:left;
	}
	
	
	
	
/* @media (min-width: 30em) and (max-width: 60em) */
@media all and (min-width:480px) /* ############### and (max-width:800px) ####
###########################  Umbruch  #######################################
			#			#######		######
			#	#		#	  #		#	 #
			########	#######		#	 #
				#		#	  #		#	 #
				#		#######		######
#############################################################################*/
{/* größer 480px */

header {
	/*background-image:url(pano1.jpg);/* wird bei schmalen Bildschirmen ausgeschaltet 
	background-size: 100% 100%;
	background-repeat:no-repeat;	*/
	
	overflow:auto;
	height:auto;/*********************** auto ***********/
	
	}
	
#main {
	width:99%; /* 100% */
	}
	
.oadrittl1 {/* bei schmalerem Bildschirm 1/2 Breite*/
	width: 49%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:left;
	overflow:auto;
	}

.oadrittl2 {/* 1/2 Breite Mitte kommt bei schälerem Fenster nach rechts*/
	width: 49%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:left;
	overflow:auto;
/*	margin-left:auto;
	margin-right:auto;*/
	}
.oadrittl3 {/* 1/3 Breite rechts*/
	width: 100%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	/*clear: both;*/
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:right;
	overflow:auto;
	}
	
.zwoadrittl1 {/* 2/3 Breite links */
	/* clear: both; /* */
	float:left; /* bei breitem Bildschirm links */
	overflow: auto;
	width: 100%;  /* 49%; ab mittlerem Bildschirm */ 
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	}
	
.zwoadrittl2 {/* 2/3 Breite rechts */
	/* clear: both; /* */
	float:left; /* bei breitem Bildschirm rechts */
	overflow: auto;
	width: 100%;  /* 49%; ab mittlerem Bildschirm */ 
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	}

.oaviertl1 {/* 1/4 Breite links   */
	width: 50%; 
	}
	
.dreiviertl1 {/* 1/4 Breite links */
	width: 50%; 
	}
} /* größer 480px */

@media all and (min-width:640px) /* #################################### 
#######################################################################
			###			#			######
			#			#	#		#	 #
			######		########	#	 #
			#	 #			#		#	 #
			######			#		######

#########################################################################*/
{/* größer 640px */

header {
	/* background-image:url(pano2.jpg);/* panorama1.png wird bei schmalen Bildschirmen ausgeschaltet */
	/* background-size: 100% 100%;
	background-repeat:no-repeat;*/
	overflow:auto;
	height:auto;/*********************** auto ***********/

	}


.viertel {
	width:25%;
	overflow:auto;
	float:left;
}

.dreiviertel {
	width:75%;
	overflow:auto;
	float:left;
	
}

.viertel2 {
	width:20%;
	overflow:auto;
	float:left;
}

.dreiviertel2 {
	width:79%;
	overflow:auto;
	float:left;
	
}


	
	
article.half1 {/* linke Hälfte von Inhalt */
	float:left; /* darf einen Nachbarn haben */
	width: 48%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	overflow:auto;
	clear:left;
	}

article.half2 {/* rechte Hälfte von inhalt */
	/* clear: both;  */
	float:right; /* bei breitem Bildschirm right */
	overflow: auto;
	width: 48%;  /* 49%; ab mittlerem Bildschirm */
	margin-left:1%; 
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	clear:none;
	}
	
.oadrittl1 {/* 1/3 Breite links*/
	clear:both;
	width: 32%;  /*  */
	margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:left;
	}

.oadrittl2 {/* 1/3 Breite Mitte */
	float: left;
	clear:none;
	width: 33%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	}
.oadrittl3 {/* 1/3 Breite rechts*/
	clear:none;
	width: 33%;  /* 95% wegen Scrollleiste 49% bei breitem Bildschirm */
	/*margin-right:1%; /*bei breitem Bildschirm */
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	float:right;
	}
	
.zwoadrittl1 {/* 2/3 Breite links */
	/* clear: both;  */
	float:left; /* bei breitem Bildschirm links */
	overflow: auto;
	width: 66%;  /* 49%; ab mittlerem Bildschirm */ 
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	clear:left;
	}
	
.zwoadrittl2 {/* 2/3 Breite rechts */
	clear: none; /* */
	float:right; /* bei breitem Bildschirm links */
	overflow: auto;
	width: 67%;  /* 49%; ab mittlerem Bildschirm */ 
	margin-top:1%;
	/*border:1px solid #aaa;*/
	border: 0px solid #000000;
	padding:5px;
	padding-right:15px;
	}
	
.oaviertl1 {/* 1/4 Breite links*/
	width: 32%; 
	float:left;
	clear:left;
	}
	
.dreiviertl1 {/* 1/4 Breite rechts*/
	width: 67%; 
	clear:none;
	}
	
	

}/* größer 640px */

@media all and (min-width:960px) /* ####################################
#######################################################################
			######		###			######
			#	 #		#			#	 #
			######		######		#	 #
				 #		#	 #		#	 #
				 #		######		######

#########################################################################*/


{/* größer 960px */

header {  /*pano3.jpg */
	/* background-image:url(banner_1600_200_barriere_freiarm.png);/* wird bei schmalen Bildschirmen ausgeschaltet */
	/*background-size: 100% 100%;
	background-repeat:no-repeat;*/
	overflow:auto;
	height:auto;/*********************** auto ***********/

	}


section {
	float: left; /* bei breitem Bildschirm, 3-spaltig */
	width: 66%;  /* wg. Scrolleiste - ab mittlerem Bildschirm 63% */
	clear:both;
	/*margin-right:1%;  /* Abstand zum aside */
	}



#main{
	width:98%;
	float:left;
}

/* bei breitem Bildschirm über 960 */
aside {
	overflow:auto;
	clear:none; /*none */
	float: right; /* right bei breitem Bildschirm */
	width:32%;  /*bei breitem Bildschirm 33%; */
	/*border: 2px solid black;*/
	/*border: 0px solid #000000;*/
	background-color: #FFF; /*#EEE;*/
	margin-top:13px;
	padding-left:15px;
	/* border-left:1px solid gray;*/
	font-size:1.1 em;  /* 18px */
	}

section.rechts {
	overflow:auto;
	clear:none; /*none */
	float: right; /* right bei breitem Bildschirm */
	width:32%;  /*bei breitem Bildschirm 33%; */
	/*border: 2px solid black;*/
	/*border: 0px solid #000000;*/
	background-color: #FFF; /*#EEE;*/
	margin-top:13px;
	padding-left:15px;
	/* border-left:1px solid gray;*/
	font-size:1.1 em;  /* 18px */
	}


	
.oaviertl1 {/* 1/4 Breite links*/
	width: 25%; 
	float:left;
	}
	
.dreiviertl1 {/* 1/4 Breite rechts*/
	clear:none;
	width: 74%; 
	}
	
}/* größer 960px */