@media (min-width:0px) and (max-width: 768px) {
  /* Neuheiten Produktslider auf der Startseite in mobilen Ansichten ausblenden */
  /*   div.opc-new-products-slider-title {
    display: none !important;
  }
  div.opc-new-products-slider-content, div.opc-product-slider {
    display: none !important;
  } */

  main#main-wrapper {
    margin-top: 42px;
  }
  div#boxes-footer-mobile {
    display: block !important;
  }
  div#footer-custom > div.container {
    display: none !important;
  }
}


/* Header Anordnungen für mobile Ansichten */
@media (min-width:360px) and (max-width:992px) {
  div#header-logo-menue-box > div#logo img {
    margin-left: 0px !important;
  }
}
@media (min-width:360px) and (max-width:576px) {
  ul#shop-nav-header > li {
    width: 42px !important;
  }
}
@media (min-width:360px) and (max-width:768px) {
  label#navbar-toggle-btn-label {
    display: none;
  }
}
@media (min-width:576px) and (max-width:768px) {
  ul#shop-nav-header > li {
    width: 42px !important;
  }
}



/* Sprachauswahl für mobile und Desktop Ansicht positionieren */
@media(min-width: 360px) and (max-width:768px) {
  div#header-logo-menue-box > li.nav-item.language-dropdown {
    list-style: none;
  }
  div#header-logo-menue-box > li.nav-item.language-dropdown {
    order: 4;
    max-width: 10px;
  }
  div#header-logo-menue-box > li.nav-item.language-dropdown div.dropdown-menu-right {
    z-index: 9999;
  }
}
@media(min-width: 768px) and (max-width:992px) {
  div#header-logo-menue-box > li.nav-item.language-dropdown {
    list-style: none;
  }
  div#header-logo-menue-box > li.nav-item.language-dropdown {
    order: 4;
    max-width: 10px;
    margin-left: -10px;
  }
  div#header-logo-menue-box > li.nav-item.language-dropdown div.dropdown-menu-right {
    z-index: 9999;
  }
}





/* Menü Navigation für mobile ansicht und Desktop Ansicht positionieren */
@media (min-width: 360px) and (max-width: 992px) {
  div#mainNavigation {
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: var(--white);
  }
  div#categories-mega-desktop-header {
    display: none;
  }

  div#header-logo-menue-box > div#logo {
    order: 3;
  }
  div#header-logo-menue-box > label#navbar-toggle-btn-label {
    order: 2;
  }
  div#header-logo-menue-box > button#navbar-toggle-btn {
    order: 1;
  }
}

/* Mega Menü Position Desktop */
@media (min-width: 992px) {
  div#header-logo-menue-box {
    flex-direction: row;
  }
  div#header-logo-menue-box > div#logo {
    order: 0;
  }
  div#header-logo-menue-box > label#navbar-toggle-btn-label {
    order: 2;
  }
  div#header-logo-menue-box > button#navbar-toggle-btn {
    order: 1;
    margin-left: 9px;
  }
  
  div#mainNavigation {
    position: absolute;
    top: 102px;
    left: 225px;
  }
  div#mainNavigation ul.navbar-nav > li * {
    color: var(--blue-d4);
  }
  
  div#mainNavigation div.dropdown-menu {
    overflow: initial !important;
  }

  div#categories-mega-desktop-header label h2 {
    cursor: pointer;
  }

  div#categories-mega-desktop-header label h2 {
    text-align: center;
    letter-spacing: 4px;
    font-size: 20px;
    font-weight: bold;
    color: var(--blue-d4);
    margin-bottom: 4px !important;
  }
  div#categories-mega-desktop-header hr {
    height: 1px;
    background-color: black;
    color: var(--blue-d4);
    width: 90%;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }
}

/* Produktbeschreibung für mobile Ansicht */
div#product-offer div.basket-form-inline > div.col {
  display: block;
}

div#content div#tab-description > div.card-body div.desc {
  margin-top: 18px;
  margin-bottom: 32px;
}

/* Gesetzliche informationen Dropdown */
div.dropdown-mobile-footer-information {
  max-width: 94vw;
}
div.dropdown-mobile-footer-information div.card-header {
  background-color: var(--white);
  padding-left: 0px;
}
div.dropdown-mobile-footer-information div.card-header button{
  padding: 0px;
  color: var(--black-m1) !important;
  border-bottom: 1px solid var(--black-m2);
  font-size: 18px !important;
  padding-bottom: 16px;
}
div.dropdown-mobile-footer-information div.card-body {
  border: none;
}
div.dropdown-mobile-footer-information div.card-header button::after{
  color: var(--black-m1) !important;
}
div.dropdown-mobile-footer-law-information {
  max-width: 94vw;
}
div.dropdown-mobile-footer-law-information div.card-header {
  margin-top: 0px;
  background-color: var(--white);
  color: var(--black-m1) !important;
  padding-left: 0px;
}
div.dropdown-mobile-footer-law-information div.card-header button {
  padding: 0px;
  border-bottom: 1px solid var(--black-m2);
  color: var(--black-m1) !important;
  font-size: 18px !important;
  padding-bottom: 16px;
}
div.dropdown-mobile-footer-law-information div.card-header button::after {
  color: var(--black-m1) !important;
}
div.dropdown-mobile-footer-law-information div.card-body {
  border: none;
}

div#footer-custom-mobile div#footer-custom-mobile-social-media ul{
  list-style: none;
  padding: 0px;
  display: flex;
  flex-direction: row;
  align-items: center;
}
div#footer-custom-mobile div#footer-custom-mobile-social-media ul li{
  border: 1px solid var(--grey-3);
  margin-left: 5px;
  margin-right: 5px;
  width: 44px;
  height: 38px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
