@import"https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800&display=swap";.app__navbar{width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background-color:#343a40b3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border-bottom:.5px solid #495057;position:fixed;z-index:2}.app__navbar-logo{display:flex;justify-content:flex-start;align-items:center;color:#9173fc;font-weight:700;font-size:1.5rem;-webkit-user-select:none;user-select:none;cursor:pointer}@media screen and (max-width: 340px){.app__navbar-logo{font-size:1rem}}.app__navbar-links{flex:1;display:flex;justify-content:center;align-items:center;list-style:none}.app__navbar-links li{margin:0 1rem;cursor:pointer;flex-direction:column}.app__navbar-links li:hover div{background-color:#9173fc}.app__navbar-links li div{width:5px;height:5px;background-color:transparent;border-radius:50%;margin-bottom:5px}.app__navbar-links li a{color:#e9ecef;text-decoration:none;flex-direction:column;text-transform:uppercase;font-weight:500;font-size:1rem;transition:all .3s ease-in-out}.app__navbar-links li a:hover{color:#9173fc}@media screen and (max-width: 900px){.app__navbar-links{display:none}}.app__navbar-menu{width:35px;height:35px;border-radius:50%;position:relative;display:flex;align-items:center;justify-content:center;background-color:#495057}.app__navbar-menu svg{width:70%;height:70%;color:#e9ecef}.app__navbar-menu div{position:fixed;top:0;bottom:0;right:0;z-index:5;padding:1rem;width:80%;height:100vh;display:flex;align-items:flex-end;justify-content:flex-end;flex-direction:column;background-color:#343a40f2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.app__navbar-menu div svg{width:35px;height:35px;color:#e9ecef;margin:.5rem 1rem}.app__navbar-menu div ul{list-style:none;margin:0;padding:0;height:100%;width:100%;display:flex;justify-content:flex-start;align-items:flex-start;flex-direction:column}.app__navbar-menu div ul li{margin:1rem}.app__navbar-menu div ul li a{color:#e9ecef;text-decoration:none;font-size:1rem;font-weight:600;text-transform:uppercase;transition:all .3s ease-in-out}.app__navbar-menu div ul li a:hover{color:#9173fc}@media screen and (min-width: 900px){.app__navbar-menu div{display:none}}@media screen and (min-width: 900px){.app__navbar-menu{display:none}}.app__simpleNavBar{width:100%;display:flex;justify-content:flex-start;align-items:center;padding:1rem 2rem;background-color:#343a40b3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border-bottom:1px solid #495057;position:fixed;z-index:2}#about .app__wrapper .copyright{display:none}#about-title{color:#9173fc}.app__about-container{padding:4rem 2rem 0;width:100%;height:100%;display:flex;align-items:center;justify-content:space-between;gap:40px}.app__about-container .left{flex:2;display:flex;justify-content:center}.app__about-container .left .cube-loader{position:relative;width:140px;height:140px;transform-style:preserve-3d;transform:rotateX(-30deg);animation:animate 10s linear infinite;color:#000}@keyframes animate{0%{transform:rotateX(-30deg) rotateY(0)}to{transform:rotateX(-30deg) rotateY(360deg)}}.app__about-container .left .cube-loader .cube-wrapper{position:absolute;width:100%;height:100%;transform-style:preserve-3d}.app__about-container .left .cube-loader .cube-wrapper .cube-span{position:absolute;width:100%;height:100%;transform:rotateY(calc(90deg * var(--i))) translateZ(70px);background-color:#9173fc;-webkit-transform:rotateY(calc(90deg * var(--i))) translateZ(70px);-moz-transform:rotateY(calc(90deg * var(--i))) translateZ(70px);-ms-transform:rotateY(calc(90deg * var(--i))) translateZ(70px);-o-transform:rotateY(calc(90deg * var(--i))) translateZ(70px)}.app__about-container .left .cube-top{position:absolute;width:140px;height:140px;background-color:#9173fc;transform:rotateX(90deg) translateZ(70px);transform-style:preserve-3d;-webkit-transform:rotateX(90deg) translateZ(70px);-moz-transform:rotateX(90deg) translateZ(70px);-ms-transform:rotateX(90deg) translateZ(70px);-o-transform:rotateX(90deg) translateZ(70px)}.app__about-container .left .cube-top:before{content:"";position:absolute;width:140px;height:140px;background-color:#aa5dc1;transform:translateZ(-140px);-webkit-transform:translateZ(-140px);-moz-transform:translateZ(-140px);-ms-transform:translateZ(-140px);-o-transform:translateZ(-140px)}.app__about-container .left .text{overflow:hidden;width:140px;height:140px;display:grid;place-items:center;border:1px solid #495057}.app__about-container .left .text .content{animation:zigzag 3s linear infinite;-webkit-user-select:none;user-select:none;font-size:3.5rem}@keyframes zigzag{0%{transform:translate(-50%)}50%{transform:translate(50%)}to{transform:translate(-50%)}}.app__about-container .right{flex:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.app__about-container .right .text{display:flex;flex-direction:column;gap:10px;width:100%}.app__about-container .right .text h2{text-align:left}.app__about-container .right .text p{max-width:500px;font-size:.9rem;font-weight:500}@media screen and (max-width: 1024px){.app__about-container{flex-direction:column;gap:30px}.app__about-container .right{flex:1;display:flex;flex-direction:column}.app__about-container .right .text #about-title,.app__about-container .right .text p{text-align:center}}@media screen and (max-width: 1024px){.app__about-container{gap:50px}}.links{display:flex;justify-content:flex-start;width:100%;align-items:center;gap:30px;padding:1rem 0}.links #resume{padding:1rem 2rem;border-radius:10px;border:none;background-color:#9173fc;font-weight:500;color:#f8f9fa;outline:none;transition:background .3s ease-in-out;cursor:pointer}.links #resume:hover{background-color:#6718c2}.links .contact-links{display:flex;justify-content:center;align-items:center;gap:10px}.links .contact-links .app__social-item{width:40px;height:40px;border-radius:50%;background-color:#212529;margin:.25rem 0;border:1px solid #adb5bd;display:flex;justify-content:center;align-items:center;transition:all .3s ease-in-out}.links .contact-links .app__social-item svg{width:15px;height:15px;color:#e9ecef}.links .contact-links .app__social-item:hover{background-color:#adb5bd;border-color:#495057}.links .contact-links .app__social-item:hover svg{color:#9173fc}@media screen and (min-width: 2000px){.links .contact-links .app__social-item{width:70px;height:70px;margin:.5rem 0}.links .contact-links .app__social-item svg{width:30px;height:30px}}@media screen and (max-width: 1024px){.links{flex-direction:column}}#home{background-image:url(/waves.svg);background-attachment:fixed;background-size:cover}#home .app__wrapper .copyright{display:none}.app__header{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%;flex-direction:row;padding:2rem 2rem 0}@media screen and (min-width: 2000px){.app__header{padding-top:8rem}}@media screen and (max-width: 1000px){.app__header{flex-direction:column;gap:10px}}@media screen and (max-width: 450px){.app__header{padding:6rem 1rem 2rem}}.app__header-info{flex:1;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}@media screen and (max-width: 2000px){.app__header-info{width:100%;margin-right:0}}.app__header-badge{width:100%;display:flex;justify-content:flex-start;align-items:center;flex-direction:column}.app__header-badge .badge-cmp,.app__header-badge .tag-cmp{padding:1rem 2rem;background-color:#343a40;border:#f8f9fa;border-radius:15px;width:auto;box-shadow:0 0 20px #49505733}.app__header-badge .tag-cmp{flex-direction:column;margin-top:3rem;align-items:flex-end}.app__header-badge .tag-cmp p{width:100%;text-transform:uppercase;text-align:right}.app__header-badge span{font-size:2.5rem}@media screen and (min-width: 2000px){.app__header-badge span{font-size:5rem}}@media screen and (max-width: 1000px){.app__header-badge{justify-content:flex-start;align-items:center}}.app__header-msg{flex:1;display:flex;justify-content:center;align-items:center}.app__header-msg div{display:flex;flex-direction:column;align-items:flex-start}.app__header-msg div .text{text-transform:uppercase;font-size:2rem;display:inline-block}.app__header-msg div span{color:#9173fc}@media screen and (max-width: 1000px){.app__header-msg{max-resolution:2rem 0;justify-content:center}.app__header-msg .text{font-size:1.5rem;text-align:center}}#contact .app__wrapper .copyright{display:none}.app__footer{display:flex;justify-content:center;align-items:center;width:100%;flex-direction:column;padding-top:6rem}#contact-title{color:#e9ecef}.app__footer-cards{width:60%;display:flex;justify-content:space-evenly;align-items:center;flex-wrap:wrap;margin:4em 2rem 2rem}.app__footer-cards .app__footer-card{width:290px;display:flex;flex-direction:row;justify-content:space-evenly;align-items:center;gap:5px;margin:1rem 0;padding:16px 10px;border-radius:10px;background-color:#d6daf8;transition:all .3s ease-in-out}.app__footer-cards .app__footer-card .copy-button{display:flex;justify-content:center;align-items:center;color:#000;background-color:#f8f9fa;border:1px solid #212529;padding:5px 10px;border-radius:5px;height:30px;width:50px;cursor:pointer}.app__footer-cards .app__footer-card .copy-button:hover{background-color:#495057;color:#fff}.app__footer-cards .app__footer-card .copy-button svg{width:100%}.app__footer-cards .app__footer-card img{width:40px;height:40px}.app__footer-cards .app__footer-card p{font-weight:500}.app__footer-cards .app__footer-card a{text-decoration:none;font-weight:500;color:#000}.app__footer-cards .app__footer-card:hover{box-shadow:0 0 10px #f8f9fa}@media screen and (max-width: 450px){.app__footer-cards .app__footer-card{width:100%;flex-direction:column}}@media screen and (max-width: 768px){.app__footer-cards{width:100%}}.app__footer-cards .app__footer-card:last-child{background-color:#f2f7fb}.app__footer-cards .app__footer-card:last-child:hover{box-shadow:0 0 10px #f2f7fb}.app__footer-form{width:60%;flex-direction:column;margin:1rem 2rem}.app__footer-form div{width:100%;margin:.75rem 0;border-radius:10px;cursor:pointer;background-color:#e9ecef;transition:all .3s ease-in-out}.app__footer-form div input,.app__footer-form div textarea{width:100%;padding:.95rem;border:none;border-radius:7px;background-color:#e9ecef;color:#000;font-weight:500;font-size:15px;outline:none}.app__footer-form div textarea{height:170px}.app__footer-form button{padding:1rem 2rem;border-radius:10px;border:none;background-color:#9173fc;font-weight:500;color:#f8f9fa;outline:none;margin:2rem 0 0;transition:background .3s ease-in-out;cursor:pointer}.app__footer-form button:hover{background-color:#6718c2}@media screen and (max-width: 768px){.app__footer-form{width:100%;margin:1rem 0}}#thank-you{color:#9173fc}#work .app__wrapper .copyright{display:none}.app__works .head-text span{color:#9173fc}.app__works{flex:1;width:100%;flex-direction:column;align-items:center}.app__work-filter{display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:wrap;margin:4rem 0 2rem}.app__work-filter .app__work-filter-item{padding:.5rem 1rem;border-radius:.5rem;background-color:#f8f9fa;color:#000;font-weight:500;cursor:pointer;transition:all .3s ease;margin:.5rem}.app__work-filter .app__work-filter-item:hover{background-color:#9173fc;color:#fff}@media screen and (min-width: 2000px){.app__work-filter .app__work-filter-item{padding:1rem 2rem;border-radius:.85rem}}.app__work-filter .item-active{background-color:#9173fc;color:#fff}.app__work-portfolio{display:flex;flex-wrap:wrap;justify-content:center;align-items:center}.app__work-portfolio .app__work-item{width:270px;flex-direction:column;margin:2rem;padding:1rem;border-radius:.5rem;background-color:#fff;color:#000;transition:all .3s ease}.app__work-portfolio .app__work-item:hover{box-shadow:0 0 25px #0003}@media screen and (min-width: 2000px){.app__work-portfolio .app__work-item{width:470px;padding:1.25rem;border-radius:.75rem}}@media screen and (max-width: 300px){.app__work-portfolio .app__work-item{width:100%;margin:1rem}}.app__work-img{width:100%;height:230px;position:relative}.app__work-img img{width:100%;height:100%;border-radius:.5rem;object-fit:cover;object-position:center}@media screen and (min-width: 2000px){.app__work-img{height:350px}}.app__work-hover{position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:100%;background-color:#00000080;border-radius:.5rem;opacity:0;transition:all .3s ease}.app__work-hover div{width:50px;height:50px;border-radius:50%;background-color:#00000080;color:#fff;margin:1rem;font-weight:800;cursor:pointer;transition:all .3s ease}.app__work-hover div svg{width:50%;height:50%;color:#f8f9fa}.app__work-content{padding:.5rem;width:100%;position:relative;flex-direction:column}.app__work-content h4{margin-top:1rem;line-height:1.5;color:#212529;font-weight:400}@media screen and (min-width: 2000px){.app__work-content h4{margin-top:3rem}}.app__work-content p{color:#495057}.app__work-content .app__work-tag{position:absolute;padding:.5rem 1rem;border-radius:10px;background-color:#fff;top:-25px}.app__Project{display:flex;flex-direction:column}.app__Project .project-content{max-width:1225px;padding:20px;display:flex;width:80%;flex-direction:column;align-items:center;gap:20px;margin:100px auto;border:1px solid #495057;border-radius:20px}.app__Project .project-content img{max-width:100%;border-radius:10px;object-fit:contain;max-height:623px}.app__Project .project-content .buttons{width:100%;display:flex;justify-content:flex-end;align-items:center;gap:20px;padding:15px 32px;border-top:1px solid #495057;border-bottom:1px solid #495057}.app__Project .project-content .buttons .live-button{padding:16px 32px;border-radius:10px;border:1px solid #343a40;background-color:#9173fc;font-weight:500;color:#f8f9fa;outline:none;transition:background .3s ease-in-out;cursor:pointer;display:grid;place-items:center;height:55px}.app__Project .project-content .buttons .live-button:hover{background-color:#6718c2}.app__Project .project-content .buttons .git-button{display:grid;place-items:center;padding:14px 20px;border-radius:10px;overflow:hidden;border:1px solid #343a40;background-color:#9173fc;font-weight:500;color:#f8f9fa;outline:none;transition:background .3s ease-in-out;cursor:pointer;height:55px}.app__Project .project-content .buttons .git-button:hover{background-color:#6718c2}.app__Project .project-content .buttons .git-button svg{width:24px;height:auto}.app__Project .project-content .readme{width:100%;padding:15px 32px}.app__Project .project-content .readme .react-markdown{color:#e9ecef}.app__Project .project-content .readme .react-markdown h1,.app__Project .project-content .readme .react-markdown h2,.app__Project .project-content .readme .react-markdown h3,.app__Project .project-content .readme .react-markdown h4{margin:20px 0 10px}.app__Project .project-content .readme .react-markdown h4{font-weight:500}.app__Project .project-content .readme .react-markdown hr{margin:10px 0}.app__Project .project-content .readme .react-markdown p{color:#adb5bd;font-weight:500;margin:5px 0}.app__Project .project-content .readme .react-markdown strong{font-weight:600;color:#e9ecef}.app__Project .project-content .readme .react-markdown ol{margin:5px 0 0 20px}.app__Project .project-content .readme .react-markdown ol li{list-style:decimal}.app__Project .project-content .readme .react-markdown ol li p a{display:flex;justify-content:flex-start;margin:10px 0;width:100%}.app__Project .project-content .readme .react-markdown ol li p a img{width:50%}@media screen and (max-width: 768px){.app__Project .project-content{width:90%;padding:10px}.app__Project .project-content .buttons .live-button{padding:10.4px}.app__Project .project-content .buttons .git-button{padding:13px 20px}.app__Project .project-content .readme{padding:15px 10px}}@media screen and (max-width: 340px){.app__Project .project-content{margin-top:80px}}#skills .app__wrapper .copyright{display:none}.app__skills{width:100%;flex-direction:column}.app__skills-container{width:80%;margin-top:3rem;display:flex;flex-direction:row}@media screen and (max-width: 1215px){.app__skills-container{width:100%;flex-direction:column}}#skills-title{color:#f8f9fa}.app__skills-list{flex:1;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:flex-start;margin-right:5rem}@media screen and (max-width: 1215px){.app__skills-list{margin-right:0;justify-content:center;align-items:center}}.app__skills-item{flex-direction:column;text-align:center;margin:1rem;transition:all .3s ease-in-out}.app__skills-item div{width:90px;height:90px;border-radius:50%;background-color:#fef4f5}.app__skills-item div img{width:50%}.app__skills-item div:hover{box-shadow:0 0 10px #fef4f5}@media screen and (min-width: 2000px){.app__skills-item div{width:150px;height:150px}}@media screen and (max-width: 450px){.app__skills-item div{width:70px;height:70px}}.app__skills-item p{font-weight:500;margin-top:.5rem}@media screen and (min-width: 2000px){.app__skills-item{margin:1rem 2rem}.app__skills-item p{margin-top:1rem}}.app__skills-exp{flex:1;display:flex;justify-content:flex-start;align-items:flex-start;flex-direction:column}@media screen and (max-width: 900px){.app__skills-exp{margin-top:2rem}}.app__skills-exp-item{width:100%;display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start;margin:1rem 0}.app__skills-exp-works{flex:1}.app__skills-exp-works .app__skills-exp-work{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;margin-bottom:1rem}.app__skills-exp-works .app__skills-exp-work h4{font-weight:600;color:#e9ecef}.app__skills-exp-works .app__skills-exp-work .work-company{font-weight:600;font-size:15px;margin-top:5px;color:#9173fc}.app__skills-exp-works .app__skills-exp-work .work-desc{color:#adb5bd;font-weight:500}.app__skills-exp-year{margin-right:3rem}.app__skills-exp-year p{font-weight:800;color:#9173fc;letter-spacing:1px}@media screen and (max-width: 450px){.app__skills-exp-year{margin-right:1rem}}#certificates .app__wrapper .copyright{display:none}.app__certificates{flex:1;width:100%;flex-direction:column}.app__certificates .head-text{color:#9173fc}.app__profiles{display:flex;justify-content:center;align-items:flex-start;flex-wrap:wrap;margin-top:2rem}.app__profile-item{width:190px;display:flex;justify-content:flex-start;align-items:flex-start;flex-direction:column;margin:2rem;cursor:pointer}.app__profile-item img{width:100%;border-radius:17px;object-fit:cover;object-position:left}@media screen and (min-width: 2000px){.app__profile-item{width:370px;margin:2rem 4rem}.app__profile-item img{height:320px}}.title{font-size:2rem;font-weight:700}*{margin:0;padding:0;box-sizing:border-box;list-style:none;text-decoration:none;font-family:Poppins,sans-serif;scroll-behavior:smooth}body{background-color:#212529}.app{font-family:Poppins,sans-serif;background-color:#343a40}.app__container{width:100%;min-height:100vh;display:flex;flex-direction:row}.app__flex{display:flex;justify-content:center;align-items:center}.app__wrapper{flex:1;width:100%;flex-direction:column;padding:4rem 2rem 0}@media screen and (max-width: 450px){.app__wrapper{padding:4rem 1rem 1rem}}.copyright{width:100%;padding:2rem 0 0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end}.copyright p{text-transform:uppercase;color:#adb5bd}.head-text{font-size:2.75rem;font-weight:800;text-align:center;color:#e9ecef;text-transform:capitalize}@media screen and (min-width: 2000px){.head-text{font-size:4rem}}@media screen and (max-width: 450px){.head-text{font-size:2rem}}.p-text{font-size:.9rem;text-align:left;color:#adb5bd;line-height:1.5}@media screen and (min-width: 2000px){.p-text{font-size:1.75rem}}.bold-text{font-size:1rem;font-weight:800;color:#f8f9fa;text-align:left}@media screen and (min-width: 2000px){.bold-text{font-size:2rem}}@media screen and (max-width: 450px){.bold-text{font-size:.9rem}}.app__social{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:1rem}.app__social a{width:40px;height:40px;border-radius:50%;background-color:#212529;margin:.25rem 0;border:1px solid #adb5bd;display:flex;justify-content:center;align-items:center;transition:all .3s ease-in-out}.app__social a svg{width:15px;height:15px;color:#e9ecef}.app__social a:hover{background-color:#adb5bd;border-color:#495057}.app__social a:hover svg{color:#9173fc}@media screen and (min-width: 2000px){.app__social a{width:70px;height:70px;margin:.5rem 0}.app__social a svg{width:30px;height:30px}}.app__social-item{cursor:pointer}.app__navigation{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:1rem}.app__navigation .app__navigation-dot{width:10px;height:10px;border-radius:50%;background-color:#cbcbcb;margin:.5rem;transition:background-color .2s ease-in-out}.app__navigation .app__navigation-dot:hover{background-color:#adb5bd}@media screen and (min-width: 2000px){.app__navigation .app__navigation-dot{width:20px;height:20px}}@media screen and (max-width: 628px){.app__navigation,.app__social{display:none}.copyright{padding:2rem}}
