button{width:100%;padding:24px;background:#e30613;color:#fff;font-family:"fargono","Open Sans",sans-serif;font-size:16px;text-transform:uppercase;letter-spacing:1px;font-weight:700;text-align:center;border:0;border-radius:4px;transition:background 250ms ease-in-out,transform 150ms ease;cursor:pointer}button:focus,button:hover{background:#a7040e}button:focus{outline:0}button:active{transform:scale(.99)}button.disabled{opacity:.5;cursor:not-allowed}button.inverted{background:#fff;color:#e30613}button.inverted:focus,button.inverted:hover{background:#e0e0e0}button.secondary{width:auto;background:0 0;border:solid #000 2px;color:#000}@font-face{font-family:"fargono";font-weight:400;src:url(../fonts/fargono.ttf) format("truetype");font-display:auto}@font-face{font-family:"fargono";font-weight:700;src:url(../fonts/fargono-extrablod.ttf) format("truetype");font-display:auto}@font-face{font-family:"typewriter";font-weight:400;src:url(../fonts/typewriter.otf) format("opentype");font-display:auto}body{font-family:"fargono","Open Sans",sans-serif;line-height:1.25}body h1,body h2,body h3{font-size:36px;text-transform:uppercase}body h2,body h3{font-size:20px}body,body h3{font-size:14px}body h3{margin:4px 0}body p{margin:16px 0}*{box-sizing:border-box}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:#828a8d80}::-webkit-scrollbar-thumb{background:#e3061380;border-radius:4px}:root{--previewHeight:calc(var(--vh2) * 100 - var(--controlsHeight2));--scale:calc(var(--previewHeight) * .00163666)}html body{background-size:cover;background-position:center;user-select:none;overflow:hidden;margin:0}html body nav{position:fixed;z-index:1;top:20px;right:20px}html body nav svg{width:28px;color:#fff;cursor:pointer}html body nav svg:focus+ul{transform:translateX(0);transition:all .125s}html body nav ul{position:fixed;top:0;right:0;transform:translateX(100%);height:100%;margin:0;list-style:none;padding:30px;background:#fff;transition:all .125s;transition-delay:.1s}html body nav ul li{margin:4px 0}html body nav ul li a{display:inline-block;padding:4px 0;color:#000;text-decoration:none}html body nav ul li a:hover{text-decoration:underline}html body [x-cloak]{display:none!important}html body .device-frame{display:none}html body #ginspirator{position:relative;height:calc(var(--vh, 1vh)*100);background:rgba(0,0,0,.75)}html body #ginspirator #intro{display:flex;flex-direction:column;justify-content:space-between;height:inherit;padding:64px 24px 32px;overflow:auto;text-align:center;color:#fff}html body #ginspirator #intro a .logo{width:100px}html body #ginspirator #controls,html body #ginspirator #preview,html body #ginspirator #steps{background:#fff}html body #ginspirator #preview{display:flex;height:calc(var(--vh, 1vh)*25);position:relative;overflow:hidden;cursor:pointer;background:#e5e5e5}html body #ginspirator #preview a{position:absolute;top:16px;left:16px;z-index:1}html body #ginspirator #preview a .logo-icon{width:48px;height:auto}html body #ginspirator #preview.preview{height:calc(var(--vh, 1vh)*100 - var(--controlsHeight))}html body #ginspirator #preview.preview .layers{transform:scale(min(1,var(--scale)))}html body #ginspirator #preview.preview .layers img{width:140%;height:auto}html body #ginspirator #preview.preview .layers .custom-layer-outer-wrapper .text-layer{font-size:16px;left:71%;top:61%}html body #ginspirator #preview.preview .layers .custom-layer-outer-wrapper .custom-layer-inner-wrapper{width:35.5%}html body #ginspirator #preview.preview .minimize{display:block}html body #ginspirator #preview.preview .enlarge{display:none}html body #ginspirator #preview .layers{position:absolute;height:100%;width:100%;display:flex;justify-content:center;align-items:center}html body #ginspirator #preview .layers img{height:100%;position:absolute}html body #ginspirator #preview .layers img.alkoholgehalt{transform:translateY(-1.4%) translateX(2%) scale(1.3)}html body #ginspirator #preview .layers img.botanical{transform:translateY(-7.4%) scale(1.5)}html body #ginspirator #preview .layers img.botanical.begleiter{transform:translateY(-5.7%) scale(1.5)}html body #ginspirator #preview .layers img.botanical.begleiter_zwei{transform:translateY(-4%) scale(1.5)}html body #ginspirator #preview .layers .custom-layer-outer-wrapper{display:flex;justify-content:center;align-items:center;position:relative}html body #ginspirator #preview .layers .custom-layer-outer-wrapper .text-layer{position:absolute;font-weight:700;text-align:center;text-transform:uppercase;color:#222;filter:drop-shadow(0 0 .7px #222);width:140px;transform:translateX(-50%);opacity:.9;font-size:5px;left:65%;top:61%}html body #ginspirator #preview .layers .custom-layer-outer-wrapper .custom-layer-inner-wrapper{width:25.5%;height:34%;position:absolute;transform:translate(-66%,58%);display:flex;justify-content:center;align-items:center}html body #ginspirator #preview .layers .custom-layer-outer-wrapper .custom-layer-inner-wrapper img{width:100%;height:100%;object-fit:cover}html body #ginspirator #preview .enlarge,html body #ginspirator #preview .minimize{position:absolute;width:28px;height:auto;bottom:16px;right:16px}html body #ginspirator #preview .minimize{display:none}html body #ginspirator #steps{height:calc(var(--vh, 1vh)*75 - var(--controlsHeight));overflow:auto;padding:24px;scroll-behavior:smooth}html body #ginspirator #steps h2{position:relative;line-height:1;cursor:pointer}html body #ginspirator #steps h2 span{font-size:12px;text-transform:none}html body #ginspirator #steps h2:after{content:url(../images/icons/check-light.svg);position:absolute;right:0;top:50%;transform:translateY(-50%);width:16px;height:16px;line-height:0;padding:8px;background:#fff;border-radius:50%;opacity:0;transition:opacity .125s linear;filter:invert(1);margin-left:auto}html body #ginspirator #steps h2.ready:after{opacity:1;transition:opacity .3s linear}html body #ginspirator #steps .options{display:flex;flex-wrap:wrap;justify-content:space-between;margin:24px 0}html body #ginspirator #steps .options.col3 .option{width:calc(33.333% - 5.333px)}html body #ginspirator #steps .options input:checked+.option label:before{background:rgba(0,0,0,.8)}html body #ginspirator #steps .options input:checked+.option label:after{opacity:1}html body #ginspirator #steps .options .option{width:calc(50% - 4px);margin:4px 0}html body #ginspirator #steps .options .option label{display:flex;position:relative;cursor:pointer;color:#fff}html body #ginspirator #steps .options .option label:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(0deg,rgba(0,0,0,.8) 0,transparent 66%);border-radius:8px}html body #ginspirator #steps .options .option label img{width:100%;align-self:flex-start;border-radius:8px}html body #ginspirator #steps .options .option label .info{position:absolute;left:0;bottom:0;padding:16px}html body #ginspirator #steps .options .option label .info .description p{margin:0;font-size:12px}html body #ginspirator #steps .options .option label:after{content:url(../images/icons/check-light.svg);position:absolute;top:16px;right:16px;width:16px;height:16px;padding:8px;background:#fff;border-radius:50%;opacity:0;transition:opacity .125s linear}html body #ginspirator #steps .highlighted{background:#e7eff3;border-radius:8px;padding:16px;margin-bottom:16px}html body #ginspirator #steps .highlighted strong{margin-bottom:8px;display:block}html body #ginspirator #steps .highlighted .text-layer{width:100%;background:#fff;border:0;padding:12px;border-radius:4px}html body #ginspirator #controls{position:absolute;width:100%;bottom:0;border-top:1px solid #e5e5e5;padding:24px 24px 32px}html body #ginspirator #controls h2{margin-top:0}html body #ginspirator #controls.review .button-wrapper{gap:16px;display:flex}html body .dz-details{display:none!important}html body .dz-remove{font-size:32px!important;text-decoration:none!important;color:#e30613!important;pointer-events:all!important}html body .dz-max-files-reached{pointer-events:none!important}html body .dz-button{background:0 0!important;color:#000!important}@media (min-width:480px){html body{display:flex;justify-content:center;align-items:center;height:100vh}html body #ginspirator{width:390px}}@media (min-width:480px) and (min-height:800px){html body .device-frame{display:block;width:412px;position:absolute;pointer-events:none;z-index:1;transform:unset;transform:scale(.9)}html body #ginspirator{transform:scale(.9);height:842px;border-radius:34px;overflow:hidden}}@media (min-width:480px) and (min-height:860px){html body .device-frame{display:block;width:412px;position:absolute;pointer-events:none;z-index:1;transform:unset}html body #ginspirator{width:390px;height:844px;border-radius:34px;overflow:hidden;transform:unset}}