/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */

#wrapper {
    padding-top: 1.563rem;
    background: #fff;
}


/* =========================================================
   HEADER / Farben
   ========================================================= */
/*
#header{
  background-color: #f9f9f9 !important;
}
*/

#header .logo {
    max-width: 140px;
    height: auto;
}


/*
Header Menue Anmelden
*/


#header .header-nav{
  background-color: #f9f9f9;
  border-bottom: #ebf0ea 0.25px solid;
}

#header .header-nav .material-icons {
    line-height: inherit;
    color: #000;
}
/*
span.hidden-sm-down {
    color: #000;
}
*/

#block_myaccount_infos .myaccount-title a, #header a, #wrapper .breadcrumb li a, .block-contact .block-contact-title, .block-contact .navbar-toggler .material-icons, .linklist .blockcms-title a {
    color: #000;
}

#header, #header .header-top{
  background-color: #f9f9f9;
}



#header .header-top a[data-depth="0"]{
  color: #1a1a1a;
}

#mobile_top_menu_wrapper{
  background: #f9f9f9;
}

#header .header-nav #menu-icon .material-icons{
  color: #000;
}


#mobile_top_menu_wrapper .js-top-menu-bottom a,
.dropdown,
body#checkout section.checkout-step small{
  color: #24b9d7;
}

.label, label{ color: #000; }
.cart-summary-line .label{ color: #000; }

.h1, .h2, .h3, .h4, body{ color: #000; }

/* Container Breite */
@media (min-width: 1200px){
  .container{
    width: auto;
    max-width: 80%;
  }
}

@media (max-width: 992px){
  .article{
    text-align: center;
    margin: 2%;
  }
}

/* Hover Farben */
#header .top-menu a[data-depth="0"]:hover,
a:hover{
  color: #000;
  text-decoration: none;
}
#header .top-menu a:hover,
#header .header-nav a:hover {
    text-decoration: none;
    color: #000;
    border: 0.5px solid #000;
    border-radius: 20px;
}



#header .header-nav a:hover{
  text-decoration: none;
  background-color: none;
  border-color: none;
  color: #000;
  border-radius: 0px;
  border: solid 0.5px;
  padding:5px
}

#header .header-nav a:active{
  text-decoration: none;
  background-color: none;
  border-color: #C7C7C7;
  color: #000;
  border-radius: 0px;
  border: solid 0.25px;
  padding:5px
}
/* Hover Farben ende*/

#wrapper a:hover{
  color: #24b9d7;
  text-decoration: none;
}
#footer a:hover{
  text-decoration: none;
  background-color: #ebf0ea;
  border-color: #000;
  color: #000;
  border-radius: 0px;
  border: solid 0.5px;
  padding:5px
}


/* =========================================================
   Eigener Focus-Rahmen
   ========================================================= */

#header .top-menu a:focus-visible,
#header .header-nav a:focus-visible {
    outline: none;
    border: 1px solid #24b9d7;
    box-shadow: 0 0 0 2px rgba(36,185,215,.25);
    border-radius: 0;
}


/* =========================================================
   Artikelseite
   ========================================================= */
   

   

#products .products-section-title, .featured-products .products-section-title, .product-accessories .products-section-title {
    margin: 2.5rem 0;
    font-weight: 500;
    text-align: center;
    color: #000;
}


/* =========================================================
   FOOTER / WRAPPER
   ========================================================= */
#footer{
  background: #1A1A1A;
  padding-top: 0rem;
  padding-bottom: 2.5rem;
}

.footer-container .h3, .footer-container .h4 {
    margin-bottom: 1rem;
    font-size: 1rem;
    color: #fff;
}

/* 
#wrapper{
  background: #fff;
}
*/

/* Footer Links */
.block-contact, .footer-container li a{
  color: #fff;
}

@media (min-width: 992px){
  .block-contact.col-md-3.links.wrapper{
    text-align: right;
    width: 50%;
  }
}

