body {
  padding: 0;
  font-family: 'futura', Helvetica;
  font-size: 18px;
  background-color: white;
  margin: 0 !important;
  overflow-x: hidden;
  height: 100%;
}

a{
  text-decoration: none;
}

.display-inline{
  display: inline;
}

.hero-logo{
  display: none;
}

@font-face {
    font-family: 'futura';
    font-weight: normal;
    font-style: normal;
}

* {
    box-sizing: border-box;
}
[class*="col-"] {
    /*position: relative;*/
    float: left;
}

.no-padding{
  padding: 0 !important;
}

.no-margin{
  margin: 0 !important;
}

.cursor-pointer{
  cursor: pointer;
}


.padding-right-10px{
  padding-right: 10px !important;
}

.small-bottom-margin{
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 10px !important;
}

.margin-left{
  margin-left: 10px;
}

.text-align-right{
  text-align: right !important;
}

.text-align-left{
  text-align: left !important;
}

.text-align-center{
  text-align: center !important;
}

.small-text{
  font-size: 14px;
}

.white-text{
  color: white;
}

.dark-green{
  color: #354435;
}

.light-green{
  color: #319637;
}

.bold{
  font-weight: bold;
}

.light{
  font-weight: lighter;
}

.nav-button{
  position: fixed;
}

.space {
  padding: 1px;
}

.spacer {
  padding: 1px;
  height: 10vh;
}

.clear-float{
  clear: both;
}

.rating-card-viereck:hover {
   box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
   transition: .3s ease all;
}
.rating-card-kreis:hover {
   box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
   transition: .3s ease all;
}
.rating-card-dreieck:hover {
   box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
   transition: .3s ease all;
}



/* ------------- */
/* ERROR Message section */
/* ------------- */
.errorMessage{
  width: 100vw;
  height: 100vh;
  background: white;
  position: fixed;
  overflow-x: hidden;
  display: none;
}
/* ------------- */
/* ------------- */




/* ------------- */
/* LOADING ANIMATION */
/* ------------- */
.loading-wrapper{
  width: 100vw;
  height: 100vh;
  background: white;
  position: fixed;
  z-index: 1800;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0;
}



.bouncing-loader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.bouncing-loader__round {
  width: 20px;
  height: 20px;
  background-color: #354435;
  border-radius: 50%;
  -webkit-animation: bounce 0.6s infinite alternate;
          animation: bounce 0.6s infinite alternate;
}
.bouncing-loader__round:not(:first-child) {
  margin-left: 10px;
}
.bouncing-loader__round:nth-child(2) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.bouncing-loader__round:nth-child(3) {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}

@-webkit-keyframes bounce {
  from {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    opacity: 0.1;
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
  }
}

@keyframes bounce {
  from {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    opacity: 0.1;
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
  }
}
/* ------------- */
/* ------------- */




/* ------------- */
/* container */
/* ------------- */
.container-1{
  background: url("../images/bg-img-1.png");
  height: 100vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.container-9-video{
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 51%;
}

.container-9-video iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0; top: 0;
}
/* ------------- */
/* ------------- */



/* ------------- */
/* cookie wrapper */
/* ------------- */
.cookie-container{
  width: 100%;
  height: 100vh;
  z-index: 1000;
  transition: .5s ease all;
  position: absolute;
  z-index: 1300;
}
.cookie-bg{
  position: absolute;
  background: url("../images/bg-img-1.png");
  height: 100vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
  -webkit-filter: blur(10px);
  filter: blur(10px);
  transition: .5s ease all;
  overflow-x: hidden;
  overflow-y: hidden;
  z-index: 1200;
}
.cookie-products-bg{
  position: absolute;
  background: white;
  height: 100vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
  transition: .5s ease all;
  overflow-x: hidden;
  overflow-y: hidden;
  z-index: 1200;
}

.cookie-wrapper{
  display: none;
}

.cookie-text{
  -webkit-box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
          box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
  border-radius: 5px;
  background: white;
  padding: 20px;
}
/* ------------- */
/* ------------- */



.dark-green-text {
  text-align: center;
  color: #354435;
}

.container-16-text {
  margin-top: 2vh;
}

