#ajaxcart {
  display: inline-block;
}

#pagecart, DIV.nopagecart, #pageorderadmin {
  text-align: center;
  font-size: 0.8rem;
  z-index: 1000;  /* to prevent status (999) from triggering mouseleave */
  display: inline-block;
}

#pageorderadmin {
  margin-top: 5px;
  position: absolute;
}

@media (max-width: 700px) {
   #pageorderadmin {
      margin-left: 60px;
   }
}

#pagecart {
   position: relative;
}


#pagecart IMG {
  border: 0;
}

#pagecartitems {
  display: none;
  width: 420px;
  max-height: 400px;
  background-color: white;
  overflow-y: auto;
  text-align: left;
  padding: 4px;
  border: 1px solid black;
  border-radius: 8px;
  position: absolute;
  right: 0px;
  top: 0px;
  margin: -1px;
  font-size: 1rem;
  padding-bottom: 20px;
}


#pagecartitems li {
  list-style: none;
  border-bottom: 1px solid #CCC;
}

#pagecartitems li.item.total {
   font-weight: bold;
}

#pagecartitems SPAN {
  display: inline-block;
  border: 0px solid green;
  white-space: nowrap;
  overflow: hidden;
  margin: 0;
}

#pagecartitems SPAN.amount, #pagecartitems SPAN.price {
  text-align: right;
  width: 25px;
  padding-right: 3px;
}

#pagecartitems SPAN.price {
  text-align: right;
  width: 70px;
}


#pagecartitems SPAN.text {
  width: 250px;
}



#nopagecart {
  position: absolute;
  background-color: white;
  width: 85px;
  height: 85px;
  top: 3px;
  left: 3px;
}

@media (max-width: 600px) {
  #pagecartitems {
     position: fixed;
     top: 0px;
     left: 0px;
     right: 0px;
     width: calc(100% + 2px);
     border: 0px;
     border-radius: 0px;
     border-bottom: 1px solid black;
     padding-top: 30px;
     padding-bottom: 30px;
     box-shadow: 0px 0px 16px 1px #4446;
  }
}



/***** Team    ******/

div.team {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-column-gap: 30px;
  grid-row-gap: 30px;
}


div.team div.member {
  position: relative;
  border-radius: 8px;
  background-size: 110% !important;
  transition: all 0.2s;
  min-width: 190px;
}



div.team div.member.group {
  grid-column: span 2;
  background-size: 100% !important;
}

/* for very small sizes: make group images single column */

@media (max-width: 500px) {
   div.team {
      grid-template-columns: repeat(auto-fit, minmax(123px, 1fr));
   }
}

div.team div.member img.portrait {
  width: 100%;
  visibility: hidden;
}

div.team div.member div.caption {
  position: absolute;
  bottom: 25px;
  width: 100%;
  color: black;
  text-align: center;
  padding-top: 17px;
  padding-bottom: 17px;
  opacity: 0.8;
  background: url(/localmedia/img/banderole-lang.gif) repeat-x;
  background-size: cover;
  font-size: 0.8em;
}

div.team div.group.member:hover, 
div.team div.group.member:focus {
  background-size: 105% !important;
}

div.team div.member:hover, 
div.team div.member:focus {
  background-size: 113% !important;
}




div.team div.member:hover div.caption,
div.team div.member:focus div.caption {
  opacity: 1;
}

div.member.group div.caption {
  height: auto !important;
}

div.team div.member div.caption span {
   display: block;
}

div.team div.member div.caption span.email {
  display: none;
}

div.team div.member:hover div.caption span.email, 
div.team div.member:focus div.caption span.email {
  display: block;
}

div.team div.member div.caption span.name {
   font-family: ott_title !important;
   text-transform: uppercase;
}



div.vcards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  grid-column-gap: 20px;
  grid-row-gap: 20px;
}

@media (max-width:600px) {
  div.vcards {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }
}

div.vcard {
  border: 1px solid #DDD;
  border-radius: 8px;
  padding: 8px;
  box-shadow: 0px 0px 16px 1px #4442;
}

div.vcard p {
  margin-top: 1em;
}

DIV.vcard LABEL, LABEL.inline, div.tile label {
  float: none;
  margin: 0;
  padding: 0;
  width: 45px;
  text-align: left;
  font-size: 0.8em;
  color: #888;
  display: inline-block;
}






/* Bezugsquellen */

ul.bezugsquellen {
  margin-top: 20px;
  list-style-type: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  grid-column-gap: 20px;
  grid-row-gap: 20px;
}

