body{margin:0;box-sizing:border-box;background-color:#1a1a1a}.wrapper{background-color:#000;height:120vh;width:100%}.hero{width:0%;height:120vh;background-color:#000;background-image:url(/Portfolio/assets/hall-y811SlRM.jpg);background-position:center;background-size:cover;background-attachment:fixed;animation:2.5s curtain forwards;position:relative}@keyframes curtain{to{width:100%}}.portfolio-header{position:absolute;right:30px;font-size:30px;color:#fff;font-family:monospace;font-weight:500}.hero-info-cn{background-color:#000;width:0%;height:350px;max-height:350px;display:flex;justify-content:center;align-items:center;gap:250px;position:absolute;top:20%;animation:2.5s curtain forwards}.hero-text{color:#fff;font-size:20px;max-width:500px;font-family:monospace;text-shadow:0px 0px 0px white initial;opacity:0;animation:4s heroInfo forwards}.hero-text h1{font-weight:300;margin:0 0 15px}.underline{text-decoration:underline solid white .5px;text-underline-offset:5px}.profile{width:250px;height:250px;border-radius:50%;background-color:#000;border:2px solid white;opacity:0;animation:4s heroInfo forwards}.profile-img{width:100%;border-radius:50%}@keyframes heroInfo{50%{opacity:0}to{opacity:1}}.contact-me-btn{position:absolute;left:40px;bottom:170px}.resume-btn{position:absolute;bottom:170px;right:40px}.contact-me,.resume{font-family:monospace;font-size:17px;font-weight:400;padding:7px 26px;border:none;outline:none;background-color:#ffffffa8;transition:all .2s ease-in-out;opacity:0;animation:5s btnAppear forwards}.contact-me:hover,.resume:hover{background-color:#fff}@keyframes btnAppear{50%{opacity:0}70%{opacity:1}to{opacity:1}}@media (max-width: 450px){.wrapper,.hero{height:100vh}.portfolio-header{font-size:20px;right:10px}.hero-info-cn{top:25%;height:250px}.hero-text h1{font-size:22px}.hero-text p{font-size:12px;width:300px}.profile{display:none}.contact-me-btn,.resume-btn{bottom:120px}}.about-section{width:100%;height:120vh;background-color:#191919;box-shadow:0 0 70px 70px #191919;position:relative;z-index:10;display:flex;padding-bottom:200px}.skills{font-family:monospace;width:50%;height:100%;color:#fff;position:relative}.skills h1{font-size:50px;font-weight:400;position:absolute;top:200px;left:100px}.skills-grid{width:500px;padding:30px;display:grid;grid-template-columns:auto auto auto;justify-content:center;align-items:center;column-gap:120px;row-gap:10px;position:absolute;top:310px;left:140px}.skills-icon{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:5px;width:120px;height:120px}.skills-icon h3{margin:0;color:#e0dfdf;text-align:center}.icon{width:60px;animation:2s iconFadeIn forwards;animation-timeline:view();animation-range-end:entry 400px}@keyframes iconFadeIn{0%{opacity:0}}.mid-line{width:2px;height:550px;margin-top:190px;background-color:#ffffffcb}@keyframes midLineDrop{0%{height:0px}}.about{font-family:monospace;width:50%;height:100%;color:#fff;position:relative}.about h1{font-size:50px;font-weight:400;position:absolute;top:200px;left:125px}.about-txt{width:500px;font-size:18px;position:absolute;top:340px;left:120px}.p2{position:absolute;top:480px}.slide-animation{position:relative}.slide-animation:before{content:"";position:absolute;top:0;left:0;bottom:0;right:0;background-color:#fff;animation:2s slideAnim forwards;animation-timeline:view();animation-range-end:entry 500px}@keyframes slideAnim{to{left:100%}}@media (max-width: 450px){.about-section{flex-direction:column}.skills h1{left:30px;font-size:30px}.skills-grid{width:100px;column-gap:50px;row-gap:10px;top:270px;left:115px}.skills-icon{width:70px;height:70px}.icon{width:25px}.mid-line{display:none}.about h1{font-size:30px;left:30px}.about-txt{font-size:15px;width:330px;top:270px;left:30px}.p2{top:420px}}.projects-section{width:100%;height:200vh;max-height:540vh;background-color:#1a1a1a;color:#fff;font-family:monospace;position:relative;box-shadow:0 0 40px 60px #191919}.projects-txt{content:"";background-image:url(/Portfolio/assets/projects-txt-zQdUIwd0.png);background-repeat:no-repeat;background-size:contain;background-position:0px 30px;filter:grayscale(1);height:100vh;width:140px;border-right:4px rgb(96,96,96) solid;position:sticky;top:0;left:100px;margin-bottom:40px}.projects-grid{width:70%;height:max-content;position:absolute;top:0;right:0;padding-top:220px;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:140px}.project-cn{display:grid;justify-content:center;align-items:center;grid-template-columns:480px 300px;column-gap:100px}.project-desc h1{margin:0 0 30px;font-size:40px;width:150px}.project-text{margin:0 0 25px;width:300px;font-size:17px}.control{margin-top:-100px;width:100%;display:flex;justify-content:center;align-items:center}.control button{font-family:monospace;color:#fff;outline:none;background-color:#00000063;border:none;border-radius:15px;padding:7px 14px;box-shadow:-3px 7px 7px 2px #0000007d}.source-btn{font-family:monospace;font-size:20px;font-weight:400;padding:7px 26px;border:none;outline:none;background-color:#ffffffa8;transition:all .2s ease-in-out}.source-btn:hover{background-color:#fff}@media (max-width: 450px){.projects-txt{width:100%;height:120px;background-image:url(/Portfolio/assets/projects-txt-horz-Bwaq8wHJ.png);background-size:contain;border-right:none;border-bottom:4px rgb(96,96,96) solid;position:absolute;top:100px;left:0}.projects-grid{top:100px;left:80px;max-height:450vh}.project-cn{display:flex;flex-direction:column;justify-content:center;align-items:start;gap:100px}.project-desc h1{font-size:30px;margin-bottom:25px}.project-text{font-size:15px;margin-bottom:18px}.source-btn{font-size:18px}.control{margin-top:-70px}}.browserWindow{background-color:#000;border-radius:5px;cursor:pointer;box-shadow:#ffffffa8 0 0 50px}.title-bar-l1{display:grid;grid-template-columns:auto auto auto 1fr;justify-content:center;align-items:center;gap:.5em;padding:5px}.c1{background-color:#393939;color:#fff;width:1.4em;height:1.4em;padding:.2em;border-radius:7px;display:flex;justify-content:center;align-items:center}.c1 img{filter:invert(100%);width:1em}.c2{width:6em;height:1.4em;background-color:#393939;border-radius:7px;display:grid;justify-content:center;align-items:center;grid-template-columns:1em 4em 1em}.c2 img{width:.8em;margin-left:2px}.title-bw{font-size:.6em;font-weight:200;margin-left:2px;color:#fff;overflow:hidden;max-width:80%}.cross{font-size:.5em;color:#fff;margin-left:2px;padding-top:.7px}.c3{font-size:.8em;color:#ffffff81}.c4{color:#ffffff81;font-size:1em;font-weight:100;display:grid;grid-template-columns:auto auto auto;justify-content:end;align-items:center;column-gap:10px;margin-right:5px}.title-bar-l2{width:100%;height:fit-content;padding:5px 0;background-color:#393939;display:grid;grid-template-columns:auto 50% 1fr auto;column-gap:10px}.left{display:flex;align-items:center;gap:7px;margin-left:7px}.grey-btn{color:#ffffff81}.reload{rotate:75deg;color:#fff;font-weight:100;font-size:.8em}.bright-btn{color:#fff;transform:translateY(-2px)}.mid{color:gray;width:100%;background-color:#696969;border-radius:10px;padding:0 5px;display:flex;justify-content:space-between;align-items:center}.mid-text{color:#fff;font-weight:200;font-size:.8em}.search-btn{filter:grayscale(2)}.right{color:#fff;display:flex;justify-content:end;align-self:flex-end}.title-bar-l3{height:24rem;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.project-img{width:100%;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.bw-container{position:relative;width:fit-content;transition:.2s;width:30rem;height:30rem;min-width:480px}.bw-container:hover{transform:scale(1.05)}.bw-container:hover .browserWindow{filter:blur(5px)}.open-project{position:absolute;display:flex;background-color:#000000e9;padding:5px 7px;border-radius:10px;z-index:10;left:50%;top:50%;transform:translate(-50%,-50%)}.link-text{color:#fff;font-size:2em;text-decoration:none}@media (max-width: 450px){.bw-container{width:15rem;height:15rem;min-width:240px;min-height:191px}.c2{width:6em}.c4{font-size:.7em}.link-text{font-size:1.1em}.title-bar-l3{height:13rem}}.footer-section{width:100%;height:120vh;background-color:#000}.footer-bg{width:100%;height:500px;background-image:url(/Portfolio/assets/hall-y811SlRM.jpg);background-size:cover;background-position:0px -300px;background-attachment:fixed}.footer{box-shadow:0 0 40px 60px #000;font-size:25px;color:#fff;display:flex;padding-left:150px}.footer-contact{font-family:Montserrat;width:50%}.email-btn{margin-top:25px;margin-bottom:50px;width:300px;border:2.5px white solid;text-decoration:none;font-family:Montserrat;font-weight:200;font-size:20px;color:#fff;display:flex;justify-content:space-between;padding:10px 15px;transition:.2s ease-in-out}.email-btn:hover{opacity:.5}.footer-contact div{font-size:15px;margin-bottom:4px}.socials{width:50%;padding-left:200px}.socials h3{font-family:Montserrat}.socials img{width:40px;margin-right:30px;filter:invert();transition:.2s ease-in-out}.socials img:hover{opacity:.5}@media (max-width: 450px){.footer-bg{height:350px;background-size:cover;background-position:center}.footer{flex-direction:column;gap:50px;padding-left:40px}.footer-contact{width:100%}.email-btn{width:270px}.socials{width:100%;padding-left:0}}