@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: "woodmart-font";
	src: url("//order5.apel-datensystem.de/wp-content/themes/woodmart/fonts/woodmart-font-1-700.woff2?v=7.5.1") format("woff2");
}

:root {
	--wd-text-font: "Red Hat Display", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: #777777;
	--wd-text-font-size: 16px;
	--wd-title-font: "Red Hat Display", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 700;
	--wd-title-color: #242424;
	--wd-entities-title-font: "Red Hat Display", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 700;
	--wd-entities-title-transform: none;
	--wd-entities-title-color: rgb(36,36,36);
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: "Red Hat Display", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Red Hat Display", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 700;
	--wd-widget-title-transform: none;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: "Red Hat Display", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 700;
	--wd-header-el-transform: capitalize;
	--wd-header-el-font-size: 15px;
	--wd-primary-color: rgb(18,70,171);
	--wd-alternative-color: rgb(95,171,18);
	--wd-link-color: #333333;
	--wd-link-color-hover: #242424;
	--btn-default-bgcolor: rgb(247,247,247);
	--btn-default-bgcolor-hover: rgb(239,239,239);
	--btn-accented-bgcolor: rgb(18,70,171);
	--btn-accented-bgcolor-hover: rgb(16,64,156);
	--wd-form-brd-width: 0px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-sticky-btn-height: 95px;
}
.woodmart-woocommerce-layered-nav .wd-scroll-content {
	max-height: 300px;
}
.wd-popup.wd-age-verify {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: rgb(248,248,248);
	background-image: url(http://order5.apel-datensystem.de/wp-content/uploads/2022/05/popup-banner.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	--wd-popup-width: 800px;
}
.page-title-default {
	background-color: rgb(40,89,184);
	background-image: none;
	background-size: cover;
	background-position: center center;
}
.footer-container {
	background-color: #ffffff;
	background-image: none;
}
html .wd-nav.wd-nav-secondary > li > a {
	font-family: "Red Hat Display", Arial, Helvetica, sans-serif;
	font-weight: 800;
}
html .product.category-grid-item .wd-entities-title, html .product.category-grid-item.cat-design-replace-title .wd-entities-title, html .wd-masonry-first .category-grid-item:first-child .wd-entities-title, html .product.wd-cat .wd-entities-title {
	font-size: 18px;
	text-transform: none;
}
html .wd-nav-mobile > li > a {
	text-transform: none;
}
.whb-general-header .wd-nav.wd-nav-secondary > li > a {
	font-weight: 400;
	color: rgb(119,119,119);
}
.whb-general-header .wd-nav.wd-nav-secondary > li:hover > a, .whb-general-header .wd-nav.wd-nav-secondary > li.current-menu-item > a {
	color: rgb(36,36,36);
}
html .entry-summary .single_add_to_cart_button, .wd-single-add-cart .single_add_to_cart_button, html .wd-sticky-btn-cart .single_add_to_cart_button, html .wd-sticky-add-to-cart, html .wd-sticky-btn.wd-quantity-overlap div.quantity input[type] {
	font-size: 13px;
	background: rgb(95,171,18);
}
html .entry-summary .single_add_to_cart_button:hover, .wd-single-add-cart .single_add_to_cart_button:hover, html .wd-sticky-btn-cart .single_add_to_cart_button:hover, html .wd-sticky-add-to-cart:hover, html .wd-sticky-btn.wd-quantity-overlap .cart:hover > div.quantity input[type], html .wd-sticky-btn.wd-quantity-overlap .cart:hover > div.quantity+.button {
	background: rgb(84,157,10);
}
html .lost_reset_password .button {
	font-size: 13px;
	color: rgb(255,255,255);
	background: rgb(18,70,171);
}
html .lost_reset_password .button:hover {
	color: rgb(255,255,255);
	background: rgb(16,64,156);
}
body, [class*=color-scheme-light], [class*=color-scheme-dark], .wd-search-form[class*="wd-header-search-form"] form.searchform, .wd-el-search .searchform {
	--wd-form-color: rgb(119,119,119);
	--wd-form-placeholder-color: rgb(119,119,119);
	--wd-form-bg: rgba(15,15,15,0.04);
}
.product-labels .product-label.out-of-stock {
	background-color: rgb(221,51,51);
	color: rgb(255,255,255);
}
.product-labels .product-label.attribute-label:not(.label-with-img) {
	background-color: rgb(238,238,34);
	color: rgb(0,0,0);
}
.wd-popup.popup-quick-view {
	--wd-popup-width: 500px;
}

@media (max-width: 1024px) {
	:root {
		--wd-sticky-btn-height: 95px;
	}

}

@media (max-width: 768.98px) {
	:root {
		--wd-sticky-btn-height: 42px;
	}
	html .product.category-grid-item .wd-entities-title, html .product.category-grid-item.cat-design-replace-title .wd-entities-title, html .wd-masonry-first .category-grid-item:first-child .wd-entities-title, html .product.wd-cat .wd-entities-title {
		font-size: 16px;
	}

}
:root{
--wd-container-w: 1600px;
--wd-form-brd-radius: 0px;
--btn-default-color: #333;
--btn-default-color-hover: #333;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 0px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-default-box-shadow-active: none;
--btn-default-bottom: 0px;
--btn-accented-brd-radius: 0px;
--btn-accented-box-shadow: none;
--btn-accented-box-shadow-hover: none;
--btn-accented-box-shadow-active: none;
--btn-accented-bottom: 0px;
--wd-brd-radius: 0px;
}

@media (min-width: 1617px) {
.platform-Windows .wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}

@media (min-width: 1600px) {
html:not(.platform-Windows) .wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


/* Begin Quick View Customisation */
/* Ausblenden Zurück zu Kategorie in Quick View Ansicht */
.wd-popup-slide-from-left .product-quick-view div.back-to-category {
    display: none;
}

/* Ausblenden "Details Anzeigen" Button */
@media (max-width: 1024px) {
.wd-popup-slide-from-left .wd-popup a.btn.view-details-btn {
    display: none;
   }
}	

/* Ausblenden Zeile Hauptgruppe */
.wd-popup-slide-from-left .product-quick-view .woocommerce-product-attributes-item--attribute_pa_55,
.wd-popup-slide-from-left .product-quick-view .posted_in {
    display: none !important;
}

/* Entfernen der bisherigen, alten Animation */
.wd-popup-slide-from-left .wd-popup {  
  transform: none !important;
}

/* Begin Neue Animation */
/* Definiere die Animation für das Öffnen des modalen Fensters von unten */
@keyframes slideInFromBottom {
  0% {
  transform: translateY(100%);
  }
  100% {
  transform: translateY(0);
  }
}

/* Definiere die Animation für das Schließen des modalen Fensters nach unten */
@keyframes slideOutToBottom {
  0% {
  transform: translateY(0);
  }
  100% {
  transform: translateY(100%);
  }
}        
		
/* Definiere die Animation für das Öffnen des modalen Fensters von rechts */
@keyframes slideInFromRight {
  0% {
  transform: translateX(50%);
  }
  100% {
  transform: translateX(0);
  }
}

/* Definiere die Animation für das Schließen des modalen Fensters nach rechts */
@keyframes slideOutToRight {
  0% {
  transform: translateX(0);
  }
  100% {
  transform: translateX(50%);
  }
}

/* Wende die Animationen nur auf Desktop-Systemen an */
@media (min-width: 768px) {
  /* Wende die Animation für das Öffnen des modalen Fensters von rechts an */
  .wd-popup-slide-from-left .mfp-content {
    animation: slideInFromRight 0.5s cubic-bezier(0.19, 1, 0.22, 1) !important;
    /* Aktiviere die Hardware-Beschleunigung */
    transform: translate3d(0,0,0);
    /* Informiere den Browser, dass eine Transformation stattfinden wird */
    will-change: transform;
  }

  /* Wende die Animation für das Schließen des modalen Fensters nach rechts an */
  .wd-popup-slide-from-left.mfp-removing .mfp-content {
    animation: slideOutToRight 0.5s cubic-bezier(0.19, 1, 0.22, 1) !important;
    /* Aktiviere die Hardware-Beschleunigung */
    transform: translate3d(0,0,0);
    /* Informiere den Browser, dass eine Transformation stattfinden wird */
    will-change: transform;
  }
}

/* Wende die Animationen nur auf Mobilgeräten an */
@media (max-width: 767px) {
  /* Wende die Animation für das Öffnen des modalen Fensters von unten an */
  .wd-popup-slide-from-left .mfp-content {
    animation: slideInFromBottom 0.4s cubic-bezier(0.19, 1, 0.22, 1) !important;
    /* Aktiviere die Hardware-Beschleunigung */
    transform: translate3d(0,0,0);
    /* Informiere den Browser, dass eine Transformation stattfinden wird */
    will-change: transform;
  }
  
  /* Wende die Animation für das Schließen des modalen Fensters nach unten an */
  .wd-popup-slide-from-left.mfp-removing .mfp-content {
    animation: slideOutToBottom 0.4s cubic-bezier(0.19, 1, 0.22, 1) !important;
    /* Aktiviere die Hardware-Beschleunigung */
    transform: translate3d(0,0,0);
    /* Informiere den Browser, dass eine Transformation stattfinden wird */
    will-change: transform;
  }
}
/* End Neue Animation */

/* Begin Layoutanpassungen des Quick View für >767 und <767 oder für beide Fälle */
/* Setze Layer nach rechts und nicht mittig, Abstände oben und unten zum Bildschirmrand auf 0 setzen */
@media (min-width: 768px) {	
	/* Begin Layer soll scrollbar sein */
	/* Setze die overflow Eigenschaft für den gesamten Layer (grauer Bereich) */
	.wd-popup-slide-from-left .mfp-wrap {
	  overflow-y: hidden !important;
		overflow-x: hidden !important; /* Verhindert kurzes Anzeigen eines horizontalen Scrollbalkens solange Layer lädt */
	}

	/* Setze die max-height Eigenschaft für den Inhaltsbereich */
	.wd-popup-slide-from-left .wd-scroll-content {
  	max-height: none !important;
	}

	/* Inhaltsbereich soll scrollbar bleiben, auch wenn komplette Höhe des Browserfensters eingenommen wird */
	.wd-popup-slide-from-left div.wd-popup.popup-quick-view {
  	height: 100%;
  	overflow: auto;
  	overflow-x: hidden;
	}	
	/* End Layer soll scrollbar sein */

	/* Rechts vom Layer ist ein kleiner Abstand von 8px, der wird auf 0 gesetzt */
	.wd-popup-slide-from-left .mfp-container { 
    padding-right: 0px !important;	
	}
	
	.wd-popup-slide-from-left .wd-popup {
    margin-right: 0px !important;
    margin-left: auto !important;
    height: 100% !import;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

	/* Layer soll komplette Höhe des Browserfensters einnehmen */
	.wd-popup-slide-from-left .mfp-content {
    height: 100% !important;
  }
}

/* Deaktiviere den Fade-Out-Effekt, der unten im Layer im Standard implementiert war bei Auflsg. > 769 px */
@media (min-width: 769px) {
  .wd-popup-slide-from-left .popup-quick-view .entry-summary {
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }
}

/* Wende die Anpassungen nur auf Mobilgeräten an */
@media (max-width: 767px) {
	/* Begin Layer soll scrollbar sein */
	/* Setze die overflow Eigenschaft für den gesamten Layer (grauer Bereich) */
	.wd-popup-slide-from-left .mfp-wrap {
	  overflow-y: hidden !important;
		overflow-x: hidden !important; /* Verhindert kurzes Anzeigen eines horizontalen Scrollbalkens solange Layer lädt */
	}

	/* Setze die max-height Eigenschaft für den Inhaltsbereich */
	.wd-popup-slide-from-left .wd-scroll-content {
  	max-height: none !important;
	}

	/* Inhaltsbereich Layer soll scrollbar bleiben */
	.wd-popup-slide-from-left div.wd-popup.popup-quick-view {
  	height: 100%;
  	overflow: auto;
  	overflow-x: hidden;
	}	
	/* End Layer soll scrollbar sein */	

  /* Rechts und links vom Layer ist ein kleiner Abstand von 8px, der wird auf 0 gesetzt */
  .wd-popup-slide-from-left .mfp-container { 
     padding-right: 0px !important;	
		 padding-left: 0px !important;				
   }

   /* Setze Layer mittig */
  .wd-popup-slide-from-left .wd-popup {
     border-top-left-radius: 15px !important;
     border-top-right-radius: 15px !important;  
     margin-bottom: 0px !important; 		
	}
		
  /* Setze die Höhe des Layers auf 80% bzw. 50 % ohne Bild */
  .wd-popup-slide-from-left .mfp-content {
     height: 50% !important;  /* Wenn Bild ausgeblendet (siehe unten, genügt 50%, sonst 80% mit Bild) */
     position: fixed !important;
     bottom: 0 !important;
     right:0 !important
  }
	
  /* Ausblenden Bild + Platzhalterbild oben im Quick View */  
  .wd-popup-slide-from-left .mfp-content .woocommerce-product-gallery__image {
    display: none;
  }	
  .wd-popup-slide-from-left .mfp-content .woocommerce-product-gallery__image--placeholder {
    display: none;
  }	
		
	/* hier noch rausnehmen was nicht gebraucht wird */
    .mfp-bg, .mfp-wrap, .mfp-container, .mfp-iframe-scaler iframe {
      overflow-y: hidden !important;
	}

  /* hier noch rausnehmen was nicht gebraucht wird */
    body {
      overflow-y: hidden !important;
			overflow-x: hidden !important;			
		}
}

.wd-buttons .wd-quick-view-icon, .wd-buttons .wd-compare-btn { 
display: block !important; 
}

/* Hiding SKU and tags from Product Quick View 
.product-quick-view .product-image-summary .entry-summary .product_meta .sku_wrapper{
display:none;
}
.product-quick-view .product-image-summary .entry-summary .product_meta .tagged_as{
display:none;
}
*/
/* End Quick View Customisation */




/* Optimierung Kasse Seite Begin Responsiveness */
@media (min-width: 768px) {
	.page-id-14 .elementor-column.elementor-col-50, .elementor-column[data-col="50"] {
    width: auto !important;
	}
}
@media (min-width: 1200px) {
	.page-id-14 .elementor-column.elementor-col-50, .elementor-column[data-col="50"] {
    width: 80% !important;
	}
}    
@media (max-width: 599px) {
	.page-id-14 .wd-checkout-prod-img {
		display: none !important;
	}
}
@media (max-width: 599px) {
	.page-id-14 .wd-checkout-remove-btn-wrapp {
    margin-inline: -5px 20px !important;
	}
}
@media (max-width: 599px) {
	.page-id-14 .wd-checkout-prod-total.product-total {
		padding-top: 5px !important;
		font-weight: 800 !important;
		text-align: right !important;
	}
}
/* Optimierung Kasse Seite End Responsiveness */

/* Begin One Page Checkout */ 
/* Ausblenden Mini Cart Warenkorb Button */
.woocommerce-mini-cart__buttons .btn-cart {
    display: none !important;
}

/* Formatierung Grundpreis auf der Kassenseite Begin */
.page-id-14 .unit-price-cart {
    font-size: .8em !important;
    display: block !important;
    margin-top: 0px !important;     
}
.wd-entities-title .unit-price-cart {
    display: none;
}
/* Anzeige von Einheitspreis auf der Kassenseite End */
/* End One Page Checkout */ 

/* Ausblenden der Links auf der Homepage rechts oben von Bestseller, Aktionen, Neue Produkte */
.wd-tabs .wd-nav-tabs .wd-active .nav-link-text {
    display: none;
}

/* Lieferzeiten ausblenden im Sticky Add To Cart Button der auf Aritkeldetailseite unten angezeigt wird, weil kein Platz */
.wd-sticky-btn.wd-sticky-btn-shown .wd-sticky-btn-container.container .wd-sticky-btn-cart .woocommerce-message {
    display: none;
}

/* Meine Favoriten Layer Begin */ 
.pum-theme-13583 .pum-content, .pum-theme-enterprise-blue .pum-content {
    max-height: 85vh !important;    
    height: 85vh !important;    
    overflow-y: auto;
    overflow-x: hidden;		
}

#popmake-13646 .wd-my-account-sidebar {
    display: none;
}
#popmake-13646 .wd-group-enable .wd-wishlist-head {    
    display: none;
}
#popmake-13646 .wd-group-enable .wd-wishlist-bulk-action {
    display: none;
}
#popmake-13646 .wd-wishlist-product-actions {
    display: none;
}
#popmake-13646 .wd-buttons .wd-quick-view-icon {
    display: none !important;
}
/* Artikelzahl je Reihe in abh. der Bildschirmauflösung */
@media (min-width: 1501px) {
    #popmake-13646 .col-lg-4 {
        flex: 0 0 16.6667%;  
        max-width: 16.6667%;			
    }
}

