/* css zu home */

/* FooterCSS  */
footer > .footerGreen{
    background-image: url('/bilder/karton-pattern-green.jpg');
    border-top: 1px solid var(--lagerhausgruen);
    border-bottom: 1px solid var(--lagerhausgruen);
  }
  
  footer > .footerGreen > div {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }
  footer .footerGreenCol1{
	align-items: center;
  }
  footer > .footerGreen > div > div > a.footerMailIcon{
    width: 25px;
    height: 32px;
    background-image: url('/bilder/greenicons.gif');
    background-position: right;
    margin-left: 10px;
    margin-right: 10px;
  }
  footer > .footerGreen > div > div > a.footerNewsletter{
    text-decoration: none;
    padding: 10px 3px;
    width: 100%;
    font-size: 20px;
  }
  footer > .footerGreen > div > div > a.footerNewsletter::after{
    content: '';
    display: inline-block;
    width: 43px;
    height: 43px;
    background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAApCAYAAACoYAD2AAAAy0lEQVRYhe3SoQoCQRDG8ctbjNd8At/AtsF0yex7GRbxwGIX66UrhgsiYhIMi1w5BEGwfQbBquzNsCt8A/848IOZLJuPkXzRAUQSSSSRiRcdQCSRRL4brWeofIO8LNJFLk9bAMChO8tAtU60udRyUC2kKDR0MS+Lrw1XU9TXfX9oKDJkgqGhyPbR/dTtef8gK9/AOJvWTw4WE+zaYz+gJlIMqIUUBWogxYEaSOMsKt/IAbXObZyVA2ohxYsOIJJIIolMvOgAIon8Q+QLTVRdIAGDpL8AAAAASUVORK5CYII=');
    position: absolute;
    top: 0;
    right: 0;
  }
  footer > .footerGreen > div > div > a.footerFb{
    display: inline-block;
    width: 25px;
    height: 32px;
    background-image: url('/bilder/greenicons.gif');
    margin-left: 10px;
    margin-right: 10px;
    vertical-align: middle;
  }
  footer > .footerGray{
    background-image: url('/bilder/karton-pattern.jpg');
  }
  footer > .footerGray > div.footerInfos .weekday{
    font-weight: bold;
    display: inline-block;
    width: 50px;
  }
  footer > .footerGray > .footerNav{
    border-top: 1px solid var(--mittelgrau);
    text-align: center;
  }
  footer > .footerGray > .footerNav > div > a{
    text-decoration: none;
  }
  footer > .footerGray > .footerNav > div > a:hover{
    text-decoration: underline;
  }
  footer div > .col14{
    width: calc(100% / 4)
  }
  footer > .footerGreen > div > .col14 > b{
    width: calc(100% - 45px)
  }
  
  
  @media (max-width: 1024px){
    footer div > .col14{
      width: calc(100% / 2)
    }
    footer > .footerGreen > div{
      padding-bottom: var(--abstand_9)
    }
    footer > .footerGreen > div,
    footer > .footerGray > .footerInfos{
      max-width: 760px; 
    }
    footer > .footerGreen > div > div > a.footerFb{margin-left: 0;}

	footer > .footerGray > div.footerNav > div > a {
		padding-left: var(--abstand_9);
		padding-right: var(--abstand_9);
	}
  }

  @media (max-width: 768px){
    footer > .footerGreen > div > .col12{
      padding-left: 0px;
      padding-right: 0px
    }
    footer .footerNav a{
  		padding: 0 3%
	} 

	footer > .footerGray > div.footerNav > div > a {
		padding-left: var(--abstand_6);
		padding-right: var(--abstand_6);
	}
  }

  @media (max-width: 600px){
    footer div > .col14 {
      width: 100%;
      text-align: center;
    }
    footer > .footerGreen .col14{
      text-align: left;
    }
    footer > .footerGreen > div > div > a.footerFb{margin-left: 0;}
    footer > .footerGray > div.footerInfos > div{text-align: center}
    footer > .footerGray > div.footerNav > div > a{
      width: 100%;
      display: inline-block;
      padding: 5px 0;
    }

	.footerOeffnungszeiten {
		display: inline-block !important;
		vertical-align: top !important;
		width: auto !important;
	}

	.standorteWeekday, .standorteTime {
		text-align: left;
	}
  }
/* --- --- */
/* GlobalCSS  */
/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */
/* --------------------------- Variablen --------------------------- */
/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */
:root {
	/* Farben */
	--waldgruen: #005541;
	--lagerhausgruen: #009e3c;
	--rapsgelb: #ffdc00;
	--rapsgelbhover: #ffec70;
	--rot: #f20000;
	--schriftgrau: #323232;
	--grau: #e6e6e6;
	--dunkelgrau: #898989;
	--mittelgrau: #D0D0D0;
	--hellgrau: #F5F5F5;
	--weiss: #FFFFFF;
	
	/* Schriften */
	--regular: 'Calibre Regular', Arial, Helvetica, sans-serif;
	--medium: 'Calibre Medium', Arial, Helvetica, sans-serif;
	--semibold: 'Calibre SemiBold', Arial, Helvetica, sans-serif;
	--bold: 'Calibre Bold', Arial, Helvetica, sans-serif;
	--headline: 'Calibre Headline', Arial, Helvetica, sans-serif;
	
	/* Abstände */
	--abstand_6: 10px;
	--abstand_9: 15px;
	--abstand_15: 25px;
	--abstand_18: 35px;
	--abstand_25: 50px;
	--abstand_36: 80px;
}



/* --------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------- */
/* --------------------------- Schriftarten Import --------------------------- */
/* --------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------- */
@font-face {
	font-family: 'Calibre Regular';
	src: url('/fonts/calibre/CalibreLH-Regular.woff') format('woff');
	font-weight: normal;
	font-display: fallback;
}

@font-face {
	font-family: 'Calibre Medium';
	src: url('/fonts/calibre/CalibreLH-Medium.woff') format('woff');
	font-weight: normal;
	font-display: fallback;
}

@font-face {
	font-family: 'Calibre SemiBold';
	src: url('/fonts/calibre/CalibreLH-SemiBold.woff') format('woff');
	font-weight: normal;
	font-display: fallback;
}

@font-face {
	font-family: 'Calibre Bold';
	src: url('/fonts/calibre/CalibreLH-Bold.woff') format('woff');
	font-weight: normal;
	font-display: fallback;
}

@font-face {
	font-family: 'Calibre Headline';
	src: url('/fonts/calibre/CalibreLH-Headline.woff') format('woff');
	font-weight: normal;
	font-display: fallback;
}



/* ------------------------------------------------------------- */
/* ------------------------------------------------------------- */
/* -------------------- Schriftformatierung -------------------- */
/* ------------------------------------------------------------- */
/* ------------------------------------------------------------- */
html {
	font-size: 16px;
	line-height: 142%;
	hyphens: auto;
	font-family: var(--regular);
}

h1, h2, h3, h4, strong, b {
	font-family: var(--bold);
	font-weight: normal;
}



h1, h2, h3, h4 {
	margin-top: 0;
	margin-bottom: var(--abstand_15);
	line-height: 115%;
}

a, .link {
	font-family: var(--semibold);
}

h1 {font-size: 235%;}
h2 {font-size: 188%;}
h3 {font-size: 157%;}
h4 {font-size: 125%;}


ul {padding-left: 15px;}


.fontRegular {font-family: var(--regular) !important;}
.fontMedium {font-family: var(--medium) !important;}
.fontBold {font-family: var(--bold) !important;}
.fontIcons {
	font-family: var(--icons) !important;
	vertical-align: top;
	font-size: 24px;
}
.brandIcons {
	font-family: var(--brandIcons) !important;
	vertical-align: top;
	font-size: 24px;
}

