*,
*::before,
*::after { box-sizing: border-box; padding: 0; margin: 0;}
*:focus { outline: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'RobotoSlab', sans-serif; background: #FEE385; -webkit-tap-highlight-color: transparent; overflow-x: hidden; }
ul, ol { margin: 0; }
a, a:link, a:hover, a:focus, a:active { text-decoration: none; outline: 0; -webkit-tap-highlight-color: transparent; }
img { height: auto; }

.relative { position: relative; }
.overflow-hidden { overflow: hidden; }

.d-block { display: block!important; }
.d-inline-block { display: inline-block!important; }
.d-flex { display: flex!important; }
.d-none { display: none!important; }

.order-1 { order: 1; }
.order-2 { order: 2; }

@media only screen and (min-width: 992px) {
    .d-lg-block { display: block!important; }
    .d-lg-inline-block { display: inline-block!important; }
    .d-lg-flex { display: flex!important; }
    .d-lg-none { display: none!important; }

    .order-lg-1 { order: 1; }
    .order-lg-2 { order: 2; }
}

h1, h2, h3, h4, h5, h6 { font-family: 'Argone'; }
.heading-2 { display: inline-block; position: relative; font-size: 6.7vw; color: #159B3B; margin-bottom: 3.5vw; transform: rotate(-1.5deg); }
.heading-2:after { content: ""; display: block; position: absolute; bottom: -2vw; left: 0; width: 100%; height: 1.7vw; background: url('/assets/images/green-underline.svg') no-repeat; }
.heading-3 { display: inline-block;  position: relative; font-size: 3.8vw; margin-bottom: 3.5vw; transform: rotate(-1.5deg); }
.heading-3.green { color: #159B3B; }
.heading-3.green:after { content: ""; display: block; position: absolute; bottom: -2vw; left: 0; width: 100%; height: 1.7vw; background: url('/assets/images/green-underline.svg') no-repeat; }
.heading-3.orange { color: #EEA500; }
.heading-3.orange:after { content: ""; display: block; position: absolute; bottom: -2vw; left: 0; width: 100%; height: 1.7vw; background: url('/assets/images/orange-underline.svg') no-repeat; }

.style-text { text-wrap: pretty; }
.style-text p, .style-text ul { font-size: 1.1vw; margin-bottom: 20px; }
.style-text ul { padding-left: 1.3vw; }
.style-text ul li { margin-bottom: 0.3vw; }
.style-text > *:last-child { margin-bottom: 0; }

.container { max-width: 100vw; margin: 0 auto; padding: 0 4.1vw; }

header { position: absolute; top: 0; width: 100%; z-index: 10; } 
header .container { display: flex; justify-content: space-between; align-items: center; }
header .logo img { width: 21.1vw; max-width: 500px; }
header nav ul { list-style: none; }
header nav ul li { display: inline-block; }
header nav ul li a { font-family: 'Argone'; font-size: 1.9vw; color: #159B3B; }
header nav ul li:not(:last-child) { margin-right: 40px; }
.navigation-toggle { display: none; }

.hero { position: relative; height: 86vw; }
.hero .bg-img { position: absolute; width: 100vw; z-index: -1; }
.hero-img-box-1 { position: absolute; top: 9vw; right: 11vw; }
.hero-img-box-1 .leerdammer-img { width: 59.5vw; }
.hero-img-box-1 .label-img { position: absolute; top: 2vw; right: 0; width: 25.2vw; }
.hero-img-box-2 { position: absolute; top: 37vw; left: -3vw; }
.hero-img-box-2 .burger-img { width: 45.6vw; }
.hero-img-box-2 .label-img { position: absolute; top: -3vw; left: 9vw; width: 17.7vw; }
.hero-img-box-2 .green-elements-img { position: absolute; bottom: 14vw; right: 5vw; width: 2.2vw; }
.hero-text-box { max-width: 22.7vw; text-align: center; }
.hero-text-box-1 { position: absolute; top: 54vw; left: 41vw; }
.hero-text-box-2 { position: absolute; top: 69.5vw; left: 11vw;  }
.hero-text-box-1, .hero-text-box-2 { transform: rotate(-355deg); }
.hero-text-box-1 .green-elements-img { position: absolute; width: 2.3vw; top: -2vw; right: -2vw;}
.hero-text-box h3 { position: relative; display: inline-block; font-size: 2.4vw; line-height: 1.1; color: #159B3B; margin-bottom: 2.5vw; }
.hero-text-box p { font-size: 1.1vw; line-height: 1.3; text-wrap: pretty; }
.hero-text-box h3:after { content: ""; display: block; position: absolute; bottom: -1.8vw; left: 0; width: 100%; height: 1.2vw; background: url('/assets/images/green-underline.svg') no-repeat; }

.about .container, .recipes .container  { display: flex; gap: 4vw; }
.about .container > .col, .recipes .container > .col { width: 50%; }

.about-text-box-1 .style-text { max-width: 37.5vw; }
.about-img-box-1 { position: relative; }
.about-img-box-1 .leerdammer-img { width: 28.8vw; }
.about-img-box-1 .green-elements-img { position: absolute; top: 2vw; left: 4vw; width: 2.2vw; transform: rotate(-143deg); }
.about-img-box-1 .orange-circle-img { position: absolute; top: 2vw; right: 11vw; width: 3.8vw; }
.about-img-box-1 .arrow-img { position: absolute; bottom: 5vw; right: 6vw; width: 8.5vw; }
.about-text-box-2 { margin-top: -3vw; }
.about-text-box-2 p { font-family: 'Argone'; color: #EEA500; }
.about-text-box-2 p:first-child { font-size: 2.4vw; transform: rotate(-4deg); padding-left: 7vw; margin-bottom: 1.5vw; }
.about-text-box-2 p:last-child { font-size: 2vw; transform: rotate(-1.5deg); padding-left: 5vw; } 
.about-img-box-2 { position: relative; padding-top: 12vw; padding-left: 6vw; }
.about-img-box-2 .food-img { width: 26.3vw; }
.about-img-box-2 .label-img { position: absolute; top: 2vw; left: 0; width: 25.2vw; }
.about-img-box-2 .orange-circles-img { position: absolute; width: 6.3vw; left: 43vw; bottom: 3vw;}
.about-img-box-2 .orange-circle-img-1 { position: absolute; width: 1.9vw; top: 5vw; left: 33vw; }
.about-img-box-2 .orange-circle-img-2 { position: absolute; width: 6.9vw; top: 11vw; left: 32vw; }
.about-text-box-3 { max-width: 27vw; margin-top: -17vw; margin-left: auto; }
.about-text-box-3 .arrow-img { display: block; margin-left: auto; margin-bottom: 1vw; width: 10.1vw; }
.about-text-box-3 p { font-family: 'Argone'; font-size: 1.8vw; color: #EEA500; transform: rotate(-355deg); }
.about-text-box-4 { position: relative; gap: 3vw; align-items: center; }
.about-text-box-4 .leerdammer-img { width: 22.4vw; }
.about-text-box-4 p { font-family: 'Argone'; font-size: 1.8vw; color: #159B3B; transform: rotate(-3deg); margin-bottom: 4vw; }
.about-text-box-4 .green-elements-img { position: absolute; right: 0; bottom: 5vw; width: 2.5vw; transform: rotate(40deg); }
.about-img-box-3 { display: flex; align-items: center; }
.about-img-box-3 .leerdammer-img { width: 36.6vw; margin-left: -9.5vw; }
.about-img-box-3 .arrow-img { width: 8.4vw; margin-bottom: 7vw; }
.about-text-box-5 p { font-family: 'Argone'; font-size: 1.8vw; color: #EEA500; transform: rotate(-355deg); margin-bottom: -3vw; margin-top: 1vw; max-width: 27vw; margin-left: auto; }
.about-text-box-6 { display: flex; gap: 1vw; margin-top: -4vw; }
.about-text-box-6 .style-text, .about-text-box-7 .style-text  { max-width: 24vw; }
.about-text-box-6 .orange-circles-img { width: 7.8vw; margin-top: 3vw; }
.about-text-box-7 { margin-top: 4vw; }

.separator-box { margin-top: -4vw; margin-bottom: 2vw; overflow: hidden; }
.separator { width: 115vw; height: 15vw; background: url('/assets/images/separator.svg') bottom center / cover no-repeat; margin-left: -6vw; overflow: hidden; }

.single-recipe { position: relative; margin-bottom: 5vw; }
.recipes .heading-2 { margin-bottom: 4vw; }
.recipes-text-box-1 .heading-3 { margin-bottom: 5vw; }
.recipes-img-box-1 { margin-top: -7vw; }
.recipes-img-box-1 .food-img { display: block; width: 28.1vw; margin-left: -3vw; }
.recipes-img-box-1 .orange-circles-img { display: block; width: 9.3vw; transform: rotate(270deg); margin-bottom: 1vw; margin-left: 17vw; }
.recipes-text-box-2 { position: relative; display: inline-block; margin-top: 2vw; margin-left: -4vw;  }
.recipes-text-box-2 .green-elements-img { position: absolute; bottom: 0; left: -2vw; width: 3vw; transform: rotate(169deg); }
.recipes-text-box-2 .orange-circles-img { position: absolute; width: 6.3vw; right: -7vw; top: -2vw; transform: rotate(290deg); }
.recipe-details { display: inline-block; text-align: center; }
.recipe-details.green { transform: rotate(-355deg); color: #159B3B; }
.recipe-details.orange { transform: rotate(-3deg); color: #EEA500; }
.recipe-details h4 { font-size: 2.6vw; line-height: 1; }
.recipe-details ul { font-family: 'Argone'; list-style: none; }
.recipe-details ul li { font-size: 1.9vw; }
.recipe-details h4, .recipe-details ul li:not(:last-child) { margin-bottom: 0.2vw; }
.recipes .style-text { max-width: 37.5vw; }
.side-element-img-1 { position: absolute; top: 0; right: -18vw; width: 35.2vw; z-index: -1; }
.recipes-img-box-2 .food-img { width: 24.9vw; }
.recipes-img-box-2 { margin-top: 6vw; }
.recipes-text-box-3 { position: absolute; top: 9vw; right: -2.5vw;  }
.recipes-text-box-3 .green-elements-img { position: absolute; top: 0vw; left: -2vw; width: 2.5vw; transform: rotate(220deg); }
.recipes-text-box-3 .orange-circle-img { position: absolute; top: -6vw; right: 0; width: 4.1vw; }
.recipes-text-box-4 { position: absolute; bottom: 6vw; right: -2vw;  }
.recipes-text-box-5 .orange-circles-img { display: block; margin-left: auto; width: 8.4vw; transform: rotate(280deg); }
.recipes-text-box-5 .orange-circle-img { margin-top: 3vw; margin-left: 7vw; width: 3.8vw; }
.recipes-text-box-6 { margin: 2vw 0 4vw 4vw; }
.recipes-text-box-7 { position: relative; margin-left: 4vw; }
.recipes-text-box-7 .green-elements-img { position: absolute; top: -1vw; right: -1vw; width: 2.5vw; transform: rotate(-25deg); }
.recipes-img-box-3 { margin-left: -5vw; }
.recipes-img-box-3 .orange-circle-img { display: block; width: 1.8vw; margin-left: 25vw; margin-bottom: 1vw; }
.recipes-img-box-3 .food-img { width: 28.1vw; }
.recipes-text-box-8 { margin-top: 4vw; }
.side-element-img-2 { position: absolute; right: -22vw; top: -18vw; width: 43.6vw; z-index: -1; }

footer { position: relative; height: 25vw; padding-bottom: 3vw; }
footer .container { position: absolute; bottom: 2vw; width: 100%; display: flex; justify-content: space-between; gap: 2vw; }
footer .container > div:last-child { display: flex; gap: 25px; }
.footer-img { position: absolute;  bottom: 0; width: 100vw; z-index: -1; }
footer p { display: inline-block; font-size: 1.1vw; }
footer a { color: #000; }

@media only screen and (max-width: 991px) {
    html { scroll-padding: 10vw; }

    .container { padding: 0 7vw; }

    .heading-2 { font-size: 13.5vw; margin-bottom: 12.5vw; }
    .heading-2:after, .heading-3.green:after, .heading-3.orange:after { bottom: -5vw; height: 4vw; }
    .heading-3 { font-size: 10vw; max-width: 65vw; margin-bottom: 12.5vw; }

    .style-text p, .style-text ul { font-size: 4.5vw; }
    .style-text ul { padding-left: 6vw; }

    header .container { justify-content: center; }
    header .logo { margin-top: 7vw; }
    header .logo img { width: 60vw; }
    header nav { display: none; }
    header nav ul { position: absolute; top: 50%; left: 50%; width: 100%; transform: translate(-50%, -50%); }
    header nav ul li:not(:last-child) { margin: 0 0 20px 0; }
    header nav ul li { display: block; text-align: center; }
    header nav ul li a { font-size: 10vw; width: 100%; }

    .navigation-toggle { display: block; position: absolute; top: 7vw; right: 7vw; height: 25px; width: 35px; z-index: 10; }
    .navigation-toggle .bar { position: absolute; display: block; width: 100%; height: 4px; background: #159B3B; border-radius: 20px; transition: all 0.3s; }
    .navigation-toggle .bar1 { top: 0; }
    .navigation-toggle .bar2 { top: 50%; transform: translateY(-50%); }
    .navigation-toggle .bar3 {  bottom: 0; }
    .navigation-active { overflow: hidden; }
    .navigation-active .navigation-toggle .bar1 { top: 50%; transform: translateY(0) rotate(45deg); }
    .navigation-active .navigation-toggle .bar2 { opacity: 0; }
    .navigation-active .navigation-toggle .bar3 { top: 50%; bottom: auto; transform: translateY(0) rotate(-45deg); }
    .navigation-active header, .navigation-active header .container { height: 100vh; }
    .navigation-active header nav { display: block; position: fixed; top: 0; height: 100%; background: #FEE385; width: 100vw;}

    .hero { height: auto; overflow: hidden; }
    .hero-img-box-1, .hero-img-box-2, .hero-text-box-1, .hero-text-box-2 { position: relative; }
    .hero-img-box-1 { top: auto; right: 0; padding-top: 43vw; }
    .hero-img-box-1 .leerdammer-img { width: 115vw; margin-left: -8vw; z-index: -1; }
    .hero-img-box-1 .label-img { top: 43vw; right: 7vw; width: 49vw; z-index: -1; }
    .hero-img-box-2 { top: auto; left: auto; margin-top: -3vw; }
    .hero-img-box-2 .burger-img { width: 100%; margin-left: -12vw; }
    .hero-img-box-2 .label-img { top: -10vw; left: 41vw; width: 49vw; }
    .hero-img-box-2 .green-elements-img { bottom: 14vw; right: 15vw; width: 7vw; transform: rotate(60deg); }
    .hero-text-box { max-width: calc(100% - 14vw); margin: 0 auto; }
    .hero-text-box-1 { top: auto; left: auto; margin-top: 2vw; margin-bottom: 12vw; }
    .hero-text-box-1 .green-elements-img { width: 6.3vw; right: 0; }
    .hero-text-box-1 .orange-circles-img { position: absolute; width: 13vw; top: -7vw; left: -5vw; }
    .hero-text-box-2 { top: auto; left: auto; transform: rotate(-4deg); }
    .hero-text-box h3 { font-size: 8.8vw; margin-bottom: 6.5vw; }
    .hero-text-box h3:after { bottom: -4vw; height: 3vw; }
    .hero-text-box p { font-size: 4.5vw; }

    .separator-box { margin-top: 0; }
    .separator { width: 150vw; height: 20vw;  margin-top: 0vw; margin-left: -24vw; margin-bottom: 5vw; }

    .about { overflow: hidden;}
    .about .container, .recipes .container { flex-wrap: wrap; }
    .about .container > .col, .recipes .container > .col { width: 100%; }
    .about-text-box-1 { margin-bottom: 2vw; }
    .about-text-box-1 .style-text { max-width: 100%; }
    .about-img-box-1 .leerdammer-img {width: 87.1vw; margin-left: -8.5vw; }
    .about-img-box-1 .green-elements-img { top: 6vw; width: 6.8vw; }
    .about-img-box-1 .orange-circle-img { top: 4vw; right: -1vw; width: 11.1vw; }
    .about-img-box-1 .arrow-img { bottom: -34px; right: -3vw; width: 22vw; }
    .about-img-box-1 .orange-circles-img { position: absolute; bottom: 17vw; left: -5vw; width: 14vw; transform: rotate(20deg); }
    .about-img-box-1 .green-elements-img-2 { position: absolute; bottom: 25vw; right: 2vw; width: 5vw; transform: rotate(38deg); }
    .about-text-box-2 { margin-top: -8vw; }
    .about-text-box-2 p:first-child { font-size: 8.1vw; max-width: 65vw; padding-left: 0; }
    .about-mobile-box-1 { display: flex; justify-content: space-between; align-items: flex-start; gap: 4vw; }
    .about-mobile-box-1 .leerdammer-img { width: 47vw; margin-top: 3vw; }
    .about-mobile-box-1 p { font-family: 'Argone'; font-size: 6.8vw; color: #EEA500; transform: rotate(-1.5deg); margin-top: 2vw; margin-bottom: 2vw; }
    .about-mobile-box-1 .relative-box { position: relative ; }
    .about-mobile-box-1 .arrow-img { position: absolute; left: 0vw; bottom: -20vw; width: 20vw; }
    .about-mobile-box-1 .orange-circles-img { position: absolute; right: -3vw; bottom: -16vw; width: 11vw; transform: rotate(180deg); }
    .about-mobile-box-2 { transform: rotate(-355deg); margin-top: 6vw; }
    .about-mobile-box-3 { position: relative; transform: rotate(-3deg); max-width: 65vw; margin-top: 8vw; }
    .about-mobile-box-2 p { color: #EEA500; }
    .about-mobile-box-3 p { color: #159B3B; }
    .about-mobile-box-3 .orange-circle-img { position: absolute; bottom: 0; right: -20vw; width: 9.6vw; }
    .about-mobile-box-3 .green-elements-img { position: absolute; bottom: -5vw; right: -4vw; width: 7vw; transform: rotate(45deg); }
    .about-mobile-box-2 p, .about-mobile-box-3 p { font-family: 'Argone'; font-size: 6.5vw; }
    .about-img-box-3 .leerdammer-img { width: 125vw; margin-left: -29.5vw; }
    .about-text-box-5 { display: flex; flex-direction: column-reverse; }
    .about-text-box-5 p { font-size: 6.5vw; max-width: 70vw; margin-top: -16vw; margin-left: unset; margin-bottom: 11vw; }
    .about-img-box-3 { position: relative; display: block; margin-top: -6vw; }
    .about-img-box-3 .arrow-img { position: absolute; bottom: -6vw; right: -4vw; width: 20vw; margin-bottom: 0; }
    .about-img-box-3 .green-elements-img { position: absolute; right: -3vw; bottom: 22vw; width: 5vw; transform: rotate(50deg);}
    .about-text-box-6 .style-text, .about-text-box-7 .style-text { max-width: 100%; }
    .about-text-box-7 { position: relative; margin-top: 13vw; }
    .about-text-box-7 .heading-3 { max-width: 50vw; }
    .about-text-box-7 .side-element-img { position: absolute; top: -23vw; right: -38vw; width: 70vw; z-index: -1; }
    .about-img-box-2 { padding-top: 35vw; }
    .about-img-box-2 .food-img { display: block; margin-left: auto; width: 70.2vw; }
    .about-img-box-2 .label-img { top: 4vw; left: -3vw; width: 75vw; }
    .about-img-box-2 .orange-circles-img { width: 16vw; top: 2vw; left: auto; right: -3vw; bottom: auto; transform: rotate(270deg); }
    .about-img-box-2 .orange-circle-img-1 { width: 6vw; top: auto; bottom: 43vw; left: 5vw; }
    .about-img-box-2 .orange-circle-img-2 { width: 9vw; top: auto; bottom: 0; left: 13vw; }

    .single-recipe { margin-bottom: 10vw; }
    .recipes .heading-2, .recipes-text-box-1 .heading-3 { margin-bottom: 12.5vw; }
    .recipes .style-text { max-width: 100%; }
    .recipes-img-box-1 .food-img { display: block; width: 79vw; margin: 0 auto; }
    .recipe-details h4 { font-size: 9.3vw; }
    .recipe-details ul li { font-size: 6.9vw; }
    .recipes-img-box-1 { position: relative; padding: 10vw 0; }
    .recipes-img-box-1 .orange-circles-img { width: 13.3vw; transform: unset; margin-bottom: 0; margin: unset; position: absolute; bottom: 0; }
    .recipes-text-box-2 { margin: 0; }
    .recipes-text-box-2 .green-elements-img { bottom: -3vw; left: 0; width: 7vw; transform: rotate(169deg); }
    .recipes-text-box-1 { margin-top: 3vw; }
    .recipes-img-box-2 { position: relative; margin-top: 0; }
    .recipes-img-box-2 .food-img { width: 70.4vw; display: block; margin: 0 auto; }
    .recipes-img-box-2 .orange-circles-img { position: absolute; bottom: 0; left: 5vw; transform: rotate(180deg); width: 13vw; }
    .recipes-text-box-3, .recipes-text-box-4 { position: unset; }
    .recipes-text-box-3 { margin: 7vw 0 9vw 3vw; }
    .recipes-text-box-3 .green-elements-img { top: 0vw; left: -2vw; width: 7vw; }
    .recipes-text-box-5 .orange-circles-img { width: 15vw; transform: rotate(265deg); margin-top: -18vw; margin-bottom: 5vw; }
    .recipes-mobile-box-1 { position: relative; }
    .recipes-mobile-box-1 .orange-circle-img {  position: absolute; top: 3vw; right: 9vw; width: 6vw; }
    .recipes-mobile-box-1 .orange-circle-img-2 { position: absolute; bottom: 27vw; right: 0; width: 14vw; }
    .recipes-img-box-3 { position: relative; margin-top: -4vw; }
    .recipes-img-box-3 .food-img { display: block; margin: 0 auto 0 8vw; width: 80vw; }
    .recipes-img-box-3 .orange-circles-img { position: absolute; bottom: -15vw; left: 7vw; width: 19vw; transform: rotate(-58deg); }
    .recipes-text-box-6 { margin: 8vw 0 9vw 3vw; }
    .recipes-text-box-7 { margin-bottom: 7vw; margin-left: 0; }
    .recipes-text-box-7 .orange-circle-img { position: absolute; top: -5vw; right: 0vw; width: 10vw; }
    .recipes-text-box-7 .orange-circles-img { position: absolute; bottom: -8vw; right: -3vw; transform: rotate(-170deg); width: 14vw; }
    
    footer { height: 45vw; overflow: hidden; }
    footer .container {  flex-direction: column; bottom: 8vw; gap: 5vw; }
    footer .container > div:last-child { display: flex; flex-direction: column; gap: 1vw; }
    .footer-img { width: 160vw; margin-left: -30vw; }
    footer p { font-size: 3.6vw; }
}

@font-face {
    font-family: 'Argone';
    src: url('../fonts/ArgoneBlack.eot');
    src: url('../fonts/ArgoneBlack.eot') format('embedded-opentype'),
         url('../fonts/ArgoneBlack.woff2') format('woff2'),
         url('../fonts/ArgoneBlack.woff') format('woff'),
         url('../fonts/ArgoneBlack.ttf') format('truetype'),
         url('../fonts/ArgoneBlack.svg#ArgoneBlack') format('svg');
    font-weight: 900;
}

@font-face {
    font-family: 'RobotoSlab';
    src: url('../fonts/RobotoSlabRegular.eot');
    src: url('../fonts/RobotoSlabRegular.eot') format('embedded-opentype'),
         url('../fonts/RobotoSlabRegular.woff2') format('woff2'),
         url('../fonts/RobotoSlabRegular.woff') format('woff'),
         url('../fonts/RobotoSlabRegular.ttf') format('truetype'),
         url('../fonts/RobotoSlabRegular.svg#RobotoSlabRegular') format('svg');
    font-weight: 400;
}