/*  Schriften:  */
@font-face {
  font-family: 'b3_ubuntu';
  src: url('../fonts/Ubuntu-Light.ttf') format('truetype');
}
@font-face {
font-family: 'b3_ubuntu';
  src: url('../fonts/Ubuntu-LightItalic.ttf') format('truetype');
  font-style: italic;
}

@font-face {
font-family: 'b3_ubuntu';
  src: url('../fonts/Ubuntu-Bold.ttf') format('truetype');
font-weight: bold;
}
@font-face {
font-family: 'b3_ubuntu';
  src: url('../fonts/Ubuntu-BoldItalic.ttf') format('truetype');
font-weight: bold;
  font-style: italic;
}
@font-face {
font-family: 'GloriaHallelujah';
  src: url('../fonts/GloriaHallelujah.ttf') format('truetype');
  font-style: italic;
}
/*  Ende: Schriften  */


html,
body {
  width: 100%;
  height: 100%;
}

body {
  padding-top: 96px; /* height of fixed-top-navbar: 80px + 2*8px */
  font-family: 'b3_ubuntu','Helvetica Neue',Arial,sans-serif;
  background-color: #282828;
  background-color: #fff;
  color: #d3d3d3;
  color: #333;
}

h1,h2,h3,h4,h5,h6 {
  font-family: 'b3_ubuntu', sans-serif;
  font-weight: bold;

}

hr {
  max-width: 80px;
  border-width: 3px;
  opacity: 0.49;
  border-color: #333;
  margin: 15px auto; /* ie. top, bottom: 15px / left, right: auto */
}

hr.light {
  border-color: #333;
}

a {
  color: #95c11f;
  -webkit-transition: all .35s;
  -moz-transition: all .35s;
  transition: all .35s;
}

a:hover,
a:focus {
  color: #95c11f;
  outline: 0;
}

a.icon-link {
  margin-left:.375em;
  margin-right: .375em;
  text-decoration: none;
}
a.icon-link:hover {
  _border-bottom: 3px solid #94c11f;
  border-bottom: 3px solid #fff;
}

.icon-link>.bi {height:unset;}

