﻿* {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; color:#3C3C3C;}

::-webkit-input-placeholder     {color:#bdbdbd;}
::-moz-placeholder              {color:#bdbdbd; opacity:1;}
:-ms-input-placeholder          {color:#bdbdbd;}
:-moz-placeholder               {color:#bdbdbd; opacity:1;}

input[type="text"],
textarea	{-webkit-appearance:none}

img     {max-width:100%; height:auto;}

img.cc-logos {max-width: 230px;}


a       {color:inherit;}
a.cover {position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0); display:block;}

p 		{color:#3C3C3C; font-size: 18px; line-height: 1.5em; margin-bottom: 1em; word-break: break-word;}

h1,
h2		{font-weight: 700; text-transform: uppercase; font-size: 40px; margin-bottom: 0.5em}
h3		{font-weight: 700; text-transform: uppercase; font-size: 30px; margin-bottom: 0.5em}

/* .inner 	{max-width:100%; padding-left: 20px; padding-right: 20px; width:1160px; margin:0 auto; } */
.inner 	{width: 100%; max-width: 1620px; padding-left: 60px;padding-right: 60px;margin: 0 auto;}

.logo	{width:376px; height: 90px; background-image: url(/_assets/logo-colour.png); background-size: cover; display: block; flex-shrink: 0}
.logo.mb    {display:none;}

.col-container		{width:calc(100% + 36px); margin-left: -18px; font-size: 0}
.col-4				{width:25%; padding: 18px; display: inline-block; vertical-align: top; font-size: 16px}
.col-3				{width:33.333%; padding: 18px; display: inline-block; vertical-align: top; font-size: 16px}
.col-2				{width:50%; padding: 18px; display: inline-block; vertical-align: top; font-size: 16px}

.col-2.wide 		{width: 60%;}
.col-2.narrow 		{width: 40%;}


/* Bullet Styles */
section.text-top-panel ul,
section.image-and-text ul {    line-height: 1.4em;margin-left: 18px; margin-bottom: 1.5em; }

section.text-top-panel ul li,
section.image-and-text ul li {margin-bottom: 0.75em;}



/* HEADER */
header 			{z-index: 100; display: flex; justify-content: space-between; padding: 30px 40px;}

nav ul 								{display: flex; align-items: center; font-weight: 400; font-size: 18px; text-transform: uppercase}
nav li 								{margin-left: 30px; position: relative;}
nav li a 							{color: #000; text-decoration: none; font-size: 18px; }
nav li:not(.no-hover):after 		{width: 100%; height: 2px; bottom: 0; transform: translateY(10px); background-color: #000; content: ''; display: block; opacity: 0; transition: 0.2s ease-out; }
nav li:not(.no-hover):hover:after 	{background-color: #000; transform: translateY(3px); opacity: 1 }

nav li ul		{left: -999999px; top: 23px; font-size: 14px; position: absolute; flex-direction: column; align-items: flex-start; background-color: #ffffff; padding: 10px 0; min-width: 250px; z-index: 5; border-radius: 5px; box-shadow: 0px 2px 4px rgba(0,0,0,0.2);}
nav li ul li	{margin: 0; padding: 15px; width: 100%; padding-left: 20px; transition: 0.2s ease-out}
nav li ul li a	{font-size: 15px; color:#3c3c3c;}

nav li:hover ul {left: -20px; top:23px; z-index: 10;}

nav li ul li:after		{display: none !important}
nav li ul li:hover		{background-color: #3c3c3c;}
nav li ul li:hover a	{color:#ffffff !important;}

nav ul ul ul {left:-99999px !important;}sssss
nav ul ul li:hover ul {left:100% !important; top: -10px;}

nav ul ul ul a {color: #3c3c3c !important;}
nav ul ul ul li:hover a {color: #fff !important;}

nav li ul li.highlight a	{font-size: 15px; font-weight: 600;}
nav li ul li.red a			{color:#d23955; }
nav li ul li.turquoise a	{color:#56d8c9; }
nav li ul li.orange a		{color:#f49739; }
nav li ul li.blue a			{color:#53a2da; }

nav li ul li.red:hover		{background-color:#d23955; }
nav li ul li.turquoise:hover{background-color:#56d8c9; }
nav li ul li.orange:hover	{background-color:#f49739; }
nav li ul li.blue:hover		{background-color:#53a2da; }


/*
nav li:nth-last-child(2) ul,
nav li:last-of-type:hover ul	{left: auto; right:0}
*/

.header-actions						{display: flex; justify-content: flex-end; margin-bottom: 20px;}
.header-actions .btn				{font-size: 15px; color:#3C3C3C; font-weight: 700; text-decoration: none; box-shadow: 0px 2px 4px rgba(0,0,0,0.2); border-radius: 30px; padding: 13px 25px; letter-spacing: 0.5px; background-color: #ffffff; min-width: unset; margin-top: 0}
.header-actions .btn.nav-icon,
.header-actions .btn.basket			{padding-left: 0; padding-right: 0; width: 44px; border-radius: 44px; display: block; margin-left: 15px; background-image: url(/_assets/icon-basket.png); background-position: center; background-repeat: no-repeat; background-size: 15px auto; position: relative}
.header-actions .btn.basket span	{position: absolute; left: 25px; top:5px; font-size: 13px}
.header-actions .btn:hover			{transform: translateY(1px); opacity: 0.5;}


.header-actions-left,
.header-actions-right				{display: inline-flex;}

.search-box                         { position: relative; padding: 13px 25px; margin-right: 15px; margin-left: 15px; background-color: #ffffff; box-shadow: 0px 2px 4px rgba(0,0,0,0.2); border-radius: 30px; }
.search-box input[type="text"]		{height: 100%; width: 100%; padding:0 40px 0 0; border-radius: 0; font-size: 15px; color:#3c3c3c;}
.search-box input[type="submit"]	{font-size: 0; background-color: transparent; width: 32px; height: 32px; border-radius: 32px; background-image: url(/_assets/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-actions .btn.nav-icon		{background-image:url(/_assets/icon-nav.png); background-size: 21px auto; background-repeat: no-repeat; background-position: center; display: none}

.btn.btn-tel		{padding-top: 16px}
.btn.btn-tel strong	{color:#EA745C}

/* HEADER HOME */
.home-page header						{position: absolute; top: 40px; width: 100%;}

.home-page header .logo					{background-image: url(/_assets/logo-white.png)}
.home-page header nav li a				{color:#ffffff}
.home-page nav li:not(.no-hover):after	{background-color: #ffffff;}

.home-page nav ul ul li a		{color:#3c3c3c}
.home-page nav ul ul li:hover a	{color:#ffffff;}

/* HERO CONTAINER */
.hero-container				{background-image: url(/_assets/hero-placeholder.jpg); background-repeat: no-repeat; width:100%; height: 43vw; background-size: 100% auto;}

/* CONTENT HERO CONTAINER */
.content-hero-container		{width:100%; height: 51vw; background-size: 100% auto; background-repeat: no-repeat;}

/* TEXT LEFT PANEL */
.text-left-panel			{padding: 40px 0; min-height: 500px; background-size: cover; background-repeat: no-repeat; background-position: bottom center; display: flex; flex-direction: column}
.text-left-panel .inner		{display: flex; flex: 1; align-items: center;}
.text-left-panel-text		{width:60%; margin-left: 0; height: 100%; display: flex; flex-direction: column; text-align: left; color:#ffffff; background-color: rgba(255,255,255,0.9); padding: 30px;}
.text-left-panel-text h1,
.text-left-panel-text h2	{text-transform: uppercase; font-weight: 800; font-size: 40px; margin-bottom: 0.5em; color:#3FA9F5}
.text-left-panel-text p		{font-size: 18px; line-height: 1.5em; margin-bottom: 1em; color:#3C3C3C}

/* TEXT LEFT PANEL V2 */
.text-left-panel-v2								{min-height: 768px; padding-top: 80px;}
.text-left-panel-v2	.text-left-panel-text		{background:none; padding: 0; width:500px; max-width: 100%; align-items: flex-start}
.text-left-panel-v2 h1,
.text-left-panel-v2 h2							{color:#ffffff;}
.text-left-panel-v2 p							{color:#ffffff;}
.text-left-panel-v2 .inner						{align-items: flex-start}
.text-left-panel-v2 .btn						{background-color:#ffffff; color:#56A1D8;}

/* PRODUCT CAROUSEL */
.product-carousel .inner			{display: flex; justify-content: space-between}
.product-carousel h1,
.product-carousel h2				{text-transform: uppercase; font-weight: 800; font-size: 40px; margin-bottom: 0.5em; color:#3FA9F5; border-bottom: 1px solid #000000; padding-bottom: 20px;}
.product-carousel h3				{text-transform: uppercase; font-weight: 700; font-size: 38px; margin-bottom: 0.5em; color:#3C3C3C}
.product-carousel .col				{width:50%;}
.product-carousel .pc-col-text img	{width:100px; margin-left: -120px; margin-right: 20px; display: inline-block}
.product-carousel .pc-col-text p	{width:100%; max-width: 450px; font-size: 16px;}
.product-carousel .slide			{padding: 50px 0}

.slide.summer-sneezer			{background-color:#FBE9D7;}
.slide.summer-sneezer h1,
.slide.summer-sneezer h2,	
.slide.summer-sneezer h3 span	{color:#F49638; border-color:#F49638}
.slide.summer-sneezer .btn		{background-color:#F49638;}

.product-carousel-section				{position: relative;}

.carousel-nav							{position: absolute; bottom: 30px; width:100%;}
.carousel-nav ul						{display: flex; justify-content: center; list-style: none; font-size:0}
.carousel-nav ul li						{width:18px; height: 18px; border-radius: 18px; background-color: #000000; margin: 0 5px; position: relative}
.carousel-nav ul li:after				{width:22px; height: 22px; border-radius: 20px; position: absolute; left: -4px; top:-4px; border:2px solid #000000; content: ''; opacity: 0; transform: scale(0.5); transform-origin: center; transition: 0.2s ease-out}
.carousel-nav ul li.slick-active:after	{opacity: 1; transform: scale(1)}

.carousel-nav-plain							{margin-top: 20px; width:100%;}
.carousel-nav-plain ul						{display: flex; justify-content: center; list-style: none; font-size:0}
.carousel-nav-plain ul li					{width:20px; height: 20px; border-radius: 20px; background-color: #d6d6d6; opacity: 0.5; margin: 0 5px; position: relative}
.carousel-nav-plain ul li.slick-active		{opacity: 1;}

/* PRODUCT CAOURSEL V2 */
.product-carousel-v2					{}
.product-carousel-v2 .slide				{padding: 40px 0 100px; /*background: rgb(255,237,219); background: linear-gradient(180deg, rgba(255,237,219,1) 0%, rgba(250,213,176,1) 100%);*/}
.product-carousel-v2 .text-top-outer	{display: flex; justify-content: flex-end; margin-top: 40px;}
.product-carousel-v2 .text-top			{width:100%; max-width: 100%; text-align: right;}

.product-carousel-v2 .text-top .cols {display: flex; justify-content: space-between; align-items: center}

.product-carousel-v2 .text-top .cols .image {width: 60%; display: inline-flex; justify-content: center;}
.product-carousel-v2 .text-top .cols .image img {width: 308px;max-width: 100%; height: auto;}

.product-carousel-v2 .text-top .cols .copy {width: 40%;}

.product-carousel-v2 .slick-track			{display: flex}
.product-carousel-v2 .slick-track .slide	{height: auto}

.product-detail h1					{font-size: 90px; color:#EAA85C; text-align: center}
.product-detail h1 span				{font-size: 60px; display: block}
.product-detail h1 br				{display: none}

.product-detail h2					{font-size: 90px; color:#EAA85C; text-align: center}
.product-detail h2 span				{font-size: 60px; display: block}
.product-detail h2 br				{display: none}


.product-detail ul li				{display: flex; list-style: none; font-weight: 700; font-size: 24px; align-items: flex-start; margin-bottom: 8px;}
.product-detail ul li img			{width:79px; margin-right: 15px;}
.product-detail ul li span			{color:#EAA85C}

.product-detail .cols				{display: flex; justify-content: space-between; align-items: flex-start}
.product-detail .col-text			{width:40%;}
.product-detail .col.col-image		{width:60%; display: inline-flex; justify-content: center;}
.product-detail .col.col-image img	{width:308px; max-width: 100%;}

.product-carousel-container-v2					{position: relative}
.product-carousel-container-v2 .carousel-nav	{bottom: 30px;}

/* PANEL BUTTONS */
.shop-brand .btn,
.split-panels .btn,
.image-and-text .btn,
.product-listing-pullout .btn,
.product-carousel-container-v2 .btn			{transition: 0.2s ease-out;}

.shop-brand .btn:hover,
.split-panels .btn:hover,
.image-and-text .btn:hover,
.product-listing-pullout .btn:hover,
.product-carousel-container-v2 .btn:hover	{opacity: 0.65; background-color: #000000; color:#ffffff}

.slick-arrow				{position: absolute; font-size: 0; background-color: transparent; width:30px; height: 56px; background-image:url(/_assets/icon-slick-arrow.png); background-size: cover; top:50%; margin-top: -26px; z-index: 5}
.slick-arrow.slick-prev		{left:30px; transform: rotate(180deg);}
.slick-arrow.slick-next		{right:30px;}



/* TEXT TOP PANEL */
.text-top-panel				{background-size: cover; background-position: bottom center; min-height: 55vw; padding-top: 50px; position: relative}
.text-top-panel	p			{width:800px; max-width: 100%;}
.text-top-panel  h1 span	{color:#56D8C9}
.text-top-panel  h2 span	{color:#56D8C9}
.text-top-panel .inner		{position: relative; z-index: 5}
.text-top-panel .full-image	{position: absolute; left: 0; top:0; width:100%; height: 100%; z-index: 0; background-size: cover; background-position: center;}

.copy-bgimg-text			{width:650px; max-width: 100%;padding-bottom: 30px;}

.copy-bgimg-text span		{line-height: 1em;}

/* PRODUCT PULLOUT */
.product-pullout				{padding: 50px 0}
.product-pullout .inner			{display: flex; align-items: center}
.product-pullout .col			{width:50%;}
.product-pullout .col-text		{padding-right: 80px;}
.product-pullout .price			{padding:5px 15px; font-weight: 700; text-transform: uppercase; background-color: #ffffff; display: inline-block; width: auto}

.product-pullout.flipped .inner			{flex-direction: row-reverse;}
.product-pullout.flipped .col-text		{padding-left: 80px; padding-right: 0}

.product-pullout.blue			{background-color:#9ECAED}
.product-pullout.blue h1 span	{color:#ffffff}
.product-pullout.blue h2 span	{color:#ffffff}
.product-pullout.blue .btn		{background-color:#ffffff; color:#9ECAED}

.product-pullout.white			{background-color:#FAFAFA}
.product-pullout.white h1 span	{color:#ffffff}
.product-pullout.white h2 span	{color:#ffffff}
.product-pullout.white .btn		{background-color:#D33B54;}
.product-pullout.white .price	{color:#ffffff; background-color:#3C3C3C}

.product-pullout.turq			{background-color:#56D8C9}
.product-pullout.turq h1 span	{color:#ffffff}
.product-pullout.turq h2 span	{color:#ffffff}
.product-pullout.turq .btn		{background-color:#ffffff; color: #56D8C9}

/* FIVE STEPS */
.five-steps			{padding: 50px 0}
.five-steps h1		{display: block; text-align: center; font-size: 50px; font-weight: 800; margin-bottom: 1em}
.five-steps h2		{display: block; text-align: center; font-size: 50px; font-weight: 800; margin-bottom: 1em}
.five-steps .inner	{width:1000px;}
.five-steps .step	{display: flex; align-items: center; margin-bottom: 40px;}
.five-steps .col	{width:50%;}
.five-steps .col-text		{text-align: right}
.five-steps .col-image img	{width:90%; margin: auto; display: block}
.five-steps h3		{font-size: 70px; font-weight: 800; color:#D23955; margin-bottom: 0.2em;}
.five-steps h4		{font-size: 35px; font-weight: 800; text-transform: uppercase; margin-bottom: 0.5em}

.five-steps .step:last-child		{margin-bottom: 0}

.five-steps .step:nth-child(odd)	{flex-direction: row-reverse}
.step:nth-child(odd) .col-text		{text-align: left}

/* SPLIT PANELS */
.split-panels					{background-color:#56D8C9}
.split-panels .inner			{display: flex;}
.split-panels .panel			{width:50%; padding: 50px 70px;}
.split-panels .panel.left		{background-color:#C3F6F1; position: relative;}
.split-panels .panel.left:after	{background-color:#C3F6F1; position: absolute; right:100%; top:0; height: 100%; width:5000px; content: '';}
.split-panels .panel.left		{padding-left: 0}
.split-panels .panel h1 		{position: relative; font-size: 38px;}
.split-panels .panel h2 		{position: relative; font-size: 38px;}

.split-panels .panel .btn.white	{color:#56D8C9; background-color: #ffffff;}

.split-panels .panel:last-of-type	{padding-right: 30px;}

.split-header		{position: relative; display: flex; align-items: flex-start; justify-content: space-between}
.split-header img	{width: 85px; margin-left: 15px;}

/* GENERIC PANELS */

section .panel ul,
section .panel ol                {font-size: 18px; line-height: 1.4em; margin-left: 20px;}

section .panel ol li,
section .panel ul li            {margin-bottom: 1em;}



/* SHOP BRAND */
.shop-brand				{background-color:#CAE0F1; padding: 60px 0}
.shop-brand .btn		{background-color:#56A1D8}
.shop-brand .inner		{display: flex}
.shop-brand .col		{width:50%}
.shop-brand .col-text	{padding-right: 30px;}
.shop-brand .col-text p	{width:510px; max-width: 100%;}

.shop-brand .col-brands	ul			{list-style: none; display: flex; justify-content: flex-start; flex-wrap: wrap}
.shop-brand .col-brands	ul li		{width:calc(33.33% - 10px); border-radius: 15px; background-color: #ffffff; display: inline-flex; align-items: center; padding: 20px; margin-bottom: 15px;}
.shop-brand .col-brands	img			{transition: 0.2s ease-out}
.shop-brand .col-brands	img:hover 	{opacity: 0.5; transform: scale(1.05)}

/* TEXT PULLOUT */
.text-pullout		{text-align: center; padding: 70px 0; background-color: #ffffff}
.text-pullout h1	{margin-bottom: 0; font-size: 42px; line-height: 1.1em; color:#5C5C5C}
.text-pullout h2	{margin-bottom: 0; font-size: 42px; line-height: 1.1em; color:#5C5C5C}

.text-pullout span	{line-height: 1.2em;}

/* PRODUCT WITH TABS */			
.image-and-text					{background-color:#F0F0F0; padding: 60px 0;}
.image-and-text .cols			{display: flex; justify-content: space-between; align-items: center}
.image-and-text .col-text		{width:50%;}
.image-and-text .col-image		{width:calc(48% - 50px); text-align: center;}
.image-and-text .col-image img 	{max-height: 520px;}
.image-and-text .cols.left     {flex-direction: row-reverse;}



ul.tab-list				{display: flex; list-style: none; justify-content: center; margin-bottom: 10px; width:calc(100% + 20px); margin-left: -10px;}
ul.tab-list li			{transition:0.2s ease-out; width:calc(33.333% - 20px); margin: 0 10px; position: relative; background-color: #ffffff; border-radius: 15px; color:#56D8C9; line-height: 1.4em; padding: 20px 50px; text-align: center; font-weight: 700; font-size: 20px; display: inline-flex; align-items: center; justify-content: center}
ul.tab-list li:hover	{opacity: 0.5}

/* PRODUCT PAGE */
.product-page			{width:1188px; max-width:calc(100% - 40px); margin: auto; padding: 30px 0}
.product-page .inner	{max-width:100%; width:100%; padding: 0}

.breadcrumbs						{font-size: 16px; text-transform: uppercase; list-style: none; margin: 0; margin-bottom: 15px; display: flex;}
.breadcrumbs li a					{color:#3C3C3C; text-decoration: none}
.breadcrumbs li:after				{content: '/'; margin: 0 5px;}
.breadcrumbs li:last-child:after	{display: none}
.breadcrumbs li a:hover				{text-decoration:underline;}

.product-banner		{min-height: 200px; padding: 20px 20px 20px 30px; background-size: cover; background-repeat: no-repeat; margin-bottom: 20px;}
.product-banner h1	{box-shadow: 10px 0 0 #fff, -10px 0 0 #fff; font-weight: 800; font-size: 55px; text-transform: uppercase; background-color: #ffffff; display: inline-block; margin-bottom: 5px; color:#FB9E26}

.product-detail-banner h1,
.product-banner h2	{box-shadow: 10px 0 0 #fff, -10px 0 0 #fff; font-weight: 800; font-size: 45px; text-transform: uppercase; background-color: #ffffff; display: inline; line-height: 1.5em; color:#FB9E26}

.product-banner h1	{box-shadow: 10px 0 0 #fff, -10px 0 0 #fff; font-weight: 800; font-size: 45px; text-transform: uppercase; background-color: #ffffff; display: inline; line-height: 1.5em; color:#FB9E26}


.col-sort-by				{float: right; width:250px; padding: 18px;}
.col-sort-by .select-css	{font-size: 16px;}

/* FILTER LEFT AND STUF	F BLAAAAAAH */
.listing-cols				{display: flex; justify-content: space-between}
.col-filter-left			{width:236px; padding-top: 18px;}
.col-filter-left h1			{font-size: 16px; margin-bottom: 15px; position: relative; cursor: pointer}
.col-filter-left h1:after	{content:''; width: 20px; height: 9px; position: absolute; right:0; top:3px; background-image: url(/_assets/select-arrow.png); background-repeat: no-repeat, repeat; background-position: right top 50%, 0 0; background-size: cover; transition:.2s ease-in-out;}
.col-filter-left h1.closed:after {transform: rotate(-90deg);}

.col-filter-left h2			{font-size: 16px; margin-bottom: 15px; position: relative; cursor: pointer}
.col-filter-left h2:after	{content:''; width: 20px; height: 9px; position: absolute; right:0; top:3px; background-image: url(/_assets/select-arrow.png); background-repeat: no-repeat, repeat; background-position: right top 50%, 0 0; background-size: cover; transition:.2s ease-in-out;}
.col-filter-left h2.closed:after {transform: rotate(-90deg);}





.col-filter-top				{display: flex; justify-content: space-between}
.col-filter-top p			{font-size: 16px;}
.col-filter-top p a			{color:#AAAAAA; transition: .2s ease-out;}
.col-filter-top p a:hover {text-decoration: none;}

.col-filter-inner						{/*position: sticky; top:80px;*/}
.col-filter-inner ul					{list-style: none; display: block;}
.col-filter-inner ul .checkmark			{width:20px; height: 20px;}
.col-filter-inner ul .checkmark:after	{left: 7px; top: 3px; width: 3px; height: 8px; border-width: 0 2px 2px 0;}
.col-filter-inner ul .container			{margin-bottom: 0; padding-top: 0; padding-left: 30px;}
.col-filter-inner ul li					{margin-bottom: 5px;}
.col-filter-inner ul p					{margin-bottom: 0; font-size: 15px;}

.sub-section				{border-bottom: 1px dotted #cccccc; margin-bottom: 15px; padding-bottom: 13px;}
.sub-section:first-of-type	{border-top: 1px dotted #cccccc; padding-top: 20px;}

.col-listing-right					{width:calc(100% - 266px);}

/* FILTER SECTION */
.filter-section					{z-index: 5; position: sticky; top: 0; background-color: #ffffff;}
.filter-section .col-container	{display: flex; justify-content: flex-end}
.select-container				{width:100%; background-color:#ffffff; z-index: 20;}
.select-container .select		{display: flex; justify-content: space-between; cursor: pointer;  position: relative; border-top:1px solid #5C5C5C; border-bottom: 1px solid #5C5C5C; z-index: 2; background-image: url(/_assets/select-arrow.png); background-repeat: no-repeat, repeat; background-position: right top 50%, 0 0; background-size: 30px auto}
.select-container .select span	{}
.select-container .select p		{font-size: 20px; font-weight: 800; color:#5C5C5C; padding:10px 15px 8px; margin-bottom: 0}
.select-container .select:hover	span {background-color:#000000}

.select-dd					{width:370px; padding:20px 15px; border-left: 5px solid #5c5c5c; background-color: #ffffff;  display: none; list-style: none; box-shadow: 7px 7px 2px rgba(0,0,0,0.2); position: absolute; max-width: 100%;}
.select-dd li				{padding-bottom: 5px; font-size: 18px;}
.select-dd li p				{ color:#5c5c5c; line-height: 1.2em;}
.select-dd li strong		{display: block; font-size: 22px; margin-bottom: 5px;}
.select-dd li:last-child p	{margin-bottom: 0}

.container 									{display: block; position: relative; padding-left: 40px; margin-bottom: 12px; cursor: pointer; font-size: 18px; padding-top: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.container input 							{position: absolute; opacity: 0; cursor: pointer;}
.checkmark 									{position: absolute; top: 0; left: 0; height: 25px; width: 25px; background-color: #fff; border-radius: 4px; border:1px solid #707070}
.container:hover input ~ .checkmark 		{background-color: #ccc;}
.container input:checked ~ .checkmark 		{background-color: #56D8C9;}
.checkmark:after 							{content: ""; position: absolute; display: none;}
.container input:checked ~ .checkmark:after {display: block;}
.container .checkmark:after 				{left: 8px; top: 4px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}

/* PRODUCT LISTING */
.listing .col-container			{display: flex; flex-wrap: wrap}
.product-panel-text             {margin-bottom: 10px; }
.product-panel					{display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding-bottom: 30px; margin-bottom: 10px; position: relative;}
.product-panel h3				{display: flex; font-size: 36px; font-weight: 800; align-items: flex-end; color:#56D8C9; margin-bottom: 12px; line-height: 30px;}
.product-panel h3 span			{font-size: 18px; margin-right: 5px;}
.product-panel h4				{font-weight: 700; color:#5c5c5c; font-size: 18px; margin-bottom: 5px; line-height: 1.3em;}
.product-panel p				{font-weight: 400; color:#5c5c5c; font-size: 16px; line-height: 1.4em; display: none;}
.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)}


.product-panel-floor-area-flash {position: absolute; top: -5px; left: -5px; background: #d23955; color: white; padding: 10px; font-weight: bold; text-align: center; clip-path: polygon(0 0, 100% 0, 0 100%); width: 90px; height: 90px; border-radius: 5px; z-index: 10; }

.product-panel-floor-area-flash span {display: block; transform: rotate(-45deg); position: relative; left: -24%; top: 0px; line-height: 1.25em; }

.btn.btn-basket,
.product-panel .btn				{margin-top: 0px; /* border-radius: 0; background-image: url(/_assets/icon-basket-2-blk.svg); padding-right: 0; padding-left: 75px;*/ background-size: 27px auto; background-repeat: no-repeat; 
                                background-position: left 20px center; text-align: center;  background-color: #f49739; 
                                width: 100%; transition: 0.2s ease-out; color: #191919;}

.product-panel .btn:hover     {/*background-image: url(/_assets/icon-basket-2.svg);*/ color: #fff; background-color: #191919;}

.product-panel .btn	{min-width: unset;}

.product-panel-image-container:hover .product-panel-image	{transform: scale(1.1)}

.airata .product-panel h3 {color: #B2BDB2;}

.airata .btn.btn-basket,
.airata .product-panel .btn {background-color: #B2BDB2;}




.variants		{display: flex; list-style: none; margin-bottom: 8px; flex-wrap: wrap; justify-content: left; margin-top: 10px; }
.variants li	{margin-right: 6px; margin-bottom: 6px; }
.variants li a	{width:auto; height: 24px; border-radius: 4px; display: block; padding: 6px; color: #fff; text-decoration: none; transition: 0.2s ease-in-out;}

.variants li a:hover {opacity: 0.5; }

.variants li.purple	a		{background-color: #9ECAED}
.variants li.turquoise a	{background-color: #25E1D0}
.variants li.orange	a		{background-color: #F49638}
.variants li.red a			{background-color: #D33B54}

.variants li a.no-filter    { width: 100%; text-decoration: none; }

ul.variants li {margin-left: 0px; font-size: 12px; line-height: 1em; width: auto;}


/* PRODUCT DETAIL PAGE */
.product-detail-carousel-container	{position: relative}
.product-detail-carousel			{width:100%;}
.product-detail-carousel .slide		{display: inline-flex; align-items: center; padding: 30px; height: auto;}
.product-detail-carousel img		{margin: auto;}

.product-detail-carousel .slick-list,
.product-detail-carousel .slick-track	{height: 100%;}
.product-detail-carousel .slick-track	{display: flex;}

.product-detail-carousel-container .carousel-nav-plain  {margin-top:unset;}
.product-detail-carousel-container .slick-dots li button {display:none}

.full-image-width-carousel .carousel-nav-plain  	{margin-top:20px; ;}
.full-image-width-carousel .slick-dots li button 	{display:none}

.product-top	{margin-bottom: 40px;}

.product-detail-text h1,
.product-detail-text h2	{font-size: 34px; text-transform: none; color:#5c5c5c; line-height: 1.2em; margin-bottom: 1em;}
.product-detail-text h3	{font-size: 28px; text-transform: none; color:#5c5c5c; line-height: 1.2em; margin-bottom: 1em;}

.product-detail-text #listPrice{font-size: 42px;}

.product-select			{margin-bottom: 20px;}
.product-select label	{font-size: 18px; display: block; margin-bottom: 10px;}

.quantity-total			{display: flex; align-items: end;}
.quantity-total button	{background-color:transparent; font-size: 0}
.quantity-total input	{width:60px; margin: 0 4px; border:1px solid #5C5C5C; text-align: center;}
.quantity-total .qty	{display: flex;}
.quantity-total h3		{font-size: 38px; font-weight: 800; margin-left: 15px; color:#5C5C5C}

.product-detail-buttons							{text-align: center; display: flex; justify-content: space-between; margin-top: 25px;}
.product-detail-buttons p						{font-size: 28px; font-weight: 800; margin: 10px 0; color:#5c5c5c}
.product-detail-buttons .btn					{width: 260px; }
.product-detail-buttons .btn.btn-basket			{text-align: center; background-position: left 30% center; margin: 0; background-image: none}
.product-detail-buttons .btn.btn-paypal			{background-color: #FDC438; /*border-radius: 0;*/ margin-top: 0; padding: 10px 0; display: inline-flex; align-items: center; justify-content: center}
.product-detail-buttons .btn.btn-paypal:hover	{background-color:#FDC438 !important}
.product-detail-buttons .btn.btn-paypal img		{width:60%; max-width: 100%;}

.product-detail-buttons .btn:not(.exclude):hover	{transform: translateY(3px); color: #ffffff;}

.product-detail-pullout					{border-top:1px solid #5C5C5C; border-bottom: 1px solid #5C5C5C; padding: 15px; display: flex; align-items: center;}
.product-detail-pullout	img				{width:100px; margin-right: 30px; flex-shrink: 0}
.product-detail-pullout p				{font-size: 20px; font-weight: 500; color:#5c5c5c; line-height: 1.3em;}
.product-detail-pullout p:last-child	{margin-bottom: 0}

.product-detail-pullout-text			{}

.product-detail-bottom	{margin-top: 0px;}

.product-detail-bottom .col-2.col-a {margin-top: 45px; }

/*.specifications 				{background-color:#F0F0F0; padding: 25px;}
.specifications p				{color:#5C5C5C; font-size: 20px;}
.specifications p:last-child	{margin-bottom: 0}*/

.specifications ul              {line-height: 1.4em; margin-left: 15px;}
.specifications ul li           {margin-bottom: 0.7em;}

.related-products-container					{border-top:1px solid #5C5C5C; margin-top:30px; margin-bottom: 50px;}
.rel-prod-head h3							{font-size: 24px; font-weight: 700; display: block; text-align: center; margin:30px 0 20px 0}
.related-products-container	.slick-list,
.related-products-container	.slick-track	{height: 100%;}
.related-products-container	.slick-track	{display: flex;}
.related-products-container .col-4			{height: auto}

.related-products-container .slick-arrow			{width: 20px; height: 38px;}
.related-products-container .slick-arrow.slick-next	{right:-40px;}
.related-products-container .slick-arrow.slick-prev	{left:-40px;}

/* ACCORDION */
.accordion .accordion-item								{margin-bottom:15px;}
.accordion .accordion-item h3							{font-size:20px; color: #ffffff; background-color: #5C5C5C; position: relative; cursor: pointer; line-height: 1.4em; padding: 10px 40px 10px 20px;}
.accordion .accordion-item h3 span.plus 				{width:15px; height: 15px; position:absolute; right:20px; display: block; top:15px;}
.accordion .accordion-item h3 span.plus:before			{width:4px; height: 100%; background-color: #ffffff; position: absolute; left: 10px; top: 0; content: '';}
.accordion .accordion-item h3 span.plus:after			{width:4px; height: 100%; background-color: #ffffff; position: absolute; left: 10px; top: 0; content: ''; transform: rotate(90deg);}
.accordion .accordion-item.active h3					{background-color: #333333; color: #ffffff;}
.accordion .accordion-item.active h3 span.plus:after	{background-color: #ffffff;}
.accordion .accordion-item.active h3 span.plus:before	{display:none;}
.accordion .accordion-expanded							{display:none; padding:20px;}
.accordion .accordion-expanded p:last-child				{margin-bottom:0;}
.accordion .accordion-item:last-child					{margin-bottom: 0}

.accordion .accordion-item ul	{font-size: 18px; line-height: 1.4em; margin: 0 1em 1em;}




.accordion .accordion-item.product-info                         {background-color: #ebf6fd;}
.accordion .accordion-item.product-info h3                      {background-color: #53a2da; color: #ebf6fe;}
.accordion .accordion-item.product-info h3 span.plus:before,
.accordion .accordion-item.product-info h3 span.plus:after      {background-color: #ebf6fe;}

.accordion .accordion-item.accessories                         {background-color: #edfbfa;}
.accordion .accordion-item.accessories h3                      {background-color: #56d8cd; color: #eef6f9;}
.accordion .accordion-item.accessories h3 span.plus:before,
.accordion .accordion-item.accessories h3 span.plus:after      {background-color: #ebf6fe;}

.accordion .accordion-item.general-info                             {background-color: #fff1e2;}
.accordion .accordion-item.general-info h3                          {background-color: #F49739; color: #fdf4ec;}
.accordion .accordion-item.general-info h3 span.plus:before,
.accordion .accordion-item.general-infos h3 span.plus:after          {background-color: #ebf6fe;}

.accordion .accordion-item.delivery-and-returns                              {background-color: #ffeaee;}
.accordion .accordion-item.delivery-and-returns h3                           {background-color: #d23955; color: #faebee;}
.accordion .accordion-item.delivery-and-returns h3 span.plus:before,
.accordion .accordion-item.delivery-and-returns h3 span.plus:after           {background-color: #ebf6fe;}



/* ANIMATED HEADER CAROUSEL */
.carousel-animated-header-container		{position: relative;}
.carousel-animated-header				{text-align: center; background-color: #ffffff}
.carousel-animated-header .slide		{position: relative; padding: 60px 0 120px}
.carousel-animated-header .slide img	{position: absolute; right:0; bottom: 0px; width:350px;}
.carousel-animated-header p				{font-size: 19px; width:650px; max-width: 100%; margin: auto}
.carousel-animated-header p.subheader	{font-weight: 700; color:#000000; font-size: 32px; width: 100%;}
.carousel-animated-header .inner		{width:800px;}
.animated-header-outer					{text-transform:uppercase; font-size: 50px; margin: 22px 0 30px 0; line-height: 55px; font-weight: bold;}
.animated-header						{position: relative; display: inline-block; font-size: 50px; font-weight: 300;}
.animated-header .wrap                  { min-height: 54px; display: inline-block; font-size: 58px; font-weight: bold;}



.pipe		{animation-name: blink; animation-duration: 0.75s; animation-iteration-count: infinite; opacity: 0; width:1px; height: 100%; background-color: #2c2c2c; position: absolute; right: -5px; top:0;}

/* QUESTION LINKS */
.question-links	{padding: 40px 0; background-color: #f1f1f1}
.question-links ul.tab-list	{margin-top: 25px;}

@keyframes blink {
	0%		{opacity: 0}
	50%		{opacity: 1}
	100%	{opacity: 0}
}

/* PRODUCT LISTING PULLOUT */
.product-listing-pullout 				{padding: 40px 0}
.product-listing-pullout h1				{display: block; text-align: center;}
.product-listing-pullout h2				{display: block; text-align: center;}
.product-listing-pullout .col-container	{display: flex; flex-wrap: wrap}

/* BASKET */
.basket-section .cols				{display: flex; justify-content: space-between; padding: 30px 0}
.basket-section .col-basket			{width:65%;}
.basket-image						{width:125px; /*background-color: #f1f1f1;*/ padding: 20px; flex-shrink: 0; margin-right: 20px;}
.basket-image-text					{display: flex; align-items: flex-start; padding-right: 150px}
.basket-image-text h1				{font-size: 18px; color:#5c5c5c; line-height: 1.2em; text-transform: none; font-weight: 600}
.basket-image-text h2				{font-size: 18px; color:#5c5c5c; line-height: 1.2em; text-transform: none; font-weight: 600}
.basket-image-text h3				{font-size: 18px; color:#3c3c3c; line-height: 1.2em; margin-bottom: 10px;}
.basket-image-text h4				{font-size: 16px; color:#3c3c3c; line-height: 1.2em; margin-bottom: 0.5em}
.basket-image-text p				{font-size: 14px; color:#3c3c3c; line-height: 1.2em;}
.basket-item						{border-bottom: 1px solid #dddddd; margin-bottom: 20px; position: relative;}
.basket-item .product-select		{padding-left: 145px;}
.basket-item .product-select label	{font-size: 14px; font-weight: 700}
.basket-item .quantity-total		{justify-content: space-between;}
.basket-item .quantity-total h3		{font-size: 28px;}
.remove { position: absolute; right: 0; top: 0; font-size: 14px; background-color: transparent; text-decoration: underline; }
p.text-qualify						{background-image:url(/_assets/tick.svg); background-size: 20px auto; background-position:top 3px left; background-repeat: no-repeat; padding-left: 30px;}
.basket-item .quantity-total h3 span.promo { font-size: 15px; font-weight: normal; color: #fb9e26; line-height: 2em; margin-right: 10px; }

.basket-item .btn-quantity-up,
.basket-item .btn-quantity-down { display: inline-block; width: 40px; height: 40px; background-color: transparent; background-size: cover; background-position: center; background-repeat: no-repeat; margin: 0; border: 0; cursor: pointer;  }

.basket-item .btn-quantity-up { background-image: url("/_assets/icon-plus.svg"); }
.basket-item .btn-quantity-down { background-image: url("/_assets/icon-minus.svg"); }


.col-basket-summary		{width:30%;}
.col-basket-summary .btn	{width:100%; margin-bottom: 20px;}
.summary-box			{padding: 30px; background-color: #F0F0F0; position: sticky; top:0}
.summary-box h5			{font-size: 20px; text-transform: uppercase; margin-bottom: 0.5em;}
.summary-box p			{font-size: 16px;}
.grand-total			{border-top:1px solid #cccccc; border-bottom:1px solid #cccccc; padding-top: 20px}
.grand-total p			{display: flex; justify-content: space-between; font-size: 18px;}
.grand-total p.text-gt	{font-size: 22px;}

/* CHECKOUT */
.form-page,
.checkout-page				{background-color:#f1f1f1; padding: 30px 0}
.form-page .inner,
.inner.inner-checkout		{background-color: #ffffff; padding-top:30px; padding-bottom: 70px;}
.inner.inner-checkout h1	{font-size: 40px; text-transform: uppercase; display: block; text-align: center; border-bottom: 1px dotted #cccccc; padding: 20px 0; margin-bottom: 40px; background: linear-gradient(to right, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.checkout-section			{width:500px; max-width: 100%; margin: auto}

.checkout-container				{margin: 20px 0; border: 1px solid #dddddd; border-left: 5px solid #dddddd;}
.checkout-container:last-child	{margin-bottom: 0}

.checkout-container.open .checkout-panel-bottom	{display: block}
.checkout-container.open .checkout-action span	{transform: rotate(90deg);}

.checkout-panel				{background-color: #ffffff;}
.checkout-container h1		{font-size: 20px; margin-bottom: 0.8em; border-bottom:1px dotted #cccccc; padding-bottom: 8px;}
.checkout-container h2		{font-size: 20px; margin-bottom: 0.8em; border-bottom:1px dotted #cccccc; padding-bottom: 8px;}
.checkout-container p		{font-size: 16px; color:#666666}

/* CHECKOUT ACTION */
.checkout-action			{position: relative; cursor: pointer; padding: 30px; transition: 0.2s ease-out}
.checkout-action p			{margin: 0; padding-right: 100px;}
.checkout-action span		{display: block; width:34px; height: 34px; position: absolute; right:30px; bottom: 30px; transition: 0.2s ease-out; background-image: url(/_assets/icon-expand.svg)}
.checkout-action:hover		{background-color: #dddddd;}
.checkout-action:hover span	{transform: translateX(5px)}

.checkout-container.open .checkout-action-2 span	{transform: rotate(0) translateY(-50%); background-color: #56D8C9; border-color:#56D8C9}
.checkout-container.no-border {border: 0}

.summary-container .form-cell.custom-cb .container { font-size: 16px; color: #666666; font-weight: 400 }
.summary-container .address-expanded 				{background-color:#f1f1f1; padding: 15px; margin-bottom: 20px;}

/* CHECKOUT ACTION 2 */
.checkout-action.checkout-action-2			{background-color:#ffffff;}
.checkout-action.checkout-action-2 span		{width:25px; height: 25px; border-radius: 25px; background-image: none; background-color: #ffffff; border:1px solid #666666; position: absolute; left: 30px; top:50%; transform: translateY(-50%)}

.ca-2-text		{display: flex; align-items: center; justify-content: space-between; padding-left: 35px;}
.ca-2-text img	{width:120px; flex-shrink: 0}
.ca-2-text p	{margin-bottom: 0; font-weight: bold;}

.summary-container .checkout-panel-bottom	{background-color:#ffffff}

.checkout-panel-bottom		     {display: none; padding: 30px; border-top:1px solid #cccccc;}
.checkout-panel-bottom p    	 {font-size: 16px; margin-bottom: 0;}
.checkout-panel-bottom.no-border {border: 0;}

.checkout-secure { text-align: center; margin: 35px 0 0 0 }
.checkout-secure p			{font-size: 16px;}

.checkout-container textarea	{background-color: #efefef; width: 100%; height: 150px; padding: 15px;}

.form-cell				{display: block; margin-bottom: 20px;}
.form-cell label		{display: block; font-weight: 700; margin-bottom: 9px;}
.form-cell select.custom-select,
.form-cell textarea,
.form-cell input		{padding: 15px; display: block; border:1px solid #cccccc; width:100%; transition: 0.2s ease-out}
.form-cell textarea:focus,
.form-cell input:focus	{box-shadow: 0 0 0 2px #333333; border-color:#333333}
.form-cell button		{width:100%;}
.form-cell:last-child	{margin-bottom: 0}
.form-cell select.custom-select {color: #999;font-size: 14px;}


.form-cell textarea		{height: 150px;}

.form-cell .select-css	{border:1px solid #cccccc; font-weight: normal; font-size: 16px; padding: 15px; background-position: right 15px top 50%, 0 0;}

.form-cell.custom-cb			{margin-bottom: 20px; display: flex;}
.form-cell.custom-cb .container	{align-items: flex-start; padding-top: 5px; padding-bottom: 0; margin-bottom: 0}

.form-cell.submit		{margin-top: 30px; margin-bottom: 0 !important}
.form-cell.submit input	{border:none}

.form-cell.ccv		{display: flex; flex-direction: column;}
.ccv-input			{display: flex; align-items: center;}
.ccv-input input	{width:100px;}
.ccv-input img		{width:45px; margin-left: 10px;}
.expiry-input		{display: flex;}
.expiry-input input	{width:80px; text-align: center; margin-right: 10px;}

/* DELIVERY */
.grey-panel				{background-color: #ffffff; padding: 30px;}
.current-address		{margin-top: 20px}
.current-address h3		{font-size: 18px; margin-bottom: 0.5em;}
.current-address p		{font-size: 16px;}
.current-address .btn	{margin-top: 10px; background-color: #5c5c5c}

.current-address 			{list-style: none}
.current-address li			{border-bottom: 1px solid #cccccc; margin-bottom: 20px; padding-bottom: 10px;}
.current-address li h3		{font-size: 16px;}
.current-address li p		{list-style: none; font-size: 14px;}
.current-address li .edit	{display: block; margin-top: 8px}

a.small-cta	{font-size: 14px;}

.current-address li .container,
.current-address li:last-child p,
.current-address li:last-child	{margin-bottom: 0; border: none}

p.or	{display: block; text-align: center; font-weight: 800; text-transform: uppercase; font-size: 20px;}

.form-compressed label					{font-size: 14px; margin-bottom: 5px;}
.form-compressed .form-cell				{margin-bottom: 12px;}
.form-compressed .form-cell .select-css,
.form-compressed .form-cell input		{padding: 10px 15px; font-size: 14px}
.form-compressed .form-cell.custom-cb	{margin-bottom: 20px;}

.form-cell.large-gap { margin-bottom: 24px; }

/* PAYMENT */
.payment-method		{border-top:1px solid #dddddd; border-bottom:1px solid #dddddd; padding: 30px 0; margin: 30px 0}
.payment-method	h3	{font-size: 20px; text-transform: uppercase}

.payment-basket-container h3					{margin-bottom: 1em;}
.payment-basket-container .basket-image-text	{padding-right: 0}
.payment-basket-container .basket-image-text h1	{font-size: 16px; color:#666666}
.payment-basket-container .basket-image-text h2	{font-size: 16px; color:#666666}
.payment-basket-container .basket-text h3		{font-size: 16px;}
.payment-basket-container .basket-item .product-select				{padding-left: 0; align-items: center}
.payment-basket-container .qty-text									{display: inline-flex; font-size: 14px;}
.payment-basket-container .qty										{margin-left: 10px;}
.payment-basket-container .basket-item .quantity-total h3			{font-size: 20px; margin-bottom: 0}
.payment-basket-container .basket-item:last-child					{border-bottom: none; margin-bottom: 0}
.payment-basket-container .basket-item .product-select label		{margin-bottom: 0}
.payment-basket-container .basket-item:last-child .product-select	{margin-bottom: 0}
.payment-basket-container .basket-image-text h4						{margin-bottom: 0.2em;}

.errors		{color:red; display: inline-block; line-height: 1.3em;}
.errors	li	{margin-bottom: 0.5em; line-height: 1.3em;}

/* BLOG LISTING */
.blog-listing-intro					{margin-top: 40px;}
.blog-listing-intro .grad-header	{margin-bottom: 20px}
.blog-listing-intro p				{font-size: 16px; width:960px; max-width: 100%;}

.blog-tags					{display: flex; justify-content: flex-start; flex-wrap: wrap; list-style: none; margin: 20px 0 10px; transition: 0.2s ease-out; padding: 20px 0 0}
.blog-tags li				{background-color:#72d4bd; padding: 15px 25px; 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:hover li			{opacity: 0.5; cursor: pointer;}
.blog-tags:hover li:hover	{opacity: 1}


.blog-tags .tint             {opacity: 0.5;}
.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 .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 POST */
.blog-hero-container					{text-align: center; margin-top: 40px;}
.blog-hero-container .grad-header		{border:none; margin-bottom: 0; padding:10px 0 0}
.blog-hero-container .grad-header h1	{line-height: 1.1em; width:768px; max-width: 100%; margin-left: auto; margin-right: auto; margin-bottom: 0.5em;}
.blog-hero-container p					{font-size: 16px; width:768px; max-width: 100%; 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-post-inner						{width:800px; max-width: 100%; margin:40px auto; padding-bottom: 60px;}
.blog-post-inner .intro	p			    {font-weight: 700; font-size: 20px; }

.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;}



/** 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;}
.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;}


/* FORM PAGE */
.form-page .form-container	{width:640px; max-width: 100%; margin: auto}
.form-intro					{text-align: center; margin-bottom: 25px;}
.grad-header				{text-align: center; border-bottom: 1px dotted #cccccc; padding: 20px 0; margin-bottom: 40px;}
.grad-header h1,				
.grad-header h2				{display: inline-block; font-size: 40px; text-transform: uppercase; text-align: center; background: linear-gradient(to right, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}

.grad-header-left	{text-align: left}

.form-cell.custom-cb.custom-cb-small label	{font-weight: 400; font-size: 16px;}

.form-group	{margin-bottom: 30px;}

span.gradient	{background: linear-gradient(to right, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}

/* FOOTER */
footer		{background-color:#3C3C3C; padding: 30px 40px; color:#ffffff;}
footer p	{color:#ffffff; font-size: 16px;}
footer h5	{font-size: 17px; margin-bottom: 0.5em; text-transform: uppercase}

.footer-top				{display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ffffff; padding-bottom: 20px; margin-bottom: 40px;}
.footer-top .social		{display: inline-flex; list-style: none}
.footer-top .social img	{width:41px;}
.footer-top .social li	{margin-left: 15px;}
.footer-top .logo		{width:290px; height: 69px; background-image: url(/_assets/logo-white.png);}

.footer-bottom			{display: flex; justify-content: space-between}
.footer-bottom-right	{width:65%; display: inline-flex; justify-content: space-between;}




.newsletter-sign-up							{width:30%}
.newsletter-sign-up	p						{margin-bottom: 1.5em}
.newsletter-text-field						{width:100%; display: flex; position: relative}
.newsletter-text-field input[type="text"]	{height: 65px; border-top-left-radius: 50px; border-bottom-left-radius: 50px; width:calc(100% - 50px); padding-left: 20px; color:#5C5C5C; font-size: 20px; font-weight: 700;}
.newsletter-text-field input[type="submit"]	{border-radius: 50px; position: absolute; right:0; top:0; height: 100%; padding: 0 20px; font-size: 18px; text-transform: uppercase; font-weight: 700; background-color: #5C5C5C; color:#ffffff;}
.newsletter-text-field input[type="submit"]:hover	{background-color: #333333}

.quicklinks ul		{font-size: 16px; list-style: none}
.quicklinks ul li	{margin-bottom: 10px; margin-left: 0px;}
.quicklinks ul li a	{text-decoration: none; }


/* CIRCLES */
.circle-section					{text-align: center; padding: 40px 0px;}
.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 !important;}
.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-col:last-child:after	{display: none}
.circle-col:nth-child(2):after	{transform: scaleY(-1); top:120px;}
.circle-section .inner			{width:1230px; max-width: 100%;}

/* TEXT PAGE */
.text-page ul,
.text-page ol,
.text-page p		{color: #3C3C3C; font-size: 18px; line-height: 1.5em; margin-bottom: 1em; word-break: break-word;}

.text-page ul,
.text-page ol		{margin: 1em;}

.text-page ul li,
.text-page ol li	{margin-bottom: 0.5em;}

/* 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); width: 100%; }
.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;}
.popup-content .col-left h2	{font-size: 20px; text-transform: none; margin-bottom: 0.65em; line-height: 1.2em}
.popup-content .col-left p	{font-size: 14px;}
.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;}

.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}

.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; /*background: linear-gradient(-45deg, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%);*/background:#fff;}

.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 .title { padding: 10px 20px; font-size: 24px; font-weight: bold; background-color: #56d8c9; color: #ffffff; }

.popup-form .content { padding: 20px; }

.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; }

.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; }

.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 !important; opacity: 0; transition: 1s ease-in-out;}
.fadein     {height: 100% !important; opacity: 1;}

.hidden .popup-overlay {height: 0;}
.fadein .popup-overlay {height: 100%;}


/* FORM */
.select-css 			{display: block; font-size: 17px; font-weight: 800; color:#5C5C5C; border-top:1px solid #5C5C5C; border-bottom: 1px solid #5C5C5C; line-height: 1.3; padding: .6em 0 .5em 15px; width: 100%;  max-width: 100%; box-sizing: border-box; margin: 0; -moz-appearance: none; -webkit-appearance: none; appearance: none; background-color: #fff; background-image: url(/_assets/select-arrow.png); background-repeat: no-repeat, repeat; background-position: right top 50%, 0 0; background-size: 25px auto;}
.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;}

.select-css-v2			    {border:1px solid #5C5C5C; border-radius: 3px; background-color: #fff; background-position: right 10px top 50%, 0 0; font-weight: 400}
.select-css-v3 				{max-width: 260px;}
.google-pay-btn				{width: 260px;}

.product-cc-logos img.cc-logos {max-width: 260px;}


.form-container select.error,
.form-container input.error { background-color: #ffefef; border-color: #D23955; color: #000;}
.form-container p.error-text { background-color: #ffefef; padding:20px; }


/* BUTTONS */
.btn { font-size: 18px; font-weight: 700; text-decoration: none; color: #ffffff; /*text-transform: uppercase;*/ border-radius: 4px; min-width: 200px; background-color: #56D8C9; padding: 20px 25px; display: inline-block; text-align: center; margin-top: 20px; cursor: pointer; transition: 0.2s ease-out;}
.btn:hover	{background-color: #333333 !important;}

.btn.block	{display: block; width: 100%;}

.btn.small	{font-size: 14px; padding: 15px 25px; min-width: unset}


.btn.cs-filter-btn {border: 3px solid #56D8C9; transition: 0.5s ease-in; }
.btn.cs-filter-btn.active {border: 3px solid #0a1418; }



.error {color: red;}
.form-cell.error input {border-color: red;}
.form-cell.error select {border-color: red;}

.form-field-error { color: #cc0000; margin-top: 5px; font-size: 11px; }

input[type="submit"].hidden {display: none !important;}

.alert-please-wait {display: none; font-size: 20px; text-align: right; padding-top: 15px;}

.ui-dialog .ui-dialog-content p {line-height: 1.4em; margin-bottom: 0.75em;}
.ui-dialog .ui-dialog-content p span {font-weight: bold;}
.ui-dialog .btn { color: #ffffff; font-weight: 700; text-shadow: none; }
.ui-dialog .btn:focus {background-color: #56D8C9;}

.ui-dialog.alert {border-color: #cc0000;}
.ui-dialog.alert .ui-dialog-titlebar {background-color: #cc0000; color: #ffffff;}

.hide {display: none;}


p iframe {width: 100%; height: 300px; transition: 0.2s ease-in;}

section.free-delivery {display: block;width: 100%;text-align: center;background-color: #34ddc6;padding: 10px;height: 40px;color: #fff;text-transform: uppercase;font-size: 16px;font-weight: 700;}

section.free-delivery p {display: block;width: 100%;text-align: center; color: #fff;text-transform: uppercase;font-size: 16px;font-weight: 700;}


.login-panel .checkout-panel-bottom	 {border:none}


/* .payment-method-container.pp { display: none; } */
.discount-code-section { display: none; }



.discount-container,
.referral-discount-container { margin-top: 10px; }

.discount-container h6                          { margin: 10px 0; }
.discount-flex                                  { display: flex; justify-content: space-between; }
.discount-container input[type=text]            { padding: 5px; width: 80%; }
.discount-container input[type=submit]          { background-color: #5c5c5c; color: #ffffff; padding: 7px; }
.discount-container input[type=submit]:hover    { background-color: #2c2c2c; transition: 0.3s; }
.code-error                                     { margin-top: 10px; }

.discount-applied p                             { position:relative; transform: translateY(50%); line-height: 1.2em; }
.discount-container p strong                    { color: #FB9E26; }

.btn-remove-referral-code { font-weight: bold; margin: 0 0 20px 0; }
.btn-remove-referral-code:hover { text-decoration: underline; }

.paypal-pp-logo-svg { vertical-align: middle; height: 100%; text-align: left; }
.paypal-logo-svg { vertical-align: middle; height: 100%; text-align: left; }
.paypal-button .paypal-span-spacer { font-size: 16px; width: 0px; }
.paypal-button .paypal-button-span { font-size: 13px; vertical-align: middle; height: 30px; display: inline-block; width: 79px; background-image: none; background-repeat: unset; margin: 0; }
.paypal-button .paypalin3-button-span { font-size: 13px; vertical-align: middle; height: 30px; display: inline-block; width: 100px; background-image: none; background-repeat: unset; margin: 0; }

.newsletter-text-field input[type="text"].error,
.newsletter-text-field input[type="text"].error::placeholder { color: #ff0000; }

.newsletter-error { text-align: center; }
.newsletter-thank-you { text-align: center; }

.searchResult p { margin: 0; }
.searchResult p span { white-space: nowrap; }

/* Login */
.inner.inner-login { padding-top: 30px; padding-bottom: 70px; }
.inner.inner-login h1 { font-size: 40px; text-transform: uppercase; display: block; text-align: center; border-bottom: 1px dotted #cccccc; padding: 20px 0; margin-bottom: 40px; background: linear-gradient(to right, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

/* Reset Password */
.inner.inner-reset-password { padding-top: 30px; padding-bottom: 70px; }
.inner.inner-reset-password h1 { font-size: 40px; text-transform: uppercase; display: block; text-align: center; border-bottom: 1px dotted #cccccc; padding: 20px 0; margin-bottom: 40px; background: linear-gradient(to right, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

.form-instructions { padding: 0; }
/*.form-instructions.email-sent,
.form-instructions.initiate,
.form-instructions.invalid-link,
.form-instructions.password-changed,
.form-instructions.new-password {  }*/

.product-detail-delivery {margin-top: 25px;}
.product-detail-delivery .delivery-options {background: none; font-size: 14px; text-decoration:underline;}
.product-detail-delivery .delivery-options-expaned {font-size: 14px; padding: 10px 0;}
.product-detail-delivery .delivery-items {margin-bottom: 8px;}

.product-page  .promo-buttons {display: flex; flex-direction: row; gap: 20px; }

.product-page  .promo-buttons .max-floor-area,
.product-page  .promo-buttons .promo-code {font-size: 18px; text-align: center; padding: 10px; width: 40%; min-height: 50px; background-color: #53a2da; color: #fff; font-weight: bold; display: flex; justify-content: center; align-items: center; line-height: 1.5em; margin-bottom: 20px; }

.product-page  .promo-buttons .promo-code {background-color: #d23955;}


/* Accordion Page Pabel */

section[data-name="AccordonPanel"] {margin-bottom: 10px; padding-bottom: 0px; /*max-width: 85%;*/}
@media (max-width: 960px) {
section[data-name="AccordonPanel"] {max-width: unset; }
}


h2.accordion {cursor: pointer; padding:  10px 10px 10px 44px; background-color: #eafbf9; font-size: 18px; position: relative; text-transform: unset; font-weight: 600; line-height: 1.2em;}

h2.accordion:after {content: ''; background-image: url("/_assets/icon-expand.svg"); background-position: center ;  background-repeat: no-repeat; display: inline-block; position: absolute; top: 6px; left: 8px; width: 30px; height: 30px; background-size: 80%; transition: 0.2s ease-in-out;}

h2.accordion.active:after {transform: rotate(90deg);}

.accordon_panel .expanded {display: none; max-width: 66%;}

/* ENQUIRY FORMS */

.form-row {display: flex; justify-content: space-between; width: 100%;}
.form-row .form-col-2 {width: 49%;}
div#pnlFormErrorsScrollMEV {padding: 0 5vw;}
#crmWebToEntityForm {background-color: unset !important;}
.zcwf_row input, .zcwf_row select {min-height: 40px !important; padding: 5px; }
div#pnlFormErrorsScrollMEV  label {font-size: 14px; font-weight: normal;}

.form-row .form-col-2 h2 {font-size: 32px;}
.form-row .form-col-2 .error {background-color: #ffd9d9; color: #000;}

.form-row ol li, ul li {margin-left: 20px; font-size: 14px; line-height: 1.4em;}
.form-row ol li, ul li {margin-bottom: 0.7em;}
    

    
/* PROMO CALL OUT*/

.promoBanner {display: inline-block; padding: 10px; text-align: left; background-color: #34ddc6; border-radius: 4px; margin-bottom: 20px;}
.promoBanner h2 {color: #fff; margin-bottom: 0px; line-height: 1.2em; font-size: 50px;}
.promoBanner h3 {color: #fff; font-size: 20px; margin-bottom: 0px;}

.promoBanner h3 span {font-size: 40px;}

.promoBanner.cross-sell {opacity: 0.7;}


/* */
.carousel-v3 .slide { padding: 40px 0 100px; /*background: rgb(255,237,219); background: linear-gradient(180deg, rgba(255,237,219,1) 0%, rgba(250,213,176,1) 100%);*/ }
.carousel-v3 .text-top-outer { display: flex; justify-content: flex-end; margin-top: 40px; }

.carousel-v3 .slick-track			{ display: flex; }
.carousel-v3 .slick-track .slide	{ height: auto; }


.advert {border: 1px solid #35ddc6; transition: 0.2s ease-in; max-width: 320px; margin: auto;}
.advert:hover {cursor: pointer; opacity: 0.75;}

.mobile-only {display: none;}


/* BUILD A QUOTE */

.product-areas.baq .col-listing-right {width: 100%;}
.product-areas.baq .product-panel-image {background-size: contain;}

.baq .product-panel {padding-bottom: 0px; }
.baq .product-panel h3 {font-size: 24px; }
.baq .product-panel p {display: block}

.baq.product-listing .product-panel-text p {display: none;}



/* SPECIFICATIONS TABLE */

.product-detail-bottom .specifications table td {padding: 5px; background-color: #fff; font-size: 12px; color: #5C5C5C; font-size: 16px; line-height: 1.2em; border-right: 5px solid #f0f0f0; border-bottom: 5px solid #f0f0f0; }

.product-detail-bottom .specifications table td:nth-child(1) { background-color: #53a2da; color: #fff;}



/* IE10+ SPECIFIC STYLES GO HERE. IE10+ NO LONGER SUPPORT CONDITIONAL STATEMENTS IN THE HEAD OF A FILE */
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) { }

/*****************/
/* MOBILE STYLES */

@media (max-width: 1200px) 
{
    
}

@media (max-width: 1024px) 
{
    /* IPAD (LANDSCAPE) */
}

@media (max-width: 960px) 
{
    
}

@media (max-width: 768px) 
{
    /* IPAD (PORTRAIT) */
    p iframe {width: 100%; height: 200px;}
	
	.col-filter-left .advert {display: none;}
	.mobile-only {display: block;}
	
	
}

@media (max-width: 625px) 
{
      p iframe {width: 100%; height: 68vw;}

}

@media (max-width: 414px) 
{
    /* IPHONE 6+, GOOGLE NEXUS 5X & GOOGLE NEXUS 6P */
}

@media (max-width: 375px) 
{
    /* IPHONE 6 */
}

@media (max-width: 360px) 
{
    /* SAMSUNG GALAXY S5 */
}

@media (max-width: 320px) 
{
    /* IPHONE 5 */
}

/* HOME HERO CONTAINER */
.home-hero-container { display: flex; flex-direction: column; min-height: auto; padding-top: 50px; position: relative; }
.home-hero-container .inner { height: 100%; display: flex; justify-content: center; flex-direction: column; position: relative; z-index: 2; }
.home-hero-outer { height: 100%; background-size: cover; background-position: center; padding-top: 50px; padding-bottom: 20px; }
.content-header h1,
/*
.home-hero-container h1			{font-size: 84px; box-shadow: 20px 0 0 #fff, -20px 0 0 #fff; box-decoration-break: clone; background-color: #fff; display: inline; line-height: 1.5em; font-weight: 800}
*/
/*.home-hero-container h1 { font-size: 105px; color: #FFF; display: inline; line-height: 1em; font-weight: 800 }*/
.home-hero-text { width: 650px; max-width: 100%; padding-bottom: 30px; }
.sub-text { color: #fff; font-size: 24px; margin-top: 35px; line-height: 1.3em; }

.home-hero-outer .overlay { height: 100%; width: 100%; position: fixed; overflow: auto; top: 0px; left: 0px; background: rgba(0, 0, 0, 0.05); }

.home-hero-carousel .slide { position: relative; }


.inner-outer { height: 100%; }
.inner.image img { max-width: 420px; height: auto; padding-top: 40%; }

.home-hero-carousel-container { margin-top: -50px; height: 100%; position: relative; }
.home-hero-carousel .slick-list,
.home-hero-carousel .slick-track,
.home-hero-carousel { height: 100%; }

.carousel-nav2 { position: absolute; bottom: 30px; width: 100%; }
.carousel-nav2 ul { display: flex; justify-content: center; list-style: none; font-size: 0 }
.carousel-nav2 ul li { width: 18px; height: 18px; border-radius: 18px; background-color: #000000; margin: 0 5px; position: relative }
.carousel-nav2 ul li:after { width: 22px; height: 22px; border-radius: 20px; position: absolute; left: -4px; top: -4px; content: ''; opacity: 0; transform: scale(0.5); transform-origin: center; transition: 0.2s ease-out;/* border: 2px solid #000000;*/ }
.carousel-nav2 ul li.slick-active:after { opacity: 1; transform: scale(1) }

.home-hero-carousel-container .carousel-nav2 { position: absolute; left: 0; bottom: 15px; width: 100%; }
.home-hero-carousel-container .carousel-nav2 ul { list-style: none; margin: 0; display: flex; }
.home-hero-carousel-container .carousel-nav2 ul.slick-dots li { font-size: 0; width: 16px; height: 16px; border-radius: 16px; border: 2px solid #ffffff; background-color: transparent; margin-right: 5px; }
.home-hero-carousel-container .carousel-nav2 ul.slick-dots li.slick-active { background-color: #ffffff; }

.home-hero-text span { line-height: 1em; }

/* SPINNER - loading.io */

.lds-ring { display: inline-block; position: fixed; top: 50%; left: 50%; margin-left: -32px; margin-top: -32px; width: 64px; height: 64px; z-index: 10; }
.lds-ring div { box-sizing: border-box; display: block; position: absolute; width: 51px; height: 51px; margin: 6px; border: 6px solid #56D8C9; border-radius: 50%; animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: #56D8C9 transparent transparent transparent; }
.lds-ring div:nth-child(1) { animation-delay: -0.45s; }
.lds-ring div:nth-child(2) { animation-delay: -0.3s; }
.lds-ring div:nth-child(3) { animation-delay: -0.15s; }

.spinner { opacity: 0.8; pointer-events: none; }

#apple-pay-button {height: 48px; width: 100%; display: inline-block; -webkit-appearance: -apple-pay-button; -apple-pay-button-type: plain; -apple-pay-button-style: black;}


@keyframes lds-ring {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.product-card-button 										{align-self: flex-end; width: 100%; margin-top: auto; position: relative; z-index: 20 }
.product-card-button .product-select .qty 					{justify-content: space-between; border-radius: 0; border-top-left-radius: 4px; border-top-right-radius: 4px; }
.product-card-button .product-select .qty button 			{height: 35px; }
.product-card-button .product-select .qty input[type=number]{background-color: transparent;}

.product-card-button .product-select 						{width: 100%; margin: 0; opacity: 0; visibility: hidden; transform: translateY(-5px); transition: all ease-in-out .25s; }
.product-card-button .product-select.active 				{opacity: 1; visibility: visible; transform: translateY(0)}

.product-card-button .product-select.active ~ .btn {}


/*.product-card-button .product-select { width: 100%; margin: auto; opacity: 0; visibility: hidden; transition: all ease-in-out .25s; }*/
/*.product-card-button .product-select.active { opacity: 1; visibility: visible;*/

.product-card-button .btn { border-top-left-radius: 0; border-top-right-radius: 0; margin-top: 10px; box-shadow: none; display: block; width: 100%; }
.product-card-button .btn:hover { background-color: #3c3c3c; transform: none }
.product-card-button .product-select .quantity-total { display: block; }

.qty button { width: 35px; background-color: #ffffff; border: none; background-size: 10px auto; background-repeat: no-repeat; background-position: center; border-radius: 4px; transition: 0.2s ease-out; }
.qty button.minus { background-image: url(/_uploads/icons/icon-minus-black.svg); }
.qty button.plus { background-image: url(/_uploads/icons/icon-plus-black.svg); }
.qty input[type="number"] { width: 40px; text-align: center; border: none; font-size: 24px; padding: 0; font-weight: normal; flex-grow: 0; margin: 0 4px; border-radius: 3px; }

.quantity-total button { background-color: #f49739; font-size: 0; }

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Firefox */
input[type=number] { -moz-appearance: textfield; }


.basket-notes { width: 100%; }
.basket-panel-upload { margin-top: 20px; }
.basket-file-upload { margin-bottom: 10px; }
.basket-file-list { display: flex; justify-content: space-between; margin-left: 0; }
.basket-file-list .right .remove-file { text-decoration: underline; }

.build-a-quote-order-submit-section,
.build-a-quote-order-thanks-section { width: 500px; max-width: 100%; margin: auto; }

.inner.inner-submit h1,
.inner.inner-thanks h1 { font-size: 40px; text-transform: uppercase; display: block; text-align: center; border-bottom: 1px dotted #cccccc; padding: 20px 0; margin-bottom: 40px; background: linear-gradient(to right, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }



/* 2024 STYLES */
.bg-image-with-cols						{background-size: cover; background-position: center}
.two-col-with-grid .cols,
.bg-image-with-cols .cols				{width: calc(100% + 40px); flex-wrap: wrap; margin-left: -20px; display: flex; justify-content: flex-start}
.bg-image-with-cols .col				{padding: 20px;}
.bg-image-with-cols .cols.span-2 .col	{width: 50%;}
.bg-image-with-cols .cols.span-3 .col	{width: 33.333%;}

.bg-image-with-cols		{padding: 50px 0}
.biwc-card				{background-color: #ffffff; background-position: center; background-size: cover; transition: 0.3s ease-out; border-radius: 10px; display: flex; flex-direction: column; justify-content: space-between; text-decoration: none; box-shadow: 0 0 20px rgba(0,0,0,0.2); height: 100%; padding: 30px;}
.biwc-card h2			{font-size: 30px;}
.biwc-card:hover		{transform: translateY(5px)}
.biwc-card:hover .btn	{background-color: #333333}

.two-col-with-grid					{overflow: hidden; padding: 50px 0; background:#ffffff; position: relative;}
.two-col-with-grid .inner			{position:relative; z-index: 5}
.two-col-with-grid .cols			{align-items: center}
.two-col-with-grid .cols .col		{width: 50%; padding: 20px;}
.two-col-with-grid .col.col-grid	{display: flex; justify-content: center; flex-direction: column; align-items: center;}

.two-col-with-grid .grid					{display: flex; width: 100%; flex-wrap: wrap}
.two-col-with-grid .col-grid-image			{width: 50%; padding: 15px;}
.two-col-with-grid .grid-image				{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: center}
.two-col-with-grid .grid-image-container	{padding-top: 100%; position: relative;}
	
.two-col-with-grid .cols .col	{position: relative;}
.two-col-with-grid:before		{position: absolute; content: ''; left: 0; top: 0; height: 100%; width: 50%;}
.two-col-with-grid:after		{position: absolute; content: ''; left: 50%; top: 0; height: 100%; width: 50%; /*background-color: #f1f1f1*/}

.two-col-with-grid .case-study-gallery-container		{width: calc(100% - 40px); padding-bottom: 10px;}
.two-col-with-grid .case-study-gallery					{width: 100%}
.two-col-with-grid .case-study-gallery ul.slick-dots li	{border:1px solid #cccccc}
.two-col-with-grid .case-study-gallery .slick-prev	{left: -30px;}
.two-col-with-grid .case-study-gallery .slick-next	{right: -30px;}

.accordion-section				{padding: 50px 0}

.basket-box 		{position: fixed; gap:10px; top: 44px; right: 14px; display: flex; padding: 20px; background-color: #fff; z-index: -1; box-shadow: 0px 0px 10px rgba(0,0,0,0.16); border-radius: 50px; align-items: center; z-index: 999;  opacity: 0; visibility: hidden; transition: all ease-in-out .3s;}
.basket-box.open 	{opacity: 1; visibility: visible;}
.basket-box p		{font-weight: 700; margin: 0; font-size: 16px;}

.col-container.product-areas { justify-content:space-between; }
.col-container.product-areas .col-left { width: 300px; padding-left: 18px; margin-top: auto; margin-bottom: auto; }
.col-container.product-areas .col-left a.back-product-areas { font-size: 16px; margin: auto; }


.two-col-with-grid .col.col-gallery {display: flex; flex-direction: column; justify-content: center; align-items: center;}



/*************************/
/*************************/



/* CASE STUDY PAGE */
section.case-study-detail-page			{margin-top: 15px}
section.case-study-detail-page .inner	{width: 1450px; max-width: 100%;}

/* 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: 65%; background-color:#ffffff; box-shadow: 0 0 40px rgba(0,0,0,0.1); display: flex; align-items: center}
.csh-cols .csh-text				{padding:40px 60px 40px 60px;}
.csh-cols .csh-text h1			{background: linear-gradient(to right, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 45px;}

section.case-study-detail-page .csh-cols .csh-text-inner p	{font-size: 20px; font-weight: 600; color: #3C3C3C !important; margin-bottom: 0}
section.case-study-detail-page .intro					{margin: 0}
.case-study-detail-page .copy-container	{width: 900px; max-width: 100%; margin-left: auto; margin-right: auto}

.csh-icons-container			{width:100%; margin-top: 40px;}
.csh-icons-container ul			{display: flex; flex-wrap: wrap; list-style: none;}
.csh-icons-container ul li		{width: 25%; justify-content: center; text-align: center; margin: 10px 0; text-transform: uppercase}
.csh-icons-container ul li p	{font-size: 16px; margin-bottom: 0; padding: 0 5px; /*font-weight: 700; background: linear-gradient(to right, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;*/}
.csh-icons-container ul li img	{height: 40px; width: auto; margin-bottom: 10px}

/* CASE STUDY TEXT */
.cs-cols		{display: flex; justify-content: space-between; gap: 50px;}
.cs-col-left	{width: 70%;}
.cs-col-left p	{line-height: 1.6em; margin-bottom: 1.2em}
.cs-col-right	{width: calc(30% - 50px);}
.cs-col-right img   {margin-bottom: 20px;}
.cs-col-right img:last-child    {margin-bottom: 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: 600; font-size: 26px; text-align: center;}
.cs-blockquote blockquote cite		{font-size: 18px; color:#34ddc6; font-weight: 700}
.cs-blockquote blockquote:before	{width: 86px; height: 62px; 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: 86px; height: 62px; 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: 32%}
.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;width: 14px; height: 26px;}
.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; display: flex; width: 100%; justify-content: center; bottom: -45px; list-style: none;}
.case-study-gallery ul.slick-dots li				{background-color: #f1f1f1; margin: 0 5px; border-radius: 10px; width: 10px; height: 10px; font-size: 0;}
.case-study-gallery ul.slick-dots li.slick-active	{background-color:#34ddc6;}

/* 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: linear-gradient(to right, #5E7F9F 0%, #008374 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: 50px; color: #ffffff}
.case-study-listing-header p				{font-size: 20px; line-height: 1.5em; font-weight: 600; color: #ffffff}
.cslh-text-container						{width: 640px; max-width: 100%;}

.cs-filter		{display: flex; justify-content: center; list-style: none; margin: 40px 0 25px; flex-wrap: wrap;}

.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: center;}
.cs-card h3					{font-size: 24px; margin-bottom: 0.2em;}
.cs-card p					{font-size: 16px;}
.cs-card-image-container	{position: relative; overflow: hidden; padding-top: 73%; margin-bottom: 15px;}
.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; background-color: #e6e6e6;}
.cs-card:hover .cs-card-image	{transform: scale(1.1);}

.cs-detail-listing		{padding: 50px 0; background-color: #edf7ff; margin: 70px 0 0 0; background: linear-gradient(to top right, #E7F1F9 0%, #EFD1D4 100%);}
.cs-detail-listing h2	{text-align: center; display: block; margin-bottom: 1em}

.case-study-listing-page .inner	{max-width: 1366px;}


.btn.btn-back-to-product-listing { color: #ffffff; background-color: #56D8C9; }
.product-panel .btn-back-to-product-listing { margin-top: 10px; }

#product-added-panel { height: 0; opacity: 0; visibility: hidden; transition: all ease-in-out .25s; }
#product-added-panel.active { opacity: 1; visibility: visible; margin-top:10px; height: 58px; }

.basket-section.build-a-quote .cols.back-product-areas { padding: 0; }
.basket-section.build-a-quote .btn.back-product-areas { margin: 0; }


/* BUILD A QUOTE */
.baq-landing-page .case-study-listing-header:before	{display: none}

.baq-landing-header			{}
.baq-landing-header h1		{font-size: 90px; font-weight: 800; margin-bottom: 0.35em;}
.baq-landing-header h1 span	{display: block; font-size: 26px; font-weight: 600; margin-top: 20px; text-transform: none}
.baq-landing-header p		{font-size: 22px; font-weight: 700}
.baq-landing-header p .btn	{line-height: 1.2em}

.baq-landing-header .csh-hero-image			{padding-bottom: 60px;}
.baq-landing-header .cslh-text-container	{width: 710px;}

.baq-landing-intro	{width: 960px; max-width: calc(100% - 60px); margin:-80px auto 0; position: relative; z-index: 2; background-color: #ffffff; border-radius: 30px; padding: 50px 90px; box-shadow: 0 0 50px rgba(0,0,0,0.1)}

ul.grad-tick-list				{list-style: none; margin:2em 1em;}
ul.grad-tick-list li			{font-size: 18px;  position: relative; padding-left: 60px; margin-left: 0; margin-bottom: 1em}
ul.grad-tick-list li:before		{width: 45px; height: 45px; background-image: url(/_assets/icon-grad-tick.svg); background-size: cover; background-repeat: no-repeat; content: ''; position: absolute; left: 0; top: 0;}

.baq-landing-steps			{position: relative; padding: 150px 0 40px 0; margin-top: -95px; z-index: 1}
.baq-landing-steps:before	{position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; background: linear-gradient(to right, #a5c8e9 0%, #72d4bd 25%, #e4934d 50%, #c24857 100%); opacity: 0.1;  z-index: -1;}
.baq-landing-steps h2		{display: block; text-align: center; font-size: 50px; font-weight: 800; margin-bottom: 40px;}
.baq-landing-steps .inner	{width: 1000px; max-width: 100%;}

.baq-step		{border-radius: 100px; display: flex; justify-content: flex-start; background-color: #ffffff; box-shadow: 0 0 10px rgba(0,0,0,0.2); position: relative; z-index: 2; overflow: hidden; min-height: 80px; margin-bottom: 20px;}
.baq-icon		{width: 115px; align-self: center; align-content: center}
.baq-icon img	{display: block; margin: auto; height: auto; width: 40px; }
.baq-step-left	{display: inline-flex;}
.baq-number		{background-color:#6CDAC6; width: 118px; display: inline-flex; align-items: center; justify-content: center;}
.baq-number p	{font-size: 34px; font-weight: 800; color: #ffffff; margin: 0; transform: translateX(5px)}
.baq-text		{align-self: center; padding-right: 20px}
.baq-text p		{margin: 0}

.baq-back		{font-size: 15px; display: block; margin-bottom: 20px;}
.baq-back:hover	{color:#f49739}

.btn.full-radius	{border-radius: 4px;}


/* Feefo */
.product-page-feefo-score-badge { margin: 40px auto 0px; width: 100%; max-width: 226px; }
.product-page-feefo-score-badge img {width: 100%; margin-bottom: 20px; height: auto; }



/* 2025 */
.full-image-with-text-video-stacked                 {padding: 50px 0}
.full-image-with-text-video-stacked .fiwt-text      {width: 100%;}
.full-image-with-text-video-stacked .fiwt-text p    {color: #3C3C3C}
.full-image-with-text-video-stacked .video-container    {margin-bottom: 30px;}
.stacked-video  {margin-bottom: 40px;}

.full-image-with-text-video-inline                  {padding-top: 50px;}
.full-image-with-text-video-inline .cols            {display: flex; justify-content: space-between; gap: 50px;}
.full-image-with-text-video-inline .col             {flex: 0 0 calc(50% - 25px);}
.full-image-with-text-video-inline .fiwt-text       {width: 100%;}
.full-image-with-text-video-inline .fiwt-text p     {color: #3C3C3C}
.full-image-with-text-video-inline .video-container {margin-bottom: 30px;}

.inline-videos-carousel .slick-arrow.slick-next    {right: -40px; width: 20px; height: 38px;}  
.inline-videos-carousel .slick-arrow.slick-prev    {left: -40px; width: 20px; height: 38px;} 
.inline-videos-carousel ul.slick-dots    {list-style: none; margin: 0; padding: 0; display: flex; gap: 5px;}
.inline-videos-carousel ul.slick-dots li {font-size: 0; background: none; width: 15px; height: 15px; border-radius: 15px; background-color: #efefef; margin: 0}
.inline-videos-carousel ul.slick-dots li.slick-active    {background-color: #56A1D8; }   


.product-top .StripeElement {width: 260px; }

@media (max-width: 600px) {.product-top .StripeElement {margin: 20px auto; text-align: center;}}

@media (max-width: 1000px) {
    
    
    
    .full-image-with-text-video-inline .cols    {gap: 50px; flex-direction: column}
    
    
}

@media (max-width: 540px) {
 
    .inline-videos-carousel {width: calc(100% - 60px); margin: 0 auto}
    
}

.video-container {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; /*margin-bottom: 30px;*/}
.video-container iframe,
.video-container object,
.video-container embed,
.video-container video	{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


.stripe-note,
.square-note { background-color: #ffcbcb; border-radius: 4px; padding: 10px; font-size: 12px; margin: 20px 0px; }

.stripe-note p,.square-note p { font-size: 15px; line-height: 1.2em; }

