/*
		30.01.17 carsten  		ie 9+ (ohne edge) hack fï¿½r fehlendes column-count in seo-kategorie-seiten (ganz unten vor media queries)
								Style Angaben fuer das moderne und schlichte Design (eingefuehrt ab X-Artikelsystem(Flaechenvorhaenge), ohne linkem Menue (ausser die Filter))
		20180517	menu-anweisungen nach /css/menu.css ausgelagert
		21.03.2019	Tim			"body strong" { font-weight } hinzugefuegt, weil "body" mit { font-weight } auch "body strong" ueberschreibt
		27.01.2020	Tim			angepasst / erweitert fuer mobiles Layout
		24.03.2020	Swen		#COVID Style eingebaut
		08.04.2020	Tim			text_bevor wieder eingeblendet (bei bildschirm < 768px display:none entfernt)
		24.09.2020	Tim			min-height bei .inhalt_mitte fuer neuen (2020) Rollo-Konfigurator von 600px auf 300 reduziert
		08.10.2020	Swen		@media (max-width: 1220px) auf 1425px gesetzt
		30.03.2021  Tim			globale html, body Definition wieder rausgenommen (mit height 100% und overflow scroll)
*/

/********************************************
 *
 *			GLOBAL
 *
 ********************************************/
body {
	color: #0E0E0F;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	line-height: 1.625em;
	margin: 0;
}

h1,
h2,
h3,
h4 {
	font-weight: 500;
	color: #0E0E0F;
}

h1 {
	font-size: 1.75em;

}

h2 {
	font-size: 1.5em;
}

h3 {
	font-size: 1.375em;
}

h4 {}

p {
	font-size: 1.125em;
}

@media (max-width: 500px) {
	h1 {
		font-size: 1.5em;
		line-height: 1.23em;

	}

	h2 {
		font-size: 1.375em;
	}

	h3 {
		font-size: 1.25em;
	}
}

a {
	color: #000;
}

a:hover {
	color: #000;
}



/*
li, p {
		font-size:16px;
		color:#0E0E0F;
		line-height: 1.4em;
}
*/
.listingBox {
	margin-right: 1.9%;
}

.flexFill {
	height: 0;
	padding-top: 0;
	padding-bottom: 0;
	margin-top: 0;
	margin-bottom: 0;
}

/*
		.layout_option_header_schmal
				Schmaler Header im Layout.
				Wird zum groessten Teil als zusatz an bereits bestehende elemente angehï¿½ngt
 */

.artikel .gp,
.artikel_alle .listing .gp,
.warenkorbAehnlichArtikelPreis .gp {
	font-size: .8em;
	margin-top: 10px;
	color: #ccc;
}

.tabs-container .preis .gp {
	position: absolute;
	left: 25%;
	top: 3px;
	visibility: hidden;
}

.tabs-container .preis:hover .gp {
	visibility: visible;
}




.versandzeit>img {

	max-height: 50px !important;

}

body strong {
	/* 21.03.2019 - tim - weil in body { font weight } auch die Strong-Elemente ueberschreibt, hier Korrektur definieren */
	font-weight: 600;
	/* standard fuer bold ist 700. hier aber etwas weniger, weil in body auch etwas weniger (300) als Standard (400) definiert wurde */
}

@media (min-width: 801px) {

	/* bei kleiner als 500px gibt es jetzt ein eigenes mobile Layout */
	body.layout_option_header_schmal {
		margin-top: 80px;
	}

	.layout_option_header_schmal .banner_wrapper_ws {
		margin-top: 60px;
	}

	#dropdownMenuButton,
	.banner_warenkorb,
	#banner_suche {
		margin: 0 1em;
	}
}

p,
li,
td {
	/*font-size:12pt!important;*/
}

div.theme_img img {
	height: auto;
	max-width: 100%;
	width: 100%;
}

input[type="number"] {

	-webkit-appearance: none;
	-moz-appearance: textfield;

}

input[type="search"] {

	-webkit-appearance: none;
	-moz-appearance: textfield;

}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.clear {
	clear: both;
	height: 0;
	line-height: 0;
	display: block;
	/* sonst wirkt line-height nicht bei inline-Elementen wie <br> */
	overflow: hidden;
}

.contentAsp {
	padding: 1em 1%;
	margin: 1em auto;
	max-width: 816px;
}

.contentAsp .pit_threemedium {
	float: none;
	display: inline-block;
}

button,
.button,
a.button {
	/* Die Klasse .button kann fuer Links verwendet werden, die wie Buttons aussehen sollen */
	display: inline-block;

	background-color: #0E0E0F;
	text-decoration: none;

	cursor: pointer;
	/*font-size: 0.9em;*/

	/*border: 1px solid #f18719;
		border-radius: 0!important;*/
	border-radius: 0;
	font-weight: 400;
	color: #FFFFFF;
	padding: 0.75em 1em;
}

button>*,
.button>* {
	vertical-align: middle;
}

button>img,
.button>img {
	/*height: 17px;*/
	/* padding-left: 1ex;        hierfuer muss das Icon rechts vom Text sein */
	/*padding-right: 1ex;*/
	/* hierfuer muss das Icon links vom Text sein */
}

button:hover,
.button:hover,
a.button:hover {
	/* box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.25);*/
}

button:focus,
.button:focus,
a.button:focus {
	/* box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.25);*/
}

button:active,
.button:active,
a.button:active,
input[type="submit"]:active {}

button.highlight,
.button.highlight,
a.button.highlight,
input[type="submit"].highlight {
	background-color: #FACF00;
	color: #0E0E0F;
	/*		border-bottom: 4px solid #f1f1f1;*/
	font-weight: 400;
	font-size: 1.125em;

}

.button.highlight.optionuebernehmen {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

.ausklapptext {
	/*display: none;*/
	height: 0;
	overflow: hidden;
	transition: height 0.25s;
}

.button.buttonAusklapptextAktiv,
.button.buttonAusklapptext {
	border: 1px solid #0E0E0F;
	padding: 0;
	line-height: 3.2em;
	width: 11.5em;
	text-align: center;
	font-weight: 100;
	font-size: .875em;
}

.button.buttonAusklapptextAktiv {
	background: #F2F2F4;
	color: #0E0E0F;
}

.button.buttonAusklapptextAktiv span {
	background: url("/i/layout/arrow_upward.svg") no-repeat 0% 50%;
	background-size: auto 1.5em;
	padding-left: 1.5em;
}

p.kursiv {
	font-style: italic;
}


img {
	border: none;
}


.mobile_schmal {
	display: none !important;
}

/* wird nur in den kleineren Versionen eingeblendet. */



.banner_wrapper_ws * {
	box-sizing: border-box;
}

.banner {
	padding-right: 2em;
}

/*Suche */
#banner_suche {
	display: flex;
}

#banner_suche input {
	line-height: 50px;
	transition: all 0s ease 0s;
}

#banner_suche * {
	border: 0;
	border-radius: 0;
	padding: 0;
	margin: 0;
	transition: all 0s ease 0s;
}

#banner_suche.default input[type="search"] {
	width: 0;
}

#banner_suche.default input[type="submit"] {
	background: transparent url("/bilder/lupe_schwarz.svg") no-repeat 100% 50%;
	background-size: auto 1.5em;
	padding-left: 2em;
	margin-right: 1em;
}

#banner_suche.default::after {
	content: "Suche";
	display: block;
}

#banner_suche.aktiv::after {
	content: "";
	display: none;
}



#banner_suche.aktiv input[type="search"],
#banner_suche.aktiv input[type="search"]:focus-visible {
	width: 100%;
	background: #f2f2f4;
	border-radius: 25px 0 0 25px;
	padding-left: 25px;
}

#banner_suche input[type="search"]:focus-visible {
	outline: 0;
}

#banner_suche.aktiv input[type="submit"] {
	background: #000 url("/bilder/lupe_weiss.svg") no-repeat 50% 50%;
	background-size: auto 1.75em;
	padding: 0 25px;
}