@media (min-width: 1351px) and (max-width: 1500px) {
    #popmake-13646 .col-lg-4 {
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (min-width: 951px) and (max-width: 1350px) {
    #popmake-13646 .col-lg-4 {
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }
}

@media (min-width: 769px) and (max-width: 950px) {
    #popmake-13646 .col-lg-4 {
        flex: 0 0 50%;
        max-width: 50%;
    }
}
/* Meine Favoriten Layer End */ 

/* Meine Kaufhistorie Layer */ 
.elementor-13629 .elementor-element.elementor-element-5aefa94 > .elementor-element-populated {    
    max-height: 85vh !important;    
    height: 85vh !important;    
    overflow-y: auto;
    overflow-x: hidden;		
}
.elementor-13629 .wd-buttons .wd-quick-view-icon {
    display: none !important;
}

/* Mobile List View: Nach 7.3 muss dieser Code dazu, damit Listendarstellung funktioniert, ist dieser Code nicht aktiv, dann 1 Produkt Kacheldarstellung */
body .product-list-item .product-wrapper {
	flex-direction: row;
}

body .product-list-item .product-element-top {
	margin-right: 0 !important;
}

body .product.product-list-item .wd-add-btn {
	justify-content: end;
}

/* Begin Optimierung Favoriten unter "Mein Konto" */
body.page-id-291 .wd-wishlist-group {    
    border: 0px !important;    
}

body.page-id-291 .woocommerce-MyAccount-content {
    padding-left: 0px;
    padding-right: 0px;
}

body.page-id-291 .wd-group-enable .wd-wishlist-head {
    margin-top: -10px;
    margin-right: 20px;
}		
}
/* Ende Optimierung Favoriten unter "Mein Konto" */

/* Optimierung Artikeldarstellung auf Shop und Kategorieseiten */
@media (min-width: 1551px) {
		.products.wd-products.wd-grid-g.grid-columns-6.elements-grid.products-bordered-grid-ins.wd-quantity-enabled.pagination-infinit.wd-stretch-cont-lg.wd-stretch-cont-md.wd-stretch-cont-sm {
    --wd-col-lg: 6 !important;
	}
}

@media (min-width: 1024px) and (max-width: 1550px) {
	.products.wd-products.wd-grid-g.grid-columns-6.elements-grid.products-bordered-grid-ins.wd-quantity-enabled.pagination-infinit.wd-stretch-cont-lg.wd-stretch-cont-md.wd-stretch-cont-sm {
    --wd-col-lg: 4 !important;
	}
    .shop-view.per-row-5,
    .shop-view.per-row-6 {
        display: none;
    }
}

/* Globales CSS für die Darstellung der Artikel auf den Shopseiten...wenn die Umschaltung möglich sein soll auch bei Tablets (da wird im Standard nur Kacheldarstellung angezeigt -> damit dieses CSS Sinn macht muss die Layout3 CSS auch im Tabletmode aktiviert sein */
@media (min-width: 769px) and (max-width: 1024px) {
    .shop-view.per-row-2,
    .shop-view.per-row-4,
    .shop-view.per-row-5,
    .shop-view.per-row-6 {
        display: none;
    }
}
@media (min-width: 768px) and (max-width: 768px) {
    .shop-view.per-row-3,
    .shop-view.per-row-4,
    .shop-view.per-row-5,
	  .shop-view.per-row-6 {
        display: none;
    }
}

/* Begin Schnelleingabeformular I */
/* Ausblenden Search Bar im Header auf dem Quick Order Formular */
.page-id-12429 .wd-search-form {
    visibility: hidden;
}

/* Ausblenden Platzhaltenbild "Keine Produkte" im Quick Order Formular"  */
.page-id-12429 .b2bking_bulkorder_container_final img[src*="no_products.svg"] {
    visibility: hidden;
}

/* Ausblenden Mein Bestellformular Link unter Mein Konto -> wird erzeugt vom Quick Order Formular */
.woocommerce-MyAccount-navigation-link--bestellung-schnelleingabe {
    display: none !important;
}

/* Ausblenden von überflüssigen Informationen - konkret Produkteigenschaften die on mouse over in den Artikelkarten (das sind in der Regel (auf jeden Fall die Hauptgruppe) nur interne Informationen aus der ADS Anwendung, die dem Endkunden keinen Mehrwert bieten) - erscheinen - Ausblenden des Elements, wenn man mit der Maus über das übergeordnete Element mit der Klasse product-grid-item fährt. Auf den Artikeldetailseiten bleiben die Informationen bestehen! 
*/
/* Lieferland 
.product-grid-item .woocommerce-product-attributes-item--attribute_pa_22 {
    display: none;
}

/* HKL */
.product-grid-item .woocommerce-product-attributes-item--attribute_pa_33 {
    display: none;
}

/* Hauptgruppe */
.product-grid-item .woocommerce-product-attributes-item--attribute_pa_55 {
    display: none;
}

