
#productlistwrapper, #productview, input.anmerkung { display: none; }

  /* Das Produkt ausfüllformular:    */

  input.anmerkung { border-bottom: none; border-right: none; border-left: none; padding-top: 0px; }
  input.anmerkung::placeholder, input.anmerkung:-ms-input-placeholder, input.anmerkung::-ms-input-placeholder { opacity: 1; color: #5b3b12; }

.product-price-summary::after, #ppreis::after {
  content: "*";
}
#indenwarenkorb:hover { cursor: pointer; }

#pinforow {
  position: relative;
  padding: 70px 30px 120px 30px;
  max-height: calc(90vh - 200px);
  overflow-y: scroll;
}

#buyrow select, #buyrow input { width: 100%; }
#buyrow input { margin: 10px 0px 0px 0px; padding: 22px 0px; font-size: 1.1em; }
.infooverlay small { font-size: 1em; }


.innerpopupcontent {
  position: relative; height: 100%; overflow: hidden;
}

#pquantity { background: none!important; }

.pricewrap { font-size: 0.9em; }

.view-commerce-products .messages.messages--status {
  display: none!important;
}

.pname {
position:relative;
width: 100%;
font-size: 1.7em;
line-height: 1.2em;
text-transform: uppercase;
}

#ppreis { font-size: 1.4em; line-height: 1.2em; padding-right: 50px; transition: all 0.1s; }
#indenwarenkorb:hover #ppreis { padding-right: 60px; }
#pinforow > .flexbox-container { align-items: flex-start; align-content: flex-start; }
.infooverlay > div { line-height: 1.1em; margin-bottom: 6px; }
.productpopup .close-btn {
  position: absolute;
}

.infooverlay { opacity: 0.5; }

.productpopup .innerpopup {
  height: auto; max-height: 90vh; width: 700px;
  max-width: 96vw;
}

.view-produkt { display: block!important; }
.productpopup .innerpopupcontent.flexbox-container { max-height: 90vh; height: 500px; align-items: flex-start; }

.bottomfixed {
  position: fixed; bottom: 0px; left: 0px; width: 100%; margin-top: 1px; z-index: 1;
}

#indenwarenkorb {
  padding: 30px;
  font-size: 1.2em;
  font-weight: bold;
}

#zusatzstoffedetails, #allergendetails, #allergenspurendetails { display: none; }

.plink:hover {
  cursor: pointer;
}

.flexauswahl {
  padding: 0px;
  background: inherit;
  border-top: 1px solid inherit;
}


.selfeld { margin: 0px; }
.selfeld:hover { cursor: pointer; }
#buyrow .selfeld select { width: 100%; padding: 22px 60px 22px 0px; }
.selfeld select { font-size: 1.1em; }
#pquantity { font-size: 1.2em; }
 #pquantity { padding: 18px 18px; }

 .quantitywrap { width: 160px; border: none; }
 #pquantity { width: 80px; }
 .flexcart #indenwarenkorb {
   width: calc(100% - 160px); border: none; text-align: center; margin: 0px!important;
 }

 .teigwahl .flexbox-container { align-content: center; align-items: center; }

.titlerow { display: flex!important; align-content: flex-start; align-items: flex-start; margin-bottom: 20px; }

.neu { position: absolute; padding: 6px 20px; top: 10px; right: 10px; z-index: 1;
 font-size: 0.8em!important; text-transform: uppercase; }

.varcatimage { width: 220px; height: 129px; display: none; }
.varname { text-transform: lowercase; }

.page-node-2 .page-body {
  padding-top: 0px;
}