/*
.banner_suche {
						-webkit-flex:1;
                                -webkit-box-flex:1;
                                -moz-flex:1;
                                -moz-box-flex:1;
                                -ms-flex:1;
                                flex:1;
						text-align:right;
						font-size: 13px;
						position:relative;
				}

						.banner_suche input[type="search"] {
								background-color: #f7f7f7;
                                border: 1px solid #ccc;
                                border-radius: 0;
                                -webkit-appearance: textfield;
                                box-sizing: border-box;
                                color: #7f7f7f;
                                font-family: "Open Sans",sans-serif;
                                height: 40px;
                                padding: 0 0 0 2%;
                                width: 100%;

						}
								.banner_suche input::-webkit-input-placeholder {
										color: #7a7a7a;
								}
								.banner_suche input::-moz-placeholder {
										color: #7a7a7a;
								}
								.banner_suche input:-ms-input-placeholder {
										color: #7a7a7a;
								}
								.banner_suche input:-moz-placeholder {
										color: #7a7a7a;
								}
								.banner_suche input::placeholder {
										color: #7a7a7a;
								}

						.banner_suche input[type="submit"] {
                            background-image: url("/bilder/lupe-grau-gross.svg");
                            background-position: center center;
                            background-repeat: no-repeat;
                            background-size: auto 80%;
                            border: medium none;
                            border-radius: unset;
                            height: 25px;
                            padding: 0;
                            position: absolute;
                            right: 6px;
                            top: calc(50% - 12.5px);
                            width: 25px;
							background-color: #f7f7f7;
                        }
						*/
/*************************************************/

/********************************************
 *
 *			LAYOUT
 *
 ********************************************/
#layout_header:not(.layout_option_header_schmal #layout_header) {
	border-top: 12px solid #FACF00;
}

.feste_breite {
	/*max-width: 1920px;*/
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	/* fuer die rechten Tabs - die sind absolut */
}

.contentWidthMax {
	width: 100%;
	max-width: 1636px;
	margin: auto;
	/*padding-left: 2em !important;
	padding-right: 2em !important;*/
	box-sizing: border-box;
}

div.contentWidthMax.flexBanner {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.seotext {
	width: 90%;
	max-width: 1059px;
	margin: 3em auto;
}

#feste_breite {
	/*margin-top: 1em;
	margin-bottom: 4em;*/
	padding: 1em;
}

@media (max-width: 500px) {
	#feste_breite {
		margin-top: 0;
		/* stoert im mobilen Layout */
	}
}

.layout_leiste_full {
	/*margin-bottom: 19px;*/
	/* wenn das margin-bottom hier erhoeht werden soll, dann vorher bitte mit dem Plissee-Konfigurator abstimmen! */
	/* border-top: 3px solid #f1f1f1; */
	/* border-bottom: 3px solid #f1f1f1; */
	background: #f2f2f4;
}

/*.layout_option_header_schmal .layout_leiste_breadcrumb {display:none;}*/
.layout_option_header_schmal .layout_leiste_full {
	margin-top: 0px;
	box-shadow: 0 10px 10px #eee;
	margin-bottom: 10px;
	border: 0;
}

.seotext {
	width: 80%;
	max-width: 1059px;
	margin: 3em auto;
}

.layout_option_header_schmal .banner_links_slogan,
.mitarbeiter_kleiner_bildschirm_ {
	display: none;
}


.layout_option_header_schmal .banner_wrapper_ws {
	height: 72px;
	margin: 0 2px;
	padding: 0 1em;
	background: #fff none repeat scroll 0 0;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	box-sizing: border-box;
	/*z-index: 9999;*/
	z-index: 1000;
	opacity: 0.85;

}

.layout_option_header_schmal .banner_wrapper_ws:hover {
	opacity: 1;
}

/*.layout_option_header_schmal .inhalt {padding:0}*/

.layout_leiste_full.layout_option_header_schmal .trenn {
	width: 3px;
	background-color: #f1f1f1;
	height: 31px;
	display: inline-block;
	padding: 0;
	flex: 0 auto;
	margin-top: 8px;
}

.layout_leiste_full.layout_option_header_schmal .banner_links {
	padding: 0 !important;
	white-space: nowrap;
	margin: 5px 1% 5px 2% !important;
	display: inline-block;
	flex: 0 auto;
}

.layout_leiste_full.layout_option_header_schmal .banner_links_logo {
	width: 250px;
	display: inline;
	float: none;
	vertical-align: top;
	margin-top: 3px;
	margin-right: 0px;
}

.layout_leiste_full.layout_option_header_schmal .banner_links_schriftzug {
	font-size: 1.5em;
	display: inline-block;
}




.breadcrumb_erklaerung {
	margin-left: 0;
}




#leisteNavigationTelefon {
	cursor: auto;
	/*margin-top: 1px;*/
	flex: 0 1 auto;
	margin-left: 30px;
	position: relative;
	background-color: #fff;

}

#leisteNavigationTelefon .slide {
	display: flex;
	align-items: center;
}

#leisteNavigationTelefon .slide.first {
	height: 60px;

}

#leisteNavigationTelefon .slide.first .niemandDa {
	font-size: 0.8rem;
	font-weight: 400;
	padding-top: 5px;
	padding-top: 4px;
	margin-right: 15px;
}


/*
	#leisteNavigationTelefon .slide.first .niemandDa a {
			color: blue;
			text-decoration: underline;
			padding: 0;
			font-size: 0.9em;
	}

				#leisteNavigationTelefon .slide.first .niemandDa a:hover {
						background:none;
						color:#de8903;
				}
	*/

#leisteNavigationTelefon .other {
	display: none;
	position: absolute;
	right: 44px;
	/*bottom: -80px;*/
	z-index: 100;
	border-radius: 2px;
	/*width:250px;*/
}

/*
										.layout_option_header_schmal #leisteNavigationTelefon .other {
												width: 230px;
												top: 0;
										}*/





#leisteNavigationTelefon:hover .other {
	display: block;
	top: 60px;
	white-space: nowrap;
}


#leisteNavigationTelefon .other .slide {
	border-top: 1px solid #f1f1f1;
	background-color: #fff;
	padding-left: 10px;
	/* display: none;*/
}

#leisteNavigationTelefon .other .slide:nth-child(2) {
	border-top: none;
}

#leisteNavigationTelefon .slide>*>img {
	vertical-align: middle;
	max-height: 82px;

}

.leisteNavigation_ansprechpartner_nameTel {
	flex: 0 1 auto;
	font-size: 1em;
	text-align: right;
}

.leisteNavigation_ansprechpartner_nameTel i {
	font-size: 0.8em;
}

.leisteNavigation_ansprechpartner_nameTel strong {
	font-weight: 400;
}

.leisteNavigation_ansprechpartner_Bild {
	flex: 0 1 auto;
	padding: 5px;
	/*background-color:#f1f1f1;
												border:5px solid #fff;*/
	margin-left: 0.5em;
	margin-right: 0.5em;
	overflow: hidden;
	height: 60px;

}

.leisteNavigation_ansprechpartner_Bild img {

	height: 60px;
	width: auto;
	border-radius: 2px;

}

.layout_option_header_schmal .leisteNavigation_ansprechpartner_Bild {
	padding: 0px;
	border: none;
	margin-top: 3px;
}

.layout_option_header_schmal .leisteNavigation_ansprechpartner_Bild img {
	max-height: 43px !important;
	margin-top: 0.6em;
}


.leisteNavigation_ansprechpartner_livechat {
	flex: 0 1 auto;
	font-size: 1.2em;
	white-space: nowrap;

	text-transform: uppercase;
	font-style: italic;
}

.leisteNavigation_ansprechpartner_livechat a {
	/*padding-right: 40px;*/

}

.leisteNavigation_ansprechpartner_livechat a:hover {
	background: transparent;
	background-color: transparent;
	background-image: none;

}