/* Einzeleinheit 
.product-grid-item .woocommerce-product-attributes-item--attribute_pa_111 {
    display: none;
}

/* Gebinde 
.product-grid-item .woocommerce-product-attributes-item--attribute_pa_99 {
    display: none;
}  

/* Ausblenden Testimonials Bild */
.wd-testimon-thumb {
    display: none;
}

/* Homepage: Link Element Bestseller / Sonderangebot (nur mobil sichtbar) vertikale Abstände */
.elementor-8477 .elementor-element.elementor-element-cd245b6:not(.elementor-motion-effects-element-type-background), .elementor-8477 .elementor-element.elementor-element-cd245b6 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    margin-bottom: -40px !important;
    margin-top: -25px !important;
}

/* Ausblenden Copy und Preisinfos im Footer */
@media (max-width: 1024px) {
	body:not(.home) .vat-info,
	body:not(.home) .copyrights-wrapper {
    display: none !important;
	}
}

/* Footer kompakt zentriert  */ 
@media(max-width: 1024px) {
    .elementor-13493 .elementor-element.elementor-element-63435f8 {
        width: 100% !important;
    }
    .elementor-13493 .elementor-element.elementor-element-d786061 {
        width: 0% !important;
    }
    .elementor-13493 .elementor-element.elementor-element-847813e {
        width: 0% !important;
    }
}

/* B2B Preis+Kauf nach Anmeldelink Farbegestaltung*/
.anmelde_link {
    color: #1246ab !important;
}

/* Passwort Zurücksetzen Seite */
/* Schriftgröße 100% statt 110% */
.lost_reset_password {
  font-size: 100% !important;
}

/* Anmelde bzw. Registrierungsseite Begin */
/* Mobil den vertikalen Abstand zwischen dem Anmeldeformular und dem Registrierungsformular erhöhen  -> Bei AJAX Anmeldung/Registrierung nicht notwendig 
.col-register {
  margin-top: 50px !important;
}
*/

/* Vertikalen Abstand ODER Divider erhöhen <768px*/
@media (max-width: 768px) {
	.wd-login-divider {
	  margin-top: 50px !important;
	  margin-bottom: 50px !important;
	}
}	
/* Anmelde bzw. Registrierungsseite Ende */

/* Suche Begin */
/* Suche Search Suggestions vom Standardformular 2 statt 4 Produkte nebeneinander (vorher Wert 240px) 
   Macht nur Sinn wenn Search Suggestions nicht Full Screen angezeigt werden! */
.autocomplete-suggestions {    
    grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)) !important;
}

@media (max-width: 600px) {
  /* Suchvorschläge < 600 nicht anzeigen */
	.search-results-wrapper { 
    display: none;
	}
  /* Suchlupe rechts dauerhaft einblenden, Loading Indicator der Ajax Suche nicht anzeigen */
	.searchform.search-loading .searchsubmit:before {
    display: none !important;
	}
	.searchform.search-loading .searchsubmit:after {
    opacity: 1 !important;
	}
}
/* Suche Ende */

/* Kacheldarstellung entfernen Strich, der direkt unter Add to Cart Button sitzt, onmouseover 
.wd-hover-fw-button .hover-content-wrap {
    border-top: 0px solid var(--brdcolor-gray-300) !important; 
}

/* Regeln Salesking Begin */
/* Begin Warenkorb Seite Buttons und DIV oben mit Buttons */
@media (min-width: 1025px) {
    body.page-id-13 .buttonsoben:after {
        content: "";
        display: block;
        height: 30px;
    }
}

@media (min-width: 577px) {
    .page-id-13 .col-12.order-first.order-md-last.col-md-auto button + button,
    .page-id-13 .col-12.order-first.order-md-last.col-md-auto button + input[type="submit"],
    .page-id-13 .col-12.order-first.order-md-last.col-md-auto input[type="submit"] + button,
    .page-id-13 .col-12.order-first.order-md-last.col-md-auto input[type="submit"] + input[type="submit"],
    .page-id-13 .col-12.order-first.order-md-last.col-md-auto a + button,
    .page-id-13 .col-12.order-first.order-md-last.col-md-auto a + input[type="submit"],
    .page-id-13 .col-12.order-first.order-md-last.col-md-auto button + a,
    .page-id-13 .col-12.order-first.order-md-last.col-md-auto input[type="submit"] + a {
        margin-left: 10px;
    }
}
@media (max-width: 576px) {
    .page-id-13 .weitereinkaufen {
        margin-top: 10px;
    }
}


@media (max-width: 1024px) {
	  .page-id-13 .col-12.order-first.order-md-last.col-md-auto.buttonsoben {
  		  margin-top: -15px;
    		margin-bottom: 40px;
		}
}

/* Preis */
@media (max-width: 768.98px) {
		.page-id-13 .product-price input[type="number"] {
		    width: 105px;
				height: 40px;
				//font-size: 18px !important; 
		}
}

/* Menge */	
@media (max-width: 768.98px) {
    body.page-id-13 :is(.woocommerce-cart-form__contents,.group_table) td.product-quantity :is(input[type="button"],input[type="number"],input[type="text"]) {
        height: 45px;
    }
}

/* Zwischensumme */
@media (max-width: 768.98px) {
		.page-id-13 .shop_table tr :is(td,th):last-child {
  		  text-align: right;
	  	  margin-top: 25px;    
	}
		.page-id-13 td.product-subtotal span {
	 	   font-size: 18px !important;
	}
}
/* Ende Warenkorb Seite Buttons und DIV oben mit Buttons */
/* Regeln für Salesking */

/* Begin Mein Konto - Linke Navigation bei Auflösung < Bildschirmauflösung Abstand erhöhen im Contentbereich damit es Mobil besser aussieht */
@media (max-width: 768.98px) {
.woocommerce-MyAccount-content {
    padding-left: 45px;
    padding-right: 45px;
  }
}
/* Begin Mein Konto - Linke Navigation bei Auflösung < Bildschirmauflösung Abstand erhöhen im Contentbereich damit es Mobil besser aussieht */

/* Begin Mein Konto - Linke Navigation Breite in abh. der Bildschirmauflösung angepasst */
@media (min-width: 769px) {
    .wd-my-account-sidebar {
        flex: 1 0 25%;
        max-width: 25%;
        width: 25%;
        border-inline-end: 1px solid var(--brdcolor-gray-300);
    }

    @media (min-width: 1401px) {
        .wd-my-account-sidebar {
            flex: 1 0 17.5%;
            max-width: 17.5%;
            width: 17.5%;
        }
    }

    @media (min-width: 1200px) and (max-width: 1400px) {
        .wd-my-account-sidebar {
            flex: 1 0 20%;
            max-width: 20%;
            width: 20%;
        }
    }

    @media (min-width: 1050px) and (max-width: 1200px) {
        .wd-my-account-sidebar {
            flex: 1 0 22.5%;
            max-width: 22.5%;
            width: 22.5%;
        }
    }
}
/* Begin Mein Konto - Linke Navigation Breite in abh. der Bildschirmauflösung angepasst */

/* Begin Mein Konto - Rechter Bereich Content Breite in abh. der Bildschirmauflösung angepasst */
.woocommerce-MyAccount-content {
    flex: 1 0 75%;
    max-width: none !important;
    width: auto !important;
}
/* End Mein Konto - Rechter Bereich Content Breite in abh. der Bildschirmauflösung angepasst */

/* Begin Mein Konto - Seite "Gekaufte Artikel" - Artikelzahl je Reihe in abh. der Bildschirmauflösung angepasst */
@media (min-width: 1501px) {
    .page-id-15 .grid-columns-5 {
   	  --wd-col-lg: 6 !important;
    }
}

@media (min-width: 1251px) and (max-width: 1500px) {
    .page-id-15 .grid-columns-5 {
   	  --wd-col-lg: 5 !important;
    }
}

@media (min-width: 769px) and (max-width: 1250px) {
    .page-id-15 .grid-columns-5 {
   	  --wd-col-lg: 3 !important;
    }
    .page-id-15 [class*="wd-grid"] {
     --wd-col: var(--wd-col-lg) !important; 
    }
}

@media (min-width: 769px) and (max-width: 950px) {
    .page-id-15 .grid-columns-5 {
   	  --wd-col-lg: 2 !important;
    }
    .page-id-15 [class*="wd-grid"] {
     --wd-col: var(--wd-col-lg) !important; 
    }
}
/* End Mein Konto - Seite "Gekaufte Artikel" - Artikelzahl je Reihe in abh. der Bildschirmauflösung angepasst */

/* Begin Mein Konto - Seite "Merkliste" - Artikelzahl je Reihe in abh. der Bildschirmauflösung + Entfernen X Button und Checkbox layouttechnisch Abstände angepasst */
@media (min-width: 1501px) {
    .page-id-291 .grid-columns-4 {
      --wd-col-lg: 5 !important;		
    }
}

@media (min-width: 1251px) and (max-width: 1500px) {
    .page-id-291 .grid-columns-4 {
			--wd-col-lg: 4 !important;		
    }
}

@media (min-width: 769px) and (max-width: 1250px) {
    .page-id-291 .grid-columns-4 {
			--wd-col-lg: 3 !important;
      --wd-col-md: 3 !important;		
    }
}
/* Entfernen X Button und Checkbox layouttechnisch Abstände angepasst */
.wd-wishlist-product-actions {
    margin-bottom: 15px;
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px;
}
/* End Mein Konto - Seite "Merkliste" - Artikelzahl je Reihe in abh. der Bildschirmauflösung + Entfernen X Button und Checkbox layouttechnisch Abstände angepasst */

/* Begin Warenkorb Seite und die Buttons "Warenkorb leeren" und "Weiter einkaufen" */
/* Fixing schlechtes Design */
@media (min-width: 1025px) {
.page-id-13 .cart-actions {
    display: inline-flex !important;
  }
}

@media (max-width: 1024px) {
.cart-table-section .cart-actions {
    flex-direction: column;
    align-items: normal !important;
    margin-bottom: 0;
  }
}

