/* London Stone Magento Styles. Mobile first. */

@font-face {
    font-family: "Helvetica-Text-Regular";
    src: url("/Fonts/5eec4451-e90c-42e7-b4d8-9b8654a65568.woff2") format("woff2");
}

@font-face {
    font-family: "Helvetica-Text-Medium";
    src: url("/Fonts/2fd3ef81-07ed-45b4-a344-7a0defbdadcf.woff2") format("woff2");
}

@font-face {
    font-family: "Helvetica-Display-Regular";
    src: url("/Fonts/644d8155-d6f1-42bb-8c90-2c98b785b510.woff2") format("woff2");
}

@font-face {
    font-family: "Helvetica-Display-Medium";
    src: url("/Fonts/effd846d-39d3-439a-a81b-14b26fd5fb7e.woff2") format("woff2");
}

.fs-clamp {
    font-size: 16px;
}

.fs-clamp h1,
.fs-clamp h2,
.fs-clamp h3,
.fs-clamp h4,
.fs-clamp .ff-heading,
.fs-clamp .fs-h1,
.fs-clamp .fs-h2,
.fs-clamp .fs-h3,
.fs-clamp .fs-h4 {
    font-family: var(--font-text-medium);
    color: #000;
}

.fs-clamp h1,
.fs-clamp .fs-h1 {
    font-size: clamp(1.7rem, 1.961vw + 1.303rem, 2.462rem);
    line-height: clamp(2.6rem, 1.961vw + 2.078rem, 3.333rem);
    letter-spacing: -0.1px;
}

.fs-clamp h2,
.fs-clamp .fs-h2,
.fs-clamp .ls-testimonial-text p {
    font-size: clamp(1.6rem, 0.98vw + 1.373rem, 2rem);
    line-height: clamp(2.154rem, 0.98vw + 1.882rem, 2.462rem);
    letter-spacing: -0.1px;
}

.fs-clamp h3,
.fs-clamp .fs-h3 {
    font-size: 16px;
    line-height: 24px
}

.fs-clamp h4,
.fs-clamp .fs-h4 {
    font-size: 16px;
    line-height: 24px
}

.fs-clamp p,
.fs-clamp ul,
.fs-clamp .read-btn a,
.fs-clamp a.read-btn,
.fs-clamp .read-btn,
.fs-clamp .fs-body {
    font-size: 16px;
    line-height: 24px;
    font-family: var(--font-text-regular);
    color: #555;
}

.fs-clamp p strong,
.fs-clamp ul strong,
.fs-clamp .ff-strong {
    font-family: var(--font-text-medium);
}

@media (min-width:570px) {

    .fs-clamp h1,
    .fs-clamp h2,
    .fs-clamp h3,
    .fs-clamp h4,
    .fs-clamp .ff-heading {
        font-family: var(--font-display-medium);
    }
}

@media (min-width:768px) {

    .fs-clamp h1,
    .fs-clamp .fs-h1 {
        line-height: clamp(3.333rem, 0.781vw + 2.833rem, 3.5rem);
    }

    .fs-clamp h2,
    .fs-clamp .fs-h2,
    .fs-clamp .ls-testimonial-text p {
        line-height: clamp(2.7rem, 0.778vw + 2.002rem, 2.615rem)
    }

    .fs-clamp h3,
    .fs-clamp .fs-h3 {
        line-height: clamp(2rem, 0.837vw + 1.452rem, 2.167rem);
        font-size: clamp(1.333rem, 0.837vw + 0.785rem, 1.5rem)
    }
}

@media (min-width: 1025px) {

    /*current html switches from font-size 12px to 16px*/
    .fs-clamp h1,
    .fs-clamp .fs-h1 {
        line-height: clamp(3.333rem, 0.781vw + 2.833rem, 3.667rem);
        letter-spacing: -0.4px;
    }

    .fs-clamp h2,
    .fs-clamp .fs-h2,
    .fs-clamp .ls-testimonial-text p {
        font-size: clamp(1.7rem, 0.787vw + 1.12rem, 1.75rem);
        line-height: clamp(2.125rem, 0.784vw + 1.623rem, 2.25rem);
        letter-spacing: -0.32px;
    }

    .fs-clamp h3,
    .fs-clamp .fs-h3 {
        font-size: clamp(1.125rem, 0.784vw + 0.623rem, 1.25rem);
        line-height: clamp(1.625rem, 0.784vw + 1.123rem, 1.75rem)
    }
}

@media (min-width:1280px) {

    .fs-clamp h1,
    .fs-clamp .fs-h1 {
        font-size: clamp(2.25rem, 0.625vw + 1.75rem, 2.5rem);
        line-height: clamp(2.75rem, 0.625vw + 2.25rem, 3rem);
    }

    .fs-clamp h2,
    .fs-clamp .fs-h2,
    .fs-clamp .ls-testimonial-text p {
        font-size: clamp(1.75rem, 0.625vw + 1.25rem, 2rem);
        line-height: clamp(2.25rem, 0.625vw + 1.75rem, 2.5rem)
    }

    .fs-clamp h3,
    .fs-clamp .fs-h3 {
        font-size: clamp(1.25rem, 0.625vw + 0.75rem, 1.5rem);
        line-height: clamp(1.75rem, 0.625vw + 1.25rem, 2rem)
    }
}

/* css variables */
:root {
    --color-alizarin-crimson: #df1818;
    --color-alto: #E0E0E0;
    --color-alto-dark: #D5D5D5;
    --color-alto-darker: #dddddd;
    --color-alto-hub: #D4D4D4;
    --color-apple: #4F9A3D;
    --color-athens-gray: #F5F4F6;
    --color-black: #000000;
    --color-blue-opacity: rgba(59, 153, 252, .7);
    --color-bombay: #AAAAAB;
    --color-boulder: #777777;
    --color-cape-cod-darker: #3b4345;
    --color-cod-gray: #111111;
    --color-cod-gray-light: #1a1a1a;
    --color-concrete: #F2F2F2;
    --color-darkred: darkred;
    --color-delta: #ADADAB;
    --color-dodger-blue: #2699FB;
    --color-dove-gray: #666666;
    --color-dusty-gray: #999999;
    --color-dusty-gray-darker: #949494;
    --color-emperor: #555555;
    --color-forest-green: #24A926;
    --color-forest-green-lighter: #A7DDA8;
    --color-gallery: #eeeeee;
    --color-gray: #838383;
    --color-gray-chateau: #9a9ea1;
    --color-gray-dark: #808080;
    --color-gray-light: #888888;
    --color-gray-lighter: #929292;
    --color-iron: #D4D5D5;
    --color-lochmara: #0078D7;
    --color-ls-default-grey: #B3B3B3;
    --color-main: #4D4D4D;
    --color-mercury: #E8E8E8;
    --color-mercury-darker: #e5e5e5;
    --color-mine-shaft: #343131;
    --color-mine-shaft-dark: #222222;
    --color-mine-shaft-darker: #333333;
    --color-nobel: #B7B7B7;
    --color-nobel-darker: #b4b4b4;
    --color-outer-space: #384043;
    --color-pampas: #F1EDE9;
    --color-quill-gray: #E5E5E3;
    --color-seashell: #f1f1f1;
    --color-shark: #1d2122;
    --color-shark-lighter: #2A2B2C;
    --color-silver: #cccccc;
    --color-silver-chalice: #aaaaaa;
    --color-silver-chalice-dark: #a5a5a5;
    --color-silver-dark: #c3c3c3;
    --color-silver-darker: #bebebe;
    --color-silver-darkest: #B9B9B9;
    --color-stromboli: #2D4A39;
    --color-totem-pole: #960F0A;
    --color-tundora: #444444;
    --color-white: #ffffff;
    --color-wild-sand: #f4f4f4;
    --color-wild-watermelon: #ff5268;
    --site-background-color: #FDFDFD;
    --font-text-regular: "Helvetica-Text-Regular";
    --font-text-medium: "Helvetica-Text-Medium";
    --font-display-regular: "Helvetica-Display-Regular";
    --font-display-medium: "Helvetica-Display-Medium";
    --color-athens-gray-darker: #E8EBEF;
    --color-background-main: #F3F4F6;
    --color-dawn-pink: #FAF6F4;
    --color-gallery-darker: #EAEAEA;
    --color-mischka: #EBEAEC;
    --color-navy: #161b4e;
    --color-dark-orange: #c07f02;
    --color-light-orange: #c9a88e;
    --color-tangerine: #E59804;
    --color-tussock: #BE8741;
    --delay-time: .5s;
    --easeout-time: 0.3s;
    --fadein-time: 1.3s;
}

/*RESET*/
a,
abbr,
acronym,
address,
article,
aside,
audio,
b,
blockquote,
body,
canvas,
caption,
center,
cite,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figure,
font,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hr,
html,
i,
iframe,
img,
label,
legend,
li,
main,
mark,
menu,
meter,
nav,
object,
ol,
output,
p,
pre,
progress,
q,
rp,
rt,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video,
xmp {
    border: 0;
    margin: 0;
    padding: 0;
    font-size: 100%;
}

html,
body {
    height: 100%;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section {
    display: block;
}

b,
strong {
    font-weight: bold;
}

img {
    color: transparent;
    font-size: 0;
    vertical-align: middle;
    -ms-interpolation-mode: bicubic;
}

ul,
ol {
    list-style: none;
}

li {
    display: list-item;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

th,
td,
caption {
    font-weight: normal;
    vertical-align: top;
    text-align: left;
}

q {
    quotes: none;
}

q:before,
q:after {
    content: "";
    content: none;
}

sub,
sup,
small {
    font-size: 75%;
}

sub,
sup {
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

svg {
    overflow: hidden;
}

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0
}

.clearfix:after,
.clearfix:before,
.grid-100:after,
.grid-100:before,
.grid-30:after,
.grid-30:before,
.grid-33:after,
.grid-33:before,
.grid-50:after,
.grid-50:before,
.grid-60:after,
.grid-60:before,
.grid-66:after,
.grid-66:before,
.grid-70:after,
.grid-70:before,
.grid-75:after,
.grid-75:before,
.grid-95:after,
.grid-container:after,
.grid-container:before {
    content: ".";
    display: block;
    overflow: hidden;
    visibility: hidden;
    font-size: 0;
    line-height: 0;
    width: 0;
    height: 0
}

.clearfix:after,
.grid-100:after,
.grid-30:after,
.grid-33:after,
.grid-50:after,
.grid-60:after,
.grid-66:after,
.grid-70:after,
.grid-75:after,
.grid-container:after {
    clear: both
}

.grid-container {
    margin-left: auto;
    margin-right: auto;
    max-width: 1600px;
    padding-left: 5px;
    padding-right: 5px
}

.grid-100,
.grid-30,
.grid-33,
.grid-50,
.grid-66,
.grid-70,
.grid-75 {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px
}

.grid-parent {
    padding-left: 0;
    padding-right: 0
}

.grid-offset {
    clear: both;
    margin-left: -10px;
    margin-right: -10px
}

@media(min-width:1025px) {
    .grid-30 {
        float: left;
        width: 30%
    }

    .grid-50 {
        float: left;
        width: 50%
    }

    .grid-70 {
        float: left;
        width: 70%
    }

    .grid-75 {
        float: left;
        width: 75%
    }

    .grid-33 {
        float: left;
        width: 33.33333%
    }

    .grid-66 {
        float: left;
        width: 66.66667%
    }

    .prefix-66 {
        margin-left: 66.66667%
    }

    .grid-100 {
        clear: both;
        width: 100%
    }
}

/* ------------------------------------------------------------ */
/* -------------- G L O B A L   D E F A U L T S --------------- */
/* ------------------------------------------------------------ */
html {
    font-size: 0.8rem;
    line-height: 1.5;
    box-sizing: border-box;
    -webkit-text-size-adjust: 100%;
}

/* fix for overflow-x issue on Chrome for pages where the content touches the edge of the window */
.master-wrapper {
    overflow-x: clip;
    max-width: 100%;
}

/* fix overflow on some pages where there are negative margin values */
.page-products .master-wrapper,
.cms-find-landscapers-and-garden-designers .master-wrapper,
.cms-find-landscapers-and-garden-designers- .master-wrapper {
    overflow: hidden;
}

.catalog-category-view .master-wrapper {
    overflow: clip;
}

/* forces box-sizing to be inherited by descendents of html -- ie everything. Can be overidden for specific elements. */
*,
*:before,
*:after {
    box-sizing: inherit;
    outline: none;
}

:focus {
    outline: none;
}

::-moz-focus-inner {
    border: 0;
}

* {
    margin: 0;
}

*+* {
    margin-top: 1.5em;
}

body,
br,
li,
dt,
dd,
th,
td,
option {
    margin-top: 0;
}

textarea,
input.text,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="button"],
input[type="submit"],
.input-checkbox {
    -webkit-appearance: none !important;
    border-radius: 0;
    border-width: 1px;
    background-clip: padding-box;
}

img {
    flex-shrink: 0;
    /* ie11 fix for image distortion in flex containers */
    transform: translateZ(0);
    /* Chrome fix for blurriness - 2021 */
}

/* basic styles for input fields */
input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]) {
    border: 1px solid var(--color-gray);
    -webkit-appearance: none;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]):hover {
    border: 1px solid var(--color-black);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]):focus {
    border: 1px solid var(--color-lochmara);
}

.input-text-readonly {
    -moz-appearance: textfield;
}

input.input-text-readonly {
    background: var(--color-gallery);
    cursor: not-allowed;
}

input:read-only::-webkit-outer-spin-button,
input:read-only::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

div.field:focus-within label {
    color: var(--color-lochmara);
}

.ls-radio[type="radio"] {
    display: none;
}

.ls-radio[type="radio"]+label:before {
    border: 3px solid var(--color-white);
    background-color: var(--color-white);
    content: ' ';
    display: inline-block;
    height: 16px;
    margin: 0 .25em 0.5em 0;
    padding: 0;
    vertical-align: top;
    width: 16px;
    border-radius: 12px;
}

.ls-radio[type="radio"]+label:hover:before {
    background: var(--color-silver);
}

.ls-radio[type="radio"]:checked+label:before {
    background: #1E6D50;
    color: var(--color-dove-gray);
    content: " ";
    text-align: center;
}

.ls-radio[type="radio"]:checked+label:after {
    font-weight: bold;
}

/* These classes are to denote queries or issues with a particular area and aren't structural... */
.query {
    color: #6699cc;
    font-style: italic;
    font-size: 0.85rem !important;
    line-height: 1.2;
}

.issue {
    font-weight: bold;
    color: var(--color-darkred);
    font-size: 0.85rem !important;
    line-height: 1.2;
}

/* general styles */
.hideRetail {
    display: none;
}

.trade .hideTrade {
    display: none;
}

.trade .hideRetail {
    display: block;
}

.hidden,
.no-display {
    display: none !important;
}

.noMobilePortrait,
.nmp,
.nml,
.nmp-flex {
    display: none !important;
    /* unhidden in first media query -- specil variant req when element is a flexbox... */
}

.lsobm-checkout-types .nml {
    display: initial !important;
}

.npr {
    padding-right: 0;
}

.npl {
    padding-left: 0;
}

.np {
    padding: 0;
}

.ntm {
    margin-top: 0 !important;
}

.nbm {
    margin-bottom: 0 !important;
}

.pointer {
    cursor: pointer;
}

.relative {
    position: relative;
}

.responsiveScrollH {
    overflow-x: auto;
}

.borderless {
    border: none !important;
}

body {
    color: var(--color-main);
    font-family: var(--font-text-regular);
    overflow-x: hidden;
    background: var(--site-background-color);
}

.strong,
strong,
b,
strong a:link,
strong a:visited {
    font-family: var(--font-text-medium);
    font-weight: normal !important;
}

h1,
h2,
h3,
h4,
h5,
th {
    font-family: var(--font-text-regular);
    font-weight: normal;
}

h1 {
    font-size: 2.2em;
    letter-spacing: 0.22em;
}

h2 {
    font-family: var(--font-text-regular);
    font-size: 1.8em;
    letter-spacing: 0.05em;
    margin-bottom: 0.5em;
}

a,
a:link,
a:visited {
    text-decoration: none;
    color: #009fe3;
}

.centre,
.center {
    text-align: center;
}

.messages li a {
    color: inherit;
    text-decoration: underline;
}

.ls-alert .messages {
    border: none;
    padding: 0;
}

.ls-alert .messages li {
    margin: 0;
}

body:not(.checkout-index-index) .modals-wrapper {
    display: none;
}

/* For single-line rows that might overflow, eg long email address, give them a ellipsis... */
.overflow-e {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/* ------------------------------------------------------------ */
/* --- O V E R I D E   E P I C O R  A N D   M A G E N T O  ---- */
/* ------------------------------------------------------------ */
li a[title="Choose Address"],
a[title="Home"] {
    /* TURN OFF 'choose address' in header -- won't disable using local.xml so do it here :-( */
    display: none !important;
}

#shipping-address-search-button,
.locations_filter_block {
    display: none;
}

/* ------------------------------------------------------------ */
/* ------------------ U I   C O N T R O L S ------------------- */
/* ------------------------------------------------------------ */
/* class applies to select element itself, not a wrapper element */
.select-css {
    display: block;
    font-size: 1em;
    font-family: var(--font-text-regular);
    font-weight: 700;
    color: var(--color-main);
    line-height: 1.3;
    padding: .2em 1.4em .2em .8em;
    width: 100%;
    max-width: 100%;
    /* useful when width is set to anything other than 100% */
    box-sizing: border-box;
    margin: 0;
    border: 1px solid var(--color-silver-chalice);
    box-shadow: 0 1px 0 1px rgba(0, 0, 0, .04);
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--color-white);
    /* note: bg image below uses 2 urls. The first is an svg data uri for the arrow icon, and the second is the gradient.
	for the icon, if you want to change the color, be sure to use `%23` instead of `#`, since it's a url. You can also swap in a different svg icon or an external image reference
	*/
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
    linear-gradient(to bottom, var(--color-white) 0%, var(--color-mercury-darker) 100%);
    background-repeat: no-repeat, repeat;
    /* arrow icon position (1em from the right, 50% vertical) , then gradient position */
    background-position: right .7em top 50%, 0 0;
    /* icon size, then gradient */
    background-size: .65em auto, 100%;
}

/* Hide arrow icon in IE browsers */
.select-css::-ms-expand {
    display: none;
}

/* Hover style */
.select-css:hover {
    border-color: var(--color-gray-light);
}

/* Focus style */
.select-css:focus {
    border-color: var(--color-silver-chalice);
    /* It'd be nice to use -webkit-focus-ring-color here but it doesn't work on box-shadow */
    box-shadow: 0 0 1px 3px var(--color-blue-opacity);
    box-shadow: 0 0 0 3px -moz-mac-focusring;
    color: var(--color-mine-shaft-dark);
    outline: none;
}

/* Set options to normal weight */
.select-css option {
    font-weight: normal;
}

/* Support for rtl text, explicit support for Arabic and Hebrew */
*[dir="rtl"] .select-css,
:root:lang(ar) .select-css,
:root:lang(iw) .select-css {
    background-position: left .7em top 50%, 0 0;
    padding: .6em .8em .5em 1.4em;
}

/* ------------------------------------------------------------ */
/* ------------- M A S T E R   S T R U C T U R E -------------- */
/* ------------------------------------------------------------ */
.wrapper {
    overflow: hidden;
    width: 100%;
    left: 0;
    top: 0;
    position: absolute;
    padding: 0;
}

.grid-container-lg {
    max-width: 1600px;
    padding-left: 5px;
    padding-right: 5px;
}

.grid-container .grid-container,
.grid-container-lg .grid-container-lg,
.cms-home .grid-container,
.cms-home- .grid-container,
.cms-home .grid-container-lg,
.cms-home- .grid-container-lg,
body[class*="opening"] .grid-container,
body[class*="opening"] .grid-container-lg {
    padding-left: 0;
    padding-right: 0;
}

.main {
    margin-top: 20px;
    /* was 40, reduced with breadcrumbs design... */
}

body[class*="opening"] .main {
    margin-top: 0;
}

/* ------------------------------------------------------------ */
/* ----------- H E A D E R   A N D   T O P   N A V ------------ */
/* ------------------------------------------------------------ */
.grey {
    color: var(--color-ls-default-grey);
    /* ls default grey */
}

.base {
    color: var(--color-main);
    /* ls default text colour */
}

a.base:hover {
    color: var(--color-black);
}

.helv45,
.helv45 a,
.helv45 li,
.light,
.light li,
.light a {
    font-family: var(--font-text-regular);
}

.helv55,
.helv55 a,
.helv55 li,
.helv55 p,
.helv55 span,
.helv55 h1,
.helv55 h2 {
    font-family: var(--font-text-regular);
}

.helv65,
.helv65 a,
.helv65 li,
.helv65 p,
.helv65 span,
.helv65 h1,
.helv65 h2 {
    font-family: var(--font-text-medium);
}

.white-links a {
    color: var(--color-white);
    font-size: 1em;
    letter-spacing: 0.055em;
    line-height: 1;
}

.grey-links a {
    color: #CBC6BE;
}

.dark-links a,
.dark-links a:visited,
.dark-links a:hover {
    color: var(--color-main);
}

.ucase a,
.ucase {
    text-transform: uppercase;
}

/* top.links, eg login, checkout, etc. Last child should be login|logout - reposition them up and above rest using pos:abs ------- */
/* - important: the float: right on the tl-holder flexbox container, forces its width to shrink to fit the columns allowing column alignment to function... */
.magento-tl-holder {
    position: relative;
    padding-bottom: 1em;
    float: right;
    flex-direction: column;
}

.magento-tl-holder li:last-child {
    position: absolute;
    width: 100px;
    right: 0;
    text-align: right;
    top: -40px;
    height: 40px;
    text-transform: uppercase;
}

.tl-flex {
    display: flex;
    align-items: flex-end;
    min-height: 65px;
}

.flex-right {
    justify-content: flex-end;
}

.flex-end {
    align-items: flex-end;
}

.home-icon {
    height: 32px;
}

.home-icon img {
    max-height: 100%;
    opacity: 0.8;
}

.home-icon:hover img {
    opacity: 1;
}

.justify-center {
    justify-content: center !important;
}

.simple-flex-menu {
    display: flex;
    list-style-type: none;
    justify-content: flex-start;
    align-items: center;
    letter-spacing: 0.055em;
}

.simple-flex-menu li:not(:first-child) {
    margin-left: 1em;
}

.tl-extra-links {
    padding-bottom: 1em;
}

.escape-bounds {
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.header-container input,
.header-container button {
    margin-top: 0;
}

.full-width-ruleoff,
.full-width-ruleoff-nom {
    margin: 10px calc(-50vw + 50%) 0 calc(-50vw + 50%);
    height: 0;
    overflow: hidden;
    border-top: 1px solid var(--color-seashell);
}

.full-width-ruleoff-nom {
    margin-top: 0;
    margin-bottom: 0;
}

.ruleoff {
    border-top: 1px solid var(--color-seashell);
    height: 1px;
}

.ruleoff-m {
    border-top: 1px solid var(--color-seashell);
    margin-top: 2em;
    padding-top: 2em;
}

.link-ul {
    text-decoration: underline;
}

/* ------------------------------------------------------------*/
/* ----------------------- H E A D E R ----------------------- */
/* ------------------------------------------------------------*/
.header-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    position: relative;
}

.hc-logo-container {
    z-index: 10;
}

.logo img,
.print-head .logo {
    max-width: 105px;
    width: 105px;
    min-height: 52px;
}

.hc-actions-container {
    display: flex;
    flex-grow: 1;
    justify-content: flex-end;
    align-items: flex-end;
    padding: 0 10px;
}

.hc-actions-container>li {
    list-style: none;
    order: 1;
}

.hc-actions-container>.minicart-wrapper {
    order: 2;
}

.hca-top-links {
    width: 100%;
    font-size: 0.9em;
    margin-bottom: 1em;
    display: none;
}

.hca-top-links ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin: 0 -0.5em;
}

.hca-top-links li {
    margin: 0 0.5em;
}

.hca-top-links a,
.hca-top-links a:link,
.hca-top-links a:visited {
    line-height: 1;
    color: #384044;
    letter-spacing: 0.1em;
    font-size: 0.9em;
}

.hca-top-links a:hover {
    color: var(--color-black);
    text-decoration: underline;
}

.hca-strapline {
    display: none;
}

.trade .hca-strapline {
    width: 100%;
    margin-bottom: 1em;
    display: block;
}

.hca-strapline a {
    color: #C1272D;
}

.welcome-msg {
    line-height: 1.2;
}

.hca-aa-icons {
    flex-grow: 1;
}

.hca-aa-icons li a,
.hca-aa-icons a[title="My Account"] {
    display: flex;
    width: 54px;
    height: 24px;
}

.hca-aa-icons li a,
.hca-aa-icons a[title="My Account"],
.hca-aa-icons .login,
.hca-aa-icons .logout {
    font-size: 1.1em;
    color: var(--color-main);
    white-space: nowrap;
    align-items: flex-end;
}

.hca-aa-icons li a,
.hca-aa-icons a[title="My Account"],
.hca-aa-icons .login,
.hca-aa-icons .logout {
    padding: 0 10px;
}

.hca-aa-icons .login,
.hca-aa-icons .logout {
    margin-bottom: -3px;
}

.hca-aa-icons li a:link,
.hca-aa-icons li a:visited {
    color: var(--color-main);
}

.hca-aa-icons li a:hover,
.hca-aa-icons .login:hover {
    color: var(--color-black);
}

.hca-aa-icons li a.top-link-cart,
.hca-aa-icons .minicart-wrapper {
    width: auto;
    padding-left: 0;
    padding-right: 5px;
}

.hca-aa-icons .ls-basket-icon {
    width: 34px;
    height: 26px;
    position: relative;
    background: url("/pub/media/skin/chrome/shopping_bag.svg") no-repeat center bottom transparent;
    background-size: contain;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.ls-basket-icon .qty.ls-empty {
    display: none;
}

.ls-basket-count {
    color: var(--color-white);
    background: #090909;
    border-radius: 12px;
    font-size: 10px;
    display: flex;
    width: 15px;
    height: 15px;
    position: absolute;
    bottom: -7.5px;
    right: 0px;
    justify-content: center;
    align-items: center;
    line-height: 0;
}

.hca-aa-icons a[title="My Account"] {
    background: url("/pub/media/skin/chrome/user.svg") no-repeat center bottom transparent;
}

.hca-aa-icons a[title="My Account"].my-account-loggedin {
    background: url("/pub/media/skin/chrome/Active_user.svg") no-repeat center bottom transparent;
}

.hca-aa-icons a[title="My Account"],
.loggedin .hca-aa-icons a[title="My Account"] {
    background-size: contain;
    text-indent: -9999px;
}

.hca-aa-icons a[title="My Account"].my-account-loggedin,
.loggedin .hca-aa-icons a[title="My Account"].my-account {
    display: none;
}

.loggedin .hca-aa-icons a[title="My Account"].my-account-loggedin {
    display: block;
}

.header-container .block-search {
    width: calc(100% - 52px);
    position: absolute;
    top: 0;
    left: 52px;
    padding: 15px 15px 15px 0;
    z-index: 1010;
    display: none;
}

.header-container .block-search,
.header-container .block-search input {
    font-family: var(--font-text-regular);
}

.header-container .block-content .field.search {
    height: 40px !important;
    margin-bottom: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-grow: 1;
    background: var(--color-gallery);
    border: none;
    border-radius: 5px;
}

.header-container .block-content .field.search .control {
    width: 100%;
}

.header-container .block-search .block-content .minisearch {
    position: relative;
}

.header-container .block-search .block-content .minisearch .nested {
    display: none;
}

.header-container .block-search .block-content .minisearch .actions {
    width: 45px;
    height: 100%;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

.header-container .block-search .block-content .minisearch .actions button {
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
}

#search {
    font-size: 1.1em;
    color: var(--color-gray-dark);
    letter-spacing: 0.05em;
    width: 100%;
    padding: 2px 55px 2px 10px;
    border: none;
    border-radius: 7px 0 0 7px;
    background: transparent;
    z-index: 10;
}

.header-container .block-search .ls-quicksearch-go {
    font-size: 0;
    width: 45px;
    height: 100%;
    padding: 0;
    border: none;
    text-indent: -1000px;
    background: url("/pub/media/skin/magnifier.svg") no-repeat center 6px transparent;
    opacity: 0.75;
    overflow: hidden;
}

.header-container .block-search .ls-quicksearch-go:hover {
    opacity: 1;
}

.header-container .block-search .block-title,
.header-container .block-content .field.search .label,
.header-container .block-search .block-content .minisearch .actions span {
    display: none;
}

/* m2 login-logout links */
.loggedin .login:not(.samples-login),
.logout {
    display: none;
}

.loggedin .logout {
    display: unset;
}

.tt-hint {
    border-radius: 7px 0 0 7px !important;
}

.loggedin .welcome-msg {
    margin-right: 1.5em;
    height: auto;
    width: auto;
    line-height: 1;
    display: none;
}

.head-trade-bar {
    font-size: 12px;
    color: var(--color-white);
    letter-spacing: 0.05em;
    width: 100%;
    height: 25px;
    margin-top: 16px;
    background: var(--color-ls-default-grey);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
}

.head-trade-bar a {
    color: inherit;
}

.ls-mobile-quicklinks {
    overflow-y: hidden;
    overflow-x: auto;
    scrollbar-width: none;
    display: flex;
    align-items: center;
    margin: 0 0 7px 0;
    padding-top: 7px;
    white-space: nowrap;
}

.ls-mobile-quicklinks li {
    padding: 3px 7px;
    border-radius: 40px;
    background: #E6E6E6;
    margin: 0 3px;
    font-size: 16px;
}

.ls-mobile-quicklinks li:first-child {
    margin-left: 10px;
}

.ls-mobile-quicklinks a {
    color: inherit;
}

.header-sep {
    display: none;
}

/* Complete re-write, incorporating drop-down and horizontal elements */
/* Copyright London Stone 2017. All Rights Reserved. */

/* horizontal menu bar, needs single-level dropdown functionality for the categories list */
/* these *may* need their own different dropdown functionality as well */

/* main menu desktop and mobile too ( and some header styles ) */
header {
    background: var(--site-background-color);
    position: relative;
}

.main-wrapper,
header .nav-sections {
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
}

.menu-relative {
    background: var(--site-background-color);
    position: relative;
    z-index: 1004;
}

.header-container,
.main-navigation {
    margin-left: auto;
    margin-right: auto;
}

.main-navigation {
    z-index: 1005;
}

.main-navigation a {
    font-size: 16px;
    color: var(--color-main);
    display: block;
}

.main-navigation a[href="javascript:;"] {
    cursor: default;
}

.main-navigation a em {
    font-style: normal;
}

.main-navigation #menu_sale a,
.hca-top-links .menu-sale-top a {
    color: var(--color-totem-pole);
}

.shadow-modal {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1001;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
}

.shadow-modal.is-open {
    visibility: visible;
    opacity: 1;
}

.has-banner-img .banner-img-container {
    display: none;
}

/* stop css transition from firing on page load ( Chrome bug fix ) */
.fix-chrome-bug * {
    transition: none !important;
}

.shadow-modal.fix-chrome-bug,
.fix-chrome-bug .main-menupoint>ul {
    display: none;
}

.fix-chrome-bug .main-menupoint {
    border-color: transparent !important;
}

/* END - main menu desktop and mobile too ( and some header styles ) */

/* add ruleoff and space before last 'full directory' category */
.main-menu>li:last-child {
    margin-top: 1em;
    padding-top: 1em;
    border-top: 1px solid var(--color-silver-darkest);
}

#menu-button {
    padding: 10px;
    z-index: 1003;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.mmenu-search {
    padding: 0 10px;
    width: 44px;
    height: 24px;
}

.mmenu-search img {
    max-width: 24px;
    height: auto;
    object-fit: contain;
}

#menu-button span {
    display: block;
    width: 22px;
    height: 2.5px;
    margin-bottom: 5.5px;
    position: relative;
    background: var(--color-mine-shaft);
    border-radius: 3px;
    z-index: 1;
    margin-right: 10px;
}

#menu-button span:last-child {
    margin-bottom: 0;
}

.mmenu-top-open {
    background-color: var(--color-gallery);
}

/* ----------- login popup ----------- */
.popup-authentication {
    display: none;
}

div.login-popup {
    padding: 30px;
    min-width: 300px;
    width: calc(100vw - 40px);
    border-radius: 12px;
}

.lp-logo {
    margin: 20px auto 50px auto;
    width: 200px;
    min-height: 100px;
    background: url("/pub/media/skin/london-stone-logo.svg") no-repeat center center;
    background-size: contain;
}

.login-popup .content {
    display: flex;
    flex-direction: column;
}

.login-popup input {
    padding: 5px 20px;
    font-size: 16px;
    color: inherit;
    border-radius: 32px;
    border: 2px solid var(--color-nobel);
    margin: 15px 0;
    height: 48px;
}

.login-popup input:focus {
    border-color: var(--color-lochmara);
}

.login-popup .messages {
    margin-bottom: 2em;
}

.login-popup .messages li {
    margin-bottom: 0;
}

.login-popup .buttons-set {
    margin: 0;
    text-align: center;
}

.login-popup .buttons-set a {
    display: flex;
    justify-content: center;
    align-items: center;
}

.login-popup .buttons-set .back-link {
    display: block;
    margin: 0;
    padding: 0;
    text-align: center;
}

.login-popup .actionbar {
    padding: 10px 10px 0;
    text-align: right;
    font-weight: bold;
}

.login-popup .button,
.lrc-holder .button,
.cart-round-button {
    letter-spacing: 0.2em;
    font-size: 16px;
    width: 100%;
    color: rgba(255, 255, 255, 0.8);
    padding: 5px 25px;
    height: 48px;
    border-radius: 32px;
    background-color: var(--color-mine-shaft);
    margin: 15px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.login-popup .button:hover,
.cart-round-button:hover {
    color: var(--color-white);
}

.cart-round-button__hollow {
    border: 2px solid var(--color-nobel);
    height: 44px;
    color: var(--color-nobel);
    background: var(--color-white);
    text-transform: none;
}

.cart-round-button__hollow:hover {
    color: var(--color-boulder);
    background: var(--color-white);
    border-color: #797979;
}

.login-popup-forgot {
    letter-spacing: 0.12px;
    margin-left: 22px;
    font-size: 12px;
}

.login-popup-forgot:hover {
    color: var(--color-main);
    text-decoration: underline;
}

.login-popup .register p {
    color: var(--color-mine-shaft-dark);
    margin-top: 30px;
    text-align: left;
    margin-left: 22px;
    font-size: 12px;
    letter-spacing: 0.12px;
}

.rectangle-button {
    font-size: 0.9em;
    width: auto;
    height: auto;
    max-width: 240px;
    color: var(--color-ls-default-grey);
    line-height: 1;
    letter-spacing: .075em;
    margin: 0 !important;
    padding: 13px 2em;
    background: var(--color-white);
    border: 1px solid var(--color-ls-default-grey);
    cursor: pointer;
}

.rectangle-button:hover,
.rectangle-button:focus {
    color: var(--color-main);
    background-color: var(--color-gallery);
    border-color: var(--color-main);
}

/* login form */
.login-page {
    margin: 0 auto;
}

.ls-login-holder {
    min-width: 310px;
    width: 33vw;
    max-width: 400px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    flex-direction: column;
    margin-bottom: 2em;
}

.lslh h1 {
    margin-bottom: 1em;
    text-align: center;
}

.lslh li {
    margin-bottom: 1em;
}

.lslh li input {
    width: 100%;
}

.login-reg-choices {
    margin: 2em 0;
    text-align: center;
}

.login-reg-choices h2 {
    margin-bottom: 1.5em;
}

.lrc-holder {
    display: flex;
    flex-direction: row;
    margin: 1em 0;
}

.lrc-holder>div {
    display: flex;
    flex-direction: column;
    flex-basis: 50%;
    align-items: center;
    margin: 0 30px;
    border: 1px solid var(--color-seashell);
    padding: 30px;
}

.lrc-holder h3 {
    margin: 0;
    font-size: 1.6em;
}

.lrc-holder p {
    margin: 1.25em 0;
    text-align: left;
}

.lrc-holder .buttons-set {
    margin-top: auto;
    text-align: left;
}

.lrc-holder .button {
    width: auto !important;
    padding: 6px 30px;
}

/* customer forms */
/* .form-edit-account button, .customer-pages button{ */
.account button {
    width: fit-content;
    display: inline-block;
    text-transform: none;
    margin-right: 10px;
}

/* ----------- login page ----------- */
.page-title-wrapper.ls-login-holder {
    margin-top: 20px;
    margin-bottom: 0;
}

div.login-popup.login-page,
div.login-popup.login-page .ls-login-holder {
    width: 100%;
    min-width: auto;
}

div.login-popup.login-page .ls-login-holder,
.page-title-wrapper.ls-login-holder h1 {
    margin-bottom: 0;
}

div.login-popup.login-page {
    padding: 2.3em;
}

.customer-account-login .columns .login-reg-choices {
    padding: 2em 0;
    border-top: 1px solid var(--color-seashell);
}

/* END login page */

/* ------------------------------------------------------------ */
/* ----------- S H A R E D   C O R E   S T Y L E S ------------ */
/* ------------------------------------------------------------ */
sup {
    font-size: 60%;
    top: -0.4em;
}

.flexRow {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.flexRow label {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

button,
.button,
.inv-button {
    cursor: pointer;
    line-height: 1;
    padding: 4px 4px;
    color: var(--color-white);
    background: var(--color-cape-cod-darker);
    border: 1px solid var(--color-gray-chateau);
    text-transform: uppercase;
    font-size: 0.9em;
    letter-spacing: 0.08em;
    padding: 0.25em 1em;
}

button:hover,
.button:hover,
button:active,
.button:active {
    border-color: var(--color-cape-cod-darker);
    background-color: var(--color-shark);
}

.fancybox-close-small:hover {
    background: transparent;
}

.ls-section-divider {
    width: 100%;
    margin: 2em 0;
    position: relative;
    height: 2em;
    text-align: center;
}

.catalog-category-view .ls-section-divider {
    margin-bottom: 4em;
}

.catalogsearch-result-index .products-grid__sort--holder,
.catalogsearch-advanced-result .products-grid__sort--holder {
    margin-top: 4em;
}

.ls-section-divider:before {
    content: '';
    border-top: 1px solid var(--color-gallery);
    position: absolute;
    top: 0.7em;
    left: 0;
    width: 100%;
}

.ls-section-divider>div {
    background: var(--color-white) none repeat scroll 0 0;
    display: inline-block;
    margin-top: -1em;
    padding: 0 1.5em;
    position: relative;
    z-index: 4;
    min-width: 250px;
    line-height: 1.2;
    max-width: 250px;
    /* ---mob-first -- overidden for wider than 340px screen */
}

.ls-section-divider h2,
.ls-section-divider span {
    font-size: 1.3em;
    margin: 0;
    display: inline;
}

.ls-section-divider .catList-banner__head-priceBlock {
    font-size: 24px;
    font-size: clamp(16px, 2.5vw, 24px);
    line-height: 21px;
    letter-spacing: 0.025em;
    color: var(--color-black);
    opacity: 0.75;
}

.helperText,
.helperText a,
.helperText a:visited {
    line-height: 1;
    margin: 0.5em 0;
    letter-spacing: 0.1em;
    font-size: 0.9em;
    color: #adadad;
}

.centered,
.centred,
.a-center,
.alignCenter {
    text-align: center;
}

.a-left,
.alignLeft {
    text-align: left;
}

.a-right,
.alignRight {
    text-align: right;
}

.m-top {
    margin-top: 1.5em;
}

.m-bot {
    margin-bottom: 1.5em;
}

.pointer {
    cursor: pointer;
}

#map_canvas {
    background: #B3D1FF;
    border: 1px solid var(--color-gray-chateau);
    width: 100%;
    height: 200px;
}

.ls-content__head {
    margin-bottom: 50px;
    text-align: center;
}

.ls-content__head h1 {
    font-size: 1.8em;
    margin-bottom: 40px;
}

.ls-content__head.trade-signup-title h1 {
    margin-bottom: 1em;
}

.ls-content__head p {
    font-size: 1.2em;
    max-width: 1100px;
    margin: 0 auto 1.5em auto;
}

.field.note {
    font-size: 1.2em;
    max-width: 1100px;
    margin: 0 auto;
    text-align: center;
}

.spacing-down,
.field.note.spacing-down {
    margin-bottom: 1.5em;
}

.ls-content__head .catList-descr {
    margin-bottom: 2em;
}

form.password.forget input,
form.password.reset input {
    width: 100%;
}

.ls-boxed-group {
    margin-top: 45px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    /* margin-right: -15px;
	margin-left: -15px; */
}

.ls-boxed-group li {
    text-align: center;
    margin-bottom: 50px;
    flex-basis: 320px;
    flex-grow: 1;
    padding: 30px;
    border: 1px solid var(--color-seashell);
    margin-right: 25px;
    margin-left: 25px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.ls-boxed-group img {
    max-height: 60px;
    margin-bottom: 25px;
}

.ls-boxed-group h2 {
    font-size: 1.2em;
    line-height: 1.2;
    margin-bottom: 25px;
    font-family: var(--font-text-regular);
}

.ls-boxed-group p {
    font-size: 0.9em;
    line-height: 1.4;
    max-width: 300px;
}

.ls-boxed-group li.empty {
    visibility: hidden;
    height: 0;
}

.ls-boxed-group a,
.ls-boxed-group a:link,
.ls-boxed-group a:visited {
    color: var(--color-black);
    text-decoration: underline;
}

/* used on homepage for trade logos, inserts a heading, vertically centred onto the box border... */
.ls-headed-group {
    border: 1px solid var(--color-seashell);
    padding: 40px 40px 15px 40px;
}

.ls-headed-group h2 {
    text-align: center;
    padding: 5px 15px;
    margin: 0;
    line-height: 1;
    font-size: 1.2em;
    margin-top: -60px;
    margin-bottom: 20px;
}

.ls-headed-group h2 span {
    background: var(--color-white);
    padding: 5px 15px;
    margin: 0 auto;
    display: inline-block;
}

.ls-headed-group ul {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 0 -16px;
    flex-wrap: wrap;
}

.ls-headed-group li {
    margin: 0 8px 20px 8px;
    display: flex;
    flex-basis: 100px;
    justify-content: center;
    align-items: center;
}

.ls-headed-group img {
    max-height: 25px;
    display: block;
    max-width: 220px;
}

/* specifics to keep the last two items together for nicer wrapping... */
.ls-headed-group>ul li:last-child {
    flex-basis: auto;
    margin-left: 20px;
}

.ls-headed-group ul ul {
    flex-basis: auto;
}

.ls-headed-group ul ul li {
    margin-bottom: 0;
}

.responsive img {
    width: 100%;
    height: auto;
}

/* auto-centering, auto-scaling, fits to box background image */
.resp_bg_img {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.mobile-margin-b {
    margin-bottom: 15px;
    /* turned off above 767px corresp to grid-tablet */
}

.breadcrumbs-cont {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    padding: 20px 5px 0 5px;
    overflow: hidden;
}

.page-products .breadcrumbs {
    width: 100%;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 5px 0 5px;
    overflow: hidden;
}

.page-products .breadcrumbs strong {
    font-family: var(--font-text-regular);
}

.breadcrumbs {
    overflow: hidden;
    margin: -15px 11px 20px;
}

.breadcrumbs ul,
.breadcrumbs li,
.navList,
.navList ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.breadcrumbs li {
    display: none;
    font-size: 0.8em;
    font-size: clamp(11px, 2.5vw, 16px);
    letter-spacing: 0.15em;
}

.breadcrumbs li:nth-last-child(2) {
    display: inline;
}

.breadcrumbs li span {
    display: none;
}

.breadcrumbs li::before {
    content: '<';
}

.breadcrumbs a:link,
.breadcrumbs a:visited {
    color: inherit;
}

.breadcrumbs a:hover {
    color: var(--color-main);
}

/* ---------------------- TOGGLE SWITCH ---------------------- */
.switch {
    margin: 2rem auto;
    width: 12rem;
    position: relative;
}

.switch input {
    position: absolute;
    top: 0;
    z-index: 2;
    opacity: 0;
    cursor: pointer;
}

.switch input:checked {
    z-index: 1;
}

.switch input:checked+label {
    opacity: 1;
    cursor: default;
}

.switch input:not(:checked)+label:hover {
    opacity: 0.5;
}

.switch label {
    color: var(--color-black);
    opacity: 0.33;
    transition: opacity 0.25s ease;
    cursor: pointer;
}

.switch .toggle-outside {
    height: 100%;
    border-radius: 1rem;
    padding: 0.125rem;
    overflow: hidden;
    transition: 0.25s ease all;
}

.switch .toggle-inside {
    border-radius: 2.5rem;
    background: var(--color-white);
    position: absolute;
    transition: 0.25s ease all;
}

.switch--horizontal {
    width: 9rem;
    height: 1.5rem;
    margin: 0 auto;
    font-size: 0;
    margin-bottom: 1rem;
}

.switch--horizontal input {
    height: 1.5rem;
    width: 3rem;
    left: 3rem;
    margin: 0;
}

.switch--horizontal label {
    font-size: 1rem;
    line-height: 1.5rem;
    display: inline-block;
    width: 3rem;
    height: 100%;
    margin: 0;
    text-align: center;
}

.switch--horizontal label:last-of-type {
    margin-left: 3rem;
}

.switch--horizontal .toggle-outside {
    background: #509B3E;
    position: absolute;
    width: 3rem;
    left: 3rem;
}

.switch--horizontal .toggle-inside {
    height: 1.25rem;
    width: 1.25rem;
}

.switch--horizontal input:checked~.toggle-outside .toggle-inside {
    left: 0.125rem;
}

.switch--horizontal input~input:checked~.toggle-outside .toggle-inside {
    left: 1.625rem;
}

/* ------------------------------------------------------------ */
/* ------------------- P A G I N A T I O N -------------------- */
/* ------------------------------------------------------------ */
/* pagination styles */
.pagination-container:not(#order_history_pagination) .toolbar-amount {
    display: none;
}

.pagination-container .pager ul strong {
    font-family: var(--font-text-regular);
    font-weight: 700 !important;
}

.pagination-container:not(#order_history_pagination) .pages,
.pagination-container .pages ol,
.pagination-container .pages ul {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.pagination-container .pager {
    margin: 0;
    padding: 0;
    border: 0;
}

.pagination-container .pager,
.pagination-container .pages a {
    font-family: var(--font-text-regular);
    font-size: 16px;
    font-size: clamp(12px, 3vw, 16px);
    letter-spacing: 0.12px;
    color: var(--color-black);
}

.pagination-container .pages li a:not(.previous):not(.next):hover,
.pagination-container .pages li a.jump:hover,
.pagination-container .pages a:hover::before {
    text-decoration: underline;
}

.pagination-container .pages li {
    margin: 0;
    opacity: 0.8;
}

.pagination-container .pages li a,
.pagination-container .pages li.current {
    margin-left: 0.25em;
    margin-right: 0.25em;
}

.pagination-container .pages li.current {
    opacity: 1;
}

.pagination-container .pages li .previous_jump,
.pagination-container .pages li .next_jump {
    margin-left: -0.25em;
    margin-right: -0.25em;
}

.pagination-container .pages li a.page.first .label,
.pagination-container .pages li a.page.last .label,
.pagination-container .pages li a.page.previous.jump::before,
.pagination-container .pages li a.page.previous.jump::after,
.pagination-container .pages li a.page.next.jump::before,
.pagination-container .pages li a.page.next.jump::after {
    display: none;
}

.cart-item~.pagination-container {
    margin-top: 10px;
}

/* pagination styles on Blog listing page */
body[class*="wordpress-"] .pagination-container .pages,
body[class*="wordpress-"] .pagination-container .pages ol,
body[class*="wordpress-"] .pagination-container .pages ul {
    justify-content: center;
}

body[class*="wordpress-"] .pagination-container .pager,
body[class*="wordpress-"] .pagination-container .pages a {
    font-size: 24px;
    font-size: clamp(14px, 3vw, 24px);
    letter-spacing: 0.025em;
}

/* pagination styles on Account pages */
.sales-order-history .pager {
    display: flex;
    flex-grow: 1;
    justify-content: space-between;
}

.account .pager {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}

.account .pager .toolbar-amount {
    margin-right: 10px;
}

.account .pager .limiter strong {
    font-family: var(--font-text-regular);
}

.account .pager .limiter .limiter-options {
    margin-top: 0;
}

.sales-order-history .pagination-container .pager .pages-items {
    display: flex;
    align-items: center;
}

.sales-order-history .pagination-container .pager .pages-items>li {
    letter-spacing: 0.025em;
    margin-left: 0.25em;
    margin-right: 0.25em;
}

.table-wrapper.orders-history~.pagination-container .pager {
    flex-wrap: wrap;
}

.table-wrapper.orders-history~.pagination-container .pager .toolbar-amount,
.table-wrapper.orders-history~.pagination-container .pager .limiter {
    margin-bottom: 5px;
}

.table-wrapper.orders-history~.pagination-container .pager .toolbar-amount {
    order: 2;
}

.table-wrapper.orders-history~.pagination-container .pager .limiter {
    order: 3;
}

.table-wrapper.orders-history~.pagination-container .pager .pages {
    width: 100%;
    justify-content: center;
    margin-bottom: 10px;
}

/* pagination styles on Order history page */
#order_view_pagination_top {
    margin-bottom: 10px;
}

/* Prev and next navigation on pagination */
.pagination-container a.previous,
.pagination-container a.next {
    color: inherit;
    position: relative;
}

.pagination-container a.previous:not(.jump)>span,
.pagination-container a.next:not(.jump)>span {
    display: none;
}

.pagination-container a.previous::before {
    content: "Previous";
}

.pagination-container a.next::before {
    content: "Next";
}

.pagination-container a.previous,
.pagination-container a.post-skip-previous,
body[class*="wordpress-"] a.previous,
body[class*="wordpress-"] a.post-skip-previous {
    display: flex;
    align-items: center;
}

.pagination-container a.previous::after,
body[class*="wordpress-"] a.previous::after,
body[class*="wordpress-"] a.post-skip-previous::after {
    content: '<';
    transform: scalex(0.66);
    display: inline-block;
    font-size: 1.3em;
    line-height: 0;
    order: -1;
    margin-right: 6px;
    margin-bottom: 3.2px;
}

.pagination-container a.next::after,
body[class*="wordpress-"] a.next::after,
body[class*="wordpress-"] a.post-skip-next::after {
    content: '>';
    transform: scalex(0.66);
    display: inline-block;
    font-size: 1.2em;
    line-height: 0;
}

/* Prev and next navigation on Blog post page */
.post-skips {
    margin-top: 24px;
    margin-top: clamp(24px, 3vw, 50px);
    padding: 24px 0;
    padding: clamp(8px, 3vw, 24px) 0;
    border-top: 1px solid #D5D5D5;
    border-bottom: 1px solid #D5D5D5;
}

.post-view .post-skips-inner {
    display: flex;
    justify-content: center;
}

.post-view .post-skips-inner a:nth-of-type(2) {
    margin-left: 50px;
    margin-left: clamp(50px, 7vw, 100px);
}

.post-skips a {
    font-family: var(--font-text-regular);
    font-size: 24px;
    font-size: clamp(14px, 3vw, 24px);
    letter-spacing: 0.025em;
    color: var(--color-black);
}

a.post-skip-next,
a.post-skip-previous {
    color: inherit;
    position: relative;
}

body[class*="wordpress-"] a.post-skip-previous::after {
    margin-right: 12px;
}

a.post-skip-previous::before,
a.post-skip-next::before {
    content: "";
    display: none;
    width: calc(100% - 1em);
    height: 1px;
    position: absolute;
    top: 100%;
    background: var(--color-black);
}

a.post-skip-previous::before {
    left: 1.13em;
}

a.post-skip-next::before {
    right: 1.13em;
}

.post-skips a:hover::before {
    display: block;
}

a.post-skip-next::after {
    font-size: 1.3em;
    margin-left: 7px;
}

/* ------------------------------------------------------------ */
/* ------ S I D E   C A T E G O R I E S   L I S T I N G ------- */
/* ------------------------------------------------------------ */
.ls-side-categories {
    padding: 30px 30px 0 0;
}

.ls-side-categories h3 {
    font-size: 1.4rem;
    border-bottom: 1px solid var(--color-main);
    padding-bottom: 0.25em;
}

.ls-side-categories li {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 2.8em;
    border-bottom: 1px solid var(--color-main);
}

.ls-side-categories li:after {
    width: 12px;
    height: 12px;
    border-right: 1px solid var(--color-main);
    border-bottom: 1px solid var(--color-main);
    position: absolute;
    right: 2px;
    content: " ";
    top: calc(50% - 6px);
    transform: rotate(-45deg);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.ls-side-categories a,
.ls-side-categories a:visited {
    display: block;
    width: 100%;
    height: 100%;
    color: var(--color-main);
}

.ls-side-categories a:hover,
.ls-side-categories a.active {
    font-weight: bold;
}

.ls-side-categories li:hover:after {
    border-color: var(--color-black);
}

/* ------------------------------------------------------------ */
/* ------ C A T E G O R I E S   G R I D   L I S T I N G ------- */
/* ------------------------------------------------------------ */
/* ? can any of these be merged with products-grid ? */
.ls-subcategory-masthead {
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    background-color: var(--color-outer-space);
    margin: -20px 0 2em 0;
}

.ls-subcategory-description {
    color: var(--color-white);
    line-height: 1.2;
    width: 100%;
    padding: 1.5em;
    font-size: 1rem;
}

/* font size, above, will need to change on different device sizes align-items: flex-start; */

.ls-subcategory-description h1 {
    margin-bottom: 1em;
    font-size: 1.6rem;
}

.ls-subcategory-imageHolder {
    width: 100%;
    position: relative;
    height: 40vh;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.low-res-feature,
.high-res-feature {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.ls-404 .high-res-feature {
    background-image: url("/pub/media/Error_404_background.jpg");
}

.ls-subcategory-accred {
    position: absolute;
    bottom: 0px;
    right: 0px;
    color: var(--color-white);
    padding: 3px 15px;
    background-color: rgba(0, 0, 0, 0.44);
    transition: all 0.5s ease-in-out;
}

.catList-banner-holder .catList-banner-graphic {
    height: 30vw;
    min-height: 320px;
    max-height: 400px;
    padding: 40px;
    justify-content: center;
}

.catList-banner-holder .catList-banner-graphic h1 {
    font-size: 3.5em;
}

.catList-descr {
    font-size: 1.1em;
    font-family: var(--font-text-regular);
    text-align: center;
    letter-spacing: 0.06em;
    margin: 0 24px;
}

/* product category listing page; changed html structure but kept the visual display - 08/07/2021 Livia */
.catalog-category-view main {
    display: flex;
    flex-direction: column;
}

.catalog-category-view main .category-view {
    order: 1;
}

/* brochures listing page; remove flexbox order from page description - 13/09/2021 Livia */
.catalog-category-view.category-brochure-request main .category-view {
    order: -1;
}

/* brochures listing page; add original styles to heading and description - 14/09/2021 Livia */
.catalog-category-view.category-brochure-request .category-view {
    text-align: center;
}

.catalog-category-view.category-brochure-request .category-view .catList-descr {
    font-size: inherit;
    font-family: inherit;
    letter-spacing: inherit;
    margin: 0;
}

.catalog-category-view.category-brochure-request .category-view .catList-descr h1 {
    font-size: 1.8em;
    margin-bottom: 40px;
}

.catalog-category-view.category-brochure-request .category-view .catList-descr p {
    font-size: 1.2em;
    max-width: 1100px;
    margin: 0 auto 1.5em auto;
}

/* new category banner design Sept 2019 */
div.high-res-feature {
    padding: 0 10px;
    /* may need altering on mobile */
}

.catList-banner-holder .catList-banner__head {
    text-transform: uppercase;
}

.catList-banner-holder .catList-banner__head h1 {
    display: inline;
    margin: 0;
    font-size: 2.2em;
    line-height: 1;
    letter-spacing: 0;
}

.catList-banner-holder .catList-banner__head-priceBlock {
    display: inline-block;
    white-space: nowrap;
}

.catList-banner-holder .catList-banner__head-price {
    font-size: 2.2em;
    line-height: 1;
}

.catList-banner-holder .catList-banner__head-prefix {
    font-size: 1.8em;
    line-height: 1;
}

.catList-banner-holder .catList-banner__head-suffix {
    font-size: 1.8em;
    line-height: 1;
}

.catList-banner-holder h3 {
    margin: 10px;
    font-size: 1.6em;
    line-height: 1;
    font-style: italic;
    letter-spacing: 0.05em;
}

.catList-banner-holder h4 {
    margin: 0 0 5px 0;
    font-size: 1.5em;
    line-height: 1;
    letter-spacing: 0.03em;
}

.catList-banner-holder p.catList-banner-holder-small {
    font-size: 0.74em;
    line-height: 1;
    letter-spacing: 0.025em;
    font-family: var(--font-text-medium);
}

.std .catList-banner-holder.ls-404 {
    margin-top: -20px;
}

.ls-404 .catList-banner-graphic {
    height: 800px;
    min-height: 800px;
    max-height: 800px;
}

.ls-404 .high-res-feature {
    justify-content: flex-start;
    padding-top: 50px;
}

.ls-404 .high-res-feature div {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 10px;
}

.ls-404 div h1 {
    font: inherit;
    font-size: 2.5em !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.75);
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
}

.ls-404 div h2 {
    font: inherit;
    font-size: 2.5em;
}

.ls-404 p a {
    color: var(--color-white);
}

/* sub-category type for special brochure listing */
.products-grid--brochure .actions {
    margin-top: 15px;
}

.products-grid--brochure .ls-grid-image--brochure {
    min-width: 280px;
}

ul.products-grid--brochure li {
    text-align: left;
    width: 100%;
}

ul.products-grid--brochure li:hover {
    border-color: var(--color-seashell);
}

ul.products-grid--brochure li>div {
    margin-bottom: 15px;
    flex-direction: column;
    justify-content: flex-start;
}

ul.products-grid--brochure h3 {
    margin-top: 0;
    color: var(--color-gray-dark);
}

.pgb-desc {
    height: 100%;
    display: flex;
    flex-grow: 1;
    justify-content: space-between;
    flex-direction: column;
    padding-right: 15px;
}

.pgb-actions {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.pgb-desc h2 {
    font-size: 1.3em;
    align-self: flex-start;
    font-weight: bold;
}

.ls-brochure__head {
    margin-bottom: 60px;
    text-align: center;
}

.ls-brochure__head p {
    font-size: 1.2em;
}

.ls-brochure__download-button,
.ls-brochure__download-button:link,
.ls-brochure__download-button:visited {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 15px;
    border: 1px solid var(--color-silver-darker);
    text-align: center;
    color: #575755;
    font-size: 1em;
    letter-spacing: 0.08em;
    margin: 0 0 15px 0;
}

.ls-brochure__download-button:hover {
    color: var(--color-main);
    border-color: var(--color-main);
}

.ls-brochure__cart-button {
    width: 100%;
    padding: 4px 4px;
    color: var(--color-white);
    background: var(--color-cape-cod-darker);
    border: 1px solid var(--color-gray-chateau);
    text-transform: uppercase;
    font-size: 1em;
    letter-spacing: 0.08em;
    line-height: inherit;
}

.ls-brochure__flipping-button,
.ls-brochure__flipping-button:link,
.ls-brochure__flipping-button:visited {
    color: #3a6ea0;
    letter-spacing: 0;
}

.ls-brochure__download-button img {
    max-height: 20px;
    margin-right: 10px;
}

.brochure-remove img {
    height: 14px;
    width: auto;
}

/* ------------------------------------------------------------ */
/* -------- P R O D U C T S   G R I D   L I S T I N G --------- */
/* ------------------------------------------------------------ */
.products-grid {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    margin: 0;
}

.products-grid li {
    position: relative;
    flex-basis: 270px;
    margin: 0 10px;
    display: flex;
    flex-direction: column;
    padding: 0;
}

.products-grid li:hover {
    border-color: var(--color-silver);
}

.products-grid-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    text-indent: -9999px;
    overflow: hidden;
}

.products-grid-fullwidth {
    flex-basis: 100%;
    margin: 0;
}

.products-carousel li {
    text-align: center;
    max-width: 270px;
    min-width: 100px;
    width: 200px;
}

.products-carousel a,
.products-carousel a:link,
.products-carousel a:visited {
    display: block;
    z-index: 9999;
}

.products-grid--brochure {
    flex-basis: 180px;
    display: block !important;
}

.ls-cat-offer {
    margin: 10px auto 30px;
    max-width: 1100px;
    padding: 0 16px;
}

.ls-cat-offer img {
    max-width: 100%;
}

.products-grid li.empty {
    height: 0;
    visibility: hidden;
}

.catalog-category-view .products-grid-fullwidth {
    display: block;
}

.catalog-category-view .search.results>.block {
    display: none;
}

.ls-products-grid {
    text-align: center;
    overflow-x: hidden;
    margin: 0 24px;
}

.ls-products-grid section {
    margin-bottom: -40px;
}

@supports (display: grid) {

    .catalog-category-view .products-grid,
    .catalogsearch-result-index .products-grid,
    .catalogsearch-advanced-result .products-grid {
        display: grid;
        margin: 0 0 2em 0;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        grid-gap: 25px;
        position: relative;
    }

    .catalog-category-view .products-grid::after {
        position: absolute;
        bottom: 0;
        width: 100%;
        content: '';
        background: var(--color-gallery);
        height: 1px;
    }
}

.catalog-category-view .products-grid li {
    margin: 0;
    border: none;
    padding-bottom: 50px;
}

.catalog-category-view .products-grid li::after {
    content: '';
    background: var(--color-gallery);
    bottom: 0px;
    left: -25px;
    width: calc(100% + 50px);
    height: 1px;
    position: absolute;
}

.catalog-category-view .products-grid li>div,
.catalogsearch-result-index .products-grid li>div {
    padding: 0 15px;
    margin-bottom: 0.5em;
}

.ls-grid-image {
    padding-bottom: 100%;
    height: 0;
    width: 100%;
    margin-bottom: auto;
}

.ls-grid-image--sample,
.ls-grid-image--brochure {
    position: relative;
    padding: 10px;
}

.ls-grid-image>div:first-child {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: inset 0 0 0 1px var(--color-gallery);
    border-radius: 5px;
}

.ls-grid-image img,
.ls-grid-image--sample img,
.ls-grid-image--brochure img {
    max-height: unset;
    max-width: 100%;
    height: 100%;
    mix-blend-mode: multiply;
}

.ls-grid-image--sample img,
.ls-grid-image--brochure img {
    height: auto;
}

.products-grid--brochure li {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-bottom: 1px solid var(--color-seashell) !important;
    padding-bottom: 2em !important;
}

.products-grid--brochure li>div {
    align-items: center !important;
}

.products-grid li>div,
.products-carousel li>div {
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 2em;
}

.ls-grid-image {
    position: relative;
}

.ls-grid-image img {
    max-height: 240px;
}

.products-grid h3,
.products-carousel h3 {
    margin-top: 0.4em;
}

.catalog-category-view .products-grid li>div {
    align-items: flex-start;
    text-align: left;
}

.products-grid h3 a {
    display: block;
    line-height: 1.2;
    color: var(--color-black);
}

.products-carousel h3 a {
    display: block;
    font-family: var(--font-text-regular);
    font-size: 1.2em;
    line-height: 1.2;
    letter-spacing: 0.05em;
    color: var(--color-main);
}

.catalog-category-view h3.product-name {
    font-size: 19px;
    color: var(--color-black);
}

.products-grid h2 a:hover {
    color: var(--color-black);
}

.products-grid .ratings {
    border-bottom: none;
}

.ls-grid-price {
    font-size: 16px;
    font-size: clamp(15px, 2.5vw, 16px);
    letter-spacing: 0.05em;
    display: inline-block;
    margin: auto 0 10px 0;
    white-space: nowrap;
    color: rgb(64, 64, 64);
}

.ls-grid-price-old~.ls-grid-price {
    color: var(--color-totem-pole);
}

.ls-price-prefix {
    font-size: 0.7em;
    color: var(--color-dusty-gray);
    font-style: italic;
}

.ls-price-prefix-hp {
    text-transform: lowercase;
    font-style: italic;
    font-size: 0.7em;
    color: var(--color-dusty-gray);
}

.price-box.price-final_price {
    width: 100%;
}

.ls-grid-price-wrapper-sale {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: auto;
}

.ls-grid-price-wrapper-sale .ls-grid-price {
    letter-spacing: 0.02em;
}

.ls-grid-price-old {
    position: relative;
    color: rgb(64, 64, 64);
    margin-right: 10px;
}

.ls-grid-price-old::before {
    position: absolute;
    content: '';
    top: 50%;
    border-top: 1px solid rgb(64, 64, 64);
    z-index: 199;
    height: 100%;
    width: 100%;
    transform: rotate(-5deg);
    mix-blend-mode: multiply;
}

.ls-cat-head {
    text-align: center;
}

.ls-cat-head h1 {
    color: var(--color-black);
    margin: 15px 0 10px 0;
    font-size: 30px;
    font-size: clamp(20px, 2.5vw, 30px);
    letter-spacing: 0.175em;
    text-transform: uppercase;
}

.ls-cat-head h2 {
    font-size: 24px;
    font-size: clamp(16px, 2.5vw, 24px);
    line-height: 21px;
    letter-spacing: 0.6px;
    color: var(--color-mine-shaft);
    margin-top: 0.8em;
    padding-bottom: 0.6em;
}

.ls-cat-head h4 {
    font-size: 1.5em;
    letter-spacing: 0.05em;
    margin: 0;
    font-family: inherit;
    font-family: var(--font-text-regular);
}

.ls-cat-head p {
    font-size: 1em;
    margin: 0 auto;
    font-family: inherit;
    letter-spacing: 0.05em;
}

.products-grid .product-name {
    padding: 27px 0 10px 0;
    margin-bottom: auto;
}

.ls-grid-lead {
    display: flex;
    align-items: center;
    color: var(--color-gray-dark);
    font-size: 16px;
    font-size: clamp(14px, 2.5vw, 16px);
    margin: 0 0 10px 0;
    justify-content: space-between;
    width: 100%;
}

.ls-grid-lead span+span {
    margin-left: 15px;
}

.ls-grid-lead img {
    max-height: 18px;
    margin-right: 7px;
}

.ls-grid-free-del {
    width: 100%;
    font-size: 16px;
    color: var(--color-black);
    padding: 3px 5px;
    text-align: center;
    background: var(--color-gallery);
    line-height: 1;
    margin-bottom: 0;
    letter-spacing: 0.04em;
}

.ls-free-del-mb {
    margin-top: auto;
}

.catalog-category-view .products-grid li>div {
    padding: 0;
    margin-bottom: 0;
    height: 100%;
}

.ls-grid-image img,
.ls-grid-image--samples img,
.ls-grid-image--brochure img {
    max-height: unset;
    border-radius: 5px;
    object-fit: cover;
    max-width: 100%;
    max-height: 100%;
}

.ls-samples-tabs .ls-grid-image--samples img {
    height: auto;
}

.products-grid__sort--holder {
    margin: 5px 0 25px;
    display: flex;
    justify-content: space-between;
    height: 40px;
    align-items: center;
    position: relative;
}

.products-grid__sort--holder,
.products-grid__sort--holder::before,
.products-grid__sort--holder::after {
    border-top: 1px solid var(--color-gallery);
    border-bottom: 1px solid var(--color-gallery);
}

.products-grid__sort--holder::before,
.products-grid__sort--holder::after {
    content: "";
    display: inline-block;
    width: 50px;
    height: calc(100% + 2px);
    position: absolute;
    top: -1px;
}

.products-grid__sort--holder::before {
    left: -15px;
}

.products-grid__sort--holder::after {
    right: -15px;
}

.products-grid__sort--sort-holder {
    display: flex;
    position: relative;
    height: 40px;
    width: 60%;
    padding-left: 16px;
    justify-content: space-between;
    align-items: center;
    padding-right: 10px;
    border-right: 1px solid var(--color-gallery);
    font-size: 15px;
    font-family: var(--font-text-regular);
    color: var(--color-black);
}

.products-grid__sort--sort-holder:hover {
    cursor: pointer;
}

.products-grid__sort--sort-holder ul {
    display: none;
    position: absolute;
    top: 39px;
    left: -1px;
    width: calc(100% + 2px);
    background: var(--color-white);
    z-index: 99;
    text-align: left;
    border: 1px solid var(--color-alto-dark);
    border-top: none;
    border-radius: 0 0 5px 5px;
    padding: 5px 0;
}

.products-grid__sort--sort-holder.pg-open {
    box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.3);
}

.products-grid__sort--sort-holder.pg-open ul {
    display: block;
    box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.3);
}

.products-grid__sort--sort-holder li {
    font-family: inherit;
    padding: 2px 10px 2px 16px;
}

.products-grid__sort--sort-holder li:hover {
    background-color: var(--color-mine-shaft);
    cursor: pointer;
    color: var(--color-white);
}

.products-grid__sort--display-holder {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40%;
}

.products-grid__sort--display-holder--single {
    width: 20px;
    height: 20px;
    background: var(--color-gallery);
    margin: 0 15px 0 0;
}

.products-grid__sort--display-holder--multi {
    width: 20px;
    height: 20px;
    background: var(--color-gallery);
    position: relative;
    margin: 0 0 0 15px;
}

.products-grid__sort--display-holder .selected {
    background-color: var(--color-mine-shaft);
}

.products-grid__sort--display-holder--multi .vert {
    position: absolute;
    width: 4px;
    height: 20px;
    top: 0;
    left: 8px;
    background: var(--color-white);
}

.products-grid__sort--display-holder--multi .hori {
    position: absolute;
    width: 20px;
    height: 4px;
    top: 8px;
    left: 0;
    background: var(--color-white);
}

/* category description */
.ls-cat-with-markup {
    text-align: left;
}

.ls-cat-with-markup h3,
.ls-cat-with-markup h4 {
    font-family: var(--font-text-medium);
    color: var(--color-black);
    margin-bottom: 1.25em;
}

.ls-cat-with-markup h3 {
    font-size: 17px;
    font-size: clamp(17px, 2.5vw, 21px);
}

.ls-cat-with-markup h3:not(:first-child) {
    margin-top: 2em;
}

.ls-cat-with-markup h4 {
    margin-top: 1.7em;
    margin-bottom: 1.25em;
}

.ls-cat-with-markup p+p {
    margin-top: 0.75em;
}

.ls-cat-with-markup li,
.ls-cat-with-markup a {
    color: var(--color-black);
}

.ls-cat-with-markup a {
    border-bottom: 1px dotted var(--color-gray-dark);
}

.ls-cat-with-markup a:hover,
.ls-cat-with-markup a:focus {
    color: var(--color-black);
    border-bottom: 1px solid var(--color-black);
}

.ls-cat-with-markup ul {
    list-style: disc;
    padding-left: 2.5em;
    margin-top: 1em;
    margin-bottom: 1em;
}

/* ------------------ Samples Ordering Grid and Box Jan 2021 ------------------ */
.sample-box__heading {
    font-size: 2.813em;
    margin: 50px 0;
    text-align: center;
}

.sample-box__holder {
    display: flex;
    flex-direction: column;
}

.sample-box__box-holder {
    position: relative;
}

.sample-box__box-sticky,
.sample-box__box-simple {
    background: var(--color-gallery);
    padding: 10px;
    top: 0;
}

.sample-box__cat-list>li {
    padding-bottom: 1em;
    margin-bottom: 1em;
    border-bottom: 1px solid var(--color-alto-dark);
}

.sample-box__cat-list>li>h2 {
    opacity: 0.9;
    font-family: var(--font-text-regular);
    font-size: 2em;
    line-height: 1;
    letter-spacing: 0.05em;
    color: var(--color-mine-shaft);
    display: flex;
    justify-content: space-between;
    margin-bottom: 0;
}

.sample-box__cat-list>li>h2:hover {
    cursor: pointer;
    color: var(--color-black);
    opacity: 1;
}

.sample-box__cat-list>li>h2 span:after {
    content: '+';
}

.sample-box__cat-list li.sample-cat-open>h2 span:after {
    content: '×';
}

.sample-box__cat-list>li>div {
    display: none;
    margin: 30px 0 10px 0;
}

.sample-box__cat-list li.sample-cat-open>div {
    display: block;
}

.sample-box__cat-list__sample-grid {
    display: grid;
    grid-gap: 20px;
    grid-template-columns: repeat(auto-fill, minmax(120px, 2fr));
}

.sample-box__cat-isdc .sample-box__cat-list__sample-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 2fr));
}

.sample-box__cat-list__sample-grid>li {
    display: flex;
    flex-direction: column;
}

.sample-box__cat-list__sg--image-holder {
    position: relative;
}

.sample-box__cat-list__sg--image-holder img {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: contain;
    height: auto;
}

.sample-box__cat-list__sg--image-holder .sample-box__add {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    background: url("/pub/media/skin/sample-picker/Plus_circle_white.svg") no-repeat center center;
    background-size: 70px;
    transition: opacity .25s ease-in-out;
}

.sample-box__cat-list__sg--image-holder .sample-box__added {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0.5;
    background: url("/pub/media/skin/sample-picker/tick_circle_white.svg") no-repeat center center;
    background-size: 70px;
}

.sample-box__add.sample-box__no-stock {
    background-color: red;
}

.sample-box__add:not(.sample-box__no-stock) {
    cursor: pointer;
}

.sample-box__add:not(.sample-box__no-stock):hover {
    opacity: 1;
    background-color: rgb(52, 52, 52);
    mix-blend-mode: soft-light;
}

.sample-box__no-stock {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    cursor: not-allowed;
    background-color: rgba(255, 255, 255, 0.25);
    font-size: 1.25em;
    padding: 5px;
    text-align: center;
    line-height: 1;
}

.sample-box__full:not(.sample-box__added) {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0.5;
    background-color: rgba(255, 255, 255, 0.25);
    opacity: 1;
    mix-blend-mode: screen;
    cursor: not-allowed;
}

.sample-box__cl--details {
    font-size: 1.25em;
    letter-spacing: 0.025em;
    color: var(--color-black);
    text-align: center;
    padding: 0 3px;
    margin: 10px 0;
}

.sample-box__cl--details__oos {
    opacity: 0.25;
}

.sample-box__cl--info-trigger {
    display: flex;
    justify-content: center;
    margin-top: 10px
}

.sample-box__cl--info-trigger span {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 16px;
    height: 16px;
    background: url("/pub/media/skin/sample-picker/information_button.svg") no-repeat center center;
    opacity: 0.7;
}

.sample-box__cl--info-trigger span:hover {
    cursor: pointer;
    opacity: 1;
}

/*--------------------------------------------------------*/
.sample-box__box-container {
    width: 100%;
    position: relative;
    height: 0;
    overflow: hidden;
    padding-top: 74.45%;
    margin-bottom: 30px;
}

.sample-box__box-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.sample-box__box-holder h2 {
    font-size: 1.563em;
    letter-spacing: 0.005em;
    font-family: var(--font-text-medium);
    padding-bottom: 10px;
    margin-bottom: 25px;
    border-bottom: 1px solid var(--color-alto-dark);
}

.sample-box__box p {
    font-size: 1.375em;
    line-height: 1.227em;
    letter-spacing: 0.005em;
    margin-bottom: 50px;
}

.sample-box__basket li>ul {
    display: grid;
    grid-column-gap: 3em;
    grid-template-columns: repeat(auto-fit, minmax(150px, 2fr));
    margin-bottom: 30px;
}

.sample-box__p-row {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    z-index: 9999;
    position: relative;
    margin: 2px 0;
}

.sample-box__box-sticky .sample-box__p-row--basket-image {
    display: none;
}

.sample-box__box-simple .sample-box__p-row {
    mix-blend-mode: multiply;
}

.sample-box__p-row--basket-image img {
    width: 58px;
    height: auto;
    object-fit: contain;
    margin-right: 15px;
}

.sample-box__p-row span {
    min-width: 25px;
    margin-right: 5px;
}

.sample-box__box-simple .sample-box__p-row span {
    min-width: 15px;
}

.sample-box__p-row span:last-child {
    margin-left: auto;
}

.sample-box__p-row span img {
    height: 16px;
    width: auto;
    object-fit: contain;
    opacity: 0.6;
    cursor: pointer;
}

.sample-box__p-row span img:hover {
    opacity: 1;
}

.sample-box__data {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.sample-box__box-image {
    position: absolute;
    z-index: 2;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}

.sample-box__box-image img {
    width: 100%;
    max-width: 100%;
}

.sample-box__small-sample {
    height: 7.925%;
    /*118/1489*100*/
    width: 19.5%;
    /*390/2000*100*/
    position: absolute;
    background-size: 110%;
    background-position: center center;
    z-index: 20;
    transform: scale(1.1);
}

.sample-box__large-sample {
    height: 2%;
    width: 40%;
    left: 7%;
    top: 24%;
    position: absolute;
    background-size: 110%;
    background-position: center center;
    z-index: 20;
    transform: scale(1.2);
}

.sample-box__modal__rounded {
    min-width: 310px;
    max-width: 580px;
    border-radius: 16px;
}

.sample-box__modal__rounded .fb-modal__inner img {
    max-width: calc(100% - 80px);
    height: auto;
    margin: 40px;
}

.sample-box__modal__rounded .fb-modal__inner h2 {
    font-family: var(--font-text-medium);
    margin-bottom: 10px;
    margin-top: 0;
    font-size: 2em;
    letter-spacing: 0.005em;
    color: var(--color-black);
    opacity: 0.9;
}

.sample-box__modal__rounded .fb-modal__inner h3 {
    margin-bottom: 40px;
    margin-top: 0;
    font-size: 1.8752em;
    letter-spacing: 0.005em;
    color: var(--color-mine-shaft);
    opacity: 0.5;
    font-family: var(--font-text-regular);
}

button.sample-box__pop-add,
button.sample-box__atc-button {
    color: rgba(255, 255, 255, 0.8);
    font-size: 10px;
    background: var(--color-mine-shaft);
    margin: 0 auto;
    border-radius: 24px;
    width: 260px;
    text-transform: uppercase;
    font-family: var(--font-text-regular);
    font-size: 1em;
    letter-spacing: 0.2em;
    height: 43px;
    display: block;
}

button.sample-box__pop-add:hover,
button.sample-box__atc-button:hover {
    color: var(--color-white);
    cursor: pointer;
    background-color: var(--color-cod-gray);
}

.sample-box__atb-holder {
    display: flex;
    flex-direction: column;
}

.sample-box__radio-holder {
    display: flex;
    margin-bottom: 30px;
}

.sample-box__radios {
    font-size: 18px;
    color: var(--color-gray-dark);
    display: flex;
    flex-direction: column;
}

.sample-box__radio-holder p {
    margin-bottom: 10px;
}

/* ------------------------------------------------------------ */
/* -------------- P R O D U C T   D E T A I L S --------------- */
/* ------------------------------------------------------------ */
h2.products_section-header,
.ls-pn-details h2.products_section-header {
    text-align: center;
    padding: 5px 15px;
    margin: 30px 0 30px 0;
    line-height: 1;
    font-size: 16px;
    letter-spacing: 4.8px;
    font-family: var(--font-text-regular);
    position: relative;
    text-transform: uppercase;
    border-bottom: none;
}

h2.products_section-header::after {
    content: ' ';
    background: var(--color-seashell);
    height: 1px;
    left: 0;
    width: 100%;
    top: 50%;
    position: absolute;
    z-index: -1;
}

h2.products_section-header span {
    background: var(--color-white);
    padding: 5px 9px;
    margin: 0 auto;
    display: inline-block;
}

.grouped-items-table {
    width: calc(100% - 20px);
    margin: 1.5em 10px 1em 10px;
    border: 1px solid var(--color-silver);
    border-radius: 5px;
    border-collapse: unset;
}

.stock-levels-msg td,
.grouped-items-table .stock-levels-msg td,
.grouped-items-table .stock-levels-msg td:first-child {
    font-size: 14px;
}

.pieces-m2 {
    display: none;
}

.ls-socialSharing-holder {
    margin: 1em 0;
}

.ls-socialSharing-holder ul {
    margin-top: 1em;
    display: flex;
}

.ls-socialSharing-holder li {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 1em;
    width: 32px;
    height: 32px;
    background: var(--color-cape-cod-darker);
    transition: background-color 0.3s ease-in-out;
    line-height: 1;
    border-radius: 32px;
    text-align: center;
}

.ls-socialSharing-holder li:last-child {
    margin-right: 0;
}

.ls-socialSharing-holder li:hover {
    background-color: var(--color-boulder);
}

.ls-socialSharing-holder a {
    font-size: 1rem;
    color: var(--color-white);
}

.ls-socialSharing-holder img {
    display: block;
    border: 0;
    width: 20px;
    height: 20px;
}

.ls-product-nameblock {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    font-family: var(--font-text-regular);
    color: var(--color-black);
    align-items: center;
}

.ls-simple-on-sale .ls-product-nameblock>div::before,
.ls-simple-on-clear .ls-product-nameblock>div::before {
    display: inline-block;
    font-size: 0.8em;
    color: var(--color-white);
    letter-spacing: 2px;
    margin-right: 3px;
    padding: 1px 7px;
    text-transform: uppercase;
}

.ls-simple-on-sale .ls-product-nameblock>div::before {
    content: "Sale";
    background: rgba(0, 0, 0, 0.7);
}

.ls-simple-on-clear .ls-product-nameblock>div::before {
    content: "Clearance";
    background: rgb(142, 0, 0);
}

.cross-sells-container.empty-slider {
    display: none;
}

/* fix for ie11 not wrapping text in flexboxes */
.ls-product-nameblock div {
    flex-basis: 0;
    flex-grow: 1;
}

.ls-product-seal-holder,
.ls-product-seal-holder label {
    display: flex;
    align-items: center;
}

.ls-product-seal-holder input[type=checkbox] {
    margin-right: 0.25em;
}

.table-head-with-help {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.table-head-with-help img {
    width: 13px;
    height: 13px;
    opacity: 0.8;
}

.table-head-with-help img:hover {
    cursor: pointer;
    opacity: 1;
}

.products-desc__container {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    margin: 0 0 2em 0;
}

.products-desc__text {
    font-size: 1.2em;
    line-height: 1.2;
    max-width: 1200px;
    min-width: 320px;
    text-align: center;
    font-family: var(--font-text-regular);
    display: flex;
    align-items: center;
}

.products-desc__divider {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    flex-basis: 60px;
}

.products-desc__divider div {
    width: 1px;
    height: 100%;
    background: var(--color-silver);
}

.products-desc__icons {
    padding-top: 10px;
    align-self: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.products-desc__icons div {
    text-align: center;
    margin: 0 1em;
    flex-basis: 170px;
}

.products-desc__icons div:last-child {
    margin-right: 10px;
}

.products-desc__icons a {
    color: inherit;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    line-height: 1.1;
}

.products-desc__icons a:hover {
    text-decoration: underline;
}

.products-desc__icons img {
    height: 40px;
    width: auto;
    display: block;
}

.products-desc__icons span {
    flex-basis: 2.5em;
    display: flex;
    align-items: center;
}

.product-basics {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 30px;
}

.product-name {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.product-name h1,
.product-name span {
    font-size: 1.9em;
    letter-spacing: 0.0625em;
    color: var(--color-black);
    line-height: 1.2;
    text-align: center;
}

.product-name span {
    margin-left: 0.5em;
}

.product-name span em {
    font-size: 0.75em;
    color: var(--color-main);
}

.product-img-box {
    max-width: 400px;
    margin-top: 20px;
    /*[mlr] removed min-height: 400px;*/
}

.product-img-box-large {
    max-width: 100%;
    min-height: 60px;
}

.product-img-box img {
    max-width: 100%;
    min-width: 100%;
    object-fit: cover;
}

/* h3 used for Product Description and other dropdowns... */
.product-shop h3,
.product-shop h3 a {
    font-family: var(--font-text-regular);
    font-size: 1.0em;
    letter-spacing: 0.05em;
}

input.qty {
    width: 52px;
    font-size: 1em;
    padding: 3px 1px 3px 5px;
    border: 1px solid var(--color-nobel);
    border-radius: 3px;
    margin: 0;
}

.ls-lsGalleryMedia-gallery {
    width: 100%;
    margin: 0em 0 1em 0;
}

.ls-lsGalleryMedia-gallery>h2,
.box-up-sell>h2 {
    font-size: 1.8em;
    letter-spacing: 0.09em;
    margin-bottom: 0.5em;
}

.box-up-sell {
    margin-top: 4em;
}

.ls-productVariations {
    margin: 30px 0;
    width: 100%;
}

.ls-productVariations th {
    height: 2.5em;
    padding: 0 15px;
    vertical-align: middle;
    font-family: var(--font-text-regular);
    font-size: 1em;
    letter-spacing: 0.08em;
}

.ls-productVariations tr:nth-child(odd) td {
    background-color: var(--color-mercury);
}

.ls-productVariations td {
    padding: 0 15px;
    height: 2.5em;
    vertical-align: middle;
    letter-spacing: 0.08em;
}

.ls-product-extras .hp-dr-holder li {
    padding: 20px;
    max-width: 180px;
}

.ls-product-extras .hp-dr-holder a {
    font-size: calc(10px + 0.25vw);
}

.ls-product-extras .hp-dr-holder img {
    max-height: 60%;
}

.ls-product-extras .hp-dr-holder span {
    padding: 0;
}

.ls-product-pop,
.ls-product-pop__variation {
    width: 100%;
    /* FancyBox popup constrain width... Mobile should be max width, larger devices less... */
}

.ls-product-pop__variation {
    padding: 15px 30px 15px 15px !important;
    border-radius: 12px;
}

.fancybox-is-open .fancybox-bg {
    opacity: 0.7 !important;
}

/* colour variation popup with slideshow */
.color-variation-wrapper {
    max-width: 748px;
    margin: 10px;
    padding: 10px;
    border: 1px solid var(--color-black);
    border-radius: 10px;
    overflow: hidden;
}

.color-variation-wrapper .columns {
    display: grid;
    gap: 10px;
}

.color-variation-wrapper .left {
    overflow: hidden;
}

.color-variation-wrapper .left .swiper-slide {
    text-align: center;
}

.color-variation-wrapper .left img {
    width: 300px;
    height: 300px;
    background: var(--color-alto-darker);
    margin: 0 auto;
    transform: scale(1.1);
}

.color-variation-wrapper .right {
    overflow: hidden;
}

.color-variation-wrapper .right>div {
    min-height: 100%;
    padding: 20px 0;
    display: flex;
    flex-direction: column;
}

.color-variation-wrapper .right .slider-wrapper {
    flex-grow: 100;
}

.swiper-right .swiper-slide {
    background: var(--color-white);
    height: 170px;
}

.swiper-right .swiper-slide>div {
    max-width: 300px;
    font-family: var(--font-text-regular);
    font-size: 1.25em;
    line-height: 1.2;
}

.swiper-right-nav {
    width: 90px;
    display: flex;
    justify-content: space-between;
}

.color-variation-wrapper .right .extra,
.color-variation-wrapper .swiper-pagination {
    font-size: 0.85em;
    font-style: italic;
    line-height: 1.2;
    letter-spacing: 0.06em;
    color: var(--color-ls-default-grey);
}

.color-variation-wrapper .right .extra {
    margin-top: 1em;
}

.color-variation-wrapper .swiper-button-prev,
.color-variation-wrapper .swiper-button-next,
.color-variation-wrapper .swiper-pagination {
    position: static;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
}

.color-variation-wrapper .swiper-button-prev,
.color-variation-wrapper .swiper-button-next {
    color: var(--color-main) !important;
}

.color-variation-wrapper .swiper-button-prev::after,
.color-variation-wrapper .swiper-button-next::after {
    font-size: 2em;
}

.color-variation-wrapper .swiper-button-prev::after {
    content: "\2190";
}

.color-variation-wrapper .swiper-button-next::after {
    content: "\2192";
}

.color-variation-wrapper .swiper-pagination {
    text-align: left;
}

/* END colour variation popup with slideshow */

/* pointing special offer on product view */
.ls-pointing {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    margin-top: 1em;
    justify-content: center;
    margin: 0 -10px;
}

.ls-pointing div {
    min-width: 320px;
    max-width: 385px;
    width: 100%;
    margin: 0 10px 1.5em 10px;
}

.ls-pointing table {
    width: 100%;
}

.ls-pointing table+table {
    margin-left: 30px;
}

.ls-pointing td,
.ls-pointing th {
    padding: 3px 5px;
    font-size: 0.9em;
    line-height: 1.2;
}

.ls-pointing th {
    font-size: 0.75em;
    border-bottom: 1px solid var(--color-silver);
    font-weight: normal;
    white-space: nowrap;
}

.ls-pointing td:first-child,
.ls-pointing th:first-child {
    padding-left: 0;
}

.ls-pointing td:last-child,
.ls-pointing th:last-child {
    padding-right: 0;
}

.ls-pointing td {
    vertical-align: middle;
}

.ls-pointing tbody+thead th {
    padding-top: 3em;
}

.ls-pointing span {
    display: block;
    width: 70px;
    height: 16px;
    float: right;
}

.ls-pointing~p {
    margin-top: 0.5em;
    font-size: 0.8em;
    line-height: 1.2;
}

.ls-pointing~p a {
    color: var(--color-main);
}

.ls_cart_lock_questions {
    margin: 1em 0;
}

.ls_cart_lock_questions label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.ls_cart_lock {
    margin-right: 1em;
}

.ls-products-divider {
    margin-bottom: 2em;
    padding-bottom: 2em;
    border-bottom: 1px solid var(--color-mercury);
}

.product-shop,
.product-shop-no-qp {
    margin: 0;
    padding: 0 5px;
    /* padding increases for desktops > 1024 */
}

.grouped-items-table td:first-child {
    padding-left: 5px;
}

.grouped-items-table td,
.grouped-items-table th {
    padding: 12px 3px;
    vertical-align: middle;
    font-size: 12px;
    color: var(--color-black);
}

.grouped-items-table th {
    font-size: 10px;
    line-height: 1;
    text-align: center;
    vertical-align: bottom;
}

.grouped-items-table th:first-child {
    text-align: left;
}

.grouped-items-table th:last-child {
    text-align: center;
}

.grouped-items-table .odd td {
    background-color: var(--color-mercury);
}

.grouped-items-table th .ls-pqs .helv55 {
    display: none;
}

#presealHead {
    padding-left: 0;
    padding-right: 0;
    text-align: center;
}

.grouped-items-table td.a-center {
    text-align: center;
}

.grouped-items-table input[type="checkbox"],
.grouped-items-table input[type="radio"] {
    margin: 0;
}

.add-to-box {
    display: flex;
    justify-content: center;
    flex-direction: column;
    margin: 30px 16px;
}

.ls-pn-extras {
    width: 100%;
    margin: 0;
    padding-left: 10px;
    padding-right: 10px;
}

.ls-pn-extras .products_section-header {
    width: calc(100% + 20px);
    margin-left: -10px;
}

@-webkit-keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        top: -1000px;
    }
}

.ls-product-msg-holder,
.cms-home .messages,
.cms-home- .messages {
    position: absolute;
    top: 100px;
    left: 0;
    width: 100%;
    z-index: 9999;
    display: flex;
    justify-content: center;
    -webkit-animation: fadeOut 2s forwards;
    animation: fadeOut 2s forwards;
    -webkit-animation-delay: 4s;
    animation-delay: 4s;
    border: none;
}

.ls-alert {
    position: relative;
}

.ls-alert-close {
    position: absolute;
    right: 0;
    top: 0;
    width: 36px;
    height: 36px;
    font-size: 20px;
    font-weight: bold;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.ls-alert-close:hover {
    color: var(--color-black);
}

.ls-alert,
.error-msg {
    display: flex;
    width: 420px;
    height: auto;
    justify-content: center;
    flex-direction: column;
    border: 1px solid var(--color-silver);
    box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.4);
    z-index: 9999;
    background: var(--color-white);
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    font-size: 1.1em;
}

.ls-alert .messages {
    margin: 0;
}

.ls-alert span {
    margin: 1em 0;
}

.ls-alert img {
    max-height: 140px;
}

.ls-alert a {
    color: var(--color-main) !important;
}

#popMsg {
    animation: none;
    width: 100%;
    max-width: min(420px, 90%);
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#popMsg .ls-alert {
    width: 100%;
}

.cms-home .error-msg,
.cms-home- .error-msg {
    min-width: 30vw;
}

.cms-home .error-msg p,
.cms-home- .error-msg p {
    font-weight: bold;
    font-size: 1.2em;
    margin: 1em 0;
}

.ls-product-quantity-select {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    line-height: 1;
    margin-bottom: 0px;
}

.ls-product-quantity-select>div {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.ls-pqs span,
.switch {
    display: inline-block;
}

.ls-pqs .switch--horizontal {
    margin-bottom: 0;
}

.ls-pqs .switch label {
    font-size: 0.9rem;
}

.ls-pqs .switch--horizontal {
    transform: scale(0.9);
    white-space: nowrap;
}

.carouselGallery li {
    display: flex;
    justify-content: center;
}

.carouselGallery li img {
    max-width: 100%;
    height: auto;
    align-self: center;
}

.ls-product-cg .lSGallery li {
    border: none;
    border-radius: 0 !important;
}

.ls-product-cg .lSGallery li a {
    display: flex;
    justify-content: center;
}

.ls-product-cg .swiper-thumbs:not(.swiper-initialized) .lSGallery li img {
    max-width: 113px;
}

.ls-product-cg .lSGallery li img {
    max-width: 99%;
    margin-left: 1px !important;
    align-self: center;
    border-radius: 5px;
}

.ls-product-cg__caption {
    z-index: 10;
    position: absolute;
    bottom: 10px;
    font-size: 0.8em;
    opacity: 0;
    background: rgba(0, 0, 0, 0.4);
    padding: 2px 20px;
}

.carouselGallery li:hover .ls-product-cg__caption {
    opacity: 1;
}

.ls-product-cg .swiper-gallery {
    position: relative;
}

.ls-product-cg--enlarge {
    margin: 0 0 20px 0;
    display: flex;
    justify-content: center;
}

.ls-product-cg--enlarge button {
    font-family: var(--font-text-medium);
    font-size: 0.8em;
    padding: 8px 15px;
    margin: 0;
    background: var(--color-white);
    border: none;
    color: var(--color-main);
    letter-spacing: 2px;
}

.ls-product-cg--enlarge button:hover {
    background: var(--color-white);
    color: inherit;
}

.ls-gallery-simple {
    display: flex;
    justify-content: center;
}

.ls-lsGalleryGrid-wrapper {
    display: none;
}

.ls-lsGalleryMedia-container {
    display: flex;
    flex-direction: row;
}

.ls-lsGalleryMedia-container img {
    max-width: calc(100% - 16px);
    object-fit: cover;
    display: block;
}

.ls-lsGalleryMedia-leftGallery {
    flex: 0 0 66.667%;
}

.ls-lsGalleryMedia-rightGallery {
    flex: 0 0 33.333%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.embedded-video-16-9 {
    width: 90vw;
    height: 50.625vw;
    /* 90*9/16 */
    margin-left: 5vw;
    margin-right: 5vw;
}

/* IE11 bug: scaled images, inside flexbox, leave their container at the full height of the image. setting min-height below fixes... */
.ls-lsGalleryMedia-rg-top {
    display: flex;
    min-height: 1px;
}

.ls-lsGalleryMedia-rg-tl {
    flex-basis: calc(50% + 4px);
}

.ls-lsGalleryMedia-rg-tr {
    flex-basis: calc(50% - 4px);
}

.ls-lsGalleryMedia-bottomGallery {
    display: flex;
    padding-top: 16px;
    justify-content: space-between;
}

.ls-lsGalleryMedia-bgBlock {
    flex-basis: 33.3333%;
    overflow: hidden;
}

.ls-lsGalleryMedia-bottomGallery img {
    max-width: calc(100% - 16px);
    object-fit: cover;
    display: block;
}

/* complete overide for css-grid, hide previous if supports and previous hides this... */
@supports (display: grid) {
    .ls-lsGalleryFlex-wrapper {
        display: none;
    }

    .ls-lsGalleryGrid-wrapper {
        display: grid;
        width: 100%;
        height: calc(((100vw - 10px) / 2) - 10px);
        max-height: 670px;
        grid-gap: 10px;
        grid-template-columns: repeat(6, 1fr);
        grid-template-rows: repeat(3, 1fr);
    }

    .ls-lsGalleryGrid-box {
        align-self: start;
        justify-self: start;
        overflow: hidden;
        height: 100%;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        width: 100%;
        position: relative;
    }

    .ls-lsGalleryGrid-box a {
        display: block;
        width: 100%;
        height: 100%;
        position: relative;
        z-index: 10;
    }

    .ls-lsGalleryGrid-box img {
        zoom: 2;
        object-fit: cover;
        display: block;
        margin: auto;
        height: auto;
        max-height: 100%;
        width: auto;
        max-width: 100%;
    }

    .ls-lsGalleryImage-11 {
        grid-column: 1 / 7;
        grid-row: 1 / 6;
    }

    .ls-lsGalleryImage-31 {
        grid-column: 1 / 5;
        grid-row: 1 / 4;
    }

    .ls-lsGalleryImage-32 {
        grid-column: 5 / 7;
        grid-row: 1 / 3;
    }

    .ls-lsGalleryImage-33 {
        grid-column: 5 / 7;
        grid-row: 3 / 3;
    }

    .ls-lsGalleryImage-51 {
        grid-column: 1 / 5;
        grid-row: 1 / 4;
    }

    .ls-lsGalleryImage-52 {
        grid-column: 5 / 5;
        grid-row: 1 / 1;
    }

    .ls-lsGalleryImage-53 {
        grid-column: 5 / 5;
        grid-row: 2 / 2;
    }

    .ls-lsGalleryImage-54 {
        grid-column: 6 / 6;
        grid-row: 1 / 3;
    }

    .ls-lsGalleryImage-55 {
        grid-column: 5 / 7;
        grid-row: 3 / 3;
    }

    .ls-lsGalleryImage-71 {
        grid-column: 1 / 5;
        grid-row: 1 / 3;
    }

    .ls-lsGalleryImage-72 {
        grid-column: 5 / 5;
        grid-row: 1 / 1;
    }

    .ls-lsGalleryImage-73 {
        grid-column: 5 / 5;
        grid-row: 2 / 2;
    }

    .ls-lsGalleryImage-74 {
        grid-column: 6 / 6;
        grid-row: 1 / 3;
    }

    .ls-lsGalleryImage-75 {
        grid-column: 1 / 3;
    }

    .ls-lsGalleryImage-76 {
        grid-column: 3 / 5;
    }

    .ls-lsGalleryImage-77 {
        grid-column: 5 / 7;
    }

    .ls-lsGalleryGrid__zoom {
        background-size: 130%;
    }
}

.ls-lsGalleryGrid-caption {
    color: var(--color-white);
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 0.7em;
    width: 100%;
    padding: 10px;
    line-height: 1.2;
}

.ls-lsGalleryGrid-box:hover .ls-lsGalleryGrid-caption {
    text-shadow: 1px 1px 3px var(--color-black);
}

.products_oos {
    background: var(--color-mercury);
    padding: 30px;
    display: flex;
    font-size: 1.1em;
    letter-spacing: 0.05em;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
}

.products_oos p {
    max-width: 1000px;
}

/* ---------------- April 2020 new product css and RPaG ---------------- */
.rpag-table input[type="number"] {
    opacity: 0.25;
    /*will be hidden completely later... */
}

.helper-icon {
    display: inline-block;
}

.grouped-items-table.rpag-table {
    margin-bottom: 0;
}

.rpag-table tbody tr:nth-child(odd) td {
    background: var(--color-gallery);
}

.rpag-table td {
    padding-top: 5px;
    padding-bottom: 5px;
}

.ls-product-nameblock img:first-child {
    mix-blend-mode: multiply;
    max-width: 45px;
    height: auto;
    object-fit: contain;
    margin-right: 10px;
}

.rpag-table+p {
    color: #8f8f8f;
    font-style: italic;
    margin-left: 0.5em;
    margin-bottom: 2.75em;
    font-size: 0.75em;
    letter-spacing: 0.05em;
}

.ls-pn-container {
    width: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
}

.ls-pn-container h2:first-child,
.ls-pn-details .ls-pn-price {
    display: none;
}

.ls-pn-container .prod-m-only h1 {
    color: var(--color-black);
    font-size: 25px;
    letter-spacing: 3.57px;
    line-height: 1.4;
    margin-bottom: 15px;
    text-align: center;
    text-transform: uppercase;
}

.ls-pn-carouselWrapper {
    flex-wrap: wrap;
}

.ls-pn-carousel-sticky .carouselGallery li {
    position: relative;
}

.ls-pn-detailsWrapper {
    flex-wrap: wrap;
}

.ls-pn-details {
    position: relative;
}

.ls-pn-details h2,
.ls-pn-price {
    color: var(--color-cod-gray-light);
    font-size: 1.6em;
    font-size: clamp(1.6em, 2.5vw, 32px);
    letter-spacing: 0.04em;
    margin-bottom: 20px;
    border-bottom: 1px solid #b2b2b2;
    padding-bottom: 20px;
}

.ls-pn-details h2 {
    line-height: 1.2;
}

.ls-pn-price em {
    font-style: normal;
}

.ls-pn-price em,
.ls-pn-price span {
    color: var(--color-cod-gray-light);
    font-size: 1rem;
    font-size: clamp(16px, 2.5vw, 20px);
    letter-spacing: 0.1px;
}

.ls-pn-price span {
    font-size: 110%;
    padding-left: 15px;
    white-space: nowrap;
}

.prod-m-only {
    margin: 0 11px;
}

.prod-m-only .ls-pn-price {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding: 5px 9px;
    margin: 0 0 15px 0;
    font-family: var(--font-text-regular);
    color: var(--color-black);
    text-align: center;
    line-height: 1;
    font-size: 16px;
    border: none;
}

.prod-m-only .ls-pn-price::after {
    content: ' ';
    background: var(--color-seashell);
    height: 1px;
    left: -16px;
    width: calc(100% + 32px);
    top: 50%;
    position: absolute;
    z-index: -1;
}

.prod-m-only .ls-pn-price div {
    background: var(--color-white);
    padding: 5px 15px;
    margin: 0 auto;
    display: inline-block;
    font-family: inherit;
}

.prod-m-only .ls-pn-price em {
    color: inherit;
    font-style: normal;
    font-size: inherit;
}

.prod-m-only .ls-pn-price span {
    font-size: inherit;
    padding-left: 7px;
}

.ls-pn-del {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    font-size: 1em;
    letter-spacing: 0.04em;
    color: var(--color-black);
}

.ls-pn-del>span:first-child {
    width: 100%;
    font-size: 16px;
    padding: 7px 22px;
    border-bottom: 1px solid var(--color-silver);
    border-top: 1px solid var(--color-silver);
}

.ls-pn-del>span:last-child {
    width: 100%;
    margin: 0;
    padding: 10px 17px;
    border-bottom: 1px solid var(--color-silver);
    font-size: 15px;
}

.ls-pn-del+.ls-pn-del>span:last-child {
    border-top: none;
}

.ls-pn-del>span {
    display: flex;
    align-items: center;
    line-height: 1.2;
}

.ls-pn-del img {
    max-height: 34px;
    width: auto;
    margin-right: 15px;
    flex-basis: 37px;
    object-fit: contain;
}

.ls-pn-del>span:first-child img {
    max-height: 25px;
    margin-right: 13px;
}

.ls-pn-del>span:last-child img {
    max-height: 20px;
}

.ls-pn-del sup {
    display: none;
}

.ls-pn-del .co-info sup {
    display: inline;
}

.ls-pn-del.has-co-info {
    flex-wrap: wrap;
}

.ls-pn-del.has-co-info>span:nth-child(3) {
    flex-grow: 1;
    order: 3;
}

/* animation to draw attention on lead time change */
@keyframes fadeInOutAnimation {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeInOutAnimation2 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.product-lead-anim {
    animation: fadeInOutAnimation 0.5s 4;
    animation-direction: alternate-reverse;
    animation-timing-function: ease-in-out;
}

.product-lead-anim2 {
    animation: fadeInOutAnimation2 0.5s 4;
    animation-direction: alternate-reverse;
    animation-timing-function: ease-in-out;
}

/* END animation to draw attention on lead time change */
.co-info {
    font-size: 16px;
    width: 100%;
    padding: 7px 22px;
    display: inline-block;
    border-bottom: 1px solid var(--color-silver);
}

.co-info-logo,
.ls-pn-del .co-info-logo {
    max-height: 25px;
    margin-right: 13px;
}

.tab .tab-content .co-info {
    font-size: inherit;
    width: 100%;
    padding: 10px 0 0;
    border: none;
    margin-bottom: 1em;
    text-align: center;
}

.tab .tab-content .co-info-logo {
    height: 40px;
    max-height: 100%;
    margin-right: 0;
    margin-bottom: 8px;
}

.tab .tab-content .co-info-text {
    display: block;
}

.ls-product-testimonials {
    margin: 30px 10px;
}

.ls-product-testimonial {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 15px;
    background: var(--color-gallery);
    border-radius: 5px;
    position: relative;
}

.ls-product-testimonial::before {
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 48px solid var(--color-gallery);
    border-left: 48px solid transparent;
    position: absolute;
    top: 100%;
    left: 4%;
}

.ls-product-testimonial__image {
    flex-basis: 100px;
    flex-basis: clamp(60px, 10vw, 100px);
    margin-right: 20px;
    margin-right: clamp(15px, 2vw, 25px);
    flex-shrink: 0;
}

.ls-product-testimonial__image img {
    width: 100%;
    max-width: 100px;
    min-width: 50px;
    border-radius: 100%;
}

.ls-product-testimonial__txt {
    color: var(--color-black);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ls-product-testimonial__txt>span {
    letter-spacing: 0.005em;
    font-size: 18px;
    font-size: clamp(12px, 2.5vw, 20px);
    line-height: 1.2;
}

.ls-product-testimonial__strap {
    margin-top: 17px;
    padding-left: 15px;
    padding-right: 15px;
    display: flex;
}

.ls-product-testimonial__strap::before {
    content: "";
    display: inline-block;
    width: 100%;
    max-width: 100px;
    min-width: 50px;
    flex-basis: 100px;
    flex-basis: clamp(60px, 10vw, 100px);
    margin-right: 20px;
    margin-right: clamp(15px, 2vw, 25px);
    flex-shrink: 0;
}

.ls-product-testimonial__strap,
.ls-product-testimonial__strap a {
    font-size: 12px;
    letter-spacing: 0.08px;
    color: var(--color-black);
}

.ls-product-testimonial__strap .ls-product-testimonial__strap__name {
    text-decoration: none;
}

.ls-product-testimonial__strap__title em {
    font-style: italic;
}

.ls-product-testimonial__strap__title a {
    text-decoration: underline;
}

.ls-product-testimonial__strap div {
    overflow: hidden;
    text-overflow: ellipsis;
}

.ls-pn-del.ls-pn-pp-promo {
    padding-bottom: 0;
    overflow: hidden;
}

.ls-pn-del.ls-pn-pp-promo span:first-child {
    width: 100%;
}

.ls-pn-pp-promo span:last-child {
    padding: 15px 20px 10px 12px;
    border-bottom: none;
}

.ls-pn-pp-promo div {
    width: 100%;
}

.ls-product-testimonial__quote {
    display: inline-block;
    margin-left: -0.4315em;
}

.ls-product-testimonial__more {
    cursor: pointer;
}

.ls-product-testimonial__more span {
    font-size: 14px;
    font-size: clamp(12px, 2.5vw, 14px);
    letter-spacing: 0.07px;
}

.ls-product-testimonial__remains {
    display: none;
}

.ls-product-testimonial--open {
    align-items: flex-start;
}

.ls-product-testimonial--open .ls-product-testimonial__more {
    display: none;
}

.ls-product-testimonial--open .ls-product-testimonial__remains {
    display: inline;
}

.ls-pn-dq-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ls-pn-dq-wrapper h3 {
    font-size: 1.3em;
    line-height: 1;
}

.new-product .ls-pn-carousel-sticky::before,
.ls-products-grid .new-product::before {
    content: 'NEW';
    background: #00A652;
    left: 0;
    top: 0;
    position: absolute;
    width: auto;
    padding: 0 12px;
    color: var(--color-white);
    line-height: 1;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 4px;
    z-index: 1;
    font-family: var(--font-text-medium);
    font-size: 16px;
    border-radius: 5px 0 0 0;
}

.new-product .ls-product-cg::before {
    top: 0;
    left: 0;
}

.ls-products-grid .new-product::before {
    top: 0;
}

.ls-pn-carousel-sticky,
.discount10 {
    position: relative;
}

.disc-product .ls-pn-carousel-sticky::after,
.ls-products-grid .disc-product>div::before,
.discount10::before {
    content: '';
    background: var(--color-totem-pole);
    right: 0;
    top: 0;
    position: absolute;
    width: auto;
    padding: 0 12px;
    color: var(--color-white);
    line-height: 1;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 4px;
    z-index: 1;
    font-family: var(--font-text-medium);
    font-size: 16px;
    border-radius: 0 5px 0 0;
}

.discount--left::before {
    left: 0;
    right: auto;
    border-radius: 5px 0 0 0;
}

.disc-product .ls-pn-carousel-sticky::after {
    top: 0;
    content: '10% OFF';
}

.trade .disc-product .ls-pn-carousel-sticky::after {
    content: '20% OFF';
}

.ls-products-grid .disc-product>div::before,
.discount10::before {
    top: 0;
    content: '10% OFF';
}

.trade .ls-products-grid .disc-product>div::before {
    content: '20% OFF';
}

.ls-2col-grid .new-product::before,
.ls-2col-grid .disc-product>div::before,
.discount10::before {
    font-size: 12px;
    letter-spacing: 1px;
    top: 0;
}

.ls-pn-qp-calc {
    margin: 14px 0 44px 32px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-style: italic;
}

.ls-pn-qp-calc:hover {
    cursor: pointer;
    color: var(--color-black);
}

.ls-pn-qp-calc img {
    margin-right: 12px;
    height: 22px;
    width: 22px;
}

.ls-pn-extras-wrapper {
    margin: 30px 0 0 0;
}

.promotion-discount-text {
    font-size: 0.60em;
    color: var(--color-white);
    background: var(--color-darkred);
    padding: 2px 5px 3px;
}

/* marketing tags */
.ls-grid-mtag {
    font-family: var(--font-text-medium);
    font-size: 11px;
    line-height: 1;
    letter-spacing: 2px;
    text-align: center;
    text-transform: uppercase;
    color: var(--color-white);
    border-radius: 5px 5px 0 0;
    width: 100%;
    display: block;
    padding: 5px 12px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.ls-grid-mtag.new-tag {
    width: auto;
    border-radius: 5px 0 0 0;
}

.product-page-marketing-tag .ls-grid-mtag {
    width: auto;
    border-radius: 0;
}

/* END marketing tags */

/* Accordion styles */
.tabs {
    overflow: hidden;
    border-bottom: 1px solid var(--color-gallery);
}

.tabs input {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.tab {
    width: 100%;
    overflow: hidden;
}

.tab-label {
    display: flex;
    justify-content: space-between;
    padding: 1em 10px;
    cursor: pointer;
    border-top: 1px solid var(--color-gallery);
    font-size: 1.3em;
    font-size: clamp(16px, 2.5vw, 1.3em);
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--color-mine-shaft-darker);
}

.tab-label:hover {
    background: var(--color-gallery);
}

.tab-label::after {
    content: "\276F";
    width: 16px;
    text-align: center;
    transition: all .35s;
    transform: rotate(90deg);
}

.tab-content {
    max-height: 0;
    padding: 0;
    background: var(--color-white);
    display: none;
}

.tab-close {
    display: flex;
    justify-content: flex-end;
    padding: 1em;
    font-size: 0.75em;
    cursor: pointer;
}

.tab-close:hover {
    background: var(--color-gallery);
}

input:checked+.tab-label {
    background: var(--color-white);
}

input:checked+.tab-label:hover {
    background: var(--color-gallery);
}

input:checked+.tab-label::after {
    transform: rotate(270deg);
}

input:checked~.tab-content {
    max-height: 200vh;
    padding: 10px;
    display: block;
}

.ls-pn-specTable {
    border: 1px solid var(--color-gallery);
    width: 100%;
    margin-bottom: 15px;
}

.ls-pn-specTable th,
.ls-pn-specTable td {
    font-weight: normal;
    text-align: left;
    padding: 5px 15px;
    border-bottom: 1px solid var(--color-gallery);
    letter-spacing: 0.03em;
}

.ls-pn-specTable th {
    border-right: 1px solid var(--color-gallery);
}

.ls-pn-specTable th {
    width: 30%;
}

.ls-pn-specTable tr:last-child th,
.ls-pn-specTable tr:last-child td {
    border-bottom: none;
}

.ls-pn-tabText h3 {
    font-weight: bold;
    margin: 0.75em 0;
}

.ls-pn-tabText h3:first-child {
    margin-top: 0;
}

/* ------------------------------------------------------------ */
/* --------- P R O D U C T  Q U A N T I T Y   C A L C --------- */
/* ------------------------------------------------------------ */
#qp-holder {
    display: none;
}

.ls-product-quantity-picker {
    background: var(--color-outer-space);
    color: var(--color-white);
    padding: 15px;
    min-height: 180px;
    margin: 2em auto;
}

.ls-product-quantity-picker h3 {
    color: var(--color-white);
    font-size: 1.25em;
    margin-bottom: 1em;
    letter-spacing: 0.05em;
}

.ls-product-quantity-picker .helperText {
    color: var(--color-white);
}

.ls-qp-small-help-text {
    font-size: 0.8em;
    line-height: 1.2;
    margin: 15px 0;
}

.lsqp .row {
    margin-bottom: 10px;
    display: flex;
    justify-content: flex-start;
}

.lsqp .row label:first-child {
    margin-right: 10px;
    line-height: 1;
    min-width: 150px;
}

.lsqp .row label.ls-qp-row-helper {
    flex-basis: 100% !important;
    margin-top: -0.5em;
}

.lsqp label span {
    font-size: 0.7rem;
}

.lsqp .row:last-child {
    justify-content: center;
    margin: 20px 0 0 0;
}

.lsqp input,
.lsqp select {
    margin: 0;
    border: 1px solid var(--color-silver);
    padding: 2px 4px;
    font-size: 0.8em;
}

.lsqp select {
    max-width: 170px;
    overflow: hidden;
}

.input-small {
    width: 80px;
}

.lsqp .switch--horizontal {
    margin: 0 0 0 -13px;
    transform: scale(0.8);
    white-space: nowrap
}

.lsqp .switch--horizontal .toggle-outside {
    background-color: var(--color-silver);
}

.lsqp .switch label {
    color: var(--color-white);
    font-size: 0.9rem;
}

.lsqp .button {
    width: 100%;
    padding: 5px 20px;
    text-align: center;
}

.includeWaste {
    display: none;
}

/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */
/* connect search sub-control */
.ls-connect-search-holder {
    margin: 1em auto 0.5em auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    position: relative;
    flex-direction: column;
    padding: 15px;
    background: url("/pub/media/skin/connectbg.jpg") no-repeat center center;
    background-size: cover;
    border-radius: 30px;
}

.no-bg {
    background-image: none;
}

.ls-connect-search-holder h2 {
    font-size: 1.2em;
    letter-spacing: 0.05em;
;
    color: var(--color-white);
    line-height: 1;
    margin-bottom: 0;
}

.ls-connect-search-holder div {
    background: var(--color-white);
    padding-left: 1em;
    height: 36px;
    display: flex;
    max-width: 100%;
    align-items: center;
    justify-content: space-between;
    border-radius: 40px;
}

.ls-connect-search-holder input {
    border: none !important;
    font-size: 1em;
    margin-right: 1em;
    width: 140px;
}

.ls-connect-search-holder button,
.ls-connect-button {
    margin: 0 0.5em 0 0;
    padding: 0.40em 1em;
    border: none;
    text-transform: none;
    background-color: #216D51;
    color: var(--color-white);
    width: 90px;
    border-radius: 32px;
}

/* Accordion setup */
.accordion {
    margin: 0;
    border-top: 1px solid var(--color-silver-darker);
    list-style-type: none;
    padding: 0;

}

.accordion li {
    border-bottom: 1px solid var(--color-silver-darker);
    position: relative;
    padding: 0;

}

.accordion li div {
    display: none;
}

.accordion a {
    width: 100%;
    display: block;
    cursor: pointer;
    line-height: 39px;
    user-select: none;
}

.accordion a:after {
    width: 12px;
    height: 12px;
    border-right: 1px solid var(--color-main);
    border-bottom: 1px solid var(--color-main);
    position: absolute;
    right: 10px;
    content: " ";
    top: 0.85em;
    transform: rotate(-45deg);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.accordion div {
    font-size: 13px;
    font-size: 0.8em;
    padding: 0.5em 0 1em 0;
    line-height: 1.2;
}

.accordion a.active:after {
    transform: rotate(45deg);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

/* ------------------------------------------------------------ */
/* ---------------- C A R T (used also in OPC) ---------------- */
/* ------------------------------------------------------------ */
.lsobm-checkout-types {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin: 1em 0;
}

.lsobm-header {
    padding-bottom: 1em;
}

.lsobm-header h1 {
    font-size: 34px;
    letter-spacing: 3.4px;
    text-align: center;
}

.lsobm-totals {
    margin: 3em 0;
}

.lsobm-totals h2 {
    margin-top: -30px;
    margin-bottom: 0.5em;
    padding-bottom: 0.25em;
    border-bottom: 1px solid var(--color-alto-dark);
    font-size: 1.6em;
    font-family: var(--font-text-regular);
}

.lsobm-totals table {
    width: 100%;
}

.lsobm-totals td {
    padding: 0.25em 0.5em 0.25em 0;
    font-size: 1.1em;
}

.lsobm-totals tfoot {
    border-top: 1px solid var(--color-alto-dark);
    border-bottom: 1px solid var(--color-alto-dark);
}

.lsobm-totals tfoot td {
    padding: 0.5em 0.5em 0.5em 0;
    font-size: 1.35em;
}

.lsobm-totals tbody tr td:first-child {
    color: var(--color-ls-default-grey)
}

.lsobm-totals tbody tr:last-child td {
    padding-bottom: 0.75em;
}

.lsobm-totals tr td:first-child.a-right {
    text-align: left;
}

.ls-button-style-checkout.hollow {
    color: var(--color-ls-default-grey);
    border: 1px solid var(--color-ls-default-grey);
    background: var(--color-white);
    line-height: 1;
    cursor: pointer;
}

.ls-button-style-checkout.hollow:hover {
    background-color: var(--color-gallery);
    color: var(--color-main);
    border-color: var(--color-main);
}

#delivery-issue .ls-button-style-checkout.hollow {
    height: 40px;
    text-transform: capitalize;
}

.cart-round-button img {
    height: 16px;
}

.ls-button-style-back {
    width: 100px;
}

#billing-buttons-container button[title="Continue"] {
    margin-left: auto;
}

.cart-item {
    font-family: var(--font-text-regular);
    font-size: 1.1em;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.cart-item>div {
    padding: 0.75em 0.25em;
    font-family: var(--font-text-regular);
}

.cart-item div,
.cart-item span,
.cart-item a,
.cart-header div {
    font-family: inherit !important;
}

.cart-item a {
    color: var(--color-main);
    font-family: inherit;
}

.cart-item input.qty {
    border: 1px solid #E2E2E2;
    padding: 0.25em 0.1em 0.25em 0.5em;
}

.btn-remove {
    font-size: 0.8em;
    display: flex;
    align-items: center;
    margin-top: 3px;
}

.btn-remove:hover {
    color: var(--color-black);
    text-decoration: underline;
}

.btn-remove img {
    height: 11px;
    width: auto;
    margin-right: 3px;
}

.cart-item-details {
    float: left;
    display: flex;
    width: 55%;
}

.cart-item-details:first-child {
    padding-left: 0;
}

.cart-item-details span {
    font: inherit;
}

.cart-item-details a:first-child,
.cart-item-img {
    margin-right: 5px;
}

.cart-item-name {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.cart-item-name label {
    display: flex;
    align-items: center;
}

.cart-item-price {
    text-align: right;
}

.cart-item-quantity {
    text-align: right;
}

.cart-item-line-price {
    text-align: right;
}

.cart-header {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--color-alto-dark);
}

.cart-header #ls-product-quantity-select {
    transform: scale(0.75);
    transform-origin: left;
}

.cart-header .switch {
    margin-bottom: 0;
}

.additional-info,
.get-description,
.cart-item-details span .additional-info,
.cart-item-details span .get-description {
    font-size: 0.75em;
    display: block;
}

/* Column headers */
.cart-header>label {
    border-bottom: none;
    font-family: var(--font-text-regular);
    padding: 0.25em 0;
    font-size: 12px;
}

.items-ordered-container .cart-item>div {
    padding-left: 0;
    padding-right: 0;
}

/* Product entries */
.cart-item {
    padding: 0px;
    border-bottom: 1px solid var(--color-alto-dark);
    font-size: 12px;
    letter-spacing: 0.12px;
    line-height: 1.4;
}

.cart-item-details img {
    max-height: 60px;
    width: auto;
    object-fit: cover;
    max-width: 60px;
}

.cart-item-title {
    margin-right: 20px;
}

.cart-item-description {
    margin: 5px 20px 5px 0;
    line-height: 1.4em;
}

/* Totals section */
.totals .totals-item {
    float: right;
    clear: both;
    width: 100%;
    margin-bottom: 10px;
}

.totals .totals-item label {
    float: left;
    clear: both;
    width: 79%;
    text-align: right;
}

.totals .totals-item .totals-value {
    float: right;
    width: 21%;
    text-align: right;
}

.totals .totals-item-total {
    font-family: var(--font-text-regular);
}

.cart-checkout {
    float: right;
}

.mini-products-list .cart-item:nth-child(odd) {
    background: var(--color-mercury);
}

.mini-products-list .cart-item {
    border: none;
    font-size: 0.9em;
}

.cart-item>.sb-cart-item {
    padding: 0.25em 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    min-height: 2em;
    height: auto;
    align-items: center;
}

.mini-products-list input {
    background: var(--color-white);
    border: 1px solid var(--color-silver);
    text-align: center;
    padding: 3px;
}

.sb-cart-product {
    flex-basis: 60%;
    padding-left: 15px;
}

.sb-cart-price {
    flex-basis: 10%;
    text-align: right;
}

.sb-cart-qty {
    flex-basis: 8%;
}

.sb-cart-remove {
    flex-basis: 2%;
}

.sb-cart-subTotal {
    flex-basis: 10%;
    text-align: right;
    padding-right: 15px;
}

.cart-item-header {
    padding-left: 0;
    padding-right: 0;
    border: none;
    font-size: 1.1em;
    font-family: var(--font-text-regular);
}

/* Coupon Discount in Cart */
.discount {
    margin: 30px 0;
}

.discount h2 {
    font-size: 1.6em;
    letter-spacing: 0.0625em;
    border-bottom: 1px solid var(--color-main);
    padding-bottom: 0.5em;
    margin-bottom: 1em;
}

.discount .input-box {
    width: 100%;
    display: flex;
    margin: 2.5em 0;
}

.discount .input-text {
    flex-grow: 1;
    padding: 5px 10px;
    font-size: 1em;
    border: 1px solid #DBDBDB;
    background-color: var(--color-concrete);
}

.discount button {
    margin: 0 -1px 0 0;
    background: var(--color-emperor);
}

.checkout-cart-index .discount .input-box button {
    padding-left: 0.5em;
    padding-right: 0.5em;
}

/* SagePay controls */
.tokencard-radio {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.tokencard-radio :nth-child(2) {
    margin-right: auto !important;
    margin-left: 12px !important;
}

.tokencard-radio .btn-remove {
    margin-left: 15px;
}

.paymentsage li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 1em;
}

#sagepayserver_cc_nickname_li {
    white-space: nowrap;
}

.paymentsage li .input-box {
    width: 70%;
}

.paymentsage input {
    margin: 0;
}

.paymentsage input[type="text"] {
    width: 100% !important;
}

.ls_sagepay-saved h3 {
    margin: 1em 0;
}

#dt_method_sagepayserver {
    display: flex;
    align-items: center;
}

.trade #dt_method_sagepaypaypal {
    display: none;
}

/* ------------------------------------------------------------ */
/* ---------------- F O R M   C O N T R O L S ----------------- */
/* ------------------------------------------------------------ */
input[type="text"]:not(.ls-connect-postcode),
input[type="number"],
input[type="email"],
input[type="password"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #A5A6A1;
    padding: 3px 7px;
    font-size: 1em;
    color: var(--color-main);
    border-radius: 5px;
}

/* ------------------------------------------------------------ */
/* ------------ O N E   P A G E   C H E C K O U T ------------- */
/* ------------------------------------------------------------ */
.opc {
    margin-bottom: 100px
}

.block-progress {
    margin: 3em 0 3em 0;
}

.please-wait {
    order: 1;
    width: 100%;
    text-align: center;
}

.block-progress dt {
    margin: 0 0 0.4em 0;
    padding-bottom: 0.4em;
    border-bottom: 1px solid var(--color-main);
    font-size: 1.3em;
    font-family: var(--font-text-regular);
}

.block-progress dd {
    padding: 10px 15px;
    margin-bottom: 1.5em;
}

.block-progress dt.complete {
    margin: 0;
}

.block-progress p {
    margin: 0;
}

.block-progress .cards-list dt {
    background: none;
    border: 0 none;
    color: inherit;
    font-size: 12px;
    margin: 5px 0;
    padding: 0;
}

.block-progress .cards-list dd {
    border: 0 none;
    margin: 0;
    padding: 0;
}

.block-progress .cards-list .info-table th {
    font-weight: normal;
}

address {
    font-style: normal;
}

.changelink {
    color: var(--color-ls-default-grey);
    float: right;
    font-size: 1rem;
}

.changelink a {
    color: inherit;
    text-decoration: underline;
}

.changelink a:hover {
    color: var(--color-main);
}

.changelink .separator {
    display: none;
}

.block-content {
    line-height: 1.2;
}

.block-content address {
    color: var(--color-ls-default-grey);
    line-height: 1.8em;
}

.block-content address::first-line {
    font-weight: 900;
}

.opc-helptext {
    color: var(--color-ls-default-grey);
    margin: 0.25em 0;
    letter-spacing: 0.04em;
}

.opc .step-title h2 {
    display: flex;
    justify-content: flex-start;
    margin: 0 0 0.32em 0;
    padding-bottom: 0.32em;
    border-bottom: 1px solid var(--color-main);
    font-size: 1.3em;
    font-family: var(--font-text-regular);
}

.opc .active .step-title h2::after {
    content: '* Required Fields';
    margin-left: auto;
    font-size: 0.75rem;
    color: var(--color-ls-default-grey);
    align-self: flex-end;
}

.disallow {
    cursor: not-allowed;
    color: lightgray;
}

.opc .step-title a {
    display: none;
    float: right;
    font-size: 11px;
    line-height: 16px;
}

.opc .allow .step-title {
    cursor: pointer;
}

.opc .active .step-title {
    cursor: default;
}

.opc .active .step-title h2 {
    color: var(--color-main);
}

.opc .step {
    position: relative;
    margin-bottom: 2em;
    padding-top: 1em;
}

.opc .step .tool-tip {
    right: 30px;
}

.opc-intro-text {
    color: var(--color-ls-default-grey);
}

.opc .addresses {
    display: flex;
    margin: 1em -1em;
}

.opc .addresses li {
    min-width: 180px;
    max-width: 420px;
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 1.5em;
    margin: 1em;
    font-size: 0.9em;
    line-height: 1.2;
    cursor: pointer;
    color: var(--color-gray);
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.opc .addresses li strong {
    color: var(--color-main);
}

.opc .addresses li.addressActive {
    border-color: var(--color-silver-chalice);
    background-color: var(--color-concrete);
}

.opc .addresses li:hover {
    border-color: var(--color-silver-chalice-dark);
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);
}

.opc .addresses li.new-address {
    align-items: center;
    justify-content: space-between;
    border-color: var(--color-alto-dark);
}

.opc .new-address .circle {
    order: -1;
    margin-bottom: 1em;
}

.circle {
    border: 3px solid var(--color-silver-chalice);
    width: 52px;
    height: 52px;
    border-radius: 100%;
    position: relative;
    margin: 0px;
    display: inline-block;
    vertical-align: middle;
    background: var(--color-white);
}

.circle::before,
.circle::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-silver-chalice);
}

.circle::before {
    width: 3px;
    margin: 7px auto;
    border-radius: 4px;
}

.circle::after {
    margin: auto 7px;
    height: 3px;
    border-radius: 4px;
}

.circle:hover,
.new-address:hover .circle {
    border-color: var(--color-tundora);
}

.circle:hover::before,
.circle:hover::after,
.new-address:hover .circle::before,
.new-address:hover .circle::after {
    background-color: var(--color-tundora);
}

#opc-review .product-name {
    font-weight: bold;
    color: #0a263c;
}

#opc-review .item-options {
    margin: 5px 0 0;
}

#opc-review .buttons-set .please-wait {
    height: 40px;
    line-height: 40px;
}

#opc-review .authentication {
    margin: 0 auto;
    width: 570px;
}

#opc-review .warning-message {
    color: var(--color-mine-shaft-dark);
    font-weight: bold;
    text-align: center;
    padding: 10px 10px 0;
}

.ls-opc-rhs-help {
    margin: 30px 0;
    padding: 10px 25px 25px 25px;
    font-size: 1em;
    line-height: 1.2;
    background-color: var(--color-concrete);
}

.ls-opc-rhs-help li {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-top: 25px;
}

.ls-opc-rhs-help li img {
    width: 100%;
    height: auto;
    object-fit: contain;
    max-width: 40px;
}

.ls-opc-rhs-help li:first-child img {
    max-width: 32px;
}

.ls-opc-rhs-help div {
    padding-left: 25px;
    margin-top: -5px;
}

.ls-opc-rhs-help li:first-child div {
    padding-left: 33px;
}

.ls-opc-rhs-help #scCPPd {
    margin: 0;
    padding: 0;
}

.ls-opc-rhs-help h2 {
    font-size: 0.9em;
    letter-spacing: 0.08em;
    margin: 0;
    font-family: var(--font-text-regular);
}

.ls-opc-rhs-help p,
.ls-opc-rhs-help a {
    font-size: 0.9em;
    letter-spacing: 0.08em;
    line-height: 1.2;
    color: var(--color-ls-default-grey);
}

.ls-opc-rhs-help a {
    color: var(--color-ls-default-grey);
}

.ls-opc-rhs-help li:hover a {
    color: var(--color-main);
}

.cart-empty>p:first-child {
    margin-bottom: 1.19em;
}

/* air datepicker */
#ls-shipping-datepicker .air-datepicker {
    width: auto;
    max-width: 400px;
}

/* END air datepicker */

/* used on checkout -- and elsewhere, need to check this works well */
.form-list,
.field {
    display: flex;
    flex-direction: column;
    margin-bottom: 1em;
}

.form-list .control input[type="radio"],
.form-list .control input[type="checkbox"] {
    margin-right: 7px;
}

.form-list select {
    display: block;
    color: var(--color-tundora);
    line-height: 1.3;
    padding: .6em 1.4em .5em .8em;
    width: fit-content;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0;
    border: 1px solid var(--color-silver-chalice);
    box-shadow: 0 1px 0 1px rgba(0, 0, 0, .04);
    border-radius: .5em;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--color-white);
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
    linear-gradient(to bottom, var(--color-white) 0%, var(--color-mercury-darker) 100%);
    background-repeat: no-repeat, repeat;
    background-position: right .7em top 50%, 0 0;
    background-size: .65em auto, 100%;
}

.form-list select::-ms-expand {
    display: none;
}

.form-list select:hover {
    border-color: var(--color-gray-light);
}

.form-list select:focus {
    border-color: var(--color-silver-chalice);
    box-shadow: 0 0 1px 3px var(--color-blue-opacity);
    box-shadow: 0 0 0 3px -moz-mac-focusring;
    color: var(--color-mine-shaft-dark);
    outline: none;
}

.form-list select option {
    font-weight: normal;
}

.field.choice.billing,
.field.choice.shipping {
    flex-direction: row;
}

.ls-opc-review .field {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-bottom: 2em;
}

.ls-opc-review .fields .field {
    display: block;
}

.ls-opc-review .form-list-review .control {
    display: flex;
    flex-basis: 150px;
    min-width: 150px;
    flex-wrap: wrap;
    max-width: 150px;
    margin-top: 0.4em;
}

.ls-opc-review .form-list-review .control input,
.ls-opc-review .form-list-review .control label {
    cursor: pointer;
}

.ls-opc-review .form-list-review textarea {
    margin: 0.5em 0 1em 0;
    width: 100%;
    height: 60px;
    font-size: 1em;
    padding: 0.5em;
}

.ls-opc-review .control input[type=checkbox],
.ls-opc-review .control input[type=radio] {
    margin: 0;
}

.ls-opc-review .control label {
    min-width: 2.25em;
    text-align: right;
}

.ls-opc-review .fullwidth,
.ls-opc-review .fullwidth li {
    width: 100%;
}

.validation-failed,
input.mage-error {
    border: 1px solid var(--color-alizarin-crimson) !important;
}

input[type='checkbox'].mage-error {
    outline: 1px solid var(--color-alizarin-crimson) !important;
}

.validation-advice,
div.mage-error {
    color: var(--color-alizarin-crimson);
    font-size: 0.7em;
    margin-top: 0px;
    margin-bottom: 10px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    animation: pulse 0.5s 2.5s 4;
}

.input-validation-error input,
.input-validation-error input:hover,
.input-validation-error input:focus {
    border-color: var(--color-alizarin-crimson) !important;
}

.input-validate-error {
    color: var(--color-alizarin-crimson);
}

span.input-validate-error {
    display: block;
}

@keyframes pulse {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.required em {
    font-style: normal;
    margin-left: 3px;
}

/* ----- Checkout field setup ----- */
.form-list label {
    margin: 0 0 3px 0;
    font-size: 1em;
    line-height: 1.2;
    letter-spacing: 0.05em;
    font-family: var(--font-text-regular);
}

.form-list .wide {
    margin-bottom: 0.5em;
}

.form-list input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]),
.form-list textarea {
    background-color: var(--color-concrete);
    border: 1px solid var(--color-ls-default-grey);
    font-size: 1em;
    font-family: inherit;
    padding: 5px;
    margin: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.form-list input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]) {
    width: 220px;
}

.form-list input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]):hover,
.form-list textarea:hover {
    border: 1px solid var(--color-emperor);
}

.form-list input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]):focus,
.form-list textarea:focus {
    border: 1px solid var(--color-lochmara);
}

.form-list li li:focus-within label {
    color: var(--color-main);
}

.opc .buttons-set {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 1em 0;
    flex-wrap: wrap;
}

.opc-textarea {
    width: 100%;
    height: 60px;
    margin: 0.5em 0 1em 0;
    font-size: 1em;
    padding: 10px;
}

.opc-delivery-info {
    margin: 1.5em 0;
}

.opc-delivery-info div {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: 0.5em 0;
}

.opc-delivery-info span {
    width: 200px;
    margin-right: 15px;
}

.lssc-left {
    flex-basis: 50%;
    padding-right: 30px;
}

.lssc-right {
    flex-basis: 50%;
    margin-top: 1.5em;
}

.lssc-right #map_canvas {
    border: none;
    width: 100%;
    min-height: 320px;
    height: auto;
}

.lssc-postcode-holder {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    margin: 1em 0;
}

.lssc-postcode-holder button {
    height: auto;
    min-width: 120px;
    max-width: 120px;
    margin: 0 0 0 15px;
}

.lssc-postcode {
    width: 100% !important;
}

#ls-shipping-collection-list label {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: flex-start;
    margin-bottom: 1em;
}

#ls-shipping-collection-list input {
    margin: 7px 15px 0 0;
}

#ls-shipping-collection-list span {
    line-height: 1.2;
    font-size: 0.9em;
}

.non-pallet .pallet-only {
    display: none;
}

.opc-delivery-leadtimes:not(:empty) {
    margin: 1em 0 2em 0;
}

.opc-delivery-leadtimes h3,
.ls-opc-review h3 {
    font-size: 1.3em;
    margin: 1em 0;
}

.opc-delivery-leadtimes h4 {
    font-size: 1.2em;
    margin: .5em 0;
}

.opc-delivery-leadtimes p {
    font-size: 0.9em;
    margin: 1em 0;
}

.opc-delivery-leadtimes .data-table {
    border-top: 1px solid var(--color-alto-dark);
    margin: 1em 0 2em 0;
}

.opc-delivery-leadtimes td {
    vertical-align: middle;
}

.opc-delivery-leadtimes .data-table .image img {
    margin-right: 8px;
}

.opc-delivery-leadtimes .data-table .product span {
    margin-right: 5px;
}

#lsLeadTimes .data-table .a-right {
    display: none;
}

/* first checkout page */
.guest .ls-checkout__delivery-postcode-note-auth,
body:not(.guest) .ls-checkout__delivery-postcode-note-guest {
    display: none;
}

/* ----- REVIEW ----- */
#checkout-review-table-wrapper {
    display: none;
    /* hide the basket in the review section as it's in the sidebar */
}

#onepage-checkout-shipping-method-additional-load~.message.notice span {
    color: var(--color-alizarin-crimson);
}

/* Success */
.checkout-onepage-success p {
    margin-bottom: 1em;
}

.checkout-onepage-success p a {
    color: inherit;
    text-decoration: underline;
}

/* ------------------------------------------------------------*/
/* ------------- C U S T O M E R   A C C O U N T --------------*/
/* ------------------------------------------------------------*/
.ls-dashboard {
    margin-top: 40px;
}

.customer-account-dashboard .ls-checkout-review-sidebar {
    margin-top: 40px;
}

.ls-account-group {
    margin: 45px -15px 45px -15px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
}

.ls-ag>li {
    margin-bottom: 50px;
    flex-basis: 320px;
    flex-grow: 1;
    padding: 20px;
    border: 1px solid #ededed;
    margin-right: 25px;
    margin-left: 25px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.ls-ag h2 {
    font-size: 1.2em;
    margin-bottom: 1em;
    font-family: var(--font-text-regular);
}

.ls-ag__menu {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
}

.ls-ag__expand {
    width: 100%;
    height: 100%;
}

.ls-ag__menu img {
    width: 40px;
    margin: 10px 25px 0 0;
}

.ls-ag__menu li {
    white-space: nowrap;
}

.ls-ag__menu a,
.ls-ag__menu a:link,
.ls-ag__menu a:visited {
    color: inherit;
}

.ls-ag-credit__holder {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin: 1em -1em 2em -1em;
    text-align: center;
}

.ls-ag-credit__holder .ls-ag-credit__holder {
    margin: 0 1em;
}

.ls-ag-credit__balance,
.ls-ag-credit__limit {
    width: 1.2em;
    height: 1.2em;
    background: #D8D8D8;
    margin: 0.75em 1em 0 0;
    border-radius: 50%;
}

.ls-ag-credit__limit {
    background: var(--color-outer-space);
}

.ls-ag-credit__col div:first-child {
    font-size: 1.8em;
}

.ls-ag-credit__col div:last-child {
    font-size: 0.9em;
    line-height: 1.2;
}

@supports (display: grid) {
    .ls-account-group {
        margin: 45px 0;
        display: grid;
        width: 100%;
        grid-gap: 30px;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);
    }

    .credit-visible .ls-account-group {
        grid-template-columns: repeat(1, 1fr);
    }

    .ls-ag>li {
        margin: 0;
    }

    .ls-ag__twoup {
        grid-column: 1 / 1;
        grid-row: 1 / 3;
    }
}

.doughnutTip {
    position: absolute;
    min-width: 30px;
    max-width: 300px;
    padding: 5px 15px;
    border-radius: 1px;
    background: rgba(0, 0, 0, 0.8);
    color: var(--color-alto-darker);
    font-size: 17px;
    text-shadow: 0 1px 0 var(--color-black);
    text-transform: uppercase;
    text-align: center;
    line-height: 1.3;
    letter-spacing: .06em;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    pointer-events: none;
}

.doughnutTip::after {
    position: absolute;
    left: 50%;
    bottom: -6px;
    content: "";
    height: 0;
    margin: 0 0 0 -6px;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-top: 6px solid rgba(0, 0, 0, 0.7);
    line-height: 0;
}

.doughnutSummary {
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    cursor: default;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.doughnutSummaryTitle {
    font-size: 1.2em;
}

.doughnutSummaryNumber {
    font-size: 1.2em;
}

.donutChart path:hover {
    opacity: 0.65;
}

.donutChart {
    width: 100%;
    height: 100%;
    min-height: 300px;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.title-buttons {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1em;
}

.order-info-boxes {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: wrap;
}

.order-info-col {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    margin-bottom: 2em;
    flex-basis: 300px;
}

.order-info-col dl {
    margin-bottom: 2em;
}

.order-info-col h2 {
    font-size: 1.5em;
}

.order-info-col address {
    line-height: 1.2;
    color: var(--color-ls-default-grey);
}

.order-info-col address::first-line {
    font-weight: bold;
    color: var(--color-main);
}

.order-details {
    margin-top: 2em;
}

.order-details-items.order-history-page {
    margin-top: 2.5em;
}

.order-details h3,
.order-details-items.order-history-page h3 {
    margin: 1.5em 0 1em 0;
    font-size: 1.4em;
}

.order-extras li {
    display: flex;
    flex-direction: column;
}

.order-extras li span:first-child {
    font-weight: bold;
}

.order-extras li span:last-child {
    margin-bottom: 1em;
}

.sales-order-history a {
    color: inherit;
}

.sales-order-history .page-title {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: wrap;
}

.sales-order-history .amount {
    margin-left: 30px;
}

.sales-order-history .data-table,
.orders-recent .data.table {
    width: 100%;
    margin: 1.5em 0;
}

.sales-order-history .data-table tbody tr:nth-child(odd) td,
.orders-recent .data.table tbody tr:nth-child(odd) td {
    background: var(--color-mercury);
}

.sales-order-history .data-table td,
.orders-recent .data.table td {
    vertical-align: middle;
    line-height: 1.2;
    padding: 0.25em 0.25em;
}

.sales-order-history .back-link {
    margin-top: 1.5em;
}

.customer-address-form .wide .input-box {
    width: 320px;
}

.customer-address-form .wide .input-box input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]) {
    width: 100% !important;
}

/* sagepay */
.sp-table {
    margin: 1.5em 0;
    width: 100%;
}

.sp-table td {
    padding: 5px;
}

.sp-table input[type="text"],
#sagepaytoken_cc_nickname {
    width: 100%;
    padding: 2px 5px;
    font: inherit;
    font-size: 1em;
    border: 1px solid var(--color-silver);
}

.sp-table .cart-item {
    border: none;
}

.sagepaysuite-card-index .buttons-set {
    display: none;
}

.sp-buttons-set {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 1em 0;
    flex-wrap: wrap;
}

/* address book */
.customer-address-index .block label {
    font-weight: bold;
}

.customer-address-index .block {
    justify-content: space-between;
}

.ls-ab-disp-block {
    border: 1px solid var(--color-silver);
    padding: 5px;
    background: var(--color-gallery);
    margin-top: 5px;
    margin-bottom: 1em;
}

a.ls-ab-add {
    color: var(--color-ls-default-grey);
    display: flex;
    align-items: center;
    text-decoration: none;
    font-size: 1.1rem;
    font-weight: bold;
}

a.ls-ab-add:hover {
    color: var(--color-main);
}

a.ls-ab-add .samp-circle-plus {
    margin-right: 10px;
}

a.ls-ab-add .samp-circle {
    border-color: var(--color-ls-default-grey);
}

a.ls-ab-add .horizontal,
a.ls-ab-add .vertical {
    background-color: var(--color-ls-default-grey) !important;
}

.form-address-edit .field.telephone.required label span::after,
.form-address-edit .field.street.required>label span::after,
.form-address-edit .field.city.required label span::after,
.form-address-edit .field.zip.required label span::after {
    content: "\002A";
    display: inline-block;
    margin-left: 3px;
}

.form-address-edit .field.telephone.required label span::after {
    margin-left: 0;
}

/* --------------------------------------------------------------- */
/* ------------- O R D E R   H I S T O R Y   P A G E ------------- */
/* --------------------------------------------------------------- */
.sales-order-view .page-title {
    display: none;
}

.order-history-title .title-and-print h1 {
    margin-bottom: 0.45em;
}

.order-history-title h2 {
    font-size: 1.5em;
    margin-bottom: 0.5em;
}

.order-history-info {
    margin-bottom: 4em;
}

.order-history-info .order-information {
    display: block;
}

.order-history-title .title-and-print .rectangle-button {
    margin-bottom: 1.5em !important;
}

/* ------------------------------------------------------------ */
/* ------------ C O N T R A C T O R   S I G N U P ------------- */
/* ------------------------------------------------------------ */
.ls-page__header {
    margin-top: 30px;
    border-bottom: none;
}

.charity-block {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.charity-block div {
    padding: 1em 3em;
}

.charity-block div a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: inherit;
    text-decoration: none;
}

.charity-block img {
    max-height: 110px;
    width: auto;
}

.charity-block div a span {
    margin-top: 1em;
    font-family: var(--font-text-regular);
    letter-spacing: 0.08em;
}

.ls-field-group {
    font-family: var(--font-text-regular);
    margin-bottom: 4em;
}

.ls-field-group h2 {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    border-bottom: 1px solid var(--color-emperor);
    font-family: inherit;
    font-size: 1.4em;
    padding-bottom: 5px;
    margin-bottom: 2em;
    align-items: flex-end;
}

.tradesignup-index-index .grid-100>.ls-field-group:first-child>h2 {
    margin-bottom: 2.5em;
}

.ls-field-group h2 span {
    font-size: 1rem;
    color: var(--color-gray-lighter);
}

.ls-field-group address {
    margin: -1em 0 1.5em 0;
}

.ls-field-group address::first-line {
    font-weight: bold;
}

.ls-field-group .row {
    display: flex;
    flex-direction: row;
    font-family: inherit;
    margin-bottom: 1em;
    margin-right: -15px;
    margin-left: -15px;
}

.ls-field-group .row-simple {
    margin-bottom: 1em;
    font-family: inherit;
}

.ls-field-group .terms {
    color: var(--color-gray-lighter);
    font-size: 0.9em;
    display: flex;
    align-items: flex-start;
}

.ls-field-group .terms label {
    margin-right: 20px;
    flex-basis: 80px;
    min-width: 80px;
    margin-top: 3px;
}

.ls-field-group .terms a {
    color: var(--color-main);
}

.ls-field-group .terms a:hover {
    text-decoration: underline;
}

.ls-field-group label {
    line-height: 1;
}

.ls-field-group label span::before {
    content: '';
    display: block;
    height: 0;
    width: 0;
    margin-top: calc((1 - 1.4) * 0.5em);
}

.submitButton {
    background-color: var(--color-dusty-gray);
    padding: 0.75em 3em;
    text-transform: none;
    margin-top: 3em;
    border: none;
    color: var(--color-white);
}

.submitButton.less-mt {
    margin-top: 0.5em;
}

.no-mb,
.field.no-mb {
    margin-bottom: 0;
}

form.password.forget .actions-toolbar button {
    width: 100%;
}

.ls-field-group .block {
    display: flex;
    flex-direction: column;
    font-family: inherit;
    margin-right: 15px;
    flex-basis: 320px;
}

@supports (display: grid) {
    .ls-field-group .row {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
        grid-column-gap: 2em;
        grid-row-gap: 1em;
        margin: 0 0 1em 0;
    }

    .ls-field-group .block {
        margin-right: 0;
    }

    .col13 {
        grid-column: 1/3;
    }

    .col-expand {
        grid-row: -2;
        /* overridden for smaller screens */
    }

    .back-row {
        grid-row: -1;
    }
}

.ls-field-group label {
    display: flex;
    margin: 0 0 3px 0;
    font-size: 1em;
    line-height: 1.2;
    letter-spacing: 0.08em;
    font-family: inherit;
}

.ls-field-group .block.has-error label {
    color: var(--color-darkred);
}

.ls-field-group input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]),
textarea {
    background-color: var(--color-concrete);
    border: 1px solid #A7A7A7;
    font-size: 1em;
    font-family: inherit;
    padding: 5px;
    margin: 0;
    font-family: inherit;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.ls-field-group input:not([type=checkbox]):not([type=radio]):not([type=button]):not([type=file]):hover,
textarea:hover {
    border: 1px solid var(--color-black);
}

.ls-field-group input:not([type=checkbox]):not([type=radio]):not([type=button]):not([type=file]):focus,
textarea:focus {
    border: 1px solid var(--color-lochmara);
}

.ls-field-group .block:focus-within label,
.form-address-edit div.field:focus-within label {
    color: var(--color-black);
}

.ls-field-group .form-error {
    color: var(--color-darkred);
    font-size: 0.8em;
    font-family: inherit;
}

.helpText {
    margin-bottom: 1em;
    line-height: 1.2;
    font-size: 0.9em;
    color: var(--color-gray-lighter);
}

.helpText strong {
    color: var(--color-main);
}

.block .inpage {
    width: 100%;
    border: 1px solid var(--color-gallery);
    height: 20vw;
    min-height: 180px;
    max-height: 240px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px;
}

.block .inpage img {
    width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.isLSImage {
    margin-top: 1em;
    color: var(--color-ls-default-grey);
    font-size: 0.9em;
}

.isLSImage label {
    margin-top: 1em;
    display: flex;
}

.isLSImage input {
    margin-right: 0.5em;
}

input[type="checkbox"],
input[type="radio"] {
    margin-right: 0.75em;
}

.filenameBlock {
    width: 180px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding: 0 5px 0 0px;
}

.progressBlock {
    width: 180px;
    padding: 0 10px 0 10px;
}

.statusBlock {
    padding: 0 10px 0 10px;
    width: 100px
}

.progressOuter {
    width: 100%;
    height: 10px;
    display: inline-block;
    border: 1px solid #bbb;
    vertical-align: middle;
    border-radius: 3px
}

.progressBar {
    width: 0%;
    height: 10px;
    display: block;
    background: #50b91d;
    border-radius: 2px
}

#advancedSavingImages {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    align-items: center;
}

@supports (display: grid) {
    #advancedSavingImages {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        width: 100%;
        height: 100%;
        grid-gap: 20px;
    }
}

#advancedSavingImages .row {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: stretch;
    height: 180px;
    font-size: 11px;
    margin-bottom: 1em;
    flex-grow: 1;
}

.thumb {
    flex-direction: column;
    flex: 1 0 auto;
    justify-content: center;
}

.thumb img {
    max-height: 120px;
}

#advancedSavingContent p {
    line-height: 1.2;
    font-size: 0.9em;
}

.lds-dual-ring {
    display: inline-block;
    width: 42px;
    height: 42px;
}

.lds-dual-ring:after {
    content: " ";
    display: block;
    width: 26px;
    height: 26px;
    margin: 1px;
    border-radius: 50%;
    border: 5px solid var(--color-nobel-darker);
    border-color: var(--color-nobel-darker) transparent var(--color-nobel-darker) transparent;
    animation: lds-dual-ring 1.2s linear infinite;
}

@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* ------------------------------------------------------------ */
/* -------------------- C M S   P A G E S --------------------- */
/* ------------------------------------------------------------ */
/* ------------------------ HOMEPAGE ------------------------ */
.banner-message {
    margin: 0 auto;
    text-align: center;
    background: var(--color-mine-shaft-darker);
    color: var(--color-white);
    display: flex;
    justify-content: center;
    align-items: center;
    letter-spacing: 0.05em;
    padding: 5px 0;
}

.banner-message__inner {
    max-width: 1600px;
    padding: 0 10px;
    text-align: center;
}

.banner-message__inner a {
    color: var(--color-white);
    text-decoration: underline;
}

.banner-message .ls-simple-close {
    background: transparent;
    border: 0;
    color: inherit;
    opacity: 0.8;
    height: 25px;
    padding: 0;
}

.banner-message .ls-simple-close:hover {
    cursor: pointer;
    opacity: 1;
    background: transparent;
}

.banner-message__nom {
    display: none;
}

.ls-cookie-consent--holder {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 10000;
    background: var(--color-mine-shaft-darker);
    padding: 5px 10px;
}

.ls-cookie-consent--holder div {
    color: var(--color-white);
    letter-spacing: 0.05em;
    font-size: 0.95em;
    margin: 0 auto;
    max-width: 1600px;
    display: flex;
    vertical-align: center;
    justify-content: center;
}

.ls-cookie-consent--holder a {
    font: inherit;
    text-decoration: underline;
    color: inherit;
}

.ls-cookie-consent--holder button {
    color: var(--color-white);
    background: var(--color-mine-shaft-darker);
    border: none;
    margin: 0 5px 0 40px;
    height: auto;
    padding: 4px 12px;
    text-transform: none;
    font-size: 0.8em;
    height: auto;
    align-self: center;
    border-radius: 64px;
    letter-spacing: 0.05em;
}

.ls-cookie-consent--holder button:last-child {
    background-color: #D1D2D4;
    color: var(--color-black);
    margin-left: 0;
    margin-right: 0;
    text-transform: uppercase;
}

.ls-cookie-consent--holder button:hover {
    background-color: #fefefe;
    color: var(--color-black);
}

.cms p+p,
.cms- p+p {
    margin: 1.5em 0;
}

.hp-banner-holder {
    margin-top: -20px;
    margin-bottom: 40px;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    max-height: 530px;
    /* needed for the overflow, below, to work */
    overflow: hidden;
    /* improve loading visualisation b4 js kicks in */

}

.catList-banner-holder,
.fullwidth-banner-holder {
    margin-top: -20px;
    margin-bottom: 40px;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    position: relative;
}

.catList-banner-holder:not(.ls-404) {
    margin-top: -2em;
}

.fwb-marginless,
.fwb-marginless .hp-landscapers-searchbox {
    margin-top: 0;
}

.hp-banner-holder-inner,
.catList-banner-holder-inner,
.fwb-inner {
    width: 100%;
    max-width: 1580px;
    margin: 0 auto;
}

/* homepage banner top */
.hp-banner-top__text {
    position: relative;
    width: 100%;
    max-width: 1580px;
    height: 50px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color-gallery);
}

.hp-banner-top__text li {
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0 0.5em;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-basis: unset;
    gap: 20px;
    font-family: var(--font-text-regular);
    font-size: clamp(12px, 1.4vw, 15px);
    letter-spacing: 0.05em;
    line-height: 1;
    text-align: left;
    color: var(--color-black);
    background-color: var(--color-gallery);
    cursor: pointer;
}

.hp-banner-top__text img.tp {
    max-width: 168px;
    display: block;
    min-height: 18px;
    object-fit: contain;
}

.hp-banner-top__text li {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease;
}

.hp-banner-top__text li.hbp-active {
    opacity: 1;
    visibility: visible;
}

.hp-banner-top__text .hp-banner-top__whatsapp {
    gap: 8px;
}

.hp-banner-top__whatsapp img {
    width: 20px;
}

.hp-banner-top__whatsapp span {
    font-family: var(--font-text-regular);
    font-size: clamp(12px, 1.4vw, 15px);
    line-height: 1;
    letter-spacing: 0.05em;
    color: var(--color-black);
}

/* END homepage banner top */
.hp-banner-holder li {
    position: relative;
}

/* global top banner */
.global-top-banner {
    font-size: 12px;
    line-height: 17px;
    letter-spacing: -0.31px;
    width: 100%;
    height: 36px;
    padding: 8px 5px;
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--color-gallery);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1002;
    display: none;
}

.global-top-banner,
.global-top-banner a {
    color: var(--color-forest-green);
}

.global-top-banner .font-bold {
    font-weight: 700;
}

.global-top-banner .uppercase {
    text-transform: uppercase;
}

.global-top-banner .top-banner>div {
    display: flex;
    justify-content: center;
    align-items: center;
}

.global-top-banner .top-banner-icon {
    margin-right: 1.23em;
}

.global-top-banner .top-banner-icon img {
    display: block;
}

/* END homepage top banner */

.hp-banner-graphic {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: 2.2rem;
}

.hp-banner-guarantee {
    position: absolute;
    left: 2%;
    bottom: 5%;
    width: 20%;
    height: 30%;
    z-index: 99;
    cursor: pointer;
}

.hp-banner-graphic img {
    max-width: 100%;
    height: auto;
}

.hp-banner-text {
    display: flex;
    flex-direction: column;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
}

.hp-banner-text h2 {
    line-height: 1.4;
    font-size: 32px;
    font-size: clamp(24px, 5.75vw, 59px);
    letter-spacing: 0.15em;
    text-transform: uppercase;
    text-align: center;
    font-family: var(--font-text-medium);
    margin-bottom: 0.75em;
}

.hp-banner-text span.shop-now {
    display: flex;
    align-items: center;
    font-size: clamp(16px, 3vw, 24px);
    letter-spacing: 0.02em;
    color: var(--color-black);
    background-color: var(--color-white);
    border-radius: 40px;
    justify-content: center;
    padding: 0.25em 1.5em;
}

.hp-banner-trade__sample-box__nmh {
    max-height: unset
}

.hp-banner-trade__sample-box {
    display: flex;
    margin: 100px 40px 50px 40px;
}

.hp-banner-trade__sample-box img {
    width: 100%;
    height: auto;
    object-fit: contain;
    max-width: 700px;
    border-radius: 12px
}

.hp-banner-trade__sample-box__left {
    flex-basis: 50%;
    flex-grow: 1;
    margin-right: 10px;
    position: relative;
    text-align: left
}

.hp-banner-trade__sample-box__right {
    flex-basis: 50%;
    flex-grow: 1;
    margin-left: 10px;
    position: relative;
    text-align: right
}

.hp-oct20-grid-header {
    color: var(--color-mine-shaft);
    margin: 1em 0;
    text-align: center;
    text-transform: uppercase;
    font-size: clamp(25px, 4.5vw, 30px);
    letter-spacing: 0.211em;
    line-height: 30px;
    padding: 0 30px;
}

.hp-oct20-grid-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

@supports (display: grid) {
    .hp-oct20-grid-container {
        display: grid;
        grid-gap: 20px;
        margin: 20px 20px 0 20px;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    }
}

.hp-oct20-grid-container li {
    position: relative;
    cursor: pointer;
    transition: all;
}

.hp-oct20-grid-container--inner {
    overflow: hidden;
    height: 0;
    padding-top: 56.25%;
    position: relative;
    border-radius: 5px;
    transition: all 0.2s ease-in-out;
}

.hp-mar21-newfor .hp-oct20-grid-container--inner {
    padding-top: 50%;
    min-height: 235px;
}

.hp-oct20-grid-container li:hover .hp-oct20-grid-container--inner,
.hp-oct20-grid-container li:active .hp-oct20-grid-container--inner {
    background-color: var(--color-silver-dark);
}

.hp-oct20-grid-container--inner img {
    position: absolute;
    object-fit: cover;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    mix-blend-mode: multiply;
}

.hp-oct20-grid-container--inner .hp-oct20-grid-container--text img {
    max-width: 180px;
    position: static;
    width: auto;
    height: auto;
    mix-blend-mode: normal;
}

.hp-oct20-grid-container--text {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 15px 0;
}

.hp-oct20-grid-container--text h2 {
    font-family: var(--font-text-regular);
    text-transform: uppercase;
    text-align: center;
    color: var(--color-white);
    letter-spacing: 4.5px;
    font-size: 27px;
    font-size: clamp(25px, 1rem + 3.333vw, 30px);
    line-height: 1.5;
    margin: 0 100px;
}

.hp-oct20-grid-container--text>span {
    font-size: 0.75em;
    line-height: 1.75em;
    letter-spacing: 4.8px;
    color: var(--color-white);
    text-transform: uppercase;
    display: block;
}

/* spacing change 02.05.2023 */
#shop_by_department,
.what-is-new {
    margin-bottom: 4.68em !important;
}

.hp-mar21-newfor {
    margin-bottom: 8.68em !important;
}

/* shop by department section change 28.04.2023 */
@media (min-width: 660px) and (max-width: 999px) {
    #shop_by_department>li:last-of-type {
        grid-column: span 2;
    }

    #shop_by_department>li:last-of-type .hp-oct20-grid-container--inner {
        max-width: 50%;
        margin-left: auto;
        margin-right: auto;
        padding-top: 28.125%;
    }

    /* what is new section */
    .hp-oct20-grid-container.what-is-new .hp-oct20-grid-container--inner {
        padding-top: 85.25%;
    }
}

@media (min-width: 1200px) and (max-width: 1259px) {
    #shop_by_department>li:last-of-type {
        grid-column: span 2;
    }

    #shop_by_department>li:last-of-type .hp-oct20-grid-container--inner {
        max-width: 50%;
        margin-left: auto;
        margin-right: auto;
        padding-top: 28.125%;
    }
}

/* what is new section */
.what-is-new p {
    font-size: 1em;
    line-height: 1.31em;
    letter-spacing: 0.8px;
    color: var(--color-white);
    text-align: center;
    margin-top: 1em;
    padding-left: 5px;
    padding-right: 5px;
}

.hp-oct20-grid-container.what-is-new .what-is-new--porcelain-paving h2 {
    font-family: var(--font-text-regular);
    font-size: clamp(25px, 2.5vw, 30px);
    line-height: clamp(35px, 2.5vw, 45px);
    letter-spacing: 3.75px;
}

.hp-oct20-grid-container.what-is-new .what-is-new--porcelain-paving p {
    max-width: 658px;
    margin-left: 0;
    margin-right: 0;
    font-family: var(--font-text-regular);
    font-size: 16px;
    line-height: 21px;
    letter-spacing: 0;
}

/* homepage discount 29.06.2021 */
.hp-oct20-grid-container:not(.hp-mar21-newfor) .hp-oct20-grid-container--text h2 {
    margin: 0 clamp(40px, 5vw, 100px);
}

.hp-mar21-newfor .hp-oct20-grid-container--text h2 {
    margin: 0 20px;
}

.hp-oct20-grid-container--text button {
    margin: 30px 0 0 0;
    border: none;
    text-transform: none;
    color: var(--color-black);
    background-color: var(--color-white);
    border-radius: 32px;
    padding: 5px 10px;
    height: 30px
}

.hp-oct20-grid-container--text a {
    color: inherit;
    font-family: inherit;
}

.hp-ju20-specials {
    margin: 0 0 30px 0;
    background: var(--color-gallery);
    padding: 20px;
    color: var(--color-black);
}

.hp-ju20-specials .hp-carousel .carousel {
    display: flex;
}

.hp-ju20-specials .hp-carousel .boxLink {
    position: absolute !important;
}

.hp-ju20-specials .hp-carousel-block {
    display: flex;
    height: 100%;
    justify-content: stretch;
    flex-direction: column;
    position: relative;
}

.hp-ju20-specials .hp-carousel-block img {
    height: auto;
    display: block;
    width: 100%;
    border-radius: 5px;
}

.hp-cb-img--holder {
    width: 100%;
}

.hp-cb-text--holder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    line-height: 1.2;
    margin-top: 1em;
}

.hp-ju20-specials .hp-carousel-name {
    font-size: 16px;
    color: var(--color-black);
    font-family: inherit;
}

.hp-ju20-specials .hp-carousel-price {
    color: var(--color-black);
    font-family: inherit;
    font-size: 16px;
    margin-top: auto;
}

.hp-ju20-specials .ls-price-prefix-hp {
    font-size: inherit;
    color: inherit;
}

.hpcb-ig-image {
    height: 115px;
    background-position: center center;
    background-size: cover;
}

.hp-ju20-showrooms--holder {
    display: flex;
    flex-direction: column;
    margin-top: 30px;
}

.hp-ju20-showrooms {
    position: relative;
    overflow: hidden;
    transition: all 0.2s ease-in-out;
}

.hp-ju20-showrooms:hover {
    background-color: var(--color-silver-dark);
}

.hp-ju20-showrooms p {
    display: none;
}

.hp-ju20-showrooms div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    color: var(--color-white);
    padding: 10px;
    text-transform: uppercase;
    flex-direction: column;
    text-align: center;
}

.hp-ju20-showrooms img {
    width: 100%;
    height: 100%;
    mix-blend-mode: multiply;
    object-fit: cover;
}

.hp-ju20-showrooms a.boxLink {
    z-index: 3
}

.hp-ju20-showrooms h3,
.hp-ju20-showrooms p {
    font-size: 25px;
    font-size: clamp(25px, 2.5vw, 30px);
    font-family: var(--font-text-regular);
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    letter-spacing: 5px;
}

.hp-ju20-showrooms p {
    margin-top: 2em;
}

.hp-ju20-videos {
    display: none;
    margin-top: 50px;
    flex-direction: column;
    padding: 10px;
    flex: auto;
}

.hp-ju20-videos h2 {
    text-transform: uppercase;
    margin: 0 0 1em 0;
    font-size: 30px;
    letter-spacing: 9px;
    color: var(--color-black);
    line-height: 1;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.hp-ju20-videos h2 a:first-child {
    color: inherit;
}

.hp-ju20-videos h2 a:last-child {
    font-size: 16px;
    letter-spacing: 0.8px;
    text-transform: none;
    text-decoration: underline;
    color: var(--color-dodger-blue);
}

.hp-ju20-videos ul {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
}

.hp-ju20-videos li {
    position: relative;
    display: flex;
    margin-bottom: 1em;
    height: 120px
}

.hp-ju20-videos li:last-child {
    margin-bottom: 0
}

.hp-ju20-videos--img-holder {
    position: relative;
    width: 100%;
}

.hp-ju20-videos--img-holder img {
    position: absolute;
    top: 0;
    left: 0;
    object-fit: contain;
    width: 100%;
    height: 100%;
    object-position: left;
}

.hp-ju20-videos--txt-holder {
    color: var(--color-black);
    line-height: 1.0;
    display: flex;
    flex-direction: column;
    border: 1px solid #707070;
    padding: 5px 15px;
    margin: 20px 0 20px 190px;
    background-color: var(--color-white);
    height: calc(100% - 42px);
    justify-content: space-around;
    position: relative;
    z-index: 2;
}

.hp-ju20-videos span {
    letter-spacing: 2.5px;
    font-size: 25px;
    text-transform: uppercase;
}

.hp-ju20-videos__mobile-only {
    margin: 2em 0;
    width: 100%;
    padding-left: 20px;
}

.hp-ju20-videos__mobile-only h2.hp-oct20-grid-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
}

.hp-ju20-videos__mobile-only h2.hp-oct20-grid-header a {
    color: var(--color-dodger-blue);
    font-size: 16px;
    text-transform: none;
    text-decoration: underline;
    white-space: nowrap;
    letter-spacing: 0.8px;
}

.hp-ju20-videos__mobile-only .carousel {
    display: flex;
    gap: 20px;
    overflow-x: scroll;
    max-height: 340px;
}

.hp-ju20-videos__mobile-only img {
    width: 100%;
    object-fit: contain;
}

/* why use a professional designer/landscaper pages only */
.cms-why-use,
.cms-why-use- {
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    align-items: center;
}

.cms-why-use a,
.cms-why-use- a {
    color: inherit;
}

.cms-why-use__photoCol,
.cms-why-use__photoCol- {
    display: flex;
    max-width: 320px;
    min-width: 200px;
}

.cms-why-use__photoCol h2,
.cms-why-use__photoCol- h2 {
    font-size: 1.4em;
    margin: 1em 0;
    text-align: center;
}

.cms-why-use__photoCol .ls-socialSharing-holder ul,
.cms-why-use__photoCol- .ls-socialSharing-holder ul {
    justify-content: center
}

.cms-why-use__photoCol .ls-socialSharing-holder li,
.cms-why-use__photoCol- .ls-socialSharing-holder li {
    height: 24px;
    width: 24px
}

.cms-why-use__photoCol .ls-socialSharing-holder img,
.cms-why-use__photoCol- .ls-socialSharing-holder img {
    height: 16px;
    width: 16px
}

.cms-why-use__photoCol__photo,
.cms-why-use__photoCol__photo- {
    display: flex;
    justify-content: center
}

.cms-why-use__nom,
.cms-why-use__nom- {
    display: none;
}

.cms-why-use__contentCol h3,
.cms-why-use__contentCol- h3 {
    margin: 1.5em 0;
    font-size: 1.2em;
    font-weight: bold;
}

.cms-why-use__contentCol p,
.cms-why-use__contentCol- p {
    margin: 1.5em 0;
    font-size: 1em
}

.cms-why-use__contentCol p a,
.cms-why-use__contentCol- p a {
    color: inherit;
    text-decoration: underline;
    font-weight: bold;
}

.cms-why-use__contentCol>p:first-child,
.cms-why-use__contentCol->p:first-child {
    font-size: 1.2em;
    margin-top: 0
}

.cms-why-use__contentCol p img,
.cms-why-use__contentCol- p img {
    margin-top: 8px
}

.cms-why-use__fifty,
.cms-why-use__fifty- {
    display: flex;
    flex-direction: column;
}

.cms-why-use__fifty div,
.cms-why-use__fifty- div {
    flex-basis: 50%;
}

.cms-why-use__fifty div:first-child,
.cms-why-use__fifty- div:first-child {
    margin-right: 30px
}

.pullquote {
    font-style: italic;
    font-size: 1.2em;
    display: flex;
    align-items: flex-start
}

.pullquote p {
    margin: 0 0 1em 0;
    font-size: 1.2em
}

.pullquote .sig {
    color: var(--color-dusty-gray);
    font-style: normal;
    font-size: 1.2em
}

.pullquote img {
    max-height: 56px;
    margin-right: 30px;
    width: auto;
    margin-top: 8px
}

.cms-why-use__footer,
.cms-why-use__footer- {
    display: flex;
    width: 100%;
    flex-direction: column;
}

.cms-why-use__logo,
.cms-why-use__logo- {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px;
    border: 1px solid var(--color-silver);
    width: 100%;
    max-width: 320px;
    margin-bottom: 30px
}

/* T&Cs April 2021 */
.nested-ordered-list ol {
    list-style: none;
    list-style-type: none;
    counter-reset: list;
    padding: 0;
}

.nested-ordered-list ol li {
    list-style-type: unset;
    margin-left: 0;
    margin-bottom: 0;
}

.nested-ordered-list ol li {
    margin-top: 0.5em;
}

.nested-ordered-list>ol>li+li {
    margin-top: 2.5em;
}

.nested-ordered-list ol li::before {
    font-family: var(--font-text-regular);
    font-size: 1em;
    counter-increment: list;
    content: counters(list, ".") " ";
}

.nested-ordered-list>ol>li::before {
    font-size: 1.3em;
    content: counters(list, ".") ". ";
}

.nested-ordered-list ol li ol li {
    margin-left: 1.2em;
}

.nested-ordered-list ol li span,
.nested-ordered-list ol li p {
    display: block;
}

.nested-ordered-list ol li p {
    margin: 0;
}

.nested-ordered-list ol li ol li span,
.nested-ordered-list ol li ol li p {
    margin-left: -1em;
}

ol.list-style-roman,
ol.list-style-alpha {
    counter-reset: revert;
}

ol.list-style-roman {
    list-style-type: lower-roman;
}

.nested-ordered-list ol li ol.list-style-roman li,
.nested-ordered-list ol li ol.list-style-alpha li {
    margin-left: 2.2em;
}

ol.list-style-roman li::before,
ol.list-style-alpha li::before {
    display: none;
}

ol.list-style-alpha {
    list-style-type: lower-alpha;
}

.nested-ordered-list ol h2,
.nested-ordered-list ol h3,
.nested-ordered-list ol h4,
.nested-ordered-list ol h5,
.nested-ordered-list ol h6 {
    display: inline;
    margin-bottom: 0;
}

.nested-ordered-list ol h2~ol,
.nested-ordered-list ol h2~span,
.nested-ordered-list ol h2~p {
    margin-top: 1.2em;
}

/* --------------------- hp carousels --------------------- */
/* try to set an initial state for them, with no js running that displays okay: how to remove on carousel fire.... */
.swiper:not(.swiper-initialized) .carousel {
    overflow-x: scroll;
    display: flex;
}

.swiper:not(.swiper-initialized) .carousel li {
    margin-right: 20px;
}

.hp-section {
    margin-bottom: 3em;
    border-bottom: 1px solid var(--color-seashell);
    padding-bottom: 3em;
    position: relative;
    overflow: hidden;
}

.hp-carousel-name {
    font-size: 1.2em;
    letter-spacing: 0.04em;
    margin-bottom: 1em;
}

.hp-carousel-rrp {
    display: none;
    /* hidden unless customer group == trade */
}

.trade .hp-carousel-rrp {
    font-size: 0.9em;
    color: var(--color-dusty-gray);
    margin-top: 0.25em;
    display: block;
}

.hp-carousel-rrp span {
    position: relative;
}

.hp-carousel-rrp>span::after {
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 100%;
    content: '';
    height: 1px;
    background: rgba(153, 153, 153, 0.75);
    mix-blend-mode: multiply;
}

.hp-carousel-price {
    font-family: var(--font-text-medium);
    margin-top: 0.25em;
}

.hp-carousel-block {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
}

.hp-carousel-block img {
    max-width: 100%;
    height: auto;
    display: block;
    margin-bottom: 12px;
    object-fit: contain;
}

.hp-carousel-block .hpcb-ig-image,
.hp-carousel-block a,
.hp-carousel-block a:link,
.hp-carousel-block a:visited,
.hp-vertical-carousel a,
.hp-vertical-carousel a:link,
.hp-vertical-carousel a:visited {
    display: flex;
    flex-direction: column;
    text-align: center;
    color: var(--color-main);
    line-height: 1.2;
    width: 100%;
    position: relative;
}

.hpcb-ig-image img {
    object-fit: cover;
    height: 100%;
    max-height: 100%;
}

.product-carousel {
    margin: 0 0 0 20px;
}

.product-carousel__block,
.product-carousel__info {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.product-carousel__image-holder {
    background: #f7f7f7;
    border-radius: 5px;
}

.product-carousel__image-holder img {
    max-height: 150px;
    max-width: 100%;
    object-fit: cover;
    border-radius: 5px;
    mix-blend-mode: multiply;
    min-height: 150px;
}

.product-carousel__text {
    font-size: 17px;
    font-size: clamp(13px, 1.15vw, 19px);
    line-height: 1.2;
    letter-spacing: 0.06em;
    color: var(--color-black);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 1em;
}

.product-carousel__text+.ls-grid-price,
.product-carousel__text+.ls-grid-price-wrapper .ls-grid-price,
.product-carousel__text+.ls-grid-price-wrapper-sale .ls-grid-price {
    color: #525050;
    font-size: 15px;
    font-size: clamp(12px, 1.5vw, 16px);
    letter-spacing: 0.42px;
    line-height: 21px;
    white-space: normal;
    margin: 1.5em 0 0;
}

.product-carousel__text+.ls-grid-price-wrapper-sale {
    margin-top: 1.5em;
}

.product-carousel__text+.ls-grid-price-wrapper-sale .ls-grid-price {
    margin-top: 0;
    margin-bottom: 5px;
}

.product-carousel__text+.ls-grid-price-wrapper-sale .ls-grid-price.from-final-price {
    color: var(--color-totem-pole);
}

.product-carousel__text a {
    color: inherit;
}

/* ----- latest (sept 2019) homepage specials ----- */
.hp_section-header {
    font-size: 1.5em;
    margin: 1em 0 1em 10px;
    letter-spacing: 0.02em;
    font-family: var(--font-text-medium);
    text-align: center;
}

.hp_section-header span {
    font: inherit;
}

/* September 2018 New 'feature' boxes, used on homepage and ... currently nowhere else... */
.feature-boxes {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
    margin: -1em -1em 0 -1em;
}

.image-boxes {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin: 0 -1em;
}

.image-box {
    margin: 0 1em;
    position: relative;
}

.image-box img {
    max-width: 100%;
    width: auto;
    height: auto;
}

.feature-box {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    flex-basis: 354px;
    flex-grow: 1;
    min-height: 180px;
    margin: 1em 1em 0 1em;
    padding: 30px 10px;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    color: var(--color-white);
    text-align: center;
}

.fb-popular .feature-box {
    min-height: 300px;
    padding: 30px 10px;
    background-color: #4b4b4b66;
    background-blend-mode: soft-light;
}

.fb-noSidePad {
    padding-left: 0;
    padding-right: 0;
}

/* used inside a feature box when 2 are in a column */
.feature-sub-box {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    padding: 20px;
    margin-bottom: 1em;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    width: 100%;
}

.fb-fullwidth {
    margin: 0;
}

.hp_feature_box_offset {
    padding-left: 30%;
    /* overide / lower this for mobiles */
}

.feature-box h2,
.feature-box h1 {
    line-height: 1.2;
    color: inherit;
    margin: 0.5em 0 1em 0;
    font-size: 2.75em;
    letter-spacing: 0.08em;
    font-family: var(--font-text-medium);
}

.feature-box h2+h3,
.feature-box h1+h3 {
    margin-top: -1.0em;
    margin-bottom: 1.5em;
    font-size: 1.8em;
    font-style: italic;
    letter-spacing: 0.08em;
    line-height: 1.2;
}

.feature-box img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.feature-box p,
.hp-banner-text p {
    color: inherit;
    letter-spacing: 0.16em;
    font-size: 1.2em;
}

.feature-box p+p {
    margin-top: 1.0em;
}

.feature-box p {
    letter-spacing: 0.06em;
    font-size: 1.5em;
}

.feature-box p span {
    font-size: 0.75em;
}

.fb-landscaping,
.fb-showrooms {
    padding: 15px 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 240px;
    position: relative;
}

.fb-showrooms {
    flex-direction: column;
    margin-top: 2.5em !important;
    min-height: 320px;
    background-position: center center;
    margin-bottom: 4em;
}

.fb-landscaping {
    padding: 30px 15px;
}

.fb-landscaping h2,
.fb-showrooms h2 {
    color: var(--color-white);
    font-size: 2em;
    letter-spacing: 0.05em;
    text-align: center;
    line-height: 1.1;
}

.fb-landscaping h2 {
    margin: 0;
    max-width: 720px;
}

/* hp join ls scheme bordered box */
.fb-ls-join {
    padding: 25px 30px;
}

.panel-wrapper {
    overflow: hidden;
    height: 100%;
    display: flex;
    width: 100%;
}

.panel {
    border: 1px solid var(--color-white);
    border-top: 0;
    border-bottom: 0;
    padding: 13px;
    margin: 13px 0 11px 0;
    width: 100%;
}

.panel-header,
.panel-footer {
    position: relative;
    top: -30px;
    padding-left: 1em;
    padding-right: 1em;
    font-size: 1.3rem;
    height: 32px;
    display: inline-block;
    vertical-align: middle;
}

.panel-footer-holder {
    position: absolute;
    bottom: 20px;
    height: 32px;
    width: 100%;
    left: 0;
    padding: 0 30px;
}

.panel-footer-inner {
    overflow: hidden;
}

.panel-footer {
    bottom: 0;
    top: auto;
}

.panel-header::before,
.panel-header::after,
.panel-footer::before,
.panel-footer::after {
    content: "";
    position: absolute;
    height: 1px;
    background: var(--color-white);
    top: 50%;
}

.panel-header::before,
.panel-footer::before {
    width: 300px;
    left: -300px;
}

.panel-header::after,
.panel-footer::after {
    width: 300px;
    right: -300px;
}

.panel-content {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    margin: 0;
    margin-top: -32px;
    font-size: 2.75em !important;
}

/* ------- */
.hp_fb_mood {
    flex-basis: 700px;
    padding: 0;
    min-height: 0;
}

/* used for 2019 millboard and designboard sequential images and text, smaller grey text and logos... */
.fb-sequential-grey p {
    color: var(--color-main);
}

.fb-sequential-grey p span {
    color: var(--color-dusty-gray-darker);
}

.fb-logo-container {
    margin: 1.5em 0;
}

.fb-logo-container img {
    max-width: 300px;
    min-width: 200px;
    width: 100%;
}

.feature-box:first-child .fb-logo-container img {
    max-width: 400px;
}

/* on homepage, show/hide appropriate box simulated prices for retail and trade -- the prices are written in the cms static block... */
.fb-price-trade {
    display: none;
}

.trade .fb-price-trade {
    display: block;
}

.trade .fb-price-retail {
    display: none;
}

/* be able to only show promos, etc for trade */
.trade-only {
    display: none;
}

.trade .trade-only {
    display: unset;
}

.trade .retail-only {
    display: none;
}

.feature_box_boxed {
    border: 1px solid var(--color-gallery);
    margin: 30px 0;
}

.feature_box_boxed h2 {
    text-align: center;
    margin: 0;
    padding: 0 15px;
    font-size: 1.05em;
    color: var(--color-ls-default-grey);
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.feature_box_boxed h2:first-child {
    margin-top: -15px
}

.feature_box_boxed h2:last-child {
    margin-bottom: -15px
}

.feature_box_boxed h2 span {
    display: flex;
    align-items: center;
    background: var(--color-white);
    min-height: 30px;
    /* using min height allows the box to grow for smaller screen sizes... */
    padding: 0 15px;
    margin: 0 auto;
    font-family: inherit;
}

.feature_box_boxed h2 img {
    height: 100%;
    width: auto;
}

.feature_box_boxed-inner {
    padding: 5px;
    position: relative
}

.fbb-brochure {
    margin-left: 1em;
    margin-right: 1em;
    min-width: 280px;
}

.fbb-brochure h2 {
    font-size: 1.3em;
    color: inherit;
}

.feature_box_centre {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.hp_feature_landscaping {
    padding-right: 0;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
}

.hp_fl_monthly {
    flex-basis: auto;
    min-height: 300px;
}

.hp_fl_monthly h2 {
    margin: 0;
    line-height: 1.2;
}

.hp_fl_monthly.feature-box p {
    text-transform: none;
    max-width: 800px
}

.hp_fl_yardsale {
    margin: 5em 0 2.5em 0;
    flex-basis: 20%;
    min-width: 240px;
    padding-bottom: calc(20% - 38px);
    position: relative;
    z-index: 1;
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: var(--color-white);
    max-width: 400px;
    min-height: 200px;
}

.hp_fl_yardsale::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url("/pub/media/home/11_Yard_Sale.png");
    mix-blend-mode: multiply;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: scale(1.3);
}

.hp_fl_blog {
    justify-content: center;
    position: relative;
    flex-basis: 200px;
}

.hp_fl_blog h2 {
    font-size: 3rem;
    text-align: center;
}

a.boxLink {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 6;
    /* makes whole parent box clickable when <a></a> at start of box. req parent pos:relative */
}

.round-button,
a.round-button {
    background: var(--color-emperor);
    padding: 0.25em 1em;
    text-align: center;
    border-radius: 2em;
    color: var(--color-white);
    font-size: 1.2rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-family: var(--font-text-regular);
}

.round-button:hover,
.feature-box:hover .round-button {
    background: var(--color-cod-gray);
}

/* inverse colour scheme, dark text on white bg */
.rb-inverse,
a.rb-inverse {
    color: var(--color-main);
    background: var(--color-white);
}

.rb-inverse:hover,
.feature-box:hover .rb-inverse {
    color: var(--color-black);
    background: var(--color-seashell);
}

.rb-marginT {
    margin-top: 1em;
}

.rb-bordered {
    border: 1px solid var(--color-dusty-gray-darker);
}

.hp_section {
    margin-top: 1em;
    position: relative;
}

/* --------------------- landscapers search -- now on landscapers homepage --------------------- */
.std .catList-banner-holder {
    margin-top: -45px;
}

.hp-landscapers-searchbox {
    width: 100%;
    min-height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    font-size: 1em;
    background: url("/pub/media/skin/chrome/Contractor-Search-Background.jpg") no-repeat center center #759081;
    background-size: cover;
    color: var(--color-white);
    padding: 30px 10px 50px 10px;
    margin: 2em 0;
}

.hplsb-inner {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    justify-content: center;
    max-width: 900px;
}

.hplsb-heading {
    font-size: 2em;
}

.hp-landscapers-searchbox p {
    font-size: 1.2em;
    text-align: center;
}

.hplsb-roundal {
    display: flex;
    margin-top: 20px;
    padding: 0 1px 0 10px;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background: var(--color-white);
    border-radius: 32px;
    height: 33px;
    width: 90%;
}

.hplsb-roundal button {
    border-radius: 16px !important
}

.hp-lsb .hplsb-roundal input[type="text"] {
    width: 100%;
    height: 2em;
}

.hplsb-radios {
    width: 90%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: baseline;
    margin-top: 1.5em;
    margin-bottom: -1em;
}

.hplsb-radios div {
    line-height: 1;
    flex-basis: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.hplsb-radios label {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.hp-sl h2 {
    color: var(--color-white);
    font-size: 1.6em;
    line-height: 1;
    text-align: center;
}

.hp-sl-search-holder {
    display: flex;
    margin-top: 20px;
    padding: 0 4px 0 10px;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background: var(--color-white);
    border-radius: 32px;
    height: 33px;
    width: 100%;
}

.hp-sl input,
.hp-lsb input[type="text"] {
    padding: 2px 3px;
    font-size: 0.8em;
    background: var(--color-white);
    border: none;
    height: 1.2em;
}

.hp-sl button,
.hp-lsb button {
    background: var(--color-mine-shaft-darker);
    font-size: 0.8em;
    color: var(--color-white);
    text-align: center;
    letter-spacing: 0.05em;
    margin: 0;
    border: none !important;
    border-radius: 16px;
    padding: 6px 15px;
    text-transform: none
}

.hp-sl button:hover {
    background-color: var(--color-cod-gray);
}

.hp-lsb input[type="text"] {
    width: auto;
}

.hp-lsb button {
    background-color: var(--color-stromboli);
    margin-right: 4px;
}

.hp-lsb button:hover {
    background-color: var(--color-stromboli)
}

.cms-landscape-specialists h1,
.cms-landscape-specialists- h1,
.cms-delivery-tracking h1,
.cms-delivery-tracking- h1,
.cms-cookie-policy h1,
.cms-cookie-policy- h1,
.cms-heading h1,
.cms-heading- h1 {
    font-size: 2em;
    line-height: 1.2;
    margin: 0.5em 0 2em 0;
    text-align: center;
}

#tracking-widget {
    width: 100%;
}

.std .cms-landscape-specialists .grid-100>p,
.std .cms-landscape-specialists- .grid-100>p,
.cms-heading p,
.cms-heading- p {
    text-align: center;
    margin: 1.75em auto;
    font-size: 1.2em;
}

/* landscape specialist trade homepage */
.lss-free-profile {
    display: flex;
    flex-direction: column;
}

.lss-fp-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
    padding: 20px;
    margin-left: auto;
}

.lss-fp-content img {
    max-height: 80px;
}

.lss-fp-content h2 {
    font-size: 1.4em;
    margin: 1em 0
}

.lss-fp-content p {
    font-size: 1.1em;
    margin: 0.85em 0 2em 0
}

.lss-fp-content a {
    color: inherit;
    text-decoration: underline
}

.lss-pack {
    display: flex;
    flex-direction: column;
}

.lss-pack-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.lss-pack-left img {
    max-height: 80px;
}

.lss-pack-left .lss-pack-logos {
    max-height: 100%;
    margin-top: 1em;
}

.lss-pack-right {
    display: flex;
    align-items: center;
    padding: 30px;
}

.lss-previews {
    color: var(--color-white);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px 5px;
}

.lss-previews img {
    max-height: 60px;
}

.lss-previews h2 {
    font-size: 1.4em;
    margin: 1em 0;
    width: 50vw;
    max-width: 420px;
    min-width: 300px;
    text-align: center;
}

.std .lss-previews p {
    margin: 0 auto;
    line-height: 1.6;
    width: 50vw;
    max-width: 420px;
    min-width: 300px;
    font-size: 1.2em;
    font-weight: bold;
}

.lss-charity {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    align-items: center;
    padding: 0 80px;
}

.lss-charity img {
    max-height: 80px;
    width: auto;
}

.std .lss-charity p {
    margin: 40px;
}

.lss-charity a {
    color: inherit;
    text-decoration: underline
}

.cms-delivery-tracking h2,
.cms-delivery-tracking- h2,
.cms-cookie-policy h2,
.cms-cookie-policy- h2 {
    font-size: 1.4em;
    border-bottom: 1px solid;
    margin-bottom: 1.75em;
    margin-top: -1em;
    padding-bottom: 5px;
}

.cms-cookie-policy h2,
.cms-cookie-policy- h2 {
    margin-top: 2em;
}

.cms-delivery-tracking .std p,
.cms-delivery-tracking- .std p,
.cms-cookie-policy .std p,
.cms-cookie-policy- .std p {
    margin: 1.5em auto;
}

.ruled-image-block {
    margin-top: 2em;
    border-top: 1px solid var(--color-seashell);
    padding-top: 2em;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.ruled-image-block__container {
    margin: 0 2em;
    flex-basis: 33%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.ruled-image-block img {
    width: 100%;
    height: auto;
}

.ruled-image-block h3 {
    font-size: 1.6em;
    margin: 1em 0;
}

.ruled-image-block p {
    font-size: 1em;
    margin: 1em 0;
    text-align: left
}

.ruled-image-block__text {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

/* --------------------- homepage full-width boxes --------------------- */
.ls-hp-spec-connect,
.ls-hp-spec-become {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: var(--color-silver);
    background: url("/pub/media/skin/chrome/Contractor-Search-Background.jpg") no-repeat center center;
    background-size: cover;
    width: 100%;
    color: var(--color-white);
    padding: 15px;
    line-height: 1.2;
    text-align: center;
    font-size: 1.6em;
}

.ls-hp-spec-connect {
    margin-bottom: 1em;
}

.ls-hp-spec-connect .ls-connect-button {
    margin-top: 1em;
    width: auto;
}

.ls-hp-spec-become {
    background-image: url("/pub/media/skin/hp/landscape-specialist-bg.jpg");
}

.ls-hp-spec-connect a,
.ls-hp-spec-become a {
    color: inherit;
    display: block;
    max-width: 380px;
    margin: 0;
}

.ls-hp-spec-become a {
    margin-top: 1em;
}

.ls-hp-ethics,
.ls-hp-ethics-w {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    background-color: var(--color-silver);
    background: url("/pub/media/skin/hp/ethics-bg.jpg") no-repeat right center;
    background-size: cover;
    height: 200px;
    width: 100%;
    color: var(--color-black);
    padding: 15px;
    line-height: 1.2;
    text-align: left;
    font-size: 1em;
}

.ls-hp-ethics a,
.ls-hp-ethics-w a {
    color: inherit;
    display: block;
    max-width: 380px;
}

.ls-hp-ethics p,
.ls-hp-ethics a {
    max-width: 250px;
}

.ls-hp-ethics-w {
    font-size: 1.2em;
    background-size: contain;
    background-color: #E8E1D7;
}

.ls-hp-ethics-w p {
    margin-bottom: 1em;
}

.ls-hp-ethics-w a,
.ls-hp-ethics-w h2,
.ls-hp-ethics-w p {
    max-width: calc(50vw - 60px);
}

/* --------------------- USED ELSEWHERE TOO -- boxed icon bar --------------------- */
.hp-dr-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-top: 40px;
}

.hp-dr-head h2 {
    margin-bottom: 0.25em;
    padding-left: 10px;
    line-height: 1.2;
}

.hp-dr-holder {
    display: flex;
    justify-content: center;
    flex-flow: wrap;
    align-items: baseline;
    border: 1px solid var(--color-mercury);
    margin-bottom: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.hp-dr-holder li {
    max-width: 90px;
    margin-right: 15px;
    padding: 40px 20px 40px 20px;
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
}

.hp-dr-holder li:last-child {
    margin-right: 0;
}

.hp-dr-holder a {
    color: var(--color-delta);
    letter-spacing: calc((10px + 0.35vw) * 50 / 1000);
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    font-size: calc(10px + 0.35vw)
}

.hp-dr-holder a:visited {
    color: var(--color-delta);
}

.hp-dr-holder a:hover {
    color: var(--color-mine-shaft-dark);
}

.hp-dr-holder img {
    max-width: 80%;
    max-height: 80px;
    object-fit: contain;
}

.hp-dr-holder span {
    display: block;
    padding-top: 20px;
}

/* ------------------------------------------------------------------ */
/* Fancybox rounded modal used in hp and category banners, extendable for elsewhere has a close button top right */
/* ------------------------------------------------------------------ */
.fb-modal__rounded {
    border-radius: 16px;
    min-width: 300px;
    width: 85%;
    max-width: 900px !important;
    min-height: 320px;
}

.fb-modal__inner {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    text-align: center;
}

/* [le] fixed huge box height - 27/08/2021 */
.ls-contractor-upload .fb-modal__inner {
    height: auto;
}

.fb-modal__inner h2 {
    margin-bottom: 1.5em;
}

.fb-modal__inner h3 {
    margin-bottom: 1.5em;
    font-family: var(--font-text-medium);
    line-height: 1.2;
    letter-spacing: 0.08em;
}

.fb-modal__inner img.icon {
    max-width: 100px;
    max-height: 50px;
}

.fb-modal__inner p {
    margin: 0.5em 0;
    letter-spacing: 0.05em;
}

.fb-modal__inner a {
    color: inherit;
    text-decoration: underline;
}

.fb-modal__light {
    color: var(--color-gray-dark);
    font-size: 0.9em;
}

.fb-modal__inner ul {
    align-self: flex-start;
}

.fb-modal__inner ul li {
    margin-left: 60px;
    text-align: left;
    position: relative;
}

.fb-modal__inner ul li::before {
    content: '\2013';
    left: -30px;
    position: absolute;
}

.fb-modal__stock h2 {
    margin-bottom: 0;
}

.fb-modal__stock div {
    margin: 1em 0;
}

.fb-modal__stock img.icon {
    max-height: 100px;
}

.fb-modal__sealImages {
    margin: 1em -30px 2em -30px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.fb-modal__sealImages p {
    font-size: 1.1em;
}

.fb-modal__sealImages div {
    flex-basis: 200px;
    margin: 0 30px;
    min-width: 160px;
}

.fb-modal__sealImages img {
    max-width: 100%;
    height: auto;
}

#hpWelcomeModal {
    max-width: 700px !important;
}

.fb-modal__hp-welcome div {
    padding: 1.5em 0;
}

.fb-modal__hp-welcome img {
    max-width: 280px;
    height: auto;
    width: 100%;
}

.fb-modal__hp-welcome p {
    font-size: 1.4em;
    margin: 0;
}

.fb-modal__basket h2 {
    margin: 0;
}

.fb-modal__basket img {
    max-width: 80px;
}

.fb-modal__basket div {
    padding: 1.5em 0;
}

/* checkout page - session expired and timezone difference popups */
#session_expired_popup,
#timezone_difference_popup {
    position: relative;
}

.fb-modal__stock .popup-close {
    margin: 0;
}

.popup-close {
    width: 44px;
    height: 44px;
    color: var(--color-main);
    padding: 10px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 401;
    cursor: pointer;
    opacity: 0.8;
}

.popup-close:hover,
.popup-close:active {
    opacity: 1;
}

.popup-close svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
    position: relative;
}

#session_expired_popup h1,
#timezone_difference_popup h1 {
    margin-bottom: 16px;
}

#session_expired_popup .primary,
#timezone_difference_popup .primary {
    width: auto;
    color: rgba(255, 255, 255, 0.8);
    text-transform: uppercase;
    text-decoration: none;
    margin-bottom: 0;
}

#session_expired_popup .primary:hover,
#session_expired_popup .primary:active,
#timezone_difference_popup .primary:hover,
#timezone_difference_popup .primary:active {
    color: var(--color-white);
    background-color: var(--color-shark);
    border-color: var(--color-cape-cod-darker);
}

/* ----------------------------------------------------------------- */
/* S H O W R O O M S   A N D   C O N T R A C T O R   P R O F I L E S */
/* ----------------------------------------------------------------- */
.ls_box_search_outer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.ls_box_search_showroom {
    background: url("/pub/media/skin/showroom/Showroom_page_hero_1600x400_new.jpg") 50% no-repeat;
    background-size: cover;
}

.ls_box_search_contractor {
    background: url("/pub/media/skin/showroom/search-holder-background.jpg") center center no-repeat;
    background-size: cover;
}

.ls_box_search_holder {
    background: var(--color-outer-space);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    max-width: 1000px;
    color: var(--color-white);
    padding: 30px 0;
}

.ls_box_search_holder h2,
.ls_box_search_holder h1 {
    font-size: 1.8em;
    margin: 0 10px 20px 10px;
    line-height: 1;
    text-align: center;
}

.ls_box_search_holder h3 {
    font-size: 1.0em;
    margin-bottom: 20px;
}

.ls_box_search_holder form {
    display: flex;
    flex-direction: column;
    width: 80%;
    justify-content: center;
    align-items: center;
}

.ls_box_search_showroom .ls_box_search_holder form {
    flex-direction: row;
}

.ls_box_search_holder input[type="text"] {
    border: none;
    font-size: 1.2em;
    padding: 3px 10px;
    border-radius: 5px;
}

.ls_box_search_holder button {
    border: 1px solid var(--color-silver);
    color: var(--color-white);
    font-size: 1.0em;
    padding: 3px 15px;
    border-radius: 5px;
    margin: 0 5px 0 15px;
}

/* ----- Content Pages ----- */
.ls-page p a,
.ls-page__simple a {
    font-weight: bold;
    text-decoration: underline;
    color: var(--color-black);
}

.ls-page p {
    margin: 1.75em auto;
    font-family: inherit;
}

.ls-page h2,
.ls-page__header h2 {
    font-size: 1.4em;
}

.ls-page h3 {
    font-size: 1.1em;
    margin-bottom: -0.75em;
}

.ls-page ul {
    margin-bottom: 1.75em;
}

.ls-page li {
    list-style-type: circle;
    margin-bottom: 0.5em;
    margin-left: 60px;
}

.ls-page__header {
    margin-bottom: 2em;
    padding-bottom: 0.25em;
    border-bottom: 1px solid var(--color-seashell);
}

.ls-page__header h1,
.ls-page__header h2 {
    text-align: center;
}

.ls-page__header p {
    max-width: 1000px;
    text-align: center;
    margin: 1.75em auto;
    font-size: 1.2em;
}

.ls-page__header a,
.ls-content__head a {
    font-weight: bold;
    text-decoration: underline;
    color: var(--color-black);
}

.ls-page__trade p,
.ls-page__trade h2 {
    text-align: left;
    max-width: none;
}

.ls-page__trade>div {
    display: flex;
    flex-direction: column;
}

.ls-page__trade-logos {
    min-width: 300px;
    margin: 1em 0;
}

.ls-logo-head {
    display: flex;
    justify-content: center;
    align-items: center;
}

.ls-logo-head img {
    max-height: 40px;
    margin-right: 60px;
}

.ls-responsive-img-full {
    max-width: 800px;
    width: auto;
    margin: 3em auto;
    padding: 0 10px;
}

.ls-responsive-img-full img,
.responsive {
    max-width: 100%;
    height: auto;
    object-fit: cover;
}

.ls-page__header .ls-fti {
    margin-bottom: 3em;
    margin-top: 3em;
    padding-top: 3em;
    border-top: 1px solid var(--color-seashell);
}

.ls-page__header .ls-fti a {
    text-decoration: none;
    font-weight: normal;
    font-size: 1rem;
}

.ls-page__header .ls-fti strong {
    font-weight: bold !important;
    margin-top: 1.75em;
}

.ls-page__header .ls-fti img {
    display: block;
    margin-bottom: 1em;
    max-height: 80px;
}

/* holder for 3ish images in a row, bordered */
.swiper:not(.swiper-initialized) .ls-page__images {
    display: flex;
    gap: 20px;
    overflow-x: hidden;
}

.swiper:not(.swiper-initialized) .ls-page__images li {
    flex-basis: 30%;
}

.ls-page__images li>div {
    border: 1px solid var(--color-seashell);
    padding: 15px;
}

.ls-page__images img {
    max-width: 100%;
    height: auto;
    object-fit: cover;
}

/* Video Page with grid of boxes and view button */
.ls-viewBoxes {
    display: grid;
    margin: 0 auto;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    grid-gap: 60px;
    padding: 0;
    border: none;
    width: auto;
}

.ls-viewBoxes li {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    padding: 15px;
    border: 1px solid var(--color-seashell);
    line-height: 1.2;
    transition: all 0.2s ease;
    position: relative;
}

.ls-viewBoxes li:hover {
    cursor: pointer;
    border-color: var(--color-alto-darker);
}

.ls-viewBoxes h3 {
    font-size: 1.15em;
    letter-spacing: 0.06em;
    font-family: var(--font-text-regular);
    margin: 1em 0;
}

.ls-viewBoxes p {
    margin: 0 0 1em 0;
    font-size: 0.9em;
}

.ls-viewBoxes img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.ls-viewBoxes .bottom {
    margin-top: auto;
    position: relative;
}

.ls-viewBoxes span:last-child {
    display: block;
    margin-top: 30px;
    position: relative;
    font-size: 0.9em;
    letter-spacing: 0.08em;
}

.ls-viewBoxes span:last-child::before {
    content: '';
    position: absolute;
    left: calc(50% - 8px);
    top: -27px;
    height: 16px;
    width: 16px;
    margin-left: auto;
    margin-right: auto;
    border: 4px solid var(--color-gallery);
    border-radius: 16px;
}

.ls-viewBoxes li:hover span:last-child::before {
    border-color: var(--color-apple);
    transition: all 0.2s ease;
}

.ls-viewBoxes__trade {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.ls-viewBoxes__trade img {
    max-height: 65px;
    min-height: 65px;
}

.ls-viewBoxes__trade a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.ls-boxImage__trade {
    width: 100%;
    padding: 30px 10px;
    margin: 2.5em 0;
    min-height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-seashell);
}

.ls-boxImage__trade img {
    max-width: 100%;
    max-height: 140px;
    object-fit: cover;
}

.ls-page__trade-info {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    font-size: 1.1em;
    letter-spacing: 0.06em;
}

.ls-page__trade-info a {
    text-decoration: none;
}

.ls-page__trade-info a:hover {
    text-decoration: underline;
}

.ls-page__trade-info .ls-socialSharing-holder {
    margin-top: 0;
}

/* New July 2020 videos page of carousels and 'all' videos */
.ls-video-group--header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 2em;
}

.ls-video-group--header h2 {
    margin: 0;
}

.ls-video-group {
    margin-bottom: 20px;
}

.ls-video-group--carousel {
    min-height: 50px;
}

.ls-video-group--carousel li {
    position: relative;
}

/* adding some initial css for video container because of slow loading - 22/07/2021 Livia */
.ls-video-group .swiper:not(.swiper-initialized) .ls-video-group--carousel {
    display: flex;
    flex-wrap: wrap;
}

.ls-video-group .swiper:not(.swiper-initialized) .ls-video-group--carousel li {
    width: 235px;
    margin: 0 1em 2em;
}

.video-feed--image-holder {
    padding-bottom: 60%;
    overflow: hidden;
    height: 0;
}

.video-feed--image-holder img {
    width: 100%;
    object-fit: cover;
    max-width: 100%;
}

.video-feed--text-holder {
    text-align: center;
}

.ls-video-group--grid {
    display: grid;
    margin: 0 0 2em 0;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-gap: 2em;
}

.ls-video-group--grid li {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.ls-video-group--image {
    width: 100%;
    margin-bottom: 1em;
}

.ls-video-group--image img {
    width: 100%;
    height: 100%;
    max-height: 320px;
    object-fit: cover;
}

.ls-video-group--image {
    position: relative;
}

.ls-video-group--play-holder {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ls-video-group--play-holder img {
    filter: invert(100%);
    opacity: 0.6;
    height: 50%;
    object-fit: contain;
}

.ls-video-group--grid .boxLink {
    z-index: 1;
}

.ls-video-group--grid li:hover .ls-video-group--play-holder img {
    opacity: 0.9;
}

.ls-video-group--text {
    line-height: 1.2;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    height: 100%;
}

.ls-video-group--text h2 {
    font-size: 1.4em;
    letter-spacing: 0.05em;
}

.ls-video-group--text p {
    font-size: 0.8em;
    letter-spacing: 0.05em;
    margin-top: 1em;
    margin-bottom: 1em;
}

.ls-video-group--text p:last-child {
    margin-top: auto;
    margin-bottom: 0;
}

.ls-video-group--text p:last-child:first-of-type {
    flex-grow: 10;
    margin-top: 1em;
}

.ls-video-group--text a {
    position: relative;
    z-index: 1;
    color: var(--color-black) !important;
    text-decoration: underline;
}

/* ----- Moodboard Monday feature -- inherits ls-viewBoxes and mods----- */
.cms-moodboard-monday .ls-viewBoxes,
.cms-moodboard-monday- .ls-viewBoxes {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.cms-moodboard-monday .ls-viewBoxes li:hover,
.cms-moodboard-monday- .ls-viewBoxes li:hover,
.mbm-carousel li:hover,
.mbm-carousel- li:hover {
    border-color: var(--color-dusty-gray);
}

.cms-moodboard-monday .ls-viewBoxes a,
.cms-moodboard-monday- .ls-viewBoxes a,
.mbm-carousel li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.cms-moodboard-monday .ls-viewBoxes h2,
.cms-moodboard-monday- .ls-viewBoxes h2,
.mbm-carousel li h2 {
    font-size: 1.4em;
    margin: 1em 0;
    line-height: 1;
}

.cms-moodboard-monday .ls-viewBoxes p,
.cms-moodboard-monday- .ls-viewBoxes p {
    color: var(--color-dusty-gray);
}

.cms-moodboard-monday .ls-viewBoxes li:hover p,
.cms-moodboard-monday- .ls-viewBoxes li:hover p {
    color: inherit;
}

.mbm-carousel ul {
    display: flex;
    gap: 20px;
    overflow-x: scroll;
}

.mbm-carousel li {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 10px;
}

.mbm-carousel p {
    color: var(--color-dusty-gray);
    font-size: 0.9em;
}

.mbm-carousel li:hover p {
    color: var(--color-main);
}

.mbm-carousel img {
    max-width: 100%;
    height: auto;
}

.mbm-jb__cols {
    display: flex;
    flex-direction: column
}

.mbm-jb__left {
    flex-direction: column;
    justify-content: space-between;
    max-width: 100%;
    margin-right: 0;
    align-items: center;
    min-width: 300px;
}

.mbm-jb__left h2 {
    font-size: 1.3rem;
}

.mbm-jb__right {
    flex-basis: 100%;
}

.mbm-jb__text {
    margin-top: 40px;
    position: relative;
}

.mbm-jb__text p {
    margin: 1.5em 0;
}

.mbm-shop__head {
    color: var(--color-dusty-gray);
    font-size: 1em;
    text-align: center;
    margin: 1.5em 0;
    position: relative;
}

.mbm-shop__head::before {
    content: '';
    height: 1px;
    border-top: 1px solid var(--color-dusty-gray);
    width: 100%;
    position: absolute;
    top: calc(50% + 1px);
    left: 0;
}

.mbm-shop__head span {
    display: inline-block;
    padding: 1em 40px;
    background: var(--color-white);
    z-index: 2;
    position: relative;
}

.mbm .hp-carousel-block img {
    height: 200px;
    width: auto;
    object-fit: contain;
}

/* ---------------------------------------------------------------------------- */
/* Landscape Specialist homepage other page layout items: */
.ls-contractor-home-bottom-body {
    margin-top: -140px;
    margin-bottom: 140px;
}

.ls-ch-lh-holder {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    padding-right: 60px;
}

.ls-contractor-home-bottom-body h3 {
    text-transform: uppercase;
    font-size: 0.8em;
    letter-spacing: 0.2em;
    line-height: 1;
    margin: 1em 0;
}

.ls-contractor-home-bottom-body h4 {
    font-size: 1.4em;
    letter-spacing: 0.05em;
    line-height: 1.2;
    margin: 1em 0;
}

.ls-ch-lh-item {
    display: flex;
    flex-direction: column;
    /*align-items: space-between;*/
    margin-right: 20px;
}

/* - important: do not remove the rhs margin for the last child or image widths break... */

.ls-ch-lh-item img {
    max-width: 100%;
    height: auto;
    margin-bottom: 15px;
}

.ls-contractor-home-bottom-body p {
    font-size: 1.0em;
    letter-spacing: 0.05em;
}

.ls-small-caps-text {
    color: var(--color-dusty-gray);
    font-size: 0.8em;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.ls-contractor-home-bottom-body .ls-small-caps-text {
    margin-top: 1em;
}

.ls-ch-rh-holder {
    background-color: var(--color-silver-chalice);
    background-blend-mode: multiply;
    display: flex;
    justify-content: space-between;
    flex-flow: column;
    color: var(--color-white);
    position: relative;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    align-items: center;
    padding: 80px 40px;
    text-align: center;
    height: 60vh;
    min-height: 500px;
}

.ls-ch-rh-holder::before {
    position: absolute;
    height: calc(100% - 50px);
    width: calc(100% - 50px);
    top: 25px;
    left: 25px;
    border: 1px solid var(--color-white);
    border-top: none;
    content: '';
}

.ls-ch-rh-holder-border-tl {
    position: absolute;
    top: 25px;
    left: 25px;
    height: 1px;
    border-top: 1px solid var(--color-white);
    width: calc(20% - 50px);
}

.ls-ch-rh-holder-border-tr {
    position: absolute;
    top: 25px;
    right: 25px;
    height: 1px;
    border-top: 1px solid var(--color-white);
    width: calc(20% - 50px);
}

.ls-ch-rh-holder h3 {
    text-transform: none;
    font-size: 1.75em;
    letter-spacing: 0.05em;
}

.ls-ch-rh-holder p {
    font-size: 1.2em;
}

.ls-ch-rh-holder a:link,
.ls-ch-rh-holdera:visited {
    color: var(--color-white);
}

.ls-ch-rh-holder .button {
    align-self: center;
    background: none;
    border-radius: 5px;
    font-size: 1.2em;
    border: 2px solid var(--color-white);
}

.ls-ch-rh-inner {
    display: flex;
    z-index: 10;
    height: 100%;
    flex-direction: column;
    justify-content: space-between;
    padding: 40px 0 40px 0;
}

.ls-ch-rh-head {
    top: 0;
    margin-top: -80px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 30px;
    z-index: 9;
}

.ls-ch-rh-head h2 {
    font-size: 1.2em;
    margin: 0;
    line-height: 1;
}

.ls-ch-lh-base {
    margin-top: 40px;
    padding-right: 60px;
    display: flex;
    flex-direction: column;
}

.ls-ch-rh-base {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
}

.ls-ch-lhb-img,
.ls-ch-rhb-img {
    margin-bottom: 15px;
    width: 100%;
    height: 16vw;
    background-size: cover;
    background-position: center center;
}

.ls_showroom_results_holder {
    margin-top: 30px;
    list-style-type: none;
    counter-reset: showrooms;
}

.ls_showroom_results_holder li {
    display: flex;
    overflow: hidden;
    flex-direction: column;
    align-items: center;
    background: var(--color-quill-gray);
    width: 100%;
    margin-bottom: 15px;
    counter-increment: showrooms;
}

.ls_showroom_result_img {
    flex-basis: 20%;
    overflow: hidden;
    min-width: 180px;
    text-align: center;
    min-height: 180px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    width: 100%;
    position: relative;
}

.ls_showroom_result_img>a {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.ls_showroom_result_txt {
    flex-basis: 100%;
    width: 100%;
    min-height: 60px;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
    text-align: center;
}

.ls_showroom_result_txt>div:not(.ls_showroom_result_tour) {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.ls_showroom_result_txt h2,
.ls_showroom_result_txt h3,
.ls_showroom_result_txt div {
    margin: 0.5rem 0;
    line-height: 1;
}

.ls_showroom_result_txt h2 {
    font-size: 1.4em;
}

.ls_showroom_result_txt>div>div a:last-child {
    margin-top: 15px;
}

.ls_showroom_result_txt a,
.ls_showroom_result_txt a:visited {
    color: var(--color-main);
}

a.ls_showroom_link,
a:visited.ls_showroom_link {
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.ls_showroom_planLink {
    display: flex;
}

.ls_showroom_planLink img {
    max-height: 16px;
    margin-right: 10px;
    width: auto;
}

.ls_showroom_result_tour {
    text-align: center;
}

.ls_showroom_tourLink {
    display: inline-block;
}

.ls_showroom_result_txt .ls_showroom_tourLink,
.ls_showroom_result_txt .ls_showroom_tourLink:visited {
    color: var(--color-black);
}

.ls_showroom_tourLink img {
    max-width: 72px;
}

.ls_showroom_tourLink span {
    font-size: 1rem;
    line-height: 1.31rem;
    letter-spacing: 1.2px;
    color: var(--color-main);
    text-transform: uppercase;
    margin-top: 1.25rem;
    display: none;
}

.showroom-distance-and-tour .ls_showroom_tourLink span {
    font-size: 1rem;
    line-height: 1.5;
    letter-spacing: 0;
    margin-top: 5px;
}

.showroom-distance-and-tour .ls_showroom_tourLink img {
    max-width: 67%;
}

.ls_showroom_result_distance {
    text-align: center;
    margin-right: 15px;
    flex-basis: 10%;
}

.ls_showroom_result_marker {
    position: relative;
    margin-bottom: 0.35em;
}

.ls_showroom_result_marker::after {
    content: counter(showrooms, upper-alpha);
    color: var(--color-white);
    font-size: 1.2em;
    text-align: center;
    position: absolute;
    top: 0.25em;
    left: 0;
    width: 100%;
    height: 100%;
}

.ls_showroom_result_marker img {
    max-width: 65%;
    max-height: 80px;
    height: auto;
}

.ls_showroom_results_controller {
    display: flex;
    justify-content: flex-end;
    margin-top: 30px;
}

.ls_showroom_results_controller h1 {
    margin-right: auto;
    line-height: 1.1;
}

.ls_showroom_results_controller span {
    margin-left: 2.5em;
    flex-shrink: 0;
    align-self: center;
    cursor: pointer;
}

.ls_showroom_results_controller img {
    max-height: 100%;
    width: auto;
    height: 28px;
    margin-right: 5px;
}

.showroom-distance-and-tour {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.showroom-distance-and-tour .ls_showroom_result_distance {
    order: 2;
}

.ls_showroom_details_holder {
    background: var(--color-gallery);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    padding: 10px;
}

.ls_showroom_details_col {
    flex-basis: 30%;
}

.ls_showroom_details_col:last-child {
    margin-right: 0;
}

.ls_showroom_details_holder h3 {
    font-size: 1.2em;
    margin-bottom: 0.5em;
}

.ls_showroom_details_holder h4 {
    font-size: 1.1em;
    margin-bottom: 0.5em
}

.ls_showroom_details_holder label {
    width: 10em;
    display: inline-block;
}

.ls_showroom_details_holder p {
    margin-bottom: 1em;
}

.ls_showroom_details_holder .ls-cr-bank {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
}

/* extends hp-dr-holder also needs overide in media queries */
.ls_showroom_features_holder {
    margin-top: 80px;
    padding: 0 20px;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
}

.ls_showroom_features_holder li {
    max-width: 100%;
    padding: 15px;
    text-align: center;
    flex-basis: 120px;
}

.ls_showroom_features_holder li:last-child {
    margin-right: 0;
}

.ls_showroom_details_actions {
    line-height: 1;
}

.ls_showroom_details_actions p {
    margin-bottom: 0.5em;
}

.ls_showroom_details_actions img {
    height: 1rem;
    width: auto;
    vertical-align: middle;
    margin-top: -2px;
}

.ls_showroom_details_actions a:link,
.ls_showroom_details_actions a:visited {
    color: var(--color-main);
}

.pageBanner {
    margin: 40px 0 20px 0;
}

.pageBanner img {
    width: 100%;
    object-fit: cover;
}

.pageBanner>img {
    min-height: 180px;
}

.banner-with-icon {
    position: relative;
}

.banner-with-icon .banner-icon {
    width: 100%;
    max-width: 553px;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
}

/* todo: add banner hide/display controls and styles */
.mapBanner {
    margin: 30px 0;
}

.mapBanner #map-canvas {
    width: 100%;
    height: 380px;
    border: 1px solid var(--color-silver);
    display: none;
}

#showMap {
    cursor: pointer;
}

.ls_showroom_map_info strong {
    font-size: 1.2em;
}

.ls_showroom_staff_outer {
    padding: 10px;
    border: 1px solid var(--color-gray-dark);
    position: relative;
    margin-top: 60px;
    text-align: center;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.ls_showroom_staff_heading {
    background: var(--color-white);
    width: auto;
    height: 40px;
    margin-top: -60px;
    display: inline-block;
    padding: 0 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ls_showroom_staff_heading h2 {
    margin: 0;
    line-height: 1;
}

.ls_showroom_staff_holder {
    margin-top: 20px;
}

.ls_showroom_staff_holder li {
    display: flex;
    text-align: left;
    flex-direction: column;
    margin-bottom: 30px;
    align-items: flex-start;
}

.ls_showroom_staff_img {
    flex-basis: 220px;
    min-width: 220px;
    margin-right: 30px;
    width: 100%;
    height: 100%;
}

.ls_showroom_staff_img img {
    margin-top: 10px;
    width: 100%;
    height: auto;
    max-width: 100%;
    object-fit: cover;
}

.ls_showroom_staff_txt h3 {
    font-size: 1.2em;
}

.ls_contractor_sr_table {
    margin: 20px 0 40px 0;
    border-collapse: collapse;
    width: 100%;
}

.ls_contractor_sr_table th {
    text-align: left;
    font-size: 1.2em;
    padding: 15px;
}

.ls_contractor_sr_table td {
    padding: 15px;
    font-size: 1.2em;
}

.ls_contractor_sr_table tr td:first-child,
.ls_contractor_sr_table tr th:first-child,
.ls_contractor_sr_table tr td:last-child,
.ls_contractor_sr_table tr th:last-child {
    display: none;
}

.ls_contractor_sr_table tbody tr:nth-child(odd) td {
    background-color: var(--color-mercury);
}

.ls_contractor_sr_table a:link,
.ls_contractor_sr_table a:visited {
    color: rgb(60, 66, 69)
}

a.ls_connect_button,
a.ls_connect_button:link,
a.ls_connect_button:visited {
    background: var(--color-quill-gray);
    border: #BEBEBC;
    border-radius: 7px;
    text-transform: none;
}

a.ls_connect_button:hover {
    background-color: #D2D2D2;
}

.cp-countyList li {
    display: inline-block;
    width: 33%;
    padding-right: 1em;
}

.cp-countyList a {
    color: inherit;
}

@supports (display: grid) {
    .cp-countyList {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        grid-column-gap: 1rem;
        grid-row-gap: 0.5rem;
    }

    .cp-countyList li {
        display: block;
        padding-right: 0;
        width: auto;
    }
}

.ls-contractor-display {
    font-size: 1.2em;
    color: var(--color-main);
}

.ls-contractor-display a:link,
.ls-contractor-display a:visited {
    color: var(--color-main)
}

.ls-contractor-display .ls-connect-search-holder a:link,
.ls-contractor-display .ls-connect-search-holder a:visited {
    color: var(--color-white);
}

.ls-contractor-display a:hover {
    color: var(--color-black)
}

.ls-contractor-head {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin: 40px 0 20px 0;
    letter-spacing: 0.04em;
}

.ls-contractor-head span:last-child {
    text-align: right;
}

.ls-contractor-head h1 {
    text-align: center;
    padding: 0 15px;
}

.ls-contractor-desc {
    text-align: center;
    margin-bottom: 40px;
}

.ls-contractor-gallery {
    margin-top: 20px;
    margin-bottom: 40px;
    width: 100%;
    height: 530px;
    display: flex;
    overflow: hidden;
}

@supports (display: grid) {
    .ls-contractor-gallery {
        display: grid;
        width: 100%;
        height: calc(((100vw - 5px) / 2) - 5px);
        max-height: 500px;
        grid-gap: 5px;
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: repeat(2, 1fr);
    }

    .lscg-box span {
        align-self: start;
        justify-self: start;
        overflow: hidden;
        height: 100%;
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
        width: 100%;
    }

    .lscg-box a,
    .lscg-box span {
        display: block;
        width: 100%;
        height: 100%;
    }

    .lscg-image-1 {
        grid-column: 1 / 3;
        grid-row: 1 / 3;
    }

    .lscg-image-2 {
        grid-column: 3 / 3;
        grid-row: 1 / 2;
    }

    .lscg-image-3 {
        grid-column: 4 / 4;
        grid-row: 1 / 2;
    }

    .lscg-image-4 {
        grid-column: 3 / 3;
        grid-row: 2 / 2;
    }

    .lscg-image-5 {
        grid-column: 4 / 4;
        grid-row: 2 / 2;
    }
}

.ls-contractor-details {
    margin: 40px 0 50px 0;
    padding-top: 40px;
    border-top: 1px solid var(--color-gallery);
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.ls-contractor-join {
    margin: 2.5em auto;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: row;
    padding: 15px;
    background: url("/pub/media/skin/connectbg.jpg") no-repeat center center;
    background-size: cover;
    border-radius: 30px;
    max-width: 900px;
}

.ls-contractor-join a:link,
.ls-contractor-join a:visited,
.ls-contractor-join a:hover {
    color: var(--color-white);
    font-size: 1.2em;
}

.lscd-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    height: 100%;
    flex-basis: 25%;
}

.lscd-logo img {
    max-width: 100%;
    height: auto;
    max-height: 120px;
    object-fit: cover;
}

.lscd-info {
    font-size: 0.9em;
    letter-spacing: 0.05em;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    flex-basis: 50%;
    padding: 0;
}

.lscd-internets {
    display: block;
}

.lscd-internets .ls-socialSharing-holder,
.lscd-internets .ls-socialSharing-holder ul {
    margin: 0;
}

.lscd-internets .ls-socialSharing-holder {
    margin-top: 20px;
    display: flex;
    justify-content: center;
}

.lscd-map {
    max-height: 100%;
    flex-basis: 100%;
    min-height: 200px;
    background: var(--color-concrete);
    margin: 30px 0;
}

.lscd-controls {
    display: flex;
    justify-content: space-between;
    height: 70px;
    align-items: flex-end;
    width: 100%;
}

.lscd-actions span {
    padding: 0;
}

.lscd-actions a {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ls-contractor-sb-entry {
    display: flex;
}

.ls-contractor-sb-entry span {
    padding-right: 10px;
}

.ls-contractor-sb-entry img {
    max-height: 26px;
}

.ls-contractor-sidebar~h4 {
    font-size: 0.9em;
    margin-bottom: 1.4em;
    padding-bottom: 0.2em;
    border-bottom: 1px solid #ABABAB;
}

.ls-contractor-trades-head {
    font-size: 1.2em;
    letter-spacing: 0.05em;
    text-align: center;
    margin: 50px 0 30px 0;
    position: relative;
}

.ls-contractor-trades-head span {
    display: inline-block;
    padding: 0 20px;
    background: var(--color-white);
}

.ls-contractor-trades-head::after {
    position: absolute;
    content: '';
    background: var(--color-gallery);
    height: 1px;
    width: 100%;
    left: 0;
    top: 50%;
    z-index: -1;
}

.ls-contractor-trades {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid var(--color-gallery);
}

.ls-contractor-trades span {
    margin-right: 15px;
    height: 60px;
}

.ls-contractor-trades span:last-child {
    margin-right: 0;
}

.ls-contractor-trades img {
    max-height: 100%;
    width: auto;
}

.ls-contractor-disclaimer {
    font-size: 0.85em;
    letter-spacing: 0.05em;
    margin: 2.5em 0;
    text-align: center;
}

.ls-contractor-experience h2 {
    font-size: 1.3em;
}

.ls-contractor-experience ul {
    display: grid;
    grid-template-columns: repeat(1, auto);
}

.ls-contractor-experience li {
    background-color: var(--color-mercury);
    /*align-self: left;*/
    padding: 10px 15px;
    display: flex;
    letter-spacing: 0.1em;
    justify-content: space-between;
    line-height: 1;
    font-size: 0.92em;
}

.ls-contractor-experience li:nth-child(odd) {
    background-color: var(--color-white);
}

.ls-contractor-experience img {
    width: 26px;
    height: 20.3px;
    margin-left: 30px;
}

.ls-contractor-experience p {
    margin: 10px 0 30px 0;
}

/* ------------------------------------------------------------ */
/* -------------------- C O N T A C T ------------------------- */
/* ------------------------------------------------------------ */
.ls-contacts-threeup {
    margin: -2em 0 3em 0;
}

.ls-ctu h3 {
    font-size: 1.4em;
    margin: 30px 0;
}

.ls-ctu a {
    color: var(--color-black);
    text-decoration: underline;
}

.ls-ctu ul {
    display: flex;
    flex-direction: column;
    height: auto;
}

.ls-ctu li {
    flex-grow: 1;
    flex-basis: 33.33%;
    margin-bottom: 30px;
    padding: 15px 15px 30px 15px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    border: 1px solid var(--color-seashell);
    text-align: center;
}

.ls-ctu li:last-child {
    margin-right: 0;
}

.ls-ctu p:last-child {
    margin-bottom: auto;
}

.ls-ctu img {
    height: auto;
    max-width: 100px;
    margin: 30px 0;
    min-width: 60px;
    max-height: 70px;
}

.ls-cr li {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 3em;
    border-bottom: 1px solid var(--color-seashell);
    border-top: 1px solid var(--color-seashell);
}

.ls-cr h3 {
    font-weight: bold;
    font-size: 1.2em;
    letter-spacing: 0.05em;
    margin-bottom: 0.5em;
}

.ls-cr a {
    color: inherit;
}

.ls-cr-img {
    flex-basis: 25%;
    width: 100%;
    min-width: 200px;
    min-height: 200px;
    background-position: center center;
    background-size: cover;
    position: relative;
}

.ls-cr-img a {
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
}

.ls-cr-text {
    flex-basis: 50%;
    padding: 25px;
}

.ls-cr-addr,
.ls-cr-tel {
    font-size: 1.1em;
    margin: 0.5em 0;
}

.ls-cr-hours {
    flex-basis: 25%;
    min-width: 220px;
    padding: 25px;
}

.ls-cr-hours div {
    display: flex;
    flex-direction: row;
    max-width: 320px;
    justify-content: space-between;
}

/* ------------------------------------------------------------ */
/* ------------------------- F A Q s -------------------------- */
/* ------------------------------------------------------------ */
.cms-faqs .breadcrumbs,
.cms-faqs- .breadcrumbs {
    display: none;
}

.lsfp-container h3,
.lsfp-container p {
    font-family: var(--font-text-regular);
}

.lsfp-container h3 {
    margin: 2em 0 1em 0;
    font-size: 1.2em;
    color: var(--color-black);
}

.lsfp-container h3:first-child {
    margin-top: 0;
}

.bigger-h3-mt h3:not(:first-of-type) {
    margin-top: 3em;
}

.lsfp-container h4 {
    font-size: 1.1em;
    color: var(--color-black);
    margin: 2em 0 1em 0;
    padding-left: clamp(16px, 3vw, 32px);
}

.lsfp-container h4 span {
    display: inline-block;
    padding-right: 8px;
}

.lsfp-container p {
    margin: 1em 0;
}

.lsfp-container p a {
    color: var(--color-main);
    text-decoration: underline;
    transition: color 0.3s ease-in-out;
}

.lsfp-container p a:hover,
.lsfp-container p a:focus {
    color: var(--color-black);
}

.lsfp-container {
    display: flex;
    justify-content: flex-start;
    margin: 60px 0;
}

.lsfp-container.lsfp-home-state {
    justify-content: center;
    display: inherit;
}

.lsfp-holder {
    display: none;
}

.lsfp-holder.current-holder {
    display: inherit;
}

.lsfp-section {
    display: none;
    padding-left: 15px;
}

.lsfp-section.current-section {
    display: inherit;
}

.lsfp-link {
    color: #BABCBE;
    cursor: pointer;
}

.lsfp-link:hover {
    color: var(--color-black);
}

.current-col-link {
    color: var(--color-main);
}

.lsfp-home-state .lsfp-link span:last-child {
    display: block;
    margin-top: 30px;
    position: relative;
}

.lsfp-link span:last-child {
    display: none;
}

.lsfp-home-state .lsfp-link span:last-child::before,
.lsvlb span:last-child::before {
    content: '';
    position: absolute;
    left: calc(50% - 8px);
    top: -27px;
    height: 16px;
    width: 16px;
    margin-left: auto;
    margin-right: auto;
    border: 4px solid var(--color-gallery);
    border-radius: 16px;
}

.lsfp-link img {
    max-height: 26px;
    margin-right: 15px;
    opacity: 0.5;
    object-fit: contain;
}

.lsfp-home-state .lsfp-link img {
    width: 100%;
    height: 100%;
    max-height: 80px;
    margin: 0;
    opacity: 0.75;
}

.cms-faqs .lsfp-link:hover img,
.cms-faqs- .lsfp-link:hover img {
    opacity: 1;
}

.cms-faqs .current-col-link img,
.cms-faqs- .current-col-link img {
    opacity: 1;
}

.lsfp-list {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--color-seashell);
    padding: 5px 10px 5px 10px;
    width: 290px;
}

.lsfp-home-state .lsfp-list {
    display: grid;
    margin: 0 auto;
    max-width: 1200px;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    grid-gap: 60px;
    padding: 0;
    border: none;
    width: auto;
}

.lsfp-list li {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    height: 50px;
    font-size: 1.1em;
}

.lsfp-home-state li {
    display: flex;
    flex-direction: row;
    justify-content: center;
    min-height: 220px;
    height: 100%;
}

.lsfp-link div {
    display: flex;
    align-items: center;
    width: 100%;
}

.lsfp-home-state li div {
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    color: var(--color-main);
    padding: 30px 15px;
    border: 1px solid var(--color-seashell);
    width: 240px;
    height: 250px;
    position: relative;
}

.lsfp-home-state li:hover div,
.lsvlb:hover {
    border-color: var(--color-main);
}

.lsfp-home-state li:hover span:last-child::before,
.lsvlb:hover span:last-child::before {
    border-color: var(--color-apple);
}

.lsfp-link a {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 10;
}

.lsfp-home-state .lsfp-home-link {
    display: none;
}

.lsfp-img {
    width: 40px;
    text-align: center;
    display: flex;
    justify-content: center;
}

.lsfp-home-state .lsfp-img {
    display: block;
    width: auto;
    height: 100%;
    max-height: 80px;
}

.lsfp-entries {
    padding-left: 60px;
}

/* used on other pages to contain image and center it */
.lsfp-img-other {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 80px;
    object-fit: contain;
    max-width: 100%;
}

.lsfp-home-state .lsfp-img-other img {
    max-height: 80px;
    margin: 0;
    opacity: 1 !important;
    object-fit: contain;
    width: 100%;
}

/* floating boxes, at least three to a screen width, col disp for mobile, uses a 'view' link with a roundal above */
.ls-view-link-box-holder {
    display: flex;
    justify-content: space-between;
    margin: 0 -15px 2em -15px;
}

.ls-view-link-box,
.lsvlb {
    flex-basis: 33%;
    margin: 0 15px;
    border: 1px solid var(--color-seashell);
    padding: 30px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.lsvlb h3 {
    margin: 1em 0;
}

.lsvlb span {
    position: relative;
    margin-top: 2em;
}

.lsvlb a {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;
}

.lsvlb img {
    width: 100%;
    height: auto;
    margin-bottom: 1em;
    display: block;
}

.widget-holder {
    width: auto;
    max-width: 400px;
    margin: 0 auto;
}

/* ------------------------------------------------------------ */
/* ----------------------- F O O T E R ------------------------ */
/* ------------------------------------------------------------ */
footer,
footer li,
footer a {
    color: var(--color-black);
    font-size: 16px;
}

footer h2 {
    font-size: 1em;
    letter-spacing: 0.1em;
    margin: 1.5em 0;
    color: var(--color-mine-shaft);
    font-family: inherit;
    display: inline-block;
    text-transform: uppercase;
}

.pre-footer-container {
    margin: 30px 0 0 0;
    padding: 30px 0 20px 0;
    background: var(--color-gallery);
    color: var(--color-black);
}

footer a,
footer a:link,
footer a:visited {
    color: var(--color-black);
    letter-spacing: 0.1em;
    line-height: 1.3;
    font-size: 16px;
}

footer a:hover {
    color: var(--color-black);
    text-decoration: underline;
}

.main-footer__container {
    width: 100%;
    padding: 0 10px;
}

.footer__connect {
    max-width: 1000px;
}

.footer__connect,
.footer__connect input {
    font-family: var(--font-text-regular);
}

.footer-columns {
    max-width: 1360px;
}

.footer__connect,
.footer-columns {
    margin: 0 auto;
}

.footer__cols h5 {
    font-size: 16px;
    border-bottom: 1px solid var(--color-silver-darker);
    width: 100%;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 0;
    cursor: pointer;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer__cols .footer__cols-group {
    display: none;
    margin: 1em 0;
}

.footer__cols-head--open+.footer__cols-group {
    display: block;
    text-align: center;
}

.footer__cols h5::after {
    content: '\276F';
    margin: 0 0 0 20px;
    font-size: 16px;
    z-index: 100;
    display: block;
    transition: all 0.25s;
    transform: rotate(90deg);
}

.footer__cols h5.footer__cols-head--open:after {
    transform: rotate(270deg);
}

.footer-strap {
    text-align: center;
    margin-top: 32px;
    font-size: 16px;
}

.ls-footer__payments-and-socials {
    margin: clamp(28px, 3.5vw, 48px) auto 48px auto;
    display: grid;
    grid-gap: 24px;
    align-items: center;
}

.ls-footer__payments-and-socials li {
    display: flex;
}

.ls-footer__payments-and-socials a {
    display: flex;
    width: 100%;
}

.ls-footer__payments-and-socials img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.ls-footer__payments {
    display: grid;
}

.ls-footer__payments ul {
    display: grid;
    grid-template-columns: minmax(15px, 44px) minmax(15px, 44px) minmax(15px, 44px) minmax(60px, 114px) minmax(50px, 30px) minmax(50px, 30px);
    grid-gap: clamp(18px, calc(6px + 1vw), 24px);
}

.ls-footer__sep {
    display: grid;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.ls-footer__sep span {
    height: 100%;
    width: 0;
    border-left: 1px solid #707070;
}

.ls-footer__payments-and-socials .ls-footer__sep {
    display: none;
}

.ls-footer__socials ul {
    display: grid;
    grid-template-columns: minmax(16px, 30px) minmax(16px, 30px) minmax(16px, 30px) minmax(16px, 30px) minmax(16px, 30px) minmax(16px, 30px);
    grid-gap: clamp(16px, calc(12px + 1vw), 24px);
}

.footer-payments {
    margin-bottom: 2.5em;
}

.mc-field-group {
    display: flex;
    justify-content: stretch;
}

.mc-field-group label {
    display: block;
    margin: 10px 0 5px 0;
    letter-spacing: 0.09em
}

.mc-field-group input {
    margin: 0 0 0 0;
    border: 1px solid var(--color-dusty-gray);
    font-size: 1.1em;
    padding: 5px;
    color: var(--color-dusty-gray);
    background: var(--color-gallery);
}

footer #mce-EMAIL {
    height: 40px;
    min-width: 220px;
    border: none;
    padding: 0 15px;
    border-radius: 5px 0 0 5px;
    background: var(--color-white);
    flex-grow: 1;
}

footer #mce-EMAIL::placeholder {
    color: var(--color-mine-shaft);
    font-size: 1em;
    letter-spacing: 0.1em;
}

footer #mc-embedded-subscribe {
    height: 40px;
    font-size: 1em;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 0px;
    margin-left: 0px;
    background: var(--color-mine-shaft);
    color: var(--color-white);
    border-radius: 0 5px 5px 0;
    padding: 0 18px;
}

#mc-embedded-subscribe:hover {
    background-color: var(--color-cod-gray);
    border-color: transparent;
}

#mc_embed_signup {
    margin-bottom: 1em;
}

.footer-icons--holder {
    position: fixed;
    bottom: 0px;
    right: 5px;
    width: 50px;
    z-index: 9998;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.footer-icons--holder div {
    cursor: pointer;
    width: 40px;
    height: 40px;
    margin-bottom: 20px;
    background: rgba(255, 255, 255, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.3);
    transition: opacity 0.5s;
}

.footer-icons--holder .smaller-home-icon img {
    width: 26px;
    height: 26px;
}

.footer-icons--holder div:hover {
    background: rgba(255, 255, 255, 1);
    box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.5);
}

.footer-icons--holder div:last-child {
    margin: 0;
}

.footer-icons--holder img {
    width: 40px;
    height: 40px;
}

.psmtc_iaXZ {
    display: none !important;
}

#chatIcon,
#backToTop,
#WhatsAppIcon {
    opacity: 0;
    transition: visibility 0.5s;
    transition: opacity 0.5s;
}

#backToTop.btt-hide {
    opacity: 0;
    visibility: hidden;
}

#backToTop.btt-show {
    opacity: 1;
    visibility: visible;
}

/*mlr 27.5.25 new AI chat icon handling*/

.footer-icons--holder .cb-icon img {width: 100%; height: 100%;	}
.cb-container {
	width: 400px; 
	height: 635px; 
	position: fixed; 
	z-index: 9999; 
	right: 10px; 
	bottom: 10px; 
	padding-top: 35px;
	box-shadow: 1px 2px 3px rgba(0,0,0,0.5); 
	background: white;
	opacity: 1;
	transition: opacity 0.25s ease-in-out;
}
.cb-container__closer {
	position: absolute; 
	top: 5px; 
	right: 5px; 
	height: 24px; 
	width: 24px; 
	cursor: pointer;
	opacity: 0.65;
}
.cb-container__closer img {width: 100%; height: 100%}
.cb-container__closer:hover {opacity: 1}

.cb-container__inner {width: 100%; height: 100%}
.cb-container__closed {
	opacity: 0;
	pointer-events: none;
}

@media (max-width: 599px) {
	.footer-icons--holder {
		bottom: 20px;
	}
	.cb-container {
		width: 100vw;
		height: 100vh;
		right: 0;
		bottom: 0;
		box-shadow: none;
		padding-top: 35px;
	}
	
	.cb-container__inner {
		width: 100%;
		height: calc(100% - 35px);
	}
}

/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */

/* - important: REMOVE IF NOT USING LIGHTBOX AND USING FANCYBOX INSTEAD plus ADD FANCYBOX STYLES */
/* lightbox minified */
.lb-loader,
.lightbox {
    text-align: center;
    line-height: 0
}

body:after {
    content: url(close.png) url(loading.gif) url(prev.png) url(next.png);
    display: none
}

.lb-dataContainer:after,
.lb-outerContainer:after {
    content: "";
    clear: both
}

body.lb-disable-scrolling {
    overflow: hidden
}

.lightboxOverlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: var(--color-black);
    filter: alpha(Opacity=80);
    opacity: .8;
    display: none
}

.lightbox {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 10000;
    font-weight: 400
}

.lightbox .lb-image {
    display: block;
    height: auto;
    max-width: inherit;
    max-height: none;
    border-radius: 3px;
    border: 4px solid var(--color-white)
}

.lightbox a img {
    border: none
}

.lb-outerContainer {
    position: relative;
    width: 250px;
    height: 250px;
    margin: 0 auto;
    border-radius: 4px;
    background-color: var(--color-white)
}

.lb-loader,
.lb-nav {
    position: absolute;
    left: 0
}

.lb-outerContainer:after {
    display: table
}

.lb-loader {
    top: 43%;
    height: 25%;
    width: 100%
}

.lb-cancel {
    display: block;
    width: 32px;
    height: 32px;
    margin: 0 auto;
    background: url(loading.gif) no-repeat
}

.lb-nav {
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 10
}

.lb-container>.nav {
    left: 0
}

.lb-nav a {
    outline: 0;
    background-image: url(data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==)
}

.lb-next,
.lb-prev {
    height: 100%;
    cursor: pointer;
    display: block
}

.lb-nav a.lb-prev {
    width: 34%;
    left: 0;
    float: left;
    background: url(prev.png) left 48% no-repeat;
    filter: alpha(Opacity=0);
    opacity: 0;
    -webkit-transition: opacity .6s;
    -moz-transition: opacity .6s;
    -o-transition: opacity .6s;
    transition: opacity .6s
}

.lb-nav a.lb-prev:hover {
    filter: alpha(Opacity=100);
    opacity: 1
}

.lb-nav a.lb-next {
    width: 64%;
    right: 0;
    float: right;
    background: url(next.png) right 48% no-repeat;
    filter: alpha(Opacity=0);
    opacity: 0;
    -webkit-transition: opacity .6s;
    -moz-transition: opacity .6s;
    -o-transition: opacity .6s;
    transition: opacity .6s
}

.lb-nav a.lb-next:hover {
    filter: alpha(Opacity=100);
    opacity: 1
}

.lb-dataContainer {
    margin: 0 auto;
    padding-top: 5px;
    width: 100%;
    -moz-border-radius-bottomleft: 4px;
    -webkit-border-bottom-left-radius: 4px;
    border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -webkit-border-bottom-right-radius: 4px;
    border-bottom-right-radius: 4px
}

.lb-dataContainer:after {
    display: table
}

.lb-data {
    padding: 0 4px;
    color: var(--color-silver)
}

.lb-data .lb-details {
    width: 85%;
    float: left;
    text-align: left;
    line-height: 1.1em
}

.lb-data .lb-caption {
    font-size: 13px;
    font-weight: 700;
    line-height: 1em
}

.lb-data .lb-caption a {
    color: #4ae
}

.lb-data .lb-number {
    display: block;
    clear: left;
    padding-bottom: 1em;
    font-size: 12px;
    color: var(--color-dusty-gray)
}

.lb-data .lb-close {
    display: block;
    float: right;
    width: 30px;
    height: 30px;
    background: url(close.png) top right no-repeat;
    text-align: right;
    outline: 0;
    filter: alpha(Opacity=70);
    opacity: .7;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s
}

.lb-data .lb-close:hover {
    cursor: pointer;
    filter: alpha(Opacity=100);
    opacity: 1
}

/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */

/* Jet Zoom CSS. (c)2012-2013 Star Plugins. This CSS can be altered to change the look and size of the lens. */
.jetzoom-lens {
    border: 3px solid #3d4346;
    width: 40%;
    height: 40%;
    border-radius: 20px;
    box-shadow: -0px -0px 10px rgba(0, 0, 0, 0.40);
    cursor: none;
    z-index: 9999;
    max-width: 160px;
    max-height: 160px;
}

/* A blank image */
.jetzoom-blank {
    background-image: url("/pub/media/skin/blank.png");
}

/* The animated ajax loading image */
.jetzoom-ajax-loader {
    background-image: url("/pub/media/skin/ajax-loader.gif");
    width: 32px;
    height: 32px;
}

/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */
/* Search autocomplete ctyles */
#search_autocomplete {
    max-height: 300px;
    overflow-y: auto;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
    width: 100% !important;
    top: 98%;
    left: 0;
}

.search-autocomplete>ul .empty {
    padding: 5px 7px;
    text-align: left;
}

.search-autocomplete>ul {
    border: 1px solid #bfcdd3;
    border-radius: 2px;
}

.search-autocomplete>ul,
.search-autocomplete>ul li {
    background: var(--color-white);
}

.search-autocomplete>ul li {
    cursor: pointer;
}

.search-autocomplete>ul li .amount {
    display: none;
}

.search-autocomplete>ul li .qs-option-name {
    color: #585858;
    display: block;
    padding: 9px 6px;
    border-bottom: 1px solid #d5e4eb;
}

.search-autocomplete>ul li .qs-option-name:last-child {
    border-bottom: 0;
}

.search-autocomplete>ul li .qs-option-name:hover,
.search-autocomplete>ul li .qs-option-name:hover .price-box .price,
.search-autocomplete>ul li .qs-option-name.tt-cursor,
.search-autocomplete>ul li .qs-option-name.tt-cursor .price-box .price-label,
.search-autocomplete>ul li .qs-option-name.tt-cursor .price-box .price {
    background-color: #ecf3f6;
    text-decoration: none;
}

.search-autocomplete>ul li .qs-option-name:hover .price-box .old-price .price,
.search-autocomplete>ul li .qs-option-name.tt-cursor .price-box .old-price .price {
    text-decoration: line-through;
}

.search-autocomplete>ul li .qs-option-name .info {
    margin-left: 56px;
}

.search-autocomplete>ul li .qs-option-name .price-box {
    margin: 0;
}

.search-autocomplete>ul li .qs-option-name .clearer {
    clear: both;
}

/* default swiper styles */
.swiper-slide {
    height: auto;
}

.pagination-outside {
    position: relative;
    padding-bottom: 30px;
}

.pagination-outside .swiper-pagination {
    bottom: 0;
}

.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: var(--color-white);
    border: 3px solid var(--color-silver-dark);
}

.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--color-silver-dark);
}

.swiper-pagination-bullet {
    opacity: var(--swiper-pagination-bullet-inactive-opacity, 1);
}

.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 5px);
}

.swiper-button-next,
.swiper-button-prev {
    color: var(--color-silver) !important;
    opacity: 0.75;
}

.navigation-outside {
    position: relative;
    padding-left: 35px;
    padding-right: 35px;
}

.navigation-outside .swiper-button-next,
.navigation-outside .swiper-rtl .swiper-button-prev,
.ethics-slider .swiper-button-next,
.ethics-slider .swiper-rtl .swiper-button-prev {
    right: 0;
}

.navigation-outside .swiper-button-prev,
.navigation-outside .swiper-rtl .swiper-button-next,
.ethics-slider .swiper-button-prev,
.ethics-slider .swiper-rtl .swiper-button-next {
    left: 0;
}

/* END default swiper styles */

/* Gallery */
.ls-product-cg .swiper-thumbs img {
    display: block;
    height: auto;
    max-width: 100%;
}

/* End of Gallery */

.cS-hidden {
    height: 1px;
    opacity: 0;
    filter: alpha(opacity=0);
    overflow: hidden;
}

/* table styles on category page */
.ls-table {
    overflow: auto;
    margin-top: 1em;
    margin-bottom: 1em;
}

.ls-table-head~.ls-table {
    margin-top: 0;
}

.ls-table table {
    width: 100%;
    min-width: 660px;
    border-collapse: collapse;
}

.ls-table thead {
    background: #E8E8ED;
}

.ls-table th,
.ls-table td,
.ls-table-head {
    font-family: var(--font-text-regular);
    font-size: 12px;
    line-height: 20px;
    letter-spacing: -0.06px;
    color: var(--color-emperor);
    min-width: 330px;
    padding: 16px;
    vertical-align: middle;
}

.ls-table th,
.ls-table-head {
    font-family: var(--font-text-medium);
    color: var(--color-black);
}

.ls-table th:not(:first-child),
.ls-table td:not(:first-child) {
    border: 0.5px solid var(--color-emperor);
    border-top: 0;
    border-bottom: 0;
    box-shadow: inset 0px 0.5px 0 var(--color-emperor);
}

.ls-table thead th:nth-child(2),
.ls-table tbody td:nth-child(2) {
    border-left: 0;
}

.ls-table th:first-child {
    min-width: 150px;
    position: sticky;
    left: 0;
    background: #FAEACD;
}

.ls-table th:first-child::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border: 0.5px solid var(--color-emperor);
    border-right: 1px solid var(--color-black);
    border-bottom: 0;
}

.ls-table tbody tr th {
    background: #FEFAF2;
}

.ls-table tbody tr:nth-child(2n) th {
    background: #FCF5E6;
}

.ls-table tbody tr td {
    background: var(--site-background-color);
}

.ls-table tbody tr:nth-child(2n) td {
    background: #F3F4F6;
}

.ls-table tbody tr:last-child th::before {
    border-bottom: 0.5px solid var(--color-emperor);
}

.ls-table thead th:not(:first-child) {
    border-top: 0;
    box-shadow: inset 0px 0.5px 0 var(--color-emperor);
}

.ls-table tbody tr:last-child td {
    position: relative;
    z-index: -1;
}

.ls-table tbody tr:last-child td::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-bottom: 0.5px solid var(--color-emperor);
}

.ls-dots-container {
    line-height: 8px;
    margin-top: 16px;
}

.ls-table-dot {
    width: 8px;
    height: 8px;
    margin-right: 8px;
    display: inline-block;
    background-color: var(--color-alto-hub);
    border-radius: 50%;
    cursor: pointer;
}

.ls-table-dot.active {
    background-color: var(--color-tangerine);
}

.ls-table-head {
    text-align: center;
    min-width: 100%;
    margin-top: 1em;
    background: #FAEACD;
    position: relative;
}

.ls-table-head::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border: 0.5px solid var(--color-emperor);
    border-right: 1px solid var(--color-black);
}

.ls-table-head~.ls-table tbody tr:first-of-type th:first-child::before {
    border-top: 0;
}

.ls-table-head~.ls-table tbody tr:first-of-type td {
    box-shadow: none;
}

.ls-table.two-columns table {
    width: auto;
    min-width: 400px;
}

.ls-table.two-columns th,
.ls-table.two-columns td {
    min-width: auto;
}

.ls-table.two-columns th:first-child {
    min-width: auto;
    max-width: min(34vw, 150px);
}

@media (min-width: 1024px) {
    .ls-table th:first-child {
        min-width: 240px;
    }

    .ls-table.two-columns th:first-child {
        max-width: min(34vw, 240px);
    }
}

@media (min-width: 1648px) {
    .ls-dots-container {
        display: none;
    }
}

/* end table styles on category page */

/* ------------------------------------------------------------ */
/* ------- C S S   G R I D   O P T I M I S A T I O N S -------- */
/* ------------------------------------------------------------ */
@supports (display: grid) {
    .hp-dr-holder {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
        grid-gap: 1rem;
    }
}

/* ------------------------------------------------------------ */
/* ------- D E V I C E   S P E C I F I C   @ M E D I A -------- */
/* ------------------------------------------------------------ */
/* media query up to 767px */
@media (max-width: 767px) {

    /* master structure */
    .catalog-product-view .grid-container,
    .catalog-product-view .grid-container-lg {
        padding-left: 0;
        padding-right: 0;
    }

    /* END master structure */

    /* pagination styles on Blog pages */
    body[class*="wordpress-"] a.next::after,
    a.post-skip-next::after {
        margin-left: 5px;
    }

    body[class*="wordpress-"] a.previous::after,
    body[class*="wordpress-"] a.post-skip-previous::after {
        margin-right: 8px;
        margin-bottom: 5px;
    }

    /* END pagination styles on Blog pages */

    /* header */
    .hca-aa-icons .login,
    .hca-aa-icons .logout {
        display: none;
    }

    .hc-actions-container {
        padding-right: 0;
        position: absolute;
        top: 23px;
        right: 0;
    }

    .head-trade-bar {
        margin-top: 0;
        padding-top: 1px;
    }

    .header-container.menu-open .block-search {
        display: block;
    }

    /* END header */

    .ls-products-grid.ls-2col-grid {
        margin: 0 10px 10px;
    }

    .ls-products-grid.ls-2col-grid+.catList-descr {
        margin: 0 16px;
    }

    .ls-products-grid.ls-2col-grid .products-grid {
        grid-template-columns: repeat(auto-fill, minmax(163px, 1fr));
        grid-gap: 17px;
        margin: 0;
    }

    .ls-products-grid.ls-2col-grid .products-grid:after {
        content: unset;
    }

    .ls-products-grid.ls-2col-grid .products-grid li {
        padding: 0 0 17px 0;
    }

    .ls-2col-grid .ls-grid-lead {
        flex-direction: column;
        align-items: flex-start;
        font-size: 12px;
    }

    .ls-2col-grid .ls-grid-lead span+span {
        margin: 2px 0 0 0;
    }

    .ls-2col-grid .ls-grid-lead img {
        max-height: 15px;
    }

    .ls-2col-grid .ls-grid-free-del {
        font-size: 12px;
    }

    /* landscape specialist homepage other page layout items */
    .ls_showroom_results_controller {
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .ls_showroom_results_controller h1 {
        font-size: 1.8em;
        width: 100%;
        margin-bottom: 10px;
    }

    /* END landscape specialist homepage other page layout items */

    /* content pages */
    .ls-logo-head,
    .ls-logo-head img {
        display: block;
    }

    .ls-logo-head img {
        margin: 0 auto 10px;
    }

    /* END content pages */

    /* Gallery */
    .ls-product-cg .swiper-thumbs {
        display: none;
    }

    .ls-product-cg.pagination-outside {
        padding-bottom: 0;
    }

    .ls-product-cg.pagination-outside .swiper-pagination {
        bottom: 27px;
    }

    .ls-product-cg.pagination-outside .ls-product-cg--enlarge {
        margin-top: 30px;
    }

    /* End of Gallery */

    /* main menu mobile and tablet - 10/09/2021 Livia */
    .shadow-modal {
        background: #0000008a;
    }

    .header-container.menu-open {
        position: relative;
    }

    .header-container.menu-open::before {
        content: "";
        display: block;
        width: 100vw;
        height: 100%;
        background: var(--site-background-color);
        position: absolute;
        top: 0;
        left: calc(50% - 50vw);
        z-index: 1002;
    }

    .ptop {
        padding-top: 30px;
    }

    .pbottom {
        padding-bottom: 40px;
    }

    .main-navigation {
        width: 100%;
        position: absolute;
        top: 70px;
        left: 0;
        background: var(--site-background-color);
        border-top: 1px solid var(--color-alto-dark);
    }

    .main-navigation>li.menu-expand>a:not(.menu-has-link) {
        pointer-events: none;
    }

    .main-navigation li,
    .main-navigation a {
        position: relative;
    }

    .main-navigation a {
        padding: 7px 58px 7px 20px;
    }

    .main-navigation a::after {
        content: "";
        display: block;
        width: 100vw;
        height: 1px;
        background: var(--color-alto);
        position: absolute;
        left: 0;
        bottom: 0;
        pointer-events: none;
    }

    li.menu-expand.is-open {
        background: var(--color-gallery);
    }

    li.menu-expand>a {
        display: inline-block;
    }

    li.menu-expand::before {
        content: '\276F';
        display: inline-block;
        width: 38px;
        height: 38px;
        font-size: 16px;
        transition: transform 0.35s ease;
        position: absolute;
        top: 5px;
        right: 18px;
        transform: translateY(-6px) rotate(90deg);
        cursor: pointer;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    li.menu-expand.is-open::before {
        transform: translateY(-6px) rotate(270deg);
    }

    .main-menupoint>a {
        font-family: var(--font-text-medium);
        color: var(--color-mine-shaft);
        letter-spacing: 0.12em;
        text-transform: uppercase;
    }

    .main-menupoint>ul>li>a {
        padding-left: 40px;
    }

    .main-menupoint>ul>li>ul>li>a {
        font-size: 14px;
        padding-left: 60px;
    }

    .main-menupoint>ul>li>ul>li>ul>li>a {
        font-size: 12px;
        padding-left: 80px;
    }

    .main-navigation,
    .main-menupoint ul {
        display: none;
    }

    #menu-button {
        position: absolute;
        top: 15px;
    }

    .hc-logo-container {
        margin-top: -10px;
    }

    .header-container.menu-open~.nav-sections .main-navigation,
    .menu-expand.is-open>ul {
        display: block;
    }

    .header-container.menu-open~.nav-sections #menu-button {
        width: auto;
    }

    .header-container.menu-open~.nav-sections #menu-button span:first-child {
        visibility: hidden;
    }

    .header-container.menu-open~.nav-sections #menu-button span:nth-child(2) {
        transform: rotate(-45deg);
    }

    .header-container.menu-open~.nav-sections #menu-button span:last-child {
        transform: translateY(-8px) rotate(45deg);
    }

    .header-container.menu-open~.nav-sections #menu-button .mmenu-search {
        display: none;
    }

    .loggedin .logout.main-menupoint {
        display: block;
    }

    /* END - main menu mobile and tablet - 10/09/2021 Livia */
}

/* media query up to 699 */
@media (max-width: 699px) {

    /* Prev and next navigation on Blog post page */
    .post-skips {
        margin-left: 10px;
        margin-right: 10px;
    }
}

/* media query up to 683px */
@media (max-width: 683px) {
    /* contractor signup */
    @supports (display: grid) {
        .tradesignup-index-index .block.col13 {
            grid-column: 1;
        }
    }

    /* END contractor signup */
}

/* media query up to 599px */
@media (max-width: 599px) {

    /* login page */
    div.login-popup.login-page {
        padding: 10px 0;
    }

    .customer-account-login .columns .lrc-holder {
        flex-wrap: wrap;
    }

    .customer-account-login .columns .lrc-holder>div {
        flex-basis: 100%;
        margin: 0 0 20px;
        padding: 20px;
    }

    .customer-account-login .columns .lrc-holder>div:last-child {
        margin-bottom: 0;
    }

    .customer-account-login .columns .lrc-holder .button {
        font-size: 15px;
        padding-left: 10px;
        padding-right: 10px;
    }

    /* END login page */

    /* landscape specialist homepage other page layout items */
    .ls_showroom_result_distance,
    .showroom-distance-and-tour .ls_showroom_result_tour {
        margin-bottom: 5px;
    }

    .ls_showroom_result_txt .ls_showroom_result_tour {
        margin-top: 20px;
    }

    .showroom-distance-and-tour .ls_showroom_result_tour {
        margin-top: 0;
    }

    /* END landscape specialist homepage other page layout items */

    /* faqs */
    .lsfp-container {
        display: block;
    }

    .lsfp-list {
        width: 100%;
        display: flex;
        flex-direction: row;
        gap: 24px;
        overflow-y: hidden;
        overflow-x: auto;
        white-space: nowrap;
    }

    .lsfp-entries {
        padding-top: 10px;
        padding-left: 0;
    }

    .lsfp-section {
        padding-left: 10px;
        padding-right: 10px;
    }

    /* END faqs */

    /* basket page table */
    .cart-header,
    .cart-item {
        display: grid;
        grid-template-columns: 3fr 1fr 1fr 1fr;
        gap: 3px;
    }

    .order-history-page .cart-header,
    .order-history-page .cart-item {
        grid-template-columns: 3fr 1fr 1fr 1fr 1fr;
    }

    .cart-item-details {
        width: 100%;
    }

    .cart-item-quantity {
        padding-right: 0 !important;
    }

    .cart-item-quantity .btn-remove {
        display: block;
    }

    /* END basket page table */

    /* footer */
    .ls-footer__payments {
        justify-content: center;
    }

    .ls-footer__socials ul {
        justify-content: center;
    }

    .ls-footer__socials img {
        max-width: 20px;
    }

    /* END footer */
}

/* media query up to 537px */
@media (max-width: 537px) {
    .ls-video-group .swiper:not(.swiper-initialized) .ls-video-group--carousel li {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}

/* media query up to 479px */
@media (max-width: 479px) {

    /* contractor signup */
    .tradesignup-index-index .ls-field-group h2 {
        flex-wrap: wrap;
    }

    .tradesignup-index-index .ls-field-group h2 span {
        width: 100%;
        text-align: right;
        margin-top: 3px;
    }

    /* END contractor signup */
}

/* media query up to 460px */
@media (max-width: 460px) {

    /* what is new section */
    .hp-oct20-grid-container.what-is-new .what-is-new--porcelain-paving .hp-oct20-grid-container--inner {
        padding-top: 115.25%;
    }

    .hp-oct20-grid-container.what-is-new .what-is-new--porcelain-paving .hp-oct20-grid-container--text {
        justify-content: flex-start;
    }

    .hp-oct20-grid-container.what-is-new .what-is-new--porcelain-paving p {
        max-width: 270px;
    }
}

/* media query up to 378px */
@media (max-width: 378px) {
    /* products grid listing */
    @supports (display: grid) {

        .catalog-category-view .products-grid,
        .catalogsearch-result-index .products-grid,
        .catalogsearch-advanced-result .products-grid {
            grid-template-columns: repeat(auto-fill, minmax(262px, 1fr));
        }
    }

    /* END products grid listing */
}

/* media query up to 350px */
@media (max-width: 350px) {
    @supports (display: grid) {
        .ls-field-group .row .block.col13 {
            grid-column: 1;
        }
    }

    /* showrooms and contractor profiles */
    .fwb-inner .ls_box_search_holder form {
        width: 100%;
    }

    .fwb-inner .ls_box_search_holder button {
        margin: 0 0 0 5px;
        padding-left: 10px;
        padding-right: 10px;
    }

    /* END showrooms and contractor profiles */

    /* footer */
    footer #mce-EMAIL {
        min-width: 190px;
    }

    footer #mc-embedded-subscribe {
        font-size: 0.90em;
        padding-left: 10px;
        padding-right: 10px;
    }

    /* END footer */
}

/* media query from 375px */
/* - important: may need max widths added to some of these - important: */
@media (min-width: 375px) {
    .hp-ju20-specials {
        padding-right: 0;
    }
}

/* media query from 420px */
@media (min-width: 420px) {
    html {
        font-size: 0.75rem;
    }

    /* master structure */
    .grid-container,
    .grid-container-lg,
    .breadcrumbs-cont,
    .page-products .breadcrumbs {
        padding-left: 10px;
        padding-right: 10px;
    }

    /* END master structure */
    .noMobilePortrait,
    .nmp {
        display: block !important;
    }

    .nmp-flex {
        display: flex !important;
    }

    .hpt-fix-mid {
        background: none;
    }

    .hp-banner-graphic {
        background-position: center center;
    }

    .ls-section-divider>div {
        max-width: 80%;
    }

    .ls_box_search_outer {
        height: 634px;
        max-height: 80vw;
        /* yes, we're limiting the height by the device's *width* */
    }

    .ls_box_search_holder {
        width: 90%;
        background: var(--color-outer-space);
    }

    .ls_box_shrink {
        height: 400px;
    }

    .ls_box_search_holder input[type="text"] {
        width: 70%;
    }

    .ls_box_search_holder button {
        margin-top: 0;
    }

    .ls_showroom_staff_holder li {
        flex-direction: row;
    }

    .ls_showroom_results_holder li {
        flex-wrap: nowrap;
    }

    .ls_showroom_result_txt h2 {
        font-size: 1.8em;
    }

    .ls_showroom_result_marker img {
        max-width: 50px;
    }

    .opc button,
    .ls-button-style-checkout {
        min-width: 180px;
        padding: 0 2em;
    }

    .product-shop {
        padding: 0 10px;
    }

    .ls-product-quantity-select>div {
        flex-direction: row;
    }

    .grouped-items-table tbody {
        border: 1px solid #D4D4D4;
    }

    .grouped-items-table td,
    .grouped-items-table th {
        padding: 5px 10px;
        font-size: 0.9em;
    }

    @supports (display: grid) {
        .ls-field-group .row {
            grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        }

        .col14 {
            grid-column: 1/4;
            /* full-width */
        }

        .col-expand {
            grid-row: -2;
            /* overridden for smaller screens */
        }

        .back-row {
            grid-row: -1;
        }
    }

    .ls-contractor-gallery {
        height: calc(((100vw - 20px) / 2) - 10px);
        grid-gap: 10px;
    }

    .ls-contractor-experience ul {
        grid-template-columns: repeat(2, auto);
    }

    .ls-contractor-experience li:nth-child(2n+1) {
        background-color: var(--color-mercury);
    }

    .ls-contractor-experience li:nth-child(4n+1),
    .ls-contractor-experience li:nth-child(4n+2) {
        background-color: var(--color-white);
    }
}

/* media query from 568px */
@media (min-width: 568px) {
    .hp-ju20-specials {
        padding-right: 20px;
    }

    .image-boxes {
        flex-direction: row;
    }

    .fb-landscaping h2,
    .fb-showrooms h2 {
        font-size: 2.75em;
    }

    .catList-banner__head {
        margin: -5px 0 5px 0;
    }

    .catList-banner-holder .catList-banner__head h1 {
        font-size: 3.75em;
    }

    .catList-banner-holder .catList-banner__head-price {
        font-size: 3.75em;
    }

    .catList-banner-holder .catList-banner__head-prefix {
        font-size: 3.75em;
    }

    .catList-banner-holder .catList-banner__head-suffix {
        font-size: 1.8em;
    }

    .catList-banner-holder h3 {
        margin: 15px;
        font-size: 1.8em;
    }

    .catList-banner-holder h4 {
        margin: 30px 0 15px 0;
        font-size: 1.5em;
    }

    .catalog-category-view .ls-section-divider {
        margin-bottom: 2em;
    }

    .catalogsearch-result-index .products-grid__sort--holder,
    .catalogsearch-advanced-result .products-grid__sort--holder {
        margin-top: 2em;
    }

    /* colour variation popup with slideshow */
    .color-variation-wrapper .columns {
        grid-template-columns: 300px 1fr;
    }

    .color-variation-wrapper .left .swiper-slide {
        text-align: left;
    }

    .color-variation-wrapper .right {
        order: 2;
    }

    /* END colour variation popup with slideshow */
    .grouped-items-table {
        margin-bottom: 3em;
    }

    .opc-helptext {
        margin: 1em 0;
    }

    .please-wait {
        order: 0;
        width: auto;
    }

    .products-desc__text {
        padding: 0 30px;
    }

    .ls-product-quantity-picker {
        font-size: 120%;
    }

    .ls_contractor_sr_table tr td:first-child,
    .ls_contractor_sr_table tr th:first-child,
    .ls_contractor_sr_table tr td:last-child,
    .ls_contractor_sr_table tr th:last-child {
        display: table-cell;
    }

    .ls_contractor_sr_table .extraData {
        display: none;
    }

    .ls-contractor-details {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .lscd-info {
        flex-basis: 75%;
    }

    .lscd-map {
        flex-basis: 100%;
        margin: 30px 0;
    }

    .lscd-info {
        align-items: flex-start;
        padding: 0 30px;
    }

    .lscd-contact {
        width: 100%;
    }

    .ruled-image-block {
        flex-direction: row;
        justify-content: space-between;
        margin: 0 -2em;
    }

    .ruled-image-block__container {
        margin: 0 2em;
        flex-basis: 33%;
    }

    .hp-ju20-showrooms p {
        display: block;
    }
}

/* media query from 600px */
/* a few infills for landscape mobiles */
@media (min-width: 600px) {
    .nml {
        display: initial !important;
    }

    .hca-top-links {
        position: absolute;
        top: 3px;
        right: 0;
    }

    .hca-top-links li {
        flex-basis: auto;
        margin: 0 15px;
    }

    .hca-top-links li:last-child {
        margin-right: 5px;
    }

    .header-subLinkBar .subLinkBar {
        justify-content: space-between;
        min-height: 80px;
    }

    .subLinkBar li {
        flex-basis: 33%;
        text-align: center;
    }

    .subLinkBar li:first-child {
        text-align: left;
    }

    .subLinkBar li:last-child {
        text-align: right;
    }

    .hp-banner-graphic {
        background-position: center center;
    }

    .lss-free-profile,
    .lss-pack {
        flex-direction: row;
    }

    .lss-fp-right {
        flex-basis: 800px;
        padding: 0 40px;
    }

    .lss-previews {
        padding: 70px;
    }

    .lss-pack-right {
        flex-basis: 800px;
        padding: 0 30px;
    }

    .ls_showroom_results_holder li {
        flex-direction: row;
    }

    .ls_showroom_result_txt {
        padding-left: 30px;
        margin-bottom: 0;
        text-align: left;
    }

    .ls_showroom_result_txt.has-tourLink {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 1rem;
    }

    .showroom-distance-and-tour {
        justify-content: space-between;
        gap: 2rem;
    }

    .ls-pqs h2 {
        display: block;
    }

    .ls-hp-spec-connect,
    .ls-hp-spec-become {
        font-size: 1.6em;
        line-height: 1.2;
    }

    .ls-page__images {
        flex-direction: row;
        margin: 2em 0;
    }

    .products-desc__container {
        margin: 0 0 2em 0;
        flex-direction: row;
        align-items: stretch;
    }

    .grouped-items-table th {
        font-size: 0.85em;
    }

    .ls-product-seal-holder input[type=checkbox] {
        margin-right: 0.75em;
    }

    .order-info-col {
        flex-basis: 360px;
        margin-right: 15px;
    }

    .order-extras li {
        display: flex;
        flex-direction: row;
        font-size: 0.9em;
        margin-bottom: 0.75em;
        line-height: 1.2;
    }

    .order-extras li span:first-child {
        flex-basis: 50%;
        margin-right: 30px;
    }

    .order-extras li span:last-child {
        margin-bottom: 0;
    }

    .lsobm-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        margin: 0;
    }

    .lsobm .opc-helptext {
        margin: 0;
    }

    .cart-header {
        display: block;
        border-bottom: none;
    }

    .cart-header>label {
        border-bottom: 1px solid var(--color-alto-dark);
        padding: 0 0.5em;
        font-size: 0.8em;
        height: 30px;
    }

    .cart-header>label:last-child {
        padding-right: 0;
    }

    .cart-header .cart-item-details {
        display: block;
    }

    .cart-item {
        display: block;
        font-size: 1rem;
    }

    .cart-item>div {
        min-height: 70px;
        padding: 1.5em 0.75em;
    }

    .items-ordered-container .cart-item>div {
        padding-left: 0.4em;
        padding-right: 0.4em;
    }

    .items-ordered-container .cart-item>div:last-child {
        padding-right: 0;
    }

    .cart-item-details {
        width: 65%;
    }

    .sales-order-view .cart-item-details {
        width: 60%;
    }

    .cart-item-details a:first-child,
    .cart-item-img {
        margin-right: 15px;
    }

    .cart-item-details img {
        max-width: 100px;
        max-height: 100px;
    }

    .order-history-page .cart-item-details img {
        min-width: 100px;
    }

    .cart-item input.qty {
        width: 100%;
    }

    .cart-item-units {
        float: left;
        width: 10%;
    }

    .sales-order-view .cart-item-units {
        width: 5%;
    }

    .cart-item-price {
        float: left;
        width: 10%;
    }

    /*.cart-item-price .priceM2{*/
    /*    float:left;*/
    /*    width:10%;*/
    /*    text-align: right;*/
    /*}*/
    .cart-item-quantity {
        float: left;
        width: 13%;
    }

    .cart-item-line-price {
        float: left;
        width: 12%;
        padding-right: 14px;
    }

    .lsobm-checkout-types {
        flex-direction: row;
        margin: 0 -1em 1em -1em;
    }

    .lsobm-checkout-types li {
        margin: 0 1em;
    }

    .login-popup .button,
    .lrc-holder .button,
    .cart-round-button {
        letter-spacing: 0;
    }

    .btn-remove img {
        height: 14px;
        width: auto;
        margin-right: 5px;
    }

    .group::before,
    .cart::before,
    .cart-header::before,
    .cart-item::before,
    .totals-item::before,
    .group::after,
    .cart::after,
    .cart-header::after,
    .cart-item::after,
    .totals-item::after {
        content: '';
        display: table;
    }

    .group::after,
    .cart::after,
    .cart-header::after,
    .cart-item::after,
    .totals-item::after {
        clear: both;
    }

    .group,
    .cart,
    .cart-header,
    .cart-item,
    .totals-item {
        zoom: 1;
    }

    .ls-contractor-experience ul {
        grid-template-columns: repeat(3, auto);
    }

    .ls-contractor-experience li {
        background-color: var(--color-mercury) !important;
    }

    .ls-contractor-experience li:nth-child(6n+4),
    .ls-contractor-experience li:nth-child(6n+5),
    .ls-contractor-experience li:nth-child(6n+6) {
        background-color: var(--color-white) !important;
    }

    .lscd-actions span {
        padding-right: 10px;
    }

    .lscd-actions a {
        flex-direction: row;
        align-items: flex-start;
    }

    .lscd-internets {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }

    .lscd-internets .ls-socialSharing-holder {
        margin-top: 0;
    }

    /* homepage 2021 new for */
    .hp-mar21-newfor {
        grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    }

    /* END homepage 2021 new for */
}

/* media query from 600px until 799px */
@media (min-width: 600px) and (max-width: 1340px) {
    .showroom-distance-and-tour {
        justify-content: flex-end;
        flex-wrap: wrap;
    }

    .showroom-distance-and-tour .ls_showroom_result_tour {
        width: 100%;
        order: 3;
        margin-right: 15px;
        text-align: right;
    }
}

/* media query from 678px */
@media (min-width: 678px) {
    .ls-cu .col-expand {
        grid-column: 1/3;
        grid-row: -2;
    }

    .back-row {
        grid-row: auto;
    }
}

/* media query from 680px */
@media (min-width: 680px) {
    .sample-box__holder {
        display: flex;
        flex-direction: row;
    }

    .sample-box__swatches {
        flex-basis: calc(60% - 20px);
        margin-right: 20px;
    }

    .sample-box__box-holder {
        flex-basis: 40%;
        position: relative;
    }

    .sample-box__box-sticky {
        position: sticky;
        top: -145px;
    }
}

/* media query from 600px up to 1024px */
@media (min-width: 600px) and (max-width: 1024px) {

    /* login page */
    .customer-account-login .columns .lrc-holder>div {
        margin-left: 10px;
        margin-right: 10px;
        padding: 1.9em;
    }

    .customer-account-login .columns .lrc-holder .button {
        padding-left: 20px;
        padding-right: 20px;
    }

    /* END login page */

    /* checkout */
    .checkout-cart-index .cart-round-button {
        font-size: 15px;
    }

    /* END checkout */

    /* faqs */
    .lsfp-list {
        width: 220px;
    }

    .lsfp-entries {
        padding-left: 10px;
    }

    /* END faqs */
}

/* media query from 660px up to 799px */
@media (min-width: 660px) and (max-width: 799px) {

    /* homepage discount 29.06.2021 */
    .hp-oct20-grid-container:not(.hp-mar21-newfor) .hp-oct20-grid-container--text {
        justify-content: space-evenly;
    }

    .hp-oct20-grid-container:not(.hp-mar21-newfor) .hp-oct20-grid-container--text button {
        margin-top: 8px;
    }

    /* what is new section */
    .hp-oct20-grid-container.what-is-new .hp-oct20-grid-container--text h2 {
        line-height: 1;
    }
}

/* media query from 700px */
@media (min-width: 700px) {
    html {
        font-size: 0.75rem;
    }

    /* master structure */
    .cms-home .grid-container,
    .cms-home- .grid-container,
    .cms-home .grid-container-lg,
    .cms-home- .grid-container-lg {
        padding-left: 10px;
        padding-right: 10px;
    }

    /* END master structure */

    /* Structure */
    .wrapper {
        width: 100%;
        padding: 0;
    }

    div.login-popup {
        min-width: 380px;
        max-width: 480px;
        width: auto;
    }

    .ls-connect-search-holder {
        width: 95%;
    }

    .hp-banner-graphic {
        background-position: center center;
    }

    .hp-ju20-specials {
        margin: 1em 0;
        border-radius: 5px;
        padding: 40px;
    }

    .ls-subcategory-masthead {
        flex-flow: row nowrap;
    }

    .ls-subcategory-description {
        width: 50%;
        padding-right: 3em;
    }

    .ls-subcategory-imageHolder {
        width: 50%;
        height: auto;
    }

    .ls-subcategory-fullwidth .ls-subcategory-description {
        width: 33%;
        min-width: 400px;
    }

    .ls-subcategory-fullwidth .ls-subcategory-imageHolder {
        width: 67%;
    }

    .ls_showroom_details_holder {
        flex-direction: row;
        padding: 40px;
    }

    .ls_showroom_features_holder li {
        flex-basis: 160px;
    }

    .ls_showroom_details_col {
        margin-right: 40px;
    }

    .ls_showroom_result_txt {
        flex-basis: 70%;
        padding-top: 20px;
        padding-bottom: 30px;
    }

    .ls_showroom_result_txt.has-tourLink {
        flex-basis: 80%;
    }

    .ls_showroom_tourLink img {
        max-width: 92.46px;
    }

    .ls_showroom_result_img img {
        max-height: 160px;
    }

    .ls_showroom_staff_outer {
        padding: 40px;
    }

    .ls-contractor-head {
        flex-direction: row;
    }

    .ls-contractor-head span {
        flex-basis: 150px;
        white-space: nowrap;
    }

    .ls-ag__twoup {
        grid-column: 2 / 2;
        grid-row: 1 / 3;
    }

    /* ------------------------------------------------------------ */

    .ls-topMenu {
        height: 80px;
        border-bottom: 1px solid var(--color-silver-darker);
        margin-bottom: 40px;
    }

    .ls-product-pop {
        width: 80%;
        max-width: 1360px;
    }

    /* FancyBox popup constrain width... Mobile should be max width, larger devices less... */
    .ls-variations-pop {
        width: calc(100% - 30px);
        max-width: 1360px;
    }

    .hplsb-roundal {
        width: 60%;
        min-width: 300px;
        max-width: 300px;
    }

    .ls-products-grid,
    .catList-descr {
        margin: 0;
    }

    ul.products-grid--brochure li>div {
        flex-direction: row;
    }

    .pgb-actions {
        flex-direction: row;
        margin: 0;
    }

    .ls-brochure__download-button,
    .ls-brochure__download-button:link,
    .ls-brochure__download-button:visited {
        display: flex;
        margin: 0 15px 0 0;
    }

    .hp_feature_landscaping {
        flex-direction: row;
        padding-right: 30px;
        align-items: stretch;
    }

    .hp_fl_monthly {
        margin-right: 40px;
        padding-left: 60px;
        padding-right: 100px;
        text-align: left;
        align-items: flex-start;
    }

    .hp_section-header {
        margin-left: 0;
    }

    .hp-ju20-videos {
        padding: 0;
    }

    .product-name {
        flex-direction: row;
    }

    .product-name h1,
    .product-name span {
        text-align: left;
    }

    .ls-contractor-gallery {
        height: calc(((100vw - 20px) / 2) - 20px);
        grid-gap: 20px;
    }

    .ls-opc-review .field {
        flex-direction: row;
    }

    .ls-opc-review .form-list-review .control {
        margin-top: 0;
        text-align: right;
        align-items: center;
        align-self: flex-end;
        margin-left: auto;
        justify-content: flex-end;
    }

    .lss-charity {
        flex-direction: row;
        padding: 0 80px;
    }

    .std .lss-charity p {
        margin: 0 40px;
    }

    .ls-page__trade>div {
        flex-direction: row;
    }

    .ls-page__trade-logos {
        margin: 0 0 0 60px;
    }

    /* why use a professional designer/landscaper pages only */
    .cms-why-use,
    .cms-why-use- {
        flex-direction: row;
        align-items: flex-start;
    }

    .cms-why-use__nom,
    .cms-why-use__nom- {
        display: flex;
    }

    .cms-why-use__fifty,
    .cms-why-use__fifty- {
        flex-direction: row;
    }

    .cms-why-use__footer,
    .cms-why-use__footer- {
        flex-direction: row;
    }

    .cms-why-use__logo,
    .cms-why-use__logo- {
        width: 40%;
        margin: 0 30px 0 0;
        max-width: 100%;
    }

    .cms-why-use__photoCol,
    .cms-why-use__photoCol- {
        margin-right: 40px;
        flex-basis: 20vw;
        flex-shrink: 0
    }

    /* moodboard monday */
    .mbm-jb__left {
        flex-direction: column;
        justify-content: space-between;
        max-width: 280px;
        min-width: 280px;
        margin-right: 40px;
        font-size: 1.3em;
        line-height: 1.2;
    }

    .mbm-jb__cols {
        flex-direction: row;
    }

    .mbm-jb__text::before {
        content: '';
        width: 50vw;
        height: 1px;
        border-top: 1px dashed #676767;
        position: absolute;
        top: -20px;
        left: 0;
        z-index: -1;
    }

    /* sub-category type for special brochure listing - 24/06/2021 Livia */
    .products-grid--brochure .ls-grid-image--brochure img {
        width: 260px;
    }
}

/* media query from 768px */
@media (min-width: 768px) {
    /* portrait tablets and above... TIES IN WITH GRID SYSTEM */

    .banner-message__nom {
        display: block;
    }

    .banner-message__nod {
        display: none;
    }

    /* shared core styles */
    .page-products .breadcrumbs ul li:not(:last-child) a::after {
        content: "\002F";
    }

    /* END shared core styles */

    /* header */
    header {
        z-index: 1002;
    }

    .header-container .block-search {
        width: 100%;
        flex-basis: 90%;
        margin-bottom: 0;
        padding: 0 30px 0 0;
        position: static;
        top: 0;
        left: 0;
        display: block;
    }

    .header-container .block-content .field.search {
        background: var(--color-white);
        border: 1px solid #c1c1c1;
        border-radius: 0;
    }

    /* END header */

    /* mobile menu to desktop menu transition */
    .mobile-margin-b {
        margin-bottom: 0;
    }

    .header-container {
        flex-direction: row;
        height: 107px;
    }

    .hc-logo-container {
        margin-bottom: 7px;
        flex-basis: 175px;
        min-width: 205px;
    }

    .hc-logo-container img {
        max-width: 165px;
        width: 165px;
    }

    .hc-actions-container {
        padding: 0;
    }

    .hca-top-links {
        right: 10px;
        display: block;
    }

    .hca-top-links ul {
        justify-content: flex-end;
    }

    .hca-strapline {
        flex-basis: 40%;
        margin-bottom: 0;
        max-width: 250px;
    }

    .head-trade-bar {
        color: var(--color-mine-shaft);
        width: 310px;
        margin: 0;
        padding-left: 15px;
        border-radius: 12px 0 0 0;
        background-color: var(--color-gallery);
        position: absolute;
        right: 0;
        bottom: -10px;
    }

    .welcome-msg {
        display: block;
    }

    .hca-aa-icons li a,
    .hca-aa-icons a[title="My Account"] {
        width: 54px;
        height: 32px;
    }

    .hca-aa-icons .ls-basket-icon {
        width: 34px;
        height: 32px;
    }

    .hca-aa-icons li a.top-link-cart,
    .hca-aa-icons .minicart-wrapper {
        padding-right: 0;
        padding-left: 10px;
    }

    .ls-basket-count {
        font-size: 12px;
        width: 17px;
        height: 17px;
        bottom: -8.5px;
        right: 0;
    }

    .header-sep {
        display: block;
    }

    .logo img {
        margin-right: 30px;
    }

    .ls-mobile-quicklinks {
        display: none;
    }

    .hp_feature-showrooms {
        flex-direction: row;
    }

    .hp_feature-showroom-right {
        display: flex;
    }

    .hp_feature-showroom-left {
        margin-right: 0;
    }

    .std .catList-banner-holder {
        margin-top: -52px;
    }

    .hp-dr-holder {
        justify-content: space-between;
        flex-flow: nowrap;
        margin-left: 0px;
        margin-right: 0px;
    }

    .hp_twitter_feed-container {
        flex-grow: 0;
    }

    .ls-contractor-sb-top {
        padding: 20px;
    }

    .ls-connect-search-holder {
        flex-direction: row;
        padding: 0;
        min-width: 730px;
        height: 60px;
    }

    .ls-connect-search-holder h2 {
        font-size: 1.5em;
        margin: 0 2em;
    }

    .ls-connect-search-holder div {
        margin-right: 15px;
    }

    .ls-connect-search-holder input {
        width: 180px;
    }

    .lsqp #quantityPicker {
        font-size: 0.8em;
    }

    .lsqp .row label:first-child {
        flex-basis: 50%;
        margin-right: 15px;
        min-width: 150px;
    }

    .ls-ctu ul {
        flex-direction: row;
    }

    .ls-ctu li {
        margin-right: 30px;
        margin-bottom: 0;
    }

    .ls-cr li {
        flex-direction: row;
        align-items: flex-start;
        text-align: left;
    }

    .ls-flex-text-icons {
        flex-wrap: nowrap;
    }

    .ls-hp-spec-connect,
    .ls-hp-spec-become {
        margin-bottom: 0;
        height: 200px;
    }

    .products-grid__sort--holder,
    .products-grid__sort--sort-holder {
        border: none;
    }

    .products-grid__sort--holder {
        margin-bottom: 40px;
    }

    .products-grid__sort--sort-holder {
        font-size: 18px;
        border: 1px solid var(--color-silver-dark);
        border-radius: 5px;
        max-width: 250px;
    }

    .products-grid__sort--display-holder {
        display: none;
    }

    .products-grid__sort--sort-holder ul {
        top: 35px;
    }

    .new-product .ls-pn-carousel-sticky::before,
    .ls-products-grid .new-product::before,
    .disc-product .ls-pn-carousel-sticky::after,
    .ls-products-grid .disc-product>div::before {
        font-size: 20px;
        letter-spacing: 5px;
        height: 28px;
    }

    .new-product .ls-pn-carousel-sticky::before {
        top: 0;
        left: 0;
        border-radius: 5px 0 0 0;
    }

    .disc-product .ls-pn-carousel-sticky::after {
        top: 0;
        border-radius: 0 5px 0 0;
    }

    /* marketing tags */
    .ls-grid-mtag {
        font-size: 16px;
        letter-spacing: 4px;
    }

    .product-page-marketing-tag .ls-grid-mtag {
        font-size: 14px;
    }

    /* END marketing tags */

    /* product details / product view */
    .products-grid__sort--holder::before,
    .products-grid__sort--holder::after {
        display: none;
    }

    /* full bc for tablet portrait upwards */
    .breadcrumbs {
        margin: 0 0 20px 0;
    }

    .breadcrumbs li {
        display: inline;
    }

    .breadcrumbs li span {
        display: inline;
    }

    .breadcrumbs li::before {
        content: '';
    }

    /* colour variation popup with slideshow */
    .color-variation-wrapper {
        margin: 10px auto;
    }

    .color-variation-wrapper .columns {
        grid-template-columns: 440px 1fr;
    }

    .color-variation-wrapper .left img {
        width: 440px;
        height: 440px;
    }

    /* END colour variation popup with slideshow */
    .product-shop {
        padding-right: 10px;
    }

    .ls-pn-container {
        flex-direction: row;
    }

    .ls-pn-container .prod-m-only {
        display: none;
    }

    .ls-pn-container h2:first-child,
    .ls-pn-details .ls-pn-price {
        display: block;
    }

    h2.products_section-header {
        font-size: 20px;
        letter-spacing: 6px;
    }

    .ls-pn-details h2:not(:first-child) {
        text-align: left;
        padding: 0;
        margin: 40px 0 25px 0;
    }

    .ls-pn-details h2:not(:first-child) span {
        padding: 0;
    }

    .ls-pn-details h2:not(:first-child)::after {
        content: unset;
    }

    .ls-pn-details h2.optavail {
        text-align: left;
        padding: 0;
        margin: 40px 0 25px 0;
    }

    .ls-pn-details h2.optavail span {
        padding: 0;
    }

    .ls-pn-details h2.optavail:after {
        content: unset;
    }

    .ls-pn-carouselWrapper {
        width: 40%;
        flex-wrap: wrap;
        margin-right: 5px;
    }

    .ls-pn-carousel-sticky {
        position: sticky;
        top: 5px;
    }

    .ls-pn-detailsWrapper {
        width: 60%;
        flex-wrap: wrap;
        margin-left: 5px;
    }

    .carouselGallery li img {
        border-radius: 5px;
    }

    .ls-product-cg .swiper-gallery {
        margin-bottom: 19px;
    }

    .ls-pn-del {
        flex-direction: row;
        align-items: center;
        border-bottom: 1px solid var(--color-silver);
        padding-bottom: 20px;
    }

    .ls-pn-del+.ls-pn-del {
        padding-top: 20px;
    }

    .ls-pn-del>span:first-child {
        margin: 0 40px 0 0;
        padding: 0;
        width: unset;
        border: none;
        font-size: 1em;
        font-size: clamp(16px, 2.5vw, 20px);
        letter-spacing: 0.5px;
    }

    .ls-pn-del.has-co-info>span:first-child {
        margin-right: 30px;
    }

    .ls-pn-del>span:last-child {
        margin: 0;
        padding: 0;
        width: unset;
        border: none;
        font-size: clamp(16px, 2.5vw, 20px);
        letter-spacing: 0.5px;
    }

    .ls-pn-del>span:first-child img {
        max-height: 34px;
    }

    .ls-pn-del>span:last-child img {
        max-height: 35px;
    }

    .ls-pn-del img {
        flex-basis: unset;
    }

    .ls-pn-del sup {
        display: inline;
    }

    .co-info {
        font-size: clamp(16px, 2.5vw, 20px);
        letter-spacing: 0.5px;
        width: auto;
        padding: 0;
        border-bottom: none;
    }

    .co-info-logo,
    .ls-pn-del .co-info-logo {
        max-height: 34px;
        margin-right: 15px;
    }

    .ls-pn-del.has-co-info>span:nth-child(3) {
        margin-top: 20px;
        padding-top: 20px;
        border-top: 1px solid var(--color-silver);
    }

    .co-info.no-lead-time {
        width: 100% !important;
        margin: 0 0 20px !important;
        padding-bottom: 20px !important;
        border-bottom: 1px solid var(--color-silver) !important;
    }

    .ls-product-testimonials {
        margin-left: 0;
        margin-right: 0;
    }

    .ls-product-testimonial {
        padding: 25px;
    }

    .ls-product-testimonial::before {
        left: 7.5%;
    }

    .ls-product-testimonial__txt>span {
        font-size: clamp(12px, 12px + 0.5vw, 20px);
    }

    .ls-product-testimonial__strap {
        padding-left: 25px;
        padding-right: 25px;
    }

    .ls-product-testimonial__strap,
    .ls-product-testimonial__strap a {
        font-size: 16px;
    }

    .ls-pn-pp-promo span:last-child {
        padding: 0 0 10px 0;
    }

    .ls-product-cg--enlarge {
        margin: 2em;
    }

    .ls-product-cg--enlarge button {
        border: 1px solid #9F9F9F;
    }

    .ls-product-nameblock {
        font-size: 1em;
    }

    .grouped-items-table {
        width: 100%;
        margin: 0;
    }

    .grouped-items-table td,
    .grouped-items-table th {
        font-size: 16px;
        font-size: clamp(12px, 1.5vw, 16px);
    }

    .grouped-items-table th {
        font-size: 16px;
        font-size: clamp(12px, 1.5vw, 16px);
        padding-top: 20px;
        padding-bottom: 12px;
        text-align: right;
    }

    .ls-product-quantity-select {
        transform: scale(1.1);
    }

    .table-head-with-help img {
        width: 16px;
        height: 16px;
    }

    .ls-pn-extras-wrapper {
        margin: 30px 0;
    }

    .ls-pn-extras {
        padding-left: 0;
        padding-right: 0;
    }

    .ls-pn-extras .products_section-header {
        width: 100%;
        margin-left: 0;
    }

    .add-to-box {
        flex-direction: row;
        justify-content: flex-end;
        align-items: flex-end;
        margin: 50px 0 25px 0;
    }

    .add-to-box button {
        padding-left: 16px;
        padding-right: 16px;
        max-width: 220px;
        white-space: nowrap;
        width: unset;
    }

    .add-to-cart {
        margin-left: 50px;
    }

    .ls-pn-qp-calc {
        margin: 14px 40px 54px 0;
        display: flex;
        justify-content: flex-end;
    }

    .tab-label {
        letter-spacing: 0.2em;
    }

    /* checkout */
    .opc .active .step-title h2::after {
        font-size: 1rem;
    }

    .opc .addresses li {
        flex-basis: 220px;
        min-width: 220px;
        max-width: 280px;
    }

    .ls-cat-head h1 {
        letter-spacing: 0.3em;
    }

    /* main menu desktop - 10/09/2021 Livia */
    .header-container {
        padding-top: 15px;
    }

    #menu-button {
        display: none;
    }

    .banner-message {
        position: relative;
        z-index: 1003;
    }

    .shadow-modal {
        background: rgba(0, 0, 0, 0.4);
        transition: all 100ms ease 120ms;
    }

    .main-wrapper {
        padding-left: 10px;
        padding-right: 10px;
    }

    .menu-relative {
        padding-top: 15px;
    }

    .menu-relative .hca-top-links {
        right: 20px;
    }

    .main-navigation {
        display: flex;
        justify-content: space-between;
        align-items: stretch;
        position: relative;
        margin-top: 11px;
    }

    .main-navigation::before,
    .main-navigation::after {
        content: "";
        display: block;
        width: 100vw;
        height: 1px;
        background: var(--color-seashell);
        position: absolute;
        left: calc(50% - 50vw);
        z-index: -1;
    }

    .main-navigation::before {
        top: -1px;
    }

    .main-navigation::after {
        bottom: -1px;
    }

    .main-navigation~.header-sep {
        margin-top: 0;
    }

    .main-navigation .wide-hide {
        display: none;
    }

    .main-navigation li {
        line-height: 1.6em;
    }

    .main-navigation a {
        font-size: clamp(12px, 1.5vw, 18px);
        letter-spacing: -0.03em;
    }

    .main-navigation a em {
        font-weight: bold;
    }

    .main-menupoint {
        display: flex;
        flex-direction: column;
        justify-content: center;
        background: var(--site-background-color);
        transition: all 100ms ease 120ms;
    }

    .main-menupoint>a {
        display: flex;
        align-items: center;
        min-height: 100%;
        line-height: 1;
        text-align: center;
        padding: 9px 0.25em 10px;
        position: relative;
        z-index: 1004;
    }

    .main-menupoint>a::before {
        content: "";
        position: absolute;
        left: 0;
        top: 3px;
        height: calc(100% - 2px);
        width: 100%;
        border: 1px solid var(--color-silver-darkest);
        border-bottom-color: var(--color-white);
        opacity: 0;
        transition: all 100ms ease 120ms;
    }

    .main-menupoint.is-open>a::before {
        opacity: 1;
    }

    .main-navigation #menu_sale {
        display: none;
    }

    .main-navigation #menu_sale a {
        position: relative;
    }

    .main-navigation #menu_sale a::after {
        content: "";
        display: block;
        width: 0;
        height: 1px;
        background: var(--color-totem-pole);
        position: absolute;
        top: calc(100% - 10px);
        left: 0.25em;
        transition: width 0.25s ease;
    }

    .main-navigation #menu_sale a:hover::after,
    .main-navigation #menu_sale a:focus::after {
        width: calc(100% - 0.50em);
    }

    .main-menupoint>ul {
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-right: 10px;
        padding: 15px 0;
        background: var(--site-background-color);
        border-bottom: 1px solid var(--color-silver-darkest);
        border-left: 1px solid var(--color-silver-darkest);
        border-right: 1px solid var(--color-silver-darkest);
        display: flex;
        flex-direction: column;
        align-content: flex-start;
        flex-wrap: wrap;
        max-height: 630px;
        position: absolute;
        top: calc(100% + 1px);
        left: 0;
        z-index: 1001;
        transition: all 100ms ease 120ms;
        visibility: hidden;
        opacity: 0;
    }

    .main-menupoint>ul>li {
        min-width: min(20%, 175px);
        line-height: 1.6em;
        margin: 0.8em 1em;
    }

    .main-menupoint.is-open>a,
    .main-menupoint>ul>li>a,
    .main-menupoint>ul>li a:hover {
        color: var(--color-black);
    }

    .main-menupoint>ul>li>a,
    .main-menupoint>ul>li a:hover {
        text-decoration: underline;
    }

    .main-menupoint.is-open>ul {
        visibility: visible;
        opacity: 1;
    }

    /* END - main menu desktop - 10/09/2021 Livia */

    /* order history page */



    .order-history-title .title-and-print {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1em;
    }

    .order-history-title .title-and-print h1 {
        margin-right: 10px;
        margin-bottom: 0;
    }

    .order-history-title .title-and-print .rectangle-button {
        flex-shrink: 0;
        margin-bottom: 0 !important;
    }

    /* END order history page */
}

@media (min-width: 1280px) {

    /* new footer 24 */
    .pre-footer-container {

        margin: 50px 0 0 0;

        padding: 50px 0 40px 0;

    }

    .footer__cols {}

    .footer__cols-group {

        margin: 0;

        color: var(--color-black);

        display: grid;

        grid-gap: 45px;

        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

    }

    .footer__cols .footer__cols-group {

        display: grid;

        text-align: left;

    }

    .footer__cols h5 {

        font-size: 1em;

        letter-spacing: 0.1em;

        margin: 0;

        border: none;

        cursor: default;

        justify-content: flex-start;

    }

    .footer__cols h5::after {

        content: '';

    }

    .ls-footer__payments ul {

        grid-template-columns: minmax(23px, 44px) minmax(23px, 44px) minmax(23px, 44px) minmax(60px, 114px) minmax(60px, 30px) minmax(60px, 30px);

        grid-gap: clamp(12px, calc(6px + 1vw), 24px);

    }

    .ls-footer__payments-and-socials {

        grid-template-columns: auto minmax(2px, 40px) auto;

    }

    .ls-footer__payments {

        justify-items: end;

    }

    .ls-footer__payments-and-socials .ls-footer__sep {

        display: grid;

    }
}

/* END new footer 24*/
/* media query from 800px */
@media (min-width: 800px) {
    .hp_section-header {
        margin: 2.5em 0 1em 10px;
    }

    .hp-banner-guarantee {
        left: 2%;
        bottom: 10%;
        width: 10%;
        height: 28%;
    }

    /* homepage 2021 new for */
    .hp-mar21-newfor .hp-oct20-grid-container--inner {
        min-height: 260px;
    }

    /* END homepage 2021 new for */
    .ls_showroom_results_holder .ls_showroom_result_img {
        flex-shrink: 0;
    }
}

/* media query from 844px */
@media (min-width: 844px) {
    @supports (display: grid) {
        .ls-field-group .row {
            grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        }
    }
}

/* media query from 893px */
@media (min-width: 893px) {

    /* ls gallery styles - product page */
    .embedded-video-16-9 {
        width: 45vw;
        height: 25.3125vw;
        /* 45*9/16 */
        margin-left: 2vw;
        margin-right: 2vw;
    }
}

/* media query from 900px */
@media (min-width: 900px) {
    .ls-lsGalleryGrid-wrapper {
        height: calc(((100vw - 20px) / 2) - 20px);
        max-height: 670px;
        grid-gap: 20px;
    }

    .ls-contractor-details {
        flex-wrap: nowrap;
    }

    .lscd-info {
        flex-basis: 50%;
    }

    .lscd-map {
        flex-basis: 25%;
        margin: 0;
    }

    .footer-icons--holder {
        bottom: 10px;
        right: 10px;
        width: 70px;
    }

    .footer-icons--holder div {
        width: 50px;
        height: 50px;
    }

    .footer-icons--holder .smaller-home-icon img {
        width: 36px;
        height: 36px;
    }
}

/* media query from 920px */
@media (min-width: 920px) {
    html {
        font-size: 0.85rem;
    }

    .grid-parent {
        padding-left: 0;
        padding-right: 0;
    }

    /* homepage banner top */
    .hp-banner-top__text .hp-banner-top__paypalcontainer {
        width: auto;
        flex-grow: unset;
        flex-basis: 474px;
    }

    /* END homepage banner top */
    /* Homepage */
    .hpt-shrink img {
        max-height: 320px;
        max-width: 320px;
    }

    .hp-banner-bottom {
        height: 80px;
    }

    .hp-banner-bottom-text img {
        max-height: 36px;
    }

    .hp-dr-holder li {
        max-width: 100px;
    }

    .ls_showroom_features_holder li {
        max-width: 100%;
    }

    .hpcb-ig-image {
        height: 366px;
    }

    .hp-landscapers-searchbox {
        padding: 30px 200px 50px 200px;
    }

    .fb-ls-join {
        padding: 25px 30px;
        flex-grow: 0
    }

    .hp-ju20-showrooms--holder {
        flex-direction: row;
        margin-top: 60px;
        margin-bottom: 5.56em;
        /* spacing change 02.05.2023 */
    }

    .hp-ju20-showrooms {
        border-radius: 5px;
    }

    .hp-ju20-videos {
        margin-left: 50px;
        margin-top: 0;
        min-width: 580px;
        display: flex;
    }

    .hp-ju20-videos__mobile-only {
        display: none;
    }

    .ls-product-pop__variation {
        width: 70%;
        min-width: 320px;
        max-width: 800px !important;
        border-radius: 12px;
    }

    .lss-fp-right {
        flex-basis: 600px;
    }

    .ls-pn-carouselWrapper {
        width: 50%;
    }

    .ls-pn-detailsWrapper {
        width: 50%;
    }

    .ls-pn-details {
        border: 1px solid var(--color-gallery);
        padding: 10px;
        border-radius: 5px;
    }

    /* contractor signup */
    .tradesignup-index-index .grid-100>.ls-field-group:first-child>h2 {
        margin-bottom: 2.2em;
    }

    /* END contractor signup */
}

/* media query from 950px - need this line if we have the 5th footer column */
/* @media (min-width: 950px) {
	.footer__cols {
		grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr) minmax(240px, 0.5fr);
	}
} */
/* media query from 1000px up to 1199px */
@media (min-width: 1000px) and (max-width: 1199px) {

    /* homepage discount 29.06.2021 */
    .hp-oct20-grid-container:not(.hp-mar21-newfor) .hp-oct20-grid-container--text {
        justify-content: space-evenly;
        padding-top: 8px;
        padding-bottom: 5px;
    }

    .hp-oct20-grid-container:not(.hp-mar21-newfor) .hp-oct20-grid-container--text button {
        margin-top: 8px;
    }
}

/* media query from 1025px */
@media (min-width: 1025px) {
    html {
        font-size: 1rem;
    }

    /* header */
    .header-container .block-search {
        max-width: 480px;
    }

    /* END header */
    /* Structure */
    .ls-connect-search-holder {
        width: 80%;
        min-width: 980px;
    }

    .ls-contractor-sb-top {
        padding: 40px;
    }

    .product-shop {
        padding-right: 15px;
    }

    .ls-product-quantity-picker {
        font-size: 100%;
    }

    .lsqp .row label:first-child {
        margin-right: 10px;
        min-width: 130px;
    }

    /* Coupon Discount in Cart */
    .discount {
        margin-top: 92px;
    }

    .checkout-onepage-index .grid-70,
    .lsobm .grid-70,
    .category-brochure-request .grid-70 {
        padding-right: 1em;
    }

    .ls-dashboard {
        padding-right: 4em;
    }

    .ls-subcategory-accred {
        visibility: hidden;
        opacity: 0;
        background-color: transparent;
    }

    .catList-banner-holder:hover .ls-subcategory-accred {
        visibility: visible;
        opacity: 1;
        background-color: rgba(0, 0, 0, 0.44);
    }

    .mbm-jb__left {
        margin-right: 80px;
    }

    .product-carousel__image-holder img {
        max-height: 175px;
        min-height: 175px;
    }

    /* homepage banner top */
    .hp-banner-top__text li {
        opacity: 1;
        visibility: visible;
        transition: none;
        flex-grow: 0;
        position: relative;
        width: auto;
        height: auto;
        margin-right: 0;
    }

    .hp-banner-top__text li.hp-banner-top__text--sep {
        width: 8px;
        height: 25px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .hp-banner-top__text--sep div {
        width: 0;
        height: 25px;
        border-left: 1px solid #707070;
    }

    .hp-banner-top__paypal {
        width: 100%;
    }

    .hp-banner-top__whatsapp span {
        font-size: 12px;
    }

    /* END homepage banner top */
    /* what is new section */
    .hp-oct20-grid-container.what-is-new .what-is-new--porcelain-paving h2 {
        letter-spacing: 4.5px;
    }

    .hp-oct20-grid-container.what-is-new .what-is-new--porcelain-paving p {
        letter-spacing: 0.8px;
    }

    /* end what is new section */
    /* product page */
    .ls-pn-del.has-co-info>span:first-child {
        margin-right: 40px;
    }

    /* END product page */
    /* marketing tags */
    .product-page-marketing-tag .ls-grid-mtag {
        font-size: 16px;
    }

    /* END marketing tags */
    /* product highlights */
    .hp-oct20-grid-container--inner .hp-oct20-grid-container--text img {
        max-width: 100%;
    }

    /* END product highlights */
}

/* media query from 1200px */
@media (min-width: 1200px) {
    .product-shop {
        padding-right: 45px;
    }

    .ls-grid-price {
        letter-spacing: 0.1em;
    }

    .lsqp .row label:first-child {
        margin-right: 15px;
        min-width: 150px;
    }

    /* product details new april 2020 */
    .ls-pn-carouselWrapper {
        margin-right: 10px;
    }

    .ls-pn-detailsWrapper {
        margin-left: 10px;
    }

    .ls-pn-details {
        padding: 15px 20px 20px 20px;
    }

    .grouped-items-table th {
        white-space: nowrap;
    }

    input.qty {
        width: 72px;
    }

    .login-popup .button,
    .lrc-holder .button,
    .cart-round-button {
        letter-spacing: 0.2em;
    }

    .cart-round-button:not(#product-addtocart-button):disabled {
        letter-spacing: 0.1em;
    }

    .hp-oct20-grid-container--text button {
        border-radius: 42px;
        height: 40px;
        font-size: 20px;
        letter-spacing: 2px;
        padding: 5px 20px;
    }

    .hp-oct20-grid-container {
        grid-gap: 40px;
        margin: 0 40px;
        grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    }

    /* homepage discount 29.06.2021 */
    .hp-oct20-grid-container:not(.hp-mar21-newfor) .discount10::before {
        font-size: 20px;
        letter-spacing: 5px;
        height: 28px;
    }

    .footer__cols {
        /*grid-column-gap: 70px;*/
    }

    .ls_showroom_result_txt.has-tourLink {
        flex-basis: 77%;
    }

    .ls_showroom_tourLink span {
        display: block;
    }

    .showroom-distance-and-tour .ls_showroom_tourLink span {
        display: none;
    }

    /* homepage banner top */
    .hp-banner-top__text li {
        margin-right: 0.5em;
    }

    .hp-banner-top__text li.hp-banner-top__text--sep {
        width: 40px;
    }

    .hp-banner-top__text .hp-banner-top__whatsapp {
        gap: 16px;
    }

    .hp-banner-top__whatsapp span {
        font-size: clamp(12px, 1.4vw, 15px);
    }

    /* end homepage banner top */
}

/* media query from 1205px */
@media (min-width: 1205px) {
    .sample-box__swatches {
        flex-basis: calc(60% - 80px);
        margin-right: 80px;
    }

    .sample-box__box-sticky {
        position: sticky;
        top: -210px;
        padding: 45px 50px 45px 50px;
    }

    .sample-box__box-simple {
        padding: 45px 50px 45px 50px;
    }

    .sample-box__cat-list__sample-grid {
        grid-gap: 30px;
        grid-template-columns: repeat(auto-fill, minmax(190px, 2fr));
    }
}

/* media query from 1260px */
@media (min-width: 1260px) {

    /* main menu desktop and mobile too ( and some header styles ) */
    .menu-hide-on-desktop {
        display: none;
    }

    .has-banner-img .banner-img-container {
        display: block;
        width: 377px;
        height: calc(100% - 30px);
        margin: 0;
        position: absolute;
        top: 15px;
        right: 15px;
        z-index: 10;
        text-align: center;
    }

    .has-banner-img .banner-img-container>div {
        height: 100%;
        display: block;
        background-repeat: no-repeat;
        background-position: 50% 0;
        background-size: cover;
        position: relative;
    }

    #paving .has-banner-img .banner-img-container>div {
        background-image: url("https://d3przyomkgkv0c.cloudfront.net/fit-in/378x566/filters:format(.webp)/filters:quality(75)/mediadev/media/menu/porcelain_paving_menubanner2024.jpg");
    }

    .has-banner-img .banner-img-container>div a {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .has-banner-img .banner-img-container div div {
        padding: 20px 26px;
    }

    .has-banner-img .banner-img-container p {
        font-family: var(--font-text-regular);
        color: var(--color-white);
    }

    .has-banner-img .banner-img-container .banner-img-title {
        font-size: 25px;
        line-height: 35px;
        letter-spacing: 3.75px;
        text-transform: uppercase;
        margin-bottom: 16px;
    }

    .has-banner-img .banner-img-container .banner-img-text {
        max-width: 321px;
        margin-left: auto;
        margin-right: auto;
        font-size: 16px;
        line-height: 21px;
        letter-spacing: normal;
    }

    /* end main menu desktop and mobile too ( and some header styles ) */
    /* what is new section */
    .hp-oct20-grid-container.what-is-new .what-is-new--porcelain-paving {
        grid-column: span 2;
    }

    .hp-oct20-grid-container.what-is-new .what-is-new--porcelain-paving .hp-oct20-grid-container--inner {
        padding-top: 0;
        height: 100%;
    }

    .hp-oct20-grid-container.what-is-new .hp-oct20-grid-container--inner h2 {
        line-height: 1.3;
    }
}

/* media query from 1302px */
@media (min-width: 1302px) {
    @supports (display: grid) {
        .ls-cu .col-expand {
            grid-column: auto;
            grid-row: auto;
        }
    }

    .showroom-distance-and-tour {
        align-items: flex-end;
    }
}

/* media query from 1341px */
@media (min-width: 1341px) {
    .has-tourLink-searchpage .ls_showroom_result_txt {
        flex-basis: 54.8%;
    }

    .showroom-distance-and-tour .ls_showroom_tourLink span {
        display: block;
    }
}

/* media query from 1400px */
@media (min-width: 1400px) {
    .lsqp #quantityPicker {
        font-size: 1em;
    }

    .lsqp .row label:first-child {
        flex-basis: 50%;
        margin-right: 15px;
        min-width: 160px;
    }

    .ls-headed-group ul {
        justify-content: space-between;
    }

    .ls-account-group,
    .credit-visible .ls-account-group {
        grid-template-columns: repeat(3, 1fr);
    }

    .ls-ag__twoup {
        grid-column: 3 / 3;
        grid-row: 1 / 3;
    }

    .ls-pn-carouselWrapper {
        margin-right: 15px;
    }

    .ls-pn-detailsWrapper {
        margin-left: 15px;
    }

    .ls-pn-details {
        padding: 25px 30px 30px 30px;
    }

    .grouped-items-table td:first-child {
        padding-left: 20px;
    }

    .grouped-items-table td,
    .grouped-items-table th {
        letter-spacing: 0.03em;
    }

    .hp-ju20-showrooms div {
        padding: 60px;
        font-size: 2.8em;
        letter-spacing: 0.2em;
    }

    .catalog-category-view .products-grid,
    .catalogsearch-result-index .products-grid {
        grid-gap: 50px;
    }

    /* homepage discount 29.06.2021 */
    .hp-oct20-grid-container:not(.hp-mar21-newfor) .discount10::before {
        height: 35px;
    }
}

/* media query from 1580px */
@media (min-width: 1580px) {
    .ls-pn-container {
        padding: 0 10px;
    }

    .breadcrumbs {
        margin: 15px 11px 20px 11px;
        /* was 15px 11px 40px 11px	*/
    }

    .breadcrumbs.search-result-breadcrumbs {
        margin: 35px 11px 55px 11px;
    }
}

/* media query from 1600px */
@media (min-width: 1600px) {

    /* mobile menu to desktop menu transition */
    .head-trade-bar {
        right: 10px;
    }

    /* END mobile menu to desktop menu transition */
}

/* media query from 1610px */
@media (min-width: 1610px) {

    .hp-banner-holder .swiper-button-next,
    .hp-banner-holder .swiper-button-prev {
        display: none;
    }

    .hp-oct20-grid-container--text h2 {
        font-size: 30px;
        letter-spacing: 4.5px;
        margin: 0 !important;
    }

    .checkout-onepage-index .grid-70,
    .lsobm .grid-70,
    .category-brochure-request .grid-70 {
        padding-right: 4em;
    }

    .cart-header>label {
        padding: 0 1.5em;
        font-size: 1.1em;
    }

    .items-ordered-container .cart-item>div {
        padding-left: 1.65em;
        padding-right: 1.65em;
    }

    .product-carousel__image-holder img {
        max-height: 270px;
        min-height: 270px;
    }
}

/* jquery.fancybox.min */
body.compensate-for-scrollbar {
    overflow: hidden;
}

.fancybox-active {
    height: auto;
}

.fancybox-is-hidden {
    left: -9999px;
    margin: 0;
    position: absolute !important;
    top: -9999px;
    visibility: hidden;
}

.fancybox-container {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    height: 100%;
    left: 0;
    outline: none;
    position: fixed;
    -webkit-tap-highlight-color: transparent;
    top: 0;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%;
    z-index: 99992;
}

.fancybox-container * {
    box-sizing: border-box;
}

.fancybox-bg,
.fancybox-inner,
.fancybox-outer,
.fancybox-stage {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.fancybox-outer {
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
}

.fancybox-bg {
    background: #1e1e1e;
    opacity: 0;
    transition-duration: inherit;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.47, 0, .74, .71);
}

.fancybox-is-open .fancybox-bg {
    opacity: .9;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1);
}

.fancybox-caption,
.fancybox-infobar,
.fancybox-navigation .fancybox-button,
.fancybox-toolbar {
    direction: ltr;
    opacity: 0;
    position: absolute;
    transition: opacity .25s ease, visibility 0s ease .25s;
    visibility: hidden;
    z-index: 99997;
}

.fancybox-show-caption .fancybox-caption,
.fancybox-show-infobar .fancybox-infobar,
.fancybox-show-nav .fancybox-navigation .fancybox-button,
.fancybox-show-toolbar .fancybox-toolbar {
    opacity: 1;
    transition: opacity .25s ease 0s, visibility 0s ease 0s;
    visibility: visible;
}

.fancybox-infobar {
    color: var(--color-silver);
    font-size: 13px;
    -webkit-font-smoothing: subpixel-antialiased;
    height: 44px;
    left: 0;
    line-height: 44px;
    min-width: 44px;
    mix-blend-mode: difference;
    padding: 0 10px;
    pointer-events: none;
    top: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.fancybox-toolbar {
    right: 0;
    top: 0;
}

.fancybox-stage {
    direction: ltr;
    overflow: visible;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    z-index: 99994;
}

.fancybox-is-open .fancybox-stage {
    overflow: hidden;
}

.fancybox-slide {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: none;
    height: 100%;
    left: 0;
    outline: none;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: absolute;
    text-align: center;
    top: 0;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    white-space: normal;
    width: 100%;
    z-index: 99994;
}

.fancybox-slide::before {
    content: "";
    display: inline-block;
    font-size: 0;
    height: 100%;
    vertical-align: middle;
    width: 0;
}

.fancybox-is-sliding .fancybox-slide,
.fancybox-slide--current,
.fancybox-slide--next,
.fancybox-slide--previous {
    display: block;
}

.fancybox-slide--image {
    overflow: hidden;
    padding: 44px 0;
}

.fancybox-slide--image::before {
    display: none;
}

.fancybox-slide--html {
    padding: 6px;
}

.fancybox-content {
    background: var(--color-white);
    display: inline-block;
    margin: 0;
    max-width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: relative;
    text-align: left;
    vertical-align: middle;
}

.fancybox-slide--image .fancybox-content {
    -webkit-animation-timing-function: cubic-bezier(.5, 0, .14, 1);
    animation-timing-function: cubic-bezier(.5, 0, .14, 1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background: transparent;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    left: 0;
    max-width: none;
    overflow: visible;
    padding: 0;
    position: absolute;
    top: 0;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 99995;
}

.fancybox-can-zoomOut .fancybox-content {
    cursor: zoom-out;
}

.fancybox-can-zoomIn .fancybox-content {
    cursor: zoom-in;
}

.fancybox-can-pan .fancybox-content,
.fancybox-can-swipe .fancybox-content {
    cursor: -webkit-grab;
    cursor: grab;
}

.fancybox-is-grabbing .fancybox-content {
    cursor: -webkit-grabbing;
    cursor: grabbing;
}

.fancybox-container [data-selectable=true] {
    cursor: text;
}

.fancybox-image,
.fancybox-spaceball {
    background: transparent;
    border: 0;
    height: 100%;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none;
    padding: 0;
    position: absolute;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 100%;
}

.fancybox-spaceball {
    z-index: 1;
}

.fancybox-slide--iframe .fancybox-content,
.fancybox-slide--map .fancybox-content,
.fancybox-slide--pdf .fancybox-content,
.fancybox-slide--video .fancybox-content {
    height: 100%;
    overflow: visible;
    padding: 0;
    width: 100%;
}

.fancybox-slide--video .fancybox-content {
    background: var(--color-black);
}

.fancybox-slide--map .fancybox-content {
    background: #e5e3df;
}

.fancybox-slide--iframe .fancybox-content {
    background: var(--color-white);
}

.fancybox-iframe,
.fancybox-video {
    background: transparent;
    border: 0;
    display: block;
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    width: 100%;
}

.fancybox-iframe {
    left: 0;
    position: absolute;
    top: 0;
}

.fancybox-error {
    background: var(--color-white);
    cursor: default;
    max-width: 400px;
    padding: 40px;
    width: 100%;
}

.fancybox-error p {
    color: var(--color-tundora);
    font-size: 16px;
    line-height: 20px;
    margin: 0;
    padding: 0;
}

.fancybox-button {
    background: rgba(30, 30, 30, .6);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
    display: inline-block;
    height: 44px;
    margin: 0;
    padding: 10px;
    position: relative;
    transition: color .2s;
    vertical-align: top;
    visibility: inherit;
    width: 44px;
}

.fancybox-button,
.fancybox-button:link,
.fancybox-button:visited {
    color: var(--color-silver);
}

.fancybox-button:hover {
    color: var(--color-white);
}

.fancybox-button:focus {
    outline: none;
}

.fancybox-button.fancybox-focus {
    outline: 1px dotted;
}

.fancybox-button[disabled],
.fancybox-button[disabled]:hover {
    color: var(--color-gray-light);
    cursor: default;
    outline: none;
}

.fancybox-button div {
    height: 100%;
}

.fancybox-button svg {
    display: block;
    height: 100%;
    overflow: visible;
    position: relative;
    width: 100%;
}

.fancybox-button svg path {
    fill: currentColor;
    stroke-width: 0;
}

.fancybox-button--fsenter svg:nth-child(2),
.fancybox-button--fsexit svg:nth-child(1),
.fancybox-button--pause svg:nth-child(1),
.fancybox-button--play svg:nth-child(2) {
    display: none;
}

.fancybox-progress {
    background: var(--color-wild-watermelon);
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0;
    transform-origin: 0;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-timing-function: linear;
    z-index: 99998;
}

.fancybox-close-small {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: var(--color-silver);
    cursor: pointer;
    opacity: .8;
    padding: 8px;
    position: absolute;
    right: -12px;
    top: -44px;
    z-index: 401;
}

.fancybox-close-small:hover {
    color: var(--color-white);
    opacity: 1;
}

.fancybox-slide--html .fancybox-close-small {
    color: currentColor;
    padding: 10px;
    right: 0;
    top: 0;
}

.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
    overflow: hidden;
}

.fancybox-is-scaling .fancybox-close-small,
.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small {
    display: none;
}

.fancybox-navigation .fancybox-button {
    background-clip: content-box;
    height: 100px;
    opacity: 0;
    position: absolute;
    top: calc(50% - 50px);
    width: 70px;
}

.fancybox-navigation .fancybox-button div {
    padding: 7px;
}

.fancybox-navigation .fancybox-button--arrow_left {
    left: 0;
    padding: 31px 26px 31px 6px;
}

.fancybox-navigation .fancybox-button--arrow_right {
    padding: 31px 6px 31px 26px;
    right: 0;
}

.fancybox-caption {
    bottom: 0;
    color: var(--color-gallery);
    font-size: 14px;
    font-weight: 400;
    left: 0;
    line-height: 1.5;
    padding: 25px 44px;
    right: 0;
    text-align: center;
    z-index: 99996;
}

.fancybox-caption:before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAD6CAQAAADKSeXYAAAAYklEQVQoz42RwQ3AMAgDjfcfup8WoRykfBAK5mQHKSz5rbXJPis1hjiV3CIqgG0hLZPkVkA4p4x5oR1bVeDrdCLrW2Q0D5bcwY3TGMHbdw3mPRuOtaspYP1w//G1OIcW148H0DMCqI/3mMMAAAAASUVORK5CYII=);
    background-repeat: repeat-x;
    background-size: contain;
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: -44px;
    z-index: -1;
}

.fancybox-caption a,
.fancybox-caption a:link,
.fancybox-caption a:visited {
    color: var(--color-silver);
    text-decoration: none;
}

.fancybox-caption a:hover {
    color: var(--color-white);
    text-decoration: underline;
}

.fancybox-loading {
    -webkit-animation: a 1s linear infinite;
    animation: a 1s linear infinite;
    background: transparent;
    border: 4px solid var(--color-gray-light);
    border-bottom-color: var(--color-white);
    border-radius: 50%;
    height: 50px;
    left: 50%;
    margin: -25px 0 0 -25px;
    opacity: .7;
    padding: 0;
    position: absolute;
    top: 50%;
    width: 50px;
    z-index: 99999;
}

@-webkit-keyframes a {
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes a {
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.fancybox-animated {
    transition-timing-function: cubic-bezier(0, 0, .25, 1);
}

.fancybox-fx-slide.fancybox-slide--previous {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
}

.fancybox-fx-slide.fancybox-slide--next {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
}

.fancybox-fx-slide.fancybox-slide--current {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.fancybox-fx-fade.fancybox-slide--next,
.fancybox-fx-fade.fancybox-slide--previous {
    opacity: 0;
    transition-timing-function: cubic-bezier(.19, 1, .22, 1);
}

.fancybox-fx-fade.fancybox-slide--current {
    opacity: 1;
}

.fancybox-fx-zoom-in-out.fancybox-slide--previous {
    opacity: 0;
    -webkit-transform: scale3d(1.5, 1.5, 1.5);
    transform: scale3d(1.5, 1.5, 1.5);
}

.fancybox-fx-zoom-in-out.fancybox-slide--next {
    opacity: 0;
    -webkit-transform: scale3d(.5, .5, .5);
    transform: scale3d(.5, .5, .5);
}

.fancybox-fx-zoom-in-out.fancybox-slide--current {
    opacity: 1;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

.fancybox-fx-rotate.fancybox-slide--previous {
    opacity: 0;
    -webkit-transform: rotate(-1turn);
    transform: rotate(-1turn);
}

.fancybox-fx-rotate.fancybox-slide--next {
    opacity: 0;
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
}

.fancybox-fx-rotate.fancybox-slide--current {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}

.fancybox-fx-circular.fancybox-slide--previous {
    opacity: 0;
    -webkit-transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0);
    transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0);
}

.fancybox-fx-circular.fancybox-slide--next {
    opacity: 0;
    -webkit-transform: scale3d(0, 0, 0) translate3d(100%, 0, 0);
    transform: scale3d(0, 0, 0) translate3d(100%, 0, 0);
}

.fancybox-fx-circular.fancybox-slide--current {
    opacity: 1;
    -webkit-transform: scaleX(1) translateZ(0);
    transform: scaleX(1) translateZ(0);
}

.fancybox-fx-tube.fancybox-slide--previous {
    -webkit-transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg);
    transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg);
}

.fancybox-fx-tube.fancybox-slide--next {
    -webkit-transform: translate3d(100%, 0, 0) scale(.1) skew(10deg);
    transform: translate3d(100%, 0, 0) scale(.1) skew(10deg);
}

.fancybox-fx-tube.fancybox-slide--current {
    -webkit-transform: translateZ(0) scale(1);
    transform: translateZ(0) scale(1);
}

/* media query up to 576px */
@media (max-height: 576px) {
    .fancybox-caption {
        padding: 12px;
    }

    .fancybox-slide {
        padding-left: 6px;
        padding-right: 6px;
    }

    .fancybox-slide--image {
        padding: 6px 0;
    }

    .fancybox-close-small {
        right: -6px;
    }

    .fancybox-slide--image .fancybox-close-small {
        background: #4e4e4e;
        color: #f2f4f6;
        height: 36px;
        opacity: 1;
        padding: 6px;
        right: 0;
        top: 0;
        width: 36px;
    }
}

.fancybox-share {
    background: var(--color-wild-sand);
    border-radius: 3px;
    max-width: 90%;
    padding: 30px;
    text-align: center;
}

.fancybox-share h1 {
    color: var(--color-mine-shaft-dark);
    font-size: 35px;
    font-weight: 700;
    margin: 0 0 20px;
}

.fancybox-share p {
    margin: 0;
    padding: 0;
}

.fancybox-share__button {
    border: 0;
    border-radius: 3px;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    line-height: 40px;
    margin: 0 5px 10px;
    min-width: 130px;
    padding: 0 15px;
    text-decoration: none;
    transition: all .2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
}

.fancybox-share__button:link,
.fancybox-share__button:visited {
    color: var(--color-white);
}

.fancybox-share__button:hover {
    text-decoration: none;
}

.fancybox-share__button--fb {
    background: #3b5998;
}

.fancybox-share__button--fb:hover {
    background: #344e86;
}

.fancybox-share__button--pt {
    background: #bd081d;
}

.fancybox-share__button--pt:hover {
    background: #aa0719;
}

.fancybox-share__button--tw {
    background: #1da1f2;
}

.fancybox-share__button--tw:hover {
    background: #0d95e8;
}

.fancybox-share__button svg {
    height: 25px;
    margin-right: 7px;
    position: relative;
    top: -1px;
    vertical-align: middle;
    width: 25px;
}

.fancybox-share__button svg path {
    fill: var(--color-white);
}

.fancybox-share__input {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #d7d7d7;
    border-radius: 0;
    color: #5d5b5b;
    font-size: 14px;
    margin: 10px 0 0;
    outline: none;
    padding: 10px 15px;
    width: 100%;
}

.fancybox-thumbs {
    background: var(--color-alto-darker);
    bottom: 0;
    display: none;
    margin: 0;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    padding: 2px 2px 4px;
    position: absolute;
    right: 0;
    -webkit-tap-highlight-color: transparent;
    top: 0;
    width: 212px;
    z-index: 99995;
}

.fancybox-thumbs-x {
    overflow-x: auto;
    overflow-y: hidden;
}

.fancybox-show-thumbs .fancybox-thumbs {
    display: block;
}

.fancybox-show-thumbs .fancybox-inner {
    right: 212px;
}

.fancybox-thumbs__list {
    font-size: 0;
    height: 100%;
    list-style: none;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    position: absolute;
    position: relative;
    white-space: nowrap;
    width: 100%;
}

.fancybox-thumbs-x .fancybox-thumbs__list {
    overflow: hidden;
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar {
    width: 7px;
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track {
    background: var(--color-white);
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb {
    background: #2a2a2a;
    border-radius: 10px;
}

.fancybox-thumbs__list a {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: rgba(0, 0, 0, .1);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    float: left;
    height: 75px;
    margin: 2px;
    max-height: calc(100% - 8px);
    max-width: calc(50% - 4px);
    outline: none;
    overflow: hidden;
    padding: 0;
    position: relative;
    -webkit-tap-highlight-color: transparent;
    width: 100px;
}

.fancybox-thumbs__list a::before {
    border: 6px solid var(--color-wild-watermelon);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: all .2s cubic-bezier(.25, .46, .45, .94);
    z-index: 99991;
}

.fancybox-thumbs__list a:focus::before {
    opacity: .5;
}

.fancybox-thumbs__list a.fancybox-thumbs-active::before {
    opacity: 1;
}

/* media query up to 576px */
@media (max-width: 576px) {
    .fancybox-thumbs {
        width: 110px
    }

    .fancybox-show-thumbs .fancybox-inner {
        right: 110px
    }

    .fancybox-thumbs__list a {
        max-width: calc(100% - 10px)
    }
}

.fancybox-button svg {
    margin-top: 0 !important;
}

/* Registration page password strengh indicators */
.meter_wrapper {
    float: left;
    width: 100%;
    padding: 5px 0;
}

.meter_wrapper #meter {
    width: 180px;
    height: 6px;
    float: left;
    margin-top: 8px;
}

.meter_wrapper #meter span {
    display: none;
    float: left;
    width: 30%;
    margin-right: 3.3333%;
    height: 6px;
    background: var(--color-alto);
}

.meter_wrapper #meter.weak span,
.meter_wrapper #meter.good span,
.meter_wrapper #meter.strong span {
    display: block;
}

.meter_wrapper #meter.weak span:nth-child(1) {
    background: var(--color-alizarin-crimson);
}

.meter_wrapper #meter.good span:nth-child(1),
.meter_wrapper #meter.good span:nth-child(2) {
    background: yellow;
}

.meter_wrapper #meter.strong span {
    background: green;
}

#meter.weak+span {
    color: var(--color-alizarin-crimson);
}

#pass_str {
    float: left;
    font-size: 0.9em;
    font-weight: 700;
    margin-left: 15px;
}

.box-passstrong label {
    font-weight: normal;
    float: left;
    width: 100%;
}

.box-passstrong span {
    float: left;
    width: 100%;
    padding-left: 20px;
    margin-top: 5px;
    color: var(--color-alizarin-crimson);
    position: relative;
    line-height: 1.2;
    font-size: 0.9em;
}

.box-passstrong span::before,
.box-passstrong span::after {
    content: '';
    position: absolute;
    top: 4px;
    left: 5px;
    width: 0;
    height: 12px;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    border: solid var(--color-alizarin-crimson);
    border-width: 0 2px 2px 0;
}

.box-passstrong span::after {
    transform: rotate(-45deg);
}

.box-passstrong span.change_class {
    color: var(--color-main);
}

span.change_class::before {
    content: '';
    display: block;
    width: 6px;
    height: 12px;
    border: solid green;
    border-width: 0 2px 2px 0;
    transform: rotate(35deg);
    left: 5px;
    position: absolute;
    top: 0;
}

span.change_class::after {
    content: none;
}

/* SagePaySuite.css import */
iframe#iframeRegCard {
    height: 518px;
    width: 100%;
    border: 1px solid var(--color-dove-gray);
    padding: 0 20px;
}

iframe#sagepaydirectpro-iframe-post {
    height: 500px;
    width: 100%;
    /* border:1px solid var(--color-dove-gray); */
    border: none;
}

div#direct3d-logos {
    width: 351px;
    margin: 0 auto;
    margin-top: 5px;
}

div#direct3d-logos img {
    padding-right: 10px;
}

div.sagecardh1 h1 {
    display: inline;
}

div.sagecardh1 img {
    padding-top: 12px;
    padding-left: 10px;
}

select#sagepaytoken_start_yr,
select#sagepaytoken_start,
select#sagepaytoken_expiration_yr,
select#sagepaytoken_expiration {
    width: 125px;
}

select#sagepaytoken_start,
select#sagepaytoken_expiration {
    margin-right: 10px;
}

form#frmRegCard input.cvv {
    width: 3em !important;
}

.sidebar .sagepaysuite-logo {
    display: block;
    margin: 10px 0;
    text-align: center;
}

.sidebar .sagepaysuite-logo a {
    float: none;
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {

    /* IE10+ CSS styles go here */
    .main-menupoint>ul {
        height: 600px;
    }
}

/* Global Messages */
.messages {
    width: 100%;
    overflow: hidden;
}

.messages ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.messages li {
    margin: 0 0 10px !important;
}

.messages li li {
    margin: 0 !important;
    line-height: 24px;
}

.message-error,
.message-success,
.message-note,
.message-notice {
    border-style: solid !important;
    border-width: 1px !important;
    background-position: 10px 9px !important;
    background-repeat: no-repeat !important;
    min-height: 24px !important;
    padding: 8px 16px !important;
    font-size: 16px !important;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    margin-top: 1.5em;
}

.message-error {
    background-color: #F2DEDE;
    border-color: #EED3D7;
    color: #B94A48;
}

[data-role="checkout-messages"] .message-error {
    opacity: 0;
    display: none;
    pointer-events: none;
}

.message-success {
    background-color: #DFF0D8;
    border-color: #D6E9C6;
    color: #468847;
}

.message-note {
    background-color: #D9EDF7;
    border-color: #BCE8F1;
    color: #3A87AD;
}

.message-notice {
    background-color: #FCF8E3;
    border-color: #FBEED5;
    color: #C09853;
}

/* FC ------------------------------------------- */
/* desktop content height ----------------------- */
@media (min-width: 1281px) {
    #maincontent {
        min-height: calc(100vh - 739px);
    }
}

/* FC ------------------------------------------- */
/* print order ---------- ----------------------- */
@media print {
    * {
        color: var(--color-black) !important;
        /*CSS transitions*/
        transition-property: none !important;
        /*CSS transforms*/
        transform: none !important;
        /*CSS animations*/
        animation: none !important;
    }

    .header-container {
        flex-direction: column;
    }

    .hc-actions-container,
    .hp-banner-top__text,
    .ls-button-style-checkout,
    .pre-footer-container,
    .footer-payments {
        display: none !important;
    }

    .nav-sections,
    .hca-top-links,
    .block-search,
    .head-trade-bar,
    .cont_buttons,
    .hca-aa-icons,
    .hp-banner-top__text,
    .footer-icons--holder {
        display: none !important;
    }
}

/* swiper slider styles - we merged its styles into our main stylesheet on 10/11/2023 */
/**
 * Swiper 8.4.4
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2022 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: November 11, 2022
 */
@font-face {
    font-family: swiper-icons;
    src: url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff
}

.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1
}

.swiper-vertical>.swiper-wrapper {
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box
}

.swiper-android .swiper-slide,
.swiper-wrapper {
    transform: translate3d(0px, 0, 0)
}

.swiper-pointer-events {
    touch-action: pan-y
}

.swiper-pointer-events.swiper-vertical {
    touch-action: pan-x
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-autoheight,
.swiper-autoheight .swiper-slide {
    height: auto
}

.swiper-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height
}

.swiper-backface-hidden .swiper-slide {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-3d,
.swiper-3d.swiper-css-mode .swiper-wrapper {
    perspective: 1200px
}

.swiper-3d .swiper-cube-shadow,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-wrapper {
    transform-style: preserve-3d
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-3d .swiper-slide-shadow {
    background: rgba(0, 0, 0, .15)
}

.swiper-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-css-mode>.swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-css-mode>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: start start
}

.swiper-horizontal.swiper-css-mode>.swiper-wrapper {
    scroll-snap-type: x mandatory
}

.swiper-vertical.swiper-css-mode>.swiper-wrapper {
    scroll-snap-type: y mandatory
}

.swiper-centered>.swiper-wrapper::before {
    content: '';
    flex-shrink: 0;
    order: 9999
}

.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child {
    margin-inline-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-horizontal>.swiper-wrapper::before {
    height: 100%;
    min-height: 1px;
    width: var(--swiper-centered-offset-after)
}

.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child {
    margin-block-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-vertical>.swiper-wrapper::before {
    width: 100%;
    min-width: 1px;
    height: var(--swiper-centered-offset-after)
}

.swiper-centered>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: center center
}

:root {
    --swiper-navigation-size: 44px
}

.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size) / 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color))
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-next.swiper-button-hidden,
.swiper-button-prev.swiper-button-hidden {
    opacity: 0;
    cursor: auto;
    pointer-events: none
}

.swiper-navigation-disabled .swiper-button-next,
.swiper-navigation-disabled .swiper-button-prev {
    display: none !important
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    font-variant: initial;
    line-height: 1
}

.swiper-button-prev,
.swiper-rtl .swiper-button-next {
    left: 10px;
    right: auto
}

.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
    content: 'prev'
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
    right: 10px;
    left: auto
}

.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
    content: 'next'
}

.swiper-button-lock {
    display: none
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: .3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-pagination-disabled>.swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
    display: none !important
}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transform: scale(.33);
    position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    transform: scale(.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    transform: scale(.33)
}

.swiper-pagination-bullet {
    width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
    height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
    display: inline-block;
    border-radius: 50%;
    background: var(--swiper-pagination-bullet-inactive-color, #000);
    opacity: var(--swiper-pagination-bullet-inactive-opacity, .2)
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-bullet:only-child {
    display: none !important
}

.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--swiper-pagination-color, var(--swiper-theme-color))
}

.swiper-pagination-vertical.swiper-pagination-bullets,
.swiper-vertical>.swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0px, -50%, 0)
}

.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
    display: block
}

.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 8px
}

.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    transition: .2s transform, .2s top
}

.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px)
}

.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap
}

.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: .2s transform, .2s left
}

.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: .2s transform, .2s right
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, .25);
    position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top
}

.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    transform-origin: right top
}

.swiper-horizontal>.swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-vertical>.swiper-pagination-progressbar {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-lock {
    display: none
}

.swiper-free-mode>.swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-fade.swiper-free-mode .swiper-slide {
    transition-timing-function: ease-out
}

.swiper-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity
}

.swiper-fade .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-fade .swiper-slide-active,
.swiper-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

/*cookie notice*/
#cookieConsent .manage-2 {
    display: none;
}

#cookieConsent .manage-2.show {
    display: block;
}

#cookieConsent .manage-2.show.preferences {}

#cookieConsent .manage-2.show.grid.show {
    display: grid;
}

#cookieConsent .row {
    margin-bottom: 32px
}

#cookieConsent .row:last-child {
    margin-bottom: 0
}

#cookieMask {
    position: fixed;
    /* Stay in place */
    z-index: 99999;
    /* Sit on top */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: rgb(0, 0, 0);
    /* Fallback color */
    background-color: rgba(0, 0, 0, 0.65);
    /* Black w/ opacity */
}

#cookieConsent .modal-scroll {
    overflow-y: scroll;
}

#cookieConsent .content {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 1120px;
    z-index: 99999999;
    background-color: #fff;
    padding: 24px;
    width: calc(100% - 48px);
}

#cookieConsent .content.showpref {
    width: calc(100% - 48px);
    top: 0;
    left: 0%;
    transform: none;
    height: calc(100% - 48px);
    margin: 24px;
    overflow: hidden;
}

#cookieConsent .content .fs-h2 {
    margin-bottom: 16px;
}

#cookieConsent .content .fs-h2.static {
    position: static !important;
    border-bottom: 1px solid #555;
    padding-bottom: 12px;
}

#cookieConsent .content.showpref .fs-h2 {
    /*position: absolute;*/
    /*left: 0;*/
    /*padding: 0 24px 12px;*/
    /*width: calc(100% - 48px);*/
    /*border-bottom: 1px solid #555;*/
    /*background-color:#fff;*/
}

#cookieConsent .content .fs-h2.desktop {
    display: none;
}

#cookieConsent .content .fs-h3 {
    margin-bottom: 32px;
}

#cookieConsent .content button {
    margin: 0;
    height: 40px;
    text-transform: capitalize;
    background: #555555;
    padding: 0 16px;
    color: #FDFDFD;
    min-width: 184px;
    width: max-content;
    border: 1px solid #555;
    font-family: var(--font-text-regular);
    letter-spacing: -0.08px;
    font-size: 16px;
}

#cookieConsent .content button:hover {
    background-color: #7D7579;
}

#cookieConsent .content button:first-child {
    margin-right: 32px;
}

#cookieConsent .content button.decline {
    background-color: #FFFFFF;
    color: #555555;
}

#cookieConsent .content button.decline:hover {
    background-color: #F2F1F2;
}

#btn-cookie-manage {
    margin-bottom: 16px !important;
}

#cookieConsent .content button span {
    display: block;
}

#cookieConsent a {
    color: #000;
    text-decoration: underline;
}

#cookieConsent .content button span:after {
    content: '';
    background: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/chevron-down-orange.svg");
    display: inline-block;
    height: 11px;
    width: 10px;
    background-size: 10px 11px;
    transform: rotate(270deg);
    margin: 0 0 0 8px;
}

#cookieConsent .first-row {
    border-top: 1px solid #555;
    padding-top: 32px;
    margin-top: 32px;
}

#cookieConsent .content .preferences .row p strong {
    color: #000;
}

#cookieConsent .content .preferences .row p:nth-child(2) {
    margin-top: 16px
}

@media (min-width: 1024px) {
    #cookieConsent .content {
        padding: 32px;
    }

    #cookieConsent .content.showpref {
        /*width:calc(100% - 48px);*/
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        height: auto;
    }

    #cookieConsent .contl {
        grid-column: 2 / span 1;
        grid-row: 1 / span 1;
    }

    #cookieConsent .grid {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: 1fr;
        grid-column-gap: 0;
        grid-row-gap: 16px;
    }

    #cookieConsent .manage-2.grid {
        display: none;
    }

    #cookieConsent .grid.manage-2:last-child {
        border: 0;
        margin-top: 0;
    }

    #cookieConsent .manage-2.grid.show {
        display: grid;
        grid-template-columns: repeat(16, 1fr);
        grid-column-gap: 32px;
        grid-row-gap: 32px;
    }

    #cookieConsent .content .grid .fs-h2 {
        grid-column: 1 / span 3;
        grid-row: 1 / span 1;
        margin-bottom: 0;
    }

    #cookieConsent .content.showpref .fs-h2 {
        padding: 0;
        position: initial;
        left: 0;
        width: 100%;
        border: 0;
    }

    #cookieConsent .content .grid .col-2 {
        grid-column: 5 / span 11;
        grid-row: 1 / span 1;
    }

    #cookieConsent .content .grid .row {
        /*grid-column: 1 / span 16;*/
        /*grid-row: var(--i) / span 1;*/
        /*grid-template-columns: repeat(1 16, 1fr);*/
        grid-column-gap: 32px;
        margin-bottom: 32px;
    }

    #cookieConsent .content .grid .row:last-child {
        margin-bottom: 0;
    }

    #cookieConsent .content .preferences .row p,
    #cookieConsent .content .preferences .row button {
        grid-column: 1 / span 9;
    }

    #cookieConsent .content .preferences .row>*:last-child:not(button) {
        grid-column: 10 / span 3;
        justify-self: right;
    }

    #cookieConsent .content .preferences .row p:nth-child(2) {
        margin-top: 26px;
        justify-self: right;
    }

    #cookieConsent .scroll {
        grid-column: 2 / span 1;
        grid-row: 2 / span 1
    }

    #cookieConsent .modal-scroll {
        height: auto;
        display: grid;
        grid-template-columns: 1fr 3fr;
        gap: 0px 32px;
    }

    #btn-cookie-manage {
        margin-bottom: 0 !important;
    }

    #cookieConsent .content .fs-h2.static {
        display: none;
    }

    #cookieConsent .content .fs-h2.desktop {
        display: block;
    }
}

/*radio buttons*/
.up-in-toggle {
    margin-top: 16px;
    min-height: 36px;
    display: block;
}

@media (min-width: 1024px) {
    .up-in-toggle {
        margin-top: 0;
    }
}

.up-in-toggle input {
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    border: 0;
    display: none;
    overflow: hidden;
}

.up-in-toggle input:checked+label {
    background: var(--color-tangerine);
    color: white;
    font-weight: 500;
}

.up-in-toggle input:checked+label.off {
    background: #555555;
    color: #fff;
}

.up-in-toggle label {
    display: inline-block;
    width: 60px;
    background-color: #F3F4F6;
    color: #D7D4D9;
    text-align: center;
    font-family: var(--font-text-medium);
    padding: 6px 6px;
    float: left;
    transition: all 0.1s ease-in-out;
}

.up-in-toggle:hover {
    cursor: pointer;
}

/*end radio buttons*/
/* Mega menu changes Frazer 23/09/243 */
#main_navigation {
    height: 100vh;
    overflow-y: scroll;
}

.ls-mobile-quicklinks {
    display: none;
}

#main_navigation>li {
    flex-grow: 1;
}

.main-navigation a[href="javascript:;"] {
    cursor: default;
}

.menu-expand ul.menu-pic-2,
.menu-expand ul.menu-pic-2 li,
.menu-expand ul.menu-pic-3,
.menu-expand ul.menu-pic-3 li {
    display: block
}

.main-menupoint>a {
    font-family: var(--font-text-regular);
    color: var(--color-main);
    letter-spacing: -0.08px;
    text-transform: none;
}

#main_navigation>li.main-menupoint.is-open>a {
    font-family: var(--font-text-medium);
    color: var(--color-black)
}

li.menu-expand {
    background-color: var(--site-background-color) !important;
}

li.menu-expand .expand-level {
    display: flex;
    column-gap: 24px;
    row-gap: 24px;
    margin: 24px 24px 0 24px;
    width: calc(100% - 48px);
}

.expand-level.menu-pic-2,
.expand-level.menu-pic-3 {
    width: 100% !important;
    margin: 0 !important;
}

ul.menu-pic li a {
    display: flex;
    flex-direction: column;
    row-gap: 12px;
}

li.menu-expand .expand-level a {
    padding: 0 !important;
    font-size: 16px;
}

li.menu-expand .expand-level a::after,
.menu-expand .menu-expand::before,
.no-arrow::before {
    display: none;
}

li.menu-expand .expand-level img {
    width: 100%;
    margin: 0;
}

li.menu-expand .expand-level img.w-auto {
    width: auto !important;
}

.menu-pic.expand-level img {
    margin-bottom: 12px;
}

.expand-level::before {
    display: none !important;
}

.expand-level.d-row {
    flex-direction: row;
}

.expand-level.d-col {
    flex-direction: column;
}

.menu-pic {
    flex-wrap: wrap;
    border-bottom: 1px solid #E5E3E4;
    padding-bottom: 24px;
}

.menu-pic-2,
.menu-pic-3 {
    border-bottom: 1px solid #E5E3E4;
    padding-bottom: 24px;
}

#claypavers .menu-pic-2,
#decking .menu-pic-2,
#claddingwallingscreening .menu-pic,
#bespoke .menu-pic,
.menu-expand.coping,
#pergolas .menu-pic {
    border-bottom: 0;
}

.menu-pic li {
    flex-basis: calc(50% - 12px);
}

li.full {
    flex-basis: 100% !important;
    color: var(--color-black);
    font-family: var(--font-text-medium);
    font-size: 16px;
    letter-spacing: 0.03em;
}

li.full a {
    letter-spacing: normal;
    color: var(--color-black);
}

.menu-pic-2 li a,
.menu-pic-3 li a {
    display: flex;
    flex-direction: row;
    column-gap: 24px;
    align-items: center;
}

@media (min-width: 450px) {
    .menu-pic li {
        flex-basis: calc(33% - 15px);
    }

    .menu-pic-2,
    .menu-pic-3 {
        flex-direction: row !important;
        flex-wrap: wrap
    }

    .menu-pic-2 li,
    .menu-pic-3 li {
        flex-basis: calc(50% - 12px);
    }
}

@media (max-width: 767px) {
    li.menu-expand::before {
        content: '';
        background-image: url('https://d3przyomkgkv0c.cloudfront.net/fit-in/1600x400/filters:format(.webp)/filters:quality(60)/mediadev/media/menu-pics/chevron-icon.svg');
        width: 9px;
        height: 8px;
        background-size: 9px 8px;
        transform: translateY(10px) rotate(0deg);
    }

    li.menu-expand.is-open::before {
        transform: translateY(10px) rotate(180deg);
    }

    .menu-expand.is-open>ul {
        border-bottom: 1px solid #E5E3E4;
    }

    .main-menupoint.menu-expand.is-open>a::after {
        display: none;
    }

    .menu-pic-3 {
        border-bottom: 0;
    }
}

@media (min-width: 768px) {
    #main_navigation {
        height: auto;
        overflow-y: revert;
    }

    #main_navigation a {
        font-size: 16px !important;
    }

    .main-navigation::before,
    .main-menupoint>a::before {
        display: none;
    }

    .main-menupoint>a {
        padding: 9px 0.25em 0;
        display: inline-block;
        width: fit-content;
    }

    .main-menupoint>a {
        border-bottom: 3px solid transparent;
        padding-bottom: 10px;
    }

    .main-menupoint>a:hover,
    .main-menupoint.is-open>a {
        font-family: var(--font-text-medium);
        border-bottom: 3px solid var(--color-tangerine);
        color: #000;
    }

    ul.menu-layout-1 {
        display: flex;
        border: 0;
        column-gap: 24px;
        row-gap: 24px;
        margin: 0;
        padding: 0 24px;
        width: 100%;
        flex-direction: column;
        max-height: none;
        padding-bottom: 24px;
        flex-wrap: nowrap;
    }

    ul.menu-layout-1>li.menu-expand {
        margin: 0;
        border-bottom: 0;
    }

    ul.menu-layout-1>li.menu-expand:first-child {
        margin: 24px 0 0 0;
    }

    ul.menu-layout-1>li.menu-expand:nth-child(2) {
        flex-basis: calc(40% - 12px);
        display: flex;
        flex-direction: column;
        column-gap: 24px;
        row-gap: 24px;
        flex-grow: 1;
        margin-top: 0;
        width: 100%;
        border-bottom: 1px solid #E5E3E4;
    }

    ul.menu-layout-1>li.menu-expand:last-child {
        border-bottom: 0;
    }

    ul.menu-layout-1::before {
        background-color: var(--site-background-color);
        left: calc(795px - 50vw);
        content: "";
        position: absolute;
        width: 101vw;
        height: 100%;
        margin-top: -33px;
        border-top: 1px solid #F2F1F2;
    }

    .main-menupoint>ul>li {
        position: relative;
    }

    ul.menu-pic {
        display: flex;
        flex-wrap: wrap;
        column-gap: 24px;
        row-gap: 24px;
        width: 100% !important;
        margin: 0 !important;
    }

    ul.menu-pic-2,
    ul.menu-pic-3 {
        flex-direction: row !important;
        flex-wrap: wrap;
    }

    ul.menu-pic-2 li,
    ul.menu-pic-3 li {
        flex-basis: calc(33% - 14px);
    }

    ul.menu-pic li {
        flex-basis: calc(20% - 20px);
        font-size: 16px;
    }

    ul.menu-pic li img {
        margin-bottom: 12px;
        width: 100%;
    }

    #main_navigation ul li.menu-expand>a {
        font-family: var(--font-text-medium);
        text-decoration: none !important;
        margin-bottom: 24px;
    }

    ul.menu-pic li img,
    ul.menu-pic-2 li img,
    ul.menu-pic-3 li img {
        display: inline-block
    }

    ul.menu-pic-2,
    ul.menu-pic-3 {}

    ul.menu-pic li.full,
    ul.menu-pic-2 li.full,
    .menu-pic-3 li.full {
        flex-basis: 100%;
        display: block;
    }

    ul.menu-pic a,
    ul.menu-pic-2 a,
    ul.menu-pic-3 a {
        line-height: normal;
        padding: 0;
    }

    ul.menu-pic-2 img {
        width: 50px;
        aspect-ratio: 1 / 1;
        border-radius: 50%;
        margin-right: 24px;
        padding: 0;
    }

    ul.menu-pic-3 img {
        padding: 0;
    }

    .menu-pic,
    .menu-pic-2,
    .menu-pic-3 {}

    .menu-pic-3 {
        border-bottom: 0 !important;
    }

    .mobile-title {
        display: none !important;
    }

    .menu-pic-2 a,
    .menu-pic-3 a {
        font-size: 16px;
        padding: 60px 0
    }

    .main-navigation #menu_sale {
        display: flex;
    }

    .main-navigation #menu_sale a::after {
        display: none;
    }

    #claypavers .menu-pic-2,
    #decking .menu-pic-2,
    #claddingwallingscreening .menu-pic,
    #stepsandcoping .coping,
    #pergolas .menu-pic,
    #bespoke .menu-pic {
        border-bottom: 0;
    }
}

@media (min-width: 1280px) {
    ul.menu-layout-1 {
        flex-direction: row;
        border: 0;
        column-gap: 48px;
        padding: 32px;
    }

    ul.menu-layout-1>li.menu-expand {
        margin: 0;
    }

    ul.menu-pic,
    ul.menu-pic-2,
    .menu-pic-3 {
        margin: 0 !important;
    }

    ul.menu-pic-2 li,
    ul.menu-pic-3 li {
        flex-basis: calc(50% - 14px);
    }

    ul.menu-pic li {
        flex-basis: calc(20% - 18px);
    }

    ul.menu-layout-1>li.menu-expand:first-child {
        margin: 0;
        flex-basis: 64%;
        border-bottom: 0;
    }

    ul.menu-layout-1>li.menu-expand:nth-child(2) {
        flex-direction: column;
        column-gap: 36px;
        border-left: 0;
        row-gap: 48px;
        padding-left: 48px;
        border-left: 1px solid #E5E3E4;
    }

    ul.menu-pic {
        border-bottom: 0;
    }

    ul.menu-pic li {
        flex-basis: calc(20% - 20px);
    }

    li.menu-expand .expand-level {
        width: 100% !important;
        padding: 0;
    }

    .menu-expand .li-cont {}

    ul.menu-pic li {
        flex-basis: 125px;
    }

    ul.menu-layout-2>li.menu-expand ul li span {
        min-height: 48px;
    }

    ul.menu-layout-2>li.menu-expand:first-child {
        flex-basis: 38%;
        margin: 0;
        border-bottom: 0
    }

    ul.menu-layout-2>li.menu-expand:nth-child(2) {
        flex-basis: 38%;
        border-bottom: 0;
        padding-left: 0;
        border-left: 0;
    }

    #stepsandcoping>ul>li.menu-expand:nth-child(2) {
        border-right: 0;
    }

    ul.menu-layout-2>li.menu-expand {
        border-right: 1px solid #E5E3E4;
    }

    ul.menu-layout-1>li.menu-expand:nth-child(2),
    ul.menu-pic-2 {
        border-bottom: 0;
    }
}

@media (min-width: 1600px) {
    ul.menu-layout-1 {
        padding: 32px 12px;
    }

    ul.menu-layout-1>li.menu-expand {
        border-right: 1px solid #E5E3E4;
    }

    #claddingwallingscreening ul.menu-layout-1>li.menu-expand,
    #pergolas ul.menu-layout-1>li.menu-expand,
    #bespoke ul.menu-layout-1>li.menu-expand {
        border-right: 0;
    }

    ul.menu-layout-1>li.menu-expand:first-child {
        flex-basis: 890px;
    }

    li.menu-expand .expand-level {
        padding: 0 48px 0 0;
    }

    .menu-pic-3.expand-level.d-col {
        padding: 0;
    }

    .menu-expand.expand-level.d-col {
        flex-direction: row;
    }

    .menu-expand.expand-level.d-col li {
        flex-basis: calc(50% - 12px);
    }

    ul.menu-layout-1>li.menu-expand:nth-child(2) .li-cont {
        flex-basis: calc(50% - 12px);
    }

    ul.menu-layout-1>li.menu-expand:nth-child(2) {
        flex-direction: row;
        border-right: 0;
        border-left: 0;
        padding-left: 0;
    }

    ul.menu-layout-1>li.menu-expand:nth-child(2) .li-cont {
        padding-left: 0;
        border-left: 0;
    }

    ul.menu-layout-1>li.menu-expand:nth-child(2) .li-cont:first-child {
        border-right: 1px solid #E5E3E4;
    ;
    }

    li#claypavers>ul>li.menu-expand:nth-child(2) .li-cont:first-child {
        border-right: 0;
    }

    .menu-pic-2 li,
    .menu-pic-3 li {
        flex-basis: 100% !important;
    }

    ul.menu-pic li {
        flex-basis: 149px;
    }

    ul.menu-layout-2>li.menu-expand:first-child {
        flex-basis: 717px;
    }

    ul.menu-layout-2>li.menu-expand:nth-child(2) {
        flex-basis: 705px;
    }

    .coping {
        height: 0;
    }

    .menu-pic-3 span.ws {
        white-space: nowrap
    }

    #main_navigation>li a {
        padding: 0 0 14px 0;
    }
}

/* end mega menu */
/* new header 17/10/24 FC*/
:root {
    --header-animation-time: 125ms;
}

.page-header {
    position: sticky;
    top: 0;
    background-color: var(--site-background-color);
    z-index: 1002;
}

.header-container {
    display: grid;
    grid-template-columns: 124px 1fr 56px;
    grid-template-rows: 30px 86px 52px;
    grid-gap: 0;
    height: 167px;
    transition: var(--header-animation-time);
}

.header-sticky .header-container {
    grid-template-rows: 0 86px 52px;
    height: 137px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}

.page-header .hca-top-links {
    display: flex;
    background-color: #F3F4F6;
    height: 30px;
    grid-area: 1 / 1 / 2 / 5;
    margin-bottom: 0;
    position: static;
    overflow: hidden;
    transition: height var(--header-animation-time) ease-out;
}

.page-header .hca-top-links ul {
    width: 100%;
    column-gap: 28px;
    justify-content: flex-end;
    max-width: 1600px;
    margin-right: 24px;
}

.page-header .hca-top-links ul li {
    margin: 0;
}

.page-header .hca-top-links ul li {
    margin: 0;
}

.page-header .hca-top-links ul li a {
    color: #000;
    font-size: 12px !important;
    font-family: var(--font-text-regular);
    letter-spacing: 0.06px !important;
}

.page-header .hca-top-links ul li a img {
    display: block;
}

.header-sticky .hca-top-links {
    height: 0;
}

.hca-aa-icons a[title="My Account"] {
    background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/home/user-logged-out-1.svg');
    background-size: 24px 24px;
    background-position: left center;
    align-self: center;
}

/*.hca-aa-icons a[title="My Account"].my-account-loggedin { background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/home/user-logged-in-1.svg');background-size:30px 30px; background-position: left center;align-self: center;}*/
.hca-aa-icons a[title="My Account"].my-account-loggedin {
    flex-basis: 37px;
    background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/home/user-logged-out-1.svg');
    background-size: 24px 24px;
    background-position: left center;
    align-self: center;
    position: relative
}

.hca-aa-icons a[title="My Account"].my-account-loggedin::after {
    content: "";
    width: 16px;
    height: 16px;
    background-color: var(--color-tangerine);
    left: 16px;
    bottom: 16px;
    display: inline-block;
    position: absolute;
    border-radius: 50%;
}

.header-container .hc-logo-container {
    grid-area: 2 / 1 / 3 / 2;
    padding: 0;
    margin: 16px 0 20px 24px;
    text-align: left;
}

.header-sticky .header-container .hc-logo-container {
    margin: 16px 0 20px 20px;
}

.logo img,
.print-head .logo {
    min-height: 50px;
    max-width: 100px;
}

.logo img.max {
    max-width: 100px;
    width: 100px;
    max-height: 50px;
    display: block
}

.logo img.min {
    max-width: 25px;
    width: 21px;
    max-height: 30px;
    display: none;
    margin: 0 auto;
}

.header-sticky .logo img.max {
    display: none
}

.header-sticky .logo img.min {
    display: block
}

.header-container .block-search {
    display: block;
    grid-area: 3 / 1 / 4 / 4;
    position: static;
    width: calc(100% - 48px);
    padding: 0;
    margin: 0 24px;
    align-self: self-start;
}

.header-container .block-content .field.search {
    background-color: transparent;
    height: auto !important;
}

.action.ls-quicksearch-go {
    display: none;
}

#search {
    background: #f9f8f8 url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/search-orange.svg') no-repeat 18px center;
    border: 1px solid #D4D5D5;
    border-radius: 0;
    padding: 2px 8px 2px 48px;
    letter-spacing: 0.16px;
}

#search::placeholder {
    color: #bfbfbf;
}

.hc-actions-container {
    grid-area: 2 / 2 / 3 / 3;
    margin: 0;
    padding: 0;
    position: static;
}

.header-container .hc-actions-container {
    justify-content: flex-end;
    column-gap: 12px;
    margin-right: 12px;
    align-items: center
}

.header-container .hc-actions-container .login,
.header-container .hc-actions-container .logout {
    color: #555555;
    font-size: 12px;
    padding: 0;
    margin: 0;
    align-self: center;
    display: none;
}

.header-container .hc-actions-container .my-account,
.header-container .hc-actions-container .my-account-loggedin {
    flex-basis: 37px;
    height: 30px;
    display: inline-block;
    padding: 0;
    margin: 0;
    border-right: 1px solid #000;
    background-position: left center;
    background-size: 25px 25px
}

.header-container .hc-actions-container .my-account-loggedin {
    flex-basis: 43px;
}

.hca-aa-icons a[title="My Account"],
.loggedin .hca-aa-icons a[title="My Account"] {}

.header-container .hc-actions-container .minicart-wrapper {
    flex-basis: 27px;
    height: 30px;
    display: inline-block;
    padding: 0;
    margin: 0;
}

.header-container .hc-actions-container .minicart-wrapper.ls-empty {
    flex-basis: 20px;
}

.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon {
    width: 20px;
    height: 30px;
    background-size: 17px 24px;
    background-position: left center;
    background-image: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/home/shopping-bag-empty-1.svg");
    background-size: 17px 24px;
}

.head-trade-bar {
    display: none;
}

.menu-control {
    grid-area: 2 / 3 / 3 / 4;
}

.menu-control .mmenu-search {
    display: none
}

#menu-button {
    margin: 0;
    right: 24px;
    padding: 0;
    top: 61px;
    width: 32px;
    transition: top 100ms ease-in;
}

.header-sticky #menu-button {
    margin: 0;
    right: 24px;
    padding: 0;
    top: 31px;
    width: 32px;
}

#menu-button span {
    width: 32px;
    background: #000;
    margin-bottom: 8px;
}

.hp-banner-top__text {
    height: 35px;
}

.usp-cont {
    background: #2A2B2C;
    color: #FFFFFF;
    height: 35px;
    position: sticky;
    top: 167px;
    transition: all var(--header-animation-time) ease-out;
    z-index: 110;
}
.usp-cont.header-sticky {
    top: 138px;
}
.usp-cont ul {
    background: #2A2B2C;
    color: #FFFFFF;
    font-size: 12px;
    width: 100%;
    height: 100%;
    align-items: center;
    max-width: none;
    margin: 0 auto;
    text-align: center
}

.usp-cont ul li {
    width: 0;
    height: 0;
    margin: 0;
    text-align: center;
    justify-content: center;
    align-items: center;
    line-height: 20px;
    opacity: 0;
    display: none;
    transition: opacity var(--header-animation-time)
}

.usp-cont ul li.active {
    width: 100%;
    opacity: 1;
    display: flex;
    border: 0;
    height: 100%
}

.usp-cont ul li a {
    color: #fff;
    display: flex;
    column-gap: 16px;
    font-family: var(--font-display-medium);
    font-weight: 400;
    font-size: 12px;
    letter-spacing: 0.1px;
}

.usp-cont ul li a img {
    display: block;
    height: 18px;
}

.usp-cont ul li .tp {
    height: 17px;
}

.usp-cont ul li .pp {
    width: 60px;
}

.usp-cont ul li .wa {
    width: 20px;
}

#search {
    font-size: 16px;
    height: 36px;
}

.hca-top-links li:last-child {
    margin-right: 0;
}

.ls-basket-count {
    background-color: var(--color-tangerine);
    bottom: 16px;
    right: -7px;
    width: 16px;
    height: 16px;
}

#main_navigation #menu_sale a {
    font-family: var(--font-display-medium);
}

#search_autocomplete {
    box-shadow: 3px 3px 5px #E8E8ED;
    max-height: 308px;
}

#search::-webkit-search-cancel-button {
    -webkit-appearance: none;
    width: 16px;
    height: 16px;
    background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/clear-search.svg');
    background-size: 16px 16px;
    display: inline-block;
}

.search-autocomplete>ul,
.search-autocomplete>ul {
    background-color: #FDFDFD;
}

.search-autocomplete>ul,
.search-autocomplete>ul li {
    background-color: #FDFDFD;
}

.search-autocomplete>ul li .qs-option-name {
    border-bottom: 1px solid #D4D5D5;
    border-left: 4px solid transparent;
    padding-left: 44px;
    font-family: "Helvetica-Text-Regular";
    color: #343131;
    letter-spacing: 0.16px;
    font-size: 16px;
}

.search-autocomplete>ul li .qs-option-name.selected {
    line-height: inherit;
    background-color: #FDFDFD;
}

.search-autocomplete>ul li .qs-option-name.selected::after {
    display: none;
}

.search-autocomplete>ul li .qs-option-name:hover {
    background-color: #F3F4F6;
    border-left: 4px solid var(--color-tangerine);
}

.header-container .block-search .block-content .minisearch .actions {
    right: auto;
    left: 0;
}

@media (min-width:550px) {
    .header-container {
        display: grid;
        grid-template-columns: 124px 1fr 100px 56px;
        grid-template-rows: 30px 85px;
        grid-gap: 0;
        height: 115px;
        padding: 0;
    }

    .header-sticky .header-container {
        grid-template-rows: 0 68px;
        height: 68px;
    }

    .header-sticky .header-container .hc-logo-container {
        margin: 16px 0 20px 21px;
    }

    .page-header .hca-top-links ul {
        column-gap: 34px;
        justify-content: flex-end;
    }

    .header-sticky .logo img.max {
        display: none;
    }

    .header-sticky .logo img.min {
        display: block;
    }

    .header-sticky #menu-button {
        top: 22px;
    }

    .header-container .block-search {
        grid-area: 2 / 2 / 3 / 3;
        align-self: center;
    }

    .header-container .hc-logo-container {
        text-align: right;
    }

    .hc-actions-container {
        grid-area: 2 / 3 / 3 / 4;
    }

    .hca-top-links {
        grid-area: 1 / 1 / 2 / 5;
    }

    .usp-cont {
        top: 115px;
    }
}

@media (max-width: 767px) {
    .header-container.menu-open~.nav-sections #menu-button {
        width: 28px;
        height: 28px;
        right: 24px;
    }

    .header-container.menu-open~.nav-sections #menu-button span {
        width: 38px;
        margin: 0;
    }

    .header-container.menu-open~.nav-sections #menu-button span:last-child {
        transform: translateX(-5px) translateY(-3px) rotate(45deg);
    }

    .header-container.menu-open~.nav-sections #menu-button span:nth-child(2) {
        transform: translateX(-5px) translateY(0px) rotate(-45deg);
    }

    .header-container.menu-open~.nav-sections #menu-button {
        top: 28px;
    }

    .header-container.menu-open .block-search .block-content .minisearch {
        position: absolute;
        top: 24px;
        left: 24px;
        width: calc(100% - 104px);
    }

    .header-container.menu-open #search {}

    .header-container.menu-open~.nav-sections .main-navigation {
        top: 84px;
    }

    .header-container.menu-open #search_autocomplete {
        top: 36px;
    }

    li.menu-expand::before {
        right: 24px;
    }
}

@media (min-width:768px) {

    .header-container {
        grid-template-columns: 134px 1fr 134px;
        height: 122px;
    }

    .header-sticky .header-container {
        height: 68px;
        box-shadow: none;
    }

    .hca-top-links {
        position: static;
        grid-area: 1 / 1 / 2 / 5;
    }

    .logo img.max,
    .print-head .logo {
        max-width: 108px;
        width: 108px;
        min-height: 53px;
    }

    .logo img.min {
        max-width: 22px;
        width: 22px;
        max-height: 32px;
        margin: 0 auto;
    }

    .header-container .hc-logo-container {
        min-width: auto;
        margin: 16px 0 16px 24px
    }

    .header-container .hc-actions-container {
        grid-area: 2 / 3 / 3 / 4;
        margin-right: 24px;
    }

    .header-container .block-search {
        grid-area: 2 / 2 / 3 / 3;
    }

    .header-container .block-search .block-content .minisearch {
        width: 64.4%;
        max-width: 513px;
        margin: 0 auto;
    }

    .header-container .block-content .field.search {
        border: 0;
    }

    #search {
        display: block;
        margin: 0 auto;
    }

    #main_navigation {
        display: flex;
        margin-top: 0;
        padding: 0 calc(24px - 0.25em);
        box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -4px;
    }

    #main_navigation>li {
        flex-grow: 0 !important;
    }

    #main_navigation>li a {
        padding: 0 0 13px 0;
    }

    .main-menupoint>a {
        width: min-content;
        padding: 0 0.25em 10px;
        display: flex
    }

    #stepsandcoping>a {
        min-width: 70px;
    }

    #claddingwallingscreening>a {
        min-width: 95px;
    }

    #menu-button {
        display: none
    }

    .usp-cont {
        top: 171px;
    }

    .usp-cont.header-sticky {
        top: 117px;
    }
    .usp-cont ul {
        column-gap: 16px;
        width: fit-content;
        display: flex;
        column-gap: 16px;
    }

    .usp-cont ul li.active {
        flex-basis: auto;
        width: auto;
        height: auto;
        opacity: 1;
        display: flex;
        transition: none;
        border-right: 1px solid #fff;
        padding-right: 16px;
    }

    .usp-cont ul li.active~li.active {
        padding-right: 0;
        border-right: none;
    }

    .usp-cont ul li:last-child {
        border-right: 0 !important;
        padding-right: 0;
    }

    #main_navigation #menu_sale a {
        letter-spacing: 1.6px;
        text-transform: uppercase;
    }

    .header-sticky .header-container .hc-logo-container {
        margin: 16px 0 20px 18px;
    }

}

@media (min-width:1024px) {
    .usp-cont ul li {
        flex-basis: auto;
        padding-right: 16px;
        opacity: 1;
        display: flex;
        transition: none;
        width: auto;
        height: auto;
        border-right: 1px solid #fff;
    }

    .header-container .block-search {
        max-width: none;
    }

    #search {
        display: block;
        margin: 0 auto;
        font-size: 16px;
    }

    .main-menupoint>a {
        width: fit-content;
    }

    .usp-cont {
        top: 155px;
    }
    .usp-cont.header-sticky {
        top: 100px;
    }
}

@media (min-width:1280px) {
    .header-sticky.page-header {
        box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -4px;
        /*border-bottom: 1px solid #F2F1F2;*/
    }

    .header-container {
        grid-template-columns: 138px 82px 1fr 220px;
        grid-template-rows: 30px 91px;
        height: 126px;
    }

    .header-sticky .header-container {
        grid-template-rows: 0 68px;
        height: 68px;
    }

    .header-container .hc-logo-container {
        text-align: right;
        padding: 0;
        margin: 16px 0 19px 20px;
    }

    .header-sticky .header-container .hc-logo-container {
        margin: 16px 0 20px 13px;
    }

    .header-container .hc-actions-container {
        margin-right: 24px;
        justify-content: flex-end;
        grid-area: 2 / 4 / span 1 / span 1;
    }

    .header-container .block-search {
        grid-area: 2 / 3 / span 1 / span 1;
        margin: 0 auto;
    }

    .header-container .hc-actions-container .login,
    .header-container .hc-actions-container .logout {
        display: block;
    }

    body:not(.loggedin) .logout {
        display: none !important;
    }

    body.loggedin .login {
        display: none !important;
    }

    .logo img.max,
    .print-head .logo {
        max-width: 114px;
        width: 114px;
        min-height: 56px;
        margin: 0;
        padding: 0;
    }

    .logo img.min {
        max-width: 23px;
        width: 23px;
        max-height: 33px;
        margin: 0 auto;
    }

    #menu-button {
        display: none;
    }

    #main_navigation {
        display: flex;
        padding: 0;
        column-gap: 24px;
        justify-content: center;
    }

    .usp-cont {
        height: 42px;
    }

    .usp-cont ul li:nth-child(n+5) {
        display: block;
    }

    /*.usp-cont ul li:nth-child(4) { border-right: 1px solid #fff !important;}*/
    .usp-cont ul li:last-child {
        border-right: 0;
    }

    .header-container .block-content .field.search {
        border: 0;
    }

    .usp-cont ul {
        width: fit-content;
        column-gap: 32px;
    }

    .usp-cont ul li {
        padding-right: 32px;
        flex-basis: fit-content;
        white-space: nowrap;
    }
    .usp-cont {
        top: 159px;
    }
    .usp-cont.header-sticky {
        top: 100px;
    }
    .usp-cont ul li:not(:last-child).active{
        padding-right: 32px;
    }

}

@media (min-width:1600px) {

    .header-container {
        position: static;
        height: 121px;
        max-width: 1648px;
        margin: 0 auto;
        padding: 0 24px;
    }

    .header-container .hc-logo-container {
        margin: 16px 0 11px 0;
    }

    .header-sticky .header-container .hc-logo-container {
        margin: 16px 0 11px -13px;
    }

    .header-container .hc-actions-container {
        margin-right: 0;
    }

    .logo img.max,
    .print-head .logo {
        max-width: 129px;
        width: 129px;
        min-height: 64px;
    }

    .logo img.min {
        max-width: 27px;
        width: 27px;
        max-height: 36px;
        margin: 0 auto;
    }

    .page-header .hca-top-links {
        position: absolute !important;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
    }

    .page-header .hca-top-links {
        position: absolute !important;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
    }

    .page-header .hca-top-links ul {
        flex-basis: 1600px;
        margin-right: auto;
        margin-left: auto;
    }

    .usp-cont {
        top: 154px;
    }

    .usp-cont.header-sticky{
        top: 100px;
    }
    .page-header .hca-top-links li:last-child {
        margin-right: 0;
    }
}

/* end header 18/10/24 */
/* new footer 18/10/24*/
footer {
    max-width: 100%;
    padding: 38px 24px 32px 24px;
    background-color: #F2F1F2;
}

footer,
footer li,
footer a {
    font-size: 12px !important;
    font-family: var(--font-text-regular);
    letter-spacing: -0.06px !important;
    color: var(--color-emperor) !important;
}

.footer__cols h5 {
    font-size: 12px;
    text-transform: none;
    color: var(--color-emperor);
    letter-spacing: -0.06px;
    font-family: var(--font-text-regular);
    margin: 0 0 12px 0;
    justify-content: space-between
}

.footer__cols h5::after {
    content: '';
    background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/menu-pics/chevron-icon.svg');
    width: 9px;
    height: 8px;
    background-size: 9px 8px;
    transform: rotate(0deg)
}

.footer__cols h5.footer__cols-head--open::after {
    transform: rotate(180deg);
}

.footer__cols h5.nb {
    border-bottom: 0;
    margin-top: 64px;
}

.footer__cols h5.nb::after {
    display: none;
}

.footer__cols-group ul {
    width: fit-content;
    text-align: left;
}

.footer__cols-group ul li {
    margin-bottom: 4px;
}

.footer-columns {}

.footer-columns>div:first-child {
    display: flex;
    flex-direction: column;
}

/*.mt26 {margin-top: 26px;}*/
.footer-bottom {
    display: flex;
    border-top: 1px solid #CBC8C9;
    padding-top: 16px;
    align-items: center;
    row-gap: 28px;
    flex-wrap: wrap;
    margin-top: 42px;
}

.footer-bottom>div {
    display: flex;
    justify-content: space-between;
    flex-basis: 100%;
}

.footer-bottom>div>* {
    flex-basis: 50%;
}

.footer-bottom>div ul {
    display: flex;
    flex-direction: row;
    column-gap: 5px;
    justify-content: flex-end;
}

.footer-bottom>div ul li img {
    height: 18px;
}

.footer-h1 {
    flex-basis: 100%;
    color: #000;
    font-family: var(--font-text-medium);
    font-size: clamp(0.984rem, 1.225vw + 0.716rem, 1.5rem);
}

.footer-h1 span {
    font-size: 12px;
    vertical-align: super;
}

#mc_embed_signup {
    margin-bottom: 32px;
}

footer #mce-EMAIL,
footer #mce-EMAIL {
    min-width: auto;
}

footer #mce-EMAIL,
footer #mce-EMAIL::placeholder {
    font-size: 12px;
    color: var(--color-emperor);
    letter-spacing: -0.06px;
    font-family: var(--font-text-regular);
    border-radius: 0;
}

footer #mc-embedded-subscribe {
    background-color: var(--color-tangerine);
    text-transform: none;
    font-family: var(--font-text-regular);
    font-size: 16px;
    border-radius: 0;
    color: #fff;
    border: 0;
    letter-spacing: -0.08px;
    background-image: url(https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/chevron-right-white.svg);
    background-size: 10px 11px;
    background-repeat: no-repeat;
    background-position: calc(100% - 11px) 50%;
    padding: 0 32px 0 16px
}

.ls-footer-trustpilot {
    margin-bottom: 32px;
}

.ls-footer__payments {
    display: inline-block;
}

.ls-footer__payments ul {
    display: flex;
    justify-items: start;
    justify-content: space-between;
    width: 100%;
}

.ls-footer__payments ul li img {
    max-height: 14px;
    max-width: 100%
}

body.catalog-product-view footer {
    margin-top: 38px;
}

@media (min-width: 768px) {
    .footer-bottom>div ul {
        column-gap: 11px
    }

    .footer-bottom>div ul li img {
        height: 22px;
        max-height: 22px;
    }

    .ls-footer__payments ul {
        column-gap: 18px;
    }

    .ls-footer__payments ul li img {
        max-height: 20px;
        height: 20px;
    }
}

@media (min-width: 1280px) {
    footer {
        padding: 38px 24px 80px 24px;
    }

    footer,
    footer li,
    footer a {
        font-size: 12px !important;
        font-family: var(--font-text-regular);
        letter-spacing: -0.06px !important;
        color: var(--color-emperor) !important;
    }

    .footer__cols h5 {
        text-transform: none;
        color: #000;
        letter-spacing: -0.06px;
        font-family: var(--font-text-medium);
        margin: 0 0 12px 0;
        padding-bottom: 0;
    }

    .footer__cols h5::after {
        display: none;
    }

    .footer__cols h5.nb {
        border-bottom: 0;
        margin-top: 0;
    }

    .footer__cols-group ul li {
        margin-bottom: 6px;
    }

    .footer-columns {
        grid-template-columns: 535px 1fr 488px;
        display: grid;
    }

    .footer-columns>div:first-child {
        flex-direction: row;
        justify-content: space-between;
    }

    .footer-columns>div:first-child>div:nth-child(2) ul,
    .footer-columns>div:first-child>div:nth-child(2) ul li:last-child,
    .footer-columns>div:first-child>div:nth-child(2) .footer__cols-group {
        margin-bottom: 0
    }

    .footer-columns>div:last-child {
        flex-direction: column;
        justify-content: space-between;
        display: flex;
    }

    #mc_embed_signup,
    .ls-footer-trustpilot {
        margin-bottom: 0;
    }

    .mt26 {
        margin: 26px 0 6px 0 !important;
    ;
    }

    .mt0 {
        margin: 0 !important;
    }

    .footer__cols-group ul {
        width: fit-content
    }

    .footer-bottom {
        display: grid;
        grid-template-columns: 1fr 488px;
        border-top: 1px solid #CBC8C9;
        padding-top: 32px;
        align-items: center;
        margin-top: 64px;
    }

    .footer-bottom>div {
        display: flex;
        justify-content: space-between;
    }

    .footer-bottom>div ul {
        display: flex;
        flex-direction: row;
        column-gap: 24px;
    }

    .footer-bottom>div ul li img {
        height: 21px;
    }

    .footer-h1 {
        font-size: 23px;
    }

    .footer-h1 span {
        font-size: 12px;
        vertical-align: super;
        font-family: var(--font-text-regular);
    }

    #mc_embed_signup {
        margin-bottom: 53px;
    }

    footer #mce-EMAIL,
    footer #mce-EMAIL::placeholder {
        font-size: 12px;
        color: var(--color-emperor);
        letter-spacing: -0.06px;
        font-family: var(--font-text-regular);
        border-radius: 0;
    }

    footer #mc-embedded-subscribe {
        background-color: var(--color-tangerine);
        text-transform: none;
        font-family: var(--font-text-regular);
        font-size: 16px;
        border-radius: 0;
        color: #fff;
        border: 0;
        letter-spacing: -0.08px;
    }

    .ls-footer-trustpilot {
        margin-bottom: 53px;
    }

    .ls-footer__payments {
        display: inline-block;
    }

    .ls-footer__payments ul {
        column-gap: 24px;
        justify-content: flex-start;
    }

    .ls-footer__payments ul li img {
        max-height: 20px;
    }

    body.catalog-product-view footer {
        margin-top: 64px;
    }
}

@media (min-width: 1600px) {
    .footer-columns {
        max-width: 1600px;
        margin-right: auto;
        margin-left: auto;
        display: grid;
        grid-template-columns: 809px 1fr 648px;
    }

    .footer-columns>div:first-child {
        flex-direction: row;
        justify-content: space-between;
    }

    .footer-bottom {
        grid-template-columns: 1fr 648px;
        max-width: 1600px;
        margin-right: auto;
        margin-left: auto;
    }

    .footer-bottom>div ul li img {
        height: 28px;
    }

    .footer-h1 {
        font-size: 23px;
    }
}

/* end new footer 18/10/24 */
/*Login modal*/
div.login-popup {
    border-radius: 0;
    max-width: 380px;
    padding: 32px;
    cursor: auto !important;
;
}

div.login-popup .lp-logo {
    width: 205px;
    min-height: 102px;
    margin: 30px auto 64px auto;
}

div.login-popup input.input-text[type='password']:focus,
div.login-popup input.input-text[type='email']:focus {
    border: 1px solid #D4D5D5 !important;
    background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/pixel-tangerine.png');
    background-size: 4px 100%;
    background-repeat: repeat-y;
}

div.login-popup input.input-text[type='password'],
div.login-popup input.input-text[type='email'] {
    border: 1px solid #D4D5D5 !important;
    background-color: #F9F8F8;
    height: 36px;
    padding: 0 0 0 18px;
    border-radius: 0;
    color: #000;
    font-size: 16px;
    letter-spacing: 0.16px;
    margin: 0 0 32px 0;
    width: 100%;
}

div.login-popup .button {
    margin: 0 0 16px 0;
    background-color: #585255;
    border: 1px solid #585255;
    letter-spacing: -0.08px;
    border-radius: 0;
    height: 40px;
    font-size: 16px;
    padding: 0;
    text-transform: capitalize;
    color: #fff;
}

div.login-popup .button:hover {
    background-color: #7D7579;
}

div.login-popup .button span::after,
.login-popup a.button span::after {
    content: '';
    display: inline-block;
    width: 10px;
    height: 11px;
    background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/chevron-right-orange.svg');
    background-size: 10px 11px;
    margin-left: 8px;
}

.login-popup-forgot {
    color: var(--color-tangerine) !important;
;
    padding: 0;
    margin: 0;
    font-size: 12px;
    letter-spacing: -0.06px;
    letter-spacing: -0.06px;
}

.login-popup .register p {
    margin: 90px 0 0 0;
    color: #555;
}

.login-popup a.button {
    border: 1px solid #585255;
    background-color: #fff;
    color: #585255;
    font-size: 16px;
    margin: 16px 0 0;
}

.login-popup a.button:hover {
    background-color: #F2F1F2;
    color: #585255;
}

.login-popup .lp-msg {
    margin-bottom: 16px;
    font-size: 12px;
}

.login-popup button.fancybox-close-small {
    right: 32px;
    top: 32px;
    padding: 0;
    width: 16px;
    height: 16px;
}

.login-popup button.fancybox-close-small img {
    width: 16px;
    height: 16px;
}

/* end Login modal*/