.leisteNavigation_ansprechpartner_livechat a.online {

	background: url('/bilder/layout/icon_livechat.svg') right center no-repeat;
	font-weight: 400;

}

.leisteNavigation_ansprechpartner_livechat a.online span {
	color: #444;
}

.leisteNavigation_ansprechpartner_livechat a.offline {
	display: none;
	background: url('/bilder/layout/icon_livechat_offline.svg') right center no-repeat;
}

.leisteNavigation_ansprechpartner_livechat img {
	vertical-align: top !important;
}

.leisteNavigation_ansprechpartner_livechat span {
	padding-right: 0.5em;
}

.leisteNavigation_ansprechpartner_livechat span strong {
	font-weight: 600;
}

.leisteNavigation_ansprechpartner_mailicon {
	display: inline-block;
	/*margin-top:.7em;*/
	padding-left: 0.8em;
	padding-right: 11px;
	margin: 1em 0;
}

.niemandDa+.leisteNavigation_ansprechpartner_mailicon {
	display: inline-block;
}

.leisteNavigation_ansprechpartner_mailicon.startseite {
	display: inline-block;
	margin: 10px 0;
}

.leisteNavigation_ansprechpartner_mailicon a {
	padding: 0;
}

.leisteNavigation_ansprechpartner_mailicon img {

	padding: 5px 0 6px 0;

}

.leisteNavigation_ansprechpartner_Tel_symbol {
	border-right: 3px solid #f1f1f1;
	border-left: 3px solid #f1f1f1;
	padding: 0.3em;
	padding-left: 0.8em;
	display: none;
	padding-right: 0.8em;
	margin-right: 0.8em;
}



.layout_leiste_breadcrumb {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	min-height: 50px;
	padding: 0 2.7%;
}

.layout_breadcrumb {
	position: relative;
	display: flex;
	align-items: center;
	margin-top: 0;
}

.breadcrumb_erklaerung {
	display: inline-block;
}

.breadcrumbs {
	display: inline-block;
}

.banner_zahlarten {
	text-align: right;
}

.banner_zahlarten_info {
	/*font-size: 11px;*/
	cursor: pointer;
	flex: 0 auto;
	/*margin-top: 14px;*/
}

.banner_zahlarten_info {
	/*margin: 1em;*/
	opacity: .8;
}

.banner_zahlarten_info>div {
	display: flex;
	justify-content: space-between;
	margin: auto;
}

.banner_zahlarten_info>div {
	width: 250px;
}

.banner_rechts {
	text-align: right;
}

.banner_rechts>div {
	width: 100%;
	display: inline-flex;
	text-align: left;
}

.banner_zahlarten_info a {
	display: inline-block;
	line-height: 50px;
	text-decoration: none;
}

.banner_zahlarten_info a.bewertung_verfassen {
	height: 11px;
	display: none;
}

.layout_option_header_schmal .banner_zahlarten_info {
	margin: 1em;
}

.layout_option_header_schmal .bewertung_verfassen {
	display: none;
}

.muster_banner {
	background: rgba(0, 0, 0, 0) url("/bilder/layout/icon_muster.svg") no-repeat scroll left center / 24px auto;
	padding-left: 40px;
}

.versand_banner {
	background: rgba(0, 0, 0, 0) url("/bilder/layout/icon_versand.svg") no-repeat scroll left center / 24px auto;
	padding-left: 40px;
}

.service_banner {
	background: rgba(0, 0, 0, 0) url("/bilder/layout/icon_service.svg") no-repeat scroll left center / 24px auto;
	padding-left: 40px;
}

.banner_zahlarten_info img {
	display: inline-block;
	vertical-align: middle;
	margin-right: 1em;
}

/*
						.banner_zahlarten_info div {
								display: inline-block;
								vertical-align: middle;
								font-weight: 400;
								font-size:1.05em;
								margin-right: 1em;
						}
						*/


/*.banner {
				color: #888888;

				-webkit-justify-content: space-between;
				justify-content: space-between;

                margin: 10px 0;
                margin-right:1em;
				/ *-webkit-align-items: center;* /
		}*/
.banner>* {
	white-space: nowrap;
	display: inline-block;
	/* Eine Darstellungshilfe fuer den IE9 (der noch kein Flex kann) - sonst hat das hier keien Auswirkung und keine Sinn*/
}

.banner a {
	text-decoration: none;
}

.banner_links {
	flex: 1 0 auto;

}

.banner_links_logo {
	border: 0;
	display: none;
	float: left;
	margin-right: 0.5em;
	max-height: 60px;
	max-width: 80%;
}

.layout_option_header_schmal .banner_links_logo {

	max-height: 46px;
	margin-top: 6px;
}

.banner_links_text {
	display: none;
	margin-left: 12px;
	vertical-align: middle;

}

.banner_links_schriftzug {
	font-size: 1.8em;
	font-weight: normal;
	color: #de8903;
	margin-top: 10px;
}

.banner_links_slogan {
	display: inline-block;
	font-size: 1em;
	color: #888888;
	clear: both;


	margin-top: 0.5em;
}

.banner_links_logo,
.banner_links_slogan,
.banner_links_schriftzug {
	display: none;
}

.banner_links_logo_komplett {
	max-height: 50px;
	max-width: 100%;
	width: 350px;

}

.layout_option_header_schmal .banner_links_logo_komplett {
	max-height: 40px;
}

.banner_wrapper_ws {
	padding: 2% 1%;
	height: 50px;

	display: flex;

	/*flex:0 auto;*/
	align-items: center;
	justify-content: space-between;
	line-height: 50px;
}

.banner_wrapper_ws .logo img {
	vertical-align: middle;
	width: 20em;
	min-height: 3em;
	/*ohne diese Angabe zuckt das Logo beim runterscrollen (beim wechsel zum layout_option_header_schmal) hin und her*/
}

.banner_wrapper_ws .flexBanner>div {
	flex: 1 1 150px;
	height: 50px;
}

.banner_wrapper_ws .flexBanner>div:nth-child(2) {
	flex: 2 1 440px;
	height: 50px;
}

.banner_wrapper_ws .flexBanner>div:nth-child(3) {
	flex: 1 2 200px;
	height: 50px;
}




.banner_rechts {
	/*background-image: url(/bilder/layout/paypal.svg), url(/bilder/layout/amazonpay.svg);
                        background-position: right 32px, 60px 35px;
                        background-repeat: no-repeat;
                        background-size: auto 13px;*/
	flex: 0 0 auto;
	/*font-size: 0.28cm;*/
	/*display: flex;
						justify-content: space-between;*/
	line-height: 50px;
}

.banner_rechts>div>* {
	flex: 1 1 33.3333333333333%;
}

.layout_option_header_schmal .banner_rechts {
	/*margin: 0 1em 0 0;*/
}

.banner_rechts_artikel {
	background-color: #F50B30;
	background-position: left center;
	background-repeat: no-repeat;
	border-radius: 100%;
	color: #ffffff;
	display: none;
	left: 19px;
	line-height: 12px;
	position: absolute;
	text-align: center;
	bottom: 28px;
	width: 12px;
	height: 12px;
	font-size: 8px;
}

.layout_option_header_schmal .banner_rechts_artikel {
	/*
    background-color: #3a3;
    background-position: left center;
    background-repeat: no-repeat;
    border-radius: 100%;
    color: #ffffff;
    display: none;
    font-size: 12px;
    height: 20px;
    left: 17px;
    line-height: 20px;
    margin-right: 10px;
    position: absolute;
    text-align: center;
    top: 10px;
    width: 20px;
							*/
}

.banner_warenkorb {
	position: relative;
	display: inline-block;
	padding-left: 2.5em;
	text-decoration: none;
	background: url("/bilder/layout/warenkorb.svg") no-repeat 5px 50%;
	background-size: auto 1.5em;
}

