*{padding:0;margin:0;box-sizing:border-box}html{background:#151515}#root{display:flex;width:100%;background:#151515}body{display:flex;margin:0}h1,h2,h3,h4,h5,h6{font-family:Audiowide,sans-serif;color:#fff}p{font-family:Genos,sans-serif;font-weight:400;font-style:normal;font-size:1.5rem;color:#fff}.text-hijau{color:#71e01b}.header-title{gap:1rem}.header-title h6{color:#ffffff80}.navbar{position:sticky!important;top:0;z-index:9999;background:#151515}.navbar-toggler{background-color:#fff!important}.nav-content{padding:1rem 10rem}@media (min-width: 0px) and (max-width: 991.98px){.nav-content{padding:1rem 2rem}.navbar-menu__tengah{flex-direction:column}.nav-link{width:100%;text-align:center}}#navbarSupportedContent .nav-link.custom-link{color:#fff;transition:background .5s ease,color .5s ease}#navbarSupportedContent .nav-link.custom-link.active,#navbarSupportedContent .nav-link.custom-link:hover{color:#71e01b}.navbar-nav{display:flex;width:100%;justify-content:space-between;align-items:center;gap:2rem}.nav-item{display:flex;padding:.5rem;align-items:flex-center;gap:.5rem}.nav-link{text-align:center;font-family:Audiowide;font-size:1rem;font-style:normal;font-weight:400;line-height:normal}.connect-button{display:flex;padding:1rem;justify-content:center;align-items:center;font-family:Audiowide;color:#fff;border:none;border-radius:1.875rem;background:#71e01b;transition:background .5s ease,color .5s ease}.connect-button:hover{background:#fff;color:#71e01b}.connect-button:hover a{color:#71e01b}.porto-container{display:flex;width:100%;padding:0 10rem;flex-direction:column;justify-content:center;align-items:center;gap:5rem}@media (min-width: 0px) and (max-width: 991.98px){.porto-container{padding:0 2rem}}.content-hero{display:flex;padding:2.5rem 0rem;flex-direction:column;align-items:center;gap:5rem}.cta-download{gap:2rem}.cta-download__button{display:flex;padding:1rem;justify-content:center;align-items:center;border-radius:1.875rem;border:1px solid rgba(255,255,255,.5);background:#ffffff1a;color:#fff;font-family:Audiowide;transition:background .5s ease,color .5s ease}.cta-download__button:hover{background:#71e01b;color:#fff}.cta-download .sosmed{gap:1rem}.cta-download .social-icon{opacity:1;transition:opacity .5s ease}.cta-download .social-icon:hover{opacity:.3}.top-content{gap:2rem}.item-skill{height:5.5rem;padding:.75rem 0rem;border-radius:1rem}.currently-skill{gap:1.5rem}.currently-skill h6{color:#ffffff80}.card-spotlight{display:flex;width:15rem;height:7.2rem;padding:1rem;align-items:center;gap:1rem;flex-shrink:0;border-radius:1rem;border:1px solid rgba(255,255,255,.5);background:linear-gradient(to bottom right,#0000,#0003 50%) bottom right / 50% 50% no-repeat,linear-gradient(to bottom left,#0000,#0003 50%) bottom left / 50% 50% no-repeat,linear-gradient(to top left,#0000,#0003 50%) top left / 50% 50% no-repeat,linear-gradient(to top right,#0000,#0003 50%) top right / 50% 50% no-repeat,#ffffff1a}.card-spotlight__content{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;flex:1 0 0}.card-spotlight__content p{font-size:1.1rem}.card-spotlight__content h6{color:#fff;font-size:1.1rem}.item-spotlight__list{overflow:hidden}.about-content{gap:.5rem}.about-content h6{color:#ffffff80}.read-aboutme__button{margin-top:2rem}.about-content__text{gap:1rem}.about-me{padding:2.5rem 0;justify-content:space-between;align-items:center;gap:3rem}.my-project{padding:2.5rem 0rem;gap:5rem}.list-project{align-items:flex-start;align-content:flex-start;gap:2.5rem;flex-wrap:wrap}.type-project{padding:.75rem 1rem;border-radius:1.875rem;background:#ffde2533}.tag-project{padding:.75rem 1rem;border-radius:1.875rem;background:#71e01b33}.read-more{width:50%;padding:.75rem 1rem;gap:.25rem;border-radius:1.875rem;border:1px solid rgba(255,255,255,.5);background:#ffffff1a;transition:background .5s ease,color .5s ease}.read-more:hover{background:#71e01b;color:#fff}@media (min-width: 0px) and (max-width: 991.98px){.read-more{width:100%}}.card-project{flex-shrink:0;height:auto;border-radius:1rem;background:#ffffff0d}@media (min-width: 320px) and (max-width: 581.98px){.card-project{height:auto}}.card-project img{flex-shrink:0;border-radius:1rem 1rem 0 0}.title-project{color:#fff;font-family:Genos;font-size:1.75rem;font-style:normal;font-weight:700;line-height:normal}.type-project h6{color:#ffde25;font-size:1rem;font-style:normal;font-weight:400;line-height:normal}.tag-project h6{color:#71e01b;font-size:1rem;font-style:normal;font-weight:400;line-height:normal}.read-more,.see-other{color:#fff;font-size:1rem;font-style:normal;font-weight:400;line-height:normal}.card-project__content{flex-grow:1;flex-wrap:wrap;padding:2rem 1rem;align-items:flex-start;align-content:space-between;gap:2rem;align-self:stretch}.card-project__top{gap:1rem;flex-grow:1}.see-other{display:flex;padding:1rem 2rem;border-radius:1.875rem;border:1px solid rgba(255,255,255,.5);background:#ffffff1a;transition:background .5s ease,color .5s ease}.see-other:hover{background:#71e01b;color:#fff}.ui-exploration{padding:2.5rem 0rem;gap:5rem}.ui-exploration__carousel{border-radius:2rem;max-width:70%;margin:0 auto}@media (max-width: 768px){.ui-exploration__carousel{max-width:100%}}.carousel-inner{transition:opacity .5s linear}.carousel-item{opacity:0}.carousel-item.active{opacity:1}.carousel-item !important{border-radius:2rem;height:auto}.image-carousel{border-radius:2rem;object-fit:cover}.carousel-indicators{display:flex;justify-content:center!important;padding:.5rem 1rem!important;margin:0!important;margin-bottom:1rem!important;width:150px;align-items:center!important;gap:.5rem;left:5%!important;border-radius:1.5rem;background:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.carousel-indicators button{background-color:#fff!important;border:none!important;width:12px!important;height:12px!important;border-radius:5rem!important}.carousel-control-next{position:absolute;top:50%;transform:translateY(-50%);z-index:2;display:flex;align-items:center;justify-content:center;width:5%;height:100%;background-color:#ff000080}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-control-prev img,.carousel-control-next img{width:100%}.working-experience{padding:2.5rem 0rem;gap:5rem}.working-experience__content{gap:2.5rem}.list-experience{align-items:flex-start;gap:4rem}.experience-item{gap:2.5rem;flex:1 0 0}@media (min-width: 0px) and (max-width: 767.98px){.experience-item{flex-direction:column;gap:1rem}.list-experience{gap:2.5rem}}.left-content{display:flex;width:15.5625rem;flex-direction:column;align-items:flex-start;gap:.5rem}.left-content p{color:#fff;font-family:Genos;font-size:1.5rem;font-style:normal;font-weight:400;line-height:normal}.right-content{display:flex;flex-direction:column;align-items:flex-start;gap:1rem;flex:1 0 0}.right-content__title{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;align-self:stretch}.right-content__title h6{color:#fff;font-family:Genos;font-size:1.5rem;font-style:normal;font-weight:700;line-height:normal}.right-content li{color:#ffffffb3;font-family:Genos;font-size:1.3rem;font-style:normal;font-weight:400;line-height:normal}.right-content__title p{color:#fff;font-family:Genos;font-size:1.5rem;font-style:normal;font-weight:400;line-height:normal}@media (min-width: 0px) and (max-width: 1439.98px){.working-experience__content img{display:none}}.lets-connect{display:flex;padding:2.5rem 0rem;flex-direction:column;justify-content:center;align-items:center;gap:2.5rem}.temp-button{display:flex;padding:1rem;justify-content:center;align-items:center;gap:.5rem;color:#fff;border-radius:1.875rem;border:1px solid rgba(255,255,255,.5);background:#ffffff1a;transition:background .5s ease,color .5s ease}.temp-button:hover{background:#71e01b;color:#fff}.temp-button p{color:inherit;font-family:Audiowide;font-size:1rem;font-style:normal;font-weight:400;line-height:normal}.footer{display:flex;padding:2.5rem 10rem;flex-direction:column;justify-content:center;align-items:center}.footer-content{display:flex;width:100%;padding:2.5rem 0rem;justify-content:space-between;align-items:center;border-top:1px solid rgba(255,255,255,.1)}.footer-content p{color:#fff;font-family:Genos;font-size:1.5rem;font-style:normal;font-weight:400;line-height:normal}@media (min-width: 0px) and (max-width: 991.98px){.footer-content{flex-direction:column;gap:1rem}}@media (min-width: 0px) and (max-width: 650px){.footer{padding:2.5rem 0rem}}
