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