@font-face{font-family:Lato;font-style:normal;font-weight:400;src:url(/assets/lato-v23-latin-regular.e745a8d2.eot);src:local(""),url(/assets/lato-v23-latin-regular.e745a8d2.eot?#iefix) format("embedded-opentype"),url(/assets/lato-v23-latin-regular.918b7dc3.woff2) format("woff2"),url(/assets/lato-v23-latin-regular.ad119c7b.woff) format("woff"),url(/assets/lato-v23-latin-regular.b6e055ad.ttf) format("truetype"),url(/assets/lato-v23-latin-regular.9e2898a4.svg#Lato) format("svg")}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{font-family:Lato,sans-serif;font-size:16px;line-height:24px;font-weight:400;--color-antrazit: #383e42;--color-eisenglimmer: #575556;--color-tiefschwarz: #0e0e10;--color-silber: #a1a1a0;--color-text-light: #222722;--color-background-light: rgba(255, 255, 255, 1);--color-railing_gray-light: #bdbcbc;--color-railing_gray-dark: #010101;--color-railing_gold-light: #a89366;--color-green-light: #7ad0ac;--color-blue-light: #8395cd;--color-text-dark: rgba(255, 255, 255, 1);--color-background-dark: var(--color-railing_gold-light);--activeBorder: #ef293d;--border: #999;--danger: #e4bb06;--headline: #0f1f33;--select-border: #777;--select-focus: blue;--select-arrow: var(--select-border);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}.light-theme{--color-text: var(--color-text-light);--color-background: var(--color-background-light);--color-railing_gray: var(--color-railing_gray-light);--color-railing_gold: var(--color-railing_gold-light);--color-green: var(--color-green-light);--color-blue: var(--color-blue-light)}.dark-theme{--color-text: var(--color-text-dark);--color-background: var(--color-background-dark);--color-railing_gray: var(--color-text-dark);--color-railing_gold: var(--color-background-dark);--color-green: var(--color-text-dark);--color-blue: var(--color-text-dark)}body{font-size:16px;color:var(--color-railing_gray);background-color:var(--color-background);min-height:100vh}.demo-text{display:none}.page{position:relative;display:flex;flex-direction:column;height:100%}.page-nav{position:relative;width:100%;height:17.5vh;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:.5rem 1rem}.page-logo{font-size:x-large}.page-logo img{width:100px;height:40px}.page-logo a{text-decoration:none;color:var(--color-railing_gray);cursor:pointer}.page-brand{margin:0 auto}.page-brand img{width:250px;height:40px}.toggle-bar{display:flex;justify-content:center;align-items:center;z-index:999}.sun-wrapper,.moon-wrapper{display:flex;justify-content:center;align-items:center}.toggle-button{position:relative;width:3.5rem;height:1.75rem;display:flex;justify-content:center;align-items:center;background-color:var(--color-railing_gray);margin:0 1rem;border-radius:62.4375rem;border:none;box-shadow:#959da533 0 8px 24px;cursor:pointer}.toggle-circle{position:absolute;width:1.25rem;height:1.25rem;left:.375rem;background-color:var(--color-background);border-radius:50%;transition:all .2s ease-in-out}.toggle-button:hover .toggle-circle{transform:scale(.9)}.slide{left:1.75rem}.app-steps{position:relative;height:5vh;width:100%;display:none;background-color:var(--color-railing_gray)}.page-content{position:relative;display:flex;flex-direction:column}.page-bottom{height:10vh;display:flex;justify-content:center;align-items:center;flex-direction:column;margin-top:auto;background-color:var(--color-railing_gray);color:var(--color-background)}.page-bottom h3{font-size:1rem;margin-left:1rem}.page-bottom .page-bottom-headlines{width:100%;display:flex;justify-content:space-around;align-items:center;margin:.5rem 0}.page-bottom .configField{display:flex;justify-content:space-between;align-items:center;width:100%;margin:.5rem 0}.page-bottom .configField label{color:var(--color-background);margin-left:.5rem}.page-bottom .configField input[type=text]{text-align:left;color:var(--color-text-light);width:40%}.app{position:relative;display:flex;flex-direction:column;width:100%;height:40vh}.app-config{display:flex;flex-direction:column;width:100%}.steps-grid{height:100%;width:100%}.step1,.step2,.step3,.step4,.step5{display:flex;padding:.5rem;height:100%;width:100%;color:var(--color-background)}#step1,#step2,#step3,#step4,#step5{width:32px;min-width:32px;height:32px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:transparent;border:2px solid var(--color-background);border-radius:50%;margin:0 1rem}.webgl{width:100%;height:100%}.step1container{position:relative;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem}.step1container .grundform-grid{height:100%;width:100%;display:grid;grid-template-columns:repeat(2,1fr)}.grundform{width:100%;height:100%}.grundform h2{font-size:1.5rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.grundform h3{font-size:1.25rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.grundform-item img{width:64px;height:64px}.grundform-grid{height:100%;width:100%;display:grid;grid-template-columns:repeat(3,1fr)}.grundform-item{width:90%;display:flex;flex-direction:column;justify-content:center;align-items:center;margin:0 auto;margin-top:1rem;border:1px solid var(--color-railing_gray);border-radius:.5rem;cursor:pointer;transition:border-color .2s ease-in-out}#uGrundformBtn{display:none}.grundform-item:hover{border:1px solid var(--color-railing_gold-light)}.kantenlaengen{width:100%}.kantenlaengen h3{font-size:1.25rem;margin-left:1rem;font-weight:700;color:var(--color-railing_gray)}.kantenlaengen-grid{width:100%;display:grid;grid-template-columns:repeat(1,1fr);grid-gap:1rem}.kantenlaengen-images img{display:flex;width:50%;height:50%;object-fit:cover}.kantenlaengen-item-flex{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;margin-top:-5rem}.kantenlaenge-flaeche1,.kantenlaenge-flaeche2,.kantenlaenge-flaeche3{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.kantenlaenge-flaeche1 label,.kantenlaenge-flaeche2 label,.kantenlaenge-flaeche3 label{margin-right:1rem;color:var(--color-railing_gray)}.kantenlaenge-flaeche1 input[type=number],.kantenlaenge-flaeche2 input[type=number],.kantenlaenge-flaeche3 input[type=number]{border:none;color:var(--color-background);background-color:var(--color-railing_gray);outline:none;z-index:999}.step2container{position:relative;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem}.befestigung{width:100%;height:100%}.befestigung h2{font-size:1.5rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.befestigung h3{font-size:1.25rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.befestigung-item img{width:64px;height:64px}.befestigung-grid{display:grid;grid-template-columns:repeat(3,1fr);place-items:center;margin:0 .5rem;gap:1rem}.befestigung-item{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:0 auto;margin-top:2rem;border:1px solid var(--color-railing_gray);border-radius:.5rem;text-align:center;cursor:pointer;transition:border-color .2s ease-in-out}.befestigung-item:hover{border:1px solid var(--color-railing_gold-light)}.befestigung-info-container{margin-top:1rem;width:100%}.befestigung-info-V1{width:100%;display:none;flex-direction:column;justify-content:center;align-items:center}.befestigung-info-V1 img{width:100%;height:100%;object-fit:cover}.befestigung-info-V2{width:100%;display:none;flex-direction:column;justify-content:center;align-items:center}.befestigung-info-V2 img{width:100%;height:100%;object-fit:cover}.befestigung-info-Top{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.befestigung-info-Top img{width:100%;height:100%;object-fit:cover}.step3container{position:relative;width:100%;height:100%;display:flex;flex-direction:column;gap:1rem;padding-top:2rem}.gelaender{width:100%;height:100%}.gelaender h2{font-size:1.5rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.gelaender h3{font-size:1.25rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.gelaender-item img{width:64px;height:64px}.gelaender-grid{display:grid;grid-template-columns:repeat(2,1fr);place-items:center}.gelaender-item{width:80%;display:flex;flex-direction:column;justify-content:center;align-items:center;margin:0 auto;margin-top:2rem;border:1px solid var(--color-railing_gray);border-radius:.5rem;cursor:pointer;transition:border-color .2s ease-in-out}.gelaender-item:hover{border:1px solid var(--color-railing_gold-light)}.gelaender-hoehe{width:100%;padding-top:1rem}.gelaender-hoehe h2{font-size:1.5rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.gelaender-hoehe h3{font-size:1.25rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.gelaender-hoehe-select{display:grid;grid-template-areas:"select";align-items:center;width:90%;min-width:15ch;max-width:30ch;border:1px solid var(--color-text);border-radius:.25em;margin:0 auto;margin-top:1rem;padding:.25em .5em;font-size:1.25rem;line-height:1.1;background-color:var(--color-background);cursor:pointer}select,.gelaender-hoehe-select:after{grid-area:select;justify-self:end}.gelaender-hoehe-select:after{content:"";width:.8em;height:.5em;background-color:var(--color-text);clip-path:polygon(100% 0%,0 0%,50% 100%)}select::-ms-expand{display:none}select{appearance:none;background-color:transparent;border:none;padding:0 1em 0 0;margin:0;width:100%;font-family:inherit;font-size:inherit;cursor:inherit;line-height:inherit;outline:none;background-color:var(--color-background);color:var(--color-railing_gray)}.step4container{position:relative;width:100%;height:100%;display:flex;flex-direction:column;gap:1rem;padding-top:2rem}.handlauf{width:100%;height:100%}.handlauf h2{font-size:1.5rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.handlauf h3{font-size:1.25rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.handlauf-item img{width:64px;height:64px}.handlauf-grid{width:100%;display:grid;grid-template-columns:repeat(2,1fr);place-items:center}.handlauf-item{width:80%;display:flex;flex-direction:column;justify-content:center;align-items:center;margin:0 auto;margin-top:2rem;border:1px solid var(--color-railing_gray);border-radius:.5rem;cursor:pointer;transition:border-color .2s ease-in-out}.handlauf-item:hover{border:1px solid var(--color-railing_gold-light)}.step5container{position:relative;width:100%;height:100%;display:flex;flex-direction:column;gap:1rem}.farbe{height:100%;width:100%;margin-top:1rem}.farbe h2{font-size:1.5rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.farbe h3{font-size:1.25rem;font-weight:700;color:var(--color-railing_gray);padding-left:1rem}.farbe-grid{height:100%;width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;padding:1rem}.farbe-item{width:80%;display:flex;flex-direction:column;justify-content:center;align-items:center;margin:0 auto;border:1px solid var(--color-railing_gray);border-radius:.5rem;cursor:pointer;transition:border-color .2s ease-in-out}.farbe-item:hover{border:1px solid var(--color-railing_gold-light)}.farbe-title{padding:.5rem 0}#antrazit{background-color:var(--color-antrazit);color:var(--color-background-light)}#eisenglimmer{background-color:var(--color-eisenglimmer);color:var(--color-railing_gold)}#tiefschwarz{background-color:var(--color-tiefschwarz);color:var(--color-background-light)}#silber{background-color:var(--color-silber);color:var(--color-background-light)}.step6container{position:relative;display:flex;flex-direction:column}.result{position:relative}.result h2{padding:.5rem 0;background-color:var(--color-text);color:var(--color-background);text-align:center}.result h3{font-size:1.25rem;font-weight:700;color:var(--color-railing_gray);margin-bottom:1rem}.result p span{color:var(--color-railing_gray);font-weight:900;font-size:larger}.result p span .notice{font-size:x-small;color:#dc143c;font-style:italic}.result-stueckliste p span{color:var(--color-railing_gray);font-weight:900;font-size:larger}.result-stueckliste h2{padding:.5rem 0;background-color:var(--color-text);color:var(--color-background);text-align:center}.result-stueckliste #staebeHoehe .notice{font-size:x-small;color:#dc143c;font-style:italic}.flaeche1ProfilContainer,.flaeche2ProfilContainer,.flaeche3ProfilContainer,.flaeche1HandlaufContainer,.flaeche2HandlaufContainer,.flaeche3HandlaufContainer{display:flex;justify-content:space-around}.standardProfil,.restProfil,.standardHandlauf,.restHandlauf{display:flex;flex-direction:column;align-items:center}.configIdContainer{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;overflow-y:scroll}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input{font-size:1rem;font-weight:400;color:var(--color-railing_gray);text-align:right;padding-right:.5rem}.iFormImage,.lFormImage{display:none}.active{border:1px solid var(--activeBorder)}.step1submit{position:relative;display:flex;width:100%;justify-content:center;margin-top:1rem}.step2submit,.step3submit,.step4submit,.step5submit,.step6submit{position:relative;display:flex;width:100%;justify-content:space-around;margin-top:2rem}.configIdContainerSubmit{width:100%;display:flex;justify-content:space-evenly}#step1submit,#step2submit,#step3submit,#step4submit,#step5submit,#backToStep1,#backToStep2,#backToStep3,#backToStep4,#backToStep5,#configFieldSubmitID,#backToKonfigurator,#backToStart,#printConfigId,#printTheHermann{width:6rem;height:2rem;cursor:pointer}#step6submit{width:6rem;height:2rem;background-color:var(--color-green);cursor:pointer}.loader-container{position:absolute;left:35em;top:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;width:calc(100% - 40rem);margin:0 auto;transform:translate(-50%,-50%);z-index:9999}#loader{width:40%;height:2rem;margin-top:.5rem}label{color:var(--color-text);font-size:1rem}h1{padding:1rem 0}p{padding:.5rem 0}section,h1,p,span,svg{transition:background-color .5s,color .5s}hr{width:100%;margin:1rem 0}.halfHr{width:75%;margin:.5rem 0}.gui{position:fixed;top:0;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:999}.back-to-top{position:fixed;right:1rem;bottom:1rem;border-radius:100%;background:var(--color-green-light);padding:.5rem;border:none;opacity:100%;cursor:pointer;transition:opacity .5s}.back-to-top:hover{opacity:60%}.back-to-top-icon{width:1rem;height:1rem;color:var(--activeBorder)}.hidden{opacity:0;display:none}#completed{border-radius:50%;border:1px solid var(--color-green-light);background:var(--color-green-light);padding:0 .5rem;margin-right:.25rem}@media screen and (min-width: 70em){body{overflow-x:hidden}.demo-text{position:absolute;display:grid;width:35em;height:100px;place-items:center;margin-left:1rem;top:54%;left:0;font-size:xx-large;background-color:#7777771a;color:#fff;transform:translateY(-52%);transform:skewY(25deg);user-select:none;z-index:9999}.page{position:relative;height:100vh}.page-wrapper{max-width:unset}.page-nav{height:9vh;flex-direction:row}.app-steps{display:flex;height:unset;margin-top:0;margin-bottom:0;margin-left:0}.steps-grid{height:100%;display:grid;place-content:center;grid-template-columns:repeat(5,1fr);margin-left:1rem}.page-content{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr;gap:0px 0px;grid-template-areas:". .";place-content:center}.page-bottom{display:grid;place-content:center;grid-template-columns:repeat(2,1fr);background-color:var(--color-railing_gray);color:var(--color-background)}.page-bottom h3{margin-left:2rem}.page-bottom .configField,label{color:var(--color-background)}.page-bottom .configField input[type=text]{text-align:left;color:var(--color-text-light)}.app{height:75vh;display:flex;flex-direction:column}.app-config{padding:1.5rem;border-left:1px solid lightgray;right:0;height:100%;margin-top:0}.step1container{height:100%}.grundform{height:35%}.grundform h2{font-size:1.5rem;padding-left:1rem}.grundform h3{font-size:1.25rem;padding-left:1rem}.grundform-grid{height:100%}.grundform-item{height:50%;width:50%;margin:0 auto;margin-top:2rem}.kantenlaengen h3{font-size:1.25rem}.kantenlaengen-grid{display:grid;place-items:center;grid-template-columns:repeat(2,1fr)}.kantenlaengen-images img{width:90%;height:90%;object-fit:cover}.kantenlaengen-item-flex{gap:2rem;margin-top:0}.step2container{height:100%}.befestigung .befestigung-title span{display:block}.befestigung-item{width:100%}.befestigung .befestigung-item img{height:111px;width:111px;object-fit:cover;padding:.5rem}.befestigung-info-V1 img,.befestigung-info-V2 img,.befestigung-info-Top img{width:75%}.step3container{align-items:center}.gelaender{height:35%}.gelaender-item{height:100%;width:50%;margin:0 auto;margin-top:2rem}.step4container{align-items:center}.handlauf{height:35%}.handlauf-item{height:100%;width:50%;margin:0 auto;margin-top:2rem}.step5container{align-items:center}.farbe{height:45%}.step6container{height:70vh;overflow-y:scroll}.farbe-title{padding:1rem}}.step-text{position:relative}.step-text:before{content:"";position:absolute;top:0;height:100%;width:40%;border-bottom:4px solid #ffffff33;transform:translateY(-4px)}