@import url("https://currys-ssl.cdn.dixons.com/css/themes/audio_buying_guide/css/nav-buyersguide.css"); .breadcrumb {display:none; height:0; padding:0; margin:0;} #DSG_wrapper img{ max-width:100%; height:auto;} #DSG_wrapper .wrapper{ width: 92%; margin: 0 auto;} #DSG_wrapper #content,aside,.vertical-padding{ padding:40px 0;} #DSG_wrapper p{ font-family:arial;font-size:13px;color:#000;} #DSG_wrapper p.desc{ font-family:arial,sans-serif;font-size:13px;color:#4a4a4a;font-weight:normal} #DSG_wrapper *{ box-sizing:border-box; -moz-box-sizing:border-box;} #DSG_wrapper { max-width:1240px; background:#fff; color:#666; font-family:Gotham, Arial, Helvetica, sans-serif; font-size:1em; font-weight:normal;} #DSG_wrapper h1{font-size: 32px;color: #00B3B0;line-height: 100%;margin: 0px 0px 10px;} #DSG_wrapper h2{font-size: 20px;color: #fff;line-height: 100%;margin:0px;} #DSG_wrapper .clearfix:before, .clearfix:after { content: ""; display: table; } #DSG_wrapper .clearfix:after { clear: both; } #DSG_wrapper .clearfix { zoom: 1; } #DSG_wrapper a{text-decoration:none;font-size:20px;color:#00B3B0;} #DSG_wrapper a.tooltips { position: relative; display: inline;} #DSG_wrapper a.tooltips span { position: absolute; width:140px; color: #fff; background: #7A7A7A; height: 103px; line-height: 103px; text-align: center; visibility: hidden; border-radius: 6px;} #DSG_wrapper a.tooltips span:after { content: ''; position: absolute; top: 100%; left: 50%; margin-left: -8px; width: 0; height: 0; border-top: 8px solid #7A7A7A; border-right: 8px solid transparent; border-left: 8px solid transparent;} #DSG_wrapper a:hover.tooltips span { visibility: visible; bottom: 30px; left: 50%; margin-left: -76px; z-index: 999;} #DSG_wrapper #audio .grid_2{text-align: center;margin-top:20px;} #DSG_wrapper #audio .grid_6{margin-top:20px;padding:20px; text-align:center;} #DSG_wrapper #audio .grid_maindesc{margin-top:40px;padding:20px;background: rgba(255, 255, 255, 0.9);margin-bottom: 40px;} #DSG_wrapper #audio .grid_main{margin-top:20px;background:#d5d0f5; background:url(https://currys-ssl.cdn.dixons.com/css/themes/audio_buying_guide/img/audiobg-5.jpg)} #DSG_wrapper #audio .grid_12{margin-top:20px;background: linear-gradient(to bottom, #FFF 0%, #EFEFEF 100%) repeat scroll 0% 0% transparent;border:1px solid #eee} #DSG_wrapper #audio .grid_strip{padding:20px;background: #00B3B0} #DSG_wrapper #audio .grid_1, #DSG_wrapper #audio .grid_3, #DSG_wrapper #audio .grid_4, #DSG_wrapper #audio .grid_5, #DSG_wrapper #audio .grid_7, #DSG_wrapper #audio .grid_8, #DSG_wrapper #audio .grid_9, #DSG_wrapper #audio .grid_10, #DSG_wrapper #audio .grid_11 { margin-top:20px; padding:20px; } #DSG_wrapper .grid_1, #DSG_wrapper .grid_2, #DSG_wrapper .grid_3, #DSG_wrapper .grid_4, #DSG_wrapper .grid_5, #DSG_wrapper .grid_6, #DSG_wrapper .grid_7, #DSG_wrapper .grid_8, #DSG_wrapper .grid_9, #DSG_wrapper .grid_10, #DSG_wrapper .grid_11, #DSG_wrapper .grid_12, #DSG_wrapper .grid_main, #DSG_wrapper .grid_maindesc { margin-bottom:40px; } .greenelement{ background:#5ec79e; color:#fff;} .violetelement{ background:#fff; color:#7A7A7A;} #DSG_wrapper #internetdesc {max-height: 0px;opacity: 0;overflow: hidden;transition: all 500ms ease-out 0s;} #DSG_wrapper #librarydesc {max-height: 0px;opacity: 0;overflow: hidden;transition: all 500ms ease-out 0s;} #DSG_wrapper #cddesc {max-height: 0px;opacity: 0;overflow: hidden;transition: all 500ms ease-out 0s;} #DSG_wrapper #radiodesc {max-height: 0px;opacity: 0;overflow: hidden;transition: all 500ms ease-out 0s;} #DSG_wrapper #internetdesc.open{max-height: 200px;opacity: 1;} #DSG_wrapper #librarydesc.open{max-height: 200px;opacity: 1;} #DSG_wrapper #cddesc.open{max-height: 200px;opacity: 1;} #DSG_wrapper #radiodesc.open{max-height: 200px;opacity: 1;} /*------------------------------------Table----------------------------------------*/ /* ALTERNATING GREY AND WHITE BACKGROUND */ #DSG_wrapper table tr:nth-child(even) { background-color:#efefef; } #DSG_wrapper table tr:nth-child(odd) { background-color:#fff; } #DSG_wrapper .table-cell {display:table-cell; vertical-align:middle; text-align:center; padding:0 2% 0 2%;} #DSG_wrapper table .title th, table .title td{font-weight: bold; font-size: 18px; color: #000; border: none; background: #fff;} #DSG_wrapper table .header th{font-size: 20px; color: #00B3B0;} #DSG_wrapper table th{font-size: 16px; font-weight: bold; text-align: left; border: 1px solid #E0E0E0; padding: .2em 1%; color: #7A7A7A; padding:10px;width:20%;height: 140px; } #DSG_wrapper table td{text-align: center; padding: 1%; border: 1px solid #E0E0E0; vertical-align: middle;} #DSG_wrapper table td span,table th span{display: block; font-size: 14px; font-weight: normal; display: block;text-align: center; font-size: 80%;} #DSG_wrapper table th span{text-align: left;} /*-----------------------------------------------------------------------------------------------------------------------------------------------------------------*/ @media only screen and (min-width: 0px) and (max-width: 767px){ #DSG_wrapper table, thead, tbody, th, td, tr {display: block;} #DSG_wrapper table .title, table .header {display: none; } #DSG_wrapper thead tr {position: absolute; top: -9999px; left: -9999px; } #DSG_wrapper tr { border: 1px solid #E0E0E0; } #DSG_wrapper td {border: none; /*border-bottom: 1px solid #E0E0E0;*/ position: relative; padding-left: 50%; vertical-align: middle;} #DSG_wrapper td:before {position: absolute; top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; } #DSG_wrapper table td:nth-of-type(1):before { content: "Multi-room Audio"; } #DSG_wrapper table td:nth-of-type(2):before { content: "Speakers"; } #DSG_wrapper table td:nth-of-type(3):before { content: "Hi-Fi"; } #DSG_wrapper table td:nth-of-type(4):before { content: "Radio"; } #DSG_wrapper table td:nth-of-type(5):before { content: "Product 5"; } #DSG_wrapper table td:nth-of-type(6):before { content: "Product 6"; } #DSG_wrapper table td:nth-of-type(7):before { content: "Product 7"; } #DSG_wrapper table td{text-align: right; padding: 3%;height:80px; } #DSG_wrapper p.desc{ display:none} #DSG_wrapper table th{font-size: 16px; font-weight: bold; text-align: left; border: 1px solid #E0E0E0; padding: .2em 1%; color: #7A7A7A; padding:10px;width:100%;height: 80px; } } @media only screen and (min-width: 920px) { #DSG_wrapper .wrapper{ max-width: 1200px; margin: .75em auto;} #DSG_wrapper #content { float:left; width:65%;} #DSG_wrapper #content.wide-content{ float:none; width:100%;} #DSG_wrapper .grid_1 { width: 5%; } #DSG_wrapper .grid_3 { width: 21.666666666667%; } #DSG_wrapper .grid_4 { width: 30%; } #DSG_wrapper .grid_5 { width: 38.333333333333%; } #DSG_wrapper .grid_6 { width: 46.666666666667%; } #DSG_wrapper .grid_maindesc { width: 46.666666666667%; } #DSG_wrapper .grid_7 { width: 55%; } #DSG_wrapper .grid_8 { width: 63.333333333333%; } #DSG_wrapper .grid_9 { width: 71.666666666667%; } #DSG_wrapper .grid_10 { width: 80%; } #DSG_wrapper .grid_11 { width: 88.333333333333%; } #DSG_wrapper .grid_12 { width: 96.666666666667%; } #DSG_wrapper .grid_main { width: 100%; } #DSG_wrapper .grid_strip { width: 100%; } #DSG_wrapper .grid_1, #DSG_wrapper .grid_3, #DSG_wrapper .grid_4, #DSG_wrapper .grid_5, #DSG_wrapper .grid_6, #DSG_wrapper .grid_7, #DSG_wrapper .grid_8, #DSG_wrapper .grid_9, #DSG_wrapper .grid_10, #DSG_wrapper .grid_11, #DSG_wrapper .grid_12 { margin-left: 1.6666666666667%; margin-right: 1.6666666666667%; float: left; margin-bottom:0px; } #DSG_wrapper .grid_main{float:left;} #DSG_wrapper .grid_maindesc{ float: left; margin-bottom:0px;} #DSG_wrapper #audio .grid_maindesc { margin-top: 100px;} } @media only screen and (min-width: 650px) { #DSG_wrapper .grid_2 { width: 15%; } #DSG_wrapper .grid_2 { margin-left: 1%; margin-right: 0.5%; float: left; margin-bottom:0px;} } @media only screen and (max-width: 920px) { #DSG_wrapper #audio .grid_3{text-align:center} } #DSG_wrapper .grid_2 img{display: block; width: 100%; max-width: 281px; margin: 0 auto;opacity: 1;-webkit-transform: scale(1,1);-ms-transform: scale(1,1);transform: scale(1,1);-webkit-transition: all 300ms ease-out;transition: all 300ms ease-out;} #DSG_wrapper .grid_2 img:hover {position: relative;z-index: 99;opacity: .8;-webkit-transform: scale(1.04, 1.04);-ms-transform: scale(1.04, 1.04);transform: scale(1.04, 1.04);-webkit-transition: all 300ms ease-out;transition: all 300ms ease-out;} #content {overflow: hidden;} .KnowhowBlock { font-size:12px; list-style:none; margin-left:0px; width:100%;} .KnowhowBlock h1 { color:#999; border-bottom:#CCC 1px solid;} .KnowhowBlock ul { padding:0px; margin:0px; overflow:hidden; position: relative;} .KnowhowBlock li { list-style:none; overflow:hidden;} .KnowhowBlock a { text-decoration:none;} .KnowhowBlock section { overflow:hidden; margin-bottom:10px;} .KnowhowBlock h1, h2, h3 { color: #666; font-family: 'Gotham A', 'Gotham B', 'Helvetica', 'Arial', 'Sans-Serif';} .KnowhowBlock h2{font-size:18px;border-bottom:#CCC 1px solid; padding: 15px 0 5px 0;color:#333;font-weight:lighter; margin:0px; margin-bottom:20px; height: 27px;} .KnowhowBlock .buyingbutton { float:right;} .KnowhowBlock .listimage-block {width: 15%; float:left;} .KnowhowBlock .segbanner { width:25%; float:left; } .KnowhowBlock .segbanner img { display:block; margin:auto; max-width:295px;} html.js body div#page div#wrapper section#content div.row section.col9 div#div-gpt-ad-leadertop-0.desktop {display:none;} a.toggleControler[href="#filters"] {display: none;} .KnowhowBlock img {max-width: 100%;} /*advice block */ .KnowhowBlock article#advice {margin-top:40px;} .KnowhowBlock article#advice li { width:100%; float:left; margin-bottom:20px; position:relative; } .KnowhowBlock article#advice li img { margin:0 auto; display:block;} .KnowhowBlock article#advice p{ font-weight:lighter;} .KnowhowBlock article#advice a{ width:95%;} .KnowhowBlock article#advice .listtext-block{ width:75%; float:right; margin-right: 30px;} .KnowhowBlock article#advice h3 { color:#666; font-size:14px;} .KnowhowBlock article#advice p.cta { font-size:15px; float:right; color:#06e; } .KnowhowBlock article#advice p.cta span { margin-left:10px;} .KnowhowBlock article#advice .reasons-to-shop li {margin:5px 0 5px 0; background-image: url(https://currys-ssl.cdn.dixons.com/css/themes/home_entertainment_category/img/tick.jpg); background-repeat: no-repeat; padding-left:25px; line-height:16px; font-weight:bold; width:auto; float:none;} /* service block */ .KnowhowBlock article#service {margin-top:40px;} .KnowhowBlock article#service li { width:100%; float:left; margin-bottom:20px; padding-right:5%;} .KnowhowBlock article#service li img { margin:0 auto; display:block; } .KnowhowBlock article#service p{ font-weight:lighter; padding:3%;} .KnowhowBlock article#service li p{ padding:0%;} .KnowhowBlock article#service a{ width:95%; } .KnowhowBlock article#service .listtext-block{ width:75%; float:right;} .KnowhowBlock article#service h3 { color:#666; font-size:14px;} .KnowhowBlock article#service .ms-tooltip:after, .popInTrigger:after {content:""!important; border:0px;} .KnowhowBlock article#service .cta { font-size:15px; float:right; color:#06e; } /* Code to force content to sit full width */ html.js body div#page div#wrapper section#content div.row div.mboxDefault div#rr_placement_0 { display: inline; float: left; margin-left: 37px;margin-top: 20px; overflow: hidden;} /*Tablet */ @media only screen and (min-width: 0px) and (max-width: 1024px)/*998*/{ .KnowhowBlock header #buttonbox1 { margin: 35px 0 0 8%; width: 100%;} .KnowhowBlock header #buttonbox2 {margin: 35px 0 0 6%; width: 100%;} .KnowhowBlock header #buttonbox3 {margin: 35px 0 0 2%; width: 100%;} .KnowhowBlock header #buttonbox4 {margin: 35px 0 0 2%; width: 100%;} .KnowhowBlock header #guaranteebutton:before {left: 0;} .KnowhowBlock article#service li { width:100%;} .KnowhowBlock article#advice li:first-child {margin-top: 0;} .KnowhowBlock div#top-services li {float: left; width: 33%;} .KnowhowBlock article#advice .listtext-block {float: left; margin-left: 20px; width: 75%; margin-right: 0;} .KnowhowBlock article#service .listtext-block {float: left; margin-left: 20px; width: 75%;} } /* Mobile */ @media only screen and (min-width: 0px) and (max-width:599px){ .col12{width:100%; margin-left:0px;} .col6{width:100%;} }