:root{--primary-color: white;--secondary-color: black;--title-color:var(--primary-color);font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}*{box-sizing:border-box}#root{width:100vw;height:100vh}.flex-center{display:flex;align-items:center;justify-content:center}.main-background{width:100%;height:100vh;height:100dvh;background-color:gray;background-image:url(../assets/wallpaper-1.png);background-repeat:no-repeat;background-position:center;top:0;left:0;background-size:cover;color:#000;position:absolute}.desktop{height:97.8vh;margin-top:2.2vh;--background-color: green;width:100vw;position:relative;overflow:hidden}.win-container{position:absolute;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;border:1px solid rgba(255,255,255,.15)}.blur-bg{backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);background:#0006;border-radius:8px;box-shadow:0 4px 8px #0006,0 6px 20px #0000004d}.content{margin-top:30px;position:absolute;height:calc(100% - 30px);width:100%;top:0;display:flex;color:var(--primary-color);flex-direction:column;justify-content:center;align-items:center}.experience{width:clamp(350px,70%,80%);height:85%}.about-container .title-con h4{text-align:center}.resume{width:clamp(350px,70%,80%);height:70%;position:absolute}.drag-div{width:77%;height:33px;position:absolute;z-index:1001}.loading-screen{position:fixed;top:0;left:0;width:100%;height:100vh;background-color:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:9999;transition:opacity 1s ease}.loading-screen.hidden{opacity:0;pointer-events:none}.sticks{width:10vw;height:9vh;position:relative;display:flex;justify-content:center;align-items:center;gap:5px}.stick-one,.stick-two,.stick-three{width:1vw;background-color:#2f8173;border-radius:50px}.stick-one{height:60%;animation:grow 1s reverse infinite}.stick-two{height:75%;animation:grow-2 1s infinite}.stick-three{height:80%;animation:grow-3 1s reverse infinite}@keyframes grow{50%{height:85%}to{height:60%}}@keyframes grow-2{50%{height:90%}to{height:75%}}@keyframes grow-3{50%{height:100%}to{height:80%}}.main-header{height:2.2vh;width:100vw;position:absolute;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.header-left,.header-center,.header-right{position:relative;height:100%;width:33.33%;align-items:center;padding:5px;display:flex}.header-left{flex-direction:row}.header-right{flex-direction:row-reverse}.header-center{justify-content:center}.header-left .name,.header-left .location,.time-display{border-radius:15px;height:1.9vh;background:#00000080;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);margin-left:10px;padding:2px 15px;font-size:13px;color:var(--primary-color);font-weight:700;display:flex;align-items:center}.time-display{white-space:pre}.header-left .short{display:none}@media (max-width: 900px){.header-left .location,.header-left .name,.header-center *{font-size:12px;padding:2px 7px}.header-left .short{display:flex}.header-left .full{display:none}}.about-me{width:100%;height:100%;position:relative}.profile{width:clamp(150px,20vw,50%);display:relative}.about-me .profile-picture{width:clamp(150px,20vw,100%);display:block}.about-container .content{width:100%;height:100%}.content .about-name{font-size:30px;font-weight:700;position:relative}.job-title{font-size:17px}.education{filter:brightness(60%)}.links-containers{width:100%;display:flex;justify-content:center;align-items:center}.icon-containers{width:min-content;height:min-content}.icons{width:25px;height:25px;filter:brightness(50%);transition:filter .3 ease;margin:10px}.icons:hover{filter:grayscale(100%);cursor:pointer}.main-windows{height:min-content;width:100%;height:max-content;position:relative;border-radius:8px 8px 0 0}.title{width:100%;border-top-left-radius:8px;border-top-right-radius:8px;position:relative;background:#0009;color:#fff;display:flex;font-size:15px;align-items:center;justify-content:center;height:33px;z-index:1000}.window-container,.title-con,.menu{width:33.33%;display:flex}.title-con{top:0;align-items:center;justify-content:center}.main-windows .title-con h4{width:300px;height:2vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;font-size:1.3vh}.window-container{flex-direction:row;align-items:center;justify-content:flex-end;padding-right:10px}.blur-bg{backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}.resize-btn{width:1rem;height:1rem;position:absolute;bottom:-5px;right:-5px;z-index:1000;cursor:nwse-resize}.window-btn{margin-left:15px;cursor:pointer;filter:brightness(30%);display:flex;height:max-content}.window-btn:hover{filter:brightness(100%)}.window-btn img{filter:invert(100%);width:clamp(12px,.6vw,19px)}@media (max-width: 600px){.resize-btn{width:30px;height:30px}}.cert-container{width:100%;height:100%;position:relative}.cert-container .imgs{margin:5px 5px 0}.cert-container .content{display:flex;flex-direction:row;flex:1}.lbl{text-align:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.image-container{width:100%;height:100%;overflow:auto}.image-container-wrap{display:flex;flex-direction:row;flex-wrap:wrap;gap:5px}.img-label{width:clamp(100px,6vw,7vw);height:15vh;padding:0;margin:0}.img-label .imgs{width:clamp(auto,4.5vw,4.5vw);height:8vh;margin:1em auto;display:block}.image-container a,.image-container a:visited,.image-container a:link{text-decoration:none;color:--var(primary-color)}.nav-pane{height:100%;width:180px;--position: absolute;left:0;--border-right: .2px solid grey;padding-top:5px;background:#0009;--box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .4), 0 6px 20px 0 rgba(0, 0, 0, .3)}.nav-pane-btn{--background-color: red;--border:1px solid white;padding-left:20px;padding-top:8px;padding-bottom:8px;cursor:pointer;font-size:1em}.nav-pane-btn:hover{background-color:#ffffff4d}.exp{width:100%;height:100%;position:relative;container-type:inline-size}.exp .content{height:100%}.exp .title{background-color:#0000}.menu-btn-exp{padding:0 5px;width:max-content;height:95%;font-size:1.6vh}.exp-menu-title{display:flex;width:100%;justify-content:center;gap:4px}.hamburger-exp{display:none}@container (max-width: 800px){.hamburger-exp{display:inline;display:flex;align-items:center}.exp-menu-title{display:none}.exp-menu-title.open{display:flex;flex-direction:column;align-items:center;position:absolute;top:35px;width:33%;padding:5px;background-color:#000c}.hamburger-exp img{width:20px;margin-left:10px;filter:invert(100%)}.menu-btn-exp{margin:3px 0;width:max-content}}.title-link{display:flex;align-items:end}.title-link a{position:relative;z-index:1;filter:brightness(70%)}.title-link a:hover{filter:brightness(100%)}.title-link img{min-width:25px;width:1.5vw;margin-left:clamp(10px,1vw,1vw);margin-bottom:1.8vh}.select-items-proj{list-style-type:none;display:flex;justify-content:space-around;height:100%;margin:0;padding:0;bottom:0;overflow-x:auto;overflow-y:hidden}.select-items-proj li{margin:15px 8px;width:180px;height:100%;font-size:20px}.select-items-proj h3{text-align:center;width:100%;bottom:0;margin:0;height:30px}.select-items-proj img{width:100%;height:80%;object-fit:cover;border-radius:20px}.items h3{font-size:clamp(15px,1vw,1vw);font-weight:400}.select-items-proj li:hover{cursor:pointer;filter:brightness(100%)}.menu-btn-exp:hover{cursor:pointer}.active{border-bottom:1px solid red}.active-item{filter:brightness(1.5)}.not-active-item{filter:brightness(.5);transition:.5s}.exp .selector{position:absolute;bottom:4vh;width:100%;height:35%;margin:0;display:flex;justify-content:center}.active-items{width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:center}.active-items h1{font-size:6.5vh;margin:0 0 0 4%;z-index:1;position:relative}.active-proj-text{width:100%;height:max-content;position:absolute;bottom:40%}.active-proj-text .proj-desc{font-size:2vh;width:50%;position:relative;z-index:1;margin:0 0 0 4%;filter:brightness(70%)}.active-items:after{content:"";width:100%;height:100%;position:absolute;left:0;bottom:0;z-index:0;background-image:linear-gradient(to top,#000 15%,transparent)}.exp-con-menu{width:100%;--height: 60%;--height: max-content;display:flex;align-items:center;justify-content:center;margin-top:4vh;height:70vh}.right-box{width:90%;padding:0 0 2%;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,80px);gap:1rem 0px;position:relative;overflow-y:hidden}.exp-con-menu .item{position:relative;padding:0}.move-to-right{width:400px;margin-top:-40px;height:150px;position:relative;filter:brightness(60%);transition:filter .3 ease}.move-to-right:hover{filter:brightness(100%)}.horizontal-line{width:clamp(40px,5vw,5vw);border-top:solid 3px white;position:absolute;top:20px}.horizontal-line-left{right:0}.horizontal-line-right{left:0}.vertical-line-center{height:100%;margin-top:2%;width:2px;position:absolute;background-color:red;left:calc(50% - 3px)}.circle{width:30px;height:30px;background-color:#000;border:3px white solid;border-radius:50%;position:absolute}.circle-right{top:8px;left:-17px}.circle-left{top:8px;right:-12px}.item-right-first{grid-column:1 / 2;grid-row:1;display:flex;flex-direction:row-reverse;filter:brightness(60%)}.item-right:nth-of-type(2){grid-column:2;grid-row:2}.item-right:nth-of-type(3){grid-column:2;grid-row:3}.item-right:nth-of-type(4){grid-column:2;grid-row:4}.item-content{width:300px;height:max-content}.item-right-content{margin-left:clamp(48px,5.5vw,6vw)}.item-left-content{margin-right:clamp(48px,5.5vw,6vw);text-align:end}.job-title,.company,.year{margin:0}.company{font-size:clamp(5px,2.5vh,2rem)}.job-title{filter:brightness(80%);font-size:15px}.year{filter:brightness(50%)}.proj-desc{font-size:25px;width:50%;position:relative;z-index:1;margin-left:4%}.feat-container{margin-top:45px;width:100%;height:calc(100% - 45px);position:relative;overflow:auto;scrollbar-width:thin}.flex-shrink-0{margin:0 10px;flex-shrink:0}.box{box-shadow:-1px 6px 23px 4px #000000e0;-webkit-box-shadow:-1px 6px 23px 4px rgba(0,0,0,.88);-moz-box-shadow:-1px 6px 23px 4px rgba(0,0,0,.88);width:800px;height:800px;max-width:50%;max-height:50%;aspect-ratio:1 / 1;background-color:#000;border-radius:12px;margin-left:50px}.recent-feat{width:35%;height:100%;border:1px solid rgba(255,255,255,.2);background-color:#1a1a1a;scroll-snap-align:center;border-radius:15px;margin:0 20px;position:relative;overflow:hidden}.recent-feat .feat-desc{background-color:#0006;width:100%;max-height:100%;position:absolute;bottom:0;margin:0;padding:0}.recent-feat .feat-desc p{font-size:2vh;filter:brightness(70%)}.recent-feat .feat-desc h1{font-size:4vh}.display-flex-row{display:flex;flex-direction:row;overflow:hidden;align-items:center;width:100%;--scroll-snap-type: x mandatory}.recent-feat-container{height:80%}.slide-btn{width:10%;height:80%;position:absolute;animation:fadeIn .3s ease forwards;animation-delay:.2s;opacity:0;z-index:1;display:flex;align-items:center}.right-slide{right:0;background:linear-gradient(90deg,#fff0,#000 70%)}.left-slide{left:0;background:linear-gradient(270deg,#fff0,#000 70%)}@keyframes fadeIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.feat-label{margin:0 80px}.feat-proj-wrapper{margin-top:20px;height:50%;width:100%;position:relative}.display-flex-center{display:flex;justify-content:center;align-items:center}.feat-intro{margin-top:30px;width:100%;height:500px;box-shadow:0 4px 8px #14141466,0 6px 20px #1414144d;background-image:url(/portfolio/assets/computers-DR8MZ2lb.jpg)}.feat-intro:after{content:"";width:100%;height:500px;top:30;position:absolute;background-image:linear-gradient(to top,#000 5%,transparent)}.feat-intro h1{width:80%;font-size:clamp(20px,5vh,4rem);margin:0 auto;text-align:center;position:relative;z-index:1}.feat-skill-wrapper{margin-bottom:50px;height:max-content;width:100%}.feat-skill-content{margin:0 auto;position:relative;width:90%;display:grid;gap:15px;grid-template-columns:repeat(auto-fit,minmax(8vw,1fr))}.feat-skill-items{border-radius:10px;box-shadow:inset 0 0 0 200px #00000080;border-top:1px solid rgba(225,225,225,.3);border-left:2px solid rgba(225,225,225,.1);border-right:1px solid rgba(225,225,225,.2);position:relative;margin-top:40px}.feat-skill-items img{width:100%;height:100%}.title-feat-skill{margin:2px 10px;font-size:1em;filter:brightness(90%);font-weight:400;max-height:100%;max-width:100%}.slide-btn img{height:40%;width:80%;margin:60% auto;filter:grayscale(100%);display:block}.slide-btn .right-arrow{transform:rotate(180deg)}.slide-btn:hover img{filter:grayscale(0);cursor:pointer}@media (max-width: 600px){.active-proj-text .proj-desc{width:90%}.active-items:after{content:"";width:100%;height:100%;position:absolute;left:0;bottom:0;z-index:0;background-image:linear-gradient(to top,#000 50%,transparent)}.exp-con-menu{height:50vh;position:relative;margin-top:0}.right-box{grid-template-columns:1fr;width:95%;overflow:hidden}.item-left-content{text-align:start;margin-left:5.5vw}.item-content{margin-left:calc(5.5vw + 48px);margin-top:8px;width:70%}.item-left{display:block}.item-right-first{grid-column:1;grid-row:1;display:inline}.horizontal-line-left{left:0}.horizontal-line{left:30px;width:30px}.circle-left{top:8px;left:-17px}.circle{left:5px;height:25px;width:25px}.exp-con-menu .company{font-size:15px}.exp-con-menu .year{font-size:12px}.exp-con-menu .job-title{font-size:13px}.item-right:nth-of-type(2){grid-column:1;grid-row:2}.item-right:nth-of-type(3){grid-column:1;grid-row:3}.item-right:nth-of-type(4){grid-column:1;grid-row:4}.vertical-line-center{left:17px;margin-top:5%}.exp .selector{width:100%}.exp .select-items-proj{display:flex;flex-direction:row}.select-items-proj li{flex-shrink:0;height:70%;width:120px}.feat-label{margin-left:30px}.recent-feat{width:45%}.slide-btn img{height:8vh}.feat-desc h1,.feat-desc p{padding-left:1vw}.feat-skill-content{grid-template-columns:repeat(auto-fit,minmax(7rem,1fr))}}.app-drawer-container{width:max-content;height:min-content;position:fixed;bottom:10px;z-index:9998;left:50%;transform:translate(-50%);transform-origin:center;display:flex}.app-drawer-content{display:flex;flex-direction:row;background-color:var(--secondary-color);border-radius:10px;margin:0 auto;width:max-content;height:clamp(3rem,5vh,5vh);align-items:center;justify-content:space-evenly;position:relative}.app-icon{height:100%;width:clamp(3rem,2.5vw,4rem);display:flex;justify-content:center;align-items:center;transition:.2s ease-in-out;transform-origin:bottom;position:relative}.app-drawer-container .app-img-container{height:75%;position:relative;width:clamp(2.5rem,2.1vw,4rem);display:flex;align-items:center;justify-content:center;border-radius:10px}.app-drawer-container .open-app{background-color:#ffffff4d}.app-icon:not(.about,.calendar):hover{cursor:pointer;margin:0 15px;transform:scale(1.8);transform-origin:bottom;z-index:2}.app-icon:hover+.app-icon{transform:scale(1.1) translateY(-5px)}.app-icon:has(+.app-icon:hover){transform:scale(1.1) translateY(-5px)}.app-icon img{width:80%;padding:0;transform-origin:bottom;position:relative}.app-icon p{margin:0;padding:5px;width:max-content;text-align:center;color:#f5f5f5;font-size:10px;border-radius:5px;visibility:hidden;position:absolute;top:-20px;background-color:#000}.app-icon:hover p{visibility:visible}.app-drawer-content .about{justify-content:flex-end;width:clamp(3.5rem,3vw,2.8vw);padding-right:clamp(.25rem,.2vw,.2vw)}.app-drawer-content .calendar{justify-content:flex-start;width:clamp(3.5rem,2.8vw,2.8vw);padding-left:clamp(.25rem,.2vw,.2vw)}.app-drawer-content .about:hover,.app-drawer-content .calendar:hover{cursor:pointer;margin:0 19px;transform:scale(1.8);transform-origin:bottom;z-index:2}.pdf-container{width:100%;height:100%;position:relative}.pdf-wrapper{position:relative;width:100%;height:calc(100% - 35px)}.pdf-change-btns{width:33%;height:3vh;position:relative;align-self:center}.pdf-btns-container input{width:100%;padding-left:20px;visibility:hidden}.pdf-btns-container input[type=file]::file-selector-button{background-color:#007bff;color:#fff;padding:0 16px;border:none;border-radius:4px;cursor:pointer;height:100%}.pdf-btns-container{display:grid;grid-template-columns:33% 33% 33%;height:max-content;color:#fff;margin:10px 0}@media (max-width: 600px){.pdf-btns-container{grid-template-columns:0% 60% 40%}}.pdf-btns{height:45px;width:100%;display:flex;justify-content:center;flex-direction:row;align-items:center;gap:10px;font-size:clamp(10px,.8vw,.8vw)}.pdf-content{width:100%;height:92%;overflow:auto;padding-left:auto;text-align:center}.pdf-btns-nav{height:3.5vh;width:clamp(50px,4vw,4vw);text-align:center;padding:0;cursor:pointer;font-size:clamp(10px,.8vw,.8vw)}.download-cv{width:clamp(80px,4vw,4vw);height:3vh;cursor:pointer}.a-dl-cv{display:block;margin:auto}