/* Footer Copyright aus */
p.text-sm-center{
  display: none;
}

#footer .h1, .h2, .h3, .h4, body {
    color: #000;
}

.block-contact, .footer-container li a {
    color: #fff;
}


/* =========================================================
   PRODUKTE / KATEGORIE
   ========================================================= */

.card {
    position: relative;
    display: block;
    background-color: #fff;
    border-radius: 0;
    border: 0px solid rgba(0,0,0,.125)
}

#products .all-product-link,
.featured-products .all-product-link,
.product-accessories .all-product-link{
  color: #000;
}

.block-category{
  min-height: auto;
  margin-bottom: 0;
}

.card-block{
  padding-left: 0rem;
}

#products{
  color: #000;
}

/* färbt alle p global.*/
.page-content.page-cms ul, p{
  color: #000;
}

.page-content.page-cms{
  padding: 0rem;
}

.h1, h1{ font-size: 2rem; }

section#content{ min-height: auto; }

.product-information{ color: #000; }

#product-details .label{ color: #000; }

#product-modal .modal-content .modal-body .product-cover-modal,
.product-cover img{
  background: none;
}

.cart-summary-line .value{ color: #24b9d7; }

.product-line-grid-right .cart-line-product-actions,
.product-line-grid-right .product-price{
  color: #d7d7d7;
}
.product-line-grid-right .cart-line-product-actions .remove-from-cart,
.product-line-grid-right .product-price .remove-from-cart{
  color: #d7d7d7;
}

/* Produktseite Button Warenkorb */
.add{
  padding: 0 5px 0px 0px;
}

/* Produktcontainer */
.product-miniature .thumbnail-container{
  position: relative;
  height: auto;
  margin-bottom: 1.563rem;
  overflow: hidden;
  background: #fff;
}

.product-miniature .product-description{
  position: relative;
  bottom: 0;
  height: auto;
  padding: .25rem .25rem .7rem;
  background: #fff;
}

.product-miniature .highlighted-informations{
  position: absolute;
  top: 100%;
  z-index: 2;
  width: 100%;
  height: auto;
  padding: .625rem 0;
  text-align: center;
  background: #fff;
  -webkit-transition: .3s;
  transition: .3s;
}

/* =========================================================
   STARTSEITE / CAROUSEL
   ========================================================= */
.carousel{ background-color: #fff; }

.carousel .carousel-inner{
  height: auto;
  min-height: max-content;
}

.carousel-indicators{ bottom: -20px; }


.carousel .carousel-indicators{
    display: flow;
  }

  .carousel .carousel-control .icon-next i,
  .carousel .carousel-control .icon-prev i{
    font-size: 3.125rem;
    color: #fff;
    display: none;
  }

  .carousel .carousel-control.left, .carousel .carousel-control.right {
    background: 0 0;
    display: none;
}
  
/* Schwarze Abschlusslinie + türkiser Schatten – ALLEN Bildschirmgrößen 
section#main{
  position: relative;
  border-bottom: 5px solid #000; 
}*/

/* türkiser Schatten unterhalb der Linie 
section#main::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
*/

  /* 5px Border + 1.2px Abstand 
  bottom: -6.2px;

  height: 1.2px;
  background-color: #53dbd5;

  pointer-events: none;
}
*/

/* =========================================================
   KONTAKT / KUNDENBEREICH
   ========================================================= */

form .form-control-label{ color: #000; }
.form-control-comment{ color: #000; }
.contact-form h3, .contact-rich h4{ color: #000; }
label[for="id_contact"]{ opacity: 0%; }

/* Kundenbereich */
.page-authentication #content,
.page-registration #content{
  background: #c1e1e0;
}
.page-customer-account #content{
  background: #c1e1e0;
}
.page-order-detail .box{
  background: #c1e1e0;
}
.page-order-detail h3{ color: #000; }
.thead-default th{ color: #c1e1e0; }
.psgdprinfo17{ background: #c1e1e0; }
h1, h2, h3, h4, h5, h6{ color: #000; }
.page-addresses .address .address-footer a{ color: #000; }
.page-addresses .address{
  background: #c1e1e0;
  color: #000;
}
#order-return-infos .thead-default th,
.page-addresses .addresses-footer a,
.page-addresses .addresses-footer a:hover,
.page-my-account #content .links a:hover{
  color: #24b9d7;
}
.custom-checkbox input[type="checkbox"] + span .checkbox-checked{ color: #000; }
#history .orders .order a h3,
body#checkout #order-summary-content a .step-edit{
  color: #000;
}
.page-customer-account #content{ color: #000; }

/* Artikelseite */
.product-information .product-description ul li{ color: #000; }
.product-prices .tax-shipping-delivery-label{ color: #000; }
.quickview .modal-content{ background: #c1e1e0; }

#product-description-short ol li,
#product-description-short ul li,
.product-information .product-description ol li,
.product-information .product-description ul li{
  color: #000;
}

.product-price{ color: #24b9d7; }

#wrapper .breadcrumb li:last-child{ color: #000; }

.tabs .nav-tabs .nav-link{ color: #000; }

.product-flags li.product-flag{ background: #d7d7d7; }

.close{
  color: #000;
  opacity: 1.0;
}

.tabs{
  padding-top: 0rem;
  padding-right: 0rem;
  padding-bottom: 0rem;
  padding-left: 0rem;
}

/* Tabs/Navigation aus */
.nav-item{ display: none; }

/* Artikel wurde in den Korb gelegt */
#blockcart-modal .cart-content .page-content.page-cms ul .label,
#blockcart-modal .cart-content .page-content.page-cms ul .value,
#blockcart-modal .cart-content p .label,
#blockcart-modal .cart-content p .value,
.page-content.page-cms #blockcart-modal .cart-content ul .label,
.page-content.page-cms #blockcart-modal .cart-content ul .value,
.page-order-detail .order-items .order-item .desc .name{
  color: #363a42;
}

/* =========================================================
   CHECKOUT
   ========================================================= */
.label, label{ color: #000000; }

body#checkout section.checkout-step{
  background-color: #c1e1e0;
}

body#checkout section.checkout-step .address-item.selected{
  background: #c1e1e0;
}
body#checkout section.checkout-step .address-item{
  background: #c1e1e0;
}
body#checkout section.checkout-step .add-address a{
  color: #24b9d7;
}

.text-muted{
  color: #000 !important;
}

body#checkout section.checkout-step .delivery-options .delivery-option{
  background: #c1e1e0;
}

#mobile_top_menu_wrapper .top-menu,
.nav-item .nav-link.active,
.nav-item .nav-separtor.active,
.page-addresses .address .address-footer a:hover,
body#checkout,
body#checkout section.checkout-step .add-address a{
  color: #000;
}

body#checkout #order-summary-content h4.h4{ color: #000; }
body#checkout #order-summary-content h4.black{ color: #000; }

body#checkout #order-summary-content #order-items h3.h3{
  margin-top: 1.25rem;
  color: #000;
}

body#checkout #order-summary-content .summary-selected-carrier{
  background-color: #c1e1e0;
}

body#checkout #order-summary-content .order-confirmation-table{
  background-color: #c1e1e0;
}

#order-items table tr.total-value,
.bootstrap-touchspin .btn-touchspin:hover{
  background-color: #c1e1e0;
}

.definition-list dl dd,
.definition-list dl dt{
  background: #c1e1e0;
}

.definition-list dl dd:nth-of-type(2n),
.definition-list dl dt:nth-of-type(2n),
.product-features > dl.data-sheet dd.value:nth-of-type(2n),
.product-features > dl.data-sheet dt.name:nth-of-type(2n){
  background: #c1e1e0;
}

body{
  background-color: #fff;
}

/* AGB popup checkout */
body#checkout .modal-content{
  background-color: #c1e1e0 !important;
}

/* Artikel Bild Caption */
#product-modal .modal-content .modal-body .image-caption{
  background: #fff;
  border-top: #fff 0px solid;
}

/* Passwort zurücksetzen */
.page-content.page-cms .ps-alert-error .item ul,
.page-content.page-cms .ps-alert-success .item ul,
.ps-alert-error .item .page-content.page-cms ul,
.ps-alert-error .item p,
.ps-alert-success .item .page-content.page-cms ul,
.ps-alert-success .item p{
  background-color: #4cbb6c;
}

/* =========================================================
   MEIN KONTO / SORTIERUNG / AUSBLENDUNGEN
   ========================================================= */
a#order-slips-link{ display: none !important; }

#mobile_top_menu_wrapper .js-top-menu-bottom a,
.dropdown,
body#checkout section.checkout-step small{
  display: none;
}

.page-content.page-cms .products-selection ul,
.page-content.page-cms .products-selection ul .select-title,
.page-content.page-cms .products-selection ul .sort-by,
.products-selection .page-content.page-cms ul,
.products-selection .page-content.page-cms ul .select-title,
.products-selection .page-content.page-cms ul .sort-by,
.products-selection .sort-by-row,
.products-selection .sort-by-row .select-title,
.products-selection .sort-by-row .sort-by,
.products-selection p,
.products-selection p .select-title,
.products-selection p .sort-by{
  display: none;
}

.products-selection .showing{
  display: none;
}

/* =========================================================
   „alles türkise“ / sonstiges Styling
   ========================================================= */
.product-images > li.thumb-container .thumb.selected,
.product-images > li.thumb-container .thumb:hover{
  border: #ffffff 3px solid;
}

#header .header-nav .cart-preview.active{
  background: #fff;
  border: #fff 1px solid;
}

#header .header-nav .blockcart.active a:hover, #header .header-nav .cart-preview.active a, #header .header-nav .cart-preview.active i {
    color: #000;
}

.product-line-grid-right .cart-line-product-actions,
.product-line-grid-right .product-price{
  color: #24b9d7;
}

.product-line-grid-right .cart-line-product-actions .remove-from-cart,
.product-line-grid-right .product-price .remove-from-cart{
  color: #000;
}

#blockcart-modal .product-name{ color: #ffffff; }

.separator{ border-color: #000; }

.bootstrap-touchspin input.form-control,
.bootstrap-touchspin input.input-group{
  width: 2rem;
}

.carousel .carousel-control .icon-next:hover i,
.carousel .carousel-control .icon-prev:hover i,
.dropdown:hover .expand-more,
.page-my-account #content .links a:hover i,
.search-widget form button[type="submit"] .search:hover,
.top-menu .sub-menu a:hover{
  color: #d7d7d7;
}

.form-control:focus{
  outline: .1875rem solid #d7d7d7;
  border-color: #d7d7d7;
}

.quickview .modal-footer{
  border-top: 0px solid rgba(122,122,122,.3);
}

.page-addresses .address .address-footer{
  border-top: 1px solid #000;
}

#order-items hr{
  border-top-color: #000;
}

body#checkout #footer{
  color: #000;
  background: #ffffff;
}


