@charset "utf-8";
/*@import url('https://fonts.googleapis.com/css?family=Roboto:400,700');*/
*{ padding:0; margin:0;}
p, ul { margin-bottom:1em;}
.container p, .container ul{ margin-bottom:1em;}
.container ul{ padding-left:1em;}
ul.noListstyle,.container ul.noListstyle{ list-style:none; padding-left:0;}
img{ border:none;}
img a{ border:none;}
a { text-decoration:none; color:#9E0056;}
a:focus, select:focus {  outline: none;}
html{ height: 100vh;}
body {
/*	//font-family: 'Roboto', Arial,sans-serif;*/
	font-family: Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#000;
	 min-height:100vh;
	 width: 100%;

} 
.clearfloat{clear:both;      display: block;    height: 0;}
.wrapper {    display: flex;    flex-direction: column;    min-height: 100vh;    background-color: #fff;}
.wrapper2 {    flex: 1 0 auto;background-color: #fff;}
.green{ color:#008683;}
.red{ color:#FF0000;}
.pointer{ cursor:pointer;}
h1{font-size:2em; font-weight: normal;  margin-bottom:15px; }
h2{ font-size:1.4em;font-weight: normal; margin-bottom:15px; } 
h3{font-size: 1.1em;font-weight: normal;margin-bottom: 3px;}
.farbStage{ background-color:#EDEDED;padding: 2px 0;margin: 0px 0px 20px 0px;}
.loader{text-align: center; margin: 40px 20px;}
.loaderPrepend{position: absolute;left: -19px; font-size: 2em; background-color: white; width: 100%; height: 100%; opacity: 0.5;}
.logoSuchStage {  align-items: center;}
.sucheStage {    flex: 1 0 auto;text-align: right;}
.sucheStage form {    display: flex;}
#suche{padding: 5px 0 5px 5px;
border: solid 1px #E5E5E5;
width: 70%;
background-color:#F3F3F3;}
.contentHeadStage {    z-index: 1;}
.preisZusatztext{ font-size:0.7em;     color: #999; }
.preisZusatztext span{ font-weight:bold;cursor:pointer;}
/*  **** Buttons festlegen *****  */
.bigButText{font-size: 1.2em;text-align: center;}
.ButFullSize{ padding:10px; width:100%; cursor:pointer;border: 1px solid #ccc;box-sizing: border-box;}
a.ButFullSize{ display:block;}
.suchbutton {background-color: #9E0056;
border: 1px solid #666;
height: 29px;
width: 35px;
margin-right: 18px;
color: #fff;
cursor:pointer;}
.suchbutton:hover{background-color: #8DB863; border:none;}
.suchbutton:before{  font-family: "Font Awesome 5 Pro";   content: "\f002"; font-weight:400;}

.cartButton{ cursor:pointer;position: relative;}
.cartButton:before{  font-family: "Font Awesome 5 Pro";   content: "\f07a"; font-weight:300;}
.menuButton, .cartButton , .menuButton, .merkzButton {    width: 100%;   height: 100%;   background-color: #9E0056;    color: #fff;    border: none;font-size: 1.4em; cursor:pointer;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#9e0056+0,c94288+50,9e0056+100 */
/*background: #9e0056;  
background: -moz-linear-gradient(top, #9e0056 0%, #c94288 50%, #9e0056 100%);   
background: -webkit-linear-gradient(top, #9e0056 0%,#c94288 50%,#9e0056 100%); 
background: linear-gradient(to bottom, #9e0056 0%,#c94288 50%,#9e0056 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9e0056', endColorstr='#9e0056',GradientType=0 ); /* IE6-9 */}
.cartbuttonShowText{ display:none;    color: #000;}
.cartButton:hover,.menuButton:hover { background-color: #8DB863; }

.cartbutton { width:100%; padding:10px; margin:10px 0 5px 0; border:none; color:#fff; cursor:pointer; background-color:#9E0056;}
.cartbutton:hover, .merkzButton:hover { background-color:#8EB863; }
.cartbutton:after { font-family: "Font Awesome 5 Pro"; content: "\f07a"; margin-left:10px;font-size: 1.2em;font-weight: 300;}

.merkzButton:before { font-family: "Font Awesome 5 Pro"; content: "\f46d"; margin-right: 5px;font-size: 1.2em;font-weight: 300;}

.menuButton:before{  font-family: "Font Awesome 5 Pro";   content: "\f0c9"; font-weight:300;}
.menuButton.is-active:before {  font-family: "Font Awesome 5 Pro";   content: "\f00d"; font-weight:300;}
.greenButton{ background-color:#346663; color:#FFFFFF; border:none!important; padding:10px 40px!important; cursor:pointer;border-radius: 2.5px;-webkit-transition: all 0.5s ease;    -moz-transition: all 0.5s ease;    -o-transition: all 0.5s ease;    -ms-transition: all 0.5s ease;    transition: all 0.5s ease;}
.greenButton:hover{ background-color:#8DB863; }
.bigButton{ width: 100%;margin: 10px 0;box-sizing: border-box;}
.beigeButton,.rememberMebutton,.bonusButton {   
 background-color: #F5F5DC;
/*background-color: #F6E5EA; */
   width: 100%;    padding: 5px;    margin-bottom: 3px;    border: solid 1px #ccc;    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
	cursor:pointer;
	color: #000;
}
.buttonTelShop {    }
.bonusButton { color:#fff;  }
.beigeButton:hover,.rememberMebutton:hover,.WgUnternaviSelected,.bonusButton:hover{ background-color:#8DB863!important;; color:#fff;}
.beigeButton i {    margin-left: 10px;}
.backbutton:before{  font-family: "Font Awesome 5 Pro";   content: "\f053"; font-weight:900;margin-right: 5px;}
.backbutton{ background-color:#9E0056!important;}

.buttonColor{
background-color: #9E0056;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}

.WKbutton{
background-color: #A2004D;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}

.buttonColorOK, .buttonColorOK:hover, .WKbutton:hover{
background-color: #61e216 !important;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}
.buttonColorFail, .buttonColorFail:hover{
background-color: #e51212!important;;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}
.buttonColorWarning, .buttonColorWarning:hover{
background-color: #FFCC00!important;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}

/*  **** ENDE Buttons festlegen *****  */
.flexDirRow{ flex-direction: row !important;}
.flexDirCol{flex-direction: column!important;}
.smalfont, .text_klein ,.smalTxt{font-size:0.7em; }
.xxsTxt {font-size:0.6em; }

.textCenter{ text-align:center;}
.textRight{ text-align:right;}
.noWrap{white-space: nowrap;}
.alignVert {    display: flex;    justify-content: center;    flex-direction: column;}

.container,.pagewrapper {
    margin: 0 auto;
    max-width: 1024px;
    padding: 5px 20px;
    position: relative;  
}
.smalContainer {    max-width: 600px;    margin: 0 auto;}
.flexbox{ display:flex; flex-wrap: wrap;justify-content: space-between; }
.flexboxItem { margin-right:20px; float:left;  }

.halbFlex{   width: calc(50% - 10px);float:left;    }	
.einsDreiFlex{   width: calc(31% - 10px); display:flex; flex-wrap:wrap;  }
.zweiDreiFlex{   width: calc(70% - 10px);  }
.einsVierFlex{   width: calc(25% - 20px); z-index: 1;}
.dreiVierFlex{   width: 75% ; display:flex; flex-wrap:wrap;  align-items: flex-start;}
.flexColum{flex-direction: column;}
.zweispaltenTxt{ width: 100%;  column-count: 2;}

.handyShow{ display:none !important;}
.DesktopShow{ display:block !important;}

.headerStage{
	 background-color:#FFFFFF;
	 z-index: 214748;
	 position:relative;
	 border-bottom: 1px solid #fff;}
	 
.headerContainer{margin: 0 auto;
    max-width: 1024px;
	padding:5px 0;
	}	
#headernavi-sticky-wrapper {
    z-index: 15;
}
.headerBarr {
    height: 34px;
    width: 100%;
    background-color: #000;
    position: absolute;
    bottom: 0px;
}	
.topInfoBarr {    color:#666; font-size:0.9em;}
.topInfoStage{display:flex;	justify-content: flex-end;}	
.topInfoCont{  margin-right:20px;padding:5px 0 ;}
.topInfoCont a{ color:#666 !important;font-weight:normal !important;}
#header{ z-index: 21474836;margin-bottom: 10px;font-size: 15px; }	
.logoStage{background-image:url(../img/kosmetikkaufhaus_Logo.jpg); background-repeat:no-repeat; width:100%; max-width:340px;  background-size: 100% auto ;   cursor:pointer;min-height: 87px;margin-bottom: 10px; margin-left: 20px; margin-right: 20px; margin-top: 5px }
#headernavi {    background-color: #9E0056;border-bottom: 1px solid #fff;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#9e0056+0,c94288+50,9e0056+100 
background: #9e0056;  
background: -moz-linear-gradient(top, #9e0056 0%, #c94288 50%, #9e0056 100%);  
background: -webkit-linear-gradient(top, #9e0056 0%,#c94288 50%,#9e0056 100%);  
background: linear-gradient(to bottom, #9e0056 0%,#c94288 50%,#9e0056 100%);  /
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9e0056', endColorstr='#9e0056',GradientType=0 ); /* IE6-9 */}


/* Promo Artikel Startseite*/

.promoArtStage {    width: 100%;    -webkit-order: 3;    order: 3;	    margin-bottom: 10px;}
 
.owlPromoArt{ display: flex;flex-wrap: wrap;}
.PromoHerstName{font-size: 0.8em; }
.PromoArtName{flex: 1 0 auto;}
.PromoArt_preis{ font-weight: bold;}
.PromoArtPic img {    width: 100%;}
.PromoArtPic { position:relative;}
.PromoArtPic .fa-certificate { font-size: 5em; color: #8DB863;}
.PromoArtPic .fa-layers{position: absolute; right: 45px; top: -9px;}
.PromoArtPic .fa-layers-text {position: absolute;top: 20px;left: 15px;font-size: 1.2em;font-weight: 900;-moz-transform: rotate(8deg);-webkit-transform: rotate(8deg);-o-transform: rotate(8deg);-ms-transform: rotate(8deg);transform: rotate(8deg);}
.promoArtSub {color: #777;text-align: center;}
.PromoArtBox {     box-sizing: border-box;    padding: 5px;     text-align: center;    margin-bottom: 0px;    margin-right: 5px;    margin-left: 5px;    cursor: pointer;    display: flex;     width: 19%;    align-content: stretch;    align-items: stretch;    flex-flow: column wrap;    justify-content: space-between;	-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.PromoArtBox:hover {/*cursor:url(../img/lupe.png), pointer;*/}
.prodTeaserVorschau {    justify-content: left;}
.PreisSieSparen {    width: 100%;}
.linkstagePromo {    position: relative;    width: 100%;    height: 100%;    display: flex;    flex-direction: column;}
/* ENDE Promo Artikel Startseite */
.RoundIconsBox {    flex: 1 0 auto;    display: flex;    flex-direction: column;       text-align: center;    width: calc(23% - 10px) !important;    padding: 0 10px;font-size: 1.1em;}
.RoundIcon{border: 2px solid #fff;border-radius: 50%;height: 72px;width: 72px;margin: 0 auto; margin-bottom: 20px; padding: 10px; font-size: 3em; display: flex; justify-content: center; flex-direction: column; color:#aeaeae;color: #fff;
background: #9E0056;-webkit-box-shadow: inset 1px 1px 10px 0px rgba(0,0,0,0.75);
-moz-box-shadow: inset 1px 1px 10px 0px rgba(0,0,0,0.75);
box-shadow: inset 1px 1px 10px 0px rgba(0,0,0,0.75);}
.RoundIconsBox h3 {    font-weight: bold;color: #9e0056;}
.svg-inline--fa{align-self: center;}
.SeiteSmalBox {    font-size: 0.9em;}
.SeiteSmalBox h3 { font-weight:bold;}
.boxIcons{ font-weight: 300;margin-right: 5px;background-color: #9E0056;color: #fff;padding: 5px;}

/* footer */
.FooterBox{ flex-direction:column;}
.footKontUl { margin-left: 7px !important;}
.footKontUl li{ margin-bottom:5px;}
.footKontUl i {    color: #000;}
.FooterHead {    font-weight: bold;    margin-bottom: 10px;    padding-bottom: 2px;    border-bottom: 1px solid #ccc;}
.FooterBoxKundenservice a{ padding:10px 0; border-bottom: dashed 1px #ccc;padding-left: 5px;}
.footertext {    font-size: 0.7em;    margin-top: 15px;}
.footerStage {    margin: 20px 0 240px  0 ;    background-color: #fff;    padding-top: 20px;    color: #000; }
.footerStage a{ color: #000;}
.zahlartenBox { width: 100%;  display: flex;flex-wrap: wrap;}
.zahlart img {    width: 100%;max-width: 74px;}
/* ENDE footer */

/* shopCartcontent */
.DirektBestellFeld{ display:flex;align-items: center; margin-bottom:3px !important;}
.CartToggleStage{ margin-bottom:15px;}
.CartOrderDirekt{ margin-top:20px;}
.CartOrderDirektHead{ font-size:1.2em; text-align:center;}
.CartOrderDirektTxt{ font-size:0.8em;text-align:center;}
.CartOrderInputStage input {    flex: 1 0 auto;    padding: 5px;    margin: 5px;	box-sizing: border-box;}
#direktCartMenge{    max-width: 50px;    padding:5px;    margin-right: 5px;}
#direktCart{ margin-left: 5px;box-sizing: border-box;}
.CartOrderInputStage.flexbox {    flex-wrap: nowrap;}
.CartOrderDirekt {    margin-top: 20px;    border: 1px solid #ddd;    background-color: #fff;    padding: 10px;}
.CartContentKorbLeer{ padding:10px; text-align:center;color: #b02e2e;}
.CartContentArt {   border-bottom: 1px dotted #ccc;border-top: 1px dotted #ccc;clear: both;margin-bottom: 5px;padding: 5px;display: flex;background-color: #fff;flex-direction: column;}
.CartContentArtBild {    width: 50px;    margin-right: 10px;    float: left;text-align: center;}
.CartContentArtText { flex:1 1 auto;display: flex;flex-direction: column; }
.CartContentKorbSumme {    text-align: right;     font-weight: bold;    margin-bottom: 15px;}
.CartContentZusatztext {    background-color: #FFC;    font-size: 10px;    padding: 5px;}
.CartContentDelArt {padding: 10px;text-align: right;font-size: 0.7em;display: block;box-sizing: border-box;background-color: #F5F5DC;margin-bottom: 10px;}
.CartContentVersand {    text-align: center;    font-size: 0.7em;    margin-bottom: 10px;}
.CartContentArtTextPreis { font-weight: bold;}
.CartContentArtPreis {    flex: 1;}
.CartContentSummColPreis {    width: 95px;    text-align: right;}
.shopCartinhaltTop, .merkzinhaltTop  {    font-size: 0.5em; margin: 0 !important;}
.flexboxCartContentArt{ display:flex;font-size: 0.9em;flex-wrap: wrap;}
.CartBildTxt {    flex-wrap: wrap;}
.BestRowColor{ font-weight: bold;}
input:read-only{ border:none;}
input:-moz-read-only { border:none;}

.DirektBestellStage {    background-color: #fff;    padding: 6px;}
 
.CartContentArtMenge {margin: 0 5px 0 60px;}
.CartContentArtMenge input {    width: 30px;padding: 2px;text-align: right;margin-right: 5px;}
.CartContentArtSumme {    width: 85px;    font-weight: bold;    text-align: right;}
.CartContentArtNormP{ display:block;font-size: 0.8em;}
.CartContentBildText{ width:100%; display:flex;}
.CartContentArtPreis {    flex: 1;    margin-right: 5px;    text-align: left;padding-top: 3px;}
.CartGeschenkFlex{ margin:10px 0;}
.CartContentSummRow {    display: flex;     justify-content: space-between;font-size: 0.9em;margin-bottom: 8px;}
.CartMehrwertsteuer {    background-color: #fff;    padding: 5px;}
.SummRowBetrag{ font-weight:bold;}
.CartSumStage {    background-color: #fff;    padding: 5px;    margin-bottom: 10px;    border-top: 2px dotted #ccc;}
.CartContentInfoStage {    padding: 5px;    background-color: #f6f6dd;    font-size: 0.9em; margin-bottom: 15px;}
.CartContentInfoBox {    margin: 5px 0;    padding: 5px 0;    border-bottom: 1px dotted #ccc;}
.CartContentInfoBox:last-child {    border-bottom: none;}
#zumWarenkorb ,#zumWarenkorb2{    color: #fff;    text-align: center;    font-weight: bold;display: block;font-size: 2em;text-shadow: 2px 2px 5px #040e05;}
#zumWarenkorbDissable{      text-align: center;    font-weight: bold;display: block;}
.amazonbuttonStage {    text-align: center;background: white;}
#payWithAmazonDiv {    margin-top: 5px;        display: flex;    justify-content: center;    padding: 5px;}
#payWithAmazonDiv img{ border:#fff solid 1px;}
.CartHerstBeigabe{}
.BeigabeBox {    background-color: #f0fffa;}
.CartHerstBeigabe .CartContentArtSumme {    width: initial !important;}
.CartContentArtBeigabe{ font-weight:bold;}
.lieferAendern {    display: block;    font-size: 0.8em;    color: #fea400;}
.liefernachStage{ display:flex;justify-content: space-between;padding: 20px 0 ;flex-wrap: wrap;}
.liefernachStageTxt{}
.liefernachStageSel{width: 100%;}
#versand_id {    padding: 5px;    width: 100%;}
.mm-menu { color:#000 !important;    background: #fff !important;}
.DirektBestellFeld input {    border: 2px solid #ddd;    height: 35px;}

.CartContentInfoVersand{}
.CartContentInfoVersand {    background-color: #eaf5fe;;    padding: 5px;    margin-bottom: 10px;    font-size: 0.8em;}
 .versandkostenList {   margin-left: 20px !important;}

 .CartGeschenkFlex i{ margin-right:5px;}
.CartContentGiftCheck {    padding-left: 5px;}
#cardtext{margin-top: 10px; display: none; font-size: 0.9em; text-align: center; margin-bottom: 15px;}
.CardTextStage { margin-top: 15px;}
.CardTextCheckboxStage{padding: 5px;    padding-left: 5px;background: #ffdba4;margin-bottom: 15px;padding-left: 11px;}
.showKart{ display:block !important;}
#grusstext {    width: 100%; box-sizing: border-box;}
.CartResTXT{ padding:5px; display:block; margin:5px 0; }
.CartRabattText{ margin: 5px 0;;color: #029302;}
#bonusInput,#gut_code1 {margin-bottom: 0px !important;}
.bonuscodeStage ,.DirektBestellStage{    margin: 5px 0 0px 0; }
.bonuscodeTxt ,.bonuscodeFeld{  margin-bottom: 2px !important;}

.delBonusCol{ background-color:#CC0000;}
/* Ende shopCartcontent */

/* VR PAY*/

.wpwl-form {
    max-width: 93% !important;
}
#vrSubmit {    display: none;}
/*.wpwl-button{ display:none !important;}
#wpwl-registrations {  order: 4;}*/
.wpwl-button-pay { display:none !important;}

.OldZahlartButtonStage{ text-align:right;}
.showOldZahlartButton{    color: #fff;    background-color: #5cb85c;    padding: 10px;    margin: 10px; transition:all; cursor:pointer;}
.showOldZahlartButton:hover{background-color: #449d44;}
.subButtonStage2 {    display: flex;    justify-content: right;}
#vrSubmit2 {    margin: 20px;}

div.wpwl-form.wpwl-form-registrations.wpwl-clearfix div.wpwl-wrapper.wpwl-wrapper-submit button.wpwl-button.wpwl-button-pay{ display:block !important;}
div.wpwl-wrapper.wpwl-wrapper-cvv{ min-width:65px!important;}
.wpwl-control-cvv{ min-width:65px !important;}

/* ENDE VR PAY*/

/*  Hover.css (http://ianlunn.github.io/Hover/) */
/* Sweep To Right */
/* Icon Wobble Horizontal */
@-webkit-keyframes hvr-icon-wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  33.3% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes hvr-icon-wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  33.3% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.hvr-icon-wobble-horizontal {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.hvr-icon-wobble-horizontal .hvr-icon {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.hvr-icon-wobble-horizontal:hover .hvr-icon, .hvr-icon-wobble-horizontal:focus .hvr-icon, .hvr-icon-wobble-horizontal:active .hvr-icon {
  -webkit-animation-name: hvr-icon-wobble-horizontal;
  animation-name: hvr-icon-wobble-horizontal;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
/* Bounce In */
.hvr-bounce-in {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
 
}
.hvr-bounce-in:hover, .hvr-bounce-in:focus, .hvr-bounce-in:active {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
  -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
  z-index:999;
   box-shadow: 0 0 8px #666;
 }
.bounce-in-whiteBack{  background-color:#fff;}
/* ENDE Hover.css (http://ianlunn.github.io/Hover/) */

 /* hamburger */
 .hamburger{padding:15px;display:inline-block;cursor:pointer;transition-property:opacity,filter;transition-duration:.15s;transition-timing-function:linear;font:inherit;color:inherit;text-transform:none;background-color:transparent;border:0;margin:0;overflow:visible}.hamburger:hover{opacity:.7}.hamburger-box{width:40px;height:24px;display:inline-block;position:relative}.hamburger-inner{display:block;top:50%;margin-top:-2px}.hamburger-inner,.hamburger-inner::after,.hamburger-inner::before{width:40px;height:4px;background-color:#fff;border-radius:4px;position:absolute;transition-property:transform;transition-duration:.15s;transition-timing-function:ease}.hamburger-inner::after,.hamburger-inner::before{content:"";display:block}.hamburger-inner::before{top:-10px}.hamburger-inner::after{bottom:-10px}.hamburger--spin .hamburger-inner{transition-duration:.22s;transition-timing-function:cubic-bezier(.55,.055,.675,.19)}.hamburger--spin .hamburger-inner::before{transition:top .1s .25s ease-in,opacity .1s ease-in}.hamburger--spin .hamburger-inner::after{transition:bottom .1s .25s ease-in,transform .22s cubic-bezier(.55,.055,.675,.19)}.hamburger--spin.is-active .hamburger-inner{transform:rotate(225deg);transition-delay:.12s;transition-timing-function:cubic-bezier(.215,.61,.355,1)}.hamburger--spin.is-active .hamburger-inner::before{top:0;opacity:0;transition:top .1s ease-out,opacity .1s .12s ease-out}.hamburger--spin.is-active .hamburger-inner::after{bottom:0;transform:rotate(-90deg);transition:bottom .1s ease-out,transform .22s .12s cubic-bezier(.215,.61,.355,1)}
/* ENDE hamburger */

/* Navigation am PC */
#jumpLinks a {    color: #fff;}
.navLinkBox a{  background-color: #fff; border: 2px solid #eee !important; color:#333!important;margin: 0px !important;font-size: 0.8em;}
.navLinkBox a:hover{  background-color:#B72573; color:#fff !important;}
.katNavLinks,.themNavLinks {    display: flex;    flex-wrap: wrap;}
.katNavLinks a {    padding: 10px;    margin: 2px !important;    width: calc( 33% - 4px);display: flex !important; justify-content: center; align-items: center; box-sizing:border-box;}
.themNavLinks a {    padding: 10px;      width: 100% ;display: flex !important; justify-content: center; align-items: center; box-sizing:border-box;margin-bottom: 5px !important;}
.NaviHerstellerLink { display: flex !important;    justify-content: space-between;}
.toTopLink {    color: #fff;}
#my-menu { cursor:pointer;font-size: 1.1em; }
#my-menu .parent {display: block;position: relative;float: left; font-weight:bold;}
#my-menu .parent ul { font-weight: normal;}
#my-menu .parent a, #my-menu .parent span{margin: 5px 10px;text-decoration: none;display: inline-block; }

#my-menu .parent > span{ color: #fff;}
#my-menu li a{margin: 10px;text-decoration: none;display: inline-block; color:#fff;}
#my-menu li li a{ color:#000;}
#my-menu li{ flex: 1 0 auto; text-align:center; }

#my-menu .child,#my-menu .child:hover {
  top: 29px;
  max-height: 0;
  position: absolute;
  overflow-y: hidden;
  overflow-x: hidden;
  -webkit-transition: all 0.3s ease 300ms;
  -moz-transition:all 0.3s ease 300ms;
  -ms-transition: all 0.3s ease 300ms;
  -o-transition: all 0.3s ease 300ms;
  transition: all 0.3s ease 300ms;
 background: #eee;
	}

.InternNavLink {    font-size: 0.7em;}	
#my-menu .parent:hover > ul {  max-height: 75vh; padding: 10px; }
.alleMarkenChild { width:500px;flex-direction: column;overflow-y: scroll !important;}
.ThemenweltenChild,.KontoChild{flex-direction: column; }
.NavListLinkThemen, .KontoChild a { display:block!important; padding:10px!important; }

.KategorienChild{ flex-wrap: wrap;  }
.KategorienChild a{ display:flex!important; padding:10px!important; width: 100%; align-items: center;justify-content: center;}
.KategorienChild li {    width: 33% !important;display: flex;}
.alleMarkenChild .mm-listitem_divider:first-child{ display:none;}
.alleMarkenNavTxt{ margin:5px 0;}
.wrapSpanNav {    width: calc(100% - 20px);}
.LiNeuesChild{ height:75vh;}
.NeuesChild{ overflow-y: scroll;}
#my-menu .child li {width:100%; }
.child li{width:100%; overflow-y: auto ;}

#my-menu .child li a{}
#my-menu ul{list-style: none;margin: 0;padding: 0px; min-width:100%; display:flex;}
#my-menu ul ul ul{left: 100%;top: 0;margin-left:1px;}

#mobileButtonStage{ display:none;}
#my-menu li:last-child { border:none;}
#mobileButtonCart,#mobileButtonMenu,#mobileButtonMerkz { flex: 1 0 auto; cursor:pointer;}
#mobileButtonMenu,#mobileButtonMerkz {    border-right: 1px solid #eee; text-align: center;}

.KategorienChild,.NeuesChild{width: 600px;left: -120px; }

.navNeuesImg {    width: 100%;}
.navNeuesBoxTxt {    text-align: left;    font-size: 0.9em; width:100%;}
.navNeuesBox {    display: flex;    background-color: #f2f2f2;      padding: 10px;	align-items: center;box-sizing: border-box;border: 3px solid #f6f6f6; width:50%;flex-direction: column;}
.navNeuesBox:hover{ background-color:#fff;}
.navNeuesRubStage .navNeuesBox {  background-color: #fff;  }
.navNeuesRubStage .navNeuesBox:hover {   background-color: #f2f2f2;  }
.pusher { text-align: center;   color: #9E0056;    font-weight: bold;   background-color: #fff;    padding: 5px;    margin-bottom: 0;}	

.navNeuesBoxPic a {    margin: 0 !important;display: block !important;}	
.navNeuesBoxPic {    width: 100%;margin-bottom: 15px;}
.navNeuesBoxTxt h3{ font-weight:bold;font-size: 1.4em;}
.navNeuesRubStage {    display: flex;   flex-wrap: wrap;}
.whiteBack{ background-color:#FFFFFF;}
.navNeuesPserieMarke {    text-align: center;}

.hideKompl{ display:none!important;}
.mm-listitem > a, .mm-listitem > span {    white-space: normal !important;}
.toTopLinkNeues {    display: block;    text-align: center;    margin: 10px 0;    padding: 5px;}
.mm-menu_has-sectionindexer .mm-panels {    right: 50px !important;}
.mm-sectionindexer {    width: 50px!important;}

/* ENDE Navigation am PC */
.ThemenBannerContainer {    max-width: 100%;}
.ThemenBannerStage{ display:flex;align-items: stretch;font-size: 0.8em;max-width: 1024px;margin: 0 auto;}
.ThemenBanner a{display: flex;flex-direction: column; flex:1 0 auto; }
.ThemenBanner a:hover {    opacity: 0.6;}
.ThemenBanner {display: flex;   box-sizing: border-box;    padding-right: 5px;    width: 16.7%;flex-direction: column; margin-top:5px;}
.ThemenBanner:last-child {   padding: 0;}
.ThemenBannerBild img {    width: 100%;}
.ThemenBannerBild   {  max-height: 60px;overflow: hidden;}
.ThemenBannerText {    background-color: #fff;    font-size: 0.9em;    text-align: center;    padding: 5px 5px 2px 5px;    color: #000; flex:1;display: flex;align-items: center;justify-content: center;}
/* Detailseiten artausgabe*/
#artikelausgabe {    width: 100%;position: relative;}
.art_name h1{ font-size:1.2em; margin-bottom:0;}
.art_kursiv{ font-size:0.8em; font-style:italic;}
.art_preis {    font-size: 1.8em;    font-weight: bold;    color: #9E0056; width:100%;}
.normpreis,.PreisVkEinheit, .PreisStattUVP {    width: 100%;}
 
.PromoArtPreisStage .PreisVkEinheit {    width: auto;    order: 2;color: #999; }
.PromoArtPreisStage .PreisVkEinheit:after { content:"/";padding: 0 3px;}
.PromoArtPreisStage .normpreis {    order: 3; color: #999;width: auto; }
.PreisBlock {    justify-content: center;}
.normpreisBox {    font-size: 0.8em;}
.singleTab h3 {    margin-bottom: 5px;    /*background-color: #F5F5DC;*/ border-bottom:1px solid #ccc;       font-size: 1.1em;}
.singleTab:first-child{ margin-top:15px;}
.lieferzeitStage {    margin: 10px 0;    font-weight: bold;font-size: 0.9em;}
.lieferzGreen { color:#8DB863;}
.lieferzGelb { color: #B9A300;}
.lieferzOrange { color: #F90}
.lieferzRot { color:#FF0000;}
 .art_text {    margin-top: 15px;}
.detailbild img {    max-width: 100%;}
#leftMenuStage{ margin:20px 0;width: 90%;}
#leftMenuStage h3 {    margin: 20px 0 10px 0;    background-color: #f0f0f0;    padding: 5px;    border-bottom: 1px solid #9f9f9f;    border-top: 1px solid #9f9f9f;}
.passendeProdH3 {    font-size: 1.3em;    background-color: #F3F3F3;    padding: 5px;margin-bottom: 15px;}
.passendeProdStage,.prodTeaserStage {    margin-top: 40px;} 
.leftMenu h3{ }
.leftMenu {    list-style-type: none;padding-left: 0 !important;font-size: 0.9em;}
.leftMenu li {border-bottom: #ccc solid 1px;}
.leftMenu li:last-child {border-bottom: 0px;}
.leftMenu a{padding: 5px ; display:block;color: #000; }
.leftMenu a:hover,.highlightmenu {    background-color: #9E0056;color:#fff!important;}
.startLinkStage i {    margin-right: 5px;}
.startLinkStage {    margin-bottom: 5px;}
.startLinkStage a {    display: block;    padding: 10px 0;    color: #000;}
.startLinkStage a:hover {    display: block;    padding: 10px 0;    color:#9E0056;}
.markenlogo a {    display: block;    text-align: center;}
.cloudzoom-gallery {    border: 1px solid #ccc; cursor:pointer;}
.cloudzoom-gallery-active {    border-color: #000;}
.hauticons img {    margin-right: 5px;}
.detailkorb .buttonText {    width: inherit;    display: initial;}
.detailtext {    margin-top: 20px;}
/* Ausgabe ArtikelListen Warengruppen etc... */
.paginierung {    font-size: 0.8em;    margin-bottom: 20px;background-color: #e6e6e6;padding: 5px;align-items: center;}
.paginierung select {    padding: 5px; cursor:pointer;}
.ListeArtAnzalStage { margin-right: 10px; }
.produktstageEinzel {  flex-wrap: wrap;margin-bottom: 15px;border-bottom: #e7e7e7 solid 1px; padding-bottom: 15px;flex: 1 auto; width:100%;}
.artvardiv, .artvardiv .produktstageEinzel {    width: 100%!important;flex: 1 0 auto;}
.produktbild.produktbildEinzel img {    max-width: 150px;}
.produktbildEinzel {width: 137px;    text-align: center;  margin-right: 10px; flex: 0 0 auto; }
.produktTxtPreisEinzel {flex: 1;    display: flex;}
.produktPreisEinzel {    width: 135px;    flex: 0 0 auto;text-align: right;}
.produkttxtEinzel {    margin-right: 15px;flex: 1 1;}
.produkttxtEinzel h3{ font-size:1em; font-weight:bold;}
.cartbuttonSmal {    font-size: 0.9em;    text-align: center;    margin-bottom: 5px;}
.art_name {    font-weight: bold;}
.produktButtonStageEinzel button,.themenButton button{display: flex;justify-content: space-between;}
.MerkzettelButText {    display: flex;    justify-content: space-between;    width: 100%;}
.MerkzettelButShowText {    width: 100%; display:none; }
.MerkzettelButShowText i{ font-weight:900 !important; }
.thumb_img {    cursor: pointer;max-width: 100%;}
.produktbildEinzel span {    display: block;}
.paginierungText {    flex: 1;}
.paginierungSelect{ margin-right:10px;}
.paginationBot{    align-items: center;}
.paginationBot:nth-child(2){margin-bottom: 20px;}
.paginationBot select{ padding:6px 5px;cursor: pointer; border:1px solid #ccc;text-align: center;width: 100%;}
.paginationDisabl {    color: #CCC;    cursor: default;}
.paginationBackw::before {    content: "\f104";}
.paginationForw::before {    content: "\f105";}
.paginationBackw::before, .paginationForw::before {    font-family: "Font Awesome 5 Pro";    font-weight:300;}
.paginationBackw, .paginationForw {   border: 1px solid #ccc;margin: 5px;width: 20px;cursor: pointer;padding: 5px;display: flex;align-items: center;justify-content: center;font-size: 1.5em; background-color:#fff;}
.paginationPageSelect {    flex: 1;}
/*/  Merkzettel  */
.merkzHead {    text-align: center;    font-size: 0.8em; margin-bottom:15px;}
#merkzettel h2 {    font-size: 1.4em; text-align: center;margin-bottom: 5px;}
.merkzInfo{ padding:10px; background-color:#F5F5DC;}
.merkzInfo i {    font-size: 2.3em;    margin-bottom: 5px;}
.merkzInfo {    padding: 15px;    background-color: #F5F5DC;    font-size: 0.8em;    text-align: center;}
.produktstageEinzelMerkz .produktbildEinzel{width: 55px;padding: 0 10px;}
.produktstageEinzelMerkz .produktbildEinzel img {    max-width: 50px;}
.produktstageEinzelMerkz .produktbildEinzel span {    display: block;}
.merkzPreis .art_preis{ font-size:1em;}
.merkzBut {    flex: 1 0 auto;    width: 100%;}
.merkzBut .cartbutton{ width:auto; margin:0;}
.merkzTxtStage {    flex: 1 1;}
.merkzBut button {    padding: 5px;    flex: 1 1 auto;    cursor: pointer;}
.merkzBut .loeschbutton{ background-color:#FF000080; border:1px solid #ccc;}
.merkzSendenStage{ text-align:center; font-size:0.9em;margin-bottom: 250px;}
.merkzSendenStage i,.merzSendIcon{ margin:15px 0;font-size: 3em;}
..merkzsendbutton {    width: 100%;}
.merkzPreis {    flex: 0 1 auto;    text-align: right;   width: 111px;    font-size: 0.8em;}
.merkzTxt {    flex: 1 1;}
.buttonText {    width: 100%;    display: flex;  justify-content: center;align-items: center;flex: 0 0 auto;}
.beigeButton .buttonText {	justify-content: space-between !important;}
.MerkzettelSenden .buttonText {    justify-content: center;}
.buttonShowText{    width: 100%; text-align:center;color: #fff;}
.buttonShowText i{ font-size: 1.3em;}
.merkzsendbutton {    display: block;    margin: 20px 0;    color: #fff !important;}
#spamschutzdiv {    display: none;}
#merkzsendform label,#verfuegsendform lable {    display: block;    margin: 5px 0;}
#merkzsendform textarea, #merkzsendform input, #verfuegsendform textarea, #verfuegsendform input {  width: 100%;padding: 10px;box-sizing: border-box;}
.merkzsendformAnm{ background-color:#F5F5DC; padding:10px;}
.merkzsendformAnm i{ font-size:2em;}
/* Kategorien */

#loading{ font-size:3em;width: 100%;}
.auswahlmenustage {    width: 100%;    padding: 10px 0;align-items: flex-start;}
.auswahlmenustage select {    padding: 5px; width:100%;}
.auswahlmarke,.auswahloptionen,.auswahlsort{    flex: 1; margin-right:5px;  display: flex;}
.auswahlsort{ margin-right:0px;}

/*  TABS */
.tabStage > div{ display:none;}
.tabStage ul+div{ display:flex;}
.hiddenTab{ display:none !important; }
.activTab {display:block!important;}
.tabStage ul {    display: flex;    justify-content: flex-end;margin-bottom: 4px;}
.tabStage ul li {    list-style: none;   margin-right: 5px;}
.tabStage ul li a{
    padding: 4px;
    border: solid 1px #ccc;
 
	font-size:0.8em;
}
.tabStage ul li:last-child{ margin-right:0;}
.tabStage ul li:first-child a,.activTabLink{ background-color:#8DB863; color:#fff;}
.tablink {    cursor: pointer;}
.noactivTabLink{ background-color:#fff !important; color:#333 !important;}
.groesenauswahltxt {    text-align: right;    margin-bottom: 5px;    font-size: 0.7em;}
/*  Produktserien  */
.infoBox {margin-bottom: 20px; padding: 10px; border-bottom: 15px solid #C63E84; padding-bottom: 20px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+87,ededed+100&0+87,1+100 */
background: -moz-linear-gradient(top, rgba(255,255,255,0) 87%, rgba(237,237,237,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 87%,rgba(237,237,237,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,0) 87%,rgba(237,237,237,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */}
.infoBoxTxtStage {    flex: 1 0;}
.infoBoxImg {    margin-right: 20px;}
.wgUnterNav {   margin-bottom: 20px;display: flex;flex-wrap: wrap;} 
.wgUnterNav a {  font-size: 0.9em;flex: 1 1 15%;margin: 3px;align-items: center;display: flex;text-align: center;justify-content: center;background-color: #fff;}
/*.rubrik_header {    background-color: #f6f6f6;    padding: 5px;    display: flex;    justify-content: space-between;    align-items: baseline;}*/
.hiddenWGlinks {    width: 100%;    display: flex;    flex-wrap: wrap; display:none;}
.WgUnternaviLinksMore {background-color: #F5F5DC !important;}
.wgUnterTextOpened{ display:none;}
.wgUnterTextClosed{ display:block;}
.UnternaviActiv .wgUnterTextOpened{ display:block;width: 100%;}
.UnternaviActiv .wgUnterTextClosed{ display:none;}
/* Versandkosten*/
.versandStage {    margin: 20px 0;    width: 100%;}
.versandStage select{ padding:10px; width: 100%;}
.hotlinetel a{ font-weight:bold;}
#versandContent {    background-color: #F5F5DC;    margin: 20px 0 0 0;    padding: 10px;}
#versandContent h3{ margin-bottom:10px;}
 
#versandStageContent {   flex: 1;}
.liefertxt {    width: 100%;}
/* Farbvarianten*/
.farbVarProdStage .produkttxt{ flex: 1 1 ;margin-left: 10px;margin-right: 15px;}
.farbVarProdStage .herstName{ display:block;}

.description {    margin-left: 32px;}
.bittefarbwahl {   font-size: 0.7em;margin-bottom: 20px;}
.farbausHeadArtname {    font-size: 1.2em;}
.hauticons {    margin: 10px 0;}
.normpreis {    color: #999;}
.farbAuswahlStage {display: flex; border: 1px solid #ddd; padding: 5px; background-color: #F5F5DC;}
.farbAuswahlBild {    margin-right: 10px;display: flex;    align-self: center;}
.farbAuswahlContent .lieferzeitStage {    margin: 0;}
.hinweis_gn {    margin-top: 5px;      font-weight: bold;}
.hinweis_gn:before{ font-family: "Font Awesome 5 Pro";content: "\f30f";font-weight: 600;margin-right: 5px;color: #9E0056;font-size: 1.3em;}
.farbAuswahlArtNr {    font-size: 0.7em;}
.farbAuswahlBox{ cursor:pointer;}
.farbAuswahlArrow{  background-color: #fff; width: 25px; display: flex; justify-content: center; flex-direction: column; text-align: center; font-size: 2em; color:#9E0056;}
.farbAuswahlArrow:after{ font-family: "Font Awesome 5 Pro";content: "\f0da";font-weight: 600; }
.farbAuswahlContent { flex: 1;}
.farbAuswahlWrapper .farbAuswahlStage {   background-color: #F3F3F3; border: none; border-bottom: 2px dotted #ccc;padding: 7px 2px;}
.farbAuswahlWrapper .farbAuswahlBox {}
.ausgewaehltFarbe{ background-color:#fff!important;}

/* Login / Kundenkonto*/
.anmeldeStage h3{ text-align:center;font-size: 1.3em; margin-bottom: 20px;}
.anmeldeStage { text-align:center;}
#loginForm label, .loginFormLable {   display: block; margin-bottom: 5px;}
.loginFormfeld {    margin: 0 0 10px 0;    padding: 5px;    border: solid 1px #ccc;    width: 100%;    max-width: 400px;box-sizing: border-box;}

.Pflichtfelder {    font-size: 0.8em;    width: 100%;    max-width: 400px;    text-align: right;    margin: 0 auto;}
#loginForm .ButFullSize{ max-width:400px; text-transform:uppercase;font-size: 1.2em;}
.NeukundeStage {    max-width: 400px;    margin: 20px auto;    background-color: #F5F5DC;    padding: 10px;    text-align: center;    box-sizing: border-box;border: 1px solid #ccc;}
.NeukundeStage h3{ margin-bottom:20px;    }
.NeukundeStage .beigeButton{    display: block;    box-sizing: border-box;}
.pwVergessenLink { padding: 10px 5px;display: block;}
.showBestStage{ }
.showBestStage h3,#anzeigeStageBest {    margin: 20px 0;}
.anzeigeHeadBest {  margin-bottom: 20px;}
.anzeigeHeadBest div:first-child { font-size:1.2em; font-weight:bold;  margin-bottom: 10px;}
.anzeigeBestLieferstatus{ margin-bottom: 20px; }
.anzeigeBestKontaktbox {   }
.lieferAn {  margin-bottom: 15px;font-size: 0.8em;}
.BorderBox{border: 1px solid #cde6d9; padding: 15px; margin-bottom: 4px; /*background-color: #F1FCF6*/background-color: #F6F6F6;box-sizing: border-box;}
.BorderBoxRed {    background-color: #e11840;    color: #fff;}
.BorderBox h3,.anzeigeBestLieferstatus h3,.anzeigeBestZahlart h3,.anzeigeBestArtikel h3 {    font-weight: bold;}
.kundenHeadblock {    display: flex;    justify-content: space-between;    width: 100%;margin-bottom: 20px;border-bottom: 1px dotted #ccc;}
.ArtListRow{ display:flex;margin: 10px 0;}
.ArtListRow div{ margin-right:5px;}
.anzeigeBestArtikelList {    margin: 20px 0;}
.ArtListWK { flex-shrink: 0;   width: 20px; text-align:left;}
.ArtListMenge {  width: 45px;   text-align: right;}
.ArtListPreis,.ArtListTotal {    width: 75px;   text-align: right;}
.ArtListArtNam {    flex: 1;}
.ArtListWK a {    font-size: 1.2em;   padding: 5px;}
.SiteLockBox {    width: 100%;    margin-top: 40px;    text-align: center;}
.SiteLockBox::before {   font-family: "Font Awesome 5 Pro";content: "\f071";font-weight: 600;margin-right: 5px;color: #F0D987;font-size: 4em;display: block;margin-bottom: 20px;}
.anzeigeBestCalc{display: flex;justify-content: flex-end;}
.anzeigeBestHigh{ background-color:#F6F6F6;padding: 5px; margin-bottom:10px;}
.anzeigeBestBott{ margin-bottom:20px;}

.anzeigeBestCalc div:first-child{ flex:1; margin-right:5px; text-align:right}
.anzeigeBestCalc div:last-child{ width:100px; text-align:right}
.anzeigeBestCalc.Zahlbetrag {   border-top: 1px dotted;   margin-top: 5px;   padding-top: 5px;}
.bestListWkLink {   font-size: 1.5em;   display: block;}
#bestArtTable{ margin-bottom:10px;}
.infobox{display: flex; align-items: stretch;margin: 4px 0;padding: 10px;}
.infoboxgreen{background-color: #F1FCF6;}
.infoboxIcon{display: flex;align-items: center;margin-right: 8px;}
.infoboxgreen .infoboxIcon{background-color: #9E0056}
.infoboxContent{ margin-bottom:5px; flex:1 1;}
.iconNote:after{font-family: "Font Awesome 5 Pro";content: "\f086";font-weight: 600;margin: 0 10px;color: #F0D987;font-size: 2em;padding: 5px 0;}
.iconinfo:after{font-family: "Font Awesome 5 Pro";content: "\f30f";font-weight: 600;margin: 0 10px;color: #F0D987;font-size: 2em;padding: 5px 0;}
.iconGruss:after{font-family: "Font Awesome 5 Pro";content: "\f004";font-weight: 600;margin: 0 10px;color: #F0D987;font-size: 2em;padding: 5px 0;}
.iconAusrufe:after{font-family: "Font Awesome 5 Pro";content: "\f321";font-weight: 600;margin: 0 10px;color: #F0D987;font-size: 2em;padding: 5px 0; }
.iconOk:after{font-family: "Font Awesome 5 Pro";content: "\f00c";font-weight: 600;margin: 0 10px;color: #8DB863 ;font-size: 2em;padding: 5px 0;}
.iconTruck:after{font-family: "Font Awesome 5 Pro";content: "\f0d1";font-weight: 600;margin: 0 10px;color: #F0D987;font-size: 2em;padding: 5px 0;}
.anzeigeBestArtikel {    margin-top: 20px;}
.infoboxContent h3 {    font-weight: bold;   font-size: 1.1em;margin-bottom: 5px !important;}
.anzeigeBestCalcHinweis {    text-align: right;   margin: 5px 0;   font-size: 0.8em;}
.backStage {   text-align: right;   display: flex;   justify-content: right;   margin-top: 20px;}
.backBut:before{font-family: "Font Awesome 5 Pro";content: "\f104";font-weight: 600; font-size: 2em;padding: 5px 0;margin-right: 10px;}
.backBut {    display: flex;   flex: 0 1 auto;   align-items: center;       justify-content: center;padding: 10px;}
#formdiv input, .inputFeld, .benutzerdatenStage input,#bonusInput,.gutschTestStage input, .neuAnmStage input,.bestAdressEingabeStage input,.BestRabStageInput input,#gutschein_input input,#Lastschrift input,.amazInputStage input{padding: 7px 0 7px 10px;border: solid 1px #E5E5E5; background-color: #fff;width: 100%;box-sizing: border-box;margin-bottom: 15px;}
.inputNoMargin{margin-bottom: 0px !important;}
.benutzerdatenStage label, .neuAnmStage select {    display: block;    font-size: 0.8em;}
.benutzerdatenStage select, .neuAnmStage select,.bestAdressEingabeStage select{flex: 1;  padding: 5px;margin-bottom: 15px;width: 100%;}
.benutzerdatenStage select:first-child, .neuAnmStage select:first-child { margin-right: 5px; }
.benutzerdatenHalb div {   flex: 1 1 auto;max-width: 49%;width: 49%;}
.neuDataSaveBut,.countSel {    width: 100%;}
.benutzerdatenStage h3 {    margin-bottom: 15px;}
.benutzerdatenStage .infoboxContent {    font-size: 0.7em;}
.BorderBox .infobox{ padding:0; border:1px solid #ccc;}
.neuDataSaveBut{ margin:10px 0;}
.pwNeuH3{ margin-top:20px;}
.KundenInfoBox {    margin-bottom: 20px;    width: 100%;}
.KundenInfoBox  .infoboxContent{display: flex;    justify-content: center;    align-items: center;width: 100%;}
.kundeninfoStageBox{ margin-bottom:5px; padding-bottom:5px; border-bottom:1px dotted #ccc;}
.kundeninfoStageBox h4 {    margin-bottom: 5px;}
#gutmsg, #bonusmsg,.error {    margin: 10px 0;    padding: 10px;      border: solid 1px #ccc;    text-align: center;   display:none;}
#gutmsg, #bonusmsg{ background-color: #f3f3db;}
.error { width:100%;box-sizing: border-box; background-color: #fbdada; }
#gutmsg i {    font-size: 2em;    display: block;}
.regGruende {    margin: 20px 20px 40px 20px !important;}
.bestaet,.fehler {    text-align: center; display:none;}
.bestaet a { width:100%; display:block; box-sizing:border-box;}
.anmeld h3{ margin-bottom:20px;}
.redBox{ background-color:#FFC6C6 !important;}
em.invalid {    color: red;    font-size: 0.8em;    position: relative;    top: -15px;}
input.invalid, select.invalid {    border-color: #fc0000;}
.merkzHinweisTxt {    padding: 20px;    text-align: center;    font-size: 2em;    font-weight: bold;}
/*  übersicht seite */
#uebersichtHeader{ margin-bottom:30px;}
.herstellerhead h1 {    font-size: 1.6em;    margin:20px 0 10px 0;}
.psrahmen {    display: flex; margin-bottom:10px; padding-bottom:10px; border-bottom:1px dotted	#ccc; cursor:pointer;}
.psrahmen:last-child {border-bottom: none;}
.psrahmenLeft {    margin-right: 20px;}
#uebersichtHeader img {    width: 100%;}
.schnellanfrage-box {    margin-bottom: 20px;}
.feedbackStage{ display:none; background-color: #8DB863; text-align: center;color: #fff;padding: 10px;font-size: 0.9em;}
 .fancy-checkbox { cursor:pointer;}
 .fancy-checkbox input[type="checkbox"] {    display: none;}
 .fancy-checkbox span:before {    font-family: "Font Awesome 5 Pro";	content: "\f0fe";	font-weight: 400;    font-size: 1.3em;color: #999;margin-right: 7px;}
  .fancy-checkbox input[type="checkbox"]:checked ~ span:before {    content: '\f14a'; color:#129b12;font-weight: 600; }
  
.fancy-checkbox-normal { cursor:pointer;position: relative;}
.fancy-checkbox-normal input[type="checkbox"] { visibility:hidden;position: absolute;top: 3px;}
.fancy-checkbox-normal span:before {    font-family: "Font Awesome 5 Pro";	content: "\f0c8";	font-weight: 400;    font-size: 1.3em;color: #999;margin-right: 7px; background-color: #fff;}
.fancy-checkbox-normal input[type="checkbox"]:checked  ~ span:before{    content: '\f14a'; color:#129b12;font-weight: 600; }

input[type="radio"] + label { cursor:pointer;position: relative;margin: 5px 0; display:flex;}
input[type="radio"] { visibility:hidden;position: absolute;top: 3px;}
input[type="radio"] + label:before {    font-family: "Font Awesome 5 Pro";	content: "\f111";	font-weight: 400;    font-size: 1.3em;color: #999;margin-right: 7px; background-color: #fff;border-radius: 46%;    height: 15px;}
input[type="radio"]:checked  + label:before {    content: '\f058'; color:#129b12;font-weight: 600; }
/* Orderseiten */ 
#orderpage h2 {    font-weight: bold;}
.BestellHeadStage {    width: 100%;    display: flex;color: #999;margin-bottom: 5px;border-bottom: solid 3px #999;flex-wrap: wrap;}
.BestellHeadStep {    flex: 1;    text-align: center;position: relative; padding:10px;align-items: center;display: flex;justify-content: center;min-width: 155px;}
 
.BestellHeadStep:last-child:after {    font-family: "Font Awesome 5 Pro";	content: "";	  }
.BestStep {    width: 20px; margin-right:5px;    display: inline-block;    position: relative;color: #999 !important;background-color: #fff;border: 1px solid #999;border-radius: 50%;}
.oPage1 .BestellHeadAdress, .oPage2 .BestellHeadAdress, .oPage2 .BestellHeadZahlart,.oPage3 .BestellHeadAdress, .oPage3 .BestellHeadZahlart, .oPage3 .BestellHeadPruefen,.aOrder3 .BestellHeadAdress, .aOrder3 .BestellHeadZahlart, .aOrder3 .BestellHeadPruefen,.oPage4 .BestellHeadAdress, .oPage4 .BestellHeadZahlart, .oPage4 .BestellHeadPruefen,.oPage4 .BestellHeadBestaetigen  { 
color:#fff;    border-bottom: 1px solid #fff; 
background: #9e0056; /* Old browsers */
background: -moz-linear-gradient(top, #9e0056 0%, #c94288 50%, #9e0056 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #9e0056 0%,#c94288 50%,#9e0056 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #9e0056 0%,#c94288 50%,#9e0056 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9e0056', endColorstr='#9e0056',GradientType=0 ); /* IE6-9 */
border-right: 1px solid #fff;}
.bestAdressStage{ display:flex;}
.bestAdressBox {border: 3px solid #ccc;  padding: 10px;    box-sizing: border-box;}
.adrAendernStage{margin: 20px 0;text-align: right;}
.adrAendernLink {    font-size: 0.8em;}
.adrAendern{ cursor:pointer;}
.bestAdressEingabeStage label,.agbCheckStage label{    display: block;}
.bestAdressEingabeStage .flexboxItem {     flex: 1;}
.mitteilung {    margin: 20px 0;}
.mitteilung label {    display: block;}
.mitteilung textarea { height:7em; width:100%;}
.agbCheckStage {    margin-bottom: 20px;}
.showAgbStage{display: none; margin-top:20px;}
.loadAgb{margin: 10px 0 20px 0; padding: 20px; border: 1px #ccc solid; background-color: #ecf4fb; max-height: 300px; overflow-y: scroll; overflow-x: hidden; font-size: 0.8em;}
.OrderButton.greenButton {    max-width: 400px;    width: 100%;}
.OrderButton {display: flex; justify-content: center; align-items: center;font-size: 1.2em;font-weight: bold;}
.OrderButton i{ margin: 0 5px; font-weight: 600;}
.subButtonStage {display: flex;justify-content: flex-end;margin-top: 40px;}
.oPage3 .subButtonStage{justify-content: center;}
.ladresse,.zahltext {    background-color: #f6e6d1;    padding: 15px;    border: 1px solid #ddd;}
.zahltext {   background-color: #fff !important;}
.BestRabStageInput,#gutschein_input {    background-color: #fff;    padding: 15px;    border: 1px solid #ddd;margin: 20px 0;}
.lieferortStageAuswahl input {    width: initial; margin-right:10px;}
.lieferortStageAuswahl label {    display: initial;}
.lieferortStageAuswahl .flexboxItem {width: 47%;flex: 1 1 auto;box-sizing: border-box;}
.bestAdressEingabeStage {    display: none;}
.bestAdressEingabeStage select{padding: 10px 0 10px 10px;border: 1px solid #ddd;}
.agbCheckStage em.invalid {    position: initial;    top: 0;    display: block;    margin-left: 15px;}
.BestRechnBeilStage,.BestRabatGutschStage,.BestRabStage,.BestGutStage{ margin:10px 0; position:relative;}
.BestRechnBeilStage label {    margin-right: 20px;}
.BestRechnBeilStage h2 {    margin-bottom: 0;}
.BestRechnBeilStage p { font-size:0.7em;}
#aktion_input .infobox{ border:none;}
.alignBottom {    display: flex;    align-items: flex-end;}
.sofortLable {    height: 40px;}
.zahlartItem {    width: calc(25% - 22px);    display: flex;    align-items: center;    margin-bottom: 5px; min-width: 160px;}
.bestZahlarten {    margin-bottom: 20px;}
.openkontodaten {    margin: 10px 0;    box-sizing: border-box; cursor:pointer;text-align: center;}
.vorhandeneLastschrDaten {    font-size: 1.4em;}
.togl {display:none;}
.showTogl {display:block;}
.warenprobenStage {    margin: 20px 0;}
#probenwahl {    display: flex;flex-wrap: wrap;}
.probenwahlTxt{ width: 100%; margin: 20px 0; text-align: center;}
.probenartdivStage{ width: calc(25% - 21px); margin-right: 10px; border: 1px solid #ccc; padding: 4px; margin-bottom: 5px; background-color: aliceblue;}
.probenartdivStageFirst{width:100%!important; display:flex;flex-wrap: wrap; margin-bottom:5px;}
.probenartdivStage h4 {    width: 100%;text-align: center;font-size: 0.9em;}
.probenartdivStageFirst .probenartdiv { /*   width: calc(25% - 10px); */   margin-right: 10px;}
#pwahl {    display: flex;    justify-content: space-between;    align-items: center;margin: 30px 0;}
#pwahl:before{    font-family: "Font Awesome 5 Pro";	content: "\f107";	font-weight: 400;    font-size: 2em; margin: 0 7px;}
#pwahl.ProbeOpen:before{content: "\f106";} 
#pwahl:after{    font-family: "Font Awesome 5 Pro";	content: "\f107";	font-weight: 400;    font-size: 2em;  margin: 0 7px;}
#pwahl.ProbeOpen:after{content: "\f106";}
.erMsgKontData {    background-color: chocolate;    padding: 10px;    color: #fff;    margin-bottom: 10px;display: none;}
.hinweis_rt{ color:#9E0056; margin:20px 0;}
.closeAgbStage{display: flex;justify-content: right;}
.closeAgb { text-align: center; cursor: pointer; width: 100px; padding: 5px; }
.bColPreis{    width: 100px;text-align: right;margin-right: 10px;}
.bColPreis span{ display:block; font-size:0.7em; color:#999;}
.BestellungColSub2 {    width: 100px;text-align: right;}
.BestellungColSub1 {  text-align: right;flex: 1;}
.bColSumme {    width: 100px; text-align: right;}
.bColMenge{    width: 45px; margin-right:10px;}
.bColArtikel {    flex: 1 1 auto;}
.bColRabatt {    width: 100px;    text-align: right;font-size: 0.9em;}
.SubRowMwST .BestellungColSub1{ text-align:left;}
.BestellungRow {padding: 5px;}
.BestDivide{ margin-top:10px; padding-top:10px; border-top:4px dotted #ccc;}
.oPage3 #zahlform h3 {    margin-bottom: 10px;    font-weight: bold;}
.ZahlbetrRow {font-weight: bold;font-size: 1.1em;}
#zahlform {    font-size: 0.9em;}
.steuerInfo {    text-align: right;    margin-bottom: 10px;    font-size: 0.8em;}
.artRowBes:nth-child(2n){ background-color:#F3F3F3;}
.vrErrorStage {    padding: 15px;    margin: 20px 0;    background-color: #feefdc;}
.vrErrorLink{ margin:15px 0;font-weight: bold;}
.BestStep i {font-weight: 800; color: green; font-size: 0.9em; margin-top: 4px;}
.headLink{ cursor:pointer;}
.headLink:hover{ border-bottom: 1px solid; padding-bottom:4px;}
.OpenPrint {    display: block;    margin: 20px 0;    font-size: 0.8em;}
.headTab {    font-size: 0.8em;    margin-bottom: 20px;}
#addressBookWidgetDiv,#walletWidgetDiv {    width: 100%;    height: 228px;    margin-bottom: 20px;}
.amazTxt {    margin-bottom: 15px;}
.amazHinweisTxt {    font-size: 0.8em;    margin: 20px 0;}
.sofortLogo img {    border-radius: 10%;    width: 67px;}
.zahlart {    justify-content: center;    align-items: center;    align-content: center;    justify-items: center;    display: flex;}
.zahlartIndi {  width: 66px;display: flex; align-items: center; justify-content: center; flex-direction: column; font-size: 0.8em; margin: 0 3px;}
.zahlartBlank{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; height: 41px; color: #000;border: 1px solid #ccc;}
.zahlartBlank i{color: #9E0056;font-weight: 600;font-size: 1.3em;}
.zahlartLandSel {    font-size: 0.8em;}
.zahlartLandSel select {    width: 100%;    padding: 5px;    margin-bottom: 5px;}
.bestaetigunsStage { text-align:center;}
.bestaetigungSubButtonStage {     justify-content: center;    margin: 10px 0;}
.bestaetigunsStage i{    font-size: 6em;    margin-bottom: 10px;    color: #9E0056;}
.weiteramzonbestellung{ display:none;}
.hiddenVis { visibility: hidden;height: 0;margin: 0;padding: 0;}
.hidden {display:none;}

.OpenPrint i{ font-size:1em;}
.gutsBetragStage{ display:none;padding: 5px;background-color: #f6f6df;font-size: 1.2em;text-align: center;}
.gutsBetragStage i{ color:#129b12;}
#gs {    margin-bottom: 0 !important;}
.oPage4 .subButtonStage {    justify-content: center;}
.seoteststage {    font-size: 0.7em;}
#warenkorbanzeige {    width: 100%;    padding: 0 10px;    text-align: right;box-sizing: border-box;}
.orderShopBackStage{margin: 10px 0;}
.orderShopBack {    padding: 10px;}
.warnBarr {
    padding: 15px;
    text-align: center;
    background-color: #ef7d2b;
    color: #fff;
}
.SlideshowStage {    margin-bottom: 20px;}
.warnBarr span{ font-size:1.2em;font-weight: bold;}
.amazSandbMsg {    background-color: red;    padding: 5px;    color: #fff;}
.aktuellesBoxBild{ max-width:200px; margin-right:20px;}
.aktuellesBoxBild img {    width: 100%;    max-width: 100%;}
.aktuellesBoxTxt h2 {    font-weight: bold;    font-size: 1.3em;    margin-bottom: 5px;}
.aktuellesBox {    display: flex;    border-bottom:1px solid #ccc;    margin-bottom: 15px;    padding-bottom: 15px; }
.aktuellesBox:last-child { border-bottom: none;}
.aktuellesBoxTxt {    flex: 1;display: flex;    flex-direction: column;}
.weiterstart {    font-size: 1.6em;       padding: 10px 0;    width: 100%;    display: block;    box-sizing: border-box;}
.weiterstart:hover {    font-size: 1.8em;}
.trennH2 {    position: relative; display: flex;justify-content: center;}
.trennH2:before {content: "";
width: 100%;
height: 1px;
background-color: #ddd;
position: absolute;
top: 50%;
left: 0;
z-index: 0;
}
.trennH2 span {    background-color: #fff;    display: inline-block;    padding: 0 10px;z-index: 2;}
.secBanner {    display: flex;    background-color: #fff;border: 2px solid #fff; cursor:pointer;overflow: hidden; flex-wrap:wrap;}
.secBanner:hover{ opacity:0.8;}
.secBannerImg img{ width: 100%;}
.secBannerTxt {   display: flex;    justify-content: center;    text-align: center;    align-items: center;  background-color: #fff; width:100%;}
.VidBanner:before{  content: "\f03d";
  font-family: "Font Awesome 5 Pro";
  font-style: normal;
  font-variant-caps: normal;
  font-variant-ligatures: normal;
  font-weight: 900;
  padding:10px;
  background-color:#fff;
  position:absolute;
  right:21px;
  -webkit-font-smoothing: antialiased;}
.VidBanner {    width: 100%;}  
.herstellerAktionSteps {
    padding: 10px;
    box-sizing: border-box;
}
  /*  *******  Kontaktformular *************  */
#kontaktform {    width: 100%;}
#kontaktform label{ display:block;  margin: 0.5em 0 0;}
#kontaktform input,#kontaktform select{ width:100%;  height: 2em; padding: 3px;}
#kontaktform textarea{ width:100%; height:4em;}
 
.sendbuttonStage {    text-align: right;}
#spamschutzdiv{ visibility:hidden;}
  /*  *******  Themenseiten *************  */
.themenbox {    width: 32%;   margin-bottom: 20px;display: flex;}
.prboxinnen{ -moz-box-shadow: 1px 1px 10px #ccc;
    -webkit-box-shadow: 1px 1px 10px #ccc;
    box-shadow: 1px 1px 10px #ccc;
    border-radius: 10px;
    padding: 10px;
    box-sizing: border-box;
    border: 1px solid #fff;
	position: relative;
	display: flex;
	flex-direction: column;
	width:100%;
    }
.themenSoldout {
	background-color: #fff;
	box-sizing: border-box;
	color: #8E8E8E;
	font-size: 1.7em;
	border: 5px solid #ccc;
	padding: 20px;
	position: absolute;
	text-align: center;
	top: 0;
	width: 100%;
	/*font-family: 'Montserrat', 'sans-serif';*/
	font-family: Arial, Helvetica, sans-serif;
	margin-top: 25%;
	-moz-transform: rotate(-10deg);
	-webkit-transform: rotate(-10deg);
	-o-transform: rotate(-10deg);
	-ms-transform: rotate(-10deg);
	transform: rotate(-10deg);
	-webkit-border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	border-radius: 10px 10px 10px 10px;
	-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.75);
	-moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.75);
	box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.75);
	z-index: 2;
}
.themenTxt {    flex: 1 0 auto;}	
.themenDaten .buttonText {display: initial;}
.themenProduktbild {    text-align: center;margin-bottom: 10px;}
.themenProduktbild img{ max-width:100%;}
.themenDaten .preisStartStage {    text-align: right;}
.themennavi {  margin-bottom: 20px;}
.themenweltStage {margin-bottom: 15px;
background-color: #FFFFFF;
-moz-box-shadow: 1px 1px 5px #000;
-webkit-box-shadow: 1px 1px 5px #000;
box-shadow: 1px 1px 5px #000;
padding: 10px;
width: 100%;
box-sizing: border-box;
border: 1px solid #999999;
}
.themenweltStage:hover,.themenbuttonhighlight { 
	border: 1px solid #999999; 
	background-color: #EBEBEB;
	color: #212121;
	-moz-box-shadow: 0px 0px 5px #ccc;
	-webkit-box-shadow: 0px 0px 5px #ccc;
	box-shadow: 0px 0px 5px #ccc;
}
.themenweltNaviHead a {
    text-decoration: none;
    display: block;
    text-shadow: 1px 1px 1px #FFFFFF;
	font-size: 1.2em;
color: #000;
text-align: center;
margin-bottom: 5px;
}
.themenweltStage button {
	width: 100%;
cursor: pointer;
border: 1px solid #b9b9b9;
padding: 5px;
margin-bottom: 3px;
background-color: #fcfcfc ;
	}
	
.kontaktantwortspan {    padding: 15px;    text-align: center;      margin: 10px 0;}
.kontaktFail{    background-color: blanchedalmond;      color: red;    }
.kontaktOK{    background-color: #346663;      color: #fff;    }
	
.themenweltStage button:hover,.buttonselected	{background-color: #e8e8e8 !important;}
.themenweltNaviBild img {max-width: 250px;width: 100%;}
.themenweltNaviBild a {    display: block;    text-align: center;}
.TheminnenClass{background-color: hsla(0, 100%, 100%, 0.6);}
.ArtikelListeStage h2 {
    width: 100%;
    text-align: center;
    padding: 5px;
    border-bottom: 1px solid #ccc;
    font-size: 1.8em;
  /* background-color: #a2a2a2;
   color:#FFF;*/}
.sonderArtTrennerStage {    width: 100%; position:relative;text-align: right;}	
.timeBadget .timeBadZeit{    font-size: 1.5em; display:block;line-height: 23px;font-weight: bold;}
.timeBadget .fa-layers.fa-fw {    font-size: 5.3em;   }
.timeBadget .fa-layers-text.fa-inverse {    position: absolute;    left: 20px;    font-size: 13px;    top: 26px;}
.timeBadget { color: #9E0056;   position: absolute;  left: -11px;top: -14px;}
.contentHeadImg{ text-align:center;}
.contentHeadStage img{ max-width:100%;}
.AktionRahmenLink {    color: #333;    text-align: center;display: flex;flex-direction: column;}
.AktionRahmenLink:hover {opacity: 0.8; }
.AktionHead {    background-color: #9f9f9f;    color: #fff;order: 2;padding: 5px;margin-bottom: 5px;}
.AktionRahmen {    width: calc( 20% - 10px);margin-bottom: 20px;}
.AktionBild {    order: 1;}
.AktionTxt {    order: 3;font-size: 0.85em;padding: 0 5px;}
.AktionName {    order: 4;}
.AktionBild img {    width: 100px;    height: 100px;}
.herstellerAktionTxtAb {    font-size: 1.2em;    font-weight: bold;}
.alleAktionenH1 {    text-align: center;    font-size: 1.5em;    border-bottom: 2px dotted;    margin: 20px 0;}
.scrolltop { display:none;     position: fixed;    bottom: 0;    background-color: #9E006C;    font-size: 1.3em;    padding: 2px;    right: 0;    opacity: 0.6;    color: #fff;    width: 100%;    text-align: center; cursor:pointer; z-index:999;}
 #cookieHinweis {    position: fixed;    bottom: 0;    z-index: 1000;    width: 100%;    background-color: #ccc;	text-align: center;opacity: 0.95;}
.cookClose {    position: absolute;    top: 7px;right: 103px;font-size: 1.4em;	cursor:pointer;}
#cookieHinweis p:first-child {    margin: 12px 0 0 0;}
.cookTxt{ padding:0 30px; font-size:0.9em;}
.cookieStage  {    margin: 0 auto;    max-width: 620px;    padding: 5px 93px;    position: relative;  }
.highlight {    background-color: #fff;    border: 1px dashed #3d403d;    width: 100%;}
 .fotorahmen { 	 width: 100%;margin-bottom:2em; }

.tempRabattStage {    padding: 10px;    background-color: #9E0056;      color: #fff;    text-align: center; margin-bottom: 4px;}
.tempRabattHead {    font-size: 2em;    margin-bottom: 10px;}
.tempRabattIcon {    font-size: 5em;    font-weight: bold;    margin-bottom: 5px;}
.tempRabattIcon i {    font-size: 0.9em;    margin-left: 5px;}

.HerstAktionTextStage {background-color: #f0f0f0; border-bottom: 8px solid #9e0056; padding: 10px; text-align:center; }
.herstellerAktionFoto {   margin: 0 15px;    flex: 0 auto;}
.herstellerAktionArt {   flex: 1;    display: flex;    align-items: center;    font-size: 1.3em;}
.uebersichtbuttonstage {    text-align: right;}
.basisprodukt{ width:100%;  }
.loadStage.CartContentloadStage {    display: flex;    flex-direction: column;}
.chartButStage { margin-bottom: 180px;  }
.chartButStage2 {     order: -1;}
.headerLangBox {    text-align: center;   padding: 20px ;    border-bottom: 2px dotted #ccc;    font-size: 1.1em;    background-color: #fff;}
.headerLangBox:last-child { border:none;}
.headerLangBox i{font-size: 2.1em;}
.headerLangBox select{ width:100%; text-align:center;font-size: 1.1em;}
.headerLangVersand {    margin-right: 10px;    text-transform: uppercase;}
.headerLangSelect{cursor: pointer;    padding: 0 5px;     position: relative;    top: -2px;    transition: background-color 0.5s ease;}
 
.headerLangStage {    display: flex;}
.headerLangLang {    text-transform: uppercase;}
.einsVierFlex.leftMen.leftMenThemen {    z-index: 2;}
#artDetailStage {
    background-color: #fff;
    padding: 10px;
    box-shadow: 0 0 58px 58px white ;
    -webkit-box-shadow: 0 0 58px 58px white;
    -moz-box-shadow: 0 0 58px 58px white ;
    z-index: 0;
}
.OrderBestellungStage {    display: flex;    flex-direction: column;}
.pulse {
  box-shadow: 0 0 0 rgba(168, 27, 93, 0.4);
  animation: pulse 1s infinite;
}
.markenStartBild{ max-width:200px;}
.TelOrderShopStage {
    padding: 20px;
    background-color: black;
     color: #fff;
	 text-align:center;
	
}
.TelOrderStartStage {    z-index: 300001;    position: relative;}
.buttonTelShop {
   width: 100%;
padding: 10px;
color: #fff;
font-weight: bold;
cursor: pointer;
display: block;
margin: 10px;
box-sizing: border-box;
}
a.buttonTelShop { text-align:center; color:#FFFFFF!important;}
.buttonTelShop:hover {
	background-color:#009900 !important;
}
.shield{
   opacity:0.7;
    filter: alpha(opacity=20);
    background-color:red; 
    width:100%; 
   /* height:100%; */
   height:50px;
    bottom:0; 
    left:0; 
    position:fixed; 
	z-index: 300000;
}
#WaitBut {
    font-size: 1.5em;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fbfb00;
	cursor:default;
}
#WaitBut i {
    font-size: 1.5em !important;
}
#WaitBut .loader {
    margin: 10px;
}
 
.GalleryTn{border: 1px solid #ccc;margin-right: 2px; cursor:pointer;} 
.GalleryActiv{opacity: 0.6;}
.handyTopLinks{ display:none;}
.anmFeld{ height:50px;}

/*  Neuer Kassenbereich Sommer 2019 */

.containerSmall{max-width: 900px; padding:0 15px; margin: 0 auto;}
.kassenInfoTop {   padding: 5px 15px;    background-color: darkgray;    margin-bottom: 10px;    text-align: center;    color: #fff;    font-size: 1.2em;}
.kassenInfoTop a{   color: #fff;   }
.kasseheaderStage {    margin-bottom: 10px;    border-bottom: 4px solid #a0014c;    padding-bottom: 10px;}
.BigButton{ font-size:1.2em; font-weight:bold; width:100%;}
.labeltop{ display: block; position: absolute; top: 9px;   transition: all 0.5s ease; left: 15px; }
.labelfocus{top: -15px; color:#3E3E3E;font-size: 0.7em;left: 5px;}
label.error {    display: block;    font-size: 0.7em;    color: red;    position: absolute;   top: 63px;}
.FormFelder.error {    -webkit-box-shadow: 0px 0px 2px 0px rgba(255,82,82,1);    -moz-box-shadow: 0px 0px 2px 0px rgba(255,82,82,1);    box-shadow: 0px 0px 2px 0px rgba(255,82,82,1);}
.FormFelder {width: 100%; margin-bottom: 20px;padding: 10px;background-color: #fff;border: 1px solid #cfcfcf;box-sizing: border-box;}
.kundenOpenStage {    margin-top: 20px; display:none;}
.FormFelderStage{ position:relative;}
.adressStage{ margin-top: 20px;background-color: beige;padding: 10px;border: 1px solid #ccc;}
h2.underline{ border-bottom:1px solid #ccc;}
.trenner{overflow: hidden;text-align: center;font-size: 1.2em;margin: 15px;font-weight: bold;}
.trenner:before,.trenner:after {  background-color:#a50057;  content: "";  display: inline-block;  height: 2px;  position: relative;  vertical-align: middle;  width: 50%;}
.trenner:before {  right: 0.5em;  margin-left: -50%;}
.trenner:after {  left: 0.5em;  margin-right: -50%;}
.gastWeiterButton{margin: 10px;}


.loginBox {    flex-direction: column;    border: 1px solid #E8E9EB;     background-color: #F9F9F9;margin-bottom: 35px;}
.loginBoxCont{    flex:1;  }
.loginBox h3 {    font-size: 1.2em;    background-color: #626a6d;    padding: 10px;    text-align: center;    color: #fff;    border-bottom: 1px solid #ccc;}
.loginBoxInner {    padding: 15px;    display: flex;    flex: 1;    flex-direction: column;}
.anmeldeButton {    font-size: 1.2em;    text-align: center; }
#login_form {    flex: 1;    display: flex;    flex-direction: column;}
.liMargin li { margin-bottom: 15px;}
 @-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(168, 27, 93, 0.4);
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px rgba(168, 27, 93, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(168, 27, 93, 0);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(168, 27, 93, 0.4);
    box-shadow: 0 0 0 0 rgba(168, 27, 93, 0.4);
  }
  70% {
      -moz-box-shadow: 0 0 0 10px rgba(168, 27, 93, 0);
      box-shadow: 0 0 0 10px rgba(168, 27, 93, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(168, 27, 93, 0);
      box-shadow: 0 0 0 0 rgba(168, 27, 93, 0);
  }
}
@media only screen and (max-width:1920px){}	
 
@media only screen and (max-width:1600px){
 	}
		  
@media only screen and (max-width:1024px){
	.SlideshowStage {
    max-width: 100%;
    width: 100%;
    padding: 10px 00px;
}
.PromoArtBox {width: 24%;}	
.owlPromoArt {  display: flex;    flex-wrap: wrap;    justify-content: space-evenly;}
}
@media only screen and (max-width:930px){	
.handyTopLinks{ display: block; padding:15px;}
.TopLinks{ display:none;}
}
@media only screen and (max-width:880px){	

<!-- ***************ab hier Handy Navi ************-->
 	.sm-simple > li:first-child {
    	margin-left: 7px;
	}
	.zweiDreiFlex,.einsDreiFlex{ width:calc(50% - 20px);}
	.zweispaltenTxt{  column-count:1;}
	#mobileButtonStage{ display: flex;height: 42px;}
	.cartButtonPC,.merkzButtonPC{display:none; }
	#my-menu{ display:none;}
	.handyShow{ display:block !important;}
.handyHide{ display: none !important;}
.DesktopShow{display: none !important;}
.alleMarkenChild,.KategorienChild, .NeuesChild,.KategorienChild li { width: auto!important;}
.navNeuesBox {    width: 100%;}
.alleMarkenChild {  overflow-y: inherit  !important;}
.zweiDreiFlex .secBannerImg img {    height: 100%;    overflow-x: hidden;    width: auto;}
.AktionRahmen {    width: calc( 33% - 10px);}
 
}
@media only screen and (max-width:820px){}
 		
@media only screen and (max-width:768px){	
.sm-mint a .sub-arrow {  display: block !important;margin-right: 18px;}

.detailkorb {    text-align: center;}
.headerBarr {position: relative;}
.topInfoStage { justify-content: space-around; background-color:#b4b4b4; margin-bottom:20px; }
.topInfoCont { margin:0; padding:0;flex: 1 0 auto;text-align: center;border-right: 1px solid #fff; }
.topInfoCont:last-child {border-right: none; }
.topInfoCont a { display:block; width:100%; padding:20px 0; color:#fff !important;}
 .halbFlex{width: 100%;margin-bottom: 20px;}
.produktPreisEinzel {    width: 100%;margin-top: 10px;} 
.sm-simple > li:first-child {margin-left: 0px;}
.main-menu-btn {	display: block!important;	width: auto!important;	text-align: right;	padding: 10px 20px;	margin-right:0px !important;	color:#fff;}
#main-menu {	position: relative !important;	right: 0;	top: 0px !important;	border-bottom: solid #ccc 10px;}
.headerStage { padding-bottom: 0px!important;padding-top: 0px!important;}
.main-menu-btn-icon, .main-menu-btn-icon::before, .main-menu-btn-icon::after {    top: 20px;left: 20px;}
.produktTxtPreisEinzel {    flex-wrap: wrap;}
.bestAdressBox:first-child {    border-bottom: 1px dotted #ccc !important;    padding-bottom: 10px;}
.BestellungCol.bColArtikel {    width: 100%;    margin-bottom: 10px;}
.bColPreis,.bColRabatt {    text-align: left;}
.leftMenThemen{ width:100%;order: 2; padding: 10px;margin-top: 20px;}
.ThemendreiVierFlex{ width:100%;}
.themenweltStage {width: calc(50% - 10px);}
.themennavi {    display: flex;    flex-wrap: wrap;justify-content: space-between;}
.topInfoContLangStage {    justify-content: stretch; display: flex;}
.headerLangStage { width:100%;color: #fff;margin: 5px 10px;}
.headerLangSelect {    width: 100%;      align-content: center;    justify-content: center;}
.handyTopLinks { text-align: center;}

}
@media only screen and (max-width:665px){
	.BestellHeadStep::after {     content: "";}
	.BestellHeadStep {    text-align: center;    padding: 5px;    align-items: left;    display: flex;    justify-content: left;    width: calc(50% - 5px);    box-sizing: border-box;    border: 1px solid #ccc;    margin: 2px;}
	.OrderButton.greenButton {    max-width: initial;}
	.probenartdivStageFirst .probenartdiv {  /*  width: calc(50% - 10px);*/}
	.probenartdivStage {  width: calc(50% - 21px);}
	}
@media only screen and (max-width:617px){
	.PromoArtBox { width:100%;margin: 0;min-height: 280px;}
	.prodTeaserVorschau .PromoArtBox { width:24% !important;margin: 0;min-height: 280px;}
	}
@media only screen and (max-width:600px){
.linkstagePromo { min-height: 280px;}
.zweiDreiFlex,.einsDreiFlex{ width:100%; margin-bottom:20px;}
.leftMen { width: 100%; order:2;/*background-color: #f6f6dd;*/padding: 10px;margin-top: 20px;}
.leftMenu li a{ padding:10px 0; border-bottom:1px dotted	#ccc; display: flex;justify-content: space-between;}
.leftMenu a:after{ font-family: "Font Awesome 5 Pro";content: "\f105";font-weight: 300;margin-left: 3px; }

#leftMenuStage , .dreiVierFlex , .einsVierFlex {  width: 100%;}
#leftMenuStage { margin:0;}
.produktbildEinzel { width: 100%;margin-right: 0px;}
.produktstageEinzel {flex-direction: column;}
.fbcountry {    width: 100%;    box-sizing: border-box;    flex: 1 0 auto !important;}
.ArtikelListeStage .produktstageEinzel,.basisprodukt {    width: calc(50% - 10px);   flex: 0 1 auto;display: flex;flex-direction: column;}
.produktstageEinzel .produktstageEinzel {    width: 100%;}
.produktTxtPreisEinzel { flex-direction: column; flex:1 0 auto!important;}
.produkttxtEinzel {    flex: 1 1 auto;display: flex;flex-direction: column;}
.dropdownFarbVariantStage {    margin-top: auto;}
.produktPreisEinzel {    text-align: left;}
.sonderArtBox.produktstageEinzel .produktstageEinzel{flex: 1 0 auto;}
 .themenSoldout { font-size:1.1em;}
 .cookieStage {    padding: 5px;}
.cookClose {    right: 9px;}
.tabStage ul:first-child {    margin-bottom: 20px;}
.tabStage {    flex: 1;display: flex;flex-direction: column;}
.artvardiv, .artvardiv .produktstageEinzel {    display: flex;}
.artvardiv .produktstageEinzel {    margin-bottom: 0;    padding-bottom: 0;}
.basisprodukt {    padding-bottom: 15px;    margin-bottom: 15px;}
}
@media only screen and (max-width:560px){
  .logoSuchStage {    flex-direction: column;}
  .logoStage { position: relative;top: 0px;width: 90%;margin: 0;margin-bottom: 20px;}
  .sucheStage { text-align: center;    width: 100%;margin-bottom: 20px;}
  #suche {    width: 90%;}  
  .benutzerdatenHalb div {    max-width:100%;}
  .psrahmen {    flex-direction: column;}
  .psrahmenLeft {    margin-bottom: 20px; margin-right:0; text-align:center;}
  .backBut { width:100%;}
  .aktuellesBox { flex-direction: column;}
  .aktuellesBoxTxt {   order: 2; flex:0 0 auto;}
  .aktuellesBoxBild { order: 1;    max-width: 90%;    margin: 0 auto;text-align: center;margin-bottom: 20px;}
   .themenbox {    width: 48%;  }
   .TheminnenClass{ background: none;}
.prboxinnen{box-shadow: none;border: none;padding: 0;border-radius: 0;}
	.ArtikelListeStage .art_text { display:none;}
	.prodTeaserVorschau .PromoArtBox { width:33% !important;margin: 0;min-height: 280px;}
	.RoundIconsBox { width:calc(50% - 20px) !important;}
	
	.ThemenBannerText {  background-color: #d2d2d2;padding: 8px 0;  }
	.ThemenBanner {    width: 33%;}
	.ThemenBannerStage {    flex-wrap: wrap;}
	.ThemenBannerBild {    max-height: 80px;}
	.ThemenBannerStage:not( .homeTheme ) { display:none;}
	}
		
@media only screen and (max-width:450px){	
	.paginationBot {    width: 100%;}
	.infobox {  flex-wrap: wrap;}
	.infoboxIcon { padding: 5px;justify-content: center;width: 100%;}
	.CartContentArtBild {    width: 100%;}
	.CartContentArtText {      text-align: center;    margin-bottom: 10px;}
	.CartContentArtMenge {    margin: 0 5px 0 5px;}
	.flexboxCartContentArt {  }
	.CartContentGiftCheck {     text-align: left;width: 100%;}
	.CartContentGiftCheck .fancy-checkbox {    padding: 10px 0 0 0;     width: 100%;    display: block;}
	.CartContentArtSumme {    width: 65px;}
	.CardTextCheckboxStage .CartContentArtText {   width: 100%;}
	.CartGeschenkFlex .CartContentArtPreis {    text-align: left;    margin-left: 23px;}
	.AktionRahmen {    width: calc( 50% - 10px);}
	.prodTeaserVorschau .PromoArtBox { width:50% !important;margin: 0;min-height: 280px;}
	.bColRabatt,.bColSumme { width:100%;}
	.probenartdivStage {    width: 100%;}
	
	.tempRabattHead {    font-size: 1.2em; }
.tempRabattIcon {    font-size: 3em;}
.tempRabattIcon i {    font-size: 0.9em; }

}	
@media only screen and (max-width:375px){
.CartOrderInputStage {flex-direction: column;text-align: center; align-items: center;  }
.CartOrderInputX i{ padding:5px;}
.RoundIconsBox { width:100% !important;}
 	


.CartOrderInputStage.flexbox {
    flex-wrap: nowrap;
}
.bColSumme {    width: 100%;       margin-top: 10px;}
 	}
@media only screen and (max-width:368px){
	
	 /*.topInfoCont{ display:flex; flex-direction: column;}*/
	 .topTel { margin-right:0;}
	 h1 {    font-size: 2.0rem;}
	 .AktionRahmen {    width: calc( 100%);}

	 	
	}
@media only screen and (max-width:355px){
	 .ArtikelListeStage .produktstageEinzel,.basisprodukt  {   width: 100%;}
 	 .themenbox {    width: 100%;  }	
	}	
		
/* ** CSS f�r "Retina" Ger�te mit h�herer Pixel Ratio *** */

@media screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.logoStage{background-image:url(../img/kosmetikkaufhaus_Logo@2x.jpg)} 
}