.layout_option_header_schmal .banner_warenkorb img {
	margin-top: 1em;
}

.banner_rechts_warenkorb {
	color: #444;
	position: relative;
	/*margin-right: .5em;*/
}

#dropdownMenuButton {
	/*display: flex; */
	align-items: center;
	/*margin: 0 2em;*/
	cursor: pointer;
	background: url("/bilder/layout/icon_menueoben.svg") 0 49% no-repeat;
	background-size: auto 1.5em;
	padding-left: 2.5em;
}

#dropdownMenuButton.aktiv {
	background-image: url("/bilder/layout/icon_schliessen.svg");
}

.banner_rechts_warenkorb,
#dropdownMenuButton,
#banner_suche::after {
	font-weight: 400;
	text-decoration: none;
	font-size: 1.1em;
}

.banner_zahlarten_info>div a {
	color: #A7A7A8;
	font-size: 0.875em;
	font-weight: 400;
}

#dropdownMenuButton,
#banner_suche::after,
.banner_rechts_warenkorb {
	font-weight: 400;
	/*font-size: 14px;*/
}

.banner_rechts_preis {
	color: #444;
	font-weight: 600;
}

.banner_rechts_kasse {
	background-color: #888888;
	color: #ffffff;
	border-radius: 2px;
	padding-left: 0.8em;
	padding-right: 0.8em;
	padding-top: 0.1em;
	padding-bottom: 0.1em;
}

.warenkorb_mobil_wrap {
	display: none;
}

.warenkorb_mobil {
	border-radius: 25px;
	color: #fff;
	border: 1px #fff solid;
	background-color: #de8a03;
	background-image: linear-gradient(to top, #de8a03, #ffffff);
	box-shadow: 0px 1px 2px #ffffff;
	display: inline-block;
	padding: 1px 1px 1px 1px;
	margin: 3px;
	line-height: 25px;
	text-align: center;
	height: 25px;
	width: 25px;
	cursor: pointer;
}



.layout_box_main {}

#layout_entirePage {
	top: 0;
	/* wird relevant, wenn per Javascript position auf fixed gesetzt wird */
	position: relative;
}








.breadcrumb_erklaerung {
	color: #888;
	text-transform: uppercase;
}

.breadcrumb_erklaerung:after {
	content: "|";
	margin-left: 1em;
}

.breadcrumbs {
	color: #888888;
}

.breadcrumbs>span::after {
	content: '>';
}

.breadcrumbs>span:last-child::after {
	content: '';
}

.breadcrumbs .item {
	display: inline-block;
	margin-top: 4px;
	margin-bottom: 4px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 0;
	padding-bottom: 0;
	font-size: 0.875em;
}

.breadcrumbs span.item {
	cursor: default;
	color: #888888;
}

.breadcrumbs a:link,
.breadcrumbs a:active,
.breadcrumbs a:visited {
	color: #888888;
	text-decoration: none;

}

.breadcrumbs a:hover {
	text-decoration: underline;
}

.inhalt {
	background-color: #ffffff;
	min-height: 300px;
	/* dieser Wert wurde per Hand ermittelt, bei nicht ausgeklapptem Menue - Das stellt sicher, dass bei Seiten mit wenig Inhalt der Footer nicht am Header dran klebt. 600px war ein guter Wert. Diesen habe ich fuer den neuen (2020) Rollo-Konfigurator auf 300 reduziert */
}

.markisen_konfigurator {
	max-width: 800px;
	margin: 0 auto;
}

.inhalt .text_before h1 {
	font-weight: normal;
	font-size: 18px;
	display: inline-block;
}


.inhalt_rechts {
	width: 130px;
	float: right;
	color: #5e1717;
	text-align: center;
}

.sidebar_erweitert {
	margin-bottom: 1em;
	border: 1px solid #D9BE87;
}

.sidebar_erweitert_link {
	display: block;
	margin: auto;
	/* hier stand falsch drin: margin-auto; - das habe ich korrigiert - ich hoffe, das geht so in Ordnung: tim */
	width: 128px;
	position: relative;
	background-color: #e99b20;
	text-decoration: none;
}

.sidebar_erweitert_bild {
	display: block;
	border: none;
	/* um den automatischen Rand vom Link zu entfernen */
}

.sidebar_erweitert_pfeil {
	position: absolute;
	top: -1px;
	left: 54px;
	border: none;
}

.sidebar_erweitert_text {
	position: absolute;
	top: 12px;
	left: 0;
	font-size: 13px;
	color: #ffffff;
	width: 128px;
	text-align: center;
}

.sidebar_erweitert_preisschild {
	position: absolute;
	top: 47px;
	left: 35px;
	border: none;
}

.sidebar_erweitert_preis {
	position: absolute;
	top: 51px;
	left: 0;
	color: #de8903;
	width: 128px;
	text-align: center;
}

.mitarbeiter_kleiner_bildschirm {
	display: none !important;
}

.mitarbeiter {
	position: relative;
	border: 1px solid #dbc394;
	background-color: #ffffff;
	margin-bottom: 1em;
	color: #000000;
	padding: 3px;
}

.mitarbeiter_name {
	width: 100%;
	/* 130px */
	position: relative;
	top: 3px;
	bottom: 3px;
	left: 0;
}

#inhalt_rechts_outer_icons {
	margin-top: 1em;
	position: relative;
	/* auf die Raender schieben */
	top: 1px;
	left: -1px;
}

.inhalt_rechts_outer_icon {
	border: 1px solid #f1f1f1;
	display: inline-block;
	width: 41px;
	height: 41px;
	line-height: 41px;
	margin-left: 0;
	margin-right: auto;
	text-align: center;
}

.inhalt_rechts_outer_icon.highlight {
	background-color: #f1f1f1;
}

.inhalt_rechts_outer_icon img {
	border: 0;
	/* falls verlinkt */
	vertical-align: middle;
}

#inhalt_rechts_outer_mitarbeiter_alle {
	border-left: 5px solid #f1f1f1;
	border-right: 1px solid #f1f1f1;
}

.inhalt_rechts_outer_mitarbeiter {
	border-bottom: 1px solid #f1f1f1;
	padding-top: 1em;
	padding-bottom: 1em;
}

.inhalt_rechts_outer_box {
	display: block;
	text-align: left;
	font-size: 11px;
	position: relative;
	/* fuer absolute Positionierung des Ab-Preises */
}

.inhalt_rechts_outer_box .minPreis {
	position: absolute;
	right: 5px;
	bottom: 36px;
	color: #ffffff;
}

/* mindestens ein Mitarbeiter angeschalten */
.inhalt_rechts_outer_telefonnummer {
	font-weight: bold;
	text-align: center;
	padding-bottom: 6px;
}

.inhalt_rechts_outer_text {
	text-align: center;
	padding-top: 1em;
	padding-left: 1em;
	padding-right: 1em;
	border-top: 1px solid #f1f1f1;
}

.inhalt_rechts_outer_bild {
	text-align: center;
}

.inhalt_rechts_outer_name {
	margin-top: 3px;
	margin-bottom: 3px;
	color: #888888;
	text-align: center;
}

#inhalt_rechts_outer_mitarbeiter_keiner {
	border-left: 5px solid #f1f1f1;
	border-right: 1px solid #f1f1f1;
	border-top: 1px solid #f1f1f1;
	border-bottom: 1px solid #f1f1f1;
	text-align: center;
	padding: 1em;
	line-height: 1.4em;
}

/* kein Mitarbeiter angeschalten */
.inhalt_rechts_outer_fragen {
	display: block;
}

.inhalt_rechts_outer_link {
	display: block;
	margin-top: 1em;
	color: #de8a04;
	text-decoration: none;
}

.inhalt_rechts_outer_link:before {
	content: "\00BB \0020";
	color: #de8a04;
}

.inhalt_rechts_outer_link:after {
	content: "\0020 \00AB";
	color: #de8a04;
}

