:root {
	--green				: #159E46; /* green-500 */
	--lightergreen		: #fafffa;
	--darkgreen			: #0A7143; /* green-700 */
	--orange			: #E87D00; /* orange-500 */
	--red				: #c00;
	--red-lh			: #931717;
	--grey				: #c0c0c0;
	--lightgrey			: #C4C1BB; /* grey 300 */
	--lightergrey		: #EBE9E3; /* grey 200 */
	--superlightgrey	: #F5F4F1; /* grey 100 */
	--darkgrey			: #3D3B38; /* grey 500 */
	--grey400			: #8A8782; /* grey 500 */
	--blue				: #275EFE;
	--white				: #fff;
	--ad-background		: #ecd9c4;

	--text-color 	: var(--text-default);
	--main-color 	: var(--green);

	--text-default	: #3D3B38; 		/* grey 500 */
	--text-green	: var(--darkgreen);	 /* green-700 */
	--text-orange	: var(--orange);
	--text-schwarz	: #000000;
	--text-grau		: #999999;
	--text-grey: var(--grey400);

	--page-background	: var(--superlightgrey);
	--header-background	: var(--superlightgrey);
	--content-background	: transparent;
	--table-even-background: var(--superlightgrey);

	--sans-fontstack	: source_sans_pro, Arial, Helvetica, sans-serif;
	--serif-fonstack	: tartinescript, "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;
	--headline-font		: roboto_slab, Arial, Helvetica, sans-serif;

	--fontsize-h1: 1.8rem;
	--fontsize-h2: 1.3rem;
	--fontsize-h3: 1.2rem;
	--fontsize-h4: 1.1rem;
	--fontsize-h5: 1.1rem;
	--fontsize-h6: 1.1rem;

	--fontsize			: 16px;
	--fontsize-small	: 14px;
	--fontsize-large	: 18px;
	--line-height		: 1.3;

	--page-width		: 1180px;
	--border-radius		: 5px;

	--narrow-text-width	: 800px;

	/* tab */

	--tab-distance: 5px;

	/* input, select, textarea, button */

	--input-font		: var(--sans-fontstack);
	--input-fontsize	: 16px;
	--input-color		: var(--text-color);
	--input-height		: 36px;
	--input-border		: 1px solid var(--lightgrey);

	--stepper-height	: 36px;


	/* footer */

	--footer-background: #615F5D;
	--cms-menu-back-color: transparent;
	--cms-menu-padding: 0px 15px;
	--cms-menu-column-gap: 0px;

	/* slider */ 

	--slider-height		: 455px;
	--swiper-navigation-height: 100%;
	--swiper-navigation-width: 50px;

	/* breadcrumb */
	--breadcrumb-color: var(--text-color);
	--breadcrumb-background: transparent;
	--breadcrumb-divider: '>';

	
	--product-labels-padding: 2px;
	--label-fontsize: 16px;
	--label-region: transparent;

	--box-shadow-kachel: 1px 1px 10px -2px #aaa;

	/* accordeon */

	--cms-accordion-content: none; /*url('/public/Bioshop/css/img/02-AKKORDEON-Pfeil-runter.png'); */
	--cms-accordion-height: auto;
	--cms-accordion-fontsize: 40px;
	--cms-accordion-color: var(--darkgreen);
	--cms-accordion-max-height: 1000px;
	--cms-accordion-left: -4px;
	--cms-accordion-label-padding: 10px 0 10px 10px;
	--cms-accordion-label-font-size: 1.2rem; /* 1.8rem */;
	--cms-accordion-label-font-weight: bold;
	--cms-accordion-label-line-height: 1.2;
	/* --cms-accordion-background: var(--white); */
	/* --cms-accordion-transform: rotate(180deg); */
	/* --cms-accordion-right: 30px; */
	--cms-accordion-label-color: var(--darkgreen);
	/* --cms-accordion-label-left: 30px; */
	/* --cms-accordion-label-right: 80px;	 */

	/* dynamic vars */

	--header-height: 62.5px;
	--nav-bottom-height: 43px; 
	--scrollbar-width: 17px; 
	--footer-height: 297px;

	--svg-checkmark: url('data:image/svg+xml;utf8,<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M19.5855 5.68941C20.0332 6.01277 20.134 6.63786 19.8107 7.08558L10.4214 20.0856C10.256 20.3145 10.0016 20.4628 9.72101 20.494C9.44037 20.5251 9.15964 20.4362 8.94814 20.2491L3.33746 15.286C2.92379 14.9201 2.88508 14.2881 3.251 13.8745C3.61692 13.4608 4.2489 13.4221 4.66257 13.788L9.44639 18.0196L18.1893 5.91457C18.5127 5.46685 19.1378 5.36604 19.5855 5.68941Z" fill="currentColor" /></svg>');
}