.fontSizeBig {font-size: 125% !important;}
.fontSizeNormal {font-size: 17px !important;}
.fontSizeSmall, small {font-size: 80% !important;}
.fontSizeTiny {font-size: 60% !important;}


.uppercase {text-transform: uppercase;}
.lowercase {text-transform: lowercase;}

.breakword {word-break: break-word;}



@media (max-width: 1024px) {
	
}

@media (max-width: 768px) {
	
}

@media (max-width: 600px) {
	html {
		font-size: 16px;
	}
}



/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* ------------------------------ Inputs ------------------------------ */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
input:not([type="checkbox"], [type="radio"], [type="button"], [type="submit"], .inputNoFormat),
textarea,
select {
	font-family: inherit;
	font-size: inherit;
	max-width: 100%;
	width: 250px;
	outline: none;
	
}

input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], .inputNoFormat),
textarea,
select {
	height: 30px;
	padding: 5px;
	border: 1px solid var(--dunkelgrau);
	background-color: var(--weiss);
	transition: border-color 100ms ease-in-out;
}

input[type="color"] {padding: 0;}

input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [readonly], .inputNoFormat):hover,
input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [readonly], .inputNoFormat):focus,
textarea:hover,
textarea:focus,
select:hover,
select:focus {
	border-color: var(--lagerhausgruen);
}

input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [readonly], .inputNoFormat):invalid,
textarea:invalid,
select:invalid {
	border-color: var(--rot);
}


input[readonly] {background-color: var(--mittelgrau);}

textarea {height: 100px;}


input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], .inputNoFormat)::placeholder,
textarea::placeholder {
	color: var(--dunkelgrau);
	opacity: 1;
}



/* --------------------------------------------------------------------- */
/* --------------------------------------------------------------------- */
/* ------------------------------ Buttons ------------------------------ */
/* --------------------------------------------------------------------- */
/* --------------------------------------------------------------------- */
input[type="checkbox"], input[type="radio"],
input[type="submit"], input[type="button"],
button,
label,
select {cursor: pointer;}

input[type="button"]:not(.buttonNoFormat, .warenkorbArtikelRemove, .warenkorbArtikelDecrease, .warenkorbArtikelAdd), input[type="submit"]:not(.buttonNoFormat), button:not(.buttonNoFormat), .button, .buttonSmall, .button_gelb, .button_weiss {
	font-family: var(--medium);
	font-size: inherit;
	line-height: 120%;
	max-width: 100%;
	padding: 10px 16px;
	transition: background-color 200ms ease-in-out, color 200ms, border-color 200ms ease-in-out;
	display: inline-block;
	text-decoration: none;
	overflow: hidden;
	text-align: center;
}

input[type="button"]:not(.buttonNoFormat, .warenkorbArtikelRemove, .warenkorbArtikelDecrease, .warenkorbArtikelAdd, .button_gelb, .button_weiss), input[type="submit"]:not(.buttonNoFormat), button:not(.buttonNoFormat), .button, .buttonSmall {
	background-color: var(--waldgruen);
	color: var(--weiss);
	border: 1px solid transparent;
}

.buttonSmall {
	font-size: 80%;
	padding: 6px 12px;
}

.button_gelb {
	background-color: var(--rapsgelb);
	color: var(--schriftgrau);
	border: 1px solid transparent;
}

.button_weiss {
	background-color: var(--weiss);
	color: var(--waldgruen);
	border: 2px solid var(--waldgruen);
}


input[type="button"]:not(.buttonNoFormat, .warenkorbArtikelRemove, .warenkorbArtikelDecrease, .warenkorbArtikelAdd, .button_gelb, .button_weiss):hover, input[type="submit"]:not(.buttonNoFormat):hover, button:not(.buttonNoFormat):hover, .button:hover, .buttonSmall:hover {
	background-color: var(--lagerhausgruen);
	color: var(--weiss);
}

.button_gelb:hover {
	background-color: var(--rapsgelbhover);
	color: var(--schriftgrau);
}

.button_weiss:hover {
	background-color: var(--waldgruen);
	color: var(--weiss);
}



/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* ------------------------------ Farben ------------------------------ */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
html {color: var(--schriftgrau);}

::selection {
	background-color: var(--waldgruen);
	color: var(--weiss);
}


a, .link {
	color: var(--waldgruen);
	transition: color 200ms;
}

.link {
	cursor: pointer;
	text-decoration: underline;
}

a:hover, .link:hover {color: var(--lagerhausgruen);}


hr {color: var(--waldgruen);}


.waldgruen, .gruen {color: var(--waldgruen);} .bg_waldgruen, .bg_gruen {background-color: var(--waldgruen);}
.lagerhausgruen, .hellgruen {color: var(--lagerhausgruen);} .bg_lagerhausgruen, .bg_hellgruen {background-color: var(--lagerhausgruen);}
.rapsgelb, .gelb {color: var(--rapsgelb);} .bg_rapsgelb, .bg_gelb {background-color: var(--rapsgelb);}
.rot {color: var(--rot);} .bg_rot {background-color: var(--rot);}
.schriftgrau, .schwarz {color: var(--schriftgrau);} .bg_schriftgrau, .bg_schwarz {background-color: var(--schriftgrau);}
.dunkelgrau {color: var(--dunkelgrau);} .bg_dunkelgrau {background-color: var(--dunkelgrau);}
.mittelgrau {color: var(--mittelgrau);} .bg_mittelgrau {background-color: var(--mittelgrau);}
.hellgrau {color: var(--hellgrau);} .bg_hellgrau {background-color: var(--hellgrau);}
.weiss {color: var(--weiss);} .bg_weiss {background-color: var(--weiss);}

.color_inherit {color: inherit;}



.border_hellgrau {
	border: 1px solid var(--mittelgrau);
}

.border_mittelgrau {
	border: 1px solid var(--mittelgrau);
}

.border_dunkelgrau {
	border: 1px solid var(--mittelgrau);
}



/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* ----------------------------- Breiten ------------------------------ */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
.contentWrapper, .bigIncludeTo.col44, .contentWrapperW {
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--abstand_9);
	padding-right: var(--abstand_9);
}

.contentWrapper, .bigIncludeTo.col44 {
	max-width: 1590px;
}

.contentWrapperW {
	max-width: 1680px;
}

img, video, iframe {
	max-width: 100%;
	max-height: 100%;
}


.wide, .col14, .col34, .col13, .col23, .col15, .col12,
.formularColL, .formularColR, .formularCaptchaWrapper > div > * {
	display: inline-block;
	vertical-align: top;
}


.wide {width: 100%;}
.col12 {width: 50%;}
.col14 {width: 25%;}
.col15 {width: 20%;}
.col13 {width: 33.33%;}
.col23 {width: 66.66%;}
.col34 {width: 75%;}




.bigIncludeTo.col44, .col12flexAb9, .col13flexAb9, .col14flexAb9  {
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
}
.col12flexAb9, .col13flexAb9, .col14flexAb9 {
	gap: var(--abstand_9);
}

.col12flexAb9 > * {width: calc(50% - var(--abstand_9) / 2);}
.col13flexAb9 > * {width: calc(33.33% - var(--abstand_9) * 2 / 3);}
.col14flexAb9 > * {width: calc(25% - var(--abstand_9) * 3 / 4);}


.formularColL, .formularColR {margin-bottom: 14px;}
.formularColL {width: 240px;}
.formularColR {width: calc(100% - 240px);}
.formularCaptchaWrapper > div > aside {margin-right: 14px;}


@media (max-width: 1440px) {
	.col14 {width: 33%;}
}
@media (max-width: 1240px) {
	
}
@media (max-width: 1024px) {
	.col14 {width: 50%;}
	
	.col13flexAb9 > * {width: calc(50% - var(--abstand_9) / 2);}
	.col14flexAb9 > * {width: calc(33.33% - var(--abstand_9) * 2 / 3);}
}