.inhalt_rechts_outer_link>span {
	color: #de8a04;
	text-decoration: underline;
}

.inhalt_rechts_outer_link>span>a {
	color: #de8a04;
}

.inhalt_rechts_outer_wrap {
	position: absolute;
	top: 0px;
	/* 	Die position muss zusaetzlich noch in der Funktion setSideboxPosition -> var topPosition angepasst werden.
			 *	!!!Mit JS nicht moegich auszulesen da bei .inhalt_rechts_outer position auf fixed steht und somit der bezug verloren geht!!!
			 */
	right: 0;
	text-align: center;
}

.inhalt_rechts_outer {
	position: fixed;
	width: 148px;
	background-color: #ffffff;
	color: #444444;
}

.inhalt_rechts_outer a {
	text-align: left;
	text-decoration: none;
	color: #444444;
}

.design .oben_flex_wrapper .zusatz,
.artikel .artikel_table_main .right,
.artikelMass .artikel_table_main>.spalte_info,
.artikel .artikel_table_main .artikelBottom {
	width: 340px;
	max-width: 340px;
}

.design_top_bewertungen a,
.artikel .link_kundenmeinungen,
.artikel .link_kundenbilder {
	font-size: 13px !important;
}

.zusatz a.design_link_button:hover,
.zusatz a.button:hover {
	/*box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.25);*/
}

.zusatz a.design_link_button,
.zusatz a.button {
	width: 90%;
}

.zusatz a.button {
	padding: 15px 20px;
	white-space: normal !important;
}

.zusatz a.button img {
	float: right;
}

@media (max-width:500px) {
	.zusatz a.button img {
		margin-right: 1em;
	}
}


.artikel .artikel_table_main {
	display: flex;
}

.artikelMass .logo,
.artikelMass .m_lysel {
	max-width: 150px !important;
}

.artikelMass .zeile_warenkorb .warenkorb {
	background-color: #de8903 !important;
	text-transform: none !important;
	background-position: right center !important;
}

.artikelMass .linkMusterSymbol,
.artikel .link_dekobeispiele {
	background-color: #de8903 !important;

}

.artikelMass .eigenschaftenBoxen .box .weiterlesen {
	color: #de8903 !important;
}

/* Button um den Footer auszuklappen - Dieser ist nur sichtbar, bei eingeklapptem Footer */
#layoutFooterAusklappButton {
	font-size: 40px;
	position: absolute;
	left: 0;
	bottom: 0;
	cursor: pointer;
	display: inline-block;
}

.eingeklappt #layoutFooterAusklappButton {
	font-size: 40px;
	position: fixed;
	left: 0;
	bottom: 0;
	cursor: pointer;
	display: inline-block;
}

#layout_footer {
	background-color: #0E0E0F;
}

#layout_footer.eingeklappt {
	position: fixed;
	bottom: 0;
	left: 0.5%;
	right: 0.5%;
	z-index: 1;
	width: 99%;
	background-color: #ffffff;
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
}

#layout_footer_content .footerHauptbereich {
	clear: both;
	display: flex;
	justify-content: space-around;
	flex-flow: row wrap;
	background-color: #0E0E0F;
	color: #A7A7A8;
	padding-top: 5em;
	padding-bottom: 50px;
}

#layout_footer_content .footer_spalten {
	display: flex;
	justify-content: center;
	flex-grow: 1;
	flex-wrap: wrap;
}

.layout_footer_balken {
	border-top: 2px solid #f1f1f1;
	border-bottom: 2px solid #f1f1f1;
	margin-bottom: 30px;
	flex: 1 100%;
	padding: 1em 2.7%;
}

.layout_footer_balken>span {
	font-weight: bold;
}

#layout_footer_seitenanfang {
	position: absolute;
	right: 0;
	top: 0;
	color: #ffffff;
	background-color: #999999;
	font-weight: bold;
	padding-top: 13px;
	padding-bottom: 13px;
	padding-left: 20px;
	padding-right: 20px;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAADCAYAAACwAX77AAAAHklEQVQI12NggIL/UADjM8IEGZAAIyMjIyO6IAwAAPomD/dISgI+AAAAAElFTkSuQmCC);
	background-repeat: no-repeat;
	background-position: center bottom;
	cursor: pointer;
}

#layout_footer .bottom_center a {
	font-weight: 500;
	color: black;
}

#layout_footer .col {
	flex: 0 0 auto;
	margin: 1em 2em;
}

#layout_footer .col .upper {
	text-transform: uppercase !important;
}

#layout_footer .col .text_small {
	font-size: 1em !important;
}

#layout_footer .col .head {
	font-size: 1.375em;
	font-weight: 400;
	margin-bottom: 2em;
	color: #F2F2F4;
}

#layout_footer .col #toTopFooter {
	display: flex;
	align-items: center;
	flex-direction: column;
	margin-top: 1em;
	margin-bottom: 2em;
	cursor: pointer;
	font-size: 1em;
	font-weight: 400;
}

#layout_footer .col #toTopFooter img {
	width: 1.8em;
}

#layout_footer .col a {
	font-size: 1em;
	text-decoration: underline;
	color: #A7A7A8;
}

#layout_footer .col h3 {
	color: #329800;
	font-weight: bold;
	margin-top: 20px;
}

#layout_footer .col span {
	line-height: 1.4em;
	letter-spacing: 0.05em;
}

#layout_footer .col ul {
	list-style: none;
	padding: 0;
}

#layout_footer .col ul li {
	text-decoration: none;
	padding: 3px 0;
	color: #A7A7A8;
	font-weight: 400;
	font-size: 1.125em;
	line-height: 1.75em;
}

#layout_footer .col ul li a {
	text-decoration: none;
}

#layout_footer .col ul li a:hover {
	text-decoration: underline;
}

#layout_footer .col .social {
	display: flex;
	justify-content: center;
	margin: 2em 0;
}

#layout_footer .col .langer_text {
	white-space: normal;
}

#layout_footer .col.footer_abschnitt_logo {
	text-align: center;
	margin: 0 10%;
}

#layout_footer .col.footer_abschnitt_logo img {
	max-width: 100%;
	width: 11em;
}

#layout_footer .col.footer_abschnitt_logo .logo {
	font-size: 32px;
}



#layout_footer .bottom_center {
	flex: 1 100%;
	text-align: center;
	/*margin-top: 50px;*/
	background-color: #FACF00;
	padding: 1.55em;
	font-size: 1.125em;
	font-weight: 400;
	color: #0E0E0F;
}

#layout_footer .bottom_center .line {
	width: 50%;
	height: 1px;
	background-color: #888888;
	margin: 5px auto;
}

#layout_footer .bottom_center .domainname {
	text-transform: uppercase;
}

#layout_footer .col .social img,
#layout_footer .col .payment>img {
	display: block;
	width: 2em;
	margin: 0 auto;
	padding: 0 0.625em;
}






.layout_bar_for_sidebar {
	width: 1040px;
	/* Init-Wert - wird von Javascript ueberschrieben */
	margin: auto;
	position: relative;
	top: 0px;
	left: 148px;
	height: 0;
}

#layout_layer_entirePage {
	display: none;
	position: fixed;
	top: 0;
	cursor: pointer;
}

@keyframes layout_toTopButton_FadeIn {
	from {
		opacity: 0;
		visibility: hidden;
	}

	to {
		opacity: 1;
		visibility: visible;
	}
}

@keyframes layout_toTopButton_FadeOut {
	from {
		opacity: 1;
		visibility: visible;
	}

	to {
		opacity: 0;
		visibility: hidden;
	}
}


#layout_toTopButton {
	visibility: hidden;
	right: 0;
	bottom: 50px;
	cursor: pointer;
	position: fixed;
	z-index: 9999;
	/* bei einigen Seiten ist bei einigen Elementen der z-index gesetzt - mit dieser Angabe will ich aber wieder drueber sein */
	border: 1px solid #888;
	height: 50px;
}