/* Breadcrumb aus */
#wrapper .breadcrumb{
  display: none;
}

.product-miniature .product-title a{
  font-size: 1.0rem;
  color: #000;
}

body#checkout section.checkout-step .step-title{
  border-bottom: 3px solid #fff;
}

body#checkout .cart-grid-right .card .cart-summary-subtotals-container{
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
}

body#checkout section.checkout-step.-reachable.-current .step-number{
  background-color: transparent;
}

.done{ color: #24b9d7; }

.card-block.cart-detailed-subtotals + .cart-summary-totals .cart-total{
  border-top: 1px solid #fff;
}

.product-miniature .product-title{
  text-transform: none;
}

.product-flags li.product-flag.discount,
.product-flags li.product-flag.discount-amount,
.product-flags li.product-flag.discount-percentage{
  background-color: #24b9d7;
}

.has-discount .page-content.page-cms ul,
.has-discount p,
.has-discount.product-price,
.page-content.page-cms .has-discount ul{
  color: #24b9d7;
}

.has-discount .discount{
  background: #24b9d7;
}

#product-modal .modal-content .modal-body .product-images img:hover{
  border: none;
}

#product-modal .modal-content .modal-body .product-images img{
  background: transparent;
}

#subcategories{
  display: none !important;
}

#order-items{
  border-right: #fff 0px solid;
}

