*, *::after, *::before {box-sizing: border-box;} #pagebg{width:100%;text-align:center;background:#fff;} #pagebgsub{width:100%;text-align:center} *{font-family:Arial} td{vertical-align:top} a{text-decoration:none} #page{width:100%;padding-top:0;margin:0 auto;text-align:center} table td,a,table td a{font-family:Arial} #EBdescription{text-align:center;margin:0 auto} #page form{margin:0;padding:0} #head{display:block;width:100%; max-width:960px; margin: 0 auto; text-align:left;clear:both!important;border:none!important;float:none!important;position:relative; } .headW {width: 100%;background: #f4f4f4; border-bottom: 2px solid #ccc; text-align: center;} #logo{display:block;float:left} #logobody{width:450px} #logo a{display:inline-block;width:450px;height:46px} #logo a span{visibility:hidden} #powerbg{padding-top:2px} #power{text-align:right;color:#333!important;font-size:11px;line-height:16px;padding-right:10px;height:30px} #power a{text-decoration:none;color:#333!important;font-size:11px} #topheaderright{float:left;width:500px} #menuline{clear:both;display:table;width:500px;height:30px} #menuline div{float:right;padding:0 3px} #menuline div a{color:#333;font-size:12px;font-family:"Noto Sans";text-align:center;padding:0 5px} #menuline div a:hover{text-decoration:underline} #headericons{text-align:right;height:35px;position:relative} #headericons div{position:absolute;background:#7CB9B2;padding:3px 5px;top:-24px} #headericons div a{color:#fff;font-size:12px;font-family:"Noto Sans"} #headericons #div2{right:0} #headericons #div1{right:30px} #search{font-size:13px;font-weight:400;color:#000;position:relative;padding:3px 0 0 43px} #searchbody{width:450px;height:40px;overflow:hidden!important;text-align:left} form{margin:0!important;padding:0!important} input#inpbox{font-size:12px;color:#000!important;width:394px;border:none!important;padding:8px 5px;margin:0 5px 0 0 !important;background:#fff;font-weight:400;float:left} #searchbody #gosrc{cursor:pointer;position:relative;top:2px;border:none;background:none} .topcatW {background: #fff; width: 100%; text-align: center; border-bottom: 2px solid #000;} #topcat{width:100%;max-width: 960px; margin: 0 auto;} #topcategories{padding:0;clear:both;float:none;display:block} #topcategories ul{list-style-type:none;padding:0!important;margin:0!important} #topcategories ul li{float:left;padding:0!important;margin:0!important;height:43px;font-size:16px} #topcategories a{text-align:center;display:inline-block;height:40px;line-height:36px;overflow:hidden!important;font-size:16px;padding:0 15px;font-weight:400;color:#000!important;text-decoration:none} #topcategories a:hover,#topcategories li:hover a{background:#7CB9B2} #topcategories a:hover .centerpart,#topcategories li:hover a .centerpart{color:#fff!important} #topcategories a .centerpart{border:none!important;cursor:pointer} #topcategories ul li ul.level2 li{float:none!important;background:none;width:auto} #topcategories ul li ul.level2 li#home{display:none!important} #topcategories ul li ul.level2 p{margin:0} #topcategories ul li ul.level2 p#topitemimage,#topcategories ul li ul.level2 p#topitemprice{display:none} #topcategories ul li ul.level2{position:absolute;background-color:#7CB9B2;border-top:none;padding:5px 10px!important;display:none;top:40px;left:0;width:220px} #topcategories ul li ul li ul.level3{position:absolute;background-color:#7CB9B2;border:1px #333 solid;padding:0 10px 0 0;white-space:nowrap;display:none;left:170px;top:0} #topcategories ul li:hover,#nav li.sfhover{position:relative;z-index:100!important} #topcategories ul li:hover ul.level2,#nav li.sfhover ul.level2{display:block} #topcategories ul li:hover ul.level2 li:hover ul{display:block} #topcategories ul li ul li{list-style-position:outside;float:none!important;margin:0 0 2px!important;padding:4px 2px;display:block;height:auto!important} #topcategories ul li ul a{background:none;text-align:left;float:none;line-height:15px;height:auto!important;padding:2px 5px;font-weight:400;width:auto!important;font-size:13px;color:#000!important;text-decoration:none;background:none!important} #topcategories ul li:hover ul a{color:#fff!important;text-decoration:none;display:block!important} #topcategories ul li:hover ul a:hover{text-decoration:underline} #topcategories ul li ul a:hover{text-decoration:underline} #qualitytext{height:auto;width:100%; max-width:960px;text-align:center;font-family:"Noto Sans";font-size:35px;color:#333;line-height:40px; padding:15px 75px; background: #f4f4f4; margin: 0 auto 10px auto; position: relative; box-shadow: 0px 10px 13px -14px #000; box-sizing: border-box;} .imgFlag1 {display: block; width: 60px; height: 40px; margin: auto;; padding: 0; position: absolute; left: 10px; top: 0; bottom: 0;} .imgFlag2 {display: block; width: 60px; height: 40px; margin: auto;; padding: 0; position: absolute; right: 10px; top: 0; bottom: 0;} #bodypage{margin:0;padding:0 0 10px 0;background:#fff} #leftside{margin-top:0;padding:0;margin-left:0;width:21%; overflow:hidden!important; float: left;} #shopcat{height:30px;line-height:30px;padding:0 0 0 10px !important;background:#F4F4F4;color:#000;font-size:15px;font-weight:400;text-transform:uppercase;text-align:left;font-family:"Noto Sans"} div#category{margin-bottom:10px} div#category ul {margin:0; padding:0; list-style:none;} div#category ul ul li a {padding-left:20px;} .tableAll {margin: 0 auto; width: 100%; max-width: 960px} #category a{display:block;font-size:13px;font-weight:400;text-align:left;text-decoration:none;padding:9px 4px 8px 10px;color:#333!important;background:#fff url(https://shared1.ad-lister.co.uk/UserImages/7c25617c-10d6-4a5e-90bd-ed14e43a223d/Img/_design/catbg_pass.jpg) left bottom repeat-x} #category a:hover /* category mouseover link background */{background:#7CB9B2!important;color:#fff!important} div#category .JA_category2,div#category .JA_category3{display:none} #centerside{width:79%; margin:0;overflow:hidden!important; padding: 0 0 0 10px; box-sizing: border-box; float: right; text-align: left;} #itemimage{text-align:center;padding:10px 0;position:relative} #itemimage .JTI_IW_photoContainer{width:500px;text-align:center;vertical-align:middle;padding:0} #itemimage table td.JTI_IW_tmbContainer{padding:0} #itemimage table td.JTI_IW_tmbContainer div{width:242px} #itemimage table td.JTI_IW_tmbContainer span{display:block;float:left;margin:5px 0 5px 15px;height:98px;padding:1px;width:98px;overflow:hidden!important;border:1px #ccc solid} #itemimage table td.JTI_IW_tmbContainer img{max-height:98px;height:expression(this.height > 98 ? 98 : true)} #itemhead{font-size:16px;color:#333;padding:5px 10px 6px;background:#F4F4F4} .tabbody{font-size:13px;color:#666;padding:10px 8px;border-bottom:1px #ccc solid;border-top:1px #ccc solid;margin-bottom:10px} #tabs section ul, .tabcontent ul, #specifications ul{padding:0 0 0 20px;margin:0} #tabs section a, .tabcontent a{font-size:14px;color:#000;text-decoration:underline} #tabhead{background:#f4f4f4;height:30px;text-align:left;padding:0;margin-top:10px} #tabhead .shadetabs{overflow:hidden;padding:0;margin:0;list-style-type:none} #tabhead .shadetabs li{float:left;padding:0 30px 0 0;height:30px;overflow:hidden!important;line-height:30px;display:inline-block} .shadetabs li a:hover,.shadetabs li a.selected{background:#7CB9B2;color:#fff!important} .shadetabs li a{color:#333!important;font-size:15px;display:inline-block;height:30px;font-family:"Noto Sans";padding:0 25px;line-height:30px;text-align:center;font-weight:400} #specifications{width:100%;clear:both;display:table;margin-bottom:10px; padding-top: 10px} #specifications .specificationbody{float:left;width:233px;font-size:12px;color:#333;padding-left:10px} #specification1,#specification2{margin-right:10px} #navigatorhead{font-size:15px;font-family:"Noto Sans";color:#000!important;height:30px;line-height:30px;text-align:left;padding-left:20px;background:#f4f4f4;border-bottom:1px #ccc solid} #navigator{padding:0} #newsletterline{margin-top:10px;background:url(https://shared1.ad-lister.co.uk/UserImages/7c25617c-10d6-4a5e-90bd-ed14e43a223d/Img/_design/newsletterbg.jpg) left top repeat-x;width:100%;height:60px;line-height:60px;font-size:14px;color:#333;text-align:center} #newsletterlinebody{font-family:"Noto Sans"} #newsletterlinebody a{display:inline-block;margin-left:10px;width:291px;height:26px;line-height:26px;background:url(https://shared1.ad-lister.co.uk/UserImages/7c25617c-10d6-4a5e-90bd-ed14e43a223d/Img/_design/newsletterbutton.jpg) 0 50% no-repeat;padding-left:35px;color:#fff!important;font-size:13px!important;font-family:"Noto Sans";text-align:left} #footerbg{background:#f4f4f4;text-align:center;padding: 20px 10px 35px 10px;} #footertop{width:100%;max-width: 960px;margin:0 auto;text-align:left} #footertopbody{padding-top:0;padding-left:30px;color:#000;font-size:14px;line-height:22px; box-sizing: border-box;} #footertopbody td,#footertopbody a{font-size:12px;color:#000} #footertopbody a:hover{text-decoration:underline; color: #EC1B23;} .footerhead{font-size:15px;text-transform:uppercase;color:#EC1B23;font-family:"Noto Sans";height:auto; line-height: 45px;} #footerbrands{width:260px} #footerbrandsbody div{float:left;width:130px} #footercatbody{width:100%} #footercatbody div{float:left;width:180px;margin-right:5px} #footersocial a{margin-right:3px} #footercatbody ul ul {display:none;} #footercatbody ul {margin:0; padding:0; width:100%; list-style:none;} #footercatbody ul li {float:left; width:33.333%;} #footercatbody li a, #contactbody {padding:5px 5px 5px 0; display:block; line-height: 15px; font-size: 12px;} #footercatbody:after {content:''; clear:both; display:table;} .clearAll:after, #categoriesside:after, .product:after {display: table; content: ''; clear: both;} #footercat {width: 60%; float: left; padding: 0 10px 0 0;} #footercontact {width: 40%; float: right;padding: 0 0 0 10px;} html,body {margin:0;padding:0;} #headericons:after, #topheader:after {content: ''; clear: both; display: table} #topheader {padding:0 0 32px 0; position: relative;} #logo {padding:0;} #topheaderright {float: right; width:auto;} #menuline {width: 100%; background:#fff; height: auto; margin:0 0 31px 0;display: table} #menuline div {float:none; display: table-cell;} #menuline div a {display: block; padding:10px 0; text-align: center;} #headericons {height: auto; padding-top: 7px} #headericons a {height: 27px;} #topcat {background-image: none} .product {display:block; position: relative; margin: 0; padding: 0} .product:after {content: ''; clear: both; display: table} .product .prod {float: left; width:33.333%; display: block; padding:10px 0; text-align:center; min-height: 235px;} .product .prod .image {margin:0 auto; padding: 0 10px; display:block;} .product .prod .image span {display:block; margin:0; padding:0; overflow:hidden;} .product .prod .image span a {width:100%; height: 100px; position: relative; display: block;} .product .prod .image span a img {max-width: 100%; max-height:100px; position: absolute; left:0; top:0; right:0; bottom:0; margin: auto; border:none; padding:0} .product .prod .title h4 {margin:0; padding:10px; font-size:13px; font-weight:normal;} .product .prod .title h4 a {text-decoration: none; color:#000; word-break:break-all} .product .prod .title h4 a:hover {text-decoration: underline;} .product .prod .price {font-size:12px;} .product .prod .price p {margin:0; padding:0} .product .prod .btn {display:none; text-align: center; margin:0; padding:10px 0; } .product .prod .btn a {display: inline-block; text-decoration: none; padding:0 10px;height:25px; line-height: 25px; color:#fff; background:#222;} .product .prod .btn a:hover {text-decoration: underline;} .gallery {width:100%;position:relative;padding-top:420px !important; display:block; margin:0 auto;} .gallery:after {content:''; clear: both; display: table;} .gallery > img {position:absolute;left:0;top:0;transition:all .5s; max-width:100%; margin:auto; right:0; max-height:410px; padding:0px;} .gallery input[name='slide_switch'] {display:none} .gallery label {margin:0; padding:0; float:left; border:1px solid #999; background:#fff; cursor:pointer; transition:all .5s; width:25%; height:100px; position:relative;} .gallery label img {display:block; width:auto; max-width:100%; position:absolute; margin:auto; padding:0; right:0; left:0; top:0; max-height:100%;} .gallery > input[name='slide_switch']:checked+label {border-color:#666;opacity:1} .gallery > input[name='slide_switch'] ~ img {opacity:0;transform:scale(1)} .gallery > input[name='slide_switch']:checked+label+img {opacity:1;transform:scale(1)} #menuuR {display: none; width: 100%; height: auto; margin: 0 auto; padding: 0; float: left;} .show-menu{display:none; font-family:"Noto Sans"; font-weight:bold; background:none; text-decoration:none; color:#666; text-align:left; padding:0 0 0 45px; position:relative; height:auto; line-height:40px; font-size:16px; text-transform:capitalize; width:auto; margin:0; border:none; float: left;} .show-menu:after { display:block; content:""; background:#666; position:absolute; height:4px; width:20px; left:15px; top:25px;} .show-menu:before { display:block; content:""; border-top:4px solid #666; position:absolute; height:11px; width:20px; left:15px; top:11px; border-bottom:4px solid #666; border-top:4px solid #666;} #show-menu[type=checkbox]{display:none} #show-menu[type=checkbox]:checked ~ #menuuR{display:block;} #menuuR ul {display: block; width: 100%; height: auto; margin: 0; position: static; padding: 0; box-shadow: none; list-style: none;} #menuuR ul li{display: block; width: 100%; height: auto; margin: 0;} #menuuR ul li a {padding: 0 45px; background: none; line-height: 35px; color: #666; font-family:"Noto Sans"; font-size:15px; font-weight:normal; text-transform:capitalize; text-decoration:none;} #menuuR ul ul {padding: 0 0 0 15px;} .spanN1 {display: inline-block; width: auto; margin: 0; padding: 0;} @media only screen and (max-width: 980px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 980px), only screen and ( -moz-min-device-pixel-ratio: 2) and (max-width: 980px), only screen and ( -o-min-device-pixel-ratio: 2/1) and (max-width: 980px), only screen and ( min-device-pixel-ratio: 2) and (max-width: 980px), only screen and ( min-resolution: 192dpi) and (max-width: 980px), only screen and ( min-resolution: 2dppx) and (max-width: 980px) { #pagebg {padding: 0 10px;} #page, #head {width: 100%;} #logo {margin: 0 0 0 15px;} #topheaderright {margin: 0 15px 0 0;} } @media screen and (max-width: 940px) { #qualitytext {font-size: 23px; line-height: 28px; padding: 16px 75px} #footerbg{padding: 10px 10px 20px 10px;} #footertopbody {padding: 0;} } @media screen and (max-width: 780px) { .gallery label {width:25%; height:100px;} #topheader {padding: 0 0 10px 0;} #menuline div a {font-size: 11px;} #menuline {margin: 0 0 25px 0;} .show-menu {display: inline-block;} #logo {margin: 0 0 20px 0; padding: 0 15px; text-align: center; width: 100%;} #logo a, #logo a img {width: 100%; max-width: 450px; text-align: center; margin: 0 auto; height: auto;} #leftside {display: none;} #centerside {width: 100%; padding: 0;} #footercat {width: 100%; padding: 0 0 15px 0;} #footercontact{width: 100%; padding: 0;} .topcatW {display:none;} } @media screen and (max-width: 580px) { .gallery label {width:33.333%;} #menuline div a{font-size: 10px;} #topcategories a {padding: 0 10px; font-size: 14px;} #qualitytext {font-size: 17px; line-height: 21px; padding: 13px 75px} .spanN1 {display: none;} #newsletterlinebody a {height: 60px; line-height: 60px;} #footercatbody ul li {width: 50%;} .product .prod {width: 50%;} } @media screen and (max-width: 380px) { .gallery label {width:50%;} .gallery {padding-top: 360px !important} .gallery > img {max-height: 350px;} .product .prod {width: 100%;} .product .prod {min-height: 0;} } #tabs { width:100%; height: auto; padding:0; margin: 0 auto; overflow:hidden; clear: both; } #tabs section { display: none; padding: 10px; position: relative; margin:0; } #tabs input { display: none; } #tabs label:hover { background: #7CB9B2; cursor: pointer; color:#fff; } #tabs .box { margin:0; padding:0; position: relative; } .tabNames { background:#F4F4F4; border-bottom:1px #ccc solid; } .tabNames label { display: inline-block; margin: 0; padding: 0 10px; font-family: "Noto Sans"; height: 30px; line-height: 30px; font-size: 15px; color: #333; float:none; display: table-cell; vertical-align:middle; position: relative; text-align: center; } #tab0 ~ .tabNames, #tab1 ~ .tabNames, #tab2 ~ .tabNames, #tab3 ~ .tabNames, #tab4 ~ .tabNames, #tab5 ~ .tabNames { display: none; } #tab0:checked ~ #content0, #tab0:checked ~ .tabNames, #tab1:checked ~ #content1, #tab1:checked ~ .tabNames, #tab2:checked ~ #content2, #tab2:checked ~ .tabNames, #tab3:checked ~ #content3, #tab3:checked ~ .tabNames, #tab4:checked ~ #content4, #tab4:checked ~ .tabNames, #tab5:checked ~ #content5, #tab5:checked ~ .tabNames { margin:0; display: table; width: 100% } #tab0:checked ~ .tabNames label[for=tab0], #tab1:checked ~ .tabNames label[for=tab1], #tab2:checked ~ .tabNames label[for=tab2], #tab3:checked ~ .tabNames label[for=tab3], #tab4:checked ~ .tabNames label[for=tab4], #tab5:checked ~ .tabNames label[for=tab5] { background:#7CB9B2; color:#fff; } @media screen and (max-width: 650px) { .tabNames {padding:0} .tabNames i:before, .tabNames i:after { -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .tabNames i { position: absolute; -webkit-transform: translate(-6px, 0); -moz-transform: translate(-6px, 0); -ms-transform: translate(-6px, 0); -o-transform: translate(-6px, 0); transform: translate(-6px, 0); margin-top:15px; right: 10px; } .tabNames i:before, .tabNames i:after { content: ''; position: absolute; background: #fff; width: 3px; height: 9px; } .tabNames i:before { -webkit-transform: translate(-2px, 0) rotate(-45deg); -moz-transform: translate(-2px, 0) rotate(-45deg); -ms-transform: translate(-2px, 0) rotate(-45deg); -o-transform: translate(-2px, 0) rotate(-45deg); transform: translate(-2px, 0) rotate(-45deg); } .tabNames i:after { -webkit-transform: translate(2px, 0) rotate(45deg); -moz-transform: translate(2px, 0) rotate(45deg); -ms-transform: translate(2px, 0) rotate(45deg); -o-transform: translate(2px, 0) rotate(45deg); transform: translate(2px, 0) rotate(45deg); } #tabs input:checked ~ .tabNames i:before { -webkit-transform: translate(2px, 0) rotate(-45deg); -moz-transform: translate(2px, 0) rotate(-45deg); -ms-transform: translate(2px, 0) rotate(-45deg); -o-transform: translate(2px, 0) rotate(-45deg); transform: translate(2px, 0) rotate(-45deg); background: #213045; } #tabs input:checked ~ .tabNames i:after { -webkit-transform: translate(-2px, 0) rotate(45deg); -moz-transform: translate(-2px, 0) rotate(45deg); -ms-transform: translate(-2px, 0) rotate(45deg); -o-transform: translate(-2px, 0) rotate(45deg); transform: translate(-2px, 0) rotate(45deg); background: #213045; } #tab0 ~ .tabNames, #tab0 ~ .tabNames label[for=tab0], #tab1 ~ .tabNames, #tab1 ~ .tabNames label[for=tab1], #tab2 ~ .tabNames, #tab2 ~ .tabNames label[for=tab2], #tab3 ~ .tabNames, #tab3 ~ .tabNames label[for=tab3], #tab4 ~ .tabNames, #tab4 ~ .tabNames label[for=tab4], #tab5 ~ .tabNames, #tab5 ~ .tabNames label[for=tab5] { display: inline-block; width: 100%; background: #BB252B; color: #fff !important; height: 40px; text-align:left; line-height: 40px; } #tabs label, #tabs label:hover { color:#fff; padding: 0 10px } #tab0 ~ .tabNames label[for=tab1], #tab0 ~ .tabNames label[for=tab2], #tab0 ~ .tabNames label[for=tab3], #tab0 ~ .tabNames label[for=tab4], #tab0 ~ .tabNames label[for=tab5], #tab1 ~ .tabNames label[for=tab0], #tab1 ~ .tabNames label[for=tab2], #tab1 ~ .tabNames label[for=tab3], #tab1 ~ .tabNames label[for=tab4], #tab1 ~ .tabNames label[for=tab5], #tab2 ~ .tabNames label[for=tab0], #tab2 ~ .tabNames label[for=tab1], #tab2 ~ .tabNames label[for=tab3], #tab2 ~ .tabNames label[for=tab4], #tab2 ~ .tabNames label[for=tab5], #tab3 ~ .tabNames label[for=tab0], #tab3 ~ .tabNames label[for=tab1], #tab3 ~ .tabNames label[for=tab2], #tab3 ~ .tabNames label[for=tab4], #tab3 ~ .tabNames label[for=tab5], #tab4 ~ .tabNames label[for=tab0], #tab4 ~ .tabNames label[for=tab1], #tab4 ~ .tabNames label[for=tab2], #tab4 ~ .tabNames label[for=tab3], #tab4 ~ .tabNames label[for=tab5], #tab5 ~ .tabNames label[for=tab0], #tab5 ~ .tabNames label[for=tab1], #tab5 ~ .tabNames label[for=tab2], #tab5 ~ .tabNames label[for=tab3], #tab5 ~ .tabNames label[for=tab4], #tab0:checked ~ .tabNames label[for=tab1], #tab0:checked ~ .tabNames label[for=tab2], #tab0:checked ~ .tabNames label[for=tab3], #tab0:checked ~ .tabNames label[for=tab4], #tab0:checked ~ .tabNames label[for=tab5], #tab1:checked ~ .tabNames label[for=tab0], #tab1:checked ~ .tabNames label[for=tab2], #tab1:checked ~ .tabNames label[for=tab3], #tab1:checked ~ .tabNames label[for=tab4], #tab1:checked ~ .tabNames label[for=tab5], #tab2:checked ~ .tabNames label[for=tab0], #tab2:checked ~ .tabNames label[for=tab1], #tab2:checked ~ .tabNames label[for=tab3], #tab2:checked ~ .tabNames label[for=tab4], #tab2:checked ~ .tabNames label[for=tab5], #tab3:checked ~ .tabNames label[for=tab0], #tab3:checked ~ .tabNames label[for=tab1], #tab3:checked ~ .tabNames label[for=tab2], #tab3:checked ~ .tabNames label[for=tab4], #tab3:checked ~ .tabNames label[for=tab5], #tab4:checked ~ .tabNames label[for=tab0], #tab4:checked ~ .tabNames label[for=tab1], #tab4:checked ~ .tabNames label[for=tab2], #tab4:checked ~ .tabNames label[for=tab3], #tab4:checked ~ .tabNames label[for=tab5], #tab5:checked ~ .tabNames label[for=tab0], #tab5:checked ~ .tabNames label[for=tab1], #tab5:checked ~ .tabNames label[for=tab2], #tab5:checked ~ .tabNames label[for=tab3], #tab5:checked ~ .tabNames label[for=tab4]{ display: none } #tab0:checked ~ section, #tab1:checked ~ section, #tab2:checked ~ section, #tab3:checked ~ section, #tab4:checked ~ section, #tab5:checked ~ section { } #tabs section, .tabNames label { padding:10px 0; } }