#layout_toTopButton.show {
	visibility: visible;
	animation-name: layout_toTopButton_FadeIn;
	animation-duration: 3s;
}

#layout_toTopButton.show img {
	width: 100%;
	height: 100%;
}

#layout_toTopButton.hide {
	visibility: hidden;
	animation-name: layout_toTopButton_FadeOut;
	animation-duration: 3s;
}

/* sonstiges */
.fix_underline a img {
	/* fuer den Firefox ab v3 bis mindestens v6, dieser stellt sonst bei verlinkten Bildern einen Unterstrich dar */
	vertical-align: middle;
}

.meinung_eigene {
	color: #000 !important;
}

.meinungen b {
	font-weight: bold;
}

.meinung_eigene .sterne ul,
.meinung_eigene .sterne li {
	padding: 0;
	margin: 0;
	list-style: none;
}


.meinung_eigene .sterne ul {
	width: 100%;
	clear: both;
}

.meinung_eigene .sterne li {
	width: 2em;
	float: left;
	line-height: 2em;
	margin-right: 0.5em;
}

.meinung_eigene .sterne label {
	display: block;
	width: 2em;
	height: 2em;
	background: url("../bilder/stern-grau.svg") no-repeat 50% 50%;
	background-size: 100% auto;
	display: block;
	cursor: pointer;
}

.meinung_eigene .sterne li:first-child,
.meinung_eigene .sterne li:last-child {
	width: auto;
}

.meinung_eigene .sterne input[type=radio] {
	display: none;
}

.meinung_eigene #star5:checked~ul label {
	background-image: url("../bilder/stern-gelb.svg")
}

.meinung_eigene #star4:checked~ul label[for=star4],
.meinung_eigene #star4:checked~ul label[for=star3],
.meinung_eigene #star4:checked~ul label[for=star2],
.meinung_eigene #star4:checked~ul label[for=star1] {
	background-image: url("../bilder/stern-gelb.svg")
}

.meinung_eigene #star3:checked~ul label[for=star3],
.meinung_eigene #star3:checked~ul label[for=star2],
.meinung_eigene #star3:checked~ul label[for=star1] {
	background-image: url("../bilder/stern-gelb.svg")
}

.meinung_eigene #star2:checked~ul label[for=star2],
.meinung_eigene #star2:checked~ul label[for=star1] {
	background-image: url("../bilder/stern-gelb.svg")
}

.meinung_eigene #star1:checked~ul label[for=star1] {
	background-image: url("../bilder/stern-gelb.svg")
}

.sterne:after {
	content: "";
	width: 100%;
	height: 0;
	display: block;
	clear: both;
	visibility: hidden;
}

.design_top_bewertungen img {
	width: 2em;
	height: 2em;
}

#layout_header * {
	transition: all ease 0.4s;
}


#layout_warenkorb_menge.nicht-leer {
	display: inline-block;
}

#htmlContent {
	margin: 0 auto;
	max-width: 800px;
	padding: 2em 0;
}

/*	Kontaktformular	*/
.anfrage {
	width: 90%;
	max-width: 1090px;
	margin: 0 auto 1em auto;
}

.anfrage h1,
.anfrage h2 {
	font-weight: 400;
}

.anfrage .kontakt {
	display: flex;
}

.anfrage .kontakt p {
	flex: 1 1 auto;
}

.widerrufformular {
	width: 100%;
	display: grid;
	grid-template-columns: 50% 50%;
	grid-template-rows: auto auto auto auto auto auto auto auto auto auto auto;
	grid-gap: 20px;
}

.widerrufformular .formular {
	display: grid;
	grid-column: 1;
	font-weight: 400;
}

.widerrufformular .buttons {
	display: flex;
	justify-content: flex-end;
}

.widerrufformular .buttons button {
	width: 160px;
	height: 50px;
	border: #A7A7A8 solid 1px;
	margin: 8px;
	display: flex;
	align-items: center;
	justify-content: space-around;
}

.widerrufformular .buttons button span {
	width: 65px;
}

.widerrufformular .buttons .Loeschen {
	background: #fff;
	color: #BCBCBD;
}


.widerrufformular .buttons .Senden {
	background: #BCBCBD;
	color: #fff;
}

.widerrufformular .formular .spamtext {
	margin-top: 1.4em;
	display: flex;
	align-items: center;
}

.widerrufformular .achtung {
	grid-template-columns: 80px auto;
}

.widerrufformular .notiz {
	grid-column: 2;
	display: flex;
	align-items: flex-end;
	font-size: 14px;
	color: #A7A7A8;
}

.widerrufformular .halb {
	grid-template-columns: calc(50% - 8px) calc(50% - 8px);
	grid-gap: 16px;
}

.widerrufformular .zwDr {
	grid-template-columns: calc(66% - 8px) calc(33% - 8px);
	grid-gap: 16px;
}

.widerrufformular .einDr {
	grid-template-columns: calc(33% - 8px) calc(66% - 8px);
	grid-gap: 16px;
}

.widerrufformular .full {
	grid-template-columns: 100%;
	grid-gap: 16px;
}

.widerrufformular .formular input,
.widerrufformular .formular textarea {
	width: 100%;
	border: none;
	background: #F2F2F4;
	height: 50px;
}

.widerrufformular .block input,
.widerrufformular .formular textarea {
	height: 140px;
}

@media (max-width: 700px) {
	.widerrufformular {
		grid-template-columns: 100%;
	}

	.widerrufformular .formular {
		margin-left: 10px;
		margin-right: 10px;
	}

	.widerrufformular .notiz {
		margin-left: 10px;
		margin-right: 10px;
		grid-column: 1;
	}
}



.widerruf form * {
	padding: 0;
	margin: 0;
	border: 0;
	box-sizing: border-box;
}

.widerruf form {
	padding: 0;
	margin: 0;
	font-size: 0.8em;
	grid-gap: 0 1em;
}

.widerruf form input,
.widerruf form textarea {
	padding: 1em;
	margin-top: 10px;
	margin-bottom: 7px;
	background: #F2F2F4;
	font-size: inherit;
	outline: 1px solid transparent;
	transition: outline 0.25s;
}

.widerruf form .form {
	display: grid;
	grid-template-columns: auto auto;
	grid-template-rows: auto;
	grid-gap: 50px;
	width: 100%;
}

.widerruf form .form div {
	width: 100%;
}

.widerruf form .form .Zeilen {
	grid-column: 1;
}

.widerruf form .form .Texte {
	grid-column: 2;
}

.widerruf form .buttonDiv .button {
	color: #000;
}

.widerruf form .plz {
	width: 80px !important;
}

.spamcode {
	color: #F50B30;
}

.widerruf form .form input {
	width: 100%;
}

.widerruf form .form textarea {
	width: 100%;
}

.widerruf form .form #plz {
	width: 80px !important;
}

.widerruf form .form #ort {
	width: calc(100% - 85px);
	margin-left: 0px;
}




@media (max-width: 850px) {
	.widerruf form .form {
		grid-template-columns: auto;
		grid-template-rows: auto;
		width: 100%;
	}

	.widerruf form .form .Texte {
		grid-column: 1;
		width: 80%;
		text-align: left;
		margin-left: 10%
	}

	.widerruf form .form .Zeilen {
		width: 80%;
		text-align: left;
		margin-left: 10%
	}

	.widerruf form .form input {
		width: 100%;
	}

	.widerruf form .form textarea {
		width: 100%;
	}

	.widerruf form .form #plz {
		width: 80px !important;
	}

	.widerruf form .form #ort {
		width: calc(100% - 85px);
		margin-left: 0px;
	}

	.widerruf form .plz {
		width: 85px !important;
	}


}