@media (max-width: 576px) {
    .page-id-13 .col-md-auto input[name="evolution_empty_cart"] {
        margin-top: 10px;
        margin-left: 0 !important;
    }
    .page-id-13 .col-md-auto {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
}
/* End Warenkorb Seite und die Buttons "Warenkorb leeren" und "Weiter einkaufen" */

/* Begin Gestaltung Anzahl Artikel abh. von Auflösung für "Übersicht meist verkaufte Artikel", "Empfohlene Artikel (Aktionen)", "Besuchte Artikel", "Neue Artikel", "Gekaufte Artikel", "Artikel, die nicht auf Lager sind", "Artikel, mit geringen Lagerbeständen", "Artikel, die vorbestellt werden müssen", "Alternatives Schnellbestellungsformular II auf normaler Seite" */
/* Von 1251px bis 1500px sollen 5 Produkte nebeneinander in der Kacheloptik dargestellt werden; >1500px wie im Standard 6 */
@media (min-width: 1251px) and (max-width: 1500px) {
    .page-id-12035 .col-lg-2,
    .page-id-12010 .col-lg-2,
    .page-id-12023 .col-lg-2,
    .page-id-12079 .col-lg-2,
    .page-id-12390 .col-lg-2,
    .page-id-13187 .col-lg-2,
    .page-id-13188 .col-lg-2,
    .page-id-13189 .col-lg-2,
    .page-id-13295 .col-lg-2
  	{
        flex: 0 0 20%;
        max-width: 20%;
    }
}

/* Von 769px bis 999px sollen 3 Produkte nebeneinander in der Kacheloptik dargestellt werden */
@media (min-width: 769px) and (max-width: 999px) {
    .page-id-12035 .col-md-3,
    .page-id-12010 .col-md-3,
    .page-id-12023 .col-md-3,
    .page-id-12079 .col-md-3,
    .page-id-12390 .col-md-3,
    .page-id-13187 .col-md-3,
    .page-id-13188 .col-md-3,
    .page-id-13189 .col-md-3,
    .page-id-13295 .col-md-3
	  {
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }
}

/* Von 1000px bis 1250px sollen 4 Produkte nebeneinander in der Kacheloptik dargestellt werden */
@media (min-width: 1000px) and (max-width: 1250px) {
    .page-id-12035 .col-md-3,
    .page-id-12010 .col-md-3,
    .page-id-12023 .col-md-3,
    .page-id-12079 .col-md-3,
    .page-id-12390 .col-md-3,
    .page-id-13187 .col-md-3,
    .page-id-13188 .col-md-3,
    .page-id-13189 .col-md-3,
    .page-id-13295 .col-md-3
	  {
        flex: 0 0 25%;
        max-width: 25%;
    }
}
/* End Gestaltung Anzahl Artikel abh. von Auflösung für "Übersicht meist verkaufte Artikel", "Empfohlene Artikel (Aktionen)", "Besuchte Artikel", "Neue Artikel", "Gekaufte Artikel", "Artikel, die nicht auf Lager sind", "Artikel, mit geringen Lagerbeständen", "Artikel, die vorbestellt werden müssen", "Alternatives Schnellbestellungsformular II auf normaler Seite"  */

/* Begin Gestaltung Anzahl Artikel abh. von Auflösung für "Ajax Produkt Tabs Element auf Homepage" */
/* Von 1251px bis 1500px sollen 5 Produkte nebeneinander in der Kacheloptik dargestellt werden; >1500px wie im Standard 6 */
@media (min-width: 1251px) and (max-width: 1500px) {
    .page-id-8477 .products.wd-products {
    --wd-col-lg: 6 !important;
	}
}

@media (min-width: 1000px) and (max-width: 1250px) {
    .page-id-8477 .products.wd-products {
    --wd-col-lg: 4 !important;
	}
}

@media (min-width: 769px) and (max-width: 999px) {
    .page-id-8477 .products.wd-products {
    --wd-col-lg: 3 !important;
	}
}
/* End Gestaltung Anzahl Artikel abh. von Auflösung für "Ajax Produkt Tabs Element auf Homepage" */

/* Begin Schnelleingabeformular I Cream - Layer Popup Höhe definieren, horizontalen Scollbalken unterdrücken, vertikalen automatisch anzeigen aber nur im Layer der im HTML Block [html_block id="12439"] liegt */
[data-elementor-id="12439"] .b2bking_bulkorder_container_final {
    max-height: 65vh;
}

[data-elementor-id="12439"] .b2bking_bulkorder_form_container.b2bking_bulkorder_form_container_indigo.b2bking_bulkorder_form_container_cream {
    max-height: 65vh;
}

[data-elementor-id="12439"] .b2bking_bulkorder_form_cream_main_container {
    height: 65vh;
    max-height: 65vh;
    overflow-y: auto;
    overflow-x: hidden;
}
/* End Schnelleingabeformular I Cream - Layer Popup Höhe definieren, horizontalen Scollbalken unterdrücken, vertikalen automatisch anzeigen aber nur im Layer der im HTML Block [html_block id="12439"] liegt */

/* Begin Schnelleingabeformular II Layer - Woodmart Produktdarstellung - Quick View und Merkliste Icon raus */
.elementor-13303 .wd-buttons.wd-pos-r-t {
    display: none;
}

/* Von 1251px bis 1500px sollen 5 Produkte nebeneinander in der Kacheloptik dargestellt werden; >1500px wie im Standard 6 */
@media (min-width: 1251px) and (max-width: 1500px) {
    .elementor-13303 .col-lg-2 {
        flex: 0 0 20%;
        max-width: 20%;
    }
}

/* Von 769px bis 999px sollen 3 Produkte nebeneinander in der Kacheloptik dargestellt werden */
@media (min-width: 769px) and (max-width: 999px) {
    .elementor-13303 .col-md-3 {
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }
}

/* Von 1000px bis 1250px sollen 4 Produkte nebeneinander in der Kacheloptik dargestellt werden */
@media (min-width: 1000px) and (max-width: 1250px) {
    .elementor-13303 .col-md-3 {
        flex: 0 0 25%;
        max-width: 25%;
    }
}
/* End Schnelleingabeformular II Layer - Woodmart Produktdarstellung - Quick View und Merkliste Icon raus */

/* Grüner Haken vor Lagerstatus "instock" entfernen */
/* Auf der Artikeldetailseite und in der Schnellansicht */
p.stock.wd-style-with-bg.in-stock span::before {
  margin-inline-end: 5px;
  content: none !important;
  font-family: "woodmart-font";
}
/* Grüner Haken vor Lagerstatus "instock" entfernen */

/* Grüner Haken vor Lagerstatus "custom-status1" bis "custom-status5" entfernen */
p.stock.wd-style-with-bg.custom-status-1 span::before,
p.stock.wd-style-with-bg.custom-status-2 span::before,
p.stock.wd-style-with-bg.custom-status-3 span::before,
p.stock.wd-style-with-bg.custom-status-4 span::before,
p.stock.wd-style-with-bg.custom-status-5 span::before {
  margin-inline-end: 5px;
  content: none !important;
  font-family: "woodmart-font";
}
/* Grüner Haken vor Lagerstatus "custom-status-1" bis "custom-status-5" entfernen */

/* Custom Stock Status "custom-status-1" bis "custom-status-5" genauso designen wie in stock und availablle on backorder, könnte natürlich individualisiert werden Begin */
p.stock.wd-style-with-bg:is(.custom-status-1, .custom-status-2, .custom-status-3, .custom-status-4, .custom-status-5) span {
  background-color: #F1F7EB;
  color: #85B951;
}
/* Custom Stock Status "custom-status-1" bis "custom-status-5" genauso designen wie in stock und availablle on backorder, könnte natürlich individualisiert werden End */

/* Labels die im Standard nicht von Woodmart mitgebracht werden per CSS designen (Lagerstatus) Begin */
.product-labels {
    top: 7px !important;
    max-width: 75% !important; 
}
.product-label {
	  text-transform: none !important;  /* War vorher auf uppercase! */
}
.product-labels .product-label.in-stock {
	background-color:#438e44;
}
.product-labels .product-label.on-backorder {
  background-color:#438e44; 	
	/* background-color:#d89b65; // helles braun */
}
.product-labels .product-label.custom1 {
  background-color:#438e44;	
	/* background-color:#5562ed; // Blau */
}
.product-labels .product-label.custom2 {
	background-color:#d89b65;
}
.product-labels .product-label.custom3 {
	background-color:#d89b65;
}
.product-labels .product-label.custom4 {
	background-color:#d89b65;
}
.product-labels .product-label.custom5 {
	background-color:#d89b65;
}
/* Labels die im Standard nicht von Woodmart mitgebracht werden per CSS designen (Lagerstatus) End */

/* Layout Hintergrundfarbe der aktivierten/geklickten Swatches/Buttons bei variablen Produkten, die die Gebindegrößen vorgeben auf den Kacheln, der Schnellanzeigeansicht und der Artikeldetailansicht  */
[class*="wd-swatches"].wd-text-style-4 .wd-swatch.wd-text:is(.wd-active,:hover:not(.wd-disabled)), [class*="wd-swatches"].wd-text-style-4 :is(.wd-swatch-wrap a:hover,.wd-swatch-wrap.wd-active) .wd-swatch.wd-text {
	  /* Vorschlag 1: Schwarz (Standard)
    border-color: var(--color-gray-900);
    background-color: var(--color-gray-900);
    color: var(--color-white);
	  */
    /* Vorschlag 2: Dunkelblau wie die restlichen Buttons 
    border-color: var(--color-gray-900);
    background-color: #313ba9 !important;
    color: var(--color-white);
	  /* Vorschlag 3: grün wie die Buttons in den Warenkorb legen auf der Schnellansicht und den Artikeldetailseiten */
    border-color: #5bad20 !important;
    background-color: #5bad20 !important;
    color: var(--color-white);
}

/* Bei  aktivierten/geklickten Swatches/Buttons bei variablen Produkten, die die Gebindegrößen vorgeben, das ausgewählte Gebinde nochmals als Label hingeschrieben auf der Artikeldetailseite -> nimmt insb. mobil zuviel Platz weg -> deswegen wird das Label überall ausgeblendet, der Nutzer erkennt an der Hintergrundfarbe welches Gebinde er ausgewählt hat so wie bei allen anderen Bildschirmauflösungen  */ 
table.variations .label span {
    margin-left: 5px;
    display: none !important;
}

/* Auf der Suchergebnisseite kann - bspw. wenn keine Suchergebnistreffer vorliegen - eine weitere Suchmöglichkeit erscheinen. Diese macht keinen Sinn, da über den Header schon gesucht werden kann, deswegen wird die weitere Suchmöglichkeit ausgeblendet */
.no-products-footer .wd-search-form {
    display: none;
}

/* Produktsuche "Formular": also Suchvorschläge direkt sichtbar, das Dropdown "Kategorie wählen" im Suchfeld breiter setzen und z-index verändern, da sonst Suchergebnisse ÜBER dem Dropdown liegen Hinweis: im Moment nicht im Einsatz weil Vollbild Suche aktiv, wenn Suche "Formular" aktiv sein soll dann muss nachfolgender Code aktiv sein! */
.wd-dropdown-search-cat.wd-design-default {
   z-index: 999 !important;
}
.wd-search-cat>a {
    width: 180px !important;
}


/* Aktiver Link der blauen Navigationsleiste soll nicht grau sein sondern weiß bleiben */
:is(.color-scheme-light,.whb-color-light) .wd-nav[class*="wd-style-"] {
    --nav-color-active: white;
}

/* Foto Lightbox den Hintergrund durchsichtiger machen */
.pswp__bg {
    opacity: 0.9 !important;
}

/* Foto Lightbox den Hintergrund weiß setzen -> Hinweis: Weitere Elemente müssen grafisch angepasst werden, wenn vom Standard Schwarz auf Weiß gewechselt wird, deswegen wurde zunächst die Hintergrundfarbe schwarz bei der Foto Lightbox beibehalten und die opacity auf 0.5 gesetzt!! */
/* .pswp__bg {	
    background-color: white;
}
*/

/* Unter den Karussels den Navigationspunkte Abstand nach oben verkürzen - in der Regel werden Karussels sowieso ohne diese Navigationspunkte im Frontend angezeigt */
.owl-dots {
  margin-top: -20px !important;
  text-align: center;
}

/* Warenkorb Seite: Ausblenden der Zeile "Zwischensumme" im "Warenkorb Summen" Kasten */
.cart-subtotal {
 display: none;
}

/* Kassen Seite: Ausblenden der Rechnungsinformationen bei Kasse Layout 1 */
.elementor-element-c3ba8b7 {
 display: none;	
}

/* Kassen Seite: Ausblenden der Rechnungsinformationen bei Kasse Layout 2 */
.elementor-element-fb1a4a {
 display: none;	
}

/* Kassen Seite: Ausblenden des Strichs vor dem Button "Zahlungspflichtig bestellen" */
.woocommerce-terms-and-conditions-wrapper {
 display: none;	
}	

/* Kasse Seite: Hintergrundfarbe Edit Feld Liefer-/Abholdatum */
#e_deliverydate{
	background-color:#F2F2F2 !important;	
}

