@import"https://use.typekit.net/jmk3xov.css";*{margin:0;padding:0;box-sizing:border-box}html{font-family:JetBrains Mono,monospace;font-size:16px;scroll-behavior:smooth;scroll-padding-top:100px}body{background-color:#000;overflow-x:hidden}nav{position:fixed;top:0;width:100%;height:100px;padding:20px 5vw;display:flex;justify-content:space-between;align-items:center;z-index:9;transition:.5s}nav.bg{background-color:#000}.toggleBtn{display:none}.logo{height:50px}.links-container{display:flex;list-style:none;gap:10px}.links{color:#fff;text-decoration:none;text-transform:capitalize;padding:10px 20px;-webkit-transition:1.5s;transition:.5s}.links:hover{opacity:.5}#topSection{position:relative;height:100vh;display:flex;justify-content:center;align-items:center;color:#fff}#topSection canvas{position:absolute;top:0;left:0;z-index:1}.canvas{width:100%;height:100%}.topContent{position:relative;z-index:2}@media (hover: none) and (pointer: coarse){.topContent{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:2}}.topHeadline{font-size:4.5rem;text-align:center}.topSecondary{text-align:center;margin:25px 0 50px;font-size:1.2rem}section{padding:60px 10vw}.sectionTitle{text-align:center;color:#fff;font-size:40px;font-weight:700;text-transform:uppercase;position:relative}#aboutmeText{font-size:16px;color:#fff}#bioDiv{width:100%;height:100px;padding:10px 20vw;display:flex;justify-content:space-between;align-items:center;z-index:9;transition:.5s}.sectionSecondary{text-align:center;width:50%;min-width:300px;color:#fff;opacity:.5;margin:3.5rem auto;font-size:1.1rem;line-height:1.8rem}.filters{margin:100px 0 50px;display:flex;justify-content:center;flex-wrap:wrap;gap:30px}.filterBtn{padding:15px 30px;font-size:1.5rem;font-family:JetBrains Mono,monospace;border:none;color:#fff;background:transparent;text-transform:capitalize;cursor:pointer;transition:.5s}.filterBtn.active,.filterBtn:hover{color:#000;background:#fff}.btn{padding:15px 30px;width:fit-content;background:#000000;color:#fff;text-decoration:none;text-transform:capitalize;display:block;font-family:JetBrains Mono,monospace;font-size:1rem;font-weight:700;margin:auto}.btn.light{background:#fff;color:#000}.btn.transparent{background:transparent;border:2px solid #fff}.projectGallery{margin-top:80px;display:grid;grid-template-columns:repeat(6,1fr);gap:20px;position:relative}.projectCard{position:relative;height:200px}.projectCard.active{border:10px solid #fff}.projectCard:not(.active):hover .tags{opacity:1}.projectCard:not(.active):hover .projectImg{opacity:.5;border:2px solid #fff}.projectImg{width:100%;height:100%;object-fit:contain;transition:.5s}.tags{position:absolute;left:10px;bottom:10px;color:#fff;width:90%;transition:.5s;opacity:0}.projectCard .active{border:10px solid #fff}#projectInfo{margin-top:100px;position:relative;display:flex;grid-template-rows:repeat(2,1fr);gap:40px}.ArtInfo{margin-top:100px;display:flex;justify-content:center}.imageDescription .details{width:100%}.skillContainer{margin-bottom:40px}.imageVideo{display:grid;grid-template-columns:repeat(2,1fr);gap:40px}.applicationImageVideo{display:flex;justify-content:center}.imageDescription{width:100%;display:flex;gap:10px;flex-direction:column}.image{width:100%;height:100%;object-fit:cover}.name{color:#fff;margin:30px 0;font-weight:300;font-size:2rem;text-transform:capitalize;text-align:left}.details{color:#fff;opacity:.5;font-size:1.1rem;line-height:1.8rem;margin-bottom:20px;text-align:left}.btnGroup{font-weight:700;display:flex;gap:30px}.btnGroup .btn{margin:0}.videoSection{padding-top:50px;width:100%;display:flex;justify-content:center}.video{width:100%;height:100%}.artImageSection{display:flex;justify-content:center;align-content:center}.artImage,.mirrorMan{height:600px;max-width:70%}.christmas{width:40%;height:auto}.camping,.potBoys{height:auto;max-width:70%}.artImage:hover,.potBoys:hover,.christmas:hover,.mirrorMan:hover,.camping:hover{transition:.5s;cursor:pointer;opacity:.7}.modal{display:none;position:fixed;z-index:1;padding-top:100px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:#000000e6}.modal-content{margin:auto;display:block;object-fit:contain;width:60%;max-width:600px}.mirrorManModal{margin:auto;display:block;object-fit:contain;width:auto;height:950px}.christmasModal{margin:auto;display:block;object-fit:contain;width:50%}.campingModal,.potBoysModal{margin:auto;display:block;object-fit:contain;width:80%}#caption{margin:auto;display:block;width:80%;max-width:700px;text-align:center;color:#ccc;padding:10px 0;height:150px}.modal-content,#caption{animation-name:zoom;animation-duration:.6s}@keyframes zoom{0%{transform:scale(0)}to{transform:scale(1)}}.close{position:absolute;top:105px;right:35px;color:#f1f1f1;font-size:40px;font-weight:700;transition:.3s}.close:hover,.close:focus{color:#bbb;text-decoration:none;cursor:pointer}@media only screen and (max-width: 700px){.modal-content{width:100%}}.aboutMeContainer{margin-top:100px;display:flex;gap:100px}.aboutMeImageContainer{position:relative}.aboutImg{object-fit:cover;max-width:300px;height:100%}.download-btn{text-align:center;bottom:30px;left:50%;font-weight:700;font-size:1rem}.personalInfo{position:relative;color:#fff}.socialLinksContainer{display:flex;justify-content:center;gap:30px}.socialLinks{color:#fff;font-size:3rem}.detailArea{display:flex;flex-direction:column;position:relative;gap:0px}.skillArea{width:100%}.subTitle{color:#fff;margin:30px 0;font-weight:300;font-size:2rem;text-transform:capitalize;text-align:left}.details{width:100%}.education{padding-top:100px}.educationContainer{display:flex;position:relative;gap:60px;margin-top:100px}.educationCard{padding-top:15px;position:relative;color:#fff;padding-left:60px;margin-bottom:50px}.cardIcon{position:absolute;top:0;left:0;width:40px;height:40px;background:#fff;color:#000;border-radius:50%;display:flex;justify-content:center;align-items:center}.time{padding:15px 30px;background:#1a1a1a;border-radius:30px}.cardTitle{font-size:1.2rem;font-weight:300;margin:40px 0 30px}.cardTitle span{opacity:.5}.title{text-align:left;color:#fff;text-transform:capitalize;font-size:2rem;font-weight:300;margin-bottom:40px}.title.small{font-size:1.5rem;font-weight:700}.personalInfo p{margin-bottom:30px;font-size:1.1rem}.skills{position:relative;margin:100px 0}.skillContainer{display:flex;flex-wrap:wrap;gap:0px}.skillCard{width:50px;height:90px;background:#1a1a1a;padding:10px;margin:auto;position:relative;overflow:hidden;transition:.5s}.skillImage{width:33px;height:33px;object-fit:contain;display:block;transition:.5s}.skillName{position:absolute;color:#fff;text-align:center;bottom:0;left:0;padding:17px;width:100%;transition:.5s;border-top:5px solid #000000}.skillCard:after,.skillCard:before{content:"";position:absolute;width:32px;height:32px;background:#000000;z-index:2;transform:rotate(45deg)}.skillCard:before{bottom:-20px;left:-20px}.skillCard:after{bottom:-20px;right:-20px}.skillCard:hover{background:#000000}.skillCard:hover .CSharp{background:#904d8f}.skillCard:hover .CPlusPlus{background:#659dd4}.skillCard:hover .Blender{background:#ec7800}.skillCard:hover .Unity{background:#cdcdcd}.skillCard:hover .GIMP{background:#504937}.skillCard:hover .Javascript{background:#f0dc50}.skillCard:hover .Typescript{background:#2a79c8}.skillCard:hover .Java{background:#862021}.skillCard:hover .React{background:#62dcfb}.skillCard:hover .Git{background:#f15030}.skillCard:hover .Aseprite{background:#5f4f5b}.skillCard:hover .Audacity{background:#0000d6}.nameAppear{color:#fff;text-align:center;opacity:0;transition:.5s}.skillHolder{padding-top:10px;width:100px}.skillHolder:hover .skillImage{transform:scale(1.1) translateY(-5px)}.skillHolder:hover .nameAppear{transform:scale(1.1) translateY(-5px);opacity:1}.list{list-style:none;gap:10px}.listItem{color:#fff;text-decoration:none;text-transform:capitalize;padding:10px 20px;transition:.5s}.listItem p{margin:0;font-size:1.1rem}.contactContainer{margin-top:100px;display:flex;gap:50px}.contactDetails{width:25%;color:#fff}.contactCard{position:relative;padding-top:10px;padding-left:60px;margin-bottom:40px}.contactForm{width:75%}input,textarea{font-family:JetBrains Mono,monospace;width:100%;padding:20px;background-color:#1a1a1a;color:#fff;border:none;outline:none;font-size:1.2rem;margin-bottom:20px}.nameEmailInput{display:flex;gap:20px}textarea{font-family:JetBrains Mono,monospace;resize:none;height:300px}.contactForm .btn{margin:0;border:none;font-size:1rem}@media screen and (max-width: 1200px){html{font-size:15px}.projectGallery{grid-template-columns:repeat(5,1fr)}.projectCard{height:175px}.contactContainer{position:relative;flex-direction:column;padding-bottom:70px}.contactDetails{width:100%;display:grid;grid-template-columns:repeat(3,1fr)}.contactForm{width:100%}.mirrorMan{height:600px;max-width:70%}.christmas{width:60%;height:auto}.camping,.potBoys{height:auto;max-width:70%}}@media screen and (max-width: 992px){.topHeadline{font-size:3.5rem}.logo{height:40px}.filterBtn{padding:10px 15px}.projectGallery{grid-template-columns:repeat(4,1fr)}.projectCard{height:150px}.detailArea{width:100%}.skillContainer{margin-bottom:0;margin-top:40px;justify-content:center}.btnGroup{justify-content:center}.aboutMeContainer{flex-direction:column;align-items:center}.aboutMeImageContainer{display:flex;justify-content:center;width:100%;min-width:300px;height:500px}.aboutImg{object-fit:contain}.personalInfo{width:100%}.contactContainer{flex-direction:column-reverse}.contactDetails{grid-template-columns:repeat(2,1fr)}.educationContainer{width:100%;flex-direction:column}.mirrorMan{height:600px;max-width:70%}.christmas{width:70%;height:auto}.camping,.potBoys{height:auto;max-width:90%}}@media screen and (max-width: 735px){nav{background-color:#000}.logo{height:30px}.toggleBtn{display:inline-block;width:50px;height:50px;border-radius:2px;position:relative;cursor:pointer}.toggleBtn span{position:absolute;width:80%;height:2px;background:#fff;top:50%;left:50%;transform:translate(-50%,-50%);transition:.5s}.toggleBtn span:nth-child(1){top:30%}.toggleBtn span:nth-child(3){top:70%}.toggleBtn.active span:nth-child(1){top:50%;transform:translate(-50%,-50%) rotate(45deg)}.toggleBtn.active span:nth-child(3){top:50%;transform:translate(-50%,-50%) rotate(-45deg)}.toggleBtn.active span:nth-child(2){opacity:0}.links-container{flex-direction:column;position:absolute;width:100%;top:100px;left:0;gap:0;pointer-events:none;opacity:0;transition:.5s}.links-container.active{opacity:1;pointer-events:all}.links{display:block;width:100%;padding:20px 10vw;background:#000000}.links:hover{opacity:1;background:#1a1a1a}.artImage{height:450px}.projectGallery{grid-template-columns:repeat(2,1fr)}.contactDetails{grid-template-columns:repeat(1,1fr)}.mirrorMan{height:600px;max-width:70%}.christmas{width:90%;height:auto}.camping,.potBoys{height:auto;max-width:100%}}@media screen and (max-width: 500px){.topHeadline{font-size:3rem}.topSecondary{font-size:1.2rem;width:80%;display:block;margin:25px auto;line-height:2rem}.nameEmailInput{flex-direction:column}.time{font-size:.8rem}input:nth-child(1){margin-bottom:0}.contactForm .btn{width:100%}.artImage{height:300px}.mirrorMan{height:600px;max-width:70%}.christmas{width:100%;height:auto}.camping,.potBoys{height:auto;max-width:100%}}