@charset "utf-8";@import url(https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,700;1,400;1,700&display=swap);*{margin:0;padding:0;box-sizing:border-box}img{display:block}body{font-family:futura-pt,sans-serif;font-style:normal}.container{width:100%;display:flex;justify-content:center;min-width:300px}.nav{width:100%;height:30px;position:fixed;top:0;z-index:3;margin:10px;display:flex;flex-direction:row;justify-content:space-around}.nav-right{height:100%;width:20%;display:flex;flex-direction:row;justify-content:space-between}.nav img{height:100%}#desk{display:none;justify-content:space-between}.header{background-image:url(../img/header.jpg);background-position:center;background-size:cover;background-repeat:no-repeat;width:100%;height:calc(70vh + 40px);position:fixed;top:0;z-index:0}.header-title{width:100%;height:70vh;position:fixed;top:0;padding:10%;color:#fff;z-index:2;letter-spacing:2px;display:flex;flex-direction:column;justify-content:flex-end}.header-title h1{font-size:40px;width:50%;font-weight:600}.header-h2{margin-top:20px;display:flex;flex-direction:row;font-size:12px;letter-spacing:.5px}.header-h2 h2{font-weight:200}.orange{color:#f86600;margin-left:5px}.player{width:100%;height:calc(70vh + 40px);position:fixed;top:0;padding-bottom:40px;z-index:1;display:flex;justify-content:center;align-items:center;background:#000;background:linear-gradient(180deg,rgba(0,0,0,0) 0,#000 100%)}.player img{width:20%;opacity:50%}.section{width:100%;border-radius:40px;border-bottom-left-radius:0;border-bottom-right-radius:0;z-index:4;padding:15px;position:relative;top:70vh;background-color:#fff;display:flex;flex-direction:column;align-items:center}.section-nav{width:80%;font-size:20px;margin:10px 0;display:flex;flex-direction:row;justify-content:space-between}.section-nav h2{cursor:pointer;opacity:50%;transition:opacity .5s ease}.section-nav .selected{cursor:default;opacity:100%;border-bottom:2px solid;transition:opacity .5s ease}#hidden{display:none}#hidden h2{border-bottom:2px solid}#headerHidden{display:none}.section-header{margin:10px 0;width:80%;display:flex;flex-direction:row;justify-content:space-between;color:#f86600}.section-header h3{font-weight:400}.section-header-duur{width:30%;display:flex;flex-direction:row;justify-content:flex-start;align-items:center}.section-header-duur img{height:18px;margin:5px}.section-header-duur h3{font-size:18px}.section-header-persons{display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.section-header-persons h3{margin:0 2.5px}.section-header-persons-add{width:50%;display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.section-header-persons-add img{height:18px;margin:5px}.section-voeding{width:80%;margin:10px 0;display:flex;flex-direction:column;align-items:center}.section-voeding p{margin-bottom:10px;font-size:16px}.section-voeding-content{width:100%;height:64px;display:flex;flex-direction:row;justify-content:space-between;align-items:center}.section-voeding-content-item{width:100%;height:100%;border-right:1px solid #dedede;padding:0 10px;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.section-voeding-content-item p{font-size:12px;margin:0}#quantity{font-size:16px;font-weight:600;color:#f86600}#noBorder{border:none}.section-container{width:80vw;position:relative;overflow:hidden;margin:30px 0;display:flex;flex-direction:row}.section-container-ingredienten{width:80vw;transition:transform .5s ease;display:flex;flex-direction:column;align-items:center}.section-container-ingredienten-content{width:100%;font-size:16px;padding:16px;display:flex;flex-direction:row;align-items:center;justify-content:space-between}#ingrQuantity{margin-right:5px}.section-container-ingredienten-content p{font-size:16px}.contentQuantity{display:flex;flex-direction:row}#grey{background-color:#ebebeb;border-radius:16px}.section-container-bereiding{width:80vw;position:absolute;transform:translate(120%,0);transition:transform .5s ease;display:flex;flex-direction:column;align-items:flex-start}.section-container-bereiding-content{margin:20px 0;display:flex;flex-direction:column}.section-container-bereiding-content h2{color:#f86600;font-size:20px;margin-bottom:10px}.section-container-bereiding-content p{font-size:16px}.ingr{transform:translate(-120%,0);transition:transform .5s ease}.ber{transform:translate(0,0);transition:transform .5s ease}.resultImage{width:80vw;margin-bottom:40px}.resultImage img{width:100%;border-radius:40px}.footer{position:static;width:80vw;background-color:#ebebeb;border-radius:16px;padding:25px}.footer-title{display:flex;flex-direction:row;justify-content:center}.footer-title p{font-size:10px}#orange{color:#f86600}.footer-content{width:100%;margin-top:20px;display:flex;flex-direction:row;justify-content:center}.footer-content a{font-size:11px;color:#f86600;padding:0 10px;border-right:#dedede 2px solid}@media all and (min-width:600px){.nav{margin:20px;display:none}.nav-right{width:10%}#desk{width:90%;display:flex}.header{height:100vh}.header-title{height:100vh;padding:7%}.header-title h1{font-size:64px}.header-h2{margin-top:0}.header-h2 h2{font-size:24px;font-weight:400}.player{height:100vh}.player img{width:20%}.section{top:100vh;position:absolute}.section-nav{display:none}.section-header{display:none}#headerHidden{display:flex}.section-container #hidden{display:flex}.section-container-title{border-bottom:2px solid;align-self:center}.section-container{justify-content:space-between}.section-container-ingredienten{width:47%;position:static;padding-bottom:20px;justify-content:space-between}.section-container-bereiding{width:47%;position:static;transform:translate(0,0)}.resultImage{width:50vw}.resultImage img{width:100%;border-radius:40px}}@media all and (max-width:850px){.nav-right{width:20%}}@media all and (min-width:900px){.nav{justify-content:space-between;padding:0 50px}#desk{width:100%}.header-title h1{font-size:64px}.header-h2{margin-top:0}.header-h2 h2{font-size:24px;font-weight:400}.player{height:100vh}.player img{width:10%}.section{top:100vh;position:absolute;padding:25px 15px;width:90vw;border-bottom-right-radius:0;border-bottom-left-radius:0}.section-header{display:none;margin-top:40px;margin-bottom:20px}.section-voeding p{font-size:24px}.section-voeding-content-item p{font-size:20px}#quantity{font-size:24px}.ingr{transform:none;transition:transform .5s ease;position:static}.ber{transform:none;transition:transform .5s ease;position:static}.footer-title p{font-size:15px}.footer-content a{font-size:17px}}