<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">
.scrollContainer {
		display: none;
		align-items: center;
}
		.scrollContainer &gt; .pfeil {
				flex: 0 0 20px;
				cursor: pointer;
		}
		.scrollContainer &gt; .pfeil.links {
				text-align: left;
				padding-right: 2em;
		}
		.scrollContainer &gt; .pfeil.rechts {
				text-align: right;
				padding-left: 2em;
		}
				.scrollContainer &gt; .pfeil &gt; img {
						width: 100%;
				}
						.scrollContainer .mitte {
								flex: 1 0 0;
								overflow: hidden;
						}
								.scrollContainer .liste {
										white-space: nowrap;
										margin-bottom: 2.45em;
										vertical-align: top;
								}
								.scrollContainer .liste:last-child {
										margin-bottom: 0;
								}
								.scrollContainer .colGroup {
										display: inline-block;
										vertical-align: top;
										margin-left: 0;
										margin-right: 22px;
										width: 200px;

										/* no-wrap wieder ausschalten */
										white-space: normal;
								}
								.scrollContainer .colGroup:last-child {
										margin-right: 0;
								}
										.scrollContainer .colGroup img {
												max-width: 100%;
										}
								/* das hier ist fuer die Inhalte im Scrollcontainer
								.scrollContainer .colGroup label {
										margin-top: 1em;
								}
								.scrollContainer .colGroup label:first-child {
										margin-top: 0;
								}
										.scrollContainer .liste label {
												display: block;
												text-align: center;
												position: relative;
										}
												.scrollContainer .liste input {
														display: none;
												}
												.scrollContainer .liste .containerBild {
														display: block;
														width: 120px;
														overflow: hidden;
														margin: 3px;	/ - * um fuer die Outline (wenn .checked) Platz zu haben * - /
												}
												.scrollContainer .liste label:hover .containerBild {
														outline: 1px solid #060606;
												}
												.scrollContainer .liste label.checked .containerBild {
														outline: 3px solid #000000;
												}
														.scrollContainer .liste .containerBild .bildInContainer {
																display: block;
																/ - * width: 100%; * - /
																height: 120px;
														}
														.scrollContainer .liste .bild {				/ - * img.bild - ersatzweise div.bild * - /
																width: 120px;
																/ - * height: 120px;  Kettenspanner- und Schnurwicklerbilder sind nicht mehr quadratisch * - /
																display: block;
																margin: 3px;
														}
														.scrollContainer .liste div.bild {			/ - * nur das leere Viereck (bei den Futterstoffen) * - /
																outline: 1px solid #060606;
														}
												.scrollContainer .liste label:hover .bild {
														outline: 1px solid #060606;
												}
												.scrollContainer .liste label.checked .bild {
														outline: 3px solid #060606;
												}
												.scrollContainer .liste .check {
														display: none;
														position: absolute;
														width: 42px;
														height: 42px;
														left: 50%;
														top: 52px;		/ - * 3px border inklusive * - /
														margin-left: -21px;
												}
												.scrollContainer .liste label.checked img.bild.check {
														display: inline-block;
												}
												.scrollContainer .liste .bez {
														display: block;
														margin-top: 0.5em;
														width: 120px;
														white-space: normal;
												}
												.scrollContainer .liste .bezZusatz {
														font-style: italic;
												}
												.scrollContainer .liste label.checked .bez {
												}
								*/
</pre></body></html>