i.bi {_padding-left:10px;}
i.bi:hover {color:#333;}


section {
  padding-bottom: 5em;
}


.bg-light {color: #222; background-color: #f2f2f2;}
.bg-green {background-color: rgba(149,193,31,1); color:#fff;}
.bg-dark {background-color: #eee; color: rgba(70,70,70,70,0.7);}

.text-primary {color:#94c11f;}

.modal-content {background-color: #e2e2e2;}
#modalRecipe {border:0;font-size: .85em;}
#modalRecipe #btnShare {display:none;}

/* section {padding: 70px 0;} */

aside {padding: 50px 0;}

footer {padding: 15px;}

/* .no-padding {padding: 0;}
.padding-top-10 {padding-top:10px;} */



/*  Navigation  */
nav .nav-underline .nav-link {
  color: #94c11f;
  font-size: 1.2em;
}
nav .nav-underline .nav-link:hover {
  border-bottom-width: 3px;
}

nav .navbar .nav-underline .nav-link.active {
  border-bottom-width: 3px;
}

.navbar.fixed-top {
  border-bottom: 1px solid #c2c2c2;
}


.b3_rezept a {
  color: #fff;
}


header img {
  padding-left:0;
  padding-right:0;
  margin-top:0;
}

footer {background-color:#95c11f; color:#fff;}

/*
@media(min-width:768px) {
  .icon-lg {font-size: 50px;}

  header {min-height: 100%;}

  header .header-content {
      position: absolute;
      top: 50%;
      padding: 0 50px;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
  }

  header .header-content .inner {
      margin-right: auto;
      margin-left: auto;
      max-width: 1000px;
  }

  header .header-content .inner h1 {font-size: 53px;}

  header .header-content .inner p {
      margin-right: auto;
      margin-left: auto;
      max-width: 80%;
      font-size: 18px;
  }

}*/   /* Size > 768px */



/*  User-Rezeptvorschlag  */
.vorschlag {background-color: #f8f8f8; color: #333; padding-bottom: 20px; transform: rotate(-1.6deg); box-shadow: -3px 9px 1px rgba(0,0,0,.4);}

#hdlVorschlag {font-weight:bold; font-size: 2.5em; color:#fff; background-color:#95c11f; padding:.25em; transform:rotate(-3.7deg); box-shadow: -3px 9px 1px rgba(0,0,0,.4); width:14.5em; padding-left: 1em; margin-left:1.5em;}
textarea {resize: none;}
.formStatus {margin-left: auto; margin-right: auto; width: 80%; padding: 10px; background-color: rgba(250, 246, 40, 0.993);  -webkit-box-shadow: 5px 5px 16px 0px rgba(0,0,0,0.8); -moz-box-shadow: 5px 5px 16px 0px rgba(0,0,0,0.8); box-shadow: 5px 5px 16px 0px rgba(0,0,0,0.8);}
/* /User-Rezeptvorschlag */



.gallery-box {display: block; position: relative; margin: 0 auto; max-width: 650px; overflow:hidden;}
.gallery-box .gallery-box-copyright {position: absolute; top:90%; width:45%; margin-left:40%; text-align: right; transform: translateY(-90%); padding-right: 10px; color: #000; font-size: .95em; background-color:#fff; opacity:.6;}
.gallery-box-content i.bi {color:#fff; font-size:3em;}

.gallery-box .gallery-box-caption {display: block; position: absolute; bottom: 0; width: 100%; height: 100%; text-align: center; color: #fff; opacity: 0; background: rgba(44,44,44,.01); -webkit-transition: all .35s; -moz-transition: all .35s; transition: all .35s;}
.gallery-box .gallery-box-caption .gallery-box-content {position: absolute; top: 50%; width: 100%; text-align: center; transform: translateY(-50%);}
.gallery-box:hover .gallery-box-caption {opacity: 1;}
.gallery-box:hover {-webkit-transform: scale(1.1) rotate(2.2deg); -ms-transform: scale(1.1) rotate(2.2deg); transform: scale(1.1) rotate(2.2deg);}
.gallery-box, .gallery-box .gallery-box-copyright { -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;}

.rezeptbild {position: relative; display: block; background: url(../img/bg_userrezept_1_1.png) no-repeat; background-size:contain; background-position: center; margin: 0px auto; transform: rotate(-2.2deg);}
.rezeptbild img {display:block; margin: 0 auto; padding: 10px; padding-bottom:10px; width:30%; transform: scale(.98,.9);}
.rezeptbild.wbih {margin-top:3em;}



#footer .btn.btn-primary {color:#fff;border-color:#fff;}
#footer .btn.btn-primary:hover {color:#333; border-color: #111;}
#footer a {color: #fff;}
#footer .left {background: url('../img/wkih_logo_ws_gn_200.png') no-repeat; background-size: contain; min-height: 100px; cursor:pointer; border:0px solid #fbb;}
#footer .right {background: url('../img/BR3_logo_3er_bkg_576.png') no-repeat; background-size: contain; background-position: right; min-height: 100px;padding-right: 200px; }

.btn.btn-primary{background-color:transparent; color: #333; border: 1px solid #333; }
.btn.btn-primary:hover {background: #95c11f; border-bottom: solid 5px #2A4E77; color: #333; opacity: 0.7; -webkit-transition-duration: 0.75s; -moz-transition-duration: 0.75s; transition-duration: 0.75s; }
.btn {border: 0; border-radius: 5px; font-family: 'b3_ubuntu','Helvetica Neue',Arial,sans-serif; }


::-moz-selection {text-shadow: none; color: #fff; background: #95c11f; }
::selection {text-shadow: none; color: #fff; background: #95c11f; }

input, textarea {font-size: 1.15em;color:#333; border: 1px solid #ccc; -moz-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; padding:5px; border-radius: 5px;}
input:focus, select:focus, textarea:focus {outline: none; border-color: #91cf1f; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(145, 193, 31, 0.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(145, 193, 31, 0.6); }
textarea {width:100%;}

img::selection {color: #fff; background: 0 0; }
img::-moz-selection { color: #fff; background: 0 0; }


.list-inline.credits {line-height: 1.9em;}
.list-inline.credits.a {display:block;}
.list-unstyled li>a {color:#fff;}
.text-muted>a {color:#fff;}


/*  Rezepte  */
#hdlSuche {font-weight:bold; font-size: 1.25em; color:#fff; background-color:#95c11f; padding:.25em; box-shadow: -3px 9px 1px rgba(0,0,0,.4); transform:rotate(-2.7deg);width:11.5em; margin-top:3em;}
.wkih.filterContainer{font-family: 'b3_ubuntu',sans-serif; font-size: 1.05em; font-weight: normal; color: #333; border: 0px solid  #111; margin-top: 1.0em; padding: 1.2em; background-color: #fff; min-height: 60px; box-shadow: -3px 9px 1px rgba(0,0,0,.4); transform: rotate(-1.2deg);}

/*  Rezept-Suchfilter  */
.wkih.recFilter {font-weight:normal; color:#333; _background-color: #fff;}
.wkih.recFilter>div {margin-top: .5em; overflow: auto;}

.wkih.recFilter>div>h3, .wkih.recFilter>div>h2 {display: block; font-weight:bold; font-size: 1.05em; color: #333;}
.wkih.recFilter>div>span {display: block;}
.wkih.recFilter label {font-weight:normal;}
.wkih.recFilter select {height:2.5rem; width:90%; padding: 5px; font-size: 1.15em; border: 1px solid #999; border-radius: 5px; color: #333;}
.wkih.recFilter input[type="text"] {width: 90%;}
.wkih.recFilter input[type="radio"] {margin: .25em;}
.wkih.recFilter input[type="checkbox"] {margin-right: .25em;}
.wkih.recFilter input[type="range"] {width: 90%;}
.wkih.recFilter output {font-size: .8em; font-weight:normal; font-style:italic; margin-left:.8em;color:#333;}


@media(min-width:768px) {
  .wkih.recFilter>div>span {display:inline;}
  .wkih.recFilter input[type="text"] {width: 50%;}
  .wkih.recFilter input[type="radio"] {margin-left: 1.5em; margin-right: .5em;}
}


.wkih.recCB {float:left; width:100%;}
@media(min-width:540px) {
  .wkih.recCB {float:left; width:50%;}
}
@media(min-width:768px) {
  .wkih.recCB {width: 33%;}
}
.wkih.recCB input[type="checkbox"] {width:1em;}

#oPersons:after {content: ']';}
#oPersons:before {content: '[für '}
#oLevel:before {content: ' [max. '}


.wkih.recFilter.closed {display: none;}
/*  /Rezept-Suchfilter  */

#divNav {margin-top:30px;; margin-bottom:60px;; display:inline-block; border:0px solid #00f; width:100%;}
#divNav.disabled {visibility: hidden;}

.btnNav {cursor:pointer;width:60px; height:60px; background:transparent;}
.btnNav:focus {outline: none;}
.btnNav>i:hover {color:#333; transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s;}

#navPrev {float:left; margin-top:-30px;margin-left:30px;}
#navPrev.disabled {webkit-transition: opacity .5s ease-in-out; moz-transition: opacity .5s ease-in-out; transition: opacity .5s ease-in-out; opacity: 0;}
#navNext {float:right;margin-top:-30px;margin-right: 30px;}
#navNext.disabled {webkit-transition: opacity .5s ease-in-out; moz-transition: opacity .5s ease-in-out; transition: opacity .5s ease-in-out; opacity: 0;}

#divCount {margin-top: -20px; margin-bottom: 30px; text-align:center; font-size:1.0em; height:2em;}
.count{display:inline-block; font-size:1.05em;padding:5px; margin-top:-20px; border-radius:5px;color: #fff; background-color: #95c11f;}
.count>i {font-size:1.35em;}
/*
@keyframes blink {
  from {background: linear-gradient(#95c11f, #fff); color: #333;}
  to {background: linear-gradient(#fff, #95c11f); color: #333;}
}
*/
.blink {animation: 1s alternate ease-in-out 2 backwards; background-color:#fff; color:#333; border: 1px solid #333;}


@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
.shake {animation: shake .5s; animation-iteration-count: infinite;}




/*  Rezept-Darstellung  */
.b3_rezept {font-family: 'b3_ubuntu', sans-serif; font-size: 1.2em; font-weight: normal; margin-top: .5em; padding: .1em; color:#fff}
.b3_rezept h1 {font-size: 1.87em; font-weight: bold; padding: 0;}
.b3_rezept h2 {font-size: .85em; font-weight: normal; font-style: italic;padding:0;margin-top:-1.25em;}
.b3_rezept h3 {font-size: 1.2em;}
/*.b3_rezept h4 {font-size: 1.45em; font-weight: normal;}*/
.b3_rezept h5 {font-size: .85em; font-weight: normal; font-style: italic;}
.b3_rezept h6 {font-size: .95em; font-weight:bold; margin-bottom:0.25em; margin-top: 1em; margin-left:-1em;}
.b3_rezept .rezeptbild {position: relative; display: block; background: url(../img/bg_userrezept_1_1.png) no-repeat; background-size:contain; background-position: center; margin: 0px auto; transform: rotate(-3.2deg);}
.b3_rezept .rezeptbild img {display:block; margin: 0px auto; padding: 20px; padding-bottom:30px; width:30%; transform: scale(.98,.9);}
.trenner {margin-top: -65px;}
.trenner img {width:130px; height:130px; padding: 20px;}

@keyframes zoomBtn {
  70% {transform: rotate(-2.2deg) scale(1.1);}
  100% {transform: rotate(2.2deg) scale(1.05);}
}
.recSearch {width:10vw; height: 10vw; display: inline-block; padding: 0px; margin-left:40px;margin-bottom:30px; cursor:pointer;margin-top:-5vw;}
.recSearch:hover {animation: zoomBtn .4s ease-in-out;}
#recSearch0 {background: url(../img/wkih_rezept_icon_01.jpg) no-repeat; background-size: contain;}
#recSearch0:hover {background: url(../img/wkih_rezept_icon_01_active.jpg) no-repeat; background-size: contain;}
#recSearch1 {background: url(../img/wkih_rezept_icon_02.jpg) no-repeat; background-size: contain;}
#recSearch1:hover {background: url(../img/wkih_rezept_icon_02_active.jpg) no-repeat; background-size: contain;}
#recSearch2 {background: url(../img/wkih_rezept_icon_03.jpg) no-repeat; background-size: contain;}
#recSearch2:hover {background: url(../img/wkih_rezept_icon_03_active.jpg) no-repeat; background-size: contain;}
#recSearch3 {background: url(../img/wkih_rezept_icon_04.jpg) no-repeat; background-size: contain;}
#recSearch3:hover {background: url(../img/wkih_rezept_icon_04_active.jpg) no-repeat; background-size: contain;}
#recSearch4 {background: url(../img/wkih_rezept_icon_stern.jpg) no-repeat; background-size: contain;}
#recSearch4:hover {background: url(../img/wkih_rezept_icon_stern_active.jpg) no-repeat; background-size: contain;}
#recSearch5 {background: url(../img/wkih_rezept_icon_herz.jpg) no-repeat; background-size: contain;}
#recSearch5:hover {background: url(../img/wkih_rezept_icon_herz_active.jpg) no-repeat; background-size: contain;}


/*
.shake {
  animation: shake 1.0s cubic-bezier(.36,.07,.19,.9);
  animation-iteration-count: infinite;
}
@keyframes shake {
  10%, 90% {transform: translate3d(-1px, 0, 0);}
  20%, 80% {transform: translate3d(2px, 0, 0);}
  30%, 50%, 70% {transform: translate3d(-4px, 0, 0);}
  40%, 60% {transform: translate3d(4px, 0, 0);}
}
*/




@media(min-width:768px) {
  .zutaten {text-align:right;}
  .b3_rezept .zutatenliste li {list-style-type: none;}
}

/* im modalen Fenster */
#modalRecipe .b3_rezept {color:#333;}

#_btnShare {float:right; height:30px; width:30px; border:1px solid #f2f2f2; color: #f2f2f2; cursor:pointer; border-radius:30px; margin-left:15px;}

#btnShare {float:right; color: #f2f2f2; cursor:pointer; _margin-left:15px;}
#_btnShare a>i:hover {color:#111}
#divShare {position:absolute; width:70%; min-height:3em; padding:.75em; font-size:.95em; color:#000; border:1px solid #888; background-color: rgba(250, 246, 40, 0.993); box-shadow: 5px 5px 16px 0px rgba(0,0,0,0.8); -moz-box-shadow: 5px 5px 16px 0px rgba(0,0,0,0.8); -webkit-box-shadow: 5px 5px 16px 0px rgba(0,0,0,0.8); }
#divShare.closed {display:none}

.error {border:2px solid #bc2626; _background-color: rgba(188,38,38,0.8);}

/*  /Rezept-Darstellung  */


/*!
* Hamburgers
* @description Tasty CSS-animated hamburgers
* @author Jonathan Suh @jonsuh
* @site https://jonsuh.com/hamburgers
* @link https://github.com/jonsuh/hamburgers
*/
.hamburger {display: inline-block; cursor: pointer; float:right; font: inherit; color: inherit; text-transform: none; background-color: transparent; border: 0; margin: 0; overflow: visible; }
.hamburger-box {width: 40px; height: 24px; display: inline-block; position: relative;}
.hamburger-inner {display: block; top: 50%; margin-top: -2px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {width: 40px; height: 4px; background-color: #888; border-radius: 4px; position: absolute; transition-property: transform; transition-duration: 0.15s; transition-timing-function: ease; }
.hamburger-inner::before, .hamburger-inner::after {content: ""; display: block; }
.hamburger-inner::before {top: -10px; }
.hamburger-inner::after {bottom: -10px; }

/*  Squeeze  */
.hamburger--squeeze .hamburger-inner {transition-duration: 0.075s; transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--squeeze .hamburger-inner::before {transition: top 0.075s 0.12s ease, opacity 0.075s ease; }
.hamburger--squeeze .hamburger-inner::after {transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--squeeze.is-active .hamburger-inner {transform: rotate(45deg); transition-delay: 0.12s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--squeeze.is-active .hamburger-inner::before {top: 0; opacity: 0; transition: top 0.075s ease, opacity 0.075s 0.12s ease; }
.hamburger--squeeze.is-active .hamburger-inner::after {bottom: 0; transform: rotate(-90deg); transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }


/*  /Rezepte  */