/*
			19.05.2016 15:34  Ronny fancybox_material eingebaut
			03.05.2016 10:37 Andy			umbau
			2016.12.05 11:03 Tim			Zweiten Kundenbilderlink gestyled
			2020.02.14       Tim			.notfound und zugehoerige Unter-Style hinzugefuegt
			28.07.2023		Swen			Regeln für "warenkorb_fenster" eingebaut
*/

.notfound {
		display: none;
}
		.msg_notfound {
				color: #888888;
				font-style: italic;
				margin: 40px;
				text-align: center;
		}

		.msg_notfound_icon {		/* z.B. die Meldung mit dem Icon */
				color: #888888;
				font-style: italic;
				margin-left: 40px;
				margin-right: 40px;
				margin-top: 100px;
				margin-bottom: 40px;
				text-align: left;
				line-height: 2em;
				margin-left: 5em;
		}
				.msg_notfound_icon img {
						float: left;
						margin-right: 1em;
				}

.link_Button {		/* "Alle Filter loesen", beim Notfound-Bereich */
			display: inline-block;
			text-decoration: none;
			margin: 0px 40px 40px 5em;
			cursor: pointer;
			color: #888888;
			border: 1px solid #e6e6e6;
			background-color: #f1f1f1;
			padding: 0.3em;
			font-size: 0.9em;
	}
			.link_Button:hover {
					color: #000000;
					border-color: #888888;
			}
			.link_Button:active {
					color: #000000;
					border-color: #888888;
					border-style: inset;
			}


#standard_sortier_feld {
    display:none!important;
}
a img {
		border: 0;
}


.artikel_alle {
		/*display: flex;*/
		margin-top: 2em;
}
.artikel_alle:after {
  content: "";
  display: block;
  clear: both;
}
.artikel_alle .auswahl_eingrenzen {
	float: left;
}
.xListing {
		margin-left: 3%;
}

.artikel_alle .interessante_artikel  .xListing .hauptbild {
    position: relative;
    text-align: center;
    width: 100%;
    padding: 0;
    border: 1px solid transparent;
}
.artikel_alle .interessante_artikel  .xListing a {
    text-decoration: none;
    color: #444444;
    display: inline-block;
    width: 100%;
}
.artikel_alle  .interessante_artikel .xListing .bottom {
    clear: both;
    padding-top: .15em;
}
.artikel_alle  .interessante_artikel .xListing .bottom .preis {
    text-align: center;
    height: 32px;
    border: 1px solid #f1f1f1;
    background-image: url(/bilder/pfeil-rechts.svg);
    background-repeat: no-repeat;
    background-position: 94% center;
    background-size: 6px 9px;
    line-height: 32px;
    margin-top: 0;
}
.artikel_alle  .interessante_artikel .xListing .bottom .preis {
    font-weight: bold;
    text-align: left;
}

.ajax_lade {
		visibility: hidden;
		position: absolute;
		top: -30px;
		right: 10px;
}


.artikel_alle .mainRight {
		float: left;
		width: calc(100% - 300px);
		/*width: 80.3%;*/
		margin-right: 1%;
		margin-bottom: 2em;
}



