CoolFace
Datasetpublic

SALT-NLP/Design2Code

This dataset consists of 484 webpages from the C4 validation set, serving the purpose of testing multimodal LLMs on converting visual designs into code implementations. Each example is a pair of source HTML and screenshot ({id}.html and {id}.png). See the dataset in the huggingface format here. Note that all images in these webpages are replaced by a placeholder image (rick.jpg) Please refer to our project page and our paper for more information. Example Usage For example, you… See the full description on the dataset page: https://huggingface.co/datasets/SALT-NLP/Design2Code.

sourceHugging Faceodc-byupdated 3y agoView on Hugging Face
22likes1.7kdownloads
17655.html3118 linesDownload Raw Back to root
1<!DOCTYPE html>2<html dir="ltr" lang="en">3 <head>4  <style>5  </style>6  <meta content="width=device-width, initial-scale=1" name="viewport">7  <title>8   Windshield Wipers9  </title>10  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">11  <!-- Chrome, Firefox OS and Opera -->12  <meta content="#f7f7f7" name="theme-color">13  <!-- Windows Phone -->14  <meta content="#f7f7f7" name="msapplication-navbutton-color">15  <meta content="blogger" name="generator">16  <!--Can't find substitution for tag [blog.ieCssRetrofitLinks]-->17  <meta content="" property="og:url">18  <meta content="Windshield Wipers" property="og:title">19  <meta content="Last weekend we tried to go bowling with some friends. We beat them to the bowling ally and so we waited in the car for a few minutes becaus..." property="og:description">20  <style type="text/css">21   @font-face{font-family:'Merriweather';font-style:italic;font-weight:300;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4l0qyriQwlOrhSvowK_l5-eR7lXff1jvzRPA.woff2)format('woff2');unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}@font-face{font-family:'Merriweather';font-style:italic;font-weight:300;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4l0qyriQwlOrhSvowK_l5-eR7lXff8jvzRPA.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'Merriweather';font-style:italic;font-weight:300;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4l0qyriQwlOrhSvowK_l5-eR7lXff3jvzRPA.woff2)format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}@font-face{font-family:'Merriweather';font-style:italic;font-weight:300;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4l0qyriQwlOrhSvowK_l5-eR7lXff2jvzRPA.woff2)format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family:'Merriweather';font-style:italic;font-weight:300;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4l0qyriQwlOrhSvowK_l5-eR7lXff4jvw.woff2)format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}@font-face{font-family:'Merriweather';font-style:italic;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4m0qyriQwlOrhSvowK_l5-eRZDf-LHrw.woff2)format('woff2');unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}@font-face{font-family:'Merriweather';font-style:italic;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4m0qyriQwlOrhSvowK_l5-eRZKf-LHrw.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'Merriweather';font-style:italic;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4m0qyriQwlOrhSvowK_l5-eRZBf-LHrw.woff2)format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}@font-face{font-family:'Merriweather';font-style:italic;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4m0qyriQwlOrhSvowK_l5-eRZAf-LHrw.woff2)format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family:'Merriweather';font-style:italic;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-4m0qyriQwlOrhSvowK_l5-eRZOf-I.woff2)format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}@font-face{font-family:'Merriweather';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-440qyriQwlOrhSvowK_l5-cSZMZ-Y.woff2)format('woff2');unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}@font-face{font-family:'Merriweather';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-440qyriQwlOrhSvowK_l5-eCZMZ-Y.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'Merriweather';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-440qyriQwlOrhSvowK_l5-cyZMZ-Y.woff2)format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}@font-face{font-family:'Merriweather';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-440qyriQwlOrhSvowK_l5-ciZMZ-Y.woff2)format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family:'Merriweather';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/merriweather/v30/u-440qyriQwlOrhSvowK_l5-fCZM.woff2)format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCs6KVjbNBYlgoKcg72j00.woff2)format('woff2');unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCs6KVjbNBYlgoKew72j00.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCs6KVjbNBYlgoKcw72j00.woff2)format('woff2');unicode-range:U+1F00-1FFF;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCs6KVjbNBYlgoKfA72j00.woff2)format('woff2');unicode-range:U+0370-03FF;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCs6KVjbNBYlgoKcQ72j00.woff2)format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCs6KVjbNBYlgoKfw72.woff2)format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:500;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCjC3jvWyNL4U.woff2)format('woff2');unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:500;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCjC3jtGyNL4U.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:500;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCjC3jvGyNL4U.woff2)format('woff2');unicode-range:U+1F00-1FFF;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:500;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCjC3js2yNL4U.woff2)format('woff2');unicode-range:U+0370-03FF;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:500;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCjC3jvmyNL4U.woff2)format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:500;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCjC3jsGyN.woff2)format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCxCvjvWyNL4U.woff2)format('woff2');unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCxCvjtGyNL4U.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCxCvjvGyNL4U.woff2)format('woff2');unicode-range:U+1F00-1FFF;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCxCvjs2yNL4U.woff2)format('woff2');unicode-range:U+0370-03FF;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCxCvjvmyNL4U.woff2)format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family:'Ubuntu';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoCxCvjsGyN.woff2)format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}22  </style>23  <style id="page-skin-1" type="text/css">24   <!--25/*! normalize.css v3.0.1 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}26/*!************************************************27* Blogger Template Style28* Name: Emporio29**************************************************/30body{31overflow-wrap:break-word;32word-break:break-word;33word-wrap:break-word34}35.hidden{36display:none37}38.invisible{39visibility:hidden40}41.container::after,.float-container::after{42clear:both;43content:"";44display:table45}46.clearboth{47clear:both48}49#comments .comment .comment-actions,.subscribe-popup .FollowByEmail .follow-by-email-submit{50background:0 0;51border:0;52box-shadow:none;53color:#729c0b;54cursor:pointer;55font-size:14px;56font-weight:700;57outline:0;58text-decoration:none;59text-transform:uppercase;60width:auto61}62.dim-overlay{63background-color:rgba(0,0,0,.54);64height:100vh;65left:0;66position:fixed;67top:0;68width:100%69}70#sharing-dim-overlay{71background-color:transparent72}73input::-ms-clear{74display:none75}76.blogger-logo,.svg-icon-24.blogger-logo{77fill:#ff9800;78opacity:179}80.skip-navigation{81background-color:#fff;82box-sizing:border-box;83color:#000;84display:block;85height:0;86left:0;87line-height:50px;88overflow:hidden;89padding-top:0;90position:fixed;91text-align:center;92top:0;93-webkit-transition:box-shadow .3s,height .3s,padding-top .3s;94transition:box-shadow .3s,height .3s,padding-top .3s;95width:100%;96z-index:90097}98.skip-navigation:focus{99box-shadow:0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);100height:50px101}102#main{103outline:0104}105.main-heading{106position:absolute;107clip:rect(1px,1px,1px,1px);108padding:0;109border:0;110height:1px;111width:1px;112overflow:hidden113}114.Attribution{115margin-top:1em;116text-align:center117}118.Attribution .blogger img,.Attribution .blogger svg{119vertical-align:bottom120}121.Attribution .blogger img{122margin-right:.5em123}124.Attribution div{125line-height:24px;126margin-top:.5em127}128.Attribution .copyright,.Attribution .image-attribution{129font-size:.7em;130margin-top:1.5em131}132.BLOG_mobile_video_class{133display:none134}135.bg-photo{136background-attachment:scroll!important137}138body .CSS_LIGHTBOX{139z-index:900140}141.extendable .show-less,.extendable .show-more{142border-color:#729c0b;143color:#729c0b;144margin-top:8px145}146.extendable .show-less.hidden,.extendable .show-more.hidden{147display:none148}149.inline-ad{150display:none;151max-width:100%;152overflow:hidden153}154.adsbygoogle{155display:block156}157#cookieChoiceInfo{158bottom:0;159top:auto160}161iframe.b-hbp-video{162border:0163}164.post-body img{165max-width:100%166}167.post-body iframe{168max-width:100%169}170.post-body a[imageanchor="1"]{171display:inline-block172}173.byline{174margin-right:1em175}176.byline:last-child{177margin-right:0178}179.link-copied-dialog{180max-width:520px;181outline:0182}183.link-copied-dialog .modal-dialog-buttons{184margin-top:8px185}186.link-copied-dialog .goog-buttonset-default{187background:0 0;188border:0189}190.link-copied-dialog .goog-buttonset-default:focus{191outline:0192}193.paging-control-container{194margin-bottom:16px195}196.paging-control-container .paging-control{197display:inline-block198}199.paging-control-container .comment-range-text::after,.paging-control-container .paging-control{200color:#729c0b201}202.paging-control-container .comment-range-text,.paging-control-container .paging-control{203margin-right:8px204}205.paging-control-container .comment-range-text::after,.paging-control-container .paging-control::after{206content:"\b7";207cursor:default;208padding-left:8px;209pointer-events:none210}211.paging-control-container .comment-range-text:last-child::after,.paging-control-container .paging-control:last-child::after{212content:none213}214.byline.reactions iframe{215height:20px216}217.b-notification{218color:#000;219background-color:#fff;220border-bottom:solid 1px #000;221box-sizing:border-box;222padding:16px 32px;223text-align:center224}225.b-notification.visible{226-webkit-transition:margin-top .3s cubic-bezier(.4,0,.2,1);227transition:margin-top .3s cubic-bezier(.4,0,.2,1)228}229.b-notification.invisible{230position:absolute231}232.b-notification-close{233position:absolute;234right:8px;235top:8px236}237.no-posts-message{238line-height:40px;239text-align:center240}241@media screen and (max-width:745px){242body.item-view .post-body a[imageanchor="1"][style*="float: left;"],body.item-view .post-body a[imageanchor="1"][style*="float: right;"]{243float:none!important;244clear:none!important245}246body.item-view .post-body a[imageanchor="1"] img{247display:block;248height:auto;249margin:0 auto250}251body.item-view .post-body>.separator:first-child>a[imageanchor="1"]:first-child{252margin-top:20px253}254.post-body a[imageanchor]{255display:block256}257body.item-view .post-body a[imageanchor="1"]{258margin-left:0!important;259margin-right:0!important260}261body.item-view .post-body a[imageanchor="1"]+a[imageanchor="1"]{262margin-top:16px263}264}265.item-control{266display:none267}268#comments{269border-top:1px dashed rgba(0,0,0,.54);270margin-top:20px;271padding:20px272}273#comments .comment-thread ol{274margin:0;275padding-left:0;276padding-left:0277}278#comments .comment .comment-replybox-single,#comments .comment-thread .comment-replies{279margin-left:60px280}281#comments .comment-thread .thread-count{282display:none283}284#comments .comment{285list-style-type:none;286padding:0 0 30px;287position:relative288}289#comments .comment .comment{290padding-bottom:8px291}292.comment .avatar-image-container{293position:absolute294}295.comment .avatar-image-container img{296border-radius:50%297}298.avatar-image-container svg,.comment .avatar-image-container .avatar-icon{299border-radius:50%;300border:solid 1px #729c0b;301box-sizing:border-box;302fill:#729c0b;303height:35px;304margin:0;305padding:7px;306width:35px307}308.comment .comment-block{309margin-top:10px;310margin-left:60px;311padding-bottom:0312}313#comments .comment-author-header-wrapper{314margin-left:40px315}316#comments .comment .thread-expanded .comment-block{317padding-bottom:20px318}319#comments .comment .comment-header .user,#comments .comment .comment-header .user a{320color:#212121;321font-style:normal;322font-weight:700323}324#comments .comment .comment-actions{325bottom:0;326margin-bottom:15px;327position:absolute328}329#comments .comment .comment-actions>*{330margin-right:8px331}332#comments .comment .comment-header .datetime{333bottom:0;334color:rgba(33,33,33,.54);335display:inline-block;336font-size:13px;337font-style:italic;338margin-left:8px339}340#comments .comment .comment-footer .comment-timestamp a,#comments .comment .comment-header .datetime a{341color:rgba(33,33,33,.54)342}343#comments .comment .comment-content,.comment .comment-body{344margin-top:12px;345word-break:break-word346}347.comment-body{348margin-bottom:12px349}350#comments.embed[data-num-comments="0"]{351border:0;352margin-top:0;353padding-top:0354}355#comments.embed[data-num-comments="0"] #comment-post-message,#comments.embed[data-num-comments="0"] div.comment-form>p,#comments.embed[data-num-comments="0"] p.comment-footer{356display:none357}358#comment-editor-src{359display:none360}361.comments .comments-content .loadmore.loaded{362max-height:0;363opacity:0;364overflow:hidden365}366.extendable .remaining-items{367height:0;368overflow:hidden;369-webkit-transition:height .3s cubic-bezier(.4,0,.2,1);370transition:height .3s cubic-bezier(.4,0,.2,1)371}372.extendable .remaining-items.expanded{373height:auto374}375.svg-icon-24,.svg-icon-24-button{376cursor:pointer;377height:24px;378width:24px;379min-width:24px380}381.touch-icon{382margin:-12px;383padding:12px384}385.touch-icon:active,.touch-icon:focus{386background-color:rgba(153,153,153,.4);387border-radius:50%388}389svg:not(:root).touch-icon{390overflow:visible391}392html[dir=rtl] .rtl-reversible-icon{393-webkit-transform:scaleX(-1);394-ms-transform:scaleX(-1);395transform:scaleX(-1)396}397.svg-icon-24-button,.touch-icon-button{398background:0 0;399border:0;400margin:0;401outline:0;402padding:0403}404.touch-icon-button .touch-icon:active,.touch-icon-button .touch-icon:focus{405background-color:transparent406}407.touch-icon-button:active .touch-icon,.touch-icon-button:focus .touch-icon{408background-color:rgba(153,153,153,.4);409border-radius:50%410}411.Profile .default-avatar-wrapper .avatar-icon{412border-radius:50%;413border:solid 1px #729c0b;414box-sizing:border-box;415fill:#729c0b;416margin:0417}418.Profile .individual .default-avatar-wrapper .avatar-icon{419padding:25px420}421.Profile .individual .avatar-icon,.Profile .individual .profile-img{422height:90px;423width:90px424}425.Profile .team .default-avatar-wrapper .avatar-icon{426padding:8px427}428.Profile .team .avatar-icon,.Profile .team .default-avatar-wrapper,.Profile .team .profile-img{429height:40px;430width:40px431}432.snippet-container{433margin:0;434position:relative;435overflow:hidden436}437.snippet-fade{438bottom:0;439box-sizing:border-box;440position:absolute;441width:96px442}443.snippet-fade{444right:0445}446.snippet-fade:after{447content:"\2026"448}449.snippet-fade:after{450float:right451}452.centered-top-container.sticky{453left:0;454position:fixed;455right:0;456top:0;457width:auto;458z-index:8;459-webkit-transition-property:opacity,-webkit-transform;460transition-property:opacity,-webkit-transform;461transition-property:transform,opacity;462transition-property:transform,opacity,-webkit-transform;463-webkit-transition-duration:.2s;464transition-duration:.2s;465-webkit-transition-timing-function:cubic-bezier(.4,0,.2,1);466transition-timing-function:cubic-bezier(.4,0,.2,1)467}468.centered-top-placeholder{469display:none470}471.collapsed-header .centered-top-placeholder{472display:block473}474.centered-top-container .Header .replaced h1,.centered-top-placeholder .Header .replaced h1{475display:none476}477.centered-top-container.sticky .Header .replaced h1{478display:block479}480.centered-top-container.sticky .Header .header-widget{481background:0 0482}483.centered-top-container.sticky .Header .header-image-wrapper{484display:none485}486.centered-top-container img,.centered-top-placeholder img{487max-width:100%488}489.collapsible{490-webkit-transition:height .3s cubic-bezier(.4,0,.2,1);491transition:height .3s cubic-bezier(.4,0,.2,1)492}493.collapsible,.collapsible>summary{494display:block;495overflow:hidden496}497.collapsible>:not(summary){498display:none499}500.collapsible[open]>:not(summary){501display:block502}503.collapsible:focus,.collapsible>summary:focus{504outline:0505}506.collapsible>summary{507cursor:pointer;508display:block;509padding:0510}511.collapsible:focus>summary,.collapsible>summary:focus{512background-color:transparent513}514.collapsible>summary::-webkit-details-marker{515display:none516}517.collapsible-title{518-webkit-box-align:center;519-webkit-align-items:center;520-ms-flex-align:center;521align-items:center;522display:-webkit-box;523display:-webkit-flex;524display:-ms-flexbox;525display:flex526}527.collapsible-title .title{528-webkit-box-flex:1;529-webkit-flex:1 1 auto;530-ms-flex:1 1 auto;531flex:1 1 auto;532-webkit-box-ordinal-group:1;533-webkit-order:0;534-ms-flex-order:0;535order:0;536overflow:hidden;537text-overflow:ellipsis;538white-space:nowrap539}540.collapsible-title .chevron-down,.collapsible[open] .collapsible-title .chevron-up{541display:block542}543.collapsible-title .chevron-up,.collapsible[open] .collapsible-title .chevron-down{544display:none545}546.flat-button{547cursor:pointer;548display:inline-block;549font-weight:700;550text-transform:uppercase;551border-radius:2px;552padding:8px;553margin:-8px554}555.flat-icon-button{556background:0 0;557border:0;558margin:0;559outline:0;560padding:0;561margin:-12px;562padding:12px;563cursor:pointer;564box-sizing:content-box;565display:inline-block;566line-height:0567}568.flat-icon-button,.flat-icon-button .splash-wrapper{569border-radius:50%570}571.flat-icon-button .splash.animate{572-webkit-animation-duration:.3s;573animation-duration:.3s574}575body#layout .bg-photo,body#layout .bg-photo-overlay{576display:none577}578body#layout .page_body{579padding:0;580position:relative;581top:0582}583body#layout .page{584display:inline-block;585left:inherit;586position:relative;587vertical-align:top;588width:540px589}590body#layout .centered{591max-width:954px592}593body#layout .navigation{594display:none595}596body#layout .sidebar-container{597display:inline-block;598width:40%599}600body#layout .hamburger-menu,body#layout .search{601display:none602}603.overflowable-container{604max-height:44px;605overflow:hidden;606position:relative607}608.overflow-button{609cursor:pointer610}611#overflowable-dim-overlay{612background:0 0613}614.overflow-popup{615box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);616background-color:#ffffff;617left:0;618max-width:calc(100% - 32px);619position:absolute;620top:0;621visibility:hidden;622z-index:101623}624.overflow-popup ul{625list-style:none626}627.overflow-popup .tabs li,.overflow-popup li{628display:block;629height:auto630}631.overflow-popup .tabs li{632padding-left:0;633padding-right:0634}635.overflow-button.hidden,.overflow-popup .tabs li.hidden,.overflow-popup li.hidden{636display:none637}638.widget.Sharing .sharing-button{639display:none640}641.widget.Sharing .sharing-buttons li{642padding:0643}644.widget.Sharing .sharing-buttons li span{645display:none646}647.post-share-buttons{648position:relative649}650.centered-bottom .share-buttons .svg-icon-24,.share-buttons .svg-icon-24{651fill:#729c0b652}653.sharing-open.touch-icon-button:active .touch-icon,.sharing-open.touch-icon-button:focus .touch-icon{654background-color:transparent655}656.share-buttons{657background-color:#ffffff;658border-radius:2px;659box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);660color:#000000;661list-style:none;662margin:0;663padding:8px 0;664position:absolute;665top:-11px;666min-width:200px;667z-index:101668}669.share-buttons.hidden{670display:none671}672.sharing-button{673background:0 0;674border:0;675margin:0;676outline:0;677padding:0;678cursor:pointer679}680.share-buttons li{681margin:0;682height:48px683}684.share-buttons li:last-child{685margin-bottom:0686}687.share-buttons li .sharing-platform-button{688box-sizing:border-box;689cursor:pointer;690display:block;691height:100%;692margin-bottom:0;693padding:0 16px;694position:relative;695width:100%696}697.share-buttons li .sharing-platform-button:focus,.share-buttons li .sharing-platform-button:hover{698background-color:rgba(128,128,128,.1);699outline:0700}701.share-buttons li svg[class*=" sharing-"],.share-buttons li svg[class^=sharing-]{702position:absolute;703top:10px704}705.share-buttons li span.sharing-platform-button{706position:relative;707top:0708}709.share-buttons li .platform-sharing-text{710display:block;711font-size:16px;712line-height:48px;713white-space:nowrap714}715.share-buttons li .platform-sharing-text{716margin-left:56px717}718.sidebar-container{719background-color:#f7f7f7;720max-width:280px;721overflow-y:auto;722-webkit-transition-property:-webkit-transform;723transition-property:-webkit-transform;724transition-property:transform;725transition-property:transform,-webkit-transform;726-webkit-transition-duration:.3s;727transition-duration:.3s;728-webkit-transition-timing-function:cubic-bezier(0,0,.2,1);729transition-timing-function:cubic-bezier(0,0,.2,1);730width:280px;731z-index:101;732-webkit-overflow-scrolling:touch733}734.sidebar-container .navigation{735line-height:0;736padding:16px737}738.sidebar-container .sidebar-back{739cursor:pointer740}741.sidebar-container .widget{742background:0 0;743margin:0 16px;744padding:16px 0745}746.sidebar-container .widget .title{747color:#000000;748margin:0749}750.sidebar-container .widget ul{751list-style:none;752margin:0;753padding:0754}755.sidebar-container .widget ul ul{756margin-left:1em757}758.sidebar-container .widget li{759font-size:16px;760line-height:normal761}762.sidebar-container .widget+.widget{763border-top:1px solid rgba(0, 0, 0, 0.12)764}765.BlogArchive li{766margin:16px 0767}768.BlogArchive li:last-child{769margin-bottom:0770}771.Label li a{772display:inline-block773}774.BlogArchive .post-count,.Label .label-count{775float:right;776margin-left:.25em777}778.BlogArchive .post-count::before,.Label .label-count::before{779content:"("780}781.BlogArchive .post-count::after,.Label .label-count::after{782content:")"783}784.widget.Translate .skiptranslate>div{785display:block!important786}787.widget.Profile .profile-link{788display:-webkit-box;789display:-webkit-flex;790display:-ms-flexbox;791display:flex792}793.widget.Profile .team-member .default-avatar-wrapper,.widget.Profile .team-member .profile-img{794-webkit-box-flex:0;795-webkit-flex:0 0 auto;796-ms-flex:0 0 auto;797flex:0 0 auto;798margin-right:1em799}800.widget.Profile .individual .profile-link{801-webkit-box-orient:vertical;802-webkit-box-direction:normal;803-webkit-flex-direction:column;804-ms-flex-direction:column;805flex-direction:column806}807.widget.Profile .team .profile-link .profile-name{808-webkit-align-self:center;809-ms-flex-item-align:center;810align-self:center;811display:block;812-webkit-box-flex:1;813-webkit-flex:1 1 auto;814-ms-flex:1 1 auto;815flex:1 1 auto816}817.dim-overlay{818background-color:rgba(0,0,0,.54);819z-index:100820}821body.sidebar-visible{822overflow-y:hidden823}824@media screen and (max-width:680px){825.sidebar-container{826bottom:0;827position:fixed;828top:0;829left:auto;830right:0831}832.sidebar-container.sidebar-invisible{833-webkit-transition-timing-function:cubic-bezier(.4,0,.6,1);834transition-timing-function:cubic-bezier(.4,0,.6,1);835-webkit-transform:translateX(100%);836-ms-transform:translateX(100%);837transform:translateX(100%)838}839}840.dialog{841box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);842background:#ffffff;843box-sizing:border-box;844color:#000000;845padding:30px;846position:fixed;847text-align:center;848width:calc(100% - 24px);849z-index:101850}851.dialog input[type=email],.dialog input[type=text]{852background-color:transparent;853border:0;854border-bottom:solid 1px rgba(0,0,0,.12);855color:#000000;856display:block;857font-family:Ubuntu, sans-serif;858font-size:16px;859line-height:24px;860margin:auto;861padding-bottom:7px;862outline:0;863text-align:center;864width:100%865}866.dialog input[type=email]::-webkit-input-placeholder,.dialog input[type=text]::-webkit-input-placeholder{867color:rgba(0,0,0,.5)868}869.dialog input[type=email]::-moz-placeholder,.dialog input[type=text]::-moz-placeholder{870color:rgba(0,0,0,.5)871}872.dialog input[type=email]:-ms-input-placeholder,.dialog input[type=text]:-ms-input-placeholder{873color:rgba(0,0,0,.5)874}875.dialog input[type=email]::-ms-input-placeholder,.dialog input[type=text]::-ms-input-placeholder{876color:rgba(0,0,0,.5)877}878.dialog input[type=email]::placeholder,.dialog input[type=text]::placeholder{879color:rgba(0,0,0,.5)880}881.dialog input[type=email]:focus,.dialog input[type=text]:focus{882border-bottom:solid 2px #729c0b;883padding-bottom:6px884}885.dialog input.no-cursor{886color:transparent;887text-shadow:0 0 0 #000000888}889.dialog input.no-cursor:focus{890outline:0891}892.dialog input.no-cursor:focus{893outline:0894}895.dialog input[type=submit]{896font-family:Ubuntu, sans-serif897}898.dialog .goog-buttonset-default{899color:#729c0b900}901.loading-spinner-large{902-webkit-animation:mspin-rotate 1.568s infinite linear;903animation:mspin-rotate 1.568s infinite linear;904height:48px;905overflow:hidden;906position:absolute;907width:48px;908z-index:200909}910.loading-spinner-large>div{911-webkit-animation:mspin-revrot 5332ms infinite steps(4);912animation:mspin-revrot 5332ms infinite steps(4)913}914.loading-spinner-large>div>div{915-webkit-animation:mspin-singlecolor-large-film 1333ms infinite steps(81);916animation:mspin-singlecolor-large-film 1333ms infinite steps(81);917background-size:100%;918height:48px;919width:3888px920}921.mspin-black-large>div>div,.mspin-grey_54-large>div>div{922background-image:url(https://www.blogblog.com/indie/mspin_black_large.svg)923}924.mspin-white-large>div>div{925background-image:url(https://www.blogblog.com/indie/mspin_white_large.svg)926}927.mspin-grey_54-large{928opacity:.54929}930@-webkit-keyframes mspin-singlecolor-large-film{931from{932-webkit-transform:translateX(0);933transform:translateX(0)934}935to{936-webkit-transform:translateX(-3888px);937transform:translateX(-3888px)938}939}940@keyframes mspin-singlecolor-large-film{941from{942-webkit-transform:translateX(0);943transform:translateX(0)944}945to{946-webkit-transform:translateX(-3888px);947transform:translateX(-3888px)948}949}950@-webkit-keyframes mspin-rotate{951from{952-webkit-transform:rotate(0);953transform:rotate(0)954}955to{956-webkit-transform:rotate(360deg);957transform:rotate(360deg)958}959}960@keyframes mspin-rotate{961from{962-webkit-transform:rotate(0);963transform:rotate(0)964}965to{966-webkit-transform:rotate(360deg);967transform:rotate(360deg)968}969}970@-webkit-keyframes mspin-revrot{971from{972-webkit-transform:rotate(0);973transform:rotate(0)974}975to{976-webkit-transform:rotate(-360deg);977transform:rotate(-360deg)978}979}980@keyframes mspin-revrot{981from{982-webkit-transform:rotate(0);983transform:rotate(0)984}985to{986-webkit-transform:rotate(-360deg);987transform:rotate(-360deg)988}989}990.subscribe-popup{991max-width:364px992}993.subscribe-popup h3{994color:#212121;995font-size:1.8em;996margin-top:0997}998.subscribe-popup .FollowByEmail h3{999display:none1000}1001.subscribe-popup .FollowByEmail .follow-by-email-submit{1002color:#729c0b;1003display:inline-block;1004margin:0 auto;1005margin-top:24px;1006width:auto;1007white-space:normal1008}1009.subscribe-popup .FollowByEmail .follow-by-email-submit:disabled{1010cursor:default;1011opacity:.31012}1013@media (max-width:800px){1014.blog-name div.widget.Subscribe{1015margin-bottom:16px1016}1017body.item-view .blog-name div.widget.Subscribe{1018margin:8px auto 16px auto;1019width:100%1020}1021}1022.sidebar-container .svg-icon-24{1023fill:#729c0b1024}1025.centered-top .svg-icon-24{1026fill:#729c0b1027}1028.centered-bottom .svg-icon-24.touch-icon,.centered-bottom a .svg-icon-24,.centered-bottom button .svg-icon-24{1029fill:#729c0b1030}1031.post-wrapper .svg-icon-24.touch-icon,.post-wrapper a .svg-icon-24,.post-wrapper button .svg-icon-24{1032fill:#729c0b1033}1034.centered-bottom .share-buttons .svg-icon-24,.share-buttons .svg-icon-24{1035fill:#729c0b1036}1037.svg-icon-24.hamburger-menu{1038fill:#729c0b1039}1040body#layout .page_body{1041padding:0;1042position:relative;1043top:01044}1045body#layout .page{1046display:inline-block;1047left:inherit;1048position:relative;1049vertical-align:top;1050width:540px1051}1052body{1053background:#f7f7f7 none repeat scroll top left;1054background-color:#f7f7f7;1055background-size:cover;1056color:#000000;1057font:400 16px Ubuntu, sans-serif;1058margin:0;1059min-height:100vh1060}1061h3,h3.title{1062color:#0000001063}1064.post-wrapper .post-title,.post-wrapper .post-title a,.post-wrapper .post-title a:hover,.post-wrapper .post-title a:visited{1065color:#2121211066}1067a{1068color:#729c0b;1069font-style:normal;1070text-decoration:none1071}1072a:visited{1073color:#729c0b1074}1075a:hover{1076color:#729c0b1077}1078blockquote{1079color:#424242;1080font:400 16px Ubuntu, sans-serif;1081font-size:x-large;1082font-style:italic;1083font-weight:300;1084text-align:center1085}1086.dim-overlay{1087z-index:1001088}1089.page{1090box-sizing:border-box;1091display:-webkit-box;1092display:-webkit-flex;1093display:-ms-flexbox;1094display:flex;1095-webkit-box-orient:vertical;1096-webkit-box-direction:normal;1097-webkit-flex-direction:column;1098-ms-flex-direction:column;1099flex-direction:column;1100min-height:100vh;1101padding-bottom:1em1102}1103.page>*{1104-webkit-box-flex:0;1105-webkit-flex:0 0 auto;1106-ms-flex:0 0 auto;1107flex:0 0 auto1108}1109.page>#footer{1110margin-top:auto1111}1112.bg-photo-container{1113overflow:hidden1114}1115.bg-photo-container,.bg-photo-container .bg-photo{1116height:464px;1117width:100%1118}1119.bg-photo-container .bg-photo{1120background-position:center;1121background-size:cover;1122z-index:-11123}1124.centered{1125margin:0 auto;1126position:relative;1127width:1482px1128}1129.centered .main,.centered .main-container{1130float:left1131}1132.centered .main{1133padding-bottom:1em1134}1135.centered .centered-bottom::after{1136clear:both;1137content:"";1138display:table1139}1140@media (min-width:1626px){1141.page_body.has-vertical-ads .centered{1142width:1625px1143}1144}1145@media (min-width:1225px) and (max-width:1482px){1146.centered{1147width:1081px1148}1149}1150@media (min-width:1225px) and (max-width:1625px){1151.page_body.has-vertical-ads .centered{1152width:1224px1153}1154}1155@media (max-width:1224px){1156.centered{1157width:680px1158}1159}1160@media (max-width:680px){1161.centered{1162max-width:600px;1163width:100%1164}1165}1166.feed-view .post-wrapper.hero,.main,.main-container,.post-filter-message,.top-nav .section{1167width:1187px1168}1169@media (min-width:1225px) and (max-width:1482px){1170.feed-view .post-wrapper.hero,.main,.main-container,.post-filter-message,.top-nav .section{1171width:786px1172}1173}1174@media (min-width:1225px) and (max-width:1625px){1175.feed-view .page_body.has-vertical-ads .post-wrapper.hero,.page_body.has-vertical-ads .feed-view .post-wrapper.hero,.page_body.has-vertical-ads .main,.page_body.has-vertical-ads .main-container,.page_body.has-vertical-ads .post-filter-message,.page_body.has-vertical-ads .top-nav .section{1176width:786px1177}1178}1179@media (max-width:1224px){1180.feed-view .post-wrapper.hero,.main,.main-container,.post-filter-message,.top-nav .section{1181width:auto1182}1183}1184.widget .title{1185font-size:18px;1186line-height:28px;1187margin:18px 01188}1189.extendable .show-less,.extendable .show-more{1190color:#729c0b;1191font:500 12px Ubuntu, sans-serif;1192cursor:pointer;1193text-transform:uppercase;1194margin:0 -16px;1195padding:16px1196}1197.widget.Profile{1198font:400 16px Ubuntu, sans-serif1199}1200.sidebar-container .widget.Profile{

Showing the first 1,200 of 3118 lines. Download the file for the rest.