.mitfahrnavi {
  position: relative;
  padding-bottom: 5px;
  width: calc(100% - 60px);
  margin: 0px 30px;
 }

 .ps-scrollbar-y-rail { display: none!important; }
 .ps-scrollbar-x-rail { position: absolute; z-index: 100; bottom: 5px!important; border-bottom: 1px solid #FFF; }
 .ps-scrollbar-x { position: absolute; height: 8px; background: #FFF; }

.mitfahrnavi .mitfahrwrap {
  position: relative;
  text-align: center;
  width: 100%;
  height: 43px;
  display: block;
  margin: 0px;
  overflow-x: hidden;
  overflow-y: hidden;
}

.mitfahrnavi .mitfahrwrap .views-group {
  position: absolute;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  overflow-x: visible;
}

.mitfahrnavi .views-group .views-row, .mitfahrnavi .views-group .views-row a {
  position: relative;
  height: 43px; display: inline-block;
}

.mitfahrnavi .views-row a {
   display: inline-block;
   margin: 0rem 1.15rem;
   font-size: 1em;
   letter-spacing: 0.09em;
   transition: all 0.9s;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.mitfahrnavi .views-row:first-child a {
   margin: 0rem 1.15rem 0rem 0rem;
}
.mitfahrnavi .views-row:last-child a {
   margin: 0rem 0rem 0px 1.15rem;
}

.page-node-2 #productlist.alleprodukte .views-group:nth-child(1) {
  margin: 20px auto 80px auto;
     }

.produktansicht .views-group {
  padding: 80px 0px 80px 0px;
  display: grid; grid-template-columns: 32% 32% 32%; grid-column-gap: 120px;
  /* fuer IE  */
   display : -ms-flexbox;
   flex-wrap : wrap; -ms-flex-pack : distribute; justify-content : space-around;

   }

.produktansicht a:hover img { transform: scale(1.1); }

.shorttext { color: #828282; text-align: left; font-size: 0.8em; margin-top: 15px; }


@media screen and (max-width: 1920px) {

.produktansicht .views-group {
  grid-column-gap: 80px;
 }

 }

@media screen and (max-width: 1440px) {
  .produktansicht .views-group img { max-width: 350px; }
  .produktansicht .views-group {
    max-width: 1280px;
    margin: 0px auto;
}
.produktansicht .views-group .stoffwrapper {
  text-align: left;
}

.produktansicht .views-group {
  padding: 60px 0px 60px 0px;
  grid-column-gap: 40px;
 }

 }


 @media screen and (max-width: 1024px) {

   .produktansicht .views-group {
     grid-template-columns: 50% 50%;
     padding: 50px 0px 50px 0px;
     grid-column-gap: 30px;
    }

  }

 @media screen and (max-width: 600px) {
   .produktansicht .views-group { display: grid; grid-template-columns: 100%; grid-column-gap: 0px; }
   .produktansicht .views-group:first-child .views-row:first-child { margin: 0px auto 20px auto; }
   .produktansicht .views-group .views-row { width: 100%; max-width: 100%; margin: 20px auto; text-align: center;  }
 }

.produktansicht .views-group .views-row { position: relative; overflow: hidden; margin-bottom: 30px;}
  /* mir fehlt noch ein Hack .produktansicht .views-group .views-row { width: 30%; } */

.zusatzstoffe {
 display: flex;
-webkit-flex-flow: row wrap;
justify-content:flex-start;
 flex-wrap : wrap; -ms-flex-wrap : wrap;
  -ms-flex-pack:justify;
 margin: 0px 0px 10px 0px;
}

.zusatzstoffe .stoffwrapper { display: inline-block; padding: 0px 20px 0px 0px; margin-right: 20px; }
 .zusatzstoffe div:nth-child(4) {  padding-right: 0px; margin-right: 0px; }

.zusatzstoffe p { color: #828282; font-size: 0.84em; margin-bottom: 0px; }
.zusatzstoffe .counter { font-family: 'Jost'; font-size: 1.2em; margin-bottom: 0px; color: #828282; }
.zusatzstoffe .counter_name, .zutaten-content small, .extrainfos small { font-size: 0.75em; margin-bottom: 0px; color: #718A82; }
.zutaten-content small { margin-bottom: 20px; color: #000; padding: 0px 10px;  }

.produktansicht .zusatzstoffe .stoffwrapper {
    margin-top: 8px;
    padding: 6px 12px 6px 0px;
    margin-right: 12px;
}
.productdescription { font-size: 1em; }
.produktansicht .zusatzstoffe p { font-size: 0.7em; }
.product-name { margin: 50px 10px 0px 0px; font-size: 1.25em; line-height: 1.2em; text-align: left; text-transform: uppercase; letter-spacing: 0.01em; }
.product-price-summary, .rabattpreis { margin-top: 0px; display: block; font-size: 1.2em; text-align: left; line-height: 1.2em; }
.pricewrap { margin-top: 50px; margin-left: 15px; }
.rabattpreis { margin-bottom: 3px; opacity: 0.4; }

.zutaten { text-align: left; margin-top: 35px; }

.produktansicht .views-group { padding: 40px 60px 40px 60px; }
.produktansicht .views-group .views-row { margin-bottom: 60px; padding: 14px; }
.produktansicht .views-group .product-image, .produktansicht .views-group .product-image img { transition: all 0.6s; }
.produktansicht .views-group .views-row:hover .product-image, .paragraph-id--617 .field--item:hover img { transform: scale(0.98); }

.productrows .rows {
  display: grid;
 grid-template-columns: 25% 25% 25% 25%;
  grid-row-gap: 20px;
 grid-column-gap: 20px;
}


#productlist { padding: 0px 0px 50px 0px; }
#productlist .views-group:first-child {
  padding-top: 0px;
}

@media only screen and (max-width: 1920px) {
  .produktansicht .views-group {
      padding: 20px 80px 20px 80px;
  }

}

@media only screen and (max-width: 1440px) {
  .mitfahrnavi .views-group { font-size: 0.9em; }
   .productrows .rows { grid-template-columns: 33% 33% 33%; }
   .product-row .product-image img { max-height: 500px; margin: 0px auto; }
   .produktansicht .views-group { padding: 50px 4px; }
   #pinforow { padding-top: 60px; }
   .infooverlay { font-size: 0.9em; }
   .mitfahrnavi .views-row a {
    font-size: 0.95em;
    letter-spacing: 0.05em;
  }
  .produktansicht .views-group .views-row {
    margin-bottom: 50px;
    padding: 4px;
  }

}

@media only screen and (max-width: 1200px) {
  .mitfahrnavi .views-group { justify-content: flex-start; }
}

@media only screen and (max-width: 768px) {

  .product-name, .pricewrap { margin-top: 20px; }

  .selfeld select, #buyrow input { font-size: 1em; }

 .bottomfixed > div.flexbox-container, #pinforow > .flexbox-container { display: flex; }

 .produktansicht .views-group .views-row {
  margin-bottom: 15px;
}

  .mitfahrnavi .views-row a {
      font-size: 0.95em;
      letter-spacing: 0.05em;
  }

  #productlist .flexbox-container { display: flex; }

   .productrows .rows { grid-template-columns: 50% 50%; }
   .mitfahrnavi .views-group .views-row {
    padding: 0px 4px;
    height: 30px;
}
   .product-row .product-image img { max-height: 500px; margin: 0px auto; }

   .page-node-2 .page-body {
     padding-top: 0px;
   }

}
@media only screen and (max-width: 480px) {

  #pquantity { width: 60px; }

  .flexcart #indenwarenkorb {
    width: calc(100% - 140px);
  }

  #pinforow {
  padding-left: 20px;
  padding-right: 20px;
}

  .produktansicht .views-group { padding: 30px 0px 30px 0px; }

  .titlerow {
    margin-bottom: 8px;
  }

  .neu {
    font-size: 0.65em;
    padding: 0px 0px 6px 40px;
  }

  .produktansicht .views-group .views-row {
    padding: 10px 0px;
  }

   .productrows .rows { grid-template-columns: 100%; }
   .mitfahrnavi .views-group .views-row {
    padding: 0px 2px;
    height: 30px;
}
   .product-row .product-image img { max-height: 400px; margin: 0px auto; }
    .mitfahrnavi .views-row a {
        font-size: 0.85em;
        letter-spacing: 0.02em;
    }

}


@media only screen and (min-width: 0px) and (max-width: 768px) {
.zusatzstoffe .stoffwrapper {  font-size:80%;  }

}


@media screen and (min-width: 1024px) {

  #header .mitfahrnavi {
    margin-top: 0px;
    padding-bottom: 0px;
  }

}

@media screen and (min-width: 1440px) {
  #productlist { padding: 0px 0px 50px 0px; }
}

@media screen and (min-width: 1600px) {
  #productlistwrapper { padding-top: 40px; }
  .mitfahrnavi .views-row a {
    padding-bottom: 5px;
  }
}


@media screen and (min-width: 1920px) {
  #header .mitfahrnavi {
    margin-top: 0px;
    padding-top: 18px;
    padding-bottom: 5px;
  }
}