/*
#fenster_warenkorb {
		width: 600px;
}
#fenster_warenkorb #fenster_warenkorb_top {
		padding: 40px;
}
		#fenster_warenkorb #fenster_warenkorb_top_left {
				float: left;
				width: 34%;
				position: relative;
		}
				#fenster_warenkorb #warenkorb_box_produktbild {
						/ * width: 161px; * /	/ * es kam vor, dass die Bilder zu gross waren und hier nicht reingepasst haben * /
						max-height: 250px;
						max-width: 161px;
				}
				#fenster_warenkorb #warenkorb_icon_hinzugefuegt {
						position: absolute;
						top: 50%;
						margin-top: -27px;
						left: 50%;
						margin-left: -27px;
						display: none;
				}
		#fenster_warenkorb #fenster_warenkorb_top_right {
				float: right;
				width: 64%;
		}
				#fenster_warenkorb #warenkorb_box_status {
						border-bottom: 1px solid #e6e6e6;
						padding-bottom: 7px;
						margin-bottom: 20px;
						font-size: 1.2em;
				}
				#fenster_warenkorb #warenkorb_box_titel {
						font-size: 1.1em;
						font-weight: bold;
				}
				#fenster_warenkorb #warenkorb_box_groesse {

				}
				#fenster_warenkorb #warenkorb_box_preis {
						color: #888888;
				}
				#fenster_warenkorb #warenkorb_box_sonderwunsch_ueberschrift {
						display: none;		/ * wird ueber Javascript angeschalten * /
						margin-top: 2em;
				}
				#fenster_warenkorb #warenkorb_box_sonderwunsch {
						font-style: italic;
						color: #888888;
				}

		#fenster_warenkorb_top_buttons {
				margin-top: 28px;
		}
				#fenster_warenkorb_top_buttons .left {
						float: left;
						display: block;
						text-transform: uppercase;
						border: 2px solid #bf0008;
						height: 43px;
						line-height: 43px;
						color: #bf0008;
						padding-left: 1em;
						padding-right: 46px;
						cursor: pointer;
				}
				#fenster_warenkorb_top_buttons .right {
						float: right;
				}

#fenster_warenkorb #fenster_warenkorb_bottom {
		display: none;
		border-top: 5px solid #e6e6e6;
		padding: 2em;
}
		.fenster_warenkorb_bottom_ueberschrift {
				font-size: 13pt;
		}
		.warenkorbAehnlichArtikel {
				display: inline-block;
				width: 161px;
				vertical-align: top;
				margin-top: 1em;
				margin-right: 1em;
				color: #444444;
				text-decoration: none;
		}
				.warenkorbAehnlichArtikel img {
						width: 161px;
						border: none;
				}
				.warenkorbAehnlichArtikelTitel {
						font-size: 85%;
						text-align: center;
				}
				.warenkorbAehnlichArtikelPreis {
						font-size: 85%;
						font-weight: bold;
						text-align: center;
				}

#fenster_warenkorb .warenkorb {
		display: inline-block;
		cursor: pointer;
}

		#fenster_warenkorb .warenkorb .warenkorb_text, #fenster_warenkorb .warenkorb .warenkorb_symbol {
				display: inline-block;
				height: 43px;
				line-height: 43px;
				color: #444444;
		}
		#fenster_warenkorb .warenkorb .warenkorb_text {
				text-transform: uppercase;
				border-right: 1px solid #ffffff;
				width: 160px;
				text-align: center;
				background-color: #e6e6e6;
		}
		#fenster_warenkorb .warenkorb .warenkorb_symbol {
				padding-left: 12px;
				padding-right: 12px;
				background-size: auto 30px;
				background-repeat: no-repeat;
				background-position: center;
				width: 40px;
				background-color: #e6e6e6;
				background-image: url(bilder/wk_schwarz.svg);
		}
		#fenster_warenkorb .warenkorb.deaktiviert {
				opacity: 0.4;
				cursor: not-allowed;
		}
*/
#fenster_warenkorb, #fenster_warenkorb * {
	box-sizing: border-box;
}
#fenster_warenkorb {
	padding: 1rem 1rem 0 1rem;
	font-size: 1rem;
	position: fixed;
	top: 100%;
	border: 1px solid #000;
	background: #fff;
	width: 50%;
	max-width: 650px;
	min-width: 420px;
	left: 50%;
	transform: translate(-50%, 0%);
	max-height: calc(100% - 2rem);
	overflow: auto;
	z-index: 1500;
	transition: top 0.25s;
	display: flex;
	flex-flow: row wrap;
	gap: 1rem;
}
#fenster_warenkorb.display {
	top: 1rem;
}
#fenster_warenkorb #fenster_warenkorb_texte {
	margin-bottom: 0.5rem;
}
#fenster_warenkorb.display #warenkorb_box_titel {
	margin-bottom: 1rem;
}

