/* DOCUMENT INFORMATION - Document: Ambius - Responsive layout - Version: 1.0 - Client: ambius.co.uk - Author: Hasan Zaryab Khan */ /******** Desktops and Laptops **************/ @media only screen and (max-device-width : 1200px) { } /*============================================================ ==============================================================*/ /*************** Ipad - Landscape *************/ @media screen and (max-width : 1024px) { } /*************** Ipad - Landscape - Device *************/ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) { } /*============================================================ ==============================================================*/ /************** Ipad - Portrait ****************/ @media screen and (max-width: 767px){ } /************** Ipad - Portrait Device****************/ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) { } /*============================================================ ==============================================================*/ /********* Smartphones - Landscape *****/ @media only screen and (max-width: 640px) { /* -------------------------------- Global declaration ---------------------------------*/ /* Grey Top Header */ div.site-wrapper #site-header{width:100%;height: auto;display: inline-block;position:fixed; background-color: #1b1b1b; background-image: -moz-linear-gradient(left, #455560, #111); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#455560), to(#111)); background-image: -webkit-linear-gradient(left, #455560, #111); background-image: -o-linear-gradient(left, #455560, #111); background-image: linear-gradient(to bottom, #455560, #111); background-repeat: repeat-x; border-color: #252525; z-index: 100; } #site-header #mast{width:100%;margin:0px;padding:0px} /* Sticky Header */ div.site-wrapper #head-banner, #home-wrapper,#pri-cont{position:relative; top:80px;} div.site-wrapper #business-section{position:relative; top:60px;} div.site-wrapper #home-wrapper #business-section{position:relative; top:0px;} #base-section{position:relative; top:0px;background-color: #1b1b1b;} /* Logo replacement */ #site-header #logo{ width: 63%;float: right;margin-bottom: 0%;margin-right: 0%;} #site-header #logo a{width: 100%;margin: 0;display: block;} #site-header #logo a img{ width: 124px;margin: 10px 0 10px 10px;height: auto;float: right;} .logo-image {content:url("https://cdn.rentokil.com/assets/global/images/ambius-mobile-main-logo.png");} /* Main Navigation */ ul#pri-nav {width: 94%;height: 100%;display: none;position: relative;margin: 0 3%;padding: 0px;background: none;border-radius: 0 0 5px 5px;border-color: #fff;border: none;box-shadow: none; -moz-box-shadow: none;-webkit-box-shadow: none;} ul#pri-nav li{width: 100%;float: none;margin: 0px;display: inline-block;text-align: left;padding: 4px 0;border-bottom: 1px solid #fff;border-top: 0px;border-left: 0px;border-right: 0px; height: auto;} ul#pri-nav li ul{display:none;} ul#pri-nav li:hover{padding: 4px 0px; border-bottom: 1px solid #fff;border-top:0px;border-left: 0px;border-right:0px; border-radius:0px; background:none; text-decoration:none;} ul#pri-nav li:first-child:hover{border-radius:0px;} ul#pri-nav li a{padding: 10px 0px;color: #fff;font-size: 16px;} ul#pri-nav li.active a{background:transparent;} ul#pri-nav li a:hover{padding: 10px 0px; text-decoration:none;text-shadow: 1px 1px 1px #FFFFFF;background:transparent;} ul#pri-nav li div{display:none; width:100%;} /* Sidebar navigation */ ::-webkit-scrollbar {width: 12px;} ::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 15px rgba(205,205,205,0.5);border-radius: 10px;} ::-webkit-scrollbar-thumb {border-radius: 10px;-webkit-box-shadow: inset 5px 0px 10px rgba(205,205,205,1);} div#sec-nav{display:none; width:99%;margin: 0 0 10px 0;height:320px;overflow-y: scroll;overflow-x: hidden;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px;} div#sec-nav ul.left-nav{display:block; width:100%;margin:0%;} div#sec-nav ul.left-nav li{line-height:36px;border-top: 1px solid #ccc;width:100%} div#sec-nav ul.left-nav li.on a, div#sec-nav ul.left-nav li.on a:visited{width: 94%!important;margin: 0px;padding: 0px 3%;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px; background-color:#f1f1f1; border-bottom: 0px;background-image: none;color:#528929 !important; font-weight:bold;font-size: 14px;} div#sec-nav ul.left-nav li.on a:hover{width: 94%;margin: 0px;padding: 0px 3%;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px;background-color: #f1f1f1;border-bottom: 0px; background-image: none; text-decoration:underline;color:#528929 !important;} div#sec-nav ul.left-nav li a, div#sec-nav ul.left-nav li a:visited{width: 94%; margin: 0px;padding: 0px 3%;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px; color: #fff!important;background-color: transparent; background-position: 310px center !important;border-bottom: 0px;background-image:none;} div#sec-nav ul.left-nav li a:hover{width: 94%; margin: 0px;padding: 0px 3%;background-color: #f1f1f1; color:#528929!important; background-image:none;border-bottom: 0px; text-decoration:underline;} div#sec-nav ul.left-nav li.opendown a, div#sec-nav ul.left-nav li.opendown a:visited{width: 94%; margin: 0px;padding: 0px 3%;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px; color: #fff!important;background-color: transparent; background-position: 310px center !important;border-bottom: 0px;background-image:none;font-size: 14px;} div#sec-nav ul.left-nav li.opendown a:hover{width: 94%; margin: 0px;padding: 0px 3%;background-color: #f1f1f1; color:#528929!important; background-image:none;border-bottom: 0px; text-decoration:underline;font-size: 14px;} div#sec-nav ul.left-nav li ul{width: 100%; margin: 0px; padding: 0px; border-bottom:none;} div#sec-nav ul.left-nav li.on ul{width: 100%; margin: 0px; padding: 0px; border-bottom:none;} div#sec-nav ul.left-nav li ul li {width: 100%;margin: 0px;padding: 0px;background:none !important;} div#sec-nav ul.left-nav li.on ul li a, div#sec-nav ul.left-nav li.on ul li a:visited{width: 87%!important;padding: 5px 18px 5px 25px;font-size: 12px;color:#fff!important; background-color:transparent !important; background-image:none;} div#sec-nav ul.left-nav li.on ul li a:hover{width: 87%; padding: 5px 18px 5px 25px; background-position: 310px center !important; text-decoration:underline;background-color: #f1f1f1! important; color:#528929!important; background-image:none;} div#sec-nav ul.left-nav li.opendown ul li.on a, div#sec-nav ul.left-nav li.opendown ul li.on a:visited{width: 87%!important;padding: 5px 18px 5px 25px;font-size: 12px;color:#528929!important; background-color:#f1f1f1 !important; background-image:none;font-weight:bold;} div#sec-nav ul.left-nav li.opendown ul li.on a:hover{width: 87%; padding: 5px 18px 5px 25px; background-position: 310px center !important; text-decoration:underline;background-color: #f1f1f1! important; color:#528929!important; background-image:none;} div#sec-nav ul.left-nav li.opendown ul li a, div#sec-nav ul.left-nav li.opendown ul li a:visited{width: 87%!important;padding: 5px 18px 5px 25px;font-size: 12px;color:#fff!important; background-color:transparent; background-image:none;font-weight:bold;} div#sec-nav ul.left-nav li.opendown ul li a:hover{width: 87%; padding: 5px 18px 5px 25px; background-position: 310px center !important; text-decoration:underline;background-color: #f1f1f1! important; color:#528929!important; background-image:none;font-size: 12px;} /* Nav Burger Icon */ * {margin: 0; padding: 0; } #nav-icon {display:block !important;} #nav-icon{width: 35px;height: 30px;position: relative;margin: 27px 15px 10px 15px;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg); transform: rotate(0deg);-webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out;cursor: pointer;float: left;} #nav-icon span{display: block;position: absolute;height: 5px;width: 100%;background: #ffffff;border-radius: 9px;opacity: 1;left: 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg); -o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out; } #nav-icon span:nth-child(1) {top: 0px;} #nav-icon span:nth-child(2),#nav-icon span:nth-child(3) {top: 10px;} #nav-icon span:nth-child(4) {top: 20px;} #nav-icon.open span:nth-child(1) { top: 18px; width: 0%; left: 50%;} #nav-icon.open span:nth-child(2) {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);} #nav-icon.open span:nth-child(3) {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg); } #nav-icon.open span:nth-child(4) {top: 18px;width: 0%;left: 50%;} /* Search Icon */ #search-icon{display:block !important;} #search-icon{width: 30px;height: 30px;position: relative;cursor: pointer;float: right;display: block;margin:25px 30px 18px 0px;} #search-icon span{display: inline-block;position: absolute;height: 100%;width: 100%;} #search-icon span img{width: 100%;margin: 0px;padding: 0px;} #site-header #search-box{display:none;} #site-header #search-box {width: 94%;float: left;position: relative;margin-top: 0;padding: 3%;margin-bottom: 5px;text-align:left;} #site-header #search-box form{width: 100%; margin: 0px;padding: 0px;display: inline-block;} #site-header #search-box input.search-query{ width: 68%;float:left;margin:0px;padding: 7px 14px;} #site-header #search-box input.search-query:focus{ border-color:#8bbf42;} #site-header #search-box #ssubmit{width: 22%; float:left;margin:0px;padding: 7px 10px;} /* Back Button */ #site-header span.back-arrow{width: 30px;height: 30px;position: relative;cursor: pointer;float: right;display: block;margin: 6px 15px 10px 10px;} #site-header span.back-arrow img{margin:0px;} /* Business Footer */ #home-wrapper #business-section{display: inline-block;width: 100%; margin: 7% 0 20% 0; padding: 0px;} #home-wrapper #business-section .base-cta{ padding:0px 0 10% 0; width: 100%;float: left;margin: 0px;} #home-wrapper #business-section .base-cta h2{color: #495c66;width: 100%;margin:0px;padding:0px;display:inline-block;} #home-wrapper #business-section .base-cta h2 a{ padding: 0px;width: 100%;float: left;margin: 0px;} #home-wrapper #business-section .base-cta a{ padding: 0px;width: 100%;float: left;margin: 0px;} .green, .pink, .blue {width:100%;} .green p, .pink p, .blue p { background-size: 320px;padding: 20px 20px 12px 20px; } /* Service Footer */ #service-footer #portfolio{width: 97%;display: block; overflow: hidden;} #service-footer #portfolio h3{padding: 0 5%;display: block;} #service-footer #portfolio #prevNext{width: 100%;} #service-footer #portfolio #prevNext span.upchink{width: 100%;} #service-footer #portfolio #prevNext img.filterGalleryPrev{width: 5%;} #service-footer #portfolio div#prevNext img.filterGalleryPrev:hover {background: transparent url(http://cdn.rentokil.com/assets/global/images/arrow-l.png) no-repeat left -5px;} #service-footer #portfolio #prevNext img.filterGalleryNext {width: 5%;left: 84%;} #service-footer #portfolio #prevNext img.filterGalleryNext:hover { background: transparent url(http://cdn.rentokil.com/assets/global/images/arrow-r.png) no-repeat -6px -5px;} #service-footer #portfolio #gallery_items_container{width: 100%;} /* Main Footer */ #base-section{float: left;width: 100%;padding: 15px 0 15px 0;margin: 0px;} #site-footer{width: 94%;margin: 0 3%; padding:0px; height: auto;} #site-footer .footer-block-ext,#site-footer .footer-block, #site-footer .footer-block-social-media{ width: 100%;padding: 0;height: auto;float: left;margin: 0px;display: inline-block;} #site-footer .footer-block{width:100%; margin-bottom:3%;} #site-footer .footer-block ul{ margin: 0px;padding:0px;} #site-footer .footer-block-ext h3{ margin: 10px 0; text-align: left;} #site-footer .footer-block-ext img {display: block;margin: 0 auto;margin-top: 10px;width:auto;} #site-footer .footer-block-social-media { width: 100%;float: left;margin: 10px 0; border-bottom: 1px solid #1D2327;box-shadow: 0 1px 0 0 #35434D;} #site-footer .footer-block-social-media .social-media { width: 100%;float: left;margin:0px;} #site-footer .footer-block-social-media .social-media p{padding:0px; margin:0px;} #site-footer .site-selection{width: 100%;float: none;display: inline-block;margin: 3% 0;padding: 0px;} #site-footer .site-selection p{line-height:21px;} #site-footer-lower{width: 94%;margin: 0 3%; padding:0px;display: inline-block;} #site-footer-lower .extra-links{display:block; width:100%;} #site-footer-lower .our-partners{padding:10px 0 0 0;} /* -------------------------------- Homepage ---------------------------------*/ body{margin: 0px; background-image:none;} div.site-wrapper{width: 100%; padding: 0px;} /* Homepage carousel*/ #head-banner{display:none; width:94%; margin:3%;} #head-banner .carousel{display: block;width: 100%;margin: 0%;height: 210px;} #head-banner .carousel .carousel-inner{height: 210px;} #head-banner .carousel .carousel-control{top: 20%;background-size: 15px;} #head-banner .carousel img{display:block; width:100%; height:100%; margin:0%;} #head-banner .carousel .container{display:block; width:100%; margin:0%;height: 210px;} #head-banner .carousel .container .carousel-caption{display:block; width:100%; margin:0%;height: 50px;position: relative;top: 160px;} #head-banner .carousel .container .carousel-caption h2{ font-size: 18px;margin-left: 15px;padding: 10px 0 0 0;} #head-banner .carousel .container .carousel-caption p{display: none;} #head-banner .carousel .container .carousel-caption .more{bottom: 25px;font-weight: bold;} #head-banner .carousel .container .carousel-caption .more p{display:block;font-size: 12px;} div.site-wrapper #home-wrapper{ padding: 0px 0 15px 0px;margin: 0 10px;width: 94%;display: inline-block;} div.site-wrapper #home-wrapper #home-intro{width: 100%;margin-bottom: 5%;padding: 0px;} div.site-wrapper #home-wrapper #home-intro h1{width: 100%; display:inline-block;line-height: 34px;} div.site-wrapper #home-wrapper #home-intro p {width: 100%; display:inline-block;line-height: 24px;} /* homepage contact box */ div.site-wrapper #home-wrapper #home-intro div .contact-box {width:88%;float:none;position:relative;top:0px;left:0px;margin:3%;padding:3%;height: auto;display: block; border: none; box-shadow: none;} div.site-wrapper #home-wrapper #home-intro div .contact-box .shadow {padding: 0px;box-shadow:none;-webkit-box-shadow:none;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-phone {background: url(http://cdn.rentokil.com/assets/global/images/tel.png) no-repeat 3px 7px;font-size: 30px;height: auto;padding: 6px 10px 10px 45px;margin: 5px 0; color: #fff;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email {background: url(http://cdn.rentokil.com/assets/global/images/email.png) no-repeat 3px 12px;font-size: 26px;height: auto;color: #ffffff;padding: 8px 10px 0px 45px; margin:5px 0;overflow: hidden;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email a{color:#ffffff;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email a:hover{text-decoration:underline;color:#ffffff;} #home-intro .glyphicon{width:94%; margin:3%; padding:0px;} .glyphicon-ok:before{padding-right:10px;} #site-header #lang_menu{display:none;} /* Service area */ #home-int-ext-area{display: inline-block; width: 100%; margin-top:7%;} #home-int-ext-area .service-area{margin:0 0 10% 0; width: 85%; position: relative;left: 2%;padding: 5%;border: 1px solid #5c9231; border-radius: 5px; -webkit-border-radius: 5px;-moz-border-radius: 5px;box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); -webkit-box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); -moz-box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); } #home-int-ext-area .middle{margin:0 0 10% 0; width: 85%; position: relative;left: 2%;padding: 5%;border: 1px solid #5c9231; border-radius: 5px; -webkit-border-radius: 5px;-moz-border-radius: 5px;box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); -webkit-box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); -moz-box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); } #home-int-ext-area .service-area img{width:100%} #home-int-ext-area .service-area ul li{left:4%;} #home-int-ext-area .service-area ul li a{width:95%; font-size:15px;} /* -------------------------------- Landing page ---------------------------------*/ div.site-wrapper #myCarousel{display:none;} /* Body content */ div.site-wrapper #pri-cont{width:94%; margin:3%;padding:0px;display:inline-block;} div#pri-cont div#content-wrapper{width:100%; margin:3% 0%; padding:0px;float:none;} div#pri-cont div#content-wrapper #main{width:100%;display:block;} div#pri-cont div#content-wrapper #main.standard div#descr{width:100%;display:inline-block; margin: 3% 0%; padding:0px;} div#pri-cont div#content-wrapper #main.standard div#cta{width:100%; display:inline-block;margin: 3% 0%; padding:0px;} div#pri-cont div#content-wrapper #main.standard div#cta div{width:99%; display:block;margin: 3% 0%; padding:0px;} div.site-wrapper table{width:100% !important;} div.site-wrapper table tr{width:85% !important;} div.site-wrapper table tr td {width:85% !important;} div.site-wrapper table tr td ul{width:90% !important; padding:5%;} div.site-wrapper table tr td ul li{ width: 100% !important;left: 0px;} div.site-wrapper table tr td.gsc-table-cell-snippet-close {width:85% !important;} /* Contact Us page */ #sitecontent form.large{width: 91% !important; display: inline-block; padding: 4%; margin: 0px;} #sitecontent form.large fieldset{width: 100%;} #sitecontent form.large fieldset div{width: 100%;margin: 10px 0;padding: 0px;} #sitecontent form.large label{width:94%!important;float:left; margin:0px 0px 5px 0px;} #sitecontent form.large select{width:94%!important;float:left;margin:0px 0px 5px 0px;} #sitecontent form.large input{width:94%!important;float:left;margin:0px 0px 5px 0px;} #sitecontent form.large fieldset div.check_additional input{margin: 3px 10px 0 10px;} #sitecontent form.large textarea{width:97%!important;float:left;margin:0px 0px 5px 0px;} #sitecontent form.large div{width:100%} #sitecontent form.large div div.button{width:100% !important;} #sitecontent form.large div button#mcsubmit{width:100% !important; float:none;} #sitecontent form.large .error {color: #f00;display: block;position: relative; top: 10px;} /* Left CTA */ div#pri-cont img.l-cta-image{display: block;width: auto;margin: 0 auto;padding: 0px;} div#pri-cont div.nav-cta-block{display: block;width: 100%; margin: 0px; padding: 0px;} div#pri-cont div.nav-cta-block div.nav-cta-block{display: block;width: 93%!important; margin: 0px; padding: 0px;} div#pri-cont div.nav-cta-block div.nav-cta-block center{width:100%; padding: 0%; margin: 0px auto; height: auto;} div#pri-cont div.nav-cta-block div.nav-cta-block center a img{width: 88%; padding: 0%; margin: 0px; height: auto;} div#pri-cont div div.cta-left{float:none;width:99%;display:inline-block;} /* Right CTA */ div#pri-cont #cta{display: inline-block;width: 100%;margin-top: 5%;} div#pri-cont #cta .cta2{display: inline-block;width: 99%;margin-top: 5%;} div#pri-cont #cta .cta2 img.r-cta-image{ display: none;width: auto;display: inline-block;margin: 10px;} /* Bottom CTA*/ div#pri-cont #gray-box-area{display: block; width: 100%; margin: 0px; float: left;} div#pri-cont #gray-box-area div{display: block; width: 100%; margin: 0px; padding:0px;} div#pri-cont #gray-box-area div.cat-4up{width: 42%; float: left;display: block;margin: 3%;padding: 3% 0%;max-height: 190px;} div#pri-cont #gray-box-area div.cat-4up a img{width: 90%;margin: 0px;padding: 5%;height: 100%;} /* Business Footer */ div.site-wrapper #business-section{display: inline-block;width: 94%; margin: 0% 3% 20% 3%; padding: 0px;} div.site-wrapper #business-section .base-cta{ padding:0px 0 10% 0; width: 100%;float: left;margin: 0px;} div.site-wrapper #business-section .base-cta h2{color: #495c66;width: 100%;margin:0px;padding:0px;display:inline-block;} div.site-wrapper #business-section .base-cta h2 a{ padding: 0px;width: 100%;float: left;margin: 0px;} div.site-wrapper #business-section .base-cta a{ padding: 0px;width: 100%;float: left;margin: 0px;} .green, .pink, .blue {width:100%;} .green p, .pink p, .blue p { background-size: 320px;padding: 20px 20px 12px 20px; } /* -------------------------------- Detail Page ---------------------------------*/ #section-banner{display:none;height: auto;margin: 0 10px; width: 94%;} /* Replace cta box with section box */ #pri-cont .call-out {display: block;width: 88%; height: auto;float: none;border-radius: 6px;margin: 3%;padding: 3%;} #pri-cont .call-out .shadow {padding: 0px;box-shadow:none;-webkit-box-shadow:none;} #pri-cont .call-out .hm-phone {background: url(http://cdn.rentokil.com/assets/global/images/tel.png) no-repeat 3px 0;font-size: 30px;height: auto;padding: 2px 10px 10px 45px;margin: 0px 0 10px 0px;color: #fff;} #pri-cont .call-out .hm-email {background: url(http://cdn.rentokil.com/assets/global/images/email.png) no-repeat 3px 8px;font-size: 26px;height: auto;color: #ffffff;padding: 5px 10px 0px 45px;margin: 10px 0 10px 0px;overflow:hidden;} #pri-cont .call-out .hm-email a{color:#ffffff;} #pri-cont .call-out .hm-email a:hover{text-decoration:underline;color:#ffffff;} #pri-cont p.inner-image a, #pri-cont p.inner-image img, #pri-cont p.inner-image a img, #home-intro img{width:100%;} .flash{width:330px;} .flash embed{width:320px; height:220px;} #descr iframe{width: 100%;height: 220px;} #descr #player .ytp-thumbnail{width: 100%;height: 220px;background-size:230px;} #pri-cont #main #descr img.style2{width: 33.33%;margin: 0px;padding: 0px 10px 10px 10px;} /* Right CTA Quick form */ #pri-cont #cta .qifcontainer{width: 99%;float: left;} #pri-cont #cta .qifcontainer form#hqf{width: 100%;display:block;} #pri-cont #cta .qifcontainer form#hqf fieldset{width: 100%;display:block;} #pri-cont #cta .qifcontainer form#hqf fieldset div{display:block;margin-bottom:15px;} #hqf label{display:block; margin: 0 10px; width:93%;} #hqf input{display:block; margin: 0 10px; width:89%;} #hqf input:focus{ border-color:#8bbf42;} #hqf textarea{width: 93%;display:block;} form .button .btn{line-height: 28px; font-size: 20px;} /*Tabtable layout*/ .tabbable{width:100%;display: inline-block;} ul.nav.nav-tabs{width:33.33%;} .tabs-left > .nav-tabs > li.active{width:99% !important;} .tabs-left > .nav-tabs > li{width:91% !important; box-shadow:none;margin: 0 0 15px 0px !important;} .tabs-left > .nav-tabs > li > a{font-size: 14px;padding: 25px 15px;} .tabs-left > .nav-tabs > li > a > img{display:none; position: relative;left: 0;top: 0;width: 50px!important;height:50px;margin: 10px auto 0px auto!important;} #tab-content .tab-pane table{margin:0px 0px 15px 5px;} .tab-content .six-pane{height:1060px;} #tab-content .tab-pane p img{float: none;padding: 10px 10px;width:50%;display: block;margin: 0 auto;} } /********* Smartphones - Landscape Device *****/ @media only screen and (min-device-width: 481px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) { /* Logo replacement */ #site-header #logo{ width: 63%;float: right;/*background: white;*/margin-bottom: 0%;margin-right: 0%;} #site-header #logo a{width: 100%;margin: 0;display: block;} #site-header #logo a img{ width: 124px;margin: 10px 0 10px 10px;height: auto;float: right;} .logo-image {content:url("http://cdn.rentokil.com/assets/global/images/ambius-mobile-main-logo.png");} /* homepage contact box */ div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-phone {background: url(http://cdn.rentokil.com/assets/global/images/tel.png) no-repeat 3px 7px;font-size: 34px;height: auto;padding: 6px 10px 10px 45px;margin: 5px 0; color: #fff;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email {background: url(http://cdn.rentokil.com/assets/global/images/email.png) no-repeat 3px 12px;font-size: 28px;height: auto;color: #ffffff;padding: 8px 10px 0px 45px; margin:5px 0;overflow: hidden;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email a{color:#ffffff;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email a:hover{text-decoration:underline;color:#ffffff;} #home-intro .glyphicon{width:94%; margin:3%; padding:0px;} .glyphicon-ok:before{padding-right:10px;} /* Business Footer */ .green, .pink, .blue {width:100%;} .green p, .pink p, .blue p {padding: 20px; background-size: 334px;font-size:16px;line-height: 22px;} } /*==========================================================================================================================*/ /********* Smartphones - Portrait *****/ @media only screen and (max-width: 479px) { /* -------------------------------- Global declaration ---------------------------------*/ /* Grey Top Header */ div.site-wrapper #site-header{width:100%;height: auto;display: inline-block;position:fixed; background-color: #1b1b1b; background-image: -moz-linear-gradient(left, #455560, #111); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#455560), to(#111)); background-image: -webkit-linear-gradient(left, #455560, #111); background-image: -o-linear-gradient(left, #455560, #111); background-image: linear-gradient(to bottom, #455560, #111); background-repeat: repeat-x; border-color: #252525; z-index: 100; } #site-header #mast{width:100%;margin:0px;padding:0px} /* Sticky Header */ div.site-wrapper #head-banner, #home-wrapper,#pri-cont{position:relative; top:80px;} div.site-wrapper #business-section{position:relative; top:60px;} div.site-wrapper #home-wrapper #business-section{position:relative; top:0px;} #base-section{position:relative; top:0px;background-color: #1b1b1b;} /* Logo replacement */ #site-header #logo{ width: 63%;float: right;margin-bottom: 0%;margin-right: 0%;} #site-header #logo a{width: 100%;margin: 0;display: block;} #site-header #logo a img{ width: 124px;margin: 10px 0 10px 10px;height: auto;float: right;} .logo-image {content:url("http://cdn.rentokil.com/assets/global/images/ambius-mobile-main-logo.png");} /* Main Navigation */ ul#pri-nav {width: 94%;height: 100%;display: none;position: relative;margin: 0 3%;padding: 0px;background: none;border-radius: 0 0 5px 5px;border-color: #fff;border: none;box-shadow: none; -moz-box-shadow: none;-webkit-box-shadow: none;} ul#pri-nav li{width: 100%;float: none;margin: 0px;display: inline-block;text-align: left;padding: 4px 0;border-bottom: 1px solid #fff;border-top: 0px;border-left: 0px;border-right: 0px; height: auto;} ul#pri-nav li ul{display:none;} ul#pri-nav li:hover{padding: 4px 0px; border-bottom: 1px solid #fff;border-top:0px;border-left: 0px;border-right:0px; border-radius:0px; background:none; text-decoration:none;} ul#pri-nav li:first-child:hover{border-radius:0px;} ul#pri-nav li a{padding: 10px 0px;color: #fff;font-size: 16px;} ul#pri-nav li.active a{background:transparent;} ul#pri-nav li a:hover{padding: 10px 0px; text-decoration:none;text-shadow: 1px 1px 1px #FFFFFF;background:transparent;} ul#pri-nav li div{display:none; width:100%;} /* Sidebar navigation */ ::-webkit-scrollbar {width: 12px;} ::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 15px rgba(205,205,205,0.5);border-radius: 10px;} ::-webkit-scrollbar-thumb {border-radius: 10px;-webkit-box-shadow: inset 5px 0px 10px rgba(205,205,205,1);} div#sec-nav{display:none; width:99%;margin: 0 0 10px 0;height:320px;overflow-y: scroll;overflow-x: hidden;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px;} div#sec-nav ul.left-nav{display:block; width:100%;margin:0%;} div#sec-nav ul.left-nav li{line-height:40px;border-top: 1px solid #ccc;width:100%} div#sec-nav ul.left-nav li.on a, div#sec-nav ul.left-nav li.on a:visited{width: 94%!important;margin: 0px;padding: 0px 3%;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px; background-color:#f1f1f1; border-bottom: 0px;background-image: none;color:#528929 !important; font-weight:bold;font-size: 14px;} div#sec-nav ul.left-nav li.on a:hover{width: 94%;margin: 0px;padding: 0px 3%;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px;background-color: #f1f1f1;border-bottom: 0px; background-image: none; text-decoration:underline;color:#528929 !important;} div#sec-nav ul.left-nav li a, div#sec-nav ul.left-nav li a:visited{width: 94%; margin: 0px;padding: 0px 3%;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px; color: #fff!important;background-color: transparent; background-position: 310px center !important;border-bottom: 0px;background-image:none;} div#sec-nav ul.left-nav li a:hover{width: 94%; margin: 0px;padding: 0px 3%;background-color: #f1f1f1; color:#528929!important; background-image:none;border-bottom: 0px; text-decoration:underline;} div#sec-nav ul.left-nav li.opendown a, div#sec-nav ul.left-nav li.opendown a:visited{width: 94%; margin: 0px;padding: 0px 3%;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px; color: #fff!important;background-color: transparent; background-position: 310px center !important;border-bottom: 0px;background-image:none;font-size: 14px;} div#sec-nav ul.left-nav li.opendown a:hover{width: 94%; margin: 0px;padding: 0px 3%;background-color: #f1f1f1; color:#528929!important; background-image:none;border-bottom: 0px; text-decoration:underline;font-size: 14px;} div#sec-nav ul.left-nav li ul{width: 100%; margin: 0px; padding: 0px; border-bottom:none;} div#sec-nav ul.left-nav li.on ul{width: 100%; margin: 0px; padding: 0px; border-bottom:none;} div#sec-nav ul.left-nav li ul li {width: 100%;margin: 0px;padding: 0px;background:none !important;} div#sec-nav ul.left-nav li.on ul li a, div#sec-nav ul.left-nav li.on ul li a:visited{width: 87%!important;padding: 0px 18px 0px 25px;font-size: 12px;color:#fff!important; background-color:transparent !important; background-image:none;} div#sec-nav ul.left-nav li.on ul li a:hover{width: 87%; padding: 0px 18px 0px 25px; background-position: 310px center !important; text-decoration:underline;background-color: #f1f1f1! important; color:#528929!important; background-image:none;} div#sec-nav ul.left-nav li.opendown ul li.on a, div#sec-nav ul.left-nav li.opendown ul li.on a:visited{width: 87%!important;padding: 0px 18px 0px 25px;font-size: 12px;color:#528929!important; background-color:#f1f1f1 !important; background-image:none;font-weight:bold;} div#sec-nav ul.left-nav li.opendown ul li.on a:hover{width: 87%; padding: 0px 18px 0px 25px; background-position: 310px center !important; text-decoration:underline;background-color: #f1f1f1! important; color:#528929!important; background-image:none;} div#sec-nav ul.left-nav li.opendown ul li a, div#sec-nav ul.left-nav li.opendown ul li a:visited{width: 87%!important;padding: 0px 18px 0px 25px;font-size: 12px;color:#fff!important; background-color:transparent; background-image:none;font-weight:bold;} div#sec-nav ul.left-nav li.opendown ul li a:hover{width: 87%; padding: 0px 18px 0px 25px; background-position: 310px center !important; text-decoration:underline;background-color: #f1f1f1! important; color:#528929!important; background-image:none;font-size: 12px;} div#sub-nav{display:none; width:99%;margin: 0 0 10px 0;border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px;} div#sec-nav #sub-nav h3{ padding: 10px 0px 15px 5px;} div#sec-nav #sub-nav h3 a{color: #fff !important;font-weight: bold;padding: 0px 3%;} div#sub-nav ul.left-nav{display:block; width:100%;margin:0%;} div#sub-nav ul.left-nav li{line-height:40px;border-top: 1px solid #ccc;width:100%} /* Nav Burger Icon */ * {margin: 0; padding: 0; } #nav-icon {display:block !important;} #nav-icon{width: 35px;height: 30px;position: relative;margin: 27px 15px 10px 15px;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg); transform: rotate(0deg);-webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out;cursor: pointer;float: left;} #nav-icon span{display: block;position: absolute;height: 5px;width: 100%;background: #ffffff;border-radius: 9px;opacity: 1;left: 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg); -o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out; } #nav-icon span:nth-child(1) {top: 0px;} #nav-icon span:nth-child(2),#nav-icon span:nth-child(3) {top: 10px;} #nav-icon span:nth-child(4) {top: 20px;} #nav-icon.open span:nth-child(1) { top: 18px; width: 0%; left: 50%;} #nav-icon.open span:nth-child(2) {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);} #nav-icon.open span:nth-child(3) {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg); } #nav-icon.open span:nth-child(4) {top: 18px;width: 0%;left: 50%;} /* Search Icon */ #search-icon{display:block !important;} #search-icon{width: 30px;height: 30px;position: relative;cursor: pointer;float: right;display: block;margin:25px 15px 18px 0px;} #search-icon span{display: inline-block;position: absolute;height: 100%;width: 100%;} #search-icon span img{width: 100%;margin: 0px;padding: 0px;} #site-header #search-box{display:none;} #site-header #search-box {width: 94%;float: left;position: relative;margin-top: 0;padding: 3%;margin-bottom: 5px;text-align:left;} #site-header #search-box form{width: 100%; margin: 0px;padding: 0px;display: inline-block;} #site-header #search-box input.search-query{ width: 68%;float:left;margin:0px;padding: 7px 14px;} #site-header #search-box input.search-query:focus{ border-color:#8bbf42;} #site-header #search-box #ssubmit{width: 22%; float:left;margin:0px;padding: 7px 10px;} /* Back Button */ #site-header span.back-arrow{width: 30px;height: 30px;position: relative;cursor: pointer;float: right;display: block;margin: 6px 15px 10px 10px;} #site-header span.back-arrow img{margin:0px;} /* Business Footer */ #home-wrapper #business-section{display: inline-block;width: 100%; margin: 7% 0 20% 0; padding: 0px;} #home-wrapper #business-section .base-cta{ padding:0px 0 10% 0; width: 100%;float: left;margin: 0px;} #home-wrapper #business-section .base-cta h2{color: #495c66;width: 100%;margin:0px;padding:0px;display:inline-block;} #home-wrapper #business-section .base-cta h2 a{ padding: 0px;width: 100%;float: left;margin: 0px;} #home-wrapper #business-section .base-cta a{ padding: 0px;width: 100%;float: left;margin: 0px;} .green, .pink, .blue {width:100%;} .green p, .pink p, .blue p { background-size: 320px;padding: 20px 20px 12px 20px; } /* Service Footer */ #service-footer #portfolio{width: 97%;display: block; overflow: hidden;} #service-footer #portfolio h3{padding: 0 5%;display: block;} #service-footer #portfolio #prevNext{width: 100%;} #service-footer #portfolio #prevNext span.upchink{width: 100%;} #service-footer #portfolio #prevNext img.filterGalleryPrev{width: 5%;} #service-footer #portfolio div#prevNext img.filterGalleryPrev:hover {background: transparent url(http://cdn.rentokil.com/assets/global/images/arrow-l.png) no-repeat left -5px;} #service-footer #portfolio #prevNext img.filterGalleryNext {width: 5%;left: 84%;} #service-footer #portfolio #prevNext img.filterGalleryNext:hover { background: transparent url(http://cdn.rentokil.com/assets/global/images/arrow-r.png) no-repeat -6px -5px;} #service-footer #portfolio #gallery_items_container{width: 100%;} /* Main Footer */ #base-section{float: left;width: 100%;padding: 15px 0 15px 0;margin: 0px;} #site-footer{width: 94%;margin: 0 3%; padding:0px; height: auto;} #site-footer .footer-block-ext,#site-footer .footer-block, #site-footer .footer-block-social-media{ width: 100%;padding: 0;height: auto;float: left;margin: 0px;display: inline-block;} #site-footer .footer-block{width:100%; margin-bottom:3%;} #site-footer .footer-block ul{ margin: 0px;padding:0px;} #site-footer .footer-block-ext h3{ margin: 10px 0; text-align: left;} #site-footer .footer-block-ext img {display: block;margin: 0 auto;margin-top: 10px;width:auto;} #site-footer .footer-block-social-media { width: 100%;float: left;margin: 10px 0; border-bottom: 1px solid #1D2327;box-shadow: 0 1px 0 0 #35434D;} #site-footer .footer-block-social-media .social-media { width: 100%;float: left;margin:0px;} #site-footer .footer-block-social-media .social-media p{padding:0px; margin:0px;} #site-footer .site-selection{width: 100%;float: none;display: inline-block;margin: 3% 0;padding: 0px;} #site-footer .site-selection p{line-height:21px;} #site-footer-lower{width: 94%;margin: 0 3%; padding:0px;display: inline-block;} #site-footer-lower .extra-links{display:block; width:100%;} #site-footer-lower .our-partners{padding:10px 0 0 0;} /* -------------------------------- Homepage ---------------------------------*/ body{margin: 0px; background-image:none;} div.site-wrapper{width: 100%; padding: 0px;} #site-header #mast-site-select{display:none;} div.site-wrapper #home-wrapper .prod-home{width:100%;} div.site-wrapper #home-wrapper .prod-home .contact-box{width:99%; margin:20px auto 0 auto;} /* Homepage carousel*/ #head-banner{display:none; width:94%; margin:3%;} #head-banner .carousel{display: block;width: 100%;margin: 0%;height: 210px;} #head-banner .carousel .carousel-inner{height: 210px;} #head-banner .carousel .carousel-control{top: 20%;background-size: 15px;} #head-banner .carousel img{display:block; width:100%; height:100%; margin:0%;} #head-banner .carousel .container{display:block; width:100%; margin:0%;height: 210px;} #head-banner .carousel .container .carousel-caption{display:block; width:100%; margin:0%;height: 50px;position: relative;top: 160px;} #head-banner .carousel .container .carousel-caption h2{ font-size: 18px;margin-left: 15px;padding: 10px 0 0 0;} #head-banner .carousel .container .carousel-caption p{display: none;} #head-banner .carousel .container .carousel-caption .more{bottom: 25px;font-weight: bold;} #head-banner .carousel .container .carousel-caption .more p{display:block;font-size: 12px;} div.site-wrapper #home-wrapper{ padding: 0px 0 15px 0px;margin: 0 10px;width: 94%;display: inline-block;} div.site-wrapper #home-wrapper #home-intro{width: 100%;margin-bottom: 5%;padding: 0px;} div.site-wrapper #home-wrapper #home-intro h1{width: 100%; display:inline-block;line-height: 34px;} div.site-wrapper #home-wrapper #home-intro p {width: 100%; display:inline-block;line-height: 24px;} /* Homepage Iframe-video*/ div.site-wrapper #home-wrapper #home-intro .homepage-video{width: 100%;height: 250px; min-height: 250px;} /* homepage contact box */ div.site-wrapper #home-wrapper #home-intro div .contact-box {width:88%;float:none;position:relative;top:0px;left:0px;margin:3%;padding:3%;height: auto;display: block; border: none; box-shadow: none;} div.site-wrapper #home-wrapper #home-intro div .contact-box .shadow {padding: 0px;box-shadow:none;-webkit-box-shadow:none;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-phone {background: url(http://cdn.rentokil.com/assets/global/images/tel.png) no-repeat 3px 7px;font-size: 28px;height: auto;padding: 6px 10px 10px 45px;margin: 5px 0; color: #fff;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email {background: url(http://cdn.rentokil.com/assets/global/images/email.png) no-repeat 3px 12px;font-size: 24px;height: auto;color: #ffffff;padding: 8px 10px 0px 45px; margin:5px 0;overflow: hidden;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email a{color:#ffffff;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email a:hover{text-decoration:underline;color:#ffffff;} /* .com homepage contact box */ div.site-wrapper #home-wrapper .prod-home div.contact-box {width:88%;float:none;position:relative;top:0px;left:0px;margin:3%;padding:3%;height: auto;display: block; border: none; box-shadow: none;} div.site-wrapper #home-wrapper .prod-home div.contact-box .shadow {padding: 0px;box-shadow:none;-webkit-box-shadow:none;} div.site-wrapper #home-wrapper .prod-home div.contact-box .hm-phone {background: url(http://cdn.rentokil.com/assets/global/images/tel.png) no-repeat 3px 7px;font-size: 28px;height: auto;padding: 6px 10px 10px 45px;margin: 5px 0; color: #fff;} div.site-wrapper #home-wrapper .prod-home div.contact-box .hm-email {background: url(http://cdn.rentokil.com/assets/global/images/email.png) no-repeat 3px 12px;font-size: 24px;height: auto;color: #ffffff;padding: 8px 10px 0px 45px; margin:5px 0;overflow: hidden;} div.site-wrapper #home-wrapper .prod-home div.contact-box .hm-email a{color:#ffffff;} div.site-wrapper #home-wrapper .prod-home div.contact-box .hm-email a:hover{text-decoration:underline;color:#ffffff;} #home-intro .glyphicon{width:94%; margin:3%; padding:0px;} .glyphicon-ok:before{padding-right:10px;} #site-header #lang_menu{display:none;} /* Service area */ #home-int-ext-area{display: inline-block; width: 100%; margin-top:7%;} #home-int-ext-area .service-area{margin:0 0 10% 0; width: 85%; position: relative;left: 2%;padding: 5%;border: 1px solid #5c9231; border-radius: 5px; -webkit-border-radius: 5px;-moz-border-radius: 5px;box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); -webkit-box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); -moz-box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); } #home-int-ext-area .middle{margin:0 0 10% 0; width: 85%; position: relative;left: 2%;padding: 5%;border: 1px solid #5c9231; border-radius: 5px; -webkit-border-radius: 5px;-moz-border-radius: 5px;box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); -webkit-box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); -moz-box-shadow: 0px 0px 10px 1px rgba(149,191,66,1); } #home-int-ext-area .service-area img{width:100%} #home-int-ext-area .service-area ul li{left:4%;} #home-int-ext-area .service-area ul li a{width:95%; font-size:15px;} /* -------------------------------- Landing page ---------------------------------*/ div.site-wrapper #myCarousel{display:none;} /* Body content */ div.site-wrapper #pri-cont{width:94%; margin:3%;padding:0px;display:inline-block;} div#pri-cont div#content-wrapper{width:100%; margin:3% 0%; padding:0px;float:none;} div#pri-cont div#content-wrapper #main{width:100%;display:block;} div#pri-cont div#content-wrapper #main.standard div#descr{width:100%;display:inline-block; margin: 3% 0%; padding:0px;} div#pri-cont div#content-wrapper #main.standard div#cta{width:100%; display:inline-block;margin: 3% 0%; padding:0px;} div#pri-cont div#content-wrapper #main.standard div#cta div{width:99%; display:block;margin: 3% 0%; padding:0px;} div.site-wrapper table{width:100% !important;} div.site-wrapper table tr{width:85% !important;} div.site-wrapper table tr td {width:85% !important;} div.site-wrapper table tr td ul{width:90% !important; padding:5%;} div.site-wrapper table tr td ul li{ width: 100% !important;left: 0px;} div.site-wrapper table tr td.gsc-table-cell-snippet-close {width:85% !important;} /* Contact Us page */ #sitecontent form.large{width: 91% !important; display: inline-block; padding: 4%; margin: 0px;} #sitecontent form.large fieldset{width: 100%;} #sitecontent form.large fieldset div{width: 95% !important;margin: 10px 0;padding: 0px;} #sitecontent form.large label{width:94%!important;float:left; margin:0px 0px 5px 0px;} #sitecontent form.large select{width:94%!important;float:left;margin:0px 0px 5px 0px;} #sitecontent form.large input{width:94%!important;float:left;margin:0px 0px 5px 0px;} #sitecontent form.large fieldset div.check_additional input{margin: 3px 10px 0 10px;} #sitecontent form.large textarea{width:97%!important;float:left;margin:0px 0px 5px 0px;} #sitecontent form.large div{width:100%} #sitecontent form.large div div.button{width:100% !important;} #sitecontent form.large div button#mcsubmit{width:100% !important; float:none;} #sitecontent form.large .error {color: #f00;display: block;position: relative; top: 10px;} #descr .bigbox2{width:100%; margin:3% 0; display:block;} #descr .smallbox{width:100%; margin:3% 0; display:block;} #sitecontent form.large fieldset#survey_req div{width:94%!important;float:left; margin:0px 0px 5px 0px; display:block} #sitecontent form.large fieldset#survey_req div input{width:auto; margin:0px 2% 5px 0px;} #sitecontent form.large fieldset#survey_req label{width:91%!important;float:left; margin:0px 0px 5px 0px;} #sitecontent form.large fieldset div label{width:91%!important;float:left; margin:0px 0px 5px 0px;} #sitecontent form.large fieldset div input#ca_current, #sitecontent form.large fieldset div input#cu_current, #sitecontent form.large fieldset div input#cu_developments{width:auto!important; margin: 10px 0 10px 0px;} #sitecontent form.large fieldset select#ca_title{width:99%!important;float:left; margin:0px 0px 5px 0px;} #sitecontent form.large fieldset fieldset#survey_req{width:94%!important;float:left; margin:0px 3%; display:block} #sitecontent form.large #container{width:100%!important;} #sitecontent form.large #container div.color span{display: inherit;margin: 0 0 10px 0;} div#sitecontent form.large #container div.first input#ClassicBlack, div#sitecontent form.large #container div.first input#ContemporaryBlack, div#sitecontent form.large #container div.first input#PacificBlack, div#sitecontent form.large #container div.first input#ParamountBlack, div#sitecontent form.large #container div.first input#MetropolitanBlack{width: 20%!important;margin: 0px 0 10px 0;padding: 0px; float: left;} #sitecontent form.large #container div.color input.radio{width: 20%!important;margin: 0px 0 10px 0;padding: 0px; float: left;} /* Left CTA */ div#pri-cont img.l-cta-image{display: block;width: auto;margin: 0 auto;padding: 0px;} div#pri-cont div.nav-cta-block{display: block;width: 100%; margin: 0px; padding: 0px;} div#pri-cont div.nav-cta-block div.nav-cta-block{display: block;width: 93%!important; margin: 0px; padding: 0px;} div#pri-cont div.nav-cta-block div.nav-cta-block center{width:100%; padding: 0%; margin: 0px auto; height: auto;} div#pri-cont div.nav-cta-block div.nav-cta-block center a img{width: 88%; padding: 0%; margin: 0px; height: auto;} div#pri-cont div div.cta-left{float:none;width:99%;display:inline-block;} /* Right CTA */ div#pri-cont #cta{display: inline-block;width: 100%;margin-top: 5%;} div#pri-cont #cta .cta2{display: inline-block;width: 99%;margin-top: 5%;} div#pri-cont #cta .cta2 img.r-cta-image{ display: none;width: 94%;display: inline-block;margin: 10px;} div#pri-cont #cta .cta2 a img.r-cta-image{ display: block;width: auto;display: inline-block;margin: 10px;} /* Bottom CTA*/ div#pri-cont #gray-box-area{display: block; width: 100%; margin: 0px; padding:0;float: left;} div#pri-cont #gray-box-area div div{padding:0px!important;} div#pri-cont #gray-box-area div.service-icon{display: block; width: 94%; margin: 3%; padding:2% 0 0 0!important;background-position: 10px 15px;} div#pri-cont #gray-box-area div.service-icon h3{display: block; width: 78%; margin: 0%; padding:6% 3% 3% 20%;font-weight:bold;font-size:18px;} div#pri-cont #gray-box-area div.service-icon div{display: block; width: 94%; margin: 0%; padding:3%!important;} div#pri-cont #gray-box-area div{display: block; width: 100%; margin: 0px; padding:0px;} div#pri-cont #gray-box-area div.cat-4up{width: 42%; float: left;display: block;margin: 3%;padding: 3% 0%;max-height: 190px;} div#pri-cont #gray-box-area div.cat-4up a img{width: 96%;margin: 0px;padding: 2%;height: 100%;} div#pri-cont #gray-box-area div.cat-3up{width: 44%; float: left;display: block;margin: 2%;padding: 3% 0%;max-height: 190px;} div#pri-cont #gray-box-area div.cat-3up a img{width: 90%;margin: 0px;padding:5%;height: 100%;} div#pri-cont #gray-box-area div.cat-3up span,div#pri-cont #gray-box-area div.cat-3up a span{width: 90%;margin: 0px;padding:2%;height: 100%;} /* Business Footer */ div.site-wrapper #business-section{display: inline-block;width: 94%; margin: 0% 3% 20% 3%; padding: 0px;} div.site-wrapper #business-section .base-cta{ padding:0px 0 10% 0; width: 100%;float: left;margin: 0px;} div.site-wrapper #business-section .base-cta h2{color: #495c66;width: 100%;margin:0px;padding:0px;display:inline-block;} div.site-wrapper #business-section .base-cta h2 a{ padding: 0px;width: 100%;float: left;margin: 0px;} div.site-wrapper #business-section .base-cta a{ padding: 0px;width: 100%;float: left;margin: 0px;} .green, .pink, .blue {width:100%;} .green p, .pink p, .blue p { background-size: 320px;padding: 20px 20px 12px 20px; } /* -------------------------------- Detail Page ---------------------------------*/ #section-banner{display:none;height: auto;margin: 0 10px; width: 94%;} #descr{display:block; width:94%; margin: 0 3% 3% 3%;} #descr h1{margin:0 0 3% 0;} #descr .flash{display:block; width:99%; margin:0%;} div#descr table{width:100% !important;} div#descr table tr { width: 85% !important;} div.site-wrapper table tr td{width:auto !important;} div#descr table ul{margin-left:0px;} /* Detail page carousel level*/ #descr #myCarousel-1{display: block;width: 100%;margin: 0%;height: 210px;} #descr #myCarousel-1 .carousel-inner{height: 210px;} #descr #myCarousel-1 .carousel-control{top: 20%;background-size: 15px;} #descr #myCarousel-1 img{display:block; width:100%; height:100%; margin:0%;} #descr #myCarousel-1 .container{display:block; width:100%; margin:0%;height: 210px;} #descr #myCarousel-1 .container .carousel-caption{display:block; width:100%; margin:0%;height: 50px;position: relative;top: 160px;} #descr #myCarousel-1 .container .carousel-caption h2{ font-size: 18px;margin-left: 15px;padding: 10px 0 0 0;} #descr #myCarousel-1 .container .carousel-caption p{display: none;} #descr #myCarousel-1 .container .carousel-caption .more{bottom: 25px;font-weight: bold;} #descr #myCarousel-1 .container .carousel-caption .more p{display:block;font-size: 12px;} /* Replace cta box with section box */ #pri-cont .contact-box.no-rhcta {display: none;width: 88%; height: auto;float: none;border-radius: 6px;margin: 3%;padding: 3%;} #pri-cont .call-out {display: block;width: 88%; height: auto;float: none;border-radius: 6px;margin: 3%;padding: 3%;} #pri-cont .call-out .shadow {padding: 0px;box-shadow:none;-webkit-box-shadow:none;} #pri-cont .call-out .hm-phone {background: url(http://cdn.rentokil.com/assets/global/images/tel.png) no-repeat 3px 0;font-size: 28px;height: auto;padding: 2px 10px 10px 45px;margin: 0px 0 10px 0px;color: #fff;} #pri-cont .call-out .hm-email {background: url(http://cdn.rentokil.com/assets/global/images/email.png) no-repeat 3px 8px;font-size: 24px;height: auto;color: #ffffff;padding: 5px 10px 0px 45px;margin: 10px 0 10px 0px;overflow:hidden;} #pri-cont .call-out .hm-email a{color:#ffffff;} #pri-cont .call-out .hm-email a:hover{text-decoration:underline;color:#ffffff;} #pri-cont p.inner-image a, #pri-cont p.inner-image img, #pri-cont p.inner-image a img, #home-intro img{width:100%;} .flash{width:330px;} .flash embed{width:320px; height:220px;} #descr iframe{width: 100%;height: 220px;} #descr #player .ytp-thumbnail{width: 100%;height: 220px;background-size:230px;} #pri-cont #main #descr img.style2{width: 33.33%;margin: 0px;padding: 0px 10px 10px 10px;} /* Right CTA Quick form */ #pri-cont #cta .qifcontainer{width: 99%;float: left;} #pri-cont #cta .qifcontainer form#hqf{width: 100%;display:block;} #pri-cont #cta .qifcontainer form#hqf fieldset{width: 100%;display:block;} #pri-cont #cta .qifcontainer form#hqf fieldset div{display:block;margin-bottom:15px;} #pri-cont #cta .qifcontainer form.large fieldset div input{display:block;width:89%;} #pri-cont #cta .qifcontainer form.large fieldset div textarea{display:block;width:93%;} #hqf label{display:block; margin: 0 10px; width:93%;} #hqf input{display:block; margin: 0 10px; width:89%;} #hqf input:focus{ border-color:#8bbf42;} #hqf textarea{width: 93%;display:block;} form .button .btn{line-height: 28px; font-size: 20px;} /*Tabtable layout*/ .tabbable{width:100%;display: inline-block;} ul.nav.nav-tabs{width:33.33%;} .tabs-left > .nav-tabs > li.active{width:99% !important;} .tabs-left > .nav-tabs > li{width:91% !important; box-shadow:none;margin: 0 0 15px 0px !important;} .tabs-left > .nav-tabs > li > a{font-size: 14px;padding: 25px 15px;} .tabs-left > .nav-tabs > li > a > img{display:none; position: relative;left: 0;top: 0;width: 50px!important;height:50px;margin: 10px auto 0px auto!important;} #tab-content .tab-pane table{margin:0px 0px 15px 5px;} .tab-content .six-pane{height:1060px;} #tab-content .tab-pane p img{float: none;padding: 10px 10px;width:50%;display: block;margin: 0 auto;} /* Step-Banner*/ .step_banner{width: 100%;display: inline-block;margin: 0px 0px 0px 0px;padding: 0px;background-image:none;} .step_banner .section{display: inline-block;margin: 0px;padding: 0px;width: 34.33%;height:66px;float: left;} .step_banner .section.first{background-image: linear-gradient(to bottom, #8bbf42, #387038); background-color: #387038;} .step_banner .section.first .text{width: 80%;margin: 0px;padding: 0px;display: block; float: left;} .step_banner .section.first .arrow{width: 20%; display: inline-block;float: left;margin: 0px;padding: 0px;} div.step_banner .section.first .arrow img{display:block; width:100%!important; margin:0px!important; padding:0px; height:66px;} .step_banner .section.second{background-image: linear-gradient(to bottom, #f3f1f1, #cbcccd); background-color: #cbcccd;} .step_banner .section.second .text{width: 80%;margin: 0px;padding: 0px;display: block; float: left;} .step_banner .section.second .arrow{width: 20%; display: inline-block;float: left;margin: 0px;padding: 0px;} div.step_banner .section.second .arrow img{display:block; width:100% !important; margin:0px !important; padding:0px; height:66px;} .step_banner .section.third{width: 30.33%;background-image: linear-gradient(to bottom, #dcdde0, #9e9fa0); background-color: #9e9fa0;} .step_banner .section p{font-size: 13px; margin: 0px !important; font-weight: bold; line-height: 18px!important;} .step_banner .section.first p{color:#fff; padding: 15px !important; } .step_banner .section.second p{color:#387038; padding: 15px 8px !important;} .step_banner .section.third p{color:#387038; padding: 15px 8px !important;} /*UPS Banner*/ #home-wrapper #ups-banner{display:inline-block;width:100%;margin:3% 0; padding:0px;} #home-wrapper #ups-banner h1{width: 100%;} #home-wrapper #ups-banner .ups-column{display: inline-block;width: 100%;margin: 0%;padding: 0;float: left;} #home-wrapper #ups-banner .ups-column h2{text-align:center;color:#649136;} #home-wrapper #ups-banner .ups-column p{text-align:center;padding:0 15px;} #home-wrapper #ups-banner .ups-column-banner{display: inline-block;width: 98%;margin: 2% 0 0 0;padding: 1%;background-position: 0 5px;} #home-wrapper #ups-banner .ups-column-banner .content{width: 100%;float: none;color: #fff;font-size: 15px;margin: 5px;max-width: 100%;} #home-wrapper #ups-banner .ups-column-banner .content p{margin: 0px;font-size: 12px;} #home-wrapper #ups-banner .ups-column-banner .button{width: 100%;float: none;margin: 20px 0px 20px 0px;display: inline-block;text-align: center;} #home-wrapper #ups-banner .ups-column-banner .button a{margin-right: 0;float: none;} /********* NEW UK HOMEPAGE QUICK WINS *****/ body.p-home.wide div.site-wrapper #home-wrapper{width: 94%!important;} body.p-home.wide div.site-wrapper #site-header {width: 100%!important;left: 0; overflow: hidden;} body.p-home.wide div.site-wrapper #head-banner{display: block;width: 94%;margin: 3%;} body.p-home.wide div.site-wrapper #head-banner #banner-cta-area{display: block;width: 99%;height: auto;line-height: 30px;padding: 10px 0;border-radius: 5px;border:1px solid #8bbf42;} body.p-home.wide div#myCarousel-2.carousel, body.p-home div#myCarousel-2 .container{top:0px !important;} body.p-home.wide div#home-intro div#myCarousel-2 div.carousel-caption{margin-top: 232px;height: 60px;} body.p-home.wide div#myCarousel-2.carousel {margin-bottom: 15px; float:left;} body.p-home.wide div#home-intro ul.glyphicon{width:94%;} body.p-home.wide div#home-intro h2{display: inline-block;} body.p-home.wide #home-int-ext-area {margin:3% 0;} body.p-home.wide #home-int-ext-area .service-area{border: 0!important;border-radius: 0!important;-webkit-border-radius: 0!important;-moz-border-radius: 0!important;box-shadow: none!important; -webkit-box-shadow: none!important;-moz-box-shadow: none!important;margin:0!important;padding:0!important;} body.p-home.wide #home-int-ext-area .service-area img {width: 100%!important;height: auto;} body.p-home.wide #home-int-ext-area .service-area{width: 45%!important;height:auto!important;margin: 2%!important;} body.p-home.wide #home-int-ext-area .service-area div.button{width: 100%;height: 35px;} body.p-home.wide #home-int-ext-area .service-area div.button a.btn.btn-success{font-size: 12px;margin-top: 5px;} body.p-home.wide div#home-prod-container{width:100%;} body.p-home.wide div#home-prod-container div.product-container-area.left img{display:none;} body.p-home.wide div#home-prod-container div.product-container-area.left ul{width:100%;} body.p-home.wide div#home-prod-container div.product-container-area.left ul img{display:block;} body.p-home.wide div#home-prod-container div.product-container-area.left{width:100%;margin-bottom: 15px;} body.p-home.wide div#home-prod-container div.product-container-area.right{float:left;width: 45%!important;height: 155px!important;margin: 2%!important;} body.p-home.wide div#mc_embed_signup{width:100%;} body.p-home.wide div#mc_embed_signup_scroll input.email{width: 84%;} body.p-home.wide div#home-prod-container div.product-container-area.right img{width: 92%;height: auto;} body.p-home.wide div#home-prod-container div.product-container-area.left h2{margin-top: 20px;} body.p-home.wide div#customer-area-container {width: 100%;margin: 0 auto;text-align: center;} body.p-home.wide #customer-area-container div.customer-area{width: 88%;} body.p-home.wide #customer-area-container div.customer-area.top h2{text-align:left;} body.p-home.wide #site-footer {padding-left: 6%;width: 94%;height: auto;} body.p-home.wide #site-footer .footer-block-social-media{padding-left: 6%;width: 94%;height: auto;position: relative;left: -25px;} } /********* Smartphones - Portrait Device *****/ @media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) { /* Logo replacement */ #site-header #logo{ width: 63%;float: right;/*background: white;*/margin-bottom: 0%;margin-right: 0%;} #site-header #logo a{width: 100%;margin: 0;display: block;} #site-header #logo a img{ width: 124px;margin: 10px 0 10px 10px;height: auto;float: right;} .logo-image {content:url("http://cdn.rentokil.com/assets/global/images/ambius-mobile-main-logo.png");} /* homepage contact box */ div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-phone {background: url(http://cdn.rentokil.com/assets/global/images/tel.png) no-repeat 3px 7px;font-size: 34px;height: auto;padding: 6px 10px 10px 45px;margin: 5px 0; color: #fff;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email {background: url(http://cdn.rentokil.com/assets/global/images/email.png) no-repeat 3px 12px;font-size: 28px;height: auto;color: #ffffff;padding: 8px 10px 0px 45px;margin:5px 0;overflow: hidden;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email a{color:#ffffff;} div.site-wrapper #home-wrapper #home-intro div .contact-box .hm-email a:hover{text-decoration:underline;color:#ffffff;} /* .com homepage contact box */ div.site-wrapper #home-wrapper .prod-home div.contact-box .hm-phone {background: url(http://cdn.rentokil.com/assets/global/images/tel.png) no-repeat 3px 7px;font-size: 34px;height: auto;padding: 6px 10px 10px 45px;margin: 5px 0; color: #fff;} div.site-wrapper #home-wrapper .prod-home div.contact-box .hm-email {background: url(http://cdn.rentokil.com/assets/global/images/email.png) no-repeat 3px 12px;font-size: 28px;height: auto;color: #ffffff;padding: 8px 10px 0px 45px;margin:5px 0;overflow: hidden;} div.site-wrapper #home-wrapper .prod-home div.contact-box .hm-email a{color:#ffffff;} div.site-wrapper #home-wrapper .prod-home div.contact-box .hm-email a:hover{text-decoration:underline;color:#ffffff;} #home-intro .glyphicon{width:94%; margin:3%; padding:0px;} .glyphicon-ok:before{padding-right:10px;} /* Detail page right cta*/ #pri-cont .call-out .hm-phone {background: url(http://cdn.rentokil.com/assets/global/images/tel.png) no-repeat 3px 0;font-size: 34px;height: auto;padding: 2px 10px 10px 45px;margin: 0px 0 10px 0px;color: #fff;} #pri-cont .call-out .hm-email {background: url(http://cdn.rentokil.com/assets/global/images/email.png) no-repeat 3px 8px;font-size: 28px;height: auto;color: #ffffff;padding: 5px 10px 0px 45px;margin: 10px 0 10px 0px;overflow:hidden;} /* Business Footer */ .green, .pink, .blue {width:100%;} .green p, .pink p, .blue p {padding: 20px; background-size: 334px;font-size:16px;line-height: 22px;} /* Step-Banner*/ .step_banner{width: 100%;display: inline-block;margin: 0px 0px 0px 0px;padding: 0px;background-image:none;} .step_banner .section{display: inline-block;margin: 0px;padding: 0px;width: 34.33%;height:66px;float: left;} .step_banner .section.first{background-image: linear-gradient(to bottom, #8bbf42, #387038); background-color: #387038;} .step_banner .section.first .text{width: 80%;margin: 0px;padding: 0px;display: block; float: left;} .step_banner .section.first .arrow{width: 20%; display: inline-block;float: left;margin: 0px;padding: 0px;} .step_banner .section.first .arrow img{display:block; width:100%; margin:0px; padding:0px; height:66px;} .step_banner .section.second{background-image: linear-gradient(to bottom, #f3f1f1, #cbcccd); background-color: #cbcccd;} .step_banner .section.second .text{width: 80%;margin: 0px;padding: 0px;display: block; float: left;} .step_banner .section.second .arrow{width: 20%; display: inline-block;float: left;margin: 0px;padding: 0px;} .step_banner .section.second .arrow img{height:66px;} .step_banner .section.third{width: 30.33%;background-image: linear-gradient(to bottom, #dcdde0, #9e9fa0); background-color: #9e9fa0;} .step_banner .section p{font-size: 13px; margin: 0px !important; font-weight: bold; line-height: 18px!important;} .step_banner .section.first p{color:#fff; padding: 13px !important; } .step_banner .section.second p{color:#387038; padding: 13px 8px !important;} .step_banner .section.third p{color:#387038; padding: 13x 8px !important;} /********* NEW UK HOMEPAGE QUICK WINS *****/ body.p-home.wide div.site-wrapper #home-wrapper{ width: 94%!important;overflow:hidden;} body.p-home.wide .service-area div.button a.btn.btn-success{font-size:10px;} body.p-home.wide div#home-intro div#myCarousel-2 div.carousel-caption p.head{ padding-left:10px; } body.p-home.wide div#home-intro div#myCarousel-2 div.carousel-caption p.lead{margin-right:15px;} body.p-home.wide div#home-prod-container div.product-container-area.right div.button a.btn.btn-success{font-size:12px;} body.p-home.wide div#myCarousel-2.carousel, body.p-home div#myCarousel-2 .container{top:0px !important; width:100%;} } #search-icon, #nav-icon {display:none;} span.back-arrow{display:none;}