@import"https://fonts.googleapis.com/css2?family=Roboto&display=swap";@import"https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap";body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{text-align:center}body{padding:0;margin:0}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#d3d3d3}::-webkit-scrollbar-thumb{background:gray}::-webkit-scrollbar-thumb:active{background:#a9a9a9}.navbar{position:fixed;top:0;left:0;width:100%;background-image:linear-gradient(to bottom,rgb(23,8,58),transparent);background-size:50%;display:flex;justify-content:space-between;align-items:center;transition:top .3s;height:50px;padding:5px 0 0}.navbar.hide{top:-50px}.name{display:flex;align-items:center;margin-left:20px;font-size:3rem;color:#fff}.toggleButton{display:none;align-items:center;margin-right:20px;cursor:pointer}.toggleButton button{background-color:transparent;border:none;color:#fff;font-size:1.5em}.sections{display:flex;align-items:center}.sections ul{display:flex;list-style-type:none;margin:0;padding:0}.sections li{margin:0 10px;font-size:1.7em;color:#fff;cursor:pointer}.navbar.open,.navbar.close{z-index:100}@media (max-width: 768px){.toggleButton{display:flex}.sections{display:none}.navbar.open .sections{display:flex;flex-direction:column;position:fixed;top:0;right:0;background-color:#333;width:200px;height:100%;padding:10px 0;align-items:center;justify-content:center}.navbar.open .sections ul{flex-direction:column}.navbar.open .sections li{margin:10px 0}}.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:none}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translateZ(0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:before,.slick-track:after{display:table;content:""}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}.slick-slider{position:relative;width:80%;margin:auto}.slick-next,.slick-prev{background:#000;height:30px;width:30px;display:flex;justify-content:center;align-items:center;color:#fff!important;z-index:99;position:absolute;top:50%;transform:translateY(-50%)}.slick-next:before,.slick-prev:before{opacity:1;color:#fff}.slick-next{right:-15px}.slick-prev{left:-15px}.slick-slide{padding:0 15px;box-sizing:border-box}.image{width:100%;height:400px;object-fit:cover}.slick-arrow{background:none!important}.slick-slide:not(.slick-center){transform:scale(.6);opacity:.5}.slick-slide{opacity:.6;transition:all .5s;transform:scale(.8)}.slick-slide.slick-center{opacity:1;transform:scale(1)}.titleText{color:#fff}.slideTitle{font-size:2.5rem;padding:2rem 0 0}.slideskills{font-size:1.2rem;padding:2rem 0}.slideskills>div{color:#8b8492}.slideContainer{display:flex;justify-content:center}.slideInfo{width:35%;font-size:1.5rem;margin:0 1rem 0 0;text-align:left}.slideUrl{margin:0 0 1rem}.button2{display:flex;overflow:hidden;height:3rem;width:5rem;padding:2px 20px;align-items:center;border:2px solid purple;border-radius:50px;font-family:Bwnistagrot bd,sans-serif;justify-content:center;font-size:1.3rem;color:#fff;background-color:transparent;text-decoration:none;transition:background-color .3s}.button2:hover{background-color:purple}.slick-arrow{font-size:30px}@media screen and (max-width: 768px){.slideContainer{display:inherit}.slideTitle{font-size:2rem}.slideskills{font-size:1.2rem}.slideInfo{font-size:1.5rem;display:contents}.slideInfo>div{justify-content:left;padding:0 10%;display:flex;min-height:2rem}.buttonContainer{display:flex;justify-content:space-evenly;padding:2rem 0 0}.button2{width:5rem;font-size:1.3rem}}@media screen and (max-width: 480px){.image{height:10rem}.slideContainer{display:inherit}.slideTitle{font-size:1.5rem}.slideskills{font-size:1rem}.slideInfo{font-size:1.2rem;display:contents}.slideInfo>div{justify-content:left;padding:0 10%;display:flex;min-height:2rem}.buttonContainer{display:flex;justify-content:space-evenly;padding:2rem 0 0}.button2{width:4rem;font-size:1rem}}.typing-container{position:relative;display:inline-block;color:#fff}.cursor{position:absolute;animation:blink 1s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}h1,h2,h3{margin:.5rem;font-family:Roboto,sans-serif;font-size:2.5rem;font-weight:lighter}h1{padding:1.5rem 0 0}h3{font-size:1.5rem;min-height:1.8rem;padding:2rem 0 0}.start{height:100vh;background-image:url(/assets/Background-Day67rPi.png);background-size:cover;background-repeat:no-repeat;display:flex;justify-content:center;align-items:center;color:#fff}.start>div{position:absolute;top:38%;left:10%;border-radius:1rem;text-align:left;cursor:default}.nameColor{color:#9f75ff}.designDevelop{font-family:Open Sans,sans-serif;font-weight:lighter}.letsGo{display:inline-block;margin:1rem 0 0 .5rem;padding:.5rem 1rem;border:1px solid white;border-radius:8px;transition:all .3s ease;font-size:1.2rem;font-weight:700;cursor:pointer}.letsGo:hover{background-color:#fff;color:#000;transform:scale(1.05)}@media (max-width: 768px){h1,h2,h3{margin:.8rem;font-size:1.8rem}.start>div{top:35%;left:10%}}@media (max-width: 480px){h1,h2,h3{margin:.8rem;font-size:1.2rem}.start>div{top:35%;left:10%}}.work{background-color:#110b22;padding:4rem 0;min-height:100vh}.workContainer{margin:0 0 4rem 10%;text-align:left}.ProjectTitle{color:#7c647a;font-size:1.7rem;font-family:"Roboto" Condensed,Lato,Arial,sans-serif!important}@media screen and (max-width: 768px){.ProjectTitle{font-size:1.5rem}}@media screen and (max-width: 480px){.ProjectTitle{font-size:1.3rem}}.project{height:400px;background-color:#110b22}.projectTitle{margin:0 10% 3rem;text-align:left}.projectTitle>span:nth-of-type(2){color:#7c647a;font-size:1.7rem}.projectContainer{display:flex;justify-content:space-between;margin:0 15%}.projectContainer1{width:50%;text-align:left}.projectContainer1>div{padding:0 0 2rem}.projectContainer1>div>span:first-of-type{font-size:2rem;color:#fff}.projectContainer1>div>a{font-size:1.3rem;text-decoration:none}.projectContainer1>div>a>span{color:#8b8492}.personalProject{color:initial;transition:all .3s ease;position:relative;left:0;cursor:pointer}.personalProject:hover{color:#6e1cf3;left:10px}.cursorImage{position:fixed;width:200px;height:200px;background-size:contain;background-repeat:no-repeat;pointer-events:none;overflow:hidden;animation:disappear .5s forwards}.cursorImage.hovered{animation:appear .5s forwards}@keyframes appear{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes disappear{0%{clip-path:inset(0)}to{clip-path:inset(0 0 0 100%)}}@media screen and (max-width: 768px){.projectTitle>span:nth-of-type(2){font-size:1.5rem}.projectContainer{display:contents}.projectContainer1{width:80%;margin:0 10%;text-align:left}.projectContainer1>div>span:first-of-type{font-size:1.7rem}.projectContainer1>div>a{font-size:1.3rem;text-decoration:underline;color:#fff}}@media screen and (max-width: 480px){.projectTitle>span:nth-of-type(2){font-size:1.3rem}.projectContainer{display:contents}.projectContainer1{width:80%;margin:0 10%;text-align:left}.projectContainer1>div>span:first-of-type{font-size:1.4rem}.projectContainer1>div>a{font-size:1.1rem;text-decoration:underline;color:#fff}}.about{background-color:#121122;padding:3rem 0}.about>div{margin:0 10%;text-align:left}.about>div>span:nth-of-type(2){color:#7c647a;font-size:1.7rem}.aboutTitle{color:#3f51b5}.informationContainer:first-of-type{margin:2rem 5% 0}.informationContainer{font-size:1.7rem;margin:.5rem 5% 0}.informationContainer>p{margin:0 0 0 .5rem;font-size:1.3rem;color:#75bfff}.whiteColor{color:#fff}.triColor{color:#26a69a}@media screen and (max-width: 768px){.about>div>span:nth-of-type(2){font-size:1.5rem}.informationContainer:first-of-type{margin:2rem 0 0}.informationContainer{font-size:1.5rem;margin:.5rem 0 0}.informationContainer>p{margin:0 0 0 .5rem;font-size:1.2rem}}@media screen and (max-width: 480px){.about>div>span:nth-of-type(2){font-size:1.3rem}.informationContainer:first-of-type{margin:2rem 0 0}.informationContainer{font-size:1.4rem}.informationContainer>p{font-size:1.1rem}}.overlay{position:fixed;inset:0;z-index:9999;background:#0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;animation:fadeIn .3s ease-in-out}.overlayContent{background:#ffffff1a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:1.5rem;padding:2rem;width:90%;max-width:600px;color:#fff;position:relative;box-shadow:0 8px 30px #0000004d;animation:slideUp .4s ease forwards}.closeButton{position:absolute;top:1rem;right:1rem;font-size:1.5rem;background:none;border:none;color:#fff;cursor:pointer;transition:transform .2s ease}.closeButton:hover{transform:scale(1.2)}.contactForm{width:100%}.contactForm ul{display:flex;flex-direction:column;gap:.5rem;padding:0;margin:1rem 0 0;list-style:none}.contactForm li{margin-bottom:1.2rem;text-align:center}.contactRow{display:flex;gap:1rem;flex-wrap:wrap}.contactHalf{flex:1;min-width:0}.contactForm .contactHalf input{width:85%}.contactForm input,.contactForm textarea{width:93%;padding:.75rem 1rem;border:1px solid rgba(255,255,255,.3);border-radius:.8rem;background:#ffffff0d;color:#fff;font-size:1rem;transition:border-color .3s ease;resize:none}.contactForm textarea{min-height:120px}.contactForm input:focus,.contactForm textarea:focus{border-color:#9f75ff;outline:none}.flatButton{display:block;margin:0 auto;background:#9f75ff;color:#fff;border:none;padding:.8rem 2rem;border-radius:.8rem;cursor:pointer;font-size:1rem;transition:background .3s ease}.flatButton:hover{background:#b497ff}.contactName p{font-size:1.5rem;text-align:center;margin:0 0 1rem;color:#fff;font-weight:700}.contactMeInfo{text-align:center;margin-bottom:1.5rem;width:100%}.contactMeInfo span{display:block;margin-bottom:.3rem;font-size:1rem;color:#eee}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.contact{background-color:#111014;padding:2rem 0 0;font-family:Roboto,sans-serif}.contact>div{margin:0 10%;text-align:left}.contact>div>div{display:flex;flex-wrap:wrap;margin:3rem 0}.contactContainer,.mediaContainer{width:50%}.contactContainer>span{margin:0 0 0 40%;color:#fff;font-size:2rem}.contactContainer>span:nth-of-type(2){color:#6e1cf3}.buttonWrapper{display:inline-block;position:relative;overflow:hidden;margin:4rem 0 0 40%}.button{display:flex;overflow:hidden;height:60px;padding:1px 30px 0;align-items:center;border:2px solid #6e1cf3;font-family:Bwnistagrot bd,sans-serif;font-size:1.4rem;color:#fff;font-weight:700;background-color:transparent;text-decoration:none;transition:background-color .3s}.button:hover{background-color:#6e1cf3}.buttonBg{position:absolute;background-color:#6e1cf3;width:100%;height:100%;left:0;top:0;z-index:-1;transition:transform .3s;transform-origin:center;will-change:transform}.button:hover:after{transform:scaleX(1)}.mediaContainer>span{display:flex;color:#fff;font-size:2rem;margin:0 0 0 10%}.mediaContainer>span:nth-of-type(2){color:#75bfff}.iconContainer{margin:4rem 0 0 10%;display:flex;flex-wrap:wrap;justify-content:left}.mediaIcon{width:100%;text-decoration:none;font-size:1rem;margin:0 0 1rem;color:#fff;transition:all .2s ease-in-out}.mediaIcon>span{padding:0 0 0 7px}.mediaIcon:hover{color:var(--hover-color);letter-spacing:5px;font-size:1.4rem}.contact>div>span:last-of-type{font-size:.8rem;display:flex}@media (max-width: 1024px){.contactContainer>span{margin:0}.buttonWrapper{display:flex;margin:4rem 0 0 15%}}@media (max-width: 768px){.contactContainer>span{margin:0;font-size:1.7rem}.buttonWrapper{display:flex;margin:3rem 0 0}.button{height:60px;padding:1px 25px 0;font-size:1.3rem}.mediaContainer>span{font-size:1.7rem}.mediaIcon{flex:1 0 calc(50% - 20px);max-width:calc(50% - 20px)}}@media (max-width: 480px){.contactContainer>span{margin:0;font-size:1.4rem}.buttonWrapper{display:flex;margin:3rem 0 0}.button{height:60px;padding:1px 20px 0;font-size:1rem}.mediaContainer>span{font-size:1.4rem}.mediaIcon{flex:1 0 calc(100% - 20px);max-width:calc(100% - 20px)}}.pageTitle{font-size:1rem;color:#8b8492}.transition{background:linear-gradient(to top,#121122,#110b22);height:50px}.transition1{background:linear-gradient(to bottom,#121122,#111014);height:50px}@media screen and (max-width: 768px){.pageTitle{font-size:.9rem}}@media screen and (max-width: 480px){.pageTitle{font-size:.8rem}}.wip{visibility:hidden}.projectList{display:flex}.imageContainer{width:60%;padding:0 40% 0 0;background-color:#0e0116}.imageContainer>img{background-size:cover;background-repeat:no-repeat;width:100%;padding:0 0 1%}.projectListContainer{width:40%;height:100vh;left:60%;position:fixed;color:#fff;background-color:#0e0116}.projectListContainer>div{display:flex;text-align:left;padding:0 5%}.projectListHeader{height:5%;margin:2% 0;align-items:center;justify-content:space-between}.projectListHeader>a{border-radius:20px;width:2.5rem;text-align:center;font-size:2rem;cursor:pointer;background-color:#6e1cf3}.projectListHeader>a>svg{color:#fff}.projectListHeader>div{font-size:2rem;color:#8b8492}.projectListHeader>div>a{color:#8b8492}.projectListHeader>div>span{cursor:default}.projectListSkills{height:4%;font-size:1.3rem;color:#8b8492}.projectListTitle{height:5%;font-size:2rem;margin:1% 0}.projectListDesc{height:5%;font-size:1.2rem;margin:0 0 3%}.projectListCTA{height:5%;margin:0 0 80%}.projectListFooter{height:5%}