@media (max-width: 768px) {
	.col34, .col14, .col12, .col12flexAb9 > * {width: 100%;}
	
	.col14flexAb9 > * {width: calc(50% - var(--abstand_9) / 2);}
}


@media (max-width: 600px) {
	.contentWrapper, .bigIncludeTo.col44 {
		padding-left: var(--abstand_9);
		padding-right: var(--abstand_9);
	}
	
	.col14, .col13, .col15, .formularColL, .formularColR {width: 100%;}
	
	.formularColL {margin-bottom: 0;}
	
	.col13flexAb9 > * {width: 100%;}
}

@media (max-width: 500px) {
	.col14flexAb9 > * {width: 100%;}
}


/* --------------------------------------------------------------------- */
/* --------------------------------------------------------------------- */
/* ----------------------------- Abstaende ----------------------------- */
/* --------------------------------------------------------------------- */
/* --------------------------------------------------------------------- */
.tm0 {margin-top: 0px;} .bm0 {margin-bottom: 0px;}
.lm0 {margin-left: 0px;} .rm0 {margin-right: 0px;}
.hm0 {margin-left: 0px; margin-right: 0px;}
.vm0 {margin-top: 0px; margin-bottom: 0px;}
.tp0 {padding-top: 0px;} .bp0 {padding-bottom: 0px;}
.lp0 {padding-left: 0px;} .rp0 {padding-right: 0px;}
.hp0 {padding-left: 0px; padding-right: 0px;}
.vp0 {padding-top: 0px; padding-bottom: 0px;}


.tm6 {margin-top: var(--abstand_6);} .bm6 {margin-bottom: var(--abstand_6);}
.lm6 {margin-left: var(--abstand_6);} .rm6 {margin-right: var(--abstand_6);}
.hm6 {margin-left: var(--abstand_6); margin-right: var(--abstand_6);}
.vm6 {margin-top: var(--abstand_6); margin-bottom: var(--abstand_6);}
.tp6 {padding-top: var(--abstand_6);} .bp6 {padding-bottom: var(--abstand_6);}
.lp6 {padding-left: var(--abstand_6);} .rp6 {padding-right: var(--abstand_6);}
.hp6 {padding-left: var(--abstand_6); padding-right: var(--abstand_6);}
.vp6 {padding-top: var(--abstand_6); padding-bottom: var(--abstand_6);}


.tm9 {margin-top: var(--abstand_9);} .bm9 {margin-bottom: var(--abstand_9);}
.lm9 {margin-left: var(--abstand_9);} .rm9 {margin-right: var(--abstand_9);}
.hm9 {margin-left: var(--abstand_9); margin-right: var(--abstand_9);}
.vm9 {margin-top: var(--abstand_9); margin-bottom: var(--abstand_9);}
.tp9 {padding-top: var(--abstand_9);} .bp9 {padding-bottom: var(--abstand_9);}
.lp9 {padding-left: var(--abstand_9);} .rp9 {padding-right: var(--abstand_9);}
.hp9 {padding-left: var(--abstand_9); padding-right: var(--abstand_9);}
.vp9 {padding-top: var(--abstand_9); padding-bottom: var(--abstand_9);}


.tm15 {margin-top: var(--abstand_15);} .bm15 {margin-bottom: var(--abstand_15);}
.lm15 {margin-left: var(--abstand_15);} .rm15 {margin-right: var(--abstand_15);}
.hm15 {margin-left: var(--abstand_15); margin-right: var(--abstand_15);}
.vm15 {margin-top: var(--abstand_15); margin-bottom: var(--abstand_15);}
.tp15 {padding-top: var(--abstand_15);} .bp15 {padding-bottom: var(--abstand_15);}
.lp15 {padding-left: var(--abstand_15);} .rp15 {padding-right: var(--abstand_15);}
.hp15 {padding-left: var(--abstand_15); padding-right: var(--abstand_15);}
.vp15 {padding-top: var(--abstand_15); padding-bottom: var(--abstand_15);}


.tm18 {margin-top: var(--abstand_18);} .bm18 {margin-bottom: var(--abstand_18);}
.lm18 {margin-left: var(--abstand_18);} .rm18 {margin-right: var(--abstand_18);}
.hm18 {margin-left: var(--abstand_18); margin-right: var(--abstand_18);}
.vm18 {margin-top: var(--abstand_18); margin-bottom: var(--abstand_18);}
.tp18 {padding-top: var(--abstand_18);} .bp18 {padding-bottom: var(--abstand_18);}
.lp18 {padding-left: var(--abstand_18);} .rp18 {padding-right: var(--abstand_18);}
.hp18 {padding-left: var(--abstand_18); padding-right: var(--abstand_18);}
.vp18 {padding-top: var(--abstand_18); padding-bottom: var(--abstand_18);}


.tm25 {margin-top: var(--abstand_25);} .bm25 {margin-bottom: var(--abstand_25);}
.lm25 {margin-left: var(--abstand_25);} .rm25 {margin-right: var(--abstand_25);}
.hm25 {margin-left: var(--abstand_25); margin-right: var(--abstand_25);}
.vm25 {margin-top: var(--abstand_25); margin-bottom: var(--abstand_25);}
.tp25 {padding-top: var(--abstand_25);} .bp25 {padding-bottom: var(--abstand_25);}
.lp25 {padding-left: var(--abstand_25);} .rp25 {padding-right: var(--abstand_25);}
.hp25 {padding-left: var(--abstand_25); padding-right: var(--abstand_25);}
.vp25 {padding-top: var(--abstand_25); padding-bottom: var(--abstand_25);}


.tm36 {margin-top: var(--abstand_36);} .bm36 {margin-bottom: var(--abstand_36);}
.lm36 {margin-left: var(--abstand_36);} .rm36 {margin-right: var(--abstand_36);}
.hm36 {margin-left: var(--abstand_36); margin-right: var(--abstand_36);}
.vm36 {margin-top: var(--abstand_36); margin-bottom: var(--abstand_36);}
.tp36 {padding-top: var(--abstand_36);} .bp36 {padding-bottom: var(--abstand_36);}
.lp36 {padding-left: var(--abstand_36);} .rp36 {padding-right: var(--abstand_36);}
.hp36 {padding-left: var(--abstand_36); padding-right: var(--abstand_36);}
.vp36 {padding-top: var(--abstand_36); padding-bottom: var(--abstand_36);}



@media (max-width: 1440px) {

}