#fenster_warenkorb.display #warenkorb_icon_hinzugefuegt  {
	transform: translate(-50%,-50%) scale(1);
}
#fenster_warenkorb #closer {
	position: absolute;
	left: calc(100% - 2rem);
	top: 1rem;
	font-weight: bold;
	background: url("/xArtikelsystem/bilder/icon_closer.svg") no-repeat 50% 50%;
	background-size: 100% auto;
	cursor: pointer;
	width: 1rem;
	height: 1rem;
}
#fenster_warenkorb #fenster_warenkorb_top {
	width: 100%;
	display: grid;
	gap: 1rem;
	grid-template-columns: 10rem 1fr;
	grid-template-rows: 2.5rem 1fr auto;
	grid-template-areas:	"status status"
							"topLeft topRight"
							"boxPreis boxPreis"
							"topBtns topBtns";
}
#fenster_warenkorb #fenster_warenkorb_top.error {
	grid-template-areas:	"status status"
							"topRight topRight"
							"boxPreis boxPreis"
							"topBtns topBtns";
}
#fenster_warenkorb #warenkorb_box_status {
	grid-area: status;
}
#fenster_warenkorb #fenster_warenkorb_top_left {
	grid-area: topLeft;
	position: relative;
	margin: auto;
}
#fenster_warenkorb #warenkorb_box_produktbild {
	width: 100%;
	display: block;
}
#fenster_warenkorb #warenkorb_icon_hinzugefuegt {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%) scale(0);
	transition: transform 0.1s;
	transition-delay: 0.5s;
	transition-timing-function: ease-in-out;
}
#fenster_warenkorb #fenster_warenkorb_top_right {
	grid-area: topRight;
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr auto;
}
#fenster_warenkorb #warenkorb_box_groesse,
#fenster_warenkorb #warenkorb_box_attribute {
	font-size: small;
}
#fenster_warenkorb #warenkorb_box_preis {
	font-weight: 700;
	font-size: 1.25rem;
	text-align: right;
	line-height: 0.8em;
	grid-area: boxPreis;
}
#fenster_warenkorb #warenkorb_box_preis > small {
	font-weight: 300;
	font-size: .875rem;
}
#fenster_warenkorb #fenster_warenkorb_top_buttons {
	grid-area: topBtns;
	display: flex;
	gap: 1rem;
	flex-flow: row nowrap;
	justify-content: space-between;
}
#fenster_warenkorb #fenster_warenkorb_top_buttons > a {
	margin-bottom: 1rem;
}
#fenster_warenkorb #warenkorb_box_sonderwunsch_ueberschrift {
	margin-top: 0.5rem;
	font-weight: 400;
}
#fenster_warenkorb #warenkorb_box_sonderwunsch_ueberschrift,
#fenster_warenkorb #fenster_warenkorb_bottom_ueberschrift {
	display: none;
}
#fenster_warenkorb_bg {
	position: fixed;
	z-index: 1200;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.15) url('/img/loading.png') no-repeat 50% 50%;
	background-size: 5rem auto;
	opacity: 0;
	display: none;
	backdrop-filter: blur(1rem);
	transition: opacity 0.25s;
}
#fenster_warenkorb_bg.display {
	opacity: 1;
}
#fenster_warenkorb_bg.noBgImg {
	background-image: none;
}

#warenkorb_box_status {
	text-align: center;
	width: 100%;
	font-family: var(--secondaryFont);
	font-size: 1.25rem;
	font-weight: 400;
}
#fenster_warenkorb .btn4, #fenster_warenkorb_zurueck {
	background-image: url("/xArtikelsystem/bilder/icon_bag_weiss.svg");
	background-repeat: no-repeat;
	background-position: 1rem 50%;
	background-size: 1rem auto;
	padding-left: 3rem;
}
#fenster_warenkorb_zurueck {
	background-image: url("/xArtikelsystem/bilder/icon-2-forward-right.svg");
	background-size: 1.5rem auto;
	margin-bottom: 1rem;
}













/*********************************************
 *
 *		MEDIA Einstellungen für ArtikelListing
 *
 *		Ich versuche mit 4 Media angaben hinzukommen
 *
 *		> 	1260 	ist standard
 *		<= 	1260
 *		<= 	1024
 *		<=	786
 *		<=	480
 *
 *********************************************/
.artikel_alle .blockListing .xListing {
		/* ersetzt margin-right: 0; bei ".artikel_alle .blockListing .xListing a:nth-child(4n)" */
		margin-bottom: 3em;		/* Abstand zum Trenner-Banner */
		-moz-column-count:6;
		-webkit-column-count:6;
		column-count:6;
		width:99.1%;

}




@media (max-width: 1260px) {
		/*.artikel_alle .mainRight { width: 77%; }*/
        .artikel_alle .blockListing .xListing {
                -moz-column-count:5;
                -webkit-column-count:5;
                column-count:5;
         }
		.artikel_alle .blockListing .xListing .artikelbox { width: 21%; }

}

@media (max-width: 1024px) {
	/*
		.artikel_alle .auswahl_eingrenzen {
				display: none;
		}*/
		.xListing {
		  margin-lefT: 0;
		}
		.artikel_alle .mainRight {
				float: none;
				width: 100%;
				display: block;
				margin-left: 0.7%;
				padding-left: 0% !important;
				padding-top:7px;
		}
		.artikel_alle .blockListing .xListing .artikelbox { width: 16.8%; }
            .artikel_alle .blockListing .xListing {
				-moz-column-count:3;
				-webkit-column-count:3;
				column-count:3;
		}
}

@media (max-width: 768px) {
		.artikel_alle .blockListing .xListing .artikelbox { width: 21.8%; }
}
@media only screen and (max-width: 500px) {
	#fenster_warenkorb {
		width: calc(100% - 2rem);
	}
	#warenkorb_box_status {
		margin-top: 0.5rem;
		font-size: 1rem;
	}

}
@media (max-width: 480px) {
		.artikel_alle .blockListing .xListing .artikelbox { width: 46.8%; }
        .artikel_alle .blockListing .xListing {
				-moz-column-count:2;
				-webkit-column-count:2;
				column-count:2;
		}
}