@media (max-width:350px) {
  ul.bezugsquellen {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-row-gap: 10px;
  margin-top: 10px;
  }
}


ul.bezugsquellen li:before {
}

ul.bezugsquellen li {
  margin: 0;
  border: 1px solid #DDD;
  border-radius: 8px;
  padding: 8px;
  box-shadow: 0px 0px 16px 1px #4442;
  position: relative;
}

ul.bezugsquellen li a {
  font-family: Barlow Condensed !important;
  color: #005995;
  text-decoration: underline;
}

ul.bezugsquellen li span.name a {
  font-weight: 600;
}

ul.bezugsquellen li a:hover {
  background-color: lightblue;
}



ul.bezugsquellen li span.adresse {
  display: block;
}


ul.bezugsquellen li span.distanz {
  position: absolute;
  right: 10px;
  top: 8px;
  color: #DDD;
  font-family: ott_title; text-transform: uppercase;

}


/* Herkunft der Fruechte */

div.grid.herkunft {
    grid-column-gap: 2em;
    grid-row-gap: 1em;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

div.grid.herkunft div.zutat {
  text-align: center;
}

div.grid.herkunft div.zutat img {
   margin-bottom: -10px;
   width: 120px;
}

div.grid.herkunft div.zutat h2 {
  font-size: 1em;
  background-position: center bottom;
}

@media(max-width: 450px) {
  div.grid.herkunft {
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  }
}


div.searchresults {
   margin-top: 40px;
}


div.searchresults img {
  float: left;
  margin: 2em;
  display: block;
}

div.searchresults ul {
  display: block;
  float: left;
}


/* social media */

a.social {
  display: inline-block;
  width: 36px;
  height: 36px;
  background-size: contain;
  filter: grayscale(0.8);
}

a.social:hover {
  filter: grayscale(0);
}

a.social.facebook {
   background-image: url(/files/layout/social/facebook.png);
}

a.social.instagram {
   background-image: url(/files/layout/social/instagram3.png);
}

a.social.youtube {
   background-image: url(/files/layout/social/youtube.png);
}

a.social.twitter {
   background-image: url(/files/layout/social/twitter.png);
}

a.social.whatsapp {
   background-image: url(/files/layout/social/whatsapp.png);
}




/* Rezeptarchiv, quick hack */

center.rezeptarchiv table {
  width: 100%;
}

center.rezeptarchiv table hr {
   width: 100%;
}

center.rezeptarchiv table img {
  max-width: 100%;
}

div.rezeptarchiv div.tile  {
   margin: 20px 20%;
}


center.rezeptarchiv li {
   list-style: none;
   padding-left: 30px;
   background: url(/files/layout/spoon-24.png) left top no-repeat;
   line-height: 28px;
}


div.rezeptarchiv li {
   list-style: none;
   padding-left: 30px;
   background: url(/files/layout/cutlery-24.png) left center no-repeat;
   line-height: 28px;
   margin-left: -10px;
}


/* Zertifikationen */

div.tile.cert {
  position: relative;
  margin: 90px 15%;
  padding-left: 180px;
  padding-bottom: 40px;
}


div.tile.cert div.headerimage img {
  left: -35px;
  top: -50px;
  width: 180px;
  height: 180px;
}

@media(max-width:800px)  {
   div.tile.cert {
       margin: 90px 10%;
       padding-left: 40px;
       padding-top: 110px;
   }
   div.tile.cert div.headerimage img {
       width: 150px;
       height: 150px;

   }
}


LI.pdf, LI.jpg, LI.jpeg, LI.x-zip, LI.mswordi, LI.link {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-bottom: 5px;
}

LI.pdf A, LI.jpg A, LI.jpeg A, LI.x-zip A, LI.msword A, LI.link a {
  display: inline-block;
  padding-left: 20px;
  height: 16px;
  line-height: 16px;
}

LI.link A { background: url(/files/layout/external.png) center left no-repeat; }
A.external { background: url(/files/layout/external.png) center left no-repeat; }
LI.pdf A { background: url(/media/icons/16x16/application/pdf.png) top left no-repeat; }
LI.jpg A, LI.jpeg A { background: url(/media/icons/16x16/image/jpeg.png) top left no-repeat; }
LI.x-zip A, LI.msword A { background: url(/media/icons/16x16/file.png) top left no-repeat; }

ul.noindent {
  margin: 0;
  padding: 0;
}
