*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}body{margin:0}html,button,input,select,textarea,.pure-g [class *= "pure-u"]{font-family:"Roboto",serif}a{text-decoration:none;color:#3d92c9;overflow:hidden}a:hover,a:focus{text-decoration:underline}h3{font-weight:100}.pure-img-responsive{max-width:100%;height:auto}#layout{padding:0}.header{text-align:center;top:auto;margin:3em auto}.sidebar{background:#111;color:#fff}.brand-title,.brand-tagline{margin:0}.brand-title{font-family:monospace;font-size:3em}.brand-title a{color:#fff}.brand-title a:hover{text-decoration:none}.brand-tagline{font-weight:300;color:#b0cadb}.nav-list{margin:0;padding:0;list-style:none;font-family:monospace;font-size:1.6em}.tag{font-size:.75em !important;color:#444;background-color:#f3f8f8;border:1px solid #34c0ec;padding:3px 4px 3px 4px;margin:2px 2px 2px 0;text-decoration:none;font-size:90%;line-height:2.4;white-space:nowrap}.content-subhead{color:#aaa;padding:.4em 0;font-size:90%;font-weight:400;letter-spacing:.01em;font-family:'IBM Plex Mono';word-spacing:-0.3em}.content{justify-content:left;text-align:left;padding:8px}.post{padding-bottom:3em}.post-title{font-family:'Rubik',sans-serif;font-size:2.2em;color:#222;margin:.4em 0;font-weight:500}.post-title:hover{text-decoration:none}.post-title-main{font-family:'Rubik',sans-serif;font-size:2em;color:#222;margin-top:.4em;margin-left:3px;margin-bottom:.4em;font-weight:500;z-index:1}.post-title-main:hover{text-decoration:none;color:#3d92c9}.post-header{margin-top:10px}.post-card-new{border-radius:20px;padding:20px;border:0 solid #fff;background-color:#fff;background-repeat:no-repeat;min-height:100%;margin:10px;display:flex;flex-wrap:wrap;align-content:center;position:relative;transition:all .3s ease-out;text-align:left}.post-card-new:hover{box-shadow:rgba(50,50,93,0.25) 0 13px 27px -5px,rgba(0,0,0,0.3) 0 8px 16px -8px;transition:all .3s ease-out}.post-title:hover{text-decoration:none}.post-avatar{border-radius:50px;float:right;margin-left:1em}.post-description{overflow:hidden;word-wrap:break-word;font-size:1.1em;font-family:Roboto,sans-serif;line-height:170%}.post-description h2{font-family:'Rubik',sans-serif;font-weight:500;margin-top:1.5em}.post-description h3{font-family:'Rubik',sans-serif;font-weight:500}.post-description img{max-width:100%;max-height:70% !important;display:block;border-radius:10px}.full-width-img{left:50%;margin-left:-50vw;margin-right:-50vw;max-width:100vw;position:relative;right:50%;width:100vw}.post-meta{color:#999;font-size:90%;font-family:"HelveticaNeue";margin:5px 0}.post-meta-main{color:#999;font-size:90%;font-family:"HelveticaNeue";margin:5px 0}.post-category{margin:0 .1em;padding:.3em 1em;color:#fff;background:#999;font-size:80%}.post-category-design{background:#5aba59}.post-category-pure{background:#4d85d1}.post-category-yui{background:#8156a7}.post-category-javascript{background:#df2d4f}.post-images{margin:1em 0}.post-image-meta{margin-top:-3.5em;margin-left:1em;color:#fff;text-shadow:0 1px 1px #333}.footer{text-align:center;padding:1em 0;color:#b4b3b3;font-size:80%}.footer a{color:#99c0d9}.footer ul li a{display:inline;padding:0;color:#85b5d5}.hugo{color:#333;font-weight:bold}.footer .pure-menu a:hover,.footer .pure-menu a:focus{background:0}.footer li{list-style-type:none}.post-share-links{margin:15px 15px 0 0;float:left;padding:10px;border:1px solid #ccc;text-align:center}.post-share-links a{color:#aaa;font-size:28px;line-height:36px;margin:0 auto;display:block;transition:all .3s ease-in}.post-share-links a:hover{color:#3d92c9;text-decoration:none}.post-share-links h4{font-family:"Oxygen",sans-serif;margin:0 0 5px;color:#aaa}@media(min-width:48em){.header{margin:22% 5% 0;text-align:left}.sidebar{position:fixed;color:#fff;top:0;bottom:0}}.taglist-main{color:#ccc;z-index:1}.taglist-main a{border-radius:5px;color:#202020;background-color:#fff4ea;line-height:1.5em;padding:.3em .6em .3em .6em;vertical-align:10%;font-size:.6em;font-family:"IBM Plex Mono",sans-serif;font-weight:700 !important;text-transform:uppercase;letter-spacing:.05em;border-radius:.25em;-moz-border-radius:.25em;-webkit-border-radius:.25em}.separator,.taglist,.feature-star{color:#ccc}.taglist a{border-radius:5px;color:#202020;background-color:#fff4ea;line-height:1.5em;padding:.3em .6em .3em .6em;vertical-align:10%;font-size:11px;font-family:"IBM Plex Mono",sans-serif;font-weight:700 !important;text-transform:uppercase;letter-spacing:.05em;border-radius:.25em;-moz-border-radius:.25em;-webkit-border-radius:.25em}h3.post-title{margin-top:.4em;padding-bottom:.9em;border-bottom:1px solid #eee;font-size:1.4em;color:#444}.read-more-link{text-align:right}@media(max-width:48em){.arrow{width:1.5em;margin-right:8px;color:#5eae0e;margin-bottom:-2px;margin-left:-33px}}@media(min-width:48em){.arrow{width:1.5em;margin-right:8px;color:#5eae0e;margin-bottom:-2px}}.suggest{border-top:1px solid #ccc;border-bottom:1px solid #ccc;padding-top:10px;margin-top:50px;margin-bottom:50px}.suggest-pic-main{display:block;max-width:100%;min-width:100%;margin:0 auto;border-radius:5px}.suggest-pic{display:block;box-shadow:rgba(50,50,93,0.25) 0 13px 27px -5px,rgba(0,0,0,0.3) 0 8px 16px -8px}.suggest-date{color:#888;font-size:.7em;display:block}.one-suggest{width:36%;float:left;margin:10px;padding:10px;position:relative}.one-suggest-title{margin-top:10px;max-width:300px;margin-bottom:0}.posts{justify-content:left;text-align:left;padding:12px;margin-top:10px}.main-set{text-align:center;display:block}.date-list{color:#828282;font-weight:400;letter-spacing:.01em;font-size:.7em;font-family:'IBM Plex Mono';word-spacing:-0.3em}.project{border:1px solid #ccc;border-radius:4px;margin-bottom:30px;box-shadow:0 1px 1px rgba(0,0,0,0.1)}.project-descrpition{padding-left:10px;padding-top:5px}.topbar{font-family:monospace;text-align:center;overflow:hidden;background-color:#000;padding-top:10px;padding-bottom:13px}@media(min-width:48em){.topbar-menu{font-family:monospace;color:#f2f2f2;font-size:17px;min-height:30px;padding-top:10px;padding-left:10px;padding-bottom:5px;text-align:left}}@media(max-width:48em){.topbar-menu{font-family:monospace;color:#f2f2f2;font-size:17px;height:30px;padding-top:10px;padding-left:10px;text-align:center}}.topbar-menu a{font-family:'IBM Plex Mono',monospace;color:#fff;font-size:17px;padding-right:25px}.homelink{text-align:center;float:left;height:40px}.homelink a{text-align:center;font-family:'Pixelify Sans',monospace;color:#fff;text-decoration:none;font-size:2em;font-weight:bold}.center{justify-content:center;text-align:center;display:flex;flex-wrap:wrap;align-content:center}.left{float:left;text-align:left;margin-right:30px}hr{border-right:0;border-left:0}.comments{background:#ededed;padding-top:20px}figcaption{margin-top:-15px;color:#888787;font-style:italic;text-align:center}img[src$='#floatleft']{float:left;margin-right:25px}img[src$='#floatright']{float:right;margin-left:25px}.pagination{margin-top:20px}.pagination a{text-decoration:none}.post-list-pagination-item-prev{background-color:#fff;padding:.4em;color:#000;margin-right:5px;font-family:"Roboto",serif}.post-list-pagination-item-prev:hover{background-color:#e4e4e4}.post-list-pagination-item-next{background-color:#fff;padding:.4em;color:#000;margin-left:5px;font-family:"Roboto",serif}.post-list-pagination-item-next:hover{background-color:#e4e4e4}.legend{text-align:center;padding:7px;font-family:"IBM Plex Mono",sans-serif;font-size:1.7em;color:#000}.block{border-top:2px dashed #ccc;border-left:0;border-right:0;border-bottom:0}.logo{text-shadow:0 0 7px rgba(255,255,255,0.45);transition:text-shadow .3s ease}.logo:hover{text-shadow:0 0 7px rgba(128,0,255,0.45)}pre{border:1px solid #ccc;border-radius:3px;word-wrap:break-word;padding:6px 10px;line-height:19px;margin-bottom:20px;background:#f8f8f8}code{border:1px solid #eaeaea;margin:0 2px;padding:0 5px;font-family:'Roboto Mono',monospace;background:#f8f8f8;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;font-size:.85em;line-height:1.4em}pre code{border:0;padding:0;margin:0;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0}.highlight .hll{background-color:#f8f8f8}.highlight{background:#f8f8f8;margin-top:-8px}.highlight .c{color:#408080;font-style:italic}.highlight .k{color:#008000;font-weight:bold}.highlight .o{color:#666}.highlight .ch{color:#408080;font-style:italic}.highlight .cm{color:#408080;font-style:italic}.highlight .cp{color:#bc7a00}.highlight .cpf{color:#408080;font-style:italic}.highlight .c1{color:#408080;font-style:italic;font-family:'Roboto Mono',monospace;font-size:16px}.highlight .cs{color:#408080;font-style:italic}.highlight .gd{color:#a00000}.highlight .ge{font-style:italic}.highlight .gr{color:red}.highlight .gh{color:navy;font-weight:bold}.highlight .gi{color:#00a000}.highlight .go{color:#888}.highlight .gp{color:navy;font-weight:bold;user-select:none;margin-right:10px}.highlight .gs{font-weight:bold}.highlight .gu{color:purple;font-weight:bold}.highlight .gt{color:#04d}.highlight .kc{color:#008000;font-weight:bold}.highlight .kd{color:#008000;font-weight:bold}.highlight .kn{color:#008000;font-weight:bold}.highlight .kp{color:#008000}.highlight .kr{color:#008000;font-weight:bold}.highlight .kt{color:#b00040}.highlight .m{color:#666}.highlight .s{color:#ba2121}.highlight .na{color:#7d9029}.highlight .nb{color:#008000}.highlight .nc{color:#00f;font-weight:bold}.highlight .no{color:#800}.highlight .nd{color:#a2f}.highlight .ni{color:#999;font-weight:bold}.highlight .ne{color:#d2413a;font-weight:bold}.highlight .nf{color:#00f}.highlight .nl{color:#a0a000}.highlight .nn{color:#00f;font-weight:bold}.highlight .nt{color:#008000;font-weight:bold}.highlight .nv{color:#19177c}.highlight .ow{color:#a2f;font-weight:bold}.highlight .w{color:#bbb}.highlight .mb{color:#666}.highlight .mf{color:#666}.highlight .mh{color:#666}.highlight .mi{color:#666}.highlight .mo{color:#666}.highlight .sa{color:#ba2121}.highlight .sb{color:#ba2121}.highlight .sc{color:#ba2121}.highlight .dl{color:#ba2121}.highlight .sd{color:#ba2121;font-style:italic}.highlight .s2{color:#ba2121}.highlight .se{color:#b62;font-weight:bold}.highlight .sh{color:#ba2121}.highlight .si{color:#b68;font-weight:bold}.highlight .sx{color:#008000}.highlight .sr{color:#b68}.highlight .s1{color:#ba2121}.highlight .ss{color:#19177c}.highlight .bp{color:#008000}.highlight .fm{color:#00f}.highlight .vc{color:#19177c}.highlight .vg{color:#19177c}.highlight .vi{color:#19177c}.highlight .vm{color:#19177c}.highlight .il{color:#666}}.chroma .lnlinks{outline:0;text-decoration:none;color:inherit}.chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}.chroma .lntable{border-spacing:0;padding:0;margin:0;border:0}.chroma .hl{background-color:#ffc}.chroma .lnt{white-space:pre;user-select:none;margin-right:.4em;padding:0 .4em 0 .4em;color:#7f7f7f}.chroma .ln{white-space:pre;user-select:none;margin-right:.4em;padding:0 .4em 0 .4em;color:#7f7f7f}.chroma .line{display:flex}.chroma .k{color:#008000;font-weight:bold}.chroma .kc{color:#008000;font-weight:bold}.chroma .kd{color:#008000;font-weight:bold}.chroma .kn{color:#008000;font-weight:bold}.chroma .kp{color:#008000}.chroma .kr{color:#008000;font-weight:bold}.chroma .kt{color:#b00040}.chroma .na{color:#7d9029}.chroma .nb{color:#008000}.chroma .nc{color:#00f;font-weight:bold}.chroma .no{color:#800}.chroma .nd{color:#a2f}.chroma .ni{color:#999;font-weight:bold}.chroma .ne{color:#d2413a;font-weight:bold}.chroma .nf{color:#00f}.chroma .nl{color:#a0a000}.chroma .nn{color:#00f;font-weight:bold}.chroma .nt{color:#008000;font-weight:bold}.chroma .nv{color:#19177c}.chroma .s{color:#ba2121}.chroma .sa{color:#ba2121}.chroma .sb{color:#ba2121}.chroma .sc{color:#ba2121}.chroma .dl{color:#ba2121}.chroma .sd{color:#ba2121;font-style:italic}.chroma .s2{color:#ba2121}.chroma .se{color:#b62;font-weight:bold}.chroma .sh{color:#ba2121}.chroma .si{color:#b68;font-weight:bold}.chroma .sx{color:#008000}.chroma .sr{color:#b68}.chroma .s1{color:#ba2121}.chroma .ss{color:#19177c}.chroma .m{color:#666}.chroma .mb{color:#666}.chroma .mf{color:#666}.chroma .mh{color:#666}.chroma .mi{color:#666}.chroma .il{color:#666}.chroma .mo{color:#666}.chroma .o{color:#666}.chroma .ow{color:#a2f;font-weight:bold}.chroma .c{color:#408080;font-style:italic}.chroma .ch{color:#408080;font-style:italic}.chroma .cm{color:#408080;font-style:italic}.chroma .c1{color:#408080;font-style:italic}.chroma .cs{color:#408080;font-style:italic}.chroma .cp{color:#bc7a00}.chroma .cpf{color:#bc7a00}.chroma .gd{color:#a00000}.chroma .ge{font-style:italic}.chroma .gr{color:red}.chroma .gh{color:navy;font-weight:bold}.chroma .gi{color:#00a000}.chroma .go{color:#424242}.chroma .gp{color:navy;font-weight:bold}.chroma .gs{font-weight:bold}.chroma .gu{color:purple;font-weight:bold}.chroma .gt{color:#04d}.chroma .gl{text-decoration:underline}.chroma .w{color:#bbb}