body#checkout a:hover{
  color: #24b9d7;
  cursor: pointer;
}

.custom-radio input[type="radio"]:checked + span{
  background-color: #24b9d7;
}

body#checkout section.checkout-step.-reachable.-current .step-number{
  color: #24b9d7;
}

body#checkout #order-summary-content .step-edit:hover{
  color: #24b9d7;
  cursor: pointer;
}

body#checkout #order-summary-content .order-confirmation-table{
  border: 1px solid #fff;
}
body#checkout #order-summary-content .summary-selected-carrier{
  border: 1px solid #fff;
}
.table-bordered th{
  border: 1px solid #fff;
}
.thead-default th{
  background-color: #fff;
}

/* =========================================================
   Desktop Submenu zentriert
   ========================================================= */
@media screen and (min-width: 992px){
  ul.top-menu > li.category{
    position: relative;
  }

  .popover.sub-menu.js-sub-menu{
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    min-width: 200px;
    background: #ffffff;
    z-index: 999;
    text-align: center;
    padding: 0.5rem 1rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  }

  .popover.sub-menu ul.top-menu[data-depth="1"]{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    margin: 0;
    list-style: none;
  }

  .popover.sub-menu ul.top-menu li.category{
    margin: 0.25rem 0;
    width: 100%;
  }

  .popover.sub-menu ul.top-menu li a.dropdown-submenu{
    display: block;
    text-align: center;
    color: #000;
    text-decoration: none;
    padding: 0.5rem;
    transition: background-color 0.3s ease;
  }

  .popover.sub-menu ul.top-menu li a.dropdown-submenu:hover{
    color: #24b9d7;
    background-color: #f2f2f2;
  }
}