.container-16-text a {
  transition: .3s;
}

.container-16-text a:hover {
  color: #319637;
}

.container-17 a {
  transition: .3s;
}

.container-17 a:hover {
  color: #319637;
}

.lookaround-iframe {
  width: 100%;
  height: 50vh;
}

























@font-face {
    font-family: 'futura';
    font-weight: normal;
    font-style: normal;
}

[class*="col-"] {
    /*position: relative;*/
    float: left;
}
/* @media screen and (orientation:landscape) {
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

.home-icon{
  width: 2vw;
  margin: 20px;
  opacity: 0.6;
  transition: .3s ease all;
}
:hover.home-icon {
  opacity: 1;
  transition: .5s ease all;
}



} */

/* @media screen and (orientation:portrait) {

    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}

    .home-icon{
      width: 50px;
      margin: 20px;
      opacity: 0.6;
      transition: .3s ease all;
    }
    .nav-button{
      position: fixed;
      background-color: rgba(237,237,237,0.95);
    }

    .spacer-big{
      height:90px;
    }


} */

/*init*/

.border-small{
  border: 1px solid grey;
}


.no-margin{
  margin: 0 auto !important;
}

.text-align-right{
  text-align: right !important;
}

.text-align-left{
  text-align: left !important;
}

.text-align-center{
  text-align: center !important;
}

.small-spacer{
  height: 2vh;
}

.medium-spacer{
  height: 5vh;
}

.hasSeason {
  background-color: #319637;
  color: white;
}

.hasNoSeason{
  background-color: #354435;
  color: white;
}

.season-styling{
  font-size: 0.8em;
}


.space {
  padding: 1px;
}

.spacer {
  padding: 1px;
  height: 10vh;
}

/* Everything but the jumbotron gets side spacing for mobile first views */


.logo{
  width: 40%;
  margin-left: 30%;
}

.highlight-link{
  color: #354435;
  font-weight: 800;
}

.progress{
  background-color: #354435 !important;
}

.progress .indeterminate {

  background-color: #319637 !important;
}

h1 {
  color: #319637;
}

.intro-text{
  color: #354435;
  font-size: 1.5em;
}

.container {
}

#produkt {
  color: #ffff;
  font-size: 120%;
  display: block;
  margin-bottom: 10px;
}

.mobile-text-align{
  color: red;
}

@keyframes FadeIn {
  0% {
    margin-top: 25px;
    opacity: 0.1;
  }
  100% {
    margin-top: 0px;
    opacity: 1;
  }
}

.kategorie-item {
  animation: FadeIn .4s ease-in-out;
  animation-fill-mode: both;
}

.kategorie-item:nth-child(1) { animation-delay: .2s }
.kategorie-item:nth-child(2) { animation-delay: .25s }
.kategorie-item:nth-child(3) { animation-delay: .3s }
.kategorie-item:nth-child(4) { animation-delay: .35s }
.kategorie-item:nth-child(5) { animation-delay: .4s }
.kategorie-item:nth-child(6) { animation-delay: .45s }
.kategorie-item:nth-child(7) { animation-delay: .5s }
.kategorie-item:nth-child(8) { animation-delay: .55s }
.kategorie-item:nth-child(9) { animation-delay: .5s }
.kategorie-item:nth-child(10) { animation-delay: .62s }
.kategorie-item:nth-child(11) { animation-delay: .65s }
.kategorie-item:nth-child(12) { animation-delay: .67s }
.kategorie-item:nth-child(13) { animation-delay: .7s }
.kategorie-item:nth-child(14) { animation-delay: .72s }
.kategorie-item:nth-child(15) { animation-delay: .75s }
.kategorie-item:nth-child(16) { animation-delay: .77s }
.kategorie-item:nth-child(17) { animation-delay: .8s }
.kategorie-item:nth-child(18) { animation-delay: .82s }

.kategorie-name{
  color: #319637;
  font-weight: 900;
}

.link-wrap {
  display: block;
  height: 100%;
  cursor: pointer;
  padding: 20px;
  margin-bottom: 20px;
  width: 100%;
  border-radius: 2px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
/*transition: all 0.3s cubic-bezier(.25,.8,.25,1);*/
}

