@font-face {
	font-family: 'HelveticaNeueLTPro';
	src: url('https://currys-ssl.cdn.dixons.com/css/themes/SONOS_the_system/fonts/HelveticaNeueLTPro-Hv.eot') format('embedded-opentype'),
	url('https://currys-ssl.cdn.dixons.com/css/themes/SONOS_the_system/fonts/HelveticaNeueLTPro-Hv.woff') format('woff'),
url('https://currys-ssl.cdn.dixons.com/css/themes/SONOS_the_system/fonts/HelveticaNeueLTPro-Hv.ttf') format('truetype'),
	url('https://currys-ssl.cdn.dixons.com/css/themes/SONOS_the_system/fonts/HelveticaNeueLTPro-Hv.svg') format('svg');
}

/*.breadcrumb {display:none;height:0;padding:0;margin:0}*/
.dcg {max-width:1240px;}
.dcg *, .dcg *:after, .dcg *:before {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}
.dcg .group:before, .dcg .group:after {content: "";display: table} 
.dcg .group:after {clear: both}
.dcg .group {zoom: 1}
.dcg.sfc h2,
.dcg.sfc h3 {font-size:25px;font-family:'HelveticaNeueLTPro', Arial, sans-serif;font-weight:100;}
.dcg.sfc h4 {font-size:14px;font-family:'HelveticaNeueLTPro', Arial, sans-serif;font-weight:100;}
.dcg img {max-width:100%;}
.dcg.sfc p {color:#7b7b7c;}
.dcg.sfc .lead {font-size: 18px;}
.dcg.sfc .flex {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;}
.dcg a {text-decoration:none;color:#000;display: block;}
.dcg a:hover {color:#000;}
.dcg.sfc button {background: rgba(255,255,255,0.9); color: #000; padding: 10px; text-decoration: none; font-weight: bold; border: 3px solid #000; margin-bottom: 20px;}
.dcg.sfc button:hover {background:#252525;transition:0.5s;color:#fff;}
.dcg.sfc button i {font-size:70%;}
.dcg header {width:100%;float:left;padding:0px;margin-bottom:0px;}
.dcg.sfc .fl-lft {float: left;}
.videoWrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; overflow: hidden; } 
.videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow:hidden; } 

/* Nav */
.dcg.sfc .desktopnav {background:#000;}
.dcg.sfc .desktopnav nav a {color:#fff;}
.dcg.sfc .desktopnav nav ul a {width:25%;}
.dcg.sfc .desktopnav nav ul li {border:1px solid #fff;}
.dcg.sfc .desktopnav nav ul li:hover,
.dcg.sfc .desktopnav nav ul li.active {background:#fff;color:#000;}

/* Intro */
.dcg #about {float:left;width:100%;padding:50px 0px;}
.dcg #about .sonosintro {width:40%;margin-left:5%;float:left;padding-top:40px;}
.dcg #about .sonosvid, .dcg #about .sonosintroimg {width:45%;margin:0px 5%;float:left;}
@media (max-width: 1100px) {
    .dcg #about .sonosintroimg {width:45%;margin:0 0 0 5%;float:left;}
}
@media (max-width: 950px) {
    .dcg #about .sonosintroimg {width:100%;text-align: center; float:left;}
}

/* Learn more */
.dcg #learnmore {background:#efefef;width:100%;float:left;padding:30px 5% 50px 5%;text-align:center;}
.dcg #learnmore h2 {padding:20px;}
.dcg #learnmore .learnwrapper {width:102%;float:left;margin-left:-2%;overflow:hidden;}
.dcg #learnmore .learnblock {width:48%;margin-left:2%;float:left;position:relative;margin-bottom:20px;}
.dcg #learnmore .learnblock button {position:absolute;bottom:5px;margin-left:-25%;width: 50%;}

/* What is Sonos */
.dcg #whatissonos {width:100%;float:left;background:#efefef;padding:50px 5%;}
.dcg #whatissonos .half {width:48%;margin-left:2%;float:left;}
.dcg #whatissonos .split-three {width:31.3%;margin-left:2%;margin-right:0%;}
.dcg #whatissonos .half h2,
.dcg #whatissonos .split-three h2,
.dcg #whatissonos .split-two h2 {padding-top:10px;}
.dcg #whatissonos .twowrapper {width:102%;float:left;margin-left:-2%;overflow:hidden;}

/* Sonos app */
.dcg #sonosapp {width:100%;float:left;padding:50px 5%;}
.dcg #sonosapp .apptext {width:45%;float:left;padding-right:20px;}
.dcg #sonosapp .appvideo {width:55%;float:left;padding-top:40px;}
.dcg #sonosapp img {padding-bottom:10px;}

/* Sonos Compare */
.dcg #sonosplay {width:100%;float:left;}
.dcg #sonosplay .blackgradient {background: #0e0e0d; /* Old browsers */
background: -moz-linear-gradient(top,  #0e0e0d 0%, #0e0e0d 2%, #0e0e0d 19%, #353636 51%, #50504f 96%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #0e0e0d 0%,#0e0e0d 2%,#0e0e0d 19%,#353636 51%,#50504f 96%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #0e0e0d 0%,#0e0e0d 2%,#0e0e0d 19%,#353636 51%,#50504f 96%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e0e0d', endColorstr='#50504f',GradientType=0 ); /* IE6-9 */
;width:100%;float:left;padding:50px 5%;}
.dcg #sonosplay .playtext {color:#fff;width:40%;}
.dcg #sonosplay .playtext p {color:#fff;}
.dcg #sonosplay .playhero {width:100%;float:left;text-align:center;margin-bottom:-18%;}
.dcg #sonosplay .greygradient {background: #414141;
background: -moz-linear-gradient(top,  #414141 0%, #6a6a6a 51%, #bababa 99%);
background: -webkit-linear-gradient(top,  #414141 0%,#6a6a6a 51%,#bababa 99%);
background: linear-gradient(to bottom,  #414141 0%,#6a6a6a 51%,#bababa 99%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#414141', endColorstr='#bababa',GradientType=0 );width:100%;padding:50px 5%;}
.dcg #sonosplay .playcompare {width:33.3%;float:left;color:#fff;padding:120px 20px 20px 20px;position:relative;}
.dcg #sonosplay .playbundles {width:33.3%;float:left;color:#000;padding:100px 20px 20px 20px;position:relative;}
.dcg #sonosplay .playbundles h2 {font-size: 20px;}
.dcg #sonosplay .playcompare.firstcompare,
.dcg #sonosplay .playbundles.firstcompare {margin-left:16.66%;}
.dcg #sonosplay .playcompare p {color:#fff;padding:15px 0px;margin-bottom:0px;}
.dcg #sonosplay .bundledesc p {color: #000; padding: 15px 0px; margin-bottom: 0px;}
.dcg #sonosplay .playcompare button {background:transparent;border:3px solid #fff;color:#fff;}
.dcg #sonosplay .divider {height:1px;background:#fff;width:100%;}
.dcg #sonosplay .black {width:100%;float:left;padding:50px 5%;background:#000;}
.dcg #sonosplay .playhero.amp {margin-bottom:-1%;padding-top:30px;}

/* Upgrade your audio */
.dcg .centertext {width:100%;float:left;text-align:center;padding-bottom:20px;}

/* Sonos with your TV */
.dcg #feature {width:100%;float:left;padding:50px 5%;}
.dcg #feature .sonostext {width:40%;margin-left:5%;float:left;padding-top:20px;}
.dcg #feature .sonosasset {width:45%;margin:0px 5%;float:left;}
.dcg #feature.greybg {background:#efefef;}
.dcg #sonosplay.sonossub .playhero {margin-bottom:-30%;padding-top:50px;}

/* Sonos with your TV */
.dcg #sonosplay.sonosplay .playhero {margin-bottom:-18%;padding-top:50px;}

/* Trueplay */
.dcg #trueplay {background: url(https://currysprod.a.bigcontent.io/v1/static/sonos-ua-Trueplay-For-The-Room-BG.jpg) no-repeat top center;height: 600px;width:100%;float:left;padding:50px 5%;}
.dcg #trueplay .trueplaytext {width:38%;float:left;padding-top:60px;}
.dcg #whatissonos.listen {background:#fff;}



@media only screen and (max-width: 1200px){
.dcg.sfc .desktopnav nav ul li {font-size:12px;}
}

@media only screen and (min-width: 1100px){
.dcg #feature .sonostext.heroright {float:right;}
}

@media only screen and (max-width: 1100px){
.dcg #learnmore .learnblock button {margin-left:-40%;width:80%;}
.dcg #about .sonosintro {width:45%;padding-top:0px;}
.dcg #about .sonosvid {width:40%;}
    .dcg #feature .sonostext {width:100%;margin-left:0%;}
    .dcg #feature .sonosasset {width:70%;margin:30px 15%;}

}

@media only screen and (max-width: 950px){
.dcg #learnmore .learnblock button {margin-left:-40%;width:80%;}
.dcg #about .sonosintro {width:90%;margin:20px 5%;text-align:center;}
.dcg #about .sonosintro p {width:70%;margin-left:15%;}
.dcg #about .sonosvid {width:70%;margin:20px 15%;}
.dcg #sonosplay.sonossub .playcompare,
.dcg #sonosplay.sonosplay .playcompare,
    .dcg #sonosplay.sonosamp .playcompare,
    .dcg #sonosplay .playcompare,
    .dcg #sonosplay .playbundles {width:100%;height:auto;}
    .dcg #sonosplay .playdesc {height:auto;}
    .dcg #sonosplay .playcompare button {position:relative;}
.dcg #sonosplay .playcompare.firstcompare {margin-left:0%;}
.dcg #sonosplay .playcompare {padding:20px 20px 20px 20px;}
    .dcg #sonosplay .playbundles {padding:20px 20px 20px 20px;}
}

@media only screen and (max-width: 1000px){
.dcg.sfc .desktopnav nav a {width:100%;}
.dcg.sfc .desktopnav nav figure {padding:0px;}
.dcg.sfc .desktopnav nav ul {width:100%;}
    .dcg.sfc #sonosapp .appvideo {width:70%;margin-left:15%;}
    .dcg.sfc #sonosapp .apptext {width:100%;}
    .dcg #trueplay .trueplaytext {width:50%;background:rgba(255,255,255,0.7);padding:20px;}
}

@media only screen and (min-width: 746px) and (max-width:850px){
.dcg #learnmore .learnblock button {margin-left: -25%;width:50%;} 
}

@media only screen and (max-width: 900px){
    .dcg #whatissonos .half {width:100%;margin-left:0%;text-align:center;margin-bottom:20px;}
}

@media only screen and (max-width: 850px){
.dcg #learnmore .learnblock {width:90%;margin-left:5%;}
.dcg.sfc .desktopnav nav ul a {width:50%;float:left;}
.dcg.sfc .desktopnav {padding-bottom:10px;}
.dcg #whatissonos .split-three {width:80%;margin-right:10%;margin-left:10%;}
    .dcg #whatissonos.listen .split-three {text-align:center;}
}


@media only screen and (max-width: 800px){
.dcg #about .sonosintro p {width:100%;margin-left:0%;}
.dcg #about .sonosvid {width:90%;margin:20px 5%;}
    .dcg.sfc #sonosapp .appvideo {width:100%;margin-left:0%;padding-top:0px;}
.dcg #sonosplay .playtext {width:100%;}
}

@media only screen and (max-width: 746px){
.dcg #learnmore .learnblock button {margin-left:-25%;width:50%;}
}


@media only screen and (max-width: 650px){
    .dcg #trueplay {background-position:-600px -40px;}
    .dcg #trueplay .trueplaytext {width:100%;background:rgba(255,255,255,0.9);padding:20px;margin-top:30%;}
}

@media only screen and (max-width: 600px){
.dcg #learnmore .learnblock button {position:relative;width:100%;margin-left:0%;background:#000;color:#fff;}
.dcg #learnmore .learnblock {width:100%;margin-left:0%;}
.dcg #about .sonosintro {text-align:left;}
.dcg #about {padding-top:0px;}
.dcg.sfc .mobnav nav.active ul {height:320px;}
.dcg.sfc .mobnav nav a.open, .dcg.sfc .mobnav nav a.close {color:#fff;height:auto;padding-top:10px;}
.dcg.sfc #learnmore {padding-bottom:20px;}
.dcg.sfc h1 {text-align:center;}
.dcg #whatissonos .split-three {width:100%;margin-right:0%;margin-left:0%;}
.dcg #whatissonos {padding:20px 5%;}
    .dcg #sonosplay .playcompare {padding:40px 20px 20px 20px;}
    .dcg #whatissonos .half,
    .dcg #whatissonos .centertext {text-align:left;}
    .dcg #feature .sonosasset {width:100%;margin:30px 0px;}
    .dcg #feature {padding:20px 5%;}
}