/* taschen.css für alle Taschen-Dateien */

/***** Bild links - Bild rechts  -  Kommentar  *******/
.bilder-kommentar {
	width: 100%;
	max-width: 1120px;
	margin: 10px auto;
   display: flex;
   flex-flow: row wrap;
   
   }

.bild-links, .bild-rechts, .kommentar {
	flex: 1;
	margin: 10px 20px;
	/* background-color: white; */
	
}

.bildgroesse {
	width: 100%;
	background-position: center;
	background-size: cover;
}
h2, h3 {
	font-size: clamp(20px, 26px, 28px);
}
/***** Ende  ****   Bild links - Bild rechts  -  Kommentar   *******/


/* ######## Bilder Umrandung ################# */

.umr-doppelrot {
	border-radius: 30px;
	border: 5px double #aa0000;
	padding: 5px;
}
.umr-doppelgreen {
	border-radius: 30px;
	border: 5px double rgb(6,83,55);
	padding: 5px;
}

.umr-doppelgrey {
	max-width: 250px;
	height: auto;
	border-radius: 30px;
	border: 5px double grey;
	padding: 5px;
}

.umr-doppelweiss {
	max-width: 250px;
	height: auto;
	border-radius: 30px;
	border: 5px double rgba(255,255,255,0.2);
	padding: 5px;
}
.umr-doppelblue {
	border-radius: 30px;
	border: 5px double rgb(6,114,114);   
	padding: 5px;
	
}

/* ########### Ende Bilderumrandung ################# */


@media screen and (max-width: 650px) {
	.bild-links, .bild-rechts, .kommentar {
	flex-basis: 35%;	      				
	}
	
	.bild-links {
		margin-left: 2%;
	}
	.bild-rechts {
		padding-right: 2%;
	}
	.ausrichten {
		padding-left: 20%;
	}
	.welche_vorstellung {
		width: 70%;
	}

}