/* Kasse Seite: Abstand zwischen Liefer/Abholdatum und Bestellhinweisen erhöhen */
#orddd-lite-checkout-fields {
	margin-bottom:35px;
}	

/* Kasse Seite: Hintergrundfarbe Shop Table */
.woocommerce-checkout .shop_table {
    background-color: rgba(255,255,255,0.9);
}

/* Warenkorb Widget von rechts per Off Canvas: Verlinkung auf Artikeldetailseite deaktiveren, damit insb. mobil nicht bei Veränderung der Menge man aus versehen auf der Detailseite landet (weil man nicht die plus oder minus Buttons getroffen hat sondern den Hintergrund 
Hinweis: An dieser Stelle auskommentiert und nur für Tablet und Smartphones (siehe unten) implementiert -> auf dem Desktop soll die Verlinkung erstmal bleiben 
.cart-item-link.wd-fill {
    pointer-events: none;
}
*/

/* Mein Konto Bestellungen Detailseite Entfernen des Blocks Rechnungsadresse */
.woocommerce-customer-details {
	display: none;
}	

/* Mein Konto Bestellbestätigungsseite erneute Übersicht Bestellung ausblenden aber NUR DORT und nicht unter Mein Konto > Bestellungen deswegen mit page-id gearbeitet */
.page-id-14 .woocommerce-order-details {
	display: none;
}	

/* Mein Konto Bereich linke Navistruktur: Neuanordnung Elemente Reihenfolge Begin */
.woocommerce-MyAccount-navigation ul{
    flex-direction: column;
    display: flex;
}

/* Gekaufte Artikel Eintrag (ehemals Dashboard) */
.woocommerce-MyAccount-navigation-link--dashboard {
    order: -20;
}

/* Alte Bestellungen Eintrag */
.woocommerce-MyAccount-navigation-link--orders {
    order: -17;
}

/* Einkaufslisten/Merkzettel Link */ 
.woocommerce-MyAccount-navigation-link--wishlist {
    order: -15;
}

/* Bestellformular Link */ 
.woocommerce-MyAccount-navigation-link--bestellung-schnelleingabe {
    order: -13;
}
/* Mein Konto Bereich linke Navistruktur: Neuanordnung Elemente Reihenfolge Ende */

/* Mein Konto Bereich Dropdown im angemeldeten Zustand Neuanordnung Elemente Reihenfolge Begin */
.wd-dropdown.wd-dropdown-menu.wd-dropdown-my-account.wd-design-default ul {
    flex-direction: column;
    display: flex !important;
}

/* Gekaufte Artikel Eintrag (ehemals Dashboard) */
.woocommerce-MyAccount-navigation-link--dashboard {
    order: -20;
}

/* Alte Bestellungen Eintrag */
.woocommerce-MyAccount-navigation-link--orders {
    order: -17;
}

/* Einkaufslisten/Merkzettel Link*/ 
.woocommerce-MyAccount-navigation-link--wishlist {
    order: -15;
}

/* Bestellformular Link*/ 
.woocommerce-MyAccount-navigation-link--bestellung-schnelleingabe {
    order: -13;
}

.woocommerce-MyAccount-navigation-link--customer-logout {
    order: 50;
}
/* Mein Konto Bereich Dropdown im angemeldeten Zustand Neuanordnung Elemente Reihenfolge End */

/* Sticky Nav Bar - linke vertikale feststehende Navigationsbar - soll oben das blaue Hamburger Symbol weg - derzeit nicht im Einsatz könnte auch auskommentiert werden! */
.wd-sticky-nav-title {
    height: 66px;
    background: white !important; 
    color: #fff;
}

/* Beginn Schnelleingabeformular Variante I */
/* Umbrechen Artikelnummer - wird sonst manchmal abgeschnitten - nur notwendig wenn Spalte überhaupt sichtbar! 
.b2bking_bulkorder_cream_sku {
    width: 13%;
    overflow-wrap: break-word;
}
*/

/* Kommunikation keine Suchergebnisse */
.b2bking_bulkorder_indigo_noproducts {
    color: #fff !important;
    font-family: "Red Hat Display" !important;
    font-size: 14px;
}

/* Suchbegriff "Nach Produkten suchen..." Schriftarten */
#b2bking_bulkorder_search_text_indigo, #b2bking_bulkorder_search_text_indigo:focus, #b2bking_bulkorder_search_text_indigo:active {
    background: #132639;
    color: #fff;
    font-family: "Red Hat Display" !important;
    font-weight: 300;
    font-size: 16.7px;
}

/* Tabelle Überschriften Schriftarten */
.b2bking_bulkorder_form_container_content_header_product_indigo.b2bking_bulkorder_form_container_content_header_product_cream, .b2bking_bulkorder_form_container_content_header_qty_indigo.b2bking_bulkorder_form_container_content_header_qty_cream, #b2bking_myaccount_bulkorder_container .b2bking_bulkorder_form_container_content_line input.b2bking_bulkorder_form_container_content_line_product.b2bking_bulkorder_form_container_content_line_product_indigo.b2bking_bulkorder_form_container_content_line_product_cream, .b2bking_bulkorder_form_container_content_line input.b2bking_bulkorder_form_container_content_line_product.b2bking_bulkorder_form_container_content_line_product_indigo.b2bking_bulkorder_form_container_content_line_product_cream, .b2bking_bulkorder_form_container_content_header_subtotal_indigo.b2bking_bulkorder_form_container_content_header_subtotal_cream, .b2bking_bulkorder_form_container_content_header_cart_indigo.b2bking_bulkorder_form_container_content_header_cart_cream {
    color: #000000 !important;
    font-weight: 700 !important;	
    font-size: 14px !important; 
    font-family: "Red Hat Display" !important;	
}

/* Tabelle Artikelbezeichnung Schriftarten */
.b2bking_bulkorder_indigo_name, .b2bking_bulkorder_indigo_name:focus, .b2bking_bulkorder_indigo_name {
    font-size: 14px !important; 
    font-family: "Red Hat Display" !important;
    font-weight: 400 !important;
    color: white !important;
    text-decoration: none !important;
}

/* Tabelle Artikelbezeichnung Preis */
.b2bking_bulkorder_form_container_content_line_subtotal_indigo {    
    color: #fff !important;
    text-align: center !important;
    font-family: "Red Hat Display" !important;
    font-weight: bold !important;
    font-size: 14px !important;
}
.b2bking_bulkorder_form_container_content_line_subtotal.b2bking_bulkorder_form_container_content_line_subtotal_indigo.b2bking_bulkorder_form_container_content_line_subtotal_cream .amount {
    font-weight: bold !important;
    color: black !important;
}

/* Tabelle Artikelbezeichnung Einzelpreis (WC Germanzied) */
.b2bking_bulkorder_form_container_content_header_qty {
margin-bottom: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    color: #fff !important;
    text-align: center !important;
    font-family: "Red Hat Display" !important;
    font-weight: 700 !important;
    font-size: 14px !important;	
    font-weight: bold !important;
}
.b2bking_bulkorder_form_container_content_header_qty.b2bking_bulkorder_form_container_content_header_qty_indigo.b2bking_bulkorder_form_container_content_header_qty_cream p {
    margin-bottom: 0 !important;
    color: black !important;
}
.b2bking_bulkorder_form_container_content_header_qty.b2bking_bulkorder_form_container_content_header_qty_indigo.b2bking_bulkorder_form_container_content_header_qty_cream .woocommerce-Price-amount,
.b2bking_bulkorder_form_container_content_header_qty.b2bking_bulkorder_form_container_content_header_qty_indigo.b2bking_bulkorder_form_container_content_header_qty_cream .woocommerce-Price-currencySymbol {
    color: black !important;
    font-weight: bold !important;
}

/* Kaufen Buttons darstellen so wie andere Buttons FOKUS State  */
button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add:focus {
    background: rgb(18 70 171) !important;
    border: 1px solid rgb(18 70 171) !important;	
    border-color: rgb(18 70 171) !important;	
    color: white !important; 	
    transition: 150ms ease 0s !important; 	    
}

/* Kaufen Buttons darstellen so wie andere Buttons HOVER State */
button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add:hover {
    background: white !important;
    border: 1px solid rgb(18 70 171) !important;	
    border-color: rgb(18 70 171) !important;
    color: rgb(18 70 171)  !important; 
    transition: 150ms ease 0s !important;  
}
	
/* Kaufen Buttons darstellen so wie andere Buttons Standard KEIN State */
button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add {
    background: rgb(18 70 171) !important;
    border: 1px solid rgb(18 70 171) !important;	
	  border-color: rgb(18 70 171) !important;
	  color: white !important;   	
	  transition: 150ms ease 0s !important;
}

/* Kaufen Button aussehen definieren wenn Artikel nicht auf Lager ist HOVER State -> Kein Handsymbol, sondern nur Mauszeiger, weil nicht klickbar */
button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add.b2bking_none_in_stock:hover {
    cursor: default !important;
    background: red !important;
    border: 1px solid red !important;	
    border-color: red !important;
    color: white !important; 
    transition: 150ms ease 0s !important;  
}
	
/* Kaufen Button aussehen definieren wenn Artikel nicht auf Lager ist */
button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add.b2bking_none_in_stock {
    background: red !important;
    border: 1px solid red !important;	
	  border-color: red !important;
	  color: white !important;   	
	  transition: 150ms ease 0s !important;
}

