ul{list-style:none}a{color:#000;text-decoration:none}body{background-color:#0b0f14;max-width:1200px;margin:0 auto}*,a{color:#e6edf3}.container-main{grid-template-columns:2fr 3fr;justify-content:flex-start;align-items:flex-start;max-width:1200px;margin:0 auto;display:grid}.container-main .container-header{flex-direction:column;justify-content:center;align-items:flex-start;gap:60px;height:100vh;padding:30px;display:flex;position:sticky;top:0}.container-main .container-header .about-me{flex-direction:column;justify-content:center;align-items:flex-start;gap:15px;display:flex}.container-main .container-header .about-me .title{font-size:30px}.container-main .container-header .about-me .title span{font-size:15px;font-weight:500}.container-main .container-header .about-me .job{font-size:20px;font-weight:800}.container-main .container-header .about-me .desc{opacity:.5;font-size:18px;line-height:1.5}.container-main .container-header .container-links{flex-direction:column;justify-content:center;align-items:flex-start;gap:15px;display:flex}.container-main .container-header .container-links .link{text-transform:uppercase;font-size:15px;transition:all .1s}.container-main .container-header .container-links .link:hover{opacity:.1;transition:all .1s}.container-main .social-links{justify-content:center;align-items:flex-start;gap:30px;display:flex}.container-main .social-links li a{opacity:.6;font-size:24px;transition:all .1s}.container-main .social-links li a:hover{opacity:.1;transition:all .1s}.container-main .container-details{flex-direction:column;gap:60px;height:100%;padding:30px 100px;display:flex;overflow-y:auto}.container-main .container-details .container-about{flex-direction:column;justify-content:center;align-items:flex-start;gap:30px;display:flex}.container-main .container-details .container-about p{opacity:.8;font-size:16px;line-height:1.5}.container-main .container-details .container-projects{flex-direction:column;justify-content:center;align-items:flex-start;gap:30px;display:flex}.container-main .container-details .container-projects .container-box{grid-gap:15px;grid-template-columns:2fr 3fr;align-items:start;width:100%;display:grid}.container-main .container-details .container-projects .container-box .banner{object-fit:cover;border-radius:4px;width:100%;height:100px}.container-main .container-details .container-projects .container-box .details{flex-direction:column;justify-content:center;align-items:flex-start;gap:15px;display:flex}.container-main .container-details .container-projects .container-box .details .title{font-size:18px;font-weight:800}.container-main .container-details .container-projects .container-box .details .title i{margin-left:5px;font-size:13.5px}.container-main .container-details .container-projects .container-box .details .desc{opacity:.5;font-size:15px;line-height:1.5}.container-main .container-details .container-projects .link i{color:#3b82f6;margin-left:5px;font-size:13.5px}.container-main .container-details .container-projects .link{color:#3b82f6;font-size:16px;font-weight:600}.container-main footer{border-top:1px solid #393d42;justify-content:space-between;align-items:center;padding:30px 0;display:flex}.container-main footer .copyright-text{font-size:15px;font-weight:600;line-height:1.5}.container-main footer .copyright-text .color{color:#3b82f6;cursor:pointer}.container-main footer .top{background-color:#212326;border:none;border-radius:50%;width:35px;height:35px;font-size:15px}@media (max-width:1200px){.container-main .container-header{justify-content:center}}@media (max-width:1000px){.container-main{flex-direction:column;gap:0;display:flex}.container-main .container-header .container-links{display:none}.container-main .container-header{height:auto;padding:100px;position:static}.container-main .container-details .container-projects .container-box .banner{height:150px}}@media (max-width:900px){.container-main .container-details .container-projects .container-box .banner{height:145px}.container-main .container-header,.container-main .container-details{height:auto;padding:30px;position:static}}@media (max-width:800px){.container-main .container-details .container-projects .container-box .banner{height:135px}}@media (max-width:700px){.container-main .container-details .container-projects .container-box .banner{height:115px}}@media (max-width:550px){.container-main .container-details .container-projects .container-box .banner{height:200px}.container-main .container-details .container-projects .container-box{flex-direction:column;display:flex}}@media (max-width:400px){.container-main .container-details .container-projects .container-box .banner{height:170px}}