﻿body { margin:0px; padding:0px; display:inline; font-family:'Open Sans',Arial; font-weight:400; line-height:1.6em; }
@media screen { body { background-color:#eee; font-size:12pt; color:#444; }  }
p { display:inline; }

div.Warenkorb 	    { background-color:#fff; width:380px; height:100%; position:absolute; top:-100%; right:0px; overflow-x:hidden; transition:0.3s; z-index:5; }
div.WarenkorbInnen 	{ background-color:#fff; width:380px; height:100%; position:absolute; top:0%; right:0px; }

div.Naviseite 	    { background-color:#fff; width:100%; height:100%; position:absolute; top:-100%; left:0%; overflow-x:hidden; transition:0.3s; z-index:6; }
div.TopZeile    { background-color:#fda; height:56px; }
div.NaviZeile   { background-color:#fb2; height:56px; }

.Brutal       { font-family: 'Roboto Slab',Arial; font-size:32pt;   font-weight:700; color:#930; display:inline; line-height:1em; }
.HeadSans       { font-family: 'Roboto Slab',Arial; font-size:25pt;   font-weight:700; color:#930; display:inline; line-height:1em; }
.SubSans        { font-family: 'Roboto Slab',Arial; font-size:20pt;   font-weight:700; color:#930; display:inline; line-height:1em; }
.Titel          { font-family: 'Roboto Slab',Arial; font-size:14pt;   font-weight:700; display:inline; line-height:1em; }
.Kategorie      { font-family: 'Roboto Slab',Arial; font-size:14pt;   font-weight:400; display:inline; line-height:1em; }
.Textklein      { font-family: 'Open Sans',Arial;   font-size:10pt;   font-weight:400; color:#666;  display:inline; }
.Textmini       { font-family: 'Open Sans',Arial;   font-size:8pt;    font-weight:400; color:#999;  display:inline; }
.Text           { font-family: 'Open Sans',Arial;   font-size:12pt;   font-weight:400; color:#333;  display:inline; }

a:link      { color:#930; text-decoration:none; }
a:visited   { color:#930; text-decoration:none; }
a:hover     { color:#600; text-decoration:none; }
a:active    { color:#600; text-decoration:none; }

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

.accordion-icon-color { color:#f00; background-color:#fb2; }
.StartSlide   { height: calc(30vh); min-height:200px; background-repeat: no-repeat; background-position: center center; background-size:cover }
.HeadSlide    { font-family: 'Roboto Slab',Arial; font-size:clamp(2.5em, 8vw, 6em); font-weight:900; color:#fff; text-shadow: 3px 3px 3px #000; display:inline; line-height:1em; }
.TextSlide    { font-family: 'Open Sans',Arial;   font-size:clamp(1.2em, 2vw, 3em); font-weight:700; color:#fff; text-shadow: 3px 3px 3px #000; display:inline; line-height:1em; }

.Toplogo		{ display:inline; width: auto; height:34px; }	
.Vollbild		{ display:inline; width: auto; height: auto; border-radius: 15%; }	
.Minibild		{ display:inline; max-width:150px; max-height:150px; width: auto; height: auto; border-radius: 15%; }	
.Microbild  	{ display:inline; max-width:100px; max-height:100px; width: auto; height: auto; border-radius: 15%; }	
.Nanobild		{ display:inline; max-width:50px; max-height:50px; width: auto; height: auto; border-radius: 15%; }	
.Iconbild		{ display:inline; max-width:35px; max-height:35px; width: auto; height: auto; border-radius: 15%; }	
.Muebild		{ display:inline; max-width:25px; max-height:25px; width: auto; height: auto; border-radius: 15%; }	
.TextIcon		{ display:inline; max-width:16px; max-height:16px; width: auto; height: auto; border-radius: 15%; }	
.Sterne     	{ display:inline; max-height:20px; }	

.BGLightColor		{ background-color:#e0e0e0; position: relative;}
.BGLightHover       { background-color:#fff; position: relative;}
.BGLightHover:hover { background-color:#e0e0e0; position: relative;}

.btn       { border:none; }

.btn-primary     		    { color:#333; background-color:#fda; border: 1px solid #fda; }
.btn-primary:link       { color:#333; background-color:#fda; border: 1px solid #fda; }
.btn-primary:visited    { color:#333; background-color:#fda; border: 1px solid #fda; }
.btn-primary:hover      { color:#333; background-color:#fb2; border: 1px solid #fb2; }
.btn-primary:active     { color:#333; background-color:#fb2; border: 1px solid #fb2; }

.btn-okay     		    { color:#fff; background-color:#6b6; border: 1px solid #6b6; }
.btn-okay:link        { color:#fff; background-color:#6b6; border: 1px solid #6b6; }
.btn-okay:visited     { color:#fff; background-color:#6b6; border: 1px solid #6b6; }
.btn-okay:hover       { color:#fff; background-color:#393; border: 1px solid #393; }
.btn-okay:active      { color:#fff; background-color:#393; border: 1px solid #393; }
.bg-okay              { color:#fff; background-color:#6b6; border: 1px solid #6b6; }

.btn-nope     		    { color:#fff; background-color:#f55; border: 1px solid #f55; }
.btn-nope:link        { color:#fff; background-color:#f55; border: 1px solid #f55; }
.btn-nope:visited     { color:#fff; background-color:#f55; border: 1px solid #f55; }
.btn-nope:hover       { color:#fff; background-color:#d00; border: 1px solid #d00; }
.btn-nope:active      { color:#fff; background-color:#d00; border: 1px solid #d00; }
.bg-nope     		      { color:#fff; background-color:#f55; border: 1px solid #f55; }

div.BigButton                	{ background-color:#fda; border: 1px solid #fda; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButton:hover          	{ background-color:#fb2; border: 1px solid #fb2; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonRot                { background-color:#faa; border: 1px solid #faa; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonRot:hover          { background-color:#f44; border: 1px solid #f44; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonGruen				{ background-color:#0f0; border: 1px solid #0f0; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonGruen:hover		{ background-color:#0b0; border: 1px solid #0b0; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonLight           	{ background-color:#eee; border: 1px solid #eee; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonLight:hover     	{ background-color:#fb2; border: 1px solid #fb2; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonLightInaktiv    	{ background-color:#fff; border: 5px solid #eee; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonWeiss            	{ background-color:#fff; border: 1px solid #fff; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonWeiss:hover		{ background-color:#fb2; border: 1px solid #fb2; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonLightWeiss			{ background-color:#fff; border: 1px solid #fff; border-radius:0.5rem; transition:0.3s; position:relative; }
div.BigButtonLightWeiss:hover	{ background-color:#eee; border: 1px solid #eee; border-radius:0.5rem; transition:0.3s; position:relative; }

div.Artikelnummer   { position:relative; background-color:#fff; border: 1px solid #fff; width:40px; height:40px; padding:8px; border-radius:3rem; }

.Button_Paypal        { opacity:80%; }
.Button_Paypal:hover  { opacity:100%; }

.GruenBlinker   { animation: Blinker 1.1s linear infinite; background-color:#afa; }
.WarnBlinker    { animation: Blinker 1.2s linear infinite; background-color:#fb2; }
@keyframes Blinker { 50% { background-color:#fff; } }

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


.Schatten       { box-shadow:#888 0px 12px 12px -4px; }
.SchattenLight  { box-shadow:#bbb 0px 8px 10px -3px; }
.SchattenUnten  { box-shadow:#999 0px 7px 7px 0px; }

.modal-backdrop { background-color:#fda; opacity:90% !important; }

img.IconHover       { opacity:75%; }
img.IconHover:hover { opacity:100%; filter: contrast(200%) saturate(0%); }

div.Content { background-color:#fff; margin:0px; border:1px solid #fff; border-radius:0.5rem; }
div.Footer      { background-color:#fff; margin:0px; padding:80px 0px; }

.KontentBreit	{ display: block; }
.KontentSchmal	{ display: none; }
@media screen and (max-width: 991px) 
  {
	.KontentBreit	{ display: none; }
	.KontentSchmal	{ display: inline; }
	}

/* roboto-slab-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: 'Roboto Slab';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-slab-v34-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-slab-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: 'Roboto Slab';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/roboto-slab-v33-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-slab-900 - 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: 'Roboto Slab';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/roboto-slab-v33-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-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: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/open-sans-v36-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-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: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v36-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-600 - 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: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/open-sans-v36-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-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: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/open-sans-v36-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-800 - 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: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/open-sans-v36-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}