﻿:root	{
	--darkBlue: #0b3b73;
	--lightBlue: #00a2f4;
	--lightGreen: #6d9656;
	--darkGrey: #5C5C5C;
	--letterSpacing: -0.03em;
}

* { margin: 0; padding: 0; outline: none; border: none; box-sizing: border-box; -moz-box-sizing: border-box; }

/* GLOBAL */

html { }
body { line-height: 1; font-family: 'Open Sans', sans-serif; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #2C2C2C; }

::-webkit-input-placeholder { color: #bdbdbd; }
::-moz-placeholder { color: #bdbdbd; opacity: 1; }
:-ms-input-placeholder { color: #bdbdbd; }
:-moz-placeholder { color: #bdbdbd; opacity: 1; }

p { color: #5C5C5C; font-size: 16px; line-height: 1.4em; margin-bottom: 12px; }

img { max-width: 100%; height: auto; }
a { color: inherit; }
a.cover { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0); display: block; }

h1 { line-height: 1.2em; margin-bottom: 12px; letter-spacing: var(--letterSpacing);}
h2 { line-height: 1.3em; font-size: 44px; margin-bottom: 12px; margin-top: 12px; letter-spacing: var(--letterSpacing);}
h3 { line-height: 1.3em; font-size: 38px; margin-bottom: 12px; margin-top: 12px; letter-spacing: var(--letterSpacing);}
h4 { line-height: 1.3em; font-size: 32px; margin-bottom: 12px; margin-top: 12px; letter-spacing: var(--letterSpacing);}
h5 { line-height: 1.3em; font-size: 26px; margin-bottom: 12px; margin-top: 12px; letter-spacing: var(--letterSpacing);}
h6 { line-height: 1.4em; font-size: 20px; margin-bottom: 12px; margin-top: 12px; letter-spacing: var(--letterSpacing);}

h2, h3, h4, h5, h6 { color: #5C5C5C; }

.hidden { display: none; visibility: hidden; }
[aria-hidden="true"] { display: none; visibility: hidden; }

.mt-0 { margin-top: 0 !important; }
.mt-10 { margin-top: 10px !important; }
.mt-20 { margin-top: 20px !important; }

.mb-0 { margin-bottom: 0 !important; }

.pb-10 { padding-bottom: 10px !important; }
.pb-20 { padding-bottom: 20px !important; }

.align-left { text-align: left; }

.inner { width: 100%; max-width: 1620px; padding-left: 60px; padding-right: 60px; margin: 0 auto; }
.inner.no-padding { padding-left: 0; padding-right: 0 }

.white-panel { border-radius: 20px; background-color: #ffffff; box-shadow: 0 0 40px rgba(0,0,0,0.16); padding: 35px; }
.white-panel .panel-title { font-weight: bold; font-size: 18px; color: #3398D3; }
.white-panel .panel-title p { font-weight: inherit; font-size: inherit; color: inherit; }
.white-panel .panel-title.small { font-size: 14px; }

.TP-Micro .white-panel {box-shadow:none; border-radius: 0px; margin-bottom: 25px; }


.information-panel { border-radius: 20px; background-color: #ffffff; box-shadow: 0 0 40px rgba(0, 0, 0, 0.16); padding: 35px; margin: 20px 0; }

.information-panel .panel-title { font-weight: bold; font-size: 18px; color: #3398D3; }
.information-panel .panel-title p { font-weight: inherit; font-size: inherit; color: inherit; }

.information-panel p { font-size: 15px; }

.information-panel .panel-title.small { font-size: 15px; }

.btn-remove-item { position: absolute; width: 15px; height: 15px; top: -21px; right: 0; background-image: url("/_assets/icon-remove-red.png"); background-size: cover; background-position: center; background-repeat: no-repeat; background-color: transparent; cursor: pointer; }


input[type=text][disabled],
select[disabled] { opacity: 0.6; }

.popup-text-container { text-align: left; }
.popup-text { display: inline-block; width: auto; font-size: 12px; text-align: left; font-style: oblique; font-weight: bold; cursor: pointer; margin: 0; line-height: 1; }

.form-field-error + .popup-text-container { margin-top: 5px; }

.col-container { width: calc(100% + 30px); margin-left: -15px; font-size: 0 }
.col-1 { width: 100%; padding: 15px; vertical-align: top; display: inline-block; }
.col-2 { width: 50%; padding: 15px; vertical-align: top; display: inline-block; }
.col-3 { width: 33.333%; padding: 15px; vertical-align: top; display: inline-block; }
.col-4 { width: 25%; padding: 15px; vertical-align: top; display: inline-block; }

section { padding: 0 0 20px 0 }


.ui-dialog-buttonset { text-align: center !important; float: none !important; }
.ui-dialog-buttonset button { width: auto !important; min-width: initial !important; color: #ffffff; }
.ui-dialog-buttonset button:focus { color: #ffffff !important; }
.ui-dialog-buttonset button:focus:hover { color: #2b2b2b !important; }

.ui-dialog-buttonset button:last-child { margin-right: 0 !important; }

/* HEADER */
.top-header { background-color: #fff; } /*3EA9F4*/
.top-header .inner { display: flex; justify-content: flex-end; align-items: center; }

.top-header #pnlSearch {background-color: var(--darkBlue); }

.header-search-box { width: 300px; height: 35px; position: relative;}
.header-search-box input[type='text'] { background-color: rgba(255,255,255,0.01); font-size: 16px; width: 100%; height: 100%; padding-left: 30px; color: #fff; transition: 0.2s ease-out; }
.header-search-box input[type='text']:focus {/* background-color: rgba(252,252,252,1);*/ }
.header-search-box input[type='text']::-webkit-input-placeholder { color: #ffffff; }
.header-search-box input[type='text']::-moz-placeholder { color: #ffffff; opacity: 1; }
.header-search-box input[type='text']:-ms-input-placeholder { color: #ffffff; }
.header-search-box input[type='text']:-moz-placeholder { color: #ffffff; opacity: 1; }
.header-search-box input[type='text']:focus::-webkit-input-placeholder { color: #fff; }
.header-search-box input[type='text']:focus::-moz-placeholder { color: #fff; opacity: 1; }
.header-search-box input[type='text']:focus:-ms-input-placeholder { color: #fff; }
.header-search-box input[type='text']:focus:-moz-placeholder { color: #fff; opacity: 1; }

.header-search-box input[type="submit"] { background-color: transparent; width: 32px; height: 32px; border-radius: 32px; background-image: url(/_assets/icons/icon-search.svg); background-size: 16px 16px; background-position: center; background-repeat: no-repeat; position: absolute; right: 15px; top: 50%; margin-top: -16px; transition: 0.2s ease-out; z-index: 2 }
.header-search-box input[type='text']:focus + input[type="submit"] { background-color: #000000; background-color: #3EA9F4; }

a.tel 		{ font-size: 20px; color: var(--lightBlue); font-weight: 600; text-decoration: none; margin-left: 30px; position: relative; height: 28px; transition: 0.2s ease-in; padding-top: 10px }
.header-cta { font-size: 20px; color: var(--lightGreen); font-weight: 600; text-decoration: none; margin-left: 30px; position: relative; height: 28px; transition: 0.2s ease-in; padding-top: 10px}

a.tel:hover,
.header-cta:hover {opacity: 0.75;}

.header-cta svg { margin-right: 7px; }
.header-cta .cls-1 { fill: #ffffff; }
.header-cta.shop a { text-decoration: none }
.header-cta.shop .basket-icon { display: block; width: 34px; height: 27px; background-image: url(/_assets/icons/icon-basket.png); background-size: cover; background-repeat: no-repeat; font-size: 11px; position: relative; margin-left: 3px; }
.header-cta.shop .basket-icon span { position: absolute; text-align: center; right: 3px; top: 7px; width: 20px; }

a.tel:after,
.header-cta:after { content: ''; position: absolute; left: 0; bottom: -6px; width: 100%; border-top: 2px solid #ffffff; opacity: 0; visibility: hidden; transition: 0.2s ease-out }

a.tel:hover:after,
.header-cta:hover:after { opacity: 1; visibility: visible; bottom: -3px; }

/* LOGO AND NAV */
.logo-nav { background-color: #ffffff; }
.logo-nav .inner { display: flex; justify-content: space-between; }
.logo { width: 260px; max-width: 100%; display: block; margin: 10px 0 }
.logo img { width: 100%; }

nav .menu-level-1 { display: flex; font-weight: 600; font-size: 17px; height: 100%; }
nav .menu-level-1 li { margin-left: 25px; align-items: center; position: relative; }
nav .menu-level-1 li:first-child { margin-left: 0; }
nav .menu-level-1 li a { text-decoration: none; display: flex; align-items: center; height: 100%; transition: 0.2s ease-out; }
nav .menu-level-1 li:hover a { color: #0780bc }
nav .menu-level-1 li:hover .menu-level-2 { opacity: 1; visibility: visible; transform: translateY(0); }

nav .menu-level-2 { position: absolute; font-size: 16px; left: -15px; top: 100px;  z-index: 10; flex-direction: column; background-color: #ffffff; height: auto; width: 220px; /*border-top: 5px solid #017DBB; */opacity: 0; visibility: hidden; transition: 0.2s ease-out; transform: translateY(5px); box-shadow: 0 30px 30px rgba(0,0,0,0.2) }
nav .menu-level-2 li { margin: 0; padding: 0; line-height: 1.3em; }
nav .menu-level-2 li a { display: block; padding: 15px; }
nav .menu-level-2 li:hover > a { background-color: #0780bc; color: #ffffff; }
nav .menu-level-2 li:hover .menu-level-3 { opacity: 1; visibility: visible; transform: translateY(0); }

nav .menu-level-3 { position: absolute; font-size: 16px; left: 220px; top: 0; z-index: 10; flex-direction: column; background-color: #ffffff; height: auto; width: 220px;/* border-top: 5px solid #017DBB;*/ opacity: 0; visibility: hidden; transition: 0.2s ease-out; transform: translateY(5px); box-shadow: 0 30px 30px rgba(0,0,0,0.2) }

.menu-level-3.ddLeft { left: -220px; }

/* HAMBURGER */
.hamburger { width: 31px; height: 22px; cursor: pointer; margin-left: 25px; }
.hamburger span { width: 31px; height: 4px; border-radius: 10px; background-color: #0780bc; display: block; }
.hamburger span:nth-child(2) { margin: 5px 0; }

.hamburger.active span:nth-child(2) { display: none }

.hamburger.active span:nth-child(1) { position: absolute; left: 0; top: 9px; transform: rotate(45deg); }
.hamburger.active span:nth-child(3) { position: absolute; left: 0; top: 9px; transform: rotate(-45deg); }

/* HERO CONTAINER */
.hero-container { height: calc(100% - 215px); position: relative; min-height: 700px; margin-bottom: 70px; }
.hero-container .inner { height: 100%; display: flex; align-items: center; }

.home-hero-bg-image { background-size: cover; background-position: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-repeat: no-repeat }

/*.home-hero-bg-image:after { position: absolute; bottom: 0; left: 0; width: 100%; padding-top: 20%; content: ''; background-image: url(/_assets/hero-shape-bottom.svg); background-size: cover; background-repeat: no-repeat; }

.hero-container.white .home-hero-bg-image:after { background-image: url(/_assets/hero-shape-bottom-green.svg); }
*/

.hero-container.light-blue .home-hero-bg-image:after { background-image: url(/_assets/hero-shape-bottom-light-blue.svg); }
.hero-container.light-pink .home-hero-bg-image:after { background-image: url(/_assets/hero-shape-bottom-light-pink.svg); }
.hero-container.light-green .home-hero-bg-image:after { background-image: url(/_assets/hero-shape-bottom-light-green.svg); }
.hero-container.light-orange .home-hero-bg-image:after { background-image: url(/_assets/hero-shape-bottom-light-orange.svg); }

.hero-container.beige .home-hero-bg-image:after { background-image: url(/_assets/hero-shape-bottom-beige.svg); }
.hero-container.green .home-hero-bg-image:after { background-image: url(/_assets/hero-shape-bottom-green.svg); }

.home-hero-text {/* border-radius: 20px; */padding: 50px 40px; background-color: #ffffff; box-shadow: 0 0 50px rgba(0,0,0,0.16); width: 430px; position: relative; z-index: 2; margin-top: -8%; }
.home-hero-text h1,
.home-hero-text h2 { font-weight: 800; font-size: 29px; line-height: 1.3em; margin-bottom: 0.55em; }
.home-hero-text h2 { position: relative; display: inline-block; padding-right: 5px; margin-top: 0.85em; color: #017DBB; }
.home-hero-text h3 { font-weight: 700; font-size: 26px; line-height: 1.3em; color: #017DBB; margin-top: 0.75em; margin-bottom: 0.95em; }

.home-hero-text p span { line-height: 1.3em; }

/* HERO CONTAINER SHALLOW */
.hero-container-shallow { height: auto; min-height: unset; padding: 0; height: 50vh; min-height: 500px; }
.hero-container-shallow .home-hero-text { margin: 0 }

/* HERO CONTAINER SUB */

.hero-container.sub { height: calc(50vH - 215px); }



.pipe { animation-name: blink; animation-duration: 0.75s; animation-iteration-count: infinite; opacity: 0; width: 1px; height: 100%; background-color: #2c2c2c; position: absolute; right: 0; top: 0; }

@keyframes blink {
	0% { opacity: 0 }
	50% { opacity: 1 }
	100% { opacity: 0 }
}

/* HERO CONTAINER CAROUSEL */
.home-hero-text-carousel-container h1 { font-size: 35px; margin-bottom: 0.4em }
.home-hero-text-carousel-container h2 { font-size: 35px; color: #000000; margin-top: 0; margin-bottom: 0.4em }
.home-hero-text-carousel-container h3 { margin-top: 0; margin-bottom: 0.5em; }
.home-hero-text-carousel ul.slick-dots li { border: 2px solid #017DBB }

.home-hero-bg-image-carousel { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.home-hero-bg-image-carousel .slick-list,
.home-hero-bg-image-carousel .slick-track,
.home-hero-bg-image-carousel .slide { height: 100%; }

/* HOME LISTING */
.listing { overflow: hidden; }
.home-listing-item { display: flex; margin-bottom: 50px; position: relative }
.home-listing-item .listing-text { width: 50%; padding: 0 80px; position: relative; display: inline-flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.home-listing-item .listing-text h2 { font-size: 50px; font-weight: 700; line-height: 1.2em; margin-bottom: 0.55em; width: 100%;}

.home-listing-item .listing-text p { font-size: 18px; font-weight: 400; line-height: 1.4em; margin-bottom: 1em; width: 100%; }
.home-listing-item .listing-text p.call-cta { font-weight: 800; font-size: 22px; margin-top: 1em; margin-bottom: 0 }
.home-listing-item .listing-text p.call-cta a { color: #017DBB; text-decoration: none; transition: 0.2s ease-out }
.home-listing-item .listing-text p.call-cta a:hover { color: #2c2c2c }
.home-listing-item .listing-text .btn { margin-top: 0.75em; }
.home-listing-item .listing-image-container { width: 50%; position: relative; overflow: hidden; border-top-right-radius: 20px; border-bottom-right-radius: 20px; }
.home-listing-item .listing-image { width: 100%; height: 100%; background-size: contain; background-repeat: no-repeat; background-position: center; min-height: 517px; }
.home-listing-item .tic.listing-image { background-size: cover; background-repeat: no-repeat; background-position: center }


.listing .inner .home-listing-item:nth-child(even) { flex-direction: row-reverse; }
.listing .inner .home-listing-item:nth-child(even) .listing-text { margin-left: 70px; }
.listing .inner .home-listing-item:nth-child(even) .listing-image-container { border-radius: 0; border-top-left-radius: 20px; border-bottom-left-radius: 20px; }

.home-listing-item .listing-text.wider p { width: 100%; }


.panel-section ul { font-size: 18px; font-weight: 400; line-height: 1.4em; margin-bottom: 1em; width: 100%; max-width: 420px; color: #5C5C5C; margin-left: 20px; }

.panel-section div:not(.panel-more-info) ul { max-width: initial; }


.panel-section ul li { margin-bottom: 0px; }

.home-listing-item .listing-text ul { font-size: 18px; font-weight: 400; line-height: 1.4em; margin-bottom: 1em; color: #5C5C5C; margin-left: 20px; width: auto; }
.home-listing-item .listing-text ul li { margin-bottom: 0px; }

.inner .home-listing-item.reversed { flex-direction: row-reverse; }
/*.inner .home-listing-item.reversed .listing-text				{margin-left: 70px;}*/
.inner .home-listing-item.reversed .listing-image-container { border-radius: 0; border-top-left-radius: 20px; border-bottom-left-radius: 20px; }
.inner .home-listing-item, .inner .home-listing-item { border-radius: 0; border-top-left-radius: 20px; border-bottom-left-radius: 20px; }
.home-listing-item { margin-bottom: 0; }

.inner.listing-two .home-listing-item { padding-top: 16px; }

/* HOME LISTING 2 */
.listing-two { overflow: hidden }
/*.listing-two .home-listing-item:last-child				{margin-bottom: 0}*/
.listing-two .inner .home-listing-item:nth-child(even) { flex-direction: row-reverse }
.listing-two .listing-text { min-height: 500px; padding-top: 60px; padding-bottom: 60px; }

.listing-two .inner .home-listing-item:nth-child(odd) .listing-image { border-radius: 20px; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.listing-two .inner .home-listing-item:nth-child(odd) .listing-text { border-radius: 20px; border-bottom-left-radius: 0; }

.inner .home-listing-item.reversed { flex-direction: row-reverse }
.inner .home-listing-item .listing-image { border-radius: 20px; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.inner .home-listing-item .listing-text { border-radius: 20px; border-bottom-left-radius: 0; }

.inner .home-listing-item.reversed .listing-image { border-radius: 20px; border-top-left-radius: 0; border-bottom-left-radius: 0; }
.inner .home-listing-item.reversed .listing-text { border-radius: 20px; border-bottom-right-radius: 0; }

.inner.contain .home-listing-item .listing-image,
.inner.contain .home-listing-item.reversed .listing-image,
.inner.contain .home-listing-item .listing-image { background-size: contain; background-repeat: no-repeat; background-position: top center; }

/*.listing .home-listing-item:last-child		{margin-bottom: 0;}*/

/* CONTENT LISTING */
.listing.content-listing .home-listing-item .listing-text h2 { font-size: 40px; }
.listing.content-listing .home-listing-item .listing-text p { font-size: 16px; width: 100%; line-height: 1.5em; }

.our-services .home-listing-item .listing-text h2 { font-size: 40px; }
.our-services .home-listing-item .listing-text p { font-size: 16px; width: 100%; line-height: 1.5em; }

/* HOME LISTING ALT STYLE */
.home-listing-item.home-listing-item-alt { }
.home-listing-item.home-listing-item-alt .listing-image-container { display: flex; flex-direction: column; justify-content: flex-end; width: 40%; overflow: visible; }
.home-listing-item.home-listing-item-alt .listing-text { background-color: #ffffff; width: 60%; box-shadow: 0 0 20px rgba(0,0,0,0.16); /*border-radius: 20px; border-bottom-right-radius: 0;*/ }
.home-listing-item.home-listing-item-alt .listing-image { height: calc(100% - 80px); width: 100%; /*border-top-right-radius: 20px; border-bottom-right-radius: 20px;*/ min-height: unset; }
.home-listing-item.home-listing-item-alt.multiple .listing-image { min-height: 517px; }

.filters-listing .home-listing-item.home-listing-item-alt .listing-text { background-color: #ffffff; width: 60%; box-shadow: 0 0 20px rgba(0,0,0,0.16); border-radius: 20px; border-bottom-right-radius: 0; }
.filters-listing .home-listing-item.home-listing-item-alt .listing-image { height: calc(100% - 80px); width: 100%; border-top-right-radius: 20px; border-bottom-right-radius: 20px; min-height: unset; }

/* AIR QUALITY SEARCH */
.air-quality-search { }
.air-quality-search .home-listing-item { flex-direction: row-reverse; margin-bottom: 0 }
.air-quality-search .listing-text { height: 530px; display: inline-flex; justify-content: center; flex-direction: column; }
.air-quality-search-middle { /*background-color:#BEDFF5; padding-bottom: 50px;*/ }

/* SEARCH RESULTS */
.search-result-item { width: 960px; max-width: 100%; border-bottom: 1px dotted #cccccc; padding-bottom: 20px; margin-bottom: 25px; }
.search-result-item:first-of-type { margin-top: 30px; }
.search-result-item a { text-decoration: none }
.search-result-item h2 { font-size: 20px; text-transform: capitalize; color: #393939 }
.search-result-item h2 a { display: block }
.search-result-item h3 { font-size: 16px; color: #3EA9F4; font-weight: normal }
.search-result-item h3 a { text-decoration: underline }
.search-result-item mark { background-color: #D5ECFC; font-style: normal }
.search-result-item p { font-size: 15px; }

/*
.air-quality-search:before					{content:''; padding-top: 10.7%; display: block; background-image:url(/_assets/swirl-top.svg); background-size: cover; background-repeat: no-repeat;}
.air-quality-search:after					{content:''; padding-top: 4.8%; display: block; background-image:url(/_assets/swirl-bottom.svg); background-size: cover; background-repeat: no-repeat;}
*/

/* SWOOSH */
.swoosh { padding: 0px; background-color: #BEDFF5; margin-bottom: 70px; }
.swoosh:before { content: ''; /*padding-top: 10.7%;*/ height: 5vw; display: block; background-image: url(/_assets/swoosh-top.png); background-size: 100% 100%; background-repeat: no-repeat; background-position: top center }
.swoosh:after { content: ''; /*padding-top: 4.8%;*/ height: 5vw; display: block; background-image: url(/_assets/swoosh-bottom.png); background-size: 100% 100%; background-repeat: no-repeat; background-position: bottom center }

.postcode-lookup { width: 580px; max-width: 100%; height: 60px; display: flex; box-shadow: 0 0 20px rgba(0,0,0,0.16); margin-top: 1em; overflow: hidden; border-radius: 10px; }
.postcode-lookup input[type="text"] { flex-grow: 1; padding-left: 20px; font-weight: 700 }
.postcode-lookup input[type='text']::-webkit-input-placeholder { color: #6C6C6C; }
.postcode-lookup input[type='text']::-moz-placeholder { color: #6C6C6C; opacity: 1; }
.postcode-lookup input[type='text']:-ms-input-placeholder { color: #6C6C6C; }
.postcode-lookup input[type='text']:-moz-placeholder { color: #6C6C6C; opacity: 1; }

.postcode-lookup .faux-submit { background: rgb(1,125,187); background: linear-gradient(0deg, rgba(1,125,187,1) 0%, rgba(0,162,244,1) 100%); color: #ffffff; font-weight: 600; }
.postcode-lookup .faux-submit:hover { background: rgb(1,125,187); }
.postcode-lookup .faux-submit input[type="button"],
.postcode-lookup .faux-submit input[type="text"] { width: 100%; height: 100%; padding: 0 20px 0 40px; background-color: transparent; font-weight: 700; color: #ffffff; background-image: url(/_assets/icons/icon-search.svg); background-size: 16px; background-repeat: no-repeat; background-position: center left 15px; cursor: pointer; }

/* TRUST PILOT */
.trust-pilot { margin: 70px 0; padding: 0 !important }
.trust-pilot h2 { font-size: 26px; background-color: #017DBB;; text-align: center; color: #ffffff; padding: 12px 30px 15px 30px }
.tp-plugin { text-align: center; background-color: #F4F4F4; padding: 10px }

/* THREE PANEL LISTING */
.three-panels .col-container { display: flex }
.three-panels .listing-panel h2 { font-size: 29px; color: #017DBB }
.three-panels .listing-panel h3 { font-size: 29px; }
.three-panels .listing-panel { height: 100%; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start }
.three-panels .listing-panel .btn { margin-top: 20px; }
.listing-panel-heading { display: flex; align-items: flex-start; justify-content: center; flex-direction: column; margin-bottom: 20px; }
.three-panels .listing-panel span.highlight { font-size: 29px; color: #017DBB; }

section.swirl { padding-top: 70px; }
.swirl { background-image: url(/_assets/bg-shape-green.gif); background-size: 100% 100%; background-repeat: no-repeat }
.swirl-pink { background-image: url(/_assets/bg-shape-pink.gif); }
.swirl-blue { background-image: url(/_assets/bg-shape-blue.gif); }
.swirl-orange { background-image: url(/_assets/bg-shape-orange.gif); }
.swirl-beige { background-image: url(/_assets/bg-shape-beige.gif); }

.swirl.top-only { background-size: 100% 75% }

/* PRICING PANELS */
.four-panels { }
.four-panels h2 { margin-bottom: 30px; }
.four-panels .col-container { }

.four-panels.swirl { background-size: 100% auto; }

.servicing-options { }
.servicing-options h2 { margin-bottom: 30px; }
.servicing-options .col-container { }
.servicing-options.swirl { background-size: 100% auto; }
.servicing-options .col-container h3 { margin-top: 0 }

.servicing-options .col-container		{display: flex; justify-content: center; gap:30px;}
.servicing-options .col-container .col	{width: calc(33.333% - 15px);}

.pricing-panel { padding: 0; font-size: 16px; }
.pricing-panel .listing-panel-image-container { overflow: hidden; border-top-right-radius: 20px; border-top-left-radius: 20px; }
.pricing-panel .listing-panel-image { height: 250px; background-size: contain; background-position: center; background-color: #fff; background-repeat: no-repeat; }
.pricing-panel h3 { padding: 15px 30px; font-size: 29px; color: #ffffff; font-weight: 700; margin-top: 0 }
.pricing-panel h3.grad { background: rgb(1,125,187); background: linear-gradient(0deg, rgba(1,125,187,1) 0%, rgba(62,176,232,1) 100%); }
.pricing-panel h4 { padding: 20px 30px; font-size: 22px; }
.price-details { border-top: 1px solid #E5E5E5; display: flex; justify-content: space-between; align-items: flex-end; }
.price-details .btn-text { margin-right: 30px; margin-bottom: 12px; }
.price-details .btn-text.active:after { transform: rotate(180deg); }
.price-text { padding: 20px 10px 0 30px; }
.price-text p { font-size: 44px; color: #2C2C2C; font-weight: 700; }
.price-text span { display: block; color: #017DBB; font-size: 16px; }
.listing-panel-text-upper p { padding: 0 30px 20px; color: #2C2C2C }
.panel-button { padding: 20px 30px 30px; }
.panel-button .btn { width: 100%; }

.panel-more-info { border-top: 1px solid #E5E5E5; margin-top: 10px; padding-top: 10px; display: none }
.panel-more-info p { padding: 15px 30px; color: #2C2C2C; }
.panel-more-info ul { list-style: none; margin-top: 10px; width: auto; margin: 0; }
.panel-more-info ul li { padding: 10px 30px; line-height: 1.4em; }
.panel-more-info ul li:nth-child(odd) { background-color: #F7F7F7 }
.panel-more-info ul li.extra { background: linear-gradient(0deg, #2CB702 0%, #6fd251 100%); color: #ffffff; margin-top: 10px; }
.panel-more-info ul li.none { display: none; }

.three-panels.pricing h2 { display: block; text-align: center; margin-bottom: 0.8em }

h3.text-cta { font-size: 30px; display: block; text-align: center; margin-top: 40px; }
h3.text-cta a { color: #017DBB }

/* FULL WIDTH CTA */
.full-width-cta { text-align: center; padding: 20px 0; background: rgb(0,230,113); background: linear-gradient(90deg, #8BE86F 0%, #29A504 100%); margin-top: 55px; box-shadow: 0 0 20px rgba(0,0,0,0.2); }
.full-width-cta h2 { font-size: 24px; font-weight: normal; color: #ffffff; margin: 0 }

/* DIAGNOSIS SECTION */
.diagnosis-section { min-height: unset; height: 570px }
.diagnosis-section .home-hero-bg-image { background-size: auto 90%; background-position: right 30px bottom 60px; }
.diagnosis-section .home-hero-bg-image:after { background-image: url(/_assets/hero-shape-bottom-green.svg); }
.diagnosis-section .home-hero-text { margin-top: 0 }
.diagnosis-section .home-hero-text h2 { font-size: 35px; color: #000000; margin: 0 0 0.5em }
.diagnosis-section .home-hero-text p { margin: 0 0 1.5em }

/* CLIENTS CAROUSEL */
.clients { text-align: center; }
.clients h2 { /* margin-bottom: 1em; color:#ffffff; */ }
.clients-carousel .slick-track { display: flex }
.clients-carousel .slide { padding: 15px; height: auto; }
.clients-carousel .white-panel { box-shadow: 0 0 15px rgba(0,0,0,0.2); height: 100%; display: flex; justify-content: center; align-items: center; }
.clients-carousel .white-panel img { max-height: 80px; max-width: 225px; }
.clients ul.slick-dots { display: inline-flex; width: auto; margin-left: 0 }
.clients ul.slick-dots li { border: 2px solid #ffffff; background-color: transparent }
.clients ul.slick-dots li.slick-active { background-color: #ffffff }

/* TESTIMONIAL CAROUSEL */
.testimonial-section { position: relative; overflow: hidden; padding: 90px 0 }
.full-width-video { position: absolute; top: 0; left: 0; z-index: 1; min-height: 100%; min-width: 100%; -webkit-transform-style: preserve-3d; }
.full-width-video video { position: absolute; top: 50%; left: 50%; z-index: 1; min-height: 100%; min-width: 100%; height: auto; width: auto; -o-object-fit: cover; object-fit: cover; transform: translate(-50%,-50%); }
.testimonial-carousel { position: relative; z-index: 5; width: 50%; }
.testimonial-carousel p { font-size: 31px; font-weight: 600; color: var(--darkBlue); }
.testimonial-carousel cite { font-size: 20px; color: var(--darkBlue); display: block; margin-top: 1.25em; padding-bottom: 10px; }
.test-quote { position: relative; z-index: 5; width: 82px; margin-bottom: 15px; }

ul.slick-dots { list-style: none; display: flex; font-size: 0; margin-top: 25px; }
ul.slick-dots li { width: 20px; height: 20px; border-radius: 20px; background-color: #ffffff; margin-right: 10px; }
ul.slick-dots li.slick-active { background-color: var(--darkBlue); }

/* CIRCLES */
.circle-section { text-align: center; }
.circle-section p { width: 726px; max-width: 100%; margin: 20px auto; }
.circle-container { display: flex; text-align: center; justify-content: space-between; margin-top: 40px; }
.circle-col { width: 198px; position: relative; }
.circle-col p { color: #2C2C2C; font-weight: 600; font-size: 15px; margin: 0 }
.circle-col span { display: none }

.circle-section:not(.no-arrows) .circle-col:after { width: 103px; height: 38px; background-image: url(/_assets/icon-arrow-green.png); background-size: cover; content: ''; display: block; position: absolute; right: -105px; top: 60px; }
.circle-section:not(.no-arrows) .circle-col:last-child:after { display: none }
.circle-section:not(.no-arrows) .circle-col:nth-child(2):after { transform: scaleY(-1); top: 120px; }

.circle-section .inner { width: 1230px; max-width: 100%; }

/* BENEFITS */
.benefits-section { text-align: center; margin-bottom: 70px; }
.benefits-section h2 { font-size: 35px; color: #ffffff; margin-bottom: 1em }
.benefit { background: linear-gradient(0deg, #DEDEDE 0%, #ffffff 100%); border: 2px solid #ffffff; box-shadow: 0 0 40px rgba(0,0,0,0.16); border-radius: 20px; padding: 40px 30px; display: flex; align-items: center; text-align: left; height: 100%; }
.benefit img { width: 25%; max-width: 100px; }
.benefit p { font-weight: 700; font-size: 1.5vw; padding-left: 26px; color: #2C2C2C; line-height: 1.2em; margin: 0.2em 0 }
.benefits-section .col-container { display: flex; }

/* FILTERS LISTING */
.filters-listing h2 { display: block; text-align: center; font-weight: 400; margin-bottom: 1.2em; padding-left: 30px; padding-right: 30px }
.filters-listing h2 strong { display: block; }
.filters-listing .home-listing-item-alt .listing-image { background-position: center }
.filters-listing .home-listing-item-alt h3 { font-size: 40px; margin-bottom: 0.5em; }
.filters-listing .home-listing-item-alt p { width: 100%; font-weight: 600; color: #2C2C2C; font-size: 16px; }
.filters-listing .home-listing-item-alt hr { width: 100%; margin-bottom: 30px; border-top: 1px solid #E5E5E5; display: block; }
.filter-features { display: flex }
.filter-features div { width: 50%; padding-right: 20px; }
.filter-features h4 { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.filter-features p { font-weight: 400 !important }

.filters-listing .home-listing-item-alt.blue h3,
.filters-listing .home-listing-item-alt.blue h4 { color: #017DC5; }
.filters-listing .home-listing-item-alt.blue .btn:after { background: linear-gradient(0deg, #017DC5 0%, #58AEE0 100%); }

.filters-listing .home-listing-item-alt.green h3,
.filters-listing .home-listing-item-alt.green h4 { color: #2DAA69; }
.filters-listing .home-listing-item-alt.green .btn { background-color: #2DAA69 }
.filters-listing .home-listing-item-alt.green .btn:after { background: linear-gradient(0deg, #2DAA69 0%, #2CD67F 100%); }
.filters-listing .home-listing-item-alt.green .btn:hover { background-color: #2DAA69; box-shadow: 0 0 0 3px #2DAA69 }

.filters-listing .home-listing-item-alt.orange h3,
.filters-listing .home-listing-item-alt.orange h4 { color: #F77C36; }
.filters-listing .home-listing-item-alt.orange .btn { background-color: #F77C36; }
.filters-listing .home-listing-item-alt.orange .btn:after { background: linear-gradient(0deg, #F77C36 0%, #F2A77C 100%); }
.filters-listing .home-listing-item-alt.orange .btn:hover { background-color: #F77C36; box-shadow: 0 0 0 3px #F77C36 }

.filters-listing .home-listing-item-alt.pink h3,
.filters-listing .home-listing-item-alt.pink h4 { color: #EC5870; }
.filters-listing .home-listing-item-alt.pink .btn { background-color: #EC5870; }
.filters-listing .home-listing-item-alt.pink .btn:after { background: linear-gradient(0deg, #EC5870 0%, #FA889B 100%); }
.filters-listing .home-listing-item-alt.pink .btn:hover { background-color: #EC5870; box-shadow: 0 0 0 3px #EC5870 }

/* Basic Text Page */

section.basic-text-page { margin: 30px 0 0 0; }
section.basic-text-page h1 { font-size: 40px; margin-bottom: 0.75em; }
section.basic-text-page .intro { margin: 20px 0; }
section.basic-text-page .intro p { color: #017DBB; font-size: 133%; }

/* Basic Page Copy */

.copy-container { margin-bottom: 24px; }
.copy-container h2 { margin-bottom: 12px; font-size: 24px; line-height: 1.4em; }
.copy-container p { margin-bottom: 12px; font-size: 18px; line-height: 1.4em; }

.copy-container ul { margin-bottom: 24px; font-size: 16px; line-height: 1.3em; color: #5C5C5C; }
.copy-container ul li { margin-bottom: 6px; margin-left: 20px; }

.copy-container.intro { }
.copy-container.copy { }
.copy-container.copy2 { }

/* DIAGNOSIS TOOL */
.diagnosis-tool { /*background-image: url(/_assets/hero-shape-bottom-green.svg);*/ background-position: bottom center; background-size: cover; background-repeat: no-repeat; padding: 40px 0 90px; box-shadow: inset 0 0 5px rgba(0,0,0,0.2); }
.diagnosis-tool h1 { font-size: 35px; font-weight: 800; margin-bottom: 1em; color: var(--darkBlue);}
.diagnosis-tool .inner { width: 650px; max-width: 100%; text-align: center; padding-left: 20px; padding-right: 20px}
.diagnosis-tool .question { margin-bottom: 25px; }
.diagnosis-tool .question p { font-weight: 600; font-size: 20px; color: #2C2C2C }
.diagnosis-tool .question p span { font-size: 40px; color: var(--darkBlue); font-weight: 800; margin-right: 6px; }
.diagnosis-tool .answers { border-top: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6; margin-bottom: 20px; padding: 20px 0; min-height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.diagnosis-tool .buttons { display: flex; justify-content: space-between }
.diagnosis-tool .buttons.buttons-one { justify-content: center }
.diagnosis-tool .btn { width: 175px; max-width: 100%; min-width: unset; background-color: var(--darkBlue); }
.diagnosis-tool .container { margin-top: 25px; }

.diagnosis-tool .faux-btn { padding: 13px 15px; display: block; width: 100%;font-size: 16px; color: #646464; font-weight: 600; margin-bottom: 10px; cursor: pointer; transition: 0.2s ease-in-out; background-color: #e9e9ed; /*background: linear-gradient(180deg, #ffffff 0%, #EFEFEF 100%);  border-radius: 5px; border: 1px solid #D8D8D8; */ }
.diagnosis-tool .faux-btn:hover { background: var(--darkBlue); color: #fff; }
.diagnosis-tool .faux-btn.active { background: var(--darkBlue); color: #fff; opacity: 1 }


.diagnosis-tool .faux-btn.inactive { opacity: 0.5 }

.diagnosis-tool input[type='text'] { color: #767676; font-size: 16px; font-weight: 600; padding: 13px 20px; border: 1px solid #D8D8D8; width: 100%; border-radius: 5px; text-align: center; transition: 0.2s ease-out; }
.diagnosis-tool input[type='text']:focus { box-shadow: 0 0 0 2px #D8D8D8; }

.diagnosis-tool textarea { color: #767676; font-size: 16px; font-weight: 600; padding: 13px 20px;/* border-radius: 5px;*/ width: 100%;  text-align: left; transition: 0.2s ease-out; border: 1px solid #D8D8D8; }
.diagnosis-tool textarea:focus { box-shadow: 0 0 0 2px #D8D8D8; }



.white-panel img.diagnosis-image-make,
.diagnosis-tool img.diagnosis-image-make {max-width: 60%; margin-bottom: 20px;}

.white-panel img.diagnosis-image-model,
.diagnosis-tool img.diagnosis-image-model {max-width: 80%; margin-bottom: 20px; }


.diagnosis-tool .top-results img.results {max-width: 50%; margin: 15px; }


.select-css {text-align: center; display: block; color: #646464; font-size: 16px; line-height: 1.3; padding: 13px 20px; width: 100%; max-width: 100%; box-sizing: border-box; margin: 0; -moz-appearance: none; -webkit-appearance: none; appearance: none; background-color: #EFEFEF; font-weight: 600;  background-image: url(/_assets/select-arrow.png); background-repeat: no-repeat, repeat; background-position: right 1em top 50%, 0 0; background-size: 25px auto; }
/*

 border: 1px solid #D8D8D8; 
 border-radius: 5px;
box-shadow: inset 0 20px 20px rgba(255,255,255,0.5);
*/


.select-css::-ms-expand { display: none; }

.select-css:hover { /*border-color: #888;*/ }
.select-css:focus { border-color: #aaa; box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7); box-shadow: 0 0 0 3px -moz-mac-focusring; /*color: #222; */ outline: none; }
.select-css option { font-weight: normal; }

.your-diagnosis { display: flex; text-align: left; align-items: flex-start; border-bottom: 1px solid #E6E6E6; margin-bottom: 20px; padding-bottom: 8px }
.your-diagnosis p { color: #2C2C2C; font-weight: 600; margin-left: 15px; }

.form-cols { width: calc(100% + 20px); margin-left: -10px; display: flex; flex-wrap: wrap }
.form-cols .form-cell { padding: 10px; width: 50%; display: inline-block; vertical-align: top }
.form-cols .form-cell.full { width: 100%; }



.diagnosis-tool .white-panel { border-radius: 0px;}






/* CHECKBOX */
.container { display: flex; flex-direction: row-reverse; position: relative; cursor: pointer; font-size: 16px; line-height: 1.3em; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; align-items: flex-start; }
.container p { font-weight: 600; color: #727272; margin: 0 0 0 8px }
.container input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
.checkmark { display: block; position: relative; height: 25px; width: 25px; flex-shrink: 0; background-color: #E2E2E2; }
.container:hover input ~ .checkmark { background-color: #102559; }
.container input:checked ~ .checkmark { background-color: #102559; }
.checkmark:after { content: ""; position: absolute; display: none; }
.container input:checked ~ .checkmark:after { display: block; }
.container .checkmark:after { left: 9px; top: 4px; width: 4px; height: 10px; border: solid #ffffff; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

/* RADIO LOOKING VERSION */
.container.container-radio .checkmark { width: 20px; height: 20px; border-radius: 20px; }
.container.container-radio .checkmark:after { width: 10px; height: 10px; border-radius: 10px; left: 4px; top: 4px; border: none; background-color: #ffffff }

/* AIR POLLUTION PAGE */
.air-pollution-results { background-position: bottom center; background-size: cover; background-repeat: no-repeat; padding: 40px 0 90px; box-shadow: inset 0 2px 2px rgb(0 0 0 / 20%); }
.air-pollution-results h1 { text-align: center; display: block; font-size: 40px; margin-bottom: 0.6em; }
.air-pollution-results .inner { width: 1102px; max-width: 100%; padding-left: 20px; padding-right: 20px; }

.air-results-panel { display: flex; justify-content: center; }
.air-results-panel .col-left { width: 415px; }
.air-results-panel .col-right { width: 210px; text-align: center; margin-left: 80px; }
.air-results-panel h2 { font-size: 35px; font-weight: 800; }
.air-results-panel h3 { font-size: 35px; font-weight: 800; margin: 25px 0; display: block }
.air-results-panel h3 span { display: block; font-weight: 600; font-size: 14px; line-height: 16px; margin-bottom: 0; padding-bottom: 0; color: #2C2C2C !important; }
.air-results-panel h4 { font-size: 30px; font-weight: 800 }
.air-results-panel p { font-size: 20px; }

.air-results-panels { display: flex }
.air-results-panels .white-panel { height: 100%; }

/*h3.postcode {text-transform: uppercase;}*/

.air-results-panel-small { display: flex; }
.air-result { width: 146px; height: 146px; border-radius: 146px; box-shadow: 0px 5px 14px rgba(0,0,0,0.2); display: flex; flex-direction: column; align-items: center; justify-content: center; }
.air-result p { font-size: 55px; font-weight: 800; margin: 0; line-height: 58px }
.air-result span { font-size: 18px; font-weight: 600; line-height: normal; color: #2C2C2C !important }
.result-col-text { padding-left: 35px; }
.result-col a { font-size: 14px; color: #017DBB; display: block; text-align: center; margin-top: 20px; }

.tooltip { position: relative; display: inline-block; cursor: help }
.tooltip .tooltiptext { visibility: hidden; width: 250px; background-color: #ffffff; color: #2C2C2C !important; padding: 20px; border-radius: 6px; position: absolute; z-index: 1; box-shadow: 0 0 10px rgba(0,0,0,0.2); font-size: 14px; text-align: left; line-height: 1.4em; }
.tooltip:hover .tooltiptext { visibility: visible; }

.air-pollution-results.low { background-image: url(/_assets/swoosh-1.png); }
.air-pollution-results.relatively-low { background-image: url(/_assets/swoosh-2.png); }
.air-pollution-results.moderate { background-image: url(/_assets/swoosh-3.png); }
.air-pollution-results.high { background-image: url(/_assets/swoosh-4.png); }
.air-pollution-results.very-high { background-image: url(/_assets/swoosh-5.png); }

.air-pollution-results.low .air-result p,
.air-pollution-results.low .result-col-text span,
.air-pollution-results.low h3,
.air-pollution-results.low h4 { color: #FFB48E }

.air-pollution-results.relatively-low .air-result p,
.air-pollution-results.relatively-low .result-col-text span,
.air-pollution-results.relatively-low h3,
.air-pollution-results.relatively-low h4 { color: #F59F66; }

.air-pollution-results.moderate .air-result p,
.air-pollution-results.moderate span,
.air-pollution-results.moderate h3,
.air-pollution-results.moderate h4 { color: #FFA700; }

.air-pollution-results.high .air-result p,
.air-pollution-results.high span,
.air-pollution-results.high h3,
.air-pollution-results.high h4 { color: #FF3300; }

.air-pollution-results.very-high .air-result p,
.air-pollution-results.very-high span,
.air-pollution-results.very-high h3,
.air-pollution-results.very-high h4 { color: #EA0606; }

/* AIR AWARE */
.air-aware .inner-top { text-align: center; width: 1102px; max-width: 100%; padding-left: 20px; padding-right: 20px; margin: auto; }
.air-aware .inner-top h2 { font-size: 65px; }
.air-aware .inner-top p { width: 760px; max-width: 100%; margin: 0 auto 1em }

.col-container.air-aware-buttons { display: flex; margin-top: 40px; margin-bottom: 40px; }
.air-aware-btn { background-color: #3EA9F4; text-align: center; display: flex; width: 100%; padding: 30px 20px; box-shadow: 0 0 40px rgb(0 0 0 / 16%); border-radius: 20px; cursor: pointer; flex-direction: column; justify-content: center; margin-bottom: 25px; }
.air-aware-btn p { font-size: 35px; font-weight: 800; color: #ffffff; margin-bottom: 0 !important; margin-left: auto; margin-right: auto; line-height: 1.2em; width: 100%; max-width: 100%; }
.air-aware-btn span { font-size: 20px; display: block; color: #ffffff; margin-top: 20px; font-weight: 700 }
.air-aware .air-aware-buttons p { width: 90%; max-width: 500px; }
.air-aware-btn.green { background-color: #66CE6A }

.air-aware-btn:hover { transform: translateY(5px); box-shadow: none }

/* AIR AWARE TABLE */
.air-aware-table th { font-size: 16px; padding: 15px 0; border-right: 1px solid #ffffff; border-left: 1px solid #ffffff; }
.air-aware-table th.low { background-color: #FFB48E }
.air-aware-table th.relatively-low { background-color: #F59F66 }
.air-aware-table th.moderate { background-color: #FFA700 }
.air-aware-table th.high { background-color: #FF3300; color: #ffffff; }
.air-aware-table th.very-high { background-color: #EA0606; color: #ffffff; }

.air-aware-table td p { color: #2C2C2C; margin-bottom: 5px; }
.air-aware-table td p.bigger { font-size: 20px; margin-bottom: 5px; }

.air-aware-table tr.rec-row td { padding-top: 10px; padding-bottom: 10px; }

.air-aware-table td { text-align: center; font-size: 16px; padding: 15px 10px; color: #2C2C2C; vertical-align: middle; border-right: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD }
.air-aware-table td a { color: #017DBB; font-size: 14px; }
.air-aware-table td p { font-weight: 700 }

.air-aware-table td.rec-column { text-align: left; border-left: 1px solid #DDDDDD }
.air-aware-table td.rec-column h4 { font-size: 18px; margin: 0 }
.air-aware-table td.rec-column p { font-weight: 700; font-size: 16px; }
.air-aware-table td.rec-column p span { display: block; font-size: 15px; margin-top: 10px; }
.air-aware-table td.number { font-size: 35px; font-weight: 700 }

.air-aware-table td.number.low { color: #FFB48E }
.air-aware-table td.number.relatively-low { color: #F59F66 }
.air-aware-table td.number.moderate { color: #FFA700 }
.air-aware-table td.number.high { color: #FF3300; }
.air-aware-table td.number.very-high { color: #EA0606; }

.air-aware-table td.prod-rec-col p { color: #ffffff; font-size: 20px; }
.air-aware-table td.prod-rec-col a { color: #ffffff; }
.air-aware-table td.prod-rec-col-rec { background-color: #66CE6A !important; text-align: left; }
.air-aware-table td.prod-rec-col-rec p { font-size: 16px; }
.air-aware-table td.prod-rec-col-rec p span { font-size: 14px; display: block; font-weight: normal; margin-top: 10px; }
.air-aware-table td.prod-rec-col.low { background-color: #FFB48E }
.air-aware-table td.prod-rec-col.relatively-low { background-color: #F59F66 }
.air-aware-table td.prod-rec-col.moderate { background-color: #FFA700 }
.air-aware-table td.prod-rec-col.high { background-color: #FF3300; color: #ffffff; }
.air-aware-table td.prod-rec-col.very-high { background-color: #EA0606; color: #ffffff; }

.air-aware-table tr:nth-child(odd) td { background-color: #F7F7F7 }
.air-aware-table td.take-action { font-weight: bold; color: #ffffff; background: rgb(255,167,0); background: linear-gradient(90deg, rgba(255,167,0,1) 0%, rgba(234,6,6,1) 100%); }

.air-aware-table th.active,
.air-aware-table td.active { position: relative; border-collapse: collapse; }
.air-aware-table th.active:before,
.air-aware-table td.active:before { z-index: 10; width: 10px; height: 100%; position: absolute; left: -10px; top: 0; content: ''; background: rgb(0,0,0); background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.2) 100%); }
.air-aware-table th.active:after,
.air-aware-table td.active:after { z-index: 10; width: 10px; height: 100%; position: absolute; right: -10px; top: 0; content: ''; background: rgb(0,0,0); background: linear-gradient(-90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.2) 100%); }

p.airaware-contact { font-size: 20px; font-weight: 700; color: #2C2C2C; margin: 30px 0 0 30px; }
p.airaware-contact a { text-decoration: none; color: #017DBB; }

/* ACCORDION STYLE TWO */
.accordion-container-2 .accordion-item { margin-bottom: 6px; border-bottom: none }
.accordion-container-2 .accordion-item h2 { font-size: 20px; color: #ffffff; background-color: #2A5469; position: relative; cursor: pointer; line-height: 1.4em; padding: 15px 80px 15px 30px; border-radius: 15px; box-shadow: 0 0 15px rgba(0,0,0,0.2) }
.accordion-container-2 .accordion-item h2 span.plus { width: 37px; height: 37px; border-radius: 37px; background-color: #ffffff; position: absolute; right: 15px; display: block; top: 10px; left: auto; }
.accordion-container-2 .accordion-item h2 span.plus:before { width: 5px; height: 19px; background-color: #333333; position: absolute; left: 16px; top: 9px; content: ''; border-radius: 10px; }
.accordion-container-2 .accordion-item h2 span.plus:after { width: 5px; height: 19px; background-color: #333333; position: absolute; left: 16px; top: 9px; content: ''; border-radius: 10px; transform: rotate(90deg); }
.accordion-container-2 .accordion-item.active h2 { background-color: #2A5469; color: #ffffff; }
.accordion-container-2 .accordion-item.active h2 span.plus:after { }
.accordion-container-2 .accordion-item.active h2 span.plus:before { display: none; }
.accordion-container-2 .accordion-expanded { display: none; padding: 10px 0 }
.accordion-container-2 .accordion-expanded p:last-child { margin-bottom: 0; }

/* SHOP PANEL */
.tas-section h2 { margin-bottom: 0.5em; text-align: center }
.tas-section .col-container { display: flex; flex-wrap: wrap }
.tas-section .col-container .col { width: 25%; padding: 15px; margin-bottom: 70px; }

.tas-panel { text-align: center; position: relative }
.tas-panel a.cover { z-index: 10 }
.tas-text p { margin: 0; font-size: 18px; letter-spacing: 1px }

.tas-image-container { overflow: hidden; position: relative; height: 26vw; max-height: 400px; margin: 0 0 25px 0 }
.tas-image { position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-size: cover; transition: 0.4s ease-out; background-position: center; }

.tas-text-top { display: flex; align-items: flex-end; justify-content: center }

.tas-panel:hover .tas-image { transform: scale(1.1) }


/* FOOTER */
.footer-nav { background-color: #EFEFEF; padding: 40px 0 }
.footer-nav .inner { display: flex; justify-content: space-between }
.footer-nav ul { list-style: none; font-size: 13px; line-height: 1.3em; padding-right: 15px; }
.footer-nav ul:last-child { padding-right: 0 }
.footer-nav ul li { margin-bottom: 8px; }
.footer-nav ul li a { text-decoration: none }
.footer-nav ul li a:hover { text-decoration: underline }
.footer-nav ul li a.footer-nav-head { font-size: 14px; font-weight: 600; color: #017DBB }

.footer-logos { padding: 20px 0; }
.footer-logos img { height: 70px; margin: 20px 20px; }
.footer-logos .inner { display: flex; justify-content: center; flex-wrap: wrap }

.footer-sign-off { padding: 20px 0; background-color: #017DBB; text-align: center }
.footer-sign-off ul { list-style: none }
.footer-sign-off h4 { color: #ffffff; font-size: 20px; }
.footer-sign-off p { font-size: 14px; color: #ffffff; }

ul.social-list { display: flex; justify-content: center; margin: 20px 0 40px }
ul.social-list li { margin: 0 10px; }
ul.social-list li a { width: 50px; height: 50px; border-radius: 50px; background-color: #ffffff; display: flex; align-items: center; justify-content: center; transition: 0.2s ease-out }
ul.social-list li a:hover { box-shadow: 0 0 0 3px #ffffff; }

.sign-off ul { display: flex; font-size: 14px; justify-content: center; margin-bottom: 20px; }
.sign-off ul li { border-right: 1px solid #ffffff; padding: 0 8px; }
.sign-off ul li a { color: #ffffff; text-decoration: none; }
.sign-off ul li a:hover { text-decoration: underline; }
.sign-off ul li:last-child { border: none; }

/* BUTTONS */
.btn { min-width: 210px; text-align: center; background-color: #017DBB; font-weight: 600; font-size: 16px; border-radius: 60px; display: inline-block; padding: 18px 15px; color: #ffffff; text-decoration: none; overflow: hidden; position: relative; transition: 0.2s ease-out; line-height: 1.2em; vertical-align: top; z-index: 2; }
.btn span { font-weight: 600; font-size: inherit; color: #ffffff; position: relative; z-index: 2; transform: translateY(-1px); display: block; }
.btn:after { background: rgb(1,125,187); background: linear-gradient(0deg, rgba(1,125,187,1) 0%, rgba(0,162,244,1) 100%); position: absolute; left: 0; top: 0; content: ''; width: 100%; height: 100%; transition: 0.2s ease-out; z-index: -1; }
.btn:hover:after { opacity: 0 }
.btn:hover { box-shadow: 0 0 0 2px #017DBB; }

.btn[disabled],
.paypal-button[disabled] { background-color: #999999; border-color: #999999; }

.btn[disabled]] { display: none; }

.btn[disabled]:hover { border-color: #666666; box-shadow: 0 0 0 1px #666666; }

.btn.working,
.paypal-button.working { color: transparent; position: relative; background-image: url("/_assets/working.gif"); background-size: 48px; background-position: center; background-repeat: no-repeat; }

.btn.working span,
.paypal-button.working span { color: inherit; background-color: transparent; }

.btn.working:after { visibility: hidden; opacity: 0; }
.btn.working:before { display: none; }

.paypal-button.working img { opacity: 0; visibility: hidden; }


.btn.cs-filter-btn {border: 3px solid #017DBB; transition: 0.5s ease-in; }
.btn.cs-filter-btn.active {border: 3px solid #0a1418; }



/* Blue */
.btn.secondary:after { background: rgb(82,82,82); background: linear-gradient(0deg, rgba(87,87,87,1) 0%, rgba(157,157,157,1) 100%); }

/* Brown */
.btn.tertiary:after { background: #ad8b25; background: linear-gradient(0deg, #ad8b25 0%, #dcae5b 100%); }

/* Green */
.btn.quaternary:after { background: #47ad25; background: linear-gradient(0deg, #47ad25 0%, #7bdc5b 100%); }



.btn-text { font-size: 16px; font-weight: 600; color: #017DBB; text-decoration: none; cursor: pointer; }

.btn-text.icon { position: relative; display: inline-flex; align-items: center; }
.btn-text.icon:after { width: 23px; height: 13px; background-image: url(/_assets/icons/icon-chevron-down.svg); background-size: cover; content: ''; margin-left: 6px; }

.basic-form .btn.btn-next { text-align: left; padding-left: 20px; padding-right: 42px; }
.btn-next:before { content: ""; position: absolute; z-index: 1; right: 20px; top: 50%; margin-top: -15px; width: 15px; height: 30px; background-image: url("/_assets/btn-arrow-white.png"); background-size: contain; background-position: center; background-repeat: no-repeat; }

.btn-prev { text-align: right; padding-left: 50px; padding-right: 20px; }
.btn-prev:before { content: ""; position: absolute; z-index: 1; left: 20px; top: 50%; margin-top: -15px; width: 15px; height: 30px; background-image: url("/_assets/btn-arrow-white.png"); background-size: contain; background-position: center; background-repeat: no-repeat; transform: rotate(180deg); }

.btn.auto-width { width: auto; min-width: initial; }

/* COOKIE BAR */ .cookieBar { width: 100%; background: url('/_assets/bg_cookiebar.png'); position: fixed; bottom: 0px; left: 0px; text-align: center; padding: 10px 10px; z-index: 99999999; box-sizing: border-box; -moz-box-sizing: border-box; }
.cookieBar p { color: #ffffff; font-size: 14px; font-family: inherit; line-height: 1.5em; text-align: center; display: inline-block; }
.cookieBar .acceptBtn { border: 0px; background: #000; border: 1px solid #DEDEDE; font-weight: bold; display: inline-block; margin-top: 6px; margin-left: 5px; font-family: inherit; font-size: 12px; padding: 5px 10px; text-decoration: none; color: #FFF; text-transform: uppercase; }


.basic-panel-2-col h6 { margin-top: 30px; }

.panel-section .tooltip { visibility: hidden; height: 0; overflow: hidden; }

/* IMAGE GALLERY */
.image-carousel-section { text-align: center }
.image-carousel-section h2 { margin-bottom: 30px; margin-top: 0 }

.full-image-container { background-color: /*rgba(0,20,56,.5)*/ rgba(0,0,0,.9); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); position: fixed; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; z-index: 99999; padding: 40px; opacity: 0; visibility: hidden; transform: translateY(30px); transition: 0.2s ease-out; }
.full-image-container.active { opacity: 1; visibility: visible; transform: translateY(0); }
.full-image-caption { color: #fff; margin-left: 10%; margin-top: 10px; }
.full-image-container .image-container { display: flex; justify-content: center }
.full-image-container .image-container img { width: 80%; }

.full-image-container .full-image-prev { position: absolute; left: 5%; transform: rotate(180deg); top: 46% }
.full-image-container .full-image-next { position: absolute; right: 5%; top: 46% }
.full-image-container .full-image-close { position: absolute; right: 5%; top: 5% }
.full-image-container .chevron { height: 2.5em; }
.full-image-close .chevron { height: 1.5em; }

.image-carousel-container .slide { padding: 15px; }
.image-carousel-container .slide img { width: 100%; height: 100%; object-fit: cover; }
.image-carousel-container .image-container { background-color: #ffffff; padding: 25px; border-radius: 20px; box-shadow: 0 0 8px rgba(0,0,0,0.2); }
.slider-controls { display: inline-flex; margin: 30px auto; width: auto; align-items: center }
.slider-controls ul { width: auto; margin: 0 10px }
.slider-controls ul li { margin: 0 10px; }

p.image-gallery-caption { margin: 15px 0 0 0; color: #2C2C2C; font-weight: 600 }

/* SLICK ARROW */
.slick-arrow { width: 14px; height: 25px; background-image: url(/_assets/icons/icon-chevron-slick.svg); background-size: cover; background-color: transparent; }
.slick-arrow.hero-prev { transform: rotate(180deg); }

/* CAROUSEL STYLE LISTING */
.listing-image-container.carousel .slick-dots li { background-color: #f1f1f1 }
.listing-image-container.carousel .slick-dots li.slick-active { background-color: #017DBB; }
.listing-image-container.carousel .slider-controls { margin: 30px auto; width: 100%; justify-content: center; }
.home-listing-item .listing-image-container.carousel .tic.listing-image { border-radius: 20px; }

/*
.image-carousel-container						{ position: relative; }
.image-carousel									{ position: relative; width: 80%; margin: auto; }

.image-carousel-container .dots-container,
.text-image-carousel-container .dots-container	{ position: relative; margin-left: auto; margin-right: auto; }
.image-carousel-container .slick-dots,
.text-image-carousel-container .slick-dots		{ position: relative; display: flex; justify-content: center; padding-left: 10px; padding-right: 10px; width: 100%; padding: 5px 0; }

.image-carousel-container ul.slick-dots li,
.text-image-carousel-container ul.slick-dots li	{ border: 2px solid #017DBB; margin: 0 5px; text-align: center; width: 15px; height: 15px; border-radius: 15px; }


.image-carousel-container .slick-arrow			{ position: absolute; top: 40%; -ms-transform: translateY(-50%); z-index: 5; background-color: transparent; font-size: 4em; }
.image-carousel-container .hero-prev			{ position: absolute; left: 5%; transform: rotate(180deg) translateY(50%); background: #3ea9f4; padding: 5px; }
.image-carousel-container .hero-next			{ position: absolute; right: 5%; transform: translateY(-50%); background: #3ea9f4; padding: 5px;}
.image-carousel-container .chevron				{ height: 0.8em; }

.image-carousel-container .slide				{ padding: 0 5px; position:relative; display:flex; justify-content:center; flex-direction:column; }
.image-carousel-container .slick-track			{ padding: 0 5px; position:relative; }
.image-carousel-container .slide img			{ display: block; margin:auto; width:100%; height: 100%; object-fit: cover}
.image-carousel-container .image-container		{ position: relative; display: flex; justify-content: flex-end; flex-direction: column; background-color: #ffffff; border-radius: 20px; padding: 20px;}

.listing-image-container.carousel				{ width: 50%; position: relative; overflow: hidden; border-top-right-radius: 20px; border-bottom-right-radius: 20px; background-color: #eeeced; }
.listing-image-container .slick-dots			{ margin-top: 5px; }
*/


/* ACCORDIAN ITEMS*/
.accordion-item { margin-bottom: 6px; border-bottom: 1px solid #DEDEDE; }
.accordion-item h2 { font-size: 18px; color: #585858; background-color: #ffffff; position: relative; cursor: pointer; line-height: 1.4em; padding-bottom: 10px; padding-top: 10px; padding-left: 39px; }
.accordion-item h2 span.plus { width: 19px; height: 19px; display: inline-block; position: absolute; vertical-align: middle; margin-right: 15px; top: 13px; left: 0 }
.accordion-item h2 span.plus:before { width: 3px; height: 100%; background-color: #3ea9f4; position: absolute; left: 8px; top: 0; content: ''; transition: 0.3s ease-out }
.accordion-item h2 span.plus:after { width: 3px; height: 100%; background-color: #3ea9f4; position: absolute; left: 8px; top: 0; content: ''; transform: rotate(90deg); }
.accordion-item.active h2 span.plus:before { opacity: 0; visibility: hidden; transform: rotate(90deg); }
.accordion-expanded { display: none; padding: 10px 39px 35px; }
.accordion-expanded p:last-child { margin-bottom: 0; }

.hide { display: none; }

.home-listing-item .listing-text .postcode-error { padding: 20px; background-color: #fbccd0; }
.home-listing-item .listing-text .postcode-error p a,
.home-listing-item .listing-text .postcode-error p { font-weight: 700; margin-bottom: 0px; color: #ea1223; transition: 0.2s ease-out; }
.home-listing-item .listing-text .postcode-error p a:hover { text-decoration: none; transition: 0.2s ease-out; }

#cpBody_pnlDiagnosis { display: contents; }
#cpBody_pnlServiceTypes { width: 100%; }
#cpBody_pnlBrandsAndModels { display: block; width: 100%; }

.mandatory-error { padding: 20px; background-color: #fbccd0; width: 100%; }
.mandatory-error p a,
.mandatory-error p { font-weight: 700; margin-bottom: 0px; color: #ea1223; transition: 0.2s ease-out; }
.mandatory-error p a:hover { text-decoration: none; transition: 0.2s ease-out; }

input[type="radio"] + label { font-weight: 600; color: #727272; margin: 0 0 0 8px; }

.form-cell.checkbox label.container { margin-top: 0; }




/* FORMS */
.basic-form { }

.basic-form .form-element { margin: 30px 0px 20px 0px; }

.basic-form h1 { font-size: 35px; font-weight: 800; margin-bottom: 1em; }
.basic-form .inner { width: 100%; max-width: 650px; text-align: center; }
.basic-form .question { margin-bottom: 25px; }
.basic-form .question p { font-weight: 600; font-size: 20px; color: #2C2C2C }
.basic-form .question p span { font-size: 40px; color: #3EA9F4; font-weight: 800; margin-right: 6px; }
.basic-form .answers { border-top: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6; margin-bottom: 20px; padding: 20px 0; min-height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.basic-form .buttons { display: flex; justify-content: space-between }
.basic-form .buttons.buttons-one { justify-content: center }
.basic-form .btn { min-width: 150px; width: auto; max-width: 100%; padding-left: 20px; padding-right: 20px; }
.basic-form .container { margin-top: 25px; }

.basic-form .faux-btn { border: 1px solid #D8D8D8; padding: 13px 15px; background: linear-gradient(180deg, #ffffff 0%, #EFEFEF 100%); display: block; width: 100%; border-radius: 5px; font-size: 16px; color: #646464; font-weight: 600; margin-bottom: 10px; cursor: pointer; }
.basic-form .faux-btn:hover { background: #efefef; }
.basic-form .faux-btn.active { opacity: 1 }
.basic-form .faux-btn.inactive { opacity: 0.5 }

.basic-form input[type='text'],
.basic-form input[type='password'] { color: #767676; font-size: 16px; font-weight: 600; padding: 13px 20px; border: 1px solid #D8D8D8; width: 100%; border-radius: 5px; text-align: center; transition: 0.2s ease-out; }

.basic-form input[type='text']:focus,
.basic-form input[type='password']:focus { box-shadow: 0 0 0 2px #D8D8D8; }

.basic-form textarea { color: #767676; font-size: 16px; font-weight: 600; padding: 13px 20px; border: 1px solid #D8D8D8; width: 100%; border-radius: 5px; text-align: left; transition: 0.2s ease-out; }
.basic-form textarea:focus { box-shadow: 0 0 0 2px #D8D8D8; }

.basic-form label { color: #5C5C5C; font-size: 16px; line-height: 1.4em; margin: 10px 0px; display: inline-block; font-weight: 600; }

.basic-form .select-css { margin-bottom: 10px; }

.basic-form.quote-section .buttons { margin-top: 30px; }

.basic-form.quote-section .buttons:not(.inline) a,
.basic-form.quote-section .buttons:not(.inline) button { flex-basis: 30%; }

.basic-form.quote-section .buttons.wide a,
.basic-form.quote-section .buttons.wide button { flex-basis: 40%; }

.basic-form.quote-section .buttons.right { justify-content: end; }
.basic-form.quote-section .buttons.center { justify-content: center; }

/*.basic-form .checkbox {display: block; padding: 14px 0px 8px 0;}

.basic-form .checkbox label {margin: 5px;}
.basic-form input[type='checkbox'] {width: 25px; height: 25px; position: relative; top: -6px; margin-left: 10px; }

.basic-form .checkbox.small label {font-size: 14px;}*/
.basic-form .form-element .checkbox label { margin: 0; }

.asr .basic-form .form-element .checkbox label { margin: 0; padding-left: 5px; font-size: 14px; }

.checkbox,
.radio-button { display: flex; flex-direction: row; align-items: top; }

.checkbox.align-left span {margin-right: 10px;}

.checkbox input[type=checkbox],
.radio-button input[type=radio] { width: 20px; height: 20px; position: relative; margin-right: 4px; }

.checkbox.small label,
.radio-button.small label { font-size: 14px; }

input[type=radio] { width: 25px; height: 25px; flex-shrink: 0; }

.radio-button-list { }
ul.radio-button-list { list-style: none; margin: 0 !important; }
.radio-button-list li { display: flex; align-items: center; margin-bottom: 15px !important; }

.basic-form :not(.form-element).error { background-color: #ffe0e0; }

.basic-form .form-element.error { margin-bottom: 7px; }

.basic-form .form-element.error select,
.basic-form .form-element.error input[type=text],
.basic-form .form-element.error input[type=password],
.basic-form .form-element.error textarea { background-color: #ffe0e0; margin-bottom: 5px !important; }

.basic-form .form-element.error input[type=radio] + label { color: #cc0000; }

.basic-form .form-element .form-field-error { font-size: 13px; color: #CC0000; font-weight: 500; text-align: left; }


.basic-form .form-element.centered-buttons { display: flex; justify-content: space-between; font-size: 0; text-align: center; margin-top: 30px; margin-bottom: 0; }

.basic-form .form-element.centered-buttons a,
.basic-form .form-element.centered-buttons button,
.basic-form .form-element.centered-buttons input[type=button],
.basic-form .form-element.centered-buttons input[type=submit] { /*margin-right: 20px;*/ }

.basic-form .form-element.centered-buttons a:last-child,
.basic-form .form-element.centered-buttons button:last-child,
.basic-form .form-element.centered-buttons input[type=button]:last-child,
.basic-form .form-element.centered-buttons input[type=submit]:last-child { margin-right: 0; }

p.information { font-size: 11px; font-weight: 600; text-align: left; margin-top: 5px; color: #017DBB }
p.information:before { content: "i"; display: inline-flex; width: 1.3em; height: 1.3em; background-color: #017DBB; color: #ffffff; border-radius: 100%; align-items: center; justify-content: center; margin-right: 5px; }

.form-element.radio-choice > label { display: block; margin-bottom: 10px; color: #707070; }
.form-element.radio-choice > span label { margin-right: 30px; color: #707070; }
.form-element.radio-choice > span label:last-of-type { margin-right: 0; }


.answers .top-results tr th p { font-weight: 800; }
.answers .top-results tr td p { font-weight: 600; margin-bottom: 0; }

.answers .botton-results tr th p { font-weight: 800; margin-top: 15px; }
.answers .botton-results tr td p { font-weight: 600; margin-bottom: 0; }
.answers .botton-results tr td.heading p { font-weight: 800; font-size: 18px; }

.answers .form-cell.checkbox { width: 100%; }
.answers .form-cell.checkbox label.container { float: left; margin-left: 55px; margin-bottom: 8px; }




.form-errors { margin: 20px 0; padding: 0; }
.form-errors ul { display: inline-block; margin: 0 auto; max-width: 350px; }
.form-errors li { color: #cc0000; font-size: 13px; margin: 5px 0; line-height: 1.3em; }

.quote-section .form-element { font-size: 0; }

/** UPLOAD **/
.basic-form .upload-files .btn.upload-file { background-color: #E5ECF3; border: none; font-weight: 500; color: #017dbb; }
.basic-form .upload-files .btn.upload-file:hover { background-color: #b6cfe9; color: #0041b7; position: relative; }
.basic-form .upload-file { position: relative; margin-top: 10px; }
.basic-form .upload-file:after { content: ""; background-image: url(/_assets/icon-upload.png); width: 20px; height: 20px; position: absolute; right: 20px; background-size: contain; top: calc(50% - 10px); z-index: 3000; background-repeat: no-repeat; left: auto; }
.basic-form .icon-del-cv { background-image: url(/_assets/icon-close-black.png); width: 15px; height: 15px; display: inline-block; background-size: contain; background-repeat: no-repeat; margin-left: 15px; position: relative; top: 3px; }
.basic-form .btn:hover:after { opacity: 1; }
.basic-form .upload-files .btn span { margin-top: 10px; color: #017dbb; }

.home-hero-text.search-results { width: 100%; }
.title:hover { text-decoration: underline; }

.search-results span.title { display: block; color: #3EA9F4; font-weight: 600; }
.search-results a { text-decoration: none; }
.search-results a:hover { text-decoration: none; }
.search-results a:hover span.title { text-decoration: underline; }

/* 404 */
.pnf { padding: 80px 0; background: linear-gradient(0deg, #ffffff 0%, #EFEFEF 100%); }
.pnf .inner { width: 800px; text-align: center; max-width: 100%; }
.pnf h1 { font-size: 40px; }

/* CAPTCHA */
.g-recaptcha div { margin: auto; }

.content { display: flex; flex-direction: row; align-content: start; position: relative; }
.content .left { flex-basis: 25%; flex-shrink: 0; padding-right: 20px; }
.content .left img { width: 100%; }
.content .right { flex-basis: 100%; padding-left: 0; }

.content .product-image { margin: 0; padding-right: 40px; }
.content .product-image img { width: auto; height: 100%; max-height: 250px; }

.content h2.title:hover { text-decoration: none; }


.address-title { font-size: 18px; line-height: 1.3em; margin-bottom: 0; color: #017DBB; font-weight: bold; text-align: left; }
.address-title + .form-element { margin-top: 20px; }


.service-confirm-panel .confirm-panels-container { margin-top: 100px;}

.service-confirm-panel .content { padding-top: 20px; width: 100%; flex-direction: column; }
.service-confirm-panel .content .heading { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; margin: 0 0 10px 0; width: 100%; }

.service-confirm-panel .content .heading .title { flex-basis: 80%; font-size: 21px; margin: 0; line-height: 1.2em; }
.service-confirm-panel .content .heading .price { width: 20%; font-size: 21px; text-align: right; display: inline-block; line-height: 1.2em; }

.service-confirm-panel .content .details { margin: 0; }
.service-confirm-panel .content .details .copy { display: none; }

.service-confirm-panel .deposit-message { margin: 20px 0; }
.service-confirm-panel .deposit-message p { font-weight: bold; }
.service-confirm-panel .deposit-message p:last-child { margin-bottom: 0; }
.service-confirm-panel .deposit-message p span { color: #017DBB; }

.btn-link { background-color: transparent; font-size: 14px; color: #707070; text-decoration: underline; cursor: pointer; }


.service-confirm-panel .content .service-total { margin-bottom: 20px; }

.service-confirm-panel .content .btn-remove-item { top: 0; }

.service-confirm-panel .content .basic-form .btn { width: 260px; }

.service-confirm-panel .confirm-panel hr { border-color: #3ea9fe; margin: 20px 0 20px 0; }


.quote-section { }

.quote-section .section-title { font-size: 34px; margin: 0 0 20px 0; }

.inc-vat { font-size: 100%; }

/* Service Breadcrumbs */

.service-breadcrumbs { margin: 0 0 20px 0; position: relative; }
.service-breadcrumbs:before { }

.service-breadcrumbs ul { display: flex; flex-direction: row; width: 100%; list-style: none; margin: 0; max-width: initial; }

.service-breadcrumbs ul li { position: relative; }
.service-breadcrumbs ul li.crumb:not(:first-child):before { content: ""; position: absolute; display: block; width: 35%; right: 50%; margin-right: 15px; top: 15px; border-top: 2px solid #3398D3; }
.service-breadcrumbs ul li.crumb:not(:last-child):after { content: ""; position: absolute; display: block; width: 35%; left: 50%; margin-left: 15px; top: 15px; border-top: 2px solid #3398D3; }

.service-breadcrumbs ul li.crumb { flex-basis: 10%; flex-shrink: 0; flex-grow: 0; position: relative; }
.service-breadcrumbs ul li.crumb .mark { margin: 0 auto; width: 30px; height: 30px; border-radius: 30px; border: 2px solid #017DBB;  }
.service-breadcrumbs ul li.crumb .mark.current { background-color: #3398D3; }

.service-breadcrumbs ul li.crumb label { font-size: 11px; font-weight: normal; color: #000000; margin: 10px 0 0 0; line-height: 1.2em; }

.service-breadcrumbs ul li.divider { flex-basis: 10%; }
.service-breadcrumbs ul li.divider:before { content: ""; position: absolute; display: block; width: 100%; left: 0; top: 15px; border-top: 2px solid #3398D3; }

.service-breadcrumbs ul li.crumb a { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 2; }
.service-breadcrumbs ul li.crumb a:hover { background-color: rgba(0, 0, 0, 0.05); box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.05); border-radius: 10px; }

/* Service Plan Information */
.quote-information-container { display: flex; flex-direction: row; margin-top: 20px; }

.quote-information-container .left { flex-basis: 100%; }
.quote-information-container .right { padding-left: 20px; }
.quote-information-container .btn-prev { min-width: initial; width: auto; }

table.quote-information { margin: 0; padding: 0; width: 100%; border: 0; }

table.quote-information tr td { padding: 5px 0; vertical-align: top; line-height: 1.3em; font-size: 14px; font-weight: bold; }
table.quote-information tr td.label { color: #3398d3; font-size: 14px; font-weight: bold; white-space: normal; width: 10%; min-width: 140px; padding-right: 20px; }

table.quote-information tbody tr:first-child td { padding-top: 0; }
table.quote-information tbody tr:last-child td { padding-bottom: 0; }

table.quote-information tbody tr td.divider { padding: 15px 0; }
table.quote-information tbody tr td.divider hr { border-width: 1px; border-color: #3398D3; }

table.quote-information tbody tr td.divider2 hr { border-width: 1px; border-color: #3398D3; border-style: dotted; }


table.quote-information th { font-size: 24px; color: #3398d3; padding-bottom: 10px; border-bottom: 1px solid #3398d3; margin-bottom: 10px; text-align: left; }

table.quote-information thead + tbody tr:first-child td { padding-top: 10px; }

.current-service-requests { margin-bottom: 30px; }

.current-service-requests h3.title { margin: 0 0 20px 0; font-size: 20px; line-height: 1.2em; text-decoration: none; }

.current-service-requests .current-service-request { position: relative; }

.current-service-requests .current-service-request > div { display: flex; flex-direction: row; margin-top: 10px; }

.current-service-requests .current-service-request label { display: inline-block; line-height: 1.2em; flex-basis: 30%; flex-shrink: 0; align-content: start; text-align: left; margin: 0; color: #3398D3; font-weight: bold; font-size: 14px; }
.current-service-requests .current-service-request span { display: inline-block; line-height: 1.2em; flex-basis: 80%; align-content: start; padding: 0 40px 0 10px; text-align: left; font-size: 14px; }

.current-service-requests .current-service-request .btn-remove-item { width: 20px; height: 20px; top: -10px; }

/* Service Plan Panel */
.service-plan-panel { position: relative; margin-top: 30px; }

.service-plan-panel .flash { position: absolute; top: -4px; left: calc(100% - 164px); width: 168px; height: 168px; }

.service-plan-panel .flash .flash-text { position: absolute; top: 0; left: 58px; transform: rotate(45deg); transform-origin: top left; width: 156px; text-align: center; line-height: 1.1em; color: #ffffff; font-size: 14px; height: 41px; display: flex; align-items: center; justify-content: center; font-weight: 700; }

/*.service-plan-panel .content { display: flex; flex-direction: row; align-content: start; position: relative; }

.service-plan-panel .content .left { flex-basis: 300px; flex-shrink: 0; }
.service-plan-panel .content .left img { width: 100%; }

.service-plan-panel .content .right { flex-basis: 100%; padding-left: 20px; }*/

.service-plan-panel h2.title { font-size: 23px; color: #3EA9F4; margin-bottom: 1em; padding-right: 80px; }
/*.service-plan-panel h2.title:hover { text-decoration: none; }*/

.service-plan-panel .intro { font-weight: 700; margin-bottom: 20px; }
.service-plan-panel .intro .using-promo-code {color: #d945d4;}

.service-plan-panel .specifications { margin: 20px 0; }

.service-plan-panel .specifications ul { width: 100%; }
.service-plan-panel .specifications ul li { font-size: 16px; line-height: 1.4em;}

.service-plan-panel .footer { font-weight: 400; }

.service-plan-panel .service-price { margin: 20px 0 20px 0; }
.service-plan-panel .price { font-size: 41px; font-weight: bold; color: #3EA9F4; margin-right: 10px; }

.service-plan-panel .price.nm {margin-right: 0px;}
.service-plan-panel .inc-vat {line-height: 1.2em;}

.cross-out { position: relative; display: inline-block; }

.cross-out svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: rotate(15deg); }
.cross-out svg line { stroke: #707070; stroke-width: 8; stroke-linecap: round; }

.price.cross-out { font-size: 30px !important; color: #707070;}

.service-plan-panel .buttons { margin-top: 30px; width: auto; display: inline-flex; flex-direction: column; align-items: center; }

.service-plan-panel .buttons button:not(.btn-prev),
.service-plan-panel .buttons a.btn-next { margin-bottom: 20px; width: 100%; padding-right: 60px; }

.service-plan-panel .buttons button.btn-prev { margin-bottom: 20px; width: 100%; padding-left: 60px; }

.service-plan-panel .buttons button:last-child { margin-bottom: 0; }
.service-plan-panel .buttons .or { margin-bottom: 20px; }

.service-plan-panel .buttons.inline { width: 100%; flex-direction: row; justify-content: flex-start; }
.service-plan-panel .buttons.inline button { width: auto; margin-bottom: 0; white-space: nowrap; flex-shrink: 0; }
.service-plan-panel .send-quote-link { flex-basis: 60%; padding-left: 30px; display: flex; flex-direction: row; }
.service-plan-panel .send-quote-link a { padding-left: 20px; }



.price.cross-out2 { font-size: 30px !important; color: #707070; margin-right: 0; }
.cross-out2 { position: relative; display: inline-block; }
.cross-out2 svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: rotate(0deg); }
.cross-out2 svg line { stroke: #FF0000; stroke-width: 8; stroke-linecap: round; }

.service-new-flash-banner.purple { color: #FFFFFF; background-color: #C50B9D; }
.service-new-flash-banner.green { color: #000000; background-color: #92D050; }

.line1 						{font-size: 15px}

.line2 						{margin-top: 10px; font-size: 15px;}
.line1 .service-retail-price,
.line2 .service-your-price 	{font-weight: 700; display: block; margin-bottom: 5px; margin-top: 20px; font-size: 15px; }
.line2 .service-price 		{font-size: 41px; font-weight: bold; color: #3EA9F4; margin-right: 2px;}

.line1 .service-vat,
.line2 .service-vat {font-size: 13px;}


/* Extras */

.extra-panel { margin-top: 30px; }

.extra-group-panel { padding: 30px;  margin-top: 30px;}
.extra-group-panel .group-title { margin: 0 0 20px 0; font-size: 32px; }

.extra-group-panel .extra-panel { /*padding: 20px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.16 ); border-radius: 20px;*/ background-color: transparent; margin: 0; }
.extra-group-panel hr.grouped-extra-divider { border-color: #999999; border-width: 1px; margin: 25px 0 25px 0; }

.extra-panel .button-option { margin-top: 20px; }

.extra-panel.filter-subscriptions h2.title { font-size: 32px; color: #707070; }

.extra-panel h2.title { font-size: 18px; margin: 0 0 0.75em 0; }

.extra-panel .price { font-size: 36px; font-weight: bold; color: #707070; margin-right: 10px; }
.extra-panel .extra-price { margin: 20px 0 30px 0; }

.service-extras-section .buttons { margin-top: 40px; text-align: center; font-size: 0; }

/*.service-extras-section .buttons a { margin-right: 20px; }*/

/* Confirm */

.confirm-panel { margin-top: 30px; }

.confirm-panel h2.title { font-size: 20px; color: #017DBB; margin: 0 0 1em 0; padding-right: 50px; }
.confirm-panel .price { font-size: 36px; font-weight: bold; color: #707070; }
.confirm-panel .included { font-size: 20px; font-weight: bold; color: #707070; }
.confirm-panel .invoiced-tas { font-size: 14px; font-weight: bold; color: #707070; text-align: right; }

.conform-panel .right { position: relative; }


.service-confirm-panel .service-total { margin: 40px 0 0 0; font-size: 24px; font-weight: bold; color: #707070; text-align: right; padding-right: 00px; }

.service-confirm-panel .buttons { margin-top: 30px; padding-right: 0px; align-items: center; }

/*.service-confirm-panel .buttons .btn-prev { }*/

.service-confirm-panel .add-another { margin-top: 30px; padding-right: 0px; text-align: right; }
.service-confirm-panel .add-another p { font-size: 16px; font-weight: bold; color: #3ea9fe; text-align: center; }

.service-confirm-panel .filter-subscription { margin: 0 0 20px 0; }
.service-confirm-panel .filter-subscription p { font-weight: bold; font-size: 14px; }

/*.btn-book-and-pay { font-size: 20px; width: 260px !important; margin: 20px 0px; }*/


.btn-forgot-password { margin-top: 20px; font-weight: bold; color: #707070; font-size: 14px; display: inline-block; }


/* Register */

.register-panel .invoice-address { margin-top: 30px; }
.register-panel .unit-address { margin-top: 40px; }

.register-panel .unit-address .panel-title label { color: #017DBB; margin: 0 0 0.75em 0; }

.register-panel .unit-service-address { display: none; }



/* Select Address */

.add-new-address { margin-top: 30px; }

button.link { background-color: transparent; padding: 0; text-decoration: underline; color: #707070; }

.new-address { display: none; padding-top: 20px; }

/* Useful Information */

.useful-information-panel table.quote-information { margin-top: 40px; }
.useful-information-panel hr { margin: 30px 0; border-color: #000000; }

.useful-information-panel textarea { height: 120px; max-width: 100%; min-width: 100%; }

/* Confirm and Pay */

.confirm-and-pay-panel h2.unit-number,
h2.info-title { font-size: 24px; margin: 0 0 10px 0; color: #3398d3; padding-bottom: 7px; border-bottom: 1px solid #3398d3; margin-bottom: 10px }

.confirm-and-pay-panel .service-item:first-child { margin-top: 20px; }

.confirm-and-pay-panel table.quote-information tbody tr td.divider { padding: 0px 0; }
.confirm-and-pay-panel table.quote-information tbody tr td.divider hr { margin: 10px 0; }

.confirm-and-pay-panel ul.extras { width: auto; font-size: 14px; font-weight: bold; margin-bottom: 0; }

.confirm-and-pay-panel .service-item,
.confirm-and-pay-panel .address,
.confirm-and-pay-panel .amount { margin-top: 30px; }

.confirm-and-pay-panel table.quote-information tr td.total { font-size: 28px; }

.confirm-and-pay-panel table.total-today { margin: 20px 0; box-shadow: 0 0 1px 1px #000000; border-radius: 5px;  }

.confirm-and-pay-panel table.total-today td.deposit-information { padding: 10px 10px 30px 10px; text-align: left; color: #3398D3; font-size: 16px; font-weight: bold; line-height: 1.3em; }

.confirm-and-pay-panel table.total-today td { padding: 0 10px; font-weight: bold; font-size: 24px; }

.confirm-and-pay-panel table.total-today tbody tr:last-child td { padding-bottom: 20px; }
.confirm-and-pay-panel table.total-today td.label { color: #3398D3; font-weight: bold; font-size: 24px; width: 100%; }
.confirm-and-pay-panel table.total-today td.value { text-align: right; }

.confirm-and-pay-panel .promo-code-panel { margin-top: 40px; }

.confirm-and-pay-panel .send-quote-option { margin-top: 40px; text-align: left; }

.promo-code-panel .promo-code-field,
.promo-code-panel .promo-code-remove { border: 1px solid #707070; border-radius: 5px; display: flex; flex-direction: row; padding: 10px; }

.promo-code-field .promo-code-field-input.form-element { flex-basis: 100%; margin: 0; }
.promo-code-field input[type=text] { text-align: left; border: 0; padding: 13px 10px; width: 100%; margin-bottom: 0; }
.basic-form .promo-code-panel button.btn { margin-left: 20px; font-size: 14px; width: auto; min-width: 110px; padding: 10px 15px; }



.promo-code-panel .current-promo-code { flex-basis: 100%; display: flex; flex-direction: row; align-items: center; }
.promo-code-panel .current-promo-code label { margin: 0 10px 0 0; color: #3398de; font-size: 14px; font-size: 16px; }
.promo-code-panel .current-promo-code span { font-weight: bold; font-size: 14px; }

.confirm-terms-panel { margin-top: 50px; }


.payment-method-section { margin-top: 30px; }

.payment-method-section .payment-method-container { margin-top: 20px; }

.payment-method-section h3.selectable { background-color: #3398D3; padding: 5px 50px 5px 14px; display: flex; align-items: center; font-size: 0px; cursor: pointer; position: relative; margin: 0; }
.payment-method-section h3.selectable label { color: #ffffff; flex-basis: 100%; margin: 0; text-align: left; cursor: inherit; }
.payment-method-section h3.selectable span.logo-container { width: 100px; height: 30px; background-color: #ffffff; margin-left: 20px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border-radius: 5px; }
.payment-method-section h3.selectable img.logo { height: 20px; width: auto; font-size: 12px; display: inline-block; margin: 0; }

.payment-method-section h3.selectable:after { content: ""; position: absolute; top: 50%; margin-top: -10px; right: 14px; width: 10px; height: 20px; background-image: url("/_assets/btn-arrow-white.png"); background-size: contain; background-position: center; background-repeat: repeat; transition: all 0.2s; transform-origin: center; }
.payment-method-section .payment-method-choice.selected h3.selectable:after { transform: rotate(90deg); }

.payment-method-section .card-holder-details { display: none; padding: 10px 0 1px 0; }

.payment-method-section .card-holder-details-container { margin-top: 20px; }
.payment-method-section .card-holder-details-container h2 { font-size: 18px; color: #3398D3; }

.payment-method-options { padding-top: 10px; }

.payment-method-options.paypal p { font-weight: bold; color: #3398D3; }

.payment-method-options .buttons { margin-top: 20px; text-align: center; justify-content: center; }

.paypal-button { flex-basis: auto!important; background-color: #ffc43a; font-size: 13px; color: #000000; line-height: 1em; padding: 16px 24px; width: auto; transition: 0.2s ease-out; display: flex; align-items: center; border-radius: 10px; }
.paypal-button span { font-size: 16px; font-weight: bold; margin-right: 20px; line-height: 1.2em; }
.paypal-button img { height: 30px; width: auto; margin: 2px 0 0 0; }

.card-details .errors { margin: 10px 0; padding: 0 20px; }
.card-details .errors ul { width: 100%; }
.card-details .errors ul li { font-size: 13px; color: #cc0000; line-height: 1.3em; }

/* Checkout Complete */

.checkout-complete-section .booking-reference { text-align: center; margin-top: 40px; }

.checkout-complete-section .booking-reference h3.title,
.checkout-complete-section .booking-reference h3.description { font-size: 18px; }

.checkout-complete-section .booking-reference .lozenge { background-color: #707070; color: #ffffff; font-weight: bold; font-size: 18px; width: 100%; max-width: 240px; margin: 0 auto; padding: 10px 20px; border-radius: 20px; }


.resume-section hr.service-extras-divider { margin: 30px 0; border-width: 2px; border-color: #017DBB; }

.resume-section table.extras-information { width: 100%; }

.resume-section table.extras-information td { padding: 0 0 10px 0; line-height: 1.2em; font-size: 14px; vertical-align: top; }
.resume-section table.extras-information td.title { color: #017DBB; font-weight: bold; padding-right: 20px;  }

.resume-section table.extras-information tr:last-child td { padding-bottom: 0; }

.resume-section .quote-expired { margin-top: 30px; border-top: 2px solid #017DBB; padding-top: 30px; }
.resume-section .quote-expired p { font-size: 18px; font-weight: bold; color: #3598db; }

/* POPUP */
.popup-background { position: fixed; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(0,0,0,0.75); z-index: 99; display: block; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); overflow-y: auto; }
.popup-outer { position: relative; width: 768px; max-width: calc(100% - 40px); left: 50%; transform: translateX(-50%); top: 80px; }
.popup-content { position: absolute; background-color: #ffffff; font-size: 0; z-index: 100; box-shadow: 0 0 50px rgba(0,0,0,0.5) }
.scroll-content { max-height: 100%; overflow-y: auto; padding-right: 50px; }
.popup-background .close { position: absolute; right: 30px; top: 30px; z-index: 110 }

.scroll-content::-webkit-scrollbar { width: 20px; }
.scroll-content::-webkit-scrollbar-track { background: #ccc; border-left: 9px solid #f0f0f0; border-right: 9px solid #f0f0f0; /* BORDER LEFT AND RIGHT NEED TO MATCH THE PARENT BG COLOUR */ }
.scroll-content::-webkit-scrollbar-thumb { background: #ccc; border-left: 5px solid #f0f0f0; border-right: 6px solid #f0f0f0; }

.popup-content .cols { display: flex; }
.popup-content .col { width: 50%; background-size: cover; background-position: bottom; background-color: #ffffff; }
.popup-content .col-left { padding: 40px; }
.popup-content h1 { font-size: 35px; color: #102559;}
.popup-content .col-left h2 { font-size: 20px; text-transform: none; margin-bottom: 0.65em; color: #102559; }
.popup-content .col-left p { font-size: 14px; color: #102559;}
.popup-content .btn { font-size: 14px; padding: 15px 30px; min-width: unset; margin-top: 5px }
.popup-content input[type='text'] { padding: 15px 20px; font-size: 16px; width: 100%; border: 1px solid #ddd; }

.popup-content select { padding: 10px 20px; font-size: 16px; width: 100%; border: 1px solid #ddd; }

.popup-content.split .col-right { position: relative; }
.popup-content.split .col-right:before { position: absolute; left: 0; top: 0; width: 30%; height: 100%; content: ''; display: block; background: rgb(255,255,255); background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); }

.popup-content .grad-header { padding-top: 0; margin-bottom: 20px; }
.popup-content .grad-header h1 { text-align: left; margin-bottom: 0; color: #102559; }

.popup-overlay-product h1 { font-size: 32px; }
.popup-overlay-product .popup-content.split .col-right:before { display: none }
.popup-overlay-product .cols .col-right { display: inline-flex; align-items: center; }

.popup-form-container { position: absolute; width: 100%; top: 10vh; left: 0; }

.popup-form { width: 100%; max-width: 600px; margin: 0 auto; background-color: #ffffff; position: relative; }

.popup-form.w800 { max-width: 800px; }

.popup-form.scrollable { max-height: 80vh; overflow-x: hidden; overflow-y: auto; }

.popup-form .title { padding: 10px 20px; font-size: 24px; font-weight: bold; background-color: #56d8c9; color: #ffffff; }

.popup-form.scrollable .title { position: sticky; top: 0; z-index: 2; }

.popup-form .content { padding: 20px; display: block; }

.popup-form .content p:last-child { margin-bottom: 0; }

.popup-form .buttons { border-top: 1px dotted #cccccc; padding: 5px 20px 10px 20px; display: flex; flex-direction: row; justify-content: center; text-align: center; background-color: #ffffff;  }
.popup-form .buttons.more-padding { padding: 15px 20px; }

.popup-form.scrollable .buttons { position: sticky; bottom: 0; width: 100%; }

.popup-form .buttons.flex { display: flex; flex-direction: row; }

.popup-form .buttons a,
.popup-form .buttons button,
.popup-form .buttons input[type=button],
.popup-form .buttons input[type=submit] { margin-right: 10px; margin-top: 5px; width: auto; min-width: initial; padding-left: 30px; padding-right: 30px; }


.popup-form .buttons.flex a,
.popup-form .buttons.flex button,
.popup-form .buttons.flex input[type=button],
.popup-form .buttons.flex input[type=submit] { flex-basis: 50%; }

.popup-form .buttons a:last-child,
.popup-form .buttons button:last-child,
.popup-form .buttons input[type=button]:last-child,
.popup-form .buttons input[type=submit]:last-child { margin-right: 0; }

.hidden { height: 0; opacity: 0; transition: 1s ease-in-out; }
.fadein { height: 100%; opacity: 1; visibility: visible; }

.hidden .popup-overlay { height: 0; }
.fadein .popup-overlay { height: 100%; }

.home-listing-item .listing-text .hrv-buttons,
.home-hero-text .hrv-buttons { display: inline-flex; flex-wrap: wrap; margin-bottom: 0; width: 100%; }

.home-listing-item .listing-text .hrv-buttons .btn { margin-top: 5px; margin-right: 15px; }
.home-hero-text .hrv-buttons .btn { margin-top: 5px; margin-right: 15px; }

.home-listing-item .listing-text .hrv-buttons .btn:last-child { margin-right: 0; }
.home-hero-text .hrv-buttons .btn:last-child { margin-right: 0; }
/*.hrv-buttons .btn ~ .btn { margin-top: 5px; }*/


section.annual-reminder-search { border-bottom: 1px solid #f0f0f0; padding-bottom: 20px; margin-bottom: 20px; }

section.annual-reminder-search .search-panel { display: flex; flex-flow: row; }

section.annual-reminder-search .search-input { padding-top: 5px; margin: 0 10px 0 0; width: 100%; max-width: 400px; }
section.annual-reminder-search .search-panel input[type=text] { text-align: left; }
section.annual-reminder-search .search-panel button { margin-left: 10px; white-space: nowrap; width: auto; min-width: 140px; max-height: 55px; }

section.annual-reminder-results .no-results p { font-size: 22px; margin: 0; font-weight: 600; }

table.data-table { border: 1px solid #333333; margin: 20px 0; width: 100%; }

table.data-table thead tr { position: sticky; top: 0; }

table.data-table th,
table.data-table td { padding: 8px; text-align: left; font-size: 15px; }

table.data-table th.sort-column { padding: 0; }


table.data-table th { background-color: #333333; color: #ffffff; padding-top: 10px; padding-bottom: 10px; border-right: 1px solid #999999; border-bottom: 1px solid #999999;  }
table.data-table th:last-child { border-right: none; }

table.data-table td { border-right: 1px solid #e0e0e0; border-bottom: 1px solid #d0d0d0; }
table.data-table tbody tr td:last-child { border-right: none; }

table.data-table tbody tr:last-child td { border-bottom: none; }

.align-right { text-align: right!important; }
.align-center { text-align: center!important; }

table.stripped tbody tr:nth-child(even) { background-color: #f0f0f0;}

table.clickable td { cursor: pointer; }
table.clickable tr:hover td { background-color: #e0e0e0; border-color: #c0c0c0;  }

.btn-sort { padding: 8px; background-color: inherit; color: inherit; width: 100%; text-align: left; cursor: pointer; transition: all 0.2s; }
.btn-sort:hover { background-color: #f0f0f0; color: #000000; }

.btn-sort.sort-desc,
.btn-sort.sort-asc { padding-right: 14px; background-position: calc(100% - 8px) center; background-repeat: no-repeat; background-size: 8px 8px; }

.btn-sort.sort-desc { background-image: url("/_assets/icon-sort-desc-white.png"); }
.btn-sort.sort-asc { background-image: url("/_assets/icon-sort-asc-white.png"); }

.btn-sort:hover.sort-desc { background-image: url("/_assets/icon-sort-desc-black.png"); }
.btn-sort:hover.sort-asc { background-image: url("/_assets/icon-sort-asc-black.png"); }


.two-tables { display: flex; flex-direction: row; align-items: start; }
.two-tables table:first-child { margin-right: 10px; }
.two-tables table:last-child { margin-left: 10px; }

tr.total-line td { font-size: 20px !important; }

.new-reminder-details { margin-top: 50px; }

.new-reminder-details .buttons { margin-top: 40px; display: flex; justify-content: space-between; }

.new-reminder-details div.error { margin: 20px 0; }
.new-reminder-details p.error { color: #cc0000; font-weight: 600; }

.annual-reminder-sent { margin: 20px 0; font-size: 24px; color: #cc0000; }

table.asr-information { color: #5C5C5C; margin: 0; padding: 0; width: 100%; border: 0; }

table.asr-information tr td { padding: 5px 0; vertical-align: top; line-height: 1.3em; font-size: 16px; font-weight: bold; color: #5C5C5C;}
table.asr-information tr td.label { color: #3398d3; font-size: 16px; font-weight: bold; white-space: normal; width: 10%; min-width: 140px; padding-right: 20px; }

table.asr-information tbody tr:first-child td { padding-top: 0; }
table.asr-information tbody tr:last-child td { padding-bottom: 0; }

table.confirm-and-pay-information { margin: 0; padding: 0; width: 50%; border: 0; }

table.confirm-and-pay-information tr td { padding: 5px 0; vertical-align: top; line-height: 1.3em; font-size: 24px; font-weight: bold; }
table.confirm-and-pay-information tr td.label { color: #3398d3; font-size: 24px; font-weight: bold; white-space: normal; width: 10%; min-width: 140px; padding-right: 20px; }
table.confirm-and-pay-information tr td.w25 { width: 25%; }
table.confirm-and-pay-information tr td.w50 { width: 50%; }
table.confirm-and-pay-information tr td.blue { color: #3398D3; }

table.confirm-and-pay-information tbody tr:first-child td { padding-top: 0; }
table.confirm-and-pay-information tbody tr:last-child td { padding-bottom: 0; }

.asr-checkout-complete .booking-reference { margin-top: 0; }
.asr-checkout-complete .thank-you { font-size: 18px; }

button.btn, input[type=button].btn { cursor: pointer; -webkit-appearance: none; }





/*************************/
/* SERVICE PLANS SECTION */


.sp-hero						{position: relative; padding: 60px 0}
.sp-hero .inner					{position: relative; z-index: 3}
.sp-hero-text					{width: 700px; max-width: 100%; background-color: #ffffff; background-color: rgba(255,255,255,0.95); padding: 30px; border-radius: 20px; box-shadow: 0 0 30px rgba(0,0,0,0.2)}
.sp-hero-text p					{color:#000000}
.sp-hero-text p.pre-head		{font-size: 24px; font-weight: 700; color: #327CB4}
.sp-hero-text p.pre-head strong	{font-weight: 800}
.sp-hero-text h1				{font-size: 30px; color: #22223F}

.sp-hero .full-width-video		{overflow: hidden;}

.tick-list				{list-style: none; color: #000000; width: 580px; max-width: 100%; margin-left: 1em; line-height: 1.3em; margin-top: 1em}
.tick-list li			{position:relative; padding: 10px 0 0 40px; margin-bottom: 10px;}
.tick-list li:before	{background-image: url(/_assets/sp-tick-blue.svg); background-size: 30px; content: ''; position: absolute; display: block; width: 30px; height: 30px; left: 0px; top: 6px; border-radius: 30px; box-shadow: 0 0 5px rgba(0,0,0,0.2)}

.sp-banner			{background-color:#297ebf; display: flex; border-radius: 20px; box-shadow: 0 0 30px rgba(0,0,0,0.2); overflow: hidden; padding: 30px; padding-bottom: 15px; margin-top: 20px; width: 700px; max-width: 100%;}
.sp-banner-logo 	{width: 160px; flex-shrink: 0}
.sp-banner p		{font-size: 16px; color: #ffffff}
.sp-banner-text		{padding-left: 20px;}

p.caveat-text	{font-size: 12px;}

.sp-swish-container	{position: absolute; height: 22vw; background-size: cover; width: 100%; bottom: -4.4vw; z-index: 1;}

.cols-sp		{display: flex; width:calc(100% + 40px); margin-left: -20px;}
.cols-sp .col	{width: 33.333%; padding: 15px;}

/* SP OPTIONS */
.sp-options				{z-index: 2; color: #22223F; position: relative;}
.sp-option-panel		{border-radius: 20px; background-color: #ffffff; box-shadow: 0 0 30px rgba(0,0,0,0.2); overflow: hidden; position: relative;}
.sp-option-panel:before	{position: relative; display: block; top:0; left: 0; right:0; content: ''; height: 20px;}

.sp-option-panel-heading	{background-color:#F7F7F7; padding: 30px;}
.sp-option-panel-heading h2	{font-size: 24px; color: #000000; margin: 0}

.sp-panel-top-text 				{padding: 20px 30px;}
.sp-panel-top-text p			{margin: 0;  color: #22223F}
.sp-panel-top-text h3			{font-size: 32px; margin:0.15em 0 0.2em; color: #22223F; font-weight: 600}
.sp-panel-top-text h4			{font-size: 26px; margin: 0; color: #22223F; font-weight: 400}
.sp-panel-top-text h4 strong	{font-size: 40px; margin: 0; color: #22223F; font-weight: 700}

.sp-option-panel ul.tick-list		{border-top:1px solid #DBDBDB; padding:20px 30px; margin: 0; font-size: 18px; font-weight: 600; min-height: 250px;}
.sp-option-panel ul.tick-list li	{margin-bottom: 6px;}

.sp-panel-accordions					{border-top:1px solid #DBDBDB; padding-bottom: 8px;}
.sp-panel-accordions h2					{color:#22223F; padding:15px 30px; margin: 0; position: relative;}
.sp-panel-accordions h2:after			{width: 25px; height: 14px; background-image: url(/_assets/accordion-arrow.png); background-size: cover; content: ''; display: block; position: absolute; right: 30px; top:16px;}
.sp-option-panel .accordion-expanded	{padding: 10px 30px 30px;}

.sp-option-panel-button	{padding: 15px 30px 20px;}

.sp-btn			{font-size: 25px; text-decoration: none; font-weight: 700; line-height: 1.15em; color: #ffffff; border:1px solid #ffffff; box-shadow: 0 0 20px rgba(0,0,0,0.2); position: relative;display: block; border-radius: 20px; padding: 20px 40px;}
.sp-btn svg		{position: absolute; right: 30px; bottom: 20px;}

.sp-btn:hover	{background: #666666 !important}

/* PANEL COLOURS */
.sp-option-panel.orange	h3						{color:#F67C36}
.sp-option-panel.orange:before					{background-color:#F67C36}
.sp-option-panel.orange ul.tick-list li:before	{background-image: url(/_assets/sp-tick-orange.svg); }
.sp-option-panel.orange .sp-btn					{background: rgb(255,151,90); background: linear-gradient(90deg, rgba(255,151,90,1) 0%, rgba(246,124,54,1) 100%);}

.sp-option-panel.green h3						{color:#2DAA6A}
.sp-option-panel.green:before					{background-color:#2DAA6A}
.sp-option-panel.green ul.tick-list li:before	{background-image: url(/_assets/sp-tick-green.svg); }
.sp-option-panel.green .sp-btn					{background: rgb(255,151,90); background: linear-gradient(90deg, #21CE75 0%, #2DAA6A 100%);}

.sp-option-panel.pink h3						{color:#EB5870}
.sp-option-panel.pink:before					{background-color:#EB5870}
.sp-option-panel.pink ul.tick-list li:before	{background-image: url(/_assets/sp-tick-pink.svg); }
.sp-option-panel.pink .sp-btn					{background: rgb(255,151,90); background: linear-gradient(90deg, #FF889B 0%, #EB5870 100%);}

/* SP CNFIRM MODAL */

.choose-plan-popup {position: fixed; top: 0; left: 0; width:100%; height: 100%; background-color: rgba(0,0,0,.6); text-align: center; z-index: 100; display: flex; align-items: center;}
.choose-plan-popup .inner {background-color: #fff; border-radius: 20px; padding: 40px 20px 20px; text-align: center; width: 90%; position: relative;}
.choose-plan-popup .inner h2 {font-size: 22px;}
.choose-plan-popup .inner .checkbox {justify-content: center;}
.choose-plan-popup .inner .checkmark {width: 0px;}
.choose-plan-popup .inner .close {position: absolute; top: 20px; right: 20px; cursor: pointer; width: 20px;}
.choose-plan-popup .inner .choose-plan-popup-error {color: red;}

.error-choose-plan-popup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.6); text-align: center; z-index: 100; display: flex; align-items: center; }
.error-choose-plan-popup .inner { background-color: #fff; border-radius: 20px; padding: 40px 20px 20px; text-align: center; width: 90%; position: relative; }
.error-choose-plan-popup .inner h2 { font-size: 22px; }
.error-choose-plan-popup .inner .checkbox { justify-content: center; }
.error-choose-plan-popup .inner .checkmark { width: 0px; }
.error-choose-plan-popup .inner .error-close { position: absolute; top: 20px; right: 20px; cursor: pointer; width: 20px; }


.choose-plan-popup input.sms {width: 200px; padding: 5px; border: 1px solid #ccc; height: 50px; text-align: center; letter-spacing: 0.25em; font-size: 26px; color: #666; margin: 15px;}


.service-plan .sp-panel-accordions ul {color: #5C5C5C; font-size: 16px; line-height: 1.4em; margin-bottom: 12px; margin-left: 20px}
.service-plan .sp-panel-accordions li {margin-bottom: 6px;}



/*************************/
/*************************/

section.hero-colour-overlay			{padding-bottom: 0}
section.hero-colour-overlay .inner	{position: relative; z-index: 5}
section.hero-colour-overlay:before	{display: none}
.colour-overlay						{position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; display: block; z-index: 0; mix-blend-mode: multiply}

/* CASE STUDY PAGE */
section.case-study-detail-page	{margin-top: 15px}

/* CASE STUDY HEADER */
.case-study-header-container	{margin-bottom: 70px;}
.csh-hero-image					{background-size: cover; background-position: center; width: 100%; height: 50vh; min-height: 550px; margin-bottom: -100px;}

.csh-cols						{display: flex; justify-content: space-between;}
.csh-cols .csh-text-container	{width: 60%; border-radius: 0 0 300px 0; background: rgb(1,125,187); background: linear-gradient(45deg, rgba(1,125,187,1) 0%, rgba(0,162,244,1) 100%); display: flex; align-items: center}
.csh-cols .csh-text				{padding:40px 150px 70px 60px;}
.csh-cols .csh-text h1			{color: #ffffff; font-size: 45px;}

section.case-study-detail-page .csh-cols .csh-text p	{font-size: 18px; font-weight: 700; color: #ffffff !important; margin-bottom: 0}
section.case-study-detail-page .intro					{margin: 0}

.csh-icons-container			{width:calc(40% - 25px); margin-top: 120px; padding-right: 30px;}
.csh-icons-container ul			{display: flex; flex-wrap: wrap; list-style: none}
.csh-icons-container ul li		{width: 50%; justify-content: center; text-align: center; margin: 10px 0; text-transform: uppercase}
.csh-icons-container ul li p	{font-weight: 700; color:#3EA9F4;}
.csh-icons-container ul li img	{height: 40px; width: auto; margin-bottom: 10px}

.case-study-detail-page .copy-container	{width: 900px; max-width: 100%; margin-left: auto; margin-right: auto}

/* CASE STUDY TEXT */
.cs-cols		{display: flex; justify-content: space-between}
.cs-col-left	{width: 100%;}
.cs-col-left p	{line-height: 1.6em; margin-bottom: 1.2em}
.cs-col-right	{width: 0;}

.cs-blockquote						{margin-top: 60px;}
.cs-blockquote blockquote			{width: 1200px; padding: 0 150px; max-width: 100%; margin: auto; position: relative;}
.cs-blockquote blockquote p			{font-weight: 700; font-size: 26px; text-align: center;}
.cs-blockquote blockquote cite		{font-size: 18px; color:#3EA9F4;}
.cs-blockquote blockquote:before	{width: 105px; height: 76px; background-repeat: no-repeat; background-image: url(/_assets/icon-quote-left.png); content: ''; background-size: cover; display: block; position: absolute; left: 0; top: 0}
.cs-blockquote blockquote:after		{width: 105px; height: 76px; background-repeat: no-repeat; background-image: url(/_assets/icon-quote-right.png); content: ''; background-size: cover; display: block; position: absolute; right: 0; bottom: 0}

/* CASE STUDY GALLERY */
.case-study-gallery	.slide							{position: relative; padding-top: 20%}
.case-study-gallery	.slide-image					{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat;}
.case-study-gallery-container						{position: relative; padding-bottom: 40px; margin: 40px auto; max-width: calc(100% - 60px);}
.case-study-gallery .slick-arrow					{font-size: 0; position: absolute; z-index: 2}
.case-study-gallery .slick-next						{top:50%; right: -40px}
.case-study-gallery .slick-prev						{top:50%; left: -40px; transform: rotate(180deg)}
.case-study-gallery ul.slick-dots					{position: absolute; cursor: pointer; width: 100%; justify-content: center; bottom: -50px}
.case-study-gallery ul.slick-dots li				{background-color: #f1f1f1; margin: 0 5px; width: 10px; height: 10px; font-size: 0;}
.case-study-gallery ul.slick-dots li.slick-active	{background-color:#3EA9F4;}

/* CASE STUDY LISTING */
.case-study-listing-header					{position: relative;}
.case-study-listing-header:before			{position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; background: rgb(255,255,255); background: linear-gradient(90deg, rgba(1,125,187,1) 0%, rgba(62,169,244,1) 100%); mix-blend-mode: multiply}
.case-study-listing-header .csh-hero-image	{margin-bottom: 0}
.case-study-listing-header .inner			{height: 100%; display: flex; align-items: center; justify-content: center; position: relative; z-index: 2; text-align: center}
.case-study-listing-header h1				{font-size: 60px; color: #ffffff; word-wrap: break-word;}
.case-study-listing-header p				{font-size: 22px; line-height: 1.5em; font-weight: 700; color: #ffffff}
.cslh-text-container						{width: 640px; max-width: 100%;}

.cs-filter		{display: flex; justify-content: center; list-style: none; gap:20px; margin: 40px 0 25px}

.case-study-grid .cols		{width: calc(100% + 40px); margin-left: -20px; display: flex; /*justify-content: center; */flex-wrap: wrap}
.case-study-grid .col		{width: 25%; padding: 20px;}
.cs-card					{text-decoration: none; text-align: left;}
.cs-card h3					{font-size: 24px; margin-bottom: 0.4em; line-height: 1.2em}
.cs-card p					{font-size: 15px;}
.cs-card-image-container	{position: relative; overflow: hidden; padding-top: 73%;}
.cs-card-image				{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; transition: 0.2s ease-out}
.cs-card:hover .cs-card-image	{transform: scale(1.1);}

.cs-detail-listing		{padding: 50px 0; background-color: #edf7ff; margin: 70px 0 0 0}
.cs-detail-listing h2	{text-align: center; display: block; margin-bottom: 1em}

.error-container > p { color: #ff0000; }
.login-container-inner.resume-basket .form-cell-submit { margin: 20px 0; }

.button-link { color: #47587A; text-decoration: underline; background: transparent; line-height: 1.4em; }


/* NEW PANEL 2024 */
.two-col-grid-gallery-text.flipped .inner	{flex-direction: row-reverse}
.two-col-grid-gallery-text .inner			{display: flex; gap: 40px; align-items: center}
.grid-gallery								{display: flex; width: 50%; flex-wrap: wrap; gap:15px;}
.grid-gallery .slide						{width: calc(50% - 7.5px); position: relative; padding-top: 35%;}
.grid-gallery .listing-image				{height: 100%; width: 100%; background-size: cover; background-position: center; position: absolute; left: 0; top: 0}
.two-col-grid-gallery-text .listing-text	{width: 50%;}


/* 28/07/2024 */
.cols { display: flex; flex-wrap: wrap; }

.cols.span-1 { width: calc(100% + 40px); margin-left: -20px; }
.cols.span-1 .col { width: 100%; padding: 20px; }

.cols.span-2 { width: calc(100% + 40px); margin-left: -20px; }
.cols.span-2 .col { width: 50%; padding: 20px; }

.cols.span-3 { width: calc(100% + 40px); margin-left: -20px; }
.cols.span-3 .col { width: 33.333%; padding: 20px; }

.cols.span-4 { width: calc(100% + 40px); margin-left: -20px; }
.cols.span-4 .col { width: 25%; padding: 20px; }

.inhertTextColour h2 { color: inherit; }
.inhertTextColour h3 { color: inherit; }
.inhertTextColour p { color: inherit; }

.side-by-side-adverts-images-fully-clickable-container .col a { text-decoration: none; }

.jg.slick-arrow				{position: absolute; top: 50%; margin-top: -25px; width: 28px; height: 50px; background-size: cover;}
.jg.slick-arrow.slide-prev 	{left: 25px; transform: rotate(180deg); position: absolute; }
.jg.slick-arrow.slide-next 	{right: 25px; transform: rotate(0deg); position: absolute; }

/* 01/07/24 add fix to display prev and next slide */
.slick-initialized .slick-slide[aria-hidden="true"] { visibility: visible; }

/* full-width-bg-contained-text-carousel-container */
.full-width-bg-contained-text-carousel .slick-track		{display: flex;}
.full-width-bg-contained-text-carousel .slide			{padding: 100px 0; height: auto; min-height: unset; display: flex; align-items: center;}

.full-width-bg-contained-text-carousel .slide-image		{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: center;}

.central-panel-section .slide-image,
.full-width-bg-contained-text-carousel .slide-image		{opacity: 0; transition: 0.65s ease-out 0.25s;}


.full-width-bg-contained-text-carousel-container 		{position: relative;}
.fwctc-text-box											{position: relative; z-index: 5; width: 960px; max-width: calc(100% - 140px); padding: 40px; opacity: 0; transition: 0.5s ease-out 0.85s; transform: translateY(15px)}
.fwctc-text-box	h2										{margin-top: 0}
.fwctc-text-box p										{font-size: 18px; line-height: 1.5em}
.fwctc-text-box	.btn									{margin-top: 15px;}

.slide.slick-current .fwctc-text-box 	{opacity: 1; transform: translateY(0)}

.central-panel-section .slide.slick-current .slide-image,
.full-width-bg-contained-text-carousel .slide.slick-current .slide-image 		{opacity: 1}


/* central-panel-section */
.central-panel-section .fwctc-text-box	{margin: auto}
.central-panel-section .slide-image		{height: 540px;}

.central-panel-carousel-container				{position: relative; padding: 0 10px;}
.central-panel-carousel-container .slick-arrow	{width: 28px; height: 50px; background-size: cover; top: 220px; position: absolute; z-index: 5}
.central-panel-carousel-container .hero-prev	{left: -35px;}
.central-panel-carousel-container .hero-next	{right: -35px;}

/* half-and-half-with-outline-textbox-section */
.half-half-container 					{position: relative;}
.half-half-container h2					{margin-top: 0}
.half-half-container .slick-track		{display: flex;}
.half-half-container .slide				{height: auto; min-height: unset}
.half-half-container .cols				{width: 100%; margin: auto; height: 100%; position: relative;}
.half-half-container .cols .col			{padding: 0}
.half-half-container .cols .col-text	{display: flex; align-items: center; position: relative; padding: 50px 0; width: calc(50% + 75px); z-index: 5}
.half-half-container .col-text-inner	{padding: 40px 90px 40px 40px; transition: 0.5s ease-out 0.25s; transform: translateY(20px); width: 100%;}
.half-half-container .col-text-inner .btn	{margin-top: 20px;}

.half-half-container .col-image			{position: absolute; width: 50%; height: 100%; right: 0; overflow: hidden;}
.half-half-container .col-image-inner	{height: auto; min-height: 450px; position: absolute; left: 0; top: 0; inset:0; transition: 0.5s ease-out 0.5s; transform: scale(1.1)}

.half-half-container .slide.slick-current .col-text-inner	{transform: translateY(0px)}
.half-half-container .slide.slick-current .col-image-inner	{transform: scale(1)}

.half-half-container .cols.flipped				{justify-content: flex-end}
.half-half-container .cols.flipped .col-image	{right: auto; left: 0}

.images-with-transparent-copy-box-right-hand-side-section .slick-dots,
.half-copy-half .slick-dots,
.half-half-container .slick-dots	{width: 100%; justify-content: center}

.images-with-transparent-copy-box-right-hand-side-section .slick-dots {margin-top: 0px; margin-bottom: 20px;  }


.images-with-transparent-copy-box-right-hand-side-section .slick-dots li,
.half-copy-half .slick-dots li,
.half-half-container .slick-dots li	{border:1px solid var(--darkBlue); margin: 0 5px;}

/* images-with-colour-copy-block-section */
.images-with-colour-copy-block-carousel-container	{position: relative;}


.images-with-colour-copy-block-carousel	.slick-track,
.images-with-transparent-copy-box-right-hand-side-carousel .slick-track	{display: flex;}
.images-with-colour-copy-block-carousel .col,
.images-with-transparent-copy-box-right-hand-side-carousel .col			{height: auto; min-height: unset}

.standard-card			{display: flex; flex-direction: column; height: 100%; justify-content: space-between}
.standard-card-text		{flex: 1; padding: 30px 30px 0;}
.standard-card-button	{padding:10px 30px 30px}

.standard-card-image-container				{height: 250px; overflow: hidden; position: relative;}
.standard-card-image						{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; transition: 0.2s ease-out; background-image: url(_assets/buildings-city-evening-1557547.jpg)}
.standard-card:hover .standard-card-image	{transform: scale(1.06)}

.facts-2024-carousel-container	{position: relative;}

.facts-2024-carousel-container .slick-arrow,
.images-with-colour-copy-block-carousel-container .slick-arrow,
.images-with-transparent-copy-box-right-hand-side-carousel-container .slick-arrow 	{width: 22px; height: 39px; background-size: cover; top: 220px; position: absolute; z-index: 5; font-size: 0}

.facts-2024-carousel-container .slick-prev,
.images-with-colour-copy-block-carousel-container .slick-prev,
.images-with-transparent-copy-box-right-hand-side-carousel-container .slick-prev	{left: -20px; transform: rotate(180deg)}

.facts-2024-carousel-container .slick-next,
.images-with-colour-copy-block-carousel-container .slick-next,
.images-with-transparent-copy-box-right-hand-side-carousel-container .slick-next	{right: -20px;}

/* images-with-transparent-copy-box-right-hand-side-section */
.standard-card.staggered-card									{text-decoration: none}
.standard-card.staggered-card .standard-card-text				{width: calc(100% - 50px); margin-left: auto; padding: 30px; margin-top: -50px; position: relative; z-index: 5}
.standard-card.staggered-card .standard-card-text h2			{margin-top: 0; font-size: 34px; line-height: 1.2em}
.standard-card.staggered-card .standard-card-image-container	{padding-top:50%; height: auto; width: calc(100% - 50px);}

/* rolling-image-strip-animated-carousel-container */

.slider 		{height: auto; margin: auto; overflow: hidden; position: relative; width: 100%;}
.slide-track 	{width: calc(350px * 20); animation: scroll 20s linear infinite; display: flex;}
.slider .slide 	{width: 350px; height: 250px; margin: auto 0px; padding: 0 20px; background-size: cover; background-position: center;}
/*.slide a		{width: 100%;}
.slide a img	{margin: auto;}*/

@keyframes scroll {
	0% 		{ transform: translateX(0); }
	100% 	{ transform: translateX(calc(-350px * 10))}
}

/* side-by-side-adverts-images-fully-clickable-carousel */
.side-by-side-adverts-images-fully-clickable-container				{position: relative;}
.side-by-side-adverts-images-fully-clickable-carousel				{width: 100%; display: flex;}
.side-by-side-adverts-images-fully-clickable-carousel a				{height: auto; min-height: unset; flex: 1 1 33.333%;}
.side-by-side-adverts-images-fully-clickable-carousel a img			{width: 100%; object-fit: cover; object-position: center}
.side-by-side-adverts-images-fully-clickable-carousel .slick-list	{width: 100%;}
.side-by-side-adverts-images-fully-clickable-carousel .slick-track	{display: flex;}

.side-by-side-adverts-images-fully-clickable-container .slick-arrow				{font-size: 0; width: 16px; height:28px; position: absolute; top: 50%; margin-top: -20px;}
.side-by-side-adverts-images-fully-clickable-container .slick-arrow.slick-prev	{left: -26px; transform: rotate(180deg)}
.side-by-side-adverts-images-fully-clickable-container .slick-arrow.slick-next	{right: -26px;}

/* images-with-transparent-copy-box-right-hand-side-section */
.images-with-transparent-copy-box-right-hand-side-section .cols.span-3	{flex-wrap: wrap;}
.square-btn-card-image-container	{position: relative; padding-top: 100%; overflow: hidden;}
.square-btn-card-image				{position: absolute; left: 0; top: 0; inset:0}
.square-btn-card					{display: flex; flex-direction: column}
.square-btn-card-button				{margin-top: -25px; position: relative; z-index: 5; display: flex; justify-content: center}

/* FAQs-2024 */
.FAQs-2024 .accordion-item						{margin-bottom: 0}
.FAQs-2024 .accordion-expanded					{padding: 30px 50px 40px 30px;}
.FAQs-2024 .accordion-item h2					{padding: 15px 50px 15px 30px; margin: 0}
.FAQs-2024 .accordion-item h2 span.plus			{left: auto; top:13px; right: 24px; border-right: 3px solid #3EA9F4; border-bottom: 3px solid #3EA9F4; transform: rotate(45deg); margin: 0;}
.FAQs-2024 .accordion-item h2 span.plus:before,
.FAQs-2024 .accordion-item h2 span.plus:after	{display: none}
.FAQs-2024 .accordion-item.active h2 span.plus	{transform: rotate(-135deg); top: 23px;}
.FAQs-2024 .accordion-item.active h2			{background-color: #f1f1f1}

.FAQs-2024 .accordion-cols			 				{display: flex; flex-wrap: wrap; gap:40px; align-items: flex-start}
.FAQs-2024 .ac-col, .FAQs-2024 .ac-col-image 		{flex: 1 1 50%; max-width: calc(50% - 20px); box-sizing: border-box;}
.FAQs-2024 .accordion-cols .ac-col:only-child,
.FAQs-2024 .accordion-cols .ac-col-image:only-child {flex-basis: 100% ; max-width: 100%;}

.FAQs-2024 p,
.FAQs-2024 ul,
.FAQs-2024 ol	{font-size: 18px;}

/* facts-panel-2024 */
.facts-panel-2024 .fact-panel img	{max-height: 50px; width: auto}
.facts-panel-2024 .fact-panel h3	{font-size: 30px; line-height: 1em}

/* full-panel-with-inner-panels */
.full-panel-with-inner-panels							{}
.full-panel-with-inner-panels .panel-intro-text			{width: 800px; max-width: 100%;}
.full-panel-with-inner-panels .panel-intro-text h2		{margin-bottom: 0.5em}
.full-panel-with-inner-panels .panel-intro-text .btn	{margin-top: 1em}
.full-panel-with-inner-panels .cols.span-4				{margin-top: 2em; margin-bottom: 2em}

.full-panel-with-inner-panels .cols.span-4 .col h3		{font-size: 32px;}

.icon-panel-24		{background-color: #ffffff; border-radius: 0px; height: 100%; padding: 20px; display: block; text-decoration: none; transition: 0.3s ease-out}
.icon-panel-24 img	{height: 50px; width: auto; }
.heading-icon		{display: flex; align-items: flex-start; justify-content: space-between}

.icon-panel-24 h3		{line-height: 1em}
.icon-panel-24:hover	{transform: translateY(5px);}

/* BUTTON OVERRIDE 2024 */
.btn		{background-color:var(--darkBlue);/*#00a2f4; */border-radius: 0 !important; /*box-shadow: inset 0 5px 10px rgba(255,255,255,0.3);*/}
.btn:after	{display: none !important}
.btn span	{color: inherit !important}

.btn:hover 	{box-shadow: none !important}
.btn:hover 	{background-color: #333333 !important; color: #ffffff !important}


/* BLOG LISTING */

.blog-listing-intro					{margin: 40px auto; text-align: center}
.blog-listing-intro .grad-header	{margin-bottom: 20px}
.blog-listing-intro p				{font-size: 18px; max-width: 100%; margin-left: auto; margin-right: auto; margin-bottom: 1em; color: #2e2e2e;}

.blog-tags					{display: flex; justify-content: flex-start; flex-wrap: wrap; list-style: none; margin: 0px 0 10px; transition: 0.2s ease-out; padding: 0px 0 0}
.blog-tags li				{background-color:var(--darkBlue); padding: 10px 20px; color:#ffffff; transition: 0.2s ease-out; margin-right: 10px; margin-bottom: 11px; text-align: center}
.blog-tags li:last-of-type	{margin-right: 0}

.blog-tags li:hover	{opacity: 0.5; cursor: pointer;}


.blog-tags .tint             {opacity: 0.3;}
.blog-listing .disabled      {display: none;}

.blog-listing										{padding-bottom: 60px;}
.blog-listing .col-3								{margin-bottom: 15px;}
.blog-listing h2									{text-transform: none; font-size: 24px; line-height: 1.3em;}
.blog-listing h3									{text-transform: none; font-size: 16px; line-height: 1.3em;}
.blog-listing .btn									{background-image: none; display: inline-block; width:auto; padding:18px 25px !important; font-size: 14px;}
.blog-listing .product-panel-image-container		{padding: 0; height:250px;}
.blog-listing .product-panel-image-container .cover	{z-index: 10}
.blog-listing .product-panel-image					{transform: scale(1); background-size: cover;}
.blog-listing .col-container						{display: flex; flex-wrap: wrap}

.blog-listing .product-panel-image-container:hover .product-panel-image		{transform: scale(1.1)}

.blog-listing .col-container .product-panel a.link {text-decoration: none; font-size: 14px; font-weight: 800; transition: 0.2s ease-out;}
.blog-listing .col-container .product-panel a.link:hover {opacity: 0.5;}



/* BLOG POST */


.full-width.inner {max-width: 100%; padding: 0px; margin: 0px;}

.blog-hero-container					{text-align: center; margin-top: 40px; margin-bottom: 80px; }
.blog-hero-container .grad-header		{border:none; margin-bottom: 0; padding:10px 0 0}
.blog-listing-intro h1,
.blog-hero-container .grad-header h1	{line-height: 1.1em; width:100%; max-width: 1140px; margin-left: auto; margin-right: auto; margin-bottom: 0.5em; font-size: 46px; text-align: center}
.blog-hero-container p					{font-size: 16px; width:100%; max-width: 1140px; margin-left: auto; margin-right: auto;}
.blog-hero-container p.date				{font-size: 16px; font-weight: 700; margin-bottom: 0em}
.blog-hero								{height:500px; background-size: cover; background-position: center}
.blog-hero-container .blog-tags			{justify-content: center; margin-top: 0; padding-top: 10px;}

.blog-hero {margin-bottom: 35px; }

.blog-post-outer {max-width: 1200px; margin: auto; padding: 0 15px}

.blog-post-inner						{width:100%; margin:40px auto; padding-bottom: 60px;}
.blog-post-inner .intro	p			    {font-weight: 700; font-size: 20px !important; }
.blog-post-inner p			   		 	{font-size: 16px !important; }
.blog-post-inner p	span 				{font-size: 24px !important; margin: 35px 0 15px 0; display: block; line-height: 1.4em;}
.blog-post-inner p img 					{margin: 35px auto !important;}




.blog-post-inner ul,
.blog-post-inner ol                     {font-size: 18px;line-height: 1.5em;margin-left: 20px;margin-bottom: 30px;}

.blog-post-inner ul li,
.blog-post-inner ol li                   {margin-bottom: 1em;}

.product-panel {display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding-bottom: 30px; margin-bottom: 10px;}
.product-panel-image-container {padding-top: 100%; background-color: #fff; display: flex; justify-content: center; align-items: center; margin-bottom: 20px; position: relative; overflow: hidden;}
.product-panel-image { width: 100%; height: 100%; background-size: contain; background-repeat: no-repeat; background-position: center; transition: 0.2s ease-out; position: absolute; left: 0; top: 0; transform: scale(1);}

.blog-cols	{display: flex;}
.blog-left	{width: 70%; padding-right: 35px;}
.blog-right	{width: 30%;}


.blog-right h3 {font-size: 18px; margin: 0 0 10px 0;}
.blog-right h3.mb30 {margin-bottom: 20px;}


.blog-post-inner .blog-right ul a, 
.blog-post-inner .blog-right ol a,
.blog-post-inner .blog-right ul, 
.blog-post-inner .blog-right ol {margin-left: 0px; }

.blog-post-inner .blog-right ul a li, 
.blog-post-inner .blog-right ol a li  {margin-left: 0px; margin-right: 10px; padding: 5px 10px; text-decoration: none;}


section.AdvertImage {padding-bottom: 35px; }


.blog-post .related-articles {padding: 20px; background-color: #eaeef2; margin-bottom: 35px; }

.blog-post .related-articles a,
.blog-post .related-articles h2 {text-decoration: none; font-size: 16px; transition: 0.2s ease-out; border-bottom: 2px solid #fff; padding-bottom: 6px; }
.blog-post .related-articles a:hover {opacity: 0.5;}


.blog-post-inner .share-box-container p span,
.blog-post-inner .share-box-container p img {margin: 0 !important;}



/** SHARE CONTAINER **/
.share-box-container					{width:80px; padding-bottom: 5px; position:sticky; top:0; z-index: 10;  text-align: center; background-color: #ffffff; float: right; box-shadow: 0 0 3px rgba(0,0,0,0.2)}
.share-box-container p					{padding:10px 0 5px 0; color:#3C3C3C; background-color: #ffffff; width: 100%; font-size: 14px; text-align: center; margin-bottom: 0; padding-bottom: 0}

.share-box-container ul.social-list						{display: flex; justify-content: center; align-items: center; margin: 20px 0 70px}
.share-box-container ul.social-list li a					{display: inline-flex; width:52px; height: 52px; align-items: center; justify-content: center; background-color: #3C3C3C; transition: 0.4s cubic-bezier(0.65, 0, 0.35, 1);}
.share-box-container ul.social-list li svg				{width:auto; height: 20px; display: inline; visibility: visible;}
.share-box-container ul.social-list li svg .cls-1		{fill:#ffffff; transition: 0.4s cubic-bezier(0.65, 0, 0.35, 1);}
.share-box-container ul.social-list li:hover svg .insta_path,	
.share-box-container ul.social-list li:hover svg .cls-1	{fill:#ffffff}

.share-box-container ul.social-list					{list-style: none; text-align: center; margin: 0; padding-top: 5px; flex-direction: column;}
.share-box-container ul.social-list li				{text-align: center; line-height: 42px; display: inline-block; margin: 0 5px;}
.share-box-container ul.social-list li a			{width:40px; height: 40px; font-size: 22px; background-color:#ffffff; color: #c1c1c1; border:none; display: block; transition: 0.2s ease-out}
.share-box-container ul.social-list li a:hover		{background-color:#72d4bd; color: #3C3C3C;}
.share-box-container ul.social-list li svg .cls-1	{fill:#666666;}

.share-container-inner					{background-color: #ffffff;}

.blog-post .share-box-container {width: auto; float: none; position: inherit; margin-top: 35px; }
.blog-post .share-box-container ul.social-list	{flex-direction: row;}


section.tp-micro {margin-top: 10px; padding-bottom: 20px;}



/** DIAGNOSIS TOOL UPLOAD **/
/*.diagnosis-tool-upload .upload-files .btn.upload-file { background-color: #E5ECF3; border: none; font-weight: 500; color: #017dbb; }*/
.diagnosis-tool-upload .upload-files .btn.upload-file:hover { background-color: #b6cfe9; color: #0041b7; position: relative; }
.diagnosis-tool-upload .upload-file { position: relative; margin-top: 10px; }
.diagnosis-tool-upload .upload-file:after { content: ""; background-image: url(/_assets/icon-upload.png); width: 20px; height: 20px; position: absolute; right: 20px; background-size: contain; top: calc(50% - 10px); z-index: 3000; background-repeat: no-repeat; left: auto; }
.diagnosis-tool-upload .icon-del-diagnosis-tool { background-image: url(/_assets/icon-close-black.png); width: 15px; height: 15px; display: inline-block; background-size: contain; background-repeat: no-repeat; margin-left: 15px; position: relative; top: 3px; }
.diagnosis-tool-upload .btn:hover:after { opacity: 1; }
.diagnosis-tool-upload .upload-files .btn span { margin-top: 10px; color: #017dbb; }

.select-css.mb-5 { margin-bottom: 5px; }
.select-css.mb-10 { margin-bottom: 10px; }
.select-css.mb-15 { margin-bottom: 15px; }

.diagnosis-tool-modal { display: none; position: fixed; top: 50%; left: 50%; width: 70vw; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); padding: 40px; background-color: #fff; opacity: 1; pointer-events: auto; z-index: 1000; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); }
.diagnosis-tool-modal ul { list-style: none; }




/** 14.Service-Options **/

.service-options-2024 						{}

.service-options-2024 h2 					{text-align: center; margin: 20px 0px 20px 0px; display: inline-block; width: 100%;}
.service-options-2024 h3 					{margin-top: 0px; color: var(--darkBlue);}
.service-options-2024 p 					{display: inline-block; text-align: center; width: 100%; margin-bottom: 20px;}

.service-options-2024 .cols					{gap: 45px}
.service-options-2024 .cols.span-3			{justify-content: center;}
.service-options-2024 .cols.span-3 .col		{background-color: #ffffff; width: calc(33.333% - 45px); padding: 0px; border: 1px solid var(--lightBlue);}

.service-options-2024 .cols.span-3 .col .service-panel-text {padding: 0 25px 20px 25px;}

.service-options-2024 p.price 				{margin: 30px 0px; color: var(--lightBlue) !important; }
.service-options-2024 .cols.span-3 .col .service-panel-text p.price span {font-size: 32px; font-weight: 700;}

.service-options-2024 span.lozenge 			{background-color: var(--lightBlue); color: #fff; padding: 5px 10px; margin: 0px; display: inline-block; margin-bottom: 20px; }

.service-options-2024 .service-panel img 	{width: 70%; margin-left: 15%; margin-top: 0px; }

.service-options-2024 .service-panel-text .service-panel-text-intro ul {margin-left: 20px;}


.service-options-2024 .service-panel-text .section-1 ul,
.service-options-2024 .service-panel-text .section-2 ul,
.service-options-2024 .service-panel-text .section-3 ul {margin: 25px; list-style: none;}

.service-options-2024 .service-panel-text .section-1 ul li,
.service-options-2024 .service-panel-text .section-2 ul li,
.service-options-2024 .service-panel-text .section-3 ul li {position: relative;}

.service-options-2024 .service-panel-text .section-2 ul li:after,
.service-options-2024 .service-panel-text .section-3 ul li:after {content: ''; position: absolute; width: 15px; height: 15px; left: -25px; top: 4px; background-size: contain;}

.service-options-2024 .service-panel-text .section-2 ul li:after {background-image: url('/_uploads/assets/tick.png');}
.service-options-2024 .service-panel-text .section-3 ul li:after {background-image: url('/_uploads/assets/cross.png');}

.service-options-2024 .service-panel-text ol,
.service-options-2024 .service-panel-text ul,
.service-options-2024 .service-panel-text p 		{color: #5C5C5C;font-size: 16px;line-height: 1.4em;margin-bottom: 12px; text-align: left;}

.service-options-2024 .service-panel-text p.price {margin-bottom: 10px; padding-bottom: 10px; margin-top: 6px; border-bottom: 1px solid var(--lightBlue); }

.service-options-2024 .section-copy-outer h4 		{font-size: 22px; color: var(--darkBlue); position: relative; border-top: 1px solid var(--lightBlue); padding-top: 12px; margin-bottom: 12px; cursor: pointer;}
.service-options-2024 .section-copy-outer h4:after 	{content: ''; position: absolute; width: 25px; height: 25px; right: 0px; top: 8px; background-image: url('/_uploads/assets/arrow-right.png'); background-size: contain;}
.service-options-2024 .section-copy-outer h4.active:after 	{background-image: url('/_uploads/assets/arrow-down.png'); }
.service-options-2024 .section-copy-outer .section-copy 	{display: none;}

.service-options-2024 .btn 									{margin: 20px; }

.service-options-2024 .section-copy.show {display: block; border-top: 1px solid var(--lightBlue); padding: 12px; } 




/* 15.Full-Video-Text-Left */

.full-image-with-text			{min-height: 640px; display: flex; padding: 60px 0; position: relative; background-size: cover; background-position: center}
.full-width-bg-enquiry:after,
.full-image-with-text:after		{background-color: var(--DarkBlue); position: absolute; left: 0; top: 0; inset:0; content: ''; mix-blend-mode: multiply}
.full-image-with-text .inner	{display: flex; align-items: center; position: relative; z-index: 2}
.fiwt-text						{width: 550px; max-width: 100%;}
.fiwt-text h2					{color: var(--LightBlue)}
.fiwt-text p					{color: #ffffff}
.full-image-with-text.centre .inner		{justify-content: center; text-align: center}
.full-image-with-text.centre .buttons	{justify-content: center}
.full-image-with-text.right .inner		{justify-content: flex-end;}
.fiwtv-video		{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.fiwtv-video video	{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: center;}


section .trustpilot-widget {width: 100%; max-width: 1620px; margin: auto; padding: 30px 60px; }


/*  MAKE-A-PAYMENT  */
.make-payment { color: var(--lightBlue); }
.make-payment h4 { color: var(--lightBlue); }
.make-payment h4 > span { margin-top: 0; }
.make-payment label.header { color: var(--lightBlue); }
.make-payment div.header p { color: var(--lightBlue); }
.make-payment div.text { color: var(--darkGrey); }
.make-payment p.text { color: var(--darkGrey); font-size: 24px; font-weight: 600; margin-bottom: 30px;}
.make-payment p.span { color: var(--darkGrey); }

.make-payment p.header,
.make-payment .header p {color: var(--lightBlue); font-weight: 700;font-size: 18px; margin-bottom: 6px;}

/*
.service-new-flash-banner { text-align: center; color: #FFFFFF; background-color: #C50B9D; width: 200px; margin-left: auto; margin-right: auto; padding: 10px; }

.service-price .line1 { text-align: center; margin-left: auto; margin-right: auto; height: 40px; }
.service-price .line2 { text-align: center; margin-left: auto; margin-right: auto; height: 40px; }

.service-your-price { color: #FFFFFF; background-color: #C50B9D; padding: 5px 10px; }

.service-plan-panel h2.title2 { font-size: 23px; color: #000000; margin-bottom: 1em; text-align: center; }
*/


/* Page panels Slick Arrows */


.half-copy-half-image-coloured-block-section button.slick-arrow {position: absolute; z-index: 99; top: 40%; font-size: 0px; background-color: #fff; background-size: 50%; background-position: center; background-repeat: no-repeat; width: 25px; height: 35px;  }
.half-copy-half-image-coloured-block-section button.slick-arrow.slick-prev {left: 0px; rotate: 180deg;}
.half-copy-half-image-coloured-block-section button.slick-arrow.slick-next {right: 0px !important; }



@media (max-width: 600px) 
{
	.half-copy-half-image-coloured-block-section button.slick-arrow {top: 26%;}
}