/* Button Schriftarten -> hier auf 12px gestellt weil das Formular auch unter "Mein Konto" eingehängt ist wo ALLE Buttons 12px haben */
button.b2bking_bulkorder_indigo_add, button.b2bking_bulkorder_indigo_add:focus, button.b2bking_bulkorder_indigo_add:target, button.b2bking_bulkorder_indigo_add:active {
    background: initial !important;
    color: #fff !important;
    border: 5px !important;
    outline: 1px !important;
    font-family: Red Hat Display !important;
    font-style: normal !important;
    font-weight: 700 !important;	
    font-size: 12px !important;	
}

/* Button Schriftarten -> hier auf 13px gestellt auf Extra Seite wo das Bestellformular auch eingehängt ist, weil da die Buttons höher sind */
.page-id-12429 button.b2bking_bulkorder_indigo_add, button.b2bking_bulkorder_indigo_add:focus, button.b2bking_bulkorder_indigo_add:target, button.b2bking_bulkorder_indigo_add:active {
	font-size: 13px !important;	
}

/* Buttons Vor Zurück Pagination am Ende des Formular Ecken kantig setzen */
button.b2bking_bulkorder_pagination_button {
  border-radius: 0px !important;
}

/* Filter Bereich des Schnellformulars Anfang */
.b2bking_bulkorder_form_container_cream_filters.b2bking_filters_open {
	background-color: white !important;
	border: 1px solid #dcdcdc;
  border-radius: 0px !important;	
  max-height: 585px;
  width: 20%;
  padding: 20px;
  display: block;
	position: sticky;
  top: 0;

}
@media screen and (min-width: 1024px) {   
    .b2bking_bulkorder_form_container_cream_filters.b2bking_filters_open {
        width: 19%;
    }

}

.b2bking_orderform_filters span {
    font-weight: 700 !important;
    font-size: 14px !important;
    font-family: "Red Hat Display" !important;
}

.b2bking_bulkorder_filter_header {
    font-weight: 700 !important;
    font-size: 14px !important;
    font-family: "Red Hat Display" !important;
}

.b2bking_bulkorder_filters_list li, .b2bking_bulkorder_filters_list_sortby li {
    color: #000000 !important;    
    font-size: 14px !important;
    font-family: "Red Hat Display" !important;	
    background-color: white !important;	
}

.b2bking_categories_header_separator {
    height: 60px;
}
/* Filter Bereich des Schnellformulars Ende*/

/* Hover State - + Quantity Buttons Hintergrundfarbe Buttons */
button.b2bking_cream_input_button:hover {  
background: rgb(18 70 171) !important;	 	
}

/* Hover State - + Quantity Buttons Schrift weiß für + - */
button.b2bking_cream_input_button:hover {
  color: white !important;  
}

/* Suchrahmen oben eckige Kanten */
.b2bking_bulkorder_form_container_content_header_top_cream {
  border-radius: 0px !important;
}

/* Quantity Input Field eckige Kanten */
.b2bking_cream_input_button.b2bking_cream_input_plus_button {
  border-radius: 0px 0px 0px 0px !important;
}

.b2bking_cream_input_button.b2bking_cream_input_minus_button {
  border-radius: 0px 0px 0px 0px !important;
}

/* Kaufen Button eckige Kanten */
button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add, button.b2bking_bulkorder_indigo_add.b2bking_bulkorder_cream_add:focus {
  border-radius: 0px !important;
}

/* Ausblenden der Überschrift "Quick / Bulk Order Form im angemeldeten Mein Konto Bereich - alle anderen Seiten dort haben auch keine Überschrift!  */
#b2bking_myaccount_bulkorder_title {
   display: none !important;
}

/* Höhe Limitieren damit das Formular als Layer und Popup angezeigt wird - der Rest wird dann mit dem Scrollbalken angezeigbar - eckige Kanten 
.b2bking_bulkorder_form_container_indigo.b2bking_bulkorder_form_container_cream {  
  height: 65vh;
  overflow: scroll;
	border-radius: 0px;
}
/* Ende Schnelleingabeformular Variante I*/

/* Ausblenden der Grundpreis/Einzelpreisinformation aus dem Plugin Woocommerce Germanized im NICHT ANGEMELDETEN ZUSTAND in allen Kacheln (also Kategorieseiten etc.) und in den Widgets "Zuletzt angesehene Produkte"; Hinweis: Es wird mit dem String ".b2bking_logged_out" gearbeitet, das ist ein CSS Selektion des Plugins B2BKing, dass diesen String mitliefert und mittels CSS für nicht angemeldete Benutzer bestimmte Elemente auszublenden! Damit das Ausblenden also funktioniert für nicht angemeldete Benutzer muss das Plugin B2BKing installiert sein! */
.b2bking_logged_out .price.price-unit.smaller.wc-gzd-additional-info.wc-gzd-additional-info-loop{
    display:none !important;
}

.b2bking_logged_out .price.price-unit.smaller.wc-gzd-additional-info{
    display:none !important;
}@media (min-width: 1025px) {
	/* Ausblenden von überflüssigen Informationen - konkret Produkteigenschaften die on mouse over in den Artikelkarten (das sind in der Regel (auf jeden Fall die Hauptgruppe) nur interne Informationen aus der ADS Anwendung, die dem Endkunden keinen Mehrwert bieten) - erscheinen, hier konkret Haupt- und Nebengruppe: Dieser Code blendet das Element mit der Klasse woocommerce-product-attributes-item--attribute_pa_66 und woocommerce-product-attributes-item--attribute_pa_66 aus, wenn man mit der Maus über das übergeordnete Element mit der Klasse product-grid-item fährt. Auf den Artikeldetailseiten bleiben die Informationen bestehen! 
.product-grid-item:hover .woocommerce-product-attributes-item--attribute_pa_55 {
    display: none;
}
.product-grid-item:hover .woocommerce-product-attributes-item--attribute_pa_66 {
    display: none;
}
*/

/* Beim Standard Listview (also Tabellendarstellung anstatt Kacheln) ist im Standard max-heigt auf 154px begrenzt. Wenn dann viele Eigenschaftswerte angezeigt werden erscheint ein Scrollbalken rechts neben den Eigeschaftswerten für jedes Produkt. Das sieht nicht nur schlecht aus sondern erschwert die Bedienung (wenn man mit der Maus in dem Bereich ist scrollt man die Eigenschaftswerte und nicht die Seite) -> max-height wurde aus diesem Grund auf 354px erhöht! Dann sollten mindesten 8 Eigenschaftswerte untereinander passen bevor der Scrollbalken erscheint */
.product-list-item .shop_attributes tbody {
    max-height: 354px !important;
}

/* Vertikalene Abstand beim Standard Listview (also Tabellendarstellung anstatt Kacheln) zwischen 2 Produkten verkleinern -> padding-bottom auf 10px reduziert und flex von 30% auf 20% Teil2 Begin */
.product-list-item:not(:last-child) .product-wrapper {
    padding-bottom: 10px !important; 
}
/* Vertikalene Abstand beim Listview zwischen 2 Produkten verkleinern -> padding-bottom auf 10px reduziert und flex von 30% auf 20% Teil2 End */

/* Warenkorb Sidebar Breiter setzen als im Standard */
.cart-widget-side {
  width: 500px;
}

/* Schatten Effekt hinter den Popups Hotline und Nachricht im Header -> nur im Desktop Modus notwendig weil Tablet/Mobil der Header die Links zu den Popups nicht besitzt! */
.wd-dropdown-menu.wd-dropdown.wd-design-sized.color-scheme-dark {
  /* box-shadow: 0px 0px 20px 0px; ->	sehr kräftiger Schatten */
	/* box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; /* -> sehr leichter Schatten sieht auch sehr gut aus */
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;  /*	-> mittelkräftiger Schatten */	
}

/* Wishlist (Einkaufliste/Merkliste Herz Symbol) Tooltip soll umbrechen wenn in der horizontalen nicht genug Platz ist auf den Kacheln */
.wd-buttons[class*="wd-pos-r"] .wd-wishlist-btn .wd-tooltip-label {
    margin-top: 0;
    transform: translate(0, -50%);
    height: auto;
    line-height: 1.2;
    padding: 10px 15px !important;
    min-width: 90px;
    white-space: unset;
}

/* Zeige immer alle Eigenschaftswerte auf den Kacheln auf einmal an (im Standard werden nur 3 angezeigt und dann erscheinen 3 Punkte auf die man klicken muss damit sich die Kachel vertikal erweitert -> soll dieser Effekt erscheinen nachfolgenden Code einfach wieder auskommentieren */
.website-wrapper .product-grid-item .wd-more-desc-btn {
    display: none;
}
.website-wrapper .product-grid-item .wd-more-desc {
    max-height: 100%;
}
}

@media (min-width: 768px) and (max-width: 1024px) {
	/* List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3*/
/* Ohne diesen Code würde das Produkte in der Standard Ansicht dargestellt werden: entweder 2 Produkte nebeneinander (kacheloptik) (LAYOUT 1) oder weil ein Preset existiert ein großes Bild und darunter die Eigenschaften (LAYOUT 2) */
/* Bei diesem Layout ist es kurz und knapp Bild links und rechts Titel, Preis und Warenkorb Button + Mengenfeld: es wird also das Preset LAYOUT 2 mittels CSS modifiziert! */
body .product-list-item .product-wrapper {
		display: flex;
		align-items: center;
    flex-wrap: nowrap;
}

body .product-list-item .product-element-top {
		flex: 0 0 30%;
    margin-bottom: 0 !important;
    margin-right: 15px;
}

body .product-list-item .product-list-content {
		flex: 1 1 auto;
		text-align: start;
}

body .product-list-item .woocommerce-product-details__short-description {
	display: block;
}
/* List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3*/

/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) Begin  
body .product-list-item .product-wrapper .wd-add-btn a {
	width: 50px;
	height: 35px;
}

body .product-list-item .product-wrapper .wd-add-btn-replace .add-to-cart-loop:before {
    transform: translateY(0) translateZ(0);
}

body .product-list-item .product-wrapper .wd-add-btn a span {
		display: none;
}
/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) End */

/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) Begin  
body .product-list-item .product-wrapper .wd-add-btn {
	text-align: right;
}
/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) End */

/* Ausblenden von überflüssigen Informationen - konkret Produkteigenschaften die tabellarisch in der alternativen mobilen Ansicht (TABELLENLAYOUT -> List View siehe globales CSS ganz oben) (das sind in der Regel (auf jeden Fall die Hauptgruppe) nur interne Informationen aus der ADS Anwendung, die dem Endkunden keinen Mehrwert bieten) - erscheinen, hier konkret Hauptgruppe: Dieser Code blendet das Element mit der Klasse woocommerce-product-attributes-item--attribute_pa_66 und woocommerce-product-attributes-item--attribute_pa_66 aus, wenn man mit der Maus über das übergeordnete Element mit der Klasse product-grid-item fährt. Auf den Artikeldetailseiten bleiben die Informationen bestehen!  
/* Gebinde */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_11 {
    display: none;
}

