@font-face {
  font-family: 'sonos-logoregular';
  src: url("//static.sonos.com/v2/live/fonts/logo/sonos-logo-regular-webfont.eot");
  src: url("//static.sonos.com/v2/live/fonts/logo/sonos-logo-regular-webfont.eot?#iefix") format("embedded-opentype"), url("//static.sonos.com/v2/live/fonts/logo/sonos-logo-regular-webfont.svg#sonos-logoregular") format("svg"), url("//static.sonos.com/v2/live/fonts/logo/sonos-logo-regular-webfont.woff2") format("woff2"), url("//static.sonos.com/v2/live/fonts/logo/sonos-logo-regular-webfont.woff") format("woff"), url("//static.sonos.com/v2/live/fonts/logo/sonos-logo-regular-webfont.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'fontello';
  src: url("//static.sonos.com/suit/release/v2.5/live/fonts/fontello/fontello.eot?87462469");
  src: url("//static.sonos.com/suit/release/v2.5/live/fonts/fontello/fontello.eot?87462469#iefix") format("embedded-opentype"), url("//static.sonos.com/suit/release/v2.5/live/fonts/fontello/fontello.woff2?87462469") format("woff2"), url("//static.sonos.com/suit/release/v2.5/live/fonts/fontello/fontello.woff?87462469") format("woff"), url("//static.sonos.com/suit/release/v2.5/live/fonts/fontello/fontello.ttf?87462469") format("truetype"), url("//static.sonos.com/suit/release/v2.5/live/fonts/fontello/fontello.svg?87462469#fontello") format("svg");
  font-weight: normal;
  font-style: normal; }

.ello-icon:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
  /* fix buttons height, for twitter bootstrap */
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
  position: static;
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.icon-twitter:before {
  content: '\e800'; }

.icon-facebook:before {
  content: '\e801'; }

.icon-instagram:before {
  content: '\e802'; }

.icon-gplus:before {
  content: '\e803'; }

.icon-pinterest:before {
  content: '\e804'; }

.icon-linkedin:before {
  content: '\e805'; }

.icon-youtube-play:before {
  content: '\e806'; }

.icon-right-dir:before {
  content: '\e807'; }

.icon-location:before {
  content: '\e808'; }

.icon-basket:before {
  content: '\e809'; }

.icon-play:before {
  content: '\e80a'; }

.icon-qq:before {
  content: '\e80b'; }

.icon-deezer-logo:before {
  content: '\e80c'; }

.icon-right-open-big:before {
  content: '\e80d'; }

.icon-left-open-big:before {
  content: '\e80e'; }

.icon-clipboard:before {
  content: '\e80f'; }

.icon-cog:before {
  content: '\e810'; }

.icon-email:before {
  content: '\e811'; }

.icon-rss:before {
  content: '\e812'; }

.icon-blogger:before {
  content: '\e813'; }

.icon-app:before {
  content: '\e814'; }

.icon-alarm:before {
  content: '\e815'; }

.icon-windows:before {
  content: '\e816'; }

.icon-apple:before {
  content: '\e817'; }

.icon-android:before {
  content: '\e818'; }

.icon-arrow-ne:before {
  content: '\e819'; }

.icon-arrow-sw:before {
  content: '\e81a'; }

.icon-contact:before {
  content: '\e81b'; }

.icon-documentation:before {
  content: '\e81c'; }

.icon-faq:before {
  content: '\e81d'; }

.icon-ellipsis:before {
  content: '\e81e'; }

.icon-ipad:before {
  content: '\e81f'; }

.icon-iphone:before {
  content: '\e820'; }

.icon-library:before {
  content: '\e821'; }

.icon-iphone-wordmark:before {
  content: '\e822'; }

.icon-star:before {
  content: '\e823'; }

.icon-tracks:before {
  content: '\e824'; }

.icon-play-in-circle:before {
  content: '\e825'; }

.icon-ipad-wordmark:before {
  content: '\e826'; }

.icon-buttons-lights:before {
  content: '\e827'; }

.icon-help-circled:before {
  content: '\e828'; }

.icon-play-1:before {
  content: '\e829'; }

.icon-plus:before {
  content: '\e82a'; }

.icon-plus-circled:before {
  content: '\e82b'; }

.icon-cancel-circled:before {
  content: '\e82c'; }

.icon-radio:before {
  content: '\e82d'; }

.icon-lr:before {
  content: '\e82e'; }

.icon-humidity:before {
  content: '\e82f'; }

.icon-wall-mount:before {
  content: '\e830'; }

.icon-stereo-pair:before {
  content: '\e831'; }

.icon-multiple-orientations:before {
  content: '\e832'; }

.icon-line-in:before {
  content: '\e833'; }

.icon-weibo:before {
  content: '\e834'; }

.icon-arrows:before {
  content: '\e835'; }

.icon-volume:before {
  content: '\e836'; }

.icon-search:before {
  content: '\e837'; }

.icon-bt:before {
  content: '\e838'; }

.icon-wifi:before {
  content: '\e839'; }

.icon-cogs:before {
  content: '\e83a'; }

.icon-download:before {
  content: '\e83b'; }

.icon-speech-bubble:before {
  content: '\e83c'; }

.icon-beta-wordmark:before {
  content: '\e83d'; }

.icon-cloud-download:before {
  content: '\e83e'; }

.icon-sliders:before {
  content: '\e83f'; }

.icon-tv2:before {
  content: '\e840'; }

.icon-account:before {
  content: '\e841'; }

.icon-account-on:before {
  content: '\e842'; }

.icon-arrow-down:before {
  content: '\e843'; }

.icon-arrow-left:before {
  content: '\e844'; }

.icon-arrow-right:before {
  content: '\e845'; }

.icon-arrow-up:before {
  content: '\e846'; }

.icon-cart:before {
  content: '\e847'; }

.icon-chat:before {
  content: '\e848'; }

.icon-hamburger:before {
  content: '\e849'; }

.icon-contents-power:before {
  content: '\e84a'; }

.icon-hamburger-on:before {
  content: '\e84b'; }

.icon-contents:before {
  content: '\e84c'; }

.icon-amplifiers:before {
  content: '\e84d'; }

.icon-bass-treble:before {
  content: '\e84e'; }

.icon-dimensions:before {
  content: '\e84f'; }

.icon-ethernet:before {
  content: '\e850'; }

.icon-finish:before {
  content: '\e851'; }

.icon-line-in-1:before {
  content: '\e852'; }

.icon-microphones:before {
  content: '\e853'; }

.icon-power:before {
  content: '\e854'; }

.icon-touch:before {
  content: '\e855'; }

.icon-tweeters:before {
  content: '\e856'; }

.icon-weight:before {
  content: '\e857'; }

.icon-wifi-1:before {
  content: '\e858'; }

.icon-woofers:before {
  content: '\e859'; }

.icon-home-music:before {
  content: '\e85a'; }

.icon-minus:before {
  content: '\e85b'; }

.icon-ok:before {
  content: '\e85d'; }

.icon-plus-1:before {
  content: '\e85e'; }

.icon-threaded-mount:before {
  content: '\e85f'; }

.icon-x:before {
  content: '\e860'; }

.icon-ios-wordmark:before {
  content: '\e863'; }

.icon-notice:before {
  content: '\e864'; }

.footer.light {
  background: #fff;
  margin-top: 3rem;
  margin-bottom: 3rem; }
  .footer.light .social {
    overflow: auto; }

.footer ul {
  font-size: 0.92857rem; }
  .footer ul.sonos-links, .footer ul.site-links {
    margin-top: 20px; }
  .footer ul.site-links li a {
    color: #979797; }
    .footer ul.site-links li a:hover {
      color: #4b4b4b; }

@media only screen {
  .footer ul.social-block {
    margin: 0 auto; }
  .footer .sonos-links li,
  .footer .site-links li {
    float: none;
    text-align: center; }
  .footer.light a {
    text-decoration: none; }
    .footer.light a * {
      text-decoration: none; }
  .footer.light ul {
    font-size: 0.85714rem; }
  .footer.light .legal p {
    font-size: 0.71429rem; }
  .footer.light .sonos-links {
    list-style: none;
    margin-left: 0;
    margin-top: 0;
    line-height: 1.71429rem;
    margin-bottom: 2.5rem;
    padding: 0; }
    .footer.light .sonos-links li {
      margin-bottom: 3px;
      text-align: left; }
      .footer.light .sonos-links li a {
        color: black; }
        .footer.light .sonos-links li a:hover, .footer.light .sonos-links li a:active {
          text-decoration: underline; }
  .footer.light ul.social-block {
    margin: 0 0 1.875rem;
    padding: 0;
    max-width: 64rem;
    text-align: left; }
    .footer.light ul.social-block li {
      display: inline-block;
      margin-left: 8px; }
    .footer.light ul.social-block li:first-child {
      margin-left: 0; }
    .footer.light ul.social-block .button, .footer.light ul.social-block button {
      background-color: #1A1919;
      border-color: #000;
      color: #FFF;
      min-width: 30px;
      width: 30px;
      height: 30px;
      line-height: 30px;
      border-radius: 100%;
      font-size: 1.14286rem;
      margin-bottom: 15px;
      display: inline-block;
      text-align: center; }
  .footer.light .language-selector-link {
    font-size: 0.875rem;
    margin-top: 1rem;
    display: inline-block; }
    .footer.light .language-selector-link:hover, .footer.light .language-selector-link:active {
      text-decoration: underline; } }

@media (min-width: 395px) {
  .footer.light ul.social-block li {
    margin-left: 12px; } }

@media (min-width: 768px) {
  .footer.light .legal {
    margin-left: calc(16.6667% - 22px); }
    .footer.light .legal p {
      text-align: right; }
  .footer.light ul.social-block {
    text-align: right; } }

@media (min-width: 1025px) {
  .footer .site-links {
    float: right; }
  .footer .sonos-links li,
  .footer .site-links li {
    float: left;
    text-align: left; }
  .footer ul.social-block {
    margin: 0;
    width: auto; }
  .footer.light .sonos-links li,
  .footer.light .site-links li {
    float: none; }
  .footer.light .legal {
    margin-left: calc(33.3333% - 22px); } }

.headroom {
  padding-top: 6.99107rem; }

.no-direct-buy-message .headroom {
  padding-top: 4.91964rem; }

.headroom .sonos-bar-container {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
  will-change: transform;
  -ms-transition: -ms-transform 600ms ease-in-out;
  -webkit-transition: -webkit-transform 600ms ease-in-out;
  -moz-transition: -moz-transform 600ms ease-in-out;
  transition: transform 600ms ease-in-out; }

.headroom--pinned .sonos-bar-container {
  -ms-transform: translateY(0%);
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  transform: translateY(0%); }

.headroom--unpinned .sonos-bar-container,
.headroom--animated-scroll .sonos-bar-container {
  -ms-transform: translateY(-100%);
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  transform: translateY(-100%); }

.sonos-magellan-under-sonos-bar .headroom {
  padding-top: 10.84821rem; }

.no-direct-buy-message.sonos-magellan-under-sonos-bar .headroom {
  padding-top: 8.77679rem; }

@media (min-width: 1025px) {
  .no-direct-buy-message.sonos-magellan-under-sonos-bar .headroom {
    padding-top: 10.84821rem; }
  .headroom--unpinned .sonos-bar-container,
  .headroom--animated-scroll .sonos-bar-container {
    -ms-transform: none;
    -webkit-transform: none;
    -moz-transform: none;
    transform: none; } }

@media only screen and (max-height: 479px) and (max-width: 767px) {
  .headroom {
    padding-top: 0; }
  .headroom .sonos-bar-container {
    position: static; }
  .headroom--unpinned .sonos-bar-container,
  .headroom--animated-scroll .sonos-bar-container {
    -ms-transform: none;
    -webkit-transform: none;
    -moz-transform: none;
    transform: none; }
  .sonos-magellan-under-sonos-bar .headroom,
  .no-direct-buy-message.sonos-magellan-under-sonos-bar .headroom {
    padding-top: 0; } }

@media only screen {
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0; }
  .sonos-bar-container.light {
    background-color: #fff;
    border-bottom: 1px solid #e9e9e9; }
  .sonos-bar-light {
    background-color: transparent;
    height: 4.85714rem;
    line-height: 4.85714rem; }
    .sonos-bar-light .title-area {
      list-style: none;
      padding: 0;
      margin: 0;
      position: relative;
      height: 4.85714rem; }
      .sonos-bar-light .title-area .left-small, .sonos-bar-light .title-area .right-small, .sonos-bar-light .title-area .middle {
        position: absolute;
        top: 0; }
      .sonos-bar-light .title-area .left-small, .sonos-bar-light .title-area .right-small {
        height: 4.85714rem;
        width: 3.14286rem; }
        .sonos-bar-light .title-area .left-small a, .sonos-bar-light .title-area .left-small .sonos-menu-label-wrap, .sonos-bar-light .title-area .right-small a, .sonos-bar-light .title-area .right-small .sonos-menu-label-wrap {
          color: #000;
          font-size: 1.64286rem;
          line-height: 3.28571rem;
          height: 4.85714rem;
          padding: 0.78571rem 0;
          display: block;
          position: relative;
          text-align: center; }
          .sonos-bar-light .title-area .left-small a [class^=icon-]:before, .sonos-bar-light .title-area .left-small .sonos-menu-label-wrap [class^=icon-]:before, .sonos-bar-light .title-area .right-small a [class^=icon-]:before, .sonos-bar-light .title-area .right-small .sonos-menu-label-wrap [class^=icon-]:before {
            margin: 0; }
      .sonos-bar-light .title-area #toggle-sonos-menu {
        display: none; }
      .sonos-bar-light .title-area .left-small .sonos-menu-label-wrap {
        font-size: 1.14286rem;
        text-align: left; }
      .sonos-bar-light .title-area .left-small .icon-account {
        margin-left: -3px;
        color: #f0534a;
        position: absolute;
        font-size: 1.5rem; }
      .sonos-bar-light .title-area .right-small {
        right: 0; }
        .sonos-bar-light .title-area .right-small a {
          text-align: right; }
          .sonos-bar-light .title-area .right-small a .cart-icon-number {
            margin-left: -7px; }
          .sonos-bar-light .title-area .right-small a:after {
            content: "";
            display: block;
            width: 100%;
            height: 0;
            visibility: hidden;
            position: absolute;
            bottom: 0;
            left: 0;
            background: #f0534a;
            transition: height 500ms cubic-bezier(0.19, 1, 0.22, 1), visibility 0s cubic-bezier(0.25, 0.25, 0.75, 0.75) 800ms; }
          .sonos-bar-light .title-area .right-small a.active:after {
            visibility: visible;
            height: 6px;
            transition: height 500ms cubic-bezier(0.19, 1, 0.22, 1), visibility 0s cubic-bezier(0.25, 0.25, 0.75, 0.75); }
      .sonos-bar-light .title-area .middle {
        left: 3.14286rem;
        right: 3.14286rem; }
      .sonos-bar-light .title-area a:hover {
        text-decoration: none; }
    .sonos-bar-light .name.sonos-logo {
      height: 4.85714rem; }
      .sonos-bar-light .name.sonos-logo a {
        color: #000;
        font-family: "sonos-logoregular", "Neue Helvetica W02", Helvetica, Arial, sans-serif;
        text-transform: uppercase;
        font-size: 2.07143rem;
        font-weight: 400;
        letter-spacing: 0.28571rem;
        text-align: center;
        line-height: 4.85714rem;
        padding: 0;
        display: block; }
    .sonos-bar-light .top-bar-section {
      position: absolute;
      background: #fff;
      left: -20px;
      top: 4.85714rem;
      width: calc(100% + 40px);
      z-index: 100;
      margin-top: 1px;
      padding: 8px;
      opacity: .2;
      -ms-transform: scaleY(0);
      -webkit-transform: scaleY(0);
      -moz-transform: scaleY(0);
      transform: scaleY(0);
      -webkit-transform-origin: top;
      -o-transform-origin: top;
      -ms-transform-origin: top;
      transform-origin: top;
      will-change: transform;
      -webkit-transition: -webkit-transform .3s ease-in-out,opacity .3s ease-in-out;
      -moz-transition: -moz-transform .3s ease-in-out,opacity .3s ease-in-out;
      transition: transform .3s ease-in-out,opacity .3s ease-in-out; }
      .sonos-bar-light .top-bar-section ul {
        list-style: none;
        padding: 0;
        margin: 0; }
        .sonos-bar-light .top-bar-section ul li > a {
          font-family: "helvetica-neue-bold", Helvetica, Arial, sans-serif;
          display: block;
          width: 100%;
          font-size: 1.14286rem;
          text-transform: none;
          padding-top: 0.78571rem;
          padding-right: 0.42857rem;
          padding-bottom: 0.78571rem;
          padding-left: 0.42857rem;
          line-height: 1.42857rem;
          position: relative; }
          .sonos-bar-light .top-bar-section ul li > a:hover {
            text-decoration: none; }
        .sonos-bar-light .top-bar-section ul.prominent-nav > li:not(.has-form), .sonos-bar-light .top-bar-section ul.aux-nav > li:not(.has-form) {
          padding-right: 1.14286rem;
          padding-left: 1.14286rem; }
        .sonos-bar-light .top-bar-section ul.prominent-nav > li:not(.has-form) > a:not(.button) {
          font-size: 1.28571rem;
          font-weight: 600; }
        .sonos-bar-light .top-bar-section ul.aux-nav {
          position: relative; }
          .sonos-bar-light .top-bar-section ul.aux-nav > li > a {
            font-family: "helvetica-neue-regular", Helvetica, Arial, sans-serif;
            font-size: 0.85714rem; }
            .sonos-bar-light .top-bar-section ul.aux-nav > li > a [class^="icon-"] {
              font-size: 1.75em;
              position: relative;
              top: 2px;
              line-height: 0.75; }
    .sonos-bar-light #toggle-sonos-menu:checked ~ .top-bar-section {
      -ms-transform: scaleY(1);
      -webkit-transform: scaleY(1);
      -moz-transform: scaleY(1);
      transform: scaleY(1);
      opacity: 1; }
  .direct-buy-bar {
    background-color: #000;
    height: 2.07143rem; }
  .cart-icon-number {
    background: #f0534a;
    color: #fff;
    border-radius: 30px;
    display: inline-block;
    position: absolute;
    font-size: 0.85714rem;
    line-height: 1.25;
    padding-right: 0.42857rem;
    padding-left: 0.42857rem;
    margin-top: 7px;
    margin-left: -11px; }
  .logged-in .icon-account {
    color: #f0534a; } }

@media (min-width: 768px) {
  .sonos-bar-light .title-area .left-small, .sonos-bar-light .title-area .right-small, .sonos-bar-light .title-area .middle {
    position: static; }
  .sonos-bar-light .title-area .middle {
    float: left; }
  .sonos-bar-light .top-bar-section {
    position: static;
    margin-top: 0;
    padding: 0;
    -ms-transform: scaleY(1);
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    transform: scaleY(1);
    opacity: 1;
    width: auto;}
    .sonos-bar-light .top-bar-section ul {
      display: inline;
      width: auto;
      height: auto; }
      .sonos-bar-light .top-bar-section ul li {
        float: left; }
        .sonos-bar-light .top-bar-section ul li > a {
          line-height: 3.28571rem; }
    .sonos-bar-light .top-bar-section .prominent-nav {
      margin-left: 2.85714rem;
      float: left; }
      .sonos-bar-light .top-bar-section .prominent-nav > li:not(.has-form) > a:not(.button):after {
        content: "";
        display: block;
        width: 100%;
        height: 0;
        visibility: hidden;
        position: absolute;
        bottom: 0;
        left: 0;
        background: black;
        transition: height 500ms cubic-bezier(0.19, 1, 0.22, 1), visibility 0s cubic-bezier(0.25, 0.25, 0.75, 0.75) 800ms;
        top: inherit;
        border: none; }
      .sonos-bar-light .top-bar-section .prominent-nav > li:not(.has-form):hover > a:not(.button):after {
        visibility: visible;
        height: 6px;
        transition: height 500ms cubic-bezier(0.19, 1, 0.22, 1), visibility 0s cubic-bezier(0.25, 0.25, 0.75, 0.75); }
    .sonos-bar-light .top-bar-section .aux-nav {
      float: right; }
      .sonos-bar-light .top-bar-section .aux-nav > li > a:not(.button):after {
        content: "";
        display: block;
        width: 100%;
        height: 0;
        visibility: hidden;
        position: absolute;
        bottom: 0;
        left: 0;
        background: black;
        transition: height 500ms cubic-bezier(0.19, 1, 0.22, 1), visibility 0s cubic-bezier(0.25, 0.25, 0.75, 0.75) 800ms;
        border: 0;
        margin-top: 0;
        top: auto; }
      .sonos-bar-light .top-bar-section .aux-nav > li:hover > a:not(.button):after {
        visibility: visible;
        height: 6px;
        transition: height 500ms cubic-bezier(0.19, 1, 0.22, 1), visibility 0s cubic-bezier(0.25, 0.25, 0.75, 0.75); }
      .sonos-bar-light .top-bar-section .aux-nav > li.open > a:not(.button),
      .sonos-bar-light .top-bar-section .aux-nav > li > a.active:not(.button) {
        color: #979797; }
        .sonos-bar-light .top-bar-section .aux-nav > li.open > a:not(.button):after,
        .sonos-bar-light .top-bar-section .aux-nav > li > a.active:not(.button):after {
          visibility: visible;
          height: 6px;
          transition: height 500ms cubic-bezier(0.19, 1, 0.22, 1), visibility 0s cubic-bezier(0.25, 0.25, 0.75, 0.75);
          background-color: #f0534a; } }