.gwMenu, 
.gwTree {
	--item-background-color-hover: #fff;
	--fontsize: 15px;
}

.tile-list, 
.productDetailWrapper {
	--price-fontsize: 1.3rem;
	--tile-name-fontsize: 1rem;
	--fontsize-large: 1rem;
	--font-size: 13px;
	--fontsize-small: 12px;
	--input-fontsize: 14px;
	--button-fontsize: 14px;
	--price-color: var(--text-color);	
}

.tile-list {
	--product-input-areas: 'quantity unit' 'interval userText';
}

#product-list, 
.tile-list, 
#product-group-list, 
.abo-group-list, 
.abo-list {
	--image-area-padding-top: 0px;
	--product-width: 221px;
	--product-height: 388px;
	--product-height-hover: 540px;
	--product-border: none;
	--product-shadow: none;
	--product-shadow-hover: 0px 0px 7px rgba(0, 0, 0, .2);
	--product-background-hover: var(--white);
	--image-hover-scale: 1;
}

#notes .tile-list {
	--product-border: 1px solid var(--lightergrey);
}

.view-list {
	--product-height: 100%;
	--product-height-hover: 100%;
	--product-width: 100%;
}

.tile-list, .view-tile {
	--image-area-height: auto;
}

.view-list .view-compact {
	--compact-template-rows: 120px;
	--compact-max-product-height: 120px;
	--product-name-padding: 7px 0 5px 0;
}

.abo-group-list .tile-list {
	--product-width: 100%;
	--product-width-hover: 100%;
	--product-height: 160px;
	--product-height-hover: 160px;
	--image-area-height: 100%;
}

.abo-list .view-tile {
    --product-width: 100%;
	--image-area-height: 200px !important;
}

.view-list .view-compact.hat-empfehlung {
	--compact-template-rows: 150px;
	--compact-max-product-height: 150px;
}

#cart .tile-wrapper {
	background-color: var(--white);
}


input, label, select, textarea, button, .select-wrapper {
	--button-arrow-h-offset: 0px;
}

#searchResult {
	--search-result-h-offset: 10px;
}

.special-info {
	--special-info-background: var(--ad-background);
	--product-background: var(--ad-background);
	--fontsize: 14px;
}

#sidemenu {
	--top: var(--header-height);
	--main-color: var(--darkgreen);
}

.shop-productTile.product-list .image-area {
	--image-area-height: auto
}

databutler-calendar {
	--fontsize: 14px;
}

@media screen and (min-width: 512px) {
	.abo-group-list .tile-list {
		--product-width: 380px;
		--product-width-hover: 380px;
	}

	.abo-list .view-tile {
		--product-width: 280px;
	}
}

@media screen and (min-width: 1200px) {
	:root {
		--header-height: 178.5px;
	}

	#product-page .image-area,
	#products-page .image-area {
		--image-area-padding-top: 35px;
	}

	.tile-list, .view-tile {
		--image-area-height: calc((var(--image-area-padding-top) + var(--product-width)) * var(--product-scale) - 2px);
	}

	#cart .tile-wrapper,
	#wunschabo .tile-wrapper {
		background-color: var(--superlightgrey);
	}
}