.intro-ssr-head,.intro-ssr-head+p{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}#intro>.pro-sec-head{text-align:center;align-self:stretch}#intro{color:#f5f5f5;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;overflow:hidden}#intro .i-ac{z-index:-1;width:100%;height:130vh;display:none;position:absolute}#intro h1{text-shadow:2px 2px 10px #000;margin:0}@media screen and (max-height:451px){#intro h1{font-size:100px!important}}#intro p{letter-spacing:-2px;margin:0;font-size:100px}#intro p span{color:#6e52a1}#intro .triangle-blend-v{fill:#6e52a1;z-index:-5;opacity:.1;object-fit:cover;width:100%;height:1500px;position:absolute;transform:translateY(10vh)}@media screen and (max-width:500px){#intro .triangle-blend-v{opacity:.5;width:300px;height:100px;transform:translateY(0)}}#intro .Hi-I-am-a-developer{z-index:-1;height:500px;position:absolute}#intro .Hi-I-am-a-developer img{width:100%;position:absolute}@media screen and (max-width:500px){#intro .Hi-I-am-a-developer img{display:none}}#intro .Hi-I-am-a-developer svg{fill:#6e52a1;filter:drop-shadow(.35rem 7rem 90px #5d1388e6);height:500px}@media screen and (max-width:500px){#intro .Hi-I-am-a-developer,#intro .Hi-I-am-a-developer svg{height:340px}}
.aboutme-section{color:#f5f5f5;width:100%;height:100vh;position:relative}.aboutme-section h1,.aboutme-section h2{text-align:right;margin-top:0;margin-bottom:0;top:0}@media (max-height:700px) and (max-width:375px){.aboutme-section h1,.aboutme-section h2{padding:10px}}@media screen and (max-width:500px){.aboutme-section h1,.aboutme-section h2{font-size:70px}}@media (max-height:680px) and (max-width:330px){.aboutme-section h1,.aboutme-section h2{font-size:60px}}@media (max-height:451px){.aboutme-section h1,.aboutme-section h2{font-size:50px}}.aboutme-section p{text-align:right;max-width:600px;margin:0;font-size:18px}@media screen and (max-width:920px){.aboutme-section p{max-width:500px;font-size:16px}}@media screen and (max-width:723px){.aboutme-section p{font-size:17px}}@media screen and (max-width:602px){.aboutme-section p{max-width:400px;font-size:17px}}@media screen and (max-width:500px){.aboutme-section p{max-width:350px;font-size:16px}}@media (max-height:451px){.aboutme-section p{text-shadow:0 0 1px #000;max-width:350px}}@media (max-height:680px) and (max-width:380px){.aboutme-section p{font-size:14px!important}}.aboutme-section .img-back-profile{z-index:-1;object-fit:contain;background:url(../media/back1.07xtksc_cv8da.png) 0 0/contain;justify-content:center;align-items:flex-end;width:60%;height:100vh;display:flex;position:absolute;overflow:hidden}@media screen and (max-width:1330px){.aboutme-section .img-back-profile{width:70%}}@media screen and (max-width:1130px){.aboutme-section .img-back-profile{justify-content:flex-start}}@media screen and (max-width:1024px){.aboutme-section .img-back-profile{width:100%}}@media (min-height:451px) and (max-width:576px){.aboutme-section .img-back-profile{justify-content:center;height:65vh}}.aboutme-section .img-back-profile:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000 0%,#0000000f 18%,#00000038 38%,#00000085 60%,#000000d1 78%,#000000f7 92%,#000 100%);position:absolute;top:0;bottom:0;left:0;right:0}@media screen and (max-width:1024px){.aboutme-section .img-back-profile:after{background:linear-gradient(90deg,#0000 0%,#00000026 28%,#000000b8 58%,#000000e0 100%)}}@media screen and (max-width:576px){.aboutme-section .img-back-profile:after{background:0 0}}.aboutme-section .img-back-profile .joel-pic{z-index:-1;object-fit:cover;object-position:42% 18%;background-size:contain;width:100%;height:105%}@media screen and (max-width:576px){.aboutme-section .img-back-profile .joel-pic{object-position:50% 12%}}@media screen and (max-width:1130px){.aboutme-section .img-back-profile .joel-pic{height:100%}}@media screen and (max-width:1030px){.aboutme-section .img-back-profile .joel-pic{height:95%}}@media screen and (max-width:990px){.aboutme-section .img-back-profile .joel-pic{height:90%}}@media screen and (max-width:612px){.aboutme-section .img-back-profile .joel-pic{height:85%}}@media screen and (max-width:576px){.aboutme-section .img-back-profile .joel-pic{height:100%}}.aboutme-section .aboutme-container{justify-content:flex-end;align-items:flex-end;width:95%;height:80%;margin:0 auto;display:flex}@media screen and (max-width:576px){.aboutme-section .aboutme-container{height:90%}}.aboutme-section .aboutme-container .aav{flex-direction:column;justify-content:flex-end;align-items:flex-end;display:flex}

#projects{color:#f5f5f5}#projects .pro-sec-head{margin-left:5%}#projects .project-intro h1{text-align:left;font-size:170px}#projects .project-container{justify-content:center;align-items:center;width:100%;height:-webkit-fit-content;height:fit-content;margin-top:-200px;margin-bottom:40px;display:flex;position:relative}@media screen and (max-width:1080px){#projects .project-container{justify-content:space-between;margin-top:-150px}}@media screen and (max-width:1024px){#projects .project-container{align-items:flex-start;margin-top:0}}@media (height:1366px) and (width:1024px){#projects .project-container{justify-content:space-between;align-items:flex-start}}@media (max-height:700px) and (max-width:375px){#projects .project-container{justify-content:space-between;align-items:flex-start}}@media (max-height:680px) and (max-width:330px){#projects .project-container{justify-content:space-between;align-items:flex-start}}#projects .project-container .project-l-img{width:750px;height:500px;position:relative;overflow:hidden}@media screen and (max-width:1470px){#projects .project-container .project-l-img{width:700px;height:500px}}@media screen and (max-width:1260px){#projects .project-container .project-l-img{width:600px;height:500px}}@media screen and (max-width:1080px){#projects .project-container .project-l-img{z-index:0;width:550px;height:450px}}@media screen and (max-width:1024px){#projects .project-container .project-l-img{z-index:-2;width:100%;position:absolute;overflow:hidden}}@media (height:1366px) and (width:1024px){#projects .project-container .project-l-img{height:800px}}@media screen and (max-width:500px){#projects .project-container .project-l-img{height:400px}}@media (max-height:700px) and (max-width:375px){#projects .project-container .project-l-img{height:400px!important}}@media (max-height:680px) and (max-width:330px){#projects .project-container .project-l-img{height:300px!important}}#projects .project-container .project-l-img img,#projects .project-container .project-l-img video{object-fit:cover;object-position:center;width:750px;height:550px}@media screen and (max-width:1470px){#projects .project-container .project-l-img img,#projects .project-container .project-l-img video{width:700px;height:600px}}@media screen and (max-width:1260px){#projects .project-container .project-l-img img,#projects .project-container .project-l-img video{width:600px;height:500px}}@media screen and (max-width:1080px){#projects .project-container .project-l-img img,#projects .project-container .project-l-img video{width:550px;height:450px}}@media screen and (max-width:1024px){#projects .project-container .project-l-img img,#projects .project-container .project-l-img video{width:100%;height:500px}}@media (height:1366px) and (width:1024px){#projects .project-container .project-l-img img,#projects .project-container .project-l-img video{height:800px}}@media screen and (max-width:500px){#projects .project-container .project-l-img img,#projects .project-container .project-l-img video{height:400px}}@media (max-height:700px) and (max-width:375px){#projects .project-container .project-l-img img,#projects .project-container .project-l-img video{height:400px}}@media (max-height:680px) and (max-width:330px){#projects .project-container .project-l-img img,#projects .project-container .project-l-img video{height:300px}}#projects .project-container .overlay-main-pro{pointer-events:none;z-index:2;width:100%;height:100%;display:none;position:absolute}#projects .project-container p{color:#d6d6d6;font-size:18px}@media screen and (max-width:920px){#projects .project-container p{font-size:16px}}@media screen and (max-width:723px){#projects .project-container p{font-size:17px}}@media screen and (max-width:500px){#projects .project-container p{font-size:16px}}@media (max-height:700px) and (max-width:375px){#projects .project-container p{font-size:14px}}@media (max-height:680px) and (max-width:330px){#projects .project-container p{font-size:14px}}#projects .pq-main{z-index:1;width:35%;margin-top:500px;padding:25px;position:relative}@media screen and (max-width:1260px){#projects .pq-main{width:40%;padding:25px 0}}@media screen and (max-width:1080px){#projects .pq-main{width:50%;padding:25px 0}}@media screen and (max-width:1024px){#projects .pq-main{width:70%;margin-top:470px}}@media (height:1366px) and (width:1024px){#projects .pq-main{width:70%;margin-top:800px}}@media screen and (max-width:500px){#projects .pq-main{width:100%;margin-top:400px;padding:25px 5px}}@media (max-height:700px) and (max-width:375px){#projects .pq-main{width:100%;margin-top:400px;padding:25px 5px}}@media (max-height:680px) and (max-width:330px){#projects .pq-main{width:100%!important;margin-top:220px!important;padding:25px 5px!important}}#projects .pq-main .p-fade-count{color:#232323;z-index:-1;letter-spacing:-30px;margin:-180px 0 0;font-size:350px;font-weight:bolder;position:absolute}@media screen and (max-width:1080px){#projects .pq-main .p-fade-count{font-size:250px}}@media screen and (max-width:1024px){#projects .pq-main .p-fade-count{letter-spacing:-3px;margin-top:-140px;font-size:200px}}@media (max-height:700px) and (max-width:375px){#projects .pq-main .p-fade-count{margin-top:-60px;font-size:100px}}@media (max-height:680px) and (max-width:330px){#projects .pq-main .p-fade-count{margin-top:-60px;font-size:100px}}#projects .pq-main .project-title-link{color:inherit;text-decoration:none;display:block}#projects .pq-main .project-title{margin-top:.67em;margin-bottom:20px;font-size:80px}#projects .pq-main .project-title img{width:30px;height:25px;margin-left:2px;transform:rotate(45deg)}@media screen and (max-width:1080px){#projects .pq-main .project-title{text-shadow:0 0 5px #000;margin-bottom:10px;font-size:50px}}@media (max-height:700px) and (max-width:375px){#projects .pq-main .project-title{font-size:40px}}@media (max-height:680px) and (max-width:330px){#projects .pq-main .project-title{font-size:40px}}@media (max-height:451px){#projects .pq-main .project-title{font-size:30px}}#projects .p-main-v{text-align:right}#projects .p-main-v .project-links{margin-left:auto!important;transform:none!important}#projects .p-main-v .p-fade-count{margin-left:100%;font-weight:bolder;transform:translate(-100%)}@media screen and (max-width:1470px){#projects .p-main-v .p-fade-count{margin-left:90%}}#projects .q-main-v .p-fade-count{font-weight:bolder}#projects .all-p-btn{justify-content:flex-end;margin-right:8%;display:flex}#projects .btn-project{height:50px!important}.overlay-blend-p-img{z-index:1;background-color:#000;width:100%;height:100%;position:absolute}@media screen and (max-width:1080px){.desk-project-wrap{margin:25px}}@media screen and (max-width:500px){.desk-project-wrap{margin:3px}}
.ac-sec-head{text-align:right;margin-right:5%}.achievements{min-height:20vh;margin-top:20px;display:flex;position:relative}.achievements h1,.achievements h2,.achievements .side-fade,.achievements .side-fade-h1-cap{letter-spacing:20px;z-index:-1;color:#232323;margin:.67em 0;font-size:170px;font-weight:700;position:absolute}.achievements .side-fade{transform:rotate(-90deg)translate(-40%,-250%)}@media screen and (max-width:1080px){.achievements .side-fade{display:none}}.achievements .side-fade-h1-cap{margin-top:100%;margin-bottom:0;font-size:800px;right:0;transform:translateY(-100%)}.achievements .a-container{color:#f5f5f5;flex-wrap:wrap;justify-content:space-around;align-items:center;width:80%;margin-left:12%;font-size:16px;display:flex}.achievements .a-container p{margin:0;font-weight:700}.achievements .a-container small{opacity:.7}.achievements .a-container .text-con-v2{margin-bottom:20px}.achievements .a-container .cert{max-width:500px}.achievements .a-container .cert img{max-width:500px;margin-bottom:20px;box-shadow:0 0 10px #00000086}.achievements .a-container .cert-v2{align-items:center;max-width:500px;margin-top:20px;display:flex}.achievements .a-container .cert-v2 img{object-fit:cover;max-width:340px;height:300px;margin-bottom:20px;margin-right:10px;box-shadow:0 0 10px #0000006e}.achievements .a-container .cert-v2 .text-con-v2{margin-left:-80px;transform:rotate(270deg)}.achievements .a-container .cert-v3{align-items:center;max-width:400px;margin-top:20px;display:flex}.achievements .a-container .cert-v3 img{object-fit:cover;width:300px;height:300px;margin-bottom:20px;margin-right:10px;box-shadow:0 0 10px #000}.achievements .a-container .cert-v3 .text-con-v2{width:100px;margin-left:0}@media screen and (max-width:1887px){.achievements .a-container{color:#f5f5f5;flex-wrap:wrap;justify-content:space-around;align-items:center;width:85%;margin-left:12%;font-size:16px;display:flex}}@media screen and (max-width:1887px) and (max-width:1080px){.achievements .a-container{width:100%;margin:25px}}@media screen and (max-width:1887px){.achievements .a-container p{margin:0;font-weight:700}.achievements .a-container small{opacity:.7}.achievements .a-container .text-con-v2{margin-bottom:20px}.achievements .a-container .cert{max-width:300px}.achievements .a-container .cert img{max-width:300px;margin-bottom:20px;box-shadow:0 0 10px #0008}.achievements .a-container .cert-v2{align-items:center;max-width:500px;margin-top:20px;display:flex}.achievements .a-container .cert-v2 img{object-fit:cover;max-width:340px;height:300px;margin-bottom:20px;margin-right:10px;box-shadow:0 0 10px #0007}.achievements .a-container .cert-v2 .text-con-v2{margin-left:-80px;transform:rotate(270deg)}.achievements .a-container .cert-v3{align-items:center;max-width:400px;margin-top:20px;display:flex}.achievements .a-container .cert-v3 img{object-fit:cover;width:300px;height:300px;margin-bottom:20px;margin-right:10px;box-shadow:0 0 10px #00000079}.achievements .a-container .cert-v3 .text-con-v2{width:100px;margin-left:0}}@media screen and (max-width:869px){.achievements{display:none}}@media (max-height:700px) and (max-width:375px){#achievements h1,#achievements h2{padding:10px;font-size:50px}}@media screen and (max-width:500px){#achievements h1,#achievements h2{font-size:70px}}@media (max-height:680px) and (max-width:330px){#achievements h1,#achievements h2{font-size:60px}}#achievements .achievements-mob{margin:5px}#achievements .achievements-mob .a-container-mob{border-left:3px solid #6e52a1;justify-content:flex-start;align-items:center;margin-left:15px;padding-left:15px;display:flex;overflow-x:scroll}#achievements .achievements-mob .a-container-mob::-webkit-scrollbar{opacity:0!important;pointer-events:none!important;width:0!important;height:0!important}#achievements .achievements-mob .a-container-mob .cert-mob{margin:5px}#achievements .achievements-mob .a-container-mob .cert-mob .mob-img-certs{object-fit:cover;background-color:#232323;width:300px;height:280px}#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob{color:#f5f5f5}#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob p{font-weight:700}@media screen and (max-width:920px){#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob p{font-size:16px}}@media screen and (max-width:723px){#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob p{font-size:17px}}@media screen and (max-width:500px){#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob p{font-size:16px}}@media (max-height:680px) and (max-width:330px){#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob p{font-size:14px}}#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob small{color:gray}@media screen and (max-width:920px){#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob small{font-size:14px}}@media screen and (max-width:723px){#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob small{font-size:14px}}@media screen and (max-width:500px){#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob small{font-size:14px}}@media (max-height:680px) and (max-width:330px){#achievements .achievements-mob .a-container-mob .cert-mob .text-con-v2-mob small{font-size:12px}}.cert-link{color:inherit;font-family:inherit;text-decoration:none;display:contents}.cert-mob .cert-link{display:block}