body{padding:0;margin:0;box-sizing:border-box}.app{display:flex;flex-direction:column;height:100vh}.outlet{flex:1;overflow:auto}.projects-con{margin:20px;justify-content:center!important;gap:50px!important}.projects-title{font-size:2rem!important;color:#2c3e50;font-weight:700}.project-card-container{position:relative;max-width:300px;max-height:350px;margin-top:10px}.project-det-con{height:100%;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;border-radius:0!important;box-shadow:0!important;border:1px solid #2c3e50;padding:10px;position:relative;overflow:hidden}.project-img-con{height:200px;width:200px}.project-img-con img{width:100%;height:100%}.project-name{font-size:1.2rem;font-weight:700;color:#e74c3b;padding-bottom:10px!important}a{text-decoration:none;color:#2c3e50}.button-con{display:flex;justify-content:center;align-items:center;flex-direction:row;gap:10px}.project-btn{border-radius:0!important;border:1px solid #2c3e50;padding:.5rem 1rem!important;font-size:.8rem!important;font-size:15px!important}.project-skills-con{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#d1d9e1cc;color:#2c3e50;font-size:1rem;opacity:0;transition:opacity .5s ease;z-index:1;text-align:center}.project-skills-con span{margin:10px}.project-card-container:hover .project-skills-con{opacity:1}.button-con{position:relative;z-index:2}.skill-title{font-size:2rem!important;font-family:Poppins,sans-serif!important;font-weight:700!important;color:#e74c3b}.skill-box{background-color:#ecf0f1}.skill-main-box{background-color:#ecf0f1;padding-top:15px;padding-bottom:15px}.skill-card-con{display:flex!important;justify-content:center!important;flex-direction:row!important;align-items:center!important;gap:20px;padding:20px 20px 30px;overflow-x:auto;scroll-behavior:smooth}.skill-card-con::-webkit-scrollbar{height:3px}.skill-card-con::-webkit-scrollbar-track{background:#f1f1f1}.skill-card-con::-webkit-scrollbar-thumb{background:#e74c3b}.skill-card-con::-webkit-scrollbar-thumb:hover{background:#555}@media (max-width:1100px){.skill-card-con{justify-content:flex-start!important}}.skill-paper{height:100px!important;width:100px!important;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:10px;box-shadow:none!important}.skill-img-con{height:50px;width:50px}.skill-img-con img{width:100%}.skill-name{font-size:12px!important;font-weight:700!important}@media (max-width:500px){.skill-paper{height:100px!important;width:100px!important}}.content-box{position:absolute;top:50%;transform:translatey(-50%);justify-content:center}.about-box{height:100%;width:100%}@media (max-width :1000px){.content-box{flex-direction:column!important;justify-content:center;align-items:center}.first-row{gap:50px!important}}.intro-content{display:flex;justify-content:center;align-items:flex-start}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn 2s ease-in-out}.name{font-size:2.5rem!important;font-weight:600!important;width:100%;color:#e74c3c}.role{font-size:3rem!important;font-weight:600!important;color:#2c3e50}.into-txt-box{display:flex;justify-content:center;text-align:left!important;flex-direction:column}.text{font-family:Poppins,sans-serif!important}.words{font-style:italic!important;font-size:1.5rem!important;color:#f87e62;padding-top:15px}.connect{font-size:1.5rem!important;color:#f87e62}@media (max-width :500px){.name{font-size:1.5rem!important}.role{font-size:2rem!important}}@media (max-width :350px){.into-txt-box{margin:30px}}.intro-btns{width:100%}.button{display:inline-block;padding:.75rem 1.25rem;margin-top:20px;color:#2c3e50;text-transform:uppercase;font-size:1rem;letter-spacing:.15rem;transition:all .3s;position:relative;overflow:hidden;z-index:1;text-decoration:none;border:1px solid #2C3E50}.button:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:100%;z-index:-2}.button:before{content:"";position:absolute;bottom:0;left:0;width:0%;height:100%;background-color:#e74c3c;transition:all .3s;z-index:-1}.button:hover{color:#fff}.button:hover:before{width:100%}.responsive-image{width:100%;height:auto;max-width:100%}.intro-image-con{justify-content:center!important}.intro-texts{font-size:1.5rem!important;font-weight:700!important}.contact-con p{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif}.contact-con{height:100%;width:100%}.contact-first{font-size:3rem!important;font-weight:700!important;color:#e74c49!important}.contact-sec{font-size:2rem!important;font-weight:700!important;color:#2c3e50!important}.contact-txt-con{position:absolute;top:40%;transform:translatey(-50%);width:100%;text-align:center;display:flex;justify-content:center;align-items:center;flex-direction:column}.icon-box{height:30px;width:30px}.socials-box{margin-top:30px;display:flex!important;justify-content:center!important;align-items:center!important;flex-direction:row!important;gap:25px}.icon-box img{height:100%;width:100%;cursor:pointer;background-color:#ecf0f1!important;padding:5px;border-radius:40px}.header-con{box-shadow:none!important}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif}