#navigation{display:-webkit-box;display:-ms-flexbox;display:flex;height:15vh;padding:0 20px;background-color:#333}#navigation .logoSection{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;width:80%}#navigation .logoSection .logoSection__logo{height:max(4vw,5vh)}#navigation .logoSection .logoSection__logo:hover{-webkit-filter:grayscale(50%);filter:grayscale(50%)}#navigation .logoSection .logoSection__title{width:max(15vw,20vh)}#navigation .logoSection .navBar-main__nameWrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:100%;width:100%;padding:0 20px;font-size:max(12px,2.3vh)}#navigation .logoSection .navBar-main__nameWrapper img{display:block}#navigation .navBar-main{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;width:20%}#navigation .navBar-main .links{display:none}#navigation .navBar-main .hamburgerMenu{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;height:100%;width:max(5vw,5vh);max-width:40px;cursor:pointer}#navigation .navBar-main .hamburgerMenu img{display:block}#navigation .navBar-main .hamburgerMenu .hamburgerMenu__content{position:fixed;top:0;right:0;height:100vh;width:80vw;max-width:250px;background:#333;border-left:1px solid #444;z-index:1000;display:flex;flex-direction:column;align-items:center;padding:2rem 1rem}#navigation .navBar-main .hamburgerMenu .hamburgerMenu__content #menuClose{position:absolute;top:0;right:1em;width:max(3vw,3vh);max-width:70px;margin-top:max(1vw,2vh)}#navigation .navBar-main .hamburgerMenu .hamburgerMenu__content ul{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;width:100%}#navigation .navBar-main .hamburgerMenu .hamburgerMenu__content ul a{color:#f5f5f5;text-decoration:none}#navigation .navBar-main .hamburgerMenu .hamburgerMenu__content ul a li{margin:40px 0;color:#f87717;list-style-type:none;font-size:max(2vw,1.5vh)}#navigation .navBar-main .hamburgerMenu .hideMenu{display:none}@media only screen and (min-width: 1025px){#navigation{width:100%;justify-content:space-between}#navigation .logoSection{width:40%;height:auto}#navigation .navBar-main{width:60%}#navigation .navBar-main .links{display:initial;height:100%;width:100%}#navigation .navBar-main .links ul{display:flex;justify-content:center;height:100%;width:100%}#navigation .navBar-main .links ul a{display:flex;justify-content:center;align-items:center;height:100%;width:100%;text-align:center;font-size:max(24px,2vw);color:#f87717;list-style-type:none;text-decoration:none}#navigation .navBar-main .links ul a:hover{color:#f5f5f5}#navigation .navBar-main .hamburgerMenu{display:none}}.quote{display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto;width:85%;margin:0 auto;padding:20px}.quote img{display:block;width:max(40vw,30vh);max-width:80%;margin-bottom:20px;border:7px solid whitesmoke;filter:grayscale(100%);transition:.8s}.quote img:hover{filter:grayscale(0%);transform:rotate(-5deg)}.quote .quote__text-wrapper{display:flex;flex-direction:column;width:90%}.quote .quote__text-wrapper .quote__text{font-size:max(18px,2.3vh);font-family:Lobster,cursive;letter-spacing:2.5px;text-align:center}.quote .quote__text-wrapper .quote__text span{font-size:max(20px,3vh);color:#f87717;margin:0 5px}.quote .quote__text-wrapper .quote__author{margin-top:10px;font-size:max(12px,1.8vh);text-align:center;color:#f87717}@media only screen and (min-width: 768px) and (max-width: 1024px){.quote .quote__text{font-size:max(34px,4vw)}}@media only screen and (min-width: 1025px){.quote{display:flex;flex-direction:row;align-items:center;margin-top:40px}.quote img{margin-right:20px}.quote .quote__text-wrapper{width:60%}.quote .quote__text-wrapper .quote__text{font-size:max(20px,2vw)}.quote .quote__text-wrapper .quote__author{font-size:max(12px,1vw)}}.hide{visibility:hidden}.remove{display:none!important}.show{display:block;animation:fadeIn .5s ease-in-out}.about-me__title{text-align:center;margin-top:40px;margin-bottom:10px;font-family:Lobster,cursive;color:#f87717}.about-me{display:grid;grid-template-areas:"divider" "image" "info" "technology" "passion";justify-items:center;gap:40px;height:auto}.about-me .about-me__dividerLeft{grid-area:divider;width:40%}.about-me .about-me__image{display:block;grid-area:image;width:60%;max-width:350px;filter:brightness(80%) saturate(0%);transition:all 1s ease-in-out}.about-me .about-me__image:hover{filter:grayscale(0%);transform:rotate(30deg)}.about-me .about-me__passion{display:flex;flex-direction:column;align-items:center;justify-content:center;grid-area:passion;width:100%}.about-me .about-me__passion h2{width:100%;text-align:center;font-family:Lobster,cursive;color:#776f6a;margin-bottom:20px}.about-me .about-me__passion .about-me__passionLogos{display:flex;justify-content:center;width:100%}.about-me .about-me__passion .about-me__passionLogos img{width:max(4vw,3vh);max-width:50px;cursor:pointer}.about-me .about-me__passion .about-me__passionLogos .about-me__js{margin:0 15px}.about-me .about-me__passion .about-me__details{margin:10px auto;width:75%;text-align:center}.about-me .about-me__passion .about-me__details .about-me__titleWrapper{margin-top:1em}.about-me .about-me__passion .about-me__details .about-me__titleWrapper h4{color:#f87717;margin-bottom:10px}.about-me .about-me__passion .about-me__details .about-me__details__content{width:100%}.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__languageWrapper,.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__levelWrapper{display:grid;grid-template-columns:repeat(4,1fr);justify-content:center;align-items:center;gap:20px;max-width:35vw;margin:0 auto}.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__languageWrapper p,.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__levelWrapper p{display:flex;justify-content:center;align-items:center;font-size:max(2vw,2vh)}.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__codingWrapper,.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__photographyWrapper{margin-top:1.5em}.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__codingWrapper h4,.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__photographyWrapper h4{color:#f87717}.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__codingWrapper img,.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__photographyWrapper img{max-width:200px;margin-top:1em;border:2px solid rgb(165,162,162);filter:grayscale(100%);transition:.7s}.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__codingWrapper img:hover,.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__photographyWrapper img:hover{filter:grayscale(0);transform:rotate(10deg)}.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__levelTitle{margin-top:1em}.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__levelTitle h4{color:#f87717;margin-bottom:10px}.about-me .about-me__passion .about-me__details .about-me__details__content .about-me__levelWrapper p{font-size:clamp(.8rem,1.5vw,1.3rem)}.about-me .about-me__dividerRight{display:none}.about-me .about-me__infoText{grid-area:info;width:75%;line-height:24px}.about-me .about-me__infoText1__desktop{display:none}.about-me .about-me__infoText2__desktop{display:none;grid-area:text2;width:90%;font-size:max(18px,1.6vw);line-height:normal}.about-me .about-me__technology{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;grid-area:technology}.about-me .about-me__technology h2{width:100%;text-align:center;font-family:Lobster,cursive;color:#776f6a;margin-bottom:20px}.about-me .about-me__technology li{list-style-image:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M9.30371%206.55957H15.251V9.12305H9.30371V15.8613H6.5791V9.12305H0.631836V6.55957H6.5791V0.333984H9.30371V6.55957Z'%20fill='%23F87717'/%3e%3c/svg%3e");margin-bottom:5px}@media only screen and (min-width: 768px) and (max-width: 1024px){.about-me__title{font-size:max(3vw,4vh)}.about-me__technology h2,.about-me__passion h2{font-size:max(3vw,4vh)}}@media only screen and (min-width: 1025px){.about-me__title{font-size:max(24px,3.2vw)}.about-me{grid-template-areas:"divider divider2" "image text1" "text2 text2" "passion technology";grid-template-columns:1fr 1fr;width:calc(40px + 80vw);margin:0 auto}.about-me .about-me__infoText{display:none;width:90%;font-size:max(18px,1.6vw);line-height:normal}.about-me .about-me__image{width:30vw;max-width:600px}.about-me .about-me__passion{justify-content:flex-start}.about-me .about-me__passion h2{font-size:max(24px,3.2vw)}.about-me .about-me__passion .about-me__passionLogos .about-me__js{margin:0 8%}.about-me .about-me__dividerLeft{width:40vw}.about-me .about-me__dividerRight{display:initial;grid-area:divider2;width:40vw}.about-me .about-me__infoText1__desktop{display:block;grid-area:text1;width:90%;font-size:max(18px,1.6vw);line-height:normal}.about-me .about-me__infoText2__desktop{display:block;grid-area:text2;width:100%;font-size:max(18px,1.6vw);line-height:normal}.about-me .about-me__technology{justify-content:flex-start}.about-me .about-me__technology h2{font-size:max(24px,3.2vw)}.about-me .about-me__technology li{font-size:max(18px,1.8vw)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.my-work__title{text-align:center;margin-top:40px;margin-bottom:10px;font-family:Lobster,cursive;color:#f87717}.my-work{display:grid;grid-template-areas:"divider" "demo1" "demo2" "demo3" "demo4";justify-items:center;height:auto}.my-work img:not(.my-work__dividerLeft):not(.my-work__dividerRight){width:100%;aspect-ratio:1;object-fit:cover;border:7px solid whitesmoke}.my-work a:not(.my-work__dividerLeft):not(.my-work__dividerRight){width:80%;max-width:500px;margin-bottom:20px}.my-work .my-work__dividerLeft{grid-area:divider;width:40%;margin-bottom:40px}.my-work .my-work__demo1,.my-work .my-work__demo2,.my-work .my-work__demo3,.my-work .my-work__demo4{filter:grayscale(100%);transition:all 1s ease-in-out}.my-work .my-work__demo1:hover,.my-work .my-work__demo2:hover,.my-work .my-work__demo3:hover,.my-work .my-work__demo4:hover{transform:scale(1.05);filter:grayscale(0%)}.my-work .my-work__demo1{grid-area:demo1}.my-work .my-work__demo2{grid-area:demo2}.my-work .my-work__demo3{grid-area:demo3}.my-work .my-work__demo4{grid-area:demo4}.my-work .my-work__dividerRight{display:none}@media only screen and (min-width: 768px) and (max-width: 1024px){.my-work__title{font-size:max(3vw,4vh)}}@media only screen and (min-width: 1025px){.my-work__title{font-size:max(24px,3.2vw)}.my-work{grid-template-areas:"divider divider2" "demo1 demo2" "demo3 demo4";grid-template-columns:1fr 1fr;width:calc(80px + 80vw);margin:0 auto}.my-work img:not(.my-work__dividerLeft):not(.my-work__dividerRight){width:100%;max-width:none}.my-work a:not(.my-work__dividerLeft):not(.my-work__dividerRight){width:90%;max-width:none}.my-work .my-work__dividerLeft{width:40vw}.my-work .my-work__dividerRight{display:initial;grid-area:divider2;width:40vw}}.contact__title{text-align:center;margin-top:40px;margin-bottom:10px;font-family:Lobster,cursive;color:#f87717}.contact{display:grid;grid-template-areas:"divider" "text" "contact" "follow";justify-items:center;gap:40px;height:auto}.contact .contact__dividerLeft{grid-area:divider;width:40%}.contact .contact__text{grid-area:text;width:90%;text-align:center;line-height:26px}.contact .contact__contact-me{display:flex;flex-direction:column;grid-area:contact;width:100%;text-align:center}.contact .contact__contact-me h2{margin-bottom:20px;font-family:Lobster,cursive;color:#776f6a}.contact .contact__contact-me .contact__name{color:#f87717;margin-bottom:5px}.contact .contact__follow-me{grid-area:follow;width:100%;text-align:center}.contact .contact__follow-me h2{margin-bottom:20px;font-family:Lobster,cursive;color:#776f6a}.contact .contact__follow-me a{text-decoration:none;color:#f5f5f5}.contact .contact__follow-me a:hover{color:#776f6a}.contact .contact__follow-me li{margin-bottom:5px;list-style-type:none}.contact .contact__follow-me li:before{content:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M9.30371%206.55957H15.251V9.12305H9.30371V15.8613H6.5791V9.12305H0.631836V6.55957H6.5791V0.333984H9.30371V6.55957Z'%20fill='%23F87717'/%3e%3c/svg%3e");display:inline-block;margin-right:5px}.contact .contact__follow-me li:hover:before{transform:rotate(540deg);transition:1.2s}.contact .contact__dividerRight{display:none}@media only screen and (min-width: 768px) and (max-width: 1024px){.contact__title{font-size:max(3vw,4vh)}.contact .contact__contact-me h2,.contact .contact__follow-me h2{font-size:max(3vw,4vh)}}@media only screen and (min-width: 1025px){.contact__title{font-size:max(24px,3.2vw)}.contact{grid-template-areas:"divider divider2" "text contact" "text follow";grid-template-columns:1fr 1fr;width:calc(40px + 80vw);margin:0 auto}.contact .contact__dividerLeft{width:40vw}.contact .contact__dividerRight{display:initial;grid-area:divider2;width:40vw}.contact .contact__text{width:100%;font-size:max(20px,1.8vw);text-align:justify;line-height:initial}.contact .contact__contact-me h2{font-size:max(24px,3.2vw)}.contact .contact__contact-me span{font-size:max(14px,1.2vw)}.contact .contact__follow-me h2{font-size:max(24px,3.2vw)}.contact .contact__follow-me li{font-size:max(14px,1.2vw)}}footer{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;margin-top:40px;padding:.5em 0;background-color:#333}footer .footer__wrapper{display:flex;flex-direction:column;align-items:center;width:35vw;min-width:100px}@media screen and (max-width: 700px){footer .footer__wrapper{width:80vw}}footer .footer__wrapper .footer__title{max-width:150px}footer .footer__wrapper .logo__wrapper{display:flex;justify-content:center}footer .footer__wrapper .logo__wrapper .footer__logo{position:relative;display:flex;justify-content:center;width:50%;margin-top:10px;z-index:10}footer .footer__wrapper .logo__wrapper .footer__logo .footer__logo-top{max-width:100%}footer .footer__wrapper .logo__wrapper .footer__logo .back,footer .footer__wrapper .logo__wrapper .footer__logo .top{position:absolute;top:27%;transform:scale(0)}footer .footer__wrapper .legalWrapper{margin-top:.5em}footer .footer__wrapper .legalWrapper .footer__imprint{color:#fff;text-decoration:none}footer .footer__wrapper .legalWrapper .footer__imprint:hover{color:#f87717}@media only screen and (min-device-width: 1025px){footer .footer__wrapper .footer__title{width:15vw;max-width:200px;min-width:130px}footer .footer__wrapper .footer__logo{width:30%}}.imprintWrapper{display:flex;flex-direction:column;justify-content:center;padding:2em 7em}@media screen and (max-width: 700px){.imprintWrapper{padding:2em}}.imprintWrapper h2{color:#f87717}.imprintWrapper p{margin:1em 0}.imprintWrapper h3{margin:1em 0;color:#777;text-align:left}.imprintWrapper a{color:#fff;text-underline-offset:5px}.imprintWrapper .backWrapper{display:flex;justify-content:center;padding:1em 0}.imprintWrapper .backWrapper a{font-size:1.5rem;text-decoration:none}.imprintWrapper .backWrapper a:hover{color:#f87717}.sample{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:1em}.sample .home{position:absolute;top:20px;color:#f5f5f5;font-size:max(2vw,3vh);text-decoration:none;cursor:pointer}@media screen and (max-width: 1200px){.sample .home{position:initial}}.sample .home:hover{color:#f87717}.sample .mainWrapper{display:flex;justify-content:space-between;align-items:center;gap:2em}@media screen and (max-width: 1200px){.sample .mainWrapper{flex-direction:column}}.sample .mainWrapper p,.sample .mainWrapper span{margin-bottom:1em;font-size:1.2rem}.sample .mainWrapper .title{color:#f87717}.sample .mainWrapper .mainWrapper__description{width:30%;padding:0 1em;text-align:center}@media screen and (max-width: 1200px){.sample .mainWrapper .mainWrapper__description{padding-top:1.5em;width:90%}}.sample .mainWrapper .imageWrapper{position:relative;display:flex;width:40%;min-width:350px;aspect-ratio:1}.sample .mainWrapper .imageWrapper .innerWrapper1,.sample .mainWrapper .imageWrapper .innerWrapper2{width:50%}.sample .mainWrapper .imageWrapper img{width:100%;height:50%;object-fit:cover}.sample .mainWrapper .imageWrapper .innerWrapper1{position:relative;display:flex;justify-content:flex-end;transform:translate(10%,10%);z-index:5}.sample .mainWrapper .imageWrapper .innerWrapper1 .sample__pic1{border:5px solid whitesmoke}.sample .mainWrapper .imageWrapper .innerWrapper2{position:relative;display:flex;align-items:center;transform:translate(-10%,10%)}.sample .mainWrapper .imageWrapper .innerWrapper2:hover{z-index:10}.sample .mainWrapper .imageWrapper .innerWrapper2 .sample__pic2{border:5px solid whitesmoke}.sample .mainWrapper .mainWrapper__stack{width:30%;padding:0 1em;text-align:center}@media screen and (max-width: 1200px){.sample .mainWrapper .mainWrapper__stack{width:90%}}.sample .live{position:absolute;bottom:20px;color:#f5f5f5;font-size:clamp(1rem,2vw,2rem);font-style:italic;text-underline-offset:7px;cursor:pointer}@media screen and (max-width: 1200px){.sample .live{position:initial;margin-top:1.5em;text-align:center}}.sample .live:hover{color:#f87717}.privacyWrapper{display:flex;flex-direction:column;justify-content:center;padding:2em 7em}@media screen and (max-width: 700px){.privacyWrapper{padding:2em}}.privacyWrapper h2{color:#f87717}.privacyWrapper p{margin:1em 0}.privacyWrapper h3{margin:1em 0;color:#777;text-align:left}.privacyWrapper a{color:#fff;text-underline-offset:5px}.privacyWrapper .backWrapper{display:flex;justify-content:center;padding:1em 0}.privacyWrapper .backWrapper a{font-size:1.5rem;text-decoration:none}.privacyWrapper .backWrapper a:hover{color:#f87717}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}*,*:before,*:after{box-sizing:border-box;-webkit-box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background-color:#222;font-family:Roboto,sans-serif;color:#f5f5f5}h1,h2,h3,h4,h5{text-align:center}