.link-wrap-overview {
  display: block;
  height: 100%;
  cursor: pointer;
  padding: 0px;
  margin-bottom: 20px;
  width: 100%;
  border-radius: 2px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
/*transition: all 0.3s cubic-bezier(.25,.8,.25,1);*/
}

.recipe-link-wrap {
  display: block;
  border-radius: 2px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
/*transition: all 0.3s cubic-bezier(.25,.8,.25,1);*/
}


.hover:hover{
  transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.innerwrapper{
  width: 100%;
  height: 100%;
  padding-bottom: 10px;
  padding-left: 10px;
  padding-right: 10px;
}

.text-wrap-products{
  padding: 4px;
  margin-left: 10px;
}

.item-card{
  /*height: 20vh;*/
  cursor: default;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.detail-card{
  height: 30vh;
  /*width: 100%;*/
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.recipe-card{
  height: 10vh;
  /*width: 100%;*/
  cursor: pointer;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.item-name{
  padding-left: 5px;
  margin-right: 20px;
  font-size: 1.2em;
  color: #319637;
  -webkit-margin-after: 0em;
  -webkit-margin-before: 0em;
  margin-after: 0em;
  margin-before: 0em;
}

.text-wrap{
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.available-text{
  padding-left: 5px;
  font-size: 1em;
  color: #319637;
}

.bier-img{
  background: url("../images/bier.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.fruchtsaft-img{
  background: url("../images/fruchtsaft-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.fleisch-img{
  background: url("../images/fleisch.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.limonaden-img{
  background: url("../images/limonaden-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.wein-img{
  background: url("../images/wein-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.schnaps-img{
  background: url("../images/schnaps-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.obst-img{
  background: url("../images/obst-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.vegetables-img{
  background: url("../images/vegetables-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.brot-img{
  background: url("../images/brot-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.mehlspeise-img{
  background: url("../images/mehlspeise-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.essig-img{
  background: url("../images/essig-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.salz-img{
  background: url("../images/salz-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.honig-img{
  background: url("../images/honig-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.hygiene-img{
  background: url("../images/hygiene-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.trockenware-img{
  background: url("../images/trockenware-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.frischware-img{
  background: url("../images/frischware-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.eingekochtes-img{
  background: url("../images/eingekochtes-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}
.zuckerl-img{
  background: url("../images/zuckerl-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.kaffee-img{
  background: url("../images/kaffee-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.pinz-img{
  background: url("../images/pinz-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.wagyu-img{
  background: url("../images/wagyu-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.angus-img{
  background: url("../images/angus-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.kreuzung-img{
  background: url("../images/kreuzung-img.jpeg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}

.steinschaf-img{
  background: url("../images/steinschaf-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}
.schwein-img{
  background: url("../images/schweine-img.png");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}
.huhn-img{
  background: url("../images/huhn-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}
.fisch-img{
  background: url("../images/fisch-img.jpg");
  height: 20vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
}



.input-field:focus {
    border: 3px solid #319637;
}

.input-field:hover {
    border: 3px solid #319637;
}



.input-field{
  font-size: 1em;
  padding: 10px;
  border: 0px;
  border: 3px solid #ccc;
  -webkit-transition: 0.5s;
  background: transparent;
  transition: 0.5s;
  color: #354435;
  outline: none;
}

.search-wrapper{
  padding: 10px;
}

#produktVorhandenWrap {
  height: 5vh;
}


.produktVorhanden {
  color: #319637;
}

.produktNichtVorhanden {
  color: #319637;
  opacity: 0.5;
}

.available {
  background-color: #ffffff;
}

.not-available{
 background-color: #ffffff;
}

.color-bar{
  height: 10px;
}

.arrow-icon{
  -moz-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

/* Chrisi CSS */
#detail-item a {
  cursor: default;
}

.nav-button {
  cursor: pointer;
}


.meatwrap{
  display: flex;
  flex-wrap:  wrap;
}

/* Social media icons */
.icon-size {
  width: 50px;
  margin-right: 20px;
}

.social-icon-wrap {
  display: flex;
}