body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{margin:0;overflow-x:hidden;padding:0;scroll-behavior:smooth;word-spacing:2px}body{background-color:#152238;font-family:Roboto,sans-serif}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.navbar{align-items:center;background-color:#1c2e4a;display:flex;height:75px;justify-content:center;left:0;padding:0 20px;position:fixed;right:0;z-index:99999999999}@media(max-width:1024px){.navbar{display:none}}.navbar .width-navbar{justify-content:space-between;width:1424px}.navbar .width-navbar,.navbar .width-navbar .column-kiri-navbar{align-items:center;display:flex}.navbar .width-navbar .column-kiri-navbar .btn-title-navbar{background-color:#0000;border:none;cursor:pointer;outline:none;text-decoration:none}.navbar .width-navbar .column-kiri-navbar .btn-title-navbar .title-navbar{border-right:1px solid hsla(0,0%,100%,.463);color:#fff;font-family:Roboto,sans-serif;font-size:18px;letter-spacing:.5px;margin-right:15px;padding:5px 15px 5px 0}.navbar .width-navbar .column-kiri-navbar .menu-navbar{display:flex;list-style:none}.navbar .width-navbar .column-kiri-navbar .menu-navbar .list-menu-navbar{align-items:center;display:flex}.navbar .width-navbar .column-kiri-navbar .menu-navbar .list-menu-navbar .name-menu{color:#fff;font-size:14px;letter-spacing:.5px;margin-right:15px;opacity:.7;text-decoration:none;transition:.2s ease-in-out}.navbar .width-navbar .column-kiri-navbar .menu-navbar .list-menu-navbar .name-menu:hover{opacity:1}.navbar .width-navbar .column-kanan-navbar{display:flex}.navbar .width-navbar .column-kanan-navbar .button-hire-me{align-items:center;border-radius:3px;color:#fff;display:flex;font-size:16px;letter-spacing:.5px;opacity:.7;padding:7px 12px;text-decoration:none;transition:.2s ease-in-out}.navbar .width-navbar .column-kanan-navbar .button-hire-me:hover{background-color:hsla(0,0%,100%,.122)}.navbar .width-navbar .column-kanan-navbar .button-hire-me i{font-size:14px;margin-left:10px;overflow:hidden}.navbar-mobile{background-color:#1c2e4a;display:none;flex-direction:column;height:auto;left:0;padding:20px 20px 10px;position:fixed;right:0;transition:.2s ease-in-out;z-index:99999999999}@media(max-width:1024px){.navbar-mobile{display:flex}}.navbar-mobile .column-atas-navbar-mobile{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-between;width:100%}.navbar-mobile .column-atas-navbar-mobile .btn-title-navbar{background-color:#0000;border:none;cursor:pointer;outline:none}.navbar-mobile .column-atas-navbar-mobile .btn-title-navbar .title-navbar{color:#fff;font-family:Roboto,sans-serif;font-size:18px;letter-spacing:.5px;margin-right:15px;padding:5px 0;text-align:start}@media(max-width:315px){.navbar-mobile .column-atas-navbar-mobile .btn-title-navbar .title-navbar{font-size:14px}}.navbar-mobile .column-atas-navbar-mobile .not-active{color:#fff;font-size:30px;opacity:.7;padding:2px;transition:.2s ease-in-out}.navbar-mobile .column-atas-navbar-mobile .not-active:hover{opacity:1}@media(max-width:315px){.navbar-mobile .column-atas-navbar-mobile .not-active{font-size:20px}}.navbar-mobile .column-atas-navbar-mobile .btn-active{color:#fff;font-size:30px;padding:2px}@media(max-width:315px){.navbar-mobile .column-atas-navbar-mobile .btn-active{font-size:20px}}.navbar-mobile .container-navbar-collapse-mobile{display:flex}.navbar-mobile .container-navbar-collapse-mobile .navbar-mobile-collapse{display:flex;flex-direction:column;height:0;margin-top:10px;overflow:hidden;transition:.2s ease-in-out}.navbar-mobile .container-navbar-collapse-mobile .navbar-mobile-collapse .list-menu-navbar{align-items:center;display:flex;margin-top:10px;overflow:hidden}.navbar-mobile .container-navbar-collapse-mobile .navbar-mobile-collapse .list-menu-navbar .name-menu{color:#fff;font-size:13px;letter-spacing:.5px;margin-right:15px;opacity:.7;overflow:hidden;text-decoration:none;transition:.2s ease-in-out}.navbar-mobile .container-navbar-collapse-mobile .navbar-mobile-collapse .list-menu-navbar .name-menu:hover{opacity:1}.navbar-mobile .container-navbar-collapse-mobile .navbar-mobile-collapse .list-menu-navbar .button-hire-me{align-items:center;border-radius:3px;color:#fff;display:flex;font-size:14px;letter-spacing:.5px;opacity:.7;overflow:hidden;padding:7px 12px;text-decoration:none;transition:.2s ease-in-out}.navbar-mobile .container-navbar-collapse-mobile .navbar-mobile-collapse .list-menu-navbar .button-hire-me:hover{background-color:hsla(0,0%,100%,.122)}.navbar-mobile .container-navbar-collapse-mobile .navbar-mobile-collapse .list-menu-navbar .button-hire-me i{font-size:14px;margin-left:10px;overflow:hidden}.aplikasi{display:flex;justify-content:center;padding:80px 20px 0}.aplikasi .width-aplikasi{display:flex;flex-direction:column;justify-content:center;padding:0 100px;width:1424px}@media(max-width:860px){.aplikasi .width-aplikasi{padding:0}}.aplikasi .width-aplikasi i{color:#fff;font-size:25px;opacity:.7;overflow:hidden}.aplikasi .width-aplikasi .title-aplikasi{color:#fff;font-size:30px;margin:30px 0 20px;text-align:center}.aplikasi .width-aplikasi .deskripsi-aplikasi{color:#fff;display:flex;font-size:14px;letter-spacing:.5px;line-height:1.8;margin:0 auto;opacity:.7;text-align:justify;width:70%}@media(max-width:468px){.aplikasi .width-aplikasi .deskripsi-aplikasi{width:auto}}.aplikasi .width-aplikasi .column-card-aplikasi{display:flex;flex-wrap:wrap;justify-content:center;margin-top:60px}@media(max-width:860px){.aplikasi .width-aplikasi .column-card-aplikasi{flex-direction:column}}.card{display:flex;margin:15px;overflow:hidden;position:relative;width:45%}@media(max-width:860px){.card{margin:15px 0;width:100%}}.card .video-aplikasi{max-height:400px}.card .tools{display:flex;flex-wrap:wrap;gap:5px;justify-content:center}.card .language-title{color:#fff;margin:5px auto;text-align:center}.card .hover-card{background-color:#152238;border:5px solid #1c2e4a;bottom:0;display:none;flex-direction:column;justify-content:center;left:0;padding:40px 30px;position:absolute;right:0;top:0}@media(max-width:680px){.card .hover-card{padding:20px}}.card .hover-card .content-card .title-component{color:aqua;font-size:14px;letter-spacing:.5px;overflow:hidden;text-align:center}.card .hover-card .content-card .teknikal-btn{color:aqua;font-size:13px;letter-spacing:.5px;margin:5px 0;overflow:hidden;text-align:center}.card .hover-card .content-card .title-aplikasi-card{color:#fff;font-size:16px;margin:10px 0 5px;overflow:hidden;text-align:center}.card .hover-card .content-card .deskripsi-aplikasi-card{color:#fff;font-size:14px;letter-spacing:.5px;line-height:1.5;overflow:hidden}.card .hover-card .content-card .btn-github{cursor:pointer;overflow:hidden;text-decoration:none}.card .hover-card .content-card .btn-github .img-github{border-radius:500px;margin:15px auto;width:30px}.card .hover-card .content-card::-webkit-scrollbar{width:3px}.card .hover-card .content-card::-webkit-scrollbar-track{border-radius:5px}.card .hover-card .content-card::-webkit-scrollbar-thumb{background-color:aqua;border-radius:5px}.career{display:flex;justify-content:center;padding-top:80px}.career .width-career{display:flex;flex-direction:column;padding:0 100px;width:1424px}@media(max-width:860px){.career .width-career{padding:0 20px}}.career .width-career i{color:#fff;font-size:25px;opacity:.7;overflow:hidden}.career .width-career .title-career{color:#fff;font-size:30px;margin:30px 0 20px;text-align:center}.career .width-career .deskripsi-career{color:#fff;display:flex;flex-direction:column;font-size:14px;letter-spacing:.5px;line-height:1.8;margin:0 auto;text-align:justify;width:70%}@media(max-width:468px){.career .width-career .deskripsi-career{width:auto}}.career .width-career .column-list-career{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;list-style:none;margin-top:60px}.career .width-career .column-list-career .list-career{display:flex;max-width:80px}.kontak{display:flex;justify-content:center;padding:80px 20px}.kontak .width-kontak{display:flex;justify-content:space-between;width:1424px}@media(max-width:768px){.kontak .width-kontak{flex-direction:column;justify-content:flex-start}}.kontak .width-kontak .wrapp-google-maps{border-radius:10px;display:flex;margin-right:40px;width:60%}@media(max-width:768px){.kontak .width-kontak .wrapp-google-maps{height:300px;margin-bottom:30px;margin-right:0;width:auto}}.kontak .width-kontak .form-kontak{display:flex;flex-direction:column;width:40%}@media(max-width:768px){.kontak .width-kontak .form-kontak{width:auto}}.kontak .width-kontak .form-kontak .title-kontak{color:#fff;font-size:30px;text-align:start}.kontak .width-kontak .form-kontak .deskripsi-kontak{color:#fff;display:flex;font-size:14px;letter-spacing:.5px;line-height:1.8;margin:10px 0 20px;opacity:.7;text-align:start}.kontak .width-kontak .form-kontak .column-input{display:flex;flex-direction:column;margin-top:20px}.kontak .width-kontak .form-kontak .column-input .label-input{color:#fff;font-size:13px;letter-spacing:.5px;margin-bottom:5px;opacity:.7;text-align:start}.kontak .width-kontak .form-kontak .column-input .input{background-color:#1c2e4a;border:1px solid hsla(0,0%,100%,.156);border-radius:3px;color:#fff;font-family:Roboto,sans-serif;font-size:14px;outline:none;padding:8px 13px;resize:none;width:auto}.kontak .width-kontak .form-kontak .column-input .error-message{color:red;font-size:13px;margin-top:5px;text-align:start;transition:.2s ease-in-out}.kontak .width-kontak .form-kontak .btn-submit{background-color:#06a94d;border:none;border-radius:3px;color:#fff;cursor:pointer;font-size:16px;margin-top:20px;outline:none;overflow:hidden;padding:12px 25px;position:relative;text-decoration:none;transition:.2s ease-in-out}.kontak .width-kontak .form-kontak .btn-submit:hover{background-color:rgba(6,169,77,.635)}.kontak .width-kontak .form-kontak .btn-submit .loading-submit{align-items:center;background-color:#06a94d;border-radius:3px;bottom:0;cursor:not-allowed;display:none;justify-content:center;left:0;position:absolute;right:0;top:0}.kontak .width-kontak .form-kontak .btn-submit .loading-submit:hover{background-color:#06a94d}.kontak .width-kontak .form-kontak .btn-submit .loading-submit .circle-loading-submit{animation:loading .6s ease infinite;border:2px solid #fff;border-radius:500px;border-top-color:#06a94d;height:25px;transform:rotate(0deg);width:25px}@keyframes loading{to{transform:rotate(1turn)}}.organisasi{display:flex;justify-content:center;padding-top:80px}.organisasi .width-organisasi{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:0 100px;width:1424px}@media(max-width:860px){.organisasi .width-organisasi{padding:0 20px}}.organisasi .width-organisasi i{color:#fff;font-size:25px;opacity:.7;overflow:hidden}.organisasi .width-organisasi .title-organisasi{color:#fff;font-size:30px;margin:30px 0 20px;text-align:center}.organisasi .width-organisasi .deskripsi-organisasi{color:#fff;display:flex;font-size:14px;justify-content:center;letter-spacing:.5px;line-height:1.8;margin:0 auto;opacity:.7;text-align:center;width:70%}@media(max-width:468px){.organisasi .width-organisasi .deskripsi-organisasi{width:auto}}.organisasi .width-organisasi .column-list-organisasi{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;list-style:none;margin-top:60px}.organisasi .width-organisasi .column-list-organisasi .list-organisasi{display:flex;max-width:80px}.profile{display:flex;justify-content:center;margin-top:40px;padding:40px 20px}.profile .width-profile{display:flex;justify-content:space-between;padding-top:40px;width:1424px}@media(max-width:768px){.profile .width-profile{flex-direction:column;justify-content:flex-start;padding-top:0}}.profile .width-profile .column-kiri-profile{display:flex;flex-direction:column;width:100%}@media(max-width:768px){.profile .width-profile .column-kiri-profile{width:auto}}.profile .width-profile .column-kiri-profile .column-profile{align-items:center;display:flex;gap:20px;margin-top:20px}@media(max-width:768px){.profile .width-profile .column-kiri-profile .column-profile{gap:10px}}.profile .width-profile .column-kiri-profile .column-profile .me{border-radius:50%;height:150px;object-fit:cover;width:150px}@media(max-width:768px){.profile .width-profile .column-kiri-profile .column-profile .me{height:60px;width:60px}}.profile .width-profile .column-kiri-profile .title-profile{color:#fff;font-size:30px;letter-spacing:1.5px;text-align:start}@media(max-width:768px){.profile .width-profile .column-kiri-profile .title-profile{font-size:18px}}.profile .width-profile .column-kiri-profile .deskripsi-profile{color:#fff;font-size:14px;letter-spacing:.5px;line-height:1.8;margin:20px 0 30px;opacity:.7;text-align:start;width:80%}@media(max-width:768px){.profile .width-profile .column-kiri-profile .deskripsi-profile{width:100%}}.profile .width-profile .column-kiri-profile .column-btn-profile{display:flex;flex-wrap:wrap}.profile .width-profile .column-kiri-profile .column-btn-profile .btn-profile{border:none;border-radius:3px;color:#fff;cursor:pointer;font-size:16px;margin-right:15px;margin-top:10px;outline:none;overflow:hidden;padding:12px 25px;text-decoration:none;transition:.2s ease-in-out}.profile .width-profile .column-kiri-profile .column-btn-profile .btn-work{background-color:#06a94d}.profile .width-profile .column-kiri-profile .column-btn-profile .btn-work:hover{background-color:rgba(6,169,77,.635)}.profile .width-profile .column-kiri-profile .column-btn-profile .btn-projek{background-color:#1c2e4a;color:hsla(0,0%,100%,.707)}.profile .width-profile .column-kiri-profile .column-btn-profile .btn-projek:hover{background-color:hsla(0,0%,100%,.105);color:#fff}.profile .width-profile .img-profile{max-width:35%}@media(max-width:768px){.profile .width-profile .img-profile{margin-top:60px;max-width:100%}}.skills{display:flex;justify-content:center;padding-top:80px}.skills .width-skills{display:flex;flex-direction:column;padding:0 100px;width:1424px}@media(max-width:860px){.skills .width-skills{padding:0 20px}}.skills .width-skills i{color:#fff;font-size:25px;opacity:.7;overflow:hidden}.skills .width-skills .title-skills{color:#fff;font-size:30px;margin:30px 0 20px;text-align:center}.skills .width-skills .deskripsi-skills{color:#fff;font-size:14px;letter-spacing:.1px;line-height:1.8;margin:0 auto;opacity:.7;text-align:justify;width:70%}@media(max-width:468px){.skills .width-skills .deskripsi-skills{width:auto}}.skills .width-skills .column-list-skills{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;list-style:none;margin-top:60px}.skills .width-skills .column-list-skills .list-skills{display:flex;max-width:80px}.skills .width-skills .column-list-skills-text{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;list-style:none;margin-top:60px}.skills .width-skills .column-list-skills-text .list-skills-text{background-color:#ffffff0d;border:1px solid #ffffff1a;border-radius:20px;color:#fff;font-size:14px;font-weight:500;padding:10px 20px;transition:all .3s ease}.skills .width-skills .column-list-skills-text .list-skills-text:hover{background-color:#ffffff1a;box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}
/*# sourceMappingURL=main.a58ed6be.css.map*/