:root{--body-font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--display-font:Constantia,'Lucida Bright',Lucidabright,'Lucida Serif',Lucida,'DejaVu Serif','Bitstream Vera Serif','Liberation Serif',Georgia,serif;--mono-font:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--max-width:768px;--primary-color:#2196f3;--shading-color:#0d47a1;--success-color:#4CAF50;--danger-color:#F44336;--main-colors:#424242;--link-colors:#616161;--link-hover-colors:var(--primary-color);--text-colors:#424242;--text:#000000d6;--alt-text:#616161;--link:#757575;--main-bg:#e0e0e0;--bg:#f1f1f1;--accent:#fafafa;--image-filter:grayscale(.5)}:root article img{filter:var(--image-filter);transition:.2s}:root article img:hover{filter:unset}:root article a:focus-within .item img{filter:unset}@media(prefers-color-scheme:dark){:root{--main-colors:#F5F5F5;--link-colors:#E0E0E0;--text-colors:#EEEEEE;--text:#ffffffd6;--alt-text:#616161;--link:#757575;--main-bg:#616161;--bg:#424242;--accent:#212121}:root article img{filter:var(--image-filter);transition:.2s}:root article img:hover{filter:unset}:root article a:focus-within .item img{filter:unset}}/*!normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css*/html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0;user-select:none}details,main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}code,kbd,pre,samp{font-family:var(--mono-font);font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline dotted}b,strong{font-weight:600}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{color:inherit;display:table;max-width:100%;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}[hidden],template{display:none}body{min-height:50vh;font-family:var(--body-font);background-color:var(--bg);color:var(--text)}h1,h2,h3,h4,h5,h6{font-weight:500}h1{font-size:1.8rem}h2{font-size:1.7rem}h3{font-size:1.5rem}h4{font-size:1.3rem}h5{font-size:1.2rem}h6{font-size:1.1rem}h1,h2,h3,h4,h5,h6{font-family:var(--display-font)}hr{width:calc(100% + 2rem);border:unset;border-top:1px solid var(--main-bg);margin:0 -1rem}a{color:var(--text);text-decoration-color:var(--primary-color)}a:hover{color:var(--primary-color)}main#wrapper{max-width:var(--max-width);width:100%;margin:auto;padding:1rem;display:grid;grid-template-columns:auto}header{display:grid;background-color:var(--main-bg);padding:2rem;border-radius:1rem 1rem 0 0}nav{display:inline-grid;grid-template-columns:repeat(4,1fr)}nav a{padding:.5rem;border-radius:.5rem;border:1px solid var(--main-bg);text-decoration:unset;color:var(--main-colors);margin:.15rem;font-weight:700;text-align:center}nav a:hover{border:1px solid var(--accent);background-color:var(--accent);color:var(--main-colors)}nav a.active{border:1px solid var(--accent);background-color:var(--accent);color:var(--main-colors)}article{display:grid;grid-template-columns:auto;grid-gap:1.5rem;background-color:var(--accent);border:1px solid var(--main-bg);padding:1rem;text-align:center;margin:-1rem 0;border-radius:1rem;z-index:1}footer{display:grid;place-items:center;background-color:var(--main-bg);border-radius:0 0 1rem 1rem;padding:1rem 0 .5rem}section#profile-image{display:grid;place-content:center}.image-container{width:100px;height:100px;border-radius:50%;overflow:hidden}.image-container img{width:100%}section#profile-summary{display:grid;place-content:center;text-align:center}section#nav{display:grid;place-content:center}section#portofolio{display:grid;grid-gap:1.5rem}div.photos,div.projects{display:grid;grid-template-columns:1fr 1fr;grid-gap:1rem}.item{display:grid;background-color:var(--bg);height:calc(100% + .5rem);border-radius:1rem;overflow:hidden}.item p,.item small{margin:.15rem 0;padding:.15rem 0}.container{min-height:200px}img.portofolio{width:100%;height:auto}blockquote{font-style:italic;padding:.15rem;background-color:var(--bg);border-radius:.5rem;border-left:.25rem solid var(--primary-color)}blockquote p{font-family:var(--display-font)}blockquote p::before{content:open-quote}blockquote p::after{content:close-quote}blockquote cite{display:block;margin:.5rem 0}article.singlepage{display:unset}div.content figure{background-color:var(--main-bg);border-radius:.5rem;overflow:hidden}div.content figure img{width:100%}div.content figcaption h5{margin:0;padding:.5rem}div.content img{width:100%}div.content ol,div.content ul{width:50%;margin:0 auto;text-align:left}div.contact-form{text-align:left}div.contact-form span{color:#f44336}input,select,textarea{width:100%;padding:.5rem 1rem;color:var(--text-colors);background:var(--bg);border:1px solid var(--main-bg);border-radius:.5rem;box-sizing:border-box;resize:vertical}select:required:invalid{color:#757575}option{color:var(--text-colors)}input[type=button]{background-color:var(--main-bg);color:var(--text-colors);padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer}input[type=button]:hover{background-color:var(--bg)}div.goto{display:grid;grid-column:1/span 2}input[type=submit].button,a.button{padding:.5rem 1rem;background-color:var(--main-bg);border:1px solid var(--main-bg);border-radius:.5rem;text-decoration:unset}input[type=submit].button:hover,a.button:hover{background-color:var(--bg);color:var(--text-colors)}.sosmed-list a{text-decoration:none;margin:0 .2rem;display:inline-block}.sosmed-list svg{width:1.5rem;height:1.5rem;padding:.25rem}a svg{fill:var(--text)}a svg:hover{fill:var(--link-hover-colors)}@media screen and (max-width:768px){main#wrapper{padding:0}nav{margin:0 -1rem}div.photos,div.projects{grid-template-columns:1fr}div.goto{grid-column:unset}}body main#error-404{display:grid;place-content:center;text-align:center;min-height:75vh}