/* =========================================================
   Promo / PayPal
   ========================================================= */
.block-promo .promo-input + button{
  border: 2px solid #fff;
}
.block-promo .promo-input{
  border: #fff 1px solid;
}
.block-promo .promo-code-button.cancel-promo{
  color: #000;
}
.block-promo .promo-name .cart-summary-line span{
  color: #000;
}
.block-promo .promo-name .cart-summary-line .label{
  color: #000;
}
.product-prices .tax-shipping-delivery-label{
  display: none;
}

#zoid-paypal-message-uid_8399fc2c3b_mtq6mte6ndu > iframe{
  display: none;
}

/* =========================================================
   LEFT COLUMN AUS + CONTENT 100%
   ========================================================= */
#left-column{
  display: none !important;
}

/* Content Wrapper volle Breite – bootstrap-resistent */
#content-wrapper{
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* Optional: wenn irgendwo noch .left-column Klasse stört */
.js-content-wrapper.left-column{
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* =========================================================

   Abo-Bilder in Kategorie-Beschreibung

   Alle Kacheln kleiner, zentriert

   ========================================================= */

#category-description .abo-row {

  list-style: none !important;

  padding: 0 !important;

  margin: 0 auto 24px auto !important;

  display: flex !important;

  justify-content: center !important;

  gap: 30px !important;

  flex-wrap: wrap !important;

}

/* Alle Abo-Kacheln */

#category-description .abo-row > li {

  flex: 0 0 20% !important;

  max-width: 20% !important;

  text-align: center;

}