@media (max-width: 360px) {		/* 1 spaltig */
		.artikel_alle .blockListing .xListing {
				-moz-column-count:1;
				-webkit-column-count:1;
				column-count:1;
		}
}


		.artikel_alle .mainRight > h1 {
				margin-top: 0;
				padding-bottom: 25px;
				line-height:0.8em;
		}
		.artikel_alle .ueberschrift_suchleiste .suchleiste h1 {
				font-weight:normal;
				margin:0;
				font-size:18px;
				display:inline-block;
		}


		.artikel_alle .blockListing .xListing > div {
				min-height:600px;
		}


.artikel_alle .text_after {
		margin-left:1.2%;
}


		.artikel_alle .blockListing .xListing a {		/* 4 spaltig */
				display: inline-block;
				text-decoration: none;
				margin-bottom: 1.4em;
				position: relative;
				color: #444444;
				width:90%;
		}

				.artikel_alle .blockListing .xListing .hauptbild {
						text-align: center;
						float: left;
				}
						.artikel_alle .blockListing .xListing .hauptbild img {
								display: block;
								width: 100%;
								height:auto;
						}
				.artikel_alle .blockListing .xListing .hauptbild {
						width: 100%;
						min-height: 120px;
				}

				.artikel_alle .blockListing .xListing .artikelVorschau {
						float: left;
						margin-left: 5.7%;
						margin-right: 5.7%;
						padding-bottom: 4px;
						width: 20%;
				}
				.artikel_alle .blockListing .xListing .vorschauWeitere {
						float: left;
						margin-left: 5.7%;
						margin-right: 5.7%;
						display: block;
						text-align: center;
						width: 20%;
						font-weight: bold;
						font-size: 12pt;
						height: 9pt;
						line-height: 9pt;
				}
				.artikel_alle .blockListing .xListing .bottom {
						clear: both;
						padding-top: 1em;
						font-size: 0.85em;
				}
						.artikel_alle .blockListing .xListing .bottom .preis {
								float:none;
								text-align: right;
								font-weight:bold;
						}

						.artikel_alle .blockListing .xListing .bottom .groesse {
								float:none;
								text-align: right;
						}

						.artikel_alle .blockListing .xListing .bottom .groesse span,
						.artikel_alle .blockListing .xListing .bottom .preis span {
								float:left;
						}

				.artikel_alle .blockListing .xListing .box_detail {
						display: none;
						border: 1px solid #cfcfcf;
						height:100%;
						left: 50%;
						transform: translateX(-50%);
						position: absolute;
						top: -10px;
						width: 112%;
						background-color: #ffffff;
						border-bottom:none;
				}


				.artikel_alle .blockListing .xListing a:hover .box_detail {
						display: block;
						z-index: 20;
				}

				.artikel_alle .blockListing .xListing a:hover .box_detail .box_detail_bottom {
						background-color: #fff;
						border:solid 1px #cfcfcf;
						bottom: -65px;
						height: 65px;
						left: -1px;
						position: absolute;
						width: 86%;
						border-top:none;
						font-size:11px;
						padding:0 7%;
				}

				.artikel_alle .blockListing .xListing a:hover .box_detail .bottom {
						background-color: #fff;
						bottom: -97px;
						clear: both;
						font-size: 0.85em;
						left: -1px;
						padding: 0 7% 1.5em 7%;
						position: absolute;
						width: 86%;
						height:28px;
						border:1px solid #c4c4c4;
						border-top:none;
				}

						.artikel_alle .blockListing .xListing a:hover .box_detail .bottom .preis {
								float:none;
								text-align: right;
								font-weight:bold;
						}

						.artikel_alle .blockListing .xListing a:hover .box_detail .bottom .groesse {
								float:none;
								text-align: right;
						}

				.artikel_alle .blockListing .xListing a:hover .hauptbild {
						z-index: 21;
						position: relative;		/* z-index funktioniert nur in Kombination von position */
				}



.einzelartikel_trenner {
		text-align: center;
		margin-top: 1em;
		margin-bottom: 1em;
		border-top: 1px solid #e6e6e6;
		position: relative;
		max-width: 970px;
		margin-left: auto;
		margin-right: auto;
}
		.einzelartikel_trenner img.trenner {
				max-width: 970px;		/* die eigentliche Bildgroesse */
				width: 100%;			/* so wird es responsive dynamisch gross */
				display: block;			/* so koennen die Margins zwischen diesem und dem darauf folgenden Element zusammenfallen */
				margin-left: auto;
				margin-right: auto;
				margin-top: 3em;
				margin-bottom: 2em;
		}
		.einzelartikel_trenner .text {
				font-size: 0.85em;
				margin: 2em;
		}