@media (max-width: 1024px) {
	.ttm0 {margin-top: 0px;} .tbm0 {margin-bottom: 0px;}
	.tlm0 {margin-left: 0px;} .trm0 {margin-right: 0px;}
	.thm0 {margin-left: 0px; margin-right: 0px;}
	.tvm0 {margin-top: 0px; margin-bottom: 0px;}
	.ttp0 {padding-top: 0px;} .tbp0 {padding-bottom: 0px;}
	.tlp0 {padding-left: 0px;} .trp0 {padding-right: 0px;}
	.thp0 {padding-left: 0px; padding-right: 0px;}
	.tvp0 {padding-top: 0px; padding-bottom: 0px;}


	.ttm6 {margin-top: var(--abstand_6);} .tbm6 {margin-bottom: var(--abstand_6);}
	.tlm6 {margin-left: var(--abstand_6);} .trm6 {margin-right: var(--abstand_6);}
	.thm6 {margin-left: var(--abstand_6); margin-right: var(--abstand_6);}
	.tvm6 {margin-top: var(--abstand_6); margin-bottom: var(--abstand_6);}
	.ttp6 {padding-top: var(--abstand_6);} .tbp6 {padding-bottom: var(--abstand_6);}
	.tlp6 {padding-left: var(--abstand_6);} .trp6 {padding-right: var(--abstand_6);}
	.thp6 {padding-left: var(--abstand_6); padding-right: var(--abstand_6);}
	.tvp6 {padding-top: var(--abstand_6); padding-bottom: var(--abstand_6);}


	.ttm9 {margin-top: var(--abstand_9);} .tbm9 {margin-bottom: var(--abstand_9);}
	.tlm9 {margin-left: var(--abstand_9);} .trm9 {margin-right: var(--abstand_9);}
	.thm9 {margin-left: var(--abstand_9); margin-right: var(--abstand_9);}
	.tvm9 {margin-top: var(--abstand_9); margin-bottom: var(--abstand_9);}
	.ttp9 {padding-top: var(--abstand_9);} .tbp9 {padding-bottom: var(--abstand_9);}
	.tlp9 {padding-left: var(--abstand_9);} .trp9 {padding-right: var(--abstand_9);}
	.thp9 {padding-left: var(--abstand_9); padding-right: var(--abstand_9);}
	.tvp9 {padding-top: var(--abstand_9); padding-bottom: var(--abstand_9);}


	.ttm15 {margin-top: var(--abstand_15);} .tbm15 {margin-bottom: var(--abstand_15);}
	.tlm15 {margin-left: var(--abstand_15);} .trm15 {margin-right: var(--abstand_15);}
	.thm15 {margin-left: var(--abstand_15); margin-right: var(--abstand_15);}
	.tvm15 {margin-top: var(--abstand_15); margin-bottom: var(--abstand_15);}
	.ttp15 {padding-top: var(--abstand_15);} .tbp15 {padding-bottom: var(--abstand_15);}
	.tlp15 {padding-left: var(--abstand_15);} .trp15 {padding-right: var(--abstand_15);}
	.thp15 {padding-left: var(--abstand_15); padding-right: var(--abstand_15);}
	.tvp15 {padding-top: var(--abstand_15); padding-bottom: var(--abstand_15);}


	.ttm18 {margin-top: var(--abstand_18);} .tbm18 {margin-bottom: var(--abstand_18);}
	.tlm18 {margin-left: var(--abstand_18);} .trm18 {margin-right: var(--abstand_18);}
	.thm18 {margin-left: var(--abstand_18); margin-right: var(--abstand_18);}
	.tvm18 {margin-top: var(--abstand_18); margin-bottom: var(--abstand_18);}
	.ttp18 {padding-top: var(--abstand_18);} .tbp18 {padding-bottom: var(--abstand_18);}
	.tlp18 {padding-left: var(--abstand_18);} .trp18 {padding-right: var(--abstand_18);}
	.thp18 {padding-left: var(--abstand_18); padding-right: var(--abstand_18);}
	.tvp18 {padding-top: var(--abstand_18); padding-bottom: var(--abstand_18);}


	.ttm25 {margin-top: var(--abstand_25);} .tbm25 {margin-bottom: var(--abstand_25);}
	.tlm25 {margin-left: var(--abstand_25);} .trm25 {margin-right: var(--abstand_25);}
	.thm25 {margin-left: var(--abstand_25); margin-right: var(--abstand_25);}
	.tvm25 {margin-top: var(--abstand_25); margin-bottom: var(--abstand_25);}
	.ttp25 {padding-top: var(--abstand_25);} .tbp25 {padding-bottom: var(--abstand_25);}
	.tlp25 {padding-left: var(--abstand_25);} .trp25 {padding-right: var(--abstand_25);}
	.thp25 {padding-left: var(--abstand_25); padding-right: var(--abstand_25);}
	.tvp25 {padding-top: var(--abstand_25); padding-bottom: var(--abstand_25);}


	.ttm36 {margin-top: var(--abstand_36);} .tbm36 {margin-bottom: var(--abstand_36);}
	.tlm36 {margin-left: var(--abstand_36);} .trm36 {margin-right: var(--abstand_36);}
	.thm36 {margin-left: var(--abstand_36); margin-right: var(--abstand_36);}
	.tvm36 {margin-top: var(--abstand_36); margin-bottom: var(--abstand_36);}
	.ttp36 {padding-top: var(--abstand_36);} .tbp36 {padding-bottom: var(--abstand_36);}
	.tlp36 {padding-left: var(--abstand_36);} .trp36 {padding-right: var(--abstand_36);}
	.thp36 {padding-left: var(--abstand_36); padding-right: var(--abstand_36);}
	.tvp36 {padding-top: var(--abstand_36); padding-bottom: var(--abstand_36);}
}


@media (max-width: 768px) {
	
}

@media (max-width: 600px) {
	.mtm0 {margin-top: 0px;} .mbm0 {margin-bottom: 0px;}
	.mlm0 {margin-left: 0px;} .mrm0 {margin-right: 0px;}
	.mhm0 {margin-left: 0px; margin-right: 0px;}
	.mvm0 {margin-top: 0px; margin-bottom: 0px;}
	.mtp0 {padding-top: 0px;} .mbp0 {padding-bottom: 0px;}
	.mlp0 {padding-left: 0px;} .mrp0 {padding-right: 0px;}
	.mhp0 {padding-left: 0px; padding-right: 0px;}
	.mvp0 {padding-top: 0px; padding-bottom: 0px;}


	.mtm6 {margin-top: var(--abstand_6);} .mbm6 {margin-bottom: var(--abstand_6);}
	.mlm6 {margin-left: var(--abstand_6);} .mrm6 {margin-right: var(--abstand_6);}
	.mhm6 {margin-left: var(--abstand_6); margin-right: var(--abstand_6);}
	.mvm6 {margin-top: var(--abstand_6); margin-bottom: var(--abstand_6);}
	.mtp6 {padding-top: var(--abstand_6);} .mbp6 {padding-bottom: var(--abstand_6);}
	.mlp6 {padding-left: var(--abstand_6);} .mrp6 {padding-right: var(--abstand_6);}
	.mhp6 {padding-left: var(--abstand_6); padding-right: var(--abstand_6);}
	.mvp6 {padding-top: var(--abstand_6); padding-bottom: var(--abstand_6);}


	.mtm9 {margin-top: var(--abstand_9);} .mbm9 {margin-bottom: var(--abstand_9);}
	.mlm9 {margin-left: var(--abstand_9);} .mrm9 {margin-right: var(--abstand_9);}
	.mhm9 {margin-left: var(--abstand_9); margin-right: var(--abstand_9);}
	.mvm9 {margin-top: var(--abstand_9); margin-bottom: var(--abstand_9);}
	.mtp9 {padding-top: var(--abstand_9);} .mbp9 {padding-bottom: var(--abstand_9);}
	.mlp9 {padding-left: var(--abstand_9);} .mrp9 {padding-right: var(--abstand_9);}
	.mhp9 {padding-left: var(--abstand_9); padding-right: var(--abstand_9);}
	.mvp9 {padding-top: var(--abstand_9); padding-bottom: var(--abstand_9);}


	.mtm15 {margin-top: var(--abstand_15);} .mbm15 {margin-bottom: var(--abstand_15);}
	.mlm15 {margin-left: var(--abstand_15);} .mrm15 {margin-right: var(--abstand_15);}
	.mhm15 {margin-left: var(--abstand_15); margin-right: var(--abstand_15);}
	.mvm15 {margin-top: var(--abstand_15); margin-bottom: var(--abstand_15);}
	.mtp15 {padding-top: var(--abstand_15);} .mbp15 {padding-bottom: var(--abstand_15);}
	.mlp15 {padding-left: var(--abstand_15);} .mrp15 {padding-right: var(--abstand_15);}
	.mhp15 {padding-left: var(--abstand_15); padding-right: var(--abstand_15);}
	.mvp15 {padding-top: var(--abstand_15); padding-bottom: var(--abstand_15);}


	.mtm18 {margin-top: var(--abstand_18);} .mbm18 {margin-bottom: var(--abstand_18);}
	.mlm18 {margin-left: var(--abstand_18);} .mrm18 {margin-right: var(--abstand_18);}
	.mhm18 {margin-left: var(--abstand_18); margin-right: var(--abstand_18);}
	.mvm18 {margin-top: var(--abstand_18); margin-bottom: var(--abstand_18);}
	.mtp18 {padding-top: var(--abstand_18);} .mbp18 {padding-bottom: var(--abstand_18);}
	.mlp18 {padding-left: var(--abstand_18);} .mrp18 {padding-right: var(--abstand_18);}
	.mhp18 {padding-left: var(--abstand_18); padding-right: var(--abstand_18);}
	.mvp18 {padding-top: var(--abstand_18); padding-bottom: var(--abstand_18);}


	.mtm25 {margin-top: var(--abstand_25);} .mbm25 {margin-bottom: var(--abstand_25);}
	.mlm25 {margin-left: var(--abstand_25);} .mrm25 {margin-right: var(--abstand_25);}
	.mhm25 {margin-left: var(--abstand_25); margin-right: var(--abstand_25);}
	.mvm25 {margin-top: var(--abstand_25); margin-bottom: var(--abstand_25);}
	.mtp25 {padding-top: var(--abstand_25);} .mbp25 {padding-bottom: var(--abstand_25);}
	.mlp25 {padding-left: var(--abstand_25);} .mrp25 {padding-right: var(--abstand_25);}
	.mhp25 {padding-left: var(--abstand_25); padding-right: var(--abstand_25);}
	.mvp25 {padding-top: var(--abstand_25); padding-bottom: var(--abstand_25);}


	.mtm36 {margin-top: var(--abstand_36);} .mbm36 {margin-bottom: var(--abstand_36);}
	.mlm36 {margin-left: var(--abstand_36);} .mrm36 {margin-right: var(--abstand_36);}
	.mhm36 {margin-left: var(--abstand_36); margin-right: var(--abstand_36);}
	.mvm36 {margin-top: var(--abstand_36); margin-bottom: var(--abstand_36);}
	.mtp36 {padding-top: var(--abstand_36);} .mbp36 {padding-bottom: var(--abstand_36);}
	.mlp36 {padding-left: var(--abstand_36);} .mrp36 {padding-right: var(--abstand_36);}
	.mhp36 {padding-left: var(--abstand_36); padding-right: var(--abstand_36);}
	.mvp36 {padding-top: var(--abstand_36); padding-bottom: var(--abstand_36);}
}