#category-description .abo-row img {

  width: 100% !important;

  height: auto !important;

  display: block !important;

}

/* Tablet */

@media (max-width: 991px) {

  #category-description .abo-row > li {

    flex: 0 0 45% !important;

    max-width: 45% !important;

  }

}

/* Mobile */

@media (max-width: 575px) {

  #category-description .abo-row > li {

    flex: 0 0 100% !important;

    max-width: 420px !important;

  }

}

#category-description .abo-spacer {

  height: 24px;

}

#category-description .abo-center {

  text-align: center;

}

#category-description .abo-btn {

  display: inline-block;

  margin-top: 12px;

}
/* =========================================================

   Focus-Rahmen Header-Menü überschreiben

   ========================================================= */

#header a:focus,

#header a:focus-visible {

  outline: none !important;

  box-shadow: none !important;

}

/* =========================================================

   Abo-Bilder in Kategorie-Beschreibung

   Abstand bleibt gleich, Kacheln skalieren sauber

   ========================================================= */

#category-description .abo-row {

  list-style: none !important;

  padding: 0 !important;

  margin: 0 auto 24px auto !important;

  display: flex !important;

  justify-content: center !important;

  gap: 30px !important;

  flex-wrap: wrap !important;

}

/* Desktop: 3 Kacheln pro Reihe, Abstand bleibt 30px */

#category-description .abo-row > li {

  flex: 0 0 calc((100% - 60px) / 3) !important;

  max-width: calc((100% - 60px) / 3) !important;

  text-align: center;

}

#category-description .abo-row img {

  width: 100% !important;

  height: auto !important;

  display: block !important;

}

/* Große Bildschirme ab 1200px: bleiben im 80%-Container, nutzen aber die Reihe voll aus */

@media (min-width: 1200px) {

  body.category-id-3 #category-description .abo-row > li {

    flex-basis: calc((100% - 60px) / 3) !important;

    max-width: calc((100% - 60px) / 3) !important;

  }

}

/* Tablet: 2 Kacheln pro Reihe */

@media (max-width: 991px) {

  #category-description .abo-row > li {

    flex: 0 0 calc((100% - 30px) / 2) !important;

    max-width: calc((100% - 30px) / 2) !important;

  }

}

/* Mobile: 1 Kachel pro Reihe */

@media (max-width: 575px) {

  #category-description .abo-row > li {

    flex: 0 0 100% !important;

    max-width: 420px !important;

  }

}

#category-description .abo-spacer {

  height: 24px;

}

#category-description .abo-center {

  text-align: center;

}

#category-description .abo-btn {

  display: inline-block;

  margin-top: 12px;

}


/* =========================================================
   Header kleiner Bildschirm:
   Logo links -> Menü zentriert -> Suche links
   ========================================================= */

@media (max-width: 1199px) {

  #header .header-top .container > .row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
  }

  /* Direkte Spalte mit Logo */
  #header .header-top .container > .row > div:has(#_desktop_logo) {
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    text-align: left !important;
    margin-bottom: 20px;
  }

  #header #_desktop_logo {
    text-align: left !important;
  }

  /* Direkte Spalte mit Menü */
  #header .header-top .container > .row > div:has(#_desktop_top_menu),
  #header .header-top .container > .row > div:has(.top-menu) {
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    text-align: center !important;
    margin-bottom: 25px;
  }

  #header .top-menu {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
  }

  /* Direkte Spalte mit Suche */
  #header .header-top .container > .row > div:has(#search_widget) {
    order: 3 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    text-align: left !important;
  }

  #header #search_widget {
    width: 100% !important;
    max-width: 650px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }

  #header #search_widget form {
    width: 100% !important;
  }
}

/* Banner Startseite zentrieren / Satzspiegel füllen */
body#index a.banner,
body.page-index a.banner {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-bottom: 1rem !important;
  text-align: center !important;
}

body#index a.banner img,
body.page-index a.banner img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
}