:root {
	--green 		: #3F8E5B;
	--green2		: #5c8433;
	--red 			: #941320;
	--text-color 	: var(--text-default);
	--main-color 	: var(--green);
	--beige-light	: #f7f3ec;	/* #dacaac; opacity: 0.4 */
	--beige-dark	: #DACAAC;
	--tuerkis		: #5EA6A8;
	--orange 		: #fb9628;
	--ocker 		: #D0A522;
	--beige 		: #c9b799;
	--back100		: #F6F2EA;
	--kachelback	: var(--back100);
	--green-gradient-start	: #62AB74;
	--green-gradient-end	: #449061;

	--text-default	: #625b5c;
	--text-green	: #3F8E5B;
	--text-orange	: #E07E34;
	--text-schwarz	: #000000;
	--text-grau		: #999999;
	--text-green-hover: var(--green2);

	--page-background	: #fff;
	--header-background	: #fff;
	--content-background	: transparent;
	--table-even-background: var(--beige-light);

	--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			: 19px;
	--fontsize-small	: 14px;
	--fontsize-large	: 22px;
	--line-height		: 26px;

	--page-width		: 1380px;
	--border-radius		: 0px;

	--overline			: 4px;
	--moved-up			: 40px;

	--standard-padding	: 10px;
	--filter-compact-height: 122px;

	/* 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);
	--input-padding-top	: 4px;

	--stepper-height	: 36px;

	--label-fontsize	: 18px;
	--label-line-height	: 1.6;

	/* slider */ 

	--slider-height		: auto;

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

	--product-labels-padding: 2px;

	--box-shadow-kachel: 0px 0px 6px #aaaa;/* 1px 1px 7px 2px #dddd; */
	--narrow-text-width: 600px;

	/* dynamic vars */

	--nav-bottom-height: 46px; 
	--scrollbar-width: 17px; 
	--footer-height: 317px;
}

@media screen and (not (pointer: coarse)) {
	:root {
		--header-height: 136px; 
	}
}

@media screen and (pointer: coarse) {
	:root {
		--header-height: 54px; 
	}
}

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

#product-list, .tile-list, 
#product-group-list, 
.abo-group-list, .abo-list {
	--product-height: 420px;
	--product-height-hover: 660px;
}

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

.view-compact {
	--compact-template-rows: 132px;
	--compact-max-product-height: 132px;
}

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


#cart, #wunschabo {
	--cart-sum-font-size-large: 24px;
}

#cartPreview {
	--z-index: 20;
}

input[type="checkbox"] {
	--input-width: 22px;
	--input-height: 22px;
}

#filter {
	--fontsize-h2: 1.1rem;
	--fontsize-h3: 1.1rem;
	--button-fontsize: 16px;
}

input.removeFilter {
	--input-height: 25px;
}

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

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

	.abo-group-list .tile-wrapper {
		display: flex;
		flex-direction: column;
	}

	.abo-group-list .tile-wrapper:hover .product,
	.abo-group-list .tile-wrapper.clicked .product,
	.abo-group-list .tile-wrapper.hovered .product,
	.abo-group-list .tile-wrapper:focus-within .product {
		padding: var(--product-padding);
	}
}