#root{margin:0 auto;text-align:center;display:flex;flex-direction:column;gap:10px}.first-page,.work-page-container{background-color:transparent;display:flex;flex-direction:column;justify-content:space-evenly;min-height:100vh;width:100%}.first-page>*{background-color:transparent}.project-page-container{position:relative}.footer,.footerr{display:flex;justify-content:center;align-items:center;padding:15px}.down-arrow{animation:color-transition 2s ease infinite;overflow:hidden}@keyframes color-transition{0%{transform:translate(0)}10%{transform:translateY(10px);color:#d36918}20%{transform:translateY(0);color:#d36918}40%{transform:translateY(10px);color:#d36918;color:#b00641}}*{transition:all .25s ease-out}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.header-container{position:fixed;top:0;left:0;right:0;pointer-events:none;z-index:100}.header{position:relative;top:16px;pointer-events:all;display:flex;justify-content:flex-end;align-items:center;padding:8px;width:95%;max-width:1200px;border-radius:1000px;backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);animation:header-scroll linear both;animation-timeline:scroll();animation-range-start:0px;animation-range-end:100px;z-index:1;margin:0 auto}@keyframes header-scroll{to{background:var(--header-bg-dark);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);width:60%;max-width:1000px}}.header>*{transition:transform .2s ease-in-out}.light-mode{--color-main: rgb(11, 10, 10);--color-background: rgba(255, 255, 255, .87);--color-accent: teal;--color-text: dimgray;--color-skill-background: rgb(100, 200, 200);--color-skill-foreground: darkslategray;--header-bg-dark: rgba(0, 0, 0, .1);--header-bg-light: rgba(255, 255, 255, .1)}.dark-mode{width:25px;height:25px}.logo-link{position:absolute;left:18px;display:flex;align-items:center}.mylogo{width:30px;height:30px;transition:transform .2s ease-in-out}.mylogo:hover{transform:scale(1.1)}svg:hover{transform:scale(1.1)}.socials-dropdown{position:relative;display:inline-block}ul{visibility:hidden;opacity:0;overflow:hidden;position:absolute;text-align:center;top:30px;right:28px;z-index:5;transition:all .4s}li{list-style:none;text-decoration:none;align-self:center;fill:red}.socials-dropdown:hover>ul{visibility:visible;opacity:1;height:inherit}.socials-button{border:none;color:var(--color-text)}img:active{transform:scale(.95);transition-duration:.2s}.socials-dropdown path,.dark-mode path{fill:var(--color-text)}.about-me{display:flex;flex-wrap:wrap;gap:40px;margin:20px;padding:1rem;justify-content:center;align-items:center}h1{background-image:var(--gradient-strong-red);background-position:-100%;background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;transition:all .3s ease-in-out}h1:hover{background-position:0}h1:active{transform:scale(.97)}.me{text-align:left;max-width:600px;display:flex;flex-direction:column;justify-content:center}.my-photo{max-width:15%;min-width:150px;border-radius:50%;box-shadow:0 0 0 5px var(--color-strong-red);transition:all 4 ease-in-out}.my-photo:hover{box-shadow:-15px -15px 10px #b42902,15px 15px 10px #b00641,15px -15px 10px #b00619,-15px 15px 10px #b00619;transform:scale(.98)}.projects{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:30px;padding:10px}.project{display:flex;flex-direction:column;flex-basis:20%;gap:20px;min-height:50vh}.project-pic{height:130px;width:250px;border-radius:10px}.project-title{margin-left:50%;margin-right:50%;margin-top:10vh}img{height:100%;display:block;text-align:center;max-width:100%;max-height:100%;object-fit:scale-down}.project-pic:hover{transform:scale(1.05)}.project-pic img{margin:auto}.project-card{display:flex;flex-direction:column;justify-content:start;align-items:start;flex-basis:200px;min-width:none}.project-card h3{padding:0;margin:5px 0}.project-description{font-size:.9rem;text-align:left}.project-skills{display:flex;flex-wrap:wrap;gap:10px;word-spacing:12px;height:25px;margin-top:0}.skill{display:flex;justify-content:center;align-items:center;gap:2px;font-size:.8rem;font-weight:800;text-align:left;background-color:var(--color-skill-background);color:var(--color-skill-foreground);border-radius:7px;padding:2px 4px}svg{min-width:12px;height:100%;width:inherit}.skill path{fill:var(--color-skill-foreground)}@media screen and (max-width: 750px){h2{font-size:1.1em}.project{flex-wrap:wrap}.project-description,.project-skills,.skill{font-size:.9em}svg{min-width:18px}.project-pic{margin-top:10vw;height:300px;width:300px}}img{border-radius:20px}@media (prefers-reduced-motion: no-preference){.projects{scale:.9;filter:blur(5px);animation:blur ease-in-out forwards;animation-timeline:view();animation-range-start:20vw;animation-range-end:50vw}@keyframes blur{to{scale:1;filter:none}}}.work-page-container{display:flex;flex-direction:column;justify-content:center;align-items:center}.experience{display:flex;flex-direction:column;justify-content:center;align-items:start;gap:30px;margin:20px;padding:16px}.work-title{align-self:center}.work{display:flex;justify-content:center;align-items:center;gap:20px}.work-details{display:flex;flex-direction:column;text-align:left;gap:5px}.work-details>*{margin:0}.logo{height:60px;border-radius:6px;fill:var(--color-accent);align-self:self-start}#rec-letter-btn{background:linear-gradient(var(--color-background),var(--color-background)) padding-box,var(--gradient-strong-red) border-box;border-radius:12px;border:3px solid transparent;align-self:self-start;filter:contrast(80%)}#rec-letter-btn:hover{filter:contrast(100%)}.rec-letter-link{text-decoration:none}:root{--color-main: rgba(255, 255, 255, .87);--color-background: rgb(11, 10, 10);--color-accent: mediumaquamarine;--color-strong-red: rgb(176, 6, 65);--color-text: darkgray;--color-skill-background: darkslategray;--color-skill-foreground: var(--color-accent);--gradient-strong-red: linear-gradient(to right, rgb(249, 129, 1), rgb(176, 6, 65));--header-bg-dark: rgba(255, 255, 255, .1);--header-bg-light: rgba(0, 0, 0, .1);font-family:Plus Jakarta Sans,-apple-system,Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box}body,button{color:var(--color-main);background-color:var(--color-background);margin:0;transition:all 3s ease-in-out}p{font-size:1rem;font-weight:500}p,h3,.footerr{color:var(--color-text)}h1,p{animation:1.5s ease-out 0s 1 fade-in}h3{color:var(--color-main)}h1{font-size:3vw;font-size:clamp(2em,3vw,4vw);line-height:1.4;width:fit-content}h2{font-size:clamp(1em,1.3em,4vw)}a{background-image:var(--gradient-strong-red);background-position:-100%;background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-decoration-color:var(--color-strong-red)}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1rem;font-weight:500;font-family:inherit;background-color:transparent;cursor:pointer;transition:border-color .25s}button:hover{border-color:#1dc19d}@keyframes fade-in{0%{color:#000}to{color:var(--color-text)}}