/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* ---------------------------- Allgemein ----------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
* {
	box-sizing: border-box;
	scroll-behavior: smooth;
}


body {
	margin: 0;
}


.dib {display: inline-block;}
.block, noindex {display: block;}
.none, .radio_none {display: none;}


.flex, .inlineFlex {
	flex-wrap: wrap;
	justify-content: left;
}

.flex {
	display: flex;
}

.inlineFlex {
	display: inline-flex;
}

.flexHl {justify-content: left;}
.flexHr {justify-content: right;}
.flexHc {justify-content: center;}

.flexVt {align-items: start;}
.flexVb {align-items: end;}


.flexWrap {flex-wrap: wrap;}
.flexRow {flex-direction: row;}
.flexCol {flex-direction: column;}


.oScroll {overflow: scroll;}
.oHide {overflow: hidden;}
.oVisible {overflow: visible;}

.noDecoration {text-decoration: none;}
.underline {text-decoration: underline;}

.hr {text-align: right;}
.hl {text-align: left;}
.hc {text-align: center;}
.vt {vertical-align: top;}
.vb {vertical-align: bottom;}
.vm {vertical-align: middle;}

.float_left {float: left;}
.float_right {float: right;}
.float_clear {float: none;}

.absolute {position: absolute;}
.relative {position: relative;}
.fixed {position: fixed;}


.breakAll {
	word-break: break-all;
}


.platzhalter_300 {height: 300px;}
.platzhalter_600 {height: 600px;}


.noTextHide[data-textlength="0"],
.noTextHide[data-textlength="1"] {
	display: none;
}


.show_1440, .show_1240, .show_1024, .show_768, .show_600, .show_460 {
	display: none !important;
}


@media (max-width: 1440px) {
	.hide_1440 {display: none !important;}
	.show_1440 {display: inline-block !important;}
}

@media (max-width: 1240px) {
	.hide_1240 {display: none !important;}
	.show_1240 {display: inline-block !important;}
	.show_1240.flex {display: flex !important;}
}

@media (max-width: 1024px) {
	.hide_1024 {display: none !important;}
	.show_1024 {display: inline-block !important;}
	.show_1024.flex {display: flex !important;}
}

@media (max-width: 768px) {
	.hide_768 {display: none !important;}
	.show_768 {display: inline-block !important;}
	.show_768.flex {display: flex !important;}
}

@media (max-width: 600px) {
	.hide_600 {display: none !important;}
	.show_600 {display: inline-block !important;}
	.show_600.flex {display: flex !important;}
}

@media (max-width: 460px) {
	.hide_460 {display: none !important;}
	.show_460 {display: inline-block !important;}
	.show_460.flex {display: flex !important;}
}




/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */
/* ---------------------------- Module ----------------------------- */
/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */

/* -------------------------------------------------- */
/* ------------------ Kontaktform ------------------- */
/* -------------------------------------------------- */
.anfrageLinks, .anfrageRechts {
	display: inline-block;
	vertical-align: top;
	margin-bottom: var(--abstand_6);
}

.anfrageLinks {
	width: 200px;
}

.anfrageRechts {
	width: calc(100% - 200px);
}

@media (max-width: 600px) {
	.anfrageLinks, .anfrageRechts {
		width: 100%;
	}
	
	.anfrageLinks {
		margin-bottom: 0;
	}
	
	.anfrageRechts {
		margin-bottom: var(--abstand_9);
	}
}




/* ---------------------------------------------------------- */
/* ------------------ Lightframe anpassen ------------------- */
/* ---------------------------------------------------------- */
.lightFrame_bigDiv {
	background-color: var(--weiss) !important;
}

.lfCloseButton {
	width: 20px !important;
	height: 22px !important;
}





/* ----------------------------------------------------- */
/* ------------------ Öffnungszeiten ------------------- */
/* ----------------------------------------------------- */
.standorteWeekday, .standorteTime {
    display: inline-block;
    vertical-align: middle;
}

.standorteWeekday {
    font-family: var(--semibold);
    width: 60px;
}

.standorteTime {
    width: calc(100% - 60px);
}








@media (max-width: 1440px) {
	
}

@media (max-width: 1024px) {
	
}

@media (max-width: 768px) {
	
}

@media (max-width: 600px) {
	
}

@media (max-width: 360px) {
	
}
/* --- --- */
/* MainHeaderCSS  */
/* ----------------------------------------------------- */
/* -------------------- Main Header -------------------- */
/* ----------------------------------------------------- */
#mainHeader {
    margin-bottom: var(--abstand_18);
}


/* --------------- Top --------------- */
.mainHeaderTopLink {
    color: var(--weiss);
    font-size: 18px;
    text-decoration: none;
    display: flex;
    flex-wrap: nowrap;
    justify-content: left;
    align-items: center;
    height: 45px;
    padding: 0 15px;
}

.mainHeaderTopLink:hover {
    color: var(--weiss);
}

.mainHeaderTopLagerhausIcon, .mainHeaderTopGewerbeIcon {
    height: 26px;
    width: 30px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 10px;
}

