@charset "UTF-8";.nowrap{white-space:nowrap}.nowrap:after,.nowrap:before{content:" ";display:table;clear:both}.btn .sr-only,.sr-only{position:absolute;display:inline-block;height:0;width:0;line-height:0;overflow:hidden}.green,.highlight,.success{color:#41b14f}.error,.red{color:#d33a2c}.darker-red{color:#61140f}.darkest-red{color:#390c09}.black{color:#000}.bold{font-weight:700}.in-progress,.orange,.pending{color:#f88040!important}.light-grey{color:#767676!important}.grey,.grey a{color:#666!important}.white{color:#fff!important}.display-block{display:block!important}.bg--grey{background-color:#f6f6f6}.bg--lighter-grey{background-image:linear-gradient(white,#f0f0f0)}.bg--light-grey{background-color:#fafafa}.bg--dark-grey{background-color:#666}.bg--red{background-color:#d33a2c}.bg--navy{background-color:#282634}.bg--green{background-color:#41b14f}.bg--light-green{background-color:#e3f5e5!important}.bg--light-red{background-color:#fbebea!important}.bg--dark-red{background-color:#811d15}.small{font-size:.8em!important}.smaller{font-size:.7em!important}.larger{font-size:1.2em!important}.padding-bottom{padding-bottom:4vh}.italic{font-style:italic!important}.thin{font-weight:400!important}.center{text-align:center!important}.float--right{float:right}.float--left{float:left}.elena{font-family:-apple-system,Arial,BlinkMacSystemFont,Roboto Slab,Droid Serif,Segoe UI,Ubuntu,Cantarell,sans-serif}.wf-loaded-stage2 .elena{font-family:Elena}.mija{font-family:-apple-system,Arial,BlinkMacSystemFont,Roboto Slab,Droid Serif,Segoe UI,Ubuntu,Cantarell,Georgia,serif}.wf-loaded-stage2 .mija{font-family:Mija}.mt-0{margin-top:0!important}.mb-0{margin-bottom:0!important}.mb-8{margin-bottom:2rem}.mb-12{margin-bottom:3rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}.mt-16{margin-top:4rem}.mt-12{margin-top:3rem}.mt-8{margin-top:2rem}.margin-center{margin:0 auto!important}.sticky{position:fixed;left:0;top:0;right:0;z-index:10;box-shadow:0 5px 10px rgba(0,0,0,.2)}.enhanced .no-js-only,.js .no-js-only{display:none}.text-shadow{text-shadow:1px 1px 1px rgba(0,0,0,.25)}/*! normalize.css v4.2.0 | MIT License | github.com/necolas/normalize.css */html{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,"Open Sans","Helvetica Neue",Arial,sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}figcaption,figure,main{display:block}figure{margin:0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder;letter-spacing:.25px}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}template{display:none}[hidden]{display:none}@media screen and (min-width:740px){.global-header,.header{padding:1rem 2em!important}}@media screen and (min-width:700px){.header,.header.searchFocused{grid-template-columns:-webkit-min-content minmax(140px,2fr) 0 minmax(100px,350px);grid-template-columns:min-content minmax(140px,2fr) 0 minmax(100px,350px)}}@media screen and (min-width:31.25em){.header{grid-template-columns:-webkit-min-content -webkit-min-content 0 minmax(100px,100%);grid-template-columns:min-content min-content 0 minmax(100px,100%);-moz-column-gap:10px;column-gap:10px}}.nav-item-link{color:#fff!important;transition:none!important}@media print{body{margin:0 .6cm 0 .6cm;padding:3mm 0}.noprint,.noprint *{display:none!important}.header-description,body{color:#222}.noprint{display:none;visibility:hidden}.c-felix-the-cat{padding:0}.author__image-wrapper::before,.bio-image::before,.book--featured__image:after,.book--featured__image:before,.book-details__book-image::after,.book-details__book-image::before,.books__book__image::before,.tilt::after,.tilt::before,img::after,img::before{display:none!important}body::after{content:" ";background:url(https://www.smashingmagazine.com/images/smashing-cat/cat-felix-the-cat.svg),url(https://www.smashingmagazine.com/images/icons/author.svg),url(https://www.smashingmagazine.com/images/icons/tags.svg),url(https://www.smashingmagazine.com/images/icons/published.svg);visibility:hidden;height:0;clear:both}.article__meta,.author{margin:.5em 0!important}.article-container .author--full>a{margin-bottom:0!important}.books__book__img{max-width:250px}.announcement,.article--grid__read-more,.article-header--meta,.article__comments-count,.back-to-top-wrapper,.books__tabs,.c-friskies-box,.cart-wrapper,.conf-panel__image,.content-tabs,.cookie-banner,.cookies,.curated-articles-container,.feature-panel,.featured-articles__teaser,.footer__links,.global-header,.header,.meow__masthead,.meta-box,.order-details__secondary-actions,.read-more-link,.tablesaw-bar{display:none}body{display:block}pre>code,pre[class]>code{font-size:.7em}a[href]{text-decoration:underline!important}a{text-shadow:none!important;background:0 0!important}.homepage:before{content:"Smashing Magazine";font-size:2em;font-weight:700;border-bottom:8px solid #ddd!important;padding:0 0 .25em 0;margin:.25em 0 .75em 0;width:100%;display:block}.homepage .container{padding:0;width:auto;max-width:auto}.homepage .article--post,.homepage .article--post__teaser{page-break-inside:avoid!important;page-break-after:auto!important;display:block!important;widows:3;orphans:3}.homepage main::before{content:"Don't miss these articles on SmashingMag:";font-size:1.5em;font-weight:700;display:block;margin-bottom:.5em;color:#666}.wf-loaded-stage2 .homepage main::before{font-family:Mija}.homepage .author__image-wrapper{filter:grayscale(100)}.homepage .author__desc__title{margin-bottom:-7px}.homepage .author{float:none;max-width:150px}.homepage .author__image{max-height:70px;transform:none!important}.homepage .author__image img{transform:none!important}.homepage .featured-article .nowrap{display:flex;flex-direction:row;text-align:left}.homepage .featured-article__intro{display:inline}.homepage h2{z-index:9;color:#c00!important}.homepage .featured-article__title a{display:inline-block;margin-left:0;padding-left:0;font-size:.8em}.homepage .featured-article__comments-count{color:#eee!important;font-size:.5em!important}.homepage .featured-article__tags{margin:0;padding:0;color:#eee;font-size:.8em}.homepage .featured-article__tags a{color:currentColor}.homepage .featured-article__title .featured-article__title__a{color:#333!important;padding-top:0}.homepage .featured-article__title .featured-article__title__a::after,.homepage .featured-article__title .featured-article__title__a::before{content:""}.homepage .featured-articles-container{display:flex;flex-direction:row;flex-wrap:wrap;margin-left:0;padding-left:0;margin-top:auto}.homepage .featured-article{width:50%!important;min-height:30%!important;margin-top:1.5em!important;margin-bottom:2.5em!important}.homepage .featured-article:nth-child(2n+1){padding:0 0 0 4%!important}.homepage .featured-article:nth-child(2n){padding:0 4% 0 1%!important}.homepage .article--grid__content,.homepage .article--grid__title{line-height:1.5}.homepage .article--grid__content a,.homepage .article--post__author-name a,.homepage .conf-panel a{padding:0 0 2px 0;color:#333;border-bottom:1px solid #e3e3e3}.homepage .left-lined{color:#222;position:absolute;left:10px;display:inline;text-align:left;-ms-font-feature-settings:"smcp" 1,"c2sc" 1;-o-font-feature-settings:"smcp" 1,"c2sc" 1;font-feature-settings:"smcp" 1,"c2sc" 1;font-variant:petite-caps;background-position:center 72%;line-height:1;font-size:1em;margin:0!important;max-width:13em;padding-left:.75em;transform-origin:left center;transform:rotateZ(90deg) translateX(-5px) translateY(1px)!important;text-transform:lowercase;letter-spacing:4px!important}.homepage .featured-articles-container{padding-bottom:2em}.homepage .latest-articles-container{border-top:8px solid #ddd;margin-top:0!important}.homepage .article--grid__container{padding-top:.25em}.homepage .article--grid__container div,.homepage .col--article--grid:first-of-type{margin:0 5% 0 5%;padding:.5em 0 0 0}.homepage .most-popular-articles-container{-moz-column-break-before:always!important;break-before:always!important;page-break-before:always!important;border-top:8px solid #ddd}.homepage .most-popular-articles-container .container{margin:0 5% 0 2.5%!important}.homepage .most-popular-articles-container .author__image-wrapper{position:static}.homepage .most-popular-articles-container .article--post{margin:.5em 0 1.35em 0!important}.homepage .most-popular-articles-container .article--post .author{float:left}.homepage .conf-panel{-moz-column-break-before:always!important;break-before:always!important;page-break-before:always!important;color:#222;border-top:8px solid #ddd;border-bottom:8px solid #ddd}.homepage .article--post__stats ul li{padding-left:0}.homepage .footer__topics__list,.homepage .footer__topics__title{display:none}.homepage .footer__notes{color:#222}.homepage .main-footer:after{content:"Cats can be forgetful, but we are not. \aThanks for being truly smashing — yet again. \awww.smashingmagazine.com";font-style:italic;color:#333!important;line-height:1.5em;margin-top:1.5em!important;display:inline-block;white-space:pre;text-align:center;width:100%}.article__content .meta-box{padding:1em;margin:0;list-style:none;width:100%;border-radius:11px;font-size:.75em}.wf-loaded-stage2 .article__content .meta-box{font-family:Mija}.meta-box li{margin-bottom:.5em;line-height:1.4;padding-left:30px;background-size:auto 20px;background-repeat:no-repeat;background-position:left top}.meta-box li:last-child{margin-bottom:0}.meta-box--author{background-image:url(https://www.smashingmagazine.com/images/icons/author.svg)!important}.meta-box--tags{background-image:url(https://www.smashingmagazine.com/images/icons/tags.svg)!important}.meta-box--published{background-image:url(https://www.smashingmagazine.com/images/icons/published.svg)!important}.articlepage .article__meta li:after{content:""}.articlepage .advertisement,.articlepage .article__related-articles__title,.articlepage .article__related-articles__title+.article--grid__container,.articlepage .load-more,.articlepage .product-panel--book,.articlepage [data-component=CommentsArea]{display:none}.articlepage:before{border-bottom:8px solid #ddd!important;display:block}.articlepage #main,.articlepage article{margin:0!important;padding:0!important}.articlepage .author a{padding-bottom:0!important;margin-bottom:0!important;z-index:4;overflow:hidden}.articlepage .author{max-height:200px}.articlepage .collapsible{display:flex;flex-direction:row;width:100%;border-top:8px solid #eee;border-bottom:8px solid #eee;padding-bottom:.5em;z-index:9!important}.articlepage [data-handler=ContentTabs]{border-top:8px solid #eee;border-bottom:8px solid #eee}.articlepage .article__summary,.articlepage .article__toc{display:table-cell!important}.articlepage .article__summary{width:97.5%;padding-right:2.5%;border-bottom:0;padding-bottom:.75em}.articlepage .article__summary h5{padding-bottom:1em}.articlepage .article__toc{width:47.5%;padding-left:2.5%;padding-top:1.5em}.articlepage .article__toc h5{padding-left:0}.articlepage .article__toc a{padding:0}.articlepage .article__content a[href]{line-height:1.65;color:#006fc6;background-image:none}.articlepage .article__content .author a[href]{color:#666!important}.articlepage .article__content .author a[href]::after{content:""}.articlepage .article__content .author figcaption a[href]::after,.articlepage .article__content a[href]::after{content:" (↦ " attr(href) ")";word-wrap:break-word;font-style:italic;font-size:.9em;white-space:wrap;opacity:.75;display:inline;color:#006fc6!important;text-decoration:none!important;background-image:none!important;text-shadow:none!important}.articlepage .article__content .meta-box li{display:inline}.articlepage .article__content .meta-box .meta-box--share{display:none}.articlepage .article__content .meta-box a[href]::after{content:""}.articlepage .article__content figure a[href]{margin-bottom:0;padding-bottom:0}.articlepage .footer__topics__list,.articlepage .footer__topics__title{display:none}.articlepage .footer__links,.articlepage .footer__links a,.articlepage .footer__notes,.articlepage .footer__notes a{color:#222!important;background-color:transparent!important;text-shadow:none!important}.articlepage .main-footer{text-align:center;margin:0 auto}.articlepage .main-footer:before{content:url(https://www.smashingmagazine.com/images/smashing-cat/cat-felix-the-cat.svg);width:200px!important;z-index:9;padding:.45em 0 .45em .7em;display:inline-block;white-space:pre;text-align:center;margin:1.5em auto 0 auto!important}.articlepage .main-footer:after{content:"Cats can be forgetful, but we are not. \aThanks for being truly smashing — yet again. \awww.smashingmagazine.com";font-style:italic;color:#333!important;line-height:1.5em;margin-top:1.5em!important;display:inline-block;white-space:pre;text-align:center;width:100%}.dashboard .announcement,.dashboard .dashboard__header,.dashboard .global-header,.dashboard .header,.dashboard .main-footer,.dashboard .order-details__secondary-actions,.dashboard .tablesaw-bar{display:none}.dashboard main{position:relative}.dashboard main::before{content:url(https://www.smashingmagazine.com/images/smashing-cat/cat-with-bottle-mouse.svg);width:200px!important;z-index:9;padding:.45em 0 .45em .7em;position:absolute;top:7.35em;right:0}.dashboard .dashboard::before{content:"Smashing Magazine";font-size:2em;font-weight:700;border-bottom:8px solid #ddd;padding:0 0 .25em 0;margin:.25em 0 1em 0;width:100%;display:block}.wf-loaded-stage2 .dashboard .dashboard::before{font-family:Mija}.dashboard .dashboard::after{content:"Cats can be forgetful, but we are not. \aThanks for being truly smashing — yet again. \awww.smashingmagazine.com";font-style:italic;font-size:.9em;color:#ccc;line-height:1.5em;margin-top:2.5em;display:block;width:85%;white-space:pre}.dashboard .container{padding:0;width:auto;max-width:auto}.dashboard .col,.dashboard .row{padding:0}.dashboard .dashboard__tab-section{padding:0;font-size:.8em}.dashboard .order-details__header{display:block;float:none;padding:0;margin-bottom:1em}.dashboard .dashboard__table.dashboard__table--order-details td,.dashboard .dashboard__table.dashboard__table--order-details th{padding-top:.4em!important;padding-bottom:.4em!important}.dashboard .dashboard .dashboard__table--order-details .order-details__name,.dashboard .dashboard .dashboard__table--order-details .order-details__price,.dashboard .dashboard .dashboard__table--order-details .order-details__qty,.dashboard .dashboard .dashboard__table--order-details .order-details__total{font-size:.75em!important}.dashboard .order-details__order-nb span{display:inline-block;font-size:.8em!important;text-transform:none}.dashboard .order-details--success .order-details__order-nb h2{font-size:1.5em}.dashboard .order-details__address .billing-status,.dashboard .order-details__address address,.dashboard .order-details__address h3{margin:0 0 1em 0}.dashboard .paid{color:#41b14f!important}.dashboard .order-details__order-nb-wrapper{display:block;width:100%;float:none}.dashboard .order-details__address-wrapper{display:inline-block;float:none;margin:0;padding:0;width:30%}.dashboard .order-details__footer td,.dashboard .order-details__footer th{padding-top:.25em;padding-bottom:.25em}.dashboard .order-details__sum-total th{font-size:1.5em;padding-left:1em}.dashboard .order-details__sum-total td{font-size:1.5em}.dashboard .order-details__address{background:0 0;padding:0}.dashboard .dashboard__table{margin-bottom:0}.dashboard .dashboard__table td,.dashboard .dashboard__table th{padding:.75em}.dashboard .dashboard__table--order-details .order-details__item__name{padding-left:.75em;width:55%}.dashboard .dashboard__table--order-details .order-details__subitem th{padding-left:2em}}