.sonos-header-outer{background:#000;padding:10px 20px}
.sonos-header-outer img{max-width:250px;margin:0 auto}
.sonos-banner-outer{height:600px;display:flex;justify-content:space-around;align-items:center;background:url(https://hnie.blob.core.windows.net/hnie-assets/brand-pages/sonos/images/sonos-banner.jpg) no-repeat center center/cover}
.why-sonos-banner-outer{height:500px;display:flex;justify-content:space-around;align-items:center;background:url(https://hnie.blob.core.windows.net/hnie-assets/brand-pages/sonos/images/why-sonos-banner.jpg) no-repeat center center/cover}
.sonos-banner-outer .play-button{position:relative;margin:0 auto;left:auto}
.sonos-sections-block-inner{display:flex;justify-content:space-between;flex-wrap:wrap}
.sonos-double-block{flex-basis:48%;margin-bottom:20px}
.why-sonos-outer .sonos-double-block{margin-bottom:0}
.sonos-triple-block{flex-basis:30%;margin-bottom:40px}
.sonos-main-content-inner{padding:60px}
.sonos-block-copy{max-width:550px;margin:0 auto;padding:30px}
.sonos-perfect-system-outer,.sonos-sound-outer,.sonos-system-outer{padding-top:80px}
.sonos-btn{padding:20px 20px 20px}
.why-sonos-outer .why-sonos-banner-outer{margin-bottom:30px}
.sonos-quadruple-block{flex-basis:23%;border-radius:5px;border:1px solid #444;background:#fff;transition:box-shadow .4s ease,transform .4s ease}
.sonos-quadruple-block:hover{webkit-box-shadow:0 15px 20px rgb(0 0 0 / 20%);-moz-box-shadow:0 15px 20px rgba(0,0,0,.2);-ms-box-shadow:0 15px 20px rgba(0,0,0,.2);box-shadow:0 15px 20px rgb(0 0 0 / 20%);-webkit-transform:translate(0,-6px);-moz-transform:translate(0,-6px);-ms-transform:translate(0,-6px);transform:translate(0,-6px);cursor:pointer;text-decoration:none}
.sonos-quadruple-block img{margin:0 auto}
.sonos-quadruple-block a{text-decoration:none; display:block;}
.sonos-banner-inner h2,.why-sonos-banner-outer h2{font-size:4em;line-height:1em;font-weight:800;color:#fff;margin:0 0 .5em}
.sonos-perfect-system-outer h2,.sonos-sound-inner h2,.sonos-system-outer h2{font-size:4em;line-height:1em;font-weight:800;color:#444;margin:0 0 .5em}
.sonos-block-copy h3{font-size:1.6em;line-height:1em;font-weight:800;color:#444;margin:0 0 .5em}
.sonos-blurb p{font-size:1.2em;line-height:1.2em;font-weight:400;color:#444;margin:0 0 .5em}
.sonos-btn a{font-size:1.2em;line-height:1;font-weight:400;color:#444;margin:0;text-decoration:0;display:inline-block;border-radius:3px;border:1px solid #444;padding:1em 2em;transition:all .2s;background:#fff}
.sonos-btn a:hover{text-decoration:none;background:#444;color:#fff}
@media screen and (max-width:992px){
.sonos-banner-outer,.why-sonos-banner-outer{height:350px}
.sonos-header-outer img{max-width:180px;margin:0 auto}
.sonos-banner-inner h2,.sonos-perfect-system-outer h2,.sonos-sound-inner h2,.sonos-system-outer h2,.why-sonos-banner-outer h2{font-size:3em}
.sonos-main-content-inner{padding:40px 0}
}
@media screen and (max-width:750px){
.sonos-banner-outer,.why-sonos-banner-outer{height:250px}
.sonos-block-copy{padding:20px}
.why-sonos-outer .why-sonos-banner-outer{margin-bottom:20px}
.sonos-sections-block-inner{gap: 20px;}
.sonos-double-block,.sonos-triple-block{flex-basis:100%;margin-bottom:20px;max-width:550px}
.sonos-perfect-system-outer,.sonos-sound-outer,.sonos-system-outer{padding-top:40px}
.sonos-block-banner img{width:100%}
.sonos-quadruple-block{flex-basis:47%}
}