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.
221.8k
1<!DOCTYPE html>2<html dir="ltr" lang="en">3 <head>4 <meta content="width=device-width, initial-scale=1" name="viewport">5 <title>6 Our Fall/Autumn maple tree!7 </title>8 <meta content="text/html; charset=utf-8" http-equiv="Content-Type">9 <!-- Chrome, Firefox OS and Opera -->10 <meta content="#fdfaf0" name="theme-color">11 <!-- Windows Phone -->12 <meta content="#fdfaf0" name="msapplication-navbutton-color">13 <meta content="blogger" name="generator">14 <!--Can't find substitution for tag [blog.ieCssRetrofitLinks]-->15 <meta content="" property="og:url">16 <meta content="Our Fall/Autumn maple tree!" property="og:title">17 <meta content="Elementary Educator :*) Passionate about teaching kindergarten, piano, inquiry-based 21st century learning, Reggio Emillia, and self-empowerment." property="og:description">18 <meta content="" property="og:image">19 <style type="text/css">20 @font-face{font-family:'EB Garamond';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ebgaramond/v27/SlGDmQSNjdsmc35JDF1K5E55YMjF_7DPuGi-6_RkCY9_S6w.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:'EB Garamond';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ebgaramond/v27/SlGDmQSNjdsmc35JDF1K5E55YMjF_7DPuGi-6_RkAI9_S6w.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ebgaramond/v27/SlGDmQSNjdsmc35JDF1K5E55YMjF_7DPuGi-6_RkCI9_S6w.woff2)format('woff2');unicode-range:U+1F00-1FFF;}@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ebgaramond/v27/SlGDmQSNjdsmc35JDF1K5E55YMjF_7DPuGi-6_RkB49_S6w.woff2)format('woff2');unicode-range:U+0370-03FF;}@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ebgaramond/v27/SlGDmQSNjdsmc35JDF1K5E55YMjF_7DPuGi-6_RkC49_S6w.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:'EB Garamond';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ebgaramond/v27/SlGDmQSNjdsmc35JDF1K5E55YMjF_7DPuGi-6_RkCo9_S6w.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:'EB Garamond';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/ebgaramond/v27/SlGDmQSNjdsmc35JDF1K5E55YMjF_7DPuGi-6_RkBI9_.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:'Lora';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/lora/v32/0QI6MX1D_JOuGQbT0gvTJPa787weuxJMkq1umA.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:'Lora';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/lora/v32/0QI6MX1D_JOuGQbT0gvTJPa787weuxJFkq1umA.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'Lora';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/lora/v32/0QI6MX1D_JOuGQbT0gvTJPa787weuxJOkq1umA.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:'Lora';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/lora/v32/0QI6MX1D_JOuGQbT0gvTJPa787weuxJPkq1umA.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:'Lora';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/lora/v32/0QI6MX1D_JOuGQbT0gvTJPa787weuxJBkq0.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:'Montserrat';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459WRhyzbi.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:'Montserrat';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'Montserrat';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459WZhyzbi.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:'Montserrat';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459Wdhyzbi.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:'Montserrat';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459Wlhyw.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:'Montserrat';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459WRhyzbi.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:'Montserrat';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2)format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459WZhyzbi.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:'Montserrat';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459Wdhyzbi.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:'Montserrat';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459Wlhyw.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;}21 </style>22 <style id="page-skin-1" type="text/css">23 <!--24/*! 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}25/*!************************************************26* Blogger Template Style27* Name: Soho28**************************************************/29body{30overflow-wrap:break-word;31word-break:break-word;32word-wrap:break-word33}34.hidden{35display:none36}37.invisible{38visibility:hidden39}40.container::after,.float-container::after{41clear:both;42content:"";43display:table44}45.clearboth{46clear:both47}48#comments .comment .comment-actions,.subscribe-popup .FollowByEmail .follow-by-email-submit{49background:0 0;50border:0;51box-shadow:none;52color:#a93e33;53cursor:pointer;54font-size:14px;55font-weight:700;56outline:0;57text-decoration:none;58text-transform:uppercase;59width:auto60}61.dim-overlay{62background-color:rgba(0,0,0,.54);63height:100vh;64left:0;65position:fixed;66top:0;67width:100%68}69#sharing-dim-overlay{70background-color:transparent71}72input::-ms-clear{73display:none74}75.blogger-logo,.svg-icon-24.blogger-logo{76fill:#ff9800;77opacity:178}79.loading-spinner-large{80-webkit-animation:mspin-rotate 1.568s infinite linear;81animation:mspin-rotate 1.568s infinite linear;82height:48px;83overflow:hidden;84position:absolute;85width:48px;86z-index:20087}88.loading-spinner-large>div{89-webkit-animation:mspin-revrot 5332ms infinite steps(4);90animation:mspin-revrot 5332ms infinite steps(4)91}92.loading-spinner-large>div>div{93-webkit-animation:mspin-singlecolor-large-film 1333ms infinite steps(81);94animation:mspin-singlecolor-large-film 1333ms infinite steps(81);95background-size:100%;96height:48px;97width:3888px98}99.mspin-black-large>div>div,.mspin-grey_54-large>div>div{100background-image:url(https://www.blogblog.com/indie/mspin_black_large.svg)101}102.mspin-white-large>div>div{103background-image:url(https://www.blogblog.com/indie/mspin_white_large.svg)104}105.mspin-grey_54-large{106opacity:.54107}108@-webkit-keyframes mspin-singlecolor-large-film{109from{110-webkit-transform:translateX(0);111transform:translateX(0)112}113to{114-webkit-transform:translateX(-3888px);115transform:translateX(-3888px)116}117}118@keyframes mspin-singlecolor-large-film{119from{120-webkit-transform:translateX(0);121transform:translateX(0)122}123to{124-webkit-transform:translateX(-3888px);125transform:translateX(-3888px)126}127}128@-webkit-keyframes mspin-rotate{129from{130-webkit-transform:rotate(0);131transform:rotate(0)132}133to{134-webkit-transform:rotate(360deg);135transform:rotate(360deg)136}137}138@keyframes mspin-rotate{139from{140-webkit-transform:rotate(0);141transform:rotate(0)142}143to{144-webkit-transform:rotate(360deg);145transform:rotate(360deg)146}147}148@-webkit-keyframes mspin-revrot{149from{150-webkit-transform:rotate(0);151transform:rotate(0)152}153to{154-webkit-transform:rotate(-360deg);155transform:rotate(-360deg)156}157}158@keyframes mspin-revrot{159from{160-webkit-transform:rotate(0);161transform:rotate(0)162}163to{164-webkit-transform:rotate(-360deg);165transform:rotate(-360deg)166}167}168.skip-navigation{169background-color:#fff;170box-sizing:border-box;171color:#000;172display:block;173height:0;174left:0;175line-height:50px;176overflow:hidden;177padding-top:0;178position:fixed;179text-align:center;180top:0;181-webkit-transition:box-shadow .3s,height .3s,padding-top .3s;182transition:box-shadow .3s,height .3s,padding-top .3s;183width:100%;184z-index:900185}186.skip-navigation:focus{187box-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);188height:50px189}190#main{191outline:0192}193.main-heading{194position:absolute;195clip:rect(1px,1px,1px,1px);196padding:0;197border:0;198height:1px;199width:1px;200overflow:hidden201}202.Attribution{203margin-top:1em;204text-align:center205}206.Attribution .blogger img,.Attribution .blogger svg{207vertical-align:bottom208}209.Attribution .blogger img{210margin-right:.5em211}212.Attribution div{213line-height:24px;214margin-top:.5em215}216.Attribution .copyright,.Attribution .image-attribution{217font-size:.7em;218margin-top:1.5em219}220.BLOG_mobile_video_class{221display:none222}223.bg-photo{224background-attachment:scroll!important225}226body .CSS_LIGHTBOX{227z-index:900228}229.extendable .show-less,.extendable .show-more{230border-color:#a93e33;231color:#a93e33;232margin-top:8px233}234.extendable .show-less.hidden,.extendable .show-more.hidden{235display:none236}237.inline-ad{238display:none;239max-width:100%;240overflow:hidden241}242.adsbygoogle{243display:block244}245#cookieChoiceInfo{246bottom:0;247top:auto248}249iframe.b-hbp-video{250border:0251}252.post-body img{253max-width:100%254}255.post-body iframe{256max-width:100%257}258.post-body a[imageanchor="1"]{259display:inline-block260}261.byline{262margin-right:1em263}264.byline:last-child{265margin-right:0266}267.link-copied-dialog{268max-width:520px;269outline:0270}271.link-copied-dialog .modal-dialog-buttons{272margin-top:8px273}274.link-copied-dialog .goog-buttonset-default{275background:0 0;276border:0277}278.link-copied-dialog .goog-buttonset-default:focus{279outline:0280}281.paging-control-container{282margin-bottom:16px283}284.paging-control-container .paging-control{285display:inline-block286}287.paging-control-container .comment-range-text::after,.paging-control-container .paging-control{288color:#a93e33289}290.paging-control-container .comment-range-text,.paging-control-container .paging-control{291margin-right:8px292}293.paging-control-container .comment-range-text::after,.paging-control-container .paging-control::after{294content:"\b7";295cursor:default;296padding-left:8px;297pointer-events:none298}299.paging-control-container .comment-range-text:last-child::after,.paging-control-container .paging-control:last-child::after{300content:none301}302.byline.reactions iframe{303height:20px304}305.b-notification{306color:#000;307background-color:#fff;308border-bottom:solid 1px #000;309box-sizing:border-box;310padding:16px 32px;311text-align:center312}313.b-notification.visible{314-webkit-transition:margin-top .3s cubic-bezier(.4,0,.2,1);315transition:margin-top .3s cubic-bezier(.4,0,.2,1)316}317.b-notification.invisible{318position:absolute319}320.b-notification-close{321position:absolute;322right:8px;323top:8px324}325.no-posts-message{326line-height:40px;327text-align:center328}329@media screen and (max-width:1162px){330body.item-view .post-body a[imageanchor="1"][style*="float: left;"],body.item-view .post-body a[imageanchor="1"][style*="float: right;"]{331float:none!important;332clear:none!important333}334body.item-view .post-body a[imageanchor="1"] img{335display:block;336height:auto;337margin:0 auto338}339body.item-view .post-body>.separator:first-child>a[imageanchor="1"]:first-child{340margin-top:20px341}342.post-body a[imageanchor]{343display:block344}345body.item-view .post-body a[imageanchor="1"]{346margin-left:0!important;347margin-right:0!important348}349body.item-view .post-body a[imageanchor="1"]+a[imageanchor="1"]{350margin-top:16px351}352}353.item-control{354display:none355}356#comments{357border-top:1px dashed rgba(0,0,0,.54);358margin-top:20px;359padding:20px360}361#comments .comment-thread ol{362margin:0;363padding-left:0;364padding-left:0365}366#comments .comment .comment-replybox-single,#comments .comment-thread .comment-replies{367margin-left:60px368}369#comments .comment-thread .thread-count{370display:none371}372#comments .comment{373list-style-type:none;374padding:0 0 30px;375position:relative376}377#comments .comment .comment{378padding-bottom:8px379}380.comment .avatar-image-container{381position:absolute382}383.comment .avatar-image-container img{384border-radius:50%385}386.avatar-image-container svg,.comment .avatar-image-container .avatar-icon{387border-radius:50%;388border:solid 1px #000000;389box-sizing:border-box;390fill:#000000;391height:35px;392margin:0;393padding:7px;394width:35px395}396.comment .comment-block{397margin-top:10px;398margin-left:60px;399padding-bottom:0400}401#comments .comment-author-header-wrapper{402margin-left:40px403}404#comments .comment .thread-expanded .comment-block{405padding-bottom:20px406}407#comments .comment .comment-header .user,#comments .comment .comment-header .user a{408color:#000000;409font-style:normal;410font-weight:700411}412#comments .comment .comment-actions{413bottom:0;414margin-bottom:15px;415position:absolute416}417#comments .comment .comment-actions>*{418margin-right:8px419}420#comments .comment .comment-header .datetime{421bottom:0;422color:#000000;423display:inline-block;424font-size:13px;425font-style:italic;426margin-left:8px427}428#comments .comment .comment-footer .comment-timestamp a,#comments .comment .comment-header .datetime a{429color:#000000430}431#comments .comment .comment-content,.comment .comment-body{432margin-top:12px;433word-break:break-word434}435.comment-body{436margin-bottom:12px437}438#comments.embed[data-num-comments="0"]{439border:0;440margin-top:0;441padding-top:0442}443#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{444display:none445}446#comment-editor-src{447display:none448}449.comments .comments-content .loadmore.loaded{450max-height:0;451opacity:0;452overflow:hidden453}454.extendable .remaining-items{455height:0;456overflow:hidden;457-webkit-transition:height .3s cubic-bezier(.4,0,.2,1);458transition:height .3s cubic-bezier(.4,0,.2,1)459}460.extendable .remaining-items.expanded{461height:auto462}463.svg-icon-24,.svg-icon-24-button{464cursor:pointer;465height:24px;466width:24px;467min-width:24px468}469.touch-icon{470margin:-12px;471padding:12px472}473.touch-icon:active,.touch-icon:focus{474background-color:rgba(153,153,153,.4);475border-radius:50%476}477svg:not(:root).touch-icon{478overflow:visible479}480html[dir=rtl] .rtl-reversible-icon{481-webkit-transform:scaleX(-1);482-ms-transform:scaleX(-1);483transform:scaleX(-1)484}485.svg-icon-24-button,.touch-icon-button{486background:0 0;487border:0;488margin:0;489outline:0;490padding:0491}492.touch-icon-button .touch-icon:active,.touch-icon-button .touch-icon:focus{493background-color:transparent494}495.touch-icon-button:active .touch-icon,.touch-icon-button:focus .touch-icon{496background-color:rgba(153,153,153,.4);497border-radius:50%498}499.Profile .default-avatar-wrapper .avatar-icon{500border-radius:50%;501border:solid 1px #000000;502box-sizing:border-box;503fill:#000000;504margin:0505}506.Profile .individual .default-avatar-wrapper .avatar-icon{507padding:25px508}509.Profile .individual .avatar-icon,.Profile .individual .profile-img{510height:120px;511width:120px512}513.Profile .team .default-avatar-wrapper .avatar-icon{514padding:8px515}516.Profile .team .avatar-icon,.Profile .team .default-avatar-wrapper,.Profile .team .profile-img{517height:40px;518width:40px519}520.snippet-container{521margin:0;522position:relative;523overflow:hidden524}525.snippet-fade{526bottom:0;527box-sizing:border-box;528position:absolute;529width:96px530}531.snippet-fade{532right:0533}534.snippet-fade:after{535content:"\2026"536}537.snippet-fade:after{538float:right539}540.centered-top-container.sticky{541left:0;542position:fixed;543right:0;544top:0;545width:auto;546z-index:50;547-webkit-transition-property:opacity,-webkit-transform;548transition-property:opacity,-webkit-transform;549transition-property:transform,opacity;550transition-property:transform,opacity,-webkit-transform;551-webkit-transition-duration:.2s;552transition-duration:.2s;553-webkit-transition-timing-function:cubic-bezier(.4,0,.2,1);554transition-timing-function:cubic-bezier(.4,0,.2,1)555}556.centered-top-placeholder{557display:none558}559.collapsed-header .centered-top-placeholder{560display:block561}562.centered-top-container .Header .replaced h1,.centered-top-placeholder .Header .replaced h1{563display:none564}565.centered-top-container.sticky .Header .replaced h1{566display:block567}568.centered-top-container.sticky .Header .header-widget{569background:0 0570}571.centered-top-container.sticky .Header .header-image-wrapper{572display:none573}574.centered-top-container img,.centered-top-placeholder img{575max-width:100%576}577.collapsible{578-webkit-transition:height .3s cubic-bezier(.4,0,.2,1);579transition:height .3s cubic-bezier(.4,0,.2,1)580}581.collapsible,.collapsible>summary{582display:block;583overflow:hidden584}585.collapsible>:not(summary){586display:none587}588.collapsible[open]>:not(summary){589display:block590}591.collapsible:focus,.collapsible>summary:focus{592outline:0593}594.collapsible>summary{595cursor:pointer;596display:block;597padding:0598}599.collapsible:focus>summary,.collapsible>summary:focus{600background-color:transparent601}602.collapsible>summary::-webkit-details-marker{603display:none604}605.collapsible-title{606-webkit-box-align:center;607-webkit-align-items:center;608-ms-flex-align:center;609align-items:center;610display:-webkit-box;611display:-webkit-flex;612display:-ms-flexbox;613display:flex614}615.collapsible-title .title{616-webkit-box-flex:1;617-webkit-flex:1 1 auto;618-ms-flex:1 1 auto;619flex:1 1 auto;620-webkit-box-ordinal-group:1;621-webkit-order:0;622-ms-flex-order:0;623order:0;624overflow:hidden;625text-overflow:ellipsis;626white-space:nowrap627}628.collapsible-title .chevron-down,.collapsible[open] .collapsible-title .chevron-up{629display:block630}631.collapsible-title .chevron-up,.collapsible[open] .collapsible-title .chevron-down{632display:none633}634.flat-button{635cursor:pointer;636display:inline-block;637font-weight:700;638text-transform:uppercase;639border-radius:2px;640padding:8px;641margin:-8px642}643.flat-icon-button{644background:0 0;645border:0;646margin:0;647outline:0;648padding:0;649margin:-12px;650padding:12px;651cursor:pointer;652box-sizing:content-box;653display:inline-block;654line-height:0655}656.flat-icon-button,.flat-icon-button .splash-wrapper{657border-radius:50%658}659.flat-icon-button .splash.animate{660-webkit-animation-duration:.3s;661animation-duration:.3s662}663.overflowable-container{664max-height:28px;665overflow:hidden;666position:relative667}668.overflow-button{669cursor:pointer670}671#overflowable-dim-overlay{672background:0 0673}674.overflow-popup{675box-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);676background-color:#fdfaf0;677left:0;678max-width:calc(100% - 32px);679position:absolute;680top:0;681visibility:hidden;682z-index:101683}684.overflow-popup ul{685list-style:none686}687.overflow-popup .tabs li,.overflow-popup li{688display:block;689height:auto690}691.overflow-popup .tabs li{692padding-left:0;693padding-right:0694}695.overflow-button.hidden,.overflow-popup .tabs li.hidden,.overflow-popup li.hidden{696display:none697}698.search{699display:-webkit-box;700display:-webkit-flex;701display:-ms-flexbox;702display:flex;703line-height:24px;704width:24px705}706.search.focused{707width:100%708}709.search.focused .section{710width:100%711}712.search form{713z-index:101714}715.search h3{716display:none717}718.search form{719display:-webkit-box;720display:-webkit-flex;721display:-ms-flexbox;722display:flex;723-webkit-box-flex:1;724-webkit-flex:1 0 0;725-ms-flex:1 0 0px;726flex:1 0 0;727border-bottom:solid 1px transparent;728padding-bottom:8px729}730.search form>*{731display:none732}733.search.focused form>*{734display:block735}736.search .search-input label{737display:none738}739.centered-top-placeholder.cloned .search form{740z-index:30741}742.search.focused form{743border-color:#000000;744position:relative;745width:auto746}747.collapsed-header .centered-top-container .search.focused form{748border-bottom-color:transparent749}750.search-expand{751-webkit-box-flex:0;752-webkit-flex:0 0 auto;753-ms-flex:0 0 auto;754flex:0 0 auto755}756.search-expand-text{757display:none758}759.search-close{760display:inline;761vertical-align:middle762}763.search-input{764-webkit-box-flex:1;765-webkit-flex:1 0 1px;766-ms-flex:1 0 1px;767flex:1 0 1px768}769.search-input input{770background:0 0;771border:0;772box-sizing:border-box;773color:#000000;774display:inline-block;775outline:0;776width:calc(100% - 48px)777}778.search-input input.no-cursor{779color:transparent;780text-shadow:0 0 0 #000000781}782.collapsed-header .centered-top-container .search-action,.collapsed-header .centered-top-container .search-input input{783color:#000000784}785.collapsed-header .centered-top-container .search-input input.no-cursor{786color:transparent;787text-shadow:0 0 0 #000000788}789.collapsed-header .centered-top-container .search-input input.no-cursor:focus,.search-input input.no-cursor:focus{790outline:0791}792.search-focused>*{793visibility:hidden794}795.search-focused .search,.search-focused .search-icon{796visibility:visible797}798.search.focused .search-action{799display:block800}801.search.focused .search-action:disabled{802opacity:.3803}804.widget.Sharing .sharing-button{805display:none806}807.widget.Sharing .sharing-buttons li{808padding:0809}810.widget.Sharing .sharing-buttons li span{811display:none812}813.post-share-buttons{814position:relative815}816.centered-bottom .share-buttons .svg-icon-24,.share-buttons .svg-icon-24{817fill:#000000818}819.sharing-open.touch-icon-button:active .touch-icon,.sharing-open.touch-icon-button:focus .touch-icon{820background-color:transparent821}822.share-buttons{823background-color:#fdfaf0;824border-radius:2px;825box-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);826color:#000000;827list-style:none;828margin:0;829padding:8px 0;830position:absolute;831top:-11px;832min-width:200px;833z-index:101834}835.share-buttons.hidden{836display:none837}838.sharing-button{839background:0 0;840border:0;841margin:0;842outline:0;843padding:0;844cursor:pointer845}846.share-buttons li{847margin:0;848height:48px849}850.share-buttons li:last-child{851margin-bottom:0852}853.share-buttons li .sharing-platform-button{854box-sizing:border-box;855cursor:pointer;856display:block;857height:100%;858margin-bottom:0;859padding:0 16px;860position:relative;861width:100%862}863.share-buttons li .sharing-platform-button:focus,.share-buttons li .sharing-platform-button:hover{864background-color:rgba(128,128,128,.1);865outline:0866}867.share-buttons li svg[class*=" sharing-"],.share-buttons li svg[class^=sharing-]{868position:absolute;869top:10px870}871.share-buttons li span.sharing-platform-button{872position:relative;873top:0874}875.share-buttons li .platform-sharing-text{876display:block;877font-size:16px;878line-height:48px;879white-space:nowrap880}881.share-buttons li .platform-sharing-text{882margin-left:56px883}884.sidebar-container{885background-color:#f7f7f7;886max-width:284px;887overflow-y:auto;888-webkit-transition-property:-webkit-transform;889transition-property:-webkit-transform;890transition-property:transform;891transition-property:transform,-webkit-transform;892-webkit-transition-duration:.3s;893transition-duration:.3s;894-webkit-transition-timing-function:cubic-bezier(0,0,.2,1);895transition-timing-function:cubic-bezier(0,0,.2,1);896width:284px;897z-index:101;898-webkit-overflow-scrolling:touch899}900.sidebar-container .navigation{901line-height:0;902padding:16px903}904.sidebar-container .sidebar-back{905cursor:pointer906}907.sidebar-container .widget{908background:0 0;909margin:0 16px;910padding:16px 0911}912.sidebar-container .widget .title{913color:#000000;914margin:0915}916.sidebar-container .widget ul{917list-style:none;918margin:0;919padding:0920}921.sidebar-container .widget ul ul{922margin-left:1em923}924.sidebar-container .widget li{925font-size:16px;926line-height:normal927}928.sidebar-container .widget+.widget{929border-top:1px dashed #000000930}931.BlogArchive li{932margin:16px 0933}934.BlogArchive li:last-child{935margin-bottom:0936}937.Label li a{938display:inline-block939}940.BlogArchive .post-count,.Label .label-count{941float:right;942margin-left:.25em943}944.BlogArchive .post-count::before,.Label .label-count::before{945content:"("946}947.BlogArchive .post-count::after,.Label .label-count::after{948content:")"949}950.widget.Translate .skiptranslate>div{951display:block!important952}953.widget.Profile .profile-link{954display:-webkit-box;955display:-webkit-flex;956display:-ms-flexbox;957display:flex958}959.widget.Profile .team-member .default-avatar-wrapper,.widget.Profile .team-member .profile-img{960-webkit-box-flex:0;961-webkit-flex:0 0 auto;962-ms-flex:0 0 auto;963flex:0 0 auto;964margin-right:1em965}966.widget.Profile .individual .profile-link{967-webkit-box-orient:vertical;968-webkit-box-direction:normal;969-webkit-flex-direction:column;970-ms-flex-direction:column;971flex-direction:column972}973.widget.Profile .team .profile-link .profile-name{974-webkit-align-self:center;975-ms-flex-item-align:center;976align-self:center;977display:block;978-webkit-box-flex:1;979-webkit-flex:1 1 auto;980-ms-flex:1 1 auto;981flex:1 1 auto982}983.dim-overlay{984background-color:rgba(0,0,0,.54);985z-index:100986}987body.sidebar-visible{988overflow-y:hidden989}990@media screen and (max-width:1439px){991.sidebar-container{992bottom:0;993position:fixed;994top:0;995left:0;996right:auto997}998.sidebar-container.sidebar-invisible{999-webkit-transition-timing-function:cubic-bezier(.4,0,.6,1);1000transition-timing-function:cubic-bezier(.4,0,.6,1)1001}1002html[dir=ltr] .sidebar-container.sidebar-invisible{1003-webkit-transform:translateX(-284px);1004-ms-transform:translateX(-284px);1005transform:translateX(-284px)1006}1007html[dir=rtl] .sidebar-container.sidebar-invisible{1008-webkit-transform:translateX(284px);1009-ms-transform:translateX(284px);1010transform:translateX(284px)1011}1012}1013@media screen and (min-width:1440px){1014.sidebar-container{1015position:absolute;1016top:0;1017left:0;1018right:auto1019}1020.sidebar-container .navigation{1021display:none1022}1023}1024.dialog{1025box-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);1026background:#fdfaf0;1027box-sizing:border-box;1028color:#000000;1029padding:30px;1030position:fixed;1031text-align:center;1032width:calc(100% - 24px);1033z-index:1011034}1035.dialog input[type=email],.dialog input[type=text]{1036background-color:transparent;1037border:0;1038border-bottom:solid 1px rgba(0,0,0,.12);1039color:#000000;1040display:block;1041font-family:EB Garamond, serif;1042font-size:16px;1043line-height:24px;1044margin:auto;1045padding-bottom:7px;1046outline:0;1047text-align:center;1048width:100%1049}1050.dialog input[type=email]::-webkit-input-placeholder,.dialog input[type=text]::-webkit-input-placeholder{1051color:#0000001052}1053.dialog input[type=email]::-moz-placeholder,.dialog input[type=text]::-moz-placeholder{1054color:#0000001055}1056.dialog input[type=email]:-ms-input-placeholder,.dialog input[type=text]:-ms-input-placeholder{1057color:#0000001058}1059.dialog input[type=email]::-ms-input-placeholder,.dialog input[type=text]::-ms-input-placeholder{1060color:#0000001061}1062.dialog input[type=email]::placeholder,.dialog input[type=text]::placeholder{1063color:#0000001064}1065.dialog input[type=email]:focus,.dialog input[type=text]:focus{1066border-bottom:solid 2px #a93e33;1067padding-bottom:6px1068}1069.dialog input.no-cursor{1070color:transparent;1071text-shadow:0 0 0 #0000001072}1073.dialog input.no-cursor:focus{1074outline:01075}1076.dialog input.no-cursor:focus{1077outline:01078}1079.dialog input[type=submit]{1080font-family:EB Garamond, serif1081}1082.dialog .goog-buttonset-default{1083color:#a93e331084}1085.subscribe-popup{1086max-width:364px1087}1088.subscribe-popup h3{1089color:#2c1d14;1090font-size:1.8em;1091margin-top:01092}1093.subscribe-popup .FollowByEmail h3{1094display:none1095}1096.subscribe-popup .FollowByEmail .follow-by-email-submit{1097color:#a93e33;1098display:inline-block;1099margin:0 auto;1100margin-top:24px;1101width:auto;1102white-space:normal1103}1104.subscribe-popup .FollowByEmail .follow-by-email-submit:disabled{1105cursor:default;1106opacity:.31107}1108@media (max-width:800px){1109.blog-name div.widget.Subscribe{1110margin-bottom:16px1111}1112body.item-view .blog-name div.widget.Subscribe{1113margin:8px auto 16px auto;1114width:100%1115}1116}1117body#layout .bg-photo,body#layout .bg-photo-overlay{1118display:none1119}1120body#layout .page_body{1121padding:0;1122position:relative;1123top:01124}1125body#layout .page{1126display:inline-block;1127left:inherit;1128position:relative;1129vertical-align:top;1130width:540px1131}1132body#layout .centered{1133max-width:954px1134}1135body#layout .navigation{1136display:none1137}1138body#layout .sidebar-container{1139display:inline-block;1140width:40%1141}1142body#layout .hamburger-menu,body#layout .search{1143display:none1144}1145body{1146background-color:#fdfaf0;1147color:#000000;1148font:normal 400 20px EB Garamond, serif;1149height:100%;1150margin:0;1151min-height:100vh1152}1153h1,h2,h3,h4,h5,h6{1154font-weight:4001155}1156a{1157color:#a93e33;1158text-decoration:none1159}1160.dim-overlay{1161z-index:1001162}1163body.sidebar-visible .page_body{1164overflow-y:scroll1165}1166.widget .title{1167color:#000000;1168font:normal 400 12px Montserrat, sans-serif1169}1170.extendable .show-less,.extendable .show-more{1171color:#a93e33;1172font:normal 400 12px Montserrat, sans-serif;1173margin:12px -8px 0 -8px;1174text-transform:uppercase1175}1176.footer .widget,.main .widget{1177margin:50px 01178}1179.main .widget .title{1180text-transform:uppercase1181}1182.inline-ad{1183display:block;1184margin-top:50px1185}1186.adsbygoogle{1187text-align:center1188}1189.page_body{1190display:-webkit-box;1191display:-webkit-flex;1192display:-ms-flexbox;1193display:flex;1194-webkit-box-orient:vertical;1195-webkit-box-direction:normal;1196-webkit-flex-direction:column;1197-ms-flex-direction:column;1198flex-direction:column;1199min-height:100vh;1200position:relative;