@font-face{font-family:Diodrum;src:url(/assets/Fonts/Diodrum-Semibold.ttf)}:root{--primary_color:#222831;--secondary_color:#393e46;--tertiary_color:#00adb5;--quaternary_color:#eee;--accent:#7a7af9}body{background-color:var(--primary_color);color:var(--quaternary_color);background-image:url(/assets/Images/background.webp);background-position:50% 0;background-repeat:no-repeat;background-size:cover;height:max-content;margin:0;padding:0;font-family:Diodrum,Roboto,sans-serif}.no-scroll{overflow:hidden}body>*{-webkit-mask-image:none;mask-image:none}#root{position:relative}@media screen and (width<=768px){body{background-size:auto}}*{box-sizing:border-box;margin:0;padding:0;position:relative}.app{flex-flow:column;justify-content:flex-start;width:100vw;height:max-content;display:flex;position:absolute;overflow-y:scroll}.app>*{overflow:hidden}.app-header{flex-flow:column;justify-content:flex-start;align-items:center;width:100vw;height:100vh;display:flex}#header-profession{margin-right:1.5vw}.headertext-container{background:linear-gradient(20deg, var(--accent) 30%, #fff 50%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;flex-flow:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex}.big-header{font-size:10rem}.regular-header{width:max-content;height:7rem;font-size:5rem}.small-header{font-size:2.5rem}.micro-header{font-size:1.5rem}.regular-text{font-size:auto}.app main{flex-flow:column;flex:1;justify-content:flex-start;align-items:center;width:100vw;display:flex}.about-me-container{flex-flow:column;justify-content:flex-start;align-items:center;width:100vw;height:140vh;display:flex}.about-me-header{margin:10vh 0}.about-me-text-container{flex-flow:row;justify-content:space-around;align-items:center;width:100vw;margin-bottom:20vh;display:flex}.about-left{flex-flow:row;justify-content:start;align-items:center;width:30vw;height:25vh;display:flex}.about-left:after{content:"";background-color:#f0f8ff;width:.8vw;height:17vh;position:absolute;transform:translate(35vw)}.about-me-text-header{text-transform:capitalize;justify-self:center}.about-me-image{aspect-ratio:1;height:25vh}.about-me-text{width:40vw}#projects-wrapper{flex-flow:column;justify-content:flex-start;align-items:center;width:100vw;height:max-content;min-height:101vh;margin-top:5vh;display:flex}#projects-header{margin-top:10vh}.projects-container{flex-flow:wrap;justify-content:flex-start;align-items:flex-start;width:100vw;padding:3.125vw;display:flex}.projects-container:has(.project-container.active){padding:0}.row-center{flex-flow:row;justify-content:center;align-items:center;display:flex}#contact-wrapper{height:101vh;margin-top:5vh}.contact-container{flex-flow:column;justify-content:center;align-items:center;display:flex}#contact-image{aspect-ratio:1;width:30vw}.contact-form-wrapper{flex-flow:row;justify-content:space-evenly;align-items:center;width:100vw;display:flex}#contact-form{flex-flow:column;justify-content:center;align-items:center;display:flex}#contact-form>*{margin:1vh 0}.form-input{all:unset;outline:3px solid var(--secondary_color);border-radius:8px;width:35vw;height:5vh;padding-left:1.5vw}.form-textfield{background-color:unset;border:unset;font:unset;color:unset;outline:3px solid var(--secondary_color);border-radius:8px;width:36.5vw;height:25vh;padding:1vh 1vw 1vh 1.5vw}.contact-submit-button{all:unset;outline:3px solid var(--secondary_color);border-radius:8px;width:35vw;height:5vh;padding-left:1.5vw;transition:box-shadow .5s}.contact-submit-button:hover{box-shadow:0 10px 20px var(--accent)}@media screen and (width<=768px){.big-header{max-width:80vw;font-size:12vw}.regular-header{max-width:70vw;font-size:6vw}.about-me-container{height:200vh}.about-me-text-container{flex-direction:column;margin-bottom:17.5vh}.about-me-text-header{flex-direction:row;justify-content:center;align-items:center;display:flex}.about-me-image{height:20vh}.about-left{justify-content:center;width:100vw;padding-bottom:5vh}.about-left:after{content:"";background-color:#f0f8ff;width:65vw;height:.8vh;position:absolute;transform:translateY(12vh)}.about-me-text{width:90vw;margin-right:0}}.project-container{border-radius:1.25rem;width:25vw;height:25vh;margin:3.125vw;overflow:hidden}.project-container:hover{box-shadow:0 0 20px var(--accent);transition:all .5s;transform:scale(1.15)}.project-container:not(:hover){transition:all .5s}.project-container.active{border-radius:0;width:100vw;height:100vh;margin:0;transition:all 1.5s;transform:scale(1)}.project-container.active:hover{z-index:3}.project-container.active .project-iframe{transition:all 1.5s;transform:scale(1)}.project-container:hover .project-card{color:snow;background-color:#0009}.project-card h3{transition:color .3s}.project-container:hover .project-card h3{color:#7a7af9}.project-iframe{transform-origin:0 0;border:none;border-radius:0;width:100vw;height:100vh;transform:scale(.25)}.project-card{color:#fffafa00;flex-flow:column;justify-content:flex-end;align-items:flex-start;width:100%;height:100%;padding:3%;transition:color .3s;display:flex;position:absolute;top:0}.project-description{font-size:.9rem}.snap-position-container{flex-flow:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:none;position:fixed}.snap-position-container.shown{display:block}.navbar-snappoint{color:snow;background-color:#fffafa1a;border-radius:2147483647px;outline:3px solid #fffafa80;width:300px;height:8vh;padding:auto;transition:transform,height,width .3s;position:absolute;top:0;left:0;transform:translate(0)}.navbar-container{background-color:#000000b3;border-radius:2147483647px;flex-flow:row;justify-content:center;align-items:center;width:max-content;height:8vh;padding:.3rem 3rem .3rem 1rem;transition:all .3s;display:flex;position:fixed}.navbar-container.vertical{flex-direction:column;width:8vh;height:max-content;padding:1rem .3rem 3rem}.navbar-container:has(:hover){transition:all .1s}.navbar-item{aspect-ratio:1;height:calc(8vh - .6rem);color:var(--quaternary_color);background:0 0;border:none;border-radius:50%;flex-flow:column;justify-content:center;align-items:center;transition:all .3s;display:flex}.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover){background-color:#663399b3;justify-content:space-around;height:calc(10vh - .6rem);transition:all .3s}.navbar-container:not(.vertical)>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover):before,.navbar-container.bottom>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover):before,.navbar-container.vertical>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover):before,.navbar-container.vertical.left>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover):before{content:"";mix-blend-mode:screen;background-color:#000000b3;border-radius:50%;width:10vh;height:10vh;position:absolute}.navbar-container:not(.vertical)>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover):before{clip-path:inset(0 0 calc(8vh - 1px));animation:.3s showNavbarStretchUp}.navbar-container:not(.vertical).bottom>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover):before{clip-path:inset(8vh 0 0);animation:.3s showNavbarStretchDown}.navbar-container.vertical>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover):before{clip-path:inset(0 0 0 8vh);animation:.3s showNavbarStretchRight}.navbar-container.vertical.left>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover):before{clip-path:inset(0 calc(8vh - 1px) 0 0);animation:.3s showNavbarStretchLeft}.navbar-container:not(.vertical)>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover){transform:translateY(-1vh)}.navbar-container.bottom>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover){transform:translateY(1vh)}.navbar-container.vertical>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover){transform:translate(1vh)}.navbar-container.vertical.left>.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover){transform:translate(-1vh)}@keyframes showNavbarStretchDown{0%{clip-path:inset(8vh 0 2vh);transform:translateY(calc(1vh - 1px))}to{transform:translateY(-1px)}}@keyframes showNavbarStretchUp{0%{clip-path:inset(2vh 0 8vh);transform:translateY(-1vh)}to{transform:translateY(1px)}}@keyframes showNavbarStretchRight{0%{clip-path:inset(0 2vh 0 8vh);transform:translate(-1vh)}to{transform:translate(1px)}}@keyframes showNavbarStretchLeft{0%{clip-path:inset(0 8vh 0 2vh);transform:translate(1vh)}to{transform:translate(-1px)}}.navbar-item .icon{aspect-ratio:1;width:4vh;height:4vh}.navbar-item.smaller .icon{width:3.5vh!important;height:3.5vh!important}.purple-hover:not(.rebecca)~.navbar-item:hover:not(.nohover) .icon{animation:1s ease-in-out .3s iconAnimation}.navbar-item span{color:var(--quaternary_color);opacity:0;place-self:center;font-size:1rem;font-weight:600;position:absolute}.purple-hover:not(.rebecca)~.navbar-item:hover span{opacity:1;transition:all .5s;position:relative;transform:translateY(-1.5vh)}.purple-hover:hover{color:#663399b3;transition:all .5s}.rebecca{color:#663399b3}@media screen and (width<=768px){.navbar-container{width:100vw}}@keyframes iconAnimation{0%{transform:rotate(0)}25%{transform:rotate(-15deg)}75%{transform:rotate(15deg)}to{transform:rotate(0)}}