/* Lieferland */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_22 {
    display: none;
}

/* HKL */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_33 {
    display: none;
}

/* Mengeneinheit2 */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_44 {
    display: none;
}

/* Hauptgruppe */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_55 {
    display: none;
}

/* Herstellung */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_66 {
    display: none;
}

/* Materialgruppe */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_77 {
    display: none;
}

/* Materialgruppe2 */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_88 {
    display: none;
}

/* PortalME */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_99 {
    display: none;
}

/* Einzeleinheit */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_111 {
    display: none;
}

/* Marke */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_222 {
    display: none;
}

/* Umstellungsartikel */
.product-list-content .woocommerce-product-attributes-item--attribute_pa_333 {
    display: none;
}

/* Beim Standard Listview (also Tabellendarstellung anstatt Kacheln) ist im Standard max-heigt auf 154px begrenzt. Wenn dann viele Eigenschaftswerte angezeigt werden erscheint ein Scrollbalken rechts neben den Eigeschaftswerten für jedes Produkt. Das sieht nicht nur schlecht aus sondern erschwert die Bedienung (wenn man mit der Maus in dem Bereich ist scrollt man die Eigenschaftswerte und nicht die Seite) -> max-height wurde aus diesem Grund auf 354px erhöht! Dann sollten mindesten 8 Eigenschaftswerte untereinander passen bevor der Scrollbalken erscheint */
.product-list-item .shop_attributes tbody {
    max-height: 354px !important;
}

/* Vertikalene Abstand beim Standard Listview (also Tabellendarstellung anstatt Kacheln) zwischen 2 Produkten verkleinern -> padding-bottom auf 10px reduziert Teil2 */
.product-list-item:not(:last-child) .product-wrapper {
    padding-bottom: 10px !important; 
}

/* Warenkorb Sidebar Breiter setzen als im Standard */
.cart-widget-side {
  width: 500px;
}

/* Warenkorb Widget von rechts per Off Canvas: Verlinkung auf Artikeldetailseite deaktiveren, damit insb. mobil nicht bei Veränderung der Menge man aus versehen auf der Detailseite landet (weil man nicht die plus oder minus Buttons getroffen hat sondern den Hintergrund */
.cart-item-link.wd-fill {
    pointer-events: none;
}

/* Klickbaren Bereich im linken Hamburger Menü erhöhen, damit wenn man mit Touch unterwegs ist und damit Fingerbedienung hat die Trefferfläche größer ist */
.wd-tools-element.wd-header-mobile-nav.wd-style-icon.wd-design-1.whb-e224ild7od7oenwibfmt {
	width: 55px !important;
	height: 40px !important;
}

/* Klickbaren Bereich im linken Hamburger Menü erhöhen, damit wenn man mit Touch unterwegs ist und damit Fingerbedienung hat die Trefferfläche größer ist */
.wd-header-my-account.wd-tools-element.wd-event-hover.wd-design-1.wd-account-style-icon.login-side-opener.whb-wtesvuratkokmrpv4ixr {
	width: 55px !important;
	height: 40px !important;
}

}

@media (min-width: 577px) and (max-width: 767px) {
	/* List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3*/
/* Ohne diesen Code würde das Produkte in der Standard Ansicht dargestellt werden: entweder 2 Produkte nebeneinander (kacheloptik) (LAYOUT 1) oder weil ein Preset existiert ein großes Bild und darunter die Eigenschaften (LAYOUT 2) */
/* Bei diesem Layout ist es kurz und knapp Bild links und rechts Titel, Preis und Warenkorb Button + Mengenfeld: es wird also das Preset LAYOUT 2 mittels CSS modifiziert! */
/* Striche/Rahmen entfernen, der um die Produkte gelegt wird */
.product-list-item .product-wrapper {
    border: 0px !important; 
}

body .product-list-item .product-wrapper {
		display: flex;
		align-items: center;
    flex-wrap: nowrap;
}

body .product-list-item .product-element-top {
		flex: 0 0 30%;
    margin-bottom: 0 !important;
    margin-right: 15px;
}

body .product-list-item .product-list-content {
		flex: 1 1 auto;
		text-align: start;
}

body .product-list-item .woocommerce-product-details__short-description {
	display: block;
}
/* List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3*/

/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) Begin  
body .product-list-item .product-wrapper .wd-add-btn a {
	width: 50px;
	height: 35px;
}

body .product-list-item .product-wrapper .wd-add-btn-replace .add-to-cart-loop:before {
    transform: translateY(0) translateZ(0);
}

body .product-list-item .product-wrapper .wd-add-btn a span {
		display: none;
}
/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) End */

/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) Begin  
body .product-list-item .product-wrapper .wd-add-btn {
	text-align: right;
}
/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) End */

/* Vertikalene Abstand beim Listview zwischen 2 Produkten verkleinern -> margin-bottom von 30px auf 20px reduziert Teil1 -> Hinweis: um den vertikalen Abstand weiter zu verkleinern gibt's weitere CSS nur für den Desktop und das Tablet -> siehe nach Einträgen "Teil2"*/
.elementor-default .product-list-item:not(:last-child) .product-wrapper {
    margin-bottom: 20px !important;
}

/* Ausblenden von überflüssigen Informationen - konkret Produkteigenschaften die tabellarisch in der alternativen mobilen Ansicht (TABELLENLAYOUT -> List View siehe globales CSS ganz oben) (das sind in der Regel (auf jeden Fall die Hauptgruppe) nur interne Informationen aus der ADS Anwendung, die dem Endkunden keinen Mehrwert bieten) - erscheinen, hier konkret Hauptgruppe: Dieser Code blendet das Element mit der Klasse woocommerce-product-attributes-item--attribute_pa_66 und woocommerce-product-attributes-item--attribute_pa_66 aus, wenn man mit der Maus über das übergeordnete Element mit der Klasse product-grid-item fährt. Auf den Artikeldetailseiten bleiben die Informationen bestehen! */
/* Gebinde */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_11 {
    display: none;
}

/* Lieferland */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_22 {
    display: none;
}

/* HKL */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_33 {
    display: none;
}

/* Mengeneinheit2 */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_44 {
    display: none;
}

/* Hauptgruppe */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_55 {
    display: none;
}

/* Herstellung */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_66 {
    display: none;
}

/* Materialgruppe */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_77 {
    display: none;
}

/* Materialgruppe2 */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_88 {
    display: none;
}

/* PortalME */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_99 {
    display: none;
}

/* Einzeleinheit */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_111 {
    display: none;
}

/* Marke */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_222 {
    display: none;
}

/* Umstellungsartikel */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_333 {
    display: none;
}

/* Beim Standard Listview (also Tabellendarstellung anstatt Kacheln) ist im Standard max-heigt auf 154px begrenzt. Wenn dann viele Eigenschaftswerte angezeigt werden erscheint ein Scrollbalken rechts neben den Eigeschaftswerten für jedes Produkt. Das sieht nicht nur schlecht aus sondern erschwert die Bedienung (wenn man mit der Maus in dem Bereich ist scrollt man die Eigenschaftswerte und nicht die Seite) -> max-height wurde aus diesem Grund auf 354px erhöht! Dann sollten mindesten 8 Eigenschaftswerte untereinander passen bevor der Scrollbalken erscheint */
.product-list-item .shop_attributes tbody {
    max-height: 354px !important;
}

/* Anmelde bzw. Registrierungsseite: Mobil den vertikalen Abstand zwischen dem Anmeldeformular und dem Registrierungsformular erhöhen */
.col-register {
  margin-top: 50px !important;
}

/* Warenkorb Widget von rechts per Off Canvas: Verlinkung auf Artikeldetailseite deaktiveren, damit insb. mobil nicht bei Veränderung der Menge man aus versehen auf der Detailseite landet (weil man nicht die plus oder minus Buttons getroffen hat sondern den Hintergrund */
.cart-item-link.wd-fill {
    pointer-events: none;
}

/* Klickbaren Bereich im linken Hamburger Menü erhöhen, damit wenn man mit Touch unterwegs ist und damit Fingerbedienung hat die Trefferfläche größer ist */
.wd-tools-element.wd-header-mobile-nav.wd-style-icon.wd-design-1.whb-e224ild7od7oenwibfmt {
	width: 55px !important;
	height: 40px !important;
}

/* Klickbaren Bereich im linken Hamburger Menü erhöhen, damit wenn man mit Touch unterwegs ist und damit Fingerbedienung hat die Trefferfläche größer ist */
.wd-header-my-account.wd-tools-element.wd-event-hover.wd-design-1.wd-account-style-icon.login-side-opener.whb-wtesvuratkokmrpv4ixr {
	width: 55px !important;
	height: 40px !important;
}

}

