.Card{width:162px;height:120px;margin:5px;background-color:#242424;border-radius:10px;transition:all .3s ease}#thing{width:100%;height:40px;margin:15px;display:flex;align-items:center}#thing p{font-size:20px;margin-top:6px;color:#c1c1c1}.image{text-align:center;font-size:20px;margin-top:6px;color:#c1c1c1}.contact-btn{font-size:15px;font-weight:200;width:150px;height:35px;margin-top:10px;background-color:#8c21d3;border:none;border-radius:6px;color:#c1c1c1;margin-right:15px;cursor:pointer}.Card:hover{border:1.3px solid #a273c2}#thing{width:80%;height:40px;margin:15px;display:flex;justify-content:space-between}#Intro{border-radius:6px;padding:15px;width:70%;background-color:#242424}#Intro:hover{border:1px solid #a273c2}#Intro p{padding-left:20px}#name:hover{color:#a66bce}#contact-me{background-color:#242424;border-radius:8px;width:95%;max-width:1000px;margin:30px auto 0;padding:20px;display:flex;flex-direction:column;align-items:center}.abo{display:flex;flex-direction:row;justify-content:space-evenly;align-items:flex-start;gap:20px;width:100%;padding:20px 10px 10px;flex-wrap:wrap}.input-box{display:flex;flex-direction:column;gap:15px;width:100%;max-width:400px;align-items:flex-start}.input-box input,.input-box textarea{height:40px;width:100%;background-color:transparent;border:1px solid #8c21d3ff;padding:5px;border-radius:4px;color:#8c21d3;font-size:14px;resize:none;box-sizing:border-box}.input-box input:focus,.input-box textarea:focus{color:#fff;border:2px solid #8c21d3ff;outline:none}.contact-btn,#contact-me button{font-size:15px;font-weight:200;width:150px;height:35px;margin-top:10px;background-color:#8c21d3;border:none;border-radius:6px;color:#c1c1c1;margin-left:0;cursor:pointer}.msg{width:100%;max-width:390px}#msg{width:100%;height:225px;background-color:transparent;border:1px solid #8c21d3ff;border-radius:4px;color:#8c21d3;padding:5px;font-size:14px;resize:none}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}@media screen and (max-width: 1024px){.abo{flex-direction:column;align-items:center}.input-box,.msg{width:90%;max-width:100%}#msg{height:200px}#contact-me button{width:100%}}@media screen and (max-width: 480px){#contact-me{padding:15px 10px}#msg{max-width:400px;margin-right:5px}.input-box,.msg{width:95%}input,textarea{font-size:13px}#msg{height:180px}.contact-btn,#contact-me button{width:100%}}@media screen and (max-width: 320px){.input-box,.msg{max-width:260px}#msg{height:160px}}#About{width:100%;display:flex;flex-direction:column}#about{border-radius:14px;font-family:Segoe UI,sans-serif;color:#727272;font-size:16px;font-weight:100;width:100%;background-color:#242424;box-sizing:border-box;padding:15px}@media screen and (max-width: 768px){#about{width:100%;font-size:15px}}@media screen and (max-width: 480px){#about{width:100%;font-size:14px;padding:12px}#About p:first-child{font-size:13px;text-align:center}}@media screen and (max-width: 360px){#about{width:100%;font-size:13px;padding:10px}}.skills-timeline-container{height:max-content;width:100%;max-width:850px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.skills-timeline{border-radius:8px;max-width:850px;background-color:#242424;margin:0;position:relative}.timeline-title{color:#c1c1c1;font-size:20px;font-weight:300;text-align:center;margin:25px 0}.timeline-title:hover{color:#a432f0}.timeline-content{position:relative;padding-left:40px;margin-right:15px}.timeline-content:before{content:"";position:absolute;left:30px;top:0;bottom:0;width:.1px;background:#a432f0;border-radius:2px}.timeline-item{height:140px;position:relative;margin-bottom:3rem;padding-left:40px}.timeline-dot{position:absolute;left:-15px;top:8px;width:10px;height:10px;background:#a432f0;border-radius:50%}.timeline-content-item{width:fit-content;background:#2d2d2dcc;padding:1.5rem;border-radius:12px;border:1px solid rgba(168,85,247,.2)}.timeline-content-item:hover{border:1px solid #a432f0ff}.skill-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;flex-wrap:wrap;gap:.5rem}.skill-title{color:#a432f0;font-size:15px;font-weight:400;margin:0}.skill-level{padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.skill-level.basic{background:#ef444433;color:#ef4444;border:1px solid rgba(239,68,68,.3)}.skill-level.intermediate{background:#f59e0b33;color:#f59e0b;border:1px solid rgba(245,158,11,.3)}.skill-level.advanced{background:#22c55e33;color:#22c55e;border:1px solid rgba(34,197,94,.3)}.skill-date{color:#9ca3af;font-size:13px;opacity:.8;margin-top:-11px}.skill-description{color:#d1d5db;line-height:1.4;margin:0;font-size:13px}@media screen and (max-width: 1024px){.skills-timeline-container{width:90%}}@media screen and (max-width: 768px){.skills-timeline-container{width:95%;padding:15px}.timeline-title{font-size:18px}.timeline-item{height:auto}.timeline-content-item{padding:1rem}.skill-title{font-size:14px}.skill-description{font-size:12px}}@media screen and (max-width: 480px){.skills-timeline-container{width:90%}.timeline-title{font-size:16px}.timeline-dot{left:-18px}.timeline-content{padding-left:30px}.timeline-content:before{left:20px}.timeline-item{padding-left:30px;margin-bottom:2rem}.skill-title{font-size:13px}.skill-level{font-size:12px;font-weight:500}.skill-description{font-size:12px}.timeline-dot{left:-15px}}@media screen and (max-width: 390px){.skills-timeline-container{width:fit-content}}@media screen and (max-width: 320px){.timeline-title{font-size:13px;font-weight:300}.skill-title{font-size:12px}.skill-level{font-size:11px;padding:.2rem .5rem}.skill-description{font-size:11px}.skills-timeline-container{padding:8px;width:fit-content}}.skills-heading{color:#a432f0;font-size:14px;opacity:.7;margin-bottom:10px}.skills-container{display:flex;justify-content:center;width:100%;max-width:770px;overflow:hidden;margin:0 auto;transition:all .3s ease-in-out}.skills-slider{width:min-content}.skills-track{display:flex;transition:transform .5s ease-in-out}.skill-box{width:100%;min-width:200px;height:80px;display:flex;flex-direction:column;align-items:center;background-color:#1e1e1e;border-radius:12px;margin-right:10px;padding:10px;box-shadow:0 2px 8px #0000004d;text-align:center;transition:border .3s ease}.skill-box:hover{border:2px solid #a273c2}.skill-icon-wrapper{font-size:32px;margin-bottom:8px}.skill-name{font-size:16px;color:#fff;padding-bottom:25px}@media screen and (max-width: 1440px){.skills-container{width:860px}}@media screen and (max-width: 1024px){.skills-container{width:100%;max-width:860px}}@media screen and (max-width: 768px){.skills-container{width:100%;max-width:650px;justify-content:flex-start}.skill-box{width:100px;height:100px}.skill-icon-wrapper{font-size:28px}.skill-name{font-size:18px}}@media screen and (max-width: 480px){.skills-container{width:100%;max-width:370px;justify-content:flex-start}.skill-box{width:140px;min-width:140px;height:80px;margin-right:8px}.skill-icon-wrapper{font-size:24px}.skill-name{font-size:13px}}@media screen and (max-width: 390px){.skills-container{width:100%;max-width:300px;justify-content:flex-start}}@media screen and (max-width: 320px){.skills-container{width:100%;max-width:240px}}body{background-color:#121212;font-family:Segoe UI,sans-serif;color:#fff;margin:0;padding:0}#ProfileDiv{position:relative;display:flex;justify-content:center;padding:20px;gap:20px;margin-right:10px}#FirstDiv{width:35%;display:flex;flex-direction:column;/}#SecondDiv{width:65%;margin-right:10px}.Pcard{position:sticky;top:20px;z-index:10;display:flex;flex-direction:column;align-items:center;height:auto;width:350px;border-radius:16px;background-color:#242424;margin-bottom:20px;padding:20px}#info{padding-top:15px;display:flex;flex-direction:column;align-items:center;width:100%}#pic{margin-top:15px;height:100px;width:100px;border-radius:50%;overflow:hidden;border:2px solid #8c21d3ff;margin-bottom:10px}#pic img{width:100%;height:100%;object-fit:cover}#info #name{font-size:16px;color:#c1c1c1}#info p{font-size:14px;margin:0;color:#727272}#links{margin-top:30px;margin-left:20px;width:290px}#links ul{list-style:none;padding:0;margin:0}#links li{margin:10px 0;border-bottom:.1px solid #3c3c3c;padding-bottom:8px;font-size:14px;transition:color .3s;cursor:pointer}#links li:hover{color:#a273c2}#links a{text-decoration:none;color:#c1c1c1;font-size:14px;transition:color .3s}#links a:hover{color:#8c21d3}@media screen and (max-width: 1195px){#ProfileDiv{flex-direction:column;align-items:center}#FirstDiv,#SecondDiv{width:100%;margin-right:0}.Pcard{width:94%;margin:auto}}#links{width:90%;margin-left:0}@media screen and (max-width: 768px){.Pcard{width:94%;padding:15px}#SecPart{width:fit-content;margin-left:20px}#links{width:100%}#links li{font-size:13px}#info #name{font-size:15px}#info p{font-size:13px}}@media screen and (max-width: 480px){#ProfileDiv{padding:10px}#SecPart{width:fit-content;margin-left:20px}.Pcard{padding:10px;width:100%}#links{margin-top:20px}#pic{height:80px;width:80px}#info #name{font-size:14px}#info p,#links li{font-size:12px}}@media screen and (max-width: 480px){#SecPart{width:400px;/}}@media screen and (max-width: 480px){#SecPart{width:400px;margin-left:20px}.Pcard{width:100%;max-width:430px}}@media screen and (max-width: 448px){.Pcard{width:100%;max-width:410px}}@media screen and (max-width: 408px){.Pcard{width:360px}}@media screen and (max-width: 390px){.Pcard{width:330px}#SecPart{width:300px;margin-left:20px}#about{width:20px}}@media screen and (max-width: 340px){.Pcard{width:290px}}@media screen and (max-width: 320px){#SecPart{width:280px}.Pcard{width:260px;padding:20px}}.LatestProj{display:flex;justify-content:flex-start;margin-top:20px;font-size:16px;color:#c1c1c1;flex-direction:column;width:100%;box-sizing:border-box}.LatestProj details div{background-color:#242424;border-radius:6px;margin-top:15px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;box-sizing:border-box}.LatestProj button{margin-right:10px;height:28px;width:100px;background-color:#a432f0;color:#fff;border:none;border-radius:6px;margin-top:13px;font-weight:300;cursor:pointer;transition:.2s}.LatestProj button:hover{opacity:.9}.LatestProj details{background-color:#242424;height:auto;padding-left:8px;padding-top:8px;padding-bottom:8px;width:99%;border-radius:6px;cursor:pointer;font-size:16px}@media screen and (max-width: 1024px){.LatestProj details{width:99%}}@media screen and (max-width: 768px){.LatestProj details{width:99%}.LatestProj details>div{flex-direction:column;align-items:flex-start}.LatestProj button{width:100%;margin-right:0}}@media screen and (max-width: 480px){.LatestProj{font-size:14px;padding:0 10px}.LatestProj details{font-size:14px;padding:10px;margin-left:0;width:98%}.LatestProj details>div{padding:10px;margin-left:0}.LatestProj button{width:100%;font-size:14px}}@media screen and (max-width: 380px){.LatestProj details{max-width:330px;width:99%}.LatestProj button,.LatestProj{font-size:13px}}@media screen and (max-width: 320px){.LatestProj details{max-width:270px;width:100%;padding:8px}.LatestProj details>div{padding:8px}.LatestProj button{font-size:12.5px;height:26px}}@media screen and (max-width: 320px){.Card{width:142px;height:110px;margin-right:px}#thing{width:100%;height:30px}#thing p{font-size:15px;margin-top:4px}.image{font-size:15px;margin-top:5px;margin-right:28px}.contact-btn{font-size:15px;font-weight:100;width:130px;height:25px;margin-top:10px;margin-left:15px}}
