body { background-color:#fff; color:#333; margin:0px; padding:0px; font-family:'Ubuntu',Arial; font-size:clamp(13pt, 1.5vw, 15pt); font-weight:400; display:inline; }
@media print { body { font-size:8pt; } }
p { display:inline; }
 
.Brutal 		  { font-family: 'Ubuntu',Arial; font-size:2em; font-weight:900; display:inline; text-transform:none; }
.HeadSans 		{ font-family: 'Ubuntu',Arial; font-size:1.8em; font-weight:700; display:inline; text-transform:none; }
.SubSans 		  { font-family: 'Ubuntu',Arial; font-size:1.4em; font-weight:700; display:inline; text-transform:none; }

.TextGrau       { color:#ccc; }
.Textklein      { display:inline; font-size:0.9em; color:#666; }
.Textmini       { display:inline; font-size:0.8em; color:#999; }
.TextFooter     { display:inline; font-size:0.9em; }
.TextDurchRot   { display:inline; color:#f00; text-decoration:line-through; }
strong          { font-weight: 700; }

a:link				{ color: #952; text-decoration:none; }
a:visited     { color: #952; text-decoration:none; }
a:hover				{ color: #000; text-decoration:none; }
a:active			{ color: #000; text-decoration:none; }

a.Rot:link      	{ color:#f00;font-size:120%; text-decoration:none; }
a.Rot:visited 		{ color:#f00;font-size:120%; }
a.Rot:hover 		{ color:#b00;font-size:120%; }
a.Rot:active 		{ color:#f00;font-size:120%; }

.btn-primary     		    { color:#66a; background-color:#eef; border: 1px solid #eef; }
.btn-primary:link       	{ color:#66a; background-color:#eef; border: 1px solid #eef; }
.btn-primary:visited    	{ color:#66a; background-color:#eef; border: 1px solid #eef; }
.btn-primary:hover      	{ color:#000; background-color:#ddf; border: 1px solid #ddf; }
.btn-primary:active     	{ color:#000; background-color:#ddf; border: 1px solid #ddf; }

.btn-secondary     		    { color:#449; background-color:#ccc; border: 1px solid #ccc; }
.btn-secondary:link       	{ color:#449; background-color:#ccc; border: 1px solid #ccc; }
.btn-secondary:visited    	{ color:#449; background-color:#ccc; border: 1px solid #ccc; }
.btn-secondary:hover      	{ color:#008; background-color:#eee; border: 1px solid #eee; }
.btn-secondary:active     	{ color:#449; background-color:#ccc; border: 1px solid #ccc; }


a.ButtonAktiv:link      	{ color:#ddd; background-color:#66a; border: 1px solid #66a; border-radius:.3rem; transition:0.3s; text-decoration:none; margin:0px 1px; padding:6px 14px; line-height:2.4; }
a.ButtonAktiv:visited   	{ color:#ddd; background-color:#66a; border: 1px solid #66a; border-radius:.3rem; transition:0.3s; }
a.ButtonAktiv:hover     	{ color:#fff; background-color:#66a; border: 1px solid #66a; border-radius:.3rem; transition:0.3s; }
a.ButtonAktiv:active    	{ color:#ddd; background-color:#66a; border: 1px solid #66a; border-radius:.3rem; transition:0.3s; }

a.ButtonInaktiv:link      	{ color:#999; background-color:#fff; border: 1px solid #999; border-radius:.3rem; transition:0.3s; text-decoration:none; margin:0px 1px; padding:6px 14px; line-height:2.4; }
a.ButtonInaktiv:visited   	{ color:#999; background-color:#fff; border: 1px solid #999; border-radius:.3rem; transition:0.3s; }
a.ButtonInaktiv:hover     	{ color:#999; background-color:#fff; border: 1px solid #999; border-radius:.3rem; transition:0.3s; }
a.ButtonInaktiv:active    	{ color:#999; background-color:#fff; border: 1px solid #999; border-radius:.3rem; transition:0.3s; }

div.BigButton             	{ color:#66a; background-color:#fec; border: 1px solid #fec; border-radius:0.4rem; cursor:pointer; position:relative; transition:0.3s; }
div.BigButton:hover       	{ color:#333; background-color:#fdb; border: 1px solid #fdb; border-radius:0.4rem; cursor:pointer; position:relative; transition:0.3s; }
div.BigButtonWeiss        	{ color:#333; background-color:#fff; border: 1px solid #fff; border-radius:0.4rem; cursor:pointer; position:relative; }
div.BigButtonWeiss:hover  	{ color:#333; background-color:#fdb; border: 1px solid #fdb; border-radius:0.4rem; cursor:pointer; position:relative; }

.Pfad 			    { font-size:14px; color:#777; display:inline; }
a.Pfad:link 	  	{ color: #99a; text-decoration: none;}
a.Pfad:visited 		{ color: #99a; text-decoration: none;}
a.Pfad:hover 	  	{ color: #000; text-decoration: underline;}
a.Pfad:active 		{ color: #000; text-decoration: none;}

input[type="checkbox"] 	{ width:2em; height:2em; border: 2px solid #ddf; }

.Artikel_Start_Banner           { opacity: 1; }
.Artikel_Start_Banner:hover     { opacity: 0.8; } 
.Artikelfeld	{ background-color:#fff; border: 1px solid #ddd; border-radius:.5rem; box-shadow: #ddd 3px 3px 8px; width:280px; margin:auto; }

/* jquery autocomplete */
.ui-helper-hidden 				{ display: none; }
.ui-autocomplete 				{ position: absolute; top: 0; left: 0; cursor: default;
    max-height: 300px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
  }


.b_Link           { opacity: 0.4;  width:26px; padding:3px; margin-top:3px; filter: invert(7%) sepia(93%) saturate(7344%) hue-rotate(248deg) brightness(110%) contrast(145%); }
.b_Link:hover     { opacity: 1; }
.b_Rot            { opacity: 0.4;  width:26px; padding:3px; margin-top:3px; filter: invert(16%) sepia(89%) saturate(7320%) hue-rotate(356deg) brightness(114%) contrast(127%); }
.b_Rot:hover      { opacity: 1; }

.b_delete         { content: url('/gfx/Icons/b_delete.png'); }
.b_hoch           { content: url('/gfx/Icons/b_hoch.png'); }
.b_Mail           { content: url('/gfx/Icons/b_Mail.png'); }
.b_Warenkorb      { content: url('/gfx/Icons/b_Warenkorb.png'); }


.ui-menu 						{ list-style: none; padding: 0px; margin: 0; display: block; outline: 0; }
.ui-menu .ui-menu-item-wrapper 	{ position: relative; padding: 10px 3px 6px 10px; }
.ui-widget 						{ font-size: 20; }
.ui-widget .ui-widget 			{ font-size: 20; }
.ui-widget input 				{ font-size: 20; }
.ui-widget.ui-widget-content 	{ border: 1px solid #c5c5c5; background:#fff; }
.ui-widget-content a 			{ color: #333333;  }
.ui-widget-header a 			{ color: #333333; }
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover { background: #364; color: #ffffff; }

.Topnavi 		{ font-size:16px; font-weight: 600; color:#333; }
.Topnavi:hover 	{ color:#000; }
.CookieDialog
  { 
  position: fixed;
  width: 100%;
  height: auto;
  bottom: 0px;
  left: 0px;
  margin:auto;
  padding:35px 10px 30px 10px;
  background-color: rgba(255,255,180,1);
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  }




.Rot 			{ color:#f00; display:inline; }
a.Rot:link 		{ color:#f00; text-decoration:none; display:inline; }
a.Rot:visited 	{ color:#f00; text-decoration:none; display:inline; }
a.Rot:hover 	{ color:#000; text-decoration:none; display:inline; }
a.Rot:active 	{ color:#000; text-decoration:none; display:inline; }

a.ButtonGrau:link 		{ color:#fff; background-color:#aaa; border: 1px solid #aaa; border-radius:.2rem; transition:0.3s; text-decoration:none; padding:6px 14px; }
a.ButtonGrau:visited 	{ color:#fff; background-color:#aaa; border: 1px solid #aaa; border-radius:.2rem; transition:0.3s; }
a.ButtonGrau:hover     	{ color:#fff; background-color:#333; border: 1px solid #333; border-radius:.2rem; transition:0.3s; }
a.ButtonGrau:active 	{ color:#fff; background-color:#aaa; border: 1px solid #333; border-radius:.2rem; transition:0.3s; }

.ButtonNormal 		{ background-color:#fff; border-color:#777; border-width:1px; border-radius:.2rem; font-size:14px; padding:5px 13px 5px 13px; }
.ButtonNormal:hover { background-color:#777;  color:#ffffff; }

.ButtonTopNavi			{ background-color:#a9e3b8; color:#666; border-radius:.2rem; font-size:14px; padding:5px 13px 5px 13px; text-decoration: none; position:relative;  }
.ButtonTopNavi:hover 	{ background-color:#a9e3b8; color:#000; border-radius:.2rem; font-size:14px; padding:5px 13px 5px 13px; text-decoration: none;p osition:relative;  }

.NaviFont 	{ font-size:20px; font-weight: 700; color:#fff; display:inline; }


a.Footer:link 		{ color: #dbb783; text-decoration: none;}
a.Footer:visited 	{ color: #dbb783; text-decoration: none;}
a.Footer:hover 		{ color: #fff; text-decoration: none;}
a.Footer:active 	{ color: #fff; text-decoration: none;}

a.Navi:link 	{ vertical-align: middle; color: #fff; text-decoration: none;}
a.Navi:visited	{ vertical-align: middle; color: #fff; text-decoration: none;}
a.Navi:hover 	{ vertical-align: middle; color: #a1dbaf; text-decoration: none;}
a.Navi:active 	{ vertical-align: middle; color: #a1dbaf; text-decoration: none;}

.Logo_Top		{ width:280px; }
.Navi_Farbe	{ background-color: #c4e7bf; width:100%;}
.Filterfeld	{ width:100%; padding:12px; Background-color:#f8f9fb; border-radius:5px; }
.Artikelfeld	{ background-color:#fff; border: 1px solid #eee; border-radius:.5rem; width:280px; margin:auto; box-shadow: #ddd 3px 3px 8px; }


.BGTopseller		{ background-color:#fb0; color:#fff;}
.BGEmpfehlung		{ background-color:#abf; color:#fff;}

.AdminTR		{ min-height: 35px; height: 35px; }

.Seitenumbruch	{ page-break-after:always; }

.IconMini		{ display:inline; width:22px; margin: 0px;}

.Produkt_Uebersicht			{ padding: 5px; text-align:center; border-radius:10px; margin: 0px 0px 20px 0px;}
.Produkt_Uebersicht:hover	{ Background-color:#f8f9fb; }

.ZVMethoden					{ padding: 14px;}
.ZVMethoden:hover			{ Background-color:#eee; }

.Spalte_Normal		{ margin:auto; max-width:968px; }
.Spalte_Schmal		{ margin:auto; max-width:800px; }

.wrap-modal-slider {
  padding: 0 30px;
  opacity: 0;
  transition: all 0.3s;
}

.wrap-modal-slider.open {
  opacity: 1;
}

.slick-prev:before, .slick-next:before {
  color: red;
}

.ContLight		{ Background-color:#eee; }
.ContLight:hover	{ Background-color:#e0e0e0; }
 
.Container_Bild_Uebersicht 	{ display:block; width:250px; height:250px; padding:0px; margin-right:auto; margin-left:auto; text-align:center; }
img.Uebersicht 			{ display:block; max-width:250px; max-height:250px; width: auto; height: auto; margin-right:auto; margin-left:auto; text-align:center; }	

.Bundles { Background-color:#ddd; padding: 15px 0px 50px 0px; text-align:center; border-radius: 4px; }

.Bild_Artikel	{ width:auto; height:auto; max-width:270px; max-height:270px; display:inline;  }	
.Artikel_Bildcontainer	{ width:230px; height:230px; display:inline; }	
.Bild_Detail	{ width:auto; height:auto; max-width:400px; max-height:400px; display:inline;  }	

.Startfeld		{ padding: 10px; Background-color:#f9f9f9; border-radius:8px;  }
.Startfeld:hover	{ Background-color:#eee; }
	


/* DickBild-Overlay */
.overlay 			{ height: 100%; width:0; position:fixed;  z-index:5; top:0; left:0; background-color:#fff; overflow-x:hidden; transition:0.5s; }
.overlay-content	{ position:relative; top:0px; max-width:100%; text-align: center; margin-top: 20px; }
.overlay a 		{ padding: 8px; text-decoration: none; font-size: 36px; color: #999; display: block; transition: 0.2s; }
.overlay .closebtn	{ position:absolute; top:0px; right:15px; font-size:60px; z-index:2; }
.overlay .linksbtn	{ position:absolute; top:200px; left:25px;  font-size:80px; z-index:2; }
.overlay .rechtsbtn	{ position:absolute; top:200px; right:25px; font-size:80px; z-index:2; }
.overlay a:hover, .overlay a:focus 	{ color: #000; }
@media screen and (max-height: 450px) 
	{
  	.overlay a {font-size: 20px}
  	.overlay .closebtn { font-size: 40px; top: 15px; right: 35px; }
	}

	

	
	
	
/* Swiper Bilderaussicht */
.swiper-container { width:100%; height:100%; }
.swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #fff;

	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	}
	
/* Navi5 */
hr.N5 { width:96%; border-top: 1px solid #bbb; margin:auto; padding:0px; }
hr.N1 { width:96%; border-top: 1px solid #333; margin:auto; padding:0px; max-width:1400px; }





.Klickbar	{ cursor:pointer; }

.Zeilentrenner  { color:#aaa; margin:0px; padding:0px; }



/* ubuntu-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/ubuntu-v20-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/ubuntu-v20-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* ubuntu-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/ubuntu-v20-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/ubuntu-v20-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* ubuntu-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/ubuntu-v20-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/ubuntu-v20-latin-500.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* ubuntu-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/ubuntu-v20-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/ubuntu-v20-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}