@media (max-width: 576px) {
	div.quantity input[type="number"] {
    width: 15px !important; 
}
.wd-quantity-overlap div.quantity input[type="button"] {
    min-width: 45px !important;    
}

/* Begin Optimierung "Mein Konto" Navigationsblock */
.woocommerce-MyAccount-title {
    margin-left: -20px !important;
    margin-right: -20px !important;
}
.woocommerce-MyAccount-navigation {
    margin-bottom: 30px;
    margin-left: -15px;
    margin-right: -15px;
}
/* Ende Optimierung "Mein Konto" Navigationsblock */

/* Für alle Mein Konto Seiten Abstände links rechts vom Container */
.woocommerce-MyAccount-content {
    padding-left: 30px; 
    padding-right: 30px; 
}

/* Optimierung Favoriten unter "Mein Konto" */
.page-id-291 .products-bordered-grid-ins .product-wrapper {   
	 padding: 6px !important;
}

/* Optimierung Letzte gekaufte Artikel unter "Mein Konto": Artikeldarstellung (Listendarstellung) Abstände links und rechts */
.page-id-15 .products-bordered-grid-ins .product-wrapper {   
	 margin: -14px !important;
}

/* Meist verkaufte Artikel - Optimierung Kacheldarstellung */
.page-id-12035 .products.wd-stretch-cont-sm {    
    margin-left: -20px !important;
    margin-right: -20px !important;
}

/* Neue Artikel - Optimierung Kacheldarstellung */
.page-id-12079 .products.wd-stretch-cont-sm {    
    margin-left: -20px !important;
    margin-right: -20px !important;
}
.page-id-12079 .products {
    --wd-gap-lg: 0px !important;
}

/* Empfohlene Artikel/Sonderangebote - Optimierung Kacheldarstellung */
.page-id-12010 .products.wd-stretch-cont-sm {    
    margin-left: -20px !important;
    margin-right: -20px !important;
}
.page-id-12010 .products {
    --wd-gap-lg: 0px !important;
}

/* Shop- und Kategorieseiten und alle Seiten in denen Listendarstellung benutzt wird: Kaufen Button */
.product-list-item .wd-add-btn .add-to-cart-loop span {
    padding-left: 5px !important;
    padding-right: 5px !important;	
}

/* Kategorieseiten Artikeldarstellung (Listendarstellung) Abstände links und rechts */
.elementor-1283 .elementor-element.elementor-element-023c2c3 {
    margin: -14px !important;
}

/* Shopseiten Artikeldarstellung (Listendarstellung) Abstände links und rechts */
.elementor-1229 .elementor-element.elementor-element-0000ff6 {
    margin: -14px !important;
}

/* Letzte gekaufte Artikel EXTRA SEITE: Artikeldarstellung (Listendarstellung) Abstände links und rechts */
.page-id-12390 .woocommerce.columns-6  {
    margin: -14px !important;    
}

/* Kategorieseiten Abstände Kategorieüberschriften (graue Box) links und rechts */
.elementor-1283 .elementor-element.elementor-element-804f58a {
    margin-left: -20px !important;
    margin-right: -20px !important;	
}

/* Shopseiten Abstände Kategorieüberschriften (graue Box) links und rechts */
.elementor-element-c385ca1 {
    margin-left: -20px !important;
    margin-right: -20px !important;	
}

/* Styling Mengen- + Buy Buttons List View */
/* Begin Anpassung wegen Wood 7.3 */
body .product.product-list-item .wd-add-btn {
	display: block;
}
/* End Anpassung wegen Wood 7.3 */
.product-list-item.wd-quantity .wd-add-btn div.quantity :is(input[type="button"],input[type="number"],input[type="text"]) {
    height: 45px !important;
    width: 40px !important;
    margin-bottom: 8px !important;	  
}
.product-list-item .wd-add-btn .add-to-cart-loop span {
    min-height: 45px !important;
}
.product-list-item div.quantity {
    margin-right: 8px !important;	    
}
.product.product-list-item .product-list-content {
     gap: 7px !important;
}

/* Styling Mengen- + Buy Buttons Quick View Layer */
.mfp-with-anim.wd-popup.popup-quick-view form.cart {
    gap: 15px !important;
    height: 50px !important;
}
.mfp-with-anim.wd-popup.popup-quick-view div.quantity input[type="button"] {
    height: 50px !important;  
	  min-width: 45px !important;    
}
.mfp-with-anim.wd-popup.popup-quick-view div.quantity input[type="number"] {
    width: 45px !important; 
}
.mfp-with-anim.wd-popup.popup-quick-view div.quantity :is(input[type="number"],input[type="text"]) {
    height: 50px !important;
}

/* Styling Mengen- + Mini Cart Layer */
.widget_shopping_cart_content form.cart {
    gap: 15px !important;
    height: 45px !important;
}
.widget_shopping_cart_content div.quantity input[type="button"] {
    height: 45px !important;  
	  min-width: 40px !important;    
}
.widget_shopping_cart_content div.quantity input[type="number"] {
    width: 40px !important; 
}
.widget_shopping_cart_content div.quantity :is(input[type="number"],input[type="text"]) {
    height: 45px !important;
}

/* Styling Kasse Seite Mengen Buttons */
.woocommerce-checkout-review-order-table div.quantity input[type="button"] {
    height: 45px !important;  
	  min-width: 40px !important;    
}
.woocommerce-checkout-review-order-table div.quantity input[type="number"] {
    width: 40px !important; 
}
.woocommerce-checkout-review-order-table div.quantity :is(input[type="number"],input[type="text"]) {
    height: 45px !important;
}

/* Mini Cart Breiter setzen */
.wd-side-hidden {
    width: 90%;
    z-index: 99999;
}

/* List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3*/
/* Ohne diesen Code würde das Produkte in der Standard Ansicht dargestellt werden: entweder 2 Produkte nebeneinander (kacheloptik) (LAYOUT 1) oder weil ein Preset existiert ein großes Bild und darunter die Eigenschaften (LAYOUT 2) */
/* Bei diesem Layout ist es kurz und knapp Bild links und rechts Titel, Preis und Warenkorb Button + Mengenfeld: es wird also das Preset LAYOUT 2 mittels CSS modifiziert! */

/* Striche/Rahmen entfernen, der um die Produkte gelegt wird */
.product-list-item .product-wrapper {
    border: 0px !important; 
}

/* Platz über dem Preis und unter dem Preis */
body .product-grid-item .price {
    margin-bottom: 13px !important;
    margin-top: 13px !important;
}

/* Patz über und unter dem Kaufen Butto erhöhen */
body .product-list-item .wd-add-btn {
    margin-top: 20px !important;
    margin-bottom: 5px !important;
}

/* Diese Regel setzt die Productlabels weiter nach oben links als im Standard, wo sie im im Layout 3 dann die Produktbilder überlagern würden */
body .product-list-item .product-labels {
  position: static; /* Setze die Position auf static, um die vorherige Regel zu überschreiben */
}

body .product-list-item .product-wrapper {
		display: flex;
	  align-items: center;	/* wird diese Zeile weggelassen beginn die Labels ganz oben links in der Ecke */
    flex-wrap: nowrap;
}

body .product-list-item .product-element-top {
		flex: 0 0 40%;  /* von urspr. 30% auf 40% gesetzt - Wert bestimmt Größe des Produktbildes (bzw. des DIVS wo das Bild drinliegt) */
    margin-bottom: 0 !important;
    margin-right: 15px;
}

body .product-list-item .product-list-content {
		flex: 1 1 auto;
		text-align: start;
}

body .product-list-item .woocommerce-product-details__short-description {
	display: block;
}
/* List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3*/

/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) Begin  
body .product-list-item .product-wrapper .wd-add-btn a {
	width: 50px;
	height: 35px;
}

body .product-list-item .product-wrapper .wd-add-btn-replace .add-to-cart-loop:before {
    transform: translateY(0) translateZ(0);
}

body .product-list-item .product-wrapper .wd-add-btn a span {
		display: none;
}
/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) End */

/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) Begin  
body .product-list-item .product-wrapper .wd-add-btn {
	text-align: right;
}
/* Weitere Anpassungen List View auf Shop- und Kategorieseiten NUR AUF MOBILE SMARTPHONE Begin LAYOUT 3 Add To Cart Button (remove the text and leave the icon) End */

/* Vertikalene Abstand beim Listview zwischen 2 Produkten verkleinern -> margin-bottom von 30px auf 20px reduziert Teil1 -> Hinweis: um den vertikalen Abstand weiter zu verkleinern gibt's weitere CSS nur für den Desktop und das Tablet -> siehe nach Einträgen "Teil2"*/
.elementor-default .product-list-item:not(:last-child) .product-wrapper {
    margin-bottom: 30px !important;
}

/* Ausblenden von überflüssigen Informationen - konkret Produkteigenschaften die tabellarisch in der alternativen mobilen Ansicht (TABELLENLAYOUT -> List View siehe globales CSS ganz oben) (das sind in der Regel (auf jeden Fall die Hauptgruppe) nur interne Informationen aus der ADS Anwendung, die dem Endkunden keinen Mehrwert bieten) - erscheinen, hier konkret Hauptgruppe: Dieser Code blendet das Element mit der Klasse woocommerce-product-attributes-item--attribute_pa_66 und woocommerce-product-attributes-item--attribute_pa_66 aus, wenn man mit der Maus über das übergeordnete Element mit der Klasse product-grid-item fährt. Auf den Artikeldetailseiten bleiben die Informationen bestehen! */
/* Gebinde */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_11 {
    display: none;
}

/* Lieferland */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_22 {
    display: none;
}

/* HKL */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_33 {
    display: none;
}

/* Mengeneinheit2 */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_44 {
    display: none;
}

/* Hauptgruppe */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_55 {
    display: none;
}

/* Herstellung */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_66 {
    display: none;
}

/* Materialgruppe */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_77 {
    display: none;
}

/* Materialgruppe2 */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_88 {
    display: none;
}

/* PortalME */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_99 {
    display: none;
}

/* Einzeleinheit */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_111 {
    display: none;
}

/* Marke */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_222 {
    display: none;
}

/* Umstellungsartikel */
.product-list-content.wd-scroll .woocommerce-product-attributes-item--attribute_pa_333 {
    display: none;
}

/* Beim Standard Listview (also Tabellendarstellung anstatt Kacheln) ist im Standard max-heigt auf 154px begrenzt. Wenn dann viele Eigenschaftswerte angezeigt werden erscheint ein Scrollbalken rechts neben den Eigeschaftswerten für jedes Produkt. Das sieht nicht nur schlecht aus sondern erschwert die Bedienung (wenn man mit der Maus in dem Bereich ist scrollt man die Eigenschaftswerte und nicht die Seite) -> max-height wurde aus diesem Grund auf 354px erhöht! Dann sollten mindesten 8 Eigenschaftswerte untereinander passen bevor der Scrollbalken erscheint */
.product-list-item .shop_attributes tbody {
    max-height: 354px !important;
}

/* Anmelde bzw. Registrierungsseite: Mobil den vertikalen Abstand zwischen dem Anmeldeformular und dem Registrierungsformular erhöhen */
.col-register {
  margin-top: 50px !important;
}

/* Checkout Page / Kasse Bestellbestätigungsseite Alle Striche weg zwischen Bestellnummer, Datum und E-Mail im Hochkantmodus */
:is(.woocommerce-thankyou-order-details,.wc-bacs-bank-details) li {
    border-bottom: none !important;
}

/* Warenkorb Widget von rechts per Off Canvas: Verlinkung auf Artikeldetailseite deaktiveren, damit insb. mobil nicht bei Veränderung der Menge man aus versehen auf der Detailseite landet (weil man nicht die plus oder minus Buttons getroffen hat sondern den Hintergrund */
.cart-item-link.wd-fill {
    pointer-events: none;
}

/* Suche "Full Screen 2 / Vollbild 2": leichte justierung damit auch auf etwas kleineren Smartphones immer ZWEI Artikel bei den Suchergebnissen nebeneinander stehen und nicht nur 1 */ 
/* Anstatt 160 steht im Original Code 170 und dann wird nur 1 Ergebnistreffer anstatt 2 nebeneinander angezeigt */
.wd-search-full-screen-2 .autocomplete-suggestions {
    grid-template-columns: repeat(auto-fill,minmax(150px,1fr)) !important; 
}

/* Klickbaren Bereich im linken Hamburger Menü erhöhen, damit wenn man mit Touch unterwegs ist und damit Fingerbedienung hat die Trefferfläche größer ist */
.wd-tools-element.wd-header-mobile-nav.wd-style-icon.wd-design-1.whb-e224ild7od7oenwibfmt {
	width: 55px !important;
	height: 40px !important;
}

/* Klickbaren Bereich im linken Hamburger Menü erhöhen, damit wenn man mit Touch unterwegs ist und damit Fingerbedienung hat die Trefferfläche größer ist */
.wd-header-my-account.wd-tools-element.wd-event-hover.wd-design-1.wd-account-style-icon.login-side-opener.whb-wtesvuratkokmrpv4ixr {
	width: 55px !important;
	height: 40px !important;
}

}

