/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:transparent}a:active,.no-touch a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:normal}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:0.0625em solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:normal}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
span, input, label, select, textarea {position: relative;display:inline-block;}
input[type="checkbox"],input[type="radio"] {vertical-align:top; margin-top:0.4em;}
img {position: relative; display:block; margin:0px auto;}ul{list-style: none; padding: 0; margin: 0;}
a { color: #482815; text-decoration:underline; }
p {margin:1em 0;}
* { outline: none; }

body {margin:0;padding:0;background-color:#23201a;color:#ffffff;min-height:100%; text-align:center;
font:1em/1.1 "Roboto", Helvetica, Arial, sans-serif; font-weight: normal; }
body.ifr {background: transparent !important;}
main {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 2em;
}
main.loading {height:100vh;overflow:hidden;}
main.loading:after {content:"";
position:absolute; z-index:auto; background: #151515 url(_images/loader.gif) 50% 50% no-repeat; 
width: 100%; height:100%; left:0; top:0;}
.no-ifr main {
    max-width: 1600px;
    margin: 0 auto;
    border-left: 1px dashed #5f5f5f;
    border-right: 1px dashed #5f5f5f;
    background-image: url(_images/bg.jpg), url(_images/bg_repeat.jpg);
    background-position: 50% 0%, 50% 0%;
    background-repeat: no-repeat, repeat-y;
    background-size: 100% auto,  100% auto;
    padding-bottom: 2em;
	min-height:100vh;
}
img { max-width: 100%; }
h1 { font-weight: 500; }
h1 { font-size: 2.6em; }
h1 span {
    font-size: 2em;
    display: block;
    text-shadow: 1px 1px #000;
}
.loader {position:absolute; z-index:auto; background: transparent url(_images/loader.gif) 50% 50% no-repeat; 
width: 100%; height:100%; left:0; top:0; min-height: 2em;}
#mixContainer .loader {position:relative; background: transparent url(_images/loader.gif) 50% 50% no-repeat; 
width: 100%; height: 10em;}
#goDown {     
    margin: 0.5em 0 2em 0;
    height: 2em;
    /*overflow: hidden;*/
    display: block;
    position: relative;
}
#goDown img { transition: 0.2s transform ease-in-out; transform: rotate(-90deg); }
#goDown:hover img { transform: translateY(1em) rotate(-90deg); }

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}
.btn {
	display: inline-block;
    padding: 0.8em 1.1em;
    text-align: center;
    margin-right: 1em;
    border-radius: 0.6em;
    text-decoration: none;
    color: #fff;
    text-transform: uppercase;
}
.btn.red {background-color:#d00; border-radius:0.25em;}
.btn2.fb, .btn2.tw, .btn2.gp, .btn2.pi { width: 25px; height: 25px; float: right; background-repeat: no-repeat !important }
.btn2.fb {
    background: url(_images/fb.jpg);
}
.btn2.tw {
    background: url(_images/tw.jpg);
}
.btn2.gp {
    background: url(_images/gp.jpg);
}
.btn2.pi {
    background: url(_images/pi.jpg);
}

header{position:fixed; left:0; right: 0; text-align:left; width:100%; z-index:80; max-width: 1600px; margin: 0 auto;}
#oetker-stripes{width:100%; height:29px;}
#oetker-stripes img{width:100%; height:24px; display:block; position:static;}
#oetker-logo {width:116px; height:84px; margin: -29px 0 0 34px;}
#oetker-logo img{width:100%; height:84px; display:block; position:static;}

.bg.fursecuri { background: #e06021; }
.bg.saratele { background: #7cb5ec; }
.bg.tarte { background: #f9ba59; }
.bg.pandispan { background: #98bd98; }

.color.fursecuri { color: #e06021; }
.color.saratele { color: #7cb5ec; }
.color.tarte { color: #f9ba59; }
.color.pandispan { color: #98bd98; }

#separatorImg { 
    display: block;
    width: 17em;
    height: 2em;
    margin: 0 auto;
    background-position: center center !important;
}
#separatorImg.fursecuri { background: url(_images/separator_fursecuri.png) no-repeat }
#separatorImg.saratele { background: url(_images/separator_saratele.png) no-repeat}
#separatorImg.tarte { background: url(_images/separator_tarte.png) no-repeat }
#separatorImg.pandispan { background: url(_images/separator_pandispan.png) no-repeat }

.container {
    max-width: 56em;
	margin: 0 auto;
}
#mixContainer {transition: all 0.3s linear;}
.no-ifr #mixContainer { min-height: 80em;}
.heading { padding: 18em 0 4em 0; }
.separator { font-size: 1.75em; margin-top: 2em; }
.separator img { margin-top: 0.2em; }
.separator span { font-size: 1.4em; display: block; text-transform: uppercase; font-weight: bold }

.slick-slide img { max-width: 100% }
.slick-prev::before {
	font-family: sans-serif;
	z-index: 1;
	opacity: 1;
    content: url(../_images/prev_big.png);
}
.slick-next::before {
	font-family: sans-serif;
	z-index: 1;
	opacity: 1;
   	content: url(../_images/next_big.png);
}
.slick-prev, .slick-next {
	top: 50%;
	height: auto;
    -webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	z-index: 3;
}
.product-slider .slick-slide {
	position: relative;
	transform: scale(.8);
	transition: transform .3s cubic-bezier(.4,0,.2,1);
	margin: 0 -5em;
    width: 30em;
}
.product-slider .slick-current {
	transform: scale(1);
	z-index: 1;
}
.product-slider .slick-prev {
	left: 0;
}
.product-slider .slick-next {
	right: 0;
}


.recipes-slider .slick-slide {
	position: relative;
	transition: transform .3s cubic-bezier(.4,0,.2,1);
	margin: 0 1em;
    width: 35em;
}
.recipes-slider .slick-next {
    width: 75px;
    right: 0;
}
.recipes-slider .slick-prev {
    /*left: 8em;*/
    transform: translate(70%, -50%);
}

/*.recipes-slider .slick-next { transform: translate(0, -49%); right: 0; font-size: 0.3em; }
.recipes-slider .slick-prev { transform: translate(0, -49%); left: 0; font-size: 0.3em;}*/

.recipes-slider .slick-prev::before {
    font-family: sans-serif;
    z-index: 1;
    opacity: 1;
    content: url(../_images/prevc.png);
}
.recipes-slider .slick-next::before {
    font-family: sans-serif;
    z-index: 1;
    opacity: 1;
    content: url(../_images/nextc.png);
}

.recipes-slider .details {
	padding: 1em;
    background: rgba(255, 255, 255, 0.16);
    border-radius: 0 0 0.6em 0.6em;
	text-align: left;
	opacity: 0.4;
    transition: 0.2s opacity ease-in-out;
}
.ifr.allrcp .recipes-slider .details {
    background: rgba(0, 0, 0, 0.40);
}
.recipes-slider .slick-current .details {
    opacity: 1;
}
.recipes-slider .details .desc {
    margin-bottom: 2em;
}
.recipes-slider .details h3 {
	text-transform: uppercase;
	font-weight: 500;
	margin-top: 0;
}

/*.close { font-size: 2em; float: right; padding: 0.6em; display: inline-block; text-align: right; cursor: pointer; color: #fff; }*/
.close {
    font-size: 1.8em;
    float: right;
    margin: 0.55em 0.5em;
    padding: 0.45em 0.155em;
    display: inline-block;
    text-align: right;
    font-weight: bold;
    cursor: pointer;
    color: #333;
    background: #eee;
    border-radius: 50%;
    line-height: 0;
}
.mainRecipe { line-height: 1.3em; display: none; }
.mainRecipe .title { margin-top: -2em; text-align: left; overflow: hidden;}
.mainRecipe h2 { float: left; font-weight: 500}

.mainRecipe h3 { color: rgb(224, 96, 33); font-weight: 500; margin-bottom: 0 }
.mainRecipe .bottom-container .left b { display: block; margin-top: 1em;}
.mainRecipe .top-container { background: rgba(255, 255, 255, 0.16); overflow: hidden; border-radius: 0.3em; position: relative; }
.mainRecipe .top-container .share { position: absolute; bottom: 0; right: 0; padding: 1em;}
.mainRecipe .top-container .image, .mainRecipe .top-container .details {
	box-sizing: border-box;
	padding: 0;
	text-align: left;
}
.mainRecipe .top-container .details { padding: 1em;}
.mainRecipe.has-video .top-container .image {float: left;width: 60%;}
.mainRecipe.has-video .top-container .details {float: right;width: 40%;}
.mainRecipe .bottom-container { text-align: left; overflow: hidden; padding: 0 1em;}
.mainRecipe .bottom-container .left {
	float: left;
	width: 40%;
}
.mainRecipe .bottom-container .right {
	float: right;
	width: 60%;
}
.mainRecipe .bottom-container ol {
  counter-reset: recipe-counter;
  list-style: none;
  padding-left: 51px;
}
.mainRecipe .bottom-container ol li {
  margin: 0 0 2.5rem 0;
  counter-increment: recipe-counter;
  position: relative;
}
.mainRecipe .bottom-container ol li::before {
    content: counter(recipe-counter);
    color: #ffffff;
    font-size: 1.5rem;
    position: absolute;
    --size: 1.7em;
    left: calc(-1 * var(--size) - 10px);
    line-height: var(--size);
    width: var(--size);
    height: var(--size);
    top: 0;
    border-radius: 50%;
    text-align: center;
    border: 1px solid #fff;
}
.mainRecipe .videoContainer {margin:0; display:block; clear:both;}
.mainRecipe .videoContainer iframe {margin:0; display:block; clear:both;}


.mainProduct { padding: 1em 1em 1em 0; overflow: hidden; background: rgba(255, 255, 255, 0.16); text-align: left; border-radius: 0.6em}
.mainProduct h3 { font-weight: 500; text-transform: uppercase; }
.mainProduct .image { float: left; width: 35%; }
.mainProduct .details { width: 65%; display: inline-block; }
.mainProduct .details .desc { padding: 2em 0; line-height: 1.3em; }


@media screen and (max-width: 1280px) {
    .no-ifr main { background-size: auto !important;  background-position: 50% 0%, 50% 0%; }
}
@media screen and (max-width: 760px) {
	main { font-size: 2.8vw; }
	.product-slider .slick-slide { width: 18em; margin: 0 }
	.separator img { max-width: 90%; }
	.mainRecipe .title { padding: 0 1em; }
    /*.slick-next { transform: translate(-70%, -50%); }*/
    .slick-prev { transform: translate(70%, -50%); }
    .recipes-slider img { width: 100%; }
    .mainRecipe .top-container .image, .mainRecipe .top-container .details { width: 100%; }
    .mainRecipe .top-container .details { padding-bottom: 3em; }
    .mainRecipe .top-container .share { padding: 0; }
}
@media screen and (max-width: 460px) {
	.mainRecipe { font-size: 1.66em; }
	.mainProduct { font-size: 1.5em; }
	.btn {margin-top:0.25em;}
	.recipes-slider .slick-current .details { font-size: 1.4em }
	.mainRecipe .bottom-container .left, .mainRecipe .bottom-container .right { width: 100%; float: none; overflow: hidden; }
	.mainRecipe .bottom-container .left > div { width: 49%; float: left; }
	.separator { font-size: 5vw; }
    #separatorImg { height: 3em }
}