@font-face{font-family:"Lato";font-style:italic;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/lato/v17/S6u8w4BMUTPHjxswWw.ttf) format("truetype")}@font-face{font-family:"Lato";font-style:italic;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/lato/v17/S6u_w4BMUTPHjxsI5wqPHA.ttf) format("truetype")}@font-face{font-family:"Lato";font-style:italic;font-weight:900;font-display:swap;src:url(https://fonts.gstatic.com/s/lato/v17/S6u_w4BMUTPHjxsI3wiPHA.ttf) format("truetype")}@font-face{font-family:"Lato";font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/lato/v17/S6uyw4BMUTPHvxk.ttf) format("truetype")}@font-face{font-family:"Source Code Pro";font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/sourcecodepro/v13/HI_SiYsKILxRpg3hIP6sJ7fM7PqVOg.ttf) format("truetype")}@font-face{font-family:"Source Code Pro";font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/sourcecodepro/v13/HI_XiYsKILxRpg3hIP6sJ7fM7Pqths7ztA.ttf) format("truetype")}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,input,textarea,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0}a:hover,a:active,a:focus,button:hover,button:active,button:focus,input:hover,input:active,input:focus,textarea:hover,textarea:active,textarea:focus{outline:0}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}a{color:#21759b;text-decoration:none;-webkit-transition:color .25s ease,margin .25s ease;transition:color .25s ease,margin .25s ease}a:hover{color:#d54e21}a:focus{-webkit-text-decoration:underline dashed;text-decoration:underline dashed}svg.icon{width:1em;height:1em;overflow:visible}svg.icon.blank{width:.8em;height:.9em}button,input,textarea{font-family:"Lato",sans-serif;font-size:13px;line-height:20px;padding:6px;-webkit-box-shadow:inset 1px 1px 5px rgba(0,0,0,.05);box-shadow:inset 1px 1px 5px rgba(0,0,0,.05);background:#fcfcfc;border:#eee 1px solid;color:#444;-webkit-transition:border-color .25s .25s ease;transition:border-color .25s .25s ease}button:focus,input:focus,textarea:focus{background:#fff;border:#ddd 1px solid;color:#333}input:required:invalid{border-color:#faa}.actions{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:#d4cb7f;border-bottom:#1a1a1a 3px solid!important}.actions button,.actions input[type=submit],.actions input[type=button],.actions input[type=reset]{font-weight:700;cursor:pointer;margin:0;padding:15px 20px;height:50px;background:inherit;border:none;-webkit-box-shadow:none;box-shadow:none}.actions button:hover:not(:disabled),.actions button:focus:not(:disabled),.actions input[type=submit]:hover:not(:disabled),.actions input[type=submit]:focus:not(:disabled),.actions input[type=button]:hover:not(:disabled),.actions input[type=button]:focus:not(:disabled),.actions input[type=reset]:hover:not(:disabled),.actions input[type=reset]:focus:not(:disabled){text-decoration:none;background:#eeeacb;color:inherit}body{font-family:"Lato",sans-serif;background:#faf9f0;color:#333;font-size:13px;line-height:20px}#wrapper{position:relative;max-width:1080px;margin:0 auto;-webkit-box-shadow:0 0 18px rgba(0,0,0,.25);box-shadow:0 0 18px rgba(0,0,0,.25);background:#f7f7fc;overflow:hidden}@media screen and (min-width:900px){#wrapper{max-width:1080px;margin:0 auto}}@media screen and (min-width:1380px){#wrapper{max-width:1420px;margin:0 100px}}header{background-color:#d4cb7f;border-top:#1a1a1a 3px solid}header #title-link{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;min-height:64px;margin:40px;padding-left:64px;background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><title>HTML5 Logo</title><polygon fill='%23E44D26' points='404,471 437,100 75,100 108,471 256,512'/><polygon fill='%23F16529' points='376,447 404,132 256,132 256,480'/><polygon fill='%23EBEBEB' points='154,312 256,312 256,268 196,268 192,220 256,220 256,176 142,176'/><polygon fill='%23EBEBEB' points='205,370 202,336 156,336 163,406 256,432 256,384'/><path d='M131,0V23H153V0H176V69H153V46H131V69H108V0Z'/><path d='M186,23V0H250V23H229V69H206V23Z'/><path d='M283,0 298,24 313,0H337V69H314V35L 298,60 282,35V69H259V0Z'/><path d='M349,0H372V46H404V69H349Z'/><polygon fill='%23FFFFFF' points='362,268 349,406 256,432 256,384 307,370 312,312 256,312 256,268'/><polygon fill='%23FFFFFF' points='370,176 366,220 256,220 256,176'/></svg>");background-position:left center;background-size:64px;background-repeat:no-repeat;color:#333;letter-spacing:1px}header #title-text{font-size:40px;line-height:40px;font-weight:900;text-shadow:0 1px #fff}header #title-desc{font-size:12px;line-height:18px;margin-left:4px}nav ul{display:-webkit-box;display:-ms-flexbox;display:flex;list-style-type:none}nav.main ul{-ms-flex-wrap:wrap;flex-wrap:wrap;padding:0 20px;background:#1a1a1a;color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.6px}nav.main li{position:relative}nav.main li:hover li,nav.main li:focus-within li{height:50px;-webkit-transition:height .25s ease;transition:height .25s ease}nav.main li:hover ul,nav.main li:focus-within ul{visibility:visible;-webkit-transition:none;transition:none}nav.main li ul{position:absolute;z-index:9999;min-width:100%;padding:0;margin:0;font-weight:normal;white-space:nowrap;text-transform:none;visibility:hidden;-webkit-transition:visibility 0s .25s;transition:visibility 0s .25s}nav.main li li{width:100%;height:0;overflow:hidden;-webkit-transition:height .25s ease;transition:height .25s ease}nav.main a{display:block;padding:14px 22px;border:solid #1a1a1a;border-width:1px 2px;color:inherit;-webkit-transition:background-color .25s ease,border-color .25s ease;transition:background-color .25s ease,border-color .25s ease}nav.main a:hover,nav.main a.current{text-decoration:none;background:#4d4d4d;border-color:#4d4d4d;color:inherit}nav.main a:focus{text-decoration:none;border-color:rgba(255,255,255,.4)}nav.blog ul{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-top:8px}nav.blog li[rel=prev]{text-align:left;margin-right:10px}nav.blog li[rel=next]{text-align:right;margin-left:10px}#content{margin:40px}.list>ul>li{background:#fff;border-bottom:rgba(0,0,0,.13) 1px solid;-webkit-box-shadow:0 0 5px rgba(0,0,0,.1);box-shadow:0 0 5px rgba(0,0,0,.1);display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;margin:0 0 20px 0;padding:20px}.list>ul.portfolio hgroup h1{margin-right:0;font-size:36px;line-height:58px;font-weight:normal}.list>ul article{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-item-align:stretch;align-self:stretch;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;color:#333;font-family:"PT Serif",serif;font-size:15px;line-height:24px}.list>ul article a::after{position:absolute;content:"";left:0;top:0;width:100%;height:100%}.list>ul article h2{font-family:"Lato",sans-serif}.list>ul article h1,.list>ul article .readon{color:#21759b;font-family:"Lato",sans-serif}.list>ul article:hover{color:#333}.list>ul article:hover h1,.list>ul article:hover .readon{color:#d54e21}.list>ul article *:nth-last-child(2){-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.list>ul article .readon{margin-bottom:0}.list>ul img{width:30%;margin-left:20px;-ms-flex-negative:0;flex-shrink:0;-o-object-fit:contain;object-fit:contain;-o-object-position:top;object-position:top}#content.sidebar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}aside{width:100%;margin-top:20px;background:#fff;border-bottom:rgba(0,0,0,.13) 1px solid;-webkit-box-shadow:0 0 5px rgba(0,0,0,.1);box-shadow:0 0 5px rgba(0,0,0,.1)}aside h2{margin:20px 20px 18px;font-size:18px;font-weight:normal}aside label,aside p{margin:20px 20px 18px}aside label{display:block;text-indent:6px}aside label[for=website]{display:none}aside input[type=text],aside input[type=email]{width:250px}aside textarea,aside input[name=_subject]{width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}aside textarea{height:200px}aside .answer,aside .answer span,aside form.success>:not(.answer){display:none}aside form.success .answer{display:block}aside form.success .answer .answ-success{display:inline}aside form.failed .answer{display:block}aside form.failed .answer .answ-failed{display:inline;color:#a20}aside form.invalid .answer{display:block}aside form.invalid .answer .answ-invalid{display:inline;color:#a20}@media screen and (min-width:1000px){#content.sidebar{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}aside{-webkit-box-flex:1;-ms-flex:1 0 320px;flex:1 0 320px;margin-top:0;margin-left:20px}}main.single{padding:20px 20px 0;background:#fff;border-bottom:rgba(0,0,0,.13) 1px solid;-webkit-box-shadow:0 0 5px rgba(0,0,0,.1);box-shadow:0 0 5px rgba(0,0,0,.1)}main.single ul{list-style-type:none}main::after{display:block;clear:both;content:""}main>:not(figcaption){font-family:"PT Serif",serif;font-size:15px;line-height:24px}main hgroup,main h1,main h2,main h3,main blockquote{font-family:inherit}main h1,main h2,main h3{margin-bottom:18px;font-size:18px;line-height:30px;font-weight:normal;clear:both}main h1{font-size:36px;line-height:58px}main h2{font-size:24px;line-height:38px}main .header-anchor{position:absolute;left:15px;font-size:16px}main hgroup h1{clear:none}main hgroup h2{font-size:13px;line-height:20px;text-align:right;margin-bottom:6px}main p,main pre,main blockquote,main .cp_embed_wrapper{margin-bottom:24px}main ul li{margin-left:2em}main ul li::marker{margin-right:.5em}main pre{clear:both}main code,main code *{font-family:"Source Code Pro",monospace;font-size:13px;line-height:20px}main blockquote{padding:20px 20px 0;background:#fff;border-bottom:rgba(0,0,0,.13) 1px solid;-webkit-box-shadow:0 0 5px rgba(0,0,0,.1);box-shadow:0 0 5px rgba(0,0,0,.1);background-color:#f0f0f9}main .hljs{background:#fff;border-bottom:rgba(0,0,0,.13) 1px solid;-webkit-box-shadow:0 0 5px rgba(0,0,0,.1);box-shadow:0 0 5px rgba(0,0,0,.1);background-color:#f0f0f9}main>img,main>iframe{margin:10px 0 24px}main .alignleft{float:left;margin-right:20px}main .clearleft{clear:left}main .alignright{float:right;margin-left:20px}main .clearright{clear:right}main figure img{margin-bottom:10px;width:100%;height:100%}main figcaption{margin-bottom:24px}footer{float:none;padding:1.4% 3.2%;background:#1a1a1a;color:#fff}footer p:first-child{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;background:#1a1a1a;color:#fff}footer p:last-child{text-align:right}footer a{color:#9ed2ea}footer a:hover{color:#f7d6cb}@media screen and (min-width:640px){main hgroup h1{margin-right:4em}main hgroup h2{float:right}}main .crw-immediate .blocker{background:rgba(0,0,0,.1)}main .crw-immediate>.message>div{margin:0;padding:20px 0 0;border:none;-webkit-box-shadow:0 0 18px rgba(0,0,0,.25);box-shadow:0 0 18px rgba(0,0,0,.25)}main .crw-immediate>.message>div>:not(form):not(.actions),main .crw-immediate>.message>div form>:not(.actions){margin-left:20px;margin-right:20px}main .crw-immediate>.message>div p.actions{margin-top:20px}main .crw-immediate .error{color:#a20}