div#footer-custom-mobile div#footer-custom-mobile-social-media ul li i{
  padding: 5px;
  font-size: 24px;
  margin: 0px auto;
}

div#footer-information-footnote {
  display: none !important;
}
/* Kategorien Slider Buttons nur ab bestimmter Screengröße anzeigen */
button#scroll-cat-left {
  display: none !important;
}

button#scroll-cat-right {
  display: none !important;
}

/* Kategorien Slider in mobilen Ansichten ausblenden */
div.custom-portlet-grid-categories {
  display: none;
}







@media (min-width:0px) and (max-width:992px) {
  /* Ähnliche Artikel Produktslider in der Produktdetailseite ausblenden */
  div.recommendations {
    display: none;
  }
  /* Warenkorbfarbe in mobilen Ansichten */
  div#result-wrapper form#buy_form div#add-to-cart button[name='inWarenkorb'] {
    background-color: var(--orange);
  }
  div#result-wrapper form#buy_form div#add-to-cart span.btn-basket-check span {
    color: var(--blue-d4) !important;
  }
  div#result-wrapper form#buy_form div#add-to-cart span.btn-basket-check i.fa-shopping-cart {
    color: var(--blue-d4) !important;
    border: none !important;
  }
}

@media (min-width: 768px) {
  /* Header Anpassungen */
  header#jtl-nav-wrapper {
    border-bottom: 10px solid var(--blue);
  }

  /* Suchleistenrahmen ausblenden */
  li#search {
    box-shadow: 2px 2px 5px #888888;
  }
  
  /* Korrektur clear Button */
  li#search span.form-clear {
    right: 32px !important;
  }

  ul#shop-nav a.nav-link-custom {
    margin-top: 0px;
  }

  /* Merkmaltabelle */
  div.card-body table.table{
    border: 2px solid var(--blue);
  }
  
  div.product-attributes tbody tr td.h6 {
    text-transform: uppercase;
    vertical-align: middle;
    font-family: 'Titillium Web';
    font-weight: 900;
    color: #000000;
    font-size: 12px;
  }
  
  div.product-attributes tbody tr td.attr-value {
    display: inline-block;
    background-color: orange;
    color: white;
    text-align: center;
    padding: 4px 13px;
    margin-top: 8px;
    margin-bottom: 8px;
    margin-right: 10px;
    border-radius: 20px;
    border-bottom: 11px !important;
    font-size: 11px;
    font-weight: 900;
    width: 100%;
    max-width: 300px;
  }
  tr.attr-custom:nth-child(odd) td:nth-child(2) {
    background-color: #f19b39;
  }
  tr.attr-custom:nth-child(even) td:nth-child(2) {
    background-color: var(--blue);
  }
}

@media (min-width: 992px) {
  /* In der Produktbeschreibung Dropdown Menü "Beschreibung ausblenden" */
  div#tab-description-head {
    display: none;
  }

  li#search span.form-clear {
    right: 100px;
  }
}

@media (max-width: 991px) {
  div#mainNavigation ul li a.nav-link span {
    color: #000 !important;
  }
}

/* Header Logo Positionsanapssung */
@media (min-width:992px) {
  nav.navbar div#logo {
    width: 200px;
  }
  div#layout-header-nav-search {
    align-self: center;
  }
}

/* Suchfeld nach responsive design anpassen */
@media (min-width:768px) and (max-width:880px) {
  div.twitter-typeahead {
    width: 20vw;
  }
}
@media (min-width:880px) and (max-width:992px) {
  div.twitter-typeahead {
    width: 26vw;
  }
}
@media (min-width:992px) and (max-width:1105px) {
  div.twitter-typeahead {
    width: 21vw;
  }
}
@media (min-width:1105px) and (max-width:1218px) {
  div.twitter-typeahead {
    width: 26vw;
  }
}
@media (min-width:1218px) and (max-width:1331px) {
  div.twitter-typeahead {
    width: 30vw;
  }
}
@media (min-width:1332px) and (max-width:1444px) {
  div.twitter-typeahead {
    width: 32vw;
  }
}
@media (min-width:1444px) and (max-width:1557px) {
  div.twitter-typeahead {
    width: 34vw;
  }
}
@media (min-width:1557px) and (max-width:1670px) {
  div.twitter-typeahead {
    width: 36vw;
  }
}
@media (min-width:1670px) and (max-width:1783px) {
  div.twitter-typeahead {
    width: 38vw;
  }
}
@media (min-width:1783px) {
  div.twitter-typeahead {
    width: 40vw;
  }
}







/* Ähnliche Artikel Vorschläge und Slider Buttons Responsive auf der Produkdetailseite anpassen */
@media (min-width:992px) and (max-width:1105px) {
  div.recommendations button.slick-next {
    right: -34px;
  }
}
@media (min-width:1105px) and (max-width:1218px) {
  div.recommendations button.slick-next {
    right: -34px;
  }
}
@media (min-width:1218px) and (max-width:1331px) {
  div.recommendations button.slick-next {
    right: -34px;
  }
}
@media (min-width:1331px) and (max-width:1444px) {
  div.recommendations button.slick-next {
    right: -34px;
  }
}
@media (min-width:1444px) and (max-width:1557px) {
  div.recommendations button.slick-next {
    right: -34px;
  }
}
@media (min-width:1557px) and (max-width:1670px) {
  div.recommendations button.slick-next {
    right: -34px;
  }
}
@media (min-width:1670px) and (max-width:1783px) {
  div.recommendations button.slick-next {
    right: 20px;
  }
}
@media (min-width:1783px) {
  div.recommendations button.slick-next {
    right: 20px;
  }
}
