diff --git a/Magento_Theme/layout/default_head_blocks.xml b/Magento_Theme/layout/default_head_blocks.xml index 712ff5c7e..135d6ed7f 100644 --- a/Magento_Theme/layout/default_head_blocks.xml +++ b/Magento_Theme/layout/default_head_blocks.xml @@ -3,6 +3,7 @@ xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd" > + diff --git a/Magento_Theme/templates/root.phtml b/Magento_Theme/templates/root.phtml index f96c263cd..1078ec440 100644 --- a/Magento_Theme/templates/root.phtml +++ b/Magento_Theme/templates/root.phtml @@ -1,11 +1,11 @@ > > - + /> --> diff --git a/Snowdog_Components/package.json b/Snowdog_Components/package.json index a4b9df079..42bdfd6b1 100644 --- a/Snowdog_Components/package.json +++ b/Snowdog_Components/package.json @@ -35,5 +35,8 @@ }, "engines": { "node": "12.x" + }, + "devDependencies": { + "penthouse": "^2.3.2" } } diff --git a/Snowdog_Components/penthouse.js b/Snowdog_Components/penthouse.js new file mode 100644 index 000000000..ceb3ce0a2 --- /dev/null +++ b/Snowdog_Components/penthouse.js @@ -0,0 +1,32 @@ +/* + How this works: + 1. use https://github.com/pocketjoso/penthouse to generate critical.css containing header styles and setting other elements to display none + 2. remove @font-face rules and icons urls from critical.css + 2. enable https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/css-topics/css-critical-path.html + 3. display hidden elements when styles are loaded + +*/ + +const penthouse = require('penthouse'); +const fs = require('fs'); +const criticalFilePath = '../web/css'; + +penthouse({ + url: 'https://colibri.test/', + css: '../../../../pub/static/frontend/Snowdog/alpaca/en_US/css/styles.css', + width: 1600, + height: 232 +}) + .then(criticalCss => { + criticalCss += 'body>*:not(.page-wrapper),.page-wrapper>*:not(header,.contact-bar,.marketing-bar,.mega-menu){display: none}'; + fs.mkdir(criticalFilePath, { recursive: true }, (err) => { + if (err) { + return console.error(err); + } + fs.writeFileSync(`${criticalFilePath}/critical.css`, criticalCss); + console.log('critical.css created successfully!'); + }) + }) + .catch(err => { + console.error(err); + }) diff --git a/Snowdog_Components/yarn.lock b/Snowdog_Components/yarn.lock index 9200eeabd..f230c70f4 100644 --- a/Snowdog_Components/yarn.lock +++ b/Snowdog_Components/yarn.lock @@ -356,6 +356,11 @@ dependencies: "@types/unist" "*" +"@types/mime-types@^2.1.0": + version "2.1.0" + resolved "https://registry.yarnpkg.com/@types/mime-types/-/mime-types-2.1.0.tgz#9ca52cda363f699c69466c2a6ccdaad913ea7a73" + integrity sha1-nKUs2jY/aZxpRmwqbM2q2RPqenM= + "@types/minimist@^1.2.0": version "1.2.1" resolved "https://registry.yarnpkg.com/@types/minimist/-/minimist-1.2.1.tgz#283f669ff76d7b8260df8ab7a4262cc83d988256" @@ -436,6 +441,11 @@ after@0.8.2: resolved "https://registry.yarnpkg.com/after/-/after-0.8.2.tgz#fedb394f9f0e02aa9768e702bda23b505fae7e1f" integrity sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8= +agent-base@5: + version "5.1.1" + resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-5.1.1.tgz#e8fb3f242959db44d63be665db7a8e739537a32c" + integrity sha512-TMeqbNl2fMW0nMjTEPOwe3J/PRFP4vqeoNuQMG0HlMrtm5QxKqdvAkZ1pRBQ/ulIyDD5Yq0nJ7YbdD8ey0TO3g== + ajv-keywords@^1.0.0: version "1.5.1" resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-1.5.1.tgz#314dd0a4b3368fad3dfcdc54ede6171b886daf3c" @@ -806,6 +816,11 @@ async-foreach@^0.1.3: resolved "https://registry.yarnpkg.com/async-foreach/-/async-foreach-0.1.3.tgz#36121f845c0578172de419a97dbeb1d16ec34542" integrity sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI= +async-limiter@~1.0.0: + version "1.0.1" + resolved "https://registry.yarnpkg.com/async-limiter/-/async-limiter-1.0.1.tgz#dd379e94f0db8310b08291f9d64c3209766617fd" + integrity sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ== + async-settle@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/async-settle/-/async-settle-1.0.0.tgz#1d0a914bb02575bec8a8f3a74e5080f72b2c0c6b" @@ -1879,6 +1894,11 @@ crypto-random-string@^2.0.0: resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-2.0.0.tgz#ef2a7a966ec11083388369baa02ebead229b30d5" integrity sha512-v1plID3y9r/lPhviJ1wrXpLeyUIGAZ2SHNYTEapm7/8A9nLPoyvVp3RK/EPFqn5kEznyWgYZNsRtYYIWbuG8KA== +css-mediaquery@^0.1.2: + version "0.1.2" + resolved "https://registry.yarnpkg.com/css-mediaquery/-/css-mediaquery-0.1.2.tgz#6a2c37344928618631c54bd33cedd301da18bea0" + integrity sha1-aiw3NEkoYYYxxUvTPO3TAdoYvqA= + css-select-base-adapter@^0.1.1: version "0.1.1" resolved "https://registry.yarnpkg.com/css-select-base-adapter/-/css-select-base-adapter-0.1.1.tgz#3b2ff4972cc362ab88561507a95408a1432135d7" @@ -1899,6 +1919,14 @@ css-selector-parser@^1.3.0: resolved "https://registry.yarnpkg.com/css-selector-parser/-/css-selector-parser-1.4.1.tgz#03f9cb8a81c3e5ab2c51684557d5aaf6d2569759" integrity sha512-HYPSb7y/Z7BNDCOrakL4raGO2zltZkbeXyAd6Tg9obzix6QhzxCotdBl6VT0Dv4vZfJGVz3WL/xaEI9Ly3ul0g== +css-tree@1.0.0-alpha.28: + version "1.0.0-alpha.28" + resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.0.0-alpha.28.tgz#8e8968190d886c9477bc8d61e96f61af3f7ffa7f" + integrity sha512-joNNW1gCp3qFFzj4St6zk+Wh/NBv0vM5YbEreZk0SD4S23S+1xBKb6cLDg2uj4P4k/GUMlIm6cKIDqIG+vdt0w== + dependencies: + mdn-data "~1.1.0" + source-map "^0.5.3" + css-tree@1.0.0-alpha.37: version "1.0.0-alpha.37" resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.0.0-alpha.37.tgz#98bebd62c4c1d9f960ec340cf9f7522e30709a22" @@ -2013,6 +2041,13 @@ debug@3.X: dependencies: ms "^2.1.1" +debug@4, debug@^4.1.1: + version "4.3.2" + resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.2.tgz#f0a49c18ac8779e31d4a0c6029dfb76873c7428b" + integrity sha512-mOp8wKcvj7XxC78zLgw/ZA+6TSgkoE2C/ienthhRD298T7UNwAg9diBpLRxC0mOezLl4B0xV7M0cCO6P/O0Xhw== + dependencies: + ms "2.1.2" + debug@4.3.1, debug@^4.0.0, debug@^4.0.1, debug@^4.1.0, debug@^4.3.1: version "4.3.1" resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.1.tgz#f0d229c505e0c6d8c49ac553d1b13dc183f6b2ee" @@ -2885,7 +2920,7 @@ extglob@^2.0.4: snapdragon "^0.8.1" to-regex "^3.0.1" -extract-zip@^1.6.5: +extract-zip@^1.6.5, extract-zip@^1.6.6: version "1.7.0" resolved "https://registry.yarnpkg.com/extract-zip/-/extract-zip-1.7.0.tgz#556cc3ae9df7f452c493a0cfb51cc30277940927" integrity sha512-xoh5G1W/PB0/27lXgMQyIhP5DSY/LhoCsOyZgb+6iMmRtCwVBo55uKaMoEYrDCKQhWvqEip5ZPKAc6eFNyf/MA== @@ -4055,6 +4090,14 @@ http-signature@~1.2.0: jsprim "^1.2.2" sshpk "^1.7.0" +https-proxy-agent@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-4.0.0.tgz#702b71fb5520a132a66de1f67541d9e62154d82b" + integrity sha512-zoDhWrkR3of1l9QAL8/scJZyLu8j/gBkcwcaQOZh7Gyh/+uJQzGVETdgT30akuwkpL8HTRfssqI3BZuV18teDg== + dependencies: + agent-base "5" + debug "4" + human-signals@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-2.1.0.tgz#dc91fcba42e4d06e4abaed33b3e7a3c02f514ea0" @@ -4727,7 +4770,7 @@ jsbn@~0.1.0: resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513" integrity sha1-peZUwuWi3rXyAdls77yoDA7y9RM= -jsesc@^2.5.1: +jsesc@^2.5.1, jsesc@^2.5.2: version "2.5.2" resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.2.tgz#80564d2e483dacf6e8ef209650a67df3f0c283a4" integrity sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA== @@ -5440,6 +5483,11 @@ mdn-data@2.0.4: resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.4.tgz#699b3c38ac6f1d728091a64650b65d388502fd5b" integrity sha512-iV3XNKw06j5Q7mi6h+9vbx23Tv7JkjEVgKHW4pimwyDGWm0OIQntJJ+u1C6mg6mK1EaTv42XQ7w76yuzH7M2cA== +mdn-data@~1.1.0: + version "1.1.4" + resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-1.1.4.tgz#50b5d4ffc4575276573c4eedb8780812a8419f01" + integrity sha512-FSYbp3lyKjyj3E7fMl6rYvUdX0FBXaluGqlFoYESWQlyUTq8R+wp0rkFxoYFqZlHCvsUXGjyJmLQSnXToYhOSA== + media-typer@0.3.0: version "0.3.0" resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748" @@ -5567,6 +5615,11 @@ mime-db@1.46.0: resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.46.0.tgz#6267748a7f799594de3cbc8cde91def349661cee" integrity sha512-svXaP8UQRZ5K7or+ZmfNhg2xX3yKDMUzqadsSqi4NCH/KomcH75MAMYAGVlvXn4+b/xOPhS3I2uHKRUzvjY7BQ== +mime-db@1.48.0: + version "1.48.0" + resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.48.0.tgz#e35b31045dd7eada3aaad537ed88a33afbef2d1d" + integrity sha512-FM3QwxV+TnZYQ2aRqhlKBMHxk10lTbMt3bBkMAp54ddrNeVSfcQYOOKuGuy3Ddrm38I04If834fOUSq1yzslJQ== + mime-types@^2.1.12, mime-types@~2.1.17, mime-types@~2.1.19, mime-types@~2.1.24: version "2.1.29" resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.29.tgz#1d4ab77da64b91f5f72489df29236563754bb1b2" @@ -5574,6 +5627,13 @@ mime-types@^2.1.12, mime-types@~2.1.17, mime-types@~2.1.19, mime-types@~2.1.24: dependencies: mime-db "1.46.0" +mime-types@^2.1.25: + version "2.1.31" + resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.31.tgz#a00d76b74317c61f9c2db2218b8e9f8e9c5c9e6b" + integrity sha512-XGZnNzm3QvgKxa8dpzyhFTHmpP3l5YNusmne07VUOXxou9CqUqYa/HBy124RqtVh/O2pECas/MOcsDgpilPOPg== + dependencies: + mime-db "1.48.0" + mime@1.4.1: version "1.4.1" resolved "https://registry.yarnpkg.com/mime/-/mime-1.4.1.tgz#121f9ebc49e3766f311a76e1fa1c8003c4b03aa6" @@ -5584,7 +5644,7 @@ mime@1.6.0: resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1" integrity sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg== -mime@^2.5.0: +mime@^2.0.3, mime@^2.5.0: version "2.5.2" resolved "https://registry.yarnpkg.com/mime/-/mime-2.5.2.tgz#6e3dc6cc2b9510643830e5f19d5cb753da5eeabe" integrity sha512-tqkh47FzKeCPD2PUiPB6pkbMzsCasjxAfC62/Wap5qrUWcb+sFasXUC5I3gYM5iBM8v/Qpn4UK0x+j0iHyFPDg== @@ -6417,6 +6477,17 @@ pend@~1.2.0: resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50" integrity sha1-elfrVQpng/kRUzH89GY9XI4AelA= +penthouse@^2.3.2: + version "2.3.2" + resolved "https://registry.yarnpkg.com/penthouse/-/penthouse-2.3.2.tgz#563080c9c9a29f38babf645ae2d42bfacf6f9544" + integrity sha512-WKH7kVj46NKh5eHP9qQqYdaHX6vHCwBkG6yaYy0qRu28O6i9LEfmdNQNj6Teehr+6yqMImNaW3blxdcmtgXTiQ== + dependencies: + css-mediaquery "^0.1.2" + css-tree "1.0.0-alpha.28" + debug "^4.1.1" + jsesc "^2.5.2" + puppeteer "2.1.1" + performance-now@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b" @@ -6637,7 +6708,7 @@ progress@^1.1.8: resolved "https://registry.yarnpkg.com/progress/-/progress-1.1.8.tgz#e260c78f6161cdd9b0e56cc3e0a85de17c7a57be" integrity sha1-4mDHj2Fhzdmw5WzD4Khd4Xx6V74= -progress@^2.0.0: +progress@^2.0.0, progress@^2.0.1: version "2.0.3" resolved "https://registry.yarnpkg.com/progress/-/progress-2.0.3.tgz#7e8cf8d8f5b8f239c1bc68beb4eb78567d572ef8" integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA== @@ -6662,6 +6733,11 @@ proxy-addr@~2.0.5: forwarded "~0.1.2" ipaddr.js "1.9.1" +proxy-from-env@^1.0.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.1.0.tgz#e102f16ca355424865755d2c9e8ea4f24d58c3e2" + integrity sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg== + pseudomap@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/pseudomap/-/pseudomap-1.0.2.tgz#f052a28da70e618917ef0a8ac34c1ae5a68286b3" @@ -6709,6 +6785,22 @@ pupa@^2.1.1: dependencies: escape-goat "^2.0.0" +puppeteer@2.1.1: + version "2.1.1" + resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-2.1.1.tgz#ccde47c2a688f131883b50f2d697bd25189da27e" + integrity sha512-LWzaDVQkk1EPiuYeTOj+CZRIjda4k2s5w4MK4xoH2+kgWV/SDlkYHmxatDdtYrciHUKSXTsGgPgPP8ILVdBsxg== + dependencies: + "@types/mime-types" "^2.1.0" + debug "^4.1.0" + extract-zip "^1.6.6" + https-proxy-agent "^4.0.0" + mime "^2.0.3" + mime-types "^2.1.25" + progress "^2.0.1" + proxy-from-env "^1.0.0" + rimraf "^2.6.1" + ws "^6.1.0" + q@^1.1.2: version "1.5.1" resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7" @@ -7183,7 +7275,7 @@ reusify@^1.0.4: resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76" integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw== -rimraf@2: +rimraf@2, rimraf@^2.6.1: version "2.7.1" resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.7.1.tgz#35797f13a7fdadc566142c29d4f07ccad483e3ec" integrity sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w== @@ -7702,7 +7794,7 @@ source-map@^0.4.2: dependencies: amdefine ">=0.0.4" -source-map@^0.5.0, source-map@^0.5.1, source-map@^0.5.6: +source-map@^0.5.0, source-map@^0.5.1, source-map@^0.5.3, source-map@^0.5.6: version "0.5.7" resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc" integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w= @@ -8995,6 +9087,13 @@ write@^0.2.1: dependencies: mkdirp "^0.5.1" +ws@^6.1.0: + version "6.2.2" + resolved "https://registry.yarnpkg.com/ws/-/ws-6.2.2.tgz#dd5cdbd57a9979916097652d78f1cc5faea0c32e" + integrity sha512-zmhltoSR8u1cnDsD43TX59mzoMZsLKqUweyYBAIvTngR3shc0W6aOZylZmq/7hqyVxPdi+5Ud2QInblgyE72fw== + dependencies: + async-limiter "~1.0.0" + ws@~7.4.2: version "7.4.3" resolved "https://registry.yarnpkg.com/ws/-/ws-7.4.3.tgz#1f9643de34a543b8edb124bdcbc457ae55a6e5cd" diff --git a/styles/styles.scss b/styles/styles.scss index a725a18d6..b79db1df1 100644 --- a/styles/styles.scss +++ b/styles/styles.scss @@ -6,3 +6,5 @@ // Theme styles @import 'theme'; + +body>*:not(.page-wrapper,script,style),.page-wrapper>*:not(header,.contact-bar,.marketing-bar,.mega-menu,script,style){display: block} diff --git a/web/css/critical.css b/web/css/critical.css new file mode 100644 index 000000000..2307b38cb --- /dev/null +++ b/web/css/critical.css @@ -0,0 +1 @@ +@charset "UTF-8";html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}aside,header,nav,section{display:block}a{background-color:transparent;-webkit-text-decoration-skip:objects}strong{font-weight:inherit}strong{font-weight:bolder}img{border-style:none}svg:not(:root){overflow:hidden}button,input{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button{text-transform:none}button,html [type="button"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}[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}[hidden]{display:none}*,*::after,*::before{box-sizing:border-box}html,body{height:100%;min-width:320px;font-family:"Work Sans",sans-serif;font-weight:400;font-size:14px;line-height:1.6;color:#1a1b1d;scroll-behavior:smooth}body{display:flex;flex-direction:column}.page-wrapper{flex:1 0 auto;margin-bottom:64px}p{margin:0;padding:0}form{margin:0}.container{max-width:1328px;margin:0 8px}@media all and (min-width:768px){.container{margin:0 8px}}@media all and (min-width:1024px){.container{margin:0 40px}}@media all and (min-width:1344px){.container{margin:0 auto}}::-webkit-scrollbar{width:8px;height:8px;background-color:#eaeaea;-webkit-appearance:none}::-webkit-scrollbar-thumb{background:#1a1b1d;border-radius:4px}@-webkit-keyframes animatetop{from{top:-300px;opacity:0}to{top:inherit;opacity:1}}@keyframes animatetop{from{top:-300px;opacity:0}to{top:inherit;opacity:1}}@-webkit-keyframes animateright{from{right:-300px;opacity:0}to{right:0;opacity:1}}@keyframes animateright{from{right:-300px;opacity:0}to{right:0;opacity:1}}@-webkit-keyframes animateleft{from{left:-300px;opacity:0}to{left:0;opacity:1}}@keyframes animateleft{from{left:-300px;opacity:0}to{left:0;opacity:1}}@-webkit-keyframes spin{100%{transform:rotate(360deg)}}@keyframes spin{100%{transform:rotate(360deg)}}.icon{display:block;width:24px;height:24px;padding:0}h3{display:block;margin:0 0 0.5em 0;font-family:"Playfair Display",serif;font-weight:500;line-height:1.6;color:#1a1b1d;text-transform:uppercase}h3{font-size:16px}@media all and (min-width:768px){h3{font-size:18px}}.label,label{display:block;margin:0 0 4px;font-size:14px;color:#6e7577;font-family:"Work Sans",sans-serif;font-weight:400;line-height:1.6}.label--hidden{position:absolute;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;border:0}.link,a{display:inline-flex;align-items:flex-start;color:#1a1b1d;font-family:"Work Sans",sans-serif;font-weight:400;line-height:1.6;text-decoration:none}.link--invert{color:#0075e4}p{color:#1a1b1d;font-family:"Work Sans",sans-serif;font-weight:400;line-height:1.6;font-size:16px;margin:0}.badge{display:inline-flex;padding:0 16px;margin:0 0 8px;border-radius:0;color:#fff;background:#1a1b1d;font-family:"Work Sans",sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;line-height:16px;justify-content:center}.badge--new{color:#1a1b1d;background:#fff}.button:before,.mega-menu__inner-link:before{content:"";display:block;position:absolute;width:100%;left:0;top:0;bottom:0;background-color:#1a1b1d;transform:scaleX(0);transform-origin:0 50%}.button:after{content:;display:block;position:absolute;left:20%;top:50%;width:24px;height:24px;padding:0;z-index:1;opacity:0;transform:translateY(-50%);transform-origin:center}.button{position:relative;display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:48px;min-width:48px;padding:0 32px;background-color:#1a1b1d;border:none;border-radius:0;outline:none;font-family:"Work Sans",sans-serif;font-size:14px;font-weight:700;line-height:1;color:#fff;text-transform:uppercase;text-decoration:none;transform:perspective(1px) translateZ(0)}.button--link{color:#1a1b1d;background:transparent;text-transform:none;text-decoration:underline}.button--icon{min-width:48px;min-height:48px;padding:0 8px;background-color:#fff}.button--icon .icon,.button--icon .button__icon{width:24px;height:24px;padding:0;fill:#1a1b1d;z-index:1}.button--icon-light:before{background-color:#eaeaea}.button--icon-border{border:1px solid #1a1b1d;background-color:#fff}.button--rotate-icon:before{background-color:#eaeaea}.button--icon-fill,.product-grid-item .add-to-wishlist{background:transparent}.button--icon-fill:after,.product-grid-item .add-to-wishlist:after{content:'';display:block;position:absolute;left:auto;background-size:400% 400%;background-image:linear-gradient(to right,#1a1b1d 50%,transparent 50%);background-position:100% 100%;opacity:1;z-index:-1}.button--icon-fill:before,.product-grid-item .add-to-wishlist:before{background-color:transparent;z-index:-1}.button--add-to{overflow:hidden;padding:0 8px}.button--add-to .button__icon{display:block}.button--add-to:before{display:block}.button--add-to:after{display:none;top:auto;left:calc(50% - 12px);transform:translateX(-150%)}.button--add-to .button__icon{fill:#fff}@media all and (min-width:768px){.button--add-to{padding:0 32px}.button--add-to .button__icon{display:none}}@media all and (min-width:1024px){.button--add-to:after{display:block}}.input{margin-bottom:16px}.input__field{width:100%;height:48px;padding:0 16px;border:1px solid #6e7577;border-radius:0;line-height:normal}.input__field::-moz-placeholder{color:#6e7577;font-size:14px}.input__field:-ms-input-placeholder{color:#6e7577;font-size:14px}.image,img,picture{display:block;width:auto;max-width:100%}.image.lazyload,img.lazyload{opacity:0}.lazyload-wrapper{position:relative;background-color:#fff}.ratio-container{position:relative;height:0;width:100%;overflow:hidden}.ratio-container .ratio-image{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-width:100%;height:auto}.list{margin:0;padding:0;list-style:none;color:#1a1b1d;font-size:14px}.list__item{display:list-item;padding:0 0 16px}.list__item:last-child{padding:inherit inherit 0}.loader{position:absolute;top:0;left:0;display:none;width:100%;height:100%;background-color:rgba(255,255,255,0.5);z-index:50}.loader--visible{display:block}.loader__icon{position:absolute;display:block;top:0;left:0;right:0;bottom:0;width:56px;height:56px;margin:auto;background:transparent;border:8px solid #000;border-top-color:transparent;border-radius:50%;-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}.logo{display:flex;align-items:center;flex:1 140px;justify-content:center;max-width:140px}@media all and (min-width:768px){.logo{flex:1 256px;max-width:256px}}@media all and (min-width:1024px){.logo{justify-content:flex-start;max-width:256px}}.logo__image{height:32px}@media all and (min-width:768px){.logo__image{height:48px;width:auto}}.message{position:relative;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;width:100%;max-width:1328px;padding:8px 16px;margin:8px auto;background-color:#fff;border-color:#d8d8d8 #d8d8d8 #0075e4 #d8d8d8;border-width:1px 1px 4px 1px;border-style:solid;border-radius:0;color:#1a1b1d;font-size:12px}.message p{color:#1a1b1d;font-size:12px;line-height:inherit;margin:0}@media all and (min-width:768px){.message{padding:8px 48px}}.message:after{content:'';position:relative;order:-1;height:24px;width:36px;min-width:36px;margin:0 8px 0 0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15'%3E%3Cpath fill='%230075e4' d='M7 .333A6.67 6.67 0 0 0 .333 7 6.67 6.67 0 0 0 7 13.667 6.67 6.67 0 0 0 13.667 7 6.67 6.67 0 0 0 7 .333zm.667 10H6.333V9h1.334v1.333zm0-2.666H6.333v-4h1.334v4z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:24px}.price__value{font-size:18px;font-weight:700}@media all and (min-width:768px){.price__value{font-size:18px}}.price__value--old{margin-right:12px;color:#6e7577;font-size:12px;font-weight:400;text-decoration:line-through}@media all and (min-width:768px){.price__value--old{font-size:14px}}.price__value--special{color:#e62325;font-weight:700}.rating{width:120px}.rating__star{position:relative;height:24px;width:120px;margin:0}.rating__star:before{content:'';position:absolute;display:block;bottom:0;left:0;top:0;right:0;width:120px;height:24px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 2)' d='M10 15.27L16.18 19l-1.64-7.03L20 7.24l-7.19-.61L10 0 7.19 6.63 0 7.24l5.46 4.73L3.82 19z' fill='%23d8d8d8'/%3E%3C/svg%3E");background-repeat:repeat-x;background-position:left center;background-size:24px}@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){.rating__star:before{height:100%;background-size:24px 100%}}.rating__indicator{left:0;top:0;display:block;height:24px;width:120px;overflow:hidden;text-indent:-10000px}.rating__indicator:before{content:'';position:absolute;display:block;left:0;right:0;top:0;bottom:0;width:auto;height:24px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 2)' d='M10 15.27L16.18 19l-1.64-7.03L20 7.24l-7.19-.61L10 0 7.19 6.63 0 7.24l5.46 4.73L3.82 19z' fill='%231a1b1d'/%3E%3C/svg%3E");background-repeat:repeat-x;background-position:left center;background-size:24px;text-indent:10000px}@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){.rating__indicator:before{width:100%;height:100%;background-size:24px 100%}}.rating--secondary{width:80px}.rating--secondary .rating__indicator{height:16px;width:80px}.rating--secondary .rating__indicator:before{height:16px;background-size:16px}.rating--secondary .rating__star{height:16px;width:80px}.rating--secondary .rating__star:before{height:16px;background-size:16px;width:80px}.swatch__container{position:relative;min-height:100px}.swatch__container--catalog{width:100%;min-height:56px}.modal{display:none;position:fixed;left:0;top:0;z-index:99;width:100%;height:100%;padding:0;background-color:rgba(0,0,0,0.7);border:0}.modal--secondary{justify-content:center;align-items:flex-end}.modal--secondary .modal__container{height:100%;width:100%;max-width:640px;-webkit-animation:animateright 0.4s;animation:animateright 0.4s}@media all and (min-width:768px){.modal--secondary .modal__container{padding:48px}}@media all and (min-width:1024px){.modal--secondary .modal__container{max-width:768px;padding:48px 112px}}.modal--secondary .modal__content{height:100%}.modal--tertiary{justify-content:center;align-items:flex-start}.modal--tertiary .modal__container{height:100vh;width:100%;max-width:100%;-webkit-animation:animateleft 0.4s;animation:animateleft 0.4s;box-shadow:none}.modal__container{position:relative;display:block;width:calc(100% - (2 * 16px));max-width:900px;max-height:100%;padding:40px 16px;border:none;box-shadow:0 2px 6px 0 rgba(0,0,0,0.1);background-color:#fff;-webkit-animation:animatetop 0.4s;animation:animatetop 0.4s}@media all and (min-width:768px){.modal__container{padding:40px}}.modal__content{display:flex;flex-direction:column;max-height:100%}.modal__content--block{display:block}.modal__middle{padding:40px;margin:0;border:0;border-width:0;overflow-y:auto}.modal__bottom{padding:40px 0 0 0;margin:0;border:1px solid #d8d8d8;border-width:1px 0 0 0}.modal__close-button{position:absolute;top:16px;right:16px}.modal__bottom-actions{display:flex;flex-wrap:wrap;justify-content:space-between;padding:0;margin:0 auto;max-width:320px}.modal__bottom-action{padding:0;margin:0 0 16px 0;flex-basis:calc(50% - 8px)}.modal__bottom-action:last-child{margin-bottom:0}.badges{position:absolute;display:flex;flex-direction:column}.banner{position:relative;display:block;width:100%;text-decoration:none}.banner .ratio-container{position:relative}.banner .ratio-container:after{content:'';display:block;position:absolute;top:0;bottom:0;left:0;right:0;background-color:transparent}.banner__image{width:100%}.brief-info{display:none}@media all and (min-width:1024px){.brief-info{display:block;padding:0}}.brief-info--link .brief-info__icon-wrapper{position:absolute;left:0}.brief-info--link .brief-info__title{display:block;color:gray-darker;font-size:16px;font-weight:700;line-height:24px;margin:0;padding:0}.brief-info--link .brief-info__subtitle{display:block;font-size:12px;font-weight:400;line-height:16px;margin:0;padding:0}.brief-info__items-container{display:flex;justify-content:space-between;flex-flow:column nowrap}@media all and (min-width:1024px){.brief-info__items-container{flex-flow:row nowrap}}.brief-info__list-item{flex-grow:1}.brief-info__list-item:last-child{padding-bottom:0}.brief-info__icon-wrapper{width:48px;height:48px}.brief-info__icon-wrapper .icon{width:100%;height:100%;fill:#1a1b1d}.brief-info__title{margin:0;color:#393243;font-family:"Work Sans",sans-serif;font-size:16px;font-weight:700;text-transform:uppercase;text-align:left}.brief-info__subtitle{margin:0;font-size:14px;font-weight:400;text-transform:none;color:#6e7577}.brief-info__link{display:flex;flex-direction:column;position:relative;justify-content:center;align-items:flex-start;padding:0 0 0 64px}.brief-info__link:before{max-width:48px}.contact-bar{display:none;min-height:40px;margin:0;background:#eaeaea;padding:0}@media all and (min-width:1024px){.contact-bar{display:flex}}.contact-bar--vertical{display:block;background:#fff}.contact-bar--vertical .contact-bar__container{flex-direction:column;min-width:initial;width:100%}.contact-bar--vertical .contact-bar__list{align-items:left;flex-flow:column nowrap}.contact-bar--vertical .contact-bar__list--icons{align-items:left;border:1px solid #d8d8d8;border-width:1px 0 0 0;margin:40px 0}.contact-bar--vertical .contact-bar__list--icons .contact-bar__link{font-size:12px}.contact-bar--vertical .contact-bar__item{margin:0}.contact-bar--vertical .contact-bar__link{color:#1a1b1d;font-size:14px;color:#1a1b1d;padding:16px 0;background:transparent;text-transform:capitalize}.contact-bar--vertical .contact-bar__link:before{display:none}.contact-bar--vertical .contact-bar__icon .icon{fill:#1a1b1d}.contact-bar--vertical .contact-bar__icon{fill:#1a1b1d}.contact-bar__container{display:flex;width:calc(100% - 16px);justify-content:space-between;flex-direction:row-reverse}.contact-bar__list{display:flex}.contact-bar__list--icons .contact-bar__link{font-size:12px;font-weight:400;text-transform:uppercase}.contact-bar__item{display:flex;margin:0 12px;padding:0}.contact-bar__item:first-child{margin-left:0}.contact-bar__item:last-child{margin-right:0}.contact-bar__link{display:flex;align-items:center;padding:8px;line-height:1.6;font-size:12px;font-weight:400;color:#1a1b1d;background-color:#eaeaea;text-decoration:none;text-transform:uppercase;min-height:40px}.contact-bar__link:before{background-color:#d8d8d8}.contact-bar__icon{margin:0 8px 0 0}.contact-bar__icon .icon{fill:#1a1b1d}.dropdown-list{position:relative;width:100%;background-color:#fff}.dropdown-list--with-nested .dropdown-list__label{font-size:14px;color:#1a1b1d;font-weight:500;padding:17px 56px 17px 0}.dropdown-list--with-nested .dropdown-list__icon{fill:#6e7577;width:24px;height:24px;right:16px}.dropdown-list--inner{padding:0 0 16px 16px}.dropdown-list--inner .dropdown-list__label{font-size:14px;font-weight:400;color:#6e7577;text-transform:Capitalize;padding:13px 48px 13px 0}.dropdown-list--inner .dropdown-list__item{border-bottom:0}@media all and (min-width:768px){.dropdown-list--with-breakpoint .dropdown-list__icon{display:none}}.dropdown-list__list{display:block;width:100%;list-style-type:none;padding:0;margin:0}.dropdown-list__icon{position:absolute;right:12px;top:0;bottom:0;width:24px;height:24px;margin:auto;fill:#6e7577}.dropdown-list__item{position:relative;display:block;width:100%;border-bottom:1px solid #d8d8d8;font-size:14px}.dropdown-list__label{display:block;position:relative;width:100%;background-color:#fff;margin:0;border:0;border-radius:0;text-transform:uppercase;text-decoration:none;text-align:left;color:#1a1b1d;font-weight:700;font-size:18px;font-family:"Work Sans",sans-serif;line-height:1.6;padding:17.5px 48px 17.5px 0}.dropdown-list__content{overflow:hidden}.dropdown-list__content[aria-hidden="true"]{display:none}.mega-menu{display:none;position:relative;margin:0;z-index:50;border:0;border-width:0}@media all and (min-width:1024px){.mega-menu{display:block}}.mega-menu:before{display:block;position:absolute;content:'';top:0;bottom:0;left:0;right:0;background-color:#1a1b1d;z-index:51}.mega-menu__list{position:relative;display:flex;flex-wrap:nowrap;justify-content:space-between;padding:0;list-style:none;background-color:#fff}.mega-menu__inner-list{display:flex;flex-direction:column;padding:0;margin:0;background-color:#fff;list-style:none}.mega-menu__inner-list--level1{display:none;position:absolute;top:100%;left:0;z-index:50;width:100%;padding:16px 0;margin:0;box-shadow:0 2px 6px 0 rgba(0,0,0,0.1)}.mega-menu__item{display:flex}.mega-menu__item--secondary{position:relative}.mega-menu__item--secondary>.mega-menu__inner-list{width:320px;padding:24px 16px}.mega-menu__item--rows>.mega-menu__inner-list{padding:16px 0 24px 0}.mega-menu__item--rows>.mega-menu__inner-list>.mega-menu__inner-item{padding:16px 16px;border-bottom:1px solid #d8d8d8}.mega-menu__item--rows>.mega-menu__inner-list>.mega-menu__inner-item:first-child{padding-top:0}.mega-menu__item--rows>.mega-menu__inner-list>.mega-menu__inner-item:last-child{border-bottom:0;padding-bottom:0}.mega-menu__inner-item{padding:0;margin:0}.mega-menu__inner-item--inline>.mega-menu__inner-list{flex-direction:row;justify-content:flex-start}.mega-menu__inner-item--inline>.mega-menu__inner-list>.mega-menu__inner-item>.mega-menu__inner-link{font-weight:700}.mega-menu__inner-item--inline>.mega-menu__inner-list>.mega-menu__inner-item>.mega-menu__inner-link:before{background-color:#1a1b1d}.mega-menu__inner-item--images>.mega-menu__inner-list{flex-direction:row;justify-content:space-between}.mega-menu__inner-item--images>.mega-menu__inner-list>.mega-menu__inner-item>.mega-menu__inner-link{display:flex;flex-direction:column;align-items:flex-start;font-weight:500}.mega-menu__inner-item--images>.mega-menu__inner-list>.mega-menu__inner-item>.mega-menu__inner-link:before{display:none}.mega-menu__inner-item--columns>.mega-menu__inner-list{flex-direction:row}.mega-menu__inner-item--columns>.mega-menu__inner-list>.mega-menu__inner-item{flex-grow:1;flex-basis:0}.mega-menu__inner-item--children>.mega-menu__inner-list>.mega-menu__inner-item>.mega-menu__inner-link{padding:0 32px;font-weight:400;font-size:14px;color:#6e7577;text-transform:capitalize}.mega-menu__link{display:flex;padding:0 24px;position:relative;align-items:center;height:56px;z-index:51;color:#eaeaea;text-decoration:none;text-transform:uppercase;background-color:transparent;font-weight:400;font-size:14px;font-family:"Work Sans",sans-serif}.mega-menu__inner-link{position:relative;display:flex;align-items:center;min-height:48px;padding:0 16px;margin:0;font-size:14px;font-weight:500;color:#1a1b1d;text-decoration:none;text-transform:capitalize}.mega-menu__inner-link:before{background-color:#d8d8d8;z-index:-1}.mega-menu__column-hidden>.mega-menu__inner-link{display:none}.footer__links .dropdown-list__icon{fill:#6e7577}.footer__dropdown-switcher .dropdown-list__content{position:absolute;bottom:100%;width:100%;padding:12px 12px 0;background-color:#fff}.footer__dropdown-switcher .dropdown-list__content .button{font-weight:400;min-height:0;text-decoration:none}.header-button__counter{position:absolute;display:flex;justify-content:center;align-items:center;top:10px;right:10px;width:10px;height:10px;border:none;border-radius:10px;line-height:10px;font-size:12px;color:#fff;background-color:#fff;z-index:1}.header-button__counter--hidden{display:none}.header-button__counter-dot{width:8px;height:8px;border-radius:8px;margin:auto;background-color:#e62325}.header-button__summary-count{position:absolute;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;border:0}.header-button.button--icon-fill:before{background-color:#eaeaea}.search-form{width:100%;align-self:flex-end;line-height:1.6;margin:0;position:static}@media all and (min-width:768px){.search-form{position:static}}.search-form__wrapper{position:relative}.search-form__input-wrapper{position:relative}.search-form__input{width:100%;-webkit-appearance:none}.search-form__button{position:absolute;top:1px;right:0;height:46px;min-height:46px;margin:0;border:1px solid #d8d8d8;border-width:0 1px}.header{position:relative;border:1px solid #d8d8d8;border-width:0 0 1px 0;background:none}@media all and (min-width:1024px){.header{border:none}}.header__wrapper{position:relative;justify-content:space-between;display:flex;flex-flow:row wrap;padding:0 0 8px}@media all and (min-width:768px){.header__wrapper{flex-wrap:nowrap;padding:16px 0}}@media all and (min-width:1024px){.header__wrapper{border:0;border-width:0;padding:16px 0}}.header__logo{padding:12px 0 12px 8px}@media all and (min-width:768px){.header__logo{order:2;padding:0}}.header__search-wrapper{display:flex;flex-flow:column nowrap;flex-grow:1;flex-basis:50%;order:3;justify-content:center;padding:0 0 0 8px;z-index:51}@media all and (min-width:768px){.header__search-wrapper{order:2;flex-direction:column;justify-content:center;padding:0 24px}}@media all and (min-width:1024px){.header__search-wrapper{padding:0 16px;max-width:350px}}@media all and (min-width:1200px){.header__search-wrapper{padding:0 32px;max-width:600px}}.header__minicart{position:relative;padding-left:0}@media all and (min-width:768px){.header__minicart{border:1px solid #d8d8d8;border-width:0 0 0 1px;padding-left:8px}}.header__minicart-modal{z-index:101}.header .button--icon-fill{margin-right:0}@media all and (min-width:768px){.header .button--icon-fill{margin-right:8px}}.header__buttons{display:flex;flex:1 calc(100% - 140px);max-width:calc(100% - 140px);flex-wrap:nowrap;align-items:center;justify-content:flex-end}@media all and (min-width:768px){.header__buttons{order:3;flex-wrap:nowrap;flex:1 calc(2 * 48px + 1 * 8px);max-width:calc(2 * 48px + 1 * 8px)}}@media all and (min-width:1200px){.header__buttons{flex:1 calc(2 * 48px + 1 * 16px);max-width:calc(2 * 48px + 1 * 16px)}}.header__brief-info{display:none;align-items:center;order:3;min-width:220px}@media all and (min-width:1024px){.header__brief-info{display:flex}}.header__brief-info .brief-info__subtitle{font-size:12px}.header .side-menu{order:1}.marketing-bar{position:relative;padding:0;background-color:#1a1b1d;overflow:hidden}.marketing-bar--closed{display:none}.marketing-bar__container{position:relative;display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:center;width:100%;max-width:1328px;margin:0 auto}.marketing-bar__text{width:calc(100% - 40px);padding:8px}.marketing-bar__text{font-size:10px;font-weight:400;line-height:14px;color:#eaeaea;text-transform:uppercase;margin:0}@media all and (min-width:768px){.marketing-bar__text{text-align:center;font-size:14px;line-height:24px}}.marketing-bar__close{min-height:40px;background-color:transparent}.marketing-bar__close .button__icon{fill:#fff}.minicart-content{height:auto;font-size:14px;padding:0;display:flex;flex-direction:column;max-height:100%}.product-grid-item{position:relative;display:flex;flex-direction:column;justify-content:space-between;width:100%;border:1px solid #eaeaea;border-width:0 0 1px 0;padding:0}.product-grid-item .product-grid-item__image-wrapper{position:relative}.product-grid-item .product-grid-item__image-wrapper:after{content:'';display:block;position:absolute;top:0;bottom:0;left:0;right:0;background-color:transparent}@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){.product-grid-item{margin:0 8px 16px 8px;width:calc(50% - 16px - 1px)}}@media all and (-ms-high-contrast:none) and (min-width:768px){.product-grid-item{width:calc(100% / 3 - 16px - 1px)}}.product-grid-item--slider-item .product-grid-item__link{flex:0}.product-grid-item--slider-item .product-grid-item__details{flex:1}.product-grid-item--slider-item .product-grid-item__details-bottom{margin-top:auto}@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){.product-grid-item--slider-item{display:block;width:100%}}.product-grid-item--slider-item .product-grid-item__image-wrapper .image,.product-grid-item--slider-item .product-grid-item__image-wrapper img{width:100%}@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){.product-grid-item--slider-item .product-grid-item__image-wrapper .image,.product-grid-item--slider-item .product-grid-item__image-wrapper img{width:auto}}.product-grid-item--slider-item .product-grid-item__image-wrapper .lazyload{width:100%}.product-grid-item__badges{top:16px;left:0;z-index:1}.product-grid-item__link{position:relative;display:flex;flex-flow:column nowrap;justify-content:center;flex:1 1 auto;align-items:center;align-self:stretch}.product-grid-item__link:after{content:'';display:block;position:absolute;top:0;bottom:0;left:0;right:0;background-color:transparent}.product-grid-item__image-wrapper{position:relative;width:100%}.product-grid-item__image-wrapper .image,.product-grid-item__image-wrapper img{margin:0 auto;width:auto;height:auto}.product-grid-item__image-wrapper .lazyload{width:100%;height:auto}.product-grid-item__name{min-height:65px;margin:0 0 8px;font-weight:400;font-size:14px;text-transform:none}@media all and (min-width:480px){.product-grid-item__name{min-height:45px}}@media all and (min-width:768px){.product-grid-item__name{font-size:16px}}@media all and (min-width:1024px){.product-grid-item__name{width:100%}}.product-grid-item__name-link{display:block;color:#1a1b1d;text-decoration:none;line-height:1.5}.product-grid-item__rating{margin-bottom:8px;height:16px}.product-grid-item__price{width:100%;display:flex;flex-flow:column nowrap;justify-content:center;min-height:44px}@media all and (min-width:768px){.product-grid-item__price{width:50%}}.product-grid-item__price .price__value:not(.price__value--between){display:flex;flex-flow:column nowrap;justify-content:center;white-space:nowrap}.product-grid-item__details{padding:0 8px;margin:8px 0 16px;flex-grow:0;display:flex;flex-flow:column nowrap;justify-content:flex-end;border:1px solid #d8d8d8;border-width:0}@media all and (min-width:1200px){.product-grid-item__details{padding:0 24px}}.product-grid-item__details-bottom{display:flex;flex-flow:row wrap;justify-content:space-between}.product-grid-item__actions{display:flex;align-items:flex-end;justify-content:flex-end;width:100%}@media all and (min-width:768px){.product-grid-item__actions{width:50%}}.product-grid-item__primary-action{margin:0 0 0 8px}@media all and (min-width:768px){.product-grid-item__primary-action .button--add-to{padding:0 8px}.product-grid-item__primary-action .button--add-to .button__icon{display:block}}.product-grid-item .add-to-wishlist{position:absolute;top:0;right:0;background:transparent}.product-grid-item .add-to-wishlist:before{display:none}.quicksearch{position:absolute;top:calc(100% + 1px);left:0;display:none;padding:0 16px;width:100%;background:#fff;box-shadow:0 8px 16px 0 rgba(0,0,0,0.16)}@media all and (min-width:768px){.quicksearch{top:calc(100% - 16px);left:0;right:auto;width:100%;padding:0 16px}}@media all and (min-width:950px){.quicksearch{padding:0 32px;left:calc((100% - 880px) / 2);width:880px}}@media all and (min-width:1200px){.quicksearch{padding:0 32px;left:calc((100% - 880px) / 2);width:880px}}@media all and (min-width:1024px){.side-menu{display:none}}.side-menu__trigger{background-color:#fff}@media all and (min-width:768px){.side-menu__trigger{border:1px solid #d8d8d8;border-width:0 1px 0 0;padding:0 8px 0 0;margin:0}}.side-menu__modal{background:#fff}.side-menu__container{margin-top:112px;max-width:100%;box-shadow:none;padding:0 24px;max-height:calc(100vh - 112px)}@media all and (min-width:768px){.side-menu__container{max-height:calc(100vh - 82px);margin-top:82px}}.side-menu__content{max-width:496px;margin:0 auto;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.side-menu__content::-webkit-scrollbar{display:none}.side-menu__content-middle{padding:16px 0 0;overflow:visible}.side-menu__content-bottom{padding:40px 0 0;border:0}.side-menu__bottom-actions{max-width:100%;margin:0}.side-menu__bottom-action{width:100%;flex-basis:100%}.side-menu__close-button{top:-56px;left:8px;background:#fff}@media all and (min-width:768px){.side-menu__close-button{top:-65px;left:12px}}.side-menu__close-button-text{margin:0 0 0 16px;color:#1a1b1d;font-family:"Playfair Display",serif;font-size:16px;font-weight:400}.skip-nav{position:absolute;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;border:0;padding:12px 48px;top:0;left:0;z-index:10}.slider--loading .slider__navigation{display:none}.slider--products .slider__item{flex-grow:1;flex-basis:0}.slider--products .slider__item{padding:8px}.slider--products .slider__item:nth-child(n+2){display:flex}.slider--products .slider__item:nth-child(n+3){display:none}@media all and (min-width:768px){.slider--products .slider__item:nth-child(n+3){display:flex}}@media all and (min-width:768px){.slider--products .slider__item:nth-child(n+4){display:none}}@media all and (min-width:1024px){.slider--products .slider__item:nth-child(n+4){display:flex}}@media all and (min-width:1024px){.slider--products .slider__item:nth-child(n+5){display:none}}.slider__item{height:auto;display:flex}.slider__item:nth-child(n+2){display:none}.slider__navigation{display:none;position:absolute;width:100%;top:50%;margin-top:-24px;padding:0;z-index:1}@media all and (min-width:768px){.slider__navigation{display:block}}@media all and (min-width:768px) and (-ms-high-contrast:none){.slider__navigation{top:calc(50% - 50%)}}.slider__nav-button{width:48px;height:48px;min-width:48px;border-radius:0;padding:0;position:absolute}.slider__nav-icon{width:24px;height:24px;position:absolute;top:50%;left:50%;margin-top:-12px;margin-left:-12px}.slider__prev{left:0}.slider__prev:before{transform-origin:100% 0}.slider__next{left:auto;right:0}@media all and (min-width:1024px){.catalog-list__title{grid-area:title}}@media all and (min-width:1024px){.catalog-list__banner{grid-area:banner;padding:0;margin:0 0 16px 0;border-width:0}}@media all and (min-width:1024px){.catalog-list__products{grid-area:products}}@media all and (min-width:1024px){.catalog-list__sidebar{grid-area:sidebar;margin:0 16px 0 0;z-index:10}}@media all and (min-width:1024px){.catalog-list__sidebar-additional{grid-area:sidebar2;align-self:start;margin:16px 16px 0 0}}.margin-0{margin:0}.padding-0{padding:0}.border-color-light{border-color:#d8d8d8}.visually-hidden{position:absolute;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;border:0}body>*:not(.page-wrapper),.page-wrapper>*:not(header,.contact-bar,.marketing-bar,.mega-menu){display: none}