@import url(https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap);:root{--bg-primary:#171717;--bg-secondary:#222227;--bg-secondary-transparent:#222227b4;--bg-secondary-hover:#25272d;--bg-tertiary:#37e337;--bg-tertiary-hover:#0f0;--blue:#51b8f0;--c-primary:#fff;--c-secondary:#ddd;--c-tertiary:#bbb8b8;--bg-particle-js:#fff3}.vertical-timeline:before{background:#bbb8b8!important;background:var(--c-tertiary)!important}html{scroll-behavior:smooth}span.green{color:#37e337;color:var(--bg-tertiary)}*{box-sizing:border-box;letter-spacing:1px;list-style:none;margin:0;padding:0;text-decoration:none}body{background-color:#171717;background-color:var(--bg-primary);color:#fff;color:var(--c-primary);font-family:Inter,sans-serif;height:auto;min-height:100vh}.about,.contact-me,.home,.projects{animation:fade-up 2s}.main{position:relative}.loading{flex:1 1;justify-content:center;margin-bottom:186px}.loading,header{align-items:center;display:flex;width:100%}header{justify-content:space-between;padding:15px 0 0 25px;position:fixed;z-index:2}header .logo{background-color:#222227;background-color:var(--bg-secondary);border-radius:50%;cursor:pointer;font-size:26px;font-weight:bolder;height:70px;width:70px}header .logo:hover{background-color:#25272d;background-color:var(--bg-secondary-hover);box-shadow:0 0 6px 5px #25272d;box-shadow:0 0 6px 5px var(--bg-secondary-hover)}header .logo a{align-items:center;border-radius:50%;color:#ddd;color:var(--c-secondary);display:flex;gap:3px;height:100%;justify-content:center;width:100%}header nav{flex-grow:0.95;height:70px}header nav ul{align-items:center;background-color:#222227;background-color:var(--bg-secondary);border:1px solid #222227;border:1px solid var(--bg-secondary);border-radius:20px 0 0 20px;display:flex;height:100%;justify-content:space-around}header nav ul li a{border-bottom:3px solid #0000;border-radius:3px;cursor:pointer;display:flex;gap:5px;padding:5px;transition:.3s}header nav ul li a:hover{background-color:#25272d;background-color:var(--bg-secondary-hover);box-shadow:0 0 6px 5px #25272d;box-shadow:0 0 6px 5px var(--bg-secondary-hover)}header nav ul li svg{color:#ddd;color:var(--c-secondary)}header nav ul li:hover svg{color:#fff;color:var(--c-primary)}header nav ul li p{color:#ddd;color:var(--c-secondary);transition:.3s}header .active p,header nav ul li:hover p{color:#37e337;color:var(--bg-tertiary)}footer{align-items:center;background-color:#222227;background-color:var(--bg-secondary);flex-direction:column;height:auto;padding:15px 15px 30px}footer,footer ul{display:flex;justify-content:space-evenly;width:100%}footer ul{flex-wrap:wrap;padding:7px 0;row-gap:7px}footer ul li{gap:3px;justify-content:center;min-width:120px}footer .links,footer ul li{align-items:center;display:flex;flex-direction:column}footer .links{flex-wrap:wrap;font-size:14px;row-gap:8px}.footer-links,footer .links{justify-content:space-evenly}.footer-links{display:flex;width:100%}footer .links a{align-items:center;color:#ddd;color:var(--c-secondary);display:flex;gap:5px;justify-content:center}footer .links a:hover{color:#37e337;color:var(--bg-tertiary)}.container{display:flex;flex-direction:column;min-height:100vh;padding:110px 30px 30px;width:100%}.home{display:grid;grid-template-areas:"title title" "home-right home-left" "contact contact";place-content:center;place-items:center}.home .home-title{grid-area:title;margin:15px 0;text-align:center}.home .home-title .icon{color:#37e337;color:var(--bg-tertiary)}.home .left{grid-area:home-left;height:500px;width:500px}.home .left,.home .left .profile{align-items:flex-end;display:flex;justify-content:center}.home .left .profile{height:100%;overflow:hidden;width:100%}.home .left .profile .profile-stand{align-items:center;background-color:#25272d;background-color:var(--bg-secondary-hover);border-radius:60px;box-shadow:0 0 4px 4px #25272d;box-shadow:0 0 4px 4px var(--bg-secondary-hover);display:flex;height:200px;justify-content:center;position:relative;width:90%}.home .left .profile img{bottom:-110px;position:absolute;width:265px}.home .right{align-items:center;display:flex;flex-direction:column;grid-area:home-right;justify-content:center;width:100%}.home .right p{letter-spacing:1px;text-align:center}.home .right .title{align-items:center;display:flex;flex-direction:column;font-size:45px;font-weight:500;justify-content:center;margin-top:20px;width:100%}.home .right .title span{color:#37e337;color:var(--bg-tertiary)}.home .right .description{margin-top:10px}.home .contact-btns{display:flex;gap:15px;margin-top:20px}.home .contact-btns .btn{align-items:center;border:none;border-radius:3px;cursor:pointer;display:flex;font-size:16px;gap:5px;justify-content:center;padding:7px 14px}.home .contact-btns .hire-me-btn{background-color:#37e337;background-color:var(--bg-tertiary);color:#171717;color:var(--bg-primary)}.home .contact-btns .hire-me-btn:hover{background-color:#0f0;background-color:var(--bg-tertiary-hover);color:#222227;color:var(--bg-secondary)}.home .contact-btns .send-email-btn{background-color:#222227;background-color:var(--bg-secondary);color:#fff;color:var(--c-primary)}.home .contact-btns .send-email-btn:hover{background-color:#222227;background-color:var(--bg-secondary);color:#bbb8b8;color:var(--c-tertiary)}@keyframes slide-in{0%{opacity:0;transform:translateY(-40%)}to{opacity:1;transform:translateX(0)}}@keyframes button-hover{0%{transform:scale(1)}to{transform:scale(1.04)}}.animate-fade-in{animation:fade-in 1s ease-out}.animate-slide-in{animation:slide-in .8s ease-out}.animate-button{transition:transform .3s ease}.animate-button:hover{animation:button-hover .5s ease forwards}.home-title,.left,.right{margin-bottom:1.5rem}.profile img{border-radius:50%;height:auto;width:150px}.contact-btns .btn{margin-right:.5rem}.about{grid-gap:20px;display:grid;gap:20px;grid-auto-flow:row;grid-template-areas:"overview skills";grid-template-columns:repeat(auto-fill,minmax(45%,1fr));justify-items:center;overflow-x:hidden;width:100%}.about .section{background-color:#25272d;background-color:var(--bg-secondary-hover);border-radius:2px;height:auto;max-width:400px;padding:10px;transition:.3s;width:100%}.about .overview{grid-area:overview}.about .title{align-items:center;color:#fff;color:var(--c-primary);display:flex;font-size:20px;font-weight:700;gap:5px;justify-content:flex-start;margin-bottom:15px;margin-left:5px}.about .description{align-items:center;display:flex;flex-wrap:wrap;gap:20px;justify-content:center}.about .description p{border-radius:5px;color:#ddd;color:var(--c-secondary);letter-spacing:1px;padding:10px;transition:.3s;width:clamp(300px,450px,500px);word-spacing:2px}.about .section:hover{background-color:initial}.about .my-work{grid-area:skills}.skills .description ul li{display:flex;margin-bottom:6px}.skills .description ul li span{align-items:center;color:#37e337;color:var(--bg-tertiary);display:flex;flex-direction:column;justify-content:center;margin-right:5px}@keyframes slide-in-left{0%{opacity:0;transform:translateX(-100%)}to{opacity:1;transform:translateX(0)}}@keyframes slide-in-right{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes fade-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-slide-in-left{animation:slide-in-left .5s ease-out}.animate-slide-in-right{animation:slide-in-right .5s ease-out}.section{margin-bottom:2rem}.contact-me{flex-direction:column;grid-area:contact;justify-content:flex-start;min-height:530px;padding-top:100px}.contact-me,.contact-me .title{align-items:center;display:flex}.contact-me .title{font-size:20px;justify-content:center}.contact-me .title span.green{font-size:10px;margin-right:15px}.contact-form{justify-content:center;margin-top:20px;padding:20px;width:100%}.contact-form,.contact-form form{align-items:center;display:flex;flex-direction:column;flex-grow:1}.contact-form form{background-color:#222227b4;background-color:var(--bg-secondary-transparent);border-radius:20px;justify-content:space-evenly;padding:0 25px;width:600px}.contact-form form .part{align-items:center;display:flex;flex-direction:column;gap:15px;justify-content:center;width:100%}.contact-form form .part .contact-input{border:1px solid #fff;border:1px solid var(--c-primary);border-radius:3px;outline:none;padding:6px;width:70%}.contact-form form button{border:none;border-radius:4px;display:flex;font-size:14px;gap:5px;outline:none;padding:10px 20px}.experience{overflow-x:hidden;width:100%}.projects .title{font-size:20px;font-weight:500}.projects{display:flex;flex-direction:column;overflow-x:hidden;width:100%}.projects .personal-projects,.projects .work-experiences{margin-bottom:30px;width:100%}.projects .part:hover{background-color:#222227b4;background-color:var(--bg-secondary-transparent)}.projects .lists{align-items:center;display:flex;flex-wrap:wrap;gap:20px;justify-content:center}.projects .part{background-color:#25272d;background-color:var(--bg-secondary-hover);border-radius:3px;display:flex;flex-direction:column;gap:20px;height:auto;margin-top:15px;min-width:370px;padding:20px;transition:.3s;width:40%}.projects .part span{color:#37e337;color:var(--bg-tertiary)}.projects .part .view-more-div{text-align:center;width:100%}.projects .part .project-title{text-wrap:nowrap;border-bottom:1px solid #bbb8b8;border-bottom:1px solid var(--c-tertiary);color:#0f0;color:var(--bg-tertiary-hover);font-size:20px;overflow:hidden;padding-bottom:3px;text-align:center;text-overflow:ellipsis}.projects .part .view-more{background-color:#ddd;background-color:var(--c-secondary);border:none;border-radius:3px;color:#171717;color:var(--bg-primary);cursor:pointer;font-size:16px;outline:none;padding:5px 10px;width:130px}.projects .part .view-more:hover{background-color:#bbb8b8;background-color:var(--c-tertiary)}.project-popup-main{align-items:center;animation:fade-in .5s ease-out;background:#222227;background:var(--bg-secondary);border-radius:15px;box-shadow:0 10px 30px #0000004d;color:#fff;color:var(--c-primary);display:flex;flex-direction:column;height:100%;justify-content:center;padding:20px;position:relative;width:100%}@keyframes fade-in{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.project-popup-main .left,.project-popup-main .right{height:auto;margin-top:20px;width:90%}.project-popup-main .right p{color:#ddd;color:var(--c-secondary);line-height:1.6;margin:15px 0}.project-popup-main .left .title{color:#51b8f0;color:var(--blue);font-size:18px;font-weight:600;margin-bottom:15px}.project-popup-main .left img{border-radius:10px;box-shadow:0 4px 8px #0003;transition:transform .3s ease;width:100%}.project-popup-main .left img:hover{transform:scale(1.05)}.project-table{border:1px solid #51b8f0;border:1px solid var(--blue);border-collapse:collapse;border-radius:10px;box-shadow:0 4px 8px #0000001a;margin:20px auto;max-width:600px;overflow:hidden;width:100%}.project-table td,.project-table th{border-bottom:1px solid #51b8f0;border-bottom:1px solid var(--blue);font-size:16px;padding:15px 20px;text-align:left}.project-table th{background-color:#222227b4;background-color:var(--bg-secondary-transparent);color:#51b8f0;color:var(--blue);font-weight:600;width:35%}.project-table td{color:#ddd;color:var(--c-secondary)}.project-table .green{color:#37e337;color:var(--bg-tertiary)}.project-table tr:last-child td{border-bottom:none}.project-table a.link-to-project{color:#51b8f0;color:var(--blue);font-weight:500;text-decoration:none;transition:color .3s ease}.project-table a.link-to-project:hover{color:#0f0;color:var(--bg-tertiary-hover);text-decoration:underline}.project-popup-main .proj-title{animation:slide-down .5s ease-out;color:#51b8f0;color:var(--blue);font-size:28px;font-weight:700;margin-bottom:20px;text-align:center}@keyframes slide-down{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.project-popup-main .proj-details{animation:fade-up .5s ease-out;background:#222227b4;background:var(--bg-secondary-transparent);border-radius:10px;box-shadow:0 4px 8px #0003;padding:20px}.project-popup-main .proj-details p{color:#ddd;color:var(--c-secondary);margin:0}.project-popup-main .proj-details span.green{color:#37e337;color:var(--bg-tertiary);font-weight:600}.project-popup-main .proj-details span.dangerouslySetInnerHTML{display:block;margin-top:10px}@media (max-width:1024px){.home .left{width:400px}}@media (max-width:768px){header{padding-left:5px}.container{padding:110px 10px 10px;width:100%}header nav ul li .icon{display:none}.home .left{width:300px}.about{align-items:center;display:flex;flex-direction:column;justify-content:center;width:100%}.about .section{width:90%}.contact-form form{width:400px}.contact-form form .part .contact-input{width:100%}.contact-form,.contact-form form{padding:10px}.projects .part{width:90%}}@media (max-width:650px){.home{grid-template-areas:"title" "home-right" "home-left" "contact"}.home .right{min-height:70vh}.home .left{height:470px;width:100%}.contact-me .title{font-size:16px}.project-popup-main .left,.project-popup-main .right{margin-bottom:10px;width:100%}footer .links{justify-content:space-between;width:100%}footer .links a svg{display:none}}@media (max-width:425px){.contact-me .title{font-size:15px}.contact-form form{width:100%}.projects .part{font-size:14px;min-width:300px;padding:10px;width:90%}footer .links .title{font-size:14px!important}footer .links a{font-size:12px}footer{padding:15px 18px 30px}}@media (max-width:375px){header{height:70px}header .logo{font-size:20px;height:50px;width:50px}header nav{height:50px}.home .home-title,header nav ul li a p{font-size:13px}.contact-me .title,.project-popup-main{font-size:12px}.proj-details table tr th{padding:5px}.proj-details table{width:100%}.contact-form form{background-color:initial;box-shadow:none}.contact-me form{padding:0}}@keyframes fade-up{0%{opacity:0}to{opacity:1}}@media (max-width:768px){.project-popup-main{padding:10px}.project-popup-main .left,.project-popup-main .right{width:100%}.project-popup-main .proj-title{font-size:24px}.project-table td,.project-table th{font-size:14px;padding:10px}}@media (max-width:425px){.project-popup-main .proj-title{font-size:20px}.project-popup-main .proj-details{padding:15px}.project-table td,.project-table th{font-size:12px;padding:8px}}.doc-modal-overlay{align-items:center;animation:fade-in .3s ease-out;background-color:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:10px;position:fixed;right:0;top:0;z-index:1000}.doc-modal-content{animation:slide-up .3s ease-out;background-color:#222227;background-color:var(--bg-secondary);border-radius:10px;display:flex;flex-direction:column;gap:15px;height:95vh;min-width:75vw;padding:10px;position:relative;width:95%}.doc-modal-close{background:none;border:none;color:#ddd;color:var(--c-secondary);cursor:pointer;font-size:20px;padding:5px;position:absolute;right:10px;top:10px;transition:color .3s ease;z-index:2}.doc-modal-close:hover,.doc-modal-header{color:#fff;color:var(--c-primary)}.doc-modal-header{padding-top:10px;text-align:center}.doc-modal-header h2{font-size:24px;margin:0}.doc-modal-body{background-color:#25272d;background-color:var(--bg-secondary-hover);border-radius:5px;flex:1 1;min-height:0;overflow:hidden;position:relative}.mobile-pdf-message{color:#fff;color:var(--c-primary);display:flex;flex-direction:column;gap:20px;height:100%;justify-content:center;padding:20px;text-align:center}.mobile-pdf-message p{font-size:16px;line-height:1.5}.mobile-actions{align-items:center;display:flex;flex-direction:column;gap:15px}.mobile-actions .doc-modal-btn{justify-content:center;max-width:300px;width:100%}.doc-pdf-container{height:100%;overflow:hidden;width:100%}.doc-modal-footer{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;padding-top:10px}.doc-modal-btn{align-items:center;background-color:#37e337;background-color:var(--bg-tertiary);border:none;border-radius:5px;color:#fff;color:var(--c-primary);cursor:pointer;display:flex;font-size:16px;gap:8px;padding:10px 20px;transition:background-color .3s ease;white-space:nowrap}.doc-modal-btn:hover{background-color:#0f0;background-color:var(--bg-tertiary-hover)}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.doc-modal-content{height:90vh;padding:15px;width:95%}.doc-modal-header h2{font-size:20px}.doc-modal-btn{font-size:14px;padding:8px 16px}.doc-modal-footer{gap:10px}}@media (max-width:480px){.doc-modal-content{padding:10px}.doc-modal-header h2{font-size:18px}.doc-modal-btn{font-size:13px;padding:6px 12px}.doc-modal-footer{align-items:stretch;flex-direction:column}.doc-modal-btn{justify-content:center;width:100%}}.area{align-items:center;background-color:var(--bg-primary);display:flex;height:100vh;justify-content:center;position:fixed;z-index:-1}.area,.circles{left:0;top:0;width:100%}.circles{height:100%;overflow:hidden;position:absolute}.circles li{animation:animate 15s linear infinite;background:var(--bg-particle-js);bottom:-150px;display:block;height:20px;list-style:none;position:absolute;width:20px}.circles li:first-child{animation-delay:2s;height:80px;left:25%;width:80px}.circles li:nth-child(2){animation-delay:2s;animation-duration:8s;height:30px;left:10%;width:30px}.circles li:nth-child(3){animation-delay:4s;height:20px;left:70%;width:20px}.circles li:nth-child(4){animation-delay:0s;animation-duration:10s;height:60px;left:40%;width:60px}.circles li:nth-child(5){animation-delay:4s;height:20px;left:65%;width:20px}.circles li:nth-child(6){animation-delay:3s;height:110px;left:75%;width:110px}.circles li:nth-child(7){animation-delay:7s;height:150px;left:35%;width:150px}.circles li:nth-child(8){animation-delay:15s;animation-duration:35s;height:25px;left:50%;width:25px}.circles li:nth-child(9){animation-delay:2s;animation-duration:25s;height:35px;left:20%;width:35px}.circles li:nth-child(10){animation-delay:0s;animation-duration:11s;height:150px;left:85%;width:150px}.circles li:nth-child(11){animation-delay:0s;animation-duration:14s;height:80px;left:55%;width:80px}.circles li:nth-child(12){animation-delay:0s;animation-duration:17s;height:60px;left:45%;width:60px}@media(max-width:525px){.circles li:nth-child(10){height:70px;width:70px}.circles li:nth-child(7){height:60px;width:60px}.circles li:nth-child(6){height:70px;width:70px}}@keyframes animate{0%{border-radius:0;opacity:1;transform:translateY(0) rotate(0deg)}to{border-radius:50%;opacity:0;transform:translateY(-1000px) rotate(2turn)}}
/*# sourceMappingURL=main.824667be.css.map*/