@media (max-width: 520px) {
	.widerruf form .form .Texte {
		grid-column: 1;
		width: 100%;
		margin-left: 0px;
	}

	.widerruf form .form .Zeilen {
		width: 100%;
		margin-left: 0px;
	}

	.widerruf form .form input {
		width: 100%;
		margin-left: 0px;
	}

	.widerruf form .form textarea {
		width: 100%;
		margin-left: 0px;
	}

	.widerruf form .form #plz {
		width: 80px !important;
	}

	.widerruf form .form #ort {
		width: calc(100% - 85px);
		margin-left: 0px;
	}
}

.widerruf form .buttonDiv {
	text-align: right;
}

.anfrage form * {
	padding: 0;
	margin: 0;
	border: 0;
	box-sizing: border-box;
}

.anfrage form {
	padding: 0;
	margin: 0;
	font-size: 0.875em;
	font-weight: 400;
	display: grid;
	grid-template-columns: 50% 50%;
	grid-template-rows: auto auto;
	grid-template-areas:
		". ."
		"attachment attachment"
		"submit submit";
	grid-gap: 0 1em;
}

.anfrage form input,
.anfrage form textarea {
	padding: 1em;
	background: #F2F2F4;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	outline: 1px solid transparent;
	transition: outline 0.25s;
}



.anfrage form label span:first-child {
	margin-bottom: 0.25em;
}

.anfrage form label span:last-child {
	margin-top: 0.25em;
}

.anfrage form input:focus-visible,
.anfrage form textarea:focus-visible {
	outline: 0;
}

.anfrage form .input {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	gap: 1em;
	padding: 1em 0 1em 0;
}

.anfrage form .input label {
	display: flex;
	flex-direction: column;
	width: calc(50% - 0.5em);
}

.anfrage form .input label.spam {
	width: 100%;
	display: grid;
	grid-template-columns: 25% 75%;
	grid-template-rows: auto auto;
	grid-template-areas:
		"text text"
		"input spamTxt";
	grid-gap: 0 1em;
}

.anfrage form .input label.spam input {
	grid-area: input;
	text-align: center;
}

.anfrage form .input label.spam input+span {
	grid-area: spamTxt;
	line-height: 2.75em;
	font-size: small;
}

.anfrage form .input label.spam input+span span {
	color: #F50B30;
}

.anfrage form .text {
	padding: 1em 0 1em 0;
}

.anfrage form .text label {
	display: flex;
	flex-direction: column;
}

.anfrage form .text label textarea {
	width: 100%;
	resize: none;
}

.anfrage form .attachments {
	grid-area: attachment;
	min-width: 0;
}

.anfrage form .submit {
	grid-area: submit;
	display: flex;
	justify-content: end;
}

.anfrage form .submit input.btn {
	width: 10em;
	background-image: url("/bilder/layout/icon_send.svg");
	background-repeat: no-repeat;
	background-position: 2em 50%;
	background-size: auto 1.5em;
	background-color: #fff;
	cursor: pointer;
	padding-left: 3em;
	border: 1px solid #000;
	opacity: 1;
	transition: opacity 0.25s;
}

.widerruf form input.btn {
	width: 10em;
	background-image: url("/bilder/layout/icon_send.svg");
	background-repeat: no-repeat;
	background-position: 2em 50%;
	background-size: auto 1.5em;
	background-color: #fff;
	cursor: pointer;
	padding-left: 3em;
	border: 1px solid #000;
	opacity: 1;
	transition: opacity 0.25s;
}

.widerruf form input[type="submit"] {
	background-image: url("/bilder/layout/icon_send.svg");
	background-color: #FACF00;
	border-color: #FACF00;
}

.anfrage form .submit input.btn:disabled {
	opacity: 0.75;
}

.anfrage form .submit input[type="submit"] {
	background-image: url("/bilder/layout/icon_send.svg");
	background-color: #FACF00;
	border-color: #FACF00;
}

.anfrage form .submit input[type="button"] {
	background-image: url("/bilder/layout/icon_delete.svg");
	margin-right: 1em;
}

@media (max-width: 1024px) {
	.anfrage form {
		display: flex;
		flex-direction: column;
	}

	.anfrage form .input,
	.anfrage form .text {
		/*padding: 1em;*/
	}

	.anfrage form .text {
		padding-top: 0;
	}

	.anfrage form .input label {
		width: 100%;
	}
}

@media (max-width: 480px) {
	.anfrage {
		width: unset;
	}

	.anfrage .kontakt {
		flex-direction: column;
	}

	.anfrage form .input label.spam {
		display: flex;
		flex-direction: column;
	}

	.anfrage form .input label.spam input {
		width: 25%;
		min-width: 5.6em;
	}

	.anfrage form .input label.spam input+span {
		line-height: 1.4em;
	}

	.anfrage form .submit input {
		width: 100%;
	}

	.anfrage form .submit input.btn {
		width: 50%;
		background-position: calc(50% - 2em) 50%;
	}
}

/*	Ende Kontaktformular	*/
/*********************************************
 *
 *		MEDIA Einstellungen
 *
 *		Ich versuche mit 4 Media angaben hinzukommen
 *
 *		> 	1260 	ist standard
 *		<= 	1260
 *		<= 	1024
 *		<=	768
 *		<=	480
 *
 *********************************************/

/* ie 9+ (ohne edge) hack fÃ¼r fehlendes column-count in seo-kategorie-seiten (ganz unten vor media queries) */
@media screen\0 {
	.seo.farbuebersicht ul {
		column-count: 1 !important;
	}

	.seo.farbuebersicht ul li {
		width: 25%;
		float: left;

	}
}



@media (max-width: 1260px) {
	.banner_rechts {

		background-size: auto 10px;
		background-position: right bottom, left bottom;

	}

	.layout_option_header_schmal .leisteNavigation_ansprechpartner_nameTel {
		display: none;
	}

	.layout_option_header_schmal .leisteNavigation_ansprechpartner_Bild {
		display: none;
	}

	.leisteNavigation_ansprechpartner_Tel_symbol {
		display: none;
	}

	.other .leisteNavigation_ansprechpartner_nameTel {
		display: block;
	}

	.other .leisteNavigation_ansprechpartner_Bild {
		display: block;
	}

	.other .leisteNavigation_ansprechpartner_Tel_symbol {
		display: none;
	}

	#leisteNavigationTelefon .other {
		top: 44px;
		right: 0;
		position: absolute;
	}

	.banner_rechts_warenkorb {
		display: none;
	}

	.mitarbeiter_kleiner_bildschirm {
		display: flex !important;
		display: -ms-flexbox !important;
	}

	#leisteNavigationTelefon .other .slide:nth-child(1) {
		border-top: none;
	}

	#leisteNavigationTelefon .other .slide:nth-child(2) {
		border-top: 1px solid #f1f1f1;
	}

	.layout_option_header_schmal #leisteNavigationTelefon .other {
		top: 44px;
	}



	/* Liverchat */
	.leisteNavigation_ansprechpartner_livechat {
		/*overflow: hidden; width:38px*/
	}

	.menue_line .leisteNavigation_ansprechpartner_livechat span {
		padding: 0;
	}

	.leisteNavigation_ansprechpartner_livechat a.offline {
		display: none;
	}

	.leisteNavigation_ansprechpartner_livechat a.online {
		display: block;
		color: transparent;
		width: 28px;
		padding: 23px 6px 12px 8px;
		border-left: 3px solid #f1f1f1;
		margin-left: 0px;
		font-size: 0;
		margin-bottom: 0px;
		background-position: 70% center;
	}

	.leisteNavigation_ansprechpartner_livechat a {
		padding-right: 0;
	}

	.banner_links_logo_komplett {

		width: 250px;

	}

	.layout_option_header_schmal .banner_links_logo_komplett {

		width: 200px;

	}

	.banner_wrapper_ws>div.banner_zahlarten_info {
		flex: 1 1 48%;
	}

	.banner_wrapper_ws>div.banner_rechts {
		flex: 1 1 15%;
	}

	.banner_zahlarten_info>div,
	.banner_rechts>div {
		/*width: 95%;*/
	}

	#dropdownMenuButton span,
	#banner_suche.default:after {
		display: none;
	}

	.banner_wrapper_ws .flexBanner>div {
		flex: 1 1 100px;
	}

	.banner_rechts>div {
		width: auto;
	}

	#dropdownMenuButton,
	#banner_suche.default input[type="submit"] {
		background-position: 50% 50%;
	}

	#banner_suche.default input[type="submit"] {
		margin-right: 0;
	}
}