.mainHeaderTopLagerhausIcon {
    background-image: url('/bilder/lagerhaus.gif');
}

.mainHeaderTopGewerbeIcon {
    background-image: url('/bilder/gewerbeshop.gif');
}



#mainHeaderMid {
    position: relative;
}



/* Logo */
#mainHeaderMidL {
    width: 300px;
}

#mainHeaderMidLogo, #mainHeaderMidLogoText {
    display: inline-block;
    vertical-align: bottom;
}

#mainHeaderMidLogo {
    width: 120px;
    margin-right: 10px;
}

#mainHeaderMidLogo img {
    width: 100%;
    display: block;
}


.mainHeaderEditIcon{
    display: inline-block;
    vertical-align: top;
    width: 20px;
    aspect-ratio: 1;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url('/bilder/edit_icon.svg');
    margin-left: 5px;
}



/* Suche */
#mainHeaderMidM {
    width: calc(100% - 300px - 270px);
}

.mainHeaderSucheWrapper {
    position: relative;
    height: 40px;
    width: 100%;
    max-width: 400px;
}

.mainHeaderSucheTb {
    width: calc(100% - 40px);
    height: 100%;
    background-color: var(--grau);
    border: none;
    outline: none;
    font-family: inherit;
    font-size: inherit;
    padding: 12px;
}

.mainHeaderSucheBtn {
    width: 40px;
    height: 100%;
    background-color: var(--dunkelgrau);
    background-image: url('/bilder/headerSucheIcon.svg');
    background-position: center;
    background-size: 60%;
    background-repeat: no-repeat;
    border: none;
    outline: none;
}


/* Icons */
#mainHeaderMidR {
    width: 270px;
}

.mainHeaderMidIconLink {
    display: inline-block;
    vertical-align: top;
    text-decoration: none;
    margin-right: var(--abstand_9);
}

label.mainHeaderMidIconLink {
    font-family: var(--semibold);
}

.mainHeaderMidIconLink:last-child {
    margin-right: 0;
}

.mainHeaderIcon {
    display: inline-block;
    vertical-align: top;
    width: 26px;
    aspect-ratio: 1;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.mainHeaderStandorte {
    background-image: url('/bilder/standorte.svg');
}

.mainHeaderLogin {
    background-image: url('/bilder/login.svg');
}

.mainHeaderWunschliste {
    background-image: url('/bilder/wunschliste.svg');
}

.mainHeaderWarenkorb {
    background-image: url('/bilder/warenkorb.svg');
}


@media (max-width: 1024px) {
    #mainHeaderMid {
        display: grid;
        grid:
            'MenueL MenueR'
            'MenueM MenueM';
        justify-content: unset;
    }

    #mainHeaderMidL, #mainHeaderMidM, #mainHeaderMidR {
        width: 100%;
    }

    #mainHeaderMidL {
        grid-area: MenueL;
    }

    #mainHeaderMidM {
        grid-area: MenueM;
        margin-top: var(--abstand_9);
    }

    #mainHeaderMidR {
        grid-area: MenueR;
    }


    #mainHeaderMidLogo {
        width: 75px;
        margin-right: 0;
    }

    #mainHeaderMidLogoText {
        display: block;
    }

    .mainHeaderIhrStandortO, .mainHeaderIhrStandortU {
        display: inline-block;
        vertical-align: top;
    }

    .mainHeaderIhrStandortO {

    }

    .mainHeaderIhrStandortU {
        font-size: 80%;
    }


    .mainHeaderSucheWrapper {
        max-width: unset;
    }
}

@media (max-width: 600px) {
    .mainHeaderTopLagerhausIcon, .mainHeaderTopGewerbeIcon {
        margin-right: 0;
    }

    .mainHeaderTopLagerhausIconText {
        display: none;
    }


    .mainHeaderMidIconLink {
        margin-right: 8px;
    }
    
    .mainHeaderIconText {
        display: none;
    }
}


/* Menue Bottom */
#mainHeaderBot {
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
}

#mainMenueSeitenreiter {
    width: calc(100% - 350px);
}

#mainHeaderGreeting {
    width: 350px;
    display: flex;
    align-items: center;
    justify-content: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#mainHeaderGreetingLogout {
    text-decoration: none;
    margin-left: var(--abstand_9);
	margin-top: 1px;
}

@media (max-width: 1160px) {
    #mainMenueSeitenreiter {
        width: calc(100% - 80px);
    }

    #mainHeaderGreeting {
        width: 80px;
    }

    #mainHeaderGreetingText {
        display: none;
    }
}

@media (max-width: 1024px) {
    #mainHeaderGreeting {
        display: none;
    }
}


/* Main Menue */
#mainMenueChk, #mainMenue_mobile_chk, #mainMenue_kb_show_menu, #mainMenue_kb_hide_menu {
    display: none;
    margin: 0;
}

#mainMenue, #mainMenue ul {
    margin: 0;
    list-style: none;
}

#mainMenue {
    padding-left: 0;
}

#mainMenue a {
    display: block;
    text-decoration: none;

}

#mainMenue ul {
    display: none;
}

#mainMenue > li > ul ul {
    display: none;
}


@media (min-width: 1025px) {
    #mainMenueTopWrapper, #mainMenueLblHideLayer, #mainMenueLblShow,
    #mainMenue a[href="./logout"], #mainMenue li:has(a[href="./logout"]) {
        display: none;
    }

    #mainMenue {
        display: flex;
        flex-wrap: wrap;
        justify-content: left;
        column-gap: var(--abstand_15);
    }

    #mainMenue > li {
        position: relative;
        padding: var(--abstand_9) 0;
    }

    #mainMenue ul {
        position: absolute;
        background-color: var(--weiss);
        padding: var(--abstand_6);
        top: 100%;
        left: calc(0px - var(--abstand_6));
        width: 300px;
		z-index: 1;
        box-shadow: 0 3px 6px #00000029;
    }

    #mainMenue li:hover > ul {
        display: block;
    }

    #mainMenue > li > div {
        display: none;
    }

    #mainMenue ul > li {
        padding: 4px 0;
    }
    
}


@media (max-width: 1024px) {
    #mainMenueLblShow {
        display: inline-block;
        vertical-align: bottom;
        width: 30px;
        aspect-ratio: 1;
        background-image: url('/bilder/menue_open.svg');
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        margin-right: 10px;
    }

    #mainMenueSeitenreiter {
        position: fixed;
        height: 100%;
        width: 100%;
        max-width: 400px;
        top: 0;
        left: -400px;
        transition: left 400ms ease-in-out;
        background-color: var(--weiss);
        z-index: 5;
    }

    #mainMenueChk:checked ~ #mainMenueSeitenreiter {
        left: 0;
    }

    #mainMenueLblHideLayer {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        cursor: unset;
        background-color: var(--dunkelgrau);
        opacity: 0;
        pointer-events: none;
        transition: opacity 400ms ease-in-out;
        z-index: 5;
    }

    #mainMenueChk:checked ~ #mainMenueLblHideLayer {
        opacity: 0.5;
        pointer-events: all;
    }

    #mainMenueTopWrapper {
        background-color: var(--waldgruen);
        padding: var(--abstand_6) var(--abstand_9);
        margin-bottom: 3px;
    }

    #mainMenueMobilLogo {
        display: inline-block;
        vertical-align: top;
        height: 35px;
    }

    #mainMenueMobilLogo img {
        display: block;
        height: 100%;
    }

    #mainMenueLblHide {
        display: inline-block;
        vertical-align: bottom;
        width: 35px;
        aspect-ratio: 1;
        background-image: url('/bilder/menue_close.svg');
        background-position: center;
        background-size: 35%;
        background-repeat: no-repeat;
        position: absolute;
        top: 10px;
        right: 5px;
    }

	
	#mainMenue {
		overflow-y: auto;
		height: calc(100% - 60px);
		scrollbar-width: thin;
	}

    #mainMenue > li {
        display: block;
        
        position: relative;
    }

    #mainMenue > li > a {
        background-color: var(--hellgrau);
        margin-bottom: 3px;
        padding: var(--abstand_6) calc(var(--abstand_6) + 35px) var(--abstand_6) var(--abstand_9);
        transition: color 200ms ease-in-out, background-color 200ms ease-in-out;
    }

    #mainMenue > li.isnode.openleaf > a {
        background-color: var(--waldgruen);
        color: var(--weiss);
    }

    #mainMenue > li:last-of-type > a {
        margin-bottom: 0;
    }


    #mainMenue li > div {
        display: none;
        position: absolute;
        top: 5px;
        right: 5px;
        width: 30px;
        aspect-ratio: 1;
        cursor: pointer;
    }

    #mainMenue li.isnode > div {
        display: block;
    }


    #mainMenue li.isnode > div::before, #mainMenue li.isnode > div::after {
        content: '';
        display: block;
        background-color: var(--waldgruen);
        position: absolute;
        transition: background-color 200ms ease-in-out;
    }

    #mainMenue li.isnode > div::before {
        width: 12px;
        height: 2px;
        top: calc(50% - 1px);
        left: calc(50% - 6px);
    }

    #mainMenue li.isnode > div::after {
        width: 2px;
        height: 12px;
        top: calc(50% - 6px);
        left: calc(50% - 1px);
    }

    #mainMenue li.isnode.openleaf > div::before {
        background-color: var(--weiss);
    }

    #mainMenue li.isnode.openleaf > div::after {
        display: none;
    }


    #mainMenue li > ul {
        padding-left: 0;
    }

    #mainMenue li.isnode.openleaf > ul {
        display: block;
    }

    #mainMenue > li > ul > li {
        display: block;
    }

    #mainMenue > li > ul > li > a {
        display: block;
        padding: var(--abstand_6) var(--abstand_9);
    }
}




/* ----- Back to top ----- */
#backToTopOuterWrapper {
    position: fixed;
    width: 100%;
    height: 100%;
    pointer-events: none;
    left: 0;
    top: 0;
	z-index: 1;
}

#backToTopWrapper {
    position: relative;
    height: 100%;
}

#backtotop {
	display: none;
	position: absolute;
	z-index: 1;
    bottom: 15px;
    right: 105px;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 37px solid var(--waldgruen);
    opacity: 0.5;
    pointer-events: all;
}



/* ----- No JS ----- */
#noJSMessage {
	width: 40px;
	height: 40px;
	position: fixed;
	right: var(--abstand_15);
	bottom: var(--abstand_15);
	pointer-events: all;
	z-index: 1;
}




/* ----- Login ----- */
/* ----- Suchwörter ----- */
#mainHeaderLoginWrapper, #mainHeaderSucheSearchwordsWrapper {
    display: none;
    position: absolute;
    z-index: 2;
}

#mainHeaderLoginWrapper {
    top: calc(100% + 10px);
    right: 0;
    width: calc(100% - 120px);
    max-width: 500px;
    height: 100vh;
    max-height: 455px;
    background-color: var(--hellgrau);
}

#mainHeaderSucheSearchwordsWrapper {
    border-top: 2px solid var(--waldgruen);
    width: 100%;
    left: 0;
    top: 100%;
    background-color: var(--weiss);
    text-align: left;
}

#mainHeaderLoginWrapper::after {
    content: '';
    display: block;
    position: absolute;
    top: -5px;
    right: 19px;
    background-color: var(--hellgrau);
    width: 20px;
    aspect-ratio: 1;
    transform: rotate(45deg);
    z-index: -1;
}

#mainHeaderLoginChk:checked ~ #mainHeaderLoginWrapper,
#mainHeaderSucheSearchwordsChk:checked ~ #mainHeaderTopOuterWrapper #mainHeaderSucheSearchwordsWrapper {
    display: block;
}

#mainHeaderLoginWrapper iframe {
    width: 100%;
    height: 100%;
    border: none;
    background-color: var(--weiss);
}

#mainHeaderLoginCloseArea, #mainHeaderSucheSearchwordsCloseArea {
    display: block;
    position: fixed;
    left: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    pointer-events: none;
    background-color: var(--schriftgrau);
    transition: opacity 200ms ease-in-out;
}

#mainHeaderLoginCloseArea {
    z-index: 2;
}

#mainHeaderTopWrapper, #mainHeaderTopOuterWrapper {
    position: relative;
}

#mainHeaderSucheSearchwordsCloseArea, #mainHeaderTopWrapper, #mainHeaderTopOuterWrapper {
    z-index: 4;
}

#mainHeaderLoginChk:checked ~ #mainHeaderLoginCloseArea, #mainHeaderSucheSearchwordsChk:checked ~ #mainHeaderSucheSearchwordsCloseArea {
    opacity: 0.8;
    pointer-events: all;
}


#mainHeaderLoginClose {
    display: block;
    width: 15px;
    aspect-ratio: 1;
    position: absolute;
    top: 20px;
    right: 15px;
    background-image: url('/bilder/close_black.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}



#mainHeaderSucheSearchwordsWrapper .sucheSearchword {
    display: block;
    width: 100%;
    font-family: inherit;
    color: inherit;
    text-decoration: none;
    padding: 4px 10px;
}

#mainHeaderSucheSearchwordsWrapper .sucheSearchword:hover {
    background-color: var(--mittelgrau);
    color: inherit;
}


@media (max-width: 1024px) {
    #mainHeaderLoginWrapper {
        top: 90px;
    }
}

@media (max-width: 768px) {
    #mainHeaderLoginWrapper {
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    #mainHeaderLoginWrapper {
        top: 94px;
    }
}
/* --- --- */
/* SliderCSS  */
/* -------------------------------------- */
/* ---------- 105 - NewsSlider ---------- */
/* -------------------------------------- */
#newsSliderWrapper {
	position: relative;
}

.newsSliderRad {
	display: none;
}

#newsSliderNewsWrapper {
	overflow: hidden;
	position: relative;
	margin-bottom: 20px;
}

#newsSliderAllNews {
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
	position: relative;
	transition: left 300ms ease-in-out;
	cursor: grab;
}

.newsSliderNews {
	overflow: hidden;
	opacity: 0;
	transition: opacity 200ms ease-in-out;
  position: relative;
}

.newsSliderNewsL {
  display: inline-block;
  position: absolute; 
  background-color: var(--rapsgelb);
  top: 50%; 
  left: 60px;;
  font-size: 120%;
  width: calc(45% - 60px);
  max-width: 100%;
}
.newsSliderNewsL > h1{
  font-size: 255%;
  font-family:var(--semibold);
  line-height: 100%;
  max-height: 100px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
  overflow: hidden;
	
}
.newsSliderNewsL::after,.newsSliderNewsL::before{
  content:'';
  position: absolute;
  height: 50%;
  left: 100%;
  width: 30px;
}
.newsSliderNewsL::after{
  top: 0;
  background-image: linear-gradient(to bottom left, transparent 49%, var(--rapsgelb) 51%)
}
.newsSliderNewsL::before{
  bottom: 0;
  background-image: linear-gradient(to top left, transparent 49%, var(--rapsgelb) 51%)
}

.newsSliderButtonSlider > span{
  text-decoration: underline;
}
.newsSliderNewsKurztext {
	margin-bottom: 20px;
}

.newsSliderNewsPic {
	pointer-events:none;
	display: block;
	height: 510px;
	width: 100%;
	object-fit: cover;
	object-position: center;
}

.newsSliderNewsMobilPicWrapper {
	display: none;
	height: 200px;
	margin-bottom: 20px;
}