@media (max-width: 1024px) {
	.leisteNavigation_ansprechpartner_Tel_symbol {
		display: none;
	}

	/*.banner {transform:scale(.8);float:left;}*/
	.banner_zahlarten_info {
		display: none;
	}

	/*		.banner_wrapper_ws { width:auto; }*/
	.banner_rechts_warenkorb {
		display: none;
	}


	.banner_links_schriftzug {
		float: left;
		margin-top: 0;
		font-size: 1em;
	}

	/*.banner_suche input[type="submit"]{display:none;}*/
	.banner_suche input[type="search"] {
		font-size: .8em;
		/*width:70%;*/
	}

}

@media (max-width: 768px) {
	.layout_option_header_schmal .banner {
		flex: 0;
	}

	.banner_rechts {
		background-image: none;
	}

	.banner_rechts_artikel.nicht-leer {
		position: absolute;
		right: 5px;
		top: 20px;
	}

	.banner_rechts_preis {
		right: 0;
		position: absolute;
		bottom: -15px;
		color: #de8903;
	}

	.layout_leiste_full {
		margin-top: 6px;
	}

	.layout_option_header_schmal .banner_suche input[type="search"] {
		width: 100%;
	}

	.layout_option_header_schmal .banner_links_slogan {
		display: none;
	}

	.banner_links_logo {
		margin: 0 auto;
		float: none;
		display: inline-block;
		max-width: 95%;
	}

	.banner_links_logo {
		max-height: 40px;
	}

	.layout_option_header_schmal .banner_links_logo_komplett {
		display: none;
	}

	.layout_option_header_schmal .banner_links_schriftzug {
		display: block;
		font-size: 0.6em;
		margin: 0
	}

	.banner {
		flex-wrap: wrap;
	}

	.banner_wrapper_ws {
		flex: 0 100%;
		margin: 0;
		height: 50px;
	}

	.wrap_kategorie_links a {
		display: none;
	}

	.banner_links_schriftzug {
		float: left;
		margin-top: 0;
		font-size: 1em;
	}

	.leisteNavigation_ansprechpartner_nameTel {
		display: none;
	}

	.leisteNavigation_ansprechpartner_Bild {
		display: none;
	}

	.layout_leiste_full.layout_option_header_schmal .trenn {
		display: none;
	}

	.tel-von-bis {
		display: none !important;
	}


	.banner_warenkorb {
		margin: 0;
	}

	.mobile_schmal {
		display: block !important;
	}

	/*.grosser_bildschirm { display:none !important; }*/
	body:not(.layout_option_header_schmal) .leisteNavigation_ansprechpartner_Tel_symbol {
		border-left: none;
	}

	.layout_footer_leiste .layout_footer_leiste_box {

		width: 31.4%;
	}

	#leisteNavigationTelefon {
		margin-left: 0;
	}


	.layout_leiste_breadcrumb {

		min-height: 0;
	}

	.banner_warenkorb img {

		margin-top: 0;

	}

	.banner_suche input[type="search"] {
		width: 100%;
	}

	.banner_rechts_artikel.nicht-leer {

		top: 10px;

	}

	.banner {
		flex: 0 1 0;
	}


	body {
		margin: 0;
	}

	.banner a {
		width: 100%;
	}

	.banner_links_slogan {
		display: none;
	}

	.banner_links_logo_komplett {
		display: none;
	}


	.banner_links_schriftzug {
		display: block;
		font-size: 0.6em;
		margin: 0
	}

	.layout_option_header_schmal .banner_links_schriftzug {
		display: block;
		font-size: 0.5em;
		margin: 0
	}

	.banner_links_text {
		display: block;
		text-align: center;
		width: auto;
	}


}

@media (max-width: 480px) {

	/*.banner {transform:scale(1);}*/
	.banner_suche input[type="search"] {
		width: 100%;
	}

	.banner {
		flex: 0 1 0;
	}


	body {
		margin: 0;
		padding: 5px;
	}

	.banner a {
		width: 100%;
	}

	.banner_links_slogan {
		display: none;
	}

	.banner_links_logo_komplett {
		display: none;
	}

	.banner_links_schriftzug {
		display: block;
		font-size: 0.6em;
		margin: 0
	}

	.layout_option_header_schmal .banner_links_schriftzug {
		display: block;
		font-size: 0.5em;
		margin: 0
	}

	.banner_links_text {
		display: block;
		text-align: center;
		width: auto;
	}

	.banner_rechta {
		padding-top: 0;
		margin: 0;
	}

	.banner_warenkorb {
		width: auto;
		padding: 0;
	}

	.meinung_eigene .sterne li {
		margin-right: 0.25em;
	}
}

/* Tim: Wofuer sind diese Klassen? */
.tg {
	border-collapse: collapse;
	border-spacing: 0;
}

.tg td {
	font-family: Arial, sans-serif;
	font-size: 12px;
	padding: 10px 5px;
	border-style: solid;
	border-width: 0px;
	overflow: hidden;
	word-break: normal;
}

.tg th {
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	padding: 10px 5px;
	border-style: solid;
	border-width: 0px;
	overflow: hidden;
	word-break: normal;
}

.tg .tg-s6z2 {
	text-align: center;
	border-style: solid;
	border-width: 1px;
}

.tg .tg-e3zv {
	font-weight: bold
}

.tg .tg-34fq {
	font-weight: bold;
	text-align: right;
	min-width: 100px;
}

@media screen and (max-width: 767px) {
	.tg {
		width: auto !important;
	}

	.tg col {
		width: auto !important;
	}

	.tg-wrap {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}



/* Button "Auswahl verfeinern" auf den Stoff-Seiten und im Listing - dieser Button wird im mobilen Layout eingeblendet */
.call_filter_mobile {
	display: none;
}

/* Plissee Detail Seite Mass und Standardgroesse */
.muster_svg_weiss {
	display: none;
}

@media (max-width:500px) {


	.muster_mobile_button,
	.button.muster_mobile_button,
	a.button.muster_mobile_button {
		padding-left: 1em;
		padding-right: 2em;
		padding-top: 3%;
		padding-bottom: 3%;
		background-color: #0E0E0F;
		display: inline-flex;
		align-items: center;
		justify-content: space-evenly;
		font-size: 15px;
		border: 0;
		color: white;
		background-image: url(/bilder/layout/icon_pfeil_gross.svg);
		background-repeat: no-repeat;
		background-position: 94%;
		background-size: .7em;
		max-width: unset;
		width: auto;
	}

	.muster_svg_schwarz {
		display: none;
	}

	.muster_svg_weiss {
		display: block;
		margin-right: 1em;
	}

	.muster_text_button {
		order: 2;
	}

	#layout_footer_content .footer_spalten {
		flex-flow: column;
		margin: 0 auto;
	}
}


#fancybox-content img {
	/*damit Bilder in Fancybox nicht über den Rand raus gehen || 23.12.2024 David S.*/
	max-width: 100%;
}

@media (max-width: 500px) {

	/*
				fuer die Option "mobile": false (z.B. Plissee-Konfigurator)
				.layout_option_mobile_noheaderfooter
		*/

	.layout_option_mobile_noheaderfooter {
		padding: 0;
	}

	.layout_option_mobile_noheaderfooter #layout_header {
		display: none;
	}

	.layout_option_mobile_noheaderfooter #feste_breite,
	.layout_option_mobile_noheaderfooter #feste_breite {
		margin: 0;
		padding: 0;
		width: 100%;
	}

}