@media (max-width: 1024px) {
	#newsSliderNewsWrapper {
		margin-bottom: 0;
	}
	
	.newsSliderNewsL {
		display: flex;
		flex-direction: column;
		justify-content: center;
    width: unset;
		height: unset;
		left: 0;
		top: calc(50% + 25px);
		height: 125px;
	  min-width: 60%;
		max-width: calc(100% - 40px);
	}
	.newsSliderNewsL::after, .newsSliderNewsL::before{
		width: 20px;
	}
	.newsSliderNewsL > h1{
		font-size: 160%;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
    overflow: hidden;
		max-height: 62px;
	}
	
	.newsSliderNewsMobilPicWrapper {
		display: block;
	}
	
	.newsSliderNews {
		padding-right: 0;
	}
	.newsSliderNewsPic{
		height: 390px
	}
}



/* Labels */
#newsSliderLblWrapper{
  text-align: center;
  position: absolute;
  bottom: 70px;
  left: 50%;
  transform: translateX(-50%);
}
.newsSliderLbl {
	display: inline-block;
	vertical-align: top;
	width: 14px;
	aspect-ratio: 1;
	border-radius: 50%;
  border: 1px solid var(--hellgrau);
	background-color: var(--hellgrau);
}

.newsSliderLbl:first-of-type, .newsSliderLbl:last-of-type {
	display: none;
}

.newsSliderLbl:not(:last-of-type) {
	margin-right: 10px;
}

@media (max-width: 1024px) {
	#newsSliderLblWrapper {
		position: absolute;
		right: 0;
		bottom: 15px;
	}
}



/* Next/Prev */
.newsSliderNext, .newsSliderPrev {
	position: absolute;
	width: 31px;
	height: 50px;
	top: calc(50% - 25px);
	background-color: var(--waldgruen);
	z-index: 1;
}
.newsSliderNext{right: 0;}
.newsSliderPrev{left: 0;}

.newsSliderNext::after, .newsSliderPrev::after {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	transform: rotate(45deg);
	position: absolute;
	top: 15px;
}
.newsSliderNext::after{
	border-right: 2px solid var(--hellgrau);
	border-top: 2px solid var(--hellgrau);
	right: 10px;
}
.newsSliderPrev::after{
	border-left: 2px solid var(--hellgrau);
	border-bottom: 2px solid var(--hellgrau);
  left: 10px;
}
@media (max-width: 1024px){
	.newsSliderNext, .newsSliderPrev{
		width: 25px;
		height: 40px;
		top: calc(50% - 20px);
	}
	.newsSliderNext::after, .newsSliderPrev::after{
		width: 10px;
	  height: 10px;
		top: calc(50% - 5px);
	}
}
@media (min-width: 1025px){
#HomeSlider + #HomeNews{
	margin-top: -85px;
  z-index: 1;
  position: relative;
  }
}
@media (max-width: 600px){
  .newsSliderNewsL{
    top: calc(50% + 35px);
    font-size: 100%;
    height: 110px;
  }
}
/* --- --- */
.homeNews {
	display:flex;
	text-decoration: none;
}

.homeNewsL,
.homeNewsR {
	width: 50%;
	height: 100%;
}

.homeNewsL {
	background-color: var(--waldgruen);
	color: #fff;
	padding: var(--abstand_18) var(--abstand_9);
	position: relative;
}

.homeNewsL::after,
.homeNewsL::before {
	content:'';
	position: absolute;
	height: 50%;
	width: 50px;
	left: 100%;
}

.homeNewsL::after {
	top: 0;
	background-image: linear-gradient(to top right, var(--waldgruen) 50%, #fff0 51%);
}

.homeNewsL::before {
	bottom: 0;
	background-image: linear-gradient(to bottom right, var(--waldgruen) 50%, #fff0 51%);
}

.homeNewsR {
	object-fit: cover;
}

.homeNewsButtonWrapper {
	color: var(--rapsgelb);
	display: inline-block;
	border: 2px solid #fff;
	margin-top: var(--abstand_18);
	padding: 5px 20px;
}

.homeNewsButtonWrapper:hover {
	background-color: var(--lagerhausgruen);
	border-color: var(--lagerhausgruen);
}

@media (max-width: 1024px){
    .homeNewsR {
		object-fit: contain;
		background-color: var(--waldgruen)
    }

	.homeNews {
		flex-direction: column-reverse;
		width: 100%;
		align-items: end;
		justify-content: left;
		flex-wrap: nowrap;
	}

	.homeNewsL,
	.homeNewsR {
		width: 100%;
		height: unset;
	}

	.homeNewsL::after,
	.homeNewsL::before {
		display: none;
	}

	.homeNewsR {
		max-height: 220px;
	}

	.homeNewsText {
		display: none;
	}

	.homeNewsL {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	.homeNewsHeadline {
		margin-bottom: 0;
	}

	.homeNewsButtonWrapper {
		margin-top: 0;
		width: fit-content;
	}
}

@media (max-width: 768px) {
	.homeNewsHeadline {
		font-size: 150%;
	}
}

@media (max-width: 600px) {
	.homeNewsL {
		flex-direction: column;
		gap: 20px;
		text-align: center;
	}
}
/* --- --- */
/* ---------------------------------------------------------- */
/* -------------------- Module Übersicht -------------------- */
/* ---------------------------------------------------------- */
.moduleUebersichtModul {
    height: 200px;
    position: relative;
    overflow: hidden;
}

.moduleUebersichtPic {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: -1;
	transition: transform 500ms ease;
}

.moduleUebersichtModul:hover .moduleUebersichtPic {
    transform: scale(1.1);
}

.moduleUebersichtHeadline {
	background-color: var(--rapsgelb);
	color: var(--waldgruen);
	position: absolute;
	left: 0;
	bottom: var(--abstand_15);
	max-width: 100%;
	height: 60px;
	display: flex;
	align-items: center;
	line-height: 100%;
	padding: 0 var(--abstand_9);
}

.moduleUebersichtHeadlineEck {
	height: 100%;
	left: 100%;
	position: absolute;
	top: 0;
	color: var(--rapsgelb);
}
/* --- --- */
/* ---------------------------------------------------------------- */
/* -------------------- ZuletztAngesehenSlider -------------------- */
/* ---------------------------------------------------------------- */
#slider1SliderWrapper {
    position: relative;
    padding: 0 44px;
}

#slider1SliderWrapper .slider1Rad {
    display: none;
}

.slider1Slider {
    position: relative;
    overflow-x: hidden;
    overflow-y: visible;
}

.slider1ContentWrapper {
    display: flex;
    justify-content: left;
    flex-wrap: nowrap;
    position: relative;
    transition: left 300ms ease-in-out;
    cursor: grab;
}

.slider1Content {
    padding: var(--abstand_9);
    text-align: center;
    user-select: none;
}

.empfehlungenLinkPic {
    display: block;
    cursor: inherit;
}

.empfehlungenLinkText {
    text-decoration: none;
    color: inherit;
    font-family: inherit;
}

.empfehlungenLinkText:hover {
    color: inherit;
}

.empfehlungenEmpfehlungTransformWrapper {
    transition: transform 200ms ease-in-out;
}

.slider1Content:hover .empfehlungenEmpfehlungTransformWrapper {
    transform: scale(1.05);
}

.slider1Content img {
    height: 230px;
    object-fit: scale-down;
    object-position: center;
    pointer-events: none;
}


.slider1Next, .slider1Prev {
    position: absolute;
    width: 34px;
    height: 26px;
    top: calc(230px / 2);
    background-image: url('/bilder/arrRight.gif');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.slider1Next {
    right: 0;
}

.slider1Prev {
    left: 0;
    transform: rotate(180deg);
    z-index: 1;
}
/* --- --- */